@dirstack/ui 1.0.0 → 1.0.1

package/dist/components/button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","names":[],"sources":["../../src/components/button.tsx"],"mappings":";;;;;cAQM,4CAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YAoCR,cAAc,KAAK,UAAU,+CACvC,oBAAoB,kBACpB,KAAK,oBAAoB;;;;EAIvB;;;;EAKA,SAAS;;;;EAKT,SAAS;;iBAGJ,SACP,UACA,WACA,UACA,QACA,WACA,QACA,QACA,SACA,MACA,OACA,UACG,QACF,8BAAW,+CAAA"}
+{"version":3,"file":"button.d.ts","names":[],"sources":["../../src/components/button.tsx"],"mappings":";;;;;cASM,4CAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YAoCR,cAAc,KAAK,UAAU,+CACvC,oBAAoB,kBACpB,KAAK,oBAAoB;;;;EAIvB;;;;EAKA,SAAS;;;;EAKT,SAAS;;iBAGJ,SACP,UACA,WACA,UACA,QACA,WACA,QACA,QACA,SACA,MACA,OACA,UACG,QACF,8BAAW,+CAAA"}

package/dist/components/button.js

@@ -1,5 +1,6 @@
 import { cn, variants } from "../lib/variants.js";
 import { slot } from "../lib/slot.js";
+import { controlTextClasses } from "../lib/classes.js";
 import { LoaderIcon } from "../lib/icons.js";
 import { interactiveVariants } from "../lib/interactive.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -8,7 +9,7 @@ import { useRender } from "@base-ui/react/use-render";
 import { Children, isValidElement } from "react";
 //#region src/components/button.tsx
 const buttonVariants = variants({
-	base: ["group/button inline-flex items-center justify-center font-medium text-control text-start rounded-md overflow-clip select-none hover:z-10", "disabled:opacity-60 disabled:pointer-events-none aria-disabled:opacity-60 aria-disabled:pointer-events-none"],
+	base: [`group/button inline-flex items-center justify-center font-medium ${controlTextClasses} text-start rounded-md overflow-clip select-none hover:z-10`, "disabled:opacity-60 disabled:pointer-events-none aria-disabled:opacity-60 aria-disabled:pointer-events-none"],
 	variants: {
 		variant: {
 			primary: "text-background bg-foreground hover:opacity-90",

package/dist/components/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","names":[],"sources":["../../src/components/button.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react\"\nimport { useRender } from \"@base-ui/react/use-render\"\nimport { Children, isValidElement, type ReactNode } from \"react\"\nimport { LoaderIcon } from \"~/lib/icons\"\nimport { interactiveVariants } from \"~/lib/interactive\"\nimport { slot } from \"~/lib/slot\"\nimport { variants, cn, type VariantProps } from \"~/lib/variants\"\n\nconst buttonVariants = variants({\n  base: [\n    \"group/button inline-flex items-center justify-center font-medium text-control text-start rounded-md overflow-clip select-none hover:z-10\",\n    \"disabled:opacity-60 disabled:pointer-events-none aria-disabled:opacity-60 aria-disabled:pointer-events-none\",\n  ],\n\n  variants: {\n    variant: {\n      primary: \"text-background bg-foreground hover:opacity-90\",\n      secondary: \"bg-card text-secondary-foreground\",\n      soft: \"bg-muted text-secondary-foreground hover:bg-muted/75 hover:text-foreground hover:outline-none\",\n      ghost:\n        \"text-secondary-foreground hover:bg-foreground/5 hover:text-foreground hover:outline-none\",\n      danger: \"bg-danger text-white hover:bg-danger/90\",\n    },\n    size: {\n      sm: \"px-2 py-1 gap-[0.66ch]\",\n      // The default control height. A floor rather than a fixed height, so a row that leads\n      // with something taller than the label (the sidebar's 20px avatar) still grows.\n      md: \"min-h-control px-3 py-2 gap-[0.75ch]\",\n      lg: \"px-3.5 py-2.5 gap-[1ch] rounded-lg sm:text-sm/tight\",\n    },\n  },\n\n  defaultVariants: {\n    variant: \"primary\",\n    size: \"md\",\n  },\n})\n\nconst buttonAffixClasses =\n  \"shrink-0 first:-ml-[0.21425em] last:-mr-[0.21425em] [svg]:my-[0.077em] [svg]:size-[1.1em]\"\n\n/** Hidden while the button is pending, so only the spinner reads as content. */\nconst buttonPendingClasses = \"group-data-pending/button:text-transparent\"\n\nexport type ButtonProps = Omit<useRender.ComponentProps<\"button\">, \"size\" | \"prefix\"> &\n  VariantProps<typeof buttonVariants> &\n  Pick<VariantProps<typeof interactiveVariants>, \"hover\" | \"focus\"> & {\n    /**\n     * If set to `true`, the button will be rendered in the pending state.\n     */\n    isPending?: boolean\n\n    /**\n     * The slot to be rendered before the label.\n     */\n    prefix?: ReactNode\n\n    /**\n     * The slot to be rendered after the label.\n     */\n    suffix?: ReactNode\n  }\n\nfunction Button({\n  children,\n  className,\n  disabled,\n  render,\n  isPending,\n  prefix,\n  suffix,\n  variant,\n  size,\n  hover = true,\n  focus = true,\n  ...rest\n}: ButtonProps) {\n  const props = mergeProps<\"button\">(\n    {\n      disabled: disabled || isPending,\n      \"aria-busy\": isPending || undefined,\n      className: cn(\n        interactiveVariants({ hover, focus, bordered: variant === \"secondary\" }),\n        buttonVariants({ variant, size, className }),\n      ),\n      children: (\n        <>\n          {slot(prefix && isPending ? <LoaderIcon className=\"animate-spin\" /> : prefix, {\n            className: buttonAffixClasses,\n          })}\n\n          {Children.count(children) > 0 &&\n            slot(isValidElement(children) ? children : <span>{children}</span>, {\n              className: cn(\n                \"flex-1 truncate only:text-center has-[div]:contents\",\n                buttonPendingClasses,\n              ),\n            })}\n\n          {slot(suffix, { className: cn(buttonAffixClasses, buttonPendingClasses) })}\n\n          {!prefix && !!isPending && <LoaderIcon className=\"absolute size-[1.25em] animate-spin\" />}\n        </>\n      ),\n    },\n    rest,\n  )\n\n  // `data-pending` drives the label and suffix fade; it sits outside `mergeProps`, whose\n  // button props type has no room for a custom data attribute.\n  return useRender({\n    defaultTagName: \"button\",\n    render,\n    props: { \"data-pending\": isPending || undefined, ...props },\n  })\n}\n\nexport { Button, buttonVariants }\n"],"mappings":";;;;;;;;;AAQA,MAAM,iBAAiB,SAAS;CAC9B,MAAM,CACJ,4IACA,6GACF;CAEA,UAAU;EACR,SAAS;GACP,SAAS;GACT,WAAW;GACX,MAAM;GACN,OACE;GACF,QAAQ;EACV;EACA,MAAM;GACJ,IAAI;GAGJ,IAAI;GACJ,IAAI;EACN;CACF;CAEA,iBAAiB;EACf,SAAS;EACT,MAAM;CACR;AACF,CAAC;AAED,MAAM,qBACJ;;AAGF,MAAM,uBAAuB;AAqB7B,SAAS,OAAO,EACd,UACA,WACA,UACA,QACA,WACA,QACA,QACA,SACA,MACA,QAAQ,MACR,QAAQ,MACR,GAAG,QACW;CACd,MAAM,QAAQ,WACZ;EACE,UAAU,YAAY;EACtB,aAAa,aAAa,KAAA;EAC1B,WAAW,GACT,oBAAoB;GAAE;GAAO;GAAO,UAAU,YAAY;EAAY,CAAC,GACvE,eAAe;GAAE;GAAS;GAAM;EAAU,CAAC,CAC7C;EACA,UACE,qBAAA,UAAA,EAAA,UAAA;GACG,KAAK,UAAU,YAAY,oBAAC,YAAD,EAAY,WAAU,eAAgB,CAAA,IAAI,QAAQ,EAC5E,WAAW,mBACb,CAAC;GAEA,SAAS,MAAM,QAAQ,IAAI,KAC1B,KAAK,eAAe,QAAQ,IAAI,WAAW,oBAAC,QAAD,EAAO,SAAe,CAAA,GAAG,EAClE,WAAW,GACT,uDACA,oBACF,EACF,CAAC;GAEF,KAAK,QAAQ,EAAE,WAAW,GAAG,oBAAoB,oBAAoB,EAAE,CAAC;GAExE,CAAC,UAAU,CAAC,CAAC,aAAa,oBAAC,YAAD,EAAY,WAAU,sCAAuC,CAAA;EACxF,EAAA,CAAA;CAEN,GACA,IACF;CAIA,OAAO,UAAU;EACf,gBAAgB;EAChB;EACA,OAAO;GAAE,gBAAgB,aAAa,KAAA;GAAW,GAAG;EAAM;CAC5D,CAAC;AACH"}
+{"version":3,"file":"button.js","names":[],"sources":["../../src/components/button.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react\"\nimport { useRender } from \"@base-ui/react/use-render\"\nimport { Children, isValidElement, type ReactNode } from \"react\"\nimport { controlTextClasses } from \"~/lib/classes\"\nimport { LoaderIcon } from \"~/lib/icons\"\nimport { interactiveVariants } from \"~/lib/interactive\"\nimport { slot } from \"~/lib/slot\"\nimport { variants, cn, type VariantProps } from \"~/lib/variants\"\n\nconst buttonVariants = variants({\n  base: [\n    `group/button inline-flex items-center justify-center font-medium ${controlTextClasses} text-start rounded-md overflow-clip select-none hover:z-10`,\n    \"disabled:opacity-60 disabled:pointer-events-none aria-disabled:opacity-60 aria-disabled:pointer-events-none\",\n  ],\n\n  variants: {\n    variant: {\n      primary: \"text-background bg-foreground hover:opacity-90\",\n      secondary: \"bg-card text-secondary-foreground\",\n      soft: \"bg-muted text-secondary-foreground hover:bg-muted/75 hover:text-foreground hover:outline-none\",\n      ghost:\n        \"text-secondary-foreground hover:bg-foreground/5 hover:text-foreground hover:outline-none\",\n      danger: \"bg-danger text-white hover:bg-danger/90\",\n    },\n    size: {\n      sm: \"px-2 py-1 gap-[0.66ch]\",\n      // The default control height. A floor rather than a fixed height, so a row that leads\n      // with something taller than the label (the sidebar's 20px avatar) still grows.\n      md: \"min-h-control px-3 py-2 gap-[0.75ch]\",\n      lg: \"px-3.5 py-2.5 gap-[1ch] rounded-lg sm:text-sm/tight\",\n    },\n  },\n\n  defaultVariants: {\n    variant: \"primary\",\n    size: \"md\",\n  },\n})\n\nconst buttonAffixClasses =\n  \"shrink-0 first:-ml-[0.21425em] last:-mr-[0.21425em] [svg]:my-[0.077em] [svg]:size-[1.1em]\"\n\n/** Hidden while the button is pending, so only the spinner reads as content. */\nconst buttonPendingClasses = \"group-data-pending/button:text-transparent\"\n\nexport type ButtonProps = Omit<useRender.ComponentProps<\"button\">, \"size\" | \"prefix\"> &\n  VariantProps<typeof buttonVariants> &\n  Pick<VariantProps<typeof interactiveVariants>, \"hover\" | \"focus\"> & {\n    /**\n     * If set to `true`, the button will be rendered in the pending state.\n     */\n    isPending?: boolean\n\n    /**\n     * The slot to be rendered before the label.\n     */\n    prefix?: ReactNode\n\n    /**\n     * The slot to be rendered after the label.\n     */\n    suffix?: ReactNode\n  }\n\nfunction Button({\n  children,\n  className,\n  disabled,\n  render,\n  isPending,\n  prefix,\n  suffix,\n  variant,\n  size,\n  hover = true,\n  focus = true,\n  ...rest\n}: ButtonProps) {\n  const props = mergeProps<\"button\">(\n    {\n      disabled: disabled || isPending,\n      \"aria-busy\": isPending || undefined,\n      className: cn(\n        interactiveVariants({ hover, focus, bordered: variant === \"secondary\" }),\n        buttonVariants({ variant, size, className }),\n      ),\n      children: (\n        <>\n          {slot(prefix && isPending ? <LoaderIcon className=\"animate-spin\" /> : prefix, {\n            className: buttonAffixClasses,\n          })}\n\n          {Children.count(children) > 0 &&\n            slot(isValidElement(children) ? children : <span>{children}</span>, {\n              className: cn(\n                \"flex-1 truncate only:text-center has-[div]:contents\",\n                buttonPendingClasses,\n              ),\n            })}\n\n          {slot(suffix, { className: cn(buttonAffixClasses, buttonPendingClasses) })}\n\n          {!prefix && !!isPending && <LoaderIcon className=\"absolute size-[1.25em] animate-spin\" />}\n        </>\n      ),\n    },\n    rest,\n  )\n\n  // `data-pending` drives the label and suffix fade; it sits outside `mergeProps`, whose\n  // button props type has no room for a custom data attribute.\n  return useRender({\n    defaultTagName: \"button\",\n    render,\n    props: { \"data-pending\": isPending || undefined, ...props },\n  })\n}\n\nexport { Button, buttonVariants }\n"],"mappings":";;;;;;;;;;AASA,MAAM,iBAAiB,SAAS;CAC9B,MAAM,CACJ,oEAAoE,mBAAmB,8DACvF,6GACF;CAEA,UAAU;EACR,SAAS;GACP,SAAS;GACT,WAAW;GACX,MAAM;GACN,OACE;GACF,QAAQ;EACV;EACA,MAAM;GACJ,IAAI;GAGJ,IAAI;GACJ,IAAI;EACN;CACF;CAEA,iBAAiB;EACf,SAAS;EACT,MAAM;CACR;AACF,CAAC;AAED,MAAM,qBACJ;;AAGF,MAAM,uBAAuB;AAqB7B,SAAS,OAAO,EACd,UACA,WACA,UACA,QACA,WACA,QACA,QACA,SACA,MACA,QAAQ,MACR,QAAQ,MACR,GAAG,QACW;CACd,MAAM,QAAQ,WACZ;EACE,UAAU,YAAY;EACtB,aAAa,aAAa,KAAA;EAC1B,WAAW,GACT,oBAAoB;GAAE;GAAO;GAAO,UAAU,YAAY;EAAY,CAAC,GACvE,eAAe;GAAE;GAAS;GAAM;EAAU,CAAC,CAC7C;EACA,UACE,qBAAA,UAAA,EAAA,UAAA;GACG,KAAK,UAAU,YAAY,oBAAC,YAAD,EAAY,WAAU,eAAgB,CAAA,IAAI,QAAQ,EAC5E,WAAW,mBACb,CAAC;GAEA,SAAS,MAAM,QAAQ,IAAI,KAC1B,KAAK,eAAe,QAAQ,IAAI,WAAW,oBAAC,QAAD,EAAO,SAAe,CAAA,GAAG,EAClE,WAAW,GACT,uDACA,oBACF,EACF,CAAC;GAEF,KAAK,QAAQ,EAAE,WAAW,GAAG,oBAAoB,oBAAoB,EAAE,CAAC;GAExE,CAAC,UAAU,CAAC,CAAC,aAAa,oBAAC,YAAD,EAAY,WAAU,sCAAuC,CAAA;EACxF,EAAA,CAAA;CAEN,GACA,IACF;CAIA,OAAO,UAAU;EACf,gBAAgB;EAChB;EACA,OAAO;GAAE,gBAAgB,aAAa,KAAA;GAAW,GAAG;EAAM;CAC5D,CAAC;AACH"}

package/dist/components/form.js

@@ -1,7 +1,7 @@
 "use client";
 import { cn } from "../lib/variants.js";
+import { controlTextClasses, descriptionClasses } from "../lib/classes.js";
 import { Stack } from "./stack.js";
-import { descriptionClasses } from "../lib/classes.js";
 import { Label } from "./label.js";
 import { jsx } from "react/jsx-runtime";
 import { useRender } from "@base-ui/react/use-render";
@@ -77,7 +77,7 @@ function FormMessage({ className, children, ...props }) {
 	if (!body) return null;
 	return /* @__PURE__ */ jsx("p", {
 		id: formMessageId,
-		className: cn("text-control font-medium text-danger", className),
+		className: cn(`${controlTextClasses} font-medium text-danger`, className),
 		...props,
 		children: body
 	});

package/dist/components/form.js.map

@@ -1 +1 @@
-{"version":3,"file":"form.js","names":[],"sources":["../../src/components/form.tsx"],"sourcesContent":["\"use client\"\n\nimport { useRender } from \"@base-ui/react/use-render\"\nimport { type ComponentProps, createContext, useContext, useId } from \"react\"\nimport {\n  Controller,\n  type ControllerProps,\n  type FieldPath,\n  type FieldValues,\n  FormProvider,\n  useFormContext,\n} from \"react-hook-form\"\nimport { Label } from \"~/components/label\"\nimport { Stack } from \"~/components/stack\"\nimport { descriptionClasses } from \"~/lib/classes\"\nimport { cn } from \"~/lib/variants\"\n\nconst Form = FormProvider\n\ninterface FormFieldContextValue<\n  TFieldValues extends FieldValues = FieldValues,\n  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n> {\n  name: TName\n}\n\nconst FormFieldContext = createContext<FormFieldContextValue | null>(null)\n\nfunction FormField<\n  TFieldValues extends FieldValues = FieldValues,\n  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n  TTransformedValues = TFieldValues,\n>({ ...props }: ControllerProps<TFieldValues, TName, TTransformedValues>) {\n  return (\n    <FormFieldContext.Provider value={{ name: props.name }}>\n      <Controller {...props} />\n    </FormFieldContext.Provider>\n  )\n}\n\nfunction useFormField() {\n  const fieldContext = useContext(FormFieldContext)\n  const itemContext = useContext(FormItemContext)\n  const { getFieldState, formState } = useFormContext()\n\n  if (!fieldContext) {\n    throw new Error(\"useFormField should be used within <FormField>\")\n  }\n\n  if (!itemContext) {\n    throw new Error(\"useFormField should be used within <FormItem>\")\n  }\n\n  const fieldState = getFieldState(fieldContext.name, formState)\n  const { id } = itemContext\n\n  return {\n    id,\n    name: fieldContext.name,\n    formItemId: `${id}-form-item`,\n    formDescriptionId: `${id}-form-item-description`,\n    formMessageId: `${id}-form-item-message`,\n    ...fieldState,\n  }\n}\n\ninterface FormItemContextValue {\n  id: string\n}\n\nconst FormItemContext = createContext<FormItemContextValue | null>(null)\n\nfunction FormItem({ direction = \"column\", ...props }: ComponentProps<typeof Stack>) {\n  const id = useId()\n\n  return (\n    <FormItemContext.Provider value={{ id }}>\n      <Stack direction={direction} {...props} />\n    </FormItemContext.Provider>\n  )\n}\n\nfunction FormLabel({ ...props }: ComponentProps<typeof Label>) {\n  const { formItemId } = useFormField()\n\n  return <Label htmlFor={formItemId} {...props} />\n}\n\nfunction FormControl({ children, render, ...props }: useRender.ComponentProps<\"div\">) {\n  const { error, formItemId, formDescriptionId, formMessageId } = useFormField()\n\n  // Renders *as* its single child (the form field), merging id/aria onto it —\n  // the Base UI equivalent of Radix's `<Slot>`.\n  return useRender({\n    render: render ?? (children as useRender.RenderProp),\n    props: {\n      id: formItemId,\n      \"aria-describedby\": !error ? formDescriptionId : `${formDescriptionId} ${formMessageId}`,\n      \"aria-invalid\": !!error,\n      ...props,\n    },\n  })\n}\n\nfunction FormDescription({ className, ...props }: ComponentProps<\"p\">) {\n  const { formDescriptionId } = useFormField()\n\n  return <p id={formDescriptionId} className={cn(descriptionClasses, className)} {...props} />\n}\n\nfunction FormMessage({ className, children, ...props }: ComponentProps<\"p\">) {\n  const { error, formMessageId } = useFormField()\n  const body = error ? String(error?.message) : children\n\n  if (!body) {\n    return null\n  }\n\n  return (\n    <p\n      id={formMessageId}\n      className={cn(\"text-control font-medium text-danger\", className)}\n      {...props}\n    >\n      {body}\n    </p>\n  )\n}\n\nexport {\n  Form,\n  FormControl,\n  FormDescription,\n  FormField,\n  FormItem,\n  FormLabel,\n  FormMessage,\n  useFormField,\n}\n"],"mappings":";;;;;;;;;;AAiBA,MAAM,OAAO;AASb,MAAM,mBAAmB,cAA4C,IAAI;AAEzE,SAAS,UAIP,EAAE,GAAG,SAAmE;CACxE,OACE,oBAAC,iBAAiB,UAAlB;EAA2B,OAAO,EAAE,MAAM,MAAM,KAAK;EACnD,UAAA,oBAAC,YAAD,EAAY,GAAI,MAAQ,CAAA;CACC,CAAA;AAE/B;AAEA,SAAS,eAAe;CACtB,MAAM,eAAe,WAAW,gBAAgB;CAChD,MAAM,cAAc,WAAW,eAAe;CAC9C,MAAM,EAAE,eAAe,cAAc,eAAe;CAEpD,IAAI,CAAC,cACH,MAAM,IAAI,MAAM,gDAAgD;CAGlE,IAAI,CAAC,aACH,MAAM,IAAI,MAAM,+CAA+C;CAGjE,MAAM,aAAa,cAAc,aAAa,MAAM,SAAS;CAC7D,MAAM,EAAE,OAAO;CAEf,OAAO;EACL;EACA,MAAM,aAAa;EACnB,YAAY,GAAG,GAAG;EAClB,mBAAmB,GAAG,GAAG;EACzB,eAAe,GAAG,GAAG;EACrB,GAAG;CACL;AACF;AAMA,MAAM,kBAAkB,cAA2C,IAAI;AAEvE,SAAS,SAAS,EAAE,YAAY,UAAU,GAAG,SAAuC;CAClF,MAAM,KAAK,MAAM;CAEjB,OACE,oBAAC,gBAAgB,UAAjB;EAA0B,OAAO,EAAE,GAAG;EACpC,UAAA,oBAAC,OAAD;GAAkB;GAAW,GAAI;EAAQ,CAAA;CACjB,CAAA;AAE9B;AAEA,SAAS,UAAU,EAAE,GAAG,SAAuC;CAC7D,MAAM,EAAE,eAAe,aAAa;CAEpC,OAAO,oBAAC,OAAD;EAAO,SAAS;EAAY,GAAI;CAAQ,CAAA;AACjD;AAEA,SAAS,YAAY,EAAE,UAAU,QAAQ,GAAG,SAA0C;CACpF,MAAM,EAAE,OAAO,YAAY,mBAAmB,kBAAkB,aAAa;CAI7E,OAAO,UAAU;EACf,QAAQ,UAAW;EACnB,OAAO;GACL,IAAI;GACJ,oBAAoB,CAAC,QAAQ,oBAAoB,GAAG,kBAAkB,GAAG;GACzE,gBAAgB,CAAC,CAAC;GAClB,GAAG;EACL;CACF,CAAC;AACH;AAEA,SAAS,gBAAgB,EAAE,WAAW,GAAG,SAA8B;CACrE,MAAM,EAAE,sBAAsB,aAAa;CAE3C,OAAO,oBAAC,KAAD;EAAG,IAAI;EAAmB,WAAW,GAAG,oBAAoB,SAAS;EAAG,GAAI;CAAQ,CAAA;AAC7F;AAEA,SAAS,YAAY,EAAE,WAAW,UAAU,GAAG,SAA8B;CAC3E,MAAM,EAAE,OAAO,kBAAkB,aAAa;CAC9C,MAAM,OAAO,QAAQ,OAAO,OAAO,OAAO,IAAI;CAE9C,IAAI,CAAC,MACH,OAAO;CAGT,OACE,oBAAC,KAAD;EACE,IAAI;EACJ,WAAW,GAAG,wCAAwC,SAAS;EAC/D,GAAI;EAEH,UAAA;CACA,CAAA;AAEP"}
+{"version":3,"file":"form.js","names":[],"sources":["../../src/components/form.tsx"],"sourcesContent":["\"use client\"\n\nimport { useRender } from \"@base-ui/react/use-render\"\nimport { type ComponentProps, createContext, useContext, useId } from \"react\"\nimport {\n  Controller,\n  type ControllerProps,\n  type FieldPath,\n  type FieldValues,\n  FormProvider,\n  useFormContext,\n} from \"react-hook-form\"\nimport { Label } from \"~/components/label\"\nimport { Stack } from \"~/components/stack\"\nimport { controlTextClasses, descriptionClasses } from \"~/lib/classes\"\nimport { cn } from \"~/lib/variants\"\n\nconst Form = FormProvider\n\ninterface FormFieldContextValue<\n  TFieldValues extends FieldValues = FieldValues,\n  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n> {\n  name: TName\n}\n\nconst FormFieldContext = createContext<FormFieldContextValue | null>(null)\n\nfunction FormField<\n  TFieldValues extends FieldValues = FieldValues,\n  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n  TTransformedValues = TFieldValues,\n>({ ...props }: ControllerProps<TFieldValues, TName, TTransformedValues>) {\n  return (\n    <FormFieldContext.Provider value={{ name: props.name }}>\n      <Controller {...props} />\n    </FormFieldContext.Provider>\n  )\n}\n\nfunction useFormField() {\n  const fieldContext = useContext(FormFieldContext)\n  const itemContext = useContext(FormItemContext)\n  const { getFieldState, formState } = useFormContext()\n\n  if (!fieldContext) {\n    throw new Error(\"useFormField should be used within <FormField>\")\n  }\n\n  if (!itemContext) {\n    throw new Error(\"useFormField should be used within <FormItem>\")\n  }\n\n  const fieldState = getFieldState(fieldContext.name, formState)\n  const { id } = itemContext\n\n  return {\n    id,\n    name: fieldContext.name,\n    formItemId: `${id}-form-item`,\n    formDescriptionId: `${id}-form-item-description`,\n    formMessageId: `${id}-form-item-message`,\n    ...fieldState,\n  }\n}\n\ninterface FormItemContextValue {\n  id: string\n}\n\nconst FormItemContext = createContext<FormItemContextValue | null>(null)\n\nfunction FormItem({ direction = \"column\", ...props }: ComponentProps<typeof Stack>) {\n  const id = useId()\n\n  return (\n    <FormItemContext.Provider value={{ id }}>\n      <Stack direction={direction} {...props} />\n    </FormItemContext.Provider>\n  )\n}\n\nfunction FormLabel({ ...props }: ComponentProps<typeof Label>) {\n  const { formItemId } = useFormField()\n\n  return <Label htmlFor={formItemId} {...props} />\n}\n\nfunction FormControl({ children, render, ...props }: useRender.ComponentProps<\"div\">) {\n  const { error, formItemId, formDescriptionId, formMessageId } = useFormField()\n\n  // Renders *as* its single child (the form field), merging id/aria onto it —\n  // the Base UI equivalent of Radix's `<Slot>`.\n  return useRender({\n    render: render ?? (children as useRender.RenderProp),\n    props: {\n      id: formItemId,\n      \"aria-describedby\": !error ? formDescriptionId : `${formDescriptionId} ${formMessageId}`,\n      \"aria-invalid\": !!error,\n      ...props,\n    },\n  })\n}\n\nfunction FormDescription({ className, ...props }: ComponentProps<\"p\">) {\n  const { formDescriptionId } = useFormField()\n\n  return <p id={formDescriptionId} className={cn(descriptionClasses, className)} {...props} />\n}\n\nfunction FormMessage({ className, children, ...props }: ComponentProps<\"p\">) {\n  const { error, formMessageId } = useFormField()\n  const body = error ? String(error?.message) : children\n\n  if (!body) {\n    return null\n  }\n\n  return (\n    <p\n      id={formMessageId}\n      className={cn(`${controlTextClasses} font-medium text-danger`, className)}\n      {...props}\n    >\n      {body}\n    </p>\n  )\n}\n\nexport {\n  Form,\n  FormControl,\n  FormDescription,\n  FormField,\n  FormItem,\n  FormLabel,\n  FormMessage,\n  useFormField,\n}\n"],"mappings":";;;;;;;;;;AAiBA,MAAM,OAAO;AASb,MAAM,mBAAmB,cAA4C,IAAI;AAEzE,SAAS,UAIP,EAAE,GAAG,SAAmE;CACxE,OACE,oBAAC,iBAAiB,UAAlB;EAA2B,OAAO,EAAE,MAAM,MAAM,KAAK;EACnD,UAAA,oBAAC,YAAD,EAAY,GAAI,MAAQ,CAAA;CACC,CAAA;AAE/B;AAEA,SAAS,eAAe;CACtB,MAAM,eAAe,WAAW,gBAAgB;CAChD,MAAM,cAAc,WAAW,eAAe;CAC9C,MAAM,EAAE,eAAe,cAAc,eAAe;CAEpD,IAAI,CAAC,cACH,MAAM,IAAI,MAAM,gDAAgD;CAGlE,IAAI,CAAC,aACH,MAAM,IAAI,MAAM,+CAA+C;CAGjE,MAAM,aAAa,cAAc,aAAa,MAAM,SAAS;CAC7D,MAAM,EAAE,OAAO;CAEf,OAAO;EACL;EACA,MAAM,aAAa;EACnB,YAAY,GAAG,GAAG;EAClB,mBAAmB,GAAG,GAAG;EACzB,eAAe,GAAG,GAAG;EACrB,GAAG;CACL;AACF;AAMA,MAAM,kBAAkB,cAA2C,IAAI;AAEvE,SAAS,SAAS,EAAE,YAAY,UAAU,GAAG,SAAuC;CAClF,MAAM,KAAK,MAAM;CAEjB,OACE,oBAAC,gBAAgB,UAAjB;EAA0B,OAAO,EAAE,GAAG;EACpC,UAAA,oBAAC,OAAD;GAAkB;GAAW,GAAI;EAAQ,CAAA;CACjB,CAAA;AAE9B;AAEA,SAAS,UAAU,EAAE,GAAG,SAAuC;CAC7D,MAAM,EAAE,eAAe,aAAa;CAEpC,OAAO,oBAAC,OAAD;EAAO,SAAS;EAAY,GAAI;CAAQ,CAAA;AACjD;AAEA,SAAS,YAAY,EAAE,UAAU,QAAQ,GAAG,SAA0C;CACpF,MAAM,EAAE,OAAO,YAAY,mBAAmB,kBAAkB,aAAa;CAI7E,OAAO,UAAU;EACf,QAAQ,UAAW;EACnB,OAAO;GACL,IAAI;GACJ,oBAAoB,CAAC,QAAQ,oBAAoB,GAAG,kBAAkB,GAAG;GACzE,gBAAgB,CAAC,CAAC;GAClB,GAAG;EACL;CACF,CAAC;AACH;AAEA,SAAS,gBAAgB,EAAE,WAAW,GAAG,SAA8B;CACrE,MAAM,EAAE,sBAAsB,aAAa;CAE3C,OAAO,oBAAC,KAAD;EAAG,IAAI;EAAmB,WAAW,GAAG,oBAAoB,SAAS;EAAG,GAAI;CAAQ,CAAA;AAC7F;AAEA,SAAS,YAAY,EAAE,WAAW,UAAU,GAAG,SAA8B;CAC3E,MAAM,EAAE,OAAO,kBAAkB,aAAa;CAC9C,MAAM,OAAO,QAAQ,OAAO,OAAO,OAAO,IAAI;CAE9C,IAAI,CAAC,MACH,OAAO;CAGT,OACE,oBAAC,KAAD;EACE,IAAI;EACJ,WAAW,GAAG,GAAG,mBAAmB,2BAA2B,SAAS;EACxE,GAAI;EAEH,UAAA;CACA,CAAA;AAEP"}

package/dist/components/input.d.ts

@@ -7,7 +7,7 @@ declare const inputVariants: import("tailwind-variants").TVReturnType<{
     md: "px-3 py-2 rounded-md";
     lg: "px-4 py-2.5 rounded-lg sm:text-sm";
   };
-}, undefined, "appearance-none min-h-0 w-full self-stretch bg-card text-foreground text-control break-words disabled:text-secondary-foreground/50", {
+}, undefined, "appearance-none min-h-0 w-full self-stretch bg-card text-foreground text-(length:--text-control) leading-(--text-control--line-height) break-words disabled:text-secondary-foreground/50", {
   hover: {
     true: "not-disabled:cursor-pointer hover:not-disabled:outline-[3px] hover:not-disabled:outline-border/50";
   };

package/dist/components/input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input.d.ts","names":[],"sources":["../../src/components/input.tsx"],"mappings":";;;cAIM,2CAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAoBd,aAAa,KAAK,mCAAmC,oBAAoB;iBAErE,QAAQ,WAAW,OAAO,OAAO,SAAS,SAAS,6BAAU,IAAA"}
+{"version":3,"file":"input.d.ts","names":[],"sources":["../../src/components/input.tsx"],"mappings":";;;cAKM,2CAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAoBd,aAAa,KAAK,mCAAmC,oBAAoB;iBAErE,QAAQ,WAAW,OAAO,OAAO,SAAS,SAAS,6BAAU,IAAA"}

package/dist/components/input.js

@@ -1,10 +1,11 @@
 import { cn, variants } from "../lib/variants.js";
+import { controlTextClasses } from "../lib/classes.js";
 import { interactiveVariants } from "../lib/interactive.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/input.tsx
 const inputVariants = variants({
 	extend: interactiveVariants,
-	base: "appearance-none min-h-0 w-full self-stretch bg-card text-foreground text-control break-words disabled:text-secondary-foreground/50",
+	base: `appearance-none min-h-0 w-full self-stretch bg-card text-foreground ${controlTextClasses} break-words disabled:text-secondary-foreground/50`,
 	variants: { size: {
 		sm: "px-2 py-1 font-normal rounded-md",
 		md: "px-3 py-2 rounded-md",

package/dist/components/input.js.map

@@ -1 +1 @@
-{"version":3,"file":"input.js","names":[],"sources":["../../src/components/input.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\"\nimport { interactiveVariants } from \"~/lib/interactive\"\nimport { variants, cn, type VariantProps } from \"~/lib/variants\"\n\nconst inputVariants = variants({\n  extend: interactiveVariants,\n  base: \"appearance-none min-h-0 w-full self-stretch bg-card text-foreground text-control break-words disabled:text-secondary-foreground/50\",\n\n  variants: {\n    size: {\n      sm: \"px-2 py-1 font-normal rounded-md\",\n      md: \"px-3 py-2 rounded-md\",\n      lg: \"px-4 py-2.5 rounded-lg sm:text-sm\",\n    },\n  },\n\n  defaultVariants: {\n    hover: false,\n    focus: true,\n    bordered: true,\n    size: \"md\",\n  },\n})\n\ntype InputProps = Omit<ComponentProps<\"input\">, \"size\"> & VariantProps<typeof inputVariants>\n\nfunction Input({ className, hover, focus, size, ...props }: InputProps) {\n  return <input className={cn(inputVariants({ hover, focus, size }), className)} {...props} />\n}\n\nexport { Input, inputVariants }\n"],"mappings":";;;;AAIA,MAAM,gBAAgB,SAAS;CAC7B,QAAQ;CACR,MAAM;CAEN,UAAU,EACR,MAAM;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;CACN,EACF;CAEA,iBAAiB;EACf,OAAO;EACP,OAAO;EACP,UAAU;EACV,MAAM;CACR;AACF,CAAC;AAID,SAAS,MAAM,EAAE,WAAW,OAAO,OAAO,MAAM,GAAG,SAAqB;CACtE,OAAO,oBAAC,SAAD;EAAO,WAAW,GAAG,cAAc;GAAE;GAAO;GAAO;EAAK,CAAC,GAAG,SAAS;EAAG,GAAI;CAAQ,CAAA;AAC7F"}
+{"version":3,"file":"input.js","names":[],"sources":["../../src/components/input.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\"\nimport { controlTextClasses } from \"~/lib/classes\"\nimport { interactiveVariants } from \"~/lib/interactive\"\nimport { variants, cn, type VariantProps } from \"~/lib/variants\"\n\nconst inputVariants = variants({\n  extend: interactiveVariants,\n  base: `appearance-none min-h-0 w-full self-stretch bg-card text-foreground ${controlTextClasses} break-words disabled:text-secondary-foreground/50`,\n\n  variants: {\n    size: {\n      sm: \"px-2 py-1 font-normal rounded-md\",\n      md: \"px-3 py-2 rounded-md\",\n      lg: \"px-4 py-2.5 rounded-lg sm:text-sm\",\n    },\n  },\n\n  defaultVariants: {\n    hover: false,\n    focus: true,\n    bordered: true,\n    size: \"md\",\n  },\n})\n\ntype InputProps = Omit<ComponentProps<\"input\">, \"size\"> & VariantProps<typeof inputVariants>\n\nfunction Input({ className, hover, focus, size, ...props }: InputProps) {\n  return <input className={cn(inputVariants({ hover, focus, size }), className)} {...props} />\n}\n\nexport { Input, inputVariants }\n"],"mappings":";;;;;AAKA,MAAM,gBAAgB,SAAS;CAC7B,QAAQ;CACR,MAAM,uEAAuE,mBAAmB;CAEhG,UAAU,EACR,MAAM;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;CACN,EACF;CAEA,iBAAiB;EACf,OAAO;EACP,OAAO;EACP,UAAU;EACV,MAAM;CACR;AACF,CAAC;AAID,SAAS,MAAM,EAAE,WAAW,OAAO,OAAO,MAAM,GAAG,SAAqB;CACtE,OAAO,oBAAC,SAAD;EAAO,WAAW,GAAG,cAAc;GAAE;GAAO;GAAO;EAAK,CAAC,GAAG,SAAS;EAAG,GAAI;CAAQ,CAAA;AAC7F"}

package/dist/components/menu.js

@@ -1,7 +1,7 @@
 "use client";
 import { cn } from "../lib/variants.js";
+import { controlTextClasses, eyebrowClasses, popoverAnimationClasses } from "../lib/classes.js";
 import { CheckIcon, CircleIcon } from "../lib/icons.js";
-import { eyebrowClasses, popoverAnimationClasses } from "../lib/classes.js";
 import { Kbd } from "./kbd.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Menu as Menu$1 } from "@base-ui/react/menu";
@@ -24,13 +24,13 @@ function MenuContent({ className, sideOffset = 4, align, side, ...props }) {
 }
 function MenuItem({ className, inset, ...props }) {
 	return /* @__PURE__ */ jsx(Menu$1.Item, {
-		className: cn("relative flex m-0 cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-1.5 text-control outline-hidden focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&>svg]:size-4 [&>svg]:shrink-0", inset && "pl-8", className),
+		className: cn(`relative flex m-0 cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-1.5 ${controlTextClasses} outline-hidden focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&>svg]:size-4 [&>svg]:shrink-0`, inset && "pl-8", className),
 		...props
 	});
 }
 function MenuCheckboxItem({ className, children, checked, ...props }) {
 	return /* @__PURE__ */ jsxs(Menu$1.CheckboxItem, {
-		className: cn("relative flex cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-control outline-hidden focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50", className),
+		className: cn(`relative flex cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 ${controlTextClasses} outline-hidden focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50`, className),
 		checked,
 		...props,
 		children: [/* @__PURE__ */ jsx("span", {
@@ -41,7 +41,7 @@ function MenuCheckboxItem({ className, children, checked, ...props }) {
 }
 function MenuRadioItem({ className, children, ...props }) {
 	return /* @__PURE__ */ jsxs(Menu$1.RadioItem, {
-		className: cn("relative flex cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-control outline-hidden focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50", className),
+		className: cn(`relative flex cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 ${controlTextClasses} outline-hidden focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50`, className),
 		...props,
 		children: [/* @__PURE__ */ jsx("span", {
 			className: "absolute left-2 flex size-3.5 items-center justify-center",

package/dist/components/menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu.js","names":["MenuPrimitive"],"sources":["../../src/components/menu.tsx"],"sourcesContent":["\"use client\"\n\nimport { Menu as MenuPrimitive } from \"@base-ui/react/menu\"\nimport type { ComponentProps } from \"react\"\nimport { Kbd } from \"~/components/kbd\"\nimport { eyebrowClasses, popoverAnimationClasses } from \"~/lib/classes\"\nimport { CheckIcon, CircleIcon } from \"~/lib/icons\"\nimport { cn } from \"~/lib/variants\"\n\nconst Menu = MenuPrimitive.Root\nconst MenuTrigger = MenuPrimitive.Trigger\nconst MenuGroup = MenuPrimitive.Group\nconst MenuRadioGroup = MenuPrimitive.RadioGroup\n\nfunction MenuContent({\n  className,\n  sideOffset = 4,\n  align,\n  side,\n  ...props\n}: MenuPrimitive.Popup.Props &\n  Pick<MenuPrimitive.Positioner.Props, \"align\" | \"side\" | \"sideOffset\">) {\n  return (\n    <MenuPrimitive.Portal>\n      <MenuPrimitive.Positioner\n        sideOffset={sideOffset}\n        align={align}\n        side={side}\n        className=\"isolate z-50\"\n      >\n        <MenuPrimitive.Popup\n          className={cn(\n            \"min-w-40 flex flex-col rounded-md border bg-popover p-1 text-popover-foreground shadow-sm backdrop-blur-xs\",\n            popoverAnimationClasses,\n            className,\n          )}\n          {...props}\n        />\n      </MenuPrimitive.Positioner>\n    </MenuPrimitive.Portal>\n  )\n}\n\nfunction MenuItem({\n  className,\n  inset,\n  ...props\n}: MenuPrimitive.Item.Props & {\n  inset?: boolean\n}) {\n  return (\n    <MenuPrimitive.Item\n      className={cn(\n        \"relative flex m-0 cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-1.5 text-control outline-hidden focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&>svg]:size-4 [&>svg]:shrink-0\",\n        inset && \"pl-8\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction MenuCheckboxItem({\n  className,\n  children,\n  checked,\n  ...props\n}: MenuPrimitive.CheckboxItem.Props) {\n  return (\n    <MenuPrimitive.CheckboxItem\n      className={cn(\n        \"relative flex cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-control outline-hidden focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50\",\n        className,\n      )}\n      checked={checked}\n      {...props}\n    >\n      <span className=\"absolute left-2 flex h-3.5 w-3.5 items-center justify-center\">\n        <MenuPrimitive.CheckboxItemIndicator>\n          <CheckIcon />\n        </MenuPrimitive.CheckboxItemIndicator>\n      </span>\n      {children}\n    </MenuPrimitive.CheckboxItem>\n  )\n}\n\nfunction MenuRadioItem({ className, children, ...props }: MenuPrimitive.RadioItem.Props) {\n  return (\n    <MenuPrimitive.RadioItem\n      className={cn(\n        \"relative flex cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-control outline-hidden focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50\",\n        className,\n      )}\n      {...props}\n    >\n      <span className=\"absolute left-2 flex size-3.5 items-center justify-center\">\n        <MenuPrimitive.RadioItemIndicator>\n          <CircleIcon className=\"fill-current size-2\" />\n        </MenuPrimitive.RadioItemIndicator>\n      </span>\n      {children}\n    </MenuPrimitive.RadioItem>\n  )\n}\n\nfunction MenuGroupLabel({\n  className,\n  inset,\n  ...props\n}: MenuPrimitive.GroupLabel.Props & {\n  inset?: boolean\n}) {\n  return (\n    <MenuPrimitive.GroupLabel\n      className={cn(\"px-2 pt-1.5 pb-1\", eyebrowClasses, inset && \"pl-8\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction MenuSeparator({ className, ...props }: MenuPrimitive.Separator.Props) {\n  return (\n    <MenuPrimitive.Separator className={cn(\"-mx-1 my-1 h-px bg-border\", className)} {...props} />\n  )\n}\n\nfunction MenuShortcut({ className, ...props }: ComponentProps<typeof Kbd>) {\n  return <Kbd className={cn(\"ml-auto\", className)} {...props} />\n}\n\nexport {\n  Menu,\n  MenuCheckboxItem,\n  MenuContent,\n  MenuGroup,\n  MenuItem,\n  MenuGroupLabel,\n  MenuRadioGroup,\n  MenuRadioItem,\n  MenuSeparator,\n  MenuShortcut,\n  MenuTrigger,\n}\n"],"mappings":";;;;;;;;AASA,MAAM,OAAOA,OAAc;AAC3B,MAAM,cAAcA,OAAc;AAClC,MAAM,YAAYA,OAAc;AAChC,MAAM,iBAAiBA,OAAc;AAErC,SAAS,YAAY,EACnB,WACA,aAAa,GACb,OACA,MACA,GAAG,SAEoE;CACvE,OACE,oBAACA,OAAc,QAAf,EAAA,UACE,oBAACA,OAAc,YAAf;EACc;EACL;EACD;EACN,WAAU;EAEV,UAAA,oBAACA,OAAc,OAAf;GACE,WAAW,GACT,8GACA,yBACA,SACF;GACA,GAAI;EACL,CAAA;CACuB,CAAA,EACN,CAAA;AAE1B;AAEA,SAAS,SAAS,EAChB,WACA,OACA,GAAG,SAGF;CACD,OACE,oBAACA,OAAc,MAAf;EACE,WAAW,GACT,8PACA,SAAS,QACT,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,UACA,SACA,GAAG,SACgC;CACnC,OACE,qBAACA,OAAc,cAAf;EACE,WAAW,GACT,yNACA,SACF;EACS;EACT,GAAI;EANN,UAAA,CAQE,oBAAC,QAAD;GAAM,WAAU;GACd,UAAA,oBAACA,OAAc,uBAAf,EAAA,UACE,oBAAC,WAAD,CAAY,CAAA,EACuB,CAAA;EACjC,CAAA,GACL,QACyB;;AAEhC;AAEA,SAAS,cAAc,EAAE,WAAW,UAAU,GAAG,SAAwC;CACvF,OACE,qBAACA,OAAc,WAAf;EACE,WAAW,GACT,yNACA,SACF;EACA,GAAI;EALN,UAAA,CAOE,oBAAC,QAAD;GAAM,WAAU;GACd,UAAA,oBAACA,OAAc,oBAAf,EAAA,UACE,oBAAC,YAAD,EAAY,WAAU,sBAAuB,CAAA,EACb,CAAA;EAC9B,CAAA,GACL,QACsB;;AAE7B;AAEA,SAAS,eAAe,EACtB,WACA,OACA,GAAG,SAGF;CACD,OACE,oBAACA,OAAc,YAAf;EACE,WAAW,GAAG,oBAAoB,gBAAgB,SAAS,QAAQ,SAAS;EAC5E,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,cAAc,EAAE,WAAW,GAAG,SAAwC;CAC7E,OACE,oBAACA,OAAc,WAAf;EAAyB,WAAW,GAAG,6BAA6B,SAAS;EAAG,GAAI;CAAQ,CAAA;AAEhG;AAEA,SAAS,aAAa,EAAE,WAAW,GAAG,SAAqC;CACzE,OAAO,oBAAC,KAAD;EAAK,WAAW,GAAG,WAAW,SAAS;EAAG,GAAI;CAAQ,CAAA;AAC/D"}
+{"version":3,"file":"menu.js","names":["MenuPrimitive"],"sources":["../../src/components/menu.tsx"],"sourcesContent":["\"use client\"\n\nimport { Menu as MenuPrimitive } from \"@base-ui/react/menu\"\nimport type { ComponentProps } from \"react\"\nimport { Kbd } from \"~/components/kbd\"\nimport { controlTextClasses, eyebrowClasses, popoverAnimationClasses } from \"~/lib/classes\"\nimport { CheckIcon, CircleIcon } from \"~/lib/icons\"\nimport { cn } from \"~/lib/variants\"\n\nconst Menu = MenuPrimitive.Root\nconst MenuTrigger = MenuPrimitive.Trigger\nconst MenuGroup = MenuPrimitive.Group\nconst MenuRadioGroup = MenuPrimitive.RadioGroup\n\nfunction MenuContent({\n  className,\n  sideOffset = 4,\n  align,\n  side,\n  ...props\n}: MenuPrimitive.Popup.Props &\n  Pick<MenuPrimitive.Positioner.Props, \"align\" | \"side\" | \"sideOffset\">) {\n  return (\n    <MenuPrimitive.Portal>\n      <MenuPrimitive.Positioner\n        sideOffset={sideOffset}\n        align={align}\n        side={side}\n        className=\"isolate z-50\"\n      >\n        <MenuPrimitive.Popup\n          className={cn(\n            \"min-w-40 flex flex-col rounded-md border bg-popover p-1 text-popover-foreground shadow-sm backdrop-blur-xs\",\n            popoverAnimationClasses,\n            className,\n          )}\n          {...props}\n        />\n      </MenuPrimitive.Positioner>\n    </MenuPrimitive.Portal>\n  )\n}\n\nfunction MenuItem({\n  className,\n  inset,\n  ...props\n}: MenuPrimitive.Item.Props & {\n  inset?: boolean\n}) {\n  return (\n    <MenuPrimitive.Item\n      className={cn(\n        `relative flex m-0 cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-1.5 ${controlTextClasses} outline-hidden focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&>svg]:size-4 [&>svg]:shrink-0`,\n        inset && \"pl-8\",\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction MenuCheckboxItem({\n  className,\n  children,\n  checked,\n  ...props\n}: MenuPrimitive.CheckboxItem.Props) {\n  return (\n    <MenuPrimitive.CheckboxItem\n      className={cn(\n        `relative flex cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 ${controlTextClasses} outline-hidden focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50`,\n        className,\n      )}\n      checked={checked}\n      {...props}\n    >\n      <span className=\"absolute left-2 flex h-3.5 w-3.5 items-center justify-center\">\n        <MenuPrimitive.CheckboxItemIndicator>\n          <CheckIcon />\n        </MenuPrimitive.CheckboxItemIndicator>\n      </span>\n      {children}\n    </MenuPrimitive.CheckboxItem>\n  )\n}\n\nfunction MenuRadioItem({ className, children, ...props }: MenuPrimitive.RadioItem.Props) {\n  return (\n    <MenuPrimitive.RadioItem\n      className={cn(\n        `relative flex cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 ${controlTextClasses} outline-hidden focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50`,\n        className,\n      )}\n      {...props}\n    >\n      <span className=\"absolute left-2 flex size-3.5 items-center justify-center\">\n        <MenuPrimitive.RadioItemIndicator>\n          <CircleIcon className=\"fill-current size-2\" />\n        </MenuPrimitive.RadioItemIndicator>\n      </span>\n      {children}\n    </MenuPrimitive.RadioItem>\n  )\n}\n\nfunction MenuGroupLabel({\n  className,\n  inset,\n  ...props\n}: MenuPrimitive.GroupLabel.Props & {\n  inset?: boolean\n}) {\n  return (\n    <MenuPrimitive.GroupLabel\n      className={cn(\"px-2 pt-1.5 pb-1\", eyebrowClasses, inset && \"pl-8\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction MenuSeparator({ className, ...props }: MenuPrimitive.Separator.Props) {\n  return (\n    <MenuPrimitive.Separator className={cn(\"-mx-1 my-1 h-px bg-border\", className)} {...props} />\n  )\n}\n\nfunction MenuShortcut({ className, ...props }: ComponentProps<typeof Kbd>) {\n  return <Kbd className={cn(\"ml-auto\", className)} {...props} />\n}\n\nexport {\n  Menu,\n  MenuCheckboxItem,\n  MenuContent,\n  MenuGroup,\n  MenuItem,\n  MenuGroupLabel,\n  MenuRadioGroup,\n  MenuRadioItem,\n  MenuSeparator,\n  MenuShortcut,\n  MenuTrigger,\n}\n"],"mappings":";;;;;;;;AASA,MAAM,OAAOA,OAAc;AAC3B,MAAM,cAAcA,OAAc;AAClC,MAAM,YAAYA,OAAc;AAChC,MAAM,iBAAiBA,OAAc;AAErC,SAAS,YAAY,EACnB,WACA,aAAa,GACb,OACA,MACA,GAAG,SAEoE;CACvE,OACE,oBAACA,OAAc,QAAf,EAAA,UACE,oBAACA,OAAc,YAAf;EACc;EACL;EACD;EACN,WAAU;EAEV,UAAA,oBAACA,OAAc,OAAf;GACE,WAAW,GACT,8GACA,yBACA,SACF;GACA,GAAI;EACL,CAAA;CACuB,CAAA,EACN,CAAA;AAE1B;AAEA,SAAS,SAAS,EAChB,WACA,OACA,GAAG,SAGF;CACD,OACE,oBAACA,OAAc,MAAf;EACE,WAAW,GACT,0FAA0F,mBAAmB,0JAC7G,SAAS,QACT,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,iBAAiB,EACxB,WACA,UACA,SACA,GAAG,SACgC;CACnC,OACE,qBAACA,OAAc,cAAf;EACE,WAAW,GACT,qFAAqF,mBAAmB,0HACxG,SACF;EACS;EACT,GAAI;EANN,UAAA,CAQE,oBAAC,QAAD;GAAM,WAAU;GACd,UAAA,oBAACA,OAAc,uBAAf,EAAA,UACE,oBAAC,WAAD,CAAY,CAAA,EACuB,CAAA;EACjC,CAAA,GACL,QACyB;;AAEhC;AAEA,SAAS,cAAc,EAAE,WAAW,UAAU,GAAG,SAAwC;CACvF,OACE,qBAACA,OAAc,WAAf;EACE,WAAW,GACT,qFAAqF,mBAAmB,0HACxG,SACF;EACA,GAAI;EALN,UAAA,CAOE,oBAAC,QAAD;GAAM,WAAU;GACd,UAAA,oBAACA,OAAc,oBAAf,EAAA,UACE,oBAAC,YAAD,EAAY,WAAU,sBAAuB,CAAA,EACb,CAAA;EAC9B,CAAA,GACL,QACsB;;AAE7B;AAEA,SAAS,eAAe,EACtB,WACA,OACA,GAAG,SAGF;CACD,OACE,oBAACA,OAAc,YAAf;EACE,WAAW,GAAG,oBAAoB,gBAAgB,SAAS,QAAQ,SAAS;EAC5E,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,cAAc,EAAE,WAAW,GAAG,SAAwC;CAC7E,OACE,oBAACA,OAAc,WAAf;EAAyB,WAAW,GAAG,6BAA6B,SAAS;EAAG,GAAI;CAAQ,CAAA;AAEhG;AAEA,SAAS,aAAa,EAAE,WAAW,GAAG,SAAqC;CACzE,OAAO,oBAAC,KAAD;EAAK,WAAW,GAAG,WAAW,SAAS;EAAG,GAAI;CAAQ,CAAA;AAC/D"}

package/dist/components/section-header.js

@@ -1,7 +1,7 @@
 import { cn, variants } from "../lib/variants.js";
+import { descriptionClasses } from "../lib/classes.js";
 import { Stack } from "./stack.js";
 import { Heading } from "./heading.js";
-import { descriptionClasses } from "../lib/classes.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useRender } from "@base-ui/react/use-render";
 import { createContext, use } from "react";

package/dist/components/select.js

@@ -1,7 +1,7 @@
 "use client";
 import { cn, variants } from "../lib/variants.js";
+import { controlTextClasses, popoverAnimationClasses } from "../lib/classes.js";
 import { CheckIcon, ChevronDownIcon, ChevronUpIcon, ChevronsUpDownIcon } from "../lib/icons.js";
-import { popoverAnimationClasses } from "../lib/classes.js";
 import { inputVariants } from "./input.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Select as Select$1 } from "@base-ui/react/select";
@@ -74,7 +74,7 @@ function SelectLabel({ className, ...props }) {
 function SelectItem({ className, children, label, ...props }) {
 	return /* @__PURE__ */ jsxs(Select$1.Item, {
 		label: label ?? (typeof children === "string" ? children : void 0),
-		className: cn("relative flex w-full cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-control text-secondary-foreground outline-none focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50", className),
+		className: cn(`relative flex w-full cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 ${controlTextClasses} text-secondary-foreground outline-none focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50`, className),
 		...props,
 		children: [/* @__PURE__ */ jsx("span", {
 			className: "absolute left-2 flex size-3.5 items-center justify-center",

package/dist/components/select.js.map

@@ -1 +1 @@
-{"version":3,"file":"select.js","names":["SelectPrimitive"],"sources":["../../src/components/select.tsx"],"sourcesContent":["\"use client\"\n\nimport { Select as SelectPrimitive } from \"@base-ui/react/select\"\nimport { inputVariants } from \"~/components/input\"\nimport { popoverAnimationClasses } from \"~/lib/classes\"\nimport { CheckIcon, ChevronDownIcon, ChevronUpIcon, ChevronsUpDownIcon } from \"~/lib/icons\"\nimport { variants, cn, type VariantProps } from \"~/lib/variants\"\n\nconst Select = SelectPrimitive.Root\nconst SelectGroup = SelectPrimitive.Group\nconst SelectValue = SelectPrimitive.Value\n\nfunction SelectTrigger({\n  children,\n  className,\n  hover = true,\n  focus = true,\n  size,\n  ...props\n}: SelectPrimitive.Trigger.Props & VariantProps<typeof inputVariants>) {\n  return (\n    <SelectPrimitive.Trigger\n      className={cn(\n        inputVariants({ hover, focus, size }),\n        \"flex items-center justify-between\",\n        className,\n      )}\n      {...props}\n    >\n      <span className=\"truncate\">{children}</span>\n\n      <SelectPrimitive.Icon\n        render={<ChevronsUpDownIcon className=\"ml-1 size-4 shrink-0 opacity-50\" />}\n      />\n    </SelectPrimitive.Trigger>\n  )\n}\n\nfunction SelectScrollUpButton({ className, ...props }: SelectPrimitive.ScrollUpArrow.Props) {\n  return (\n    <SelectPrimitive.ScrollUpArrow\n      className={cn(\"flex cursor-pointer items-center justify-center py-1\", className)}\n      {...props}\n    >\n      <ChevronUpIcon />\n    </SelectPrimitive.ScrollUpArrow>\n  )\n}\n\nfunction SelectScrollDownButton({ className, ...props }: SelectPrimitive.ScrollDownArrow.Props) {\n  return (\n    <SelectPrimitive.ScrollDownArrow\n      className={cn(\"flex cursor-pointer items-center justify-center py-1\", className)}\n      {...props}\n    >\n      <ChevronDownIcon />\n    </SelectPrimitive.ScrollDownArrow>\n  )\n}\n\nconst selectScrollButtonVariants = variants({\n  base: \"absolute inset-x-0 z-10 bg-background animate-in fade-in-0 duration-300\",\n  variants: {\n    position: {\n      top: \"top-0 mask-b-from-0\",\n      bottom: \"bottom-0 mask-t-from-0\",\n    },\n  },\n})\n\nfunction SelectContent({\n  className,\n  children,\n  align,\n  side,\n  sideOffset = 4,\n  alignItemWithTrigger = false,\n  ...props\n}: SelectPrimitive.Popup.Props &\n  Pick<\n    SelectPrimitive.Positioner.Props,\n    \"align\" | \"side\" | \"sideOffset\" | \"alignItemWithTrigger\"\n  >) {\n  return (\n    <SelectPrimitive.Portal>\n      <SelectPrimitive.Positioner\n        sideOffset={sideOffset}\n        align={align}\n        side={side}\n        alignItemWithTrigger={alignItemWithTrigger}\n        className=\"isolate z-50\"\n      >\n        <SelectPrimitive.Popup\n          className={cn(\n            \"relative z-50 isolate max-h-(--available-height) min-w-(--anchor-width) overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md backdrop-blur-xs\",\n            !alignItemWithTrigger && popoverAnimationClasses,\n            className,\n          )}\n          {...props}\n        >\n          <SelectScrollUpButton className={selectScrollButtonVariants({ position: \"top\" })} />\n          <SelectPrimitive.List className=\"p-1\">{children}</SelectPrimitive.List>\n          <SelectScrollDownButton className={selectScrollButtonVariants({ position: \"bottom\" })} />\n        </SelectPrimitive.Popup>\n      </SelectPrimitive.Positioner>\n    </SelectPrimitive.Portal>\n  )\n}\n\nfunction SelectLabel({ className, ...props }: SelectPrimitive.GroupLabel.Props) {\n  return (\n    <SelectPrimitive.GroupLabel\n      className={cn(\"px-2 py-1.5 text-sm font-medium\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction SelectItem({ className, children, label, ...props }: SelectPrimitive.Item.Props) {\n  return (\n    <SelectPrimitive.Item\n      label={label ?? (typeof children === \"string\" ? children : undefined)}\n      className={cn(\n        \"relative flex w-full cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-control text-secondary-foreground outline-none focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50\",\n        className,\n      )}\n      {...props}\n    >\n      <span className=\"absolute left-2 flex size-3.5 items-center justify-center\">\n        <SelectPrimitive.ItemIndicator>\n          <CheckIcon className=\"size-4\" />\n        </SelectPrimitive.ItemIndicator>\n      </span>\n      <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n    </SelectPrimitive.Item>\n  )\n}\n\nfunction SelectSeparator({ className, ...props }: SelectPrimitive.Separator.Props) {\n  return (\n    <SelectPrimitive.Separator className={cn(\"-mx-1 my-1 h-px bg-border\", className)} {...props} />\n  )\n}\n\nexport {\n  Select,\n  SelectGroup,\n  SelectValue,\n  SelectTrigger,\n  SelectContent,\n  SelectLabel,\n  SelectItem,\n  SelectSeparator,\n  SelectScrollUpButton,\n  SelectScrollDownButton,\n}\n"],"mappings":";;;;;;;;AAQA,MAAM,SAASA,SAAgB;AAC/B,MAAM,cAAcA,SAAgB;AACpC,MAAM,cAAcA,SAAgB;AAEpC,SAAS,cAAc,EACrB,UACA,WACA,QAAQ,MACR,QAAQ,MACR,MACA,GAAG,SACkE;CACrE,OACE,qBAACA,SAAgB,SAAjB;EACE,WAAW,GACT,cAAc;GAAE;GAAO;GAAO;EAAK,CAAC,GACpC,qCACA,SACF;EACA,GAAI;EANN,UAAA,CAQE,oBAAC,QAAD;GAAM,WAAU;GAAY;EAAe,CAAA,GAE3C,oBAACA,SAAgB,MAAjB,EACE,QAAQ,oBAAC,oBAAD,EAAoB,WAAU,kCAAmC,CAAA,EAC1E,CAAA,CACsB;;AAE7B;AAEA,SAAS,qBAAqB,EAAE,WAAW,GAAG,SAA8C;CAC1F,OACE,oBAACA,SAAgB,eAAjB;EACE,WAAW,GAAG,wDAAwD,SAAS;EAC/E,GAAI;EAEJ,UAAA,oBAAC,eAAD,CAAgB,CAAA;CACa,CAAA;AAEnC;AAEA,SAAS,uBAAuB,EAAE,WAAW,GAAG,SAAgD;CAC9F,OACE,oBAACA,SAAgB,iBAAjB;EACE,WAAW,GAAG,wDAAwD,SAAS;EAC/E,GAAI;EAEJ,UAAA,oBAAC,iBAAD,CAAkB,CAAA;CACa,CAAA;AAErC;AAEA,MAAM,6BAA6B,SAAS;CAC1C,MAAM;CACN,UAAU,EACR,UAAU;EACR,KAAK;EACL,QAAQ;CACV,EACF;AACF,CAAC;AAED,SAAS,cAAc,EACrB,WACA,UACA,OACA,MACA,aAAa,GACb,uBAAuB,OACvB,GAAG,SAKA;CACH,OACE,oBAACA,SAAgB,QAAjB,EAAA,UACE,oBAACA,SAAgB,YAAjB;EACc;EACL;EACD;EACgB;EACtB,WAAU;EAEV,UAAA,qBAACA,SAAgB,OAAjB;GACE,WAAW,GACT,2KACA,CAAC,wBAAwB,yBACzB,SACF;GACA,GAAI;GANN,UAAA;IAQE,oBAAC,sBAAD,EAAsB,WAAW,2BAA2B,EAAE,UAAU,MAAM,CAAC,EAAI,CAAA;IACnF,oBAACA,SAAgB,MAAjB;KAAsB,WAAU;KAAO;IAA+B,CAAA;IACtE,oBAAC,wBAAD,EAAwB,WAAW,2BAA2B,EAAE,UAAU,SAAS,CAAC,EAAI,CAAA;GACnE;;CACG,CAAA,EACN,CAAA;AAE5B;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAA2C;CAC9E,OACE,oBAACA,SAAgB,YAAjB;EACE,WAAW,GAAG,mCAAmC,SAAS;EAC1D,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,UAAU,OAAO,GAAG,SAAqC;CACxF,OACE,qBAACA,SAAgB,MAAjB;EACE,OAAO,UAAU,OAAO,aAAa,WAAW,WAAW,KAAA;EAC3D,WAAW,GACT,wPACA,SACF;EACA,GAAI;EANN,UAAA,CAQE,oBAAC,QAAD;GAAM,WAAU;GACd,UAAA,oBAACA,SAAgB,eAAjB,EAAA,UACE,oBAAC,WAAD,EAAW,WAAU,SAAU,CAAA,EACF,CAAA;EAC3B,CAAA,GACN,oBAACA,SAAgB,UAAjB,EAA2B,SAAmC,CAAA,CAC1C;;AAE1B;AAEA,SAAS,gBAAgB,EAAE,WAAW,GAAG,SAA0C;CACjF,OACE,oBAACA,SAAgB,WAAjB;EAA2B,WAAW,GAAG,6BAA6B,SAAS;EAAG,GAAI;CAAQ,CAAA;AAElG"}
+{"version":3,"file":"select.js","names":["SelectPrimitive"],"sources":["../../src/components/select.tsx"],"sourcesContent":["\"use client\"\n\nimport { Select as SelectPrimitive } from \"@base-ui/react/select\"\nimport { inputVariants } from \"~/components/input\"\nimport { controlTextClasses, popoverAnimationClasses } from \"~/lib/classes\"\nimport { CheckIcon, ChevronDownIcon, ChevronUpIcon, ChevronsUpDownIcon } from \"~/lib/icons\"\nimport { variants, cn, type VariantProps } from \"~/lib/variants\"\n\nconst Select = SelectPrimitive.Root\nconst SelectGroup = SelectPrimitive.Group\nconst SelectValue = SelectPrimitive.Value\n\nfunction SelectTrigger({\n  children,\n  className,\n  hover = true,\n  focus = true,\n  size,\n  ...props\n}: SelectPrimitive.Trigger.Props & VariantProps<typeof inputVariants>) {\n  return (\n    <SelectPrimitive.Trigger\n      className={cn(\n        inputVariants({ hover, focus, size }),\n        \"flex items-center justify-between\",\n        className,\n      )}\n      {...props}\n    >\n      <span className=\"truncate\">{children}</span>\n\n      <SelectPrimitive.Icon\n        render={<ChevronsUpDownIcon className=\"ml-1 size-4 shrink-0 opacity-50\" />}\n      />\n    </SelectPrimitive.Trigger>\n  )\n}\n\nfunction SelectScrollUpButton({ className, ...props }: SelectPrimitive.ScrollUpArrow.Props) {\n  return (\n    <SelectPrimitive.ScrollUpArrow\n      className={cn(\"flex cursor-pointer items-center justify-center py-1\", className)}\n      {...props}\n    >\n      <ChevronUpIcon />\n    </SelectPrimitive.ScrollUpArrow>\n  )\n}\n\nfunction SelectScrollDownButton({ className, ...props }: SelectPrimitive.ScrollDownArrow.Props) {\n  return (\n    <SelectPrimitive.ScrollDownArrow\n      className={cn(\"flex cursor-pointer items-center justify-center py-1\", className)}\n      {...props}\n    >\n      <ChevronDownIcon />\n    </SelectPrimitive.ScrollDownArrow>\n  )\n}\n\nconst selectScrollButtonVariants = variants({\n  base: \"absolute inset-x-0 z-10 bg-background animate-in fade-in-0 duration-300\",\n  variants: {\n    position: {\n      top: \"top-0 mask-b-from-0\",\n      bottom: \"bottom-0 mask-t-from-0\",\n    },\n  },\n})\n\nfunction SelectContent({\n  className,\n  children,\n  align,\n  side,\n  sideOffset = 4,\n  alignItemWithTrigger = false,\n  ...props\n}: SelectPrimitive.Popup.Props &\n  Pick<\n    SelectPrimitive.Positioner.Props,\n    \"align\" | \"side\" | \"sideOffset\" | \"alignItemWithTrigger\"\n  >) {\n  return (\n    <SelectPrimitive.Portal>\n      <SelectPrimitive.Positioner\n        sideOffset={sideOffset}\n        align={align}\n        side={side}\n        alignItemWithTrigger={alignItemWithTrigger}\n        className=\"isolate z-50\"\n      >\n        <SelectPrimitive.Popup\n          className={cn(\n            \"relative z-50 isolate max-h-(--available-height) min-w-(--anchor-width) overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md backdrop-blur-xs\",\n            !alignItemWithTrigger && popoverAnimationClasses,\n            className,\n          )}\n          {...props}\n        >\n          <SelectScrollUpButton className={selectScrollButtonVariants({ position: \"top\" })} />\n          <SelectPrimitive.List className=\"p-1\">{children}</SelectPrimitive.List>\n          <SelectScrollDownButton className={selectScrollButtonVariants({ position: \"bottom\" })} />\n        </SelectPrimitive.Popup>\n      </SelectPrimitive.Positioner>\n    </SelectPrimitive.Portal>\n  )\n}\n\nfunction SelectLabel({ className, ...props }: SelectPrimitive.GroupLabel.Props) {\n  return (\n    <SelectPrimitive.GroupLabel\n      className={cn(\"px-2 py-1.5 text-sm font-medium\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction SelectItem({ className, children, label, ...props }: SelectPrimitive.Item.Props) {\n  return (\n    <SelectPrimitive.Item\n      label={label ?? (typeof children === \"string\" ? children : undefined)}\n      className={cn(\n        `relative flex w-full cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 ${controlTextClasses} text-secondary-foreground outline-none focus:bg-accent focus:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50`,\n        className,\n      )}\n      {...props}\n    >\n      <span className=\"absolute left-2 flex size-3.5 items-center justify-center\">\n        <SelectPrimitive.ItemIndicator>\n          <CheckIcon className=\"size-4\" />\n        </SelectPrimitive.ItemIndicator>\n      </span>\n      <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n    </SelectPrimitive.Item>\n  )\n}\n\nfunction SelectSeparator({ className, ...props }: SelectPrimitive.Separator.Props) {\n  return (\n    <SelectPrimitive.Separator className={cn(\"-mx-1 my-1 h-px bg-border\", className)} {...props} />\n  )\n}\n\nexport {\n  Select,\n  SelectGroup,\n  SelectValue,\n  SelectTrigger,\n  SelectContent,\n  SelectLabel,\n  SelectItem,\n  SelectSeparator,\n  SelectScrollUpButton,\n  SelectScrollDownButton,\n}\n"],"mappings":";;;;;;;;AAQA,MAAM,SAASA,SAAgB;AAC/B,MAAM,cAAcA,SAAgB;AACpC,MAAM,cAAcA,SAAgB;AAEpC,SAAS,cAAc,EACrB,UACA,WACA,QAAQ,MACR,QAAQ,MACR,MACA,GAAG,SACkE;CACrE,OACE,qBAACA,SAAgB,SAAjB;EACE,WAAW,GACT,cAAc;GAAE;GAAO;GAAO;EAAK,CAAC,GACpC,qCACA,SACF;EACA,GAAI;EANN,UAAA,CAQE,oBAAC,QAAD;GAAM,WAAU;GAAY;EAAe,CAAA,GAE3C,oBAACA,SAAgB,MAAjB,EACE,QAAQ,oBAAC,oBAAD,EAAoB,WAAU,kCAAmC,CAAA,EAC1E,CAAA,CACsB;;AAE7B;AAEA,SAAS,qBAAqB,EAAE,WAAW,GAAG,SAA8C;CAC1F,OACE,oBAACA,SAAgB,eAAjB;EACE,WAAW,GAAG,wDAAwD,SAAS;EAC/E,GAAI;EAEJ,UAAA,oBAAC,eAAD,CAAgB,CAAA;CACa,CAAA;AAEnC;AAEA,SAAS,uBAAuB,EAAE,WAAW,GAAG,SAAgD;CAC9F,OACE,oBAACA,SAAgB,iBAAjB;EACE,WAAW,GAAG,wDAAwD,SAAS;EAC/E,GAAI;EAEJ,UAAA,oBAAC,iBAAD,CAAkB,CAAA;CACa,CAAA;AAErC;AAEA,MAAM,6BAA6B,SAAS;CAC1C,MAAM;CACN,UAAU,EACR,UAAU;EACR,KAAK;EACL,QAAQ;CACV,EACF;AACF,CAAC;AAED,SAAS,cAAc,EACrB,WACA,UACA,OACA,MACA,aAAa,GACb,uBAAuB,OACvB,GAAG,SAKA;CACH,OACE,oBAACA,SAAgB,QAAjB,EAAA,UACE,oBAACA,SAAgB,YAAjB;EACc;EACL;EACD;EACgB;EACtB,WAAU;EAEV,UAAA,qBAACA,SAAgB,OAAjB;GACE,WAAW,GACT,2KACA,CAAC,wBAAwB,yBACzB,SACF;GACA,GAAI;GANN,UAAA;IAQE,oBAAC,sBAAD,EAAsB,WAAW,2BAA2B,EAAE,UAAU,MAAM,CAAC,EAAI,CAAA;IACnF,oBAACA,SAAgB,MAAjB;KAAsB,WAAU;KAAO;IAA+B,CAAA;IACtE,oBAAC,wBAAD,EAAwB,WAAW,2BAA2B,EAAE,UAAU,SAAS,CAAC,EAAI,CAAA;GACnE;;CACG,CAAA,EACN,CAAA;AAE5B;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAA2C;CAC9E,OACE,oBAACA,SAAgB,YAAjB;EACE,WAAW,GAAG,mCAAmC,SAAS;EAC1D,GAAI;CACL,CAAA;AAEL;AAEA,SAAS,WAAW,EAAE,WAAW,UAAU,OAAO,GAAG,SAAqC;CACxF,OACE,qBAACA,SAAgB,MAAjB;EACE,OAAO,UAAU,OAAO,aAAa,WAAW,WAAW,KAAA;EAC3D,WAAW,GACT,4FAA4F,mBAAmB,kJAC/G,SACF;EACA,GAAI;EANN,UAAA,CAQE,oBAAC,QAAD;GAAM,WAAU;GACd,UAAA,oBAACA,SAAgB,eAAjB,EAAA,UACE,oBAAC,WAAD,EAAW,WAAU,SAAU,CAAA,EACF,CAAA;EAC3B,CAAA,GACN,oBAACA,SAAgB,UAAjB,EAA2B,SAAmC,CAAA,CAC1C;;AAE1B;AAEA,SAAS,gBAAgB,EAAE,WAAW,GAAG,SAA0C;CACjF,OACE,oBAACA,SAAgB,WAAjB;EAA2B,WAAW,GAAG,6BAA6B,SAAS;EAAG,GAAI;CAAQ,CAAA;AAElG"}

package/dist/components/tabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.d.ts","names":[],"sources":["../../src/components/tabs.tsx"],"mappings":";;;cAOM,sBAAI,0BAAA,8BAAA,wCAAA,cAAA;cAEJ,8CAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAyDjB,gBAAgB,OAAc,KAAK,QAAQ,oBAAoB;iBAE3D,WAAW,WAAW,UAAU,YAA0B,SAAS,gCAAa,IAAA;iBAchF,cAAc,cAAc,SAAS,OAAc,IAAI,wBAAK,IAAA"}
+{"version":3,"file":"tabs.d.ts","names":[],"sources":["../../src/components/tabs.tsx"],"mappings":";;;cAQM,sBAAI,0BAAA,8BAAA,wCAAA,cAAA;cAEJ,8CAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAyDjB,gBAAgB,OAAc,KAAK,QAAQ,oBAAoB;iBAE3D,WAAW,WAAW,UAAU,YAA0B,SAAS,gCAAa,IAAA;iBAchF,cAAc,cAAc,SAAS,OAAc,IAAI,wBAAK,IAAA"}

package/dist/components/tabs.js

@@ -1,5 +1,6 @@
 "use client";
 import { cn, variants } from "../lib/variants.js";
+import { controlTextClasses } from "../lib/classes.js";
 import { interactiveVariants } from "../lib/interactive.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { createContext, useContext } from "react";
@@ -16,7 +17,7 @@ const tabsListVariants = variants({
 		segmented: {
 			list: "h-control justify-center rounded-md border bg-card p-[3px]",
 			indicator: "rounded-[3px] bg-muted",
-			trigger: "rounded-[3px] px-2.5 py-[5px] text-control"
+			trigger: `rounded-[3px] px-2.5 py-[5px] ${controlTextClasses}`
 		},
 		plain: {
 			list: "gap-0.5",

package/dist/components/tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.js","names":["TabsPrimitive"],"sources":["../../src/components/tabs.tsx"],"sourcesContent":["\"use client\"\n\nimport { Tabs as TabsPrimitive } from \"@base-ui/react/tabs\"\nimport { createContext, useContext } from \"react\"\nimport { interactiveVariants } from \"~/lib/interactive\"\nimport { cn, variants, type VariantProps } from \"~/lib/variants\"\n\nconst Tabs = TabsPrimitive.Root\n\nconst tabsListVariants = variants({\n  slots: {\n    list: \"relative inline-flex items-center text-muted-foreground\",\n    indicator:\n      \"absolute top-1/2 left-0 z-0 h-[var(--active-tab-height)] w-[var(--active-tab-width)] -translate-y-1/2 translate-x-[var(--active-tab-left)] rounded-md transition-[translate,width] duration-500 ease-out-expo\",\n    trigger: cn(\n      interactiveVariants({ focus: true }),\n      \"relative z-10 inline-flex items-center justify-center whitespace-nowrap rounded-md font-medium disabled:pointer-events-none disabled:opacity-50 hover:text-foreground data-active:text-foreground\",\n    ),\n  },\n\n  variants: {\n    variant: {\n      // Segmented control, sized like an `md` Button so it sits flush beside one in a header:\n      // the same 13px text, the same `--spacing-control` height, and a 6px outer radius over a\n      // 3px inset (so the inner pill radius is 3px).\n      segmented: {\n        list: \"h-control justify-center rounded-md border bg-card p-[3px]\",\n        indicator: \"rounded-[3px] bg-muted\",\n        trigger: \"rounded-[3px] px-2.5 py-[5px] text-control\",\n      },\n      // Plain pills: no track, the active tab sits on a soft pill. For in-card view switchers.\n      plain: {\n        list: \"gap-0.5\",\n        indicator: \"bg-muted\",\n        trigger: \"px-2.5 py-1.5 text-sm\",\n      },\n    },\n  },\n\n  defaultVariants: {\n    variant: \"segmented\",\n  },\n})\n\ntype TabsVariant = NonNullable<VariantProps<typeof tabsListVariants>[\"variant\"]>\n\nconst TabsVariantContext = createContext<TabsVariant>(\"segmented\")\n\n/**\n * Sliding highlight that tracks the active tab via Base UI's --active-tab-*\n * CSS variables. Rendered automatically by TabsList, so every tab group shares\n * one pill. Duration/easing mirror the library's one motion curve — the\n * `--ease-out-expo` token, duplicated for JS in `~/lib/animation` — so the pill\n * glides in sync with the number spins and chart draws it sits beside.\n */\nfunction TabsIndicator({ className, ...props }: TabsPrimitive.Indicator.Props) {\n  const variant = useContext(TabsVariantContext)\n\n  return (\n    <TabsPrimitive.Indicator\n      className={cn(tabsListVariants({ variant }).indicator(), className)}\n      {...props}\n    />\n  )\n}\n\ntype TabsListProps = TabsPrimitive.List.Props & VariantProps<typeof tabsListVariants>\n\nfunction TabsList({ className, children, variant = \"segmented\", ...props }: TabsListProps) {\n  return (\n    <TabsVariantContext value={variant}>\n      <TabsPrimitive.List\n        className={cn(tabsListVariants({ variant }).list(), className)}\n        {...props}\n      >\n        <TabsIndicator />\n        {children}\n      </TabsPrimitive.List>\n    </TabsVariantContext>\n  )\n}\n\nfunction TabsTrigger({ className, ...props }: TabsPrimitive.Tab.Props) {\n  const variant = useContext(TabsVariantContext)\n\n  return (\n    <TabsPrimitive.Tab\n      className={cn(tabsListVariants({ variant }).trigger(), className)}\n      {...props}\n    />\n  )\n}\n\nexport { Tabs, TabsList, TabsTrigger }\n"],"mappings":";;;;;;;AAOA,MAAM,OAAOA,OAAc;AAE3B,MAAM,mBAAmB,SAAS;CAChC,OAAO;EACL,MAAM;EACN,WACE;EACF,SAAS,GACP,oBAAoB,EAAE,OAAO,KAAK,CAAC,GACnC,mMACF;CACF;CAEA,UAAU,EACR,SAAS;EAIP,WAAW;GACT,MAAM;GACN,WAAW;GACX,SAAS;EACX;EAEA,OAAO;GACL,MAAM;GACN,WAAW;GACX,SAAS;EACX;CACF,EACF;CAEA,iBAAiB,EACf,SAAS,YACX;AACF,CAAC;AAID,MAAM,qBAAqB,cAA2B,WAAW;;;;;;;;AASjE,SAAS,cAAc,EAAE,WAAW,GAAG,SAAwC;CAC7E,MAAM,UAAU,WAAW,kBAAkB;CAE7C,OACE,oBAACA,OAAc,WAAf;EACE,WAAW,GAAG,iBAAiB,EAAE,QAAQ,CAAC,CAAC,CAAC,UAAU,GAAG,SAAS;EAClE,GAAI;CACL,CAAA;AAEL;AAIA,SAAS,SAAS,EAAE,WAAW,UAAU,UAAU,aAAa,GAAG,SAAwB;CACzF,OACE,oBAAC,oBAAD;EAAoB,OAAO;EACzB,UAAA,qBAACA,OAAc,MAAf;GACE,WAAW,GAAG,iBAAiB,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,GAAG,SAAS;GAC7D,GAAI;GAFN,UAAA,CAIE,oBAAC,eAAD,CAAgB,CAAA,GACf,QACiB;;CACF,CAAA;AAExB;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAkC;CACrE,MAAM,UAAU,WAAW,kBAAkB;CAE7C,OACE,oBAACA,OAAc,KAAf;EACE,WAAW,GAAG,iBAAiB,EAAE,QAAQ,CAAC,CAAC,CAAC,QAAQ,GAAG,SAAS;EAChE,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"tabs.js","names":["TabsPrimitive"],"sources":["../../src/components/tabs.tsx"],"sourcesContent":["\"use client\"\n\nimport { Tabs as TabsPrimitive } from \"@base-ui/react/tabs\"\nimport { createContext, useContext } from \"react\"\nimport { controlTextClasses } from \"~/lib/classes\"\nimport { interactiveVariants } from \"~/lib/interactive\"\nimport { cn, variants, type VariantProps } from \"~/lib/variants\"\n\nconst Tabs = TabsPrimitive.Root\n\nconst tabsListVariants = variants({\n  slots: {\n    list: \"relative inline-flex items-center text-muted-foreground\",\n    indicator:\n      \"absolute top-1/2 left-0 z-0 h-[var(--active-tab-height)] w-[var(--active-tab-width)] -translate-y-1/2 translate-x-[var(--active-tab-left)] rounded-md transition-[translate,width] duration-500 ease-out-expo\",\n    trigger: cn(\n      interactiveVariants({ focus: true }),\n      \"relative z-10 inline-flex items-center justify-center whitespace-nowrap rounded-md font-medium disabled:pointer-events-none disabled:opacity-50 hover:text-foreground data-active:text-foreground\",\n    ),\n  },\n\n  variants: {\n    variant: {\n      // Segmented control, sized like an `md` Button so it sits flush beside one in a header:\n      // the same 13px text, the same `--spacing-control` height, and a 6px outer radius over a\n      // 3px inset (so the inner pill radius is 3px).\n      segmented: {\n        list: \"h-control justify-center rounded-md border bg-card p-[3px]\",\n        indicator: \"rounded-[3px] bg-muted\",\n        trigger: `rounded-[3px] px-2.5 py-[5px] ${controlTextClasses}`,\n      },\n      // Plain pills: no track, the active tab sits on a soft pill. For in-card view switchers.\n      plain: {\n        list: \"gap-0.5\",\n        indicator: \"bg-muted\",\n        trigger: \"px-2.5 py-1.5 text-sm\",\n      },\n    },\n  },\n\n  defaultVariants: {\n    variant: \"segmented\",\n  },\n})\n\ntype TabsVariant = NonNullable<VariantProps<typeof tabsListVariants>[\"variant\"]>\n\nconst TabsVariantContext = createContext<TabsVariant>(\"segmented\")\n\n/**\n * Sliding highlight that tracks the active tab via Base UI's --active-tab-*\n * CSS variables. Rendered automatically by TabsList, so every tab group shares\n * one pill. Duration/easing mirror the library's one motion curve — the\n * `--ease-out-expo` token, duplicated for JS in `~/lib/animation` — so the pill\n * glides in sync with the number spins and chart draws it sits beside.\n */\nfunction TabsIndicator({ className, ...props }: TabsPrimitive.Indicator.Props) {\n  const variant = useContext(TabsVariantContext)\n\n  return (\n    <TabsPrimitive.Indicator\n      className={cn(tabsListVariants({ variant }).indicator(), className)}\n      {...props}\n    />\n  )\n}\n\ntype TabsListProps = TabsPrimitive.List.Props & VariantProps<typeof tabsListVariants>\n\nfunction TabsList({ className, children, variant = \"segmented\", ...props }: TabsListProps) {\n  return (\n    <TabsVariantContext value={variant}>\n      <TabsPrimitive.List\n        className={cn(tabsListVariants({ variant }).list(), className)}\n        {...props}\n      >\n        <TabsIndicator />\n        {children}\n      </TabsPrimitive.List>\n    </TabsVariantContext>\n  )\n}\n\nfunction TabsTrigger({ className, ...props }: TabsPrimitive.Tab.Props) {\n  const variant = useContext(TabsVariantContext)\n\n  return (\n    <TabsPrimitive.Tab\n      className={cn(tabsListVariants({ variant }).trigger(), className)}\n      {...props}\n    />\n  )\n}\n\nexport { Tabs, TabsList, TabsTrigger }\n"],"mappings":";;;;;;;;AAQA,MAAM,OAAOA,OAAc;AAE3B,MAAM,mBAAmB,SAAS;CAChC,OAAO;EACL,MAAM;EACN,WACE;EACF,SAAS,GACP,oBAAoB,EAAE,OAAO,KAAK,CAAC,GACnC,mMACF;CACF;CAEA,UAAU,EACR,SAAS;EAIP,WAAW;GACT,MAAM;GACN,WAAW;GACX,SAAS,iCAAiC;EAC5C;EAEA,OAAO;GACL,MAAM;GACN,WAAW;GACX,SAAS;EACX;CACF,EACF;CAEA,iBAAiB,EACf,SAAS,YACX;AACF,CAAC;AAID,MAAM,qBAAqB,cAA2B,WAAW;;;;;;;;AASjE,SAAS,cAAc,EAAE,WAAW,GAAG,SAAwC;CAC7E,MAAM,UAAU,WAAW,kBAAkB;CAE7C,OACE,oBAACA,OAAc,WAAf;EACE,WAAW,GAAG,iBAAiB,EAAE,QAAQ,CAAC,CAAC,CAAC,UAAU,GAAG,SAAS;EAClE,GAAI;CACL,CAAA;AAEL;AAIA,SAAS,SAAS,EAAE,WAAW,UAAU,UAAU,aAAa,GAAG,SAAwB;CACzF,OACE,oBAAC,oBAAD;EAAoB,OAAO;EACzB,UAAA,qBAACA,OAAc,MAAf;GACE,WAAW,GAAG,iBAAiB,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,GAAG,SAAS;GAC7D,GAAI;GAFN,UAAA,CAIE,oBAAC,eAAD,CAAgB,CAAA,GACf,QACiB;;CACF,CAAA;AAExB;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAkC;CACrE,MAAM,UAAU,WAAW,kBAAkB;CAE7C,OACE,oBAACA,OAAc,KAAf;EACE,WAAW,GAAG,iBAAiB,EAAE,QAAQ,CAAC,CAAC,CAAC,QAAQ,GAAG,SAAS;EAChE,GAAI;CACL,CAAA;AAEL"}

package/dist/components/toaster.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"toaster.d.ts","names":[],"sources":["../../src/components/toaster.tsx"],"mappings":";;;wBAQgB,UAAU,cAAc,SAAS,sBAAsB,6BAAO,IAAA"}
+{"version":3,"file":"toaster.d.ts","names":[],"sources":["../../src/components/toaster.tsx"],"mappings":";;;wBASgB,UAAU,cAAc,SAAS,sBAAsB,6BAAO,IAAA"}

package/dist/components/toaster.js

@@ -1,4 +1,5 @@
 import { cn } from "../lib/variants.js";
+import { controlTextClasses } from "../lib/classes.js";
 import { CircleCheckIcon, CircleHelpIcon, CircleXIcon, LoaderIcon } from "../lib/icons.js";
 import { jsx } from "react/jsx-runtime";
 import { Toaster as Toaster$1 } from "sonner";
@@ -12,7 +13,7 @@ function Toaster({ className, ...props }) {
 		toastOptions: {
 			unstyled: true,
 			classNames: {
-				toast: cn("flex items-start gap-2 p-4 text-control font-medium rounded-lg shadow-sm", className),
+				toast: cn(`flex items-start gap-2 p-4 ${controlTextClasses} font-medium rounded-lg shadow-sm`, className),
 				default: "bg-background border border-border text-foreground",
 				info: cn("bg-foreground text-background", toastRingClasses),
 				success: cn("bg-success text-white", toastRingClasses),

package/dist/components/toaster.js.map

@@ -1 +1 @@
-{"version":3,"file":"toaster.js","names":["Sonner"],"sources":["../../src/components/toaster.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\"\nimport { Toaster as Sonner } from \"sonner\"\nimport { CircleCheckIcon, CircleHelpIcon, CircleXIcon, LoaderIcon } from \"~/lib/icons\"\nimport { cn } from \"~/lib/variants\"\n\n/** The halo that lifts a solid-colored toast off whatever it floats over. */\nconst toastRingClasses = \"ring ring-background/50\"\n\nexport function Toaster({ className, ...props }: ComponentProps<typeof Sonner>) {\n  return (\n    <Sonner\n      className=\"pointer-events-auto\"\n      offset={16}\n      toastOptions={{\n        unstyled: true,\n        classNames: {\n          /*\n           * Sonner joins `toast` with exactly one type key per toast (`default` for untyped\n           * ones) as a plain string, so tailwind-merge never sees the pair. Anything that\n           * differs per type — background, text, halo — therefore lives on the type keys\n           * only, and never gets cancelled here.\n           */\n          toast: cn(\n            \"flex items-start gap-2 p-4 text-control font-medium rounded-lg shadow-sm\",\n            className,\n          ),\n          default: \"bg-background border border-border text-foreground\",\n          info: cn(\"bg-foreground text-background\", toastRingClasses),\n          success: cn(\"bg-success text-white\", toastRingClasses),\n          error: cn(\"bg-danger text-white\", toastRingClasses),\n          content: \"w-full\",\n          description: \"font-normal opacity-80\",\n          icon: \"mt-0.5\",\n        },\n      }}\n      icons={{\n        info: <CircleHelpIcon className=\"size-4\" />,\n        success: <CircleCheckIcon className=\"size-4\" />,\n        error: <CircleXIcon className=\"size-4\" />,\n        loading: <LoaderIcon className=\"size-4 animate-spin\" />,\n      }}\n      {...props}\n    />\n  )\n}\n"],"mappings":";;;;;;AAMA,MAAM,mBAAmB;AAEzB,SAAgB,QAAQ,EAAE,WAAW,GAAG,SAAwC;CAC9E,OACE,oBAACA,WAAD;EACE,WAAU;EACV,QAAQ;EACR,cAAc;GACZ,UAAU;GACV,YAAY;IAOV,OAAO,GACL,4EACA,SACF;IACA,SAAS;IACT,MAAM,GAAG,iCAAiC,gBAAgB;IAC1D,SAAS,GAAG,yBAAyB,gBAAgB;IACrD,OAAO,GAAG,wBAAwB,gBAAgB;IAClD,SAAS;IACT,aAAa;IACb,MAAM;GACR;EACF;EACA,OAAO;GACL,MAAM,oBAAC,gBAAD,EAAgB,WAAU,SAAU,CAAA;GAC1C,SAAS,oBAAC,iBAAD,EAAiB,WAAU,SAAU,CAAA;GAC9C,OAAO,oBAAC,aAAD,EAAa,WAAU,SAAU,CAAA;GACxC,SAAS,oBAAC,YAAD,EAAY,WAAU,sBAAuB,CAAA;EACxD;EACA,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"toaster.js","names":["Sonner"],"sources":["../../src/components/toaster.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\"\nimport { Toaster as Sonner } from \"sonner\"\nimport { controlTextClasses } from \"~/lib/classes\"\nimport { CircleCheckIcon, CircleHelpIcon, CircleXIcon, LoaderIcon } from \"~/lib/icons\"\nimport { cn } from \"~/lib/variants\"\n\n/** The halo that lifts a solid-colored toast off whatever it floats over. */\nconst toastRingClasses = \"ring ring-background/50\"\n\nexport function Toaster({ className, ...props }: ComponentProps<typeof Sonner>) {\n  return (\n    <Sonner\n      className=\"pointer-events-auto\"\n      offset={16}\n      toastOptions={{\n        unstyled: true,\n        classNames: {\n          /*\n           * Sonner joins `toast` with exactly one type key per toast (`default` for untyped\n           * ones) as a plain string, so tailwind-merge never sees the pair. Anything that\n           * differs per type — background, text, halo — therefore lives on the type keys\n           * only, and never gets cancelled here.\n           */\n          toast: cn(\n            `flex items-start gap-2 p-4 ${controlTextClasses} font-medium rounded-lg shadow-sm`,\n            className,\n          ),\n          default: \"bg-background border border-border text-foreground\",\n          info: cn(\"bg-foreground text-background\", toastRingClasses),\n          success: cn(\"bg-success text-white\", toastRingClasses),\n          error: cn(\"bg-danger text-white\", toastRingClasses),\n          content: \"w-full\",\n          description: \"font-normal opacity-80\",\n          icon: \"mt-0.5\",\n        },\n      }}\n      icons={{\n        info: <CircleHelpIcon className=\"size-4\" />,\n        success: <CircleCheckIcon className=\"size-4\" />,\n        error: <CircleXIcon className=\"size-4\" />,\n        loading: <LoaderIcon className=\"size-4 animate-spin\" />,\n      }}\n      {...props}\n    />\n  )\n}\n"],"mappings":";;;;;;;AAOA,MAAM,mBAAmB;AAEzB,SAAgB,QAAQ,EAAE,WAAW,GAAG,SAAwC;CAC9E,OACE,oBAACA,WAAD;EACE,WAAU;EACV,QAAQ;EACR,cAAc;GACZ,UAAU;GACV,YAAY;IAOV,OAAO,GACL,8BAA8B,mBAAmB,oCACjD,SACF;IACA,SAAS;IACT,MAAM,GAAG,iCAAiC,gBAAgB;IAC1D,SAAS,GAAG,yBAAyB,gBAAgB;IACrD,OAAO,GAAG,wBAAwB,gBAAgB;IAClD,SAAS;IACT,aAAa;IACb,MAAM;GACR;EACF;EACA,OAAO;GACL,MAAM,oBAAC,gBAAD,EAAgB,WAAU,SAAU,CAAA;GAC1C,SAAS,oBAAC,iBAAD,EAAiB,WAAU,SAAU,CAAA;GAC9C,OAAO,oBAAC,aAAD,EAAa,WAAU,SAAU,CAAA;GACxC,SAAS,oBAAC,YAAD,EAAY,WAAU,sBAAuB,CAAA;EACxD;EACA,GAAI;CACL,CAAA;AAEL"}

package/dist/lib/classes.d.ts

@@ -25,5 +25,15 @@ export declare const eyebrowClasses = "text-[0.6875rem]/tight font-medium text-m
  * size the settings rows already use, so a form reads the same in either layout.
  */
 export declare const descriptionClasses = "text-pretty text-muted-foreground text-sm";
+/**
+ * The default control font size + line height (buttons, inputs, selects, menu items, tabs,
+ * toasts). Written as an arbitrary `length:` font-size plus a paired `leading-*` rather than
+ * a `text-control` theme utility on purpose: a *named* custom text size is invisible to the
+ * class-merge engines (`cn` and tailwind-variants' twMerge), which fall back to treating
+ * `text-control` as a text COLOR and drop it the moment a variant adds its own
+ * `text-secondary-foreground`/`text-background`/... , leaving the control to inherit the
+ * page's 16px. The `length:` hint keeps it classified as a font-size so it survives the merge.
+ */
+export declare const controlTextClasses = "text-(length:--text-control) leading-(--text-control--line-height)";
 //#endregion
 //# sourceMappingURL=classes.d.ts.map

package/dist/lib/classes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"classes.d.ts","names":[],"sources":["../../src/lib/classes.ts"],"mappings":";;;;;;;;;;;;;;;;qBAea;;;;;qBAcA;;;;;qBAMA"}
+{"version":3,"file":"classes.d.ts","names":[],"sources":["../../src/lib/classes.ts"],"mappings":";;;;;;;;;;;;;;;;qBAea;;;;;qBAcA;;;;;qBAMA;;;;;;;;;;qBAWA"}

package/dist/lib/classes.js

@@ -33,7 +33,17 @@ const eyebrowClasses = "text-[0.6875rem]/tight font-medium text-muted-foreground
 * size the settings rows already use, so a form reads the same in either layout.
 */
 const descriptionClasses = "text-pretty text-muted-foreground text-sm";
+/**
+* The default control font size + line height (buttons, inputs, selects, menu items, tabs,
+* toasts). Written as an arbitrary `length:` font-size plus a paired `leading-*` rather than
+* a `text-control` theme utility on purpose: a *named* custom text size is invisible to the
+* class-merge engines (`cn` and tailwind-variants' twMerge), which fall back to treating
+* `text-control` as a text COLOR and drop it the moment a variant adds its own
+* `text-secondary-foreground`/`text-background`/... , leaving the control to inherit the
+* page's 16px. The `length:` hint keeps it classified as a font-size so it survives the merge.
+*/
+const controlTextClasses = "text-(length:--text-control) leading-(--text-control--line-height)";
 //#endregion
-export { descriptionClasses, eyebrowClasses, popoverAnimationClasses };
+export { controlTextClasses, descriptionClasses, eyebrowClasses, popoverAnimationClasses };
 
 //# sourceMappingURL=classes.js.map

package/dist/lib/classes.js.map

@@ -1 +1 @@
-{"version":3,"file":"classes.js","names":[],"sources":["../../src/lib/classes.ts"],"sourcesContent":["/**\n * Enter/exit animation classes for Base UI popups (Menu, Select, Popover, Tooltip, …).\n * Keyed on Base UI's `data-open`/`data-closed` state attributes and the positioner's\n * `data-[side=*]`, with the zoom anchored to the `--transform-origin` Base UI exposes on\n * the popup. Animation utilities (and their `duration-*`/`ease-*` bindings) come from\n * `tailwindcss-animate`.\n *\n * The `data-closed` animation is essential: Base UI keeps the popup mounted until the\n * exit animation finishes, so without it there is no close animation at all.\n *\n * Feel: a snappy 100ms, a barely-there 98% zoom, and a 2px directional slide. Enter eases\n * out (natural deceleration as it appears); exit eases in (accelerates away — it shouldn't\n * fight for attention). `data-instant` collapses the duration to 0 so Base UI's instant\n * transitions (keyboard nav between items, grouped tooltips) don't stutter.\n */\nexport const popoverAnimationClasses = [\n  \"origin-(--transform-origin) duration-100 data-instant:duration-0\",\n  \"data-open:animate-in data-open:ease-out data-open:fade-in-0 data-open:zoom-in-98\",\n  \"data-closed:animate-out data-closed:ease-in data-closed:fade-out-0 data-closed:zoom-out-98\",\n  \"data-[side=bottom]:slide-in-from-top-2 data-[side=bottom]:slide-out-to-top-2\",\n  \"data-[side=left]:slide-in-from-right-2 data-[side=left]:slide-out-to-right-2\",\n  \"data-[side=right]:slide-in-from-left-2 data-[side=right]:slide-out-to-left-2\",\n  \"data-[side=top]:slide-in-from-bottom-2 data-[side=top]:slide-out-to-bottom-2\",\n]\n\n/**\n * Small muted label over a group of items: sidebar sections, menu groups. One place so every\n * eyebrow in the app shares its size and weight.\n */\nexport const eyebrowClasses = \"text-[0.6875rem]/tight font-medium text-muted-foreground\"\n\n/**\n * Muted supporting copy under a heading, label, or control. Matches the description\n * size the settings rows already use, so a form reads the same in either layout.\n */\nexport const descriptionClasses = \"text-pretty text-muted-foreground text-sm\"\n"],"mappings":";;;;;;;;;;;;;;;;AAeA,MAAa,0BAA0B;CACrC;CACA;CACA;CACA;CACA;CACA;CACA;AACF;;;;;AAMA,MAAa,iBAAiB;;;;;AAM9B,MAAa,qBAAqB"}
+{"version":3,"file":"classes.js","names":[],"sources":["../../src/lib/classes.ts"],"sourcesContent":["/**\n * Enter/exit animation classes for Base UI popups (Menu, Select, Popover, Tooltip, …).\n * Keyed on Base UI's `data-open`/`data-closed` state attributes and the positioner's\n * `data-[side=*]`, with the zoom anchored to the `--transform-origin` Base UI exposes on\n * the popup. Animation utilities (and their `duration-*`/`ease-*` bindings) come from\n * `tailwindcss-animate`.\n *\n * The `data-closed` animation is essential: Base UI keeps the popup mounted until the\n * exit animation finishes, so without it there is no close animation at all.\n *\n * Feel: a snappy 100ms, a barely-there 98% zoom, and a 2px directional slide. Enter eases\n * out (natural deceleration as it appears); exit eases in (accelerates away — it shouldn't\n * fight for attention). `data-instant` collapses the duration to 0 so Base UI's instant\n * transitions (keyboard nav between items, grouped tooltips) don't stutter.\n */\nexport const popoverAnimationClasses = [\n  \"origin-(--transform-origin) duration-100 data-instant:duration-0\",\n  \"data-open:animate-in data-open:ease-out data-open:fade-in-0 data-open:zoom-in-98\",\n  \"data-closed:animate-out data-closed:ease-in data-closed:fade-out-0 data-closed:zoom-out-98\",\n  \"data-[side=bottom]:slide-in-from-top-2 data-[side=bottom]:slide-out-to-top-2\",\n  \"data-[side=left]:slide-in-from-right-2 data-[side=left]:slide-out-to-right-2\",\n  \"data-[side=right]:slide-in-from-left-2 data-[side=right]:slide-out-to-left-2\",\n  \"data-[side=top]:slide-in-from-bottom-2 data-[side=top]:slide-out-to-bottom-2\",\n]\n\n/**\n * Small muted label over a group of items: sidebar sections, menu groups. One place so every\n * eyebrow in the app shares its size and weight.\n */\nexport const eyebrowClasses = \"text-[0.6875rem]/tight font-medium text-muted-foreground\"\n\n/**\n * Muted supporting copy under a heading, label, or control. Matches the description\n * size the settings rows already use, so a form reads the same in either layout.\n */\nexport const descriptionClasses = \"text-pretty text-muted-foreground text-sm\"\n\n/**\n * The default control font size + line height (buttons, inputs, selects, menu items, tabs,\n * toasts). Written as an arbitrary `length:` font-size plus a paired `leading-*` rather than\n * a `text-control` theme utility on purpose: a *named* custom text size is invisible to the\n * class-merge engines (`cn` and tailwind-variants' twMerge), which fall back to treating\n * `text-control` as a text COLOR and drop it the moment a variant adds its own\n * `text-secondary-foreground`/`text-background`/... , leaving the control to inherit the\n * page's 16px. The `length:` hint keeps it classified as a font-size so it survives the merge.\n */\nexport const controlTextClasses =\n  \"text-(length:--text-control) leading-(--text-control--line-height)\"\n"],"mappings":";;;;;;;;;;;;;;;;AAeA,MAAa,0BAA0B;CACrC;CACA;CACA;CACA;CACA;CACA;CACA;AACF;;;;;AAMA,MAAa,iBAAiB;;;;;AAM9B,MAAa,qBAAqB;;;;;;;;;;AAWlC,MAAa,qBACX"}

package/package.json

@@ -108,5 +108,5 @@
   "engines": {
     "node": ">=18"
   },
-  "version": "1.0.0"
+  "version": "1.0.1"
 }