@mastra/playground-ui 60.1.0 → 60.2.0-alpha.1

package/dist/lib/form/components/number-field.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"number-field.cjs.js","sources":["../../../../src/lib/form/components/number-field.tsx"],"sourcesContent":["import type { AutoFormFieldProps } from '@autoform/react';\nimport React from 'react';\nimport { Input } from '@/ds/components/Input';\n\nexport const NumberField: React.FC<AutoFormFieldProps> = ({ inputProps, error, field, id }) => {\n  const { key, ...props } = inputProps;\n\n  return (\n    <Input\n      id={id}\n      type=\"number\"\n      className={error ? 'border-destructive-indicator' : ''}\n      {...props}\n      defaultValue={field.default !== undefined ? Number(field.default) : undefined}\n      onChange={e => {\n        const value = e.target.value;\n        if (value !== '' && !isNaN(Number(value))) {\n          props.onChange({\n            target: { value: value, name: inputProps.name },\n          });\n        }\n      }}\n      onBlur={e => {\n        const value = e.target.value;\n        if (value !== '' && !isNaN(Number(value))) {\n          props.onChange({\n            target: { value: Number(value), name: inputProps.name },\n          });\n        }\n      }}\n    />\n  );\n};\n"],"names":["jsx","Input"],"mappings":";;;;;;;AAIO,MAAM,cAA4C,CAAC,EAAE,YAAY,KAAA,EAAO,KAAA,EAAO,IAAG,KAAM;AAC7F,EAAA,MAAM,EAAE,GAAA,EAAK,GAAG,KAAA,EAAM,GAAI,UAAA;AAE1B,EAAA,uBACEA,cAAA;AAAA,IAACC,WAAA;AAAA,IAAA;AAAA,MACC,EAAA;AAAA,MACA,IAAA,EAAK,QAAA;AAAA,MACL,SAAA,EAAW,QAAQ,8BAAA,GAAiC,EAAA;AAAA,MACnD,GAAG,KAAA;AAAA,MACJ,cAAc,KAAA,CAAM,OAAA,KAAY,SAAY,MAAA,CAAO,KAAA,CAAM,OAAO,CAAA,GAAI,MAAA;AAAA,MACpE,UAAU,CAAA,CAAA,KAAK;AACb,QAAA,MAAM,KAAA,GAAQ,EAAE,MAAA,CAAO,KAAA;AACvB,QAAA,IAAI,UAAU,EAAA,IAAM,CAAC,MAAM,MAAA,CAAO,KAAK,CAAC,CAAA,EAAG;AACzC,UAAA,KAAA,CAAM,QAAA,CAAS;AAAA,YACb,MAAA,EAAQ,EAAE,KAAA,EAAc,IAAA,EAAM,WAAW,IAAA;AAAK,WAC/C,CAAA;AAAA,QACH;AAAA,MACF,CAAA;AAAA,MACA,QAAQ,CAAA,CAAA,KAAK;AACX,QAAA,MAAM,KAAA,GAAQ,EAAE,MAAA,CAAO,KAAA;AACvB,QAAA,IAAI,UAAU,EAAA,IAAM,CAAC,MAAM,MAAA,CAAO,KAAK,CAAC,CAAA,EAAG;AACzC,UAAA,KAAA,CAAM,QAAA,CAAS;AAAA,YACb,MAAA,EAAQ,EAAE,KAAA,EAAO,MAAA,CAAO,KAAK,CAAA,EAAG,IAAA,EAAM,WAAW,IAAA;AAAK,WACvD,CAAA;AAAA,QACH;AAAA,MACF;AAAA;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"number-field.cjs.js","sources":["../../../../src/lib/form/components/number-field.tsx"],"sourcesContent":["import type { AutoFormFieldProps } from '@autoform/react';\nimport React from 'react';\nimport { Input } from '@/ds/components/Input';\n\nexport const NumberField: React.FC<AutoFormFieldProps> = ({ inputProps, field }) => {\n  const { key, ...props } = inputProps;\n\n  return (\n    <Input\n      type=\"number\"\n      step=\"any\"\n      {...props}\n      defaultValue={field.default !== undefined ? Number(field.default) : undefined}\n      onChange={e => {\n        const value = e.target.value;\n        if (value !== '' && !isNaN(Number(value))) {\n          props.onChange({\n            target: { value: value, name: inputProps.name },\n          });\n        }\n      }}\n      onBlur={e => {\n        const value = e.target.value;\n        if (value !== '' && !isNaN(Number(value))) {\n          props.onChange({\n            target: { value: Number(value), name: inputProps.name },\n          });\n        }\n      }}\n    />\n  );\n};\n"],"names":["jsx","Input"],"mappings":";;;;;;;AAIO,MAAM,WAAA,GAA4C,CAAC,EAAE,UAAA,EAAY,OAAM,KAAM;AAClF,EAAA,MAAM,EAAE,GAAA,EAAK,GAAG,KAAA,EAAM,GAAI,UAAA;AAE1B,EAAA,uBACEA,cAAA;AAAA,IAACC,WAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,QAAA;AAAA,MACL,IAAA,EAAK,KAAA;AAAA,MACJ,GAAG,KAAA;AAAA,MACJ,cAAc,KAAA,CAAM,OAAA,KAAY,SAAY,MAAA,CAAO,KAAA,CAAM,OAAO,CAAA,GAAI,MAAA;AAAA,MACpE,UAAU,CAAA,CAAA,KAAK;AACb,QAAA,MAAM,KAAA,GAAQ,EAAE,MAAA,CAAO,KAAA;AACvB,QAAA,IAAI,UAAU,EAAA,IAAM,CAAC,MAAM,MAAA,CAAO,KAAK,CAAC,CAAA,EAAG;AACzC,UAAA,KAAA,CAAM,QAAA,CAAS;AAAA,YACb,MAAA,EAAQ,EAAE,KAAA,EAAc,IAAA,EAAM,WAAW,IAAA;AAAK,WAC/C,CAAA;AAAA,QACH;AAAA,MACF,CAAA;AAAA,MACA,QAAQ,CAAA,CAAA,KAAK;AACX,QAAA,MAAM,KAAA,GAAQ,EAAE,MAAA,CAAO,KAAA;AACvB,QAAA,IAAI,UAAU,EAAA,IAAM,CAAC,MAAM,MAAA,CAAO,KAAK,CAAC,CAAA,EAAG;AACzC,UAAA,KAAA,CAAM,QAAA,CAAS;AAAA,YACb,MAAA,EAAQ,EAAE,KAAA,EAAO,MAAA,CAAO,KAAK,CAAA,EAAG,IAAA,EAAM,WAAW,IAAA;AAAK,WACvD,CAAA;AAAA,QACH;AAAA,MACF;AAAA;AAAA,GACF;AAEJ;;;;"}

package/dist/lib/form/components/number-field.es.js

@@ -1,14 +1,13 @@
 import { jsx } from 'react/jsx-runtime';
-import { I as Input } from '../../../input-CHghVv3k.js';
+import { I as Input } from '../../../input-D5_B67_r.js';
 
-const NumberField = ({ inputProps, error, field, id }) => {
+const NumberField = ({ inputProps, field }) => {
   const { key, ...props } = inputProps;
   return /* @__PURE__ */ jsx(
     Input,
     {
-      id,
       type: "number",
-      className: error ? "border-destructive-indicator" : "",
+      step: "any",
       ...props,
       defaultValue: field.default !== void 0 ? Number(field.default) : void 0,
       onChange: (e) => {

package/dist/lib/form/components/number-field.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"number-field.es.js","sources":["../../../../src/lib/form/components/number-field.tsx"],"sourcesContent":["import type { AutoFormFieldProps } from '@autoform/react';\nimport React from 'react';\nimport { Input } from '@/ds/components/Input';\n\nexport const NumberField: React.FC<AutoFormFieldProps> = ({ inputProps, error, field, id }) => {\n  const { key, ...props } = inputProps;\n\n  return (\n    <Input\n      id={id}\n      type=\"number\"\n      className={error ? 'border-destructive-indicator' : ''}\n      {...props}\n      defaultValue={field.default !== undefined ? Number(field.default) : undefined}\n      onChange={e => {\n        const value = e.target.value;\n        if (value !== '' && !isNaN(Number(value))) {\n          props.onChange({\n            target: { value: value, name: inputProps.name },\n          });\n        }\n      }}\n      onBlur={e => {\n        const value = e.target.value;\n        if (value !== '' && !isNaN(Number(value))) {\n          props.onChange({\n            target: { value: Number(value), name: inputProps.name },\n          });\n        }\n      }}\n    />\n  );\n};\n"],"names":[],"mappings":";;;AAIO,MAAM,cAA4C,CAAC,EAAE,YAAY,KAAA,EAAO,KAAA,EAAO,IAAG,KAAM;AAC7F,EAAA,MAAM,EAAE,GAAA,EAAK,GAAG,KAAA,EAAM,GAAI,UAAA;AAE1B,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,EAAA;AAAA,MACA,IAAA,EAAK,QAAA;AAAA,MACL,SAAA,EAAW,QAAQ,8BAAA,GAAiC,EAAA;AAAA,MACnD,GAAG,KAAA;AAAA,MACJ,cAAc,KAAA,CAAM,OAAA,KAAY,SAAY,MAAA,CAAO,KAAA,CAAM,OAAO,CAAA,GAAI,MAAA;AAAA,MACpE,UAAU,CAAA,CAAA,KAAK;AACb,QAAA,MAAM,KAAA,GAAQ,EAAE,MAAA,CAAO,KAAA;AACvB,QAAA,IAAI,UAAU,EAAA,IAAM,CAAC,MAAM,MAAA,CAAO,KAAK,CAAC,CAAA,EAAG;AACzC,UAAA,KAAA,CAAM,QAAA,CAAS;AAAA,YACb,MAAA,EAAQ,EAAE,KAAA,EAAc,IAAA,EAAM,WAAW,IAAA;AAAK,WAC/C,CAAA;AAAA,QACH;AAAA,MACF,CAAA;AAAA,MACA,QAAQ,CAAA,CAAA,KAAK;AACX,QAAA,MAAM,KAAA,GAAQ,EAAE,MAAA,CAAO,KAAA;AACvB,QAAA,IAAI,UAAU,EAAA,IAAM,CAAC,MAAM,MAAA,CAAO,KAAK,CAAC,CAAA,EAAG;AACzC,UAAA,KAAA,CAAM,QAAA,CAAS;AAAA,YACb,MAAA,EAAQ,EAAE,KAAA,EAAO,MAAA,CAAO,KAAK,CAAA,EAAG,IAAA,EAAM,WAAW,IAAA;AAAK,WACvD,CAAA;AAAA,QACH;AAAA,MACF;AAAA;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"number-field.es.js","sources":["../../../../src/lib/form/components/number-field.tsx"],"sourcesContent":["import type { AutoFormFieldProps } from '@autoform/react';\nimport React from 'react';\nimport { Input } from '@/ds/components/Input';\n\nexport const NumberField: React.FC<AutoFormFieldProps> = ({ inputProps, field }) => {\n  const { key, ...props } = inputProps;\n\n  return (\n    <Input\n      type=\"number\"\n      step=\"any\"\n      {...props}\n      defaultValue={field.default !== undefined ? Number(field.default) : undefined}\n      onChange={e => {\n        const value = e.target.value;\n        if (value !== '' && !isNaN(Number(value))) {\n          props.onChange({\n            target: { value: value, name: inputProps.name },\n          });\n        }\n      }}\n      onBlur={e => {\n        const value = e.target.value;\n        if (value !== '' && !isNaN(Number(value))) {\n          props.onChange({\n            target: { value: Number(value), name: inputProps.name },\n          });\n        }\n      }}\n    />\n  );\n};\n"],"names":[],"mappings":";;;AAIO,MAAM,WAAA,GAA4C,CAAC,EAAE,UAAA,EAAY,OAAM,KAAM;AAClF,EAAA,MAAM,EAAE,GAAA,EAAK,GAAG,KAAA,EAAM,GAAI,UAAA;AAE1B,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,QAAA;AAAA,MACL,IAAA,EAAK,KAAA;AAAA,MACJ,GAAG,KAAA;AAAA,MACJ,cAAc,KAAA,CAAM,OAAA,KAAY,SAAY,MAAA,CAAO,KAAA,CAAM,OAAO,CAAA,GAAI,MAAA;AAAA,MACpE,UAAU,CAAA,CAAA,KAAK;AACb,QAAA,MAAM,KAAA,GAAQ,EAAE,MAAA,CAAO,KAAA;AACvB,QAAA,IAAI,UAAU,EAAA,IAAM,CAAC,MAAM,MAAA,CAAO,KAAK,CAAC,CAAA,EAAG;AACzC,UAAA,KAAA,CAAM,QAAA,CAAS;AAAA,YACb,MAAA,EAAQ,EAAE,KAAA,EAAc,IAAA,EAAM,WAAW,IAAA;AAAK,WAC/C,CAAA;AAAA,QACH;AAAA,MACF,CAAA;AAAA,MACA,QAAQ,CAAA,CAAA,KAAK;AACX,QAAA,MAAM,KAAA,GAAQ,EAAE,MAAA,CAAO,KAAA;AACvB,QAAA,IAAI,UAAU,EAAA,IAAM,CAAC,MAAM,MAAA,CAAO,KAAK,CAAC,CAAA,EAAG;AACzC,UAAA,KAAA,CAAM,QAAA,CAAS;AAAA,YACb,MAAA,EAAQ,EAAE,KAAA,EAAO,MAAA,CAAO,KAAK,CAAA,EAAG,IAAA,EAAM,WAAW,IAAA;AAAK,WACvD,CAAA;AAAA,QACH;AAAA,MACF;AAAA;AAAA,GACF;AAEJ;;;;"}

package/dist/lib/form/components/record-field.cjs.js

@@ -7,7 +7,7 @@ const uuid = require('@lukeed/uuid');
 const lucideReact = require('lucide-react');
 const React = require('react');
 const Button = require('../../../Button-CXhSUBxN.cjs');
-const input = require('../../../input-bd223EJW.cjs');
+const input = require('../../../input-D0UPyj6A.cjs');
 
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
@@ -80,11 +80,21 @@ const RecordField = ({ inputProps, field }) => {
   };
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
     pairs.map((pair) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative space-y-2 rounded-lg border p-4", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(Button.Button, { type: "button", className: "absolute top-2 right-2", onClick: () => removePair(pair.id), children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.TrashIcon, { className: "size-4" }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        Button.Button,
+        {
+          type: "button",
+          "aria-label": "Remove pair",
+          className: "absolute top-2 right-2",
+          onClick: () => removePair(pair.id),
+          children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.TrashIcon, { className: "size-4" })
+        }
+      ),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2 pt-4", children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           input.Input,
           {
+            "aria-label": "Key",
             placeholder: "Key",
             value: pair.key,
             onChange: (e) => handleChange(pair.id, "key", e.target.value),
@@ -94,6 +104,7 @@ const RecordField = ({ inputProps, field }) => {
         /* @__PURE__ */ jsxRuntime.jsx(
           input.Input,
           {
+            "aria-label": "Value",
             placeholder: "Value",
             value: pair.value,
             onChange: (e) => handleChange(pair.id, "value", e.target.value),

package/dist/lib/form/components/record-field.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"record-field.cjs.js","sources":["../../../../src/lib/form/components/record-field.tsx"],"sourcesContent":["import type { AutoFormFieldProps } from '@autoform/react';\nimport { v4 as uuid } from '@lukeed/uuid';\nimport { Plus, TrashIcon } from 'lucide-react';\nimport * as React from 'react';\nimport { Button } from '@/ds/components/Button';\nimport { Input } from '@/ds/components/Input';\n\ninterface KeyValuePair {\n  id: string;\n  key: string;\n  value: string;\n}\n\nexport const RecordField: React.FC<AutoFormFieldProps> = ({ inputProps, field }) => {\n  const { onChange } = inputProps;\n  const [pairs, setPairs] = React.useState<KeyValuePair[]>(() =>\n    Object.entries(field.default || {}).map(([key, val]) => ({\n      id: key || uuid(),\n      key,\n      value: val as string,\n    })),\n  );\n\n  React.useEffect(() => {\n    if (pairs.length === 0) {\n      setPairs([{ id: uuid(), key: '', value: '' }]);\n    }\n  }, [pairs]);\n\n  const updateForm = React.useCallback(\n    (newPairs: KeyValuePair[]) => {\n      const newValue = newPairs.reduce(\n        (acc, pair) => {\n          if (pair.key) {\n            acc[pair.key] = pair.value;\n          }\n          return acc;\n        },\n        {} as Record<string, string>,\n      );\n\n      onChange?.({\n        target: { value: newValue, name: inputProps.name },\n      });\n    },\n    [onChange, inputProps.name],\n  );\n\n  const handleChange = (id: string, field: 'key' | 'value', newValue: string) => {\n    setPairs(prev => prev.map(pair => (pair.id === id ? { ...pair, [field]: newValue } : pair)));\n  };\n\n  const handleBlur = () => {\n    updateForm(pairs);\n  };\n\n  const addPair = () => {\n    const newPairs = [...pairs, { id: uuid(), key: '', value: '' }];\n    setPairs(newPairs);\n    updateForm(newPairs);\n  };\n\n  const removePair = (id: string) => {\n    const newPairs = pairs.filter(p => p.id !== id);\n    if (newPairs.length === 0) {\n      newPairs.push({ id: uuid(), key: '', value: '' });\n    }\n    setPairs(newPairs);\n    updateForm(newPairs);\n  };\n\n  return (\n    <div className=\"space-y-3\">\n      {pairs.map(pair => (\n        <div key={pair.id} className=\"relative space-y-2 rounded-lg border p-4\">\n          <Button type=\"button\" className=\"absolute top-2 right-2\" onClick={() => removePair(pair.id)}>\n            <TrashIcon className=\"size-4\" />\n          </Button>\n\n          <div className=\"space-y-2 pt-4\">\n            <Input\n              placeholder=\"Key\"\n              value={pair.key}\n              onChange={e => handleChange(pair.id, 'key', e.target.value)}\n              onBlur={handleBlur}\n            />\n            <Input\n              placeholder=\"Value\"\n              value={pair.value}\n              onChange={e => handleChange(pair.id, 'value', e.target.value)}\n              onBlur={handleBlur}\n            />\n          </div>\n        </div>\n      ))}\n      <Button type=\"button\" className=\"w-full\" onClick={addPair} icon={<Plus />}>\n        Add Key-Value Pair\n      </Button>\n    </div>\n  );\n};\n"],"names":["React","uuid","field","jsxs","jsx","Button","TrashIcon","Input","Plus"],"mappings":"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"}
+{"version":3,"file":"record-field.cjs.js","sources":["../../../../src/lib/form/components/record-field.tsx"],"sourcesContent":["import type { AutoFormFieldProps } from '@autoform/react';\nimport { v4 as uuid } from '@lukeed/uuid';\nimport { Plus, TrashIcon } from 'lucide-react';\nimport * as React from 'react';\nimport { Button } from '@/ds/components/Button';\nimport { Input } from '@/ds/components/Input';\n\ninterface KeyValuePair {\n  id: string;\n  key: string;\n  value: string;\n}\n\nexport const RecordField: React.FC<AutoFormFieldProps> = ({ inputProps, field }) => {\n  const { onChange } = inputProps;\n  const [pairs, setPairs] = React.useState<KeyValuePair[]>(() =>\n    Object.entries(field.default || {}).map(([key, val]) => ({\n      id: key || uuid(),\n      key,\n      value: val as string,\n    })),\n  );\n\n  React.useEffect(() => {\n    if (pairs.length === 0) {\n      setPairs([{ id: uuid(), key: '', value: '' }]);\n    }\n  }, [pairs]);\n\n  const updateForm = React.useCallback(\n    (newPairs: KeyValuePair[]) => {\n      const newValue = newPairs.reduce(\n        (acc, pair) => {\n          if (pair.key) {\n            acc[pair.key] = pair.value;\n          }\n          return acc;\n        },\n        {} as Record<string, string>,\n      );\n\n      onChange?.({\n        target: { value: newValue, name: inputProps.name },\n      });\n    },\n    [onChange, inputProps.name],\n  );\n\n  const handleChange = (id: string, field: 'key' | 'value', newValue: string) => {\n    setPairs(prev => prev.map(pair => (pair.id === id ? { ...pair, [field]: newValue } : pair)));\n  };\n\n  const handleBlur = () => {\n    updateForm(pairs);\n  };\n\n  const addPair = () => {\n    const newPairs = [...pairs, { id: uuid(), key: '', value: '' }];\n    setPairs(newPairs);\n    updateForm(newPairs);\n  };\n\n  const removePair = (id: string) => {\n    const newPairs = pairs.filter(p => p.id !== id);\n    if (newPairs.length === 0) {\n      newPairs.push({ id: uuid(), key: '', value: '' });\n    }\n    setPairs(newPairs);\n    updateForm(newPairs);\n  };\n\n  return (\n    <div className=\"space-y-3\">\n      {pairs.map(pair => (\n        <div key={pair.id} className=\"relative space-y-2 rounded-lg border p-4\">\n          <Button\n            type=\"button\"\n            aria-label=\"Remove pair\"\n            className=\"absolute top-2 right-2\"\n            onClick={() => removePair(pair.id)}\n          >\n            <TrashIcon className=\"size-4\" />\n          </Button>\n\n          <div className=\"space-y-2 pt-4\">\n            <Input\n              aria-label=\"Key\"\n              placeholder=\"Key\"\n              value={pair.key}\n              onChange={e => handleChange(pair.id, 'key', e.target.value)}\n              onBlur={handleBlur}\n            />\n            <Input\n              aria-label=\"Value\"\n              placeholder=\"Value\"\n              value={pair.value}\n              onChange={e => handleChange(pair.id, 'value', e.target.value)}\n              onBlur={handleBlur}\n            />\n          </div>\n        </div>\n      ))}\n      <Button type=\"button\" className=\"w-full\" onClick={addPair} icon={<Plus />}>\n        Add Key-Value Pair\n      </Button>\n    </div>\n  );\n};\n"],"names":["React","uuid","field","jsxs","jsx","Button","TrashIcon","Input","Plus"],"mappings":"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"}

package/dist/lib/form/components/record-field.es.js

@@ -3,7 +3,7 @@ import { v4 } from '@lukeed/uuid';
 import { TrashIcon, Plus } from 'lucide-react';
 import * as React from 'react';
 import { B as Button } from '../../../Button-D43ghVKt.js';
-import { I as Input } from '../../../input-CHghVv3k.js';
+import { I as Input } from '../../../input-D5_B67_r.js';
 
 const RecordField = ({ inputProps, field }) => {
   const { onChange } = inputProps;
@@ -57,11 +57,21 @@ const RecordField = ({ inputProps, field }) => {
   };
   return /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
     pairs.map((pair) => /* @__PURE__ */ jsxs("div", { className: "relative space-y-2 rounded-lg border p-4", children: [
-      /* @__PURE__ */ jsx(Button, { type: "button", className: "absolute top-2 right-2", onClick: () => removePair(pair.id), children: /* @__PURE__ */ jsx(TrashIcon, { className: "size-4" }) }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "button",
+          "aria-label": "Remove pair",
+          className: "absolute top-2 right-2",
+          onClick: () => removePair(pair.id),
+          children: /* @__PURE__ */ jsx(TrashIcon, { className: "size-4" })
+        }
+      ),
       /* @__PURE__ */ jsxs("div", { className: "space-y-2 pt-4", children: [
         /* @__PURE__ */ jsx(
           Input,
           {
+            "aria-label": "Key",
             placeholder: "Key",
             value: pair.key,
             onChange: (e) => handleChange(pair.id, "key", e.target.value),
@@ -71,6 +81,7 @@ const RecordField = ({ inputProps, field }) => {
         /* @__PURE__ */ jsx(
           Input,
           {
+            "aria-label": "Value",
             placeholder: "Value",
             value: pair.value,
             onChange: (e) => handleChange(pair.id, "value", e.target.value),

package/dist/lib/form/components/record-field.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"record-field.es.js","sources":["../../../../src/lib/form/components/record-field.tsx"],"sourcesContent":["import type { AutoFormFieldProps } from '@autoform/react';\nimport { v4 as uuid } from '@lukeed/uuid';\nimport { Plus, TrashIcon } from 'lucide-react';\nimport * as React from 'react';\nimport { Button } from '@/ds/components/Button';\nimport { Input } from '@/ds/components/Input';\n\ninterface KeyValuePair {\n  id: string;\n  key: string;\n  value: string;\n}\n\nexport const RecordField: React.FC<AutoFormFieldProps> = ({ inputProps, field }) => {\n  const { onChange } = inputProps;\n  const [pairs, setPairs] = React.useState<KeyValuePair[]>(() =>\n    Object.entries(field.default || {}).map(([key, val]) => ({\n      id: key || uuid(),\n      key,\n      value: val as string,\n    })),\n  );\n\n  React.useEffect(() => {\n    if (pairs.length === 0) {\n      setPairs([{ id: uuid(), key: '', value: '' }]);\n    }\n  }, [pairs]);\n\n  const updateForm = React.useCallback(\n    (newPairs: KeyValuePair[]) => {\n      const newValue = newPairs.reduce(\n        (acc, pair) => {\n          if (pair.key) {\n            acc[pair.key] = pair.value;\n          }\n          return acc;\n        },\n        {} as Record<string, string>,\n      );\n\n      onChange?.({\n        target: { value: newValue, name: inputProps.name },\n      });\n    },\n    [onChange, inputProps.name],\n  );\n\n  const handleChange = (id: string, field: 'key' | 'value', newValue: string) => {\n    setPairs(prev => prev.map(pair => (pair.id === id ? { ...pair, [field]: newValue } : pair)));\n  };\n\n  const handleBlur = () => {\n    updateForm(pairs);\n  };\n\n  const addPair = () => {\n    const newPairs = [...pairs, { id: uuid(), key: '', value: '' }];\n    setPairs(newPairs);\n    updateForm(newPairs);\n  };\n\n  const removePair = (id: string) => {\n    const newPairs = pairs.filter(p => p.id !== id);\n    if (newPairs.length === 0) {\n      newPairs.push({ id: uuid(), key: '', value: '' });\n    }\n    setPairs(newPairs);\n    updateForm(newPairs);\n  };\n\n  return (\n    <div className=\"space-y-3\">\n      {pairs.map(pair => (\n        <div key={pair.id} className=\"relative space-y-2 rounded-lg border p-4\">\n          <Button type=\"button\" className=\"absolute top-2 right-2\" onClick={() => removePair(pair.id)}>\n            <TrashIcon className=\"size-4\" />\n          </Button>\n\n          <div className=\"space-y-2 pt-4\">\n            <Input\n              placeholder=\"Key\"\n              value={pair.key}\n              onChange={e => handleChange(pair.id, 'key', e.target.value)}\n              onBlur={handleBlur}\n            />\n            <Input\n              placeholder=\"Value\"\n              value={pair.value}\n              onChange={e => handleChange(pair.id, 'value', e.target.value)}\n              onBlur={handleBlur}\n            />\n          </div>\n        </div>\n      ))}\n      <Button type=\"button\" className=\"w-full\" onClick={addPair} icon={<Plus />}>\n        Add Key-Value Pair\n      </Button>\n    </div>\n  );\n};\n"],"names":["uuid","field"],"mappings":";;;;;;;AAaO,MAAM,WAAA,GAA4C,CAAC,EAAE,UAAA,EAAY,OAAM,KAAM;AAClF,EAAA,MAAM,EAAE,UAAS,GAAI,UAAA;AACrB,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,KAAA,CAAM,QAAA;AAAA,IAAyB,MACvD,MAAA,CAAO,OAAA,CAAQ,KAAA,CAAM,OAAA,IAAW,EAAE,CAAA,CAAE,GAAA,CAAI,CAAC,CAAC,GAAA,EAAK,GAAG,CAAA,MAAO;AAAA,MACvD,EAAA,EAAI,OAAOA,EAAA,EAAK;AAAA,MAChB,GAAA;AAAA,MACA,KAAA,EAAO;AAAA,KACT,CAAE;AAAA,GACJ;AAEA,EAAA,KAAA,CAAM,UAAU,MAAM;AACpB,IAAA,IAAI,KAAA,CAAM,WAAW,CAAA,EAAG;AACtB,MAAA,QAAA,CAAS,CAAC,EAAE,EAAA,EAAIA,EAAA,EAAK,EAAG,KAAK,EAAA,EAAI,KAAA,EAAO,EAAA,EAAI,CAAC,CAAA;AAAA,IAC/C;AAAA,EACF,CAAA,EAAG,CAAC,KAAK,CAAC,CAAA;AAEV,EAAA,MAAM,aAAa,KAAA,CAAM,WAAA;AAAA,IACvB,CAAC,QAAA,KAA6B;AAC5B,MAAA,MAAM,WAAW,QAAA,CAAS,MAAA;AAAA,QACxB,CAAC,KAAK,IAAA,KAAS;AACb,UAAA,IAAI,KAAK,GAAA,EAAK;AACZ,YAAA,GAAA,CAAI,IAAA,CAAK,GAAG,CAAA,GAAI,IAAA,CAAK,KAAA;AAAA,UACvB;AACA,UAAA,OAAO,GAAA;AAAA,QACT,CAAA;AAAA,QACA;AAAC,OACH;AAEA,MAAA,QAAA,GAAW;AAAA,QACT,QAAQ,EAAE,KAAA,EAAO,QAAA,EAAU,IAAA,EAAM,WAAW,IAAA;AAAK,OAClD,CAAA;AAAA,IACH,CAAA;AAAA,IACA,CAAC,QAAA,EAAU,UAAA,CAAW,IAAI;AAAA,GAC5B;AAEA,EAAA,MAAM,YAAA,GAAe,CAAC,EAAA,EAAYC,MAAAA,EAAwB,QAAA,KAAqB;AAC7E,IAAA,QAAA,CAAS,UAAQ,IAAA,CAAK,GAAA,CAAI,CAAA,IAAA,KAAS,IAAA,CAAK,OAAO,EAAA,GAAK,EAAE,GAAG,IAAA,EAAM,CAACA,MAAK,GAAG,QAAA,EAAS,GAAI,IAAK,CAAC,CAAA;AAAA,EAC7F,CAAA;AAEA,EAAA,MAAM,aAAa,MAAM;AACvB,IAAA,UAAA,CAAW,KAAK,CAAA;AAAA,EAClB,CAAA;AAEA,EAAA,MAAM,UAAU,MAAM;AACpB,IAAA,MAAM,QAAA,GAAW,CAAC,GAAG,KAAA,EAAO,EAAE,EAAA,EAAID,EAAA,EAAK,EAAG,GAAA,EAAK,EAAA,EAAI,KAAA,EAAO,EAAA,EAAI,CAAA;AAC9D,IAAA,QAAA,CAAS,QAAQ,CAAA;AACjB,IAAA,UAAA,CAAW,QAAQ,CAAA;AAAA,EACrB,CAAA;AAEA,EAAA,MAAM,UAAA,GAAa,CAAC,EAAA,KAAe;AACjC,IAAA,MAAM,WAAW,KAAA,CAAM,MAAA,CAAO,CAAA,CAAA,KAAK,CAAA,CAAE,OAAO,EAAE,CAAA;AAC9C,IAAA,IAAI,QAAA,CAAS,WAAW,CAAA,EAAG;AACzB,MAAA,QAAA,CAAS,IAAA,CAAK,EAAE,EAAA,EAAIA,EAAA,IAAQ,GAAA,EAAK,EAAA,EAAI,KAAA,EAAO,EAAA,EAAI,CAAA;AAAA,IAClD;AACA,IAAA,QAAA,CAAS,QAAQ,CAAA;AACjB,IAAA,UAAA,CAAW,QAAQ,CAAA;AAAA,EACrB,CAAA;AAEA,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,WAAA,EACZ,QAAA,EAAA;AAAA,IAAA,KAAA,CAAM,GAAA,CAAI,CAAA,IAAA,qBACT,IAAA,CAAC,KAAA,EAAA,EAAkB,WAAU,0CAAA,EAC3B,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,MAAA,EAAA,EAAO,IAAA,EAAK,QAAA,EAAS,SAAA,EAAU,0BAAyB,OAAA,EAAS,MAAM,UAAA,CAAW,IAAA,CAAK,EAAE,CAAA,EACxF,QAAA,kBAAA,GAAA,CAAC,SAAA,EAAA,EAAU,SAAA,EAAU,UAAS,CAAA,EAChC,CAAA;AAAA,sBAEA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,gBAAA,EACb,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,WAAA,EAAY,KAAA;AAAA,YACZ,OAAO,IAAA,CAAK,GAAA;AAAA,YACZ,QAAA,EAAU,OAAK,YAAA,CAAa,IAAA,CAAK,IAAI,KAAA,EAAO,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,YAC1D,MAAA,EAAQ;AAAA;AAAA,SACV;AAAA,wBACA,GAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,WAAA,EAAY,OAAA;AAAA,YACZ,OAAO,IAAA,CAAK,KAAA;AAAA,YACZ,QAAA,EAAU,OAAK,YAAA,CAAa,IAAA,CAAK,IAAI,OAAA,EAAS,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,YAC5D,MAAA,EAAQ;AAAA;AAAA;AACV,OAAA,EACF;AAAA,KAAA,EAAA,EAlBQ,IAAA,CAAK,EAmBf,CACD,CAAA;AAAA,oBACD,GAAA,CAAC,MAAA,EAAA,EAAO,IAAA,EAAK,QAAA,EAAS,SAAA,EAAU,QAAA,EAAS,OAAA,EAAS,OAAA,EAAS,IAAA,kBAAM,GAAA,CAAC,IAAA,EAAA,EAAK,CAAA,EAAI,QAAA,EAAA,oBAAA,EAE3E;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"record-field.es.js","sources":["../../../../src/lib/form/components/record-field.tsx"],"sourcesContent":["import type { AutoFormFieldProps } from '@autoform/react';\nimport { v4 as uuid } from '@lukeed/uuid';\nimport { Plus, TrashIcon } from 'lucide-react';\nimport * as React from 'react';\nimport { Button } from '@/ds/components/Button';\nimport { Input } from '@/ds/components/Input';\n\ninterface KeyValuePair {\n  id: string;\n  key: string;\n  value: string;\n}\n\nexport const RecordField: React.FC<AutoFormFieldProps> = ({ inputProps, field }) => {\n  const { onChange } = inputProps;\n  const [pairs, setPairs] = React.useState<KeyValuePair[]>(() =>\n    Object.entries(field.default || {}).map(([key, val]) => ({\n      id: key || uuid(),\n      key,\n      value: val as string,\n    })),\n  );\n\n  React.useEffect(() => {\n    if (pairs.length === 0) {\n      setPairs([{ id: uuid(), key: '', value: '' }]);\n    }\n  }, [pairs]);\n\n  const updateForm = React.useCallback(\n    (newPairs: KeyValuePair[]) => {\n      const newValue = newPairs.reduce(\n        (acc, pair) => {\n          if (pair.key) {\n            acc[pair.key] = pair.value;\n          }\n          return acc;\n        },\n        {} as Record<string, string>,\n      );\n\n      onChange?.({\n        target: { value: newValue, name: inputProps.name },\n      });\n    },\n    [onChange, inputProps.name],\n  );\n\n  const handleChange = (id: string, field: 'key' | 'value', newValue: string) => {\n    setPairs(prev => prev.map(pair => (pair.id === id ? { ...pair, [field]: newValue } : pair)));\n  };\n\n  const handleBlur = () => {\n    updateForm(pairs);\n  };\n\n  const addPair = () => {\n    const newPairs = [...pairs, { id: uuid(), key: '', value: '' }];\n    setPairs(newPairs);\n    updateForm(newPairs);\n  };\n\n  const removePair = (id: string) => {\n    const newPairs = pairs.filter(p => p.id !== id);\n    if (newPairs.length === 0) {\n      newPairs.push({ id: uuid(), key: '', value: '' });\n    }\n    setPairs(newPairs);\n    updateForm(newPairs);\n  };\n\n  return (\n    <div className=\"space-y-3\">\n      {pairs.map(pair => (\n        <div key={pair.id} className=\"relative space-y-2 rounded-lg border p-4\">\n          <Button\n            type=\"button\"\n            aria-label=\"Remove pair\"\n            className=\"absolute top-2 right-2\"\n            onClick={() => removePair(pair.id)}\n          >\n            <TrashIcon className=\"size-4\" />\n          </Button>\n\n          <div className=\"space-y-2 pt-4\">\n            <Input\n              aria-label=\"Key\"\n              placeholder=\"Key\"\n              value={pair.key}\n              onChange={e => handleChange(pair.id, 'key', e.target.value)}\n              onBlur={handleBlur}\n            />\n            <Input\n              aria-label=\"Value\"\n              placeholder=\"Value\"\n              value={pair.value}\n              onChange={e => handleChange(pair.id, 'value', e.target.value)}\n              onBlur={handleBlur}\n            />\n          </div>\n        </div>\n      ))}\n      <Button type=\"button\" className=\"w-full\" onClick={addPair} icon={<Plus />}>\n        Add Key-Value Pair\n      </Button>\n    </div>\n  );\n};\n"],"names":["uuid","field"],"mappings":"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"}

package/dist/lib/form/components/select-field.cjs.js

@@ -3,16 +3,10 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const select = require('../../../select-DBY9LQFQ.cjs');
+const select = require('../../../select-DJQYAVcm.cjs');
 
-const SelectField = ({ field, inputProps, error, id, value }) => {
-  const {
-    key: _key,
-    error: _error,
-    "aria-describedby": ariaDescribedBy,
-    "aria-invalid": ariaInvalid,
-    ...props
-  } = inputProps;
+const SelectField = ({ field, inputProps, value }) => {
+  const { key: _key, ...props } = inputProps;
   return /* @__PURE__ */ jsxRuntime.jsxs(
     select.Select,
     {
@@ -28,16 +22,7 @@ const SelectField = ({ field, inputProps, error, id, value }) => {
         props.onChange(syntheticEvent);
       },
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          select.SelectTrigger,
-          {
-            id,
-            className: error ? "border-destructive-indicator" : "",
-            "aria-invalid": ariaInvalid,
-            "aria-describedby": ariaDescribedBy,
-            children: /* @__PURE__ */ jsxRuntime.jsx(select.SelectValue, { placeholder: "Select an option" })
-          }
-        ),
+        /* @__PURE__ */ jsxRuntime.jsx(select.SelectTrigger, { children: /* @__PURE__ */ jsxRuntime.jsx(select.SelectValue, { placeholder: "Select an option" }) }),
         /* @__PURE__ */ jsxRuntime.jsx(select.SelectContent, { children: (field.options || []).map(([key, label]) => /* @__PURE__ */ jsxRuntime.jsx(select.SelectItem, { value: key, children: label }, key)) })
       ]
     }

package/dist/lib/form/components/select-field.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"select-field.cjs.js","sources":["../../../../src/lib/form/components/select-field.tsx"],"sourcesContent":["import type { AutoFormFieldProps } from '@autoform/react';\nimport React from 'react';\nimport { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/ds/components/Select';\n\nexport const SelectField: React.FC<AutoFormFieldProps> = ({ field, inputProps, error, id, value }) => {\n  const {\n    key: _key,\n    error: _error,\n    'aria-describedby': ariaDescribedBy,\n    'aria-invalid': ariaInvalid,\n    ...props\n  } = inputProps;\n\n  return (\n    <Select\n      {...props}\n      value={value}\n      onValueChange={value => {\n        const syntheticEvent = {\n          target: {\n            value,\n            name: inputProps.name,\n          },\n        } as React.ChangeEvent<HTMLInputElement>;\n        props.onChange(syntheticEvent);\n      }}\n    >\n      <SelectTrigger\n        id={id}\n        className={error ? 'border-destructive-indicator' : ''}\n        aria-invalid={ariaInvalid}\n        aria-describedby={ariaDescribedBy}\n      >\n        <SelectValue placeholder=\"Select an option\" />\n      </SelectTrigger>\n      <SelectContent>\n        {(field.options || []).map(([key, label]) => (\n          <SelectItem key={key} value={key}>\n            {label}\n          </SelectItem>\n        ))}\n      </SelectContent>\n    </Select>\n  );\n};\n"],"names":["jsxs","Select","value","jsx","SelectTrigger","SelectValue","SelectContent","SelectItem"],"mappings":";;;;;;;AAIO,MAAM,WAAA,GAA4C,CAAC,EAAE,KAAA,EAAO,YAAY,KAAA,EAAO,EAAA,EAAI,OAAM,KAAM;AACpG,EAAA,MAAM;AAAA,IACJ,GAAA,EAAK,IAAA;AAAA,IACL,KAAA,EAAO,MAAA;AAAA,IACP,kBAAA,EAAoB,eAAA;AAAA,IACpB,cAAA,EAAgB,WAAA;AAAA,IAChB,GAAG;AAAA,GACL,GAAI,UAAA;AAEJ,EAAA,uBACEA,eAAA;AAAA,IAACC,aAAA;AAAA,IAAA;AAAA,MACE,GAAG,KAAA;AAAA,MACJ,KAAA;AAAA,MACA,aAAA,EAAe,CAAAC,MAAAA,KAAS;AACtB,QAAA,MAAM,cAAA,GAAiB;AAAA,UACrB,MAAA,EAAQ;AAAA,YACN,KAAA,EAAAA,MAAAA;AAAA,YACA,MAAM,UAAA,CAAW;AAAA;AACnB,SACF;AACA,QAAA,KAAA,CAAM,SAAS,cAAc,CAAA;AAAA,MAC/B,CAAA;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAAC,cAAA;AAAA,UAACC,oBAAA;AAAA,UAAA;AAAA,YACC,EAAA;AAAA,YACA,SAAA,EAAW,QAAQ,8BAAA,GAAiC,EAAA;AAAA,YACpD,cAAA,EAAc,WAAA;AAAA,YACd,kBAAA,EAAkB,eAAA;AAAA,YAElB,QAAA,kBAAAD,cAAA,CAACE,kBAAA,EAAA,EAAY,WAAA,EAAY,kBAAA,EAAmB;AAAA;AAAA,SAC9C;AAAA,uCACCC,oBAAA,EAAA,EACG,QAAA,EAAA,CAAA,KAAA,CAAM,WAAW,EAAC,EAAG,IAAI,CAAC,CAAC,KAAK,KAAK,CAAA,oCACpCC,iBAAA,EAAA,EAAqB,KAAA,EAAO,KAC1B,QAAA,EAAA,KAAA,EAAA,EADc,GAEjB,CACD,CAAA,EACH;AAAA;AAAA;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"select-field.cjs.js","sources":["../../../../src/lib/form/components/select-field.tsx"],"sourcesContent":["import type { AutoFormFieldProps } from '@autoform/react';\nimport React from 'react';\nimport { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/ds/components/Select';\n\nexport const SelectField: React.FC<AutoFormFieldProps> = ({ field, inputProps, value }) => {\n  const { key: _key, ...props } = inputProps;\n\n  return (\n    <Select\n      {...props}\n      value={value}\n      onValueChange={value => {\n        const syntheticEvent = {\n          target: {\n            value,\n            name: inputProps.name,\n          },\n        } as React.ChangeEvent<HTMLInputElement>;\n        props.onChange(syntheticEvent);\n      }}\n    >\n      <SelectTrigger>\n        <SelectValue placeholder=\"Select an option\" />\n      </SelectTrigger>\n      <SelectContent>\n        {(field.options || []).map(([key, label]) => (\n          <SelectItem key={key} value={key}>\n            {label}\n          </SelectItem>\n        ))}\n      </SelectContent>\n    </Select>\n  );\n};\n"],"names":["jsxs","Select","value","jsx","SelectTrigger","SelectValue","SelectContent","SelectItem"],"mappings":";;;;;;;AAIO,MAAM,cAA4C,CAAC,EAAE,KAAA,EAAO,UAAA,EAAY,OAAM,KAAM;AACzF,EAAA,MAAM,EAAE,GAAA,EAAK,IAAA,EAAM,GAAG,OAAM,GAAI,UAAA;AAEhC,EAAA,uBACEA,eAAA;AAAA,IAACC,aAAA;AAAA,IAAA;AAAA,MACE,GAAG,KAAA;AAAA,MACJ,KAAA;AAAA,MACA,aAAA,EAAe,CAAAC,MAAAA,KAAS;AACtB,QAAA,MAAM,cAAA,GAAiB;AAAA,UACrB,MAAA,EAAQ;AAAA,YACN,KAAA,EAAAA,MAAAA;AAAA,YACA,MAAM,UAAA,CAAW;AAAA;AACnB,SACF;AACA,QAAA,KAAA,CAAM,SAAS,cAAc,CAAA;AAAA,MAC/B,CAAA;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAAC,cAAA,CAACC,oBAAA,EAAA,EACC,QAAA,kBAAAD,cAAA,CAACE,kBAAA,EAAA,EAAY,WAAA,EAAY,oBAAmB,CAAA,EAC9C,CAAA;AAAA,uCACCC,oBAAA,EAAA,EACG,QAAA,EAAA,CAAA,KAAA,CAAM,WAAW,EAAC,EAAG,IAAI,CAAC,CAAC,KAAK,KAAK,CAAA,oCACpCC,iBAAA,EAAA,EAAqB,KAAA,EAAO,KAC1B,QAAA,EAAA,KAAA,EAAA,EADc,GAEjB,CACD,CAAA,EACH;AAAA;AAAA;AAAA,GACF;AAEJ;;;;"}

package/dist/lib/form/components/select-field.es.js

@@ -1,14 +1,8 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { S as Select, d as SelectTrigger, e as SelectValue, a as SelectContent, c as SelectItem } from '../../../select-DZeNf-kI.js';
+import { S as Select, d as SelectTrigger, e as SelectValue, a as SelectContent, c as SelectItem } from '../../../select--ArpXYDc.js';
 
-const SelectField = ({ field, inputProps, error, id, value }) => {
-  const {
-    key: _key,
-    error: _error,
-    "aria-describedby": ariaDescribedBy,
-    "aria-invalid": ariaInvalid,
-    ...props
-  } = inputProps;
+const SelectField = ({ field, inputProps, value }) => {
+  const { key: _key, ...props } = inputProps;
   return /* @__PURE__ */ jsxs(
     Select,
     {
@@ -24,16 +18,7 @@ const SelectField = ({ field, inputProps, error, id, value }) => {
         props.onChange(syntheticEvent);
       },
       children: [
-        /* @__PURE__ */ jsx(
-          SelectTrigger,
-          {
-            id,
-            className: error ? "border-destructive-indicator" : "",
-            "aria-invalid": ariaInvalid,
-            "aria-describedby": ariaDescribedBy,
-            children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select an option" })
-          }
-        ),
+        /* @__PURE__ */ jsx(SelectTrigger, { children: /* @__PURE__ */ jsx(SelectValue, { placeholder: "Select an option" }) }),
         /* @__PURE__ */ jsx(SelectContent, { children: (field.options || []).map(([key, label]) => /* @__PURE__ */ jsx(SelectItem, { value: key, children: label }, key)) })
       ]
     }

package/dist/lib/form/components/select-field.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"select-field.es.js","sources":["../../../../src/lib/form/components/select-field.tsx"],"sourcesContent":["import type { AutoFormFieldProps } from '@autoform/react';\nimport React from 'react';\nimport { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/ds/components/Select';\n\nexport const SelectField: React.FC<AutoFormFieldProps> = ({ field, inputProps, error, id, value }) => {\n  const {\n    key: _key,\n    error: _error,\n    'aria-describedby': ariaDescribedBy,\n    'aria-invalid': ariaInvalid,\n    ...props\n  } = inputProps;\n\n  return (\n    <Select\n      {...props}\n      value={value}\n      onValueChange={value => {\n        const syntheticEvent = {\n          target: {\n            value,\n            name: inputProps.name,\n          },\n        } as React.ChangeEvent<HTMLInputElement>;\n        props.onChange(syntheticEvent);\n      }}\n    >\n      <SelectTrigger\n        id={id}\n        className={error ? 'border-destructive-indicator' : ''}\n        aria-invalid={ariaInvalid}\n        aria-describedby={ariaDescribedBy}\n      >\n        <SelectValue placeholder=\"Select an option\" />\n      </SelectTrigger>\n      <SelectContent>\n        {(field.options || []).map(([key, label]) => (\n          <SelectItem key={key} value={key}>\n            {label}\n          </SelectItem>\n        ))}\n      </SelectContent>\n    </Select>\n  );\n};\n"],"names":["value"],"mappings":";;;AAIO,MAAM,WAAA,GAA4C,CAAC,EAAE,KAAA,EAAO,YAAY,KAAA,EAAO,EAAA,EAAI,OAAM,KAAM;AACpG,EAAA,MAAM;AAAA,IACJ,GAAA,EAAK,IAAA;AAAA,IACL,KAAA,EAAO,MAAA;AAAA,IACP,kBAAA,EAAoB,eAAA;AAAA,IACpB,cAAA,EAAgB,WAAA;AAAA,IAChB,GAAG;AAAA,GACL,GAAI,UAAA;AAEJ,EAAA,uBACE,IAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACE,GAAG,KAAA;AAAA,MACJ,KAAA;AAAA,MACA,aAAA,EAAe,CAAAA,MAAAA,KAAS;AACtB,QAAA,MAAM,cAAA,GAAiB;AAAA,UACrB,MAAA,EAAQ;AAAA,YACN,KAAA,EAAAA,MAAAA;AAAA,YACA,MAAM,UAAA,CAAW;AAAA;AACnB,SACF;AACA,QAAA,KAAA,CAAM,SAAS,cAAc,CAAA;AAAA,MAC/B,CAAA;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,aAAA;AAAA,UAAA;AAAA,YACC,EAAA;AAAA,YACA,SAAA,EAAW,QAAQ,8BAAA,GAAiC,EAAA;AAAA,YACpD,cAAA,EAAc,WAAA;AAAA,YACd,kBAAA,EAAkB,eAAA;AAAA,YAElB,QAAA,kBAAA,GAAA,CAAC,WAAA,EAAA,EAAY,WAAA,EAAY,kBAAA,EAAmB;AAAA;AAAA,SAC9C;AAAA,4BACC,aAAA,EAAA,EACG,QAAA,EAAA,CAAA,KAAA,CAAM,WAAW,EAAC,EAAG,IAAI,CAAC,CAAC,KAAK,KAAK,CAAA,yBACpC,UAAA,EAAA,EAAqB,KAAA,EAAO,KAC1B,QAAA,EAAA,KAAA,EAAA,EADc,GAEjB,CACD,CAAA,EACH;AAAA;AAAA;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"select-field.es.js","sources":["../../../../src/lib/form/components/select-field.tsx"],"sourcesContent":["import type { AutoFormFieldProps } from '@autoform/react';\nimport React from 'react';\nimport { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/ds/components/Select';\n\nexport const SelectField: React.FC<AutoFormFieldProps> = ({ field, inputProps, value }) => {\n  const { key: _key, ...props } = inputProps;\n\n  return (\n    <Select\n      {...props}\n      value={value}\n      onValueChange={value => {\n        const syntheticEvent = {\n          target: {\n            value,\n            name: inputProps.name,\n          },\n        } as React.ChangeEvent<HTMLInputElement>;\n        props.onChange(syntheticEvent);\n      }}\n    >\n      <SelectTrigger>\n        <SelectValue placeholder=\"Select an option\" />\n      </SelectTrigger>\n      <SelectContent>\n        {(field.options || []).map(([key, label]) => (\n          <SelectItem key={key} value={key}>\n            {label}\n          </SelectItem>\n        ))}\n      </SelectContent>\n    </Select>\n  );\n};\n"],"names":["value"],"mappings":";;;AAIO,MAAM,cAA4C,CAAC,EAAE,KAAA,EAAO,UAAA,EAAY,OAAM,KAAM;AACzF,EAAA,MAAM,EAAE,GAAA,EAAK,IAAA,EAAM,GAAG,OAAM,GAAI,UAAA;AAEhC,EAAA,uBACE,IAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACE,GAAG,KAAA;AAAA,MACJ,KAAA;AAAA,MACA,aAAA,EAAe,CAAAA,MAAAA,KAAS;AACtB,QAAA,MAAM,cAAA,GAAiB;AAAA,UACrB,MAAA,EAAQ;AAAA,YACN,KAAA,EAAAA,MAAAA;AAAA,YACA,MAAM,UAAA,CAAW;AAAA;AACnB,SACF;AACA,QAAA,KAAA,CAAM,SAAS,cAAc,CAAA;AAAA,MAC/B,CAAA;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,aAAA,EAAA,EACC,QAAA,kBAAA,GAAA,CAAC,WAAA,EAAA,EAAY,WAAA,EAAY,oBAAmB,CAAA,EAC9C,CAAA;AAAA,4BACC,aAAA,EAAA,EACG,QAAA,EAAA,CAAA,KAAA,CAAM,WAAW,EAAC,EAAG,IAAI,CAAC,CAAC,KAAK,KAAK,CAAA,yBACpC,UAAA,EAAA,EAAqB,KAAA,EAAO,KAC1B,QAAA,EAAA,KAAA,EAAA,EADc,GAEjB,CACD,CAAA,EACH;AAAA;AAAA;AAAA,GACF;AAEJ;;;;"}

package/dist/lib/form/components/string-field.cjs.js

@@ -3,19 +3,17 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const textarea = require('../../../textarea-gUBUqpol.cjs');
+const textarea = require('../../../textarea-DNV5Gs9A.cjs');
 const utils_cn = require('../../../cn-DG0X1KEP.cjs');
 
-const StringField = ({ inputProps, error, field, id }) => {
+const StringField = ({ inputProps, field }) => {
   const { key: _key, className, ...props } = inputProps;
   return /* @__PURE__ */ jsxRuntime.jsx(
     textarea.Textarea,
     {
-      id,
       ...props,
       rows: 1,
       className: utils_cn.cn("field-sizing-content max-h-48 min-h-control-md resize-none overflow-y-auto", className),
-      error: Boolean(error),
       defaultValue: field.default
     }
   );

package/dist/lib/form/components/string-field.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"string-field.cjs.js","sources":["../../../../src/lib/form/components/string-field.tsx"],"sourcesContent":["import type { AutoFormFieldProps } from '@autoform/react';\nimport React from 'react';\nimport { Textarea } from '@/ds/components/Textarea';\nimport { cn } from '@/utils/cn';\n\nexport const StringField: React.FC<AutoFormFieldProps> = ({ inputProps, error, field, id }) => {\n  const { key: _key, className, ...props } = inputProps;\n\n  return (\n    <Textarea\n      id={id}\n      {...props}\n      rows={1}\n      className={cn('field-sizing-content max-h-48 min-h-control-md resize-none overflow-y-auto', className)}\n      error={Boolean(error)}\n      defaultValue={field.default}\n    />\n  );\n};\n"],"names":["jsx","Textarea","cn"],"mappings":";;;;;;;;AAKO,MAAM,cAA4C,CAAC,EAAE,YAAY,KAAA,EAAO,KAAA,EAAO,IAAG,KAAM;AAC7F,EAAA,MAAM,EAAE,GAAA,EAAK,IAAA,EAAM,SAAA,EAAW,GAAG,OAAM,GAAI,UAAA;AAE3C,EAAA,uBACEA,cAAA;AAAA,IAACC,iBAAA;AAAA,IAAA;AAAA,MACC,EAAA;AAAA,MACC,GAAG,KAAA;AAAA,MACJ,IAAA,EAAM,CAAA;AAAA,MACN,SAAA,EAAWC,WAAA,CAAG,4EAAA,EAA8E,SAAS,CAAA;AAAA,MACrG,KAAA,EAAO,QAAQ,KAAK,CAAA;AAAA,MACpB,cAAc,KAAA,CAAM;AAAA;AAAA,GACtB;AAEJ;;;;"}
+{"version":3,"file":"string-field.cjs.js","sources":["../../../../src/lib/form/components/string-field.tsx"],"sourcesContent":["import type { AutoFormFieldProps } from '@autoform/react';\nimport React from 'react';\nimport { Textarea } from '@/ds/components/Textarea';\nimport { cn } from '@/utils/cn';\n\nexport const StringField: React.FC<AutoFormFieldProps> = ({ inputProps, field }) => {\n  const { key: _key, className, ...props } = inputProps;\n\n  return (\n    <Textarea\n      {...props}\n      rows={1}\n      className={cn('field-sizing-content max-h-48 min-h-control-md resize-none overflow-y-auto', className)}\n      defaultValue={field.default}\n    />\n  );\n};\n"],"names":["jsx","Textarea","cn"],"mappings":";;;;;;;;AAKO,MAAM,WAAA,GAA4C,CAAC,EAAE,UAAA,EAAY,OAAM,KAAM;AAClF,EAAA,MAAM,EAAE,GAAA,EAAK,IAAA,EAAM,SAAA,EAAW,GAAG,OAAM,GAAI,UAAA;AAE3C,EAAA,uBACEA,cAAA;AAAA,IAACC,iBAAA;AAAA,IAAA;AAAA,MACE,GAAG,KAAA;AAAA,MACJ,IAAA,EAAM,CAAA;AAAA,MACN,SAAA,EAAWC,WAAA,CAAG,4EAAA,EAA8E,SAAS,CAAA;AAAA,MACrG,cAAc,KAAA,CAAM;AAAA;AAAA,GACtB;AAEJ;;;;"}

package/dist/lib/form/components/string-field.es.js

@@ -1,17 +1,15 @@
 import { jsx } from 'react/jsx-runtime';
-import { T as Textarea } from '../../../textarea-B6wvS_CQ.js';
+import { T as Textarea } from '../../../textarea-CxPNKg2q.js';
 import { c as cn } from '../../../cn-65Adrsfj.js';
 
-const StringField = ({ inputProps, error, field, id }) => {
+const StringField = ({ inputProps, field }) => {
   const { key: _key, className, ...props } = inputProps;
   return /* @__PURE__ */ jsx(
     Textarea,
     {
-      id,
       ...props,
       rows: 1,
       className: cn("field-sizing-content max-h-48 min-h-control-md resize-none overflow-y-auto", className),
-      error: Boolean(error),
       defaultValue: field.default
     }
   );

package/dist/lib/form/components/string-field.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"string-field.es.js","sources":["../../../../src/lib/form/components/string-field.tsx"],"sourcesContent":["import type { AutoFormFieldProps } from '@autoform/react';\nimport React from 'react';\nimport { Textarea } from '@/ds/components/Textarea';\nimport { cn } from '@/utils/cn';\n\nexport const StringField: React.FC<AutoFormFieldProps> = ({ inputProps, error, field, id }) => {\n  const { key: _key, className, ...props } = inputProps;\n\n  return (\n    <Textarea\n      id={id}\n      {...props}\n      rows={1}\n      className={cn('field-sizing-content max-h-48 min-h-control-md resize-none overflow-y-auto', className)}\n      error={Boolean(error)}\n      defaultValue={field.default}\n    />\n  );\n};\n"],"names":[],"mappings":";;;;AAKO,MAAM,cAA4C,CAAC,EAAE,YAAY,KAAA,EAAO,KAAA,EAAO,IAAG,KAAM;AAC7F,EAAA,MAAM,EAAE,GAAA,EAAK,IAAA,EAAM,SAAA,EAAW,GAAG,OAAM,GAAI,UAAA;AAE3C,EAAA,uBACE,GAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,EAAA;AAAA,MACC,GAAG,KAAA;AAAA,MACJ,IAAA,EAAM,CAAA;AAAA,MACN,SAAA,EAAW,EAAA,CAAG,4EAAA,EAA8E,SAAS,CAAA;AAAA,MACrG,KAAA,EAAO,QAAQ,KAAK,CAAA;AAAA,MACpB,cAAc,KAAA,CAAM;AAAA;AAAA,GACtB;AAEJ;;;;"}
+{"version":3,"file":"string-field.es.js","sources":["../../../../src/lib/form/components/string-field.tsx"],"sourcesContent":["import type { AutoFormFieldProps } from '@autoform/react';\nimport React from 'react';\nimport { Textarea } from '@/ds/components/Textarea';\nimport { cn } from '@/utils/cn';\n\nexport const StringField: React.FC<AutoFormFieldProps> = ({ inputProps, field }) => {\n  const { key: _key, className, ...props } = inputProps;\n\n  return (\n    <Textarea\n      {...props}\n      rows={1}\n      className={cn('field-sizing-content max-h-48 min-h-control-md resize-none overflow-y-auto', className)}\n      defaultValue={field.default}\n    />\n  );\n};\n"],"names":[],"mappings":";;;;AAKO,MAAM,WAAA,GAA4C,CAAC,EAAE,UAAA,EAAY,OAAM,KAAM;AAClF,EAAA,MAAM,EAAE,GAAA,EAAK,IAAA,EAAM,SAAA,EAAW,GAAG,OAAM,GAAI,UAAA;AAE3C,EAAA,uBACE,GAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACE,GAAG,KAAA;AAAA,MACJ,IAAA,EAAM,CAAA;AAAA,MACN,SAAA,EAAW,EAAA,CAAG,4EAAA,EAA8E,SAAS,CAAA;AAAA,MACrG,cAAc,KAAA,CAAM;AAAA;AAAA,GACtB;AAEJ;;;;"}

package/dist/lib/form/components/union-field.cjs.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const lib_form_components_customArrayField = require('../../../custom-auto-form-field-Brfb-0Te.cjs');
+const lib_form_components_customArrayField = require('../../../custom-auto-form-field-DVse5pih.cjs');
 const Txt = require('../../../Txt-DPmEpNbp.cjs');
 
 const UnionField = ({ field, inputProps }) => {

package/dist/lib/form/components/union-field.es.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { C as CustomAutoFormField } from '../../../custom-auto-form-field-yEMBGXu-.js';
+import { C as CustomAutoFormField } from '../../../custom-auto-form-field-BvEhSH73.js';
 import { T as Txt } from '../../../Txt-BP1SRHmL.js';
 
 const UnionField = ({ field, inputProps }) => {

package/dist/lib/form/custom-auto-form.cjs.js

@@ -7,7 +7,7 @@ const core = require('@autoform/core');
 const react = require('@autoform/react');
 const React = require('react');
 const reactHookForm = require('react-hook-form');
-const lib_form_components_customArrayField = require('../../custom-auto-form-field-Brfb-0Te.cjs');
+const lib_form_components_customArrayField = require('../../custom-auto-form-field-DVse5pih.cjs');
 
 function CustomAutoForm({
   schema,

package/dist/lib/form/custom-auto-form.es.js

@@ -3,7 +3,7 @@ import { parseSchema, getDefaultValues } from '@autoform/core';
 import { AutoFormProvider } from '@autoform/react';
 import { useMemo, useEffect, useCallback } from 'react';
 import { useForm, FormProvider } from 'react-hook-form';
-import { C as CustomAutoFormField } from '../../custom-auto-form-field-yEMBGXu-.js';
+import { C as CustomAutoFormField } from '../../custom-auto-form-field-BvEhSH73.js';
 
 function CustomAutoForm({
   schema,

package/dist/lib/form/dynamic-form.cjs.js

@@ -11,7 +11,6 @@ const lib_form_fieldContext = require('./field-context.cjs.js');
 const lib_form_isEmptyZodObject = require('./is-empty-zod-object.cjs.js');
 const lib_form_zodProvider = require('./zod-provider.cjs.js');
 const lib_form_zodProvider_compat = require('./zod-provider/compat.cjs.js');
-const label = require('../../label-DfAhywj_.cjs');
 
 function getFormInput(values, isWrapped) {
   return isWrapped ? values[lib_form_fieldContext.ROOT_FIELD_KEY] : values;
@@ -27,9 +26,6 @@ const SubmitButton = ({ children }) => {
   return rowProps ? /* @__PURE__ */ jsxRuntime.jsx(lib_form_components_formSubmitRow.FormSubmitRow, { ...rowProps, children }) : null;
 };
 const uiComponents = { SubmitButton };
-const formComponents = {
-  Label: ({ value }) => /* @__PURE__ */ jsxRuntime.jsx(label.Label, { className: "text-body-sm", children: value })
-};
 function DynamicForm({
   schema,
   onSubmit,
@@ -112,7 +108,6 @@ function DynamicForm({
       defaultValues: normalizedDefaultValues,
       formProps: { className, noValidate: true },
       uiComponents,
-      formComponents,
       withSubmit: true,
       readOnly,
       children

package/dist/lib/form/dynamic-form.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"dynamic-form.cjs.js","sources":["../../../src/lib/form/dynamic-form.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { createContext, useContext, useEffect, useLayoutEffect, useRef, useCallback, useMemo } from 'react';\nimport type { UseFormReturn } from 'react-hook-form';\nimport { z } from 'zod';\nimport { AutoForm } from './auto-form';\nimport { FormSubmitRow } from './components/form-submit-row';\nimport type { FormSubmitRowProps } from './components/form-submit-row';\nimport { ROOT_FIELD_KEY } from './field-context';\nimport { isEmptyZodObject } from './is-empty-zod-object';\nimport { CustomZodProvider } from './zod-provider';\nimport { getShape } from './zod-provider/compat';\nimport type { ButtonProps } from '@/ds/components/Button';\nimport { Label } from '@/ds/components/Label';\n\ninterface DynamicFormProps {\n  schema: any;\n  onSubmit?: (values: any) => void | Promise<void>;\n  onValuesChange?: (values: any) => void;\n  defaultValues?: any;\n  isSubmitLoading?: boolean;\n  submitButtonLabel?: string;\n  submitButtonIcon?: ReactNode;\n  submitButtonVariant?: ButtonProps['variant'];\n  submitButtonFullWidth?: boolean;\n  className?: string;\n  readOnly?: boolean;\n  children?: React.ReactNode;\n  submitActions?: React.ReactNode;\n  leftActions?: React.ReactNode;\n}\n\nfunction getFormInput(values: Record<string, unknown>, isWrapped: boolean) {\n  return isWrapped ? values[ROOT_FIELD_KEY] : values;\n}\n\nfunction normalizeSchema(schema: z.ZodType, isWrapped: boolean) {\n  if (isEmptyZodObject(schema)) return z.object({});\n  if (!isWrapped) return schema;\n  return z.object({ [ROOT_FIELD_KEY]: schema.description ? schema : schema.describe('Input') });\n}\n\nconst SubmitRowContext = createContext<FormSubmitRowProps | null>(null);\n\n// Defined once, outside any hook: AutoForm renders `uiComponents.SubmitButton` as a component\n// type, so recreating it per render would unmount and remount everything in `submitActions`.\nconst SubmitButton = ({ children }: { children: ReactNode }) => {\n  const rowProps = useContext(SubmitRowContext);\n  return rowProps ? <FormSubmitRow {...rowProps}>{children}</FormSubmitRow> : null;\n};\n\nconst uiComponents = { SubmitButton };\n\nconst formComponents = {\n  Label: ({ value }: { value: string }) => <Label className=\"text-body-sm\">{value}</Label>,\n};\n\nexport function DynamicForm({\n  schema,\n  onSubmit,\n  onValuesChange,\n  defaultValues,\n  isSubmitLoading,\n  submitButtonLabel,\n  submitButtonIcon,\n  submitButtonVariant,\n  submitButtonFullWidth,\n  className,\n  readOnly,\n  children,\n  submitActions,\n  leftActions,\n}: DynamicFormProps) {\n  const isWrapped = getShape(schema) === undefined;\n  const subscriptionRef = useRef<{ unsubscribe: () => void } | null>(null);\n  const onValuesChangeRef = useRef(onValuesChange);\n  useLayoutEffect(() => {\n    onValuesChangeRef.current = onValuesChange;\n  }, [onValuesChange]);\n\n  useEffect(() => () => subscriptionRef.current?.unsubscribe(), []);\n\n  const hasValuesListener = Boolean(onValuesChange);\n\n  const handleFormInit = useCallback(\n    (form: UseFormReturn<any>) => {\n      subscriptionRef.current?.unsubscribe();\n      subscriptionRef.current = null;\n\n      if (!hasValuesListener) return;\n\n      subscriptionRef.current = form.watch(values => onValuesChangeRef.current?.(getFormInput(values, isWrapped)));\n      onValuesChangeRef.current?.(getFormInput(form.getValues(), isWrapped));\n    },\n    [hasValuesListener, isWrapped],\n  );\n\n  const schemaProvider = useMemo(\n    () => (schema ? new CustomZodProvider(normalizeSchema(schema, isWrapped)) : null),\n    [schema, isWrapped],\n  );\n\n  const submitRow = useMemo<FormSubmitRowProps | null>(\n    () =>\n      onSubmit\n        ? {\n            isSubmitLoading,\n            submitButtonLabel,\n            submitButtonIcon,\n            submitButtonVariant,\n            submitButtonFullWidth,\n            submitActions,\n            leftActions,\n          }\n        : null,\n    [\n      onSubmit,\n      isSubmitLoading,\n      submitButtonLabel,\n      submitButtonIcon,\n      submitButtonVariant,\n      submitButtonFullWidth,\n      submitActions,\n      leftActions,\n    ],\n  );\n\n  const normalizedDefaultValues = useMemo(\n    () => (isWrapped ? (defaultValues === undefined ? undefined : { [ROOT_FIELD_KEY]: defaultValues }) : defaultValues),\n    [isWrapped, defaultValues],\n  );\n\n  const handleSubmit = useCallback(\n    async (values: any) => {\n      await onSubmit?.(getFormInput(values, isWrapped));\n    },\n    [onSubmit, isWrapped],\n  );\n\n  if (!schemaProvider) {\n    console.error('no form schema found');\n    return null;\n  }\n\n  return (\n    <SubmitRowContext.Provider value={submitRow}>\n      <AutoForm\n        schema={schemaProvider}\n        onSubmit={handleSubmit}\n        onFormInit={handleFormInit}\n        defaultValues={normalizedDefaultValues}\n        formProps={{ className, noValidate: true }}\n        uiComponents={uiComponents}\n        formComponents={formComponents}\n        withSubmit={true}\n        readOnly={readOnly}\n      >\n        {children}\n      </AutoForm>\n    </SubmitRowContext.Provider>\n  );\n}\n"],"names":["ROOT_FIELD_KEY","isEmptyZodObject","z","createContext","useContext","jsx","FormSubmitRow","Label","getShape","useRef","useLayoutEffect","useEffect","useCallback","useMemo","CustomZodProvider","AutoForm"],"mappings":"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"}
+{"version":3,"file":"dynamic-form.cjs.js","sources":["../../../src/lib/form/dynamic-form.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { createContext, useContext, useEffect, useLayoutEffect, useRef, useCallback, useMemo } from 'react';\nimport type { UseFormReturn } from 'react-hook-form';\nimport { z } from 'zod';\nimport { AutoForm } from './auto-form';\nimport { FormSubmitRow } from './components/form-submit-row';\nimport type { FormSubmitRowProps } from './components/form-submit-row';\nimport { ROOT_FIELD_KEY } from './field-context';\nimport { isEmptyZodObject } from './is-empty-zod-object';\nimport { CustomZodProvider } from './zod-provider';\nimport { getShape } from './zod-provider/compat';\nimport type { ButtonProps } from '@/ds/components/Button';\n\ninterface DynamicFormProps {\n  schema: any;\n  onSubmit?: (values: any) => void | Promise<void>;\n  onValuesChange?: (values: any) => void;\n  defaultValues?: any;\n  isSubmitLoading?: boolean;\n  submitButtonLabel?: string;\n  submitButtonIcon?: ReactNode;\n  submitButtonVariant?: ButtonProps['variant'];\n  submitButtonFullWidth?: boolean;\n  className?: string;\n  readOnly?: boolean;\n  children?: React.ReactNode;\n  submitActions?: React.ReactNode;\n  leftActions?: React.ReactNode;\n}\n\nfunction getFormInput(values: Record<string, unknown>, isWrapped: boolean) {\n  return isWrapped ? values[ROOT_FIELD_KEY] : values;\n}\n\nfunction normalizeSchema(schema: z.ZodType, isWrapped: boolean) {\n  if (isEmptyZodObject(schema)) return z.object({});\n  if (!isWrapped) return schema;\n  return z.object({ [ROOT_FIELD_KEY]: schema.description ? schema : schema.describe('Input') });\n}\n\nconst SubmitRowContext = createContext<FormSubmitRowProps | null>(null);\n\n// Defined once, outside any hook: AutoForm renders `uiComponents.SubmitButton` as a component\n// type, so recreating it per render would unmount and remount everything in `submitActions`.\nconst SubmitButton = ({ children }: { children: ReactNode }) => {\n  const rowProps = useContext(SubmitRowContext);\n  return rowProps ? <FormSubmitRow {...rowProps}>{children}</FormSubmitRow> : null;\n};\n\nconst uiComponents = { SubmitButton };\n\nexport function DynamicForm({\n  schema,\n  onSubmit,\n  onValuesChange,\n  defaultValues,\n  isSubmitLoading,\n  submitButtonLabel,\n  submitButtonIcon,\n  submitButtonVariant,\n  submitButtonFullWidth,\n  className,\n  readOnly,\n  children,\n  submitActions,\n  leftActions,\n}: DynamicFormProps) {\n  const isWrapped = getShape(schema) === undefined;\n  const subscriptionRef = useRef<{ unsubscribe: () => void } | null>(null);\n  const onValuesChangeRef = useRef(onValuesChange);\n  useLayoutEffect(() => {\n    onValuesChangeRef.current = onValuesChange;\n  }, [onValuesChange]);\n\n  useEffect(() => () => subscriptionRef.current?.unsubscribe(), []);\n\n  const hasValuesListener = Boolean(onValuesChange);\n\n  const handleFormInit = useCallback(\n    (form: UseFormReturn<any>) => {\n      subscriptionRef.current?.unsubscribe();\n      subscriptionRef.current = null;\n\n      if (!hasValuesListener) return;\n\n      subscriptionRef.current = form.watch(values => onValuesChangeRef.current?.(getFormInput(values, isWrapped)));\n      onValuesChangeRef.current?.(getFormInput(form.getValues(), isWrapped));\n    },\n    [hasValuesListener, isWrapped],\n  );\n\n  const schemaProvider = useMemo(\n    () => (schema ? new CustomZodProvider(normalizeSchema(schema, isWrapped)) : null),\n    [schema, isWrapped],\n  );\n\n  const submitRow = useMemo<FormSubmitRowProps | null>(\n    () =>\n      onSubmit\n        ? {\n            isSubmitLoading,\n            submitButtonLabel,\n            submitButtonIcon,\n            submitButtonVariant,\n            submitButtonFullWidth,\n            submitActions,\n            leftActions,\n          }\n        : null,\n    [\n      onSubmit,\n      isSubmitLoading,\n      submitButtonLabel,\n      submitButtonIcon,\n      submitButtonVariant,\n      submitButtonFullWidth,\n      submitActions,\n      leftActions,\n    ],\n  );\n\n  const normalizedDefaultValues = useMemo(\n    () => (isWrapped ? (defaultValues === undefined ? undefined : { [ROOT_FIELD_KEY]: defaultValues }) : defaultValues),\n    [isWrapped, defaultValues],\n  );\n\n  const handleSubmit = useCallback(\n    async (values: any) => {\n      await onSubmit?.(getFormInput(values, isWrapped));\n    },\n    [onSubmit, isWrapped],\n  );\n\n  if (!schemaProvider) {\n    console.error('no form schema found');\n    return null;\n  }\n\n  return (\n    <SubmitRowContext.Provider value={submitRow}>\n      <AutoForm\n        schema={schemaProvider}\n        onSubmit={handleSubmit}\n        onFormInit={handleFormInit}\n        defaultValues={normalizedDefaultValues}\n        formProps={{ className, noValidate: true }}\n        uiComponents={uiComponents}\n        withSubmit={true}\n        readOnly={readOnly}\n      >\n        {children}\n      </AutoForm>\n    </SubmitRowContext.Provider>\n  );\n}\n"],"names":["ROOT_FIELD_KEY","isEmptyZodObject","z","createContext","useContext","jsx","FormSubmitRow","getShape","useRef","useLayoutEffect","useEffect","useCallback","useMemo","CustomZodProvider","AutoForm"],"mappings":"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"}

package/dist/lib/form/dynamic-form.es.js

@@ -7,7 +7,6 @@ import { ROOT_FIELD_KEY } from './field-context.es.js';
 import { isEmptyZodObject } from './is-empty-zod-object.es.js';
 import { CustomZodProvider } from './zod-provider.es.js';
 import { getShape } from './zod-provider/compat.es.js';
-import { L as Label } from '../../label-Dxsz0dFs.js';
 
 function getFormInput(values, isWrapped) {
   return isWrapped ? values[ROOT_FIELD_KEY] : values;
@@ -23,9 +22,6 @@ const SubmitButton = ({ children }) => {
   return rowProps ? /* @__PURE__ */ jsx(FormSubmitRow, { ...rowProps, children }) : null;
 };
 const uiComponents = { SubmitButton };
-const formComponents = {
-  Label: ({ value }) => /* @__PURE__ */ jsx(Label, { className: "text-body-sm", children: value })
-};
 function DynamicForm({
   schema,
   onSubmit,
@@ -108,7 +104,6 @@ function DynamicForm({
       defaultValues: normalizedDefaultValues,
       formProps: { className, noValidate: true },
       uiComponents,
-      formComponents,
       withSubmit: true,
       readOnly,
       children

package/dist/lib/form/dynamic-form.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"dynamic-form.es.js","sources":["../../../src/lib/form/dynamic-form.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { createContext, useContext, useEffect, useLayoutEffect, useRef, useCallback, useMemo } from 'react';\nimport type { UseFormReturn } from 'react-hook-form';\nimport { z } from 'zod';\nimport { AutoForm } from './auto-form';\nimport { FormSubmitRow } from './components/form-submit-row';\nimport type { FormSubmitRowProps } from './components/form-submit-row';\nimport { ROOT_FIELD_KEY } from './field-context';\nimport { isEmptyZodObject } from './is-empty-zod-object';\nimport { CustomZodProvider } from './zod-provider';\nimport { getShape } from './zod-provider/compat';\nimport type { ButtonProps } from '@/ds/components/Button';\nimport { Label } from '@/ds/components/Label';\n\ninterface DynamicFormProps {\n  schema: any;\n  onSubmit?: (values: any) => void | Promise<void>;\n  onValuesChange?: (values: any) => void;\n  defaultValues?: any;\n  isSubmitLoading?: boolean;\n  submitButtonLabel?: string;\n  submitButtonIcon?: ReactNode;\n  submitButtonVariant?: ButtonProps['variant'];\n  submitButtonFullWidth?: boolean;\n  className?: string;\n  readOnly?: boolean;\n  children?: React.ReactNode;\n  submitActions?: React.ReactNode;\n  leftActions?: React.ReactNode;\n}\n\nfunction getFormInput(values: Record<string, unknown>, isWrapped: boolean) {\n  return isWrapped ? values[ROOT_FIELD_KEY] : values;\n}\n\nfunction normalizeSchema(schema: z.ZodType, isWrapped: boolean) {\n  if (isEmptyZodObject(schema)) return z.object({});\n  if (!isWrapped) return schema;\n  return z.object({ [ROOT_FIELD_KEY]: schema.description ? schema : schema.describe('Input') });\n}\n\nconst SubmitRowContext = createContext<FormSubmitRowProps | null>(null);\n\n// Defined once, outside any hook: AutoForm renders `uiComponents.SubmitButton` as a component\n// type, so recreating it per render would unmount and remount everything in `submitActions`.\nconst SubmitButton = ({ children }: { children: ReactNode }) => {\n  const rowProps = useContext(SubmitRowContext);\n  return rowProps ? <FormSubmitRow {...rowProps}>{children}</FormSubmitRow> : null;\n};\n\nconst uiComponents = { SubmitButton };\n\nconst formComponents = {\n  Label: ({ value }: { value: string }) => <Label className=\"text-body-sm\">{value}</Label>,\n};\n\nexport function DynamicForm({\n  schema,\n  onSubmit,\n  onValuesChange,\n  defaultValues,\n  isSubmitLoading,\n  submitButtonLabel,\n  submitButtonIcon,\n  submitButtonVariant,\n  submitButtonFullWidth,\n  className,\n  readOnly,\n  children,\n  submitActions,\n  leftActions,\n}: DynamicFormProps) {\n  const isWrapped = getShape(schema) === undefined;\n  const subscriptionRef = useRef<{ unsubscribe: () => void } | null>(null);\n  const onValuesChangeRef = useRef(onValuesChange);\n  useLayoutEffect(() => {\n    onValuesChangeRef.current = onValuesChange;\n  }, [onValuesChange]);\n\n  useEffect(() => () => subscriptionRef.current?.unsubscribe(), []);\n\n  const hasValuesListener = Boolean(onValuesChange);\n\n  const handleFormInit = useCallback(\n    (form: UseFormReturn<any>) => {\n      subscriptionRef.current?.unsubscribe();\n      subscriptionRef.current = null;\n\n      if (!hasValuesListener) return;\n\n      subscriptionRef.current = form.watch(values => onValuesChangeRef.current?.(getFormInput(values, isWrapped)));\n      onValuesChangeRef.current?.(getFormInput(form.getValues(), isWrapped));\n    },\n    [hasValuesListener, isWrapped],\n  );\n\n  const schemaProvider = useMemo(\n    () => (schema ? new CustomZodProvider(normalizeSchema(schema, isWrapped)) : null),\n    [schema, isWrapped],\n  );\n\n  const submitRow = useMemo<FormSubmitRowProps | null>(\n    () =>\n      onSubmit\n        ? {\n            isSubmitLoading,\n            submitButtonLabel,\n            submitButtonIcon,\n            submitButtonVariant,\n            submitButtonFullWidth,\n            submitActions,\n            leftActions,\n          }\n        : null,\n    [\n      onSubmit,\n      isSubmitLoading,\n      submitButtonLabel,\n      submitButtonIcon,\n      submitButtonVariant,\n      submitButtonFullWidth,\n      submitActions,\n      leftActions,\n    ],\n  );\n\n  const normalizedDefaultValues = useMemo(\n    () => (isWrapped ? (defaultValues === undefined ? undefined : { [ROOT_FIELD_KEY]: defaultValues }) : defaultValues),\n    [isWrapped, defaultValues],\n  );\n\n  const handleSubmit = useCallback(\n    async (values: any) => {\n      await onSubmit?.(getFormInput(values, isWrapped));\n    },\n    [onSubmit, isWrapped],\n  );\n\n  if (!schemaProvider) {\n    console.error('no form schema found');\n    return null;\n  }\n\n  return (\n    <SubmitRowContext.Provider value={submitRow}>\n      <AutoForm\n        schema={schemaProvider}\n        onSubmit={handleSubmit}\n        onFormInit={handleFormInit}\n        defaultValues={normalizedDefaultValues}\n        formProps={{ className, noValidate: true }}\n        uiComponents={uiComponents}\n        formComponents={formComponents}\n        withSubmit={true}\n        readOnly={readOnly}\n      >\n        {children}\n      </AutoForm>\n    </SubmitRowContext.Provider>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"dynamic-form.es.js","sources":["../../../src/lib/form/dynamic-form.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { createContext, useContext, useEffect, useLayoutEffect, useRef, useCallback, useMemo } from 'react';\nimport type { UseFormReturn } from 'react-hook-form';\nimport { z } from 'zod';\nimport { AutoForm } from './auto-form';\nimport { FormSubmitRow } from './components/form-submit-row';\nimport type { FormSubmitRowProps } from './components/form-submit-row';\nimport { ROOT_FIELD_KEY } from './field-context';\nimport { isEmptyZodObject } from './is-empty-zod-object';\nimport { CustomZodProvider } from './zod-provider';\nimport { getShape } from './zod-provider/compat';\nimport type { ButtonProps } from '@/ds/components/Button';\n\ninterface DynamicFormProps {\n  schema: any;\n  onSubmit?: (values: any) => void | Promise<void>;\n  onValuesChange?: (values: any) => void;\n  defaultValues?: any;\n  isSubmitLoading?: boolean;\n  submitButtonLabel?: string;\n  submitButtonIcon?: ReactNode;\n  submitButtonVariant?: ButtonProps['variant'];\n  submitButtonFullWidth?: boolean;\n  className?: string;\n  readOnly?: boolean;\n  children?: React.ReactNode;\n  submitActions?: React.ReactNode;\n  leftActions?: React.ReactNode;\n}\n\nfunction getFormInput(values: Record<string, unknown>, isWrapped: boolean) {\n  return isWrapped ? values[ROOT_FIELD_KEY] : values;\n}\n\nfunction normalizeSchema(schema: z.ZodType, isWrapped: boolean) {\n  if (isEmptyZodObject(schema)) return z.object({});\n  if (!isWrapped) return schema;\n  return z.object({ [ROOT_FIELD_KEY]: schema.description ? schema : schema.describe('Input') });\n}\n\nconst SubmitRowContext = createContext<FormSubmitRowProps | null>(null);\n\n// Defined once, outside any hook: AutoForm renders `uiComponents.SubmitButton` as a component\n// type, so recreating it per render would unmount and remount everything in `submitActions`.\nconst SubmitButton = ({ children }: { children: ReactNode }) => {\n  const rowProps = useContext(SubmitRowContext);\n  return rowProps ? <FormSubmitRow {...rowProps}>{children}</FormSubmitRow> : null;\n};\n\nconst uiComponents = { SubmitButton };\n\nexport function DynamicForm({\n  schema,\n  onSubmit,\n  onValuesChange,\n  defaultValues,\n  isSubmitLoading,\n  submitButtonLabel,\n  submitButtonIcon,\n  submitButtonVariant,\n  submitButtonFullWidth,\n  className,\n  readOnly,\n  children,\n  submitActions,\n  leftActions,\n}: DynamicFormProps) {\n  const isWrapped = getShape(schema) === undefined;\n  const subscriptionRef = useRef<{ unsubscribe: () => void } | null>(null);\n  const onValuesChangeRef = useRef(onValuesChange);\n  useLayoutEffect(() => {\n    onValuesChangeRef.current = onValuesChange;\n  }, [onValuesChange]);\n\n  useEffect(() => () => subscriptionRef.current?.unsubscribe(), []);\n\n  const hasValuesListener = Boolean(onValuesChange);\n\n  const handleFormInit = useCallback(\n    (form: UseFormReturn<any>) => {\n      subscriptionRef.current?.unsubscribe();\n      subscriptionRef.current = null;\n\n      if (!hasValuesListener) return;\n\n      subscriptionRef.current = form.watch(values => onValuesChangeRef.current?.(getFormInput(values, isWrapped)));\n      onValuesChangeRef.current?.(getFormInput(form.getValues(), isWrapped));\n    },\n    [hasValuesListener, isWrapped],\n  );\n\n  const schemaProvider = useMemo(\n    () => (schema ? new CustomZodProvider(normalizeSchema(schema, isWrapped)) : null),\n    [schema, isWrapped],\n  );\n\n  const submitRow = useMemo<FormSubmitRowProps | null>(\n    () =>\n      onSubmit\n        ? {\n            isSubmitLoading,\n            submitButtonLabel,\n            submitButtonIcon,\n            submitButtonVariant,\n            submitButtonFullWidth,\n            submitActions,\n            leftActions,\n          }\n        : null,\n    [\n      onSubmit,\n      isSubmitLoading,\n      submitButtonLabel,\n      submitButtonIcon,\n      submitButtonVariant,\n      submitButtonFullWidth,\n      submitActions,\n      leftActions,\n    ],\n  );\n\n  const normalizedDefaultValues = useMemo(\n    () => (isWrapped ? (defaultValues === undefined ? undefined : { [ROOT_FIELD_KEY]: defaultValues }) : defaultValues),\n    [isWrapped, defaultValues],\n  );\n\n  const handleSubmit = useCallback(\n    async (values: any) => {\n      await onSubmit?.(getFormInput(values, isWrapped));\n    },\n    [onSubmit, isWrapped],\n  );\n\n  if (!schemaProvider) {\n    console.error('no form schema found');\n    return null;\n  }\n\n  return (\n    <SubmitRowContext.Provider value={submitRow}>\n      <AutoForm\n        schema={schemaProvider}\n        onSubmit={handleSubmit}\n        onFormInit={handleFormInit}\n        defaultValues={normalizedDefaultValues}\n        formProps={{ className, noValidate: true }}\n        uiComponents={uiComponents}\n        withSubmit={true}\n        readOnly={readOnly}\n      >\n        {children}\n      </AutoForm>\n    </SubmitRowContext.Provider>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/{list-search-BzAIj0DB.cjs → list-search-CTGQJCh1.cjs}

@@ -3,7 +3,7 @@
 const jsxRuntime = require('react/jsx-runtime');
 const React = require('react');
 const useDebounce = require('use-debounce');
-const searchFieldBlock = require('./search-field-block-DRa-ZNQj.cjs');
+const searchInput = require('./search-input-T0orZ7Jf.cjs');
 const keyboard_useKeydown = require('./keyboard/use-keydown.cjs.js');
 require('./keyboard/keyboard-shortcuts-context.cjs.js');
 
@@ -16,7 +16,6 @@ const ListSearch = ({
   value: controlledValue,
   shortcutDisabled = false
 }) => {
-  const id = React.useId();
   const [internalValue, setInternalValue] = React.useState(controlledValue ?? "");
   const inputRef = React.useRef(null);
   keyboard_useKeydown.useKeydown(
@@ -38,34 +37,28 @@ const ListSearch = ({
     }
   }, [controlledValue, debouncedSearch]);
   React.useEffect(() => () => debouncedSearch.cancel(), [debouncedSearch]);
-  const handleChange = React.useCallback(
-    (e) => {
-      setInternalValue(e.target.value);
-      debouncedSearch(e.target.value);
-    },
-    [debouncedSearch]
-  );
-  const handleReset = React.useCallback(() => {
-    setInternalValue("");
-    onSearch("");
+  const searchNowOrDebounced = (next) => {
+    setInternalValue(next);
+    if (next) {
+      debouncedSearch(next);
+      return;
+    }
     debouncedSearch.cancel();
-  }, [onSearch, debouncedSearch]);
+    onSearch("");
+  };
   return /* @__PURE__ */ jsxRuntime.jsx(
-    searchFieldBlock.SearchFieldBlock,
+    searchInput.SearchInput,
     {
-      name: id,
+      ref: inputRef,
       label,
-      labelIsHidden: true,
       placeholder,
-      value: internalValue,
-      onChange: handleChange,
-      onReset: handleReset,
       size,
-      inputRef,
+      value: internalValue,
+      onValueChange: searchNowOrDebounced,
       className: "w-full max-w-120"
     }
   );
 };
 
 exports.ListSearch = ListSearch;
-//# sourceMappingURL=list-search-BzAIj0DB.cjs.map
+//# sourceMappingURL=list-search-CTGQJCh1.cjs.map