@cryptlex/web-components 6.6.5 → 6.6.6-alpha01

package/dist/components/disclosure.js

@@ -1,2 +1,2 @@
-import{jsx as s,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/primitives.js";import{IcDown as b}from"./icons.js";import"class-variance-authority";import"./loader.js";import"clsx";import"lodash-es";function C({children:r,className:o,...e}){let t=c(m)!==null;return s(p,{...e,className:n(o,(a,h)=>i("group",t&&"border-0 border-b last:border-b-0",a)),children:r})}function I({children:r,className:o,...e}){return s(D,{slot:"trigger",type:"button",variant:"ghost",className:i("font-light w-full justify-between",o),...e,children:n(r,t=>l(u,{children:[s("span",{children:t}),s(b,{"aria-hidden":!0,className:i("transition-transform duration-200","group-data-[expanded]:rotate-180")})]}))})}function _({children:r,className:o,...e}){return s(d,{...e,className:"overflow-hidden body-sm transition-all",children:s("div",{className:i("pb-icon pt-2",o),children:r})})}function B({children:r,className:o,...e}){return s(f,{...e,className:n(o,(t,a)=>i("",t)),children:r})}export{C as Disclosure,B as DisclosureGroup,I as DisclosureHeader,_ as DisclosurePanel};
+import{jsx as s,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 $({children:r,className:o,...e}){let t=c(m)!==null;return s(p,{...e,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,...e}){return s(D,{slot:"trigger",type:"button",variant:"ghost",className:i("font-light w-full justify-between",o),...e,children:n(r,t=>l(u,{children:[s("span",{children:t}),s(b,{"aria-hidden":!0,className:i("transition-transform duration-200","group-data-[expanded]:rotate-180")})]}))})}function I({children:r,className:o,...e}){return s(d,{...e,className:"overflow-hidden body-sm transition-all",children:s("div",{className:i("pb-icon pt-2",o),children:r})})}function _({children:r,className:o,...e}){return s(f,{...e,className:n(o,(t,a)=>i("",t)),children:r})}export{$ as Disclosure,_ as DisclosureGroup,C as DisclosureHeader,I 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/primitives';\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\n            slot=\"trigger\"\n            type=\"button\"\n            variant={'ghost'}\n            className={classNames('font-light w-full justify-between', className)}\n            {...props}\n        >\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":"8cAoBO,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,OACII,EAACM,EAAA,CACG,KAAK,UACL,KAAK,SACL,QAAS,QACT,UAAWF,EAAW,oCAAqCT,CAAS,EACnE,GAAGC,EAEH,SAAAM,EAAmBR,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,EACJ,CACH,CAAA,CAAA,CAGb,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\n            slot=\"trigger\"\n            type=\"button\"\n            variant={'ghost'}\n            className={classNames('font-light w-full justify-between', className)}\n            {...props}\n        >\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,OACII,EAACM,EAAA,CACG,KAAK,UACL,KAAK,SACL,QAAS,QACT,UAAWF,EAAW,oCAAqCT,CAAS,EACnE,GAAGC,EAEH,SAAAM,EAAmBR,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,EACJ,CACH,CAAA,CAAA,CAGb,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"}

package/dist/components/field.d.ts

@@ -1,5 +1,5 @@
 import { VariantProps } from 'class-variance-authority';
-import { GroupProps as AriaGroupProps, LabelProps as AriaLabelProps, TextProps as AriaTextProps } from 'react-aria-components';
+import { ButtonProps as AriaButtonProps, GroupProps as AriaGroupProps, LabelProps as AriaLabelProps, TextProps as AriaTextProps } from 'react-aria-components';
 export declare const labelVariants: (props?: import('class-variance-authority/types').ClassProp | undefined) => string;
 export declare function FieldLabel({ className, ...props }: AriaLabelProps): import("react/jsx-runtime").JSX.Element;
 export declare function FieldDescription({ className, children, ...props }: AriaTextProps): import("react/jsx-runtime").JSX.Element;
@@ -19,3 +19,4 @@ export type FormFieldProps = {
 export declare function FormField({ label, description, errorMessage, children, }: FormFieldProps & {
     children: React.ReactNode;
 }): import("react/jsx-runtime").JSX.Element;
+export declare function FormFieldButton({ className, ...props }: AriaButtonProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/field.js

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

package/dist/components/field.js.map

@@ -1 +1 @@
-{"version":3,"file":"field.js","sources":["../../lib/components/field.tsx"],"sourcesContent":["'use client';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport {\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/primitives';\nimport { IcError, IcInfo } from './icons';\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\nexport function FieldLabel({ className, ...props }: AriaLabelProps) {\n    return <AriaLabel className={classNames(labelVariants(), className)} {...props} />;\n}\n\nexport function FieldDescription({ 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// TODO, if we were to use AriaFieldError, it would use the internal ValidationState Context object, which might be useful for composing inputs but\n// this would have significant overlap with what Tanstack Form is already doing for us. It has pros and cons, needs to be discussed and explored.\nexport function FieldError({ 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\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 px-2 ring-offset-background',\n                /* Focus Within */\n                'focus-ring',\n                /* Disabled */\n                'disabled-muted',\n            ],\n            ghost: '',\n        },\n    },\n    defaultVariants: {\n        variant: 'default',\n    },\n});\n\nexport interface GroupProps extends AriaGroupProps, VariantProps<typeof fieldGroupVariants> {}\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\nexport type FormFieldProps = {\n    label?: string;\n    description?: React.ReactNode;\n    errorMessage?: string;\n    // | ((validation: AriaValidationResult) => string)\n};\n\n/** Wrapper for FormFields */\nexport function FormField({\n    label,\n    description,\n    errorMessage,\n    children,\n}: FormFieldProps & {\n    children: React.ReactNode;\n}) {\n    return (\n        <>\n            {label && <FieldLabel>{label}</FieldLabel>}\n            {children}\n            {description && <FieldDescription>{description}</FieldDescription>}\n            {errorMessage && <FieldError>{errorMessage}</FieldError>}\n        </>\n    );\n}\n"],"names":["labelVariants","cva","FieldLabel","className","props","jsx","AriaLabel","classNames","FieldDescription","children","jsxs","AriaText","IcInfo","FieldError","IcError","fieldGroupVariants","FieldGroup","variant","AriaGroup","composeRenderProps","FormField","label","description","errorMessage","Fragment"],"mappings":"6WAgBO,MAAMA,EAAgBC,EAAI,CAC7B,+CAEA,iBAEA,uCACJ,CAAC,EAEM,SAASC,EAAW,CAAE,UAAAC,EAAW,GAAGC,GAAyB,CAChE,OAAOC,EAACC,GAAU,UAAWC,EAAWP,IAAiBG,CAAS,EAAI,GAAGC,EAAO,CACpF,CAEO,SAASI,EAAiB,CAAE,UAAAL,EAAW,SAAAM,EAAU,GAAGL,GAAwB,CAC/E,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,CAGO,SAASC,EAAW,CAAE,UAAAV,EAAW,SAAAM,EAAU,GAAGL,GAA6C,CAC9F,OACIM,EAAC,MAAA,CACG,UAAWH,EACP,mHACAJ,CAAA,EAEH,GAAGC,EAEH,SAAA,CAAAK,EACDJ,EAACS,EAAA,CAAQ,UAAU,qCAAA,CAAsC,CAAA,CAAA,CAAA,CAGrE,CAEO,MAAMC,EAAqBd,EAAI,GAAI,CACtC,SAAU,CACN,QAAS,CACL,QAAS,CACL,yHAEA,aAEA,gBAAA,EAEJ,MAAO,EAAA,CACX,EAEJ,gBAAiB,CACb,QAAS,SAAA,CAEjB,CAAC,EAIM,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,CAUO,SAASgB,EAAU,CACtB,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAd,CACJ,EAEG,CACC,OACIC,EAAAc,EAAA,CACK,SAAA,CAAAH,GAAShB,EAACH,GAAY,SAAAmB,CAAA,CAAM,EAC5BZ,EACAa,GAAejB,EAACG,EAAA,CAAkB,SAAAc,CAAA,CAAY,EAC9CC,GAAgBlB,EAACQ,EAAA,CAAY,SAAAU,CAAA,CAAa,CAAA,EAC/C,CAER"}
+{"version":3,"file":"field.js","sources":["../../lib/components/field.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\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\nexport function FieldLabel({ className, ...props }: AriaLabelProps) {\n    return <AriaLabel className={classNames(labelVariants(), className)} {...props} />;\n}\n\nexport function FieldDescription({ 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// TODO, if we were to use AriaFieldError, it would use the internal ValidationState Context object, which might be useful for composing inputs but\n// this would have significant overlap with what Tanstack Form is already doing for us. It has pros and cons, needs to be discussed and explored.\nexport function FieldError({ 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\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 px-2 ring-offset-background',\n                /* Focus Within */\n                'focus-ring',\n                /* Disabled */\n                'disabled-muted',\n            ],\n            ghost: '',\n        },\n    },\n    defaultVariants: {\n        variant: 'default',\n    },\n});\n\nexport interface GroupProps extends AriaGroupProps, VariantProps<typeof fieldGroupVariants> {}\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\nexport type FormFieldProps = {\n    label?: string;\n    description?: React.ReactNode;\n    errorMessage?: string;\n    // | ((validation: AriaValidationResult) => string)\n};\n\n/** Wrapper for FormFields */\nexport function FormField({\n    label,\n    description,\n    errorMessage,\n    children,\n}: FormFieldProps & {\n    children: React.ReactNode;\n}) {\n    return (\n        <>\n            {label && <FieldLabel>{label}</FieldLabel>}\n            {children}\n            {description && <FieldDescription>{description}</FieldDescription>}\n            {errorMessage && <FieldError>{errorMessage}</FieldError>}\n        </>\n    );\n}\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"],"names":["labelVariants","cva","FieldLabel","className","props","jsx","AriaLabel","classNames","FieldDescription","children","jsxs","AriaText","IcInfo","FieldError","IcError","fieldGroupVariants","FieldGroup","variant","AriaGroup","composeRenderProps","FormField","label","description","errorMessage","Fragment","FormFieldButton","AriaButton"],"mappings":"kWAkBO,MAAMA,EAAgBC,EAAI,CAC7B,+CAEA,iBAEA,uCACJ,CAAC,EAEM,SAASC,EAAW,CAAE,UAAAC,EAAW,GAAGC,GAAyB,CAChE,OAAOC,EAACC,GAAU,UAAWC,EAAWP,IAAiBG,CAAS,EAAI,GAAGC,EAAO,CACpF,CAEO,SAASI,EAAiB,CAAE,UAAAL,EAAW,SAAAM,EAAU,GAAGL,GAAwB,CAC/E,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,CAGO,SAASC,EAAW,CAAE,UAAAV,EAAW,SAAAM,EAAU,GAAGL,GAA6C,CAC9F,OACIM,EAAC,MAAA,CACG,UAAWH,EACP,mHACAJ,CAAA,EAEH,GAAGC,EAEH,SAAA,CAAAK,EACDJ,EAACS,EAAA,CAAQ,UAAU,qCAAA,CAAsC,CAAA,CAAA,CAAA,CAGrE,CAEO,MAAMC,EAAqBd,EAAI,GAAI,CACtC,SAAU,CACN,QAAS,CACL,QAAS,CACL,yHAEA,aAEA,gBAAA,EAEJ,MAAO,EAAA,CACX,EAEJ,gBAAiB,CACb,QAAS,SAAA,CAEjB,CAAC,EAIM,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,CAUO,SAASgB,EAAU,CACtB,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAd,CACJ,EAEG,CACC,OACIC,EAAAc,EAAA,CACK,SAAA,CAAAH,GAAShB,EAACH,GAAY,SAAAmB,CAAA,CAAM,EAC5BZ,EACAa,GAAejB,EAACG,EAAA,CAAkB,SAAAc,CAAA,CAAY,EAC9CC,GAAgBlB,EAACQ,EAAA,CAAY,SAAAU,CAAA,CAAa,CAAA,EAC/C,CAER,CAEO,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"}

package/dist/components/id-search.js

@@ -1,2 +1,2 @@
-import{jsx as r,jsxs as c}from"react/jsx-runtime";import{useQuery as N}from"@tanstack/react-query";import{useId as M,useState as b}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 j,MenuItem as A}from"./menu.js";import{PopoverTrigger as E,Popover as K}from"./popover.js";import{SearchField as L}from"./searchfield.js";import{useFieldContext as p}from"../utilities/form-context.js";import{getFieldErrorMessage as h}from"../utilities/primitives.js";import{FormField as T}from"./field.js";import"class-variance-authority";import"./icons.js";import"./list-box.js";import"./select.js";import"../utilities/form-utils.js";import"@tanstack/react-form";import"clsx";import"lodash-es";function f({label:t,description:n,errorMessage:e,searchFn:i,isDisabled:a,onBlur:g,onChange:D,value:l,renderLabel:S,...I}){const y=M(),[s,C]=b(""),{data:m,isError:d,isFetching:u,error:v}=N({queryKey:[y,s],queryFn:()=>i(s)});return r("div",{className:"group form-field",children:r(T,{label:t,description:n,errorMessage:e,children:c(E,{onOpenChange:o=>{o||g?.(l)},children:[r(F,{className:"min-w-3xs",isDisabled:a,children:S(l,m)}),r(K,{className:"p-2",children:c(x,{inputValue:s,onInputChange:C,children:[r(L,{className:"mb-2",autoFocus:!0}),u&&r("div",{className:"p-input",children:r(B,{className:"mx-auto"})}),!u&&!d&&r(j,{...I,className:"max-h-48",items:m,renderEmptyState:()=>r("div",{className:"body-sm p-2",children:"No results found."}),children:o=>r(A,{id:o.id,children:o.name},o.id)}),d&&r("div",{className:"text-destructive p-icon",children:v.message})]})})]})})})}function _({...t}){return r(f,{selectedKeys:[t.value],onSelectionChange:n=>t.onChange(Array.from(n).filter(e=>typeof e=="string")[0]),renderLabel:(n,e)=>e?.find(i=>i.id===n)?.name??n,selectionMode:"single",...t})}function q({...t}){return r(f,{selectedKeys:t.value,onSelectionChange:n=>t.onChange(Array.from(n).filter(e=>typeof e=="string")),selectionMode:"multiple",renderLabel:(n,e)=>n.map(i=>e?.find(a=>a.id===i)?.name??i).join(","),...t})}function te({isDisabled:t,...n}){const e=p();return r(_,{...n,isDisabled:t||e.form.state.isSubmitting,value:e.state.value,onBlur:i=>e.handleBlur(),onChange:i=>e.handleChange(i),errorMessage:h(e)})}function ie({isDisabled:t,...n}){const e=p();return r(q,{...n,isDisabled:t||e.form.state.isSubmitting,value:e.state.value,onBlur:i=>e.handleBlur(),onChange:i=>e.handleChange(i),errorMessage:h(e)})}export{q as MultipleIdSearchInput,_ as SingleIdSearchInput,ie as TfMultipleIdSearchInput,te as TfSingleIdSearchInput};
+import{jsx as r,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 j,MenuItem as A}from"./menu.js";import{PopoverTrigger as E,Popover as K}from"./popover.js";import{SearchField as L}from"./searchfield.js";import{getFieldErrorMessage as h}from"../utilities/form.js";import{useFieldContext as p}from"../utilities/form-context.js";import{FormField as T}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 f({label:t,description:n,errorMessage:e,searchFn:i,isDisabled:a,onBlur:g,onChange:D,value:l,renderLabel:S,...y}){const I=b(),[s,C]=M(""),{data:m,isError:d,isFetching:u,error:v}=N({queryKey:[I,s],queryFn:()=>i(s)});return r("div",{className:"group form-field",children:r(T,{label:t,description:n,errorMessage:e,children:c(E,{onOpenChange:o=>{o||g?.(l)},children:[r(F,{className:"min-w-3xs",isDisabled:a,children:S(l,m)}),r(K,{className:"p-2",children:c(x,{inputValue:s,onInputChange:C,children:[r(L,{className:"mb-2",autoFocus:!0}),u&&r("div",{className:"p-input",children:r(B,{className:"mx-auto"})}),!u&&!d&&r(j,{...y,className:"max-h-48",items:m,renderEmptyState:()=>r("div",{className:"body-sm p-2",children:"No results found."}),children:o=>r(A,{id:o.id,children:o.name},o.id)}),d&&r("div",{className:"text-destructive p-icon body-sm",children:v.message})]})})]})})})}function _({...t}){return r(f,{selectedKeys:[t.value],onSelectionChange:n=>t.onChange(Array.from(n).filter(e=>typeof e=="string")[0]),renderLabel:(n,e)=>e?.find(i=>i.id===n)?.name??n,selectionMode:"single",...t})}function q({...t}){return r(f,{selectedKeys:t.value,onSelectionChange:n=>t.onChange(Array.from(n).filter(e=>typeof e=="string")),selectionMode:"multiple",renderLabel:(n,e)=>n.map(i=>e?.find(a=>a.id===i)?.name??i).join(","),...t})}function ne({isDisabled:t,...n}){const e=p();return r(_,{...n,isDisabled:t||e.form.state.isSubmitting,value:e.state.value,onBlur:i=>e.handleBlur(),onChange:i=>e.handleChange(i),errorMessage:h(e)})}function te({isDisabled:t,...n}){const e=p();return r(q,{...n,isDisabled:t||e.form.state.isSubmitting,value:e.state.value,onBlur:i=>e.handleBlur(),onChange:i=>e.handleChange(i),errorMessage:h(e)})}export{q as MultipleIdSearchInput,_ as SingleIdSearchInput,te as TfMultipleIdSearchInput,ne 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 { useFieldContext } from '../utilities/form-context';\nimport { getFieldErrorMessage } from '../utilities/primitives';\nimport { FormField, type FormFieldProps } from './field';\n\ntype BaseSearchableResource = {\n    id: string;\n    name: string;\n};\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    searchFn: (q: string) => Promise<T[] | undefined>;\n    isDisabled?: boolean;\n    accessor: keyof BaseSearchableResource;\n    value: V;\n    onBlur?: (v: V) => void;\n    onChange: (v: V) => void;\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={'p-2'}>\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\">{error.message}</div>}\n                        </Autocomplete>\n                    </Popover>\n                </PopoverTrigger>\n            </FormField>\n        </div>\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\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\nexport function TfSingleIdSearchInput({\n    isDisabled,\n    ...props\n}: Omit<React.ComponentProps<typeof SingleIdSearchInput>, 'value' | 'onChange'>) {\n    const field = useFieldContext<string>();\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// TODO, popover alignment should be same as Select\nexport function TfMultipleIdSearchInput({\n    isDisabled,\n    ...props\n}: Omit<React.ComponentProps<typeof MultipleIdSearchInput>, 'value' | 'onChange'>) {\n    const field = useFieldContext<string[]>();\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":"4wBAiBA,SAASA,EAAuD,CAC5D,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAC,EACA,WAAAC,EACA,OAAAC,EACA,SAAAC,EACA,MAAAC,EACA,YAAAC,EACA,GAAGC,CACP,EAQoE,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,MAChB,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,0BAA2B,WAAM,OAAA,CAAQ,CAAA,CAAA,CACxE,CAAA,CACJ,CAAA,CAAA,CAAA,EAER,CAAA,CACJ,CAER,CAEO,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,CAEO,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,CAEO,SAAS8B,GAAsB,CAClC,WAAAnC,EACA,GAAGK,CACP,EAAiF,CAC7E,MAAM+B,EAAQC,EAAA,EACd,OACIrB,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,CAEO,SAASI,GAAwB,CACpC,WAAAxC,EACA,GAAGK,CACP,EAAmF,CAC/E,MAAM+B,EAAQC,EAAA,EACd,OACIrB,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 { 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\ntype BaseSearchableResource = {\n    id: string;\n    name: string;\n};\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    searchFn: (q: string) => Promise<T[] | undefined>;\n    isDisabled?: boolean;\n    accessor: keyof BaseSearchableResource;\n    value: V;\n    onBlur?: (v: V) => void;\n    onChange: (v: V) => void;\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={'p-2'}>\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\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\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\nexport function TfSingleIdSearchInput({\n    isDisabled,\n    ...props\n}: Omit<React.ComponentProps<typeof SingleIdSearchInput>, 'value' | 'onChange'>) {\n    const field = useFieldContext<string>();\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// TODO, popover alignment should be same as Select\nexport function TfMultipleIdSearchInput({\n    isDisabled,\n    ...props\n}: Omit<React.ComponentProps<typeof MultipleIdSearchInput>, 'value' | 'onChange'>) {\n    const field = useFieldContext<string[]>();\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":"+uBAiBA,SAASA,EAAuD,CAC5D,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAC,EACA,WAAAC,EACA,OAAAC,EACA,SAAAC,EACA,MAAAC,EACA,YAAAC,EACA,GAAGC,CACP,EAQoE,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,MAChB,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,CAEO,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,CAEO,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,CAEO,SAAS8B,GAAsB,CAClC,WAAAnC,EACA,GAAGK,CACP,EAAiF,CAC7E,MAAM+B,EAAQC,EAAA,EACd,OACIrB,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,CAEO,SAASI,GAAwB,CACpC,WAAAxC,EACA,GAAGK,CACP,EAAmF,CAC/E,MAAM+B,EAAQC,EAAA,EACd,OACIrB,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"}

package/dist/components/list-box.js

@@ -1,2 +1,2 @@
-import{jsx as o,jsxs as m,Fragment as p}from"react/jsx-runtime";import{ListBoxItem as l,composeRenderProps as r,Collection as c,ListBox as u,Header as d}from"react-aria-components";import{classNames as n}from"../utilities/primitives.js";import{IcCheck as x}from"./icons.js";import"clsx";import"lodash-es";import"react";const v=c;function I({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 h({className:e,children:t,...s}){return o(l,{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(p,{children:[a.isSelected&&o("span",{className:"absolute left-2 flex size-icon items-center justify-center",children:o(x,{className:"size-icon"})}),i]}))})}function j({className:e,...t}){return o(d,{className:n("py-1.5 pl-input pr-2 body font-semibold",e),...t})}export{I as ListBox,v as ListBoxCollection,j as ListBoxHeader,h 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 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};
 //# 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/primitives';\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":"+TAaO,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 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"}

package/dist/components/loader.js

@@ -1,2 +1,2 @@
-import{jsx as r}from"react/jsx-runtime";import{classNames as m}from"../utilities/primitives.js";import{IcLoader as t}from"./icons.js";import"clsx";import"lodash-es";import"react";function c({className:o}){return r(t,{className:m("animate-spin size-icon text-foreground",o)})}export{c as Loader};
+import{jsx as r}from"react/jsx-runtime";import{classNames as m}from"../utilities/theme.js";import{IcLoader as t}from"./icons.js";import"clsx";import"react";function p({className:o}){return r(t,{className:m("animate-spin size-icon text-foreground",o)})}export{p as Loader};
 //# sourceMappingURL=loader.js.map

package/dist/components/loader.js.map

@@ -1 +1 @@
-{"version":3,"file":"loader.js","sources":["../../lib/components/loader.tsx"],"sourcesContent":["import { classNames } from '../utilities/primitives';\nimport { IcLoader } from './icons';\n\ninterface LoaderProps {\n    className?: string; // Define props interface\n}\n\nexport function Loader({ className }: LoaderProps) {\n    return <IcLoader className={classNames(`animate-spin size-icon text-foreground`, className)} />;\n}\n"],"names":["Loader","className","IcLoader","classNames"],"mappings":"mLAOO,SAASA,EAAO,CAAE,UAAAC,GAA0B,CAC/C,SAAQC,EAAA,CAAS,UAAWC,EAAW,yCAA0CF,CAAS,EAAG,CACjG"}
+{"version":3,"file":"loader.js","sources":["../../lib/components/loader.tsx"],"sourcesContent":["import { classNames } from '../utilities/theme';\nimport { IcLoader } from './icons';\n\ninterface LoaderProps {\n    className?: string; // Define props interface\n}\n\nexport function Loader({ className }: LoaderProps) {\n    return <IcLoader className={classNames(`animate-spin size-icon text-foreground`, className)} />;\n}\n"],"names":["Loader","className","IcLoader","classNames"],"mappings":"4JAOO,SAASA,EAAO,CAAE,UAAAC,GAA0B,CAC/C,SAAQC,EAAA,CAAS,UAAWC,EAAW,yCAA0CF,CAAS,EAAG,CACjG"}

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 a,Menu as d,SubmenuTrigger as b,Header as M,Separator as g,Keyboard as y}from"react-aria-components";import{classNames as m}from"../utilities/primitives.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"lodash-es";import"class-variance-authority";import"./loader.js";import"react";import"./field.js";import"../utilities/form-utils.js";import"../utilities/form-context.js";import"@tanstack/react-form";import"./popover.js";const T=p,O=b,P=S;function j({className:e,...t}){return o(I,{className:a(e,r=>m(r)),...t})}function z({className:e,...t}){return o(d,{className:m("overflow-auto p-1 outline-0 body-base",e),escapeKeyBehavior:"none",...t})}function Q({children:e,className:t,...r}){return o(f,{textValue:r.textValue||(typeof e=="string"?e:void 0),className:a(t,n=>m("btn btn-ghost relative flex justify-start input-dim","data-[selection-mode]:pl-input",n)),...r,children:a(e,(n,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"})]})}),n,i.hasSubmenu&&o(v,{className:"ml-auto size-icon"})]}))})}function U({className:e,inset:t,separator:r=!0,...n}){return o(M,{className:m("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 W({className:e,...t}){return o(g,{className:m("-mx-1 my-1 h-px bg-muted",e),...t})}function X({className:e,...t}){return o(y,{className:m("ml-auto body-sm tracking-widest opacity-60",e),...t})}function Y({label:e,children:t,variant:r,isDisabled:n,size:i,isNonModal:l,...u}){return s(T,{...u,children:[o(x,{isDisabled:n,type:"button",variant:r,size:i,children:e}),o(j,{isNonModal:l,className:"overflow-auto",children:o(z,{...u,children:t})})]})}export{Y as EasyMenu,z as Menu,P as MenuCollection,U as MenuHeader,Q as MenuItem,X as MenuKeyboard,j as MenuPopover,W as MenuSeparator,O as MenuSubTrigger,T as MenuTrigger};
+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};
 //# 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/primitives';\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} 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":"wsBAwBO,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,GAAO,WAAAH,EAAwB,KAAK,SAAS,QAAAD,EAAkB,KAAAE,EAC3D,SAAAH,EACL,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 { 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"}

package/dist/components/multi-select.js

@@ -1,2 +1,2 @@
-import{jsx as i}from"react/jsx-runtime";import{FormField as d}from"./field.js";import{EasyMenu as a,MenuItem as p}from"./menu.js";import{useTfFieldContext as f}from"../utilities/form-utils.js";import{getFieldErrorMessage as u}from"../utilities/primitives.js";import"class-variance-authority";import"react-aria-components";import"./icons.js";import"react";import"./button.js";import"./loader.js";import"./list-box.js";import"./select.js";import"./popover.js";import"../utilities/form-context.js";import"@tanstack/react-form";import"clsx";import"lodash-es";function c({items:o,value:e,onChange:t,label:l,errorMessage:n,description:m,...s}){return i("div",{className:"group form-field",children:i(d,{label:l,description:m,errorMessage:n,children:i(a,{isNonModal:!1,selectionMode:"multiple",selectedKeys:e,onSelectionChange:r=>{typeof r!="string"&&t(r)},items:o,label:e.size,...s,children:r=>i(p,{id:r.id,isDisabled:r?.disabled,children:r.label},r.id)})})})}function B({...o}){const e=f({disabled:o.isDisabled});return i(c,{value:new Set(e.state.value),onChange:t=>e.setValue(Array.from(t)),onClose:e.handleBlur,errorMessage:u(e),...o})}export{c as MultiSelect,B as TfMultiSelect};
+import{jsx as i}from"react/jsx-runtime";import{FormField as d}from"./field.js";import{EasyMenu as a,MenuItem as p}from"./menu.js";import{useTfFieldContext as f,getFieldErrorMessage as u}from"../utilities/form.js";import"class-variance-authority";import"react-aria-components";import"../utilities/theme.js";import"clsx";import"./icons.js";import"react";import"./button.js";import"./loader.js";import"./list-box.js";import"./select.js";import"./popover.js";import"../utilities/form-context.js";import"@tanstack/react-form";function c({items:o,value:e,onChange:t,label:l,errorMessage:n,description:s,...m}){return i("div",{className:"group form-field",children:i(d,{label:l,description:s,errorMessage:n,children:i(a,{isNonModal:!1,selectionMode:"multiple",selectedKeys:e,onSelectionChange:r=>{typeof r!="string"&&t(r)},items:o,label:e.size,...m,children:r=>i(p,{id:r.id,isDisabled:r?.disabled,children:r.label},r.id)})})})}function A({...o}){const e=f({disabled:o.isDisabled});return i(c,{value:new Set(e.state.value),onChange:t=>e.setValue(Array.from(t)),onClose:e.handleBlur,errorMessage:u(e),...o})}export{c as MultiSelect,A as TfMultiSelect};
 //# sourceMappingURL=multi-select.js.map

package/dist/components/multi-select.js.map

@@ -1 +1 @@
-{"version":3,"file":"multi-select.js","sources":["../../lib/components/multi-select.tsx"],"sourcesContent":["import React from 'react';\nimport { FormField, type FormFieldProps } from '../components/field';\nimport { EasyMenu, MenuItem } from '../components/menu';\nimport type { SelectOption } from '../components/select-options';\nimport { useTfFieldContext } from '../utilities/form-utils';\nimport { getFieldErrorMessage } from '../utilities/primitives';\n\ninterface MultipleSelectionProps {\n    value: Set<string | number>;\n    onChange: (v: Set<string | number>) => void;\n    buttonLabel?: React.ReactNode;\n    items: SelectOption[];\n}\n\nexport interface MultiSelectProps\n    extends MultipleSelectionProps,\n        FormFieldProps,\n        Omit<React.ComponentProps<typeof EasyMenu>, 'label' | 'items'> {}\n\nexport function MultiSelect({\n    items,\n    value,\n    onChange: setValue,\n    label,\n    errorMessage,\n    description,\n    ...props\n}: MultiSelectProps) {\n    return (\n        <div className=\"group form-field\">\n            <FormField {...{ label, description, errorMessage }}>\n                <EasyMenu\n                    isNonModal={false}\n                    selectionMode=\"multiple\"\n                    selectedKeys={value}\n                    onSelectionChange={v => {\n                        if (typeof v === 'string') return;\n                        setValue(v);\n                    }}\n                    items={items}\n                    label={value.size}\n                    {...props}\n                >\n                    {item => (\n                        <MenuItem id={item.id} key={item.id} isDisabled={item?.disabled}>\n                            {item.label}\n                        </MenuItem>\n                    )}\n                </EasyMenu>\n            </FormField>\n        </div>\n    );\n}\n\nexport interface TfMultiSelectProps extends Omit<MultiSelectProps, 'value' | 'onChange'> {}\nexport function TfMultiSelect({ ...props }: TfMultiSelectProps) {\n    const field = useTfFieldContext<string[]>({\n        disabled: props.isDisabled,\n    });\n\n    return (\n        <MultiSelect\n            value={new Set(field.state.value)}\n            // @ts-expect-error\n            onChange={e => field.setValue(Array.from(e))}\n            onClose={field.handleBlur}\n            errorMessage={getFieldErrorMessage(field)}\n            {...props}\n        />\n    );\n}\n"],"names":["MultiSelect","items","value","setValue","label","errorMessage","description","props","jsx","FormField","EasyMenu","v","item","MenuItem","TfMultiSelect","field","useTfFieldContext","e","getFieldErrorMessage"],"mappings":"2iBAmBO,SAASA,EAAY,CACxB,MAAAC,EACA,MAAAC,EACA,SAAUC,EACV,MAAAC,EACA,aAAAC,EACA,YAAAC,EACA,GAAGC,CACP,EAAqB,CACjB,OACIC,EAAC,MAAA,CAAI,UAAU,mBACX,SAAAA,EAACC,EAAA,CAAgB,MAAAL,EAAO,YAAAE,EAAa,aAAAD,EACjC,SAAAG,EAACE,EAAA,CACG,WAAY,GACZ,cAAc,WACd,aAAcR,EACd,kBAAmBS,GAAK,CAChB,OAAOA,GAAM,UACjBR,EAASQ,CAAC,CACd,EACA,MAAAV,EACA,MAAOC,EAAM,KACZ,GAAGK,EAEH,SAAAK,GACGJ,EAACK,EAAA,CAAS,GAAID,EAAK,GAAkB,WAAYA,GAAM,SAClD,SAAAA,EAAK,KAAA,EADkBA,EAAK,EAEjC,CAAA,CAAA,EAGZ,CAAA,CACJ,CAER,CAGO,SAASE,EAAc,CAAE,GAAGP,GAA6B,CAC5D,MAAMQ,EAAQC,EAA4B,CACtC,SAAUT,EAAM,UAAA,CACnB,EAED,OACIC,EAACR,EAAA,CACG,MAAO,IAAI,IAAIe,EAAM,MAAM,KAAK,EAEhC,SAAUE,GAAKF,EAAM,SAAS,MAAM,KAAKE,CAAC,CAAC,EAC3C,QAASF,EAAM,WACf,aAAcG,EAAqBH,CAAK,EACvC,GAAGR,CAAA,CAAA,CAGhB"}
+{"version":3,"file":"multi-select.js","sources":["../../lib/components/multi-select.tsx"],"sourcesContent":["import React from 'react';\nimport { FormField, type FormFieldProps } from '../components/field';\nimport { EasyMenu, MenuItem } from '../components/menu';\nimport type { SelectOption } from '../components/select-options';\nimport { getFieldErrorMessage, useTfFieldContext } from '../utilities/form';\n\ninterface MultipleSelectionProps {\n    value: Set<string | number>;\n    onChange: (v: Set<string | number>) => void;\n    buttonLabel?: React.ReactNode;\n    items: SelectOption[];\n}\n\nexport interface MultiSelectProps\n    extends MultipleSelectionProps,\n        FormFieldProps,\n        Omit<React.ComponentProps<typeof EasyMenu>, 'label' | 'items'> {}\n\nexport function MultiSelect({\n    items,\n    value,\n    onChange: setValue,\n    label,\n    errorMessage,\n    description,\n    ...props\n}: MultiSelectProps) {\n    return (\n        <div className=\"group form-field\">\n            <FormField {...{ label, description, errorMessage }}>\n                <EasyMenu\n                    isNonModal={false}\n                    selectionMode=\"multiple\"\n                    selectedKeys={value}\n                    onSelectionChange={v => {\n                        if (typeof v === 'string') return;\n                        setValue(v);\n                    }}\n                    items={items}\n                    label={value.size}\n                    {...props}\n                >\n                    {item => (\n                        <MenuItem id={item.id} key={item.id} isDisabled={item?.disabled}>\n                            {item.label}\n                        </MenuItem>\n                    )}\n                </EasyMenu>\n            </FormField>\n        </div>\n    );\n}\n\nexport interface TfMultiSelectProps extends Omit<MultiSelectProps, 'value' | 'onChange'> {}\nexport function TfMultiSelect({ ...props }: TfMultiSelectProps) {\n    const field = useTfFieldContext<string[]>({\n        disabled: props.isDisabled,\n    });\n\n    return (\n        <MultiSelect\n            value={new Set(field.state.value)}\n            // @ts-expect-error\n            onChange={e => field.setValue(Array.from(e))}\n            onClose={field.handleBlur}\n            errorMessage={getFieldErrorMessage(field)}\n            {...props}\n        />\n    );\n}\n"],"names":["MultiSelect","items","value","setValue","label","errorMessage","description","props","jsx","FormField","EasyMenu","v","item","MenuItem","TfMultiSelect","field","useTfFieldContext","e","getFieldErrorMessage"],"mappings":"ygBAkBO,SAASA,EAAY,CACxB,MAAAC,EACA,MAAAC,EACA,SAAUC,EACV,MAAAC,EACA,aAAAC,EACA,YAAAC,EACA,GAAGC,CACP,EAAqB,CACjB,OACIC,EAAC,MAAA,CAAI,UAAU,mBACX,SAAAA,EAACC,EAAA,CAAgB,MAAAL,EAAO,YAAAE,EAAa,aAAAD,EACjC,SAAAG,EAACE,EAAA,CACG,WAAY,GACZ,cAAc,WACd,aAAcR,EACd,kBAAmBS,GAAK,CAChB,OAAOA,GAAM,UACjBR,EAASQ,CAAC,CACd,EACA,MAAAV,EACA,MAAOC,EAAM,KACZ,GAAGK,EAEH,SAAAK,GACGJ,EAACK,EAAA,CAAS,GAAID,EAAK,GAAkB,WAAYA,GAAM,SAClD,SAAAA,EAAK,KAAA,EADkBA,EAAK,EAEjC,CAAA,CAAA,EAGZ,CAAA,CACJ,CAER,CAGO,SAASE,EAAc,CAAE,GAAGP,GAA6B,CAC5D,MAAMQ,EAAQC,EAA4B,CACtC,SAAUT,EAAM,UAAA,CACnB,EAED,OACIC,EAACR,EAAA,CACG,MAAO,IAAI,IAAIe,EAAM,MAAM,KAAK,EAEhC,SAAUE,GAAKF,EAAM,SAAS,MAAM,KAAKE,CAAC,CAAC,EAC3C,QAASF,EAAM,WACf,aAAcG,EAAqBH,CAAK,EACvC,GAAGR,CAAA,CAAA,CAGhB"}

package/dist/components/numberfield.js

@@ -1,2 +1,2 @@
-import{jsx as r,jsxs as d}from"react/jsx-runtime";import{NumberField as c,composeRenderProps as n,Input as p}from"react-aria-components";import{Button as f}from"./button.js";import{useTfFieldContext as b}from"../utilities/form-utils.js";import{getFieldErrorMessage as l,classNames as i}from"../utilities/primitives.js";import{FormField as h,FieldGroup as N}from"./field.js";import{IcUp as g,IcDown as F}from"./icons.js";import"class-variance-authority";import"./loader.js";import"react";import"../utilities/form-context.js";import"@tanstack/react-form";import"clsx";import"lodash-es";const x=c;function v({className:o,...t}){return r(p,{className:n(o,e=>i("w-fit min-w-0 flex-1 border-r border-transparent bg-popover pr-2 outline-0 placeholder:text-muted-foreground [&::-webkit-search-cancel-button]:hidden",e)),...t})}function w({className:o,...t}){return d("div",{className:i("absolute right-0 flex h-full flex-col border-l",o),...t,children:[r(m,{slot:"increment",children:r(g,{"aria-hidden":!0,className:"size-icon"})}),r("div",{className:"border-b"}),r(m,{slot:"decrement",children:r(F,{"aria-hidden":!0,className:"size-icon"})})]})}function m({className:o,...t}){return r(f,{className:n(o,e=>i("w-auto grow h-3 px-0.5 text-muted-foreground",e)),variant:"ghost",size:"none",...t})}function I({label:o,description:t,errorMessage:e,className:s,...a}){return r(x,{className:n(s,u=>i("group form-field",u)),...a,children:r(h,{label:o,description:t,errorMessage:e,children:d(N,{children:[r(v,{}),r(w,{})]})})})}function U({isDisabled:o,...t}){const e=b({disabled:o});return r(I,{isInvalid:!!l(e),isDisabled:o||e.form.state.isSubmitting,value:e.state.value,id:e.name,onChange:e.handleChange,onBlur:e.handleBlur,errorMessage:l(e),...t})}export{I as NumberField,U as TfNumberField};
+import{jsx as r,jsxs as d}from"react/jsx-runtime";import{NumberField as c,composeRenderProps as n,Input as p}from"react-aria-components";import{Button as f}from"./button.js";import{useTfFieldContext as b,getFieldErrorMessage as l}from"../utilities/form.js";import{classNames as i}from"../utilities/theme.js";import{FormField as h,FieldGroup as N}from"./field.js";import{IcUp as g,IcDown as F}from"./icons.js";import"class-variance-authority";import"./loader.js";import"react";import"../utilities/form-context.js";import"@tanstack/react-form";import"clsx";const x=c;function v({className:o,...t}){return r(p,{className:n(o,e=>i("w-fit min-w-0 flex-1 border-r border-transparent bg-popover pr-2 outline-0 placeholder:text-muted-foreground [&::-webkit-search-cancel-button]:hidden",e)),...t})}function w({className:o,...t}){return d("div",{className:i("absolute right-0 flex h-full flex-col border-l",o),...t,children:[r(m,{slot:"increment",children:r(g,{"aria-hidden":!0,className:"size-icon"})}),r("div",{className:"border-b"}),r(m,{slot:"decrement",children:r(F,{"aria-hidden":!0,className:"size-icon"})})]})}function m({className:o,...t}){return r(f,{className:n(o,e=>i("w-auto grow h-3 px-0.5 text-muted-foreground",e)),variant:"ghost",size:"none",...t})}function I({label:o,description:t,errorMessage:e,className:s,...a}){return r(x,{className:n(s,u=>i("group form-field",u)),...a,children:r(h,{label:o,description:t,errorMessage:e,children:d(N,{children:[r(v,{}),r(w,{})]})})})}function R({isDisabled:o,...t}){const e=b({disabled:o});return r(I,{isInvalid:!!l(e),isDisabled:o||e.form.state.isSubmitting,value:e.state.value,id:e.name,onChange:e.handleChange,onBlur:e.handleBlur,errorMessage:l(e),...t})}export{I as NumberField,R as TfNumberField};
 //# sourceMappingURL=numberfield.js.map

package/dist/components/numberfield.js.map

@@ -1 +1 @@
-{"version":3,"file":"numberfield.js","sources":["../../lib/components/numberfield.tsx"],"sourcesContent":["import {\n    ButtonProps as AriaButtonProps,\n    Input as AriaInput,\n    InputProps as AriaInputProps,\n    NumberField as AriaNumberField,\n    NumberFieldProps as AriaNumberFieldProps,\n    composeRenderProps,\n} from 'react-aria-components';\n\nimport { Button } from '../components/button';\nimport { useTfFieldContext } from '../utilities/form-utils';\nimport { classNames, getFieldErrorMessage } from '../utilities/primitives';\nimport { FieldGroup, FormField, type FormFieldProps } from './field';\nimport { IcDown, IcUp } from './icons';\n\nconst ANumberField = AriaNumberField;\n\nfunction NumberFieldInput({ className, ...props }: AriaInputProps) {\n    return (\n        <AriaInput\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'w-fit min-w-0 flex-1 border-r border-transparent bg-popover pr-2 outline-0 placeholder:text-muted-foreground [&::-webkit-search-cancel-button]:hidden',\n                    className\n                )\n            )}\n            {...props}\n        />\n    );\n}\n\nfunction NumberFieldSteppers({ className, ...props }: React.ComponentProps<'div'>) {\n    return (\n        <div className={classNames('absolute right-0 flex h-full flex-col border-l', className)} {...props}>\n            <NumberFieldStepper slot=\"increment\">\n                <IcUp aria-hidden className=\"size-icon\" />\n            </NumberFieldStepper>\n            <div className=\"border-b\" />\n            <NumberFieldStepper slot=\"decrement\">\n                <IcDown aria-hidden className=\"size-icon\" />\n            </NumberFieldStepper>\n        </div>\n    );\n}\n\nfunction NumberFieldStepper({ className, ...props }: AriaButtonProps) {\n    return (\n        <Button\n            className={composeRenderProps(className, className =>\n                classNames('w-auto grow h-3 px-0.5 text-muted-foreground', className)\n            )}\n            variant={'ghost'}\n            size={'none'}\n            {...props}\n        />\n    );\n}\n\ntype NumberFieldProps = AriaNumberFieldProps & FormFieldProps;\nexport function NumberField({ label, description, errorMessage, className, ...props }: NumberFieldProps) {\n    return (\n        <ANumberField\n            className={composeRenderProps(className, className => classNames('group form-field', className))}\n            {...props}\n        >\n            <FormField label={label} description={description} errorMessage={errorMessage}>\n                <FieldGroup>\n                    <NumberFieldInput />\n                    <NumberFieldSteppers />\n                </FieldGroup>\n            </FormField>\n        </ANumberField>\n    );\n}\n\nexport function TfNumberField({\n    isDisabled,\n    ...props\n}: Omit<React.ComponentProps<typeof NumberField>, 'value' | 'id' | 'onChange' | 'onBlur'>) {\n    const field = useTfFieldContext<number>({ disabled: isDisabled });\n\n    return (\n        <NumberField\n            isInvalid={!!getFieldErrorMessage(field)}\n            isDisabled={isDisabled || field.form.state.isSubmitting}\n            value={field.state.value}\n            id={field.name}\n            onChange={field.handleChange}\n            onBlur={field.handleBlur}\n            errorMessage={getFieldErrorMessage(field)}\n            {...props}\n        />\n    );\n}\n"],"names":["ANumberField","AriaNumberField","NumberFieldInput","className","props","jsx","AriaInput","composeRenderProps","classNames","NumberFieldSteppers","jsxs","NumberFieldStepper","IcUp","IcDown","Button","NumberField","label","description","errorMessage","FormField","FieldGroup","TfNumberField","isDisabled","field","useTfFieldContext","getFieldErrorMessage"],"mappings":"wkBAeA,MAAMA,EAAeC,EAErB,SAASC,EAAiB,CAAE,UAAAC,EAAW,GAAGC,GAAyB,CAC/D,OACIC,EAACC,EAAA,CACG,UAAWC,EAAmBJ,EAAWA,GACrCK,EACI,wJACAL,CAAA,CACJ,EAEH,GAAGC,CAAA,CAAA,CAGhB,CAEA,SAASK,EAAoB,CAAE,UAAAN,EAAW,GAAGC,GAAsC,CAC/E,OACIM,EAAC,OAAI,UAAWF,EAAW,iDAAkDL,CAAS,EAAI,GAAGC,EACzF,SAAA,CAAAC,EAACM,EAAA,CAAmB,KAAK,YACrB,SAAAN,EAACO,GAAK,cAAW,GAAC,UAAU,WAAA,CAAY,CAAA,CAC5C,EACAP,EAAC,MAAA,CAAI,UAAU,UAAA,CAAW,EAC1BA,EAACM,EAAA,CAAmB,KAAK,YACrB,SAAAN,EAACQ,GAAO,cAAW,GAAC,UAAU,WAAA,CAAY,CAAA,CAC9C,CAAA,EACJ,CAER,CAEA,SAASF,EAAmB,CAAE,UAAAR,EAAW,GAAGC,GAA0B,CAClE,OACIC,EAACS,EAAA,CACG,UAAWP,EAAmBJ,EAAWA,GACrCK,EAAW,+CAAgDL,CAAS,CAAA,EAExE,QAAS,QACT,KAAM,OACL,GAAGC,CAAA,CAAA,CAGhB,CAGO,SAASW,EAAY,CAAE,MAAAC,EAAO,YAAAC,EAAa,aAAAC,EAAc,UAAAf,EAAW,GAAGC,GAA2B,CACrG,OACIC,EAACL,EAAA,CACG,UAAWO,EAAmBJ,EAAWA,GAAaK,EAAW,mBAAoBL,CAAS,CAAC,EAC9F,GAAGC,EAEJ,WAACe,EAAA,CAAU,MAAAH,EAAc,YAAAC,EAA0B,aAAAC,EAC/C,WAACE,EAAA,CACG,SAAA,CAAAf,EAACH,EAAA,EAAiB,IACjBO,EAAA,CAAA,CAAoB,CAAA,CAAA,CACzB,CAAA,CACJ,CAAA,CAAA,CAGZ,CAEO,SAASY,EAAc,CAC1B,WAAAC,EACA,GAAGlB,CACP,EAA2F,CACvF,MAAMmB,EAAQC,EAA0B,CAAE,SAAUF,EAAY,EAEhE,OACIjB,EAACU,EAAA,CACG,UAAW,CAAC,CAACU,EAAqBF,CAAK,EACvC,WAAYD,GAAcC,EAAM,KAAK,MAAM,aAC3C,MAAOA,EAAM,MAAM,MACnB,GAAIA,EAAM,KACV,SAAUA,EAAM,aAChB,OAAQA,EAAM,WACd,aAAcE,EAAqBF,CAAK,EACvC,GAAGnB,CAAA,CAAA,CAGhB"}
+{"version":3,"file":"numberfield.js","sources":["../../lib/components/numberfield.tsx"],"sourcesContent":["import {\n    ButtonProps as AriaButtonProps,\n    Input as AriaInput,\n    InputProps as AriaInputProps,\n    NumberField as AriaNumberField,\n    NumberFieldProps as AriaNumberFieldProps,\n    composeRenderProps,\n} from 'react-aria-components';\n\nimport { Button } from '../components/button';\nimport { getFieldErrorMessage, useTfFieldContext } from '../utilities/form';\nimport { classNames } from '../utilities/theme';\nimport { FieldGroup, FormField, type FormFieldProps } from './field';\nimport { IcDown, IcUp } from './icons';\n\nconst ANumberField = AriaNumberField;\n\nfunction NumberFieldInput({ className, ...props }: AriaInputProps) {\n    return (\n        <AriaInput\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'w-fit min-w-0 flex-1 border-r border-transparent bg-popover pr-2 outline-0 placeholder:text-muted-foreground [&::-webkit-search-cancel-button]:hidden',\n                    className\n                )\n            )}\n            {...props}\n        />\n    );\n}\n\nfunction NumberFieldSteppers({ className, ...props }: React.ComponentProps<'div'>) {\n    return (\n        <div className={classNames('absolute right-0 flex h-full flex-col border-l', className)} {...props}>\n            <NumberFieldStepper slot=\"increment\">\n                <IcUp aria-hidden className=\"size-icon\" />\n            </NumberFieldStepper>\n            <div className=\"border-b\" />\n            <NumberFieldStepper slot=\"decrement\">\n                <IcDown aria-hidden className=\"size-icon\" />\n            </NumberFieldStepper>\n        </div>\n    );\n}\n\nfunction NumberFieldStepper({ className, ...props }: AriaButtonProps) {\n    return (\n        <Button\n            className={composeRenderProps(className, className =>\n                classNames('w-auto grow h-3 px-0.5 text-muted-foreground', className)\n            )}\n            variant={'ghost'}\n            size={'none'}\n            {...props}\n        />\n    );\n}\n\ntype NumberFieldProps = AriaNumberFieldProps & FormFieldProps;\nexport function NumberField({ label, description, errorMessage, className, ...props }: NumberFieldProps) {\n    return (\n        <ANumberField\n            className={composeRenderProps(className, className => classNames('group form-field', className))}\n            {...props}\n        >\n            <FormField label={label} description={description} errorMessage={errorMessage}>\n                <FieldGroup>\n                    <NumberFieldInput />\n                    <NumberFieldSteppers />\n                </FieldGroup>\n            </FormField>\n        </ANumberField>\n    );\n}\n\nexport function TfNumberField({\n    isDisabled,\n    ...props\n}: Omit<React.ComponentProps<typeof NumberField>, 'value' | 'id' | 'onChange' | 'onBlur'>) {\n    const field = useTfFieldContext<number>({ disabled: isDisabled });\n\n    return (\n        <NumberField\n            isInvalid={!!getFieldErrorMessage(field)}\n            isDisabled={isDisabled || field.form.state.isSubmitting}\n            value={field.state.value}\n            id={field.name}\n            onChange={field.handleChange}\n            onBlur={field.handleBlur}\n            errorMessage={getFieldErrorMessage(field)}\n            {...props}\n        />\n    );\n}\n"],"names":["ANumberField","AriaNumberField","NumberFieldInput","className","props","jsx","AriaInput","composeRenderProps","classNames","NumberFieldSteppers","jsxs","NumberFieldStepper","IcUp","IcDown","Button","NumberField","label","description","errorMessage","FormField","FieldGroup","TfNumberField","isDisabled","field","useTfFieldContext","getFieldErrorMessage"],"mappings":"2iBAeA,MAAMA,EAAeC,EAErB,SAASC,EAAiB,CAAE,UAAAC,EAAW,GAAGC,GAAyB,CAC/D,OACIC,EAACC,EAAA,CACG,UAAWC,EAAmBJ,EAAWA,GACrCK,EACI,wJACAL,CAAA,CACJ,EAEH,GAAGC,CAAA,CAAA,CAGhB,CAEA,SAASK,EAAoB,CAAE,UAAAN,EAAW,GAAGC,GAAsC,CAC/E,OACIM,EAAC,OAAI,UAAWF,EAAW,iDAAkDL,CAAS,EAAI,GAAGC,EACzF,SAAA,CAAAC,EAACM,EAAA,CAAmB,KAAK,YACrB,SAAAN,EAACO,GAAK,cAAW,GAAC,UAAU,WAAA,CAAY,CAAA,CAC5C,EACAP,EAAC,MAAA,CAAI,UAAU,UAAA,CAAW,EAC1BA,EAACM,EAAA,CAAmB,KAAK,YACrB,SAAAN,EAACQ,GAAO,cAAW,GAAC,UAAU,WAAA,CAAY,CAAA,CAC9C,CAAA,EACJ,CAER,CAEA,SAASF,EAAmB,CAAE,UAAAR,EAAW,GAAGC,GAA0B,CAClE,OACIC,EAACS,EAAA,CACG,UAAWP,EAAmBJ,EAAWA,GACrCK,EAAW,+CAAgDL,CAAS,CAAA,EAExE,QAAS,QACT,KAAM,OACL,GAAGC,CAAA,CAAA,CAGhB,CAGO,SAASW,EAAY,CAAE,MAAAC,EAAO,YAAAC,EAAa,aAAAC,EAAc,UAAAf,EAAW,GAAGC,GAA2B,CACrG,OACIC,EAACL,EAAA,CACG,UAAWO,EAAmBJ,EAAWA,GAAaK,EAAW,mBAAoBL,CAAS,CAAC,EAC9F,GAAGC,EAEJ,WAACe,EAAA,CAAU,MAAAH,EAAc,YAAAC,EAA0B,aAAAC,EAC/C,WAACE,EAAA,CACG,SAAA,CAAAf,EAACH,EAAA,EAAiB,IACjBO,EAAA,CAAA,CAAoB,CAAA,CAAA,CACzB,CAAA,CACJ,CAAA,CAAA,CAGZ,CAEO,SAASY,EAAc,CAC1B,WAAAC,EACA,GAAGlB,CACP,EAA2F,CACvF,MAAMmB,EAAQC,EAA0B,CAAE,SAAUF,EAAY,EAEhE,OACIjB,EAACU,EAAA,CACG,UAAW,CAAC,CAACU,EAAqBF,CAAK,EACvC,WAAYD,GAAcC,EAAM,KAAK,MAAM,aAC3C,MAAOA,EAAM,MAAM,MACnB,GAAIA,EAAM,KACV,SAAUA,EAAM,aAChB,OAAQA,EAAM,WACd,aAAcE,EAAqBF,CAAK,EACvC,GAAGnB,CAAA,CAAA,CAGhB"}

package/dist/components/{key-value-card.d.ts → object-table.d.ts}

@@ -5,7 +5,7 @@ export type DisplayField<T> = {
     display: string;
     accessor: NestedKeyOf<T>;
     type?: 'text' | 'badge' | 'boolean' | 'date' | 'yesno' | 'copyButton' | 'link';
-    transform?: (value: any) => React.ReactNode;
+    render?: (value: T) => React.ReactNode;
 };
 export interface KeyValueCardProps<T> {
     data: T;
@@ -13,5 +13,5 @@ export interface KeyValueCardProps<T> {
     fields: DisplayField<T>[];
     className?: string;
 }
-export declare const KeyValueCard: <T extends {}>({ data, label, fields }: KeyValueCardProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare function ObjectTable<T extends object>({ data, label, fields }: KeyValueCardProps<T>): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/object-table.js

@@ -0,0 +1,2 @@
+import{jsxs as c,jsx as e}from"react/jsx-runtime";import{Badge as d}from"./badge.js";import{Card as p,CardHeader as f,CardTitle as m,CardContent as h}from"./card.js";import{Skeleton as u}from"./skeleton.js";import{formatDate as x}from"../utilities/date.js";import"../utilities/theme.js";import"clsx";function A({data:s,label:o,fields:l}){const i=(n,r)=>{if(n.render)return n.render(r);if(r==null)return"-";switch(n.type){case"date":return e("span",{children:x(r)});case"yesno":return e("span",{children:r?"Yes":"No"});case"badge":return e("div",{className:"flex flex-wrap gap-1",children:Array.isArray(r)?r.map((t,a)=>e(d,{children:typeof t=="object"?t?.name||t?.id:t},a)):r});case"boolean":return e("span",{children:r.toString()});default:return e("span",{children:r})}};return c(p,{children:[e(f,{children:e(m,{children:o})}),e(h,{children:e("div",{className:"flex flex-col gap-2",children:s?l.map(n=>{const r=n.accessor?n.accessor.split(".").reduce((t,a)=>t&&a in t?t[a]:void 0,s):null;return c("div",{className:"flex w-full flex-col md:flex-row justify-between first:pt-0 last:pb-0",children:[e("p",{className:"body flex w-full justify-start col-span-1",children:n.display}),e("div",{className:"body flex w-full justify-start text-wrap break-all",children:i(n,r)})]},n.display)}):l.map((n,r)=>e(u,{className:"h-12 w-full"},r))})})]})}export{A as ObjectTable};
+//# sourceMappingURL=object-table.js.map

package/dist/components/object-table.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"object-table.js","sources":["../../lib/components/object-table.tsx"],"sourcesContent":["import { Badge } from '../components/badge';\nimport { Card, CardContent, CardHeader, CardTitle } from '../components/card';\nimport { Skeleton } from '../components/skeleton';\nimport { formatDate } from '../utilities/date';\n\n// Utility type to handle nested keys (dot notation) in any object\ntype NestedKeyOf<T> = T extends object\n    ? {\n          [K in keyof T]: K extends string | number ? `${K & string}` | `${K & string}.${NestedKeyOf<T[K]>}` : never;\n      }[keyof T]\n    : never;\n\n// DisplayField type that works with nested keys\nexport type DisplayField<T> = {\n    display: string;\n    accessor: NestedKeyOf<T>;\n    type?: 'text' | 'badge' | 'boolean' | 'date' | 'yesno' | 'copyButton' | 'link'; // Field types\n    render?: (value: T) => React.ReactNode;\n};\n\nexport interface KeyValueCardProps<T> {\n    data: T; // Ensure data is of type T\n    label: string;\n    fields: DisplayField<T>[];\n    className?: string;\n}\n\n// This component is used to render object values in a tabular format\n// General patterns in the table are\n// Number\n// Status properties\n\nexport function ObjectTable<T extends object>({ data, label, fields }: KeyValueCardProps<T>) {\n    const renderValue = (field: DisplayField<T>, value: any) => {\n        if (field.render) {\n            return field.render(value);\n        }\n        if (value === undefined || value === null) {\n            return '-';\n        }\n        switch (field.type) {\n            case 'date':\n                return <span>{formatDate(value)}</span>;\n            case 'yesno':\n                return <span>{value ? 'Yes' : 'No'}</span>;\n            case 'badge':\n                return (\n                    <div className=\"flex flex-wrap gap-1\">\n                        {Array.isArray(value)\n                            ? value.map((item, index) => (\n                                  <Badge key={index}>{typeof item === 'object' ? item?.name || item?.id : item}</Badge>\n                              ))\n                            : value}\n                    </div>\n                );\n\n            case 'boolean':\n                return <span>{value.toString()}</span>;\n            default:\n                return <span>{value}</span>;\n        }\n    };\n\n    return (\n        <Card>\n            <CardHeader>\n                <CardTitle>{label}</CardTitle>\n            </CardHeader>\n            <CardContent>\n                <div className=\"flex flex-col gap-2\">\n                    {data\n                        ? fields.map(field => {\n                              // TODO: improve this\n                              const value = field.accessor\n                                  ? field.accessor\n                                        .split('.')\n                                        .reduce(\n                                            (obj, key) => (obj && key in obj ? obj[key] : undefined),\n                                            data as Record<string, any>\n                                        )\n                                  : null;\n\n                              return (\n                                  <div\n                                      key={field.display}\n                                      className=\"flex w-full flex-col md:flex-row justify-between first:pt-0 last:pb-0\"\n                                  >\n                                      <p className=\"body flex w-full justify-start col-span-1\">{field.display}</p>\n                                      <div className=\"body flex w-full justify-start text-wrap break-all\">\n                                          {renderValue(field, value)}\n                                      </div>\n                                  </div>\n                              );\n                          })\n                        : fields.map((_, index) => <Skeleton key={index} className=\"h-12 w-full\" />)}\n                </div>\n            </CardContent>\n        </Card>\n    );\n}\n"],"names":["ObjectTable","data","label","fields","renderValue","field","value","jsx","formatDate","item","index","Badge","Card","CardHeader","CardTitle","CardContent","obj","key","jsxs","_","Skeleton"],"mappings":"4SAgCO,SAASA,EAA8B,CAAE,KAAAC,EAAM,MAAAC,EAAO,OAAAC,GAAgC,CACzF,MAAMC,EAAc,CAACC,EAAwBC,IAAe,CACxD,GAAID,EAAM,OACN,OAAOA,EAAM,OAAOC,CAAK,EAE7B,GAA2BA,GAAU,KACjC,MAAO,IAEX,OAAQD,EAAM,KAAA,CACV,IAAK,OACD,OAAOE,EAAC,OAAA,CAAM,SAAAC,EAAWF,CAAK,EAAE,EACpC,IAAK,QACD,OAAOC,EAAC,OAAA,CAAM,SAAAD,EAAQ,MAAQ,KAAK,EACvC,IAAK,QACD,OACIC,EAAC,MAAA,CAAI,UAAU,uBACV,SAAA,MAAM,QAAQD,CAAK,EACdA,EAAM,IAAI,CAACG,EAAMC,MACZC,EAAA,CAAmB,SAAA,OAAOF,GAAS,SAAWA,GAAM,MAAQA,GAAM,GAAKA,CAAA,EAA5DC,CAAiE,CAChF,EACDJ,CAAA,CACV,EAGR,IAAK,UACD,OAAOC,EAAC,OAAA,CAAM,SAAAD,EAAM,SAAA,EAAW,EACnC,QACI,OAAOC,EAAC,QAAM,SAAAD,CAAA,CAAM,CAAA,CAEhC,EAEA,SACKM,EAAA,CACG,SAAA,CAAAL,EAACM,EAAA,CACG,SAAAN,EAACO,EAAA,CAAW,SAAAZ,CAAA,CAAM,EACtB,EACAK,EAACQ,GACG,SAAAR,EAAC,MAAA,CAAI,UAAU,sBACV,SAAAN,EACKE,EAAO,IAAIE,GAAS,CAEhB,MAAMC,EAAQD,EAAM,SACdA,EAAM,SACD,MAAM,GAAG,EACT,OACG,CAACW,EAAKC,IAASD,GAAOC,KAAOD,EAAMA,EAAIC,CAAG,EAAI,OAC9ChB,CAAA,EAER,KAEN,OACIiB,EAAC,MAAA,CAEG,UAAU,wEAEV,SAAA,CAAAX,EAAC,IAAA,CAAE,UAAU,4CAA6C,SAAAF,EAAM,QAAQ,IACvE,MAAA,CAAI,UAAU,qDACV,SAAAD,EAAYC,EAAOC,CAAK,CAAA,CAC7B,CAAA,CAAA,EANKD,EAAM,OAAA,CASvB,CAAC,EACDF,EAAO,IAAI,CAACgB,EAAGT,IAAUH,EAACa,EAAA,CAAqB,UAAU,aAAA,EAAjBV,CAA+B,CAAE,EACnF,CAAA,CACJ,CAAA,EACJ,CAER"}

package/dist/components/otpfield.js

@@ -1,2 +1,2 @@
-import{jsx as i}from"react/jsx-runtime";import{TextField as r}from"./textfield.js";import"react-aria-components";import"../utilities/form-utils.js";import"react";import"../utilities/form-context.js";import"@tanstack/react-form";import"../utilities/primitives.js";import"clsx";import"lodash-es";import"./field.js";import"class-variance-authority";import"./icons.js";function F({className:m,...t}){return i(r,{inputClassName:"justify-items-center",...t})}export{F as OTPField};
+import{jsx as i}from"react/jsx-runtime";import{TextField as r}from"./textfield.js";import"react-aria-components";import"../utilities/form.js";import"react";import"../utilities/form-context.js";import"@tanstack/react-form";import"../utilities/theme.js";import"clsx";import"./field.js";import"class-variance-authority";import"./icons.js";function j({className:m,...t}){return i(r,{inputClassName:"justify-items-center",...t})}export{j as OTPField};
 //# sourceMappingURL=otpfield.js.map

package/dist/components/otpfield.js.map

@@ -1 +1 @@
-{"version":3,"file":"otpfield.js","sources":["../../lib/components/otpfield.tsx"],"sourcesContent":["import { TextField } from './textfield';\n\nexport function OTPField({ className, ...props }: React.ComponentProps<typeof TextField>) {\n    return <TextField inputClassName=\"justify-items-center\" {...props} />;\n}\n"],"names":["OTPField","className","props","jsx","TextField"],"mappings":"6WAEO,SAASA,EAAS,CAAE,UAAAC,EAAW,GAAGC,GAAiD,CACtF,OAAOC,EAACC,EAAA,CAAU,eAAe,uBAAwB,GAAGF,EAAO,CACvE"}
+{"version":3,"file":"otpfield.js","sources":["../../lib/components/otpfield.tsx"],"sourcesContent":["import { TextField } from './textfield';\n\nexport function OTPField({ className, ...props }: React.ComponentProps<typeof TextField>) {\n    return <TextField inputClassName=\"justify-items-center\" {...props} />;\n}\n"],"names":["OTPField","className","props","jsx","TextField"],"mappings":"gVAEO,SAASA,EAAS,CAAE,UAAAC,EAAW,GAAGC,GAAiD,CACtF,OAAOC,EAACC,EAAA,CAAU,eAAe,uBAAwB,GAAGF,EAAO,CACvE"}

package/dist/components/popover.js

@@ -1,2 +1,2 @@
-import{jsx as t}from"react/jsx-runtime";import{Popover as n,composeRenderProps as m,DialogTrigger as p,Dialog as d}from"react-aria-components";import{classNames as a}from"../utilities/primitives.js";import"clsx";import"lodash-es";const u=p,v=({className:o,offset:e=4,...i})=>t(n,{offset:e,className:m(o,r=>a("z-50 border bg-popover text-popover-foreground outline-none max-w-lg","data-[entering]:animate-in data-[entering]:fade-in-0 data-[entering]:zoom-in-95","data-[exiting]:animate-out data-[exiting]:fade-out-0 data-[exiting]:zoom-out-95","data-[placement=bottom]:slide-in-from-top-2 data-[placement=left]:slide-in-from-right-2 data-[placement=right]:slide-in-from-left-2 data-[placement=top]:slide-in-from-bottom-2",r)),...i});function x({className:o,...e}){return t(d,{className:a("p-icon outline-0",o),...e})}export{v as Popover,x as PopoverDialog,u as PopoverTrigger};
+import{jsx as t}from"react/jsx-runtime";import{Popover as n,composeRenderProps as m,DialogTrigger as p,Dialog as d}from"react-aria-components";import{classNames as a}from"../utilities/theme.js";import"clsx";const c=p,u=({className:o,offset:e=4,...i})=>t(n,{offset:e,className:m(o,r=>a("z-50 border bg-popover text-popover-foreground outline-none max-w-lg","data-[entering]:animate-in data-[entering]:fade-in-0 data-[entering]:zoom-in-95","data-[exiting]:animate-out data-[exiting]:fade-out-0 data-[exiting]:zoom-out-95","data-[placement=bottom]:slide-in-from-top-2 data-[placement=left]:slide-in-from-right-2 data-[placement=right]:slide-in-from-left-2 data-[placement=top]:slide-in-from-bottom-2",r)),...i});function v({className:o,...e}){return t(d,{className:a("p-icon outline-0",o),...e})}export{u as Popover,v as PopoverDialog,c as PopoverTrigger};
 //# sourceMappingURL=popover.js.map

package/dist/components/popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"popover.js","sources":["../../lib/components/popover.tsx"],"sourcesContent":["import {\n    Dialog as AriaDialog,\n    DialogProps as AriaDialogProps,\n    DialogTrigger as AriaDialogTrigger,\n    Popover as AriaPopover,\n    PopoverProps as AriaPopoverProps,\n    composeRenderProps,\n} from 'react-aria-components';\n\nimport { classNames } from '../utilities/primitives';\n\nexport const PopoverTrigger = AriaDialogTrigger;\n\nexport const Popover = ({ className, offset = 4, ...props }: AriaPopoverProps) => (\n    <AriaPopover\n        offset={offset}\n        className={composeRenderProps(className, className =>\n            classNames(\n                'z-50 border bg-popover text-popover-foreground outline-none max-w-lg',\n                /* Entering */\n                'data-[entering]:animate-in data-[entering]:fade-in-0 data-[entering]:zoom-in-95',\n                /* Exiting */\n                'data-[exiting]:animate-out data-[exiting]:fade-out-0 data-[exiting]:zoom-out-95',\n                /* Placement */\n                'data-[placement=bottom]:slide-in-from-top-2 data-[placement=left]:slide-in-from-right-2 data-[placement=right]:slide-in-from-left-2 data-[placement=top]:slide-in-from-bottom-2',\n                className\n            )\n        )}\n        {...props}\n    />\n);\n\nexport function PopoverDialog({ className, ...props }: AriaDialogProps) {\n    return <AriaDialog className={classNames('p-icon outline-0', className)} {...props} />;\n}\n"],"names":["PopoverTrigger","AriaDialogTrigger","Popover","className","offset","props","jsx","AriaPopover","composeRenderProps","classNames","PopoverDialog","AriaDialog"],"mappings":"sOAWO,MAAMA,EAAiBC,EAEjBC,EAAU,CAAC,CAAE,UAAAC,EAAW,OAAAC,EAAS,EAAG,GAAGC,KAChDC,EAACC,EAAA,CACG,OAAAH,EACA,UAAWI,EAAmBL,EAAWA,GACrCM,EACI,uEAEA,kFAEA,kFAEA,kLACAN,CAAA,CACJ,EAEH,GAAGE,CAAA,CACR,EAGG,SAASK,EAAc,CAAE,UAAAP,EAAW,GAAGE,GAA0B,CACpE,OAAOC,EAACK,GAAW,UAAWF,EAAW,mBAAoBN,CAAS,EAAI,GAAGE,EAAO,CACxF"}
+{"version":3,"file":"popover.js","sources":["../../lib/components/popover.tsx"],"sourcesContent":["import {\n    Dialog as AriaDialog,\n    DialogProps as AriaDialogProps,\n    DialogTrigger as AriaDialogTrigger,\n    Popover as AriaPopover,\n    PopoverProps as AriaPopoverProps,\n    composeRenderProps,\n} from 'react-aria-components';\n\nimport { classNames } from '../utilities/theme';\n\nexport const PopoverTrigger = AriaDialogTrigger;\n\nexport const Popover = ({ className, offset = 4, ...props }: AriaPopoverProps) => (\n    <AriaPopover\n        offset={offset}\n        className={composeRenderProps(className, className =>\n            classNames(\n                'z-50 border bg-popover text-popover-foreground outline-none max-w-lg',\n                /* Entering */\n                'data-[entering]:animate-in data-[entering]:fade-in-0 data-[entering]:zoom-in-95',\n                /* Exiting */\n                'data-[exiting]:animate-out data-[exiting]:fade-out-0 data-[exiting]:zoom-out-95',\n                /* Placement */\n                'data-[placement=bottom]:slide-in-from-top-2 data-[placement=left]:slide-in-from-right-2 data-[placement=right]:slide-in-from-left-2 data-[placement=top]:slide-in-from-bottom-2',\n                className\n            )\n        )}\n        {...props}\n    />\n);\n\nexport function PopoverDialog({ className, ...props }: AriaDialogProps) {\n    return <AriaDialog className={classNames('p-icon outline-0', className)} {...props} />;\n}\n"],"names":["PopoverTrigger","AriaDialogTrigger","Popover","className","offset","props","jsx","AriaPopover","composeRenderProps","classNames","PopoverDialog","AriaDialog"],"mappings":"+MAWO,MAAMA,EAAiBC,EAEjBC,EAAU,CAAC,CAAE,UAAAC,EAAW,OAAAC,EAAS,EAAG,GAAGC,KAChDC,EAACC,EAAA,CACG,OAAAH,EACA,UAAWI,EAAmBL,EAAWA,GACrCM,EACI,uEAEA,kFAEA,kFAEA,kLACAN,CAAA,CACJ,EAEH,GAAGE,CAAA,CACR,EAGG,SAASK,EAAc,CAAE,UAAAP,EAAW,GAAGE,GAA0B,CACpE,OAAOC,EAACK,GAAW,UAAWF,EAAW,mBAAoBN,CAAS,EAAI,GAAGE,EAAO,CACxF"}

package/dist/components/searchfield.js

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as m}from"react/jsx-runtime";import{composeRenderProps as n,SearchField as s,Input as p,Button as d}from"react-aria-components";import{classNames as t}from"../utilities/primitives.js";import{FormField as u,FieldGroup as h}from"./field.js";import{IcSearch as f,IcRemove as F}from"./icons.js";import"clsx";import"lodash-es";import"class-variance-authority";import"react";function b({className:r,...i}){return e(s,{className:n(r,o=>t("group",o)),...i})}function g({className:r,...i}){return e(p,{className:n(r,o=>t("min-w-0 ring-0 focus-visible:outline-none flex-1 bg-popover px-2 py-1.5 placeholder:text-muted-foreground [&::-webkit-search-cancel-button]:hidden",o)),...i})}function x({className:r,...i}){return e(d,{className:n(r,o=>t("btn btn-ghost h-input px-2 -me-2","group-data-[empty]:invisible",o)),...i})}function R({label:r,description:i,className:o,errorMessage:a,...c}){return e(b,{className:n(o,l=>t("group form-field",l)),...c,children:e(u,{label:r,description:i,errorMessage:a,children:m(h,{children:[e(f,{"aria-hidden":!0,className:"size-icon"}),e(g,{placeholder:""}),e(x,{children:e(F,{"aria-hidden":!0,className:"size-icon"})})]})})})}export{R as SearchField};
+import{jsx as e,jsxs as m}from"react/jsx-runtime";import{composeRenderProps as n,SearchField as s,Input as d}from"react-aria-components";import{classNames as a}from"../utilities/theme.js";import{FormField as p,FieldGroup as u,FormFieldButton as h}from"./field.js";import{IcSearch as f,IcRemove as F}from"./icons.js";import"clsx";import"class-variance-authority";import"react";function N({className:r,...i}){return e(s,{className:n(r,o=>a("group",o)),...i})}function S({className:r,...i}){return e(d,{className:n(r,o=>a("min-w-0 ring-0 focus-visible:outline-none flex-1 bg-popover px-2 py-1.5 placeholder:text-muted-foreground [&::-webkit-search-cancel-button]:hidden",o)),...i})}function g(){return e(h,{className:"group-data-[empty]:invisible",children:e(F,{"aria-hidden":!0,className:"size-icon"})})}function A({label:r,description:i,className:o,errorMessage:c,...t}){return e(N,{className:n(o,l=>a("group form-field",l)),...t,children:e(p,{label:r,description:i,errorMessage:c,children:m(u,{children:[e(f,{"aria-hidden":!0,className:"size-icon"}),e(S,{placeholder:""}),e(g,{})]})})})}export{A as SearchField};
 //# sourceMappingURL=searchfield.js.map

package/dist/components/searchfield.js.map

@@ -1 +1 @@
-{"version":3,"file":"searchfield.js","sources":["../../lib/components/searchfield.tsx"],"sourcesContent":["import {\n    Button as AriaButton,\n    ButtonProps as AriaButtonProps,\n    Input as AriaInput,\n    InputProps as AriaInputProps,\n    SearchField as AriaSearchField,\n    SearchFieldProps as AriaSearchFieldProps,\n    composeRenderProps,\n} from 'react-aria-components';\n\nimport { classNames } from '../utilities/primitives';\n\nimport { FieldGroup, FormField, type FormFieldProps } from './field';\nimport { IcRemove, IcSearch } from './icons';\n\nfunction ASearchField({ className, ...props }: AriaSearchFieldProps) {\n    return (\n        <AriaSearchField\n            className={composeRenderProps(className, className => classNames('group', className))}\n            {...props}\n        />\n    );\n}\n\nfunction ASearchFieldInput({ className, ...props }: AriaInputProps) {\n    return (\n        <AriaInput\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'min-w-0 ring-0 focus-visible:outline-none flex-1 bg-popover px-2 py-1.5 placeholder:text-muted-foreground [&::-webkit-search-cancel-button]:hidden',\n                    className\n                )\n            )}\n            {...props}\n        />\n    );\n}\n// TODO, standardize this as FieldGroup action button. Document that there can only be one.\nfunction SearchFieldClear({ className, ...props }: AriaButtonProps) {\n    return (\n        <AriaButton\n            className={composeRenderProps(className, className =>\n                classNames('btn btn-ghost h-input px-2 -me-2', 'group-data-[empty]:invisible', className)\n            )}\n            {...props}\n        />\n    );\n}\n\nexport interface SearchFieldProps extends AriaSearchFieldProps, FormFieldProps {}\nexport function SearchField({ label, description, className, errorMessage, ...props }: SearchFieldProps) {\n    return (\n        <ASearchField\n            className={composeRenderProps(className, className => classNames('group form-field', className))}\n            {...props}\n        >\n            <FormField label={label} description={description} errorMessage={errorMessage}>\n                <FieldGroup>\n                    <IcSearch aria-hidden className=\"size-icon\" />\n                    <ASearchFieldInput placeholder=\"\" />\n                    <SearchFieldClear>\n                        <IcRemove aria-hidden className=\"size-icon\" />\n                    </SearchFieldClear>\n                </FieldGroup>\n            </FormField>\n        </ASearchField>\n    );\n}\n"],"names":["ASearchField","className","props","jsx","AriaSearchField","composeRenderProps","classNames","ASearchFieldInput","AriaInput","SearchFieldClear","AriaButton","SearchField","label","description","errorMessage","FormField","FieldGroup","IcSearch","IcRemove"],"mappings":"sYAeA,SAASA,EAAa,CAAE,UAAAC,EAAW,GAAGC,GAA+B,CACjE,OACIC,EAACC,EAAA,CACG,UAAWC,EAAmBJ,EAAWA,GAAaK,EAAW,QAASL,CAAS,CAAC,EACnF,GAAGC,CAAA,CAAA,CAGhB,CAEA,SAASK,EAAkB,CAAE,UAAAN,EAAW,GAAGC,GAAyB,CAChE,OACIC,EAACK,EAAA,CACG,UAAWH,EAAmBJ,EAAWA,GACrCK,EACI,qJACAL,CAAA,CACJ,EAEH,GAAGC,CAAA,CAAA,CAGhB,CAEA,SAASO,EAAiB,CAAE,UAAAR,EAAW,GAAGC,GAA0B,CAChE,OACIC,EAACO,EAAA,CACG,UAAWL,EAAmBJ,EAAWA,GACrCK,EAAW,mCAAoC,+BAAgCL,CAAS,CAAA,EAE3F,GAAGC,CAAA,CAAA,CAGhB,CAGO,SAASS,EAAY,CAAE,MAAAC,EAAO,YAAAC,EAAa,UAAAZ,EAAW,aAAAa,EAAc,GAAGZ,GAA2B,CACrG,OACIC,EAACH,EAAA,CACG,UAAWK,EAAmBJ,EAAWA,GAAaK,EAAW,mBAAoBL,CAAS,CAAC,EAC9F,GAAGC,EAEJ,WAACa,EAAA,CAAU,MAAAH,EAAc,YAAAC,EAA0B,aAAAC,EAC/C,WAACE,EAAA,CACG,SAAA,CAAAb,EAACc,EAAA,CAAS,cAAW,GAAC,UAAU,YAAY,EAC5Cd,EAACI,EAAA,CAAkB,YAAY,EAAA,CAAG,EAClCJ,EAACM,GACG,SAAAN,EAACe,EAAA,CAAS,cAAW,GAAC,UAAU,YAAY,CAAA,CAChD,CAAA,CAAA,CACJ,CAAA,CACJ,CAAA,CAAA,CAGZ"}
+{"version":3,"file":"searchfield.js","sources":["../../lib/components/searchfield.tsx"],"sourcesContent":["import {\n    Input as AriaInput,\n    InputProps as AriaInputProps,\n    SearchField as AriaSearchField,\n    SearchFieldProps as AriaSearchFieldProps,\n    composeRenderProps,\n} from 'react-aria-components';\n\nimport { classNames } from '../utilities/theme';\n\nimport { FieldGroup, FormField, FormFieldButton, type FormFieldProps } from './field';\nimport { IcRemove, IcSearch } from './icons';\n\nfunction ASearchField({ className, ...props }: AriaSearchFieldProps) {\n    return (\n        <AriaSearchField\n            className={composeRenderProps(className, className => classNames('group', className))}\n            {...props}\n        />\n    );\n}\n\nfunction ASearchFieldInput({ className, ...props }: AriaInputProps) {\n    return (\n        <AriaInput\n            className={composeRenderProps(className, className =>\n                classNames(\n                    'min-w-0 ring-0 focus-visible:outline-none flex-1 bg-popover px-2 py-1.5 placeholder:text-muted-foreground [&::-webkit-search-cancel-button]:hidden',\n                    className\n                )\n            )}\n            {...props}\n        />\n    );\n}\n\nfunction SearchFieldClear() {\n    return (\n        <FormFieldButton className={'group-data-[empty]:invisible'}>\n            <IcRemove aria-hidden className=\"size-icon\" />\n        </FormFieldButton>\n    );\n}\n\nexport interface SearchFieldProps extends AriaSearchFieldProps, FormFieldProps {}\nexport function SearchField({ label, description, className, errorMessage, ...props }: SearchFieldProps) {\n    return (\n        <ASearchField\n            className={composeRenderProps(className, className => classNames('group form-field', className))}\n            {...props}\n        >\n            <FormField label={label} description={description} errorMessage={errorMessage}>\n                <FieldGroup>\n                    <IcSearch aria-hidden className=\"size-icon\" />\n                    <ASearchFieldInput placeholder=\"\" />\n                    <SearchFieldClear />\n                </FieldGroup>\n            </FormField>\n        </ASearchField>\n    );\n}\n"],"names":["ASearchField","className","props","jsx","AriaSearchField","composeRenderProps","classNames","ASearchFieldInput","AriaInput","SearchFieldClear","FormFieldButton","IcRemove","SearchField","label","description","errorMessage","FormField","FieldGroup","IcSearch"],"mappings":"wXAaA,SAASA,EAAa,CAAE,UAAAC,EAAW,GAAGC,GAA+B,CACjE,OACIC,EAACC,EAAA,CACG,UAAWC,EAAmBJ,EAAWA,GAAaK,EAAW,QAASL,CAAS,CAAC,EACnF,GAAGC,CAAA,CAAA,CAGhB,CAEA,SAASK,EAAkB,CAAE,UAAAN,EAAW,GAAGC,GAAyB,CAChE,OACIC,EAACK,EAAA,CACG,UAAWH,EAAmBJ,EAAWA,GACrCK,EACI,qJACAL,CAAA,CACJ,EAEH,GAAGC,CAAA,CAAA,CAGhB,CAEA,SAASO,GAAmB,CACxB,OACIN,EAACO,EAAA,CAAgB,UAAW,+BACxB,SAAAP,EAACQ,GAAS,cAAW,GAAC,UAAU,WAAA,CAAY,CAAA,CAChD,CAER,CAGO,SAASC,EAAY,CAAE,MAAAC,EAAO,YAAAC,EAAa,UAAAb,EAAW,aAAAc,EAAc,GAAGb,GAA2B,CACrG,OACIC,EAACH,EAAA,CACG,UAAWK,EAAmBJ,EAAWA,GAAaK,EAAW,mBAAoBL,CAAS,CAAC,EAC9F,GAAGC,EAEJ,WAACc,EAAA,CAAU,MAAAH,EAAc,YAAAC,EAA0B,aAAAC,EAC/C,WAACE,EAAA,CACG,SAAA,CAAAd,EAACe,EAAA,CAAS,cAAW,GAAC,UAAU,YAAY,EAC5Cf,EAACI,EAAA,CAAkB,YAAY,EAAA,CAAG,IACjCE,EAAA,CAAA,CAAiB,CAAA,CAAA,CACtB,CAAA,CACJ,CAAA,CAAA,CAGZ"}

package/dist/components/select.js

@@ -1,2 +1,2 @@
-"use client";import{jsx as o,jsxs as c,Fragment as u}from"react/jsx-runtime";import{Select as p,composeRenderProps as i,SelectValue as f,ListBox as S}from"react-aria-components";import{Button as h}from"./button.js";import{FormField as g}from"./field.js";import{useTfFieldContext as x}from"../utilities/form-utils.js";import{getFieldErrorMessage as B,classNames as l}from"../utilities/primitives.js";import{IcDown as N}from"./icons.js";import{ListBoxItem as w,ListBoxHeader as C,ListBoxCollection as F}from"./list-box.js";import{Popover as L}from"./popover.js";import"class-variance-authority";import"./loader.js";import"clsx";import"lodash-es";import"react";import"../utilities/form-context.js";import"@tanstack/react-form";const v=p,b=w,U=C,W=F,I=({className:r,...t})=>o(f,{className:i(r,e=>l("line-clamp-1 data-[placeholder]:text-muted-foreground","[&>[slot=description]]:hidden",e)),...t});function P({className:r,children:t,...e}){return o(h,{...e,children:i(t,n=>c(u,{children:[n,o(N,{"aria-hidden":"true",className:"size-icon opacity-50"})]}))})}function T({className:r,...t}){return o(L,{className:i(r,e=>l("w-auto min-w-[--trigger-width]",e)),...t})}function V({className:r,...t}){return o(S,{className:i(r,e=>l("overflow-auto p-1 outline-none",e)),...t})}function j({label:r,description:t,errorMessage:e,children:n,className:s,items:a,...m}){return o(v,{className:i(s,d=>l("group form-field",d)),...m,children:c(g,{label:r,description:t,errorMessage:e,children:[o(P,{children:o(I,{})}),o(T,{children:o(V,{items:a,children:n})})]})})}function X({...r}){const t=x({disabled:r.isDisabled});return o(j,{selectedKey:t.state.value,onSelectionChange:e=>t.handleChange(e.toString()),onBlur:t.handleBlur,errorMessage:B(t),...r,children:e=>o(b,{id:e.id,children:e.label},e.id)})}export{W as SelectCollection,U as SelectHeader,b as SelectItem,T as SelectPopover,I as SelectValue,j as SingleSelect,X as TfSingleSelect};
+"use client";import{jsx as o,jsxs as c,Fragment as u}from"react/jsx-runtime";import{Select as p,composeRenderProps as i,SelectValue as f,ListBox as S}from"react-aria-components";import{Button as h}from"./button.js";import{FormField as g}from"./field.js";import{useTfFieldContext as x,getFieldErrorMessage as B}from"../utilities/form.js";import{classNames as l}from"../utilities/theme.js";import{IcDown as N}from"./icons.js";import{ListBoxItem as w,ListBoxHeader as C,ListBoxCollection as F}from"./list-box.js";import{Popover as L}from"./popover.js";import"class-variance-authority";import"./loader.js";import"clsx";import"react";import"../utilities/form-context.js";import"@tanstack/react-form";const v=p,b=w,Q=C,U=F,I=({className:r,...t})=>o(f,{className:i(r,e=>l("line-clamp-1 data-[placeholder]:text-muted-foreground","[&>[slot=description]]:hidden",e)),...t});function P({className:r,children:t,...e}){return o(h,{...e,children:i(t,n=>c(u,{children:[n,o(N,{"aria-hidden":"true",className:"size-icon opacity-50"})]}))})}function T({className:r,...t}){return o(L,{className:i(r,e=>l("w-auto min-w-[--trigger-width]",e)),...t})}function V({className:r,...t}){return o(S,{className:i(r,e=>l("overflow-auto p-1 outline-none",e)),...t})}function j({label:r,description:t,errorMessage:e,children:n,className:s,items:a,...m}){return o(v,{className:i(s,d=>l("group form-field",d)),...m,children:c(g,{label:r,description:t,errorMessage:e,children:[o(P,{children:o(I,{})}),o(T,{children:o(V,{items:a,children:n})})]})})}function W({...r}){const t=x({disabled:r.isDisabled});return o(j,{selectedKey:t.state.value,onSelectionChange:e=>t.handleChange(e.toString()),onBlur:t.handleBlur,errorMessage:B(t),...r,children:e=>o(b,{id:e.id,children:e.label},e.id)})}export{U as SelectCollection,Q as SelectHeader,b as SelectItem,T as SelectPopover,I as SelectValue,j as SingleSelect,W as TfSingleSelect};
 //# sourceMappingURL=select.js.map

package/dist/components/select.js.map

@@ -1 +1 @@
-{"version":3,"file":"select.js","sources":["../../lib/components/select.tsx"],"sourcesContent":["'use client';\nimport {\n    ListBox as AriaListBox,\n    ListBoxProps as AriaListBoxProps,\n    PopoverProps as AriaPopoverProps,\n    Select as AriaSelect,\n    SelectProps as AriaSelectProps,\n    SelectValue as AriaSelectValue,\n    SelectValueProps as AriaSelectValueProps,\n    composeRenderProps,\n} from 'react-aria-components';\n\nimport { Button } from '../components/button';\nimport { FormField, type FormFieldProps } from '../components/field';\nimport type { SelectOption } from '../components/select-options';\nimport { useTfFieldContext } from '../utilities/form-utils';\nimport { classNames, getFieldErrorMessage } from '../utilities/primitives';\nimport { IcDown } from './icons';\nimport { ListBoxCollection, ListBoxHeader, ListBoxItem } from './list-box';\nimport { Popover } from './popover';\n\nconst ASelect = AriaSelect;\nexport const SelectItem = ListBoxItem;\nexport const SelectHeader = ListBoxHeader;\nexport const SelectCollection = ListBoxCollection;\n\nexport const SelectValue = <T extends object>({ className, ...props }: AriaSelectValueProps<T>) => (\n    <AriaSelectValue\n        className={composeRenderProps(className, className =>\n            classNames(\n                'line-clamp-1 data-[placeholder]:text-muted-foreground',\n                /* Description */\n                '[&>[slot=description]]:hidden',\n                className\n            )\n        )}\n        {...props}\n    />\n);\n// TODO, justify-between?\nfunction SelectTrigger({ className, children, ...props }: React.ComponentProps<typeof Button>) {\n    return (\n        <Button {...props}>\n            {composeRenderProps(children, children => (\n                <>\n                    {children}\n                    <IcDown aria-hidden=\"true\" className=\"size-icon opacity-50\" />\n                </>\n            ))}\n        </Button>\n    );\n}\n\nexport function SelectPopover({ className, ...props }: AriaPopoverProps) {\n    return (\n        <Popover\n            className={composeRenderProps(className, className =>\n                classNames('w-auto min-w-[--trigger-width]', className)\n            )}\n            {...props}\n        />\n    );\n}\n\nfunction SelectListBox<T extends object>({ className, ...props }: AriaListBoxProps<T>) {\n    return (\n        <AriaListBox\n            className={composeRenderProps(className, className =>\n                classNames('overflow-auto p-1 outline-none', className)\n            )}\n            {...props}\n        />\n    );\n}\n\nexport interface SingleSelectProps<T extends SelectOption>\n    extends Omit<AriaSelectProps<T>, 'children'>,\n        FormFieldProps {\n    items: Iterable<T>;\n    children: React.ReactNode | ((item: T) => React.ReactNode);\n}\n\nexport function SingleSelect<T extends SelectOption>({\n    label,\n    description,\n    errorMessage,\n    children,\n    className,\n    items,\n    ...props\n}: SingleSelectProps<T>) {\n    return (\n        <ASelect\n            className={composeRenderProps(className, className => classNames('group form-field', className))}\n            {...props}\n        >\n            <FormField label={label} description={description} errorMessage={errorMessage}>\n                <SelectTrigger>\n                    <SelectValue />\n                </SelectTrigger>\n                <SelectPopover>\n                    <SelectListBox items={items}>{children}</SelectListBox>\n                </SelectPopover>\n            </FormField>\n        </ASelect>\n    );\n}\n\ntype TfSingleSelectProps<T extends SelectOption> = Omit<SingleSelectProps<T>, 'value' | 'setValue' | 'children'>;\n\nexport function TfSingleSelect<T extends SelectOption>({ ...props }: TfSingleSelectProps<T>) {\n    const field = useTfFieldContext<string>({ disabled: props.isDisabled });\n\n    return (\n        <SingleSelect\n            selectedKey={field.state.value}\n            onSelectionChange={e => field.handleChange(e!.toString())}\n            onBlur={field.handleBlur}\n            errorMessage={getFieldErrorMessage(field)}\n            {...props}\n        >\n            {item => (\n                <SelectItem id={item.id} key={item.id}>\n                    {item.label}\n                </SelectItem>\n            )}\n        </SingleSelect>\n    );\n}\n"],"names":["ASelect","AriaSelect","SelectItem","ListBoxItem","SelectHeader","ListBoxHeader","SelectCollection","ListBoxCollection","SelectValue","className","props","jsx","AriaSelectValue","composeRenderProps","classNames","SelectTrigger","children","Button","jsxs","Fragment","IcDown","SelectPopover","Popover","SelectListBox","AriaListBox","SingleSelect","label","description","errorMessage","items","FormField","TfSingleSelect","field","useTfFieldContext","getFieldErrorMessage","item"],"mappings":"otBAqBA,MAAMA,EAAUC,EACHC,EAAaC,EACbC,EAAeC,EACfC,EAAmBC,EAEnBC,EAAc,CAAmB,CAAE,UAAAC,EAAW,GAAGC,KAC1DC,EAACC,EAAA,CACG,UAAWC,EAAmBJ,EAAWA,GACrCK,EACI,wDAEA,gCACAL,CAAA,CACJ,EAEH,GAAGC,CAAA,CACR,EAGJ,SAASK,EAAc,CAAE,UAAAN,EAAW,SAAAO,EAAU,GAAGN,GAA8C,CAC3F,OACIC,EAACM,GAAQ,GAAGP,EACP,WAAmBM,EAAUA,GAC1BE,EAAAC,EAAA,CACK,SAAA,CAAAH,EACDL,EAACS,EAAA,CAAO,cAAY,OAAO,UAAU,sBAAA,CAAuB,CAAA,CAAA,CAChE,CACH,CAAA,CACL,CAER,CAEO,SAASC,EAAc,CAAE,UAAAZ,EAAW,GAAGC,GAA2B,CACrE,OACIC,EAACW,EAAA,CACG,UAAWT,EAAmBJ,EAAWA,GACrCK,EAAW,iCAAkCL,CAAS,CAAA,EAEzD,GAAGC,CAAA,CAAA,CAGhB,CAEA,SAASa,EAAgC,CAAE,UAAAd,EAAW,GAAGC,GAA8B,CACnF,OACIC,EAACa,EAAA,CACG,UAAWX,EAAmBJ,EAAWA,GACrCK,EAAW,iCAAkCL,CAAS,CAAA,EAEzD,GAAGC,CAAA,CAAA,CAGhB,CASO,SAASe,EAAqC,CACjD,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAZ,EACA,UAAAP,EACA,MAAAoB,EACA,GAAGnB,CACP,EAAyB,CACrB,OACIC,EAACX,EAAA,CACG,UAAWa,EAAmBJ,EAAWA,GAAaK,EAAW,mBAAoBL,CAAS,CAAC,EAC9F,GAAGC,EAEJ,SAAAQ,EAACY,EAAA,CAAU,MAAAJ,EAAc,YAAAC,EAA0B,aAAAC,EAC/C,SAAA,CAAAjB,EAACI,EAAA,CACG,SAAAJ,EAACH,EAAA,CAAA,CAAY,EACjB,IACCa,EAAA,CACG,SAAAV,EAACY,EAAA,CAAc,MAAAM,EAAe,SAAAb,EAAS,CAAA,CAC3C,CAAA,CAAA,CACJ,CAAA,CAAA,CAGZ,CAIO,SAASe,EAAuC,CAAE,GAAGrB,GAAiC,CACzF,MAAMsB,EAAQC,EAA0B,CAAE,SAAUvB,EAAM,WAAY,EAEtE,OACIC,EAACc,EAAA,CACG,YAAaO,EAAM,MAAM,MACzB,kBAAmB,GAAKA,EAAM,aAAa,EAAG,UAAU,EACxD,OAAQA,EAAM,WACd,aAAcE,EAAqBF,CAAK,EACvC,GAAGtB,EAEH,SAAAyB,KACIjC,EAAA,CAAW,GAAIiC,EAAK,GAChB,SAAAA,EAAK,KAAA,EADoBA,EAAK,EAEnC,CAAA,CAAA,CAIhB"}
+{"version":3,"file":"select.js","sources":["../../lib/components/select.tsx"],"sourcesContent":["'use client';\nimport {\n    ListBox as AriaListBox,\n    ListBoxProps as AriaListBoxProps,\n    PopoverProps as AriaPopoverProps,\n    Select as AriaSelect,\n    SelectProps as AriaSelectProps,\n    SelectValue as AriaSelectValue,\n    SelectValueProps as AriaSelectValueProps,\n    composeRenderProps,\n} from 'react-aria-components';\n\nimport { Button } from '../components/button';\nimport { FormField, type FormFieldProps } from '../components/field';\nimport type { SelectOption } from '../components/select-options';\nimport { getFieldErrorMessage, useTfFieldContext } from '../utilities/form';\nimport { classNames } from '../utilities/theme';\nimport { IcDown } from './icons';\nimport { ListBoxCollection, ListBoxHeader, ListBoxItem } from './list-box';\nimport { Popover } from './popover';\n\nconst ASelect = AriaSelect;\nexport const SelectItem = ListBoxItem;\nexport const SelectHeader = ListBoxHeader;\nexport const SelectCollection = ListBoxCollection;\n\nexport const SelectValue = <T extends object>({ className, ...props }: AriaSelectValueProps<T>) => (\n    <AriaSelectValue\n        className={composeRenderProps(className, className =>\n            classNames(\n                'line-clamp-1 data-[placeholder]:text-muted-foreground',\n                /* Description */\n                '[&>[slot=description]]:hidden',\n                className\n            )\n        )}\n        {...props}\n    />\n);\n// TODO, justify-between?\nfunction SelectTrigger({ className, children, ...props }: React.ComponentProps<typeof Button>) {\n    return (\n        <Button {...props}>\n            {composeRenderProps(children, children => (\n                <>\n                    {children}\n                    <IcDown aria-hidden=\"true\" className=\"size-icon opacity-50\" />\n                </>\n            ))}\n        </Button>\n    );\n}\n\nexport function SelectPopover({ className, ...props }: AriaPopoverProps) {\n    return (\n        <Popover\n            className={composeRenderProps(className, className =>\n                classNames('w-auto min-w-[--trigger-width]', className)\n            )}\n            {...props}\n        />\n    );\n}\n\nfunction SelectListBox<T extends object>({ className, ...props }: AriaListBoxProps<T>) {\n    return (\n        <AriaListBox\n            className={composeRenderProps(className, className =>\n                classNames('overflow-auto p-1 outline-none', className)\n            )}\n            {...props}\n        />\n    );\n}\n\nexport interface SingleSelectProps<T extends SelectOption>\n    extends Omit<AriaSelectProps<T>, 'children'>,\n        FormFieldProps {\n    items: Iterable<T>;\n    children: React.ReactNode | ((item: T) => React.ReactNode);\n}\n\nexport function SingleSelect<T extends SelectOption>({\n    label,\n    description,\n    errorMessage,\n    children,\n    className,\n    items,\n    ...props\n}: SingleSelectProps<T>) {\n    return (\n        <ASelect\n            className={composeRenderProps(className, className => classNames('group form-field', className))}\n            {...props}\n        >\n            <FormField label={label} description={description} errorMessage={errorMessage}>\n                <SelectTrigger>\n                    <SelectValue />\n                </SelectTrigger>\n                <SelectPopover>\n                    <SelectListBox items={items}>{children}</SelectListBox>\n                </SelectPopover>\n            </FormField>\n        </ASelect>\n    );\n}\n\ntype TfSingleSelectProps<T extends SelectOption> = Omit<SingleSelectProps<T>, 'value' | 'setValue' | 'children'>;\n\nexport function TfSingleSelect<T extends SelectOption>({ ...props }: TfSingleSelectProps<T>) {\n    const field = useTfFieldContext<string>({ disabled: props.isDisabled });\n\n    return (\n        <SingleSelect\n            selectedKey={field.state.value}\n            onSelectionChange={e => field.handleChange(e!.toString())}\n            onBlur={field.handleBlur}\n            errorMessage={getFieldErrorMessage(field)}\n            {...props}\n        >\n            {item => (\n                <SelectItem id={item.id} key={item.id}>\n                    {item.label}\n                </SelectItem>\n            )}\n        </SingleSelect>\n    );\n}\n"],"names":["ASelect","AriaSelect","SelectItem","ListBoxItem","SelectHeader","ListBoxHeader","SelectCollection","ListBoxCollection","SelectValue","className","props","jsx","AriaSelectValue","composeRenderProps","classNames","SelectTrigger","children","Button","jsxs","Fragment","IcDown","SelectPopover","Popover","SelectListBox","AriaListBox","SingleSelect","label","description","errorMessage","items","FormField","TfSingleSelect","field","useTfFieldContext","getFieldErrorMessage","item"],"mappings":"urBAqBA,MAAMA,EAAUC,EACHC,EAAaC,EACbC,EAAeC,EACfC,EAAmBC,EAEnBC,EAAc,CAAmB,CAAE,UAAAC,EAAW,GAAGC,KAC1DC,EAACC,EAAA,CACG,UAAWC,EAAmBJ,EAAWA,GACrCK,EACI,wDAEA,gCACAL,CAAA,CACJ,EAEH,GAAGC,CAAA,CACR,EAGJ,SAASK,EAAc,CAAE,UAAAN,EAAW,SAAAO,EAAU,GAAGN,GAA8C,CAC3F,OACIC,EAACM,GAAQ,GAAGP,EACP,WAAmBM,EAAUA,GAC1BE,EAAAC,EAAA,CACK,SAAA,CAAAH,EACDL,EAACS,EAAA,CAAO,cAAY,OAAO,UAAU,sBAAA,CAAuB,CAAA,CAAA,CAChE,CACH,CAAA,CACL,CAER,CAEO,SAASC,EAAc,CAAE,UAAAZ,EAAW,GAAGC,GAA2B,CACrE,OACIC,EAACW,EAAA,CACG,UAAWT,EAAmBJ,EAAWA,GACrCK,EAAW,iCAAkCL,CAAS,CAAA,EAEzD,GAAGC,CAAA,CAAA,CAGhB,CAEA,SAASa,EAAgC,CAAE,UAAAd,EAAW,GAAGC,GAA8B,CACnF,OACIC,EAACa,EAAA,CACG,UAAWX,EAAmBJ,EAAWA,GACrCK,EAAW,iCAAkCL,CAAS,CAAA,EAEzD,GAAGC,CAAA,CAAA,CAGhB,CASO,SAASe,EAAqC,CACjD,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAZ,EACA,UAAAP,EACA,MAAAoB,EACA,GAAGnB,CACP,EAAyB,CACrB,OACIC,EAACX,EAAA,CACG,UAAWa,EAAmBJ,EAAWA,GAAaK,EAAW,mBAAoBL,CAAS,CAAC,EAC9F,GAAGC,EAEJ,SAAAQ,EAACY,EAAA,CAAU,MAAAJ,EAAc,YAAAC,EAA0B,aAAAC,EAC/C,SAAA,CAAAjB,EAACI,EAAA,CACG,SAAAJ,EAACH,EAAA,CAAA,CAAY,EACjB,IACCa,EAAA,CACG,SAAAV,EAACY,EAAA,CAAc,MAAAM,EAAe,SAAAb,EAAS,CAAA,CAC3C,CAAA,CAAA,CACJ,CAAA,CAAA,CAGZ,CAIO,SAASe,EAAuC,CAAE,GAAGrB,GAAiC,CACzF,MAAMsB,EAAQC,EAA0B,CAAE,SAAUvB,EAAM,WAAY,EAEtE,OACIC,EAACc,EAAA,CACG,YAAaO,EAAM,MAAM,MACzB,kBAAmB,GAAKA,EAAM,aAAa,EAAG,UAAU,EACxD,OAAQA,EAAM,WACd,aAAcE,EAAqBF,CAAK,EACvC,GAAGtB,EAEH,SAAAyB,KACIjC,EAAA,CAAW,GAAIiC,EAAK,GAChB,SAAAA,EAAK,KAAA,EADoBA,EAAK,EAEnC,CAAA,CAAA,CAIhB"}

package/dist/components/sidebar.js

@@ -1,2 +1,2 @@
-"use client";import{jsx as t,Fragment as C,jsxs as S}from"react/jsx-runtime";import{createContext as O,use as _,useState as v,useCallback as x,useEffect as D,useMemo as I}from"react";import{Button as T}from"./button.js";import{DialogTrigger as B,DialogOverlay as E,DialogContent as z}from"./dialog.js";import{TooltipTrigger as G,Tooltip as K}from"./tooltip.js";import{classNames as i}from"../utilities/primitives.js";import{useIsMobile as L}from"../utilities/use-mobile.js";import{IcLeft as R,IcRight as j}from"./icons.js";import"class-variance-authority";import"react-aria-components";import"./loader.js";import"clsx";import"lodash-es";const A="/",N=O(null);function h(){const e=_(N);if(!e)throw new Error("useSidebar must be used within a SidebarProvider.");return e}function ee({defaultOpen:e=!0,open:a,onOpenChange:n,className:l,style:d,children:o,...c}){const s=L(),[f,b]=v(!1),[M,y]=v(e),p=a??M,m=x(r=>{const u=typeof r=="function"?r(p):r;n?n(u):y(u)},[n,p]),g=x(()=>s?b(r=>!r):m(r=>!r),[s,m,b]);D(()=>{const r=u=>{u.key===A&&(u.metaKey||u.ctrlKey)&&(u.preventDefault(),g())};return window.addEventListener("keydown",r),()=>window.removeEventListener("keydown",r)},[g]);const w=p?"expanded":"collapsed",k=I(()=>({state:w,open:p,setOpen:m,isMobile:s,openMobile:f,setOpenMobile:b,toggleSidebar:g}),[w,p,m,s,f,b,g]);return t(N.Provider,{value:k,children:t("div",{className:i("group/sidebar-wrapper flex w-full has-[[data-variant=inset]]:bg-sidebar-background",l),...c,children:o})})}function ae({side:e="left",variant:a="sidebar",collapsible:n="offcanvas",className:l,children:d,...o}){const{isMobile:c,state:s,openMobile:f,setOpenMobile:b}=h();return n==="none"?t("div",{className:i("flex h-full w-[--sidebar-width] flex-col bg-sidebar-background text-sidebar-foreground",l),...o,children:d}):c?t(B,{isOpen:f,onOpenChange:b,...o,children:t(E,{children:t(z,{"data-sidebar":"sidebar","data-mobile":"true",className:"w-[--sidebar-width] max-h-svh overflow-auto p-0 [&>button]:hidden",side:"left",children:()=>t(C,{children:d})})})}):S("div",{className:"group peer hidden text-sidebar-foreground md:block","data-state":s,"data-collapsible":s==="collapsed"?n:"","data-variant":a,"data-side":e,children:[t("div",{className:i("relative w-(--sidebar-width) bg-sidebar-background transition-[width] duration-200 ease-linear","group-data-[collapsible=offcanvas]:w-0","group-data-[side=right]:rotate-180",a==="floating"?"group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4))]":"group-data-[collapsible=icon]:w-[--sidebar-width-icon]")}),t("div",{className:i("absolute z-10 hidden w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear md:flex",e==="left"?"left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]":"right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]",a==="floating"?"p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4)_+2px)]":"group-data-[collapsible=icon]:w-[--sidebar-width-icon] group-data-[side=left]:border-r group-data-[side=right]:border-l",l),...o,children:t("div",{"data-sidebar":"sidebar",className:"flex h-full w-full flex-col bg-sidebar-background group-data-[variant=floating]:border group-data-[variant=floating]:border-border",children:d})})]})}function te({className:e,onClick:a,...n}){const{toggleSidebar:l,open:d}=h();return t(T,{"data-sidebar":"trigger",variant:"neutral",size:"icon",className:"rounded-full",onClick:o=>{a?.(o),l()},...n,children:d?t(R,{}):t(j,{})})}function ie({className:e,...a}){return t("div",{"data-sidebar":"content",className:i("flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden",e),...a})}function ne({className:e,...a}){return t("div",{"data-sidebar":"group",className:i("relative flex w-full min-w-0 flex-col p-2",e),...a})}function re({className:e,...a}){return t("div",{"data-sidebar":"group-label",className:i("flex h-input shrink-0 items-center px-2 body-sm font-medium text-sidebar-foreground/70 outline-none ring-ring transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-icon [&>svg]:shrink-0","group-data-[collapsible=icon]:-mt-input group-data-[collapsible=icon]:opacity-0",e),...a})}function oe({className:e,...a}){return t("div",{"data-sidebar":"group-content",className:i("w-full body-sm",e),...a})}function le({className:e,...a}){return t("ul",{"data-sidebar":"menu",className:i("flex w-full min-w-0 flex-col",e),...a})}function de({className:e,...a}){return t("li",{"data-sidebar":"menu-item",className:i("group/menu-item relative list-none",e),...a})}function se({className:e,...a}){return t("button",{"data-sidebar":"menu-action",className:i("absolute top-0 right-0 btn btn-ghost h-input px-1","group-data-[collapsible=icon]:hidden",e),...a})}function ue({className:e,number:a,...n}){return t("div",{"data-sidebar":"menu-badge",className:i("absolute pointer-events-none top-0 right-0 font-300 h-input select-none px-2 flex items-center justify-center body-sm tabular-nums","group-data-[collapsible=icon]:hidden",e),...n,children:new Intl.NumberFormat(navigator.language,{useGrouping:!0}).format(a)})}function ce({className:e,...a}){return t("ul",{"data-sidebar":"menu-sub",className:i("mx-2 flex min-w-0 flex-col border-l border-border","group-data-[collapsible=icon]:hidden",e),...a})}function be({className:e,...a}){return t("li",{className:i("list-none ms-0",e),...a})}function pe({isActive:e=!1,tooltip:a,className:n,...l}){const{isMobile:d,state:o}=h(),c=t("button",{"data-sidebar":"menu-button","data-selected":e,className:i("peer/menu-button group-has-[[data-sidebar=menu-action]]/menu-item:pr-input group-data-[collapsible=icon]:!size-icon group-data-[collapsible=icon]:!p-2 ","btn-tab w-full",n),...l});return a?S(G,{children:[c,t(K,{hidden:o!=="collapsed"||d,...a})]}):c}function fe({isActive:e,className:a,...n}){return t("button",{"data-sidebar":"menu-sub-button","data-active":e,className:i("-translate-x-px [&>svg]:text-accent-foreground","group-data-[collapsible=icon]:hidden","btn-tab w-full",a),...n})}function me({className:e,...a}){return t("div",{className:i(e,"w-full overflow-auto"),...a})}export{ae as Sidebar,ie as SidebarContent,N as SidebarContext,ne as SidebarGroup,oe as SidebarGroupContent,re as SidebarGroupLabel,le as SidebarMenu,se as SidebarMenuAction,ue as SidebarMenuBadge,pe as SidebarMenuButton,de as SidebarMenuItem,ce as SidebarMenuSub,fe as SidebarMenuSubButton,be as SidebarMenuSubItem,me as SidebarOutlet,ee as SidebarProvider,te as SidebarTrigger,h as useSidebar};
+"use client";import{jsx as t,Fragment as C,jsxs as S}from"react/jsx-runtime";import{createContext as O,use as _,useState as v,useCallback as x,useEffect as D,useMemo as I}from"react";import{Button as T}from"./button.js";import{DialogTrigger as B,DialogOverlay as E,DialogContent as z}from"./dialog.js";import{TooltipTrigger as G,Tooltip as K}from"./tooltip.js";import{classNames as i}from"../utilities/theme.js";import{useIsMobile as L}from"../utilities/use-mobile.js";import{IcLeft as R,IcRight as j}from"./icons.js";import"class-variance-authority";import"react-aria-components";import"./loader.js";import"clsx";const A="/",N=O(null);function h(){const e=_(N);if(!e)throw new Error("useSidebar must be used within a SidebarProvider.");return e}function $({defaultOpen:e=!0,open:a,onOpenChange:n,className:l,style:d,children:o,...c}){const s=L(),[f,b]=v(!1),[M,y]=v(e),p=a??M,m=x(r=>{const u=typeof r=="function"?r(p):r;n?n(u):y(u)},[n,p]),g=x(()=>s?b(r=>!r):m(r=>!r),[s,m,b]);D(()=>{const r=u=>{u.key===A&&(u.metaKey||u.ctrlKey)&&(u.preventDefault(),g())};return window.addEventListener("keydown",r),()=>window.removeEventListener("keydown",r)},[g]);const w=p?"expanded":"collapsed",k=I(()=>({state:w,open:p,setOpen:m,isMobile:s,openMobile:f,setOpenMobile:b,toggleSidebar:g}),[w,p,m,s,f,b,g]);return t(N.Provider,{value:k,children:t("div",{className:i("group/sidebar-wrapper flex w-full has-[[data-variant=inset]]:bg-sidebar-background",l),...c,children:o})})}function ee({side:e="left",variant:a="sidebar",collapsible:n="offcanvas",className:l,children:d,...o}){const{isMobile:c,state:s,openMobile:f,setOpenMobile:b}=h();return n==="none"?t("div",{className:i("flex h-full w-[--sidebar-width] flex-col bg-sidebar-background text-sidebar-foreground",l),...o,children:d}):c?t(B,{isOpen:f,onOpenChange:b,...o,children:t(E,{children:t(z,{"data-sidebar":"sidebar","data-mobile":"true",className:"w-[--sidebar-width] max-h-svh overflow-auto p-0 [&>button]:hidden",side:"left",children:()=>t(C,{children:d})})})}):S("div",{className:"group peer hidden text-sidebar-foreground md:block","data-state":s,"data-collapsible":s==="collapsed"?n:"","data-variant":a,"data-side":e,children:[t("div",{className:i("relative w-(--sidebar-width) bg-sidebar-background transition-[width] duration-200 ease-linear","group-data-[collapsible=offcanvas]:w-0","group-data-[side=right]:rotate-180",a==="floating"?"group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4))]":"group-data-[collapsible=icon]:w-[--sidebar-width-icon]")}),t("div",{className:i("absolute z-10 hidden w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear md:flex",e==="left"?"left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]":"right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]",a==="floating"?"p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4)_+2px)]":"group-data-[collapsible=icon]:w-[--sidebar-width-icon] group-data-[side=left]:border-r group-data-[side=right]:border-l",l),...o,children:t("div",{"data-sidebar":"sidebar",className:"flex h-full w-full flex-col bg-sidebar-background group-data-[variant=floating]:border group-data-[variant=floating]:border-border",children:d})})]})}function ae({className:e,onClick:a,...n}){const{toggleSidebar:l,open:d}=h();return t(T,{"data-sidebar":"trigger",variant:"neutral",size:"icon",className:"rounded-full",onClick:o=>{a?.(o),l()},...n,children:d?t(R,{}):t(j,{})})}function te({className:e,...a}){return t("div",{"data-sidebar":"content",className:i("flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden",e),...a})}function ie({className:e,...a}){return t("div",{"data-sidebar":"group",className:i("relative flex w-full min-w-0 flex-col p-2",e),...a})}function ne({className:e,...a}){return t("div",{"data-sidebar":"group-label",className:i("flex h-input shrink-0 items-center px-2 body-sm font-medium text-sidebar-foreground/70 outline-none ring-ring transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-icon [&>svg]:shrink-0","group-data-[collapsible=icon]:-mt-input group-data-[collapsible=icon]:opacity-0",e),...a})}function re({className:e,...a}){return t("div",{"data-sidebar":"group-content",className:i("w-full body-sm",e),...a})}function oe({className:e,...a}){return t("ul",{"data-sidebar":"menu",className:i("flex w-full min-w-0 flex-col",e),...a})}function le({className:e,...a}){return t("li",{"data-sidebar":"menu-item",className:i("group/menu-item relative list-none",e),...a})}function de({className:e,...a}){return t("button",{"data-sidebar":"menu-action",className:i("absolute top-0 right-0 btn btn-ghost h-input px-1","group-data-[collapsible=icon]:hidden",e),...a})}function se({className:e,number:a,...n}){return t("div",{"data-sidebar":"menu-badge",className:i("absolute pointer-events-none top-0 right-0 font-300 h-input select-none px-2 flex items-center justify-center body-sm tabular-nums","group-data-[collapsible=icon]:hidden",e),...n,children:new Intl.NumberFormat(navigator.language,{useGrouping:!0}).format(a)})}function ue({className:e,...a}){return t("ul",{"data-sidebar":"menu-sub",className:i("mx-2 flex min-w-0 flex-col border-l border-border","group-data-[collapsible=icon]:hidden",e),...a})}function ce({className:e,...a}){return t("li",{className:i("list-none ms-0",e),...a})}function be({isActive:e=!1,tooltip:a,className:n,...l}){const{isMobile:d,state:o}=h(),c=t("button",{"data-sidebar":"menu-button","data-selected":e,className:i("peer/menu-button group-has-[[data-sidebar=menu-action]]/menu-item:pr-input group-data-[collapsible=icon]:!size-icon group-data-[collapsible=icon]:!p-2 ","btn-tab w-full",n),...l});return a?S(G,{children:[c,t(K,{hidden:o!=="collapsed"||d,...a})]}):c}function pe({isActive:e,className:a,...n}){return t("button",{"data-sidebar":"menu-sub-button","data-active":e,className:i("-translate-x-px [&>svg]:text-accent-foreground","group-data-[collapsible=icon]:hidden","btn-tab w-full",a),...n})}function fe({className:e,...a}){return t("div",{className:i(e,"w-full overflow-auto"),...a})}export{ee as Sidebar,te as SidebarContent,N as SidebarContext,ie as SidebarGroup,re as SidebarGroupContent,ne as SidebarGroupLabel,oe as SidebarMenu,de as SidebarMenuAction,se as SidebarMenuBadge,be as SidebarMenuButton,le as SidebarMenuItem,ue as SidebarMenuSub,pe as SidebarMenuSubButton,ce as SidebarMenuSubItem,fe as SidebarOutlet,$ as SidebarProvider,ae as SidebarTrigger,h as useSidebar};
 //# sourceMappingURL=sidebar.js.map