@cryptlex/web-components 6.1.0 → 6.3.0

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 \"lib/utils/primitives\"\nimport { CircleX, Info } from \"lucide-react\"\n\nexport const labelVariants = cva([\n  \"select-none text-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 (\n    <AriaLabel className={classNames(labelVariants(), className)} {...props} />\n  )\n}\n\nexport function FieldDescription({ className, children, ...props }: AriaTextProps) {\n  return (\n    <AriaText\n      className={classNames(\"text-sm text-muted leading-tight\", className)}\n      {...props}\n      slot=\"description\"\n    >\n      {children}<Info 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(\"text-sm leading-tight text-destructive duration-150 animate-in transition-transform  slide-in-from-top-5 fade-in\", className)}\n      {...props}\n    >\n      {children}<CircleX 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        // TODO standardize the padding here\n        \"relative flex h-input w-full items-center overflow-hidden border border-input bg-card px-2 py-2 text-sm 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\n  extends AriaGroupProps,\n  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\nexport function FormField({ label, description, errorMessage, children }: FormFieldProps & {\n  children: React.ReactNode\n}) {\n  return <>\n    {label && <FieldLabel>{label}</FieldLabel>}\n    {children}\n    {description && (<FieldDescription>{description}</FieldDescription>)}\n    {errorMessage && <FieldError>{errorMessage}</FieldError>}\n  </>\n}\n"],"names":["labelVariants","cva","FieldLabel","className","props","jsx","AriaLabel","classNames","FieldDescription","children","jsxs","AriaText","Info","FieldError","CircleX","fieldGroupVariants","FieldGroup","variant","AriaGroup","composeRenderProps","FormField","label","description","errorMessage","Fragment"],"mappings":"yUAgBO,MAAMA,EAAgBC,EAAI,CAC/B,+CAEA,iBAEA,uCACF,CAAC,EAEM,SAASC,EAAW,CAAE,UAAAC,EAAW,GAAGC,GAAyB,CAClE,OACEC,EAACC,GAAU,UAAWC,EAAWP,IAAiBG,CAAS,EAAI,GAAGC,EAAO,CAE7E,CAEO,SAASI,EAAiB,CAAE,UAAAL,EAAW,SAAAM,EAAU,GAAGL,GAAwB,CACjF,OACEM,EAACC,EAAA,CACC,UAAWJ,EAAW,mCAAoCJ,CAAS,EAClE,GAAGC,EACJ,KAAK,cAEJ,SAAA,CAAAK,EAASJ,EAACO,EAAA,CAAK,UAAU,qCAAA,CAAsC,CAAA,CAAA,CAAA,CAGtE,CAGO,SAASC,EAAW,CAAE,UAAAV,EAAW,SAAAM,EAAU,GAAGL,GAA6C,CAChG,OACEM,EAAC,MAAA,CACC,UAAWH,EAAW,mHAAoHJ,CAAS,EAClJ,GAAGC,EAEH,SAAA,CAAAK,EAASJ,EAACS,EAAA,CAAQ,UAAU,qCAAA,CAAsC,CAAA,CAAA,CAAA,CAGzE,CAEO,MAAMC,EAAqBd,EAAI,GAAI,CACxC,SAAU,CACR,QAAS,CACP,QAAS,CAEP,iIAEA,aAEA,gBAAA,EAEF,MAAO,EAAA,CACT,EAEF,gBAAiB,CACf,QAAS,SAAA,CAEb,CAAC,EAMM,SAASe,EAAW,CAAE,UAAAb,EAAW,QAAAc,EAAS,GAAGb,GAAqB,CACvE,OACEC,EAACa,EAAA,CACC,UAAWC,EAAmBhB,EAAYA,GACxCI,EAAWQ,EAAmB,CAAE,QAAAE,CAAA,CAAS,EAAGd,CAAS,CAAA,EAEtD,GAAGC,CAAA,CAAA,CAGV,CASO,SAASgB,EAAU,CAAE,MAAAC,EAAO,YAAAC,EAAa,aAAAC,EAAc,SAAAd,GAE3D,CACD,OAAOC,EAAAc,EAAA,CACJ,SAAA,CAAAH,GAAShB,EAACH,GAAY,SAAAmB,CAAA,CAAM,EAC5BZ,EACAa,GAAgBjB,EAACG,EAAA,CAAkB,SAAAc,CAAA,CAAY,EAC/CC,GAAgBlB,EAACQ,EAAA,CAAY,SAAAU,CAAA,CAAa,CAAA,EAC7C,CACF"}
+{"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 \"lib/utils/primitives\"\nimport { CircleX, Info } from \"lucide-react\"\n\nexport const labelVariants = cva([\n  \"select-none text-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 (\n    <AriaLabel className={classNames(labelVariants(), className)} {...props} />\n  )\n}\n\nexport function FieldDescription({ className, children, ...props }: AriaTextProps) {\n  return (\n    <AriaText\n      className={classNames(\"text-sm text-muted leading-tight\", className)}\n      {...props}\n      slot=\"description\"\n    >\n      {children}<Info 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(\"text-sm leading-tight text-destructive duration-150 animate-in transition-transform  slide-in-from-top-5 fade-in\", className)}\n      {...props}\n    >\n      {children}<CircleX 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        // TODO standardize the padding here\n        \"relative flex w-full items-center overflow-hidden border border-input bg-popover input-dim 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\n  extends AriaGroupProps,\n  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\nexport function FormField({ label, description, errorMessage, children }: FormFieldProps & {\n  children: React.ReactNode\n}) {\n  return <>\n    {label && <FieldLabel>{label}</FieldLabel>}\n    {children}\n    {description && (<FieldDescription>{description}</FieldDescription>)}\n    {errorMessage && <FieldError>{errorMessage}</FieldError>}\n  </>\n}\n"],"names":["labelVariants","cva","FieldLabel","className","props","jsx","AriaLabel","classNames","FieldDescription","children","jsxs","AriaText","Info","FieldError","CircleX","fieldGroupVariants","FieldGroup","variant","AriaGroup","composeRenderProps","FormField","label","description","errorMessage","Fragment"],"mappings":"yUAgBO,MAAMA,EAAgBC,EAAI,CAC/B,+CAEA,iBAEA,uCACF,CAAC,EAEM,SAASC,EAAW,CAAE,UAAAC,EAAW,GAAGC,GAAyB,CAClE,OACEC,EAACC,GAAU,UAAWC,EAAWP,IAAiBG,CAAS,EAAI,GAAGC,EAAO,CAE7E,CAEO,SAASI,EAAiB,CAAE,UAAAL,EAAW,SAAAM,EAAU,GAAGL,GAAwB,CACjF,OACEM,EAACC,EAAA,CACC,UAAWJ,EAAW,mCAAoCJ,CAAS,EAClE,GAAGC,EACJ,KAAK,cAEJ,SAAA,CAAAK,EAASJ,EAACO,EAAA,CAAK,UAAU,qCAAA,CAAsC,CAAA,CAAA,CAAA,CAGtE,CAGO,SAASC,EAAW,CAAE,UAAAV,EAAW,SAAAM,EAAU,GAAGL,GAA6C,CAChG,OACEM,EAAC,MAAA,CACC,UAAWH,EAAW,mHAAoHJ,CAAS,EAClJ,GAAGC,EAEH,SAAA,CAAAK,EAASJ,EAACS,EAAA,CAAQ,UAAU,qCAAA,CAAsC,CAAA,CAAA,CAAA,CAGzE,CAEO,MAAMC,EAAqBd,EAAI,GAAI,CACxC,SAAU,CACR,QAAS,CACP,QAAS,CAEP,oHAEA,aAEA,gBAAA,EAEF,MAAO,EAAA,CACT,EAEF,gBAAiB,CACf,QAAS,SAAA,CAEb,CAAC,EAMM,SAASe,EAAW,CAAE,UAAAb,EAAW,QAAAc,EAAS,GAAGb,GAAqB,CACvE,OACEC,EAACa,EAAA,CACC,UAAWC,EAAmBhB,EAAYA,GACxCI,EAAWQ,EAAmB,CAAE,QAAAE,CAAA,CAAS,EAAGd,CAAS,CAAA,EAEtD,GAAGC,CAAA,CAAA,CAGV,CASO,SAASgB,EAAU,CAAE,MAAAC,EAAO,YAAAC,EAAa,aAAAC,EAAc,SAAAd,GAE3D,CACD,OAAOC,EAAAc,EAAA,CACJ,SAAA,CAAAH,GAAShB,EAACH,GAAY,SAAAmB,CAAA,CAAM,EAC5BZ,EACAa,GAAgBjB,EAACG,EAAA,CAAkB,SAAAc,CAAA,CAAY,EAC/CC,GAAgBlB,EAACQ,EAAA,CAAY,SAAAU,CAAA,CAAa,CAAA,EAC7C,CACF"}

package/dist/components/id-search.js

@@ -1,2 +1,2 @@
-import{jsx as r,Fragment as x,jsxs as d}from"react/jsx-runtime";import{useQuery as l}from"@tanstack/react-query";import{Button as F}from"./button.js";import{Loader as I}from"./loader.js";import{Menu as N,MenuItem as C}from"./menu.js";import{PopoverTrigger as B,Popover as q}from"./popover.js";import{SearchField as j}from"./searchfield.js";import{useFieldContext as K}from"../utils/form-context.js";import{useId as M,useState as v}from"react";import{Autocomplete as A}from"react-aria-components";import"class-variance-authority";import"../utils/primitives.js";import"clsx";import"lucide-react";import"./list-box.js";import"./select.js";import"./field.js";import"@tanstack/react-form";function E({value:t,disabled:i=!1,searchFn:n,multiple:o,onChange:p,onBlur:f,accessor:h="id",idLookup:m}){const a=M(),[s,g]=v(""),{data:y,isError:c,isFetching:u,error:S}=l({queryKey:[a,s],queryFn:()=>n(s)}),b=l({queryKey:[a,t],queryFn:()=>m(Array.from(t.keys()).map(e=>e.toString())),enabled:m&&t.size>0});return r(x,{children:d(B,{onOpenChange:e=>{e||f?.(t)},children:[r(F,{className:"min-w-3xs",isDisabled:i,children:b.data?.join(",")}),r(q,{className:"p-2",children:d(A,{inputValue:s,onInputChange:g,children:[r(j,{className:"mb-icon",autoFocus:!0}),u&&r(I,{className:"p-input"}),!u&&!c&&r(N,{selectedKeys:t,selectionMode:o?"multiple":"single",onSelectionChange:e=>{typeof e!="string"&&p(e)},className:"text-sm",items:y,renderEmptyState:()=>"No results found.",children:e=>r(C,{id:e[h],children:e.name},e.id)}),c&&r("div",{className:"text-destructive p-icon",children:S.message})]})})]})})}function Z({disabled:t,...i}){const n=K();return r(E,{...i,disabled:t||n.form.state.isSubmitting,value:n.state.value,onBlur:o=>n.handleBlur(),onChange:o=>n.handleChange(o)})}export{E as IdSearchInput,Z as TfIdSearchInput};
+import{jsx as r,Fragment as x,jsxs as u}from"react/jsx-runtime";import{useQuery as d}from"@tanstack/react-query";import{Button as F}from"./button.js";import{Loader as I}from"./loader.js";import{Menu as N,MenuItem as C}from"./menu.js";import{PopoverTrigger as B,Popover as q}from"./popover.js";import{SearchField as j}from"./searchfield.js";import{useFieldContext as K}from"../utils/form-context.js";import{useId as M,useState as v}from"react";import{Autocomplete as A}from"react-aria-components";import"class-variance-authority";import"../utils/primitives.js";import"clsx";import"lucide-react";import"./list-box.js";import"./select.js";import"./field.js";import"../utils/form-utils.js";import"@tanstack/react-form";function E({value:t,disabled:i=!1,searchFn:o,multiple:n,onChange:l,onBlur:f,accessor:h="id",idLookup:m}){const a=M(),[s,g]=v(""),{data:y,isError:c,isFetching:p,error:S}=d({queryKey:[a,s],queryFn:()=>o(s)}),b=d({queryKey:[a,t],queryFn:()=>m(Array.from(t.keys()).map(e=>e.toString())),enabled:m&&t.size>0});return r(x,{children:u(B,{onOpenChange:e=>{e||f?.(t)},children:[r(F,{className:"min-w-3xs",isDisabled:i,children:b.data?.join(",")}),r(q,{className:"p-2",children:u(A,{inputValue:s,onInputChange:g,children:[r(j,{className:"mb-icon",autoFocus:!0}),p&&r(I,{className:"p-input"}),!p&&!c&&r(N,{selectedKeys:t,selectionMode:n?"multiple":"single",onSelectionChange:e=>{typeof e!="string"&&l(e)},className:"text-sm",items:y,renderEmptyState:()=>"No results found.",children:e=>r(C,{id:e[h],children:e.name},e.id)}),c&&r("div",{className:"text-destructive p-icon",children:S.message})]})})]})})}function $({disabled:t,...i}){const o=K();return r(E,{...i,disabled:t||o.form.state.isSubmitting,value:o.state.value,onBlur:n=>o.handleBlur(),onChange:n=>o.handleChange(n)})}export{E as IdSearchInput,$ as TfIdSearchInput};
 //# 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 { Button } from \"lib/components/button\";\nimport { Loader } from \"lib/components/loader\";\nimport { Menu, MenuItem } from \"lib/components/menu\";\nimport { Popover, PopoverTrigger } from \"lib/components/popover\";\nimport { SearchField } from \"lib/components/searchfield\";\nimport { useFieldContext } from \"lib/utils/form-context\";\nimport { useId, useState } from \"react\";\nimport { Autocomplete } from 'react-aria-components';\n\nexport type SelectState = Set<number | string>;\n\ntype SearchInputProps<T> = {\n    value: SelectState;\n    onChange: (v: SelectState) => void\n    onBlur?: (v: SelectState) => void\n    multiple: boolean\n    disabled?: boolean\n    idLookup?: (ids: string[]) => Promise<string[] | undefined>\n    searchFn: (q: string) => Promise<T[] | undefined>\n    accessor: 'id' | 'name';\n}\nexport function IdSearchInput<T extends { id: string; name: string }>({ value, disabled = false, searchFn, multiple, onChange, onBlur, accessor = 'id', idLookup }: SearchInputProps<T>) {\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    const namesQuery = useQuery({\n        queryKey: [id, value],\n        queryFn: () => idLookup!(Array.from(value.keys()).map(id => id.toString())),\n        enabled: idLookup && value.size > 0\n    })\n\n    const renderButtonLabel = () => {\n        return namesQuery.data?.join(',');\n    };\n\n    return <>\n        <PopoverTrigger onOpenChange={(o) => {\n            if (!o) {\n                // searchInputRef.current?.focus();\n                onBlur?.(value);\n            }\n        }}>\n            <Button className={'min-w-3xs'} isDisabled={disabled}>{renderButtonLabel()}</Button>\n            <Popover className={'p-2'}>\n                <Autocomplete\n                    inputValue={search}\n                    onInputChange={_setSearch}\n                >\n                    <SearchField className={'mb-icon'} autoFocus />\n                    {isFetching && <Loader className=\"p-input\" />}\n                    {!isFetching && !isError && <Menu selectedKeys={value} selectionMode={multiple ? \"multiple\" : 'single'} onSelectionChange={(s) => {\n                        if (typeof (s) === 'string') return;\n                        onChange(s)\n                    }} className={'text-sm'} items={data} renderEmptyState={() => 'No results found.'}>\n                        {(item) => (<MenuItem key={item['id']} id={item[accessor]}>{item.name}</MenuItem>)}\n                    </Menu>}\n                    {\n                        isError && <div className=\"text-destructive p-icon\">{error.message}</div>\n                    }\n                </Autocomplete>\n            </Popover>\n        </PopoverTrigger >\n    </>\n\n}\n\nexport function TfIdSearchInput<T extends { id: string; name: string }>({ disabled, ...props }: Omit<SearchInputProps<T>, 'value' | 'onChange'>) {\n    const field = useFieldContext<SelectState>();\n    return (\n        <IdSearchInput\n            {...props}\n            disabled={disabled || field.form.state.isSubmitting}\n            value={field.state.value}\n            onBlur={_ => field.handleBlur()}\n            onChange={(e) => field.handleChange(e)}\n        />\n    );\n}"],"names":["IdSearchInput","value","disabled","searchFn","multiple","onChange","onBlur","accessor","idLookup","id","useId","search","_setSearch","useState","data","isError","isFetching","error","useQuery","namesQuery","jsx","Fragment","jsxs","PopoverTrigger","o","Button","Popover","Autocomplete","SearchField","Loader","Menu","s","item","MenuItem","TfIdSearchInput","props","field","useFieldContext","_","e"],"mappings":"4qBAsBO,SAASA,EAAsD,CAAE,MAAAC,EAAO,SAAAC,EAAW,GAAO,SAAAC,EAAU,SAAAC,EAAU,SAAAC,EAAU,OAAAC,EAAQ,SAAAC,EAAW,KAAM,SAAAC,CAAA,EAAiC,CACrL,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,IAAMR,EAASQ,CAAM,CAAA,CACjC,EAEKQ,EAAaD,EAAS,CACxB,SAAU,CAACT,EAAIR,CAAK,EACpB,QAAS,IAAMO,EAAU,MAAM,KAAKP,EAAM,MAAM,EAAE,IAAIQ,GAAMA,EAAG,SAAA,CAAU,CAAC,EAC1E,QAASD,GAAYP,EAAM,KAAO,CAAA,CACrC,EAMD,OAAOmB,EAAAC,EAAA,CACH,SAAAC,EAACC,EAAA,CAAe,aAAeC,GAAM,CAC5BA,GAEDlB,IAASL,CAAK,CAEtB,EACI,SAAA,CAAAmB,EAACK,GAAO,UAAW,YAAa,WAAYvB,EAAW,SAVpDiB,EAAW,MAAM,KAAK,GAAG,EAU+C,EAC3EC,EAACM,EAAA,CAAQ,UAAW,MAChB,SAAAJ,EAACK,EAAA,CACG,WAAYhB,EACZ,cAAeC,EAEf,SAAA,CAAAQ,EAACQ,EAAA,CAAY,UAAW,UAAW,UAAS,GAAC,EAC5CZ,GAAcI,EAACS,EAAA,CAAO,UAAU,SAAA,CAAU,EAC1C,CAACb,GAAc,CAACD,KAAYe,EAAA,CAAK,aAAc7B,EAAO,cAAeG,EAAW,WAAa,SAAU,kBAAoB2B,GAAM,CAC1H,OAAQA,GAAO,UACnB1B,EAAS0B,CAAC,CACd,EAAG,UAAW,UAAW,MAAOjB,EAAM,iBAAkB,IAAM,oBACzD,SAACkB,KAAWC,EAAA,CAA0B,GAAID,EAAKzB,CAAQ,EAAI,WAAK,MAAtCyB,EAAK,EAAsC,CAAA,CAC1E,EAEIjB,GAAWK,EAAC,MAAA,CAAI,UAAU,0BAA2B,WAAM,OAAA,CAAQ,CAAA,CAAA,CAAA,CAE3E,CACJ,CAAA,CAAA,CACJ,CAAA,CACJ,CAEJ,CAEO,SAASc,EAAwD,CAAE,SAAAhC,EAAU,GAAGiC,GAA0D,CAC7I,MAAMC,EAAQC,EAAA,EACd,OACIjB,EAACpB,EAAA,CACI,GAAGmC,EACJ,SAAUjC,GAAYkC,EAAM,KAAK,MAAM,aACvC,MAAOA,EAAM,MAAM,MACnB,OAAQE,GAAKF,EAAM,WAAA,EACnB,SAAWG,GAAMH,EAAM,aAAaG,CAAC,CAAA,CAAA,CAGjD"}
+{"version":3,"file":"id-search.js","sources":["../../lib/components/id-search.tsx"],"sourcesContent":["import { useQuery } from \"@tanstack/react-query\";\nimport { Button } from \"lib/components/button\";\nimport { Loader } from \"lib/components/loader\";\nimport { Menu, MenuItem } from \"lib/components/menu\";\nimport { Popover, PopoverTrigger } from \"lib/components/popover\";\nimport { SearchField } from \"lib/components/searchfield\";\nimport { useFieldContext } from \"lib/utils/form-context\";\nimport { useId, useState } from \"react\";\nimport { Autocomplete } from 'react-aria-components';\n\nexport type SelectState = Set<number | string>;\n\ntype SearchInputProps<T> = {\n    value: SelectState;\n    onChange: (v: SelectState) => void\n    onBlur?: (v: SelectState) => void\n    multiple: boolean\n    disabled?: boolean\n    idLookup?: (ids: string[]) => Promise<string[] | undefined>\n    searchFn: (q: string) => Promise<T[] | undefined>\n    accessor: 'id' | 'name';\n}\nexport function IdSearchInput<T extends { id: string; name: string }>({ value, disabled = false, searchFn, multiple, onChange, onBlur, accessor = 'id', idLookup }: SearchInputProps<T>) {\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    const namesQuery = useQuery({\n        queryKey: [id, value],\n        queryFn: () => idLookup!(Array.from(value.keys()).map(id => id.toString())),\n        enabled: idLookup && value.size > 0\n    })\n\n    const renderButtonLabel = () => {\n        return namesQuery.data?.join(',');\n    };\n\n    return <>\n        <PopoverTrigger onOpenChange={(o) => {\n            if (!o) {\n                // searchInputRef.current?.focus();\n                onBlur?.(value);\n            }\n        }}>\n            <Button className={'min-w-3xs'} isDisabled={disabled}>{renderButtonLabel()}</Button>\n            <Popover className={'p-2'}>\n                <Autocomplete\n                    inputValue={search}\n                    onInputChange={_setSearch}\n                >\n                    <SearchField className={'mb-icon'} autoFocus />\n                    {isFetching && <Loader className=\"p-input\" />}\n                    {!isFetching && !isError && <Menu selectedKeys={value} selectionMode={multiple ? \"multiple\" : 'single'} onSelectionChange={(s) => {\n                        if (typeof (s) === 'string') return;\n                        onChange(s)\n                    }} className={'text-sm'} items={data} renderEmptyState={() => 'No results found.'}>\n                        {(item) => (<MenuItem key={item['id']} id={item[accessor]}>{item.name}</MenuItem>)}\n                    </Menu>}\n                    {\n                        isError && <div className=\"text-destructive p-icon\">{error.message}</div>\n                    }\n                </Autocomplete>\n            </Popover>\n        </PopoverTrigger >\n    </>\n\n}\n\nexport function TfIdSearchInput<T extends { id: string; name: string }>({ disabled, ...props }: Omit<SearchInputProps<T>, 'value' | 'onChange'>) {\n    const field = useFieldContext<SelectState>();\n    return (\n        <IdSearchInput\n            {...props}\n            disabled={disabled || field.form.state.isSubmitting}\n            value={field.state.value}\n            onBlur={_ => field.handleBlur()}\n            onChange={(e) => field.handleChange(e)}\n        />\n    );\n}"],"names":["IdSearchInput","value","disabled","searchFn","multiple","onChange","onBlur","accessor","idLookup","id","useId","search","_setSearch","useState","data","isError","isFetching","error","useQuery","namesQuery","jsx","Fragment","jsxs","PopoverTrigger","o","Button","Popover","Autocomplete","SearchField","Loader","Menu","s","item","MenuItem","TfIdSearchInput","props","field","useFieldContext","_","e"],"mappings":"2sBAsBO,SAASA,EAAsD,CAAE,MAAAC,EAAO,SAAAC,EAAW,GAAO,SAAAC,EAAU,SAAAC,EAAU,SAAAC,EAAU,OAAAC,EAAQ,SAAAC,EAAW,KAAM,SAAAC,CAAA,EAAiC,CACrL,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,IAAMR,EAASQ,CAAM,CAAA,CACjC,EAEKQ,EAAaD,EAAS,CACxB,SAAU,CAACT,EAAIR,CAAK,EACpB,QAAS,IAAMO,EAAU,MAAM,KAAKP,EAAM,MAAM,EAAE,IAAIQ,GAAMA,EAAG,SAAA,CAAU,CAAC,EAC1E,QAASD,GAAYP,EAAM,KAAO,CAAA,CACrC,EAMD,OAAOmB,EAAAC,EAAA,CACH,SAAAC,EAACC,EAAA,CAAe,aAAeC,GAAM,CAC5BA,GAEDlB,IAASL,CAAK,CAEtB,EACI,SAAA,CAAAmB,EAACK,GAAO,UAAW,YAAa,WAAYvB,EAAW,SAVpDiB,EAAW,MAAM,KAAK,GAAG,EAU+C,EAC3EC,EAACM,EAAA,CAAQ,UAAW,MAChB,SAAAJ,EAACK,EAAA,CACG,WAAYhB,EACZ,cAAeC,EAEf,SAAA,CAAAQ,EAACQ,EAAA,CAAY,UAAW,UAAW,UAAS,GAAC,EAC5CZ,GAAcI,EAACS,EAAA,CAAO,UAAU,SAAA,CAAU,EAC1C,CAACb,GAAc,CAACD,KAAYe,EAAA,CAAK,aAAc7B,EAAO,cAAeG,EAAW,WAAa,SAAU,kBAAoB2B,GAAM,CAC1H,OAAQA,GAAO,UACnB1B,EAAS0B,CAAC,CACd,EAAG,UAAW,UAAW,MAAOjB,EAAM,iBAAkB,IAAM,oBACzD,SAACkB,KAAWC,EAAA,CAA0B,GAAID,EAAKzB,CAAQ,EAAI,WAAK,MAAtCyB,EAAK,EAAsC,CAAA,CAC1E,EAEIjB,GAAWK,EAAC,MAAA,CAAI,UAAU,0BAA2B,WAAM,OAAA,CAAQ,CAAA,CAAA,CAAA,CAE3E,CACJ,CAAA,CAAA,CACJ,CAAA,CACJ,CAEJ,CAEO,SAASc,EAAwD,CAAE,SAAAhC,EAAU,GAAGiC,GAA0D,CAC7I,MAAMC,EAAQC,EAAA,EACd,OACIjB,EAACpB,EAAA,CACI,GAAGmC,EACJ,SAAUjC,GAAYkC,EAAM,KAAK,MAAM,aACvC,MAAOA,EAAM,MAAM,MACnB,OAAQE,GAAKF,EAAM,WAAA,EACnB,SAAWG,GAAMH,EAAM,aAAaG,CAAC,CAAA,CAAA,CAGjD"}

package/dist/components/key-value-card.js

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

package/dist/components/key-value-card.js.map

@@ -1 +1 @@
-{"version":3,"file":"key-value-card.js","sources":["../../lib/components/key-value-card.tsx"],"sourcesContent":["import { Badge } from \"lib/components/badge\";\nimport { Card, CardContent, CardHeader, CardTitle } from \"lib/components/card\";\nimport { formatDate } from \"lib/components/data-table-commons\";\nimport { Skeleton } from \"lib/components/skeleton\";\n\n// Utility type to handle nested keys (dot notation) in any object\ntype NestedKeyOf<T> = T extends object\n\t? {\n\t\t[K in keyof T]: K extends string | number\n\t\t? `${K & string}` | `${K & string}.${NestedKeyOf<T[K]>}`\n\t\t: never;\n\t}[keyof T]\n\t: never;\n\n// DisplayField type that works with nested keys\nexport type DisplayField<T> = {\n\tdisplay: string;\n\taccessor: NestedKeyOf<T>;\n\ttype?:\n\t| \"text\"\n\t| \"badge\"\n\t| \"boolean\"\n\t| \"date\"\n\t| \"yesno\"\n\t| \"copyButton\"\n\t| \"link\"; // Field types\n\ttransform?: (value: any) => React.ReactNode;\n};\n\nexport interface KeyValueCardProps<T> {\n\tdata: T; // Ensure data is of type T\n\tlabel: string;\n\tfields: DisplayField<T>[];\n\tclassName?: string;\n}\n\nexport const KeyValueCard = <T extends {}>({\n\tdata,\n\tlabel,\n\tfields,\n}: KeyValueCardProps<T>) => {\n\tconst renderValue = (field: DisplayField<T>, value: any) => {\n\t\tif (field.transform) {\n\t\t\treturn field.transform(value);\n\t\t}\n\t\tif (value === undefined || value === null) {\n\t\t\treturn \"-\";\n\t\t}\n\t\tswitch (field.type) {\n\t\t\tcase \"date\":\n\t\t\t\treturn <span>{formatDate(value)}</span>;\n\t\t\tcase \"yesno\":\n\t\t\t\treturn <span>{value ? \"Yes\" : \"No\"}</span>;\n\t\t\tcase \"badge\":\n\t\t\t\treturn (\n\t\t\t\t\t<div className=\"flex flex-wrap gap-1\">\n\t\t\t\t\t\t{Array.isArray(value)\n\t\t\t\t\t\t\t? value.map((item, index) => (\n\t\t\t\t\t\t\t\t<Badge key={index}>\n\t\t\t\t\t\t\t\t\t{typeof item === \"object\" ? item?.name || item?.id : item}\n\t\t\t\t\t\t\t\t</Badge>\n\t\t\t\t\t\t\t))\n\t\t\t\t\t\t\t: value}\n\t\t\t\t\t</div>\n\t\t\t\t);\n\n\t\t\tcase \"boolean\":\n\t\t\t\treturn <span>{value.toString()}</span>;\n\t\t\tdefault:\n\t\t\t\treturn <span>{value}</span>;\n\t\t}\n\t};\n\n\treturn (\n\t\t<Card>\n\t\t\t<CardHeader>\n\t\t\t\t<CardTitle>{label}</CardTitle>\n\t\t\t</CardHeader>\n\t\t\t<CardContent>\n\t\t\t\t<div className=\"flex flex-col gap-2\">\n\t\t\t\t\t{data\n\t\t\t\t\t\t? fields.map((field) => {\n\t\t\t\t\t\t\t// TODO: improve this\n\t\t\t\t\t\t\tconst value = field.accessor\n\t\t\t\t\t\t\t\t? field.accessor\n\t\t\t\t\t\t\t\t\t.split(\".\")\n\t\t\t\t\t\t\t\t\t.reduce(\n\t\t\t\t\t\t\t\t\t\t(obj, key) =>\n\t\t\t\t\t\t\t\t\t\t\tobj && key in obj ? obj[key] : undefined,\n\t\t\t\t\t\t\t\t\t\tdata as Record<string, any>,\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t: null;\n\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tkey={field.display}\n\t\t\t\t\t\t\t\t\tclassName=\"flex w-full flex-col md:flex-row justify-between first:pt-0 last:pb-0\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<p className=\"text-sm flex w-full justify-start col-span-1\">\n\t\t\t\t\t\t\t\t\t\t{field.display}\n\t\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t\t<div className=\"text-sm flex w-full justify-start text-wrap break-all\">\n\t\t\t\t\t\t\t\t\t\t{renderValue(field, value)}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t})\n\t\t\t\t\t\t: fields.map((_, index) => (\n\t\t\t\t\t\t\t<Skeleton key={index} className=\"h-12 w-full\" />\n\t\t\t\t\t\t))}\n\t\t\t\t</div>\n\t\t\t</CardContent>\n\t\t</Card>\n\t);\n};\n"],"names":["KeyValueCard","data","label","fields","renderValue","field","value","jsx","formatDate","item","index","Badge","Card","CardHeader","CardTitle","CardContent","obj","key","jsxs","_","Skeleton"],"mappings":"0hBAoCO,MAAMA,EAAe,CAAe,CAC1C,KAAAC,EACA,MAAAC,EACA,OAAAC,CACD,IAA4B,CAC3B,MAAMC,EAAc,CAACC,EAAwBC,IAAe,CAC3D,GAAID,EAAM,UACT,OAAOA,EAAM,UAAUC,CAAK,EAE7B,GAA2BA,GAAU,KACpC,MAAO,IAER,OAAQD,EAAM,KAAA,CACb,IAAK,OACJ,OAAOE,EAAC,OAAA,CAAM,SAAAC,EAAWF,CAAK,EAAE,EACjC,IAAK,QACJ,OAAOC,EAAC,OAAA,CAAM,SAAAD,EAAQ,MAAQ,KAAK,EACpC,IAAK,QACJ,OACCC,EAAC,MAAA,CAAI,UAAU,uBACb,SAAA,MAAM,QAAQD,CAAK,EACjBA,EAAM,IAAI,CAACG,EAAMC,MACjBC,EAAA,CACC,SAAA,OAAOF,GAAS,SAAWA,GAAM,MAAQA,GAAM,GAAKA,CAAA,EAD1CC,CAEZ,CACA,EACCJ,CAAA,CACJ,EAGF,IAAK,UACJ,OAAOC,EAAC,OAAA,CAAM,SAAAD,EAAM,SAAA,EAAW,EAChC,QACC,OAAOC,EAAC,QAAM,SAAAD,CAAA,CAAM,CAAA,CAEvB,EAEA,SACEM,EAAA,CACA,SAAA,CAAAL,EAACM,EAAA,CACA,SAAAN,EAACO,EAAA,CAAW,SAAAZ,CAAA,CAAM,EACnB,EACAK,EAACQ,EAAA,CACA,SAAAR,EAAC,MAAA,CAAI,UAAU,sBACb,SAAAN,EACEE,EAAO,IAAKE,GAAU,CAEvB,MAAMC,EAAQD,EAAM,SACjBA,EAAM,SACN,MAAM,GAAG,EACT,OACA,CAACW,EAAKC,IACLD,GAAOC,KAAOD,EAAMA,EAAIC,CAAG,EAAI,OAChChB,CAAA,EAEA,KAEH,OACCiB,EAAC,MAAA,CAEA,UAAU,wEAEV,SAAA,CAAAX,EAAC,IAAA,CAAE,UAAU,+CACX,SAAAF,EAAM,QACR,IACC,MAAA,CAAI,UAAU,wDACb,SAAAD,EAAYC,EAAOC,CAAK,CAAA,CAC1B,CAAA,CAAA,EARKD,EAAM,OAAA,CAWd,CAAC,EACCF,EAAO,IAAI,CAACgB,EAAGT,IAChBH,EAACa,EAAA,CAAqB,UAAU,aAAA,EAAjBV,CAA+B,CAC9C,EACH,CAAA,CACD,CAAA,EACD,CAEF"}
+{"version":3,"file":"key-value-card.js","sources":["../../lib/components/key-value-card.tsx"],"sourcesContent":["import { Badge } from \"lib/components/badge\";\nimport { Card, CardContent, CardHeader, CardTitle } from \"lib/components/card\";\nimport { formatDate } from \"lib/components/data-table-commons\";\nimport { Skeleton } from \"lib/components/skeleton\";\n\n// Utility type to handle nested keys (dot notation) in any object\ntype NestedKeyOf<T> = T extends object\n\t? {\n\t\t[K in keyof T]: K extends string | number\n\t\t? `${K & string}` | `${K & string}.${NestedKeyOf<T[K]>}`\n\t\t: never;\n\t}[keyof T]\n\t: never;\n\n// DisplayField type that works with nested keys\nexport type DisplayField<T> = {\n\tdisplay: string;\n\taccessor: NestedKeyOf<T>;\n\ttype?:\n\t| \"text\"\n\t| \"badge\"\n\t| \"boolean\"\n\t| \"date\"\n\t| \"yesno\"\n\t| \"copyButton\"\n\t| \"link\"; // Field types\n\ttransform?: (value: any) => React.ReactNode;\n};\n\nexport interface KeyValueCardProps<T> {\n\tdata: T; // Ensure data is of type T\n\tlabel: string;\n\tfields: DisplayField<T>[];\n\tclassName?: string;\n}\n\nexport const KeyValueCard = <T extends {}>({\n\tdata,\n\tlabel,\n\tfields,\n}: KeyValueCardProps<T>) => {\n\tconst renderValue = (field: DisplayField<T>, value: any) => {\n\t\tif (field.transform) {\n\t\t\treturn field.transform(value);\n\t\t}\n\t\tif (value === undefined || value === null) {\n\t\t\treturn \"-\";\n\t\t}\n\t\tswitch (field.type) {\n\t\t\tcase \"date\":\n\t\t\t\treturn <span>{formatDate(value)}</span>;\n\t\t\tcase \"yesno\":\n\t\t\t\treturn <span>{value ? \"Yes\" : \"No\"}</span>;\n\t\t\tcase \"badge\":\n\t\t\t\treturn (\n\t\t\t\t\t<div className=\"flex flex-wrap gap-1\">\n\t\t\t\t\t\t{Array.isArray(value)\n\t\t\t\t\t\t\t? value.map((item, index) => (\n\t\t\t\t\t\t\t\t<Badge key={index}>\n\t\t\t\t\t\t\t\t\t{typeof item === \"object\" ? item?.name || item?.id : item}\n\t\t\t\t\t\t\t\t</Badge>\n\t\t\t\t\t\t\t))\n\t\t\t\t\t\t\t: value}\n\t\t\t\t\t</div>\n\t\t\t\t);\n\n\t\t\tcase \"boolean\":\n\t\t\t\treturn <span>{value.toString()}</span>;\n\t\t\tdefault:\n\t\t\t\treturn <span>{value}</span>;\n\t\t}\n\t};\n\n\treturn (\n\t\t<Card>\n\t\t\t<CardHeader>\n\t\t\t\t<CardTitle>{label}</CardTitle>\n\t\t\t</CardHeader>\n\t\t\t<CardContent>\n\t\t\t\t<div className=\"flex flex-col gap-2\">\n\t\t\t\t\t{data\n\t\t\t\t\t\t? fields.map((field) => {\n\t\t\t\t\t\t\t// TODO: improve this\n\t\t\t\t\t\t\tconst value = field.accessor\n\t\t\t\t\t\t\t\t? field.accessor\n\t\t\t\t\t\t\t\t\t.split(\".\")\n\t\t\t\t\t\t\t\t\t.reduce(\n\t\t\t\t\t\t\t\t\t\t(obj, key) =>\n\t\t\t\t\t\t\t\t\t\t\tobj && key in obj ? obj[key] : undefined,\n\t\t\t\t\t\t\t\t\t\tdata as Record<string, any>,\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t: null;\n\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tkey={field.display}\n\t\t\t\t\t\t\t\t\tclassName=\"flex w-full flex-col md:flex-row justify-between first:pt-0 last:pb-0\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<p className=\"text-sm flex w-full justify-start col-span-1\">\n\t\t\t\t\t\t\t\t\t\t{field.display}\n\t\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t\t<div className=\"text-sm flex w-full justify-start text-wrap break-all\">\n\t\t\t\t\t\t\t\t\t\t{renderValue(field, value)}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t})\n\t\t\t\t\t\t: fields.map((_, index) => (\n\t\t\t\t\t\t\t<Skeleton key={index} className=\"h-12 w-full\" />\n\t\t\t\t\t\t))}\n\t\t\t\t</div>\n\t\t\t</CardContent>\n\t\t</Card>\n\t);\n};\n"],"names":["KeyValueCard","data","label","fields","renderValue","field","value","jsx","formatDate","item","index","Badge","Card","CardHeader","CardTitle","CardContent","obj","key","jsxs","_","Skeleton"],"mappings":"ukBAoCO,MAAMA,EAAe,CAAe,CAC1C,KAAAC,EACA,MAAAC,EACA,OAAAC,CACD,IAA4B,CAC3B,MAAMC,EAAc,CAACC,EAAwBC,IAAe,CAC3D,GAAID,EAAM,UACT,OAAOA,EAAM,UAAUC,CAAK,EAE7B,GAA2BA,GAAU,KACpC,MAAO,IAER,OAAQD,EAAM,KAAA,CACb,IAAK,OACJ,OAAOE,EAAC,OAAA,CAAM,SAAAC,EAAWF,CAAK,EAAE,EACjC,IAAK,QACJ,OAAOC,EAAC,OAAA,CAAM,SAAAD,EAAQ,MAAQ,KAAK,EACpC,IAAK,QACJ,OACCC,EAAC,MAAA,CAAI,UAAU,uBACb,SAAA,MAAM,QAAQD,CAAK,EACjBA,EAAM,IAAI,CAACG,EAAMC,MACjBC,EAAA,CACC,SAAA,OAAOF,GAAS,SAAWA,GAAM,MAAQA,GAAM,GAAKA,CAAA,EAD1CC,CAEZ,CACA,EACCJ,CAAA,CACJ,EAGF,IAAK,UACJ,OAAOC,EAAC,OAAA,CAAM,SAAAD,EAAM,SAAA,EAAW,EAChC,QACC,OAAOC,EAAC,QAAM,SAAAD,CAAA,CAAM,CAAA,CAEvB,EAEA,SACEM,EAAA,CACA,SAAA,CAAAL,EAACM,EAAA,CACA,SAAAN,EAACO,EAAA,CAAW,SAAAZ,CAAA,CAAM,EACnB,EACAK,EAACQ,EAAA,CACA,SAAAR,EAAC,MAAA,CAAI,UAAU,sBACb,SAAAN,EACEE,EAAO,IAAKE,GAAU,CAEvB,MAAMC,EAAQD,EAAM,SACjBA,EAAM,SACN,MAAM,GAAG,EACT,OACA,CAACW,EAAKC,IACLD,GAAOC,KAAOD,EAAMA,EAAIC,CAAG,EAAI,OAChChB,CAAA,EAEA,KAEH,OACCiB,EAAC,MAAA,CAEA,UAAU,wEAEV,SAAA,CAAAX,EAAC,IAAA,CAAE,UAAU,+CACX,SAAAF,EAAM,QACR,IACC,MAAA,CAAI,UAAU,wDACb,SAAAD,EAAYC,EAAOC,CAAK,CAAA,CAC1B,CAAA,CAAA,EARKD,EAAM,OAAA,CAWd,CAAC,EACCF,EAAO,IAAI,CAACgB,EAAGT,IAChBH,EAACa,EAAA,CAAqB,UAAU,aAAA,EAAjBV,CAA+B,CAC9C,EACH,CAAA,CACD,CAAA,EACD,CAEF"}

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 l,MenuItem as p,composeRenderProps as u,Menu as f,SubmenuTrigger as d,Header as b,Separator as M,Keyboard as g}from"react-aria-components";import{classNames as a}from"../utils/primitives.js";import{Dot as x,Check as h,ChevronRight as N}from"lucide-react";import{Button as y}from"./button.js";import{ListBoxCollection as v}from"./list-box.js";import{SelectPopover as S}from"./select.js";import"clsx";import"class-variance-authority";import"./loader.js";import"./field.js";import"../utils/form-context.js";import"@tanstack/react-form";import"./popover.js";const T=l,L=d,q=v;function _({className:e,...t}){return o(S,{className:u(e,n=>a(n)),...t})}function j({className:e,...t}){return o(f,{className:a("overflow-auto p-1 outline-0 [clip-path:inset(0_0_0_0_round_calc(var(--radius)-2px))]",e),escapeKeyBehavior:"none",...t})}function A({children:e,className:t,...n}){return o(p,{textValue:n.textValue||(typeof e=="string"?e:void 0),className:u(t,r=>a("btn btn-ghost relative flex justify-start input-dim","data-[selection-mode]:pl-input",r)),...n,children:u(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(x,{className:"size-icon fill-current"}),i.selectionMode=="multiple"&&o(h,{className:"size-icon"})]})}),r,i.hasSubmenu&&o(N,{className:"ml-auto size-icon"})]}))})}function G({className:e,inset:t,separator:n=!0,...r}){return o(b,{className:a("px-3 py-1.5 text-sm font-semibold",t&&"pl-input",n&&"-mx-1 mb-1 border-b border-b-border pb-2.5",e),...r})}function J({className:e,...t}){return o(M,{className:a("-mx-1 my-1 h-px bg-muted",e),...t})}function O({className:e,...t}){return o(g,{className:a("ml-auto text-xs tracking-widest opacity-60",e),...t})}function P({label:e,children:t,variant:n,isDisabled:r,size:i,...m}){return s(T,{...m,children:[o(y,{isDisabled:r,type:"button",variant:n,size:i,children:e}),o(_,{className:"overflow-auto",children:o(j,{...m,children:t})})]})}export{P as EasyMenu,j as Menu,q as MenuCollection,G as MenuHeader,A as MenuItem,O as MenuKeyboard,_ as MenuPopover,J as MenuSeparator,L as MenuSubTrigger,T as MenuTrigger};
+import{jsxs as s,jsx as o,Fragment as c}from"react/jsx-runtime";import{MenuTrigger as l,MenuItem as p,composeRenderProps as u,Menu as f,SubmenuTrigger as d,Header as b,Separator as M,Keyboard as g}from"react-aria-components";import{classNames as a}from"../utils/primitives.js";import{Dot as x,Check as h,ChevronRight as N}from"lucide-react";import{Button as y}from"./button.js";import{ListBoxCollection as v}from"./list-box.js";import{SelectPopover as S}from"./select.js";import"clsx";import"class-variance-authority";import"./loader.js";import"./field.js";import"../utils/form-utils.js";import"../utils/form-context.js";import"@tanstack/react-form";import"react";import"./popover.js";const T=l,A=d,G=v;function _({className:e,...t}){return o(S,{className:u(e,r=>a(r)),...t})}function j({className:e,...t}){return o(f,{className:a("overflow-auto p-1 outline-0 [clip-path:inset(0_0_0_0_round_calc(var(--radius)-2px))]",e),escapeKeyBehavior:"none",...t})}function J({children:e,className:t,...r}){return o(p,{textValue:r.textValue||(typeof e=="string"?e:void 0),className:u(t,n=>a("btn btn-ghost relative flex justify-start input-dim","data-[selection-mode]:pl-input",n)),...r,children:u(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(x,{className:"size-icon fill-current"}),i.selectionMode=="multiple"&&o(h,{className:"size-icon"})]})}),n,i.hasSubmenu&&o(N,{className:"ml-auto size-icon"})]}))})}function O({className:e,inset:t,separator:r=!0,...n}){return o(b,{className:a("px-3 py-1.5 text-sm font-semibold",t&&"pl-input",r&&"-mx-1 mb-1 border-b border-b-border pb-2.5",e),...n})}function P({className:e,...t}){return o(M,{className:a("-mx-1 my-1 h-px bg-muted",e),...t})}function Q({className:e,...t}){return o(g,{className:a("ml-auto text-xs tracking-widest opacity-60",e),...t})}function U({label:e,children:t,variant:r,isDisabled:n,size:i,...m}){return s(T,{...m,children:[o(y,{isDisabled:n,type:"button",variant:r,size:i,children:e}),o(_,{className:"overflow-auto",children:o(j,{...m,children:t})})]})}export{U as EasyMenu,j as Menu,G as MenuCollection,O as MenuHeader,J as MenuItem,Q as MenuKeyboard,_ as MenuPopover,P as MenuSeparator,A 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 \"lib/utils/primitives\"\n\nimport { Check, ChevronRight, Dot } from \"lucide-react\"\nimport { Button, buttonVariants } from \"./button\"\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 (\n    <SelectPopover\n      className={composeRenderProps(className, (className) =>\n        classNames(className)\n      )}\n      {...props}\n    />\n  )\n}\n\nexport function Menu<T extends object>({ className, ...props }: AriaMenuProps<T>) {\n  return (\n    <AriaMenu\n      className={classNames(\n        \"overflow-auto p-1 outline-0 [clip-path:inset(0_0_0_0_round_calc(var(--radius)-2px))]\",\n        className\n      )}\n      escapeKeyBehavior=\"none\"\n      {...props}\n    />\n  )\n}\n\n// TODO standardize the styles on this component? This is the equivalent to a ghost button\nexport function MenuItem({ children, className, ...props }: AriaMenuItemProps & { ref?: React.Ref<HTMLDivElement> }) {\n  return (\n    <AriaMenuItem\n      textValue={\n        props.textValue || (typeof children === \"string\" ? children : undefined)\n      }\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\" && (\n                  <Dot className=\"size-icon fill-current\" />\n                )}\n                {renderProps.selectionMode == \"multiple\" && (\n                  <Check className=\"size-icon\" />\n                )}\n              </>\n            )}\n          </span>\n\n          {children}\n\n          {renderProps.hasSubmenu && <ChevronRight 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({\n  className,\n  inset,\n  separator = true,\n  ...props\n}: MenuHeaderProps) {\n  return (\n    <AriaHeader\n      className={classNames(\n        \"px-3 py-1.5 text-sm 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 (\n    <AriaSeparator\n      className={classNames(\"-mx-1 my-1 h-px bg-muted\", className)}\n      {...props}\n    />\n  )\n}\n\nexport function MenuKeyboard({\n  className,\n  ...props\n}: React.ComponentProps<typeof AriaKeyboard>) {\n  return (\n    <AriaKeyboard\n      className={classNames(\"ml-auto text-xs tracking-widest opacity-60\", className)}\n      {...props}\n    />\n  )\n}\ninterface MenuProps<T>\n  extends AriaMenuProps<T>,\n  VariantProps<typeof buttonVariants>,\n  Omit<AriaMenuTriggerProps, \"children\"> {\n  label?: React.ReactNode\n  isDisabled?: boolean\n}\n// TODO name this better\nexport function EasyMenu<T extends object>({\n  label,\n  children,\n  variant,\n  isDisabled,\n  size,\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 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","Dot","Check","ChevronRight","MenuHeader","inset","separator","AriaHeader","MenuSeparator","AriaSeparator","MenuKeyboard","AriaKeyboard","EasyMenu","label","variant","isDisabled","size","Button"],"mappings":"goBAwBO,MAAMA,EAAcC,EACdC,EAAiBC,EACjBC,EAAiBC,EAEvB,SAASC,EAAY,CAAE,UAAAC,EAAW,GAAGC,GAAuB,CACjE,OACEC,EAACC,EAAA,CACC,UAAWC,EAAmBJ,EAAYA,GACxCK,EAAWL,CAAS,CAAA,EAErB,GAAGC,CAAA,CAAA,CAGV,CAEO,SAASK,EAAuB,CAAE,UAAAN,EAAW,GAAGC,GAA2B,CAChF,OACEC,EAACK,EAAA,CACC,UAAWF,EACT,uFACAL,CAAA,EAEF,kBAAkB,OACjB,GAAGC,CAAA,CAAA,CAGV,CAGO,SAASO,EAAS,CAAE,SAAAC,EAAU,UAAAT,EAAW,GAAGC,GAAkE,CACnH,OACEC,EAACQ,EAAA,CACC,UACET,EAAM,YAAc,OAAOQ,GAAa,SAAWA,EAAW,QAEhE,UAAWL,EAAmBJ,EAAYA,GACxCK,EACE,sDAEA,iCACAL,CAAA,CACF,EAED,GAAGC,EAEH,SAAAG,EAAmBK,EAAU,CAACA,EAAUE,IACvCC,EAAAC,EAAA,CACE,SAAA,CAAAX,EAAC,OAAA,CAAK,UAAU,6DACb,SAAAS,EAAY,YACXC,EAAAC,EAAA,CACG,SAAA,CAAAF,EAAY,eAAiB,UAC5BT,EAACY,EAAA,CAAI,UAAU,yBAAyB,EAEzCH,EAAY,eAAiB,YAC5BT,EAACa,EAAA,CAAM,UAAU,WAAA,CAAY,CAAA,CAAA,CAEjC,CAAA,CAEJ,EAECN,EAEAE,EAAY,YAAcT,EAACc,EAAA,CAAa,UAAU,mBAAA,CAAoB,CAAA,EACzE,CACD,CAAA,CAAA,CAGP,CAOO,SAASC,EAAW,CACzB,UAAAjB,EACA,MAAAkB,EACA,UAAAC,EAAY,GACZ,GAAGlB,CACL,EAAoB,CAClB,OACEC,EAACkB,EAAA,CACC,UAAWf,EACT,oCACAa,GAAS,WACTC,GAAa,6CACbnB,CAAA,EAED,GAAGC,CAAA,CAAA,CAGV,CAEO,SAASoB,EAAc,CAAE,UAAArB,EAAW,GAAGC,GAA6B,CACzE,OACEC,EAACoB,EAAA,CACC,UAAWjB,EAAW,2BAA4BL,CAAS,EAC1D,GAAGC,CAAA,CAAA,CAGV,CAEO,SAASsB,EAAa,CAC3B,UAAAvB,EACA,GAAGC,CACL,EAA8C,CAC5C,OACEC,EAACsB,EAAA,CACC,UAAWnB,EAAW,6CAA8CL,CAAS,EAC5E,GAAGC,CAAA,CAAA,CAGV,CASO,SAASwB,EAA2B,CACzC,MAAAC,EACA,SAAAjB,EACA,QAAAkB,EACA,WAAAC,EACA,KAAAC,EACA,GAAG5B,CACL,EAAiB,CACf,OACEW,EAACnB,EAAA,CAAa,GAAGQ,EACf,SAAA,CAAAC,EAAC4B,GAAO,WAAAF,EAAwB,KAAK,SAAS,QAAAD,EAAkB,KAAAE,EAC7D,SAAAH,EACH,EACAxB,EAACH,GAAY,UAAU,gBACrB,WAACO,EAAA,CAAM,GAAGL,EAAQ,SAAAQ,CAAA,CAAS,CAAA,CAC7B,CAAA,EACF,CAEJ"}
+{"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 \"lib/utils/primitives\"\n\nimport { Check, ChevronRight, Dot } from \"lucide-react\"\nimport { Button, buttonVariants } from \"./button\"\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 (\n    <SelectPopover\n      className={composeRenderProps(className, (className) =>\n        classNames(className)\n      )}\n      {...props}\n    />\n  )\n}\n\nexport function Menu<T extends object>({ className, ...props }: AriaMenuProps<T>) {\n  return (\n    <AriaMenu\n      className={classNames(\n        \"overflow-auto p-1 outline-0 [clip-path:inset(0_0_0_0_round_calc(var(--radius)-2px))]\",\n        className\n      )}\n      escapeKeyBehavior=\"none\"\n      {...props}\n    />\n  )\n}\n\n// TODO standardize the styles on this component? This is the equivalent to a ghost button\nexport function MenuItem({ children, className, ...props }: AriaMenuItemProps & { ref?: React.Ref<HTMLDivElement> }) {\n  return (\n    <AriaMenuItem\n      textValue={\n        props.textValue || (typeof children === \"string\" ? children : undefined)\n      }\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\" && (\n                  <Dot className=\"size-icon fill-current\" />\n                )}\n                {renderProps.selectionMode == \"multiple\" && (\n                  <Check className=\"size-icon\" />\n                )}\n              </>\n            )}\n          </span>\n\n          {children}\n\n          {renderProps.hasSubmenu && <ChevronRight 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({\n  className,\n  inset,\n  separator = true,\n  ...props\n}: MenuHeaderProps) {\n  return (\n    <AriaHeader\n      className={classNames(\n        \"px-3 py-1.5 text-sm 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 (\n    <AriaSeparator\n      className={classNames(\"-mx-1 my-1 h-px bg-muted\", className)}\n      {...props}\n    />\n  )\n}\n\nexport function MenuKeyboard({\n  className,\n  ...props\n}: React.ComponentProps<typeof AriaKeyboard>) {\n  return (\n    <AriaKeyboard\n      className={classNames(\"ml-auto text-xs tracking-widest opacity-60\", className)}\n      {...props}\n    />\n  )\n}\ninterface MenuProps<T>\n  extends AriaMenuProps<T>,\n  VariantProps<typeof buttonVariants>,\n  Omit<AriaMenuTriggerProps, \"children\"> {\n  label?: React.ReactNode\n  isDisabled?: boolean\n}\n// TODO name this better\nexport function EasyMenu<T extends object>({\n  label,\n  children,\n  variant,\n  isDisabled,\n  size,\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 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","Dot","Check","ChevronRight","MenuHeader","inset","separator","AriaHeader","MenuSeparator","AriaSeparator","MenuKeyboard","AriaKeyboard","EasyMenu","label","variant","isDisabled","size","Button"],"mappings":"6qBAwBO,MAAMA,EAAcC,EACdC,EAAiBC,EACjBC,EAAiBC,EAEvB,SAASC,EAAY,CAAE,UAAAC,EAAW,GAAGC,GAAuB,CACjE,OACEC,EAACC,EAAA,CACC,UAAWC,EAAmBJ,EAAYA,GACxCK,EAAWL,CAAS,CAAA,EAErB,GAAGC,CAAA,CAAA,CAGV,CAEO,SAASK,EAAuB,CAAE,UAAAN,EAAW,GAAGC,GAA2B,CAChF,OACEC,EAACK,EAAA,CACC,UAAWF,EACT,uFACAL,CAAA,EAEF,kBAAkB,OACjB,GAAGC,CAAA,CAAA,CAGV,CAGO,SAASO,EAAS,CAAE,SAAAC,EAAU,UAAAT,EAAW,GAAGC,GAAkE,CACnH,OACEC,EAACQ,EAAA,CACC,UACET,EAAM,YAAc,OAAOQ,GAAa,SAAWA,EAAW,QAEhE,UAAWL,EAAmBJ,EAAYA,GACxCK,EACE,sDAEA,iCACAL,CAAA,CACF,EAED,GAAGC,EAEH,SAAAG,EAAmBK,EAAU,CAACA,EAAUE,IACvCC,EAAAC,EAAA,CACE,SAAA,CAAAX,EAAC,OAAA,CAAK,UAAU,6DACb,SAAAS,EAAY,YACXC,EAAAC,EAAA,CACG,SAAA,CAAAF,EAAY,eAAiB,UAC5BT,EAACY,EAAA,CAAI,UAAU,yBAAyB,EAEzCH,EAAY,eAAiB,YAC5BT,EAACa,EAAA,CAAM,UAAU,WAAA,CAAY,CAAA,CAAA,CAEjC,CAAA,CAEJ,EAECN,EAEAE,EAAY,YAAcT,EAACc,EAAA,CAAa,UAAU,mBAAA,CAAoB,CAAA,EACzE,CACD,CAAA,CAAA,CAGP,CAOO,SAASC,EAAW,CACzB,UAAAjB,EACA,MAAAkB,EACA,UAAAC,EAAY,GACZ,GAAGlB,CACL,EAAoB,CAClB,OACEC,EAACkB,EAAA,CACC,UAAWf,EACT,oCACAa,GAAS,WACTC,GAAa,6CACbnB,CAAA,EAED,GAAGC,CAAA,CAAA,CAGV,CAEO,SAASoB,EAAc,CAAE,UAAArB,EAAW,GAAGC,GAA6B,CACzE,OACEC,EAACoB,EAAA,CACC,UAAWjB,EAAW,2BAA4BL,CAAS,EAC1D,GAAGC,CAAA,CAAA,CAGV,CAEO,SAASsB,EAAa,CAC3B,UAAAvB,EACA,GAAGC,CACL,EAA8C,CAC5C,OACEC,EAACsB,EAAA,CACC,UAAWnB,EAAW,6CAA8CL,CAAS,EAC5E,GAAGC,CAAA,CAAA,CAGV,CASO,SAASwB,EAA2B,CACzC,MAAAC,EACA,SAAAjB,EACA,QAAAkB,EACA,WAAAC,EACA,KAAAC,EACA,GAAG5B,CACL,EAAiB,CACf,OACEW,EAACnB,EAAA,CAAa,GAAGQ,EACf,SAAA,CAAAC,EAAC4B,GAAO,WAAAF,EAAwB,KAAK,SAAS,QAAAD,EAAkB,KAAAE,EAC7D,SAAAH,EACH,EACAxB,EAACH,GAAY,UAAU,gBACrB,WAACO,EAAA,CAAM,GAAGL,EAAQ,SAAAQ,CAAA,CAAS,CAAA,CAC7B,CAAA,EACF,CAEJ"}

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

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

package/dist/components/multi-select.js

@@ -1,2 +1,2 @@
-import{jsx as o}from"react/jsx-runtime";import{FormField as d}from"./field.js";import{EasyMenu as p,MenuItem as a}from"./menu.js";import{useFieldContext as u}from"../utils/form-context.js";import{getFieldErrorMessage as c}from"../utils/primitives.js";import"class-variance-authority";import"react-aria-components";import"lucide-react";import"./button.js";import"./loader.js";import"./list-box.js";import"./select.js";import"./popover.js";import"@tanstack/react-form";import"clsx";function f({items:i,value:e,onChange:t,label:l,errorMessage:n,description:m,...s}){return o("div",{className:"group form-field",children:o(d,{label:l,description:m,errorMessage:n,children:o(p,{selectionMode:"multiple",selectedKeys:e,onSelectionChange:r=>{typeof r!="string"&&t(r)},items:i,label:e.size,...s,children:r=>o(a,{id:r.id,isDisabled:r?.disabled,children:r.label},r.id)})})})}function I({...i}){const e=u();return o(f,{value:e.state.value,onChange:e.setValue,onClose:e.handleBlur,errorMessage:c(e),...i})}export{f as MultiSelect,I as TfMultiSelect};
+import{jsx as r}from"react/jsx-runtime";import{FormField as d}from"./field.js";import{EasyMenu as p,MenuItem as a}from"./menu.js";import{useTfFieldContext as u}from"../utils/form-utils.js";import{getFieldErrorMessage as f}from"../utils/primitives.js";import"class-variance-authority";import"react-aria-components";import"lucide-react";import"./button.js";import"./loader.js";import"./list-box.js";import"./select.js";import"./popover.js";import"../utils/form-context.js";import"@tanstack/react-form";import"react";import"clsx";function c({items:o,value:e,onChange:t,label:l,errorMessage:n,description:m,...s}){return r("div",{className:"group form-field",children:r(d,{label:l,description:m,errorMessage:n,children:r(p,{selectionMode:"multiple",selectedKeys:e,onSelectionChange:i=>{typeof i!="string"&&t(i)},items:o,label:e.size,...s,children:i=>r(a,{id:i.id,isDisabled:i?.disabled,children:i.label},i.id)})})})}function K({...o}){const e=u({disabled:o.isDisabled});return r(c,{value:e.state.value,onChange:e.setValue,onClose:e.handleBlur,errorMessage:f(e),...o})}export{c as MultiSelect,K 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 { FormField, type FormFieldProps } from \"lib/components/field\";\nimport { EasyMenu, MenuItem } from \"lib/components/menu\";\nimport type { SelectOption } from \"lib/components/select-options\";\nimport { useFieldContext } from \"lib/utils/form-context\";\nimport { getFieldErrorMessage } from \"lib/utils/primitives\";\ninterface MultipleSelectionProps {\n\tvalue: Set<string | number>;\n\tonChange: (v: Set<string | number>) => void;\n\tbuttonLabel?: React.ReactNode;\n\titems: SelectOption[];\n}\n\nexport interface MultiSelectProps extends MultipleSelectionProps, FormFieldProps, Omit<React.ComponentProps<typeof EasyMenu>, 'label' | 'items'> { }\n\nexport function MultiSelect({\n\titems,\n\tvalue,\n\tonChange: setValue,\n\tlabel,\n\terrorMessage,\n\tdescription,\n\t...props\n}: MultiSelectProps) {\n\treturn (\n\t\t<div className=\"group form-field\">\n\t\t\t<FormField {...{ label, description, errorMessage }}>\n\t\t\t\t<EasyMenu\n\t\t\t\t\tselectionMode=\"multiple\"\n\t\t\t\t\tselectedKeys={value}\n\t\t\t\t\tonSelectionChange={(v) => {\n\t\t\t\t\t\tif (typeof (v) === 'string') return\n\t\t\t\t\t\tsetValue(v)\n\t\t\t\t\t}}\n\t\t\t\t\titems={items}\n\t\t\t\t\tlabel={value.size}\n\t\t\t\t\t{...props}>\n\t\t\t\t\t{(item) => <MenuItem id={item.id} key={item.id} isDisabled={item?.disabled}>{item.label}</MenuItem>}\n\t\t\t\t</EasyMenu>\n\t\t\t</FormField>\n\t\t</div>\n\t);\n};\n\n\n// TODO implement isDisabled\nexport interface TfMultiSelectProps\n\textends Omit<MultiSelectProps, \"value\" | \"onChange\"> { }\nexport function TfMultiSelect({ ...props }: TfMultiSelectProps) {\n\tconst field = useFieldContext<Set<number | string>>();\n\n\treturn (\n\t\t<MultiSelect\n\t\t\tvalue={field.state.value}\n\t\t\tonChange={field.setValue}\n\t\t\tonClose={field.handleBlur}\n\t\t\terrorMessage={getFieldErrorMessage(field)}\n\t\t\t{...props}\n\t\t/>\n\t);\n};\n"],"names":["MultiSelect","items","value","setValue","label","errorMessage","description","props","jsx","FormField","EasyMenu","v","item","MenuItem","TfMultiSelect","field","useFieldContext","getFieldErrorMessage"],"mappings":"geAcO,SAASA,EAAY,CAC3B,MAAAC,EACA,MAAAC,EACA,SAAUC,EACV,MAAAC,EACA,aAAAC,EACA,YAAAC,EACA,GAAGC,CACJ,EAAqB,CACpB,OACCC,EAAC,MAAA,CAAI,UAAU,mBACd,SAAAA,EAACC,EAAA,CAAgB,MAAAL,EAAO,YAAAE,EAAa,aAAAD,EACpC,SAAAG,EAACE,EAAA,CACA,cAAc,WACd,aAAcR,EACd,kBAAoBS,GAAM,CACrB,OAAQA,GAAO,UACnBR,EAASQ,CAAC,CACX,EACA,MAAAV,EACA,MAAOC,EAAM,KACZ,GAAGK,EACH,SAACK,GAASJ,EAACK,EAAA,CAAS,GAAID,EAAK,GAAkB,WAAYA,GAAM,SAAW,SAAAA,EAAK,KAAA,EAA3CA,EAAK,EAA4C,CAAA,CAAA,EAE1F,CAAA,CACD,CAEF,CAMO,SAASE,EAAc,CAAE,GAAGP,GAA6B,CAC/D,MAAMQ,EAAQC,EAAA,EAEd,OACCR,EAACR,EAAA,CACA,MAAOe,EAAM,MAAM,MACnB,SAAUA,EAAM,SAChB,QAASA,EAAM,WACf,aAAcE,EAAqBF,CAAK,EACvC,GAAGR,CAAA,CAAA,CAGP"}
+{"version":3,"file":"multi-select.js","sources":["../../lib/components/multi-select.tsx"],"sourcesContent":["import { FormField, type FormFieldProps } from \"lib/components/field\";\nimport { EasyMenu, MenuItem } from \"lib/components/menu\";\nimport type { SelectOption } from \"lib/components/select-options\";\nimport { useTfFieldContext } from \"lib/utils/form-utils\";\nimport { getFieldErrorMessage } from \"lib/utils/primitives\";\nimport React from \"react\";\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          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\n// TODO implement isDisabled\nexport interface TfMultiSelectProps\n  extends Omit<MultiSelectProps, \"value\" | \"onChange\"> {}\nexport function TfMultiSelect({ ...props }: TfMultiSelectProps) {\n  const field = useTfFieldContext<Set<number | string>>({\n    disabled: props.isDisabled,\n  });\n\n  return (\n    <MultiSelect\n      value={field.state.value}\n      onChange={field.setValue}\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","getFieldErrorMessage"],"mappings":"+gBAmBO,SAASA,EAAY,CAC1B,MAAAC,EACA,MAAAC,EACA,SAAUC,EACV,MAAAC,EACA,aAAAC,EACA,YAAAC,EACA,GAAGC,CACL,EAAqB,CACnB,OACEC,EAAC,MAAA,CAAI,UAAU,mBACb,SAAAA,EAACC,EAAA,CAAgB,MAAAL,EAAO,YAAAE,EAAa,aAAAD,EACnC,SAAAG,EAACE,EAAA,CACC,cAAc,WACd,aAAcR,EACd,kBAAoBS,GAAM,CACpB,OAAOA,GAAM,UACjBR,EAASQ,CAAC,CACZ,EACA,MAAAV,EACA,MAAOC,EAAM,KACZ,GAAGK,EAEH,SAACK,GACAJ,EAACK,EAAA,CAAS,GAAID,EAAK,GAAkB,WAAYA,GAAM,SACpD,SAAAA,EAAK,KAAA,EADoBA,EAAK,EAEjC,CAAA,CAAA,EAGN,CAAA,CACF,CAEJ,CAKO,SAASE,EAAc,CAAE,GAAGP,GAA6B,CAC9D,MAAMQ,EAAQC,EAAwC,CACpD,SAAUT,EAAM,UAAA,CACjB,EAED,OACEC,EAACR,EAAA,CACC,MAAOe,EAAM,MAAM,MACnB,SAAUA,EAAM,SAChB,QAASA,EAAM,WACf,aAAcE,EAAqBF,CAAK,EACvC,GAAGR,CAAA,CAAA,CAGV"}

package/dist/components/numberfield.d.ts

@@ -2,5 +2,5 @@ import { NumberFieldProps as AriaNumberFieldProps } from 'react-aria-components'
 import { FormFieldProps } from './field';
 type NumberFieldProps = AriaNumberFieldProps & FormFieldProps;
 export declare function NumberField({ label, description, errorMessage, className, ...props }: NumberFieldProps): import("react/jsx-runtime").JSX.Element;
-export declare function TfNumberField({ isDisabled, ...props }: Omit<React.ComponentProps<typeof NumberField>, 'value' | 'id' | 'onChange' | 'onBlur'>): import("react/jsx-runtime").JSX.Element;
+export declare function TfNumberField({ isDisabled, ...props }: Omit<React.ComponentProps<typeof NumberField>, "value" | "id" | "onChange" | "onBlur">): import("react/jsx-runtime").JSX.Element;
 export {};

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{useFieldContext as h}from"../utils/form-context.js";import{getFieldErrorMessage as l,classNames as t}from"../utils/primitives.js";import{ChevronUp as b,ChevronDown as N}from"lucide-react";import{FormField as g,FieldGroup as F}from"./field.js";import"class-variance-authority";import"./loader.js";import"@tanstack/react-form";import"clsx";const x=c;function v({className:o,...i}){return r(p,{className:n(o,e=>t("w-fit min-w-0 flex-1 border-r border-transparent bg-card pr-2 outline-0 placeholder:text-muted-foreground [&::-webkit-search-cancel-button]:hidden",e)),...i})}function w({className:o,...i}){return d("div",{className:t("absolute right-0 flex h-full flex-col border-l",o),...i,children:[r(s,{slot:"increment",children:r(b,{"aria-hidden":!0,className:"size-icon"})}),r("div",{className:"border-b"}),r(s,{slot:"decrement",children:r(N,{"aria-hidden":!0,className:"size-icon"})})]})}function s({className:o,...i}){return r(f,{className:n(o,e=>t("w-auto grow h-3 px-0.5 text-muted-foreground",e)),variant:"ghost",size:"none",...i})}function C({label:o,description:i,errorMessage:e,className:m,...a}){return r(x,{className:n(m,u=>t("group form-field",u)),...a,children:r(g,{label:o,description:i,errorMessage:e,children:d(F,{children:[r(v,{}),r(w,{})]})})})}function P({isDisabled:o,...i}){const e=h();return r(C,{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),...i})}export{C as NumberField,P 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 h}from"../utils/form-utils.js";import{getFieldErrorMessage as l,classNames as i}from"../utils/primitives.js";import{ChevronUp as b,ChevronDown as N}from"lucide-react";import{FormField as g,FieldGroup as F}from"./field.js";import"class-variance-authority";import"./loader.js";import"../utils/form-context.js";import"@tanstack/react-form";import"react";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(b,{"aria-hidden":!0,className:"size-icon"})}),r("div",{className:"border-b"}),r(m,{slot:"decrement",children:r(N,{"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 C({label:o,description:t,errorMessage:e,className:s,...a}){return r(x,{className:n(s,u=>i("group form-field",u)),...a,children:r(g,{label:o,description:t,errorMessage:e,children:d(F,{children:[r(v,{}),r(w,{})]})})})}function R({isDisabled:o,...t}){const e=h({disabled:o});return r(C,{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{C 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 \"lib/components/button\"\nimport { useFieldContext } from \"lib/utils/form-context\"\nimport { classNames, getFieldErrorMessage } from \"lib/utils/primitives\"\nimport { ChevronDown, ChevronUp } from \"lucide-react\"\nimport { FieldGroup, FormField, type FormFieldProps } from \"./field\"\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-card 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({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      className={classNames(\n        \"absolute right-0 flex h-full flex-col border-l\",\n        className\n      )}\n      {...props}\n    >\n      <NumberFieldStepper slot=\"increment\">\n        <ChevronUp aria-hidden className=\"size-icon\" />\n      </NumberFieldStepper>\n      <div className=\"border-b\" />\n      <NumberFieldStepper slot=\"decrement\">\n        <ChevronDown 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({\n  label,\n  description,\n  errorMessage,\n  className,\n  ...props\n}: NumberFieldProps) {\n  return (\n    <ANumberField\n      className={composeRenderProps(className, (className) =>\n        classNames(\"group form-field\", className)\n      )}\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({ isDisabled, ...props }: Omit<React.ComponentProps<typeof NumberField>, 'value' | 'id' | 'onChange' | 'onBlur'>) {\n  const field = useFieldContext<number>();\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","ChevronUp","ChevronDown","Button","NumberField","label","description","errorMessage","FormField","FieldGroup","TfNumberField","isDisabled","field","useFieldContext","getFieldErrorMessage"],"mappings":"ugBAeA,MAAMA,EAAeC,EAErB,SAASC,EAAiB,CAAE,UAAAC,EAAW,GAAGC,GAAyB,CACjE,OACEC,EAACC,EAAA,CACC,UAAWC,EAAmBJ,EAAYA,GACxCK,EACE,qJACAL,CAAA,CACF,EAED,GAAGC,CAAA,CAAA,CAGV,CAEA,SAASK,EAAoB,CAC3B,UAAAN,EACA,GAAGC,CACL,EAAgC,CAC9B,OACEM,EAAC,MAAA,CACC,UAAWF,EACT,iDACAL,CAAA,EAED,GAAGC,EAEJ,SAAA,CAAAC,EAACM,EAAA,CAAmB,KAAK,YACvB,SAAAN,EAACO,GAAU,cAAW,GAAC,UAAU,WAAA,CAAY,CAAA,CAC/C,EACAP,EAAC,MAAA,CAAI,UAAU,UAAA,CAAW,EAC1BA,EAACM,EAAA,CAAmB,KAAK,YACvB,SAAAN,EAACQ,GAAY,cAAW,GAAC,UAAU,WAAA,CAAY,CAAA,CACjD,CAAA,CAAA,CAAA,CAGN,CAEA,SAASF,EAAmB,CAAE,UAAAR,EAAW,GAAGC,GAA0B,CACpE,OACEC,EAACS,EAAA,CACC,UAAWP,EAAmBJ,EAAYA,GACxCK,EAAW,+CAAgDL,CAAS,CAAA,EAEtE,QAAS,QACT,KAAM,OACL,GAAGC,CAAA,CAAA,CAGV,CAGO,SAASW,EAAY,CAC1B,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,UAAAf,EACA,GAAGC,CACL,EAAqB,CACnB,OACEC,EAACL,EAAA,CACC,UAAWO,EAAmBJ,EAAYA,GACxCK,EAAW,mBAAoBL,CAAS,CAAA,EAEzC,GAAGC,EAEJ,WAACe,EAAA,CAAU,MAAAH,EAAc,YAAAC,EAA0B,aAAAC,EACjD,WAACE,EAAA,CACC,SAAA,CAAAf,EAACH,EAAA,EAAiB,IACjBO,EAAA,CAAA,CAAoB,CAAA,CAAA,CACvB,CAAA,CACF,CAAA,CAAA,CAGN,CAEO,SAASY,EAAc,CAAE,WAAAC,EAAY,GAAGlB,GAAiG,CAC9I,MAAMmB,EAAQC,EAAA,EAEd,OACEnB,EAACU,EAAA,CACC,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,CAEV"}
+{"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 \"lib/components/button\";\nimport { useTfFieldContext } from \"lib/utils/form-utils\";\nimport { classNames, getFieldErrorMessage } from \"lib/utils/primitives\";\nimport { ChevronDown, ChevronUp } from \"lucide-react\";\nimport { FieldGroup, FormField, type FormFieldProps } from \"./field\";\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({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      className={classNames(\n        \"absolute right-0 flex h-full flex-col border-l\",\n        className\n      )}\n      {...props}\n    >\n      <NumberFieldStepper slot=\"increment\">\n        <ChevronUp aria-hidden className=\"size-icon\" />\n      </NumberFieldStepper>\n      <div className=\"border-b\" />\n      <NumberFieldStepper slot=\"decrement\">\n        <ChevronDown 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({\n  label,\n  description,\n  errorMessage,\n  className,\n  ...props\n}: NumberFieldProps) {\n  return (\n    <ANumberField\n      className={composeRenderProps(className, (className) =>\n        classNames(\"group form-field\", className)\n      )}\n      {...props}\n    >\n      <FormField\n        label={label}\n        description={description}\n        errorMessage={errorMessage}\n      >\n        <FieldGroup>\n          <NumberFieldInput />\n          <NumberFieldSteppers />\n        </FieldGroup>\n      </FormField>\n    </ANumberField>\n  );\n}\n\nexport function TfNumberField({\n  isDisabled,\n  ...props\n}: Omit<\n  React.ComponentProps<typeof NumberField>,\n  \"value\" | \"id\" | \"onChange\" | \"onBlur\"\n>) {\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","ChevronUp","ChevronDown","Button","NumberField","label","description","errorMessage","FormField","FieldGroup","TfNumberField","isDisabled","field","useTfFieldContext","getFieldErrorMessage"],"mappings":"sjBAeA,MAAMA,EAAeC,EAErB,SAASC,EAAiB,CAAE,UAAAC,EAAW,GAAGC,GAAyB,CACjE,OACEC,EAACC,EAAA,CACC,UAAWC,EAAmBJ,EAAYA,GACxCK,EACE,wJACAL,CAAA,CACF,EAED,GAAGC,CAAA,CAAA,CAGV,CAEA,SAASK,EAAoB,CAC3B,UAAAN,EACA,GAAGC,CACL,EAAgC,CAC9B,OACEM,EAAC,MAAA,CACC,UAAWF,EACT,iDACAL,CAAA,EAED,GAAGC,EAEJ,SAAA,CAAAC,EAACM,EAAA,CAAmB,KAAK,YACvB,SAAAN,EAACO,GAAU,cAAW,GAAC,UAAU,WAAA,CAAY,CAAA,CAC/C,EACAP,EAAC,MAAA,CAAI,UAAU,UAAA,CAAW,EAC1BA,EAACM,EAAA,CAAmB,KAAK,YACvB,SAAAN,EAACQ,GAAY,cAAW,GAAC,UAAU,WAAA,CAAY,CAAA,CACjD,CAAA,CAAA,CAAA,CAGN,CAEA,SAASF,EAAmB,CAAE,UAAAR,EAAW,GAAGC,GAA0B,CACpE,OACEC,EAACS,EAAA,CACC,UAAWP,EAAmBJ,EAAYA,GACxCK,EAAW,+CAAgDL,CAAS,CAAA,EAEtE,QAAS,QACT,KAAM,OACL,GAAGC,CAAA,CAAA,CAGV,CAGO,SAASW,EAAY,CAC1B,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,UAAAf,EACA,GAAGC,CACL,EAAqB,CACnB,OACEC,EAACL,EAAA,CACC,UAAWO,EAAmBJ,EAAYA,GACxCK,EAAW,mBAAoBL,CAAS,CAAA,EAEzC,GAAGC,EAEJ,SAAAC,EAACc,EAAA,CACC,MAAAH,EACA,YAAAC,EACA,aAAAC,EAEA,WAACE,EAAA,CACC,SAAA,CAAAf,EAACH,EAAA,EAAiB,IACjBO,EAAA,CAAA,CAAoB,CAAA,CAAA,CACvB,CAAA,CAAA,CACF,CAAA,CAGN,CAEO,SAASY,EAAc,CAC5B,WAAAC,EACA,GAAGlB,CACL,EAGG,CACD,MAAMmB,EAAQC,EAA0B,CAAE,SAAUF,EAAY,EAEhE,OACEjB,EAACU,EAAA,CACC,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,CAGV"}

package/dist/components/searchfield.js

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as l}from"react/jsx-runtime";import{SearchIcon as s,XIcon as m}from"lucide-react";import{composeRenderProps as n,SearchField as p,Input as u,Button as h}from"react-aria-components";import{classNames as a}from"../utils/primitives.js";import{FormField as f,FieldGroup as g}from"./field.js";import"clsx";import"class-variance-authority";function F({className:r,...i}){return e(p,{className:n(r,o=>a("group",o)),...i})}function b({className:r,...i}){return e(u,{className:n(r,o=>a("min-w-0 ring-0 focus-visible:outline-none flex-1 bg-card px-2 py-1.5 placeholder:text-muted-foreground [&::-webkit-search-cancel-button]:hidden",o)),...i})}function x({className:r,...i}){return e(h,{className:n(r,o=>a("mr-1 opacity-70 ring-offset-background transition-opacity","data-[hovered]:opacity-100","data-[disabled]:pointer-events-none","group-data-[empty]:invisible",o)),...i})}function w({label:r,description:i,className:o,errorMessage:t,...c}){return e(F,{className:n(o,d=>a("group form-field",d)),...c,children:e(f,{label:r,description:i,errorMessage:t,children:l(g,{children:[e(s,{"aria-hidden":!0,className:"size-icon text-muted-foreground"}),e(b,{placeholder:""}),e(x,{children:e(m,{"aria-hidden":!0,className:"size-icon"})})]})})})}export{w as SearchField};
+import{jsx as e,jsxs as l}from"react/jsx-runtime";import{SearchIcon as s,XIcon as m}from"lucide-react";import{composeRenderProps as n,SearchField as p,Input as u,Button as h}from"react-aria-components";import{classNames as t}from"../utils/primitives.js";import{FormField as f,FieldGroup as g}from"./field.js";import"clsx";import"class-variance-authority";function F({className:r,...o}){return e(p,{className:n(r,i=>t("group",i)),...o})}function b({className:r,...o}){return e(u,{className:n(r,i=>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",i)),...o})}function x({className:r,...o}){return e(h,{className:n(r,i=>t("mr-1 opacity-70 ring-offset-background transition-opacity","data-[hovered]:opacity-100","data-[disabled]:pointer-events-none","group-data-[empty]:invisible",i)),...o})}function w({label:r,description:o,className:i,errorMessage:a,...c}){return e(F,{className:n(i,d=>t("group form-field",d)),...c,children:e(f,{label:r,description:o,errorMessage:a,children:l(g,{children:[e(s,{"aria-hidden":!0,className:"size-icon text-muted-foreground"}),e(b,{placeholder:""}),e(x,{children:e(m,{"aria-hidden":!0,className:"size-icon"})})]})})})}export{w 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 { SearchIcon, XIcon } from \"lucide-react\"\nimport {\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 \"lib/utils/primitives\"\n\nimport { FieldGroup, FormField, type FormFieldProps } from \"./field\"\n\nfunction ASearchField({ className, ...props }: AriaSearchFieldProps) {\n  return (\n    <AriaSearchField\n      className={composeRenderProps(className, (className) =>\n        classNames(\"group\", className)\n      )}\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-card 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({ className, ...props }: AriaButtonProps) {\n  return (\n    <AriaButton\n      className={composeRenderProps(className, (className) =>\n        classNames(\n          \"mr-1 opacity-70 ring-offset-background transition-opacity\",\n          /* Hover */\n          \"data-[hovered]:opacity-100\",\n          /* Disabled */\n          \"data-[disabled]:pointer-events-none\",\n          /* Empty */\n          \"group-data-[empty]:invisible\",\n          className\n        )\n      )}\n      {...props}\n    />\n  )\n}\n\nexport interface SearchFieldProps extends AriaSearchFieldProps, FormFieldProps { };\nexport function SearchField({\n  label,\n  description,\n  className,\n  errorMessage,\n  ...props\n}: SearchFieldProps) {\n  return (\n    <ASearchField\n      className={composeRenderProps(className, (className) =>\n        classNames(\"group form-field\", className)\n      )}\n      {...props}\n    >\n      <FormField label={label} description={description} errorMessage={errorMessage}>\n        <FieldGroup>\n          <SearchIcon aria-hidden className=\"size-icon text-muted-foreground\" />\n          <ASearchFieldInput placeholder=\"\" />\n          <SearchFieldClear>\n            <XIcon aria-hidden className=\"size-icon\" />\n          </SearchFieldClear>\n        </FieldGroup>\n      </FormField>\n    </ASearchField>\n  )\n}"],"names":["ASearchField","className","props","jsx","AriaSearchField","composeRenderProps","classNames","ASearchFieldInput","AriaInput","SearchFieldClear","AriaButton","SearchField","label","description","errorMessage","FormField","FieldGroup","SearchIcon","XIcon"],"mappings":"mWAeA,SAASA,EAAa,CAAE,UAAAC,EAAW,GAAGC,GAA+B,CACnE,OACEC,EAACC,EAAA,CACC,UAAWC,EAAmBJ,EAAYA,GACxCK,EAAW,QAASL,CAAS,CAAA,EAE9B,GAAGC,CAAA,CAAA,CAGV,CAEA,SAASK,EAAkB,CAAE,UAAAN,EAAW,GAAGC,GAAyB,CAClE,OACEC,EAACK,EAAA,CACC,UAAWH,EAAmBJ,EAAYA,GACxCK,EACE,kJACAL,CAAA,CACF,EAED,GAAGC,CAAA,CAAA,CAGV,CAEA,SAASO,EAAiB,CAAE,UAAAR,EAAW,GAAGC,GAA0B,CAClE,OACEC,EAACO,EAAA,CACC,UAAWL,EAAmBJ,EAAYA,GACxCK,EACE,4DAEA,6BAEA,sCAEA,+BACAL,CAAA,CACF,EAED,GAAGC,CAAA,CAAA,CAGV,CAGO,SAASS,EAAY,CAC1B,MAAAC,EACA,YAAAC,EACA,UAAAZ,EACA,aAAAa,EACA,GAAGZ,CACL,EAAqB,CACnB,OACEC,EAACH,EAAA,CACC,UAAWK,EAAmBJ,EAAYA,GACxCK,EAAW,mBAAoBL,CAAS,CAAA,EAEzC,GAAGC,EAEJ,WAACa,EAAA,CAAU,MAAAH,EAAc,YAAAC,EAA0B,aAAAC,EACjD,WAACE,EAAA,CACC,SAAA,CAAAb,EAACc,EAAA,CAAW,cAAW,GAAC,UAAU,kCAAkC,EACpEd,EAACI,EAAA,CAAkB,YAAY,EAAA,CAAG,EAClCJ,EAACM,GACC,SAAAN,EAACe,EAAA,CAAM,cAAW,GAAC,UAAU,YAAY,CAAA,CAC3C,CAAA,CAAA,CACF,CAAA,CACF,CAAA,CAAA,CAGN"}
+{"version":3,"file":"searchfield.js","sources":["../../lib/components/searchfield.tsx"],"sourcesContent":["import { SearchIcon, XIcon } from \"lucide-react\"\nimport {\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 \"lib/utils/primitives\"\n\nimport { FieldGroup, FormField, type FormFieldProps } from \"./field\"\n\nfunction ASearchField({ className, ...props }: AriaSearchFieldProps) {\n  return (\n    <AriaSearchField\n      className={composeRenderProps(className, (className) =>\n        classNames(\"group\", className)\n      )}\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({ className, ...props }: AriaButtonProps) {\n  return (\n    <AriaButton\n      className={composeRenderProps(className, (className) =>\n        classNames(\n          \"mr-1 opacity-70 ring-offset-background transition-opacity\",\n          /* Hover */\n          \"data-[hovered]:opacity-100\",\n          /* Disabled */\n          \"data-[disabled]:pointer-events-none\",\n          /* Empty */\n          \"group-data-[empty]:invisible\",\n          className\n        )\n      )}\n      {...props}\n    />\n  )\n}\n\nexport interface SearchFieldProps extends AriaSearchFieldProps, FormFieldProps { };\nexport function SearchField({\n  label,\n  description,\n  className,\n  errorMessage,\n  ...props\n}: SearchFieldProps) {\n  return (\n    <ASearchField\n      className={composeRenderProps(className, (className) =>\n        classNames(\"group form-field\", className)\n      )}\n      {...props}\n    >\n      <FormField label={label} description={description} errorMessage={errorMessage}>\n        <FieldGroup>\n          <SearchIcon aria-hidden className=\"size-icon text-muted-foreground\" />\n          <ASearchFieldInput placeholder=\"\" />\n          <SearchFieldClear>\n            <XIcon aria-hidden className=\"size-icon\" />\n          </SearchFieldClear>\n        </FieldGroup>\n      </FormField>\n    </ASearchField>\n  )\n}"],"names":["ASearchField","className","props","jsx","AriaSearchField","composeRenderProps","classNames","ASearchFieldInput","AriaInput","SearchFieldClear","AriaButton","SearchField","label","description","errorMessage","FormField","FieldGroup","SearchIcon","XIcon"],"mappings":"mWAeA,SAASA,EAAa,CAAE,UAAAC,EAAW,GAAGC,GAA+B,CACnE,OACEC,EAACC,EAAA,CACC,UAAWC,EAAmBJ,EAAYA,GACxCK,EAAW,QAASL,CAAS,CAAA,EAE9B,GAAGC,CAAA,CAAA,CAGV,CAEA,SAASK,EAAkB,CAAE,UAAAN,EAAW,GAAGC,GAAyB,CAClE,OACEC,EAACK,EAAA,CACC,UAAWH,EAAmBJ,EAAYA,GACxCK,EACE,qJACAL,CAAA,CACF,EAED,GAAGC,CAAA,CAAA,CAGV,CAEA,SAASO,EAAiB,CAAE,UAAAR,EAAW,GAAGC,GAA0B,CAClE,OACEC,EAACO,EAAA,CACC,UAAWL,EAAmBJ,EAAYA,GACxCK,EACE,4DAEA,6BAEA,sCAEA,+BACAL,CAAA,CACF,EAED,GAAGC,CAAA,CAAA,CAGV,CAGO,SAASS,EAAY,CAC1B,MAAAC,EACA,YAAAC,EACA,UAAAZ,EACA,aAAAa,EACA,GAAGZ,CACL,EAAqB,CACnB,OACEC,EAACH,EAAA,CACC,UAAWK,EAAmBJ,EAAYA,GACxCK,EAAW,mBAAoBL,CAAS,CAAA,EAEzC,GAAGC,EAEJ,WAACa,EAAA,CAAU,MAAAH,EAAc,YAAAC,EAA0B,aAAAC,EACjD,WAACE,EAAA,CACC,SAAA,CAAAb,EAACc,EAAA,CAAW,cAAW,GAAC,UAAU,kCAAkC,EACpEd,EAACI,EAAA,CAAkB,YAAY,EAAA,CAAG,EAClCJ,EAACM,GACC,SAAAN,EAACe,EAAA,CAAM,cAAW,GAAC,UAAU,YAAY,CAAA,CAC3C,CAAA,CAAA,CACF,CAAA,CACF,CAAA,CAAA,CAGN"}

package/dist/components/select.d.ts

@@ -12,6 +12,6 @@ export interface SingleSelectProps<T extends SelectOption> extends Omit<AriaSele
     children: React.ReactNode | ((item: T) => React.ReactNode);
 }
 export declare function SingleSelect<T extends SelectOption>({ label, description, errorMessage, children, className, items, ...props }: SingleSelectProps<T>): import("react/jsx-runtime").JSX.Element;
-type TfSingleSelectProps<T extends SelectOption> = Omit<SingleSelectProps<T>, "value" | "setValue" | 'children'>;
+type TfSingleSelectProps<T extends SelectOption> = Omit<SingleSelectProps<T>, "value" | "setValue" | "children">;
 export declare function TfSingleSelect<T extends SelectOption>({ ...props }: TfSingleSelectProps<T>): import("react/jsx-runtime").JSX.Element;
 export {};

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 h}from"react-aria-components";import{Button as S}from"./button.js";import{FormField as g}from"./field.js";import{useFieldContext as x}from"../utils/form-context.js";import{getFieldErrorMessage as B,classNames as l}from"../utils/primitives.js";import{ChevronDown as N}from"lucide-react";import{ListBoxItem as v,ListBoxHeader as C,ListBoxCollection as w}from"./list-box.js";import{Popover as F}from"./popover.js";import"class-variance-authority";import"./loader.js";import"clsx";import"@tanstack/react-form";const L=p,_=v,G=C,J=w,P=({className:r,...t})=>o(f,{className:i(r,e=>l("line-clamp-1 data-[placeholder]:text-muted-foreground","[&>[slot=description]]:hidden",e)),...t});function V({className:r,children:t,...e}){return o(S,{...e,children:i(t,n=>c(u,{children:[n,o(N,{"aria-hidden":"true",className:"size-icon opacity-50"})]}))})}function j({className:r,...t}){return o(F,{className:i(r,e=>l("w-auto min-w-[--trigger-width]",e)),...t})}function y({className:r,...t}){return o(h,{className:i(r,e=>l("overflow-auto p-1 outline-none [clip-path:inset(0_0_0_0_round_calc(var(--radius)-2px))]",e)),...t})}function H({label:r,description:t,errorMessage:e,children:n,className:s,items:a,...m}){return o(L,{className:i(s,d=>l("group form-field",d)),...m,children:c(g,{label:r,description:t,errorMessage:e,children:[o(V,{children:o(P,{})}),o(j,{children:o(y,{items:a,children:n})})]})})}function O({...r}){const t=x();return o(H,{selectedKey:t.state.value,onSelectionChange:e=>t.handleChange(e.toString()),onBlur:t.handleBlur,errorMessage:B(t),...r,children:e=>o(_,{id:e.id,children:e.label},e.id)})}export{J as SelectCollection,G as SelectHeader,_ as SelectItem,j as SelectPopover,P as SelectValue,H as SingleSelect,O 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 h}from"react-aria-components";import{Button as S}from"./button.js";import{FormField as g}from"./field.js";import{useTfFieldContext as x}from"../utils/form-utils.js";import{getFieldErrorMessage as B,classNames as l}from"../utils/primitives.js";import{ChevronDown as N}from"lucide-react";import{ListBoxItem as v,ListBoxHeader as C,ListBoxCollection as w}from"./list-box.js";import{Popover as F}from"./popover.js";import"class-variance-authority";import"./loader.js";import"clsx";import"../utils/form-context.js";import"@tanstack/react-form";import"react";const L=p,_=v,O=C,Q=w,b=({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(S,{...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(F,{className:i(r,e=>l("w-auto min-w-[--trigger-width]",e)),...t})}function V({className:r,...t}){return o(h,{className:i(r,e=>l("overflow-auto p-1 outline-none [clip-path:inset(0_0_0_0_round_calc(var(--radius)-2px))]",e)),...t})}function j({label:r,description:t,errorMessage:e,children:n,className:s,items:a,...m}){return o(L,{className:i(s,d=>l("group form-field",d)),...m,children:c(g,{label:r,description:t,errorMessage:e,children:[o(P,{children:o(b,{})}),o(T,{children:o(V,{items:a,children:n})})]})})}function U({...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(_,{id:e.id,children:e.label},e.id)})}export{Q as SelectCollection,O as SelectHeader,_ as SelectItem,T as SelectPopover,b as SelectValue,j as SingleSelect,U 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 \"lib/components/button\"\nimport { FormField, type FormFieldProps } from \"lib/components/field\"\nimport type { SelectOption } from \"lib/components/select-options\"\nimport { useFieldContext } from \"lib/utils/form-context\"\nimport { classNames, getFieldErrorMessage } from \"lib/utils/primitives\"\nimport { ChevronDown } from \"lucide-react\"\nimport {\n  ListBoxCollection,\n  ListBoxHeader,\n  ListBoxItem,\n} 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>({\n  className,\n  ...props\n}: 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\nfunction SelectTrigger({ className, children, ...props }: React.ComponentProps<typeof Button>) {\n  return (\n    <Button {...props}>\n      {composeRenderProps(children, (children) => (\n        <>\n          {children}\n          <ChevronDown 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>({\n  className,\n  ...props\n}: AriaListBoxProps<T>) {\n  return (\n    <AriaListBox\n      className={composeRenderProps(className, (className) =>\n        classNames(\n          \"overflow-auto p-1 outline-none [clip-path:inset(0_0_0_0_round_calc(var(--radius)-2px))]\",\n          className\n        )\n      )}\n      {...props}\n    />\n  )\n}\n\nexport interface SingleSelectProps<T extends SelectOption> extends Omit<AriaSelectProps<T>, \"children\">, 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) =>\n        classNames(\"group form-field\", className)\n      )}\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\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 = useFieldContext<string>();\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) => <SelectItem id={item.id} key={item.id}>{item.label}</SelectItem>}\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","ChevronDown","SelectPopover","Popover","SelectListBox","AriaListBox","SingleSelect","label","description","errorMessage","items","FormField","TfSingleSelect","field","useFieldContext","getFieldErrorMessage","item"],"mappings":"8oBAyBA,MAAMA,EAAUC,EACHC,EAAaC,EACbC,EAAeC,EACfC,EAAmBC,EAEnBC,EAAc,CAAmB,CAC5C,UAAAC,EACA,GAAGC,CACL,IACEC,EAACC,EAAA,CACC,UAAWC,EAAmBJ,EAAYA,GACxCK,EACE,wDAEA,gCACAL,CAAA,CACF,EAED,GAAGC,CAAA,CACN,EAGF,SAASK,EAAc,CAAE,UAAAN,EAAW,SAAAO,EAAU,GAAGN,GAA8C,CAC7F,OACEC,EAACM,GAAQ,GAAGP,EACT,WAAmBM,EAAWA,GAC7BE,EAAAC,EAAA,CACG,SAAA,CAAAH,EACDL,EAACS,EAAA,CAAY,cAAY,OAAO,UAAU,sBAAA,CAAuB,CAAA,CAAA,CACnE,CACD,CAAA,CACH,CAEJ,CAEO,SAASC,EAAc,CAAE,UAAAZ,EAAW,GAAGC,GAA2B,CACvE,OACEC,EAACW,EAAA,CACC,UAAWT,EAAmBJ,EAAYA,GACxCK,EAAW,iCAAkCL,CAAS,CAAA,EAEvD,GAAGC,CAAA,CAAA,CAGV,CAEA,SAASa,EAAgC,CACvC,UAAAd,EACA,GAAGC,CACL,EAAwB,CACtB,OACEC,EAACa,EAAA,CACC,UAAWX,EAAmBJ,EAAYA,GACxCK,EACE,0FACAL,CAAA,CACF,EAED,GAAGC,CAAA,CAAA,CAGV,CAOO,SAASe,EAAqC,CACnD,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAZ,EACA,UAAAP,EACA,MAAAoB,EACA,GAAGnB,CACL,EAAyB,CACvB,OACEC,EAACX,EAAA,CACC,UAAWa,EAAmBJ,EAAYA,GACxCK,EAAW,mBAAoBL,CAAS,CAAA,EAEzC,GAAGC,EAEJ,SAAAQ,EAACY,EAAA,CAAU,MAAAJ,EAAc,YAAAC,EAA0B,aAAAC,EACjD,SAAA,CAAAjB,EAACI,EAAA,CACC,SAAAJ,EAACH,EAAA,CAAA,CAAY,EACf,IACCa,EAAA,CACC,SAAAV,EAACY,EAAA,CAAc,MAAAM,EAAe,SAAAb,EAAS,CAAA,CACzC,CAAA,CAAA,CACF,CAAA,CAAA,CAGN,CAKO,SAASe,EAAuC,CAAE,GAAGrB,GAAiC,CAC3F,MAAMsB,EAAQC,EAAA,EAEd,OACEtB,EAACc,EAAA,CACC,YAAaO,EAAM,MAAM,MACzB,kBAAoB,GAAMA,EAAM,aAAa,EAAG,UAAU,EAC1D,OAAQA,EAAM,WACd,aAAcE,EAAqBF,CAAK,EACvC,GAAGtB,EAEH,SAACyB,GAASxB,EAACT,EAAA,CAAW,GAAIiC,EAAK,GAAmB,SAAAA,EAAK,KAAA,EAAfA,EAAK,EAAgB,CAAA,CAAA,CAGpE"}
+{"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 \"lib/components/button\";\nimport { FormField, type FormFieldProps } from \"lib/components/field\";\nimport type { SelectOption } from \"lib/components/select-options\";\nimport { useTfFieldContext } from \"lib/utils/form-utils\";\nimport { classNames, getFieldErrorMessage } from \"lib/utils/primitives\";\nimport { ChevronDown } from \"lucide-react\";\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>({\n  className,\n  ...props\n}: 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\nfunction SelectTrigger({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof Button>) {\n  return (\n    <Button {...props}>\n      {composeRenderProps(children, (children) => (\n        <>\n          {children}\n          <ChevronDown 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>({\n  className,\n  ...props\n}: AriaListBoxProps<T>) {\n  return (\n    <AriaListBox\n      className={composeRenderProps(className, (className) =>\n        classNames(\n          \"overflow-auto p-1 outline-none [clip-path:inset(0_0_0_0_round_calc(var(--radius)-2px))]\",\n          className\n        )\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) =>\n        classNames(\"group form-field\", className)\n      )}\n      {...props}\n    >\n      <FormField\n        label={label}\n        description={description}\n        errorMessage={errorMessage}\n      >\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<\n  SingleSelectProps<T>,\n  \"value\" | \"setValue\" | \"children\"\n>;\n\nexport function TfSingleSelect<T extends SelectOption>({\n  ...props\n}: 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","ChevronDown","SelectPopover","Popover","SelectListBox","AriaListBox","SingleSelect","label","description","errorMessage","items","FormField","TfSingleSelect","field","useTfFieldContext","getFieldErrorMessage","item"],"mappings":"6rBAqBA,MAAMA,EAAUC,EACHC,EAAaC,EACbC,EAAeC,EACfC,EAAmBC,EAEnBC,EAAc,CAAmB,CAC5C,UAAAC,EACA,GAAGC,CACL,IACEC,EAACC,EAAA,CACC,UAAWC,EAAmBJ,EAAYA,GACxCK,EACE,wDAEA,gCACAL,CAAA,CACF,EAED,GAAGC,CAAA,CACN,EAGF,SAASK,EAAc,CACrB,UAAAN,EACA,SAAAO,EACA,GAAGN,CACL,EAAwC,CACtC,OACEC,EAACM,GAAQ,GAAGP,EACT,WAAmBM,EAAWA,GAC7BE,EAAAC,EAAA,CACG,SAAA,CAAAH,EACDL,EAACS,EAAA,CAAY,cAAY,OAAO,UAAU,sBAAA,CAAuB,CAAA,CAAA,CACnE,CACD,CAAA,CACH,CAEJ,CAEO,SAASC,EAAc,CAAE,UAAAZ,EAAW,GAAGC,GAA2B,CACvE,OACEC,EAACW,EAAA,CACC,UAAWT,EAAmBJ,EAAYA,GACxCK,EAAW,iCAAkCL,CAAS,CAAA,EAEvD,GAAGC,CAAA,CAAA,CAGV,CAEA,SAASa,EAAgC,CACvC,UAAAd,EACA,GAAGC,CACL,EAAwB,CACtB,OACEC,EAACa,EAAA,CACC,UAAWX,EAAmBJ,EAAYA,GACxCK,EACE,0FACAL,CAAA,CACF,EAED,GAAGC,CAAA,CAAA,CAGV,CASO,SAASe,EAAqC,CACnD,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAZ,EACA,UAAAP,EACA,MAAAoB,EACA,GAAGnB,CACL,EAAyB,CACvB,OACEC,EAACX,EAAA,CACC,UAAWa,EAAmBJ,EAAYA,GACxCK,EAAW,mBAAoBL,CAAS,CAAA,EAEzC,GAAGC,EAEJ,SAAAQ,EAACY,EAAA,CACC,MAAAJ,EACA,YAAAC,EACA,aAAAC,EAEA,SAAA,CAAAjB,EAACI,EAAA,CACC,SAAAJ,EAACH,EAAA,CAAA,CAAY,EACf,IACCa,EAAA,CACC,SAAAV,EAACY,EAAA,CAAc,MAAAM,EAAe,SAAAb,EAAS,CAAA,CACzC,CAAA,CAAA,CAAA,CACF,CAAA,CAGN,CAOO,SAASe,EAAuC,CACrD,GAAGrB,CACL,EAA2B,CACzB,MAAMsB,EAAQC,EAA0B,CAAE,SAAUvB,EAAM,WAAY,EAEtE,OACEC,EAACc,EAAA,CACC,YAAaO,EAAM,MAAM,MACzB,kBAAoB,GAAMA,EAAM,aAAa,EAAG,UAAU,EAC1D,OAAQA,EAAM,WACd,aAAcE,EAAqBF,CAAK,EACvC,GAAGtB,EAEH,SAACyB,GACAxB,EAACT,EAAA,CAAW,GAAIiC,EAAK,GAClB,SAAAA,EAAK,KAAA,EADsBA,EAAK,EAEnC,CAAA,CAAA,CAIR"}

package/dist/components/textfield.js

@@ -1,2 +1,2 @@
-import{jsx as o}from"react/jsx-runtime";import{TextField as u,composeRenderProps as i,TextArea as f,Input as p}from"react-aria-components";import{useFieldContext as c}from"../utils/form-context.js";import{getFieldErrorMessage as d,classNames as n}from"../utils/primitives.js";import{FormField as g}from"./field.js";import"@tanstack/react-form";import"clsx";import"class-variance-authority";import"lucide-react";const x=u;function b({className:r,...t}){return o(p,{className:i(r,e=>n("flex input-dim w-full border border-input bg-card ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground","disabled-muted","focus-ring",e)),...t})}function h({className:r,...t}){return o(f,{className:i(r,e=>n("flex min-h-32 w-full border border-input bg-card px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground","focus-ring","disabled-muted",e)),...t})}function F({label:r,description:t,errorMessage:e,textArea:l,className:a,...s}){return o(x,{className:i(a,m=>n("group form-field",m)),...s,children:o(g,{label:r,errorMessage:e,description:t,children:l?o(h,{}):o(b,{})})})}function B({isDisabled:r,...t}){const e=c();return o(F,{isDisabled:r||e.form.state.isSubmitting,value:e.state.value,id:e.name,name:e.name,onBlur:e.handleBlur,onChange:e.handleChange,isInvalid:!!d(e),errorMessage:d(e),...t})}export{F as TextField,B as TfTextField};
+import{jsx as o}from"react/jsx-runtime";import{TextField as u,composeRenderProps as i,TextArea as f,Input as p}from"react-aria-components";import{useTfFieldContext as c}from"../utils/form-utils.js";import{getFieldErrorMessage as d,classNames as n}from"../utils/primitives.js";import{FormField as g}from"./field.js";import"../utils/form-context.js";import"@tanstack/react-form";import"react";import"clsx";import"class-variance-authority";import"lucide-react";const x=u;function b({className:r,...t}){return o(p,{className:i(r,e=>n("flex input-dim w-full border border-input bg-popover ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground","disabled-muted","focus-ring",e)),...t})}function T({className:r,...t}){return o(f,{className:i(r,e=>n("flex min-h-32 w-full border border-input bg-popover px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground","focus-ring","disabled-muted",e)),...t})}function h({label:r,description:t,errorMessage:e,textArea:l,className:m,...a}){return o(x,{className:i(m,s=>n("group form-field",s)),...a,children:o(g,{label:r,errorMessage:e,description:t,children:l?o(T,{}):o(b,{})})})}function j({isDisabled:r,...t}){const e=c({disabled:r});return o(h,{isDisabled:r||e.form.state.isSubmitting,value:e.state.value,id:e.name,name:e.name,onBlur:e.handleBlur,onChange:e.handleChange,isInvalid:!!d(e),errorMessage:d(e),...t})}export{h as TextField,j as TfTextField};
 //# sourceMappingURL=textfield.js.map

package/dist/components/textfield.js.map

@@ -1 +1 @@
-{"version":3,"file":"textfield.js","sources":["../../lib/components/textfield.tsx"],"sourcesContent":["import {\n  Input as AriaInput,\n  InputProps as AriaInputProps,\n  TextArea as AriaTextArea,\n  TextAreaProps as AriaTextAreaProps,\n  TextField as AriaTextField,\n  TextFieldProps as AriaTextFieldProps,\n  composeRenderProps\n} from \"react-aria-components\"\n\n\nimport { useFieldContext } from \"lib/utils/form-context\"\nimport { classNames, getFieldErrorMessage } from \"lib/utils/primitives\"\nimport { FormField, type FormFieldProps } from \"./field\"\n\nconst ATextField = AriaTextField\n\nfunction Input({ className, ...props }: AriaInputProps) {\n  return (\n    <AriaInput\n      className={composeRenderProps(className, (className) =>\n        classNames(\n          \"flex input-dim w-full border border-input bg-card ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground\",\n          /* Disabled */\n          \"disabled-muted\",\n          /* Focused */\n          \"focus-ring\",\n          className\n        )\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction TextArea({ className, ...props }: AriaTextAreaProps) {\n  return (\n    <AriaTextArea\n      className={composeRenderProps(className, (className) =>\n        classNames(\n          \"flex min-h-32 w-full border border-input bg-card px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground\",\n          /* Focused */\n          \"focus-ring\",\n          /* Disabled */\n          \"disabled-muted\",\n          className\n        )\n      )}\n      {...props}\n    />\n  )\n}\n\nexport interface TextFieldProps extends AriaTextFieldProps, FormFieldProps {\n  textArea?: boolean\n}\n\nexport function TextField({\n  label,\n  description,\n  errorMessage,\n  textArea,\n  className,\n  ...props\n}: TextFieldProps) {\n  return (\n    <ATextField\n      className={composeRenderProps(className, (className) =>\n        classNames(\"group form-field\", className)\n      )}\n      {...props}\n    >\n      <FormField label={label} errorMessage={errorMessage} description={description}>\n        {textArea ? <TextArea /> : <Input />}\n      </FormField>\n    </ATextField>\n  )\n}\n\nexport function TfTextField({ isDisabled, ...props }: React.ComponentProps<typeof TextField>) {\n  const field = useFieldContext<string>();\n\n  return (\n    <TextField\n      isDisabled={isDisabled || field.form.state.isSubmitting}\n      value={field.state.value}\n      id={field.name}\n      name={field.name}\n      onBlur={field.handleBlur}\n      onChange={field.handleChange}\n      isInvalid={!!getFieldErrorMessage(field)}\n      errorMessage={getFieldErrorMessage(field)}\n      {...props} />)\n}\n\n\n"],"names":["ATextField","AriaTextField","Input","className","props","jsx","AriaInput","composeRenderProps","classNames","TextArea","AriaTextArea","TextField","label","description","errorMessage","textArea","FormField","TfTextField","isDisabled","field","useFieldContext","getFieldErrorMessage"],"mappings":"2ZAeA,MAAMA,EAAaC,EAEnB,SAASC,EAAM,CAAE,UAAAC,EAAW,GAAGC,GAAyB,CACtD,OACEC,EAACC,EAAA,CACC,UAAWC,EAAmBJ,EAAYA,GACxCK,EACE,6KAEA,iBAEA,aACAL,CAAA,CACF,EAED,GAAGC,CAAA,CAAA,CAGV,CAEA,SAASK,EAAS,CAAE,UAAAN,EAAW,GAAGC,GAA4B,CAC5D,OACEC,EAACK,EAAA,CACC,UAAWH,EAAmBJ,EAAYA,GACxCK,EACE,8HAEA,aAEA,iBACAL,CAAA,CACF,EAED,GAAGC,CAAA,CAAA,CAGV,CAMO,SAASO,EAAU,CACxB,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAC,EACA,UAAAZ,EACA,GAAGC,CACL,EAAmB,CACjB,OACEC,EAACL,EAAA,CACC,UAAWO,EAAmBJ,EAAYA,GACxCK,EAAW,mBAAoBL,CAAS,CAAA,EAEzC,GAAGC,EAEJ,SAAAC,EAACW,EAAA,CAAU,MAAAJ,EAAc,aAAAE,EAA4B,YAAAD,EAClD,SAAAE,EAAWV,EAACI,EAAA,CAAA,CAAS,EAAKJ,EAACH,EAAA,CAAA,CAAM,CAAA,CACpC,CAAA,CAAA,CAGN,CAEO,SAASe,EAAY,CAAE,WAAAC,EAAY,GAAGd,GAAiD,CAC5F,MAAMe,EAAQC,EAAA,EAEd,OACEf,EAACM,EAAA,CACC,WAAYO,GAAcC,EAAM,KAAK,MAAM,aAC3C,MAAOA,EAAM,MAAM,MACnB,GAAIA,EAAM,KACV,KAAMA,EAAM,KACZ,OAAQA,EAAM,WACd,SAAUA,EAAM,aAChB,UAAW,CAAC,CAACE,EAAqBF,CAAK,EACvC,aAAcE,EAAqBF,CAAK,EACvC,GAAGf,CAAA,CAAA,CACV"}
+{"version":3,"file":"textfield.js","sources":["../../lib/components/textfield.tsx"],"sourcesContent":["import {\n  Input as AriaInput,\n  InputProps as AriaInputProps,\n  TextArea as AriaTextArea,\n  TextAreaProps as AriaTextAreaProps,\n  TextField as AriaTextField,\n  TextFieldProps as AriaTextFieldProps,\n  composeRenderProps,\n} from \"react-aria-components\";\n\nimport { useTfFieldContext } from \"lib/utils/form-utils\";\nimport { classNames, getFieldErrorMessage } from \"lib/utils/primitives\";\nimport { FormField, type FormFieldProps } from \"./field\";\n\nconst ATextField = AriaTextField;\n\nfunction Input({ className, ...props }: AriaInputProps) {\n  return (\n    <AriaInput\n      className={composeRenderProps(className, (className) =>\n        classNames(\n          \"flex input-dim w-full border border-input bg-popover ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground\",\n          /* Disabled */\n          \"disabled-muted\",\n          /* Focused */\n          \"focus-ring\",\n          className\n        )\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction TextArea({ className, ...props }: AriaTextAreaProps) {\n  return (\n    <AriaTextArea\n      className={composeRenderProps(className, (className) =>\n        classNames(\n          \"flex min-h-32 w-full border border-input bg-popover px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground\",\n          /* Focused */\n          \"focus-ring\",\n          /* Disabled */\n          \"disabled-muted\",\n          className\n        )\n      )}\n      {...props}\n    />\n  );\n}\n\nexport interface TextFieldProps extends AriaTextFieldProps, FormFieldProps {\n  textArea?: boolean;\n}\n\nexport function TextField({\n  label,\n  description,\n  errorMessage,\n  textArea,\n  className,\n  ...props\n}: TextFieldProps) {\n  return (\n    <ATextField\n      className={composeRenderProps(className, (className) =>\n        classNames(\"group form-field\", className)\n      )}\n      {...props}\n    >\n      <FormField\n        label={label}\n        errorMessage={errorMessage}\n        description={description}\n      >\n        {textArea ? <TextArea /> : <Input />}\n      </FormField>\n    </ATextField>\n  );\n}\n\nexport function TfTextField({\n  isDisabled,\n  ...props\n}: React.ComponentProps<typeof TextField>) {\n  const field = useTfFieldContext<string>({ disabled: isDisabled });\n\n  return (\n    <TextField\n      isDisabled={isDisabled || field.form.state.isSubmitting}\n      value={field.state.value}\n      id={field.name}\n      name={field.name}\n      onBlur={field.handleBlur}\n      onChange={field.handleChange}\n      isInvalid={!!getFieldErrorMessage(field)}\n      errorMessage={getFieldErrorMessage(field)}\n      {...props}\n    />\n  );\n}\n"],"names":["ATextField","AriaTextField","Input","className","props","jsx","AriaInput","composeRenderProps","classNames","TextArea","AriaTextArea","TextField","label","description","errorMessage","textArea","FormField","TfTextField","isDisabled","field","useTfFieldContext","getFieldErrorMessage"],"mappings":"0cAcA,MAAMA,EAAaC,EAEnB,SAASC,EAAM,CAAE,UAAAC,EAAW,GAAGC,GAAyB,CACtD,OACEC,EAACC,EAAA,CACC,UAAWC,EAAmBJ,EAAYA,GACxCK,EACE,gLAEA,iBAEA,aACAL,CAAA,CACF,EAED,GAAGC,CAAA,CAAA,CAGV,CAEA,SAASK,EAAS,CAAE,UAAAN,EAAW,GAAGC,GAA4B,CAC5D,OACEC,EAACK,EAAA,CACC,UAAWH,EAAmBJ,EAAYA,GACxCK,EACE,iIAEA,aAEA,iBACAL,CAAA,CACF,EAED,GAAGC,CAAA,CAAA,CAGV,CAMO,SAASO,EAAU,CACxB,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAC,EACA,UAAAZ,EACA,GAAGC,CACL,EAAmB,CACjB,OACEC,EAACL,EAAA,CACC,UAAWO,EAAmBJ,EAAYA,GACxCK,EAAW,mBAAoBL,CAAS,CAAA,EAEzC,GAAGC,EAEJ,SAAAC,EAACW,EAAA,CACC,MAAAJ,EACA,aAAAE,EACA,YAAAD,EAEC,SAAAE,EAAWV,EAACI,EAAA,CAAA,CAAS,IAAMP,EAAA,CAAA,CAAM,CAAA,CAAA,CACpC,CAAA,CAGN,CAEO,SAASe,EAAY,CAC1B,WAAAC,EACA,GAAGd,CACL,EAA2C,CACzC,MAAMe,EAAQC,EAA0B,CAAE,SAAUF,EAAY,EAEhE,OACEb,EAACM,EAAA,CACC,WAAYO,GAAcC,EAAM,KAAK,MAAM,aAC3C,MAAOA,EAAM,MAAM,MACnB,GAAIA,EAAM,KACV,KAAMA,EAAM,KACZ,OAAQA,EAAM,WACd,SAAUA,EAAM,aAChB,UAAW,CAAC,CAACE,EAAqBF,CAAK,EACvC,aAAcE,EAAqBF,CAAK,EACvC,GAAGf,CAAA,CAAA,CAGV"}

package/dist/utils/form-hook.js

@@ -1,2 +1,2 @@
-import{createFormHook as o}from"@tanstack/react-form";import{Button as m}from"../components/button.js";import{TfCheckbox as r}from"../components/checkbox.js";import{TfMultiSelect as t}from"../components/multi-select.js";import{TfNumberField as i}from"../components/numberfield.js";import{TfSingleSelect as p}from"../components/select.js";import{TfTextField as e}from"../components/textfield.js";import{formContext as f,fieldContext as n}from"./form-context.js";import"react/jsx-runtime";import"class-variance-authority";import"./primitives.js";import"clsx";import"react-aria-components";import"../components/loader.js";import"lucide-react";import"../components/field.js";import"../components/menu.js";import"../components/list-box.js";import"../components/popover.js";const{useAppForm:N}=o({fieldComponents:{TfTextField:e,TfNumberField:i,TfMultiSelect:t,TfSingleSelect:p,TfCheckbox:r},formComponents:{Button:m},fieldContext:n,formContext:f});export{N as useAppForm};
+import{createFormHook as o}from"@tanstack/react-form";import{Button as m}from"../components/button.js";import{TfCheckbox as r}from"../components/checkbox.js";import{TfMultiSelect as t}from"../components/multi-select.js";import{TfNumberField as i}from"../components/numberfield.js";import{TfSingleSelect as p}from"../components/select.js";import{TfTextField as e}from"../components/textfield.js";import{formContext as f,fieldContext as n}from"./form-context.js";import"react/jsx-runtime";import"class-variance-authority";import"./primitives.js";import"clsx";import"react-aria-components";import"../components/loader.js";import"lucide-react";import"../components/field.js";import"./form-utils.js";import"react";import"../components/menu.js";import"../components/list-box.js";import"../components/popover.js";const{useAppForm:q}=o({fieldComponents:{TfTextField:e,TfNumberField:i,TfMultiSelect:t,TfSingleSelect:p,TfCheckbox:r},formComponents:{Button:m},fieldContext:n,formContext:f});export{q as useAppForm};
 //# sourceMappingURL=form-hook.js.map

package/dist/utils/form-hook.js.map

@@ -1 +1 @@
-{"version":3,"file":"form-hook.js","sources":["../../lib/utils/form-hook.tsx"],"sourcesContent":["import { createFormHook } from \"@tanstack/react-form\";\nimport { Button } from \"lib/components/button\";\nimport { TfCheckbox } from \"lib/components/checkbox\";\nimport { TfMultiSelect } from \"lib/components/multi-select\";\nimport { TfNumberField } from \"lib/components/numberfield\";\nimport { TfSingleSelect } from \"lib/components/select\";\nimport { TfTextField } from \"lib/components/textfield\";\nimport { fieldContext, formContext } from \"lib/utils/form-context\";\n\n/** Don't put this in the same file as form-context.tsx, this causes circular dependencies. */\n/** TODO, lazy loading when fieldComponents are large */\n/**\n * Builder for form logic and user interfaces\n */\nexport const { useAppForm } = createFormHook({\n\tfieldComponents: {\n\t\tTfTextField,\n\t\tTfNumberField,\n\t\tTfMultiSelect,\n\t\tTfSingleSelect,\n\t\tTfCheckbox,\n\t},\n\tformComponents: {\n\t\tButton,\n\t},\n\tfieldContext,\n\tformContext,\n});\n"],"names":["useAppForm","createFormHook","TfTextField","TfNumberField","TfMultiSelect","TfSingleSelect","TfCheckbox","Button","fieldContext","formContext"],"mappings":"gwBAcO,KAAM,CAAE,WAAAA,CAAA,EAAeC,EAAe,CAC5C,gBAAiB,CAChB,YAAAC,EACA,cAAAC,EACA,cAAAC,EACA,eAAAC,EACA,WAAAC,CAAA,EAED,eAAgB,CACf,OAAAC,CAAA,EAED,aAAAC,EACA,YAAAC,CACD,CAAC"}
+{"version":3,"file":"form-hook.js","sources":["../../lib/utils/form-hook.tsx"],"sourcesContent":["import { createFormHook } from \"@tanstack/react-form\";\nimport { Button } from \"lib/components/button\";\nimport { TfCheckbox } from \"lib/components/checkbox\";\nimport { TfMultiSelect } from \"lib/components/multi-select\";\nimport { TfNumberField } from \"lib/components/numberfield\";\nimport { TfSingleSelect } from \"lib/components/select\";\nimport { TfTextField } from \"lib/components/textfield\";\nimport { fieldContext, formContext } from \"lib/utils/form-context\";\n\n/** Don't put this in the same file as form-context.tsx, this causes circular dependencies. */\n/** TODO, lazy loading when fieldComponents are large */\n/**\n * Builder for form logic and user interfaces\n */\nexport const { useAppForm } = createFormHook({\n  fieldComponents: {\n    TfTextField,\n    TfNumberField,\n    TfMultiSelect,\n    TfSingleSelect,\n    TfCheckbox,\n  },\n  formComponents: {\n    Button,\n  },\n  fieldContext,\n  formContext,\n});\n"],"names":["useAppForm","createFormHook","TfTextField","TfNumberField","TfMultiSelect","TfSingleSelect","TfCheckbox","Button","fieldContext","formContext"],"mappings":"syBAcO,KAAM,CAAE,WAAAA,CAAA,EAAeC,EAAe,CAC3C,gBAAiB,CACf,YAAAC,EACA,cAAAC,EACA,cAAAC,EACA,eAAAC,EACA,WAAAC,CAAA,EAEF,eAAgB,CACd,OAAAC,CAAA,EAEF,aAAAC,EACA,YAAAC,CACF,CAAC"}

package/dist/utils/form-utils.d.ts

@@ -0,0 +1,24 @@
+import { FormApi } from '@tanstack/react-form';
+type FieldContextProps = {
+    disabled?: boolean;
+};
+/**
+ * Custom hook to handle disabled state for form fields
+ * @param {boolean} disabled - The disabled prop passed to the component
+ * @returns The field context with disabled state properly managed
+ */
+export declare const useTfFieldContext: <T>({ disabled }: FieldContextProps) => import('@tanstack/react-form').FieldApi<any, string, T, any, any, any, any, any, any, any, any, any, any, any, any, any, any, any, any>;
+/** Utility type to simplify FormApi usage */
+export type AppFormApi<TValues> = FormApi<TValues, any, any, any, any, any, any, any, any, any>;
+/**
+ * Utility function to submit a form with a handler that receives the values and the formApi.
+ * @param onSubmit - The handler function to call with the values and the formApi.
+ * @returns A function that can be used to submit the form. It will filter out disabled fields from the values.
+ */
+export declare function tfOnSubmit<TValues>(onSubmit: ({ values, formApi, }: {
+    values: TValues;
+    formApi: AppFormApi<TValues>;
+}) => Promise<any> | any): ({ formApi, }: {
+    formApi: AppFormApi<TValues>;
+}) => Promise<any>;
+export {};

package/dist/utils/form-utils.js

@@ -0,0 +1,2 @@
+import{useFieldContext as o}from"./form-context.js";import i from"react";import"@tanstack/react-form";const l=({disabled:e})=>{const t=o();return i.useEffect(()=>{t.setMeta(n=>({...n,disabled:!!e}))},[e,t]),t};function d(e){return async({formApi:t})=>{const n=c(t.state.values,t);await e({values:n,formApi:t})}}function c(e,t){const n={};for(const s in e)t.getFieldMeta(s)?.disabled||(n[s]=e[s]);return n}export{d as tfOnSubmit,l as useTfFieldContext};
+//# sourceMappingURL=form-utils.js.map

package/dist/utils/form-utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-utils.js","sources":["../../lib/utils/form-utils.tsx"],"sourcesContent":["import { type AnyFieldMeta, type FormApi } from \"@tanstack/react-form\";\nimport { useFieldContext } from \"lib/utils/form-context\";\nimport React from \"react\";\n\ntype FieldContextProps = {\n  disabled?: boolean;\n};\n\n/**\n * Custom hook to handle disabled state for form fields\n * @param {boolean} disabled - The disabled prop passed to the component\n * @returns The field context with disabled state properly managed\n */\nexport const useTfFieldContext = <T,>({ disabled }: FieldContextProps) => {\n  const field = useFieldContext<T>();\n\n  React.useEffect(() => {\n    field.setMeta((meta) => ({\n      ...meta,\n      disabled: !!disabled,\n    }));\n  }, [disabled, field]);\n\n  return field;\n};\n\n/** Utility type to simplify FormApi usage */\nexport type AppFormApi<TValues> = FormApi<\n  TValues,\n  any,\n  any,\n  any,\n  any,\n  any,\n  any,\n  any,\n  any,\n  any\n>;\n\n/**\n * Utility function to submit a form with a handler that receives the values and the formApi.\n * @param onSubmit - The handler function to call with the values and the formApi.\n * @returns A function that can be used to submit the form. It will filter out disabled fields from the values.\n */\nexport function tfOnSubmit<TValues>(\n  onSubmit: ({\n    values,\n    formApi,\n  }: {\n    values: TValues;\n    formApi: AppFormApi<TValues>;\n  }) => Promise<any> | any\n) {\n  return async ({\n    formApi,\n  }: {\n    formApi: AppFormApi<TValues>;\n  }): Promise<any> => {\n    const values = pickEnabledFields(formApi.state.values, formApi);\n\n    await onSubmit({ values, formApi });\n  };\n}\nfunction pickEnabledFields<TValues>(\n  rawValues: TValues,\n  formApi: AppFormApi<TValues>\n): TValues {\n  const result: TValues = {} as TValues;\n\n  //TODO: Nested objects are not supported yet\n  for (const key in rawValues) {\n    const meta = formApi.getFieldMeta(key) as AnyFieldMeta & {\n      disabled?: boolean;\n    };\n    if (!meta?.disabled) {\n      result[key] = rawValues[key];\n    }\n  }\n\n  return result;\n}\n"],"names":["useTfFieldContext","disabled","field","useFieldContext","React","meta","tfOnSubmit","onSubmit","formApi","values","pickEnabledFields","rawValues","result","key"],"mappings":"sGAaO,MAAMA,EAAoB,CAAK,CAAE,SAAAC,KAAkC,CACxE,MAAMC,EAAQC,EAAA,EAEd,OAAAC,EAAM,UAAU,IAAM,CACpBF,EAAM,QAASG,IAAU,CACvB,GAAGA,EACH,SAAU,CAAC,CAACJ,CAAA,EACZ,CACJ,EAAG,CAACA,EAAUC,CAAK,CAAC,EAEbA,CACT,EAqBO,SAASI,EACdC,EAOA,CACA,MAAO,OAAO,CACZ,QAAAC,CAAA,IAGkB,CAClB,MAAMC,EAASC,EAAkBF,EAAQ,MAAM,OAAQA,CAAO,EAE9D,MAAMD,EAAS,CAAE,OAAAE,EAAQ,QAAAD,EAAS,CACpC,CACF,CACA,SAASE,EACPC,EACAH,EACS,CACT,MAAMI,EAAkB,CAAA,EAGxB,UAAWC,KAAOF,EACHH,EAAQ,aAAaK,CAAG,GAG1B,WACTD,EAAOC,CAAG,EAAIF,EAAUE,CAAG,GAI/B,OAAOD,CACT"}