@cryptlex/web-components 6.6.6-alpha16 → 6.6.6-alpha19

package/dist/components/date-picker.d.ts

@@ -1,6 +1,6 @@
 import { DatePickerProps as AriaDatePickerProps, DateRangePickerProps as AriaDateRangePickerProps, DateValue as AriaDateValue } from 'react-aria-components';
 import { ZonedDateTime } from '@internationalized/date';
-import { FormFieldProps } from '../components/field';
+import { FormFieldProps } from './form';
 interface DatePickerProps<T extends AriaDateValue> extends AriaDatePickerProps<T>, FormFieldProps {
 }
 /**

package/dist/components/date-picker.js

@@ -1,2 +1,2 @@
-import{jsxs as o,jsx as e}from"react/jsx-runtime";import{DatePicker as x,composeRenderProps as c,DateRangePicker as D,Popover as b,Dialog as v}from"react-aria-components";import{parseAbsolute as N,getLocalTimeZone as P}from"@internationalized/date";import{Button as u}from"./button.js";import{Calendar as k,RangeCalendar as C}from"./calendar.js";import{DateInput as m}from"./datefield.js";import{FormField as f,FieldGroup as p}from"./field.js";import{getFieldErrorMessage as d}from"../utilities/form.js";import{useFieldContext as F}from"../utilities/form-context.js";import{classNames as l}from"../utilities/theme.js";import{IcDate as g}from"./icons.js";import"class-variance-authority";import"./loader.js";import"react";import"@tanstack/react-form";import"clsx";const h=({className:a,popoverClassName:r,...i})=>e(b,{className:c(r,t=>l("w-auto p-3 bg-popover border",t)),children:e(v,{className:l("flex w-full flex-col gap-y-2 outline-none sm:flex-row sm:gap-x-icon sm:gap-y-0",a),...i})});function R({label:a,description:r,errorMessage:i,className:t,...n}){return o(x,{className:c(t,s=>l("group flex flex-col gap-2",s)),...n,children:[e(f,{label:a,description:r,errorMessage:i,children:o(p,{"aria-label":a,children:[e(m,{className:"flex-1",variant:"ghost"}),e(u,{variant:"ghost",size:"icon",className:"-me-2 ms-2",children:e(g,{"aria-hidden":!0})})]})}),e(h,{children:e(k,{})})]})}function H({...a}){const r=F({disabled:a.isDisabled});return e(R,{hideTimeZone:!0,isDisabled:a.isDisabled||r.form.state.isSubmitting,value:r.state.value?N(r.state.value,P()):null,onChange:i=>i?r.handleChange(i.toAbsoluteString()):r.handleChange(null),onBlur:r.handleBlur,isInvalid:!!d(r),errorMessage:d(r),...a})}function J({label:a,description:r,errorMessage:i,className:t,...n}){return o(D,{className:c(t,s=>l("group flex flex-col gap-2",s)),...n,children:[e(f,{label:a,errorMessage:i,description:r,children:o(p,{children:[e(m,{variant:"ghost",slot:"start"}),e("span",{"aria-hidden":!0,className:"px-2 body-sm text-muted-foreground",children:"-"}),e(m,{className:"flex-1",variant:"ghost",slot:"end"}),e(u,{variant:"ghost",size:"icon",className:"mr-1 data-[focus-visible]:ring-offset-0",children:e(g,{"aria-hidden":!0})})]})}),e(h,{children:e(C,{})})]})}export{R as DatePicker,J as DateRangePicker,H as TfDatePicker};
+import{jsxs as o,jsx as e}from"react/jsx-runtime";import{DatePicker as x,composeRenderProps as c,DateRangePicker as D,Popover as b,Dialog as v}from"react-aria-components";import{parseAbsolute as N,getLocalTimeZone as P}from"@internationalized/date";import{Button as u}from"./button.js";import{Calendar as k,RangeCalendar as C}from"./calendar.js";import{DateInput as m}from"./datefield.js";import{getFieldErrorMessage as d}from"../utilities/form.js";import{useFieldContext as F}from"../utilities/form-context.js";import{classNames as l}from"../utilities/theme.js";import{FormField as f,FieldGroup as p}from"./form.js";import{IcDate as g}from"./icons.js";import"class-variance-authority";import"./loader.js";import"react";import"@tanstack/react-form";import"clsx";const h=({className:a,popoverClassName:r,...i})=>e(b,{className:c(r,t=>l("w-auto p-3 bg-popover border",t)),children:e(v,{className:l("flex w-full flex-col gap-y-2 outline-none sm:flex-row sm:gap-x-icon sm:gap-y-0",a),...i})});function R({label:a,description:r,errorMessage:i,className:t,...n}){return o(x,{className:c(t,s=>l("group flex flex-col gap-2",s)),...n,children:[e(f,{label:a,description:r,errorMessage:i,children:o(p,{"aria-label":a,children:[e(m,{className:"flex-1",variant:"ghost"}),e(u,{variant:"ghost",size:"icon",className:"-me-2 ms-2",children:e(g,{"aria-hidden":!0})})]})}),e(h,{children:e(k,{})})]})}function H({...a}){const r=F({disabled:a.isDisabled});return e(R,{hideTimeZone:!0,isDisabled:a.isDisabled||r.form.state.isSubmitting,value:r.state.value?N(r.state.value,P()):null,onChange:i=>i?r.handleChange(i.toAbsoluteString()):r.handleChange(null),onBlur:r.handleBlur,isInvalid:!!d(r),errorMessage:d(r),...a})}function J({label:a,description:r,errorMessage:i,className:t,...n}){return o(D,{className:c(t,s=>l("group flex flex-col gap-2",s)),...n,children:[e(f,{label:a,errorMessage:i,description:r,children:o(p,{children:[e(m,{variant:"ghost",slot:"start"}),e("span",{"aria-hidden":!0,className:"px-2 body-sm text-muted-foreground",children:"-"}),e(m,{className:"flex-1",variant:"ghost",slot:"end"}),e(u,{variant:"ghost",size:"icon",className:"mr-1 data-[focus-visible]:ring-offset-0",children:e(g,{"aria-hidden":!0})})]})}),e(h,{children:e(C,{})})]})}export{R as DatePicker,J as DateRangePicker,H as TfDatePicker};
 //# sourceMappingURL=date-picker.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"date-picker.js","sources":["../../lib/components/date-picker.tsx"],"sourcesContent":["import {\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, type ZonedDateTime } from '@internationalized/date';\nimport { Button } from '../components/button';\nimport { Calendar, RangeCalendar } from '../components/calendar';\nimport { DateInput } from '../components/datefield';\nimport { FieldGroup, FormField, type FormFieldProps } from '../components/field';\nimport { getFieldErrorMessage } from '../utilities/form';\nimport { useFieldContext } from '../utilities/form-context';\nimport { classNames } from '../utilities/theme';\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-popover 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    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={label} description={description} errorMessage={errorMessage}>\n                <FieldGroup aria-label={label}>\n                    <DateInput className=\"flex-1\" variant=\"ghost\" />\n                    <Button variant=\"ghost\" size=\"icon\" className={'-me-2 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            hideTimeZone\n            isDisabled={props.isDisabled || field.form.state.isSubmitting}\n            value={field.state.value ? parseAbsolute(field.state.value, getLocalTimeZone()) : null}\n            onChange={v => (v ? field.handleChange(v.toAbsoluteString()) : field.handleChange(null))}\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","jsxs","AriaDatePicker","FormField","FieldGroup","DateInput","Button","IcDate","Calendar","TfDatePicker","field","useFieldContext","parseAbsolute","getLocalTimeZone","v","getFieldErrorMessage","DateRangePicker","AriaDateRangePicker","RangeCalendar"],"mappings":"2vBA6BA,MAAMA,EAAoB,CAAC,CACvB,UAAAC,EACA,iBAAAC,EACA,GAAGC,CACP,IACIC,EAACC,EAAA,CACG,UAAWC,EAAmBJ,EAAkBD,GAC5CM,EAAW,+BAAgCN,CAAS,CAAA,EAGxD,SAAAG,EAACI,EAAA,CACG,UAAWD,EACP,iFACAN,CAAA,EAEH,GAAGE,CAAA,CAAA,CACR,CACJ,EAqBG,SAASM,EAAoC,CAChD,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,UAAAX,EACA,GAAGE,CACP,EAAuB,CACnB,OACIU,EAACC,EAAA,CACG,UAAWR,EAAmBL,EAAWA,GAAaM,EAAW,4BAA6BN,CAAS,CAAC,EACvG,GAAGE,EAEJ,SAAA,CAAAC,EAACW,GAAU,MAAAL,EAAc,YAAAC,EAA0B,aAAAC,EAC/C,SAAAC,EAACG,EAAA,CAAW,aAAYN,EACpB,SAAA,CAAAN,EAACa,EAAA,CAAU,UAAU,SAAS,QAAQ,QAAQ,EAC9Cb,EAACc,EAAA,CAAO,QAAQ,QAAQ,KAAK,OAAO,UAAW,aAC3C,SAAAd,EAACe,EAAA,CAAO,cAAW,EAAA,CAAC,CAAA,CACxB,CAAA,CAAA,CACJ,CAAA,CACJ,EACAf,EAACJ,EAAA,CACG,SAAAI,EAACgB,EAAA,CAAA,CAAS,CAAA,CACd,CAAA,CAAA,CAAA,CAGZ,CASO,SAASC,EAAa,CACzB,GAAGlB,CACP,EAAyG,CACrG,MAAMmB,EAAQC,EAA+B,CAAE,SAAUpB,EAAM,WAAY,EAC3E,OACIC,EAACK,EAAA,CACG,aAAY,GACZ,WAAYN,EAAM,YAAcmB,EAAM,KAAK,MAAM,aACjD,MAAOA,EAAM,MAAM,MAAQE,EAAcF,EAAM,MAAM,MAAOG,EAAA,CAAkB,EAAI,KAClF,SAAUC,GAAMA,EAAIJ,EAAM,aAAaI,EAAE,kBAAkB,EAAIJ,EAAM,aAAa,IAAI,EACtF,OAAQA,EAAM,WACd,UAAW,CAAC,CAACK,EAAqBL,CAAK,EACvC,aAAcK,EAAqBL,CAAK,EACvC,GAAGnB,CAAA,CAAA,CAGhB,CAqBO,SAASyB,EAAyC,CACrD,MAAAlB,EACA,YAAAC,EACA,aAAAC,EACA,UAAAX,EACA,GAAGE,CACP,EAA4B,CACxB,OACIU,EAACgB,EAAA,CACG,UAAWvB,EAAmBL,EAAWA,GAAaM,EAAW,4BAA6BN,CAAS,CAAC,EACvG,GAAGE,EAEJ,SAAA,CAAAC,EAACW,EAAA,CAAU,MAAAL,EAAc,aAAAE,EAA4B,YAAAD,EACjD,WAACK,EAAA,CACG,SAAA,CAAAZ,EAACa,EAAA,CAAU,QAAQ,QAAQ,KAAM,QAAS,IACzC,OAAA,CAAK,cAAW,GAAC,UAAU,qCAAqC,SAAA,IAEjE,IACCA,EAAA,CAAU,UAAU,SAAS,QAAQ,QAAQ,KAAM,MAAO,EAC3Db,EAACc,EAAA,CAAO,QAAQ,QAAQ,KAAK,OAAO,UAAU,0CAC1C,SAAAd,EAACe,EAAA,CAAO,cAAW,EAAA,CAAC,CAAA,CACxB,CAAA,CAAA,CACJ,CAAA,CACJ,EACAf,EAACJ,EAAA,CACG,SAAAI,EAAC0B,EAAA,CAAA,CAAc,CAAA,CACnB,CAAA,CAAA,CAAA,CAGZ"}
+{"version":3,"file":"date-picker.js","sources":["../../lib/components/date-picker.tsx"],"sourcesContent":["import {\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, 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-popover 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    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={label} description={description} errorMessage={errorMessage}>\n                <FieldGroup aria-label={label}>\n                    <DateInput className=\"flex-1\" variant=\"ghost\" />\n                    <Button variant=\"ghost\" size=\"icon\" className={'-me-2 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            hideTimeZone\n            isDisabled={props.isDisabled || field.form.state.isSubmitting}\n            value={field.state.value ? parseAbsolute(field.state.value, getLocalTimeZone()) : null}\n            onChange={v => (v ? field.handleChange(v.toAbsoluteString()) : field.handleChange(null))}\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","jsxs","AriaDatePicker","FormField","FieldGroup","DateInput","Button","IcDate","Calendar","TfDatePicker","field","useFieldContext","parseAbsolute","getLocalTimeZone","v","getFieldErrorMessage","DateRangePicker","AriaDateRangePicker","RangeCalendar"],"mappings":"0vBA6BA,MAAMA,EAAoB,CAAC,CACvB,UAAAC,EACA,iBAAAC,EACA,GAAGC,CACP,IACIC,EAACC,EAAA,CACG,UAAWC,EAAmBJ,EAAkBD,GAC5CM,EAAW,+BAAgCN,CAAS,CAAA,EAGxD,SAAAG,EAACI,EAAA,CACG,UAAWD,EACP,iFACAN,CAAA,EAEH,GAAGE,CAAA,CAAA,CACR,CACJ,EAqBG,SAASM,EAAoC,CAChD,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,UAAAX,EACA,GAAGE,CACP,EAAuB,CACnB,OACIU,EAACC,EAAA,CACG,UAAWR,EAAmBL,EAAWA,GAAaM,EAAW,4BAA6BN,CAAS,CAAC,EACvG,GAAGE,EAEJ,SAAA,CAAAC,EAACW,GAAU,MAAAL,EAAc,YAAAC,EAA0B,aAAAC,EAC/C,SAAAC,EAACG,EAAA,CAAW,aAAYN,EACpB,SAAA,CAAAN,EAACa,EAAA,CAAU,UAAU,SAAS,QAAQ,QAAQ,EAC9Cb,EAACc,EAAA,CAAO,QAAQ,QAAQ,KAAK,OAAO,UAAW,aAC3C,SAAAd,EAACe,EAAA,CAAO,cAAW,EAAA,CAAC,CAAA,CACxB,CAAA,CAAA,CACJ,CAAA,CACJ,EACAf,EAACJ,EAAA,CACG,SAAAI,EAACgB,EAAA,CAAA,CAAS,CAAA,CACd,CAAA,CAAA,CAAA,CAGZ,CASO,SAASC,EAAa,CACzB,GAAGlB,CACP,EAAyG,CACrG,MAAMmB,EAAQC,EAA+B,CAAE,SAAUpB,EAAM,WAAY,EAC3E,OACIC,EAACK,EAAA,CACG,aAAY,GACZ,WAAYN,EAAM,YAAcmB,EAAM,KAAK,MAAM,aACjD,MAAOA,EAAM,MAAM,MAAQE,EAAcF,EAAM,MAAM,MAAOG,EAAA,CAAkB,EAAI,KAClF,SAAUC,GAAMA,EAAIJ,EAAM,aAAaI,EAAE,kBAAkB,EAAIJ,EAAM,aAAa,IAAI,EACtF,OAAQA,EAAM,WACd,UAAW,CAAC,CAACK,EAAqBL,CAAK,EACvC,aAAcK,EAAqBL,CAAK,EACvC,GAAGnB,CAAA,CAAA,CAGhB,CAqBO,SAASyB,EAAyC,CACrD,MAAAlB,EACA,YAAAC,EACA,aAAAC,EACA,UAAAX,EACA,GAAGE,CACP,EAA4B,CACxB,OACIU,EAACgB,EAAA,CACG,UAAWvB,EAAmBL,EAAWA,GAAaM,EAAW,4BAA6BN,CAAS,CAAC,EACvG,GAAGE,EAEJ,SAAA,CAAAC,EAACW,EAAA,CAAU,MAAAL,EAAc,aAAAE,EAA4B,YAAAD,EACjD,WAACK,EAAA,CACG,SAAA,CAAAZ,EAACa,EAAA,CAAU,QAAQ,QAAQ,KAAM,QAAS,IACzC,OAAA,CAAK,cAAW,GAAC,UAAU,qCAAqC,SAAA,IAEjE,IACCA,EAAA,CAAU,UAAU,SAAS,QAAQ,QAAQ,KAAM,MAAO,EAC3Db,EAACc,EAAA,CAAO,QAAQ,QAAQ,KAAK,OAAO,UAAU,0CAC1C,SAAAd,EAACe,EAAA,CAAO,cAAW,EAAA,CAAC,CAAA,CACxB,CAAA,CAAA,CACJ,CAAA,CACJ,EACAf,EAACJ,EAAA,CACG,SAAAI,EAAC0B,EAAA,CAAA,CAAc,CAAA,CACnB,CAAA,CAAA,CAAA,CAGZ"}

package/dist/components/datefield.d.ts

@@ -1,6 +1,6 @@
 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 './field';
+import { fieldGroupVariants, FormFieldProps } from './form';
 export declare function DateSegment({ className, ...props }: AriaDateSegmentProps): import("react/jsx-runtime").JSX.Element;
 interface DateInputProps extends AriaDateInputProps, VariantProps<typeof fieldGroupVariants> {
 }

package/dist/components/datefield.js

@@ -1,2 +1,2 @@
-"use client";import{jsx as e}from"react/jsx-runtime";import{DateSegment as u,composeRenderProps as i,DateInput as m,DateField as f,TimeField as p}from"react-aria-components";import{classNames as o}from"../utilities/theme.js";import{fieldGroupVariants as g,FormField as c}from"./field.js";import"clsx";import"class-variance-authority";import"./icons.js";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 S({label:t,description:a,className:d,errorMessage:r,...n}){return e(f,{className:i(d,l=>o("group form-field",l)),...n,children:e(c,{label:t,description:a,errorMessage:r,children:e(s,{})})})}function T({label:t,description:a,errorMessage:d,className:r,...n}){return e(p,{className:i(r,l=>o("group form-field",l)),...n,children:e(c,{label:t,description:a,errorMessage:d,children:e(s,{})})})}export{S as DateField,s as DateInput,v as DateSegment,T as TimeField};
+"use client";import{jsx as e}from"react/jsx-runtime";import{DateSegment as u,composeRenderProps as i,DateInput as m,DateField as f,TimeField as p}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"./icons.js";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 S({label:t,description:a,className:d,errorMessage:r,...n}){return e(f,{className:i(d,l=>o("group form-field",l)),...n,children:e(c,{label:t,description:a,errorMessage:r,children:e(s,{})})})}function T({label:t,description:a,errorMessage:d,className:r,...n}){return e(p,{className:i(r,l=>o("group form-field",l)),...n,children:e(c,{label:t,description:a,errorMessage:d,children:e(s,{})})})}export{S as DateField,s as DateInput,v as DateSegment,T 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';\n\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 './field';\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":"+WAoBO,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","sources":["../../lib/components/datefield.tsx"],"sourcesContent":["'use client';\n\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":"8WAoBO,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"}

package/dist/components/dialog.js

@@ -1,2 +1,2 @@
-import{jsx as a,jsxs as s,Fragment as c}from"react/jsx-runtime";import{cva as f}from"class-variance-authority";import{DialogTrigger as u,ModalOverlay as x,composeRenderProps as l,Modal as p,Dialog as h,Heading as b}from"react-aria-components";import{Button as v}from"./button.js";import{classNames as i}from"../utilities/theme.js";import{IcClose as y}from"./icons.js";import"./loader.js";import"clsx";import"react";const N=f(["fixed z-50 gap-icon bg-popover 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 border-b data-[entering]:slide-in-from-top data-[exiting]:slide-out-to-top max-h-table",bottom:"inset-x-0 bottom-0 border-t data-[entering]:slide-in-from-bottom data-[exiting]:slide-out-to-bottom max-h-table",left:"inset-y-0 left-0 h-full w-3/4 border-r 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  border-l data-[entering]:slide-in-from-right data-[exiting]:slide-out-to-right sm:max-w-sm"}}}),O=u,P=({className:t,isDismissable:e=!0,...o})=>a(x,{isDismissable:e,className:l(t,n=>i("fixed inset-0 z-50 bg-popover/20","data-[exiting]:duration-100 data-[exiting]:animate-out","data-[entering]:animate-in",n)),...o});function k({className:t,children:e,side:o,role:n,closeButton:d=!0,...g}){return a(p,{className:l(t,r=>i(o?N({side:o,className:"h-full p-6"}):["fixed left-[50vw] top-1/2 z-50 w-full max-w-lg -translate-x-1/2 -translate-y-1/2 border bg-popover p-icon 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)),...g,children:a(h,{role:n,className:i(!o&&"grid h-full gap-icon relative","h-full outline-none"),children:l(e,(r,m)=>s(c,{children:[r,d&&a("div",{className:"absolute right-1 top-1",children:s(v,{size:"icon",variant:"destructive",onPress:m.close,className:"opacity-70 transition-opacity data-[hovered]:opacity-100",children:[a(y,{}),a("span",{className:"sr-only",children:"Close"})]})})]}))})})}function B({className:t,...e}){return a("div",{className:i("flex flex-col gap-y-2 text-center sm:text-left",t),...e})}function I({className:t,...e}){return a("div",{className:i("flex flex-col-reverse sm:flex-row sm:justify-end sm:gap-x-2",t),...e})}function R({className:t,...e}){return a(b,{slot:"title",className:i("heading-3 font-semibold leading-none tracking-tight",t),...e})}function V({className:t,...e}){return a("p",{className:i("flex flex-col gap-y-1 text-center sm:text-left",t),...e})}export{k as DialogContent,V as DialogDescription,I as DialogFooter,B as DialogHeader,P as DialogOverlay,R as DialogTitle,O as DialogTrigger};
+import{jsx as a,jsxs as s,Fragment as f}from"react/jsx-runtime";import{cva as u}from"class-variance-authority";import{DialogTrigger as c,ModalOverlay as x,composeRenderProps as l,Modal as p,Dialog as h,Heading as b}from"react-aria-components";import{Button as v}from"./button.js";import{classNames as i}from"../utilities/theme.js";import{IcClose as N}from"./icons.js";import"./loader.js";import"clsx";import"react";const D=u(["fixed z-50 gap-icon bg-popover 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 border-b data-[entering]:slide-in-from-top data-[exiting]:slide-out-to-top max-h-table",bottom:"inset-x-0 bottom-0 border-t data-[entering]:slide-in-from-bottom data-[exiting]:slide-out-to-bottom max-h-table",left:"inset-y-0 left-0 h-full w-3/4 border-r 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  border-l data-[entering]:slide-in-from-right data-[exiting]:slide-out-to-right sm:max-w-sm"}}}),O=c,P=({className:t,isDismissable:e=!0,...n})=>a(x,{isDismissable:e,className:l(t,o=>i("fixed inset-0 z-50 bg-popover/20","data-[exiting]:duration-100 data-[exiting]:animate-out","data-[entering]:animate-in",o)),...n});function k({className:t,children:e,side:n,role:o,closeButton:d=!0,...g}){return a(p,{className:l(t,r=>i(n?D({side:n,className:"h-full p-6"}):["fixed left-[50vw] top-1/2 z-50 w-full max-w-lg -translate-x-1/2 -translate-y-1/2 border bg-popover p-icon 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)),...g,children:a(h,{role:o,className:i(!n&&"grid h-full gap-icon relative","h-full outline-none"),children:l(e,(r,m)=>s(f,{children:[r,d&&a("div",{className:"absolute right-2 top-1",children:s(v,{size:"icon",variant:"neutral",onPress:m.close,className:"rounded-full",children:[a(N,{}),a("span",{className:"sr-only",children:"Close"})]})})]}))})})}function B({className:t,...e}){return a("div",{className:i("flex flex-col gap-y-2 text-center sm:text-left",t),...e})}function I({className:t,...e}){return a("div",{className:i("flex flex-col-reverse sm:flex-row sm:justify-end sm:gap-x-2",t),...e})}function R({className:t,...e}){return a(b,{slot:"title",className:i("heading-3 font-semibold leading-none tracking-tight",t),...e})}function V({className:t,...e}){return a("p",{className:i("flex flex-col gap-y-1 text-center sm:text-left",t),...e})}export{k as DialogContent,V as DialogDescription,I as DialogFooter,B as DialogHeader,P as DialogOverlay,R as DialogTitle,O as DialogTrigger};
 //# sourceMappingURL=dialog.js.map

package/dist/components/dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog.js","sources":["../../lib/components/dialog.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\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 { 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-popover 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 border-b data-[entering]:slide-in-from-top data-[exiting]:slide-out-to-top max-h-table',\n                bottom: 'inset-x-0 bottom-0 border-t data-[entering]:slide-in-from-bottom data-[exiting]:slide-out-to-bottom max-h-table',\n                left: 'inset-y-0 left-0 h-full w-3/4 border-r 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  border-l 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    <AriaModalOverlay\n        isDismissable={isDismissable}\n        className={composeRenderProps(className, className =>\n            classNames(\n                'fixed inset-0 z-50 bg-popover/20',\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/** 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 */\nexport function DialogContent({ className, children, side, role, closeButton = true, ...props }: DialogContentProps) {\n    return (\n        <AriaModal\n            className={composeRenderProps(className, className =>\n                classNames(\n                    side\n                        ? sheetVariants({ side, className: 'h-full p-6' })\n                        : [\n                              'fixed left-[50vw] top-1/2 z-50 w-full max-w-lg -translate-x-1/2 -translate-y-1/2 border bg-popover p-icon 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-1 top-1\">\n                                <Button\n                                    size={'icon'}\n                                    variant={'destructive'}\n                                    onPress={renderProps.close}\n                                    className=\"opacity-70 transition-opacity data-[hovered]:opacity-100\"\n                                >\n                                    <IcClose />\n                                    <span className=\"sr-only\">Close</span>\n                                </Button>\n                            </div>\n                        )}\n                    </>\n                ))}\n            </AriaDialog>\n        </AriaModal>\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    return <div className={classNames('flex flex-col gap-y-2 text-center sm:text-left', className)} {...props} />;\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    return (\n        <div\n            className={classNames('flex flex-col-reverse sm:flex-row sm:justify-end sm:gap-x-2', className)}\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-3 font-semibold leading-none tracking-tight', 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"],"names":["sheetVariants","cva","DialogTrigger","AriaDialogTrigger","DialogOverlay","className","isDismissable","props","jsx","AriaModalOverlay","composeRenderProps","classNames","DialogContent","children","side","role","closeButton","AriaModal","AriaDialog","renderProps","jsxs","Fragment","Button","IcClose","DialogHeader","DialogFooter","DialogTitle","AriaHeading","DialogDescription"],"mappings":"+ZAuBA,MAAMA,EAAgBC,EAClB,CACI,wDACA,qKAAA,EAEJ,CACI,SAAU,CACN,KAAM,CACF,IAAK,yGACL,OAAQ,kHACR,KAAM,yHACN,MAAO,4HAAA,CACX,CACJ,CAER,EAkBaC,EAAgBC,EAEhBC,EAAgB,CAAC,CAAE,UAAAC,EAAW,cAAAC,EAAgB,GAAM,GAAGC,KAChEC,EAACC,EAAA,CACG,cAAAH,EACA,UAAWI,EAAmBL,EAAWA,GACrCM,EACI,mCAEA,yDAEA,6BACAN,CAAA,CACJ,EAEH,GAAGE,CAAA,CACR,EA+CG,SAASK,EAAc,CAAE,UAAAP,EAAW,SAAAQ,EAAU,KAAAC,EAAM,KAAAC,EAAM,YAAAC,EAAc,GAAM,GAAGT,GAA6B,CACjH,OACIC,EAACS,EAAA,CACG,UAAWP,EAAmBL,EAAWA,GACrCM,EACIG,EACMd,EAAc,CAAE,KAAAc,EAAM,UAAW,YAAA,CAAc,EAC/C,CACI,8TAAA,EAEVT,CAAA,CACJ,EAEH,GAAGE,EAEJ,SAAAC,EAACU,EAAA,CACG,KAAAH,EACA,UAAWJ,EAAW,CAACG,GAAQ,gCAAiC,qBAAqB,EAEpF,SAAAJ,EAAmBG,EAAU,CAACA,EAAUM,IACrCC,EAAAC,EAAA,CACK,SAAA,CAAAR,EACAG,GACGR,EAAC,MAAA,CAAI,UAAU,yBACX,SAAAY,EAACE,EAAA,CACG,KAAM,OACN,QAAS,cACT,QAASH,EAAY,MACrB,UAAU,2DAEV,SAAA,CAAAX,EAACe,EAAA,EAAQ,EACTf,EAAC,OAAA,CAAK,UAAU,UAAU,SAAA,OAAA,CAAK,CAAA,CAAA,CAAA,CACnC,CACJ,CAAA,EAER,CACH,CAAA,CAAA,CACL,CAAA,CAGZ,CAYO,SAASgB,EAAa,CAAE,UAAAnB,EAAW,GAAGE,GAA+C,CACxF,OAAOC,EAAC,OAAI,UAAWG,EAAW,iDAAkDN,CAAS,EAAI,GAAGE,EAAO,CAC/G,CAaO,SAASkB,EAAa,CAAE,UAAApB,EAAW,GAAGE,GAA+C,CACxF,OACIC,EAAC,MAAA,CACG,UAAWG,EAAW,8DAA+DN,CAAS,EAC7F,GAAGE,CAAA,CAAA,CAGhB,CAQO,SAASmB,EAAY,CAAE,UAAArB,EAAW,GAAGE,GAA2B,CACnE,OACIC,EAACmB,EAAA,CACG,KAAK,QACL,UAAWhB,EAAW,sDAAuDN,CAAS,EACrF,GAAGE,CAAA,CAAA,CAGhB,CAYO,SAASqB,EAAkB,CAAE,UAAAvB,EAAW,GAAGE,GAAqD,CACnG,OAAOC,EAAC,KAAE,UAAWG,EAAW,iDAAkDN,CAAS,EAAI,GAAGE,EAAO,CAC7G"}
+{"version":3,"file":"dialog.js","sources":["../../lib/components/dialog.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\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 { 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-popover 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 border-b data-[entering]:slide-in-from-top data-[exiting]:slide-out-to-top max-h-table',\n                bottom: 'inset-x-0 bottom-0 border-t data-[entering]:slide-in-from-bottom data-[exiting]:slide-out-to-bottom max-h-table',\n                left: 'inset-y-0 left-0 h-full w-3/4 border-r 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  border-l 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    <AriaModalOverlay\n        isDismissable={isDismissable}\n        className={composeRenderProps(className, className =>\n            classNames(\n                'fixed inset-0 z-50 bg-popover/20',\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/** 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 */\nexport function DialogContent({ className, children, side, role, closeButton = true, ...props }: DialogContentProps) {\n    return (\n        <AriaModal\n            className={composeRenderProps(className, className =>\n                classNames(\n                    side\n                        ? sheetVariants({ side, className: 'h-full p-6' })\n                        : [\n                              'fixed left-[50vw] top-1/2 z-50 w-full max-w-lg -translate-x-1/2 -translate-y-1/2 border bg-popover p-icon 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-1\">\n                                <Button\n                                    size={'icon'}\n                                    variant={'neutral'}\n                                    onPress={renderProps.close}\n                                    className=\"rounded-full\"\n                                >\n                                    <IcClose />\n                                    <span className=\"sr-only\">Close</span>\n                                </Button>\n                            </div>\n                        )}\n                    </>\n                ))}\n            </AriaDialog>\n        </AriaModal>\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    return <div className={classNames('flex flex-col gap-y-2 text-center sm:text-left', className)} {...props} />;\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    return (\n        <div\n            className={classNames('flex flex-col-reverse sm:flex-row sm:justify-end sm:gap-x-2', className)}\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-3 font-semibold leading-none tracking-tight', 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"],"names":["sheetVariants","cva","DialogTrigger","AriaDialogTrigger","DialogOverlay","className","isDismissable","props","jsx","AriaModalOverlay","composeRenderProps","classNames","DialogContent","children","side","role","closeButton","AriaModal","AriaDialog","renderProps","jsxs","Fragment","Button","IcClose","DialogHeader","DialogFooter","DialogTitle","AriaHeading","DialogDescription"],"mappings":"+ZAuBA,MAAMA,EAAgBC,EAClB,CACI,wDACA,qKAAA,EAEJ,CACI,SAAU,CACN,KAAM,CACF,IAAK,yGACL,OAAQ,kHACR,KAAM,yHACN,MAAO,4HAAA,CACX,CACJ,CAER,EAkBaC,EAAgBC,EAEhBC,EAAgB,CAAC,CAAE,UAAAC,EAAW,cAAAC,EAAgB,GAAM,GAAGC,KAChEC,EAACC,EAAA,CACG,cAAAH,EACA,UAAWI,EAAmBL,EAAWA,GACrCM,EACI,mCAEA,yDAEA,6BACAN,CAAA,CACJ,EAEH,GAAGE,CAAA,CACR,EA+CG,SAASK,EAAc,CAAE,UAAAP,EAAW,SAAAQ,EAAU,KAAAC,EAAM,KAAAC,EAAM,YAAAC,EAAc,GAAM,GAAGT,GAA6B,CACjH,OACIC,EAACS,EAAA,CACG,UAAWP,EAAmBL,EAAWA,GACrCM,EACIG,EACMd,EAAc,CAAE,KAAAc,EAAM,UAAW,YAAA,CAAc,EAC/C,CACI,8TAAA,EAEVT,CAAA,CACJ,EAEH,GAAGE,EAEJ,SAAAC,EAACU,EAAA,CACG,KAAAH,EACA,UAAWJ,EAAW,CAACG,GAAQ,gCAAiC,qBAAqB,EAEpF,SAAAJ,EAAmBG,EAAU,CAACA,EAAUM,IACrCC,EAAAC,EAAA,CACK,SAAA,CAAAR,EACAG,GACGR,EAAC,MAAA,CAAI,UAAU,yBACX,SAAAY,EAACE,EAAA,CACG,KAAM,OACN,QAAS,UACT,QAASH,EAAY,MACrB,UAAU,eAEV,SAAA,CAAAX,EAACe,EAAA,EAAQ,EACTf,EAAC,OAAA,CAAK,UAAU,UAAU,SAAA,OAAA,CAAK,CAAA,CAAA,CAAA,CACnC,CACJ,CAAA,EAER,CACH,CAAA,CAAA,CACL,CAAA,CAGZ,CAYO,SAASgB,EAAa,CAAE,UAAAnB,EAAW,GAAGE,GAA+C,CACxF,OAAOC,EAAC,OAAI,UAAWG,EAAW,iDAAkDN,CAAS,EAAI,GAAGE,EAAO,CAC/G,CAaO,SAASkB,EAAa,CAAE,UAAApB,EAAW,GAAGE,GAA+C,CACxF,OACIC,EAAC,MAAA,CACG,UAAWG,EAAW,8DAA+DN,CAAS,EAC7F,GAAGE,CAAA,CAAA,CAGhB,CAQO,SAASmB,EAAY,CAAE,UAAArB,EAAW,GAAGE,GAA2B,CACnE,OACIC,EAACmB,EAAA,CACG,KAAK,QACL,UAAWhB,EAAW,sDAAuDN,CAAS,EACrF,GAAGE,CAAA,CAAA,CAGhB,CAYO,SAASqB,EAAkB,CAAE,UAAAvB,EAAW,GAAGE,GAAqD,CACnG,OAAOC,EAAC,KAAE,UAAWG,EAAW,iDAAkDN,CAAS,EAAI,GAAGE,EAAO,CAC7G"}

package/dist/components/disclosure.js

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as l,Fragment as u}from"react/jsx-runtime";import{useContext as c}from"react";import{DisclosureGroupStateContext as m,Disclosure as p,composeRenderProps as n,DisclosurePanel as d,DisclosureGroup as f}from"react-aria-components";import{Button as D}from"./button.js";import{classNames as i}from"../utilities/theme.js";import{IcDown as b}from"./icons.js";import"class-variance-authority";import"./loader.js";import"clsx";function y({children:r,className:o,...s}){let t=c(m)!==null;return e(p,{...s,className:n(o,(a,h)=>i("group",t&&"border-0 border-b last:border-b-0",a)),children:r})}function C({children:r,className:o,...s}){return e(D,{slot:"trigger",type:"button",variant:"ghost",className:i(o),...s,children:n(r,t=>l(u,{children:[e("span",{children:t}),e(b,{"aria-hidden":!0,className:i("transition-transform duration-200","group-data-[expanded]:rotate-180")})]}))})}function I({children:r,className:o,...s}){return e(d,{...s,className:"overflow-hidden body-sm transition-all",children:e("div",{className:i("pb-icon pt-2",o),children:r})})}function _({children:r,className:o,...s}){return e(f,{...s,className:n(o,(t,a)=>i("",t)),children:r})}export{y as Disclosure,_ as DisclosureGroup,C as DisclosureHeader,I as DisclosurePanel};
+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 i,DisclosurePanel as d,DisclosureGroup as D}from"react-aria-components";import{Button as f}from"./button.js";import{classNames as a}from"../utilities/theme.js";import{IcDown as N}from"./icons.js";import"class-variance-authority";import"./loader.js";import"clsx";function _({children:r,className:s,...o}){let t=c(m)!==null;return e(p,{...o,className:i(s,(n,b)=>a("group",t&&"border-0 border-b last:border-b-0",n)),children:r})}function v({children:r,className:s,...o}){return e(f,{slot:"trigger",type:"button",variant:"ghost",className:a(s),...o,children:i(r,t=>u(l,{children:[e("span",{children:t}),e(N,{"aria-hidden":!0,className:a("transition-transform duration-200","group-data-[expanded]:rotate-180")})]}))})}function w({children:r,className:s,...o}){return e(d,{...o,className:"transition-all",children:r})}function y({children:r,className:s,...o}){return e(D,{...o,className:i(s,(t,n)=>a("",t)),children:r})}export{_ as Disclosure,y as DisclosureGroup,v as DisclosureHeader,w 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":["import { 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 border-b 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={'overflow-hidden body-sm transition-all'}>\n            <div className={classNames('pb-icon pt-2', className)}>{children}</div>\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":"ubAoBO,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,oCAAqCF,CAAS,CAAA,EAGlF,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,OACII,EAACW,EAAA,CAAqB,GAAGf,EAAO,UAAW,yCACvC,SAAAI,EAAC,MAAA,CAAI,UAAWI,EAAW,eAAgBT,CAAS,EAAI,SAAAD,EAAS,EACrE,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","sources":["../../lib/components/disclosure.tsx"],"sourcesContent":["import { 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 border-b 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":"ubAoBO,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,oCAAqCF,CAAS,CAAA,EAGlF,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"}

package/dist/components/form.d.ts

@@ -0,0 +1,87 @@
+import { VariantProps } from 'class-variance-authority';
+import { ButtonProps as AriaButtonProps, GroupProps as AriaGroupProps, LabelProps as AriaLabelProps, TextProps as AriaTextProps } from 'react-aria-components';
+/**
+ * Class variance authority variants for form field labels.
+ * Provides styling for different states including disabled and invalid.
+ */
+export declare const labelVariants: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
+/**
+ * A form field label component that extends React Aria's Label component.
+ * Applies consistent styling for form labels including disabled and invalid states.
+ *
+ * @param className - Optional additional CSS classes to apply
+ * @param props - All other props from AriaLabelProps
+ * @returns A styled label element
+ */
+export declare function FormFieldLabel({ className, ...props }: AriaLabelProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * A form field description component that provides additional context or help text.
+ * Automatically includes an info icon and uses the "description" slot for accessibility.
+ */
+export declare function FormFieldDescription({ className, children, ...props }: AriaTextProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * A form field error component that displays validation error messages.
+ *
+ * @remarks
+ * Currently uses a div instead of AriaFieldError to avoid overlap with Tanstack Form.
+ * This approach needs further discussion and exploration.
+ *
+ */
+export declare function FormFieldError({ className, children, ...props }: React.ComponentPropsWithRef<'div'>): import("react/jsx-runtime").JSX.Element;
+/**
+ * Class variance authority variants for field groups.
+ * Provides styling variants for different types of form field containers.
+ */
+export declare const fieldGroupVariants: (props?: ({
+    variant?: "ghost" | "default" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+/**
+ * Props interface for FieldGroup component.
+ * Extends AriaGroupProps with variant styling options.
+ */
+export interface GroupProps extends AriaGroupProps, VariantProps<typeof fieldGroupVariants> {
+}
+/**
+ * A field group component that wraps form inputs with consistent styling.
+ * Supports different variants for various use cases.
+ */
+export declare function FieldGroup({ className, variant, ...props }: GroupProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Props for the FormField component.
+ * Defines the structure for form field configuration.
+ */
+export type FormFieldProps = {
+    /** Optional label text for the form field */
+    label?: string;
+    /** Optional description or help text */
+    description?: React.ReactNode;
+    /** Optional error message to display */
+    errorMessage?: string;
+};
+/**
+ * A wrapper component for form fields that provides consistent layout and styling.
+ * Automatically renders label, children, description, and error message in the correct order.
+ * @returns A complete form field with all associated elements
+ */
+export declare function FormField({ label, description, errorMessage, children, }: FormFieldProps & {
+    children: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+/**
+ * A button component designed to be used within form fields.
+ * Styled to fit nicely alongside form inputs with ghost styling.
+ */
+export declare function FormFieldButton({ className, ...props }: AriaButtonProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * A form component that prevents default form submission and handles submit events.
+ * All forms in this application are controlled components, not pure HTML forms.
+ */
+export declare function Form({ className, onSubmit, ...props }: React.ComponentProps<'form'>): import("react/jsx-runtime").JSX.Element;
+/**
+ * A section component for organizing form content into logical groups.
+ * Provides consistent spacing and visual separation between form sections.
+ */
+export declare function FormSection({ className, ...props }: React.ComponentProps<'section'>): import("react/jsx-runtime").JSX.Element;
+/**
+ * A title component for form sections.
+ */
+export declare function FormSectionTitle({ className, ...props }: React.ComponentProps<'h2'>): import("react/jsx-runtime").JSX.Element;

package/dist/components/form.js

@@ -0,0 +1,2 @@
+"use client";import{jsxs as a,Fragment as m,jsx as r}from"react/jsx-runtime";import{cva as s}from"class-variance-authority";import{Group as d,composeRenderProps as l,Label as c,Text as u,Button as f}from"react-aria-components";import{classNames as i}from"../utilities/theme.js";import{IcInfo as p,IcError as g}from"./icons.js";import"clsx";import"react";const b=s(["select-none body-sm font-medium leading-none","disabled-muted","group-data-[invalid]:text-destructive"]);function h({className:e,...t}){return r(c,{className:i(b(),e),...t})}function x({className:e,children:t,...n}){return a(u,{className:i("body-sm text-muted leading-tight",e),...n,slot:"description",children:[t,r(p,{className:"inline size-2 align-text-top ms-0.5"})]})}function F({className:e,children:t,...n}){return a("div",{className:i("body-sm leading-tight text-destructive duration-150 animate-in transition-transform  slide-in-from-top-5 fade-in",e),...n,children:[t,r(g,{className:"inline size-2 align-text-top ms-0.5"})]})}const v=s("",{variants:{variant:{default:["relative flex w-full items-center overflow-hidden border border-input bg-popover input-dim ring-offset-background placeholder:text-muted-foreground","focus-ring","disabled-muted"],ghost:""}},defaultVariants:{variant:"default"}});function w({className:e,variant:t,...n}){return r(d,{className:l(e,o=>i(v({variant:t}),o)),...n})}function z({label:e,description:t,errorMessage:n,children:o}){return a(m,{children:[e&&r(h,{children:e}),o,t&&r(x,{children:t}),n&&r(F,{children:n})]})}function B({className:e,...t}){return r(f,{className:l(e,n=>i("btn btn-ghost h-input px-2 -me-2",n)),...t})}function D({className:e,onSubmit:t,...n}){return r("form",{className:i(e),onSubmit:o=>{o.preventDefault(),t?.(o)},...n})}function E({className:e,...t}){return r("section",{className:i("flex flex-col gap-input border-x p-icon",e),...t})}function L({className:e,...t}){return r("h2",{className:i("heading-4",e),...t})}export{w as FieldGroup,D as Form,z as FormField,B as FormFieldButton,x as FormFieldDescription,F as FormFieldError,h as FormFieldLabel,E as FormSection,L as FormSectionTitle,v as fieldGroupVariants,b as labelVariants};
+//# sourceMappingURL=form.js.map

package/dist/components/form.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"form.js","sources":["../../lib/components/form.tsx"],"sourcesContent":["'use client';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport {\n    Button as AriaButton,\n    ButtonProps as AriaButtonProps,\n    Group as AriaGroup,\n    GroupProps as AriaGroupProps,\n    Label as AriaLabel,\n    LabelProps as AriaLabelProps,\n    Text as AriaText,\n    TextProps as AriaTextProps,\n    composeRenderProps,\n} from 'react-aria-components';\n\nimport { classNames } from '../utilities/theme';\nimport { IcError, IcInfo } from './icons';\n\n/**\n * Class variance authority variants for form field labels.\n * Provides styling for different states including disabled and invalid.\n */\nexport const labelVariants = cva([\n    'select-none body-sm font-medium leading-none',\n    /* Disabled */\n    'disabled-muted',\n    /* Invalid */\n    'group-data-[invalid]:text-destructive',\n]);\n\n/**\n * A form field label component that extends React Aria's Label component.\n * Applies consistent styling for form labels including disabled and invalid states.\n *\n * @param className - Optional additional CSS classes to apply\n * @param props - All other props from AriaLabelProps\n * @returns A styled label element\n */\nexport function FormFieldLabel({ className, ...props }: AriaLabelProps) {\n    return <AriaLabel className={classNames(labelVariants(), className)} {...props} />;\n}\n\n/**\n * A form field description component that provides additional context or help text.\n * Automatically includes an info icon and uses the \"description\" slot for accessibility.\n */\nexport function FormFieldDescription({ className, children, ...props }: AriaTextProps) {\n    return (\n        <AriaText className={classNames('body-sm text-muted leading-tight', className)} {...props} slot=\"description\">\n            {children}\n            <IcInfo className=\"inline size-2 align-text-top ms-0.5\" />\n        </AriaText>\n    );\n}\n/**\n * A form field error component that displays validation error messages.\n *\n * @remarks\n * Currently uses a div instead of AriaFieldError to avoid overlap with Tanstack Form.\n * This approach needs further discussion and exploration.\n *\n */\nexport function FormFieldError({ className, children, ...props }: React.ComponentPropsWithRef<'div'>) {\n    return (\n        <div\n            className={classNames(\n                'body-sm leading-tight text-destructive duration-150 animate-in transition-transform  slide-in-from-top-5 fade-in',\n                className\n            )}\n            {...props}\n        >\n            {children}\n            <IcError className=\"inline size-2 align-text-top ms-0.5\" />\n        </div>\n    );\n}\n\n/**\n * Class variance authority variants for field groups.\n * Provides styling variants for different types of form field containers.\n */\nexport const fieldGroupVariants = cva('', {\n    variants: {\n        variant: {\n            default: [\n                'relative flex w-full items-center overflow-hidden border border-input bg-popover input-dim ring-offset-background placeholder:text-muted-foreground',\n                /* Focus Within */\n                'focus-ring',\n                /* Disabled */\n                'disabled-muted',\n            ],\n            ghost: '',\n        },\n    },\n    defaultVariants: {\n        variant: 'default',\n    },\n});\n\n/**\n * Props interface for FieldGroup component.\n * Extends AriaGroupProps with variant styling options.\n */\nexport interface GroupProps extends AriaGroupProps, VariantProps<typeof fieldGroupVariants> {}\n\n/**\n * A field group component that wraps form inputs with consistent styling.\n * Supports different variants for various use cases.\n */\nexport function FieldGroup({ className, variant, ...props }: GroupProps) {\n    return (\n        <AriaGroup\n            className={composeRenderProps(className, className =>\n                classNames(fieldGroupVariants({ variant }), className)\n            )}\n            {...props}\n        />\n    );\n}\n\n/**\n * Props for the FormField component.\n * Defines the structure for form field configuration.\n */\nexport type FormFieldProps = {\n    /** Optional label text for the form field */\n    label?: string;\n    /** Optional description or help text */\n    description?: React.ReactNode;\n    /** Optional error message to display */\n    errorMessage?: string;\n    // | ((validation: AriaValidationResult) => string)\n};\n\n/**\n * A wrapper component for form fields that provides consistent layout and styling.\n * Automatically renders label, children, description, and error message in the correct order.\n * @returns A complete form field with all associated elements\n */\nexport function FormField({\n    label,\n    description,\n    errorMessage,\n    children,\n}: FormFieldProps & {\n    children: React.ReactNode;\n}) {\n    return (\n        <>\n            {label && <FormFieldLabel>{label}</FormFieldLabel>}\n            {children}\n            {description && <FormFieldDescription>{description}</FormFieldDescription>}\n            {errorMessage && <FormFieldError>{errorMessage}</FormFieldError>}\n        </>\n    );\n}\n\n/**\n * A button component designed to be used within form fields.\n * Styled to fit nicely alongside form inputs with ghost styling.\n */\nexport function FormFieldButton({ className, ...props }: AriaButtonProps) {\n    return (\n        <AriaButton\n            className={composeRenderProps(className, className =>\n                classNames('btn btn-ghost h-input px-2 -me-2', className)\n            )}\n            {...props}\n        />\n    );\n}\n\n/**\n * A form component that prevents default form submission and handles submit events.\n * All forms in this application are controlled components, not pure HTML forms.\n */\nexport function Form({ className, onSubmit, ...props }: React.ComponentProps<'form'>) {\n    return (\n        <form\n            className={classNames(className)}\n            onSubmit={e => {\n                // None of the forms in our applications are pure HTML forms.\n                e.preventDefault();\n                // If onSubmit is provided, call it.\n                onSubmit?.(e);\n            }}\n            {...props}\n        />\n    );\n}\n\n/**\n * A section component for organizing form content into logical groups.\n * Provides consistent spacing and visual separation between form sections.\n */\nexport function FormSection({ className, ...props }: React.ComponentProps<'section'>) {\n    return <section className={classNames('flex flex-col gap-input border-x p-icon', className)} {...props} />;\n}\n\n/**\n * A title component for form sections.\n */\nexport function FormSectionTitle({ className, ...props }: React.ComponentProps<'h2'>) {\n    return <h2 className={classNames('heading-4', className)} {...props} />;\n}\n"],"names":["labelVariants","cva","FormFieldLabel","className","props","jsx","AriaLabel","classNames","FormFieldDescription","children","jsxs","AriaText","IcInfo","FormFieldError","IcError","fieldGroupVariants","FieldGroup","variant","AriaGroup","composeRenderProps","FormField","label","description","errorMessage","Fragment","FormFieldButton","AriaButton","Form","onSubmit","e","FormSection","FormSectionTitle"],"mappings":"kWAsBO,MAAMA,EAAgBC,EAAI,CAC7B,+CAEA,iBAEA,uCACJ,CAAC,EAUM,SAASC,EAAe,CAAE,UAAAC,EAAW,GAAGC,GAAyB,CACpE,OAAOC,EAACC,GAAU,UAAWC,EAAWP,IAAiBG,CAAS,EAAI,GAAGC,EAAO,CACpF,CAMO,SAASI,EAAqB,CAAE,UAAAL,EAAW,SAAAM,EAAU,GAAGL,GAAwB,CACnF,OACIM,EAACC,EAAA,CAAS,UAAWJ,EAAW,mCAAoCJ,CAAS,EAAI,GAAGC,EAAO,KAAK,cAC3F,SAAA,CAAAK,EACDJ,EAACO,EAAA,CAAO,UAAU,qCAAA,CAAsC,CAAA,EAC5D,CAER,CASO,SAASC,EAAe,CAAE,UAAAV,EAAW,SAAAM,EAAU,GAAGL,GAA6C,CAClG,OACIM,EAAC,MAAA,CACG,UAAWH,EACP,mHACAJ,CAAA,EAEH,GAAGC,EAEH,SAAA,CAAAK,EACDJ,EAACS,EAAA,CAAQ,UAAU,qCAAA,CAAsC,CAAA,CAAA,CAAA,CAGrE,CAMO,MAAMC,EAAqBd,EAAI,GAAI,CACtC,SAAU,CACN,QAAS,CACL,QAAS,CACL,sJAEA,aAEA,gBAAA,EAEJ,MAAO,EAAA,CACX,EAEJ,gBAAiB,CACb,QAAS,SAAA,CAEjB,CAAC,EAYM,SAASe,EAAW,CAAE,UAAAb,EAAW,QAAAc,EAAS,GAAGb,GAAqB,CACrE,OACIC,EAACa,EAAA,CACG,UAAWC,EAAmBhB,EAAWA,GACrCI,EAAWQ,EAAmB,CAAE,QAAAE,CAAA,CAAS,EAAGd,CAAS,CAAA,EAExD,GAAGC,CAAA,CAAA,CAGhB,CAqBO,SAASgB,EAAU,CACtB,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAd,CACJ,EAEG,CACC,OACIC,EAAAc,EAAA,CACK,SAAA,CAAAH,GAAShB,EAACH,GAAgB,SAAAmB,CAAA,CAAM,EAChCZ,EACAa,GAAejB,EAACG,EAAA,CAAsB,SAAAc,CAAA,CAAY,EAClDC,GAAgBlB,EAACQ,EAAA,CAAgB,SAAAU,CAAA,CAAa,CAAA,EACnD,CAER,CAMO,SAASE,EAAgB,CAAE,UAAAtB,EAAW,GAAGC,GAA0B,CACtE,OACIC,EAACqB,EAAA,CACG,UAAWP,EAAmBhB,EAAWA,GACrCI,EAAW,mCAAoCJ,CAAS,CAAA,EAE3D,GAAGC,CAAA,CAAA,CAGhB,CAMO,SAASuB,EAAK,CAAE,UAAAxB,EAAW,SAAAyB,EAAU,GAAGxB,GAAuC,CAClF,OACIC,EAAC,OAAA,CACG,UAAWE,EAAWJ,CAAS,EAC/B,SAAU0B,GAAK,CAEXA,EAAE,eAAA,EAEFD,IAAWC,CAAC,CAChB,EACC,GAAGzB,CAAA,CAAA,CAGhB,CAMO,SAAS0B,EAAY,CAAE,UAAA3B,EAAW,GAAGC,GAA0C,CAClF,OAAOC,EAAC,WAAQ,UAAWE,EAAW,0CAA2CJ,CAAS,EAAI,GAAGC,EAAO,CAC5G,CAKO,SAAS2B,EAAiB,CAAE,UAAA5B,EAAW,GAAGC,GAAqC,CAClF,OAAOC,EAAC,MAAG,UAAWE,EAAW,YAAaJ,CAAS,EAAI,GAAGC,EAAO,CACzE"}

package/dist/components/id-search.d.ts

@@ -1,5 +1,6 @@
 import { Menu } from '../components/menu';
-import { FormFieldProps } from './field';
+import { CtxResourceName } from '../utilities/resources';
+import { FormFieldProps } from './form';
 /**
  * Minimal resource shape used by the ID search inputs.
  * Only `id` and `name` are required.
@@ -42,7 +43,8 @@ type BaseSearchableResource = {
  * @testing
  * - Mock `searchFn` in unit tests; assert keyboard navigation, open/close behavior, and `onBlur` call on popover close.
  */
-declare function BaseIdSearchInput<T extends BaseSearchableResource, V>({ label, description, errorMessage, searchFn, isDisabled, onBlur, onChange, value, renderLabel, ...props }: FormFieldProps & {
+declare function BaseIdSearchInput<T extends BaseSearchableResource, V>({ label, description, errorMessage, searchFn, isDisabled, onBlur, resource, onChange, value, renderLabel, ...props }: FormFieldProps & {
+    resource: CtxResourceName;
     /** Function that returns matching resources for the current query. */
     searchFn: (q: string) => Promise<T[] | undefined>;
     /** Disable interactions. */

package/dist/components/id-search.js

@@ -1,2 +1,2 @@
-import{jsx as n,jsxs as c}from"react/jsx-runtime";import{useQuery as N}from"@tanstack/react-query";import{useId as b,useState as M}from"react";import{Autocomplete as x}from"react-aria-components";import{Button as F}from"./button.js";import{Loader as B}from"./loader.js";import{Menu as w,MenuItem as j}from"./menu.js";import{PopoverTrigger as A,Popover as E}from"./popover.js";import{SearchField as K}from"./searchfield.js";import{getFieldErrorMessage as h}from"../utilities/form.js";import{useFieldContext as f}from"../utilities/form-context.js";import{FormField as L}from"./field.js";import"class-variance-authority";import"../utilities/theme.js";import"clsx";import"./icons.js";import"./list-box.js";import"./select.js";import"@tanstack/react-form";function p({label:r,description:t,errorMessage:e,searchFn:i,isDisabled:a,onBlur:g,onChange:q,value:s,renderLabel:S,...y}){const I=b(),[l,C]=M(""),{data:m,isError:d,isFetching:u,error:v}=N({queryKey:[I,l],queryFn:()=>i(l)});return n("div",{className:"group form-field",children:n(L,{label:r,description:t,errorMessage:e,children:c(A,{onOpenChange:o=>{o||g?.(s)},children:[n(F,{className:"min-w-3xs",isDisabled:a,children:S(s,m)}),n(E,{className:"w-auto min-w-[--trigger-width]",children:c(x,{inputValue:l,onInputChange:C,children:[n(K,{className:"mb-2",autoFocus:!0}),u&&n("div",{className:"p-input",children:n(B,{className:"mx-auto"})}),!u&&!d&&n(w,{...y,className:"max-h-48",items:m,renderEmptyState:()=>n("div",{className:"body-sm p-2",children:"No results found."}),children:o=>n(j,{id:o.id,children:o.name},o.id)}),d&&n("div",{className:"text-destructive p-icon body-sm",children:v.message})]})})]})})})}function T({...r}){return n(p,{selectedKeys:[r.value],onSelectionChange:t=>r.onChange(Array.from(t).filter(e=>typeof e=="string")[0]),renderLabel:(t,e)=>e?.find(i=>i.id===t)?.name??t,selectionMode:"single",...r})}function _({...r}){return n(p,{selectedKeys:r.value,onSelectionChange:t=>r.onChange(Array.from(t).filter(e=>typeof e=="string")),selectionMode:"multiple",renderLabel:(t,e)=>t.map(i=>e?.find(a=>a.id===i)?.name??i).join(","),...r})}function ne({isDisabled:r,...t}){const e=f({disabled:r});return n(T,{...t,isDisabled:r||e.form.state.isSubmitting,value:e.state.value,onBlur:i=>e.handleBlur(),onChange:i=>e.handleChange(i),errorMessage:h(e)})}function te({isDisabled:r,...t}){const e=f({disabled:r});return n(_,{...t,isDisabled:r||e.form.state.isSubmitting,value:e.state.value,onBlur:i=>e.handleBlur(),onChange:i=>e.handleChange(i),errorMessage:h(e)})}export{_ as MultipleIdSearchInput,T as SingleIdSearchInput,te as TfMultipleIdSearchInput,ne as TfSingleIdSearchInput};
+import{jsx as t,jsxs as c}from"react/jsx-runtime";import{useQuery as b}from"@tanstack/react-query";import{useState as M}from"react";import{Autocomplete as F}from"react-aria-components";import{Loader as N}from"./loader.js";import{Menu as x,MenuItem as B}from"./menu.js";import{PopoverTrigger as T}from"./popover.js";import{SearchField as j}from"./searchfield.js";import{getFieldErrorMessage as p}from"../utilities/form.js";import{useFieldContext as h}from"../utilities/form-context.js";import{FormField as A}from"./form.js";import{SelectTrigger as E,SelectPopover as K}from"./select.js";import"../utilities/theme.js";import"clsx";import"./icons.js";import"./list-box.js";import"@tanstack/react-form";import"class-variance-authority";import"./button.js";function f({label:r,description:n,errorMessage:e,searchFn:o,isDisabled:a,onBlur:g,resource:S,onChange:q,value:m,renderLabel:y,...C}){const[l,I]=M(""),{data:s,isError:d,isFetching:u,error:v}=b({queryKey:[S,"id",l],queryFn:()=>o(l)});return t("div",{className:"group form-field",children:t(A,{label:r,description:n,errorMessage:e,children:c(T,{onOpenChange:i=>{i||g?.(m)},children:[t(E,{isDisabled:a,children:y(m,s)}),t(K,{placement:"bottom start",children:c(F,{inputValue:l,onInputChange:I,children:[t(j,{className:"p-2",autoFocus:!0}),u&&t("div",{className:"p-input",children:t(N,{className:"mx-auto"})}),!u&&!d&&t(x,{...C,className:"max-h-48",items:s,renderEmptyState:()=>t("div",{className:"body-sm p-2",children:"No results found."}),children:i=>t(B,{id:i.id,children:i.name},i.id)}),d&&t("div",{className:"text-destructive p-icon body-sm",children:v.message})]})})]})})})}function L({...r}){return t(f,{selectedKeys:[r.value],onSelectionChange:n=>r.onChange(Array.from(n).filter(e=>typeof e=="string")[0]),renderLabel:(n,e)=>e?.find(o=>o.id===n)?.name??n,selectionMode:"single",...r})}function _({...r}){return t(f,{selectedKeys:r.value,onSelectionChange:n=>r.onChange(Array.from(n).filter(e=>typeof e=="string")),selectionMode:"multiple",renderLabel:(n,e)=>n.map(o=>e?.find(a=>a.id===o)?.name??o).join(","),...r})}function re({isDisabled:r,...n}){const e=h({disabled:r});return t(L,{...n,isDisabled:r||e.form.state.isSubmitting,value:e.state.value,onBlur:o=>e.handleBlur(),onChange:o=>e.handleChange(o),errorMessage:p(e)})}function te({isDisabled:r,...n}){const e=h({disabled:r});return t(_,{...n,isDisabled:r||e.form.state.isSubmitting,value:e.state.value,onBlur:o=>e.handleBlur(),onChange:o=>e.handleChange(o),errorMessage:p(e)})}export{_ as MultipleIdSearchInput,L as SingleIdSearchInput,te as TfMultipleIdSearchInput,re as TfSingleIdSearchInput};
 //# sourceMappingURL=id-search.js.map

package/dist/components/id-search.js.map

@@ -1 +1 @@
-{"version":3,"file":"id-search.js","sources":["../../lib/components/id-search.tsx"],"sourcesContent":["import { useQuery } from '@tanstack/react-query';\nimport { useId, useState } from 'react';\nimport { Autocomplete } from 'react-aria-components';\nimport { Button } from '../components/button';\nimport { Loader } from '../components/loader';\nimport { Menu, MenuItem } from '../components/menu';\nimport { Popover, PopoverTrigger } from '../components/popover';\nimport { SearchField } from '../components/searchfield';\nimport { getFieldErrorMessage } from '../utilities/form';\nimport { useFieldContext } from '../utilities/form-context';\nimport { FormField, type FormFieldProps } from './field';\n\n/**\n * Minimal resource shape used by the ID search inputs.\n * Only `id` and `name` are required.\n *\n * @example\n * const user: BaseSearchableResource = { id: 'u_123', name: 'Nabeel Farooq' };\n */\ntype BaseSearchableResource = {\n    /** Unique identifier used as the input value. */\n    id: string;\n    /** Human-readable label shown to users. */\n    name: string;\n};\n\n/**\n * - Generic, accessible ID-search building block.\n * - Search (powered by react-query)\n * - Renders an accessible Autocomplete + Menu listbox\n * - Exposes a controlled `value`/`onChange` contract so callers (and wrappers) can manage state\n * - Clear separation of concerns: this component only handles UI search/display; callers provide `searchFn`\n *\n * @template T - resource type extending `BaseSearchableResource` (must have `id` and `name`)\n * @template V - controlled value type (e.g. `string` for single-select or `string[]` for multi-select)\n *\n * @param props - props object (see inline property JSDoc for the most important fields)\n *\n * @remarks\n * - `searchFn` should return `Promise<T[] | undefined>`. Returning `undefined` indicates no results / handled error.\n * - When the popover closes, `onBlur` (if provided) is called with the current `value`.\n * - `renderLabel` must convert `value` to a readable string for the control button.\n *\n * @example\n * <BaseIdSearchInput\n *   label=\"Owner\"\n *   searchFn={q => api.searchUsers(q)}\n *   value={ownerId}\n *   onChange={setOwnerId}\n *   renderLabel={(v, data) => data?.find(d => d.id === v)?.name ?? v}\n * />\n *\n * @testing\n * - Mock `searchFn` in unit tests; assert keyboard navigation, open/close behavior, and `onBlur` call on popover close.\n */\nfunction BaseIdSearchInput<T extends BaseSearchableResource, V>({\n    label,\n    description,\n    errorMessage,\n    searchFn,\n    isDisabled,\n    onBlur,\n    onChange,\n    value,\n    renderLabel,\n    ...props\n}: FormFieldProps & {\n    /** Function that returns matching resources for the current query. */\n    searchFn: (q: string) => Promise<T[] | undefined>;\n    /** Disable interactions. */\n    isDisabled?: boolean;\n    /** Key used to access an alternate display accessor on item (kept for compatibility). */\n    accessor: keyof BaseSearchableResource;\n    /** Controlled value. */\n    value: V;\n    /** Called when popover closes or the field blurs with the current value. */\n    onBlur?: (v: V) => void;\n    /** Controlled change handler. */\n    onChange: (v: V) => void;\n    /** Render a human-readable label for the current value using the latest data. */\n    renderLabel: (v: V, data: T[] | undefined) => string;\n} & Omit<React.ComponentProps<typeof Menu>, 'items' | 'className'>) {\n    const id = useId();\n    const [search, _setSearch] = useState('');\n    const { data, isError, isFetching, error } = useQuery({\n        queryKey: [id, search],\n        queryFn: () => searchFn(search),\n    });\n\n    return (\n        <div className=\"group form-field\">\n            <FormField label={label} description={description} errorMessage={errorMessage}>\n                <PopoverTrigger\n                    onOpenChange={o => {\n                        if (!o) {\n                            // searchInputRef.current?.focus();\n                            onBlur?.(value);\n                        }\n                    }}\n                >\n                    <Button className={'min-w-3xs'} isDisabled={isDisabled}>\n                        {renderLabel(value, data)}\n                    </Button>\n                    <Popover className={'w-auto min-w-[--trigger-width]'}>\n                        <Autocomplete inputValue={search} onInputChange={_setSearch}>\n                            <SearchField className={'mb-2'} autoFocus />\n                            {isFetching && (\n                                <div className=\"p-input\">\n                                    <Loader className=\"mx-auto\" />\n                                </div>\n                            )}\n                            {!isFetching && !isError && (\n                                <Menu\n                                    {...props}\n                                    className={'max-h-48'}\n                                    items={data}\n                                    renderEmptyState={() => <div className=\"body-sm p-2\">No results found.</div>}\n                                >\n                                    {item => (\n                                        <MenuItem key={item['id']} id={item['id']}>\n                                            {item.name}\n                                        </MenuItem>\n                                    )}\n                                </Menu>\n                            )}\n                            {isError && <div className=\"text-destructive p-icon body-sm\">{error.message}</div>}\n                        </Autocomplete>\n                    </Popover>\n                </PopoverTrigger>\n            </FormField>\n        </div>\n    );\n}\n\n/**\n * Single-selection ID search input.\n *\n * Thin, typed wrapper around `BaseIdSearchInput` specialized for the very common single-ID case.\n * Adapts the internal selection events into `onChange(id?: string)` and renders the selected label.\n *\n * @template T - resource type (extends BaseSearchableResource)\n *\n * @param props - Inherits `BaseIdSearchInput` props but uses `string[]` value type.\n *\n * @example\n * <SingleIdSearchInput\n *   label=\"Reporter\"\n *   value={reporterId}\n *   onChange={setReporterId}\n *   searchFn={q => api.searchUsers(q)}\n * />\n *\n */\nexport function SingleIdSearchInput<T extends BaseSearchableResource>({\n    ...props\n}: Omit<\n    React.ComponentProps<typeof BaseIdSearchInput<T, string>>,\n    'onSelectionChange' | 'selectionMode' | 'selectedKeys' | 'renderLabel'\n>) {\n    return (\n        <BaseIdSearchInput\n            selectedKeys={[props.value]}\n            onSelectionChange={e => props.onChange(Array.from(e).filter(v => typeof v === 'string')[0])}\n            renderLabel={(v, d) => d?.find(di => di.id === v)?.name ?? v}\n            selectionMode=\"single\"\n            {...props}\n        />\n    );\n}\n\n/**\n * Multi-selection ID search input.\n *\n * Thin wrapper around `BaseIdSearchInput` for the multiple-ID (`string[]`) case.\n * Adapts internal selection events into `onChange(ids: string[])`.\n *\n * @template T - resource type (extends BaseSearchableResource)\n *\n * @param props - Inherits `BaseIdSearchInput` props but uses `string[]` value type.\n *\n * @example\n * <MultipleIdSearchInput\n *   label=\"Reviewers\"\n *   value={reviewerIds}\n *   onChange={setReviewerIds}\n *   searchFn={q => api.searchUsers(q)}\n * />\n *\n * @remarks\n * - The `renderLabel` joins selected item names with commas for compact display.\n */\nexport function MultipleIdSearchInput<T extends BaseSearchableResource>({\n    ...props\n}: Omit<\n    React.ComponentProps<typeof BaseIdSearchInput<T, string[]>>,\n    'renderLabel' | 'onSelectionChange' | 'selectionMode' | 'selectedKeys'\n>) {\n    return (\n        <BaseIdSearchInput\n            selectedKeys={props.value}\n            onSelectionChange={e => props.onChange(Array.from(e).filter(v => typeof v === 'string'))}\n            selectionMode=\"multiple\"\n            renderLabel={(v, d) => v.map(vi => d?.find(di => di.id === vi)?.name ?? vi).join(',')}\n            {...props}\n        />\n    );\n}\n\n/**\n * Form-integrated single-select ID input (field wrapper).\n *\n * Integrates `SingleIdSearchInput` into the form system using `useFieldContext`.\n * - wires `value`, `onChange`, and `onBlur`\n * - disables the control while the form is submitting\n * - surfaces field-level error messages\n *\n * @example\n * <TfSingleIdSearchInput name=\"ownerId\" label=\"Owner\" searchFn={q => api.searchUsers(q)} />\n \n */\nexport function TfSingleIdSearchInput({\n    isDisabled,\n    ...props\n}: Omit<React.ComponentProps<typeof SingleIdSearchInput>, 'value' | 'onChange'>) {\n    const field = useFieldContext<string>({ disabled: isDisabled });\n    return (\n        <SingleIdSearchInput\n            {...props}\n            isDisabled={isDisabled || field.form.state.isSubmitting}\n            value={field.state.value}\n            onBlur={_ => field.handleBlur()}\n            onChange={e => field.handleChange(e)}\n            errorMessage={getFieldErrorMessage(field)}\n        />\n    );\n}\n\n/**\n * Form-integrated multi-select ID input (field wrapper).\n *\n * Integrates `MultipleIdSearchInput` into the form system using `useFieldContext`.\n * - wires `value`, `onChange`, and `onBlur`\n * - disables the control while the form is submitting\n * - surfaces field-level error messages\n *\n * @example\n * <TfMultipleIdSearchInput name=\"reviewerIds\" label=\"Reviewers\" searchFn={q => api.searchUsers(q)} />\n *\n */\nexport function TfMultipleIdSearchInput({\n    isDisabled,\n    ...props\n}: Omit<React.ComponentProps<typeof MultipleIdSearchInput>, 'value' | 'onChange'>) {\n    const field = useFieldContext<string[]>({ disabled: isDisabled });\n    return (\n        <MultipleIdSearchInput\n            {...props}\n            isDisabled={isDisabled || field.form.state.isSubmitting}\n            value={field.state.value}\n            onBlur={_ => field.handleBlur()}\n            onChange={e => field.handleChange(e)}\n            errorMessage={getFieldErrorMessage(field)}\n        />\n    );\n}\n"],"names":["BaseIdSearchInput","label","description","errorMessage","searchFn","isDisabled","onBlur","onChange","value","renderLabel","props","id","useId","search","_setSearch","useState","data","isError","isFetching","error","useQuery","jsx","FormField","jsxs","PopoverTrigger","Button","Popover","Autocomplete","SearchField","Loader","Menu","item","MenuItem","SingleIdSearchInput","e","v","d","di","MultipleIdSearchInput","vi","TfSingleIdSearchInput","field","useFieldContext","_","getFieldErrorMessage","TfMultipleIdSearchInput"],"mappings":"+uBAuDA,SAASA,EAAuD,CAC5D,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAC,EACA,WAAAC,EACA,OAAAC,EACA,SAAAC,EACA,MAAAC,EACA,YAAAC,EACA,GAAGC,CACP,EAeoE,CAChE,MAAMC,EAAKC,EAAA,EACL,CAACC,EAAQC,CAAU,EAAIC,EAAS,EAAE,EAClC,CAAE,KAAAC,EAAM,QAAAC,EAAS,WAAAC,EAAY,MAAAC,CAAA,EAAUC,EAAS,CAClD,SAAU,CAACT,EAAIE,CAAM,EACrB,QAAS,IAAMT,EAASS,CAAM,CAAA,CACjC,EAED,OACIQ,EAAC,OAAI,UAAU,mBACX,WAACC,EAAA,CAAU,MAAArB,EAAc,YAAAC,EAA0B,aAAAC,EAC/C,SAAAoB,EAACC,EAAA,CACG,aAAc,GAAK,CACV,GAEDlB,IAASE,CAAK,CAEtB,EAEA,SAAA,CAAAa,EAACI,GAAO,UAAW,YAAa,WAAApB,EAC3B,SAAAI,EAAYD,EAAOQ,CAAI,EAC5B,EACAK,EAACK,GAAQ,UAAW,iCAChB,WAACC,EAAA,CAAa,WAAYd,EAAQ,cAAeC,EAC7C,SAAA,CAAAO,EAACO,EAAA,CAAY,UAAW,OAAQ,UAAS,GAAC,EACzCV,KACI,MAAA,CAAI,UAAU,UACX,SAAAG,EAACQ,EAAA,CAAO,UAAU,SAAA,CAAU,CAAA,CAChC,EAEH,CAACX,GAAc,CAACD,GACbI,EAACS,EAAA,CACI,GAAGpB,EACJ,UAAW,WACX,MAAOM,EACP,iBAAkB,IAAMK,EAAC,MAAA,CAAI,UAAU,cAAc,SAAA,oBAAiB,EAErE,SAAAU,GACGV,EAACW,EAAA,CAA0B,GAAID,EAAK,GAC/B,SAAAA,EAAK,IAAA,EADKA,EAAK,EAEpB,CAAA,CAAA,EAIXd,GAAWI,EAAC,MAAA,CAAI,UAAU,kCAAmC,WAAM,OAAA,CAAQ,CAAA,CAAA,CAChF,CAAA,CACJ,CAAA,CAAA,CAAA,EAER,CAAA,CACJ,CAER,CAqBO,SAASY,EAAsD,CAClE,GAAGvB,CACP,EAGG,CACC,OACIW,EAACrB,EAAA,CACG,aAAc,CAACU,EAAM,KAAK,EAC1B,kBAAmBwB,GAAKxB,EAAM,SAAS,MAAM,KAAKwB,CAAC,EAAE,UAAY,OAAOC,GAAM,QAAQ,EAAE,CAAC,CAAC,EAC1F,YAAa,CAACA,EAAGC,IAAMA,GAAG,KAAKC,GAAMA,EAAG,KAAOF,CAAC,GAAG,MAAQA,EAC3D,cAAc,SACb,GAAGzB,CAAA,CAAA,CAGhB,CAuBO,SAAS4B,EAAwD,CACpE,GAAG5B,CACP,EAGG,CACC,OACIW,EAACrB,EAAA,CACG,aAAcU,EAAM,MACpB,kBAAmBwB,GAAKxB,EAAM,SAAS,MAAM,KAAKwB,CAAC,EAAE,OAAOC,GAAK,OAAOA,GAAM,QAAQ,CAAC,EACvF,cAAc,WACd,YAAa,CAACA,EAAGC,IAAMD,EAAE,OAAUC,GAAG,KAAKC,GAAMA,EAAG,KAAOE,CAAE,GAAG,MAAQA,CAAE,EAAE,KAAK,GAAG,EACnF,GAAG7B,CAAA,CAAA,CAGhB,CAcO,SAAS8B,GAAsB,CAClC,WAAAnC,EACA,GAAGK,CACP,EAAiF,CAC7E,MAAM+B,EAAQC,EAAwB,CAAE,SAAUrC,EAAY,EAC9D,OACIgB,EAACY,EAAA,CACI,GAAGvB,EACJ,WAAYL,GAAcoC,EAAM,KAAK,MAAM,aAC3C,MAAOA,EAAM,MAAM,MACnB,OAAQE,GAAKF,EAAM,WAAA,EACnB,SAAUP,GAAKO,EAAM,aAAaP,CAAC,EACnC,aAAcU,EAAqBH,CAAK,CAAA,CAAA,CAGpD,CAcO,SAASI,GAAwB,CACpC,WAAAxC,EACA,GAAGK,CACP,EAAmF,CAC/E,MAAM+B,EAAQC,EAA0B,CAAE,SAAUrC,EAAY,EAChE,OACIgB,EAACiB,EAAA,CACI,GAAG5B,EACJ,WAAYL,GAAcoC,EAAM,KAAK,MAAM,aAC3C,MAAOA,EAAM,MAAM,MACnB,OAAQE,GAAKF,EAAM,WAAA,EACnB,SAAUP,GAAKO,EAAM,aAAaP,CAAC,EACnC,aAAcU,EAAqBH,CAAK,CAAA,CAAA,CAGpD"}
+{"version":3,"file":"id-search.js","sources":["../../lib/components/id-search.tsx"],"sourcesContent":["import { useQuery } from '@tanstack/react-query';\nimport { useState } from 'react';\nimport { Autocomplete } from 'react-aria-components';\nimport { Loader } from '../components/loader';\nimport { Menu, MenuItem } from '../components/menu';\nimport { PopoverTrigger } from '../components/popover';\nimport { SearchField } from '../components/searchfield';\nimport { getFieldErrorMessage } from '../utilities/form';\nimport { useFieldContext } from '../utilities/form-context';\nimport type { CtxResourceName } from '../utilities/resources';\nimport { FormField, type FormFieldProps } from './form';\nimport { SelectPopover, SelectTrigger } from './select';\n\n/**\n * Minimal resource shape used by the ID search inputs.\n * Only `id` and `name` are required.\n *\n * @example\n * const user: BaseSearchableResource = { id: 'u_123', name: 'Nabeel Farooq' };\n */\ntype BaseSearchableResource = {\n    /** Unique identifier used as the input value. */\n    id: string;\n    /** Human-readable label shown to users. */\n    name: string;\n};\n\n/**\n * - Generic, accessible ID-search building block.\n * - Search (powered by react-query)\n * - Renders an accessible Autocomplete + Menu listbox\n * - Exposes a controlled `value`/`onChange` contract so callers (and wrappers) can manage state\n * - Clear separation of concerns: this component only handles UI search/display; callers provide `searchFn`\n *\n * @template T - resource type extending `BaseSearchableResource` (must have `id` and `name`)\n * @template V - controlled value type (e.g. `string` for single-select or `string[]` for multi-select)\n *\n * @param props - props object (see inline property JSDoc for the most important fields)\n *\n * @remarks\n * - `searchFn` should return `Promise<T[] | undefined>`. Returning `undefined` indicates no results / handled error.\n * - When the popover closes, `onBlur` (if provided) is called with the current `value`.\n * - `renderLabel` must convert `value` to a readable string for the control button.\n *\n * @example\n * <BaseIdSearchInput\n *   label=\"Owner\"\n *   searchFn={q => api.searchUsers(q)}\n *   value={ownerId}\n *   onChange={setOwnerId}\n *   renderLabel={(v, data) => data?.find(d => d.id === v)?.name ?? v}\n * />\n *\n * @testing\n * - Mock `searchFn` in unit tests; assert keyboard navigation, open/close behavior, and `onBlur` call on popover close.\n */\nfunction BaseIdSearchInput<T extends BaseSearchableResource, V>({\n    label,\n    description,\n    errorMessage,\n    searchFn,\n    isDisabled,\n    onBlur,\n    resource,\n    onChange,\n    value,\n    renderLabel,\n    ...props\n}: FormFieldProps & {\n    resource: CtxResourceName;\n    /** Function that returns matching resources for the current query. */\n    searchFn: (q: string) => Promise<T[] | undefined>;\n    /** Disable interactions. */\n    isDisabled?: boolean;\n    /** Key used to access an alternate display accessor on item (kept for compatibility). */\n    accessor: keyof BaseSearchableResource;\n    /** Controlled value. */\n    value: V;\n    /** Called when popover closes or the field blurs with the current value. */\n    onBlur?: (v: V) => void;\n    /** Controlled change handler. */\n    onChange: (v: V) => void;\n    /** Render a human-readable label for the current value using the latest data. */\n    renderLabel: (v: V, data: T[] | undefined) => string;\n} & Omit<React.ComponentProps<typeof Menu>, 'items' | 'className'>) {\n    const [search, _setSearch] = useState('');\n    const { data, isError, isFetching, error } = useQuery({\n        queryKey: [resource, 'id', search],\n        queryFn: () => searchFn(search),\n    });\n\n    return (\n        <div className=\"group form-field\">\n            <FormField label={label} description={description} errorMessage={errorMessage}>\n                <PopoverTrigger\n                    onOpenChange={o => {\n                        if (!o) {\n                            // searchInputRef.current?.focus();\n                            onBlur?.(value);\n                        }\n                    }}\n                >\n                    <SelectTrigger isDisabled={isDisabled}>{renderLabel(value, data)}</SelectTrigger>\n                    <SelectPopover placement=\"bottom start\">\n                        <Autocomplete inputValue={search} onInputChange={_setSearch}>\n                            <SearchField className={'p-2'} autoFocus />\n                            {isFetching && (\n                                <div className=\"p-input\">\n                                    <Loader className=\"mx-auto\" />\n                                </div>\n                            )}\n                            {!isFetching && !isError && (\n                                <Menu\n                                    {...props}\n                                    className={'max-h-48'}\n                                    items={data}\n                                    renderEmptyState={() => <div className=\"body-sm p-2\">No results found.</div>}\n                                >\n                                    {item => (\n                                        <MenuItem key={item['id']} id={item['id']}>\n                                            {item.name}\n                                        </MenuItem>\n                                    )}\n                                </Menu>\n                            )}\n                            {isError && <div className=\"text-destructive p-icon body-sm\">{error.message}</div>}\n                        </Autocomplete>\n                    </SelectPopover>\n                </PopoverTrigger>\n            </FormField>\n        </div>\n    );\n}\n\n/**\n * Single-selection ID search input.\n *\n * Thin, typed wrapper around `BaseIdSearchInput` specialized for the very common single-ID case.\n * Adapts the internal selection events into `onChange(id?: string)` and renders the selected label.\n *\n * @template T - resource type (extends BaseSearchableResource)\n *\n * @param props - Inherits `BaseIdSearchInput` props but uses `string[]` value type.\n *\n * @example\n * <SingleIdSearchInput\n *   label=\"Reporter\"\n *   value={reporterId}\n *   onChange={setReporterId}\n *   searchFn={q => api.searchUsers(q)}\n * />\n *\n */\nexport function SingleIdSearchInput<T extends BaseSearchableResource>({\n    ...props\n}: Omit<\n    React.ComponentProps<typeof BaseIdSearchInput<T, string>>,\n    'onSelectionChange' | 'selectionMode' | 'selectedKeys' | 'renderLabel'\n>) {\n    return (\n        <BaseIdSearchInput\n            selectedKeys={[props.value]}\n            onSelectionChange={e => props.onChange(Array.from(e).filter(v => typeof v === 'string')[0])}\n            renderLabel={(v, d) => d?.find(di => di.id === v)?.name ?? v}\n            selectionMode=\"single\"\n            {...props}\n        />\n    );\n}\n\n/**\n * Multi-selection ID search input.\n *\n * Thin wrapper around `BaseIdSearchInput` for the multiple-ID (`string[]`) case.\n * Adapts internal selection events into `onChange(ids: string[])`.\n *\n * @template T - resource type (extends BaseSearchableResource)\n *\n * @param props - Inherits `BaseIdSearchInput` props but uses `string[]` value type.\n *\n * @example\n * <MultipleIdSearchInput\n *   label=\"Reviewers\"\n *   value={reviewerIds}\n *   onChange={setReviewerIds}\n *   searchFn={q => api.searchUsers(q)}\n * />\n *\n * @remarks\n * - The `renderLabel` joins selected item names with commas for compact display.\n */\nexport function MultipleIdSearchInput<T extends BaseSearchableResource>({\n    ...props\n}: Omit<\n    React.ComponentProps<typeof BaseIdSearchInput<T, string[]>>,\n    'renderLabel' | 'onSelectionChange' | 'selectionMode' | 'selectedKeys'\n>) {\n    return (\n        <BaseIdSearchInput\n            selectedKeys={props.value}\n            onSelectionChange={e => props.onChange(Array.from(e).filter(v => typeof v === 'string'))}\n            selectionMode=\"multiple\"\n            renderLabel={(v, d) => v.map(vi => d?.find(di => di.id === vi)?.name ?? vi).join(',')}\n            {...props}\n        />\n    );\n}\n\n/**\n * Form-integrated single-select ID input (field wrapper).\n *\n * Integrates `SingleIdSearchInput` into the form system using `useFieldContext`.\n * - wires `value`, `onChange`, and `onBlur`\n * - disables the control while the form is submitting\n * - surfaces field-level error messages\n *\n * @example\n * <TfSingleIdSearchInput name=\"ownerId\" label=\"Owner\" searchFn={q => api.searchUsers(q)} />\n \n */\nexport function TfSingleIdSearchInput({\n    isDisabled,\n    ...props\n}: Omit<React.ComponentProps<typeof SingleIdSearchInput>, 'value' | 'onChange'>) {\n    const field = useFieldContext<string>({ disabled: isDisabled });\n    return (\n        <SingleIdSearchInput\n            {...props}\n            isDisabled={isDisabled || field.form.state.isSubmitting}\n            value={field.state.value}\n            onBlur={_ => field.handleBlur()}\n            onChange={e => field.handleChange(e)}\n            errorMessage={getFieldErrorMessage(field)}\n        />\n    );\n}\n\n/**\n * Form-integrated multi-select ID input (field wrapper).\n *\n * Integrates `MultipleIdSearchInput` into the form system using `useFieldContext`.\n * - wires `value`, `onChange`, and `onBlur`\n * - disables the control while the form is submitting\n * - surfaces field-level error messages\n *\n * @example\n * <TfMultipleIdSearchInput name=\"reviewerIds\" label=\"Reviewers\" searchFn={q => api.searchUsers(q)} />\n *\n */\nexport function TfMultipleIdSearchInput({\n    isDisabled,\n    ...props\n}: Omit<React.ComponentProps<typeof MultipleIdSearchInput>, 'value' | 'onChange'>) {\n    const field = useFieldContext<string[]>({ disabled: isDisabled });\n    return (\n        <MultipleIdSearchInput\n            {...props}\n            isDisabled={isDisabled || field.form.state.isSubmitting}\n            value={field.state.value}\n            onBlur={_ => field.handleBlur()}\n            onChange={e => field.handleChange(e)}\n            errorMessage={getFieldErrorMessage(field)}\n        />\n    );\n}\n"],"names":["BaseIdSearchInput","label","description","errorMessage","searchFn","isDisabled","onBlur","resource","onChange","value","renderLabel","props","search","_setSearch","useState","data","isError","isFetching","error","useQuery","jsx","FormField","jsxs","PopoverTrigger","o","SelectTrigger","SelectPopover","Autocomplete","SearchField","Loader","Menu","item","MenuItem","SingleIdSearchInput","e","v","d","di","MultipleIdSearchInput","vi","TfSingleIdSearchInput","field","useFieldContext","_","getFieldErrorMessage","TfMultipleIdSearchInput"],"mappings":"gvBAwDA,SAASA,EAAuD,CAC5D,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAC,EACA,WAAAC,EACA,OAAAC,EACA,SAAAC,EACA,SAAAC,EACA,MAAAC,EACA,YAAAC,EACA,GAAGC,CACP,EAgBoE,CAChE,KAAM,CAACC,EAAQC,CAAU,EAAIC,EAAS,EAAE,EAClC,CAAE,KAAAC,EAAM,QAAAC,EAAS,WAAAC,EAAY,MAAAC,CAAA,EAAUC,EAAS,CAClD,SAAU,CAACZ,EAAU,KAAMK,CAAM,EACjC,QAAS,IAAMR,EAASQ,CAAM,CAAA,CACjC,EAED,OACIQ,EAAC,OAAI,UAAU,mBACX,WAACC,EAAA,CAAU,MAAApB,EAAc,YAAAC,EAA0B,aAAAC,EAC/C,SAAAmB,EAACC,EAAA,CACG,aAAcC,GAAK,CACVA,GAEDlB,IAASG,CAAK,CAEtB,EAEA,SAAA,CAAAW,EAACK,EAAA,CAAc,WAAApB,EAAyB,SAAAK,EAAYD,EAAOM,CAAI,EAAE,EACjEK,EAACM,GAAc,UAAU,eACrB,WAACC,EAAA,CAAa,WAAYf,EAAQ,cAAeC,EAC7C,SAAA,CAAAO,EAACQ,EAAA,CAAY,UAAW,MAAO,UAAS,GAAC,EACxCX,KACI,MAAA,CAAI,UAAU,UACX,SAAAG,EAACS,EAAA,CAAO,UAAU,SAAA,CAAU,CAAA,CAChC,EAEH,CAACZ,GAAc,CAACD,GACbI,EAACU,EAAA,CACI,GAAGnB,EACJ,UAAW,WACX,MAAOI,EACP,iBAAkB,IAAMK,EAAC,MAAA,CAAI,UAAU,cAAc,SAAA,oBAAiB,EAErE,SAAAW,GACGX,EAACY,EAAA,CAA0B,GAAID,EAAK,GAC/B,SAAAA,EAAK,IAAA,EADKA,EAAK,EAEpB,CAAA,CAAA,EAIXf,GAAWI,EAAC,MAAA,CAAI,UAAU,kCAAmC,WAAM,OAAA,CAAQ,CAAA,CAAA,CAChF,CAAA,CACJ,CAAA,CAAA,CAAA,EAER,CAAA,CACJ,CAER,CAqBO,SAASa,EAAsD,CAClE,GAAGtB,CACP,EAGG,CACC,OACIS,EAACpB,EAAA,CACG,aAAc,CAACW,EAAM,KAAK,EAC1B,kBAAmBuB,GAAKvB,EAAM,SAAS,MAAM,KAAKuB,CAAC,EAAE,UAAY,OAAOC,GAAM,QAAQ,EAAE,CAAC,CAAC,EAC1F,YAAa,CAACA,EAAGC,IAAMA,GAAG,KAAKC,GAAMA,EAAG,KAAOF,CAAC,GAAG,MAAQA,EAC3D,cAAc,SACb,GAAGxB,CAAA,CAAA,CAGhB,CAuBO,SAAS2B,EAAwD,CACpE,GAAG3B,CACP,EAGG,CACC,OACIS,EAACpB,EAAA,CACG,aAAcW,EAAM,MACpB,kBAAmBuB,GAAKvB,EAAM,SAAS,MAAM,KAAKuB,CAAC,EAAE,OAAOC,GAAK,OAAOA,GAAM,QAAQ,CAAC,EACvF,cAAc,WACd,YAAa,CAACA,EAAGC,IAAMD,EAAE,OAAUC,GAAG,KAAKC,GAAMA,EAAG,KAAOE,CAAE,GAAG,MAAQA,CAAE,EAAE,KAAK,GAAG,EACnF,GAAG5B,CAAA,CAAA,CAGhB,CAcO,SAAS6B,GAAsB,CAClC,WAAAnC,EACA,GAAGM,CACP,EAAiF,CAC7E,MAAM8B,EAAQC,EAAwB,CAAE,SAAUrC,EAAY,EAC9D,OACIe,EAACa,EAAA,CACI,GAAGtB,EACJ,WAAYN,GAAcoC,EAAM,KAAK,MAAM,aAC3C,MAAOA,EAAM,MAAM,MACnB,OAAQE,GAAKF,EAAM,WAAA,EACnB,SAAUP,GAAKO,EAAM,aAAaP,CAAC,EACnC,aAAcU,EAAqBH,CAAK,CAAA,CAAA,CAGpD,CAcO,SAASI,GAAwB,CACpC,WAAAxC,EACA,GAAGM,CACP,EAAmF,CAC/E,MAAM8B,EAAQC,EAA0B,CAAE,SAAUrC,EAAY,EAChE,OACIe,EAACkB,EAAA,CACI,GAAG3B,EACJ,WAAYN,GAAcoC,EAAM,KAAK,MAAM,aAC3C,MAAOA,EAAM,MAAM,MACnB,OAAQE,GAAKF,EAAM,WAAA,EACnB,SAAUP,GAAKO,EAAM,aAAaP,CAAC,EACnC,aAAcU,EAAqBH,CAAK,CAAA,CAAA,CAGpD"}

package/dist/components/list-box.js

@@ -1,2 +1,2 @@
-import{jsx as o,jsxs as m,Fragment as l}from"react/jsx-runtime";import{ListBoxItem as p,composeRenderProps as r,Collection as c,ListBox as u,Header as d}from"react-aria-components";import{classNames as n}from"../utilities/theme.js";import{IcCheck as x}from"./icons.js";import"clsx";import"react";const N=c;function v({className:e,...t}){return o(u,{className:r(e,s=>n(s,"group overflow-auto border bg-popover p-1 text-popover-foreground outline-none","data-[empty]:p-6 data-[empty]:text-center data-[empty]:body-sm")),...t})}function I({className:e,children:t,...s}){return o(p,{textValue:s.textValue||(typeof t=="string"?t:void 0),className:r(e,i=>n("btn btn-ghost input-dim relative w-full","data-[selection-mode]:pl-input",i)),...s,children:r(t,(i,a)=>m(l,{children:[a.isSelected&&o("span",{className:"absolute left-2 flex size-icon items-center justify-center",children:o(x,{className:"size-icon"})}),i]}))})}function h({className:e,...t}){return o(d,{className:n("py-1.5 pl-input pr-2 body font-semibold",e),...t})}export{v as ListBox,N as ListBoxCollection,h as ListBoxHeader,I as ListBoxItem};
+import{jsx as o,jsxs as m,Fragment as l}from"react/jsx-runtime";import{ListBoxItem as p,composeRenderProps as r,Collection as c,ListBox as u,Header as d}from"react-aria-components";import{classNames as n}from"../utilities/theme.js";import{IcCheck as f}from"./icons.js";import"clsx";import"react";const N=c;function v({className:e,...t}){return o(u,{className:r(e,s=>n(s,"group overflow-auto border bg-popover p-1 text-popover-foreground outline-none","data-[empty]:p-6 data-[empty]:text-center data-[empty]:body-sm")),...t})}function j({className:e,children:t,...s}){return o(p,{textValue:s.textValue||(typeof t=="string"?t:void 0),className:r(e,i=>n("btn btn-ghost justify-start input-dim relative w-full","data-[selection-mode]:pl-input",i)),...s,children:r(t,(i,a)=>m(l,{children:[a.isSelected&&o("span",{className:"absolute left-2 flex size-icon items-center justify-center",children:o(f,{className:"size-icon"})}),i]}))})}function I({className:e,...t}){return o(d,{className:n("py-1.5 pl-input pr-2 body font-semibold",e),...t})}export{v as ListBox,N as ListBoxCollection,I as ListBoxHeader,j as ListBoxItem};
 //# sourceMappingURL=list-box.js.map

package/dist/components/list-box.js.map

@@ -1 +1 @@
-{"version":3,"file":"list-box.js","sources":["../../lib/components/list-box.tsx"],"sourcesContent":["import {\n    Collection as AriaCollection,\n    Header as AriaHeader,\n    ListBox as AriaListBox,\n    ListBoxItem as AriaListBoxItem,\n    ListBoxItemProps as AriaListBoxItemProps,\n    ListBoxProps as AriaListBoxProps,\n    composeRenderProps,\n} from 'react-aria-components';\n\nimport { classNames } from '../utilities/theme';\nimport { IcCheck } from './icons';\n\nexport const ListBoxCollection = AriaCollection;\n\nexport function ListBox<T extends object>({ className, ...props }: AriaListBoxProps<T>) {\n    return (\n        <AriaListBox\n            className={composeRenderProps(className, className =>\n                classNames(\n                    className,\n                    'group overflow-auto border bg-popover p-1 text-popover-foreground outline-none',\n                    /* Empty */\n                    'data-[empty]:p-6 data-[empty]:text-center data-[empty]:body-sm'\n                )\n            )}\n            {...props}\n        />\n    );\n}\n\nexport function ListBoxItem<T extends object>({ className, children, ...props }: AriaListBoxItemProps<T>) {\n    return (\n        <AriaListBoxItem\n            textValue={props.textValue || (typeof children === 'string' ? children : undefined)}\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'btn btn-ghost input-dim relative w-full',\n                    /* Selection */\n                    'data-[selection-mode]:pl-input',\n                    className\n                )\n            )}\n            {...props}\n        >\n            {composeRenderProps(children, (children, renderProps) => (\n                <>\n                    {renderProps.isSelected && (\n                        <span className=\"absolute left-2 flex size-icon items-center justify-center\">\n                            <IcCheck className=\"size-icon\" />\n                        </span>\n                    )}\n                    {children}\n                </>\n            ))}\n        </AriaListBoxItem>\n    );\n}\n\nexport function ListBoxHeader({ className, ...props }: React.ComponentProps<typeof AriaHeader>) {\n    return <AriaHeader className={classNames('py-1.5 pl-input pr-2 body font-semibold', className)} {...props} />;\n}\n"],"names":["ListBoxCollection","AriaCollection","ListBox","className","props","jsx","AriaListBox","composeRenderProps","classNames","ListBoxItem","children","AriaListBoxItem","renderProps","jsxs","Fragment","IcCheck","ListBoxHeader","AriaHeader"],"mappings":"wSAaO,MAAMA,EAAoBC,EAE1B,SAASC,EAA0B,CAAE,UAAAC,EAAW,GAAGC,GAA8B,CACpF,OACIC,EAACC,EAAA,CACG,UAAWC,EAAmBJ,EAAWA,GACrCK,EACIL,EACA,iFAEA,gEAAA,CACJ,EAEH,GAAGC,CAAA,CAAA,CAGhB,CAEO,SAASK,EAA8B,CAAE,UAAAN,EAAW,SAAAO,EAAU,GAAGN,GAAkC,CACtG,OACIC,EAACM,EAAA,CACG,UAAWP,EAAM,YAAc,OAAOM,GAAa,SAAWA,EAAW,QACzE,UAAWH,EAAmBJ,EAAWA,GACrCK,EACI,0CAEA,iCACAL,CAAA,CACJ,EAEH,GAAGC,EAEH,SAAAG,EAAmBG,EAAU,CAACA,EAAUE,IACrCC,EAAAC,EAAA,CACK,SAAA,CAAAF,EAAY,cACR,OAAA,CAAK,UAAU,6DACZ,SAAAP,EAACU,EAAA,CAAQ,UAAU,WAAA,CAAY,CAAA,CACnC,EAEHL,CAAA,EACL,CACH,CAAA,CAAA,CAGb,CAEO,SAASM,EAAc,CAAE,UAAAb,EAAW,GAAGC,GAAkD,CAC5F,OAAOC,EAACY,GAAW,UAAWT,EAAW,0CAA2CL,CAAS,EAAI,GAAGC,EAAO,CAC/G"}
+{"version":3,"file":"list-box.js","sources":["../../lib/components/list-box.tsx"],"sourcesContent":["import {\n    Collection as AriaCollection,\n    Header as AriaHeader,\n    ListBox as AriaListBox,\n    ListBoxItem as AriaListBoxItem,\n    ListBoxItemProps as AriaListBoxItemProps,\n    ListBoxProps as AriaListBoxProps,\n    composeRenderProps,\n} from 'react-aria-components';\n\nimport { classNames } from '../utilities/theme';\nimport { IcCheck } from './icons';\n\nexport const ListBoxCollection = AriaCollection;\n\nexport function ListBox<T extends object>({ className, ...props }: AriaListBoxProps<T>) {\n    return (\n        <AriaListBox\n            className={composeRenderProps(className, className =>\n                classNames(\n                    className,\n                    'group overflow-auto border bg-popover p-1 text-popover-foreground outline-none',\n                    /* Empty */\n                    'data-[empty]:p-6 data-[empty]:text-center data-[empty]:body-sm'\n                )\n            )}\n            {...props}\n        />\n    );\n}\n\nexport function ListBoxItem<T extends object>({ className, children, ...props }: AriaListBoxItemProps<T>) {\n    return (\n        <AriaListBoxItem\n            textValue={props.textValue || (typeof children === 'string' ? children : undefined)}\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'btn btn-ghost justify-start input-dim relative w-full',\n                    /* Selection */\n                    'data-[selection-mode]:pl-input',\n                    className\n                )\n            )}\n            {...props}\n        >\n            {composeRenderProps(children, (children, renderProps) => (\n                <>\n                    {renderProps.isSelected && (\n                        <span className=\"absolute left-2 flex size-icon items-center justify-center\">\n                            <IcCheck className=\"size-icon\" />\n                        </span>\n                    )}\n                    {children}\n                </>\n            ))}\n        </AriaListBoxItem>\n    );\n}\n\nexport function ListBoxHeader({ className, ...props }: React.ComponentProps<typeof AriaHeader>) {\n    return <AriaHeader className={classNames('py-1.5 pl-input pr-2 body font-semibold', className)} {...props} />;\n}\n"],"names":["ListBoxCollection","AriaCollection","ListBox","className","props","jsx","AriaListBox","composeRenderProps","classNames","ListBoxItem","children","AriaListBoxItem","renderProps","jsxs","Fragment","IcCheck","ListBoxHeader","AriaHeader"],"mappings":"wSAaO,MAAMA,EAAoBC,EAE1B,SAASC,EAA0B,CAAE,UAAAC,EAAW,GAAGC,GAA8B,CACpF,OACIC,EAACC,EAAA,CACG,UAAWC,EAAmBJ,EAAWA,GACrCK,EACIL,EACA,iFAEA,gEAAA,CACJ,EAEH,GAAGC,CAAA,CAAA,CAGhB,CAEO,SAASK,EAA8B,CAAE,UAAAN,EAAW,SAAAO,EAAU,GAAGN,GAAkC,CACtG,OACIC,EAACM,EAAA,CACG,UAAWP,EAAM,YAAc,OAAOM,GAAa,SAAWA,EAAW,QACzE,UAAWH,EAAmBJ,EAAWA,GACrCK,EACI,wDAEA,iCACAL,CAAA,CACJ,EAEH,GAAGC,EAEH,SAAAG,EAAmBG,EAAU,CAACA,EAAUE,IACrCC,EAAAC,EAAA,CACK,SAAA,CAAAF,EAAY,cACR,OAAA,CAAK,UAAU,6DACZ,SAAAP,EAACU,EAAA,CAAQ,UAAU,WAAA,CAAY,CAAA,CACnC,EAEHL,CAAA,EACL,CACH,CAAA,CAAA,CAGb,CAEO,SAASM,EAAc,CAAE,UAAAb,EAAW,GAAGC,GAAkD,CAC5F,OAAOC,EAACY,GAAW,UAAWT,EAAW,0CAA2CL,CAAS,EAAI,GAAGC,EAAO,CAC/G"}

package/dist/components/menu.js

@@ -1,2 +1,2 @@
-import{jsxs as s,jsx as o,Fragment as c}from"react/jsx-runtime";import{MenuTrigger as p,MenuItem as f,composeRenderProps as m,Menu as d,SubmenuTrigger as b,Header as M,Separator as g,Keyboard as y}from"react-aria-components";import{classNames as u}from"../utilities/theme.js";import{Button as x}from"./button.js";import{IcDot as N,IcCheck as h,IcRight as v}from"./icons.js";import{ListBoxCollection as S}from"./list-box.js";import{SelectPopover as I}from"./select.js";import"clsx";import"class-variance-authority";import"./loader.js";import"react";import"./field.js";import"../utilities/form.js";import"../utilities/form-context.js";import"@tanstack/react-form";import"./popover.js";const T=p,J=b,O=S;function j({className:e,...t}){return o(I,{className:m(e,n=>u(n)),...t})}function z({className:e,...t}){return o(d,{className:u("overflow-auto p-1 outline-0 body-base",e),escapeKeyBehavior:"none",...t})}function P({children:e,className:t,...n}){return o(f,{textValue:n.textValue||(typeof e=="string"?e:void 0),className:m(t,r=>u("btn btn-ghost relative flex justify-start input-dim","data-[selection-mode]:pl-input",r)),...n,children:m(e,(r,i)=>s(c,{children:[o("span",{className:"absolute left-2 flex size-icon items-center justify-center",children:i.isSelected&&s(c,{children:[i.selectionMode=="single"&&o(N,{className:"size-icon fill-current"}),i.selectionMode=="multiple"&&o(h,{className:"size-icon"})]})}),r,i.hasSubmenu&&o(v,{className:"ml-auto size-icon"})]}))})}function Q({className:e,inset:t,separator:n=!0,...r}){return o(M,{className:u("px-3 py-1.5 body font-semibold",t&&"pl-input",n&&"-mx-1 mb-1 border-b border-b-border pb-2.5",e),...r})}function U({className:e,...t}){return o(g,{className:u("-mx-1 my-1 h-px bg-muted",e),...t})}function W({className:e,...t}){return o(y,{className:u("ml-auto body-sm tracking-widest opacity-60",e),...t})}function X({label:e,children:t,variant:n,isDisabled:r,size:i,isNonModal:l,...a}){return s(T,{...a,children:[o(x,{isDisabled:r,autoFocus:!!a.autoFocus,type:"button",variant:n,size:i,children:e}),o(j,{isNonModal:l,className:"overflow-auto",children:o(z,{...a,children:t})})]})}export{X as EasyMenu,z as Menu,O as MenuCollection,Q as MenuHeader,P as MenuItem,W as MenuKeyboard,j as MenuPopover,U as MenuSeparator,J as MenuSubTrigger,T as MenuTrigger};
+import{jsxs as u,jsx as o,Fragment as c}from"react/jsx-runtime";import{MenuTrigger as l,MenuItem as p,composeRenderProps as m,Menu as d,SubmenuTrigger as f,Header as b,Separator as g,Keyboard as M}from"react-aria-components";import{classNames as a}from"../utilities/theme.js";import{IcDot as y,IcCheck as N,IcRight as x}from"./icons.js";import{ListBoxCollection as h}from"./list-box.js";import{SelectTrigger as S,SelectPopover as v}from"./select.js";import"clsx";import"react";import"./button.js";import"class-variance-authority";import"./loader.js";import"../utilities/form.js";import"../utilities/form-context.js";import"@tanstack/react-form";import"./form.js";import"./popover.js";const I=l,J=f,O=h;function T({className:e,...t}){return o(v,{className:m(e,r=>a(r)),...t})}function j({className:e,...t}){return o(d,{className:a("overflow-auto p-1 outline-0 body-base",e),escapeKeyBehavior:"none",...t})}function P({children:e,className:t,...r}){return o(p,{textValue:r.textValue||(typeof e=="string"?e:void 0),className:m(t,n=>a("btn btn-ghost relative flex justify-start input-dim","data-[selection-mode]:pl-input",n)),...r,children:m(e,(n,i)=>u(c,{children:[o("span",{className:"absolute left-2 flex size-icon items-center justify-center",children:i.isSelected&&u(c,{children:[i.selectionMode=="single"&&o(y,{className:"size-icon fill-current"}),i.selectionMode=="multiple"&&o(N,{className:"size-icon"})]})}),n,i.hasSubmenu&&o(x,{className:"ml-auto size-icon"})]}))})}function Q({className:e,inset:t,separator:r=!0,...n}){return o(b,{className:a("px-3 py-1.5 body font-semibold",t&&"pl-input",r&&"-mx-1 mb-1 border-b border-b-border pb-2.5",e),...n})}function U({className:e,...t}){return o(g,{className:a("-mx-1 my-1 h-px bg-muted",e),...t})}function W({className:e,...t}){return o(M,{className:a("ml-auto body-sm tracking-widest opacity-60",e),...t})}function X({label:e,children:t,variant:r,isDisabled:n,size:i,isNonModal:z,...s}){return u(I,{...s,children:[o(S,{isDisabled:n,autoFocus:!!s.autoFocus,variant:r,size:i,children:e}),o(T,{className:"overflow-auto",children:o(j,{...s,children:t})})]})}export{X as EasyMenu,j as Menu,O as MenuCollection,Q as MenuHeader,P as MenuItem,W as MenuKeyboard,T as MenuPopover,U as MenuSeparator,J as MenuSubTrigger,I as MenuTrigger};
 //# sourceMappingURL=menu.js.map

package/dist/components/menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu.js","sources":["../../lib/components/menu.tsx"],"sourcesContent":["import { VariantProps } from 'class-variance-authority';\nimport {\n    Header as AriaHeader,\n    Keyboard as AriaKeyboard,\n    Menu as AriaMenu,\n    MenuItem as AriaMenuItem,\n    MenuItemProps as AriaMenuItemProps,\n    MenuProps as AriaMenuProps,\n    MenuTrigger as AriaMenuTrigger,\n    MenuTriggerProps as AriaMenuTriggerProps,\n    Separator as AriaSeparator,\n    SeparatorProps as AriaSeparatorProps,\n    SubmenuTrigger as AriaSubmenuTrigger,\n    composeRenderProps,\n    PopoverProps,\n} from 'react-aria-components';\n\nimport { classNames } from '../utilities/theme';\n\nimport { Button, buttonVariants } from './button';\nimport { IcCheck, IcDot, IcRight } from './icons';\nimport { ListBoxCollection } from './list-box';\nimport { SelectPopover } from './select';\n\nexport const MenuTrigger = AriaMenuTrigger;\nexport const MenuSubTrigger = AriaSubmenuTrigger;\nexport const MenuCollection = ListBoxCollection;\n\nexport function MenuPopover({ className, ...props }: PopoverProps) {\n    return <SelectPopover className={composeRenderProps(className, className => classNames(className))} {...props} />;\n}\n\nexport function Menu<T extends object>({ className, ...props }: AriaMenuProps<T>) {\n    return (\n        <AriaMenu\n            className={classNames('overflow-auto p-1 outline-0 body-base', className)}\n            escapeKeyBehavior=\"none\"\n            {...props}\n        />\n    );\n}\n\nexport function MenuItem({ children, className, ...props }: AriaMenuItemProps & { ref?: React.Ref<HTMLDivElement> }) {\n    return (\n        <AriaMenuItem\n            textValue={props.textValue || (typeof children === 'string' ? children : undefined)}\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'btn btn-ghost relative flex justify-start input-dim',\n                    /* Selection Mode */\n                    'data-[selection-mode]:pl-input',\n                    className\n                )\n            )}\n            {...props}\n        >\n            {composeRenderProps(children, (children, renderProps) => (\n                <>\n                    <span className=\"absolute left-2 flex size-icon items-center justify-center\">\n                        {renderProps.isSelected && (\n                            <>\n                                {renderProps.selectionMode == 'single' && <IcDot className=\"size-icon fill-current\" />}\n                                {renderProps.selectionMode == 'multiple' && <IcCheck className=\"size-icon\" />}\n                            </>\n                        )}\n                    </span>\n\n                    {children}\n\n                    {renderProps.hasSubmenu && <IcRight className=\"ml-auto size-icon\" />}\n                </>\n            ))}\n        </AriaMenuItem>\n    );\n}\n\ninterface MenuHeaderProps extends React.ComponentProps<typeof AriaHeader> {\n    inset?: boolean;\n    separator?: boolean;\n}\n\nexport function MenuHeader({ className, inset, separator = true, ...props }: MenuHeaderProps) {\n    return (\n        <AriaHeader\n            className={classNames(\n                'px-3 py-1.5 body font-semibold',\n                inset && 'pl-input',\n                separator && '-mx-1 mb-1 border-b border-b-border pb-2.5',\n                className\n            )}\n            {...props}\n        />\n    );\n}\n\nexport function MenuSeparator({ className, ...props }: AriaSeparatorProps) {\n    return <AriaSeparator className={classNames('-mx-1 my-1 h-px bg-muted', className)} {...props} />;\n}\n\nexport function MenuKeyboard({ className, ...props }: React.ComponentProps<typeof AriaKeyboard>) {\n    return <AriaKeyboard className={classNames('ml-auto body-sm tracking-widest opacity-60', className)} {...props} />;\n}\ninterface MenuProps<T>\n    extends AriaMenuProps<T>,\n        VariantProps<typeof buttonVariants>,\n        Omit<AriaMenuTriggerProps, 'children'> {\n    label?: React.ReactNode;\n    isDisabled?: boolean;\n    isNonModal?: boolean;\n}\n// TODO name this better\nexport function EasyMenu<T extends object>({\n    label,\n    children,\n    variant,\n    isDisabled,\n    size,\n    isNonModal,\n    ...props\n}: MenuProps<T>) {\n    return (\n        <MenuTrigger {...props}>\n            <Button isDisabled={isDisabled} autoFocus={!!props.autoFocus} type=\"button\" variant={variant} size={size}>\n                {label}\n            </Button>\n            <MenuPopover isNonModal={isNonModal} className=\"overflow-auto\">\n                <Menu {...props}>{children}</Menu>\n            </MenuPopover>\n        </MenuTrigger>\n    );\n}\n"],"names":["MenuTrigger","AriaMenuTrigger","MenuSubTrigger","AriaSubmenuTrigger","MenuCollection","ListBoxCollection","MenuPopover","className","props","jsx","SelectPopover","composeRenderProps","classNames","Menu","AriaMenu","MenuItem","children","AriaMenuItem","renderProps","jsxs","Fragment","IcDot","IcCheck","IcRight","MenuHeader","inset","separator","AriaHeader","MenuSeparator","AriaSeparator","MenuKeyboard","AriaKeyboard","EasyMenu","label","variant","isDisabled","size","isNonModal","Button"],"mappings":"2qBAwBO,MAAMA,EAAcC,EACdC,EAAiBC,EACjBC,EAAiBC,EAEvB,SAASC,EAAY,CAAE,UAAAC,EAAW,GAAGC,GAAuB,CAC/D,OAAOC,EAACC,EAAA,CAAc,UAAWC,EAAmBJ,EAAWA,GAAaK,EAAWL,CAAS,CAAC,EAAI,GAAGC,CAAA,CAAO,CACnH,CAEO,SAASK,EAAuB,CAAE,UAAAN,EAAW,GAAGC,GAA2B,CAC9E,OACIC,EAACK,EAAA,CACG,UAAWF,EAAW,wCAAyCL,CAAS,EACxE,kBAAkB,OACjB,GAAGC,CAAA,CAAA,CAGhB,CAEO,SAASO,EAAS,CAAE,SAAAC,EAAU,UAAAT,EAAW,GAAGC,GAAkE,CACjH,OACIC,EAACQ,EAAA,CACG,UAAWT,EAAM,YAAc,OAAOQ,GAAa,SAAWA,EAAW,QACzE,UAAWL,EAAmBJ,EAAWA,GACrCK,EACI,sDAEA,iCACAL,CAAA,CACJ,EAEH,GAAGC,EAEH,SAAAG,EAAmBK,EAAU,CAACA,EAAUE,IACrCC,EAAAC,EAAA,CACI,SAAA,CAAAX,EAAC,OAAA,CAAK,UAAU,6DACX,SAAAS,EAAY,YACTC,EAAAC,EAAA,CACK,SAAA,CAAAF,EAAY,eAAiB,UAAYT,EAACY,EAAA,CAAM,UAAU,yBAAyB,EACnFH,EAAY,eAAiB,YAAcT,EAACa,EAAA,CAAQ,UAAU,WAAA,CAAY,CAAA,CAAA,CAC/E,CAAA,CAER,EAECN,EAEAE,EAAY,YAAcT,EAACc,EAAA,CAAQ,UAAU,mBAAA,CAAoB,CAAA,EACtE,CACH,CAAA,CAAA,CAGb,CAOO,SAASC,EAAW,CAAE,UAAAjB,EAAW,MAAAkB,EAAO,UAAAC,EAAY,GAAM,GAAGlB,GAA0B,CAC1F,OACIC,EAACkB,EAAA,CACG,UAAWf,EACP,iCACAa,GAAS,WACTC,GAAa,6CACbnB,CAAA,EAEH,GAAGC,CAAA,CAAA,CAGhB,CAEO,SAASoB,EAAc,CAAE,UAAArB,EAAW,GAAGC,GAA6B,CACvE,OAAOC,EAACoB,GAAc,UAAWjB,EAAW,2BAA4BL,CAAS,EAAI,GAAGC,EAAO,CACnG,CAEO,SAASsB,EAAa,CAAE,UAAAvB,EAAW,GAAGC,GAAoD,CAC7F,OAAOC,EAACsB,GAAa,UAAWnB,EAAW,6CAA8CL,CAAS,EAAI,GAAGC,EAAO,CACpH,CAUO,SAASwB,EAA2B,CACvC,MAAAC,EACA,SAAAjB,EACA,QAAAkB,EACA,WAAAC,EACA,KAAAC,EACA,WAAAC,EACA,GAAG7B,CACP,EAAiB,CACb,OACIW,EAACnB,EAAA,CAAa,GAAGQ,EACb,SAAA,CAAAC,EAAC6B,EAAA,CAAO,WAAAH,EAAwB,UAAW,CAAC,CAAC3B,EAAM,UAAW,KAAK,SAAS,QAAA0B,EAAkB,KAAAE,EACzF,SAAAH,CAAA,CACL,EACAxB,EAACH,EAAA,CAAY,WAAA+B,EAAwB,UAAU,gBAC3C,WAACxB,EAAA,CAAM,GAAGL,EAAQ,SAAAQ,CAAA,CAAS,CAAA,CAC/B,CAAA,EACJ,CAER"}
+{"version":3,"file":"menu.js","sources":["../../lib/components/menu.tsx"],"sourcesContent":["import { VariantProps } from 'class-variance-authority';\nimport {\n    Header as AriaHeader,\n    Keyboard as AriaKeyboard,\n    Menu as AriaMenu,\n    MenuItem as AriaMenuItem,\n    MenuItemProps as AriaMenuItemProps,\n    MenuProps as AriaMenuProps,\n    MenuTrigger as AriaMenuTrigger,\n    MenuTriggerProps as AriaMenuTriggerProps,\n    Separator as AriaSeparator,\n    SeparatorProps as AriaSeparatorProps,\n    SubmenuTrigger as AriaSubmenuTrigger,\n    composeRenderProps,\n    PopoverProps,\n} from 'react-aria-components';\n\nimport { classNames } from '../utilities/theme';\n\nimport { buttonVariants } from './button';\nimport { IcCheck, IcDot, IcRight } from './icons';\nimport { ListBoxCollection } from './list-box';\nimport { SelectPopover, SelectTrigger } from './select';\n\nexport const MenuTrigger = AriaMenuTrigger;\nexport const MenuSubTrigger = AriaSubmenuTrigger;\nexport const MenuCollection = ListBoxCollection;\n\nexport function MenuPopover({ className, ...props }: PopoverProps) {\n    return <SelectPopover className={composeRenderProps(className, className => classNames(className))} {...props} />;\n}\n\nexport function Menu<T extends object>({ className, ...props }: AriaMenuProps<T>) {\n    return (\n        <AriaMenu\n            className={classNames('overflow-auto p-1 outline-0 body-base', className)}\n            escapeKeyBehavior=\"none\"\n            {...props}\n        />\n    );\n}\n\nexport function MenuItem({ children, className, ...props }: AriaMenuItemProps & { ref?: React.Ref<HTMLDivElement> }) {\n    return (\n        <AriaMenuItem\n            textValue={props.textValue || (typeof children === 'string' ? children : undefined)}\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'btn btn-ghost relative flex justify-start input-dim',\n                    /* Selection Mode */\n                    'data-[selection-mode]:pl-input',\n                    className\n                )\n            )}\n            {...props}\n        >\n            {composeRenderProps(children, (children, renderProps) => (\n                <>\n                    <span className=\"absolute left-2 flex size-icon items-center justify-center\">\n                        {renderProps.isSelected && (\n                            <>\n                                {renderProps.selectionMode == 'single' && <IcDot className=\"size-icon fill-current\" />}\n                                {renderProps.selectionMode == 'multiple' && <IcCheck className=\"size-icon\" />}\n                            </>\n                        )}\n                    </span>\n\n                    {children}\n\n                    {renderProps.hasSubmenu && <IcRight className=\"ml-auto size-icon\" />}\n                </>\n            ))}\n        </AriaMenuItem>\n    );\n}\n\ninterface MenuHeaderProps extends React.ComponentProps<typeof AriaHeader> {\n    inset?: boolean;\n    separator?: boolean;\n}\n\nexport function MenuHeader({ className, inset, separator = true, ...props }: MenuHeaderProps) {\n    return (\n        <AriaHeader\n            className={classNames(\n                'px-3 py-1.5 body font-semibold',\n                inset && 'pl-input',\n                separator && '-mx-1 mb-1 border-b border-b-border pb-2.5',\n                className\n            )}\n            {...props}\n        />\n    );\n}\n\nexport function MenuSeparator({ className, ...props }: AriaSeparatorProps) {\n    return <AriaSeparator className={classNames('-mx-1 my-1 h-px bg-muted', className)} {...props} />;\n}\n\nexport function MenuKeyboard({ className, ...props }: React.ComponentProps<typeof AriaKeyboard>) {\n    return <AriaKeyboard className={classNames('ml-auto body-sm tracking-widest opacity-60', className)} {...props} />;\n}\ninterface MenuProps<T>\n    extends AriaMenuProps<T>,\n        VariantProps<typeof buttonVariants>,\n        Omit<AriaMenuTriggerProps, 'children'> {\n    label?: React.ReactNode;\n    isDisabled?: boolean;\n    isNonModal?: boolean;\n}\n// TODO name this better\nexport function EasyMenu<T extends object>({\n    label,\n    children,\n    variant,\n    isDisabled,\n    size,\n    isNonModal,\n    ...props\n}: MenuProps<T>) {\n    return (\n        <MenuTrigger {...props}>\n            <SelectTrigger isDisabled={isDisabled} autoFocus={!!props.autoFocus} variant={variant} size={size}>\n                {label}\n            </SelectTrigger>\n            <MenuPopover className=\"overflow-auto\">\n                <Menu {...props}>{children}</Menu>\n            </MenuPopover>\n        </MenuTrigger>\n    );\n}\n"],"names":["MenuTrigger","AriaMenuTrigger","MenuSubTrigger","AriaSubmenuTrigger","MenuCollection","ListBoxCollection","MenuPopover","className","props","jsx","SelectPopover","composeRenderProps","classNames","Menu","AriaMenu","MenuItem","children","AriaMenuItem","renderProps","jsxs","Fragment","IcDot","IcCheck","IcRight","MenuHeader","inset","separator","AriaHeader","MenuSeparator","AriaSeparator","MenuKeyboard","AriaKeyboard","EasyMenu","label","variant","isDisabled","size","isNonModal","SelectTrigger"],"mappings":"4qBAwBO,MAAMA,EAAcC,EACdC,EAAiBC,EACjBC,EAAiBC,EAEvB,SAASC,EAAY,CAAE,UAAAC,EAAW,GAAGC,GAAuB,CAC/D,OAAOC,EAACC,EAAA,CAAc,UAAWC,EAAmBJ,EAAWA,GAAaK,EAAWL,CAAS,CAAC,EAAI,GAAGC,CAAA,CAAO,CACnH,CAEO,SAASK,EAAuB,CAAE,UAAAN,EAAW,GAAGC,GAA2B,CAC9E,OACIC,EAACK,EAAA,CACG,UAAWF,EAAW,wCAAyCL,CAAS,EACxE,kBAAkB,OACjB,GAAGC,CAAA,CAAA,CAGhB,CAEO,SAASO,EAAS,CAAE,SAAAC,EAAU,UAAAT,EAAW,GAAGC,GAAkE,CACjH,OACIC,EAACQ,EAAA,CACG,UAAWT,EAAM,YAAc,OAAOQ,GAAa,SAAWA,EAAW,QACzE,UAAWL,EAAmBJ,EAAWA,GACrCK,EACI,sDAEA,iCACAL,CAAA,CACJ,EAEH,GAAGC,EAEH,SAAAG,EAAmBK,EAAU,CAACA,EAAUE,IACrCC,EAAAC,EAAA,CACI,SAAA,CAAAX,EAAC,OAAA,CAAK,UAAU,6DACX,SAAAS,EAAY,YACTC,EAAAC,EAAA,CACK,SAAA,CAAAF,EAAY,eAAiB,UAAYT,EAACY,EAAA,CAAM,UAAU,yBAAyB,EACnFH,EAAY,eAAiB,YAAcT,EAACa,EAAA,CAAQ,UAAU,WAAA,CAAY,CAAA,CAAA,CAC/E,CAAA,CAER,EAECN,EAEAE,EAAY,YAAcT,EAACc,EAAA,CAAQ,UAAU,mBAAA,CAAoB,CAAA,EACtE,CACH,CAAA,CAAA,CAGb,CAOO,SAASC,EAAW,CAAE,UAAAjB,EAAW,MAAAkB,EAAO,UAAAC,EAAY,GAAM,GAAGlB,GAA0B,CAC1F,OACIC,EAACkB,EAAA,CACG,UAAWf,EACP,iCACAa,GAAS,WACTC,GAAa,6CACbnB,CAAA,EAEH,GAAGC,CAAA,CAAA,CAGhB,CAEO,SAASoB,EAAc,CAAE,UAAArB,EAAW,GAAGC,GAA6B,CACvE,OAAOC,EAACoB,GAAc,UAAWjB,EAAW,2BAA4BL,CAAS,EAAI,GAAGC,EAAO,CACnG,CAEO,SAASsB,EAAa,CAAE,UAAAvB,EAAW,GAAGC,GAAoD,CAC7F,OAAOC,EAACsB,GAAa,UAAWnB,EAAW,6CAA8CL,CAAS,EAAI,GAAGC,EAAO,CACpH,CAUO,SAASwB,EAA2B,CACvC,MAAAC,EACA,SAAAjB,EACA,QAAAkB,EACA,WAAAC,EACA,KAAAC,EACA,WAAAC,EACA,GAAG7B,CACP,EAAiB,CACb,OACIW,EAACnB,EAAA,CAAa,GAAGQ,EACb,SAAA,CAAAC,EAAC6B,EAAA,CAAc,WAAAH,EAAwB,UAAW,CAAC,CAAC3B,EAAM,UAAW,QAAA0B,EAAkB,KAAAE,EAClF,SAAAH,CAAA,CACL,EACAxB,EAACH,GAAY,UAAU,gBACnB,WAACO,EAAA,CAAM,GAAGL,EAAQ,SAAAQ,CAAA,CAAS,CAAA,CAC/B,CAAA,EACJ,CAER"}

package/dist/components/multi-select.d.ts

@@ -1,7 +1,7 @@
 import { default as React } from 'react';
-import { FormFieldProps } from '../components/field';
 import { EasyMenu } from '../components/menu';
 import { SelectOption } from '../components/select-options';
+import { FormFieldProps } from './form';
 interface MultipleSelectionProps {
     value: Set<string | number>;
     onChange: (v: Set<string | number>) => void;
@@ -9,6 +9,7 @@ interface MultipleSelectionProps {
     items: SelectOption[];
 }
 export interface MultiSelectProps extends MultipleSelectionProps, FormFieldProps, Omit<React.ComponentProps<typeof EasyMenu>, 'label' | 'items'> {
+    triggerLabel?: React.ReactNode;
 }
 export declare function MultiSelect({ items, value, onChange: setValue, label, errorMessage, description, ...props }: MultiSelectProps): import("react/jsx-runtime").JSX.Element;
 export interface TfMultiSelectProps extends Omit<MultiSelectProps, 'value' | 'onChange'> {