@cryptlex/web-components 6.7.9 → 6.7.11

package/dist/components/date-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-picker.js","sources":["../../lib/components/date-picker.tsx"],"sourcesContent":["'use client';\nimport {\n    DatePicker as AriaDatePicker,\n    DatePickerProps as AriaDatePickerProps,\n    DateRangePicker as AriaDateRangePicker,\n    DateRangePickerProps as AriaDateRangePickerProps,\n    DateValue as AriaDateValue,\n    Dialog as AriaDialog,\n    DialogProps as AriaDialogProps,\n    PopoverProps as AriaPopoverProps,\n    composeRenderProps,\n    Popover,\n} from 'react-aria-components';\n\nimport { getLocalTimeZone, parseAbsolute, toZoned, type ZonedDateTime } from '@internationalized/date';\nimport { Button } from '../components/button';\nimport { Calendar, RangeCalendar } from '../components/calendar';\nimport { DateInput } from '../components/datefield';\nimport { getFieldErrorMessage } from '../utilities/form';\nimport { useFieldContext } from '../utilities/form-context';\nimport { classNames } from '../utilities/theme';\nimport { FieldGroup, FormField, type FormFieldProps } from './form';\nimport { IcDate } from './icons';\n\n/**\n * Popover container for date picker content.\n *\n * @remarks\n * Provides consistent styling and positioning for the calendar popup.\n */\nconst DatePickerContent = ({\n    className,\n    popoverClassName,\n    ...props\n}: AriaDialogProps & { popoverClassName?: AriaPopoverProps['className'] }) => (\n    <Popover\n        className={composeRenderProps(popoverClassName, className =>\n            classNames('w-auto p-3 bg-surface-primary border', className)\n        )}\n    >\n        <AriaDialog\n            className={classNames(\n                'flex w-full flex-col gap-y-2 outline-none sm:flex-row sm:gap-x-icon sm:gap-y-0',\n                className\n            )}\n            {...props}\n        />\n    </Popover>\n);\n\ninterface DatePickerProps<T extends AriaDateValue> extends AriaDatePickerProps<T>, FormFieldProps {}\n\n/**\n * Date picker component for selecting single dates.\n *\n * @remarks\n * Built with React Aria for accessibility and internationalization support.\n * Supports date validation, min/max values, and custom date formatting.\n *\n * @example\n * ```tsx\n * <DatePicker\n *   label=\"Event Date\"\n *   isRequired\n *   minValue={today(getLocalTimeZone())}\n * />\n * ```\n */\nexport function DatePicker<T extends AriaDateValue>({\n    label,\n    description,\n    errorMessage,\n    requiredIndicator,\n    className,\n    ...props\n}: DatePickerProps<T>) {\n    return (\n        <AriaDatePicker\n            className={composeRenderProps(className, className => classNames('group flex flex-col gap-2', className))}\n            {...props}\n        >\n            <FormField {...{ label, description, errorMessage, requiredIndicator }}>\n                <FieldGroup>\n                    <DateInput className=\"flex-1\" variant=\"ghost\" />\n                    <Button variant=\"ghost\" size=\"icon\" className={'-me-3 ms-2'}>\n                        <IcDate aria-hidden />\n                    </Button>\n                </FieldGroup>\n            </FormField>\n            <DatePickerContent>\n                <Calendar />\n            </DatePickerContent>\n        </AriaDatePicker>\n    );\n}\n\n/**\n * Form-integrated date picker that works with TanStack Form.\n *\n * @remarks\n * Automatically handles form state, validation, and error messages.\n * Uses the field context to connect with the form's validation system.\n */\nexport function TfDatePicker({\n    ...props\n}: Omit<DatePickerProps<ZonedDateTime>, 'value' | 'onChange' | 'onBlur' | 'isInvalid' | 'errorMessage'>) {\n    const field = useFieldContext<string | null>({ disabled: props.isDisabled });\n    return (\n        <DatePicker\n            requiredIndicator={field.isRequired}\n            hideTimeZone\n            granularity=\"day\"\n            isDisabled={props.isDisabled || field.isSubmitting}\n            value={field.state.value ? parseAbsolute(field.state.value, getLocalTimeZone()) : null}\n            onChange={v =>\n                v ? field.handleChange(toZoned(v, getLocalTimeZone()).toAbsoluteString()) : field.handleChange(null)\n            }\n            onBlur={field.handleBlur}\n            isInvalid={!!getFieldErrorMessage(field)}\n            errorMessage={getFieldErrorMessage(field)}\n            {...props}\n        />\n    );\n}\n\ninterface DateRangePickerProps<T extends AriaDateValue> extends AriaDateRangePickerProps<T>, FormFieldProps {}\n\n/**\n * Date range picker component for selecting start and end dates.\n *\n * @remarks\n * Allows users to select a date range with start and end values.\n * Built with React Aria for accessibility and internationalization support.\n * Features separate input fields for start and end dates with range validation.\n *\n * @example\n * ```tsx\n * <DateRangePicker\n *   label=\"Booking Period\"\n *   description=\"Select your stay dates\"\n *   isRequired\n * />\n * ```\n */\nexport function DateRangePicker<T extends AriaDateValue>({\n    label,\n    description,\n    errorMessage,\n    className,\n    ...props\n}: DateRangePickerProps<T>) {\n    return (\n        <AriaDateRangePicker\n            className={composeRenderProps(className, className => classNames('group flex flex-col gap-2', className))}\n            {...props}\n        >\n            <FormField label={label} errorMessage={errorMessage} description={description}>\n                <FieldGroup>\n                    <DateInput variant=\"ghost\" slot={'start'} />\n                    <span aria-hidden className=\"px-2 body-sm text-muted-foreground\">\n                        -\n                    </span>\n                    <DateInput className=\"flex-1\" variant=\"ghost\" slot={'end'} />\n                    <Button variant=\"ghost\" size=\"icon\" className=\"mr-1 data-[focus-visible]:ring-offset-0\">\n                        <IcDate aria-hidden />\n                    </Button>\n                </FieldGroup>\n            </FormField>\n            <DatePickerContent>\n                <RangeCalendar />\n            </DatePickerContent>\n        </AriaDateRangePicker>\n    );\n}\n"],"names":["DatePickerContent","className","popoverClassName","props","jsx","Popover","composeRenderProps","classNames","AriaDialog","DatePicker","label","description","errorMessage","requiredIndicator","jsxs","AriaDatePicker","FormField","FieldGroup","DateInput","Button","IcDate","Calendar","TfDatePicker","field","useFieldContext","parseAbsolute","getLocalTimeZone","v","toZoned","getFieldErrorMessage","DateRangePicker","AriaDateRangePicker","RangeCalendar"],"mappings":"60BA8BA,MAAMA,EAAoB,CAAC,CACvB,UAAAC,EACA,iBAAAC,EACA,GAAGC,CACP,IACIC,EAACC,EAAA,CACG,UAAWC,EAAmBJ,EAAkBD,GAC5CM,EAAW,uCAAwCN,CAAS,CAAA,EAGhE,SAAAG,EAACI,EAAA,CACG,UAAWD,EACP,iFACAN,CAAA,EAEH,GAAGE,CAAA,CAAA,CACR,CACJ,EAqBG,SAASM,EAAoC,CAChD,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,kBAAAC,EACA,UAAAZ,EACA,GAAGE,CACP,EAAuB,CACnB,OACIW,EAACC,EAAA,CACG,UAAWT,EAAmBL,EAAWA,GAAaM,EAAW,4BAA6BN,CAAS,CAAC,EACvG,GAAGE,EAEJ,SAAA,CAAAC,EAACY,EAAA,CAAgB,MAAAN,EAAO,YAAAC,EAAa,aAAAC,EAAc,kBAAAC,EAC/C,SAAAC,EAACG,EAAA,CACG,SAAA,CAAAb,EAACc,EAAA,CAAU,UAAU,SAAS,QAAQ,QAAQ,EAC9Cd,EAACe,EAAA,CAAO,QAAQ,QAAQ,KAAK,OAAO,UAAW,aAC3C,SAAAf,EAACgB,EAAA,CAAO,cAAW,EAAA,CAAC,CAAA,CACxB,CAAA,CAAA,CACJ,CAAA,CACJ,EACAhB,EAACJ,EAAA,CACG,SAAAI,EAACiB,EAAA,CAAA,CAAS,CAAA,CACd,CAAA,CAAA,CAAA,CAGZ,CASO,SAASC,EAAa,CACzB,GAAGnB,CACP,EAAyG,CACrG,MAAMoB,EAAQC,EAA+B,CAAE,SAAUrB,EAAM,WAAY,EAC3E,OACIC,EAACK,EAAA,CACG,kBAAmBc,EAAM,WACzB,aAAY,GACZ,YAAY,MACZ,WAAYpB,EAAM,YAAcoB,EAAM,aACtC,MAAOA,EAAM,MAAM,MAAQE,EAAcF,EAAM,MAAM,MAAOG,EAAA,CAAkB,EAAI,KAClF,SAAUC,GACNA,EAAIJ,EAAM,aAAaK,EAAQD,EAAGD,EAAA,CAAkB,EAAE,iBAAA,CAAkB,EAAIH,EAAM,aAAa,IAAI,EAEvG,OAAQA,EAAM,WACd,UAAW,CAAC,CAACM,EAAqBN,CAAK,EACvC,aAAcM,EAAqBN,CAAK,EACvC,GAAGpB,CAAA,CAAA,CAGhB,CAqBO,SAAS2B,EAAyC,CACrD,MAAApB,EACA,YAAAC,EACA,aAAAC,EACA,UAAAX,EACA,GAAGE,CACP,EAA4B,CACxB,OACIW,EAACiB,EAAA,CACG,UAAWzB,EAAmBL,EAAWA,GAAaM,EAAW,4BAA6BN,CAAS,CAAC,EACvG,GAAGE,EAEJ,SAAA,CAAAC,EAACY,EAAA,CAAU,MAAAN,EAAc,aAAAE,EAA4B,YAAAD,EACjD,WAACM,EAAA,CACG,SAAA,CAAAb,EAACc,EAAA,CAAU,QAAQ,QAAQ,KAAM,QAAS,IACzC,OAAA,CAAK,cAAW,GAAC,UAAU,qCAAqC,SAAA,IAEjE,IACCA,EAAA,CAAU,UAAU,SAAS,QAAQ,QAAQ,KAAM,MAAO,EAC3Dd,EAACe,EAAA,CAAO,QAAQ,QAAQ,KAAK,OAAO,UAAU,0CAC1C,SAAAf,EAACgB,EAAA,CAAO,cAAW,EAAA,CAAC,CAAA,CACxB,CAAA,CAAA,CACJ,CAAA,CACJ,EACAhB,EAACJ,EAAA,CACG,SAAAI,EAAC4B,EAAA,CAAA,CAAc,CAAA,CACnB,CAAA,CAAA,CAAA,CAGZ"}
+{"version":3,"file":"date-picker.js","names":[],"sources":["../../lib/components/date-picker.tsx"],"sourcesContent":["'use client';\nimport {\n    DatePicker as AriaDatePicker,\n    DatePickerProps as AriaDatePickerProps,\n    DateRangePicker as AriaDateRangePicker,\n    DateRangePickerProps as AriaDateRangePickerProps,\n    DateValue as AriaDateValue,\n    Dialog as AriaDialog,\n    DialogProps as AriaDialogProps,\n    PopoverProps as AriaPopoverProps,\n    composeRenderProps,\n    Popover,\n} from 'react-aria-components';\n\nimport { getLocalTimeZone, parseAbsolute, toZoned, type ZonedDateTime } from '@internationalized/date';\nimport { Button } from '../components/button';\nimport { Calendar, RangeCalendar } from '../components/calendar';\nimport { DateInput } from '../components/datefield';\nimport { getFieldErrorMessage } from '../utilities/form';\nimport { useFieldContext } from '../utilities/form-context';\nimport { classNames } from '../utilities/theme';\nimport { FieldGroup, FormField, type FormFieldProps } from './form';\nimport { IcDate } from './icons';\n\n/**\n * Popover container for date picker content.\n *\n * @remarks\n * Provides consistent styling and positioning for the calendar popup.\n */\nconst DatePickerContent = ({\n    className,\n    popoverClassName,\n    ...props\n}: AriaDialogProps & { popoverClassName?: AriaPopoverProps['className'] }) => (\n    <Popover\n        className={composeRenderProps(popoverClassName, className =>\n            classNames('w-auto p-3 bg-surface-primary border', className)\n        )}\n    >\n        <AriaDialog\n            className={classNames(\n                'flex w-full flex-col gap-y-2 outline-none sm:flex-row sm:gap-x-icon sm:gap-y-0',\n                className\n            )}\n            {...props}\n        />\n    </Popover>\n);\n\ninterface DatePickerProps<T extends AriaDateValue> extends AriaDatePickerProps<T>, FormFieldProps {}\n\n/**\n * Date picker component for selecting single dates.\n *\n * @remarks\n * Built with React Aria for accessibility and internationalization support.\n * Supports date validation, min/max values, and custom date formatting.\n *\n * @example\n * ```tsx\n * <DatePicker\n *   label=\"Event Date\"\n *   isRequired\n *   minValue={today(getLocalTimeZone())}\n * />\n * ```\n */\nexport function DatePicker<T extends AriaDateValue>({\n    label,\n    description,\n    errorMessage,\n    requiredIndicator,\n    className,\n    ...props\n}: DatePickerProps<T>) {\n    return (\n        <AriaDatePicker\n            className={composeRenderProps(className, className => classNames('group flex flex-col gap-2', className))}\n            {...props}\n        >\n            <FormField {...{ label, description, errorMessage, requiredIndicator }}>\n                <FieldGroup>\n                    <DateInput className=\"flex-1\" variant=\"ghost\" />\n                    <Button variant=\"ghost\" size=\"icon\" className={'-me-3 ms-2'}>\n                        <IcDate aria-hidden />\n                    </Button>\n                </FieldGroup>\n            </FormField>\n            <DatePickerContent>\n                <Calendar />\n            </DatePickerContent>\n        </AriaDatePicker>\n    );\n}\n\n/**\n * Form-integrated date picker that works with TanStack Form.\n *\n * @remarks\n * Automatically handles form state, validation, and error messages.\n * Uses the field context to connect with the form's validation system.\n */\nexport function TfDatePicker({\n    ...props\n}: Omit<DatePickerProps<ZonedDateTime>, 'value' | 'onChange' | 'onBlur' | 'isInvalid' | 'errorMessage'>) {\n    const field = useFieldContext<string | null>({ disabled: props.isDisabled });\n    return (\n        <DatePicker\n            requiredIndicator={field.isRequired}\n            hideTimeZone\n            granularity=\"day\"\n            isDisabled={props.isDisabled || field.isSubmitting}\n            value={field.state.value ? parseAbsolute(field.state.value, getLocalTimeZone()) : null}\n            onChange={v =>\n                v ? field.handleChange(toZoned(v, getLocalTimeZone()).toAbsoluteString()) : field.handleChange(null)\n            }\n            onBlur={field.handleBlur}\n            isInvalid={!!getFieldErrorMessage(field)}\n            errorMessage={getFieldErrorMessage(field)}\n            {...props}\n        />\n    );\n}\n\ninterface DateRangePickerProps<T extends AriaDateValue> extends AriaDateRangePickerProps<T>, FormFieldProps {}\n\n/**\n * Date range picker component for selecting start and end dates.\n *\n * @remarks\n * Allows users to select a date range with start and end values.\n * Built with React Aria for accessibility and internationalization support.\n * Features separate input fields for start and end dates with range validation.\n *\n * @example\n * ```tsx\n * <DateRangePicker\n *   label=\"Booking Period\"\n *   description=\"Select your stay dates\"\n *   isRequired\n * />\n * ```\n */\nexport function DateRangePicker<T extends AriaDateValue>({\n    label,\n    description,\n    errorMessage,\n    className,\n    ...props\n}: DateRangePickerProps<T>) {\n    return (\n        <AriaDateRangePicker\n            className={composeRenderProps(className, className => classNames('group flex flex-col gap-2', className))}\n            {...props}\n        >\n            <FormField label={label} errorMessage={errorMessage} description={description}>\n                <FieldGroup>\n                    <DateInput variant=\"ghost\" slot={'start'} />\n                    <span aria-hidden className=\"px-2 body-sm text-muted-foreground\">\n                        -\n                    </span>\n                    <DateInput className=\"flex-1\" variant=\"ghost\" slot={'end'} />\n                    <Button variant=\"ghost\" size=\"icon\" className=\"mr-1 data-[focus-visible]:ring-offset-0\">\n                        <IcDate aria-hidden />\n                    </Button>\n                </FieldGroup>\n            </FormField>\n            <DatePickerContent>\n                <RangeCalendar />\n            </DatePickerContent>\n        </AriaDateRangePicker>\n    );\n}\n"],"mappings":"mqBA8BA,IAAM,GAAqB,CACvB,YACA,mBACA,GAAG,KAEH,EAAC,EAAD,CACI,UAAW,EAAmB,EAAkB,GAC5C,EAAW,uCAAwC,CAAS,CAChE,EAEA,SAAA,EAAC,EAAD,CACI,UAAW,EACP,iFACA,CACJ,EACA,GAAI,CACP,CAAA,CACI,CAAA,EAqBb,SAAgB,EAAoC,CAChD,QACA,cACA,eACA,oBACA,YACA,GAAG,GACgB,CACnB,OACI,EAAC,EAAD,CACI,UAAW,EAAmB,EAAW,GAAa,EAAW,4BAA6B,CAAS,CAAC,EACxG,GAAI,EAFR,SAAA,CAII,EAAC,EAAD,CAAiB,QAAO,cAAa,eAAc,oBAC/C,SAAA,EAAC,EAAD,CAAA,SAAA,CACI,EAAC,EAAD,CAAW,UAAU,SAAS,QAAQ,OAAS,CAAA,EAC/C,EAAC,EAAD,CAAQ,QAAQ,QAAQ,KAAK,OAAO,UAAW,aAC3C,SAAA,EAAC,EAAD,CAAQ,cAAA,EAAa,CAAA,CACjB,CAAA,CACA,CAAA,CAAA,CACL,CAAA,EACX,EAAC,EAAD,CAAA,SACI,EAAC,EAAD,CAAW,CAAA,CACI,CAAA,CACP,GAExB,CASA,SAAgB,EAAa,CACzB,GAAG,GACkG,CACrG,IAAM,EAAQ,EAA+B,CAAE,SAAU,EAAM,UAAW,CAAC,EAC3E,OACI,EAAC,EAAD,CACI,kBAAmB,EAAM,WACzB,aAAA,GACA,YAAY,MACZ,WAAY,EAAM,YAAc,EAAM,aACtC,MAAO,EAAM,MAAM,MAAQ,EAAc,EAAM,MAAM,MAAO,EAAiB,CAAC,EAAI,KAClF,SAAU,GACN,EAAI,EAAM,aAAa,EAAQ,EAAG,EAAiB,CAAC,CAAC,CAAC,iBAAiB,CAAC,EAAI,EAAM,aAAa,IAAI,EAEvG,OAAQ,EAAM,WACd,UAAW,CAAC,CAAC,EAAqB,CAAK,EACvC,aAAc,EAAqB,CAAK,EACxC,GAAI,CACP,CAAA,CAET,CAqBA,SAAgB,EAAyC,CACrD,QACA,cACA,eACA,YACA,GAAG,GACqB,CACxB,OACI,EAAC,EAAD,CACI,UAAW,EAAmB,EAAW,GAAa,EAAW,4BAA6B,CAAS,CAAC,EACxG,GAAI,EAFR,SAAA,CAII,EAAC,EAAD,CAAkB,QAAqB,eAA2B,cAC9D,SAAA,EAAC,EAAD,CAAA,SAAA,CACI,EAAC,EAAD,CAAW,QAAQ,QAAQ,KAAM,OAAU,CAAA,EAC3C,EAAC,OAAD,CAAM,cAAA,GAAY,UAAU,qCAAqC,SAAA,GAE3D,CAAA,EACN,EAAC,EAAD,CAAW,UAAU,SAAS,QAAQ,QAAQ,KAAM,KAAQ,CAAA,EAC5D,EAAC,EAAD,CAAQ,QAAQ,QAAQ,KAAK,OAAO,UAAU,0CAC1C,SAAA,EAAC,EAAD,CAAQ,cAAA,EAAa,CAAA,CACjB,CAAA,CACA,CAAA,CAAA,CACL,CAAA,EACX,EAAC,EAAD,CAAA,SACI,EAAC,EAAD,CAAgB,CAAA,CACD,CAAA,CACF,GAE7B"}

package/dist/components/datefield.d.ts

@@ -1,13 +1,13 @@
 import { VariantProps } from 'class-variance-authority';
 import { DateFieldProps as AriaDateFieldProps, DateInputProps as AriaDateInputProps, DateSegmentProps as AriaDateSegmentProps, DateValue as AriaDateValue, TimeFieldProps as AriaTimeFieldProps, TimeValue as AriaTimeValue } from 'react-aria-components';
 import { fieldGroupVariants, FormFieldProps } from './form';
-export declare function DateSegment({ className, ...props }: AriaDateSegmentProps): import("react/jsx-runtime").JSX.Element;
+export declare function DateSegment({ className, ...props }: AriaDateSegmentProps): import("react").JSX.Element;
 interface DateInputProps extends AriaDateInputProps, VariantProps<typeof fieldGroupVariants> {
 }
-export declare function DateInput({ className, variant, ...props }: Omit<DateInputProps, 'children'>): import("react/jsx-runtime").JSX.Element;
+export declare function DateInput({ className, variant, ...props }: Omit<DateInputProps, 'children'>): import("react").JSX.Element;
 interface DateFieldProps<T extends AriaDateValue> extends AriaDateFieldProps<T>, FormFieldProps {
 }
-export declare function DateField<T extends AriaDateValue>({ label, description, className, errorMessage, ...props }: DateFieldProps<T>): import("react/jsx-runtime").JSX.Element;
+export declare function DateField<T extends AriaDateValue>({ label, description, className, errorMessage, ...props }: DateFieldProps<T>): import("react").JSX.Element;
 interface TimeFieldProps<T extends AriaTimeValue> extends AriaTimeFieldProps<T>, FormFieldProps {
 }
 /**
@@ -27,5 +27,5 @@ interface TimeFieldProps<T extends AriaTimeValue> extends AriaTimeFieldProps<T>,
  * />
  * ```
  */
-export declare function TimeField<T extends AriaTimeValue>({ label, description, errorMessage, className, ...props }: TimeFieldProps<T>): import("react/jsx-runtime").JSX.Element;
+export declare function TimeField<T extends AriaTimeValue>({ label, description, errorMessage, className, ...props }: TimeFieldProps<T>): import("react").JSX.Element;
 export {};

package/dist/components/datefield.js

@@ -1,2 +1,2 @@
-"use client";import{jsx as e}from"react/jsx-runtime";import{DateInput as m,composeRenderProps as i,DateSegment as u,DateField as p,TimeField as f}from"react-aria-components";import{classNames as o}from"../utilities/theme.js";import{fieldGroupVariants as g,FormField as c}from"./form.js";import"clsx";import"class-variance-authority";import"./card.js";import"./icons.js";import"@icons-pack/react-simple-icons";import"react";function v({className:t,...a}){return e(u,{className:i(t,d=>o("inline caret-transparent outline-0","data-[placeholder]:text-muted-foreground","disabled-muted","data-[focused]:bg-accent data-[focused]:text-accent-foreground","data-[invalid]:data-[focused]:bg-destructive data-[invalid]:data-[focused]:data-[placeholder]:text-destructive-foreground data-[invalid]:data-[focused]:text-destructive-foreground data-[invalid]:data-[placeholder]:text-destructive data-[invalid]:text-destructive",d)),...a})}function s({className:t,variant:a,...d}){return e(m,{className:i(t,r=>o(g({variant:a}),"body-sm",r)),...d,children:r=>e(v,{segment:r})})}function j({label:t,description:a,className:d,errorMessage:r,...n}){return e(p,{className:i(d,l=>o("group form-field",l)),...n,children:e(c,{label:t,description:a,errorMessage:r,children:e(s,{})})})}function y({label:t,description:a,errorMessage:d,className:r,...n}){return e(f,{className:i(r,l=>o("group form-field",l)),...n,children:e(c,{label:t,description:a,errorMessage:d,children:e(s,{})})})}export{j as DateField,s as DateInput,v as DateSegment,y as TimeField};
-//# sourceMappingURL=datefield.js.map
+"use client";import{classNames as e}from"../utilities/theme.js";import{FormField as t,fieldGroupVariants as n}from"./form.js";import{jsx as r}from"react/jsx-runtime";import{DateField as i,DateInput as a,DateSegment as o,TimeField as s,composeRenderProps as c}from"react-aria-components";function l({className:t,...n}){return r(o,{className:c(t,t=>e(`inline caret-transparent outline-0`,`data-[placeholder]:text-muted-foreground`,`disabled-muted`,`data-[focused]:bg-accent data-[focused]:text-accent-foreground`,`data-[invalid]:data-[focused]:bg-destructive data-[invalid]:data-[focused]:data-[placeholder]:text-destructive-foreground data-[invalid]:data-[focused]:text-destructive-foreground data-[invalid]:data-[placeholder]:text-destructive data-[invalid]:text-destructive`,t)),...n})}function u({className:t,variant:i,...o}){return r(a,{className:c(t,t=>e(n({variant:i}),`body-sm`,t)),...o,children:e=>r(l,{segment:e})})}function d({label:n,description:a,className:o,errorMessage:s,...l}){return r(i,{className:c(o,t=>e(`group form-field`,t)),...l,children:r(t,{label:n,description:a,errorMessage:s,children:r(u,{})})})}function f({label:n,description:i,errorMessage:a,className:o,...l}){return r(s,{className:c(o,t=>e(`group form-field`,t)),...l,children:r(t,{label:n,description:i,errorMessage:a,children:r(u,{})})})}export{d as DateField,u as DateInput,l as DateSegment,f as TimeField};
+//# sourceMappingURL=datefield.js.map

package/dist/components/datefield.js.map

@@ -1 +1 @@
-{"version":3,"file":"datefield.js","sources":["../../lib/components/datefield.tsx"],"sourcesContent":["'use client';\nimport { VariantProps } from 'class-variance-authority';\nimport {\n    DateField as AriaDateField,\n    DateFieldProps as AriaDateFieldProps,\n    DateInput as AriaDateInput,\n    DateInputProps as AriaDateInputProps,\n    DateSegment as AriaDateSegment,\n    DateSegmentProps as AriaDateSegmentProps,\n    DateValue as AriaDateValue,\n    TimeField as AriaTimeField,\n    TimeFieldProps as AriaTimeFieldProps,\n    TimeValue as AriaTimeValue,\n    composeRenderProps,\n} from 'react-aria-components';\n\nimport { classNames } from '../utilities/theme';\nimport { fieldGroupVariants, FormField, type FormFieldProps } from './form';\n\nexport function DateSegment({ className, ...props }: AriaDateSegmentProps) {\n    return (\n        <AriaDateSegment\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'inline caret-transparent outline-0',\n                    /* Placeholder */\n                    'data-[placeholder]:text-muted-foreground',\n                    /* Disabled */\n                    'disabled-muted',\n                    /* Focused */\n                    'data-[focused]:bg-accent data-[focused]:text-accent-foreground',\n                    /* Invalid */\n                    'data-[invalid]:data-[focused]:bg-destructive data-[invalid]:data-[focused]:data-[placeholder]:text-destructive-foreground data-[invalid]:data-[focused]:text-destructive-foreground data-[invalid]:data-[placeholder]:text-destructive data-[invalid]:text-destructive',\n                    className\n                )\n            )}\n            {...props}\n        />\n    );\n}\n\ninterface DateInputProps extends AriaDateInputProps, VariantProps<typeof fieldGroupVariants> {}\n\nexport function DateInput({ className, variant, ...props }: Omit<DateInputProps, 'children'>) {\n    return (\n        <AriaDateInput\n            className={composeRenderProps(className, className =>\n                classNames(fieldGroupVariants({ variant }), 'body-sm', className)\n            )}\n            {...props}\n        >\n            {segment => <DateSegment segment={segment} />}\n        </AriaDateInput>\n    );\n}\n\ninterface DateFieldProps<T extends AriaDateValue> extends AriaDateFieldProps<T>, FormFieldProps {}\n\nexport function DateField<T extends AriaDateValue>({\n    label,\n    description,\n    className,\n    errorMessage,\n    ...props\n}: DateFieldProps<T>) {\n    return (\n        <AriaDateField\n            className={composeRenderProps(className, className => classNames('group form-field', className))}\n            {...props}\n        >\n            <FormField label={label} description={description} errorMessage={errorMessage}>\n                <DateInput />\n            </FormField>\n        </AriaDateField>\n    );\n}\n\ninterface TimeFieldProps<T extends AriaTimeValue> extends AriaTimeFieldProps<T>, FormFieldProps {}\n\n/**\n * Time field component for time values.\n *\n * @remarks\n * Built with React Aria for accessibility and internationalization support.\n * Supports 12/24-hour formats, granularity control, and time constraints.\n * Features segmented input for hours, minutes, seconds, and AM/PM.\n *\n * @example\n * ```tsx\n * <TimeField\n *   label=\"Meeting Time\"\n *   minValue={parseTime('09:00')}\n *   maxValue={parseTime('17:00')}\n * />\n * ```\n */\nexport function TimeField<T extends AriaTimeValue>({\n    label,\n    description,\n    errorMessage,\n    className,\n    ...props\n}: TimeFieldProps<T>) {\n    return (\n        <AriaTimeField\n            className={composeRenderProps(className, className => classNames('group form-field', className))}\n            {...props}\n        >\n            <FormField label={label} description={description} errorMessage={errorMessage}>\n                <DateInput />\n            </FormField>\n        </AriaTimeField>\n    );\n}\n"],"names":["DateSegment","className","props","jsx","AriaDateSegment","composeRenderProps","classNames","DateInput","variant","AriaDateInput","fieldGroupVariants","segment","DateField","label","description","errorMessage","AriaDateField","FormField","TimeField","AriaTimeField"],"mappings":"uaAmBO,SAASA,EAAY,CAAE,UAAAC,EAAW,GAAGC,GAA+B,CACvE,OACIC,EAACC,EAAA,CACG,UAAWC,EAAmBJ,EAAWA,GACrCK,EACI,qCAEA,2CAEA,iBAEA,iEAEA,yQACAL,CAAA,CACJ,EAEH,GAAGC,CAAA,CAAA,CAGhB,CAIO,SAASK,EAAU,CAAE,UAAAN,EAAW,QAAAO,EAAS,GAAGN,GAA2C,CAC1F,OACIC,EAACM,EAAA,CACG,UAAWJ,EAAmBJ,EAAWA,GACrCK,EAAWI,EAAmB,CAAE,QAAAF,CAAA,CAAS,EAAG,UAAWP,CAAS,CAAA,EAEnE,GAAGC,EAEH,SAAAS,GAAWR,EAACH,EAAA,CAAY,QAAAW,CAAA,CAAkB,CAAA,CAAA,CAGvD,CAIO,SAASC,EAAmC,CAC/C,MAAAC,EACA,YAAAC,EACA,UAAAb,EACA,aAAAc,EACA,GAAGb,CACP,EAAsB,CAClB,OACIC,EAACa,EAAA,CACG,UAAWX,EAAmBJ,EAAWA,GAAaK,EAAW,mBAAoBL,CAAS,CAAC,EAC9F,GAAGC,EAEJ,WAACe,EAAA,CAAU,MAAAJ,EAAc,YAAAC,EAA0B,aAAAC,EAC/C,SAAAZ,EAACI,IAAU,CAAA,CACf,CAAA,CAAA,CAGZ,CAqBO,SAASW,EAAmC,CAC/C,MAAAL,EACA,YAAAC,EACA,aAAAC,EACA,UAAAd,EACA,GAAGC,CACP,EAAsB,CAClB,OACIC,EAACgB,EAAA,CACG,UAAWd,EAAmBJ,EAAWA,GAAaK,EAAW,mBAAoBL,CAAS,CAAC,EAC9F,GAAGC,EAEJ,WAACe,EAAA,CAAU,MAAAJ,EAAc,YAAAC,EAA0B,aAAAC,EAC/C,SAAAZ,EAACI,IAAU,CAAA,CACf,CAAA,CAAA,CAGZ"}
+{"version":3,"file":"datefield.js","names":[],"sources":["../../lib/components/datefield.tsx"],"sourcesContent":["'use client';\nimport { VariantProps } from 'class-variance-authority';\nimport {\n    DateField as AriaDateField,\n    DateFieldProps as AriaDateFieldProps,\n    DateInput as AriaDateInput,\n    DateInputProps as AriaDateInputProps,\n    DateSegment as AriaDateSegment,\n    DateSegmentProps as AriaDateSegmentProps,\n    DateValue as AriaDateValue,\n    TimeField as AriaTimeField,\n    TimeFieldProps as AriaTimeFieldProps,\n    TimeValue as AriaTimeValue,\n    composeRenderProps,\n} from 'react-aria-components';\n\nimport { classNames } from '../utilities/theme';\nimport { fieldGroupVariants, FormField, type FormFieldProps } from './form';\n\nexport function DateSegment({ className, ...props }: AriaDateSegmentProps) {\n    return (\n        <AriaDateSegment\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'inline caret-transparent outline-0',\n                    /* Placeholder */\n                    'data-[placeholder]:text-muted-foreground',\n                    /* Disabled */\n                    'disabled-muted',\n                    /* Focused */\n                    'data-[focused]:bg-accent data-[focused]:text-accent-foreground',\n                    /* Invalid */\n                    'data-[invalid]:data-[focused]:bg-destructive data-[invalid]:data-[focused]:data-[placeholder]:text-destructive-foreground data-[invalid]:data-[focused]:text-destructive-foreground data-[invalid]:data-[placeholder]:text-destructive data-[invalid]:text-destructive',\n                    className\n                )\n            )}\n            {...props}\n        />\n    );\n}\n\ninterface DateInputProps extends AriaDateInputProps, VariantProps<typeof fieldGroupVariants> {}\n\nexport function DateInput({ className, variant, ...props }: Omit<DateInputProps, 'children'>) {\n    return (\n        <AriaDateInput\n            className={composeRenderProps(className, className =>\n                classNames(fieldGroupVariants({ variant }), 'body-sm', className)\n            )}\n            {...props}\n        >\n            {segment => <DateSegment segment={segment} />}\n        </AriaDateInput>\n    );\n}\n\ninterface DateFieldProps<T extends AriaDateValue> extends AriaDateFieldProps<T>, FormFieldProps {}\n\nexport function DateField<T extends AriaDateValue>({\n    label,\n    description,\n    className,\n    errorMessage,\n    ...props\n}: DateFieldProps<T>) {\n    return (\n        <AriaDateField\n            className={composeRenderProps(className, className => classNames('group form-field', className))}\n            {...props}\n        >\n            <FormField label={label} description={description} errorMessage={errorMessage}>\n                <DateInput />\n            </FormField>\n        </AriaDateField>\n    );\n}\n\ninterface TimeFieldProps<T extends AriaTimeValue> extends AriaTimeFieldProps<T>, FormFieldProps {}\n\n/**\n * Time field component for time values.\n *\n * @remarks\n * Built with React Aria for accessibility and internationalization support.\n * Supports 12/24-hour formats, granularity control, and time constraints.\n * Features segmented input for hours, minutes, seconds, and AM/PM.\n *\n * @example\n * ```tsx\n * <TimeField\n *   label=\"Meeting Time\"\n *   minValue={parseTime('09:00')}\n *   maxValue={parseTime('17:00')}\n * />\n * ```\n */\nexport function TimeField<T extends AriaTimeValue>({\n    label,\n    description,\n    errorMessage,\n    className,\n    ...props\n}: TimeFieldProps<T>) {\n    return (\n        <AriaTimeField\n            className={composeRenderProps(className, className => classNames('group form-field', className))}\n            {...props}\n        >\n            <FormField label={label} description={description} errorMessage={errorMessage}>\n                <DateInput />\n            </FormField>\n        </AriaTimeField>\n    );\n}\n"],"mappings":"+RAmBA,SAAgB,EAAY,CAAE,YAAW,GAAG,GAA+B,CACvE,OACI,EAAC,EAAD,CACI,UAAW,EAAmB,EAAW,GACrC,EACI,qCAEA,2CAEA,iBAEA,iEAEA,yQACA,CACJ,CACJ,EACA,GAAI,CACP,CAAA,CAET,CAIA,SAAgB,EAAU,CAAE,YAAW,UAAS,GAAG,GAA2C,CAC1F,OACI,EAAC,EAAD,CACI,UAAW,EAAmB,EAAW,GACrC,EAAW,EAAmB,CAAE,SAAQ,CAAC,EAAG,UAAW,CAAS,CACpE,EACA,GAAI,EAEH,SAAA,GAAW,EAAC,EAAD,CAAsB,SAAU,CAAA,CACjC,CAAA,CAEvB,CAIA,SAAgB,EAAmC,CAC/C,QACA,cACA,YACA,eACA,GAAG,GACe,CAClB,OACI,EAAC,EAAD,CACI,UAAW,EAAmB,EAAW,GAAa,EAAW,mBAAoB,CAAS,CAAC,EAC/F,GAAI,EAEJ,SAAA,EAAC,EAAD,CAAkB,QAAoB,cAA2B,eAC7D,SAAA,EAAC,EAAD,CAAY,CAAA,CACL,CAAA,CACA,CAAA,CAEvB,CAqBA,SAAgB,EAAmC,CAC/C,QACA,cACA,eACA,YACA,GAAG,GACe,CAClB,OACI,EAAC,EAAD,CACI,UAAW,EAAmB,EAAW,GAAa,EAAW,mBAAoB,CAAS,CAAC,EAC/F,GAAI,EAEJ,SAAA,EAAC,EAAD,CAAkB,QAAoB,cAA2B,eAC7D,SAAA,EAAC,EAAD,CAAY,CAAA,CACL,CAAA,CACA,CAAA,CAEvB"}

package/dist/components/dialog.d.ts

@@ -27,7 +27,7 @@ declare const sheetVariants: (props?: ({
  * ```
  */
 export declare const DialogTrigger: typeof AriaDialogTrigger;
-export declare const DialogOverlay: ({ className, isDismissable, ...props }: AriaModalOverlayProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DialogOverlay: ({ className, isDismissable, ...props }: AriaModalOverlayProps) => import("react").JSX.Element;
 /** Props for {@link DialogContent}. */
 export interface DialogContentProps extends Omit<React.ComponentProps<typeof AriaModal>, 'children'>, VariantProps<typeof sheetVariants> {
     /**
@@ -48,7 +48,7 @@ export interface DialogContentProps extends Omit<React.ComponentProps<typeof Ari
      */
     closeButton?: boolean;
 }
-export declare function DialogContent({ className, children, side, role, closeButton, ...props }: DialogContentProps): import("react/jsx-runtime").JSX.Element;
+export declare function DialogContent({ className, children, side, role, closeButton, ...props }: DialogContentProps): import("react").JSX.Element;
 /**
  * Header region for the dialog panel.
  *
@@ -59,7 +59,7 @@ export declare function DialogContent({ className, children, side, role, closeBu
  * </DialogHeader>
  * ```
  */
-export declare function DialogHeader({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+export declare function DialogHeader({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react").JSX.Element;
 /**
  * Footer region that aligns action buttons.
  *
@@ -71,18 +71,18 @@ export declare function DialogHeader({ className, ...props }: React.HTMLAttribut
  * </DialogFooter>
  * ```
  */
-export declare function DialogFooter({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+export declare function DialogFooter({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react").JSX.Element;
 /**
  * Body section of the dialog
  */
-export declare function DialogBody({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+export declare function DialogBody({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react").JSX.Element;
 /**
  * Heading element mapped to the dialog title (announced by screen readers).
  *
  * @remarks
  * Sets `slot="title"` so RAC wires it to the dialog.
  */
-export declare function DialogTitle({ className, ...props }: AriaHeadingProps): import("react/jsx-runtime").JSX.Element;
+export declare function DialogTitle({ className, ...props }: AriaHeadingProps): import("react").JSX.Element;
 /**
  * Short explanatory text under the title.
  *
@@ -93,7 +93,7 @@ export declare function DialogTitle({ className, ...props }: AriaHeadingProps):
  * </DialogDescription>
  * ```
  */
-export declare function DialogDescription({ className, ...props }: React.HTMLAttributes<HTMLParagraphElement>): import("react/jsx-runtime").JSX.Element;
+export declare function DialogDescription({ className, ...props }: React.HTMLAttributes<HTMLParagraphElement>): import("react").JSX.Element;
 /**
  * Context type for controlled dialog state and actions.
  */
@@ -127,7 +127,7 @@ type ControlledDialogContextType = {
  */
 export declare function ControlledDialogProvider({ children }: {
     children: ReactNode;
-}): import("react/jsx-runtime").JSX.Element;
+}): import("react").JSX.Element;
 /**
  * Hook to access the controlled dialog from within a ControlledDialogProvider.
  *

package/dist/components/dialog.js

@@ -1,2 +1,2 @@
-"use client";import{jsxs as l,jsx as i,Fragment as v}from"react/jsx-runtime";import{cva as D}from"class-variance-authority";import{createContext as h,useState as x,useContext as d}from"react";import{DialogTrigger as y,Modal as w,Dialog as C,composeRenderProps as f,ModalOverlay as N,Heading as z}from"react-aria-components";import{Button as P}from"./button.js";import{classNames as n}from"../utilities/theme.js";import{useIsMobile as p}from"../utilities/use-mobile.js";import{IcClose as k}from"./icons.js";import"./loader.js";import"clsx";import"@icons-pack/react-simple-icons";const M=D(["fixed z-50 gap-icon bg-surface-secondary border-stroke-primary transition ease-in-out","data-[entering]:duration-200 data-[entering]:animate-in data-[entering]:fade-in-0 data-[exiting]:duration-200  data-[exiting]:animate-out data-[exiting]:fade-out-0"],{variants:{side:{top:"inset-x-0 top-0 overflow-hidden border-b rounded-b-lg data-[entering]:slide-in-from-top data-[exiting]:slide-out-to-top max-h-table",bottom:"inset-x-0 bottom-0 overflow-hidden rounded-t-lg data-[entering]:slide-in-from-bottom data-[exiting]:slide-out-to-bottom max-h-[80dvh]",left:"inset-y-0 left-0 h-full w-3/4 overflow-hidden border-r rounded-r-lg data-[entering]:slide-in-from-left data-[exiting]:slide-out-to-left sm:max-w-sm",right:"inset-y-0 right-0 h-full w-3/4 overflow-hidden border-l rounded-l-lg data-[entering]:slide-in-from-right data-[exiting]:slide-out-to-right sm:max-w-sm"}}}),O=y,T=({className:e,isDismissable:o=!0,...t})=>i(N,{isDismissable:o,className:f(e,a=>n("fixed inset-0 z-50 bg-background-overlay","data-[exiting]:duration-100 data-[exiting]:animate-out","data-[entering]:animate-in",a)),...t}),s=h(void 0);function j({className:e,children:o,side:t,role:a,closeButton:g=!0,...c}){const u=p();return t=t??(u?"bottom":void 0),i(s.Provider,{value:t,children:i(w,{className:f(e,r=>n(t?M({side:t}):["fixed left-[50vw] top-1/2 z-50 w-full max-w-lg -translate-x-1/2 -translate-y-1/2 overflow-hidden border rounded-lg bg-surface-tertiary duration-100 data-[exiting]:duration-100 data-[entering]:animate-in data-[exiting]:animate-out data-[entering]:fade-in-0 data-[exiting]:fade-out-0 data-[entering]:zoom-in-95 data-[exiting]:zoom-out-95 md:w-full"],r)),...c,children:i(C,{role:a,className:n(!t&&"grid h-full gap-icon relative","h-full outline-none"),children:f(o,(r,m)=>l(v,{children:[r,g&&i("div",{className:"absolute right-2 top-6 md:top-3",children:l(P,{variant:"ghost",onPress:m.close,className:"!rounded-full",children:[i(k,{className:"size-6"}),i("span",{className:"sr-only",children:"Close"})]})})]}))})})})}function G({className:e,...o}){const t=d(s);return l("div",{className:n("flex flex-col p-icon border-b rounded-t-3xl gap-y-2 text-left",t?"bg-surface-secondary":"bg-surface-tertiary",e),...o,children:[i("div",{className:"md:hidden mx-auto h-1 w-9 shrink-0 rounded-full bg-stroke-primary"}),o.children]})}function J({className:e,...o}){const t=d(s);return i("div",{className:n("flex flex-row justify-end gap-2 p-icon border-t *:flex-1 sm:*:flex-none",t&&"bg-surface-secondary",e),...o})}function K({className:e,...o}){const t=d(s);return i("div",{className:n("flex flex-col gap-2 p-icon max-h-[60dvh] overflow-auto",t&&"bg-surface-secondary",e),...o})}function L({className:e,...o}){return i(z,{slot:"title",className:n("heading-4 font-semibold leading-none tracking-tight text-text-primary",e),...o})}function Q({className:e,...o}){return i("p",{className:n("flex flex-col gap-y-1 text-center sm:text-left",e),...o})}const b=h(null);function U({children:e}){const[o,t]=x(!1),[a,g]=x(null),c=m=>{g(m),t(!0)},u=()=>{t(!1)},r=p();return l(b.Provider,{value:{openDialog:c,closeDialog:u,isOpen:o},children:[e,i(O,{isOpen:o,onOpenChange:t,children:i(T,{isDismissable:!0,children:i(j,{side:r?"bottom":void 0,children:a})})})]})}function W(){const e=d(b);if(!e)throw new Error("useControlledDialog must be used within ControlledDialogProvider");return e}export{U as ControlledDialogProvider,K as DialogBody,j as DialogContent,Q as DialogDescription,J as DialogFooter,G as DialogHeader,T as DialogOverlay,L as DialogTitle,O as DialogTrigger,W as useControlledDialog};
-//# sourceMappingURL=dialog.js.map
+"use client";import{classNames as e}from"../utilities/theme.js";import{l as t}from"../icons.js";import{Button as n}from"./button.js";import{useIsMobile as r}from"../utilities/use-mobile.js";import{createContext as i,useContext as a,useState as o}from"react";import{Fragment as s,jsx as c,jsxs as l}from"react/jsx-runtime";import{cva as u}from"class-variance-authority";import{Dialog as d,DialogTrigger as f,Heading as p,Modal as m,ModalOverlay as h,composeRenderProps as g}from"react-aria-components";var _=u([`fixed z-50 gap-icon bg-surface-secondary border-stroke-primary transition ease-in-out`,`data-[entering]:duration-200 data-[entering]:animate-in data-[entering]:fade-in-0 data-[exiting]:duration-200  data-[exiting]:animate-out data-[exiting]:fade-out-0`],{variants:{side:{top:`inset-x-0 top-0 overflow-hidden border-b rounded-b-lg data-[entering]:slide-in-from-top data-[exiting]:slide-out-to-top max-h-table`,bottom:`inset-x-0 bottom-0 overflow-hidden rounded-t-lg data-[entering]:slide-in-from-bottom data-[exiting]:slide-out-to-bottom max-h-[80dvh]`,left:`inset-y-0 left-0 h-full w-3/4 overflow-hidden border-r rounded-r-lg data-[entering]:slide-in-from-left data-[exiting]:slide-out-to-left sm:max-w-sm`,right:`inset-y-0 right-0 h-full w-3/4 overflow-hidden border-l rounded-l-lg data-[entering]:slide-in-from-right data-[exiting]:slide-out-to-right sm:max-w-sm`}}}),v=f,y=({className:t,isDismissable:n=!0,...r})=>c(h,{isDismissable:n,className:g(t,t=>e(`fixed inset-0 z-50 bg-background-overlay`,`data-[exiting]:duration-100 data-[exiting]:animate-out`,`data-[entering]:animate-in`,t)),...r}),b=i(void 0);function x({className:i,children:a,side:o,role:u,closeButton:f=!0,...p}){let h=r();return o??=h?`bottom`:void 0,c(b.Provider,{value:o,children:c(m,{className:g(i,t=>e(o?_({side:o}):[`fixed left-[50vw] top-1/2 z-50 w-full max-w-lg -translate-x-1/2 -translate-y-1/2 overflow-hidden border rounded-lg bg-surface-tertiary duration-100 data-[exiting]:duration-100 data-[entering]:animate-in data-[exiting]:animate-out data-[entering]:fade-in-0 data-[exiting]:fade-out-0 data-[entering]:zoom-in-95 data-[exiting]:zoom-out-95 md:w-full`],t)),...p,children:c(d,{role:u,className:e(!o&&`grid h-full gap-icon relative`,`h-full outline-none`),children:g(a,(e,r)=>l(s,{children:[e,f&&c(`div`,{className:`absolute right-2 top-6 md:top-3`,children:l(n,{variant:`ghost`,onPress:r.close,className:`!rounded-full`,children:[c(t,{className:`size-6`}),c(`span`,{className:`sr-only`,children:`Close`})]})})]}))})})})}function S({className:t,...n}){let r=a(b);return l(`div`,{className:e(`flex flex-col p-icon border-b rounded-t-3xl gap-y-2 text-left`,r?`bg-surface-secondary`:`bg-surface-tertiary`,t),...n,children:[c(`div`,{className:`md:hidden mx-auto h-1 w-9 shrink-0 rounded-full bg-stroke-primary`}),n.children]})}function C({className:t,...n}){let r=a(b);return c(`div`,{className:e(`flex flex-row justify-end gap-2 p-icon border-t *:flex-1 sm:*:flex-none`,r&&`bg-surface-secondary`,t),...n})}function w({className:t,...n}){let r=a(b);return c(`div`,{className:e(`flex flex-col gap-2 p-icon max-h-[60dvh] overflow-auto`,r&&`bg-surface-secondary`,t),...n})}function T({className:t,...n}){return c(p,{slot:`title`,className:e(`heading-4 font-semibold leading-none tracking-tight text-text-primary`,t),...n})}function E({className:t,...n}){return c(`p`,{className:e(`flex flex-col gap-y-1 text-center sm:text-left`,t),...n})}var D=i(null);function O({children:e}){let[t,n]=o(!1),[i,a]=o(null),s=e=>{a(e),n(!0)},u=()=>{n(!1)},d=r();return l(D.Provider,{value:{openDialog:s,closeDialog:u,isOpen:t},children:[e,c(v,{isOpen:t,onOpenChange:n,children:c(y,{isDismissable:!0,children:c(x,{side:d?`bottom`:void 0,children:i})})})]})}function k(){let e=a(D);if(!e)throw Error(`useControlledDialog must be used within ControlledDialogProvider`);return e}export{O as ControlledDialogProvider,w as DialogBody,x as DialogContent,E as DialogDescription,C as DialogFooter,S as DialogHeader,y as DialogOverlay,T as DialogTitle,v as DialogTrigger,k as useControlledDialog};
+//# sourceMappingURL=dialog.js.map

package/dist/components/dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.js","sources":["../../lib/components/dialog.tsx"],"sourcesContent":["'use client';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport type { ReactNode } from 'react';\nimport { createContext, useContext, useState } from 'react';\nimport {\n    Dialog as AriaDialog,\n    DialogProps as AriaDialogProps,\n    DialogTrigger as AriaDialogTrigger,\n    Heading as AriaHeading,\n    HeadingProps as AriaHeadingProps,\n    Modal as AriaModal,\n    ModalOverlay as AriaModalOverlay,\n    ModalOverlayProps as AriaModalOverlayProps,\n    composeRenderProps,\n} from 'react-aria-components';\n\nimport { Button } from '../components/button';\nimport { classNames } from '../utilities/theme';\nimport { useIsMobile } from '../utilities/use-mobile';\nimport { IcClose } from './icons';\n\n/**\n * Visual variants for the sheet-style dialog (slide in from an edge).\n *\n * @remarks\n * Internally used to style `<DialogContent side=\"...\">`.\n */\nconst sheetVariants = cva(\n    [\n        'fixed z-50 gap-icon bg-surface-secondary border-stroke-primary transition ease-in-out',\n        'data-[entering]:duration-200 data-[entering]:animate-in data-[entering]:fade-in-0 data-[exiting]:duration-200  data-[exiting]:animate-out data-[exiting]:fade-out-0',\n    ],\n    {\n        variants: {\n            side: {\n                top: 'inset-x-0 top-0 overflow-hidden border-b rounded-b-lg data-[entering]:slide-in-from-top data-[exiting]:slide-out-to-top max-h-table',\n                bottom: 'inset-x-0 bottom-0 overflow-hidden rounded-t-lg data-[entering]:slide-in-from-bottom data-[exiting]:slide-out-to-bottom max-h-[80dvh]',\n                left: 'inset-y-0 left-0 h-full w-3/4 overflow-hidden border-r rounded-r-lg data-[entering]:slide-in-from-left data-[exiting]:slide-out-to-left sm:max-w-sm',\n                right: 'inset-y-0 right-0 h-full w-3/4 overflow-hidden border-l rounded-l-lg data-[entering]:slide-in-from-right data-[exiting]:slide-out-to-right sm:max-w-sm',\n            },\n        },\n    }\n);\n\n/**\n * Opens the dialog when interacted with (click/press).\n *\n * @remarks\n * Compose this around any control that should open the dialog.\n *\n * @example\n * ```tsx\n * <DialogTrigger>\n *   <Button>Open</Button>\n *   <DialogOverlay>\n *     <DialogContent>...</DialogContent>\n *   </DialogOverlay>\n * </DialogTrigger>\n * ```\n */\nexport const DialogTrigger = AriaDialogTrigger;\n\nexport const DialogOverlay = ({ className, isDismissable = true, ...props }: AriaModalOverlayProps) => {\n    return (\n        <AriaModalOverlay\n            isDismissable={isDismissable}\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'fixed inset-0 z-50 bg-background-overlay',\n                    /* Exiting */\n                    'data-[exiting]:duration-100 data-[exiting]:animate-out',\n                    /* Entering */\n                    'data-[entering]:animate-in',\n                    className\n                )\n            )}\n            {...props}\n        />\n    );\n};\n\n/** Props for {@link DialogContent}. */\nexport interface DialogContentProps\n    extends Omit<React.ComponentProps<typeof AriaModal>, 'children'>,\n        VariantProps<typeof sheetVariants> {\n    /**\n     * Render function or nodes for the dialog panel contents.\n     */\n    children?: AriaDialogProps['children'];\n\n    /**\n     * ARIA role of the dialog.\n     *\n     * Use `\"alertdialog\"` for destructive/confirmation flows that require\n     * explicit acknowledgement.\n     * @defaultValue \"dialog\"\n     */\n    role?: AriaDialogProps['role'];\n\n    /**\n     * Show a built-in close button in the top-right corner.\n     * @defaultValue true\n     */\n    closeButton?: boolean;\n}\n\n/**\n * Dialog panel container. Renders either a centered modal or a sheet\n * from an edge when `side` is provided.\n *\n * @example Basic\n * ```tsx\n * <DialogTrigger>\n *   <Button>Open</Button>\n *   <DialogOverlay>\n *     <DialogContent>\n *       <DialogHeader>\n *         <DialogTitle>Sign up</DialogTitle>\n *       </DialogHeader>\n *       ...\n *     </DialogContent>\n *   </DialogOverlay>\n * </DialogTrigger>\n * ```\n */\nconst DialogSideContext = createContext<DialogContentProps['side']>(undefined);\n\nexport function DialogContent({ className, children, side, role, closeButton = true, ...props }: DialogContentProps) {\n    const isMobile = useIsMobile();\n    side = side ?? (isMobile ? 'bottom' : undefined);\n    return (\n        <DialogSideContext.Provider value={side}>\n            <AriaModal\n                className={composeRenderProps(className, className =>\n                    classNames(\n                        side\n                            ? sheetVariants({ side })\n                            : [\n                                  'fixed left-[50vw] top-1/2 z-50 w-full max-w-lg -translate-x-1/2 -translate-y-1/2 overflow-hidden border rounded-lg bg-surface-tertiary duration-100 data-[exiting]:duration-100 data-[entering]:animate-in data-[exiting]:animate-out data-[entering]:fade-in-0 data-[exiting]:fade-out-0 data-[entering]:zoom-in-95 data-[exiting]:zoom-out-95 md:w-full',\n                              ],\n                        className\n                    )\n                )}\n                {...props}\n            >\n                <AriaDialog\n                    role={role}\n                    className={classNames(!side && 'grid h-full gap-icon relative', 'h-full outline-none')}\n                >\n                    {composeRenderProps(children, (children, renderProps) => (\n                        <>\n                            {children}\n                            {closeButton && (\n                                <div className=\"absolute right-2 top-6 md:top-3\">\n                                    <Button variant={'ghost'} onPress={renderProps.close} className=\"!rounded-full\">\n                                        <IcClose className=\"size-6\" />\n                                        <span className=\"sr-only\">Close</span>\n                                    </Button>\n                                </div>\n                            )}\n                        </>\n                    ))}\n                </AriaDialog>\n            </AriaModal>\n        </DialogSideContext.Provider>\n    );\n}\n\n/**\n * Header region for the dialog panel.\n *\n * @example\n * ```tsx\n * <DialogHeader>\n *   <DialogTitle>Settings</DialogTitle>\n * </DialogHeader>\n * ```\n */\nexport function DialogHeader({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {\n    const side = useContext(DialogSideContext);\n    return (\n        <div\n            className={classNames(\n                'flex flex-col p-icon border-b rounded-t-3xl gap-y-2 text-left',\n                side ? 'bg-surface-secondary' : 'bg-surface-tertiary',\n                className\n            )}\n            {...props}\n        >\n            <div className=\"md:hidden mx-auto h-1 w-9 shrink-0 rounded-full bg-stroke-primary\" />\n            {props.children}\n        </div>\n    );\n}\n\n/**\n * Footer region that aligns action buttons.\n *\n * @example\n * ```tsx\n * <DialogFooter>\n *   <Button variant=\"outline\">Cancel</Button>\n *   <Button>Save</Button>\n * </DialogFooter>\n * ```\n */\nexport function DialogFooter({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {\n    const side = useContext(DialogSideContext);\n    return (\n        <div\n            className={classNames(\n                'flex flex-row justify-end gap-2 p-icon border-t *:flex-1 sm:*:flex-none',\n                side && 'bg-surface-secondary',\n                className\n            )}\n            {...props}\n        />\n    );\n}\n\n/**\n * Body section of the dialog\n */\nexport function DialogBody({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {\n    const side = useContext(DialogSideContext);\n    return (\n        <div\n            className={classNames(\n                'flex flex-col gap-2 p-icon max-h-[60dvh] overflow-auto',\n                side && 'bg-surface-secondary',\n                className\n            )}\n            {...props}\n        />\n    );\n}\n\n/**\n * Heading element mapped to the dialog title (announced by screen readers).\n *\n * @remarks\n * Sets `slot=\"title\"` so RAC wires it to the dialog.\n */\nexport function DialogTitle({ className, ...props }: AriaHeadingProps) {\n    return (\n        <AriaHeading\n            slot=\"title\"\n            className={classNames('heading-4 font-semibold leading-none tracking-tight text-text-primary', className)}\n            {...props}\n        />\n    );\n}\n\n/**\n * Short explanatory text under the title.\n *\n * @example\n * ```tsx\n * <DialogDescription>\n *   This action cannot be undone.\n * </DialogDescription>\n * ```\n */\nexport function DialogDescription({ className, ...props }: React.HTMLAttributes<HTMLParagraphElement>) {\n    return <p className={classNames('flex flex-col gap-y-1 text-center sm:text-left', className)} {...props} />;\n}\n\n/**\n * Context type for controlled dialog state and actions.\n */\ntype ControlledDialogContextType = {\n    /** Opens the dialog with the provided content */\n    openDialog: (content: ReactNode) => void;\n    /** Closes the dialog */\n    closeDialog: () => void;\n    /** Whether the dialog is currently open */\n    isOpen: boolean;\n};\n\nconst ControlledDialogContext = createContext<ControlledDialogContextType | null>(null);\n\n/**\n * Provider that manages a scoped dialog controlled via hooks.\n *\n * @example\n * ```tsx\n * <ControlledDialogProvider>\n *   <MyComponent />\n * </ControlledDialogProvider>\n *\n * // Inside MyComponent:\n * function MyComponent() {\n *   const { openDialog } = useControlledDialog();\n *   return (\n *     <Button onPress={() => openDialog(<div>Dialog content</div>)}>\n *       Open Dialog\n *     </Button>\n *   );\n * }\n * ```\n */\nexport function ControlledDialogProvider({ children }: { children: ReactNode }) {\n    const [isOpen, setIsOpen] = useState(false);\n    const [content, setContent] = useState<ReactNode>(null);\n\n    const openDialog = (dialogContent: ReactNode) => {\n        setContent(dialogContent);\n        setIsOpen(true);\n    };\n\n    const closeDialog = () => {\n        setIsOpen(false);\n    };\n    const isMobile = useIsMobile();\n    return (\n        <ControlledDialogContext.Provider value={{ openDialog, closeDialog, isOpen }}>\n            {children}\n            <DialogTrigger isOpen={isOpen} onOpenChange={setIsOpen}>\n                <DialogOverlay isDismissable>\n                    <DialogContent side={isMobile ? 'bottom' : undefined}>{content}</DialogContent>\n                </DialogOverlay>\n            </DialogTrigger>\n        </ControlledDialogContext.Provider>\n    );\n}\n\n/**\n * Hook to access the controlled dialog from within a ControlledDialogProvider.\n *\n * @throws Error if used outside of ControlledDialogProvider\n *\n * @example\n * ```tsx\n * function MyComponent() {\n *   const { openDialog, closeDialog, isOpen } = useControlledDialog();\n *\n *   return (\n *     <Button onPress={() => openDialog(\n *       <DialogHeader>\n *         <DialogTitle>Confirm</DialogTitle>\n *       </DialogHeader>\n *     )}>\n *       Open\n *     </Button>\n *   );\n * }\n * ```\n */\nexport function useControlledDialog() {\n    const context = useContext(ControlledDialogContext);\n    if (!context) {\n        throw new Error('useControlledDialog must be used within ControlledDialogProvider');\n    }\n    return context;\n}\n"],"names":["sheetVariants","cva","DialogTrigger","AriaDialogTrigger","DialogOverlay","className","isDismissable","props","jsx","AriaModalOverlay","composeRenderProps","classNames","DialogSideContext","createContext","DialogContent","children","side","role","closeButton","isMobile","useIsMobile","AriaModal","AriaDialog","renderProps","jsxs","Fragment","Button","IcClose","DialogHeader","useContext","DialogFooter","DialogBody","DialogTitle","AriaHeading","DialogDescription","ControlledDialogContext","ControlledDialogProvider","isOpen","setIsOpen","useState","content","setContent","openDialog","dialogContent","closeDialog","useControlledDialog","context"],"mappings":"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"}
+{"version":3,"file":"dialog.js","names":[],"sources":["../../lib/components/dialog.tsx"],"sourcesContent":["'use client';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport type { ReactNode } from 'react';\nimport { createContext, useContext, useState } from 'react';\nimport {\n    Dialog as AriaDialog,\n    DialogProps as AriaDialogProps,\n    DialogTrigger as AriaDialogTrigger,\n    Heading as AriaHeading,\n    HeadingProps as AriaHeadingProps,\n    Modal as AriaModal,\n    ModalOverlay as AriaModalOverlay,\n    ModalOverlayProps as AriaModalOverlayProps,\n    composeRenderProps,\n} from 'react-aria-components';\n\nimport { Button } from '../components/button';\nimport { classNames } from '../utilities/theme';\nimport { useIsMobile } from '../utilities/use-mobile';\nimport { IcClose } from './icons';\n\n/**\n * Visual variants for the sheet-style dialog (slide in from an edge).\n *\n * @remarks\n * Internally used to style `<DialogContent side=\"...\">`.\n */\nconst sheetVariants = cva(\n    [\n        'fixed z-50 gap-icon bg-surface-secondary border-stroke-primary transition ease-in-out',\n        'data-[entering]:duration-200 data-[entering]:animate-in data-[entering]:fade-in-0 data-[exiting]:duration-200  data-[exiting]:animate-out data-[exiting]:fade-out-0',\n    ],\n    {\n        variants: {\n            side: {\n                top: 'inset-x-0 top-0 overflow-hidden border-b rounded-b-lg data-[entering]:slide-in-from-top data-[exiting]:slide-out-to-top max-h-table',\n                bottom: 'inset-x-0 bottom-0 overflow-hidden rounded-t-lg data-[entering]:slide-in-from-bottom data-[exiting]:slide-out-to-bottom max-h-[80dvh]',\n                left: 'inset-y-0 left-0 h-full w-3/4 overflow-hidden border-r rounded-r-lg data-[entering]:slide-in-from-left data-[exiting]:slide-out-to-left sm:max-w-sm',\n                right: 'inset-y-0 right-0 h-full w-3/4 overflow-hidden border-l rounded-l-lg data-[entering]:slide-in-from-right data-[exiting]:slide-out-to-right sm:max-w-sm',\n            },\n        },\n    }\n);\n\n/**\n * Opens the dialog when interacted with (click/press).\n *\n * @remarks\n * Compose this around any control that should open the dialog.\n *\n * @example\n * ```tsx\n * <DialogTrigger>\n *   <Button>Open</Button>\n *   <DialogOverlay>\n *     <DialogContent>...</DialogContent>\n *   </DialogOverlay>\n * </DialogTrigger>\n * ```\n */\nexport const DialogTrigger = AriaDialogTrigger;\n\nexport const DialogOverlay = ({ className, isDismissable = true, ...props }: AriaModalOverlayProps) => {\n    return (\n        <AriaModalOverlay\n            isDismissable={isDismissable}\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'fixed inset-0 z-50 bg-background-overlay',\n                    /* Exiting */\n                    'data-[exiting]:duration-100 data-[exiting]:animate-out',\n                    /* Entering */\n                    'data-[entering]:animate-in',\n                    className\n                )\n            )}\n            {...props}\n        />\n    );\n};\n\n/** Props for {@link DialogContent}. */\nexport interface DialogContentProps\n    extends Omit<React.ComponentProps<typeof AriaModal>, 'children'>,\n        VariantProps<typeof sheetVariants> {\n    /**\n     * Render function or nodes for the dialog panel contents.\n     */\n    children?: AriaDialogProps['children'];\n\n    /**\n     * ARIA role of the dialog.\n     *\n     * Use `\"alertdialog\"` for destructive/confirmation flows that require\n     * explicit acknowledgement.\n     * @defaultValue \"dialog\"\n     */\n    role?: AriaDialogProps['role'];\n\n    /**\n     * Show a built-in close button in the top-right corner.\n     * @defaultValue true\n     */\n    closeButton?: boolean;\n}\n\n/**\n * Dialog panel container. Renders either a centered modal or a sheet\n * from an edge when `side` is provided.\n *\n * @example Basic\n * ```tsx\n * <DialogTrigger>\n *   <Button>Open</Button>\n *   <DialogOverlay>\n *     <DialogContent>\n *       <DialogHeader>\n *         <DialogTitle>Sign up</DialogTitle>\n *       </DialogHeader>\n *       ...\n *     </DialogContent>\n *   </DialogOverlay>\n * </DialogTrigger>\n * ```\n */\nconst DialogSideContext = createContext<DialogContentProps['side']>(undefined);\n\nexport function DialogContent({ className, children, side, role, closeButton = true, ...props }: DialogContentProps) {\n    const isMobile = useIsMobile();\n    side = side ?? (isMobile ? 'bottom' : undefined);\n    return (\n        <DialogSideContext.Provider value={side}>\n            <AriaModal\n                className={composeRenderProps(className, className =>\n                    classNames(\n                        side\n                            ? sheetVariants({ side })\n                            : [\n                                  'fixed left-[50vw] top-1/2 z-50 w-full max-w-lg -translate-x-1/2 -translate-y-1/2 overflow-hidden border rounded-lg bg-surface-tertiary duration-100 data-[exiting]:duration-100 data-[entering]:animate-in data-[exiting]:animate-out data-[entering]:fade-in-0 data-[exiting]:fade-out-0 data-[entering]:zoom-in-95 data-[exiting]:zoom-out-95 md:w-full',\n                              ],\n                        className\n                    )\n                )}\n                {...props}\n            >\n                <AriaDialog\n                    role={role}\n                    className={classNames(!side && 'grid h-full gap-icon relative', 'h-full outline-none')}\n                >\n                    {composeRenderProps(children, (children, renderProps) => (\n                        <>\n                            {children}\n                            {closeButton && (\n                                <div className=\"absolute right-2 top-6 md:top-3\">\n                                    <Button variant={'ghost'} onPress={renderProps.close} className=\"!rounded-full\">\n                                        <IcClose className=\"size-6\" />\n                                        <span className=\"sr-only\">Close</span>\n                                    </Button>\n                                </div>\n                            )}\n                        </>\n                    ))}\n                </AriaDialog>\n            </AriaModal>\n        </DialogSideContext.Provider>\n    );\n}\n\n/**\n * Header region for the dialog panel.\n *\n * @example\n * ```tsx\n * <DialogHeader>\n *   <DialogTitle>Settings</DialogTitle>\n * </DialogHeader>\n * ```\n */\nexport function DialogHeader({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {\n    const side = useContext(DialogSideContext);\n    return (\n        <div\n            className={classNames(\n                'flex flex-col p-icon border-b rounded-t-3xl gap-y-2 text-left',\n                side ? 'bg-surface-secondary' : 'bg-surface-tertiary',\n                className\n            )}\n            {...props}\n        >\n            <div className=\"md:hidden mx-auto h-1 w-9 shrink-0 rounded-full bg-stroke-primary\" />\n            {props.children}\n        </div>\n    );\n}\n\n/**\n * Footer region that aligns action buttons.\n *\n * @example\n * ```tsx\n * <DialogFooter>\n *   <Button variant=\"outline\">Cancel</Button>\n *   <Button>Save</Button>\n * </DialogFooter>\n * ```\n */\nexport function DialogFooter({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {\n    const side = useContext(DialogSideContext);\n    return (\n        <div\n            className={classNames(\n                'flex flex-row justify-end gap-2 p-icon border-t *:flex-1 sm:*:flex-none',\n                side && 'bg-surface-secondary',\n                className\n            )}\n            {...props}\n        />\n    );\n}\n\n/**\n * Body section of the dialog\n */\nexport function DialogBody({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {\n    const side = useContext(DialogSideContext);\n    return (\n        <div\n            className={classNames(\n                'flex flex-col gap-2 p-icon max-h-[60dvh] overflow-auto',\n                side && 'bg-surface-secondary',\n                className\n            )}\n            {...props}\n        />\n    );\n}\n\n/**\n * Heading element mapped to the dialog title (announced by screen readers).\n *\n * @remarks\n * Sets `slot=\"title\"` so RAC wires it to the dialog.\n */\nexport function DialogTitle({ className, ...props }: AriaHeadingProps) {\n    return (\n        <AriaHeading\n            slot=\"title\"\n            className={classNames('heading-4 font-semibold leading-none tracking-tight text-text-primary', className)}\n            {...props}\n        />\n    );\n}\n\n/**\n * Short explanatory text under the title.\n *\n * @example\n * ```tsx\n * <DialogDescription>\n *   This action cannot be undone.\n * </DialogDescription>\n * ```\n */\nexport function DialogDescription({ className, ...props }: React.HTMLAttributes<HTMLParagraphElement>) {\n    return <p className={classNames('flex flex-col gap-y-1 text-center sm:text-left', className)} {...props} />;\n}\n\n/**\n * Context type for controlled dialog state and actions.\n */\ntype ControlledDialogContextType = {\n    /** Opens the dialog with the provided content */\n    openDialog: (content: ReactNode) => void;\n    /** Closes the dialog */\n    closeDialog: () => void;\n    /** Whether the dialog is currently open */\n    isOpen: boolean;\n};\n\nconst ControlledDialogContext = createContext<ControlledDialogContextType | null>(null);\n\n/**\n * Provider that manages a scoped dialog controlled via hooks.\n *\n * @example\n * ```tsx\n * <ControlledDialogProvider>\n *   <MyComponent />\n * </ControlledDialogProvider>\n *\n * // Inside MyComponent:\n * function MyComponent() {\n *   const { openDialog } = useControlledDialog();\n *   return (\n *     <Button onPress={() => openDialog(<div>Dialog content</div>)}>\n *       Open Dialog\n *     </Button>\n *   );\n * }\n * ```\n */\nexport function ControlledDialogProvider({ children }: { children: ReactNode }) {\n    const [isOpen, setIsOpen] = useState(false);\n    const [content, setContent] = useState<ReactNode>(null);\n\n    const openDialog = (dialogContent: ReactNode) => {\n        setContent(dialogContent);\n        setIsOpen(true);\n    };\n\n    const closeDialog = () => {\n        setIsOpen(false);\n    };\n    const isMobile = useIsMobile();\n    return (\n        <ControlledDialogContext.Provider value={{ openDialog, closeDialog, isOpen }}>\n            {children}\n            <DialogTrigger isOpen={isOpen} onOpenChange={setIsOpen}>\n                <DialogOverlay isDismissable>\n                    <DialogContent side={isMobile ? 'bottom' : undefined}>{content}</DialogContent>\n                </DialogOverlay>\n            </DialogTrigger>\n        </ControlledDialogContext.Provider>\n    );\n}\n\n/**\n * Hook to access the controlled dialog from within a ControlledDialogProvider.\n *\n * @throws Error if used outside of ControlledDialogProvider\n *\n * @example\n * ```tsx\n * function MyComponent() {\n *   const { openDialog, closeDialog, isOpen } = useControlledDialog();\n *\n *   return (\n *     <Button onPress={() => openDialog(\n *       <DialogHeader>\n *         <DialogTitle>Confirm</DialogTitle>\n *       </DialogHeader>\n *     )}>\n *       Open\n *     </Button>\n *   );\n * }\n * ```\n */\nexport function useControlledDialog() {\n    const context = useContext(ControlledDialogContext);\n    if (!context) {\n        throw new Error('useControlledDialog must be used within ControlledDialogProvider');\n    }\n    return context;\n}\n"],"mappings":"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"}

package/dist/components/disclosure.d.ts

@@ -3,13 +3,13 @@ import { Button } from '../components/button';
 export interface DisclosureProps extends AriaDisclosureProps {
     children: React.ReactNode;
 }
-export declare function Disclosure({ children, className, ...props }: DisclosureProps): import("react/jsx-runtime").JSX.Element;
-export declare function DisclosureHeader({ children, className, ...props }: React.ComponentProps<typeof Button>): import("react/jsx-runtime").JSX.Element;
+export declare function Disclosure({ children, className, ...props }: DisclosureProps): import("react").JSX.Element;
+export declare function DisclosureHeader({ children, className, ...props }: React.ComponentProps<typeof Button>): import("react").JSX.Element;
 export interface DisclosurePanelProps extends AriaDisclosurePanelProps {
     children: React.ReactNode;
 }
-export declare function DisclosurePanel({ children, className, ...props }: DisclosurePanelProps): import("react/jsx-runtime").JSX.Element;
+export declare function DisclosurePanel({ children, className, ...props }: DisclosurePanelProps): import("react").JSX.Element;
 export interface DisclosureGroupProps extends AriaDisclosureGroupProps {
     children: React.ReactNode;
 }
-export declare function DisclosureGroup({ children, className, ...props }: DisclosureGroupProps): import("react/jsx-runtime").JSX.Element;
+export declare function DisclosureGroup({ children, className, ...props }: DisclosureGroupProps): import("react").JSX.Element;

package/dist/components/disclosure.js

@@ -1,2 +1,2 @@
-"use client";import{jsx as e,jsxs as u,Fragment as l}from"react/jsx-runtime";import{useContext as c}from"react";import{DisclosureGroupStateContext as m,Disclosure as p,composeRenderProps as a,DisclosureGroup as d,DisclosurePanel as D}from"react-aria-components";import{Button as f}from"./button.js";import{classNames as i}from"../utilities/theme.js";import{IcDown as N}from"./icons.js";import"class-variance-authority";import"./loader.js";import"clsx";import"@icons-pack/react-simple-icons";function v({children:r,className:s,...o}){let t=c(m)!==null;return e(p,{...o,className:a(s,(n,g)=>i("group",t&&"border-0 last:border-b-0",n)),children:r})}function w({children:r,className:s,...o}){return e(f,{slot:"trigger",type:"button",variant:"ghost",className:i(s),...o,children:a(r,t=>u(l,{children:[e("span",{children:t}),e(N,{"aria-hidden":!0,className:i("transition-transform duration-200","group-data-[expanded]:rotate-180")})]}))})}function y({children:r,className:s,...o}){return e(D,{...o,className:"transition-all",children:r})}function B({children:r,className:s,...o}){return e(d,{...o,className:a(s,(t,n)=>i("",t)),children:r})}export{v as Disclosure,B as DisclosureGroup,w as DisclosureHeader,y as DisclosurePanel};
-//# sourceMappingURL=disclosure.js.map
+"use client";import{classNames as e}from"../utilities/theme.js";import{x as t}from"../icons.js";import{Button as n}from"./button.js";import{useContext as r}from"react";import{Fragment as i,jsx as a,jsxs as o}from"react/jsx-runtime";import{Disclosure as s,DisclosureGroup as c,DisclosureGroupStateContext as l,DisclosurePanel as u,composeRenderProps as d}from"react-aria-components";function f({children:t,className:n,...i}){let o=r(l)!==null;return a(s,{...i,className:d(n,(t,n)=>e(`group`,o&&`border-0 last:border-b-0`,t)),children:t})}function p({children:r,className:s,...c}){return a(n,{slot:`trigger`,type:`button`,variant:`ghost`,className:e(s),...c,children:d(r,n=>o(i,{children:[a(`span`,{children:n}),a(t,{"aria-hidden":!0,className:e(`transition-transform duration-200`,`group-data-[expanded]:rotate-180`)})]}))})}function m({children:e,className:t,...n}){return a(u,{...n,className:`transition-all`,children:e})}function h({children:t,className:n,...r}){return a(c,{...r,className:d(n,(t,n)=>e(``,t)),children:t})}export{f as Disclosure,h as DisclosureGroup,p as DisclosureHeader,m as DisclosurePanel};
+//# sourceMappingURL=disclosure.js.map

package/dist/components/disclosure.js.map

@@ -1 +1 @@
-{"version":3,"file":"disclosure.js","sources":["../../lib/components/disclosure.tsx"],"sourcesContent":["'use client';\nimport { useContext } from 'react';\nimport {\n    Disclosure as AriaDisclosure,\n    DisclosureGroup as AriaDisclosureGroup,\n    DisclosureGroupProps as AriaDisclosureGroupProps,\n    DisclosurePanel as AriaDisclosurePanel,\n    DisclosurePanelProps as AriaDisclosurePanelProps,\n    DisclosureProps as AriaDisclosureProps,\n    composeRenderProps,\n    DisclosureGroupStateContext,\n} from 'react-aria-components';\n\nimport { Button } from '../components/button';\nimport { classNames } from '../utilities/theme';\nimport { IcDown } from './icons';\n\nexport interface DisclosureProps extends AriaDisclosureProps {\n    children: React.ReactNode;\n}\n\nexport function Disclosure({ children, className, ...props }: DisclosureProps) {\n    let isInGroup = useContext(DisclosureGroupStateContext) !== null;\n    return (\n        <AriaDisclosure\n            {...props}\n            className={composeRenderProps(className, (className, _) =>\n                classNames('group', isInGroup && 'border-0 last:border-b-0', className)\n            )}\n        >\n            {children}\n        </AriaDisclosure>\n    );\n}\n\nexport function DisclosureHeader({ children, className, ...props }: React.ComponentProps<typeof Button>) {\n    return (\n        <Button slot=\"trigger\" type=\"button\" variant={'ghost'} className={classNames(className)} {...props}>\n            {composeRenderProps(children, children => (\n                <>\n                    <span>{children}</span>\n                    <IcDown\n                        aria-hidden\n                        className={classNames('transition-transform duration-200', 'group-data-[expanded]:rotate-180')}\n                    />\n                </>\n            ))}\n        </Button>\n    );\n}\n\nexport interface DisclosurePanelProps extends AriaDisclosurePanelProps {\n    children: React.ReactNode;\n}\n\nexport function DisclosurePanel({ children, className, ...props }: DisclosurePanelProps) {\n    return (\n        <AriaDisclosurePanel {...props} className={'transition-all'}>\n            {children}\n        </AriaDisclosurePanel>\n    );\n}\n\nexport interface DisclosureGroupProps extends AriaDisclosureGroupProps {\n    children: React.ReactNode;\n}\n\nexport function DisclosureGroup({ children, className, ...props }: DisclosureGroupProps) {\n    return (\n        <AriaDisclosureGroup\n            {...props}\n            className={composeRenderProps(className, (className, _) => classNames('', className))}\n        >\n            {children}\n        </AriaDisclosureGroup>\n    );\n}\n"],"names":["Disclosure","children","className","props","isInGroup","useContext","DisclosureGroupStateContext","jsx","AriaDisclosure","composeRenderProps","_","classNames","DisclosureHeader","Button","jsxs","Fragment","IcDown","DisclosurePanel","AriaDisclosurePanel","DisclosureGroup","AriaDisclosureGroup"],"mappings":"2eAqBO,SAASA,EAAW,CAAE,SAAAC,EAAU,UAAAC,EAAW,GAAGC,GAA0B,CAC3E,IAAIC,EAAYC,EAAWC,CAA2B,IAAM,KAC5D,OACIC,EAACC,EAAA,CACI,GAAGL,EACJ,UAAWM,EAAmBP,EAAW,CAACA,EAAWQ,IACjDC,EAAW,QAASP,GAAa,2BAA4BF,CAAS,CAAA,EAGzE,SAAAD,CAAA,CAAA,CAGb,CAEO,SAASW,EAAiB,CAAE,SAAAX,EAAU,UAAAC,EAAW,GAAGC,GAA8C,CACrG,SACKU,EAAA,CAAO,KAAK,UAAU,KAAK,SAAS,QAAS,QAAS,UAAWF,EAAWT,CAAS,EAAI,GAAGC,EACxF,WAAmBF,EAAUA,GAC1Ba,EAAAC,EAAA,CACI,SAAA,CAAAR,EAAC,OAAA,CAAM,SAAAN,CAAAA,CAAS,EAChBM,EAACS,EAAA,CACG,cAAW,GACX,UAAWL,EAAW,oCAAqC,kCAAkC,CAAA,CAAA,CACjG,CAAA,CACJ,CACH,CAAA,CACL,CAER,CAMO,SAASM,EAAgB,CAAE,SAAAhB,EAAU,UAAAC,EAAW,GAAGC,GAA+B,CACrF,SACKe,EAAA,CAAqB,GAAGf,EAAO,UAAW,iBACtC,SAAAF,EACL,CAER,CAMO,SAASkB,EAAgB,CAAE,SAAAlB,EAAU,UAAAC,EAAW,GAAGC,GAA+B,CACrF,OACII,EAACa,EAAA,CACI,GAAGjB,EACJ,UAAWM,EAAmBP,EAAW,CAACA,EAAWQ,IAAMC,EAAW,GAAIT,CAAS,CAAC,EAEnF,SAAAD,CAAA,CAAA,CAGb"}
+{"version":3,"file":"disclosure.js","names":[],"sources":["../../lib/components/disclosure.tsx"],"sourcesContent":["'use client';\nimport { useContext } from 'react';\nimport {\n    Disclosure as AriaDisclosure,\n    DisclosureGroup as AriaDisclosureGroup,\n    DisclosureGroupProps as AriaDisclosureGroupProps,\n    DisclosurePanel as AriaDisclosurePanel,\n    DisclosurePanelProps as AriaDisclosurePanelProps,\n    DisclosureProps as AriaDisclosureProps,\n    composeRenderProps,\n    DisclosureGroupStateContext,\n} from 'react-aria-components';\n\nimport { Button } from '../components/button';\nimport { classNames } from '../utilities/theme';\nimport { IcDown } from './icons';\n\nexport interface DisclosureProps extends AriaDisclosureProps {\n    children: React.ReactNode;\n}\n\nexport function Disclosure({ children, className, ...props }: DisclosureProps) {\n    let isInGroup = useContext(DisclosureGroupStateContext) !== null;\n    return (\n        <AriaDisclosure\n            {...props}\n            className={composeRenderProps(className, (className, _) =>\n                classNames('group', isInGroup && 'border-0 last:border-b-0', className)\n            )}\n        >\n            {children}\n        </AriaDisclosure>\n    );\n}\n\nexport function DisclosureHeader({ children, className, ...props }: React.ComponentProps<typeof Button>) {\n    return (\n        <Button slot=\"trigger\" type=\"button\" variant={'ghost'} className={classNames(className)} {...props}>\n            {composeRenderProps(children, children => (\n                <>\n                    <span>{children}</span>\n                    <IcDown\n                        aria-hidden\n                        className={classNames('transition-transform duration-200', 'group-data-[expanded]:rotate-180')}\n                    />\n                </>\n            ))}\n        </Button>\n    );\n}\n\nexport interface DisclosurePanelProps extends AriaDisclosurePanelProps {\n    children: React.ReactNode;\n}\n\nexport function DisclosurePanel({ children, className, ...props }: DisclosurePanelProps) {\n    return (\n        <AriaDisclosurePanel {...props} className={'transition-all'}>\n            {children}\n        </AriaDisclosurePanel>\n    );\n}\n\nexport interface DisclosureGroupProps extends AriaDisclosureGroupProps {\n    children: React.ReactNode;\n}\n\nexport function DisclosureGroup({ children, className, ...props }: DisclosureGroupProps) {\n    return (\n        <AriaDisclosureGroup\n            {...props}\n            className={composeRenderProps(className, (className, _) => classNames('', className))}\n        >\n            {children}\n        </AriaDisclosureGroup>\n    );\n}\n"],"mappings":"8XAqBA,SAAgB,EAAW,CAAE,WAAU,YAAW,GAAG,GAA0B,CAC3E,IAAI,EAAY,EAAW,CAA2B,IAAM,KAC5D,OACI,EAAC,EAAD,CACI,GAAI,EACJ,UAAW,EAAmB,GAAY,EAAW,IACjD,EAAW,QAAS,GAAa,2BAA4B,CAAS,CAC1E,EAEC,UACW,CAAA,CAExB,CAEA,SAAgB,EAAiB,CAAE,WAAU,YAAW,GAAG,GAA8C,CACrG,OACI,EAAC,EAAD,CAAQ,KAAK,UAAU,KAAK,SAAS,QAAS,QAAS,UAAW,EAAW,CAAS,EAAG,GAAI,EACxF,SAAA,EAAmB,EAAU,GAC1B,EAAA,EAAA,CAAA,SAAA,CACI,EAAC,OAAD,CAAO,UAAe,CAAA,EACtB,EAAC,EAAD,CACI,cAAA,GACA,UAAW,EAAW,oCAAqC,kCAAkC,CAChG,CAAA,CACH,CAAA,CAAA,CACL,CACG,CAAA,CAEhB,CAMA,SAAgB,EAAgB,CAAE,WAAU,YAAW,GAAG,GAA+B,CACrF,OACI,EAAC,EAAD,CAAqB,GAAI,EAAO,UAAW,iBACtC,UACgB,CAAA,CAE7B,CAMA,SAAgB,EAAgB,CAAE,WAAU,YAAW,GAAG,GAA+B,CACrF,OACI,EAAC,EAAD,CACI,GAAI,EACJ,UAAW,EAAmB,GAAY,EAAW,IAAM,EAAW,GAAI,CAAS,CAAC,EAEnF,UACgB,CAAA,CAE7B"}

package/dist/components/divider.d.ts

@@ -12,7 +12,7 @@ import { VariantProps } from 'class-variance-authority';
  */
 declare const dividerVariants: (props?: ({
     orientation?: "horizontal" | "vertical" | null | undefined;
-    spacing?: "md" | "sm" | "lg" | null | undefined;
+    spacing?: "sm" | "lg" | "md" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export interface DividerProps extends VariantProps<typeof dividerVariants> {
     /**
@@ -29,5 +29,5 @@ export interface DividerProps extends VariantProps<typeof dividerVariants> {
      */
     role?: 'separator' | 'presentation' | 'none';
 }
-export declare function Divider({ orientation, label, spacing, className, role, }: DividerProps): import("react/jsx-runtime").JSX.Element;
+export declare function Divider({ orientation, label, spacing, className, role, }: DividerProps): import("react").JSX.Element;
 export {};

package/dist/components/divider.js

@@ -1,2 +1,2 @@
-"use client";import{jsxs as n,jsx as a}from"react/jsx-runtime";import{cva as l}from"class-variance-authority";import{classNames as s}from"../utilities/theme.js";import"clsx";const m=l("shrink-0",{variants:{orientation:{horizontal:"w-full h-[1px] border-t border-border",vertical:"self-stretch w-[1px] border-l border-border"},spacing:{sm:"",md:"",lg:""}},compoundVariants:[{orientation:"horizontal",spacing:"sm",class:"my-2"},{orientation:"horizontal",spacing:"md",class:"my-4"},{orientation:"horizontal",spacing:"lg",class:"my-6"},{orientation:"vertical",spacing:"sm",class:"mx-2"},{orientation:"vertical",spacing:"md",class:"mx-4"},{orientation:"vertical",spacing:"lg",class:"mx-6"}],defaultVariants:{orientation:"horizontal",spacing:"md"}});function h({orientation:r="horizontal",label:i,spacing:o="md",className:t,role:e="separator"}){return i&&r==="horizontal"?n("div",{className:s("flex items-center gap-2 w-full",o==="sm"&&"my-2",o==="md"&&"my-4",o==="lg"&&"my-6",t),role:e,"aria-orientation":r,children:[a("div",{className:"flex-1 h-[1px] border-t border-border"}),a("span",{className:"body-sm text-muted-foreground px-2 select-none",children:i}),a("div",{className:"flex-1 h-[1px] border-t border-border"})]}):a("div",{className:s(m({orientation:r,spacing:o}),t),role:e,"aria-orientation":r??void 0})}export{h as Divider};
-//# sourceMappingURL=divider.js.map
+"use client";import{classNames as e}from"../utilities/theme.js";import{jsx as t,jsxs as n}from"react/jsx-runtime";import{cva as r}from"class-variance-authority";var i=r(`shrink-0`,{variants:{orientation:{horizontal:`w-full h-[1px] border-t border-border`,vertical:`self-stretch w-[1px] border-l border-border`},spacing:{sm:``,md:``,lg:``}},compoundVariants:[{orientation:`horizontal`,spacing:`sm`,class:`my-2`},{orientation:`horizontal`,spacing:`md`,class:`my-4`},{orientation:`horizontal`,spacing:`lg`,class:`my-6`},{orientation:`vertical`,spacing:`sm`,class:`mx-2`},{orientation:`vertical`,spacing:`md`,class:`mx-4`},{orientation:`vertical`,spacing:`lg`,class:`mx-6`}],defaultVariants:{orientation:`horizontal`,spacing:`md`}});function a({orientation:r=`horizontal`,label:a,spacing:o=`md`,className:s,role:c=`separator`}){return a&&r===`horizontal`?n(`div`,{className:e(`flex items-center gap-2 w-full`,o===`sm`&&`my-2`,o===`md`&&`my-4`,o===`lg`&&`my-6`,s),role:c,"aria-orientation":r,children:[t(`div`,{className:`flex-1 h-[1px] border-t border-border`}),t(`span`,{className:`body-sm text-muted-foreground px-2 select-none`,children:a}),t(`div`,{className:`flex-1 h-[1px] border-t border-border`})]}):t(`div`,{className:e(i({orientation:r,spacing:o}),s),role:c,"aria-orientation":r??void 0})}export{a as Divider};
+//# sourceMappingURL=divider.js.map

package/dist/components/divider.js.map

@@ -1 +1 @@
-{"version":3,"file":"divider.js","sources":["../../lib/components/divider.tsx"],"sourcesContent":["'use client';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { classNames } from '../utilities/theme';\n\n/**\n * Divider component - Visual separator between sections of content\n *\n * @example\n * ```tsx\n * <Divider />\n * <Divider orientation=\"vertical\" />\n * <Divider label=\"OR\" />\n * <Divider spacing=\"lg\" />\n * ```\n */\n\nconst dividerVariants = cva('shrink-0', {\n    variants: {\n        orientation: {\n            horizontal: 'w-full h-[1px] border-t border-border',\n            vertical: 'self-stretch w-[1px] border-l border-border',\n        },\n        spacing: {\n            sm: '',\n            md: '',\n            lg: '',\n        },\n    },\n    compoundVariants: [\n        // Horizontal spacing\n        {\n            orientation: 'horizontal',\n            spacing: 'sm',\n            class: 'my-2',\n        },\n        {\n            orientation: 'horizontal',\n            spacing: 'md',\n            class: 'my-4',\n        },\n        {\n            orientation: 'horizontal',\n            spacing: 'lg',\n            class: 'my-6',\n        },\n        // Vertical spacing\n        {\n            orientation: 'vertical',\n            spacing: 'sm',\n            class: 'mx-2',\n        },\n        {\n            orientation: 'vertical',\n            spacing: 'md',\n            class: 'mx-4',\n        },\n        {\n            orientation: 'vertical',\n            spacing: 'lg',\n            class: 'mx-6',\n        },\n    ],\n    defaultVariants: {\n        orientation: 'horizontal',\n        spacing: 'md',\n    },\n});\n\nexport interface DividerProps extends VariantProps<typeof dividerVariants> {\n    /**\n     * Optional label/text in the center (horizontal only)\n     */\n    label?: string;\n    /**\n     * Additional CSS classes\n     */\n    className?: string;\n    /**\n     * ARIA role\n     * @default 'separator'\n     */\n    role?: 'separator' | 'presentation' | 'none';\n}\n\nexport function Divider({\n    orientation = 'horizontal',\n    label,\n    spacing = 'md',\n    className,\n    role = 'separator',\n}: DividerProps) {\n    // If label is provided and orientation is horizontal, use a different layout\n    if (label && orientation === 'horizontal') {\n        return (\n            <div\n                className={classNames(\n                    'flex items-center gap-2 w-full',\n                    spacing === 'sm' && 'my-2',\n                    spacing === 'md' && 'my-4',\n                    spacing === 'lg' && 'my-6',\n                    className\n                )}\n                role={role}\n                aria-orientation={orientation}\n            >\n                <div className=\"flex-1 h-[1px] border-t border-border\" />\n                <span className=\"body-sm text-muted-foreground px-2 select-none\">{label}</span>\n                <div className=\"flex-1 h-[1px] border-t border-border\" />\n            </div>\n        );\n    }\n\n    return (\n        <div\n            className={classNames(dividerVariants({ orientation, spacing }), className)}\n            role={role}\n            aria-orientation={orientation ?? undefined}\n        />\n    );\n}\n"],"names":["dividerVariants","cva","Divider","orientation","label","spacing","className","role","jsxs","classNames","jsx"],"mappings":"8KAgBA,MAAMA,EAAkBC,EAAI,WAAY,CACpC,SAAU,CACN,YAAa,CACT,WAAY,wCACZ,SAAU,6CAAA,EAEd,QAAS,CACL,GAAI,GACJ,GAAI,GACJ,GAAI,EAAA,CACR,EAEJ,iBAAkB,CAEd,CACI,YAAa,aACb,QAAS,KACT,MAAO,MAAA,EAEX,CACI,YAAa,aACb,QAAS,KACT,MAAO,MAAA,EAEX,CACI,YAAa,aACb,QAAS,KACT,MAAO,MAAA,EAGX,CACI,YAAa,WACb,QAAS,KACT,MAAO,MAAA,EAEX,CACI,YAAa,WACb,QAAS,KACT,MAAO,MAAA,EAEX,CACI,YAAa,WACb,QAAS,KACT,MAAO,MAAA,CACX,EAEJ,gBAAiB,CACb,YAAa,aACb,QAAS,IAAA,CAEjB,CAAC,EAkBM,SAASC,EAAQ,CACpB,YAAAC,EAAc,aACd,MAAAC,EACA,QAAAC,EAAU,KACV,UAAAC,EACA,KAAAC,EAAO,WACX,EAAiB,CAEb,OAAIH,GAASD,IAAgB,aAErBK,EAAC,MAAA,CACG,UAAWC,EACP,iCACAJ,IAAY,MAAQ,OACpBA,IAAY,MAAQ,OACpBA,IAAY,MAAQ,OACpBC,CAAA,EAEJ,KAAAC,EACA,mBAAkBJ,EAElB,SAAA,CAAAO,EAAC,MAAA,CAAI,UAAU,uCAAA,CAAwC,EACvDA,EAAC,OAAA,CAAK,UAAU,iDAAkD,SAAAN,EAAM,EACxEM,EAAC,MAAA,CAAI,UAAU,uCAAA,CAAwC,CAAA,CAAA,CAAA,EAM/DA,EAAC,MAAA,CACG,UAAWD,EAAWT,EAAgB,CAAE,YAAAG,EAAa,QAAAE,CAAA,CAAS,EAAGC,CAAS,EAC1E,KAAAC,EACA,mBAAkBJ,GAAe,MAAA,CAAA,CAG7C"}
+{"version":3,"file":"divider.js","names":[],"sources":["../../lib/components/divider.tsx"],"sourcesContent":["'use client';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { classNames } from '../utilities/theme';\n\n/**\n * Divider component - Visual separator between sections of content\n *\n * @example\n * ```tsx\n * <Divider />\n * <Divider orientation=\"vertical\" />\n * <Divider label=\"OR\" />\n * <Divider spacing=\"lg\" />\n * ```\n */\n\nconst dividerVariants = cva('shrink-0', {\n    variants: {\n        orientation: {\n            horizontal: 'w-full h-[1px] border-t border-border',\n            vertical: 'self-stretch w-[1px] border-l border-border',\n        },\n        spacing: {\n            sm: '',\n            md: '',\n            lg: '',\n        },\n    },\n    compoundVariants: [\n        // Horizontal spacing\n        {\n            orientation: 'horizontal',\n            spacing: 'sm',\n            class: 'my-2',\n        },\n        {\n            orientation: 'horizontal',\n            spacing: 'md',\n            class: 'my-4',\n        },\n        {\n            orientation: 'horizontal',\n            spacing: 'lg',\n            class: 'my-6',\n        },\n        // Vertical spacing\n        {\n            orientation: 'vertical',\n            spacing: 'sm',\n            class: 'mx-2',\n        },\n        {\n            orientation: 'vertical',\n            spacing: 'md',\n            class: 'mx-4',\n        },\n        {\n            orientation: 'vertical',\n            spacing: 'lg',\n            class: 'mx-6',\n        },\n    ],\n    defaultVariants: {\n        orientation: 'horizontal',\n        spacing: 'md',\n    },\n});\n\nexport interface DividerProps extends VariantProps<typeof dividerVariants> {\n    /**\n     * Optional label/text in the center (horizontal only)\n     */\n    label?: string;\n    /**\n     * Additional CSS classes\n     */\n    className?: string;\n    /**\n     * ARIA role\n     * @default 'separator'\n     */\n    role?: 'separator' | 'presentation' | 'none';\n}\n\nexport function Divider({\n    orientation = 'horizontal',\n    label,\n    spacing = 'md',\n    className,\n    role = 'separator',\n}: DividerProps) {\n    // If label is provided and orientation is horizontal, use a different layout\n    if (label && orientation === 'horizontal') {\n        return (\n            <div\n                className={classNames(\n                    'flex items-center gap-2 w-full',\n                    spacing === 'sm' && 'my-2',\n                    spacing === 'md' && 'my-4',\n                    spacing === 'lg' && 'my-6',\n                    className\n                )}\n                role={role}\n                aria-orientation={orientation}\n            >\n                <div className=\"flex-1 h-[1px] border-t border-border\" />\n                <span className=\"body-sm text-muted-foreground px-2 select-none\">{label}</span>\n                <div className=\"flex-1 h-[1px] border-t border-border\" />\n            </div>\n        );\n    }\n\n    return (\n        <div\n            className={classNames(dividerVariants({ orientation, spacing }), className)}\n            role={role}\n            aria-orientation={orientation ?? undefined}\n        />\n    );\n}\n"],"mappings":"iKAgBA,IAAM,EAAkB,EAAI,WAAY,CACpC,SAAU,CACN,YAAa,CACT,WAAY,wCACZ,SAAU,6CACd,EACA,QAAS,CACL,GAAI,GACJ,GAAI,GACJ,GAAI,EACR,CACJ,EACA,iBAAkB,CAEd,CACI,YAAa,aACb,QAAS,KACT,MAAO,MACX,EACA,CACI,YAAa,aACb,QAAS,KACT,MAAO,MACX,EACA,CACI,YAAa,aACb,QAAS,KACT,MAAO,MACX,EAEA,CACI,YAAa,WACb,QAAS,KACT,MAAO,MACX,EACA,CACI,YAAa,WACb,QAAS,KACT,MAAO,MACX,EACA,CACI,YAAa,WACb,QAAS,KACT,MAAO,MACX,CACJ,EACA,gBAAiB,CACb,YAAa,aACb,QAAS,IACb,CACJ,CAAC,EAkBD,SAAgB,EAAQ,CACpB,cAAc,aACd,QACA,UAAU,KACV,YACA,OAAO,aACM,CAsBb,OApBI,GAAS,IAAgB,aAErB,EAAC,MAAD,CACI,UAAW,EACP,iCACA,IAAY,MAAQ,OACpB,IAAY,MAAQ,OACpB,IAAY,MAAQ,OACpB,CACJ,EACM,OACN,mBAAkB,EATtB,SAAA,CAWI,EAAC,MAAD,CAAK,UAAU,uCAAyC,CAAA,EACxD,EAAC,OAAD,CAAM,UAAU,iDAAkD,SAAA,CAAY,CAAA,EAC9E,EAAC,MAAD,CAAK,UAAU,uCAAyC,CAAA,CACvD,IAKT,EAAC,MAAD,CACI,UAAW,EAAW,EAAgB,CAAE,cAAa,SAAQ,CAAC,EAAG,CAAS,EACpE,OACN,mBAAkB,GAAe,IAAA,EACpC,CAAA,CAET"}

package/dist/components/duration-field.d.ts

@@ -8,8 +8,8 @@ interface Iso8601DurationFieldBaseProps {
 export interface Iso8601DurationFieldProps extends Iso8601DurationFieldBaseProps, FormFieldProps, Omit<AriaNumberFieldProps, 'value' | 'onChange' | 'onBlur'> {
     id?: string;
 }
-export declare function Iso8601DurationField({ value, onChange, onBlur, label, description, errorMessage, requiredIndicator, isDisabled, id, }: Iso8601DurationFieldProps): import("react/jsx-runtime").JSX.Element;
+export declare function Iso8601DurationField({ value, onChange, onBlur, label, description, errorMessage, requiredIndicator, isDisabled, id, }: Iso8601DurationFieldProps): import("react").JSX.Element;
 export interface TfIso8601DurationFieldProps extends Omit<Iso8601DurationFieldProps, 'value' | 'onChange'> {
 }
-export declare function TfIso8601DurationField({ isDisabled, ...props }: TfIso8601DurationFieldProps): import("react/jsx-runtime").JSX.Element;
+export declare function TfIso8601DurationField({ isDisabled, ...props }: TfIso8601DurationFieldProps): import("react").JSX.Element;
 export {};

package/dist/components/duration-field.js

@@ -1,2 +1,2 @@
-"use client";import{jsxs as N,jsx as t}from"react/jsx-runtime";import{useState as D,useMemo as M,useCallback as v}from"react";import{NumberField as z}from"react-aria-components";import{Duration as b}from"../utilities/duration.js";import{getFieldErrorMessage as B}from"../utilities/form.js";import{useFieldContext as $}from"../utilities/form-context.js";import{classNames as w}from"../utilities/theme.js";import{Button as A}from"./button.js";import{FormField as L,FieldGroup as Y}from"./form.js";import{IcLeft as _,IcRight as j}from"./icons.js";import{NumberFieldInput as k}from"./numberfield.js";import"@tanstack/react-form";import"clsx";import"class-variance-authority";import"./loader.js";import"@icons-pack/react-simple-icons";import"./card.js";const q=z,G={years:{full:"Years",short:"yr"},months:{full:"Months",short:"mo"},weeks:{full:"Weeks",short:"wk"},days:{full:"Days",short:"d"},hours:{full:"Hours",short:"hr"},minutes:{full:"Minutes",short:"min"},seconds:{full:"Seconds",short:"sec"}},F=["years","months","days"],H=["hours","minutes","seconds"];function K({id:r,value:s,onChange:e,onBlur:f,label:m,isInvalid:d,isDisabled:h}){return N("div",{className:"flex items-center flex-1 min-w-0 relative",children:[t(q,{"aria-label":m,isInvalid:d,isDisabled:h,value:s,onChange:n=>e(n),onBlur:f,minValue:0,className:"w-full",children:t(k,{id:r,className:"w-full pr-input"})}),t("div",{className:"absolute right-1 select-none text-muted pointer-events-none",children:m})]})}function P({value:r,onChange:s,onBlur:e,label:f,description:m,errorMessage:d,requiredIndicator:h,isDisabled:n,id:S}){const[l,I]=D(!1),c=M(()=>{if(!r||r==="")return{};try{return b.parse(r)}catch{return{}}},[r]),x=v((o,a)=>{const g={...c,[o]:a>0?a:void 0};s(b.serialize(g))},[c,s]),E=()=>{I(o=>!o)},u=!!d,p=S||"duration-field",T=v(o=>{const a=o?[...F,...H]:F,g=o?"short":"full";return a.map((i,y)=>N("div",{className:"contents",children:[t(K,{id:`${p}-${i}`,value:c[i]??0,onChange:C=>x(i,C),onBlur:e||(()=>{}),label:G[i][g],isInvalid:u,isDisabled:n||!1}),y<a.length-1&&t("div",{className:"self-stretch w-px bg-input mx-2 flex-shrink-0","aria-hidden":"true"},`sep-${i}`)]},i))},[p,c,x,e,u,n,l]);return t("div",{className:w("group form-field"),"data-invalid":u?"":void 0,children:t(L,{label:f,description:m,errorMessage:d,requiredIndicator:h,htmlFor:`${p}-years`,children:N("div",{className:"flex-1 flex items-center gap-1",children:[t(Y,{"data-invalid":u?"":void 0,className:"flex flex-row items-stretch w-full overflow-hidden",children:T(l)}),t(A,{type:"button",size:"icon",onPress:E,isDisabled:n,"aria-label":l?"Hide time components":"Show time components","aria-expanded":l,className:w("flex-shrink-0 bg-surface-primary"),children:l?t(_,{className:"size-icon"}):t(j,{className:"size-icon"})})]})})})}function ae({isDisabled:r,...s}){const e=$({disabled:r});return t(P,{requiredIndicator:e.isRequired,value:e.state.value,onChange:e.handleChange,onBlur:e.handleBlur,errorMessage:B(e),isDisabled:r||e.isSubmitting,id:e.name,...s})}export{P as Iso8601DurationField,ae as TfIso8601DurationField};
-//# sourceMappingURL=duration-field.js.map
+"use client";import{Duration as e}from"../utilities/duration.js";import{classNames as t}from"../utilities/theme.js";import{At as n,K as r}from"../icons.js";import{useFieldContext as i}from"../utilities/form-context.js";import{Button as a}from"./button.js";import{FieldGroup as o,FormField as s}from"./form.js";import{getFieldErrorMessage as c}from"../utilities/form.js";import{NumberFieldInput as l}from"./numberfield.js";import{useCallback as u,useMemo as d,useState as f}from"react";import{jsx as p,jsxs as m}from"react/jsx-runtime";import{NumberField as h}from"react-aria-components";var g=h,_={years:{full:`Years`,short:`yr`},months:{full:`Months`,short:`mo`},weeks:{full:`Weeks`,short:`wk`},days:{full:`Days`,short:`d`},hours:{full:`Hours`,short:`hr`},minutes:{full:`Minutes`,short:`min`},seconds:{full:`Seconds`,short:`sec`}},v=[`years`,`months`,`days`],y=[`hours`,`minutes`,`seconds`];function b({id:e,value:t,onChange:n,onBlur:r,label:i,isInvalid:a,isDisabled:o}){return m(`div`,{className:`flex items-center flex-1 min-w-0 relative`,children:[p(g,{"aria-label":i,isInvalid:a,isDisabled:o,value:t,onChange:e=>n(e),onBlur:r,minValue:0,className:`w-full`,children:p(l,{id:e,className:`w-full pr-input`})}),p(`div`,{className:`absolute right-1 select-none text-muted pointer-events-none`,children:i})]})}function x({value:i,onChange:c,onBlur:l,label:h,description:g,errorMessage:x,requiredIndicator:S,isDisabled:C,id:w}){let[T,E]=f(!1),D=d(()=>{if(!i||i===``)return{};try{return e.parse(i)}catch{return{}}},[i]),O=u((t,n)=>{let r={...D,[t]:n>0?n:void 0};c(e.serialize(r))},[D,c]),k=()=>{E(e=>!e)},A=!!x,j=w||`duration-field`,M=u(e=>{let t=e?[...v,...y]:v,n=e?`short`:`full`;return t.map((e,r)=>m(`div`,{className:`contents`,children:[p(b,{id:`${j}-${e}`,value:D[e]??0,onChange:t=>O(e,t),onBlur:l||(()=>{}),label:_[e][n],isInvalid:A,isDisabled:C||!1}),r<t.length-1&&p(`div`,{className:`self-stretch w-px bg-input mx-2 flex-shrink-0`,"aria-hidden":`true`},`sep-${e}`)]},e))},[j,D,O,l,A,C,T]);return p(`div`,{className:t(`group form-field`),"data-invalid":A?``:void 0,children:p(s,{label:h,description:g,errorMessage:x,requiredIndicator:S,htmlFor:`${j}-years`,children:m(`div`,{className:`flex-1 flex items-center gap-1`,children:[p(o,{"data-invalid":A?``:void 0,className:`flex flex-row items-stretch w-full overflow-hidden`,children:M(T)}),p(a,{type:`button`,size:`icon`,onPress:k,isDisabled:C,"aria-label":T?`Hide time components`:`Show time components`,"aria-expanded":T,className:t(`flex-shrink-0 bg-surface-primary`),children:p(T?r:n,{className:`size-icon`})})]})})})}function S({isDisabled:e,...t}){let n=i({disabled:e});return p(x,{requiredIndicator:n.isRequired,value:n.state.value,onChange:n.handleChange,onBlur:n.handleBlur,errorMessage:c(n),isDisabled:e||n.isSubmitting,id:n.name,...t})}export{x as Iso8601DurationField,S as TfIso8601DurationField};
+//# sourceMappingURL=duration-field.js.map

package/dist/components/duration-field.js.map

@@ -1 +1 @@
-{"version":3,"file":"duration-field.js","sources":["../../lib/components/duration-field.tsx"],"sourcesContent":["'use client';\nimport { useCallback, useMemo, useState } from 'react';\nimport { NumberField as AriaNumberField, NumberFieldProps as AriaNumberFieldProps } from 'react-aria-components';\nimport { Duration } from '../utilities/duration';\nimport { getFieldErrorMessage } from '../utilities/form';\nimport { useFieldContext } from '../utilities/form-context';\nimport { classNames } from '../utilities/theme';\nimport { Button } from './button';\nimport { FieldGroup, FormField, type FormFieldProps } from './form';\nimport { IcLeft, IcRight } from './icons';\nimport { NumberFieldInput } from './numberfield';\n\nconst ANumberField = AriaNumberField;\n\ntype DurationPartKey = keyof Duration;\n\n/**\n * Segment configurations with both full and short labels\n * https://learn.microsoft.com/en-us/style-guide/a-z-word-list-term-collections/term-collections/date-time-terms\n * https://en.wikipedia.org/wiki/Hour\n */\nconst SEGMENT_LABELS: Record<DurationPartKey, { full: string; short: string }> = {\n    years: { full: 'Years', short: 'yr' },\n    months: { full: 'Months', short: 'mo' },\n    weeks: { full: 'Weeks', short: 'wk' },\n    days: { full: 'Days', short: 'd' },\n    hours: { full: 'Hours', short: 'hr' },\n    minutes: { full: 'Minutes', short: 'min' },\n    seconds: { full: 'Seconds', short: 'sec' },\n};\n\nconst DATE_KEYS: DurationPartKey[] = ['years', 'months', 'days'];\nconst TIME_KEYS: DurationPartKey[] = ['hours', 'minutes', 'seconds'];\n\n/**\n * Props for DurationSegment component\n */\ninterface DurationSegmentProps {\n    /** Unique identifier for the input field */\n    id: string;\n    /** Current numeric value */\n    value: number;\n    /** Callback when value changes */\n    onChange: (value: number) => void;\n    /** Callback when field loses focus */\n    onBlur: () => void;\n    /** Display label for the segment */\n    label: string;\n    /** Whether the field has validation errors */\n    isInvalid: boolean;\n    /** Whether the field is disabled */\n    isDisabled: boolean;\n}\n\nfunction DurationSegment({ id, value, onChange, onBlur, label, isInvalid, isDisabled }: DurationSegmentProps) {\n    return (\n        <div className=\"flex items-center flex-1 min-w-0 relative\">\n            <ANumberField\n                aria-label={label}\n                isInvalid={isInvalid}\n                isDisabled={isDisabled}\n                value={value}\n                onChange={newValue => onChange(newValue)}\n                onBlur={onBlur}\n                minValue={0}\n                className=\"w-full\"\n            >\n                <NumberFieldInput id={id} className=\"w-full pr-input\" />\n            </ANumberField>\n            <div className=\"absolute right-1 select-none text-muted pointer-events-none\">{label}</div>\n        </div>\n    );\n}\n\ninterface Iso8601DurationFieldBaseProps {\n    value: string;\n    onChange: (value: string) => void;\n    onBlur?: () => void;\n}\n\nexport interface Iso8601DurationFieldProps\n    extends Iso8601DurationFieldBaseProps,\n        FormFieldProps,\n        Omit<AriaNumberFieldProps, 'value' | 'onChange' | 'onBlur'> {\n    id?: string;\n}\n\nexport function Iso8601DurationField({\n    value,\n    onChange,\n    onBlur,\n    label,\n    description,\n    errorMessage,\n    requiredIndicator,\n    isDisabled,\n    id,\n}: Iso8601DurationFieldProps) {\n    const [showTime, setShowTime] = useState(false);\n\n    const duration = useMemo((): Duration => {\n        if (!value || value === '') {\n            return {};\n        }\n        try {\n            return Duration.parse(value);\n        } catch {\n            return {};\n        }\n    }, [value]);\n\n    const handlePartChange = useCallback(\n        (part: DurationPartKey, partValue: number) => {\n            const updatedDuration: Duration = {\n                ...duration,\n                [part]: partValue > 0 ? partValue : undefined,\n            };\n            onChange(Duration.serialize(updatedDuration));\n        },\n        [duration, onChange]\n    );\n\n    const handleToggleTime = () => {\n        setShowTime(prev => !prev);\n    };\n\n    const isInvalid = !!errorMessage;\n    const fieldId = id || 'duration-field';\n\n    const renderSegments = useCallback(\n        (includeTime: boolean) => {\n            const keys = includeTime ? [...DATE_KEYS, ...TIME_KEYS] : DATE_KEYS;\n            const labelType = includeTime ? 'short' : 'full';\n\n            return keys.map((key, index) => (\n                <div key={key} className=\"contents\">\n                    <DurationSegment\n                        id={`${fieldId}-${key}`}\n                        value={duration[key] ?? 0}\n                        onChange={segmentValue => handlePartChange(key, segmentValue)}\n                        onBlur={onBlur || (() => {})}\n                        label={SEGMENT_LABELS[key][labelType]}\n                        isInvalid={isInvalid}\n                        isDisabled={isDisabled || false}\n                    />\n                    {index < keys.length - 1 && (\n                        <div\n                            key={`sep-${key}`}\n                            className=\"self-stretch w-px bg-input mx-2 flex-shrink-0\"\n                            aria-hidden=\"true\"\n                        />\n                    )}\n                </div>\n            ));\n        },\n        [fieldId, duration, handlePartChange, onBlur, isInvalid, isDisabled, showTime]\n    );\n\n    return (\n        <div className={classNames('group form-field')} data-invalid={isInvalid ? '' : undefined}>\n            <FormField\n                label={label}\n                description={description}\n                errorMessage={errorMessage}\n                requiredIndicator={requiredIndicator}\n                htmlFor={`${fieldId}-years`}\n            >\n                <div className=\"flex-1 flex items-center gap-1\">\n                    <FieldGroup\n                        data-invalid={isInvalid ? '' : undefined}\n                        className=\"flex flex-row items-stretch w-full overflow-hidden\"\n                    >\n                        {renderSegments(showTime)}\n                    </FieldGroup>\n                    <Button\n                        type=\"button\"\n                        size=\"icon\"\n                        onPress={handleToggleTime}\n                        isDisabled={isDisabled}\n                        aria-label={showTime ? 'Hide time components' : 'Show time components'}\n                        aria-expanded={showTime}\n                        className={classNames('flex-shrink-0 bg-surface-primary')}\n                    >\n                        {showTime ? <IcLeft className=\"size-icon\" /> : <IcRight className=\"size-icon\" />}\n                    </Button>\n                </div>\n            </FormField>\n        </div>\n    );\n}\n\nexport interface TfIso8601DurationFieldProps extends Omit<Iso8601DurationFieldProps, 'value' | 'onChange'> {}\n\nexport function TfIso8601DurationField({ isDisabled, ...props }: TfIso8601DurationFieldProps) {\n    const field = useFieldContext<string>({ disabled: isDisabled });\n\n    return (\n        <Iso8601DurationField\n            requiredIndicator={field.isRequired}\n            value={field.state.value}\n            onChange={field.handleChange}\n            onBlur={field.handleBlur}\n            errorMessage={getFieldErrorMessage(field)}\n            isDisabled={isDisabled || field.isSubmitting}\n            id={field.name}\n            {...props}\n        />\n    );\n}\n"],"names":["ANumberField","AriaNumberField","SEGMENT_LABELS","DATE_KEYS","TIME_KEYS","DurationSegment","id","value","onChange","onBlur","label","isInvalid","isDisabled","jsxs","jsx","newValue","NumberFieldInput","Iso8601DurationField","description","errorMessage","requiredIndicator","showTime","setShowTime","useState","duration","useMemo","Duration","handlePartChange","useCallback","part","partValue","updatedDuration","handleToggleTime","prev","fieldId","renderSegments","includeTime","keys","labelType","key","index","segmentValue","classNames","FormField","FieldGroup","Button","IcLeft","IcRight","TfIso8601DurationField","props","field","useFieldContext","getFieldErrorMessage"],"mappings":"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"}
+{"version":3,"file":"duration-field.js","names":[],"sources":["../../lib/components/duration-field.tsx"],"sourcesContent":["'use client';\nimport { useCallback, useMemo, useState } from 'react';\nimport { NumberField as AriaNumberField, NumberFieldProps as AriaNumberFieldProps } from 'react-aria-components';\nimport { Duration } from '../utilities/duration';\nimport { getFieldErrorMessage } from '../utilities/form';\nimport { useFieldContext } from '../utilities/form-context';\nimport { classNames } from '../utilities/theme';\nimport { Button } from './button';\nimport { FieldGroup, FormField, type FormFieldProps } from './form';\nimport { IcLeft, IcRight } from './icons';\nimport { NumberFieldInput } from './numberfield';\n\nconst ANumberField = AriaNumberField;\n\ntype DurationPartKey = keyof Duration;\n\n/**\n * Segment configurations with both full and short labels\n * https://learn.microsoft.com/en-us/style-guide/a-z-word-list-term-collections/term-collections/date-time-terms\n * https://en.wikipedia.org/wiki/Hour\n */\nconst SEGMENT_LABELS: Record<DurationPartKey, { full: string; short: string }> = {\n    years: { full: 'Years', short: 'yr' },\n    months: { full: 'Months', short: 'mo' },\n    weeks: { full: 'Weeks', short: 'wk' },\n    days: { full: 'Days', short: 'd' },\n    hours: { full: 'Hours', short: 'hr' },\n    minutes: { full: 'Minutes', short: 'min' },\n    seconds: { full: 'Seconds', short: 'sec' },\n};\n\nconst DATE_KEYS: DurationPartKey[] = ['years', 'months', 'days'];\nconst TIME_KEYS: DurationPartKey[] = ['hours', 'minutes', 'seconds'];\n\n/**\n * Props for DurationSegment component\n */\ninterface DurationSegmentProps {\n    /** Unique identifier for the input field */\n    id: string;\n    /** Current numeric value */\n    value: number;\n    /** Callback when value changes */\n    onChange: (value: number) => void;\n    /** Callback when field loses focus */\n    onBlur: () => void;\n    /** Display label for the segment */\n    label: string;\n    /** Whether the field has validation errors */\n    isInvalid: boolean;\n    /** Whether the field is disabled */\n    isDisabled: boolean;\n}\n\nfunction DurationSegment({ id, value, onChange, onBlur, label, isInvalid, isDisabled }: DurationSegmentProps) {\n    return (\n        <div className=\"flex items-center flex-1 min-w-0 relative\">\n            <ANumberField\n                aria-label={label}\n                isInvalid={isInvalid}\n                isDisabled={isDisabled}\n                value={value}\n                onChange={newValue => onChange(newValue)}\n                onBlur={onBlur}\n                minValue={0}\n                className=\"w-full\"\n            >\n                <NumberFieldInput id={id} className=\"w-full pr-input\" />\n            </ANumberField>\n            <div className=\"absolute right-1 select-none text-muted pointer-events-none\">{label}</div>\n        </div>\n    );\n}\n\ninterface Iso8601DurationFieldBaseProps {\n    value: string;\n    onChange: (value: string) => void;\n    onBlur?: () => void;\n}\n\nexport interface Iso8601DurationFieldProps\n    extends Iso8601DurationFieldBaseProps,\n        FormFieldProps,\n        Omit<AriaNumberFieldProps, 'value' | 'onChange' | 'onBlur'> {\n    id?: string;\n}\n\nexport function Iso8601DurationField({\n    value,\n    onChange,\n    onBlur,\n    label,\n    description,\n    errorMessage,\n    requiredIndicator,\n    isDisabled,\n    id,\n}: Iso8601DurationFieldProps) {\n    const [showTime, setShowTime] = useState(false);\n\n    const duration = useMemo((): Duration => {\n        if (!value || value === '') {\n            return {};\n        }\n        try {\n            return Duration.parse(value);\n        } catch {\n            return {};\n        }\n    }, [value]);\n\n    const handlePartChange = useCallback(\n        (part: DurationPartKey, partValue: number) => {\n            const updatedDuration: Duration = {\n                ...duration,\n                [part]: partValue > 0 ? partValue : undefined,\n            };\n            onChange(Duration.serialize(updatedDuration));\n        },\n        [duration, onChange]\n    );\n\n    const handleToggleTime = () => {\n        setShowTime(prev => !prev);\n    };\n\n    const isInvalid = !!errorMessage;\n    const fieldId = id || 'duration-field';\n\n    const renderSegments = useCallback(\n        (includeTime: boolean) => {\n            const keys = includeTime ? [...DATE_KEYS, ...TIME_KEYS] : DATE_KEYS;\n            const labelType = includeTime ? 'short' : 'full';\n\n            return keys.map((key, index) => (\n                <div key={key} className=\"contents\">\n                    <DurationSegment\n                        id={`${fieldId}-${key}`}\n                        value={duration[key] ?? 0}\n                        onChange={segmentValue => handlePartChange(key, segmentValue)}\n                        onBlur={onBlur || (() => {})}\n                        label={SEGMENT_LABELS[key][labelType]}\n                        isInvalid={isInvalid}\n                        isDisabled={isDisabled || false}\n                    />\n                    {index < keys.length - 1 && (\n                        <div\n                            key={`sep-${key}`}\n                            className=\"self-stretch w-px bg-input mx-2 flex-shrink-0\"\n                            aria-hidden=\"true\"\n                        />\n                    )}\n                </div>\n            ));\n        },\n        [fieldId, duration, handlePartChange, onBlur, isInvalid, isDisabled, showTime]\n    );\n\n    return (\n        <div className={classNames('group form-field')} data-invalid={isInvalid ? '' : undefined}>\n            <FormField\n                label={label}\n                description={description}\n                errorMessage={errorMessage}\n                requiredIndicator={requiredIndicator}\n                htmlFor={`${fieldId}-years`}\n            >\n                <div className=\"flex-1 flex items-center gap-1\">\n                    <FieldGroup\n                        data-invalid={isInvalid ? '' : undefined}\n                        className=\"flex flex-row items-stretch w-full overflow-hidden\"\n                    >\n                        {renderSegments(showTime)}\n                    </FieldGroup>\n                    <Button\n                        type=\"button\"\n                        size=\"icon\"\n                        onPress={handleToggleTime}\n                        isDisabled={isDisabled}\n                        aria-label={showTime ? 'Hide time components' : 'Show time components'}\n                        aria-expanded={showTime}\n                        className={classNames('flex-shrink-0 bg-surface-primary')}\n                    >\n                        {showTime ? <IcLeft className=\"size-icon\" /> : <IcRight className=\"size-icon\" />}\n                    </Button>\n                </div>\n            </FormField>\n        </div>\n    );\n}\n\nexport interface TfIso8601DurationFieldProps extends Omit<Iso8601DurationFieldProps, 'value' | 'onChange'> {}\n\nexport function TfIso8601DurationField({ isDisabled, ...props }: TfIso8601DurationFieldProps) {\n    const field = useFieldContext<string>({ disabled: isDisabled });\n\n    return (\n        <Iso8601DurationField\n            requiredIndicator={field.isRequired}\n            value={field.state.value}\n            onChange={field.handleChange}\n            onBlur={field.handleBlur}\n            errorMessage={getFieldErrorMessage(field)}\n            isDisabled={isDisabled || field.isSubmitting}\n            id={field.name}\n            {...props}\n        />\n    );\n}\n"],"mappings":"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"}

package/dist/components/file-trigger.d.ts

@@ -4,4 +4,4 @@ export interface FileTriggerProps extends AriaFileTriggerProps {
     className?: string;
     children?: ReactNode;
 }
-export declare function FileTrigger(props: FileTriggerProps): import("react/jsx-runtime").JSX.Element;
+export declare function FileTrigger(props: FileTriggerProps): import("react").JSX.Element;

package/dist/components/file-trigger.js

@@ -1,2 +1,2 @@
-import{jsx as r,jsxs as t}from"react/jsx-runtime";import{FileTrigger as s}from"react-aria-components";import{classNames as l}from"../utilities/theme.js";import{Button as p}from"./button.js";import{IcUpload as c}from"./icons.js";import"clsx";import"class-variance-authority";import"./loader.js";import"@icons-pack/react-simple-icons";import"react";function T(i){const{children:o,className:e,...m}=i;return r(s,{...m,children:o??t(p,{className:l(e),children:[r(c,{}),r("p",{children:"Click to browse files"})]})})}export{T as FileTrigger};
-//# sourceMappingURL=file-trigger.js.map
+import{classNames as e}from"../utilities/theme.js";import{Gt as t}from"../icons.js";import{Button as n}from"./button.js";import{jsx as r,jsxs as i}from"react/jsx-runtime";import{FileTrigger as a}from"react-aria-components";function o(o){let{children:s,className:c,...l}=o;return r(a,{...l,children:s??i(n,{className:e(c),children:[r(t,{}),r(`p`,{children:`Click to browse files`})]})})}export{o as FileTrigger};
+//# sourceMappingURL=file-trigger.js.map

package/dist/components/file-trigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"file-trigger.js","sources":["../../lib/components/file-trigger.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { FileTrigger as AriaFileTrigger, FileTriggerProps as AriaFileTriggerProps } from 'react-aria-components';\nimport { classNames } from '../utilities/theme';\nimport { Button } from './button';\nimport { IcUpload } from './icons';\nexport interface FileTriggerProps extends AriaFileTriggerProps {\n    className?: string;\n    children?: ReactNode;\n}\nexport function FileTrigger(props: FileTriggerProps) {\n    const { children, className, ...rest } = props;\n    return (\n        <AriaFileTrigger {...rest}>\n            {children ?? (\n                <Button className={classNames(className)}>\n                    <IcUpload />\n                    <p>Click to browse files</p>\n                </Button>\n            )}\n        </AriaFileTrigger>\n    );\n}\n"],"names":["FileTrigger","props","children","className","rest","jsx","AriaFileTrigger","Button","classNames","IcUpload"],"mappings":"2VASO,SAASA,EAAYC,EAAyB,CACjD,KAAM,CAAE,SAAAC,EAAU,UAAAC,EAAW,GAAGC,GAASH,EACzC,OACII,EAACC,EAAA,CAAiB,GAAGF,EAChB,SAAAF,KACIK,EAAA,CAAO,UAAWC,EAAWL,CAAS,EACnC,SAAA,CAAAE,EAACI,EAAA,EAAS,EACVJ,EAAC,KAAE,SAAA,uBAAA,CAAqB,CAAA,CAAA,CAC5B,CAAA,CAER,CAER"}
+{"version":3,"file":"file-trigger.js","names":[],"sources":["../../lib/components/file-trigger.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { FileTrigger as AriaFileTrigger, FileTriggerProps as AriaFileTriggerProps } from 'react-aria-components';\nimport { classNames } from '../utilities/theme';\nimport { Button } from './button';\nimport { IcUpload } from './icons';\nexport interface FileTriggerProps extends AriaFileTriggerProps {\n    className?: string;\n    children?: ReactNode;\n}\nexport function FileTrigger(props: FileTriggerProps) {\n    const { children, className, ...rest } = props;\n    return (\n        <AriaFileTrigger {...rest}>\n            {children ?? (\n                <Button className={classNames(className)}>\n                    <IcUpload />\n                    <p>Click to browse files</p>\n                </Button>\n            )}\n        </AriaFileTrigger>\n    );\n}\n"],"mappings":"+NASA,SAAgB,EAAY,EAAyB,CACjD,GAAM,CAAE,WAAU,YAAW,GAAG,GAAS,EACzC,OACI,EAAC,EAAD,CAAiB,GAAI,EAChB,SAAA,GACG,EAAC,EAAD,CAAQ,UAAW,EAAW,CAAS,EAAvC,SAAA,CACI,EAAC,EAAD,CAAW,CAAA,EACX,EAAC,IAAD,CAAA,SAAG,uBAAwB,CAAA,CACvB,GAEC,CAAA,CAEzB"}