efficient-shell 4.134.0 → 4.137.1

package/dist/chunk-RT6DSB5Y.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/forms/buttonStyles.ts","../src/forms/Button.tsx"],"names":["Button"],"mappings":";;;;AA0DA,IAAM,WAAA,GACJ,uKAAA;AAGF,IAAM,eAAA,GAAiD;AAAA,EACrD,OAAA,EAAS,6GAAA;AAAA,EACT,SAAA,EAAW,4HAAA;AAAA,EACX,KAAA,EAAO,mFAAA;AAAA,EACP,cAAA,EAAgB,wFAAA;AAAA,EAChB,MAAA,EAAQ,mHAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYR,IAAA,EAAM;AACR,CAAA;AAgBA,IAAM,KAAA,GAAoC;AAAA,EACxC,EAAA,EAAI,2BAAA;AAAA,EACJ,EAAA,EAAI,6BAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAKJ,EAAA,EAAI,2BAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMJ,UAAA,EAAY,6BAAA;AAAA,EACZ,OAAA,EAAS,2BAAA;AAAA;AAAA,EACT,UAAA,EAAY,yBAAA;AAAA;AAAA,EACZ,UAAA,EAAY;AAAA;AACd,CAAA;AAKA,IAAM,SAAA,GACJ,6IAAA;AAKF,IAAM,UAAA,GAAyC;AAAA,EAC7C,EAAA,EAAI,eAAA;AAAA,EACJ,EAAA,EAAI,iBAAA;AAAA,EACJ,EAAA,EAAI,eAAA;AAAA,EACJ,UAAA,EAAY,mBAAA;AAAA,EACZ,OAAA,EAAS,iBAAA;AAAA,EACT,UAAA,EAAY,eAAA;AAAA,EACZ,UAAA,EAAY;AACd,CAAA;AAWA,IAAM,MAAA,GAAqC;AAAA,EACzC,EAAA,EAAI,SAAA;AAAA,EACJ,EAAA,EAAI,SAAA;AAAA,EACJ,EAAA,EAAI,WAAA;AAAA,EACJ,UAAA,EAAY,WAAA;AAAA,EACZ,OAAA,EAAS,WAAA;AAAA,EACT,UAAA,EAAY,WAAA;AAAA,EACZ,UAAA,EAAY;AACd,CAAA;AAsEO,SAAS,aAAA,CAAc;AAAA,EAC5B,OAAA,GAAU,SAAA;AAAA,EACV,IAAA,GAAO,IAAA;AAAA,EACP,KAAA,GAAQ,KAAA;AAAA,EACR,SAAA,GAAY;AACd,CAAA,GAA0B,EAAC,EAAW;AACpC,EAAA,MAAM,OAAO,OAAA,KAAY,MAAA;AACzB,EAAA,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAML,OAAO,SAAA,GAAY,WAAA;AAAA,IACnB,gBAAgB,OAAO,CAAA;AAAA,IACvB,IAAA,GAAO,UAAA,CAAW,IAAI,CAAA,GAAI,MAAM,IAAI,CAAA;AAAA,IACpC,QAAQ,QAAA,GAAW,EAAA;AAAA,IACnB;AAAA,GACF,CAAE,MAAA,CAAO,OAAO,CAAA,CAAE,KAAK,GAAG,CAAA;AAC5B;AA4BO,SAAS,iBAAA,CAAkB;AAAA,EAChC,OAAA,GAAU,OAAA;AAAA,EACV,IAAA,GAAO,IAAA;AAAA,EACP,SAAA,GAAY;AACd,CAAA,GAA8B,EAAC,EAAW;AACxC,EAAA,OAAO,CAAC,WAAA,EAAa,eAAA,CAAgB,OAAO,GAAG,MAAA,CAAO,IAAI,CAAA,EAAG,cAAA,EAAgB,SAAS,CAAA,CACnF,MAAA,CAAO,OAAO,CAAA,CACd,KAAK,GAAG,CAAA;AACb;AC3OA,SAAS,OAAA,GAAU;AACjB,EAAA,uBACE,IAAA,CAAC,SAAI,SAAA,EAAU,0BAAA,EAA2B,SAAQ,WAAA,EAAY,IAAA,EAAK,MAAA,EAAO,aAAA,EAAY,MAAA,EACpF,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,QAAA,EAAA,EAAO,SAAA,EAAU,YAAA,EAAa,EAAA,EAAG,IAAA,EAAK,EAAA,EAAG,IAAA,EAAK,CAAA,EAAE,IAAA,EAAK,MAAA,EAAO,cAAA,EAAe,WAAA,EAAY,GAAA,EAAI,CAAA;AAAA,wBAC3F,MAAA,EAAA,EAAK,SAAA,EAAU,cAAa,IAAA,EAAK,cAAA,EAAe,GAAE,qCAAA,EAAsC;AAAA,GAAA,EAC3F,CAAA;AAEJ;AAEA,IAAM,MAAA,GAAS,UAAA,CAA2C,SAASA,OAAAA,CACjE;AAAA,EAAE,OAAA,GAAU,SAAA;AAAA,EAAW,IAAA,GAAO,IAAA;AAAA,EAAM,OAAA,GAAU,KAAA;AAAA,EAAO,QAAA;AAAA,EAAU,SAAA;AAAA,EAAW,KAAA,GAAQ,KAAA;AAAA,EAChF,QAAA;AAAA,EAAU,IAAA,GAAO,QAAA;AAAA,EAAU,QAAA;AAAA,EAAU,SAAA,GAAY,EAAA;AAAA,EAAI,cAAA;AAAA,EAAgB,GAAG;AAAK,CAAA,EAC/E,GAAA,EACA;AAGA,EAAA,MAAM,cAAc,KAAA,EAAM;AAC1B,EAAA,MAAM,aAAa,QAAA,IAAY,OAAA;AAC/B,EAAA,MAAM,UAAA,GAAa,UAAA,IAAc,cAAA,IAAkB,IAAA,IAAQ,cAAA,KAAmB,EAAA;AAC9E,EAAA,MAAM,QAAA,GAAW,aAAa,WAAA,GAAc,MAAA;AAE5C,EAAA,MAAM,MAAA,mBACJ,IAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,IAAA;AAAA,MACA,QAAA,EAAU,UAAA;AAAA,MACV,aAAW,OAAA,IAAW,MAAA;AAAA,MACtB,kBAAA,EAAkB,QAAA;AAAA,MAIlB,WAAW,aAAA,CAAc,EAAE,SAAS,IAAA,EAAM,KAAA,EAAO,WAAW,CAAA;AAAA,MAC3D,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,OAAA,mBAAU,GAAA,CAAC,WAAQ,CAAA,GAAK,QAAA;AAAA,QACxB,QAAA;AAAA,QACA,CAAC,OAAA,IAAW;AAAA;AAAA;AAAA,GACf;AAKF,EAAA,IAAI,CAAC,YAAY,OAAO,MAAA;AAExB,EAAA,uBACE,IAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAW,KAAA,GAAQ,+BAA+B,wCAAA,EACrD,QAAA,EAAA;AAAA,IAAA,MAAA;AAAA,wBACA,MAAA,EAAA,EAAK,EAAA,EAAI,QAAA,EAAU,SAAA,EAAU,wBAAwB,QAAA,EAAA,cAAA,EAAe;AAAA,GAAA,EACvE,CAAA;AAEJ,CAAC,CAAA;AAED,IAAO,cAAA,GAAQ","file":"chunk-RT6DSB5Y.js","sourcesContent":["/**\n * Button styling — the class strings `Button` and `IconButton` wear, and the\n * two public functions that compose them, `buttonClasses` and\n * `iconButtonClasses`. Both components call those functions, so the look a host\n * borrows and the look the kit renders are one string, not two that agree.\n *\n * A module of its own, beside forms/styles.ts and for the reason that one\n * exists: the look is a value a host needs WITHOUT the component. A link drawn\n * as a button — \"Add a business\", \"View invoice\" — has to be an `<a>`, so it\n * can be middle-clicked, opened in a new tab and read off the status bar, and\n * `Button` can only render a `<button>`. Until these were exported, a host's\n * only way to that look was to copy the strings, and a copy is wrong from the\n * first release that touches the original.\n *\n * Named after `inputClasses`, which is the same idea for a text field. Not IN\n * forms/styles.ts: that module is the input look, its strings are pinned as\n * contract by `tests/touchPrimitives.test.tsx`, and the button's types and\n * ladders would double it to say something else. And React-free, like that\n * one: nothing here renders, so nothing here imports React. That keeps the door\n * open to re-exporting both from an entry without `\"use client\"` — the only way\n * a server component could ever CALL them. Through `efficient-shell/ui` they are\n * client references like every kit function (README → \"Server rendering\").\n */\n\n/**\n * `ghost-danger` is a destructive action sitting in a row of ordinary ones —\n * Clear, Discard, Remove — where solid `danger` would be wrong. Two solid\n * shouting buttons on one screen means neither is read, so the destructive one\n * borrows `ghost`'s weight and keeps only the colour. The colour is the point:\n * it lets someone tell what the button costs WITHOUT reading it, which under\n * time pressure is what actually happens.\n */\nexport type ButtonVariant = 'primary' | 'secondary' | 'ghost' | 'ghost-danger' | 'danger' | 'link';\n/**\n * `sm`/`md`/`lg` are the desktop scale. The `touch-*` rungs are for a finger on\n * glass — a till, a warehouse tablet — and are a SEPARATE ladder on purpose:\n * a till's idea of \"medium\" is 56px, and naming it `md` would have made the\n * same word mean two sizes depending on which app you were reading.\n *\n * Nothing picks a touch size automatically. An app that wants them asks for\n * them, so a desktop portal cannot grow finger-sized buttons by accident.\n */\nexport type ButtonSize = 'sm' | 'md' | 'lg' | 'touch-sm' | 'touch' | 'touch-lg' | 'touch-xl';\n\n/**\n * Shared with `IconButton`'s composition below, which builds its own class\n * string rather than passing a square size through `buttonClasses`' `className`\n * — two competing padding utilities in one attribute resolve by\n * compiled-stylesheet order, not by the order they were written (the reasoning\n * in forms/styles.ts applies here identically).\n *\n * The PARTS stay module-private, and that is deliberate: the public way to the\n * look is the composed string. Composing is where the rules live — the `link`\n * variant does not override the box, it never receives it — and a host\n * assembling `BUTTON_BASE + BUTTON_VARIANTS.link + …` by hand would put the\n * box back. A host restyling the parts would also be a host the theme system\n * cannot reach; one wearing the whole string is reached like the kit is.\n */\nconst BUTTON_BASE =\n  'inline-flex items-center justify-center rounded-md font-medium transition-colors ' +\n  'rosh-focus-ring focus-visible:ring-2 disabled:cursor-not-allowed disabled:opacity-60';\n\nconst BUTTON_VARIANTS: Record<ButtonVariant, string> = {\n  primary: 'bg-blue-600 text-white shadow-sm hover:bg-blue-700 focus-visible:ring-[color:var(--rosh-focus-ring-strong)]',\n  secondary: 'border border-gray-300 bg-white text-gray-700 shadow-sm hover:bg-gray-50 focus-visible:ring-[color:var(--rosh-focus-ring)]',\n  ghost: 'text-gray-700 hover:bg-gray-100 focus-visible:ring-[color:var(--rosh-focus-ring)]',\n  'ghost-danger': 'text-red-600 hover:bg-red-50 focus-visible:ring-[color:var(--rosh-focus-ring-invalid)]',\n  danger: 'bg-red-600 text-white shadow-sm hover:bg-red-700 focus-visible:ring-[color:var(--rosh-focus-ring-invalid-strong)]',\n  /**\n   * A button that reads as a link: no box, no padding, underlined on hover.\n   * For an action that belongs in running text or beside a field — \"Forgot\n   * your password?\", \"Use a different address\" — where a boxed button would\n   * claim more of the page than the action deserves.\n   *\n   * `Button` with this variant is still a <button>. Anything that NAVIGATES\n   * should be an anchor, so it can be middle-clicked and read off the status\n   * bar; this is for actions that merely look quiet. An anchor that wants this\n   * look takes it from `buttonClasses({ variant: 'link' })`.\n   */\n  link: 'text-blue-600 underline-offset-4 hover:underline focus-visible:ring-[color:var(--rosh-focus-ring)]',\n};\n\n// A Record keyed by the union, not a ternary chain: adding a member without a\n// size here is then a compile error rather than a silent fall-through to the\n// default branch. `sm`/`md` are byte-for-byte what they have always been, and\n// `tests/touchPrimitives.test.tsx` pins them against a captured literal.\n//\n// Every rung is also asserted to be the same height as the IconButton rung of\n// the same name (`tests/buttonLinkAndLarge.test.tsx`) — pinning the two sides\n// separately is how `lg` first shipped 4px short of its square twin.\n//\n// The touch rungs carry an explicit `h-*` where the desktop pair uses `py-*`.\n// That is deliberate: a hit target has to be a guaranteed height, not a height\n// implied by the current font size. They are separate map entries and never\n// concatenated with each other, so no two competing utilities land in one class\n// attribute.\nconst SIZES: Record<ButtonSize, string> = {\n  sm: 'gap-1 px-2.5 py-1 text-xs',\n  md: 'gap-1.5 px-3 py-1.5 text-sm',\n  // `py-2.5`, not `py-2`: this rung has to come out 40px to match IconButton's\n  // `h-10`, which is the promise IconButton's docblock makes for every rung.\n  // `py-2` gives 36px (20px line box + 8px twice) and puts a 4px step between a\n  // Button and an IconButton sitting in the same row.\n  lg: 'gap-2 px-4 py-2.5 text-sm',\n  // 44px is the WCAG 2.5.5 floor, and a floor is not a comfortable size. Use it\n  // ONLY for chrome that sits outside the task — switching screens, ending a\n  // shift — and never on the path someone is actually working through. It\n  // exists so a dense toolbar has something legitimate to reach for instead of\n  // borrowing the desktop `sm`, which is half this height.\n  'touch-sm': 'gap-1.5 h-11 px-4 text-base',\n  'touch': 'gap-2 h-14 px-5 text-base',      // 56px — the comfortable default\n  'touch-lg': 'gap-2 h-16 px-6 text-lg',     // 64px — primary action on a page\n  'touch-xl': 'gap-3 h-20 px-8 text-2xl',    // 80px — keypad keys, tender\n};\n\n// Everything BUTTON_BASE has except the box: no rounding (there is nothing to\n// round) and no `justify-center` (a link sits in a line of text, it does not\n// centre itself in a shape).\nconst LINK_BASE =\n  'inline-flex items-center font-medium transition-colors ' +\n  'rosh-focus-ring focus-visible:ring-2 disabled:cursor-not-allowed disabled:opacity-60';\n\n// Only the gap and the text size survive from each rung — the padding is what\n// the link variant exists to shed.\nconst LINK_SIZES: Record<ButtonSize, string> = {\n  sm: 'gap-1 text-xs',\n  md: 'gap-1.5 text-sm',\n  lg: 'gap-2 text-sm',\n  'touch-sm': 'gap-1.5 text-base',\n  'touch': 'gap-2 text-base',\n  'touch-lg': 'gap-2 text-lg',\n  'touch-xl': 'gap-3 text-2xl',\n};\n\n/**\n * Square, and matching `Button`'s heights rung for rung: `sm` is 24px in both\n * (py-1 either side of a 16px line box), `md` 32px, and the touch rungs carry\n * the same explicit heights for the same reason — a hit target has to be a\n * guaranteed size, not one implied by the current font.\n *\n * A Record keyed by the union, so a new ButtonSize member without an entry here\n * is a compile error rather than a silent fall-through.\n */\nconst SQUARE: Record<ButtonSize, string> = {\n  sm: 'h-6 w-6',\n  md: 'h-8 w-8',\n  lg: 'h-10 w-10',\n  'touch-sm': 'h-11 w-11',\n  'touch': 'h-14 w-14',\n  'touch-lg': 'h-16 w-16',\n  'touch-xl': 'h-20 w-20',\n};\n\n/** What `buttonClasses` takes: `Button`'s look props, and nothing that behaves. */\nexport interface ButtonClassesOptions {\n  /** Defaults to `primary`, as `Button`'s does. */\n  variant?: ButtonVariant;\n  /** Defaults to `md`, as `Button`'s does. */\n  size?: ButtonSize;\n  /** Stretch to the full width of the container (`w-full`). */\n  block?: boolean;\n  /**\n   * Appended last, exactly as `Button` appends its `className`. For layout —\n   * a margin, `shrink-0` — never a second padding, colour or display: those\n   * compete with the string's own and resolve by compiled-stylesheet order.\n   */\n  className?: string;\n}\n\n/**\n * The class string `Button` puts on its `<button>` for the same inputs, with\n * the same defaults. `Button` renders through this function, so the two cannot\n * disagree; `tests/buttonClasses.test.tsx` holds them equal for every variant\n * and size.\n *\n * It is for an element that has to look like a button and cannot be one —\n * above all a link, a router's link included:\n *\n *   <Link href=\"/organisations/new\" className={buttonClasses({ variant: 'secondary' })}>\n *     Add a business\n *   </Link>\n *\n * A `<button>` gets some of its behaviour from being a button, and the string\n * cannot hand that to an `<a>`. What the anchor needs instead:\n *\n * - **Disabled is not an attribute of `<a>`.** The string's `disabled:`\n *   variants match `:disabled`, which an anchor never is: on an `<a>` they are\n *   inert — harmless, and no help. A link that cannot be followed should stop\n *   being one: drop the `href`, which leaves it neither focusable nor\n *   followable — and without a role, so give it `role=\"link\"` back with\n *   `aria-disabled=\"true\"`, and it is announced as a link that is unavailable\n *   rather than as plain text. Dim it with `opacity-60 cursor-not-allowed` in\n *   `className`, which compete with nothing here. A Next `<Link>` requires an `href`, so a\n *   disabled one is a bare `<a>` — or, simpler and better, a disabled `Button`,\n *   which does all of that and also takes `disabledReason`.\n * - **The cursor differs.** The string sets none (only the inert\n *   `disabled:cursor-not-allowed`). An `<a href>` shows the pointer from the\n *   browser's own stylesheet; a `<button>` shows whatever the host's preflight\n *   gives it, which under Tailwind v4 is the plain arrow. So a row with one of\n *   each shows two cursors. Settle it once, for both, in the host's base layer\n *   — `button:not(:disabled) { cursor: pointer }` is the line in Tailwind's\n *   own v4 upgrade guide — rather than per call, where it would drift.\n * - **Display is `inline-flex`, and must stay so.** An `<a>` is inline, and an\n *   inline box ignores `height` and takes no room for vertical padding: the\n *   string's `inline-flex` is what gives it the button's box, its touch-rung\n *   height and the gap between an icon and its label. Never pass another\n *   display utility (`flex`, `block`) in `className` — two in one attribute\n *   resolve by stylesheet order. For full width ask for `block: true`, which\n *   keeps `inline-flex` and adds `w-full`.\n * - **Without preflight, an `<a>` keeps its underline.** Tailwind's\n *   preflight makes an anchor inherit its text decoration; a host running the\n *   kit without it gets the browser's underline under every label, so add\n *   `no-underline` there.\n *\n * `loading`, `leftIcon`/`rightIcon` and `disabledReason` are `Button`'s alone.\n * Put an icon in as a child — the size's `gap-*` spaces it as the slots do.\n *\n * Through `efficient-shell/ui` this is a client reference, like every kit\n * function: call it in a `'use client'` module. A server component that\n * imports it receives a reference it cannot call.\n */\nexport function buttonClasses({\n  variant = 'primary',\n  size = 'md',\n  block = false,\n  className = '',\n}: ButtonClassesOptions = {}): string {\n  const link = variant === 'link';\n  return [\n    // `link` takes the base WITHOUT the box: no rounding, no padding from the\n    // size table. It cannot cancel those by overriding — two padding utilities\n    // in one class attribute resolve by compiled-stylesheet order, not by the\n    // order they were written — so it never receives them, and keeps only the\n    // size's gap and text size.\n    link ? LINK_BASE : BUTTON_BASE,\n    BUTTON_VARIANTS[variant],\n    link ? LINK_SIZES[size] : SIZES[size],\n    block ? 'w-full' : '',\n    className,\n  ].filter(Boolean).join(' ');\n}\n\n/** What `iconButtonClasses` takes: `IconButton`'s look props. */\nexport interface IconButtonClassesOptions {\n  /**\n   * Defaults to `ghost`, as `IconButton`'s does. `link` is excluded for the\n   * reason it is excluded there: it exists to shed the box, and a square icon\n   * button is nothing but the box.\n   */\n  variant?: Exclude<ButtonVariant, 'link'>;\n  /** Defaults to `md`. Square, and the same height as `buttonClasses`' rung. */\n  size?: ButtonSize;\n  /** Appended last; the same rule as `ButtonClassesOptions.className`. */\n  className?: string;\n}\n\n/**\n * The class string `IconButton` puts on its `<button>`, for an icon-only link\n * — a row's \"open\" arrow, an \"open in a new tab\" glyph. `IconButton` renders\n * through it, as `Button` does through `buttonClasses`.\n *\n * Everything `buttonClasses` says about an `<a>` holds here, and one thing\n * more, which is the reason `IconButton` is a component of its own: it REQUIRES\n * an `aria-label` in its props, so forgetting the name is a compile error. A\n * class string cannot require anything. An icon-only `<a>` without an\n * `aria-label` is a link with no name, read out as its URL or not at all — put\n * one on it.\n */\nexport function iconButtonClasses({\n  variant = 'ghost',\n  size = 'md',\n  className = '',\n}: IconButtonClassesOptions = {}): string {\n  return [BUTTON_BASE, BUTTON_VARIANTS[variant], SQUARE[size], 'shrink-0 p-0', className]\n    .filter(Boolean)\n    .join(' ');\n}\n","/**\n * Button — the kit's standard button. `primary` uses `bg-blue-600`, which the\n * theme system remaps to the active accent (and to a readable tone in dark\n * mode), so a primary button always follows the user's chosen accent.\n *\n * Controlled by the consumer like any native button (spread `onClick`, `type`,\n * `form`, …); the component only adds the look, a `loading` spinner state, and\n * optional icon slots.\n */\nimport { forwardRef, useId, type ButtonHTMLAttributes, type ReactNode } from 'react';\n\n// The look lives in ./buttonStyles, React-free, so a host can wear it on an\n// element that is not a <button> (`buttonClasses`). The types travel with it\n// and are re-exported here, where every import of them has always pointed.\nimport { buttonClasses, type ButtonSize, type ButtonVariant } from './buttonStyles';\n\nexport type { ButtonSize, ButtonVariant } from './buttonStyles';\n\nexport interface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'className'> {\n  variant?: ButtonVariant;\n  size?: ButtonSize;\n  /** Show a spinner and disable the button while an action is in flight. */\n  loading?: boolean;\n  leftIcon?: ReactNode;\n  rightIcon?: ReactNode;\n  /** Stretch to the full width of the container. */\n  block?: boolean;\n  className?: string;\n  /**\n   * Why this button is disabled, rendered as text BESIDE it — never as a\n   * `title` tooltip. A tooltip needs a hover, a touchscreen has no hover, and a\n   * cashier facing a dead button with no explanation calls a manager.\n   *\n   * Only rendered while the button is actually disabled (or loading); ignored\n   * otherwise, so it is safe to pass unconditionally. Note it changes the\n   * rendered shape: the button gains a wrapper element, which matters to a\n   * parent `flex gap-*` row or a `:first-child` selector.\n   */\n  disabledReason?: ReactNode;\n}\n\nfunction Spinner() {\n  return (\n    <svg className=\"h-3.5 w-3.5 animate-spin\" viewBox=\"0 0 24 24\" fill=\"none\" aria-hidden=\"true\">\n      <circle className=\"opacity-25\" cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" strokeWidth=\"4\" />\n      <path className=\"opacity-75\" fill=\"currentColor\" d=\"M4 12a8 8 0 018-8v4a4 4 0 00-4 4H4z\" />\n    </svg>\n  );\n}\n\nconst Button = forwardRef<HTMLButtonElement, ButtonProps>(function Button(\n  { variant = 'primary', size = 'md', loading = false, leftIcon, rightIcon, block = false,\n    disabled, type = 'button', children, className = '', disabledReason, ...rest },\n  ref,\n) {\n  // useId, not a module counter: a counter assigns different ids on the server\n  // and the client and breaks hydration. Called unconditionally — it is a hook.\n  const generatedId = useId();\n  const isDisabled = disabled || loading;\n  const showReason = isDisabled && disabledReason != null && disabledReason !== '';\n  const reasonId = showReason ? generatedId : undefined;\n\n  const button = (\n    <button\n      ref={ref}\n      type={type}\n      disabled={isDisabled}\n      aria-busy={loading || undefined}\n      aria-describedby={reasonId}\n      // The one place this component's look is decided — and the same call a\n      // host makes to put that look on a link. `loading`, `disabled` and\n      // `disabledReason` change the element and its wrapper, never the string.\n      className={buttonClasses({ variant, size, block, className })}\n      {...rest}\n    >\n      {loading ? <Spinner /> : leftIcon}\n      {children}\n      {!loading && rightIcon}\n    </button>\n  );\n\n  // No reason to show ⇒ the bare <button>, byte-identical to every release\n  // before this prop existed. Only the disabled-with-a-reason case wraps.\n  if (!showReason) return button;\n\n  return (\n    <span className={block ? 'flex w-full flex-col gap-1' : 'inline-flex flex-col items-start gap-1'}>\n      {button}\n      <span id={reasonId} className=\"text-xs text-red-600\">{disabledReason}</span>\n    </span>\n  );\n});\n\nexport default Button;\n"]}

package/dist/chunk-SHQM5CK3.js

@@ -1,549 +0,0 @@
-import { toast_default } from './chunk-4P44JXDS.js';
-import { useShellPrefs } from './chunk-2TPTHAKI.js';
-import { useSyncExternalStore, useCallback, useMemo } from 'react';
-
-// src/shell/pomodoroStore.ts
-var ALARM_OPTIONS = [
-  { id: "bell", label: "Bell", description: "Soft bell with one harmonic" },
-  { id: "chime", label: "Chime", description: "Two-note ascending chime" },
-  { id: "bowl", label: "Singing Bowl", description: "Long-decay meditation tone" },
-  { id: "wind-chimes", label: "Wind Chimes", description: "Four soft tones in succession" },
-  { id: "off", label: "Off (silent)", description: "No sound \u2014 only desktop notification" }
-];
-var FOCUS_SOUND_OPTIONS = [
-  { id: "none", label: "None" },
-  { id: "tick-fast", label: "Ticking Fast" },
-  { id: "tick-slow", label: "Ticking Slow" },
-  { id: "rain", label: "Rain" },
-  { id: "fireplace", label: "Fireplace" },
-  { id: "white", label: "White Noise" },
-  { id: "pink", label: "Pink Noise" },
-  { id: "brown", label: "Brown Noise" }
-];
-var todayKey = () => `pomodoro-${(/* @__PURE__ */ new Date()).toISOString().slice(0, 10)}`;
-var loadCount = () => {
-  try {
-    return parseInt(localStorage.getItem(todayKey()) || "0", 10) || 0;
-  } catch {
-    return 0;
-  }
-};
-var saveCount = (n) => {
-  try {
-    localStorage.setItem(todayKey(), String(n));
-  } catch {
-  }
-};
-var _durations = { focus: 25 * 60, short: 5 * 60, long: 15 * 60 };
-var _alarm = "bell";
-var _alarmVolume = 100;
-var _alarmRepeat = 1;
-var _focusSoundType = "none";
-var _focusVolume = 50;
-var _behaviour = { autoStartBreaks: false, autoStartPomodoros: false, longBreakInterval: 4 };
-var _state = {
-  running: false,
-  remaining: _durations.focus,
-  mode: "focus",
-  total: _durations.focus,
-  streak: 0,
-  count: typeof localStorage !== "undefined" ? loadCount() : 0
-};
-var _intervalId = null;
-var _listeners = /* @__PURE__ */ new Set();
-var _notify = () => _listeners.forEach((l) => l());
-var _set = (s) => {
-  _state = { ..._state, ...s };
-  _notify();
-};
-function getPomoSnapshot() {
-  return _state;
-}
-function subscribePomo(l) {
-  _listeners.add(l);
-  return () => {
-    _listeners.delete(l);
-  };
-}
-function setPomoDurations(d) {
-  _durations = d;
-  if (!_state.running && _state.remaining === _state.total) {
-    _set({ remaining: d[_state.mode], total: d[_state.mode] });
-  }
-}
-function setPomoAlarm(a) {
-  _alarm = a;
-}
-function setPomoAlarmConfig(volume, repeat) {
-  _alarmVolume = Math.max(0, Math.min(100, Math.round(volume)));
-  _alarmRepeat = Math.max(1, Math.min(5, Math.round(repeat)));
-}
-function setPomoBehaviour(b) {
-  _behaviour = {
-    autoStartBreaks: !!b.autoStartBreaks,
-    autoStartPomodoros: !!b.autoStartPomodoros,
-    longBreakInterval: Math.max(1, Math.min(20, Math.round(b.longBreakInterval || 4)))
-  };
-}
-function setPomoFocusSound(type, volume) {
-  _focusSoundType = type;
-  _focusVolume = Math.max(0, Math.min(100, Math.round(volume)));
-  if (_state.running && _state.mode === "focus") {
-    stopFocusAudio();
-    startFocusAudio();
-  } else if (type === "none" || _focusVolume === 0) {
-    stopFocusAudio();
-  }
-}
-function pomoStart() {
-  if (_state.running) return;
-  _set({ running: true });
-  _intervalId = setInterval(_tick, 1e3);
-  if (_state.mode === "focus") startFocusAudio();
-}
-function pomoPause() {
-  if (!_state.running && _intervalId === null) return;
-  if (_intervalId !== null) {
-    clearInterval(_intervalId);
-    _intervalId = null;
-  }
-  _set({ running: false });
-  stopFocusAudio();
-}
-function pomoSwitchMode(m) {
-  pomoPause();
-  _set({ mode: m, remaining: _durations[m], total: _durations[m] });
-}
-function _tick() {
-  if (_state.remaining <= 1) {
-    _onSessionEnd();
-    return;
-  }
-  _set({ remaining: _state.remaining - 1 });
-}
-function _onSessionEnd() {
-  if (_intervalId !== null) {
-    clearInterval(_intervalId);
-    _intervalId = null;
-  }
-  stopFocusAudio();
-  playAlarm(_alarm, { volume: _alarmVolume, repeat: _alarmRepeat });
-  const justFinishedFocus = _state.mode === "focus";
-  const headline = justFinishedFocus ? "Pomodoro complete \u2014 time for a break! \u{1F345}" : "Break's over \u2014 back to work!";
-  if (typeof Notification !== "undefined" && Notification.permission === "granted") {
-    try {
-      new Notification(headline);
-    } catch {
-    }
-  }
-  try {
-    toast_default.info(headline);
-  } catch {
-  }
-  if (_state.mode === "focus") {
-    const nextStreak = _state.streak + 1;
-    const newCount = _state.count + 1;
-    saveCount(newCount);
-    const nextMode = nextStreak % _behaviour.longBreakInterval === 0 ? "long" : "short";
-    _set({
-      running: false,
-      streak: nextStreak,
-      count: newCount,
-      mode: nextMode,
-      remaining: _durations[nextMode],
-      total: _durations[nextMode]
-    });
-    if (_behaviour.autoStartBreaks) setTimeout(() => pomoStart(), 50);
-  } else {
-    _set({
-      running: false,
-      mode: "focus",
-      remaining: _durations.focus,
-      total: _durations.focus
-    });
-    if (_behaviour.autoStartPomodoros) setTimeout(() => pomoStart(), 50);
-  }
-}
-function playAlarm(kind = _alarm, opts = {}) {
-  if (kind === "off") return;
-  const volScale = Math.max(0, Math.min(100, opts.volume ?? 100)) / 100;
-  if (volScale === 0) return;
-  const repeat = Math.max(1, Math.min(5, opts.repeat ?? 1));
-  for (let i = 0; i < repeat; i++) {
-    setTimeout(() => _playAlarmOnce(kind, volScale), i * 2500);
-  }
-}
-function _playAlarmOnce(kind, volScale) {
-  try {
-    const Ctor = window.AudioContext || window.webkitAudioContext;
-    if (!Ctor) return;
-    const ctx = new Ctor();
-    const playNote = (freq, start, duration, vol = 0.22, type = "sine") => {
-      const osc = ctx.createOscillator();
-      const gain = ctx.createGain();
-      osc.connect(gain);
-      gain.connect(ctx.destination);
-      osc.type = type;
-      osc.frequency.value = freq;
-      const t0 = ctx.currentTime + start;
-      gain.gain.setValueAtTime(0, t0);
-      gain.gain.linearRampToValueAtTime(vol * volScale, t0 + 0.03);
-      gain.gain.exponentialRampToValueAtTime(1e-4, t0 + duration);
-      osc.start(t0);
-      osc.stop(t0 + duration);
-    };
-    let totalDuration = 2;
-    if (kind === "bell") {
-      playNote(880, 0, 1.8);
-      playNote(1320, 0, 1.4, 0.1);
-      totalDuration = 2;
-    } else if (kind === "chime") {
-      playNote(659.25, 0, 0.7);
-      playNote(880, 0.2, 1.3);
-      totalDuration = 2;
-    } else if (kind === "bowl") {
-      playNote(440, 0, 3.4, 0.22);
-      playNote(660, 0, 3, 0.08);
-      playNote(880, 0.05, 2.8, 0.05);
-      totalDuration = 4;
-    } else if (kind === "wind-chimes") {
-      playNote(1175, 0, 1.1, 0.16);
-      playNote(880, 0.15, 1.3, 0.16);
-      playNote(1318, 0.3, 1.5, 0.16);
-      playNote(1047, 0.5, 1.7, 0.13);
-      totalDuration = 3;
-    }
-    setTimeout(() => {
-      try {
-        ctx.close();
-      } catch {
-      }
-    }, totalDuration * 1e3 + 500);
-  } catch {
-  }
-}
-var _focusAudio = null;
-var FOCUS_VOL_CAP = {
-  none: 0,
-  white: 0.3,
-  pink: 0.3,
-  brown: 0.3,
-  "tick-fast": 0.6,
-  "tick-slow": 0.6,
-  rain: 0.4,
-  fireplace: 0.5
-};
-function _makeNoiseBuffer(ctx, type) {
-  if (type === "none") return null;
-  const sr = ctx.sampleRate;
-  const dur = type === "white" || type === "pink" || type === "brown" ? 2 : 4;
-  const len = sr * dur;
-  const buffer = ctx.createBuffer(1, len, sr);
-  const data = buffer.getChannelData(0);
-  if (type === "white") {
-    for (let i = 0; i < len; i++) data[i] = (Math.random() * 2 - 1) * 0.5;
-  } else if (type === "pink") {
-    let b0 = 0, b1 = 0, b2 = 0, b3 = 0, b4 = 0, b5 = 0, b6 = 0;
-    for (let i = 0; i < len; i++) {
-      const w = Math.random() * 2 - 1;
-      b0 = 0.99886 * b0 + w * 0.0555179;
-      b1 = 0.99332 * b1 + w * 0.0750759;
-      b2 = 0.969 * b2 + w * 0.153852;
-      b3 = 0.8665 * b3 + w * 0.3104856;
-      b4 = 0.55 * b4 + w * 0.5329522;
-      b5 = -0.7616 * b5 - w * 0.016898;
-      data[i] = (b0 + b1 + b2 + b3 + b4 + b5 + b6 + w * 0.5362) * 0.11 * 0.55;
-      b6 = w * 0.115926;
-    }
-  } else if (type === "brown") {
-    let last = 0;
-    for (let i = 0; i < len; i++) {
-      const w = Math.random() * 2 - 1;
-      last = (last + 0.02 * w) / 1.02;
-      data[i] = last * 3.5 * 0.5;
-    }
-  } else if (type === "tick-fast" || type === "tick-slow") {
-    const intervalSec = type === "tick-fast" ? 0.5 : 1;
-    const tickSamples = Math.floor(sr * 0.045);
-    for (let t = 0; t < dur; t += intervalSec) {
-      const start = Math.floor(t * sr);
-      for (let i = 0; i < tickSamples && start + i < len; i++) {
-        const env = Math.exp(-i / sr * 180);
-        const noise = Math.random() * 2 - 1;
-        const tone = Math.sin(2 * Math.PI * 1100 * (i / sr));
-        data[start + i] += (noise * 0.7 + tone * 0.25) * env * 0.55;
-      }
-    }
-  } else if (type === "rain") {
-    let prev = 0;
-    for (let i = 0; i < len; i++) {
-      const w = Math.random() * 2 - 1;
-      const filtered = w - prev * 0.93;
-      prev = w;
-      const gust = 0.7 + 0.3 * Math.sin(i / sr * 2 * Math.PI * 0.25);
-      data[i] = filtered * gust * 0.4;
-    }
-  } else if (type === "fireplace") {
-    let last = 0;
-    for (let i = 0; i < len; i++) {
-      const w = Math.random() * 2 - 1;
-      last = (last + 0.02 * w) / 1.02;
-      data[i] = last * 1.6;
-    }
-    let next = Math.random() * 0.4 * sr;
-    while (next < len) {
-      const popLen = Math.floor((0.012 + Math.random() * 0.05) * sr);
-      const popVol = 0.35 + Math.random() * 0.45;
-      const popPos = Math.floor(next);
-      for (let i = 0; i < popLen && popPos + i < len; i++) {
-        const env = Math.exp(-i / sr * 90);
-        data[popPos + i] += (Math.random() * 2 - 1) * env * popVol;
-      }
-      next += (0.08 + Math.random() * 0.62) * sr;
-    }
-  }
-  return buffer;
-}
-function startFocusAudio() {
-  if (_focusAudio) return;
-  if (_focusSoundType === "none" || _focusVolume === 0) return;
-  try {
-    const Ctor = window.AudioContext || window.webkitAudioContext;
-    if (!Ctor) return;
-    const ctx = new Ctor();
-    const buffer = _makeNoiseBuffer(ctx, _focusSoundType);
-    if (!buffer) {
-      try {
-        ctx.close();
-      } catch {
-      }
-      return;
-    }
-    const src = ctx.createBufferSource();
-    src.buffer = buffer;
-    src.loop = true;
-    const gain = ctx.createGain();
-    gain.gain.value = _focusVolume / 100 * FOCUS_VOL_CAP[_focusSoundType];
-    src.connect(gain).connect(ctx.destination);
-    src.start();
-    _focusAudio = { ctx, src, gain };
-  } catch {
-  }
-}
-function stopFocusAudio() {
-  if (!_focusAudio) return;
-  try {
-    _focusAudio.src.stop();
-  } catch {
-  }
-  try {
-    _focusAudio.ctx.close();
-  } catch {
-  }
-  _focusAudio = null;
-}
-function previewFocusSound(type, volume) {
-  if (type === "none" || volume === 0) return;
-  try {
-    const Ctor = window.AudioContext || window.webkitAudioContext;
-    if (!Ctor) return;
-    const ctx = new Ctor();
-    const buffer = _makeNoiseBuffer(ctx, type);
-    if (!buffer) {
-      try {
-        ctx.close();
-      } catch {
-      }
-      return;
-    }
-    const src = ctx.createBufferSource();
-    src.buffer = buffer;
-    src.loop = true;
-    const gain = ctx.createGain();
-    gain.gain.value = volume / 100 * FOCUS_VOL_CAP[type];
-    src.connect(gain).connect(ctx.destination);
-    src.start();
-    setTimeout(() => {
-      try {
-        src.stop();
-      } catch {
-      }
-      try {
-        ctx.close();
-      } catch {
-      }
-    }, 3e3);
-  } catch {
-  }
-}
-var POMODORO_LEGACY_KEY = "pomodoro_tasks";
-var POMODORO_LEGACY_MIGRATED_FLAG = "pomodoro_tasks_migrated";
-function uid() {
-  return Math.random().toString(36).slice(2, 11);
-}
-function nowIso() {
-  return (/* @__PURE__ */ new Date()).toISOString();
-}
-var provider = null;
-var cache = [];
-var loaded = false;
-var inflight = null;
-var listeners = /* @__PURE__ */ new Set();
-function emit() {
-  for (const l of listeners) l();
-}
-function setCache(next) {
-  cache = next;
-  emit();
-}
-function refresh() {
-  const p = provider;
-  if (!p) {
-    cache = [];
-    loaded = true;
-    emit();
-    return Promise.resolve();
-  }
-  inflight = p.list().then((rows) => {
-    if (provider === p) {
-      cache = rows;
-      loaded = true;
-      emit();
-    }
-  }).catch(() => {
-    if (provider === p) {
-      loaded = true;
-      emit();
-    }
-  }).finally(() => {
-    inflight = null;
-  });
-  return inflight;
-}
-function setShellTodoProvider(next) {
-  provider = next;
-  cache = [];
-  loaded = false;
-  if (next) refresh();
-  else emit();
-}
-function hasShellTodoProvider() {
-  return provider !== null;
-}
-function subscribe(cb) {
-  listeners.add(cb);
-  if (provider && !loaded && !inflight) refresh();
-  return () => {
-    listeners.delete(cb);
-  };
-}
-function getSnapshot() {
-  return cache;
-}
-function usePrefsTodoTasks() {
-  const { prefs, save } = useShellPrefs();
-  const tasks = useMemo(() => {
-    const raw = prefs.todo_tasks;
-    return Array.isArray(raw) ? raw : [];
-  }, [prefs.todo_tasks]);
-  const writeTasks = useCallback((next) => {
-    save({ todo_tasks: next });
-  }, [save]);
-  const addTask = useCallback((input) => {
-    const id = uid();
-    const ts = nowIso();
-    const task = { done: false, ...input, name: input.name.trim(), id, createdAt: ts, updatedAt: ts };
-    writeTasks([...tasks, task]);
-    return id;
-  }, [tasks, writeTasks]);
-  const updateTask = useCallback((id, patch) => {
-    writeTasks(tasks.map((t) => t.id === id ? { ...t, ...patch, id: t.id, updatedAt: nowIso() } : t));
-  }, [tasks, writeTasks]);
-  const removeTask = useCallback((id) => {
-    writeTasks(tasks.filter((t) => t.id !== id));
-  }, [tasks, writeTasks]);
-  const toggleDone = useCallback((id) => {
-    const target = tasks.find((t) => t.id === id);
-    if (target) updateTask(id, { done: !target.done });
-  }, [tasks, updateTask]);
-  return { tasks, addTask, updateTask, removeTask, toggleDone, setAllTasks: writeTasks };
-}
-function useTodoTasks() {
-  const prefsImpl = usePrefsTodoTasks();
-  const providerTasks = useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
-  const addTask = useCallback((input) => {
-    const p = provider;
-    if (!p) return prefsImpl.addTask(input);
-    const tempId = "tmp-" + uid();
-    const ts = nowIso();
-    const optimistic = { done: false, ...input, name: input.name.trim(), id: tempId, createdAt: ts, updatedAt: ts };
-    setCache([...cache, optimistic]);
-    p.create({ ...input, name: input.name.trim() }).then((saved) => setCache(cache.map((t) => t.id === tempId ? { ...optimistic, ...saved } : t))).catch(() => setCache(cache.filter((t) => t.id !== tempId)));
-    return tempId;
-  }, [prefsImpl]);
-  const updateTask = useCallback((id, patch) => {
-    const p = provider;
-    if (!p) return prefsImpl.updateTask(id, patch);
-    setCache(cache.map((t) => t.id === id ? { ...t, ...patch, id, updatedAt: nowIso() } : t));
-    p.update(id, patch).catch(() => {
-      refresh();
-    });
-  }, [prefsImpl]);
-  const removeTask = useCallback((id) => {
-    const p = provider;
-    if (!p) return prefsImpl.removeTask(id);
-    const prev = cache;
-    setCache(cache.filter((t) => t.id !== id));
-    p.remove(id).catch(() => setCache(prev));
-  }, [prefsImpl]);
-  const toggleDone = useCallback((id) => {
-    if (!provider) return prefsImpl.toggleDone(id);
-    const target = cache.find((t) => t.id === id);
-    if (target) updateTask(id, { done: !target.done });
-  }, [prefsImpl, updateTask]);
-  const setAllTasks = useCallback((next) => {
-    if (!provider) prefsImpl.setAllTasks(next);
-  }, [prefsImpl]);
-  if (!hasShellTodoProvider()) return prefsImpl;
-  return { tasks: providerTasks, addTask, updateTask, removeTask, toggleDone, setAllTasks };
-}
-function migratePomodoroTasksOnce(currentTasks, setAllTasks) {
-  try {
-    if (localStorage.getItem(POMODORO_LEGACY_MIGRATED_FLAG)) return;
-    const raw = localStorage.getItem(POMODORO_LEGACY_KEY);
-    if (!raw) {
-      localStorage.setItem(POMODORO_LEGACY_MIGRATED_FLAG, "1");
-      return;
-    }
-    const legacy = JSON.parse(raw);
-    if (!Array.isArray(legacy) || legacy.length === 0) {
-      localStorage.removeItem(POMODORO_LEGACY_KEY);
-      localStorage.setItem(POMODORO_LEGACY_MIGRATED_FLAG, "1");
-      return;
-    }
-    const ts = nowIso();
-    const migrated = legacy.filter((t) => typeof t?.name === "string").map((t) => ({
-      id: t.id || uid(),
-      name: String(t.name),
-      done: !!t.done,
-      estimated: typeof t.estimated === "number" ? t.estimated : void 0,
-      completed: typeof t.completed === "number" ? t.completed : void 0,
-      createdAt: ts,
-      updatedAt: ts
-    }));
-    const existingIds = new Set(currentTasks.map((t) => t.id));
-    const additions = migrated.filter((t) => !existingIds.has(t.id));
-    setAllTasks([...additions, ...currentTasks]);
-    localStorage.removeItem(POMODORO_LEGACY_KEY);
-    localStorage.setItem(POMODORO_LEGACY_MIGRATED_FLAG, "1");
-  } catch {
-    try {
-      localStorage.setItem(POMODORO_LEGACY_MIGRATED_FLAG, "1");
-    } catch {
-    }
-  }
-}
-
-export { ALARM_OPTIONS, FOCUS_SOUND_OPTIONS, getPomoSnapshot, migratePomodoroTasksOnce, playAlarm, pomoPause, pomoStart, pomoSwitchMode, previewFocusSound, setPomoAlarm, setPomoAlarmConfig, setPomoBehaviour, setPomoDurations, setPomoFocusSound, setShellTodoProvider, subscribePomo, useTodoTasks };
-//# sourceMappingURL=chunk-SHQM5CK3.js.map
-//# sourceMappingURL=chunk-SHQM5CK3.js.map