@cryptlex/web-components 5.0.0 → 5.1.1

package/dist/components/inputs/id-search.es.js

@@ -1,50 +1,53 @@
-import { jsx as t, Fragment as b, jsxs as d } from "react/jsx-runtime";
-import { SearchField as S } from "./searchfield.es.js";
-import { Menu as x, MenuItem as F } from "../ui/menu.es.js";
-import { useQuery as u } from "@tanstack/react-query";
-import { useId as I, useState as C } from "react";
-import { Autocomplete as N } from "../../node_modules/.pnpm/react-aria-components@1.11.0_react-dom@19.1.0_react@19.1.0/node_modules/react-aria-components/dist/Autocomplete.es.js";
-import { PopoverTrigger as q, Popover as j } from "../ui/popover.es.js";
+import { jsx as r, Fragment as x, jsxs as l } from "react/jsx-runtime";
+import { SearchField as F } from "./searchfield.es.js";
+import { Menu as I, MenuItem as N } from "../ui/menu.es.js";
+import { useQuery as p } from "@tanstack/react-query";
+import { useId as C, useState as q } from "react";
+import { Autocomplete as j } from "react-aria-components";
+import { PopoverTrigger as K, Popover as M } from "../ui/popover.es.js";
+import { Loader as v } from "../ui/loader.es.js";
 import { Button as A } from "../ui/button.es.js";
-import { useFieldContext as K } from "../../utils/form-context.es.js";
-function M({ value: r, disabled: s = !1, searchFn: n, multiple: o, onChange: l, onBlur: i, accessor: f = "id", idLookup: m }) {
-  const c = I(), [a, p] = C(""), { data: h, isError: $, isFetching: E, error: P } = u({
+import { useFieldContext as E } from "../../utils/form-context.es.js";
+function L({ value: t, disabled: i = !1, searchFn: n, multiple: o, onChange: f, onBlur: s, accessor: h = "id", idLookup: m }) {
+  const c = C(), [a, g] = q(""), { data: y, isError: d, isFetching: u, error: S } = p({
     queryKey: [c, a],
     queryFn: () => n(a)
-  }), y = u({
-    queryKey: [c, r],
-    queryFn: () => m(Array.from(r.keys()).map((e) => e.toString())),
-    enabled: m && r.size > 0
+  }), b = p({
+    queryKey: [c, t],
+    queryFn: () => m(Array.from(t.keys()).map((e) => e.toString())),
+    enabled: m && t.size > 0
   });
-  return /* @__PURE__ */ t(b, { children: /* @__PURE__ */ d(q, { onOpenChange: (e) => {
-    e || i == null || i(r);
+  return /* @__PURE__ */ r(x, { children: /* @__PURE__ */ l(K, { onOpenChange: (e) => {
+    e || s == null || s(t);
   }, children: [
-    /* @__PURE__ */ t(A, { className: "min-w-3xs", isDisabled: s, children: (() => {
+    /* @__PURE__ */ r(A, { className: "min-w-3xs", isDisabled: i, children: (() => {
       var e;
-      return console.error(Array.from(r.keys()).map((g) => g.toString())), (e = y.data) == null ? void 0 : e.join(",");
+      return (e = b.data) == null ? void 0 : e.join(",");
     })() }),
-    /* @__PURE__ */ t(j, { className: "p-2", children: /* @__PURE__ */ d(
-      N,
+    /* @__PURE__ */ r(M, { className: "p-2", children: /* @__PURE__ */ l(
+      j,
       {
         inputValue: a,
-        onInputChange: p,
+        onInputChange: g,
         children: [
-          /* @__PURE__ */ t(S, { className: "mb-icon", autoFocus: !0 }),
-          /* @__PURE__ */ t(x, { selectedKeys: r, selectionMode: o ? "multiple" : "single", onSelectionChange: (e) => {
-            typeof e != "string" && l(e);
-          }, className: "text-sm", items: h, renderEmptyState: () => "No results found.", children: (e) => /* @__PURE__ */ t(F, { id: e[f], children: e.name }, e.id) })
+          /* @__PURE__ */ r(F, { className: "mb-icon", autoFocus: !0 }),
+          u && /* @__PURE__ */ r(v, { className: "p-input" }),
+          !u && !d && /* @__PURE__ */ r(I, { selectedKeys: t, selectionMode: o ? "multiple" : "single", onSelectionChange: (e) => {
+            typeof e != "string" && f(e);
+          }, className: "text-sm", items: y, renderEmptyState: () => "No results found.", children: (e) => /* @__PURE__ */ r(N, { id: e[h], children: e.name }, e.id) }),
+          d && /* @__PURE__ */ r("div", { className: "text-destructive p-icon", children: S.message })
         ]
       }
     ) })
   ] }) });
 }
-function V({ disabled: r, ...s }) {
-  const n = K();
-  return /* @__PURE__ */ t(
-    M,
+function G({ disabled: t, ...i }) {
+  const n = E();
+  return /* @__PURE__ */ r(
+    L,
     {
-      ...s,
-      disabled: r || n.form.state.isSubmitting,
+      ...i,
+      disabled: t || n.form.state.isSubmitting,
       value: n.state.value,
       onBlur: (o) => n.handleBlur(),
       onChange: (o) => n.handleChange(o)
@@ -52,7 +55,7 @@ function V({ disabled: r, ...s }) {
   );
 }
 export {
-  M as IdSearchInput,
-  V as TfIdSearchInput
+  L as IdSearchInput,
+  G as TfIdSearchInput
 };
 //# sourceMappingURL=id-search.es.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"id-search.es.js","sources":["../../../lib/components/inputs/id-search.tsx"],"sourcesContent":["import { SearchField } from \"@/components/inputs/searchfield\";\nimport { Button, Popover, PopoverTrigger } from \"@/components/ui\";\nimport { Menu, MenuItem } from \"@/components/ui/menu\";\nimport { useFieldContext } from \"@/utils\";\nimport { useQuery } from \"@tanstack/react-query\";\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        console.error(Array.from(value.keys()).map(id => id.toString()))\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                    <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                </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","_a","Popover","Autocomplete","SearchField","Menu","s","item","MenuItem","TfIdSearchInput","props","field","useFieldContext","_","e"],"mappings":";;;;;;;;;AAoBO,SAASA,EAAsD,EAAE,OAAAC,GAAO,UAAAC,IAAW,IAAO,UAAAC,GAAU,UAAAC,GAAU,UAAAC,GAAU,QAAAC,GAAQ,UAAAC,IAAW,MAAM,UAAAC,EAAA,GAAiC;AACrL,QAAMC,IAAKC,EAAA,GACL,CAACC,GAAQC,CAAU,IAAIC,EAAS,EAAE,GAClC,EAAE,MAAAC,GAAM,SAAAC,GAAS,YAAAC,GAAY,OAAAC,EAAA,IAAUC,EAAS;AAAA,IAClD,UAAU,CAACT,GAAIE,CAAM;AAAA,IACrB,SAAS,MAAMR,EAASQ,CAAM;AAAA,EAAA,CACjC,GAEKQ,IAAaD,EAAS;AAAA,IACxB,UAAU,CAACT,GAAIR,CAAK;AAAA,IACpB,SAAS,MAAMO,EAAU,MAAM,KAAKP,EAAM,MAAM,EAAE,IAAI,CAAAQ,MAAMA,EAAG,SAAA,CAAU,CAAC;AAAA,IAC1E,SAASD,KAAYP,EAAM,OAAO;AAAA,EAAA,CACrC;AAOD,SAAO,gBAAAmB,EAAAC,GAAA,EACH,UAAA,gBAAAC,EAACC,GAAA,EAAe,cAAc,CAACC,MAAM;AACjC,IAAKA,KAEDlB,KAAA,QAAAA,EAASL;AAAA,EAEjB,GACI,UAAA;AAAA,IAAA,gBAAAmB,EAACK,KAAO,WAAW,aAAa,YAAYvB,GAAW,WAZrC,MAAM;;AAC5B,qBAAQ,MAAM,MAAM,KAAKD,EAAM,KAAA,CAAM,EAAE,IAAI,CAAAQ,MAAMA,EAAG,SAAA,CAAU,CAAC,IACxDiB,IAAAP,EAAW,SAAX,gBAAAO,EAAiB,KAAK;AAAA,IACjC,MASmF;AAAA,IAC3E,gBAAAN,EAACO,GAAA,EAAQ,WAAW,OAChB,UAAA,gBAAAL;AAAA,MAACM;AAAAA,MAAA;AAAA,QACG,YAAYjB;AAAA,QACZ,eAAeC;AAAA,QAEf,UAAA;AAAA,UAAA,gBAAAQ,EAACS,GAAA,EAAY,WAAW,WAAW,WAAS,IAAC;AAAA,UAC7C,gBAAAT,EAACU,GAAA,EAAK,cAAc7B,GAAO,eAAeG,IAAW,aAAa,UAAU,mBAAmB,CAAC2B,MAAM;AAClG,YAAI,OAAQA,KAAO,YACnB1B,EAAS0B,CAAC;AAAA,UACd,GAAG,WAAW,WAAW,OAAOjB,GAAM,kBAAkB,MAAM,qBACzD,UAAA,CAACkB,wBAAWC,GAAA,EAA0B,IAAID,EAAKzB,CAAQ,GAAI,YAAK,QAAtCyB,EAAK,EAAsC,EAAA,CAC1E;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA,EACJ,CACJ;AAAA,EAAA,EAAA,CACJ,EAAA,CACJ;AAEJ;AAEO,SAASE,EAAwD,EAAE,UAAAhC,GAAU,GAAGiC,KAA0D;AAC7I,QAAMC,IAAQC,EAAA;AACd,SACI,gBAAAjB;AAAA,IAACpB;AAAA,IAAA;AAAA,MACI,GAAGmC;AAAA,MACJ,UAAUjC,KAAYkC,EAAM,KAAK,MAAM;AAAA,MACvC,OAAOA,EAAM,MAAM;AAAA,MACnB,QAAQ,CAAAE,MAAKF,EAAM,WAAA;AAAA,MACnB,UAAU,CAACG,MAAMH,EAAM,aAAaG,CAAC;AAAA,IAAA;AAAA,EAAA;AAGjD;"}
+{"version":3,"file":"id-search.es.js","sources":["../../../lib/components/inputs/id-search.tsx"],"sourcesContent":["import { SearchField } from \"@/components/inputs/searchfield\";\nimport { Button, Loader, Popover, PopoverTrigger } from \"@/components/ui\";\nimport { Menu, MenuItem } from \"@/components/ui/menu\";\nimport { useFieldContext } from \"@/utils\";\nimport { useQuery } from \"@tanstack/react-query\";\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","_a","Popover","Autocomplete","SearchField","Loader","Menu","s","item","MenuItem","TfIdSearchInput","props","field","useFieldContext","_","e"],"mappings":";;;;;;;;;;AAoBO,SAASA,EAAsD,EAAE,OAAAC,GAAO,UAAAC,IAAW,IAAO,UAAAC,GAAU,UAAAC,GAAU,UAAAC,GAAU,QAAAC,GAAQ,UAAAC,IAAW,MAAM,UAAAC,EAAA,GAAiC;AACrL,QAAMC,IAAKC,EAAA,GACL,CAACC,GAAQC,CAAU,IAAIC,EAAS,EAAE,GAClC,EAAE,MAAAC,GAAM,SAAAC,GAAS,YAAAC,GAAY,OAAAC,EAAA,IAAUC,EAAS;AAAA,IAClD,UAAU,CAACT,GAAIE,CAAM;AAAA,IACrB,SAAS,MAAMR,EAASQ,CAAM;AAAA,EAAA,CACjC,GAEKQ,IAAaD,EAAS;AAAA,IACxB,UAAU,CAACT,GAAIR,CAAK;AAAA,IACpB,SAAS,MAAMO,EAAU,MAAM,KAAKP,EAAM,MAAM,EAAE,IAAI,CAAAQ,MAAMA,EAAG,SAAA,CAAU,CAAC;AAAA,IAC1E,SAASD,KAAYP,EAAM,OAAO;AAAA,EAAA,CACrC;AAMD,SAAO,gBAAAmB,EAAAC,GAAA,EACH,UAAA,gBAAAC,EAACC,GAAA,EAAe,cAAc,CAACC,MAAM;AACjC,IAAKA,KAEDlB,KAAA,QAAAA,EAASL;AAAA,EAEjB,GACI,UAAA;AAAA,IAAA,gBAAAmB,EAACK,KAAO,WAAW,aAAa,YAAYvB,GAAW,WAXrC,MAAM;;AAC5B,cAAOwB,IAAAP,EAAW,SAAX,gBAAAO,EAAiB,KAAK;AAAA,IACjC,MASmF;AAAA,IAC3E,gBAAAN,EAACO,GAAA,EAAQ,WAAW,OAChB,UAAA,gBAAAL;AAAA,MAACM;AAAA,MAAA;AAAA,QACG,YAAYjB;AAAA,QACZ,eAAeC;AAAA,QAEf,UAAA;AAAA,UAAA,gBAAAQ,EAACS,GAAA,EAAY,WAAW,WAAW,WAAS,IAAC;AAAA,UAC5Cb,KAAc,gBAAAI,EAACU,GAAA,EAAO,WAAU,UAAA,CAAU;AAAA,UAC1C,CAACd,KAAc,CAACD,uBAAYgB,GAAA,EAAK,cAAc9B,GAAO,eAAeG,IAAW,aAAa,UAAU,mBAAmB,CAAC4B,MAAM;AAC9H,YAAI,OAAQA,KAAO,YACnB3B,EAAS2B,CAAC;AAAA,UACd,GAAG,WAAW,WAAW,OAAOlB,GAAM,kBAAkB,MAAM,qBACzD,UAAA,CAACmB,wBAAWC,GAAA,EAA0B,IAAID,EAAK1B,CAAQ,GAAI,YAAK,QAAtC0B,EAAK,EAAsC,EAAA,CAC1E;AAAA,UAEIlB,KAAW,gBAAAK,EAAC,OAAA,EAAI,WAAU,2BAA2B,YAAM,QAAA,CAAQ;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA,EAE3E,CACJ;AAAA,EAAA,EAAA,CACJ,EAAA,CACJ;AAEJ;AAEO,SAASe,EAAwD,EAAE,UAAAjC,GAAU,GAAGkC,KAA0D;AAC7I,QAAMC,IAAQC,EAAA;AACd,SACI,gBAAAlB;AAAA,IAACpB;AAAA,IAAA;AAAA,MACI,GAAGoC;AAAA,MACJ,UAAUlC,KAAYmC,EAAM,KAAK,MAAM;AAAA,MACvC,OAAOA,EAAM,MAAM;AAAA,MACnB,QAAQ,CAAAE,MAAKF,EAAM,WAAA;AAAA,MACnB,UAAU,CAACG,MAAMH,EAAM,aAAaG,CAAC;AAAA,IAAA;AAAA,EAAA;AAGjD;"}

package/dist/components/inputs/input-otp.es.js

@@ -31,7 +31,7 @@ function P({
   className: r,
   ...i
 }) {
-  const o = d.use(p), { char: a, hasFakeCaret: s, isActive: c } = o.slots[e];
+  const o = d.use(p), { char: s, hasFakeCaret: a, isActive: c } = o.slots[e];
   return /* @__PURE__ */ u(
     "div",
     {
@@ -42,8 +42,8 @@ function P({
       ),
       ...i,
       children: [
-        a,
-        s && /* @__PURE__ */ t("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ t("div", { className: "h-icon w-px animate-caret-blink bg-foreground duration-1000" }) })
+        s,
+        a && /* @__PURE__ */ t("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ t("div", { className: "h-icon w-px animate-caret-blink bg-foreground duration-1000" }) })
       ]
     }
   );

package/dist/components/inputs/multi-select.es.js

@@ -1,54 +1,47 @@
-import { jsx as r } from "react/jsx-runtime";
-import { FormField as u } from "./field.es.js";
-import { EasyMenu as d, MenuItem as m } from "../ui/menu.es.js";
-import { useFieldContext as c } from "../../utils/form-context.es.js";
-import { getFieldErrorMessage as f } from "../../utils/form-hook.es.js";
-function M({
-  options: i,
-  value: l,
-  setValue: t,
-  label: n,
-  errorMessage: s,
-  description: o,
-  ...a
+import { jsx as l } from "react/jsx-runtime";
+import { FormField as a } from "./field.es.js";
+import { EasyMenu as u, MenuItem as c } from "../ui/menu.es.js";
+import { useFieldContext as f } from "../../utils/form-context.es.js";
+import { getFieldErrorMessage as p } from "../../utils/form-hook.es.js";
+function g({
+  items: o,
+  value: r,
+  onChange: n,
+  label: i,
+  errorMessage: t,
+  description: s,
+  ...d
 }) {
-  return /* @__PURE__ */ r("div", { className: "group form-field", children: /* @__PURE__ */ r(u, { label: n, description: o, errorMessage: s, children: /* @__PURE__ */ r(
-    d,
+  return /* @__PURE__ */ l("div", { className: "group form-field", children: /* @__PURE__ */ l(a, { label: i, description: s, errorMessage: t, children: /* @__PURE__ */ l(
+    u,
     {
       selectionMode: "multiple",
-      selectedKeys: l,
+      selectedKeys: r,
       onSelectionChange: (e) => {
-        typeof e != "string" && t(e);
+        typeof e != "string" && n(e);
       },
-      label: l.size,
-      ...a,
-      children: i.map((e) => /* @__PURE__ */ r(
-        m,
-        {
-          id: e.value,
-          isDisabled: e == null ? void 0 : e.disabled,
-          children: e.label
-        },
-        e.value
-      ))
+      items: o,
+      label: r.size,
+      ...d,
+      children: (e) => /* @__PURE__ */ l(c, { id: e.id, isDisabled: e == null ? void 0 : e.disabled, children: e.label }, e.id)
     }
   ) }) });
 }
-function v({ ...i }) {
-  const l = c();
-  return /* @__PURE__ */ r(
-    M,
+function F({ ...o }) {
+  const r = f();
+  return /* @__PURE__ */ l(
+    g,
     {
-      value: l.state.value,
-      setValue: l.setValue,
-      onClose: l.handleBlur,
-      errorMessage: f(l),
-      ...i
+      value: r.state.value,
+      onChange: r.setValue,
+      onClose: r.handleBlur,
+      errorMessage: p(r),
+      ...o
     }
   );
 }
 export {
-  M as MultiSelect,
-  v as TfMultiSelect
+  g as MultiSelect,
+  F as TfMultiSelect
 };
 //# sourceMappingURL=multi-select.es.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"multi-select.es.js","sources":["../../../lib/components/inputs/multi-select.tsx"],"sourcesContent":["import { FormField, type FormFieldProps } from \"@/components/inputs/field\";\nimport { EasyMenu, MenuItem } from \"@/components/ui/menu\";\nimport { getFieldErrorMessage } from \"@/utils\";\nimport { useFieldContext } from \"@/utils/form-context\";\nimport React from \"react\";\n\nexport interface SelectionProps<V extends number | string | Set<string | number>> {\n\tvalue: V;\n\tsetValue: (v: V) => void;\n\tbuttonLabel?: React.ReactNode;\n\toptions: {\n\t\tvalue: string;\n\t\tlabel: React.ReactElement;\n\t\tdisabled?: boolean;\n\t}[];\n}\n\nexport interface MultiSelectProps extends SelectionProps<Set<string | number>>, FormFieldProps, Omit<React.ComponentProps<typeof EasyMenu>, 'label'> { }\n\nexport function MultiSelect({\n\toptions,\n\tvalue,\n\tsetValue,\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\tlabel={value.size}\n\t\t\t\t\t{...props}>\n\t\t\t\t\t{options.map((opt) => (\n\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\tid={opt.value}\n\t\t\t\t\t\t\tkey={opt.value}\n\t\t\t\t\t\t\tisDisabled={opt?.disabled}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{opt.label}\n\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t))}\n\t\t\t\t</EasyMenu>\n\t\t\t</FormField>\n\t\t</div>\n\t);\n};\n\nexport interface TfMultiSelectProps\n\textends Omit<MultiSelectProps, \"value\" | \"setValue\"> { }\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\tsetValue={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","options","value","setValue","label","errorMessage","description","props","jsx","FormField","EasyMenu","v","opt","MenuItem","TfMultiSelect","field","useFieldContext","getFieldErrorMessage"],"mappings":";;;;;AAmBO,SAASA,EAAY;AAAA,EAC3B,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,aAAAC;AAAA,EACA,GAAGC;AACJ,GAAqB;AACpB,SACC,gBAAAC,EAAC,OAAA,EAAI,WAAU,oBACd,UAAA,gBAAAA,EAACC,GAAA,EAAgB,OAAAL,GAAO,aAAAE,GAAa,cAAAD,GACpC,UAAA,gBAAAG;AAAA,IAACE;AAAA,IAAA;AAAA,MACA,eAAc;AAAA,MACd,cAAcR;AAAA,MACd,mBAAmB,CAACS,MAAM;AACzB,QAAI,OAAQA,KAAO,YACnBR,EAASQ,CAAC;AAAA,MACX;AAAA,MACA,OAAOT,EAAM;AAAA,MACZ,GAAGK;AAAA,MACH,UAAAN,EAAQ,IAAI,CAACW,MACb,gBAAAJ;AAAA,QAACK;AAAA,QAAA;AAAA,UACA,IAAID,EAAI;AAAA,UAER,YAAYA,KAAA,gBAAAA,EAAK;AAAA,UAEhB,UAAAA,EAAI;AAAA,QAAA;AAAA,QAHAA,EAAI;AAAA,MAAA,CAKV;AAAA,IAAA;AAAA,EAAA,GAEH,EAAA,CACD;AAEF;AAIO,SAASE,EAAc,EAAE,GAAGP,KAA6B;AAC/D,QAAMQ,IAAQC,EAAA;AAEd,SACC,gBAAAR;AAAA,IAACR;AAAA,IAAA;AAAA,MACA,OAAOe,EAAM,MAAM;AAAA,MACnB,UAAUA,EAAM;AAAA,MAChB,SAASA,EAAM;AAAA,MACf,cAAcE,EAAqBF,CAAK;AAAA,MACvC,GAAGR;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"multi-select.es.js","sources":["../../../lib/components/inputs/multi-select.tsx"],"sourcesContent":["import { FormField, type FormFieldProps } from \"@/components/inputs/field\";\nimport type { SelectOption } from \"@/components/inputs/select-options\";\nimport { EasyMenu, MenuItem } from \"@/components/ui/menu\";\nimport { getFieldErrorMessage } from \"@/utils\";\nimport { useFieldContext } from \"@/utils/form-context\";\nimport React from \"react\";\n\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":";;;;;AAgBO,SAASA,EAAY;AAAA,EAC3B,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAUC;AAAA,EACV,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,aAAAC;AAAA,EACA,GAAGC;AACJ,GAAqB;AACpB,SACC,gBAAAC,EAAC,OAAA,EAAI,WAAU,oBACd,UAAA,gBAAAA,EAACC,GAAA,EAAgB,OAAAL,GAAO,aAAAE,GAAa,cAAAD,GACpC,UAAA,gBAAAG;AAAA,IAACE;AAAA,IAAA;AAAA,MACA,eAAc;AAAA,MACd,cAAcR;AAAA,MACd,mBAAmB,CAACS,MAAM;AACzB,QAAI,OAAQA,KAAO,YACnBR,EAASQ,CAAC;AAAA,MACX;AAAA,MACA,OAAAV;AAAA,MACA,OAAOC,EAAM;AAAA,MACZ,GAAGK;AAAA,MACH,UAAA,CAACK,MAAS,gBAAAJ,EAACK,GAAA,EAAS,IAAID,EAAK,IAAkB,YAAYA,KAAA,gBAAAA,EAAM,UAAW,UAAAA,EAAK,MAAA,GAA3CA,EAAK,EAA4C;AAAA,IAAA;AAAA,EAAA,GAE1F,EAAA,CACD;AAEF;AAMO,SAASE,EAAc,EAAE,GAAGP,KAA6B;AAC/D,QAAMQ,IAAQC,EAAA;AAEd,SACC,gBAAAR;AAAA,IAACR;AAAA,IAAA;AAAA,MACA,OAAOe,EAAM,MAAM;AAAA,MACnB,UAAUA,EAAM;AAAA,MAChB,SAASA,EAAM;AAAA,MACf,cAAcE,EAAqBF,CAAK;AAAA,MACvC,GAAGR;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/components/inputs/numberfield.es.js

@@ -1,103 +1,101 @@
-import { jsx as r, jsxs as l } from "react/jsx-runtime";
-import { composeRenderProps as n } from "../../node_modules/.pnpm/react-aria-components@1.11.0_react-dom@19.1.0_react@19.1.0/node_modules/react-aria-components/dist/utils.es.js";
-import { Input as u } from "../../node_modules/.pnpm/react-aria-components@1.11.0_react-dom@19.1.0_react@19.1.0/node_modules/react-aria-components/dist/Input.es.js";
-import { NumberField as f } from "../../node_modules/.pnpm/react-aria-components@1.11.0_react-dom@19.1.0_react@19.1.0/node_modules/react-aria-components/dist/NumberField.es.js";
-import { ChevronUp as p, ChevronDown as b } from "lucide-react";
-import { FormField as h, FieldGroup as N } from "./field.es.js";
+import { jsx as r, jsxs as s } from "react/jsx-runtime";
+import { NumberField as c, composeRenderProps as t, Input as f } from "react-aria-components";
+import { ChevronUp as p, ChevronDown as h } from "lucide-react";
+import { FormField as b, FieldGroup as N } from "./field.es.js";
 import { useFieldContext as g } from "../../utils/form-context.es.js";
-import { getFieldErrorMessage as d } from "../../utils/form-hook.es.js";
-import { cn as i } from "../../utils/primitives.es.js";
-import { Button as x } from "../ui/button.es.js";
-const F = f;
-function $({ className: o, ...t }) {
+import { getFieldErrorMessage as l } from "../../utils/form-hook.es.js";
+import { cn as n } from "../../utils/primitives.es.js";
+import { Button as F } from "../ui/button.es.js";
+const x = c;
+function v({ className: o, ...i }) {
   return /* @__PURE__ */ r(
-    u,
+    f,
     {
-      className: n(
+      className: t(
         o,
-        (e) => i(
+        (e) => 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",
           e
         )
       ),
-      ...t
+      ...i
     }
   );
 }
-function v({
+function w({
   className: o,
-  ...t
+  ...i
 }) {
-  return /* @__PURE__ */ l(
+  return /* @__PURE__ */ s(
     "div",
     {
-      className: i(
+      className: n(
         "absolute right-0 flex h-full flex-col border-l",
         o
       ),
-      ...t,
+      ...i,
       children: [
-        /* @__PURE__ */ r(a, { slot: "increment", children: /* @__PURE__ */ r(p, { "aria-hidden": !0, className: "size-icon" }) }),
+        /* @__PURE__ */ r(d, { slot: "increment", children: /* @__PURE__ */ r(p, { "aria-hidden": !0, className: "size-icon" }) }),
         /* @__PURE__ */ r("div", { className: "border-b" }),
-        /* @__PURE__ */ r(a, { slot: "decrement", children: /* @__PURE__ */ r(b, { "aria-hidden": !0, className: "size-icon" }) })
+        /* @__PURE__ */ r(d, { slot: "decrement", children: /* @__PURE__ */ r(h, { "aria-hidden": !0, className: "size-icon" }) })
       ]
     }
   );
 }
-function a({ className: o, ...t }) {
+function d({ className: o, ...i }) {
   return /* @__PURE__ */ r(
-    x,
+    F,
     {
-      className: n(
+      className: t(
         o,
-        (e) => i("w-auto grow h-3 px-0.5 text-muted-foreground", e)
+        (e) => n("w-auto grow h-3 px-0.5 text-muted-foreground", e)
       ),
       variant: "ghost",
       size: "none",
-      ...t
+      ...i
     }
   );
 }
-function w({
+function C({
   label: o,
-  description: t,
+  description: i,
   errorMessage: e,
-  className: m,
-  ...s
+  className: a,
+  ...m
 }) {
   return /* @__PURE__ */ r(
-    F,
+    x,
     {
-      className: n(
-        m,
-        (c) => i("group form-field", c)
+      className: t(
+        a,
+        (u) => n("group form-field", u)
       ),
-      ...s,
-      children: /* @__PURE__ */ r(h, { label: o, description: t, errorMessage: e, children: /* @__PURE__ */ l(N, { children: [
-        /* @__PURE__ */ r($, {}),
-        /* @__PURE__ */ r(v, {})
+      ...m,
+      children: /* @__PURE__ */ r(b, { label: o, description: i, errorMessage: e, children: /* @__PURE__ */ s(N, { children: [
+        /* @__PURE__ */ r(v, {}),
+        /* @__PURE__ */ r(w, {})
       ] }) })
     }
   );
 }
-function E({ isDisabled: o, ...t }) {
+function A({ isDisabled: o, ...i }) {
   const e = g();
   return /* @__PURE__ */ r(
-    w,
+    C,
     {
-      isInvalid: !!d(e),
+      isInvalid: !!l(e),
       isDisabled: o || e.form.state.isSubmitting,
       value: e.state.value,
       id: e.name,
       onChange: e.handleChange,
       onBlur: e.handleBlur,
-      errorMessage: d(e),
-      ...t
+      errorMessage: l(e),
+      ...i
     }
   );
 }
 export {
-  w as NumberField,
-  E as TfNumberField
+  C as NumberField,
+  A as TfNumberField
 };
 //# sourceMappingURL=numberfield.es.js.map

package/dist/components/inputs/numberfield.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"numberfield.es.js","sources":["../../../lib/components/inputs/numberfield.tsx"],"sourcesContent":["import {\n  ButtonProps as AriaButtonProps,\n  Input as AriaInput,\n  InputProps as AriaInputProps,\n  NumberField as AriaNumberField,\n  NumberFieldProps as AriaNumberFieldProps,\n  composeRenderProps\n} from \"react-aria-components\"\n\nimport { Button } from \"@/components/ui\"\nimport { cn, getFieldErrorMessage, useFieldContext } from \"@/utils/index\"\nimport { ChevronDown, ChevronUp } from \"lucide-react\"\nimport type React from \"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        cn(\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={cn(\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        cn(\"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        cn(\"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","cn","NumberFieldSteppers","jsxs","NumberFieldStepper","ChevronUp","ChevronDown","Button","NumberField","label","description","errorMessage","FormField","FieldGroup","TfNumberField","isDisabled","field","useFieldContext","getFieldErrorMessage"],"mappings":";;;;;;;;;;AAeA,MAAMA,IAAeC;AAErB,SAASC,EAAiB,EAAE,WAAAC,GAAW,GAAGC,KAAyB;AACjE,SACE,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,WAAWC;AAAAA,QAAmBJ;AAAA,QAAW,CAACA,MACxCK;AAAA,UACE;AAAA,UACAL;AAAAA,QAAA;AAAA,MACF;AAAA,MAED,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASK,EAAoB;AAAA,EAC3B,WAAAN;AAAA,EACA,GAAGC;AACL,GAAgC;AAC9B,SACE,gBAAAM;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWF;AAAA,QACT;AAAA,QACAL;AAAA,MAAA;AAAA,MAED,GAAGC;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAC,EAACM,GAAA,EAAmB,MAAK,aACvB,UAAA,gBAAAN,EAACO,KAAU,eAAW,IAAC,WAAU,YAAA,CAAY,EAAA,CAC/C;AAAA,QACA,gBAAAP,EAAC,OAAA,EAAI,WAAU,WAAA,CAAW;AAAA,QAC1B,gBAAAA,EAACM,GAAA,EAAmB,MAAK,aACvB,UAAA,gBAAAN,EAACQ,KAAY,eAAW,IAAC,WAAU,YAAA,CAAY,EAAA,CACjD;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;AAEA,SAASF,EAAmB,EAAE,WAAAR,GAAW,GAAGC,KAA0B;AACpE,SACE,gBAAAC;AAAA,IAACS;AAAA,IAAA;AAAA,MACC,WAAWP;AAAAA,QAAmBJ;AAAA,QAAW,CAACA,MACxCK,EAAG,gDAAgDL,CAAS;AAAA,MAAA;AAAA,MAE9D,SAAS;AAAA,MACT,MAAM;AAAA,MACL,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGV;AAGO,SAASW,EAAY;AAAA,EAC1B,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,cAAAC;AAAA,EACA,WAAAf;AAAA,EACA,GAAGC;AACL,GAAqB;AACnB,SACE,gBAAAC;AAAA,IAACL;AAAA,IAAA;AAAA,MACC,WAAWO;AAAAA,QAAmBJ;AAAA,QAAW,CAACA,MACxCK,EAAG,oBAAoBL,CAAS;AAAA,MAAA;AAAA,MAEjC,GAAGC;AAAA,MAEJ,4BAACe,GAAA,EAAU,OAAAH,GAAc,aAAAC,GAA0B,cAAAC,GACjD,4BAACE,GAAA,EACC,UAAA;AAAA,QAAA,gBAAAf,EAACH,GAAA,EAAiB;AAAA,0BACjBO,GAAA,CAAA,CAAoB;AAAA,MAAA,EAAA,CACvB,EAAA,CACF;AAAA,IAAA;AAAA,EAAA;AAGN;AAEO,SAASY,EAAc,EAAE,YAAAC,GAAY,GAAGlB,KAAiG;AAC9I,QAAMmB,IAAQC,EAAA;AAEd,SACE,gBAAAnB;AAAA,IAACU;AAAA,IAAA;AAAA,MACC,WAAW,CAAC,CAACU,EAAqBF,CAAK;AAAA,MACvC,YAAYD,KAAcC,EAAM,KAAK,MAAM;AAAA,MAC3C,OAAOA,EAAM,MAAM;AAAA,MACnB,IAAIA,EAAM;AAAA,MACV,UAAUA,EAAM;AAAA,MAChB,QAAQA,EAAM;AAAA,MACd,cAAcE,EAAqBF,CAAK;AAAA,MACvC,GAAGnB;AAAA,IAAA;AAAA,EAAA;AAEV;"}
+{"version":3,"file":"numberfield.es.js","sources":["../../../lib/components/inputs/numberfield.tsx"],"sourcesContent":["import {\n  ButtonProps as AriaButtonProps,\n  Input as AriaInput,\n  InputProps as AriaInputProps,\n  NumberField as AriaNumberField,\n  NumberFieldProps as AriaNumberFieldProps,\n  composeRenderProps\n} from \"react-aria-components\"\n\nimport { Button } from \"@/components/ui\"\nimport { cn, getFieldErrorMessage, useFieldContext } from \"@/utils/index\"\nimport { ChevronDown, ChevronUp } from \"lucide-react\"\nimport type React from \"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        cn(\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={cn(\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        cn(\"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        cn(\"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","cn","NumberFieldSteppers","jsxs","NumberFieldStepper","ChevronUp","ChevronDown","Button","NumberField","label","description","errorMessage","FormField","FieldGroup","TfNumberField","isDisabled","field","useFieldContext","getFieldErrorMessage"],"mappings":";;;;;;;;AAeA,MAAMA,IAAeC;AAErB,SAASC,EAAiB,EAAE,WAAAC,GAAW,GAAGC,KAAyB;AACjE,SACE,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QAAmBJ;AAAA,QAAW,CAACA,MACxCK;AAAA,UACE;AAAA,UACAL;AAAAA,QAAA;AAAA,MACF;AAAA,MAED,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASK,EAAoB;AAAA,EAC3B,WAAAN;AAAA,EACA,GAAGC;AACL,GAAgC;AAC9B,SACE,gBAAAM;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWF;AAAA,QACT;AAAA,QACAL;AAAA,MAAA;AAAA,MAED,GAAGC;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAC,EAACM,GAAA,EAAmB,MAAK,aACvB,UAAA,gBAAAN,EAACO,KAAU,eAAW,IAAC,WAAU,YAAA,CAAY,EAAA,CAC/C;AAAA,QACA,gBAAAP,EAAC,OAAA,EAAI,WAAU,WAAA,CAAW;AAAA,QAC1B,gBAAAA,EAACM,GAAA,EAAmB,MAAK,aACvB,UAAA,gBAAAN,EAACQ,KAAY,eAAW,IAAC,WAAU,YAAA,CAAY,EAAA,CACjD;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;AAEA,SAASF,EAAmB,EAAE,WAAAR,GAAW,GAAGC,KAA0B;AACpE,SACE,gBAAAC;AAAA,IAACS;AAAA,IAAA;AAAA,MACC,WAAWP;AAAA,QAAmBJ;AAAA,QAAW,CAACA,MACxCK,EAAG,gDAAgDL,CAAS;AAAA,MAAA;AAAA,MAE9D,SAAS;AAAA,MACT,MAAM;AAAA,MACL,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGV;AAGO,SAASW,EAAY;AAAA,EAC1B,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,cAAAC;AAAA,EACA,WAAAf;AAAA,EACA,GAAGC;AACL,GAAqB;AACnB,SACE,gBAAAC;AAAA,IAACL;AAAA,IAAA;AAAA,MACC,WAAWO;AAAA,QAAmBJ;AAAA,QAAW,CAACA,MACxCK,EAAG,oBAAoBL,CAAS;AAAA,MAAA;AAAA,MAEjC,GAAGC;AAAA,MAEJ,4BAACe,GAAA,EAAU,OAAAH,GAAc,aAAAC,GAA0B,cAAAC,GACjD,4BAACE,GAAA,EACC,UAAA;AAAA,QAAA,gBAAAf,EAACH,GAAA,EAAiB;AAAA,0BACjBO,GAAA,CAAA,CAAoB;AAAA,MAAA,EAAA,CACvB,EAAA,CACF;AAAA,IAAA;AAAA,EAAA;AAGN;AAEO,SAASY,EAAc,EAAE,YAAAC,GAAY,GAAGlB,KAAiG;AAC9I,QAAMmB,IAAQC,EAAA;AAEd,SACE,gBAAAnB;AAAA,IAACU;AAAA,IAAA;AAAA,MACC,WAAW,CAAC,CAACU,EAAqBF,CAAK;AAAA,MACvC,YAAYD,KAAcC,EAAM,KAAK,MAAM;AAAA,MAC3C,OAAOA,EAAM,MAAM;AAAA,MACnB,IAAIA,EAAM;AAAA,MACV,UAAUA,EAAM;AAAA,MAChB,QAAQA,EAAM;AAAA,MACd,cAAcE,EAAqBF,CAAK;AAAA,MACvC,GAAGnB;AAAA,IAAA;AAAA,EAAA;AAEV;"}

package/dist/components/inputs/searchfield.es.js

@@ -1,45 +1,42 @@
-import { jsx as e, jsxs as s } from "react/jsx-runtime";
-import { SearchIcon as f, XIcon as m } from "lucide-react";
-import { Button as p } from "../../node_modules/.pnpm/react-aria-components@1.11.0_react-dom@19.1.0_react@19.1.0/node_modules/react-aria-components/dist/Button.es.js";
-import { composeRenderProps as t } from "../../node_modules/.pnpm/react-aria-components@1.11.0_react-dom@19.1.0_react@19.1.0/node_modules/react-aria-components/dist/utils.es.js";
-import { Input as l } from "../../node_modules/.pnpm/react-aria-components@1.11.0_react-dom@19.1.0_react@19.1.0/node_modules/react-aria-components/dist/Input.es.js";
-import { SearchField as u } from "../../node_modules/.pnpm/react-aria-components@1.11.0_react-dom@19.1.0_react@19.1.0/node_modules/react-aria-components/dist/SearchField.es.js";
-import { FormField as b, FieldGroup as h } from "./field.es.js";
+import { jsx as e, jsxs as l } from "react/jsx-runtime";
+import { SearchIcon as s, XIcon as u } from "lucide-react";
+import { composeRenderProps as n, SearchField as m, Input as p, Button as h } from "react-aria-components";
+import { FormField as f, FieldGroup as g } from "./field.es.js";
 import { cn as a } from "../../utils/primitives.es.js";
-function $({ className: r, ...o }) {
+function F({ className: r, ...i }) {
   return /* @__PURE__ */ e(
-    u,
+    m,
     {
-      className: t(
+      className: n(
         r,
-        (i) => a("group", i)
+        (o) => a("group", o)
       ),
-      ...o
+      ...i
     }
   );
 }
-function x({ className: r, ...o }) {
+function b({ className: r, ...i }) {
   return /* @__PURE__ */ e(
-    l,
+    p,
     {
-      className: t(
+      className: n(
         r,
-        (i) => a(
+        (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",
-          i
+          o
         )
       ),
-      ...o
+      ...i
     }
   );
 }
-function g({ className: r, ...o }) {
+function x({ className: r, ...i }) {
   return /* @__PURE__ */ e(
-    p,
+    h,
     {
-      className: t(
+      className: n(
         r,
-        (i) => a(
+        (o) => a(
           "mr-1 opacity-70 ring-offset-background transition-opacity",
           /* Hover */
           "data-[hovered]:opacity-100",
@@ -47,37 +44,37 @@ function g({ className: r, ...o }) {
           "data-[disabled]:pointer-events-none",
           /* Empty */
           "group-data-[empty]:invisible",
-          i
+          o
         )
       ),
-      ...o
+      ...i
     }
   );
 }
-function w({
+function j({
   label: r,
-  description: o,
-  className: i,
-  errorMessage: c,
-  ...n
+  description: i,
+  className: o,
+  errorMessage: t,
+  ...c
 }) {
   return /* @__PURE__ */ e(
-    $,
+    F,
     {
-      className: t(
-        i,
+      className: n(
+        o,
         (d) => a("group form-field", d)
       ),
-      ...n,
-      children: /* @__PURE__ */ e(b, { label: r, description: o, errorMessage: c, children: /* @__PURE__ */ s(h, { children: [
-        /* @__PURE__ */ e(f, { "aria-hidden": !0, className: "size-icon text-muted-foreground" }),
-        /* @__PURE__ */ e(x, { placeholder: "" }),
-        /* @__PURE__ */ e(g, { children: /* @__PURE__ */ e(m, { "aria-hidden": !0, className: "size-icon" }) })
+      ...c,
+      children: /* @__PURE__ */ e(f, { label: r, description: i, errorMessage: t, children: /* @__PURE__ */ l(g, { children: [
+        /* @__PURE__ */ e(s, { "aria-hidden": !0, className: "size-icon text-muted-foreground" }),
+        /* @__PURE__ */ e(b, { placeholder: "" }),
+        /* @__PURE__ */ e(x, { children: /* @__PURE__ */ e(u, { "aria-hidden": !0, className: "size-icon" }) })
       ] }) })
     }
   );
 }
 export {
-  w as SearchField
+  j as SearchField
 };
 //# sourceMappingURL=searchfield.es.js.map

package/dist/components/inputs/searchfield.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"searchfield.es.js","sources":["../../../lib/components/inputs/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 { cn } from \"@/utils/index\"\n\nimport { FieldGroup, FormField, type FormFieldProps } from \"./field\"\n\nfunction ASearchField({ className, ...props }: AriaSearchFieldProps) {\n  return (\n    <AriaSearchField\n      className={composeRenderProps(className, (className) =>\n        cn(\"group\", className)\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction ASearchFieldInput({ className, ...props }: AriaInputProps) {\n  return (\n    <AriaInput\n      className={composeRenderProps(className, (className) =>\n        cn(\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        cn(\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        cn(\"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","cn","ASearchFieldInput","AriaInput","SearchFieldClear","AriaButton","SearchField","label","description","errorMessage","FormField","FieldGroup","SearchIcon","XIcon"],"mappings":";;;;;;;;AAeA,SAASA,EAAa,EAAE,WAAAC,GAAW,GAAGC,KAA+B;AACnE,SACE,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,WAAWC;AAAAA,QAAmBJ;AAAA,QAAW,CAACA,MACxCK,EAAG,SAASL,CAAS;AAAA,MAAA;AAAA,MAEtB,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASK,EAAkB,EAAE,WAAAN,GAAW,GAAGC,KAAyB;AAClE,SACE,gBAAAC;AAAA,IAACK;AAAAA,IAAA;AAAA,MACC,WAAWH;AAAAA,QAAmBJ;AAAA,QAAW,CAACA,MACxCK;AAAA,UACE;AAAA,UACAL;AAAAA,QAAA;AAAA,MACF;AAAA,MAED,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASO,EAAiB,EAAE,WAAAR,GAAW,GAAGC,KAA0B;AAClE,SACE,gBAAAC;AAAA,IAACO;AAAAA,IAAA;AAAA,MACC,WAAWL;AAAAA,QAAmBJ;AAAA,QAAW,CAACA,MACxCK;AAAA,UACE;AAAA;AAAA,UAEA;AAAA;AAAA,UAEA;AAAA;AAAA,UAEA;AAAA,UACAL;AAAAA,QAAA;AAAA,MACF;AAAA,MAED,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGV;AAGO,SAASS,EAAY;AAAA,EAC1B,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,WAAAZ;AAAA,EACA,cAAAa;AAAA,EACA,GAAGZ;AACL,GAAqB;AACnB,SACE,gBAAAC;AAAA,IAACH;AAAA,IAAA;AAAA,MACC,WAAWK;AAAAA,QAAmBJ;AAAA,QAAW,CAACA,MACxCK,EAAG,oBAAoBL,CAAS;AAAA,MAAA;AAAA,MAEjC,GAAGC;AAAA,MAEJ,4BAACa,GAAA,EAAU,OAAAH,GAAc,aAAAC,GAA0B,cAAAC,GACjD,4BAACE,GAAA,EACC,UAAA;AAAA,QAAA,gBAAAb,EAACc,GAAA,EAAW,eAAW,IAAC,WAAU,mCAAkC;AAAA,QACpE,gBAAAd,EAACI,GAAA,EAAkB,aAAY,GAAA,CAAG;AAAA,QAClC,gBAAAJ,EAACM,KACC,UAAA,gBAAAN,EAACe,GAAA,EAAM,eAAW,IAAC,WAAU,aAAY,EAAA,CAC3C;AAAA,MAAA,EAAA,CACF,EAAA,CACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"searchfield.es.js","sources":["../../../lib/components/inputs/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 { cn } from \"@/utils/index\"\n\nimport { FieldGroup, FormField, type FormFieldProps } from \"./field\"\n\nfunction ASearchField({ className, ...props }: AriaSearchFieldProps) {\n  return (\n    <AriaSearchField\n      className={composeRenderProps(className, (className) =>\n        cn(\"group\", className)\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction ASearchFieldInput({ className, ...props }: AriaInputProps) {\n  return (\n    <AriaInput\n      className={composeRenderProps(className, (className) =>\n        cn(\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        cn(\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        cn(\"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","cn","ASearchFieldInput","AriaInput","SearchFieldClear","AriaButton","SearchField","label","description","errorMessage","FormField","FieldGroup","SearchIcon","XIcon"],"mappings":";;;;;AAeA,SAASA,EAAa,EAAE,WAAAC,GAAW,GAAGC,KAA+B;AACnE,SACE,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QAAmBJ;AAAA,QAAW,CAACA,MACxCK,EAAG,SAASL,CAAS;AAAA,MAAA;AAAA,MAEtB,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASK,EAAkB,EAAE,WAAAN,GAAW,GAAGC,KAAyB;AAClE,SACE,gBAAAC;AAAA,IAACK;AAAAA,IAAA;AAAA,MACC,WAAWH;AAAA,QAAmBJ;AAAA,QAAW,CAACA,MACxCK;AAAA,UACE;AAAA,UACAL;AAAAA,QAAA;AAAA,MACF;AAAA,MAED,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASO,EAAiB,EAAE,WAAAR,GAAW,GAAGC,KAA0B;AAClE,SACE,gBAAAC;AAAA,IAACO;AAAAA,IAAA;AAAA,MACC,WAAWL;AAAA,QAAmBJ;AAAA,QAAW,CAACA,MACxCK;AAAA,UACE;AAAA;AAAA,UAEA;AAAA;AAAA,UAEA;AAAA;AAAA,UAEA;AAAA,UACAL;AAAAA,QAAA;AAAA,MACF;AAAA,MAED,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGV;AAGO,SAASS,EAAY;AAAA,EAC1B,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,WAAAZ;AAAA,EACA,cAAAa;AAAA,EACA,GAAGZ;AACL,GAAqB;AACnB,SACE,gBAAAC;AAAA,IAACH;AAAA,IAAA;AAAA,MACC,WAAWK;AAAA,QAAmBJ;AAAA,QAAW,CAACA,MACxCK,EAAG,oBAAoBL,CAAS;AAAA,MAAA;AAAA,MAEjC,GAAGC;AAAA,MAEJ,4BAACa,GAAA,EAAU,OAAAH,GAAc,aAAAC,GAA0B,cAAAC,GACjD,4BAACE,GAAA,EACC,UAAA;AAAA,QAAA,gBAAAb,EAACc,GAAA,EAAW,eAAW,IAAC,WAAU,mCAAkC;AAAA,QACpE,gBAAAd,EAACI,GAAA,EAAkB,aAAY,GAAA,CAAG;AAAA,QAClC,gBAAAJ,EAACM,KACC,UAAA,gBAAAN,EAACe,GAAA,EAAM,eAAW,IAAC,WAAU,aAAY,EAAA,CAC3C;AAAA,MAAA,EAAA,CACF,EAAA,CACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}