alxrocha

{
  "scripts": {
    // ...
    "db:migrate:up": "bun run -r dotenv/config ./src/lib/db/migrate latest",
    "db:migrate:down": "bun run -r dotenv/config ./src/lib/db/migrate down",
    "db:migrate:create": "bun run -r dotenv/config ./src/lib/db/migrate create initial",
    "db:generate:types": "bunx kysely-codegen --out-file=src/lib/db/schema/Database.ts",
  },
  "dependencies": {
    "kysely": "^0.27.3",

alxrocha

:root {
    --none: linear(0, 1);
    --power1-in: linear( 0, 0.0039, 0.0156, 0.0352, 0.0625, 0.0977, 0.1407, 0.1914, 0.2499, 0.3164, 0.3906 62.5%, 0.5625, 0.7656, 1 );
    --power1-out: linear( 0, 0.2342, 0.4374, 0.6093 37.49%, 0.6835, 0.7499, 0.8086, 0.8593, 0.9023, 0.9375, 0.9648, 0.9844, 0.9961, 1 );
    --power1-in-out: linear( 0, 0.0027, 0.0106 7.29%, 0.0425, 0.0957, 0.1701 29.16%, 0.2477, 0.3401 41.23%, 0.5982 55.18%, 0.7044 61.56%, 0.7987, 0.875 75%, 0.9297, 0.9687, 0.9922, 1 );
    --power2-in: linear( 0, 0.0014 11.11%, 0.0071 19.24%, 0.0188 26.6%, 0.037 33.33%, 0.0634 39.87%, 0.0978 46.07%, 0.1407 52.02%, 0.1925 57.74%, 0.2559 63.49%, 0.3295 69.07%, 0.4135 74.5%, 0.5083 79.81%, 0.6141 85%, 0.7312 90.09%, 1 );
    --power2-out: linear( 0, 0.2688 9.91%, 0.3859 15%, 0.4917 20.19%, 0.5865 25.5%, 0.6705 30.93%, 0.7441 36.51%, 0.8075 42.26%, 0.8593 47.98%, 0.9022 53.93%, 0.9366 60.13%, 0.963 66.67%, 0.9812 73.4%, 0.9929 80.76%, 0.9986 88.89%, 1 );
    --power2-in-out: linear( 0, 0.0036 9.62%, 0.0185 16.66

alxrocha

import {
  queryByLabelText,
  queryByRole,
  queryByText,
} from "@testing-library/dom";
import type { ByRoleOptions, Matcher } from "@testing-library/dom";

const roles = [
  "alert",
  "alertdialog",

alxrocha

import invariant from "tiny-invariant";

class AmalgoBox extends HTMLElement {
  get input() {
    return this.querySelector("input") as HTMLInputElement;
  }

  get button() {
    return this.querySelector("button") as HTMLButtonElement;
  }

alxrocha

/* Using a JavaScript proxy for a super low code REST client */
// via https://dev.to/dipsaus9/javascript-lets-create-aproxy-19hg
// also see https://towardsdatascience.com/why-to-use-javascript-proxy-5cdc69d943e3
// also see https://github.com/fastify/manifetch
// also see https://github.com/flash-oss/allserver
// and https://gist.github.com/v1vendi/75d5e5dad7a2d1ef3fcb48234e4528cb

const createApi = (url) => {
  return new Proxy({}, {
    get(target, key) {

alxrocha

Pure ESM package

The package linked to from here is now pure ESM. It cannot be require()'d from CommonJS.

This means you have the following choices:

1. Use ESM yourself. (preferred)
   Use import foo from 'foo' instead of const foo = require('foo') to import the package. You also need to put "type": "module" in your package.json and more. Follow the below guide.
2. If the package is used in an async context, you could use await import(…) from CommonJS instead of require(…).
3. Stay on the existing version of the package until you can move to ESM.

alxrocha

//
//  Prelude

//  A zero dependency, one file drop in for faster Typescript development with fewer bugs
//  through type safe, functional programming. Comments are inline with links to blog posts motiviating the use.

// alias for a function with airity 1
export type Fn<A, B> = (a: A) => B;

// alias for a function with airity 2

alxrocha

import * as React from "react";
import { useMousePosition } from "~/hooks/useMousePosition";

/** Component to cover the area between the mouse cursor and the sub-menu, to allow moving cursor to lower parts of sub-menu without the sub-menu disappearing. */
export function MouseSafeArea(props: { parentRef: React.RefObject<HTMLDivElement> }) {
  const { x = 0, y = 0, height: h = 0, width: w = 0 } = props.parentRef.current?.getBoundingClientRect() || {};
  const [mouseX, mouseY] = useMousePosition();
  const positions = { x, y, h, w, mouseX, mouseY };
  return (
    <div

alxrocha

const machine = Machine({
    id: "menu-button",
    initial: "unmounted",
    context: {
      button: null,
      menu: null,
      items: [],
      search: "",
      highlightIndex: -1
    },

alxrocha

import sync, { cancelSync } from "framesync";
import { useEffect } from "react";

/**
  The code inside useAnimationLoop is guaranteed to run once a frame
  before Framer Motion/Popmotion/Pose renders

  useAnimationLoop(({ delta, timestamp }) => {
     // do stuff
  })