@ttt-productions/ui-core 0.11.32 → 0.11.34

package/dist/react/components/form.js

@@ -1,10 +1,10 @@
-"use client";
+'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
-import * as React from "react";
-import { Slot } from "@radix-ui/react-slot";
-import { Controller, FormProvider, useFormContext, } from "react-hook-form";
-import { cn } from "../../lib/utils.js";
-import { Label } from "./label.js";
+import * as React from 'react';
+import { Slot } from '@radix-ui/react-slot';
+import { Controller, FormProvider, useFormContext, } from 'react-hook-form';
+import { cn } from '../../lib/utils.js';
+import { Label } from './label.js';
 const Form = FormProvider;
 const FormFieldContext = React.createContext({});
 const FormField = ({ ...props }) => {
@@ -16,7 +16,7 @@ const useFormField = () => {
     const { getFieldState, formState } = useFormContext();
     const fieldState = getFieldState(fieldContext.name, formState);
     if (!fieldContext) {
-        throw new Error("useFormField should be used within <FormField>");
+        throw new Error('useFormField should be used within <FormField>');
     }
     const { id } = itemContext;
     return {
@@ -31,31 +31,31 @@ const useFormField = () => {
 const FormItemContext = React.createContext({});
 const FormItem = React.forwardRef(({ className, ...props }, ref) => {
     const id = React.useId();
-    return (_jsx(FormItemContext.Provider, { value: { id }, children: _jsx("div", { ref: ref, className: cn("space-y-2", className), ...props }) }));
+    return (_jsx(FormItemContext.Provider, { value: { id }, children: _jsx("div", { ref: ref, className: cn('space-y-2', className), ...props }) }));
 });
-FormItem.displayName = "FormItem";
+FormItem.displayName = 'FormItem';
 const FormLabel = React.forwardRef(({ className, ...props }, ref) => {
     const { error, formItemId } = useFormField();
-    return (_jsx(Label, { ref: ref, className: cn(error && "text-destructive", className), htmlFor: formItemId, ...props }));
+    return (_jsx(Label, { ref: ref, className: cn(error && 'text-destructive', className), htmlFor: formItemId, ...props }));
 });
-FormLabel.displayName = "FormLabel";
+FormLabel.displayName = 'FormLabel';
 const FormControl = React.forwardRef(({ ...props }, ref) => {
     const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
     return (_jsx(Slot, { ref: ref, id: formItemId, "aria-describedby": !error ? `${formDescriptionId}` : `${formDescriptionId} ${formMessageId}`, "aria-invalid": !!error, ...props }));
 });
-FormControl.displayName = "FormControl";
+FormControl.displayName = 'FormControl';
 const FormDescription = React.forwardRef(({ className, ...props }, ref) => {
     const { formDescriptionId } = useFormField();
-    return (_jsx("p", { ref: ref, id: formDescriptionId, className: cn("text-sm text-muted-foreground break-words", className), ...props }));
+    return (_jsx("p", { ref: ref, id: formDescriptionId, className: cn('text-sm text-muted-foreground break-words', className), ...props }));
 });
-FormDescription.displayName = "FormDescription";
+FormDescription.displayName = 'FormDescription';
 const FormMessage = React.forwardRef(({ className, children, ...props }, ref) => {
     const { error, formMessageId } = useFormField();
-    const body = error ? String(error?.message ?? "") : children;
+    const body = error ? String(error?.message ?? '') : children;
     if (!body)
         return null;
-    return (_jsx("p", { ref: ref, id: formMessageId, className: cn("text-sm font-medium text-destructive break-words", className), ...props, children: body }));
+    return (_jsx("p", { ref: ref, id: formMessageId, className: cn('text-sm font-medium text-destructive break-words', className), ...props, children: body }));
 });
-FormMessage.displayName = "FormMessage";
+FormMessage.displayName = 'FormMessage';
 export { useFormField, Form, FormItem, FormLabel, FormControl, FormDescription, FormMessage, FormField, };
 //# sourceMappingURL=form.js.map

package/dist/react/components/form.js.map

@@ -1 +1 @@
-{"version":3,"file":"form.js","sourceRoot":"","sources":["../../../src/react/components/form.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport * as LabelPrimitive from \"@radix-ui/react-label\"\nimport { Slot } from \"@radix-ui/react-slot\"\nimport {\n  Controller,\n  FormProvider,\n  useFormContext,\n  type ControllerProps,\n  type FieldPath,\n  type FieldValues,\n} from \"react-hook-form\"\n\nimport { cn } from \"../../lib/utils.js\"\nimport { Label } from \"./label.js\"\n\nconst Form = FormProvider\n\ntype FormFieldContextValue<\n  TFieldValues extends FieldValues = FieldValues,\n  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\n> = {\n  name: TName\n}\n\nconst FormFieldContext = React.createContext<FormFieldContextValue>(\n  {} as FormFieldContextValue\n)\n\nconst FormField = <\n  TFieldValues extends FieldValues = FieldValues,\n  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>\n>({\n  ...props\n}: ControllerProps<TFieldValues, TName>) => {\n  return (\n    <FormFieldContext.Provider value={{ name: props.name }}>\n      <Controller {...props} />\n    </FormFieldContext.Provider>\n  )\n}\n\nconst useFormField = () => {\n  const fieldContext = React.useContext(FormFieldContext)\n  const itemContext = React.useContext(FormItemContext)\n  const { getFieldState, formState } = useFormContext()\n\n  const fieldState = getFieldState(fieldContext.name, formState)\n\n  if (!fieldContext) {\n    throw new Error(\"useFormField should be used within <FormField>\")\n  }\n\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\ntype FormItemContextValue = {\n  id: string\n}\n\nconst FormItemContext = React.createContext<FormItemContextValue>(\n  {} as FormItemContextValue\n)\n\nconst FormItem = React.forwardRef<\n  HTMLDivElement,\n  React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => {\n  const id = React.useId()\n\n  return (\n    <FormItemContext.Provider value={{ id }}>\n      <div ref={ref} className={cn(\"space-y-2\", className)} {...props} />\n    </FormItemContext.Provider>\n  )\n})\nFormItem.displayName = \"FormItem\"\n\nconst FormLabel = React.forwardRef<\n  React.ElementRef<typeof LabelPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root>\n>(({ className, ...props }, ref) => {\n  const { error, formItemId } = useFormField()\n\n  return (\n    <Label\n      ref={ref}\n      className={cn(error && \"text-destructive\", className)}\n      htmlFor={formItemId}\n      {...props}\n    />\n  )\n})\nFormLabel.displayName = \"FormLabel\"\n\nconst FormControl = React.forwardRef<\n  React.ElementRef<typeof Slot>,\n  React.ComponentPropsWithoutRef<typeof Slot>\n>(({ ...props }, ref) => {\n  const { error, formItemId, formDescriptionId, formMessageId } = useFormField()\n\n  return (\n    <Slot\n      ref={ref}\n      id={formItemId}\n      aria-describedby={\n        !error ? `${formDescriptionId}` : `${formDescriptionId} ${formMessageId}`\n      }\n      aria-invalid={!!error}\n      {...props}\n    />\n  )\n})\nFormControl.displayName = \"FormControl\"\n\nconst FormDescription = React.forwardRef<\n  HTMLParagraphElement,\n  React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => {\n  const { formDescriptionId } = useFormField()\n\n  return (\n    <p\n      ref={ref}\n      id={formDescriptionId}\n      className={cn(\"text-sm text-muted-foreground break-words\", className)}\n      {...props}\n    />\n  )\n})\nFormDescription.displayName = \"FormDescription\"\n\nconst FormMessage = React.forwardRef<\n  HTMLParagraphElement,\n  React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, children, ...props }, ref) => {\n  const { error, formMessageId } = useFormField()\n  const body = error ? String(error?.message ?? \"\") : children\n\n  if (!body) return null\n\n  return (\n    <p\n      ref={ref}\n      id={formMessageId}\n      className={cn(\"text-sm font-medium text-destructive break-words\", className)}\n      {...props}\n    >\n      {body}\n    </p>\n  )\n})\nFormMessage.displayName = \"FormMessage\"\n\nexport {\n  useFormField,\n  Form,\n  FormItem,\n  FormLabel,\n  FormControl,\n  FormDescription,\n  FormMessage,\n  FormField,\n}\n"]}
+{"version":3,"file":"form.js","sourceRoot":"","sources":["../../../src/react/components/form.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC5C,OAAO,EACL,UAAU,EACV,YAAY,EACZ,cAAc,GAIf,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAC;AACxC,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAEnC,MAAM,IAAI,GAAG,YAAY,CAAC;AAS1B,MAAM,gBAAgB,GAAG,KAAK,CAAC,aAAa,CAAwB,EAA2B,CAAC,CAAC;AAEjG,MAAM,SAAS,GAAG,CAGhB,EACA,GAAG,KAAK,EAC6B,EAAE,EAAE;IACzC,OAAO,CACL,KAAC,gBAAgB,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,YACpD,KAAC,UAAU,OAAK,KAAK,GAAI,GACC,CAC7B,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,YAAY,GAAG,GAAG,EAAE;IACxB,MAAM,YAAY,GAAG,KAAK,CAAC,UAAU,CAAC,gBAAgB,CAAC,CAAC;IACxD,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAAC,eAAe,CAAC,CAAC;IACtD,MAAM,EAAE,aAAa,EAAE,SAAS,EAAE,GAAG,cAAc,EAAE,CAAC;IAEtD,MAAM,UAAU,GAAG,aAAa,CAAC,YAAY,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;IAE/D,IAAI,CAAC,YAAY,EAAE,CAAC;QAClB,MAAM,IAAI,KAAK,CAAC,gDAAgD,CAAC,CAAC;IACpE,CAAC;IAED,MAAM,EAAE,EAAE,EAAE,GAAG,WAAW,CAAC;IAE3B,OAAO;QACL,EAAE;QACF,IAAI,EAAE,YAAY,CAAC,IAAI;QACvB,UAAU,EAAE,GAAG,EAAE,YAAY;QAC7B,iBAAiB,EAAE,GAAG,EAAE,wBAAwB;QAChD,aAAa,EAAE,GAAG,EAAE,oBAAoB;QACxC,GAAG,UAAU;KACd,CAAC;AACJ,CAAC,CAAC;AAMF,MAAM,eAAe,GAAG,KAAK,CAAC,aAAa,CAAuB,EAA0B,CAAC,CAAC;AAE9F,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAC/B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAC/B,MAAM,EAAE,GAAG,KAAK,CAAC,KAAK,EAAE,CAAC;IAEzB,OAAO,CACL,KAAC,eAAe,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,EAAE,EAAE,YACrC,cAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,CAAC,WAAW,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,GAC1C,CAC5B,CAAC;AACJ,CAAC,CACF,CAAC;AACF,QAAQ,CAAC,WAAW,GAAG,UAAU,CAAC;AAElC,MAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAGhC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACjC,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,GAAG,YAAY,EAAE,CAAC;IAE7C,OAAO,CACL,KAAC,KAAK,IACJ,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,KAAK,IAAI,kBAAkB,EAAE,SAAS,CAAC,EACrD,OAAO,EAAE,UAAU,KACf,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,SAAS,CAAC,WAAW,GAAG,WAAW,CAAC;AAEpC,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAGlC,CAAC,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACtB,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,iBAAiB,EAAE,aAAa,EAAE,GAAG,YAAY,EAAE,CAAC;IAE/E,OAAO,CACL,KAAC,IAAI,IACH,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,UAAU,sBACI,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,iBAAiB,EAAE,CAAC,CAAC,CAAC,GAAG,iBAAiB,IAAI,aAAa,EAAE,kBAC7E,CAAC,CAAC,KAAK,KACjB,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,WAAW,CAAC,WAAW,GAAG,aAAa,CAAC;AAExC,MAAM,eAAe,GAAG,KAAK,CAAC,UAAU,CAGtC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACjC,MAAM,EAAE,iBAAiB,EAAE,GAAG,YAAY,EAAE,CAAC;IAE7C,OAAO,CACL,YACE,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,iBAAiB,EACrB,SAAS,EAAE,EAAE,CAAC,2CAA2C,EAAE,SAAS,CAAC,KACjE,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,eAAe,CAAC,WAAW,GAAG,iBAAiB,CAAC;AAEhD,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAGlC,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAC3C,MAAM,EAAE,KAAK,EAAE,aAAa,EAAE,GAAG,YAAY,EAAE,CAAC;IAChD,MAAM,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,OAAO,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC;IAE7D,IAAI,CAAC,IAAI;QAAE,OAAO,IAAI,CAAC;IAEvB,OAAO,CACL,YACE,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,aAAa,EACjB,SAAS,EAAE,EAAE,CAAC,kDAAkD,EAAE,SAAS,CAAC,KACxE,KAAK,YAER,IAAI,GACH,CACL,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,WAAW,CAAC,WAAW,GAAG,aAAa,CAAC;AAExC,OAAO,EACL,YAAY,EACZ,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,WAAW,EACX,eAAe,EACf,WAAW,EACX,SAAS,GACV,CAAC","sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport * as LabelPrimitive from '@radix-ui/react-label';\nimport { Slot } from '@radix-ui/react-slot';\nimport {\n  Controller,\n  FormProvider,\n  useFormContext,\n  type ControllerProps,\n  type FieldPath,\n  type FieldValues,\n} from 'react-hook-form';\n\nimport { cn } from '../../lib/utils.js';\nimport { Label } from './label.js';\n\nconst Form = FormProvider;\n\ntype FormFieldContextValue<\n  TFieldValues extends FieldValues = FieldValues,\n  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n> = {\n  name: TName;\n};\n\nconst FormFieldContext = React.createContext<FormFieldContextValue>({} as FormFieldContextValue);\n\nconst FormField = <\n  TFieldValues extends FieldValues = FieldValues,\n  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,\n>({\n  ...props\n}: ControllerProps<TFieldValues, TName>) => {\n  return (\n    <FormFieldContext.Provider value={{ name: props.name }}>\n      <Controller {...props} />\n    </FormFieldContext.Provider>\n  );\n};\n\nconst useFormField = () => {\n  const fieldContext = React.useContext(FormFieldContext);\n  const itemContext = React.useContext(FormItemContext);\n  const { getFieldState, formState } = useFormContext();\n\n  const fieldState = getFieldState(fieldContext.name, formState);\n\n  if (!fieldContext) {\n    throw new Error('useFormField should be used within <FormField>');\n  }\n\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\ntype FormItemContextValue = {\n  id: string;\n};\n\nconst FormItemContext = React.createContext<FormItemContextValue>({} as FormItemContextValue);\n\nconst FormItem = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, ref) => {\n    const id = React.useId();\n\n    return (\n      <FormItemContext.Provider value={{ id }}>\n        <div ref={ref} className={cn('space-y-2', className)} {...props} />\n      </FormItemContext.Provider>\n    );\n  },\n);\nFormItem.displayName = 'FormItem';\n\nconst FormLabel = React.forwardRef<\n  React.ElementRef<typeof LabelPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root>\n>(({ className, ...props }, ref) => {\n  const { error, formItemId } = useFormField();\n\n  return (\n    <Label\n      ref={ref}\n      className={cn(error && 'text-destructive', className)}\n      htmlFor={formItemId}\n      {...props}\n    />\n  );\n});\nFormLabel.displayName = 'FormLabel';\n\nconst FormControl = React.forwardRef<\n  React.ElementRef<typeof Slot>,\n  React.ComponentPropsWithoutRef<typeof Slot>\n>(({ ...props }, ref) => {\n  const { error, formItemId, formDescriptionId, formMessageId } = useFormField();\n\n  return (\n    <Slot\n      ref={ref}\n      id={formItemId}\n      aria-describedby={!error ? `${formDescriptionId}` : `${formDescriptionId} ${formMessageId}`}\n      aria-invalid={!!error}\n      {...props}\n    />\n  );\n});\nFormControl.displayName = 'FormControl';\n\nconst FormDescription = React.forwardRef<\n  HTMLParagraphElement,\n  React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, ...props }, ref) => {\n  const { formDescriptionId } = useFormField();\n\n  return (\n    <p\n      ref={ref}\n      id={formDescriptionId}\n      className={cn('text-sm text-muted-foreground break-words', className)}\n      {...props}\n    />\n  );\n});\nFormDescription.displayName = 'FormDescription';\n\nconst FormMessage = React.forwardRef<\n  HTMLParagraphElement,\n  React.HTMLAttributes<HTMLParagraphElement>\n>(({ className, children, ...props }, ref) => {\n  const { error, formMessageId } = useFormField();\n  const body = error ? String(error?.message ?? '') : children;\n\n  if (!body) return null;\n\n  return (\n    <p\n      ref={ref}\n      id={formMessageId}\n      className={cn('text-sm font-medium text-destructive break-words', className)}\n      {...props}\n    >\n      {body}\n    </p>\n  );\n});\nFormMessage.displayName = 'FormMessage';\n\nexport {\n  useFormField,\n  Form,\n  FormItem,\n  FormLabel,\n  FormControl,\n  FormDescription,\n  FormMessage,\n  FormField,\n};\n"]}

package/dist/react/components/format-control.d.ts

@@ -1,9 +1,9 @@
-import { type InputFormatSpec } from "@ttt-productions/input-format-core";
+import { type InputFormatSpec } from '@ttt-productions/input-format-core';
 interface CallerAttributes {
     value?: unknown;
     readOnly?: boolean;
-    "aria-required"?: boolean | "true" | "false";
-    "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling";
+    'aria-required'?: boolean | 'true' | 'false';
+    'aria-invalid'?: boolean | 'true' | 'false' | 'grammar' | 'spelling';
 }
 /**
  * What a free-text control derives from its field declaration: the native length cap, and the
@@ -22,8 +22,15 @@ interface CallerAttributes {
  */
 export declare function formatControlAttributes(spec: InputFormatSpec, props: CallerAttributes): {
     maxLength: number;
-    "aria-required": boolean | "true" | "false" | undefined;
-    "aria-invalid": boolean | "true" | "false" | "grammar" | "spelling" | undefined;
+    'aria-required': boolean | "true" | "false" | undefined;
+    'aria-invalid': boolean | "true" | "false" | "grammar" | "spelling" | undefined;
 };
+/**
+ * Shows a free-text box's kept value once focus leaves it, delivered through the parent's own
+ * `onChange`: the native value setter plus an input event is what React hears as a typed change, so a
+ * controlled box and a react-hook-form `register` box both receive it. Nothing changes while typing.
+ * A read-only or disabled box shows a stored value nobody edits there, so it is never tidied.
+ */
+export declare function tidyOnBlur(box: HTMLInputElement | HTMLTextAreaElement, spec: InputFormatSpec): void;
 export {};
 //# sourceMappingURL=format-control.d.ts.map

package/dist/react/components/format-control.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"format-control.d.ts","sourceRoot":"","sources":["../../../src/react/components/format-control.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,eAAe,EAAE,MAAM,oCAAoC,CAAA;AAE3F,UAAU,gBAAgB;IACxB,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,eAAe,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAA;IAC5C,cAAc,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,UAAU,CAAA;CACrE;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,uBAAuB,CAAC,IAAI,EAAE,eAAe,EAAE,KAAK,EAAE,gBAAgB;;;;EAerF"}
+{"version":3,"file":"format-control.d.ts","sourceRoot":"","sources":["../../../src/react/components/format-control.ts"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,eAAe,EAAE,MAAM,oCAAoC,CAAC;AAE5F,UAAU,gBAAgB;IACxB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC;IAC7C,cAAc,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,UAAU,CAAC;CACtE;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,uBAAuB,CAAC,IAAI,EAAE,eAAe,EAAE,KAAK,EAAE,gBAAgB;;;;EAerF;AAED;;;;;GAKG;AACH,wBAAgB,UAAU,CAAC,GAAG,EAAE,gBAAgB,GAAG,mBAAmB,EAAE,IAAI,EAAE,eAAe,QAQ5F"}

package/dist/react/components/format-control.js

@@ -1,4 +1,4 @@
-import { checkInputFormat } from "@ttt-productions/input-format-core";
+import { checkInputFormat } from '@ttt-productions/input-format-core';
 /**
  * What a free-text control derives from its field declaration: the native length cap, and the
  * required/invalid state assistive technology announces. A caller's own `aria-required` or
@@ -18,16 +18,32 @@ export function formatControlAttributes(spec, props) {
     if (props.readOnly) {
         return {
             maxLength: spec.max,
-            "aria-required": props["aria-required"],
-            "aria-invalid": props["aria-invalid"],
+            'aria-required': props['aria-required'],
+            'aria-invalid': props['aria-invalid'],
         };
     }
-    const result = typeof props.value === "string" ? checkInputFormat(props.value, spec) : null;
-    const malformed = result !== null && !result.ok && result.issue !== "tooShort";
+    const result = typeof props.value === 'string' ? checkInputFormat(props.value, spec) : null;
+    const malformed = result !== null && !result.ok && result.issue !== 'tooShort';
     return {
         maxLength: spec.max,
-        "aria-required": props["aria-required"] ?? (spec.min > 0 ? true : undefined),
-        "aria-invalid": props["aria-invalid"] ?? (malformed ? true : undefined),
+        'aria-required': props['aria-required'] ?? (spec.min > 0 ? true : undefined),
+        'aria-invalid': props['aria-invalid'] ?? (malformed ? true : undefined),
     };
 }
+/**
+ * Shows a free-text box's kept value once focus leaves it, delivered through the parent's own
+ * `onChange`: the native value setter plus an input event is what React hears as a typed change, so a
+ * controlled box and a react-hook-form `register` box both receive it. Nothing changes while typing.
+ * A read-only or disabled box shows a stored value nobody edits there, so it is never tidied.
+ */
+export function tidyOnBlur(box, spec) {
+    if (box.readOnly || box.disabled)
+        return;
+    const kept = checkInputFormat(box.value, spec).value;
+    if (kept === box.value)
+        return;
+    const prototype = box instanceof HTMLTextAreaElement ? HTMLTextAreaElement.prototype : HTMLInputElement.prototype;
+    Object.getOwnPropertyDescriptor(prototype, 'value')?.set?.call(box, kept);
+    box.dispatchEvent(new Event('input', { bubbles: true }));
+}
 //# sourceMappingURL=format-control.js.map

package/dist/react/components/format-control.js.map

@@ -1 +1 @@
-{"version":3,"file":"format-control.js","sourceRoot":"","sources":["../../../src/react/components/format-control.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAwB,MAAM,oCAAoC,CAAA;AAS3F;;;;;;;;;;;;;;GAcG;AACH,MAAM,UAAU,uBAAuB,CAAC,IAAqB,EAAE,KAAuB;IACpF,IAAI,KAAK,CAAC,QAAQ,EAAE,CAAC;QACnB,OAAO;YACL,SAAS,EAAE,IAAI,CAAC,GAAG;YACnB,eAAe,EAAE,KAAK,CAAC,eAAe,CAAC;YACvC,cAAc,EAAE,KAAK,CAAC,cAAc,CAAC;SACtC,CAAA;IACH,CAAC;IACD,MAAM,MAAM,GAAG,OAAO,KAAK,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,gBAAgB,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAA;IAC3F,MAAM,SAAS,GAAG,MAAM,KAAK,IAAI,IAAI,CAAC,MAAM,CAAC,EAAE,IAAI,MAAM,CAAC,KAAK,KAAK,UAAU,CAAA;IAC9E,OAAO;QACL,SAAS,EAAE,IAAI,CAAC,GAAG;QACnB,eAAe,EAAE,KAAK,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC;QAC5E,cAAc,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC;KACxE,CAAA;AACH,CAAC","sourcesContent":["import { checkInputFormat, type InputFormatSpec } from \"@ttt-productions/input-format-core\"\n\ninterface CallerAttributes {\n  value?: unknown\n  readOnly?: boolean\n  \"aria-required\"?: boolean | \"true\" | \"false\"\n  \"aria-invalid\"?: boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\"\n}\n\n/**\n * What a free-text control derives from its field declaration: the native length cap, and the\n * required/invalid state assistive technology announces. A caller's own `aria-required` or\n * `aria-invalid` wins — a form field passes the state its whole schema decided.\n *\n * The native cap counts the text as typed while the check counts it trimmed. Every value the\n * field keeps can still be typed, and surrounding whitespace is dropped by the check anyway.\n *\n * Only a controlled value is judged, and a text that is merely too short is not marked invalid\n * while it is being typed: an empty or half-typed required field is not yet an error, so \"too\n * short\" is left to the form's submit-time validation.\n *\n * A read-only control shows a stored value nobody can edit there, so it is never judged: it\n * announces neither required nor invalid (a stored value may legitimately fail the typed format).\n */\nexport function formatControlAttributes(spec: InputFormatSpec, props: CallerAttributes) {\n  if (props.readOnly) {\n    return {\n      maxLength: spec.max,\n      \"aria-required\": props[\"aria-required\"],\n      \"aria-invalid\": props[\"aria-invalid\"],\n    }\n  }\n  const result = typeof props.value === \"string\" ? checkInputFormat(props.value, spec) : null\n  const malformed = result !== null && !result.ok && result.issue !== \"tooShort\"\n  return {\n    maxLength: spec.max,\n    \"aria-required\": props[\"aria-required\"] ?? (spec.min > 0 ? true : undefined),\n    \"aria-invalid\": props[\"aria-invalid\"] ?? (malformed ? true : undefined),\n  }\n}\n"]}
+{"version":3,"file":"format-control.js","sourceRoot":"","sources":["../../../src/react/components/format-control.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAwB,MAAM,oCAAoC,CAAC;AAS5F;;;;;;;;;;;;;;GAcG;AACH,MAAM,UAAU,uBAAuB,CAAC,IAAqB,EAAE,KAAuB;IACpF,IAAI,KAAK,CAAC,QAAQ,EAAE,CAAC;QACnB,OAAO;YACL,SAAS,EAAE,IAAI,CAAC,GAAG;YACnB,eAAe,EAAE,KAAK,CAAC,eAAe,CAAC;YACvC,cAAc,EAAE,KAAK,CAAC,cAAc,CAAC;SACtC,CAAC;IACJ,CAAC;IACD,MAAM,MAAM,GAAG,OAAO,KAAK,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,gBAAgB,CAAC,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IAC5F,MAAM,SAAS,GAAG,MAAM,KAAK,IAAI,IAAI,CAAC,MAAM,CAAC,EAAE,IAAI,MAAM,CAAC,KAAK,KAAK,UAAU,CAAC;IAC/E,OAAO;QACL,SAAS,EAAE,IAAI,CAAC,GAAG;QACnB,eAAe,EAAE,KAAK,CAAC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC;QAC5E,cAAc,EAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC;KACxE,CAAC;AACJ,CAAC;AAED;;;;;GAKG;AACH,MAAM,UAAU,UAAU,CAAC,GAA2C,EAAE,IAAqB;IAC3F,IAAI,GAAG,CAAC,QAAQ,IAAI,GAAG,CAAC,QAAQ;QAAE,OAAO;IACzC,MAAM,IAAI,GAAG,gBAAgB,CAAC,GAAG,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,KAAK,CAAC;IACrD,IAAI,IAAI,KAAK,GAAG,CAAC,KAAK;QAAE,OAAO;IAC/B,MAAM,SAAS,GACb,GAAG,YAAY,mBAAmB,CAAC,CAAC,CAAC,mBAAmB,CAAC,SAAS,CAAC,CAAC,CAAC,gBAAgB,CAAC,SAAS,CAAC;IAClG,MAAM,CAAC,wBAAwB,CAAC,SAAS,EAAE,OAAO,CAAC,EAAE,GAAG,EAAE,IAAI,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC;IAC1E,GAAG,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;AAC3D,CAAC","sourcesContent":["import { checkInputFormat, type InputFormatSpec } from '@ttt-productions/input-format-core';\n\ninterface CallerAttributes {\n  value?: unknown;\n  readOnly?: boolean;\n  'aria-required'?: boolean | 'true' | 'false';\n  'aria-invalid'?: boolean | 'true' | 'false' | 'grammar' | 'spelling';\n}\n\n/**\n * What a free-text control derives from its field declaration: the native length cap, and the\n * required/invalid state assistive technology announces. A caller's own `aria-required` or\n * `aria-invalid` wins — a form field passes the state its whole schema decided.\n *\n * The native cap counts the text as typed while the check counts it trimmed. Every value the\n * field keeps can still be typed, and surrounding whitespace is dropped by the check anyway.\n *\n * Only a controlled value is judged, and a text that is merely too short is not marked invalid\n * while it is being typed: an empty or half-typed required field is not yet an error, so \"too\n * short\" is left to the form's submit-time validation.\n *\n * A read-only control shows a stored value nobody can edit there, so it is never judged: it\n * announces neither required nor invalid (a stored value may legitimately fail the typed format).\n */\nexport function formatControlAttributes(spec: InputFormatSpec, props: CallerAttributes) {\n  if (props.readOnly) {\n    return {\n      maxLength: spec.max,\n      'aria-required': props['aria-required'],\n      'aria-invalid': props['aria-invalid'],\n    };\n  }\n  const result = typeof props.value === 'string' ? checkInputFormat(props.value, spec) : null;\n  const malformed = result !== null && !result.ok && result.issue !== 'tooShort';\n  return {\n    maxLength: spec.max,\n    'aria-required': props['aria-required'] ?? (spec.min > 0 ? true : undefined),\n    'aria-invalid': props['aria-invalid'] ?? (malformed ? true : undefined),\n  };\n}\n\n/**\n * Shows a free-text box's kept value once focus leaves it, delivered through the parent's own\n * `onChange`: the native value setter plus an input event is what React hears as a typed change, so a\n * controlled box and a react-hook-form `register` box both receive it. Nothing changes while typing.\n * A read-only or disabled box shows a stored value nobody edits there, so it is never tidied.\n */\nexport function tidyOnBlur(box: HTMLInputElement | HTMLTextAreaElement, spec: InputFormatSpec) {\n  if (box.readOnly || box.disabled) return;\n  const kept = checkInputFormat(box.value, spec).value;\n  if (kept === box.value) return;\n  const prototype =\n    box instanceof HTMLTextAreaElement ? HTMLTextAreaElement.prototype : HTMLInputElement.prototype;\n  Object.getOwnPropertyDescriptor(prototype, 'value')?.set?.call(box, kept);\n  box.dispatchEvent(new Event('input', { bubbles: true }));\n}\n"]}

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

@@ -1,18 +1,18 @@
-import * as React from "react";
-import type { DeclaredInputFormat } from "@ttt-productions/input-format-core";
+import * as React from 'react';
+import type { DeclaredInputFormat } from '@ttt-productions/input-format-core';
 /**
  * The input types whose value the browser itself formats or picks — not free text — so they take no
  * input format. A free-text input (`type` omitted or `"text"`) takes one.
  */
-export type BuiltInFormatInputType = "password" | "email" | "number" | "tel" | "url" | "search" | "file" | "color" | "date" | "datetime-local" | "month" | "week" | "time" | "range" | "checkbox" | "radio" | "hidden" | "button" | "submit" | "reset" | "image";
-type NativeInputProps = React.ComponentPropsWithoutRef<"input">;
+export type BuiltInFormatInputType = 'password' | 'email' | 'number' | 'tel' | 'url' | 'search' | 'file' | 'color' | 'date' | 'datetime-local' | 'month' | 'week' | 'time' | 'range' | 'checkbox' | 'radio' | 'hidden' | 'button' | 'submit' | 'reset' | 'image';
+type NativeInputProps = React.ComponentPropsWithoutRef<'input'>;
 /**
  * A free-text input: its declaration is required, and its bounds and its required state come only
  * from that declaration (ENG-005), so `maxLength`, `minLength`, `pattern`, and `required` are not
  * props.
  */
-export type FreeTextInputProps = Omit<NativeInputProps, "type" | "maxLength" | "minLength" | "pattern" | "required"> & {
-    type?: "text";
+export type FreeTextInputProps = Omit<NativeInputProps, 'type' | 'maxLength' | 'minLength' | 'pattern' | 'required'> & {
+    type?: 'text';
     inputFormat: DeclaredInputFormat;
     textEntry?: never;
 };
@@ -22,15 +22,15 @@ export type FreeTextInputProps = Omit<NativeInputProps, "type" | "maxLength" | "
  * input format; each keeps its own native `maxLength`, `pattern`, and `inputMode`, and its value is
  * checked by its own rule (a whole-input number parse, the one-segment id rule).
  */
-export type NonFreeTextEntry = "numeric" | "identifier";
+export type NonFreeTextEntry = 'numeric' | 'identifier';
 /** A text box that is not free text: no input format. */
-export type NonFreeTextInputProps = Omit<NativeInputProps, "type"> & {
-    type?: "text";
+export type NonFreeTextInputProps = Omit<NativeInputProps, 'type'> & {
+    type?: 'text';
     textEntry: NonFreeTextEntry;
     inputFormat?: never;
 };
 /** An input whose value the browser formats: no input format. */
-export type BuiltInFormatInputProps = Omit<NativeInputProps, "type"> & {
+export type BuiltInFormatInputProps = Omit<NativeInputProps, 'type'> & {
     type: BuiltInFormatInputType;
     inputFormat?: never;
     textEntry?: never;

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

@@ -1 +1 @@
-{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../src/react/components/input.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,oCAAoC,CAAA;AAI7E;;;GAGG;AACH,MAAM,MAAM,sBAAsB,GAC9B,UAAU,GACV,OAAO,GACP,QAAQ,GACR,KAAK,GACL,KAAK,GACL,QAAQ,GACR,MAAM,GACN,OAAO,GACP,MAAM,GACN,gBAAgB,GAChB,OAAO,GACP,MAAM,GACN,MAAM,GACN,OAAO,GACP,UAAU,GACV,OAAO,GACP,QAAQ,GACR,QAAQ,GACR,QAAQ,GACR,OAAO,GACP,OAAO,CAAA;AAEX,KAAK,gBAAgB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,CAAC,CAAA;AAE/D;;;;GAIG;AACH,MAAM,MAAM,kBAAkB,GAAG,IAAI,CACnC,gBAAgB,EAChB,MAAM,GAAG,WAAW,GAAG,WAAW,GAAG,SAAS,GAAG,UAAU,CAC5D,GAAG;IACF,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,WAAW,EAAE,mBAAmB,CAAA;IAChC,SAAS,CAAC,EAAE,KAAK,CAAA;CAClB,CAAA;AAED;;;;;GAKG;AACH,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,YAAY,CAAA;AAEvD,yDAAyD;AACzD,MAAM,MAAM,qBAAqB,GAAG,IAAI,CAAC,gBAAgB,EAAE,MAAM,CAAC,GAAG;IACnE,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,SAAS,EAAE,gBAAgB,CAAA;IAC3B,WAAW,CAAC,EAAE,KAAK,CAAA;CACpB,CAAA;AAED,iEAAiE;AACjE,MAAM,MAAM,uBAAuB,GAAG,IAAI,CAAC,gBAAgB,EAAE,MAAM,CAAC,GAAG;IACrE,IAAI,EAAE,sBAAsB,CAAA;IAC5B,WAAW,CAAC,EAAE,KAAK,CAAA;IACnB,SAAS,CAAC,EAAE,KAAK,CAAA;CAClB,CAAA;AAED,MAAM,MAAM,UAAU,GAAG,kBAAkB,GAAG,qBAAqB,GAAG,uBAAuB,CAAA;AAE7F,QAAA,MAAM,KAAK,qFAgBV,CAAA;AAGD,OAAO,EAAE,KAAK,EAAE,CAAA"}
+{"version":3,"file":"input.d.ts","sourceRoot":"","sources":["../../../src/react/components/input.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,oCAAoC,CAAC;AAI9E;;;GAGG;AACH,MAAM,MAAM,sBAAsB,GAC9B,UAAU,GACV,OAAO,GACP,QAAQ,GACR,KAAK,GACL,KAAK,GACL,QAAQ,GACR,MAAM,GACN,OAAO,GACP,MAAM,GACN,gBAAgB,GAChB,OAAO,GACP,MAAM,GACN,MAAM,GACN,OAAO,GACP,UAAU,GACV,OAAO,GACP,QAAQ,GACR,QAAQ,GACR,QAAQ,GACR,OAAO,GACP,OAAO,CAAC;AAEZ,KAAK,gBAAgB,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,CAAC,CAAC;AAEhE;;;;GAIG;AACH,MAAM,MAAM,kBAAkB,GAAG,IAAI,CACnC,gBAAgB,EAChB,MAAM,GAAG,WAAW,GAAG,WAAW,GAAG,SAAS,GAAG,UAAU,CAC5D,GAAG;IACF,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,mBAAmB,CAAC;IACjC,SAAS,CAAC,EAAE,KAAK,CAAC;CACnB,CAAC;AAEF;;;;;GAKG;AACH,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,YAAY,CAAC;AAExD,yDAAyD;AACzD,MAAM,MAAM,qBAAqB,GAAG,IAAI,CAAC,gBAAgB,EAAE,MAAM,CAAC,GAAG;IACnE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,gBAAgB,CAAC;IAC5B,WAAW,CAAC,EAAE,KAAK,CAAC;CACrB,CAAC;AAEF,iEAAiE;AACjE,MAAM,MAAM,uBAAuB,GAAG,IAAI,CAAC,gBAAgB,EAAE,MAAM,CAAC,GAAG;IACrE,IAAI,EAAE,sBAAsB,CAAC;IAC7B,WAAW,CAAC,EAAE,KAAK,CAAC;IACpB,SAAS,CAAC,EAAE,KAAK,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,kBAAkB,GAAG,qBAAqB,GAAG,uBAAuB,CAAC;AAE9F,QAAA,MAAM,KAAK,qFAoBV,CAAC;AAGF,OAAO,EAAE,KAAK,EAAE,CAAC"}

package/dist/react/components/input.js

@@ -1,13 +1,17 @@
-"use client";
+'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
-import * as React from "react";
-import { cn } from "../../lib/utils.js";
-import { formatControlAttributes } from "./format-control.js";
+import * as React from 'react';
+import { cn } from '../../lib/utils.js';
+import { formatControlAttributes, tidyOnBlur } from './format-control.js';
 const Input = React.forwardRef(
 // `textEntry` only selects the prop shape; it never reaches the DOM.
-({ className, type, inputFormat, textEntry: _textEntry, ...props }, ref) => {
-    return (_jsx("input", { type: type, className: cn("flex h-10 w-full rounded-md border-2 border-input bg-background px-3 py-2 text-base ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm", className), ref: ref, ...props, ...(inputFormat ? formatControlAttributes(inputFormat, props) : {}) }));
+({ className, type, inputFormat, textEntry: _textEntry, onBlur, ...props }, ref) => {
+    return (_jsx("input", { type: type, className: cn('flex h-10 w-full rounded-md border-2 border-input bg-background px-3 py-2 text-base ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm', className), ref: ref, ...props, ...(inputFormat ? formatControlAttributes(inputFormat, props) : {}), onBlur: (event) => {
+            if (inputFormat)
+                tidyOnBlur(event.currentTarget, inputFormat);
+            onBlur?.(event);
+        } }));
 });
-Input.displayName = "Input";
+Input.displayName = 'Input';
 export { Input };
 //# sourceMappingURL=input.js.map

package/dist/react/components/input.js.map

@@ -1 +1 @@
-{"version":3,"file":"input.js","sourceRoot":"","sources":["../../../src/react/components/input.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAA;AACvC,OAAO,EAAE,uBAAuB,EAAE,MAAM,qBAAqB,CAAA;AAqE7D,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU;AAC5B,qEAAqE;AACrE,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,EAAE,UAAU,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACzE,OAAO,CACL,gBACE,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,EAAE,CACX,oYAAoY,EACpY,SAAS,CACV,EACD,GAAG,EAAE,GAAG,KACJ,KAAK,KACL,CAAC,WAAW,CAAC,CAAC,CAAC,uBAAuB,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,GACpE,CACH,CAAA;AACH,CAAC,CACF,CAAA;AACD,KAAK,CAAC,WAAW,GAAG,OAAO,CAAA;AAE3B,OAAO,EAAE,KAAK,EAAE,CAAA","sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport type { DeclaredInputFormat } from \"@ttt-productions/input-format-core\"\nimport { cn } from \"../../lib/utils.js\"\nimport { formatControlAttributes } from \"./format-control.js\"\n\n/**\n * The input types whose value the browser itself formats or picks — not free text — so they take no\n * input format. A free-text input (`type` omitted or `\"text\"`) takes one.\n */\nexport type BuiltInFormatInputType =\n  | \"password\"\n  | \"email\"\n  | \"number\"\n  | \"tel\"\n  | \"url\"\n  | \"search\"\n  | \"file\"\n  | \"color\"\n  | \"date\"\n  | \"datetime-local\"\n  | \"month\"\n  | \"week\"\n  | \"time\"\n  | \"range\"\n  | \"checkbox\"\n  | \"radio\"\n  | \"hidden\"\n  | \"button\"\n  | \"submit\"\n  | \"reset\"\n  | \"image\"\n\ntype NativeInputProps = React.ComponentPropsWithoutRef<\"input\">\n\n/**\n * A free-text input: its declaration is required, and its bounds and its required state come only\n * from that declaration (ENG-005), so `maxLength`, `minLength`, `pattern`, and `required` are not\n * props.\n */\nexport type FreeTextInputProps = Omit<\n  NativeInputProps,\n  \"type\" | \"maxLength\" | \"minLength\" | \"pattern\" | \"required\"\n> & {\n  type?: \"text\"\n  inputFormat: DeclaredInputFormat\n  textEntry?: never\n}\n\n/**\n * What a text box that is not free text holds: digits typed as text (a date-of-birth part, a share\n * count, a one-time code) or an identifier (an account, document, or case id). Neither takes an\n * input format; each keeps its own native `maxLength`, `pattern`, and `inputMode`, and its value is\n * checked by its own rule (a whole-input number parse, the one-segment id rule).\n */\nexport type NonFreeTextEntry = \"numeric\" | \"identifier\"\n\n/** A text box that is not free text: no input format. */\nexport type NonFreeTextInputProps = Omit<NativeInputProps, \"type\"> & {\n  type?: \"text\"\n  textEntry: NonFreeTextEntry\n  inputFormat?: never\n}\n\n/** An input whose value the browser formats: no input format. */\nexport type BuiltInFormatInputProps = Omit<NativeInputProps, \"type\"> & {\n  type: BuiltInFormatInputType\n  inputFormat?: never\n  textEntry?: never\n}\n\nexport type InputProps = FreeTextInputProps | NonFreeTextInputProps | BuiltInFormatInputProps\n\nconst Input = React.forwardRef<HTMLInputElement, InputProps>(\n  // `textEntry` only selects the prop shape; it never reaches the DOM.\n  ({ className, type, inputFormat, textEntry: _textEntry, ...props }, ref) => {\n    return (\n      <input\n        type={type}\n        className={cn(\n          \"flex h-10 w-full rounded-md border-2 border-input bg-background px-3 py-2 text-base ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm\",\n          className\n        )}\n        ref={ref}\n        {...props}\n        {...(inputFormat ? formatControlAttributes(inputFormat, props) : {})}\n      />\n    )\n  }\n)\nInput.displayName = \"Input\"\n\nexport { Input }\n"]}
+{"version":3,"file":"input.js","sourceRoot":"","sources":["../../../src/react/components/input.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAC;AACxC,OAAO,EAAE,uBAAuB,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAqE1E,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU;AAC5B,qEAAqE;AACrE,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACjF,OAAO,CACL,gBACE,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,EAAE,CACX,oYAAoY,EACpY,SAAS,CACV,EACD,GAAG,EAAE,GAAG,KACJ,KAAK,KACL,CAAC,WAAW,CAAC,CAAC,CAAC,uBAAuB,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,EACpE,MAAM,EAAE,CAAC,KAAK,EAAE,EAAE;YAChB,IAAI,WAAW;gBAAE,UAAU,CAAC,KAAK,CAAC,aAAa,EAAE,WAAW,CAAC,CAAC;YAC9D,MAAM,EAAE,CAAC,KAAK,CAAC,CAAC;QAClB,CAAC,GACD,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AACF,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC;AAE5B,OAAO,EAAE,KAAK,EAAE,CAAC","sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { DeclaredInputFormat } from '@ttt-productions/input-format-core';\nimport { cn } from '../../lib/utils.js';\nimport { formatControlAttributes, tidyOnBlur } from './format-control.js';\n\n/**\n * The input types whose value the browser itself formats or picks — not free text — so they take no\n * input format. A free-text input (`type` omitted or `\"text\"`) takes one.\n */\nexport type BuiltInFormatInputType =\n  | 'password'\n  | 'email'\n  | 'number'\n  | 'tel'\n  | 'url'\n  | 'search'\n  | 'file'\n  | 'color'\n  | 'date'\n  | 'datetime-local'\n  | 'month'\n  | 'week'\n  | 'time'\n  | 'range'\n  | 'checkbox'\n  | 'radio'\n  | 'hidden'\n  | 'button'\n  | 'submit'\n  | 'reset'\n  | 'image';\n\ntype NativeInputProps = React.ComponentPropsWithoutRef<'input'>;\n\n/**\n * A free-text input: its declaration is required, and its bounds and its required state come only\n * from that declaration (ENG-005), so `maxLength`, `minLength`, `pattern`, and `required` are not\n * props.\n */\nexport type FreeTextInputProps = Omit<\n  NativeInputProps,\n  'type' | 'maxLength' | 'minLength' | 'pattern' | 'required'\n> & {\n  type?: 'text';\n  inputFormat: DeclaredInputFormat;\n  textEntry?: never;\n};\n\n/**\n * What a text box that is not free text holds: digits typed as text (a date-of-birth part, a share\n * count, a one-time code) or an identifier (an account, document, or case id). Neither takes an\n * input format; each keeps its own native `maxLength`, `pattern`, and `inputMode`, and its value is\n * checked by its own rule (a whole-input number parse, the one-segment id rule).\n */\nexport type NonFreeTextEntry = 'numeric' | 'identifier';\n\n/** A text box that is not free text: no input format. */\nexport type NonFreeTextInputProps = Omit<NativeInputProps, 'type'> & {\n  type?: 'text';\n  textEntry: NonFreeTextEntry;\n  inputFormat?: never;\n};\n\n/** An input whose value the browser formats: no input format. */\nexport type BuiltInFormatInputProps = Omit<NativeInputProps, 'type'> & {\n  type: BuiltInFormatInputType;\n  inputFormat?: never;\n  textEntry?: never;\n};\n\nexport type InputProps = FreeTextInputProps | NonFreeTextInputProps | BuiltInFormatInputProps;\n\nconst Input = React.forwardRef<HTMLInputElement, InputProps>(\n  // `textEntry` only selects the prop shape; it never reaches the DOM.\n  ({ className, type, inputFormat, textEntry: _textEntry, onBlur, ...props }, ref) => {\n    return (\n      <input\n        type={type}\n        className={cn(\n          'flex h-10 w-full rounded-md border-2 border-input bg-background px-3 py-2 text-base ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',\n          className,\n        )}\n        ref={ref}\n        {...props}\n        {...(inputFormat ? formatControlAttributes(inputFormat, props) : {})}\n        onBlur={(event) => {\n          if (inputFormat) tidyOnBlur(event.currentTarget, inputFormat);\n          onBlur?.(event);\n        }}\n      />\n    );\n  },\n);\nInput.displayName = 'Input';\n\nexport { Input };\n"]}

package/dist/react/components/label.d.ts

@@ -1,6 +1,6 @@
-import * as React from "react";
-import * as LabelPrimitive from "@radix-ui/react-label";
-import { type VariantProps } from "class-variance-authority";
+import * as React from 'react';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { type VariantProps } from 'class-variance-authority';
 declare const Label: React.ForwardRefExoticComponent<Omit<LabelPrimitive.LabelProps & React.RefAttributes<HTMLLabelElement>, "ref"> & VariantProps<(props?: import("class-variance-authority/types").ClassProp | undefined) => string> & React.RefAttributes<HTMLLabelElement>>;
 export { Label };
 //# sourceMappingURL=label.d.ts.map

package/dist/react/components/label.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"label.d.ts","sourceRoot":"","sources":["../../../src/react/components/label.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,cAAc,MAAM,uBAAuB,CAAA;AACvD,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAQjE,QAAA,MAAM,KAAK,4PAKT,CAAA;AAGF,OAAO,EAAE,KAAK,EAAE,CAAA"}
+{"version":3,"file":"label.d.ts","sourceRoot":"","sources":["../../../src/react/components/label.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,cAAc,MAAM,uBAAuB,CAAC;AACxD,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAQlE,QAAA,MAAM,KAAK,4PAKT,CAAC;AAGH,OAAO,EAAE,KAAK,EAAE,CAAC"}

package/dist/react/components/label.js

@@ -1,10 +1,10 @@
-"use client";
+'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
-import * as React from "react";
-import * as LabelPrimitive from "@radix-ui/react-label";
-import { cva } from "class-variance-authority";
-import { cn } from "../../lib/utils.js";
-const labelVariants = cva("text-sm font-bold leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70");
+import * as React from 'react';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { cva } from 'class-variance-authority';
+import { cn } from '../../lib/utils.js';
+const labelVariants = cva('text-sm font-bold leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70');
 const Label = React.forwardRef(({ className, ...props }, ref) => (_jsx(LabelPrimitive.Root, { ref: ref, className: cn(labelVariants(), className), ...props })));
 Label.displayName = LabelPrimitive.Root.displayName;
 export { Label };

package/dist/react/components/label.js.map

@@ -1 +1 @@
-{"version":3,"file":"label.js","sourceRoot":"","sources":["../../../src/react/components/label.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,cAAc,MAAM,uBAAuB,CAAA;AACvD,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAA;AAEjE,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAA;AAEvC,MAAM,aAAa,GAAG,GAAG,CACvB,0FAA0F,CAC3F,CAAA;AAED,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAG5B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAClC,KAAC,cAAc,CAAC,IAAI,IAAC,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,CAAC,aAAa,EAAE,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,CACxF,CAAC,CAAA;AACF,KAAK,CAAC,WAAW,GAAG,cAAc,CAAC,IAAI,CAAC,WAAW,CAAA;AAEnD,OAAO,EAAE,KAAK,EAAE,CAAA","sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport * as LabelPrimitive from \"@radix-ui/react-label\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\n\nimport { cn } from \"../../lib/utils.js\"\n\nconst labelVariants = cva(\n  \"text-sm font-bold leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70\"\n)\n\nconst Label = React.forwardRef<\n  React.ElementRef<typeof LabelPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> & VariantProps<typeof labelVariants>\n>(({ className, ...props }, ref) => (\n  <LabelPrimitive.Root ref={ref} className={cn(labelVariants(), className)} {...props} />\n))\nLabel.displayName = LabelPrimitive.Root.displayName\n\nexport { Label }\n"]}
+{"version":3,"file":"label.js","sourceRoot":"","sources":["../../../src/react/components/label.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,cAAc,MAAM,uBAAuB,CAAC;AACxD,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAC;AAElE,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAC;AAExC,MAAM,aAAa,GAAG,GAAG,CACvB,0FAA0F,CAC3F,CAAC;AAEF,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAG5B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAClC,KAAC,cAAc,CAAC,IAAI,IAAC,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,CAAC,aAAa,EAAE,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,CACxF,CAAC,CAAC;AACH,KAAK,CAAC,WAAW,GAAG,cAAc,CAAC,IAAI,CAAC,WAAW,CAAC;AAEpD,OAAO,EAAE,KAAK,EAAE,CAAC","sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport * as LabelPrimitive from '@radix-ui/react-label';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '../../lib/utils.js';\n\nconst labelVariants = cva(\n  'text-sm font-bold leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70',\n);\n\nconst Label = React.forwardRef<\n  React.ElementRef<typeof LabelPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> & VariantProps<typeof labelVariants>\n>(({ className, ...props }, ref) => (\n  <LabelPrimitive.Root ref={ref} className={cn(labelVariants(), className)} {...props} />\n));\nLabel.displayName = LabelPrimitive.Root.displayName;\n\nexport { Label };\n"]}

package/dist/react/components/layout/screen-adaptive-view.d.ts

@@ -1,5 +1,5 @@
-import * as React from "react";
-export type MaxWidthOption = "none" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "full";
+import * as React from 'react';
+export type MaxWidthOption = 'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | '7xl' | 'full';
 export interface ScreenAdaptiveViewProps {
     /** Default content (mobile + base) */
     children: React.ReactNode;

package/dist/react/components/layout/screen-adaptive-view.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"screen-adaptive-view.d.ts","sourceRoot":"","sources":["../../../../src/react/components/layout/screen-adaptive-view.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,MAAM,cAAc,GACtB,MAAM,GACN,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,IAAI,GACJ,KAAK,GACL,KAAK,GACL,KAAK,GACL,KAAK,GACL,KAAK,GACL,KAAK,GACL,MAAM,CAAC;AAEX,MAAM,WAAW,uBAAuB;IACtC,sCAAsC;IACtC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B,2CAA2C;IAC3C,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE5B,2CAA2C;IAC3C,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE5B,yCAAyC;IACzC,UAAU,CAAC,EAAE,cAAc,CAAC;IAE5B,yCAAyC;IACzC,UAAU,CAAC,EAAE,cAAc,CAAC;IAE5B,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,2CAA2C;IAC3C,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAiCD,wBAAgB,kBAAkB,CAAC,EACjC,QAAQ,EACR,SAAS,EACT,SAAS,EACT,UAAkB,EAClB,UAAkB,EAClB,SAAS,EACT,cAAc,GACf,EAAE,uBAAuB,qBAuBzB"}
+{"version":3,"file":"screen-adaptive-view.d.ts","sourceRoot":"","sources":["../../../../src/react/components/layout/screen-adaptive-view.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,MAAM,cAAc,GACxB,MAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,KAAK,GAAG,MAAM,CAAC;AAE9F,MAAM,WAAW,uBAAuB;IACtC,sCAAsC;IACtC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B,2CAA2C;IAC3C,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE5B,2CAA2C;IAC3C,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAE5B,yCAAyC;IACzC,UAAU,CAAC,EAAE,cAAc,CAAC;IAE5B,yCAAyC;IACzC,UAAU,CAAC,EAAE,cAAc,CAAC;IAE5B,2CAA2C;IAC3C,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,2CAA2C;IAC3C,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAiCD,wBAAgB,kBAAkB,CAAC,EACjC,QAAQ,EACR,SAAS,EACT,SAAS,EACT,UAAkB,EAClB,UAAkB,EAClB,SAAS,EACT,cAAc,GACf,EAAE,uBAAuB,qBAwBzB"}

package/dist/react/components/layout/screen-adaptive-view.js

@@ -1,48 +1,52 @@
-"use client";
+'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
-import { cn } from "../../../lib/utils.js";
-import { useMediaQuery } from "../../hooks/use-media-query.js";
+import { cn } from '../../../lib/utils.js';
+import { useMediaQuery } from '../../hooks/use-media-query.js';
 function widthClass(opt) {
     switch (opt) {
-        case "none":
-            return "screen-max-w-none";
-        case "sm":
-            return "screen-max-w-sm";
-        case "md":
-            return "screen-max-w-md";
-        case "lg":
-            return "screen-max-w-lg";
-        case "xl":
-            return "screen-max-w-xl";
-        case "2xl":
-            return "screen-max-w-2xl";
-        case "3xl":
-            return "screen-max-w-3xl";
-        case "4xl":
-            return "screen-max-w-4xl";
-        case "5xl":
-            return "screen-max-w-5xl";
-        case "6xl":
-            return "screen-max-w-6xl";
-        case "7xl":
-            return "screen-max-w-7xl";
-        case "full":
-            return "screen-max-w-full";
+        case 'none':
+            return 'screen-max-w-none';
+        case 'sm':
+            return 'screen-max-w-sm';
+        case 'md':
+            return 'screen-max-w-md';
+        case 'lg':
+            return 'screen-max-w-lg';
+        case 'xl':
+            return 'screen-max-w-xl';
+        case '2xl':
+            return 'screen-max-w-2xl';
+        case '3xl':
+            return 'screen-max-w-3xl';
+        case '4xl':
+            return 'screen-max-w-4xl';
+        case '5xl':
+            return 'screen-max-w-5xl';
+        case '6xl':
+            return 'screen-max-w-6xl';
+        case '7xl':
+            return 'screen-max-w-7xl';
+        case 'full':
+            return 'screen-max-w-full';
         default:
-            return "screen-max-w-6xl";
+            return 'screen-max-w-6xl';
     }
 }
-export function ScreenAdaptiveView({ children, lgContent, xlContent, lgMaxWidth = "4xl", xlMaxWidth = "6xl", className, innerClassName, }) {
-    const isLg = useMediaQuery("(min-width: 1024px)");
-    const isXl = useMediaQuery("(min-width: 1280px)");
+export function ScreenAdaptiveView({ children, lgContent, xlContent, lgMaxWidth = '4xl', xlMaxWidth = '6xl', className, innerClassName, }) {
+    const isLg = useMediaQuery('(min-width: 1024px)');
+    const isXl = useMediaQuery('(min-width: 1280px)');
     // SSR-safe default: render base children as mobile (no max-width)
     // After hydration, swaps to lg/xl content if provided.
-    const contentToShow = (isXl && xlContent !== undefined && xlContent !== null)
+    const contentToShow = isXl && xlContent !== undefined && xlContent !== null
         ? xlContent
-        : (isLg && lgContent !== undefined && lgContent !== null)
+        : isLg && lgContent !== undefined && lgContent !== null
             ? lgContent
             : children;
-    const sizeClass = isXl ? widthClass(xlMaxWidth) : isLg ? widthClass(lgMaxWidth) : "screen-max-w-full";
-    return (_jsx("div", { className: cn("screen-adaptive-root", className), children: _jsx("div", { className: cn("screen-adaptive-inner", sizeClass, innerClassName), children: contentToShow }) }));
+    const sizeClass = isXl
+        ? widthClass(xlMaxWidth)
+        : isLg
+            ? widthClass(lgMaxWidth)
+            : 'screen-max-w-full';
+    return (_jsx("div", { className: cn('screen-adaptive-root', className), children: _jsx("div", { className: cn('screen-adaptive-inner', sizeClass, innerClassName), children: contentToShow }) }));
 }
 //# sourceMappingURL=screen-adaptive-view.js.map

package/dist/react/components/layout/screen-adaptive-view.js.map

@@ -1 +1 @@
-{"version":3,"file":"screen-adaptive-view.js","sourceRoot":"","sources":["../../../../src/react/components/layout/screen-adaptive-view.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,EAAE,EAAE,MAAM,uBAAuB,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,gCAAgC,CAAC;AAuC/D,SAAS,UAAU,CAAC,GAA+B;IACjD,QAAQ,GAAG,EAAE,CAAC;QACZ,KAAK,MAAM;YACT,OAAO,mBAAmB,CAAC;QAC7B,KAAK,IAAI;YACP,OAAO,iBAAiB,CAAC;QAC3B,KAAK,IAAI;YACP,OAAO,iBAAiB,CAAC;QAC3B,KAAK,IAAI;YACP,OAAO,iBAAiB,CAAC;QAC3B,KAAK,IAAI;YACP,OAAO,iBAAiB,CAAC;QAC3B,KAAK,KAAK;YACR,OAAO,kBAAkB,CAAC;QAC5B,KAAK,KAAK;YACR,OAAO,kBAAkB,CAAC;QAC5B,KAAK,KAAK;YACR,OAAO,kBAAkB,CAAC;QAC5B,KAAK,KAAK;YACR,OAAO,kBAAkB,CAAC;QAC5B,KAAK,KAAK;YACR,OAAO,kBAAkB,CAAC;QAC5B,KAAK,KAAK;YACR,OAAO,kBAAkB,CAAC;QAC5B,KAAK,MAAM;YACT,OAAO,mBAAmB,CAAC;QAC7B;YACE,OAAO,kBAAkB,CAAC;IAC9B,CAAC;AACH,CAAC;AAED,MAAM,UAAU,kBAAkB,CAAC,EACjC,QAAQ,EACR,SAAS,EACT,SAAS,EACT,UAAU,GAAG,KAAK,EAClB,UAAU,GAAG,KAAK,EAClB,SAAS,EACT,cAAc,GACU;IACxB,MAAM,IAAI,GAAG,aAAa,CAAC,qBAAqB,CAAC,CAAC;IAClD,MAAM,IAAI,GAAG,aAAa,CAAC,qBAAqB,CAAC,CAAC;IAElD,kEAAkE;IAClE,uDAAuD;IACvD,MAAM,aAAa,GACjB,CAAC,IAAI,IAAI,SAAS,KAAK,SAAS,IAAI,SAAS,KAAK,IAAI,CAAC;QACrD,CAAC,CAAC,SAAS;QACX,CAAC,CAAC,CAAC,IAAI,IAAI,SAAS,KAAK,SAAS,IAAI,SAAS,KAAK,IAAI,CAAC;YACvD,CAAC,CAAC,SAAS;YACX,CAAC,CAAC,QAAQ,CAAC;IAEjB,MAAM,SAAS,GACb,IAAI,CAAC,CAAC,CAAC,UAAU,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,UAAU,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,mBAAmB,CAAC;IAEtF,OAAO,CACL,cAAK,SAAS,EAAE,EAAE,CAAC,sBAAsB,EAAE,SAAS,CAAC,YACnD,cAAK,SAAS,EAAE,EAAE,CAAC,uBAAuB,EAAE,SAAS,EAAE,cAAc,CAAC,YACnE,aAAa,GACV,GACF,CACP,CAAC;AACJ,CAAC","sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../../../lib/utils.js\";\nimport { useMediaQuery } from \"../../hooks/use-media-query.js\";\n\nexport type MaxWidthOption =\n  | \"none\"\n  | \"sm\"\n  | \"md\"\n  | \"lg\"\n  | \"xl\"\n  | \"2xl\"\n  | \"3xl\"\n  | \"4xl\"\n  | \"5xl\"\n  | \"6xl\"\n  | \"7xl\"\n  | \"full\";\n\nexport interface ScreenAdaptiveViewProps {\n  /** Default content (mobile + base) */\n  children: React.ReactNode;\n\n  /** Optional content to use on lg and up */\n  lgContent?: React.ReactNode;\n\n  /** Optional content to use on xl and up */\n  xlContent?: React.ReactNode;\n\n  /** Max width applied at lg (>=1024px) */\n  lgMaxWidth?: MaxWidthOption;\n\n  /** Max width applied at xl (>=1280px) */\n  xlMaxWidth?: MaxWidthOption;\n\n  /** App-only escape hatch (try to avoid) */\n  className?: string;\n\n  /** App-only escape hatch (try to avoid) */\n  innerClassName?: string;\n}\n\nfunction widthClass(opt: MaxWidthOption | undefined) {\n  switch (opt) {\n    case \"none\":\n      return \"screen-max-w-none\";\n    case \"sm\":\n      return \"screen-max-w-sm\";\n    case \"md\":\n      return \"screen-max-w-md\";\n    case \"lg\":\n      return \"screen-max-w-lg\";\n    case \"xl\":\n      return \"screen-max-w-xl\";\n    case \"2xl\":\n      return \"screen-max-w-2xl\";\n    case \"3xl\":\n      return \"screen-max-w-3xl\";\n    case \"4xl\":\n      return \"screen-max-w-4xl\";\n    case \"5xl\":\n      return \"screen-max-w-5xl\";\n    case \"6xl\":\n      return \"screen-max-w-6xl\";\n    case \"7xl\":\n      return \"screen-max-w-7xl\";\n    case \"full\":\n      return \"screen-max-w-full\";\n    default:\n      return \"screen-max-w-6xl\";\n  }\n}\n\nexport function ScreenAdaptiveView({\n  children,\n  lgContent,\n  xlContent,\n  lgMaxWidth = \"4xl\",\n  xlMaxWidth = \"6xl\",\n  className,\n  innerClassName,\n}: ScreenAdaptiveViewProps) {\n  const isLg = useMediaQuery(\"(min-width: 1024px)\");\n  const isXl = useMediaQuery(\"(min-width: 1280px)\");\n\n  // SSR-safe default: render base children as mobile (no max-width)\n  // After hydration, swaps to lg/xl content if provided.\n  const contentToShow =\n    (isXl && xlContent !== undefined && xlContent !== null)\n      ? xlContent\n      : (isLg && lgContent !== undefined && lgContent !== null)\n        ? lgContent\n        : children;\n\n  const sizeClass =\n    isXl ? widthClass(xlMaxWidth) : isLg ? widthClass(lgMaxWidth) : \"screen-max-w-full\";\n\n  return (\n    <div className={cn(\"screen-adaptive-root\", className)}>\n      <div className={cn(\"screen-adaptive-inner\", sizeClass, innerClassName)}>\n        {contentToShow}\n      </div>\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"screen-adaptive-view.js","sourceRoot":"","sources":["../../../../src/react/components/layout/screen-adaptive-view.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,EAAE,EAAE,MAAM,uBAAuB,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,gCAAgC,CAAC;AA4B/D,SAAS,UAAU,CAAC,GAA+B;IACjD,QAAQ,GAAG,EAAE,CAAC;QACZ,KAAK,MAAM;YACT,OAAO,mBAAmB,CAAC;QAC7B,KAAK,IAAI;YACP,OAAO,iBAAiB,CAAC;QAC3B,KAAK,IAAI;YACP,OAAO,iBAAiB,CAAC;QAC3B,KAAK,IAAI;YACP,OAAO,iBAAiB,CAAC;QAC3B,KAAK,IAAI;YACP,OAAO,iBAAiB,CAAC;QAC3B,KAAK,KAAK;YACR,OAAO,kBAAkB,CAAC;QAC5B,KAAK,KAAK;YACR,OAAO,kBAAkB,CAAC;QAC5B,KAAK,KAAK;YACR,OAAO,kBAAkB,CAAC;QAC5B,KAAK,KAAK;YACR,OAAO,kBAAkB,CAAC;QAC5B,KAAK,KAAK;YACR,OAAO,kBAAkB,CAAC;QAC5B,KAAK,KAAK;YACR,OAAO,kBAAkB,CAAC;QAC5B,KAAK,MAAM;YACT,OAAO,mBAAmB,CAAC;QAC7B;YACE,OAAO,kBAAkB,CAAC;IAC9B,CAAC;AACH,CAAC;AAED,MAAM,UAAU,kBAAkB,CAAC,EACjC,QAAQ,EACR,SAAS,EACT,SAAS,EACT,UAAU,GAAG,KAAK,EAClB,UAAU,GAAG,KAAK,EAClB,SAAS,EACT,cAAc,GACU;IACxB,MAAM,IAAI,GAAG,aAAa,CAAC,qBAAqB,CAAC,CAAC;IAClD,MAAM,IAAI,GAAG,aAAa,CAAC,qBAAqB,CAAC,CAAC;IAElD,kEAAkE;IAClE,uDAAuD;IACvD,MAAM,aAAa,GACjB,IAAI,IAAI,SAAS,KAAK,SAAS,IAAI,SAAS,KAAK,IAAI;QACnD,CAAC,CAAC,SAAS;QACX,CAAC,CAAC,IAAI,IAAI,SAAS,KAAK,SAAS,IAAI,SAAS,KAAK,IAAI;YACrD,CAAC,CAAC,SAAS;YACX,CAAC,CAAC,QAAQ,CAAC;IAEjB,MAAM,SAAS,GAAG,IAAI;QACpB,CAAC,CAAC,UAAU,CAAC,UAAU,CAAC;QACxB,CAAC,CAAC,IAAI;YACJ,CAAC,CAAC,UAAU,CAAC,UAAU,CAAC;YACxB,CAAC,CAAC,mBAAmB,CAAC;IAE1B,OAAO,CACL,cAAK,SAAS,EAAE,EAAE,CAAC,sBAAsB,EAAE,SAAS,CAAC,YACnD,cAAK,SAAS,EAAE,EAAE,CAAC,uBAAuB,EAAE,SAAS,EAAE,cAAc,CAAC,YAAG,aAAa,GAAO,GACzF,CACP,CAAC;AACJ,CAAC","sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { cn } from '../../../lib/utils.js';\nimport { useMediaQuery } from '../../hooks/use-media-query.js';\n\nexport type MaxWidthOption =\n  'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl' | '7xl' | 'full';\n\nexport interface ScreenAdaptiveViewProps {\n  /** Default content (mobile + base) */\n  children: React.ReactNode;\n\n  /** Optional content to use on lg and up */\n  lgContent?: React.ReactNode;\n\n  /** Optional content to use on xl and up */\n  xlContent?: React.ReactNode;\n\n  /** Max width applied at lg (>=1024px) */\n  lgMaxWidth?: MaxWidthOption;\n\n  /** Max width applied at xl (>=1280px) */\n  xlMaxWidth?: MaxWidthOption;\n\n  /** App-only escape hatch (try to avoid) */\n  className?: string;\n\n  /** App-only escape hatch (try to avoid) */\n  innerClassName?: string;\n}\n\nfunction widthClass(opt: MaxWidthOption | undefined) {\n  switch (opt) {\n    case 'none':\n      return 'screen-max-w-none';\n    case 'sm':\n      return 'screen-max-w-sm';\n    case 'md':\n      return 'screen-max-w-md';\n    case 'lg':\n      return 'screen-max-w-lg';\n    case 'xl':\n      return 'screen-max-w-xl';\n    case '2xl':\n      return 'screen-max-w-2xl';\n    case '3xl':\n      return 'screen-max-w-3xl';\n    case '4xl':\n      return 'screen-max-w-4xl';\n    case '5xl':\n      return 'screen-max-w-5xl';\n    case '6xl':\n      return 'screen-max-w-6xl';\n    case '7xl':\n      return 'screen-max-w-7xl';\n    case 'full':\n      return 'screen-max-w-full';\n    default:\n      return 'screen-max-w-6xl';\n  }\n}\n\nexport function ScreenAdaptiveView({\n  children,\n  lgContent,\n  xlContent,\n  lgMaxWidth = '4xl',\n  xlMaxWidth = '6xl',\n  className,\n  innerClassName,\n}: ScreenAdaptiveViewProps) {\n  const isLg = useMediaQuery('(min-width: 1024px)');\n  const isXl = useMediaQuery('(min-width: 1280px)');\n\n  // SSR-safe default: render base children as mobile (no max-width)\n  // After hydration, swaps to lg/xl content if provided.\n  const contentToShow =\n    isXl && xlContent !== undefined && xlContent !== null\n      ? xlContent\n      : isLg && lgContent !== undefined && lgContent !== null\n        ? lgContent\n        : children;\n\n  const sizeClass = isXl\n    ? widthClass(xlMaxWidth)\n    : isLg\n      ? widthClass(lgMaxWidth)\n      : 'screen-max-w-full';\n\n  return (\n    <div className={cn('screen-adaptive-root', className)}>\n      <div className={cn('screen-adaptive-inner', sizeClass, innerClassName)}>{contentToShow}</div>\n    </div>\n  );\n}\n"]}

package/dist/react/components/list-pagination.d.ts

@@ -1,4 +1,4 @@
-import type { ListPaginationState } from "../hooks/use-paged-list.js";
+import type { ListPaginationState } from '../hooks/use-paged-list.js';
 export interface ListPaginationProps {
     /**
      * Page state from `usePagedList` (known total),

package/dist/react/components/list-pagination.js

@@ -1,9 +1,9 @@
-"use client";
+'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from "react";
-import { ChevronLeft, ChevronRight } from "lucide-react";
-import { Button } from "./button.js";
-import { cn } from "../../lib/utils.js";
+import { useState } from 'react';
+import { ChevronLeft, ChevronRight } from 'lucide-react';
+import { Button } from './button.js';
+import { cn } from '../../lib/utils.js';
 /**
  * The ONE Previous / counter / Next control for paginated lists, in both
  * flavors. Pair it with the hook that owns the page state (`usePagedList` for a
@@ -34,8 +34,8 @@ export function ListPagination({ pagination, busy = false, className }) {
         if (!busy)
             setClicked(null);
     }
-    const previousPending = busy && clicked === "previous";
-    const nextPending = busy && clicked === "next";
+    const previousPending = busy && clicked === 'previous';
+    const nextPending = busy && clicked === 'next';
     const previousUnavailable = busy || !canPreviousPage;
     const nextUnavailable = busy || !canNextPage;
     // One visibility rule for both flavors. For a known total this is exactly
@@ -46,15 +46,15 @@ export function ListPagination({ pagination, busy = false, className }) {
     // controls grey out in place instead of vanishing mid-fetch.
     if (!canPreviousPage && !canNextPage)
         return null;
-    return (_jsxs("div", { className: cn("flex w-full items-center justify-between gap-4 mt-4", className), children: [_jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: () => {
+    return (_jsxs("div", { className: cn('flex w-full items-center justify-between gap-4 mt-4', className), children: [_jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: () => {
                     if (previousUnavailable)
                         return;
-                    setClicked("previous");
+                    setClicked('previous');
                     goToPreviousPage();
                 }, "aria-disabled": previousUnavailable || undefined, pending: previousPending, icon: _jsx(ChevronLeft, { className: "icon-xs" }), className: "h-11 min-w-11", children: "Previous" }), _jsx("span", { className: "text-counter", role: "status", children: totalPages === undefined ? `Page ${currentPage}` : `${currentPage} of ${totalPages}` }), _jsxs(Button, { type: "button", variant: "outline", size: "sm", onClick: () => {
                     if (nextUnavailable)
                         return;
-                    setClicked("next");
+                    setClicked('next');
                     goToNextPage();
                 }, "aria-disabled": nextUnavailable || undefined, pending: nextPending, className: "h-11 min-w-11", children: ["Next", nextPending ? null : _jsx(ChevronRight, { className: "icon-xs" })] })] }));
 }