@j2-health/design-system 0.3.2 → 0.4.0

package/README.md

@@ -107,29 +107,62 @@ the repo root; submodule consumers should alias `design-system` to that file
 explicitly, since the package.json `exports` map points at `dist/`, which only
 exists in the published package.
 
+### Migrating to 0.4.0 (Ant Design 6)
+
+Version 0.4.0 requires **antd ^6.6.3** and **@ant-design/icons ^6.3.4**. Upgrade
+both with the design system; Ant Design 5 is no longer supported. React 18.3.1
+and React 19 remain supported, and Tailwind stays on v3. Ant Design 6 requires
+modern browsers with CSS-variable support.
+
+```bash
+npm install @j2-health/design-system@^0.4.0 antd@^6.6.3 @ant-design/icons@^6.3.4
+```
+
+`formik-antd` is no longer a dependency: its published peer range excludes Ant
+Design 6. The design system's `Form`, `Form.Item`, `Input`, `InputNumber`, and
+`Select` now bind directly to Formik. Keep these components inside a `<Formik>`
+provider. Nested field names, validation, touched state, submission, reset, and
+field callbacks continue to use Formik.
+
+If your application imports `formik-antd` directly, migrate those imports before
+uninstalling it. Use the design-system exports for the components above; other
+controls need an explicit Formik binding. `Form.Item` validation should use
+Formik's `validate` or `validationSchema`, rather than antd's separate form
+store and `rules` API.
+
+Review direct antd imports and custom `.ant-*` CSS using the
+[Ant Design 6 migration guide](https://ant.design/docs/react/migration-v6).
+Several internal DOM classes changed. For types, derive step items from
+`NonNullable<StepsProps['items']>[number]` instead of the removed `StepProps`
+export. The design-system `Tag` retains its outlined default and trailing
+spacing; raw antd tags follow the new v6 defaults.
+
 ### Local development against a consuming app
 
-To work on a component and see it live in an app that depends on this package, point the
-app's bundler at this checkout's source rather than linking the built package. Consuming
-apps support this through a `DESIGN_SYSTEM_LOCAL` environment variable:
+To work on a component and see it live in an app that depends on this package,
+point the app's bundler at this checkout's source rather than linking the built
+package. Consuming apps support this through a `DESIGN_SYSTEM_LOCAL` environment
+variable:
 
 ```bash
 DESIGN_SYSTEM_LOCAL=/path/to/design-system npm run dev
 ```
 
-**Do not use `npm link` or `npm install ../design-system`.** This package declares 12 peer
-dependencies that are also devDependencies, because Storybook and the test suite need them
-to run. A linked install resolves those imports from this checkout's own `node_modules`
-rather than the app's, so the app ends up with two copies of React and two copies of antd.
+**Do not use `npm link` or `npm install ../design-system`.** This package
+declares peer dependencies that are also devDependencies, because Storybook and
+the test suite need them to run. A linked install resolves those imports from
+this checkout's own `node_modules` rather than the app's, so the app ends up
+with two copies of React and two copies of antd.
 
-Two copies of React raise `Invalid hook call`, which is at least obvious. Two copies of antd
-fail silently: `AppConfigProvider` supplies the theme through antd's `ConfigProvider`, a
-React context singleton, so a component resolved from the second copy reads an empty context
-and renders unthemed with no error and no warning. Because it only reproduces under a linked
-install, it looks like a bug in this library that disappears the moment you publish.
+Two copies of React raise `Invalid hook call`, which is at least obvious. Two
+copies of antd fail silently: `AppConfigProvider` supplies the theme through
+antd's `ConfigProvider`, a React context singleton, so a component resolved from
+the second copy reads an empty context and renders unthemed with no error and no
+warning. Because it only reproduces under a linked install, it looks like a bug
+in this library that disappears the moment you publish.
 
-Consuming apps must also set `resolve.dedupe` for `react`, `react-dom`, and `antd`, since a
-local checkout has its own `node_modules`.
+Consuming apps must also set `resolve.dedupe` for `react`, `react-dom`, and
+`antd`, since a local checkout has its own `node_modules`.
 
 ### Publishing to npm
 
@@ -144,9 +177,9 @@ consequences worth knowing before you change anything here:
 - **Renaming or moving `publish-workflow.yml` breaks publishing.** The trusted
   publisher is matched on the exact filename, case-sensitive. Update it on
   npmjs.com in the same change.
-- **Do not lower `.node-version` below 24.5.0.** Trusted publishing needs
-  npm >= 11.5.1, which is exactly what Node 24.5.0 ships. The workflow asserts
-  this rather than letting it surface later as an unexplained 401.
+- **Do not lower `.node-version` below 24.5.0.** Trusted publishing needs npm >=
+  11.5.1, which is exactly what Node 24.5.0 ships. The workflow asserts this
+  rather than letting it surface later as an unexplained 401.
 
 To release a new version — maintainers only, since step 2 needs write access to
 this repository:
@@ -160,7 +193,7 @@ $ gh workflow run publish-workflow.yml --ref main
 ```
 
 Or, in the UI, **Actions → Publish to npm → Run workflow** with `main` selected.
-Pick the ref carefully: the publish job is *skipped* rather than failed on any
+Pick the ref carefully: the publish job is _skipped_ rather than failed on any
 other ref, so a dispatch from a feature branch reports success without
 publishing.
 
@@ -176,8 +209,8 @@ nowhere to push to.
 Pushing a `v*` tag also triggers a release. Tag the remote `main` commit
 explicitly: a bare `git tag` tags your current `HEAD`, and the workflow accepts
 any tag ref, so a tag on an unmerged branch would publish that branch. Push the
-tag explicitly too — `git push --follow-tags` silently skips lightweight tags and
-would report success without publishing:
+tag explicitly too — `git push --follow-tags` silently skips lightweight tags
+and would report success without publishing:
 
 ```bash
 $ git fetch origin main

package/dist/src/components/alert/Alert.cjs

@@ -28,6 +28,12 @@ const Alert = ({
   closable = false,
   showIcon = true,
   banner = false,
+  message,
+  title,
+  closeIcon,
+  closeText,
+  onClose,
+  afterClose,
   ...props
 }) => {
   const { token } = antd.theme.useToken();
@@ -81,12 +87,16 @@ const Alert = ({
     {
       className: Alert_module.default.alert,
       icon,
-      closable,
+      closable: closable || closeText ? {
+        closeIcon: closeText || (closeIcon ?? /* @__PURE__ */ jsxRuntime.jsx(react.XIcon, { size: token.size, weight: "regular" })),
+        onClose,
+        afterClose
+      } : false,
       showIcon,
       type: antDType,
       banner,
       description,
-      closeIcon: /* @__PURE__ */ jsxRuntime.jsx(react.XIcon, { size: token.size, weight: "regular" }),
+      title: title ?? message,
       ...props
     }
   );

package/dist/src/components/alert/Alert.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.cjs","sources":["../../../../src/components/alert/Alert.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Alert as AntdAlert, AlertProps, theme } from 'antd'\nimport {\n  CheckCircleIcon,\n  InfoIcon,\n  WarningCircleIcon,\n  XIcon,\n  XCircleIcon,\n  CircleNotchIcon,\n} from '@phosphor-icons/react'\nimport styles from './Alert.module.css'\ntype Props = Expand<Omit<AlertProps, 'type'>> & {\n  description?: string\n  type: 'success' | 'info' | 'warning' | 'error' | 'loading'\n  closable?: boolean\n  showIcon?: boolean\n  banner?: boolean\n}\n\nconst Alert = ({\n  description,\n  type,\n  closable = false,\n  showIcon = true,\n  banner = false,\n  ...props\n}: Props) => {\n  const { token } = theme.useToken()\n  const icon = React.useMemo(() => {\n    const size = description ? token.sizeLG : token.size\n    const iconStyle = !description\n      ? { display: 'flex', alignItems: 'center' }\n      : undefined\n\n    const iconElement = (() => {\n      switch (type) {\n        case 'success':\n          return (\n            <CheckCircleIcon fill=\"var(--j2-color-success-text)\" size={size} />\n          )\n        case 'error':\n          return <XCircleIcon fill=\"var(--j2-color-error-text)\" size={size} />\n        case 'info':\n          return <InfoIcon fill=\"var(--j2-color-info-text)\" size={size} />\n        case 'warning':\n          return (\n            <WarningCircleIcon\n              fill=\"var(--j2-color-warning-text)\"\n              size={size}\n            />\n          )\n        case 'loading':\n          return (\n            <CircleNotchIcon\n              fill=\"var(--j2-color-info-text)\"\n              size={size}\n              weight=\"regular\"\n              style={{\n                animation: 'spin 1s linear infinite',\n              }}\n            />\n          )\n        default:\n          return null\n      }\n    })()\n\n    return iconStyle ? (\n      <span style={iconStyle}>{iconElement}</span>\n    ) : (\n      iconElement\n    )\n  }, [type, description, token.size, token.sizeLG])\n\n  const antDType = React.useMemo(():\n    'success' | 'info' | 'warning' | 'error' => {\n    switch (type) {\n      case 'loading':\n        return 'info'\n      default:\n        return type as 'success' | 'info' | 'warning' | 'error'\n    }\n  }, [type])\n\n  return (\n    <AntdAlert\n      className={styles.alert}\n      icon={icon}\n      closable={closable}\n      showIcon={showIcon}\n      type={antDType}\n      banner={banner}\n      description={description}\n      closeIcon={<XIcon size={token.size} weight=\"regular\" />}\n      {...props}\n    />\n  )\n}\n\nexport { Alert }\n"],"names":["theme","React","jsx","CheckCircleIcon","XCircleIcon","InfoIcon","WarningCircleIcon","CircleNotchIcon","AntdAlert","styles","XIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAmBA,MAAM,QAAQ,CAAC;AAAA,EACb;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,WAAW;AAAA,EACX,SAAS;AAAA,EACT,GAAG;AACL,MAAa;AACX,QAAM,EAAE,MAAA,IAAUA,KAAAA,MAAM,SAAA;AACxB,QAAM,OAAOC,iBAAM,QAAQ,MAAM;AAC/B,UAAM,OAAO,cAAc,MAAM,SAAS,MAAM;AAChD,UAAM,YAAY,CAAC,cACf,EAAE,SAAS,QAAQ,YAAY,aAC/B;AAEJ,UAAM,eAAe,MAAM;AACzB,cAAQ,MAAA;AAAA,QACN,KAAK;AACH,iBACEC,2BAAAA,IAACC,MAAAA,iBAAA,EAAgB,MAAK,gCAA+B,KAAA,CAAY;AAAA,QAErE,KAAK;AACH,iBAAOD,2BAAAA,IAACE,MAAAA,aAAA,EAAY,MAAK,8BAA6B,KAAA,CAAY;AAAA,QACpE,KAAK;AACH,iBAAOF,2BAAAA,IAACG,MAAAA,UAAA,EAAS,MAAK,6BAA4B,KAAA,CAAY;AAAA,QAChE,KAAK;AACH,iBACEH,2BAAAA;AAAAA,YAACI,MAAAA;AAAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL;AAAA,YAAA;AAAA,UAAA;AAAA,QAGN,KAAK;AACH,iBACEJ,2BAAAA;AAAAA,YAACK,MAAAA;AAAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL;AAAA,cACA,QAAO;AAAA,cACP,OAAO;AAAA,gBACL,WAAW;AAAA,cAAA;AAAA,YACb;AAAA,UAAA;AAAA,QAGN;AACE,iBAAO;AAAA,MAAA;AAAA,IAEb,GAAA;AAEA,WAAO,YACLL,+BAAC,QAAA,EAAK,OAAO,WAAY,uBAAY,IAErC;AAAA,EAEJ,GAAG,CAAC,MAAM,aAAa,MAAM,MAAM,MAAM,MAAM,CAAC;AAEhD,QAAM,WAAWD,iBAAM,QAAQ,MACe;AAC5C,YAAQ,MAAA;AAAA,MACN,KAAK;AACH,eAAO;AAAA,MACT;AACE,eAAO;AAAA,IAAA;AAAA,EAEb,GAAG,CAAC,IAAI,CAAC;AAET,SACEC,2BAAAA;AAAAA,IAACM,KAAAA;AAAAA,IAAA;AAAA,MACC,WAAWC,aAAAA,QAAO;AAAA,MAClB;AAAA,MACA;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA,WAAWP,2BAAAA,IAACQ,MAAAA,OAAA,EAAM,MAAM,MAAM,MAAM,QAAO,WAAU;AAAA,MACpD,GAAG;AAAA,IAAA;AAAA,EAAA;AAGV;;"}
+{"version":3,"file":"Alert.cjs","sources":["../../../../src/components/alert/Alert.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Alert as AntdAlert, AlertProps, theme } from 'antd'\nimport {\n  CheckCircleIcon,\n  InfoIcon,\n  WarningCircleIcon,\n  XIcon,\n  XCircleIcon,\n  CircleNotchIcon,\n} from '@phosphor-icons/react'\nimport styles from './Alert.module.css'\ntype Props = Expand<Omit<AlertProps, 'type'>> & {\n  description?: string\n  type: 'success' | 'info' | 'warning' | 'error' | 'loading'\n  closable?: boolean\n  showIcon?: boolean\n  banner?: boolean\n}\n\nconst Alert = ({\n  description,\n  type,\n  closable = false,\n  showIcon = true,\n  banner = false,\n  message,\n  title,\n  closeIcon,\n  closeText,\n  onClose,\n  afterClose,\n  ...props\n}: Props) => {\n  const { token } = theme.useToken()\n  const icon = React.useMemo(() => {\n    const size = description ? token.sizeLG : token.size\n    const iconStyle = !description\n      ? { display: 'flex', alignItems: 'center' }\n      : undefined\n\n    const iconElement = (() => {\n      switch (type) {\n        case 'success':\n          return (\n            <CheckCircleIcon fill=\"var(--j2-color-success-text)\" size={size} />\n          )\n        case 'error':\n          return <XCircleIcon fill=\"var(--j2-color-error-text)\" size={size} />\n        case 'info':\n          return <InfoIcon fill=\"var(--j2-color-info-text)\" size={size} />\n        case 'warning':\n          return (\n            <WarningCircleIcon\n              fill=\"var(--j2-color-warning-text)\"\n              size={size}\n            />\n          )\n        case 'loading':\n          return (\n            <CircleNotchIcon\n              fill=\"var(--j2-color-info-text)\"\n              size={size}\n              weight=\"regular\"\n              style={{\n                animation: 'spin 1s linear infinite',\n              }}\n            />\n          )\n        default:\n          return null\n      }\n    })()\n\n    return iconStyle ? (\n      <span style={iconStyle}>{iconElement}</span>\n    ) : (\n      iconElement\n    )\n  }, [type, description, token.size, token.sizeLG])\n\n  const antDType = React.useMemo(():\n    'success' | 'info' | 'warning' | 'error' => {\n    switch (type) {\n      case 'loading':\n        return 'info'\n      default:\n        return type as 'success' | 'info' | 'warning' | 'error'\n    }\n  }, [type])\n\n  return (\n    <AntdAlert\n      className={styles.alert}\n      icon={icon}\n      closable={\n        closable || closeText\n          ? {\n              closeIcon:\n                closeText ||\n                (closeIcon ?? <XIcon size={token.size} weight=\"regular\" />),\n              onClose,\n              afterClose,\n            }\n          : false\n      }\n      showIcon={showIcon}\n      type={antDType}\n      banner={banner}\n      description={description}\n      title={title ?? message}\n      {...props}\n    />\n  )\n}\n\nexport { Alert }\n"],"names":["theme","React","jsx","CheckCircleIcon","XCircleIcon","InfoIcon","WarningCircleIcon","CircleNotchIcon","AntdAlert","styles","XIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAmBA,MAAM,QAAQ,CAAC;AAAA,EACb;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,WAAW;AAAA,EACX,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAa;AACX,QAAM,EAAE,MAAA,IAAUA,KAAAA,MAAM,SAAA;AACxB,QAAM,OAAOC,iBAAM,QAAQ,MAAM;AAC/B,UAAM,OAAO,cAAc,MAAM,SAAS,MAAM;AAChD,UAAM,YAAY,CAAC,cACf,EAAE,SAAS,QAAQ,YAAY,aAC/B;AAEJ,UAAM,eAAe,MAAM;AACzB,cAAQ,MAAA;AAAA,QACN,KAAK;AACH,iBACEC,2BAAAA,IAACC,MAAAA,iBAAA,EAAgB,MAAK,gCAA+B,KAAA,CAAY;AAAA,QAErE,KAAK;AACH,iBAAOD,2BAAAA,IAACE,MAAAA,aAAA,EAAY,MAAK,8BAA6B,KAAA,CAAY;AAAA,QACpE,KAAK;AACH,iBAAOF,2BAAAA,IAACG,MAAAA,UAAA,EAAS,MAAK,6BAA4B,KAAA,CAAY;AAAA,QAChE,KAAK;AACH,iBACEH,2BAAAA;AAAAA,YAACI,MAAAA;AAAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL;AAAA,YAAA;AAAA,UAAA;AAAA,QAGN,KAAK;AACH,iBACEJ,2BAAAA;AAAAA,YAACK,MAAAA;AAAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL;AAAA,cACA,QAAO;AAAA,cACP,OAAO;AAAA,gBACL,WAAW;AAAA,cAAA;AAAA,YACb;AAAA,UAAA;AAAA,QAGN;AACE,iBAAO;AAAA,MAAA;AAAA,IAEb,GAAA;AAEA,WAAO,YACLL,+BAAC,QAAA,EAAK,OAAO,WAAY,uBAAY,IAErC;AAAA,EAEJ,GAAG,CAAC,MAAM,aAAa,MAAM,MAAM,MAAM,MAAM,CAAC;AAEhD,QAAM,WAAWD,iBAAM,QAAQ,MACe;AAC5C,YAAQ,MAAA;AAAA,MACN,KAAK;AACH,eAAO;AAAA,MACT;AACE,eAAO;AAAA,IAAA;AAAA,EAEb,GAAG,CAAC,IAAI,CAAC;AAET,SACEC,2BAAAA;AAAAA,IAACM,KAAAA;AAAAA,IAAA;AAAA,MACC,WAAWC,aAAAA,QAAO;AAAA,MAClB;AAAA,MACA,UACE,YAAY,YACR;AAAA,QACE,WACE,cACC,aAAaP,2BAAAA,IAACQ,MAAAA,SAAM,MAAM,MAAM,MAAM,QAAO,UAAA,CAAU;AAAA,QAC1D;AAAA,QACA;AAAA,MAAA,IAEF;AAAA,MAEN;AAAA,MACA,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA,OAAO,SAAS;AAAA,MACf,GAAG;AAAA,IAAA;AAAA,EAAA;AAGV;;"}

package/dist/src/components/alert/Alert.d.ts

@@ -7,5 +7,5 @@ type Props = Expand<Omit<AlertProps, 'type'>> & {
     showIcon?: boolean;
     banner?: boolean;
 };
-declare const Alert: ({ description, type, closable, showIcon, banner, ...props }: Props) => React.JSX.Element;
+declare const Alert: ({ description, type, closable, showIcon, banner, message, title, closeIcon, closeText, onClose, afterClose, ...props }: Props) => React.JSX.Element;
 export { Alert };

package/dist/src/components/alert/Alert.js

@@ -9,6 +9,12 @@ const Alert = ({
   closable = false,
   showIcon = true,
   banner = false,
+  message,
+  title,
+  closeIcon,
+  closeText,
+  onClose,
+  afterClose,
   ...props
 }) => {
   const { token } = theme.useToken();
@@ -62,12 +68,16 @@ const Alert = ({
     {
       className: styles.alert,
       icon,
-      closable,
+      closable: closable || closeText ? {
+        closeIcon: closeText || (closeIcon ?? /* @__PURE__ */ jsx(XIcon, { size: token.size, weight: "regular" })),
+        onClose,
+        afterClose
+      } : false,
       showIcon,
       type: antDType,
       banner,
       description,
-      closeIcon: /* @__PURE__ */ jsx(XIcon, { size: token.size, weight: "regular" }),
+      title: title ?? message,
       ...props
     }
   );

package/dist/src/components/alert/Alert.js.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.js","sources":["../../../../src/components/alert/Alert.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Alert as AntdAlert, AlertProps, theme } from 'antd'\nimport {\n  CheckCircleIcon,\n  InfoIcon,\n  WarningCircleIcon,\n  XIcon,\n  XCircleIcon,\n  CircleNotchIcon,\n} from '@phosphor-icons/react'\nimport styles from './Alert.module.css'\ntype Props = Expand<Omit<AlertProps, 'type'>> & {\n  description?: string\n  type: 'success' | 'info' | 'warning' | 'error' | 'loading'\n  closable?: boolean\n  showIcon?: boolean\n  banner?: boolean\n}\n\nconst Alert = ({\n  description,\n  type,\n  closable = false,\n  showIcon = true,\n  banner = false,\n  ...props\n}: Props) => {\n  const { token } = theme.useToken()\n  const icon = React.useMemo(() => {\n    const size = description ? token.sizeLG : token.size\n    const iconStyle = !description\n      ? { display: 'flex', alignItems: 'center' }\n      : undefined\n\n    const iconElement = (() => {\n      switch (type) {\n        case 'success':\n          return (\n            <CheckCircleIcon fill=\"var(--j2-color-success-text)\" size={size} />\n          )\n        case 'error':\n          return <XCircleIcon fill=\"var(--j2-color-error-text)\" size={size} />\n        case 'info':\n          return <InfoIcon fill=\"var(--j2-color-info-text)\" size={size} />\n        case 'warning':\n          return (\n            <WarningCircleIcon\n              fill=\"var(--j2-color-warning-text)\"\n              size={size}\n            />\n          )\n        case 'loading':\n          return (\n            <CircleNotchIcon\n              fill=\"var(--j2-color-info-text)\"\n              size={size}\n              weight=\"regular\"\n              style={{\n                animation: 'spin 1s linear infinite',\n              }}\n            />\n          )\n        default:\n          return null\n      }\n    })()\n\n    return iconStyle ? (\n      <span style={iconStyle}>{iconElement}</span>\n    ) : (\n      iconElement\n    )\n  }, [type, description, token.size, token.sizeLG])\n\n  const antDType = React.useMemo(():\n    'success' | 'info' | 'warning' | 'error' => {\n    switch (type) {\n      case 'loading':\n        return 'info'\n      default:\n        return type as 'success' | 'info' | 'warning' | 'error'\n    }\n  }, [type])\n\n  return (\n    <AntdAlert\n      className={styles.alert}\n      icon={icon}\n      closable={closable}\n      showIcon={showIcon}\n      type={antDType}\n      banner={banner}\n      description={description}\n      closeIcon={<XIcon size={token.size} weight=\"regular\" />}\n      {...props}\n    />\n  )\n}\n\nexport { Alert }\n"],"names":["AntdAlert"],"mappings":";;;;;AAmBA,MAAM,QAAQ,CAAC;AAAA,EACb;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,WAAW;AAAA,EACX,SAAS;AAAA,EACT,GAAG;AACL,MAAa;AACX,QAAM,EAAE,MAAA,IAAU,MAAM,SAAA;AACxB,QAAM,OAAO,MAAM,QAAQ,MAAM;AAC/B,UAAM,OAAO,cAAc,MAAM,SAAS,MAAM;AAChD,UAAM,YAAY,CAAC,cACf,EAAE,SAAS,QAAQ,YAAY,aAC/B;AAEJ,UAAM,eAAe,MAAM;AACzB,cAAQ,MAAA;AAAA,QACN,KAAK;AACH,iBACE,oBAAC,iBAAA,EAAgB,MAAK,gCAA+B,KAAA,CAAY;AAAA,QAErE,KAAK;AACH,iBAAO,oBAAC,aAAA,EAAY,MAAK,8BAA6B,KAAA,CAAY;AAAA,QACpE,KAAK;AACH,iBAAO,oBAAC,UAAA,EAAS,MAAK,6BAA4B,KAAA,CAAY;AAAA,QAChE,KAAK;AACH,iBACE;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL;AAAA,YAAA;AAAA,UAAA;AAAA,QAGN,KAAK;AACH,iBACE;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL;AAAA,cACA,QAAO;AAAA,cACP,OAAO;AAAA,gBACL,WAAW;AAAA,cAAA;AAAA,YACb;AAAA,UAAA;AAAA,QAGN;AACE,iBAAO;AAAA,MAAA;AAAA,IAEb,GAAA;AAEA,WAAO,YACL,oBAAC,QAAA,EAAK,OAAO,WAAY,uBAAY,IAErC;AAAA,EAEJ,GAAG,CAAC,MAAM,aAAa,MAAM,MAAM,MAAM,MAAM,CAAC;AAEhD,QAAM,WAAW,MAAM,QAAQ,MACe;AAC5C,YAAQ,MAAA;AAAA,MACN,KAAK;AACH,eAAO;AAAA,MACT;AACE,eAAO;AAAA,IAAA;AAAA,EAEb,GAAG,CAAC,IAAI,CAAC;AAET,SACE;AAAA,IAACA;AAAAA,IAAA;AAAA,MACC,WAAW,OAAO;AAAA,MAClB;AAAA,MACA;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA,WAAW,oBAAC,OAAA,EAAM,MAAM,MAAM,MAAM,QAAO,WAAU;AAAA,MACpD,GAAG;AAAA,IAAA;AAAA,EAAA;AAGV;"}
+{"version":3,"file":"Alert.js","sources":["../../../../src/components/alert/Alert.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Alert as AntdAlert, AlertProps, theme } from 'antd'\nimport {\n  CheckCircleIcon,\n  InfoIcon,\n  WarningCircleIcon,\n  XIcon,\n  XCircleIcon,\n  CircleNotchIcon,\n} from '@phosphor-icons/react'\nimport styles from './Alert.module.css'\ntype Props = Expand<Omit<AlertProps, 'type'>> & {\n  description?: string\n  type: 'success' | 'info' | 'warning' | 'error' | 'loading'\n  closable?: boolean\n  showIcon?: boolean\n  banner?: boolean\n}\n\nconst Alert = ({\n  description,\n  type,\n  closable = false,\n  showIcon = true,\n  banner = false,\n  message,\n  title,\n  closeIcon,\n  closeText,\n  onClose,\n  afterClose,\n  ...props\n}: Props) => {\n  const { token } = theme.useToken()\n  const icon = React.useMemo(() => {\n    const size = description ? token.sizeLG : token.size\n    const iconStyle = !description\n      ? { display: 'flex', alignItems: 'center' }\n      : undefined\n\n    const iconElement = (() => {\n      switch (type) {\n        case 'success':\n          return (\n            <CheckCircleIcon fill=\"var(--j2-color-success-text)\" size={size} />\n          )\n        case 'error':\n          return <XCircleIcon fill=\"var(--j2-color-error-text)\" size={size} />\n        case 'info':\n          return <InfoIcon fill=\"var(--j2-color-info-text)\" size={size} />\n        case 'warning':\n          return (\n            <WarningCircleIcon\n              fill=\"var(--j2-color-warning-text)\"\n              size={size}\n            />\n          )\n        case 'loading':\n          return (\n            <CircleNotchIcon\n              fill=\"var(--j2-color-info-text)\"\n              size={size}\n              weight=\"regular\"\n              style={{\n                animation: 'spin 1s linear infinite',\n              }}\n            />\n          )\n        default:\n          return null\n      }\n    })()\n\n    return iconStyle ? (\n      <span style={iconStyle}>{iconElement}</span>\n    ) : (\n      iconElement\n    )\n  }, [type, description, token.size, token.sizeLG])\n\n  const antDType = React.useMemo(():\n    'success' | 'info' | 'warning' | 'error' => {\n    switch (type) {\n      case 'loading':\n        return 'info'\n      default:\n        return type as 'success' | 'info' | 'warning' | 'error'\n    }\n  }, [type])\n\n  return (\n    <AntdAlert\n      className={styles.alert}\n      icon={icon}\n      closable={\n        closable || closeText\n          ? {\n              closeIcon:\n                closeText ||\n                (closeIcon ?? <XIcon size={token.size} weight=\"regular\" />),\n              onClose,\n              afterClose,\n            }\n          : false\n      }\n      showIcon={showIcon}\n      type={antDType}\n      banner={banner}\n      description={description}\n      title={title ?? message}\n      {...props}\n    />\n  )\n}\n\nexport { Alert }\n"],"names":["AntdAlert"],"mappings":";;;;;AAmBA,MAAM,QAAQ,CAAC;AAAA,EACb;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,WAAW;AAAA,EACX,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAa;AACX,QAAM,EAAE,MAAA,IAAU,MAAM,SAAA;AACxB,QAAM,OAAO,MAAM,QAAQ,MAAM;AAC/B,UAAM,OAAO,cAAc,MAAM,SAAS,MAAM;AAChD,UAAM,YAAY,CAAC,cACf,EAAE,SAAS,QAAQ,YAAY,aAC/B;AAEJ,UAAM,eAAe,MAAM;AACzB,cAAQ,MAAA;AAAA,QACN,KAAK;AACH,iBACE,oBAAC,iBAAA,EAAgB,MAAK,gCAA+B,KAAA,CAAY;AAAA,QAErE,KAAK;AACH,iBAAO,oBAAC,aAAA,EAAY,MAAK,8BAA6B,KAAA,CAAY;AAAA,QACpE,KAAK;AACH,iBAAO,oBAAC,UAAA,EAAS,MAAK,6BAA4B,KAAA,CAAY;AAAA,QAChE,KAAK;AACH,iBACE;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL;AAAA,YAAA;AAAA,UAAA;AAAA,QAGN,KAAK;AACH,iBACE;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL;AAAA,cACA,QAAO;AAAA,cACP,OAAO;AAAA,gBACL,WAAW;AAAA,cAAA;AAAA,YACb;AAAA,UAAA;AAAA,QAGN;AACE,iBAAO;AAAA,MAAA;AAAA,IAEb,GAAA;AAEA,WAAO,YACL,oBAAC,QAAA,EAAK,OAAO,WAAY,uBAAY,IAErC;AAAA,EAEJ,GAAG,CAAC,MAAM,aAAa,MAAM,MAAM,MAAM,MAAM,CAAC;AAEhD,QAAM,WAAW,MAAM,QAAQ,MACe;AAC5C,YAAQ,MAAA;AAAA,MACN,KAAK;AACH,eAAO;AAAA,MACT;AACE,eAAO;AAAA,IAAA;AAAA,EAEb,GAAG,CAAC,IAAI,CAAC;AAET,SACE;AAAA,IAACA;AAAAA,IAAA;AAAA,MACC,WAAW,OAAO;AAAA,MAClB;AAAA,MACA,UACE,YAAY,YACR;AAAA,QACE,WACE,cACC,aAAa,oBAAC,SAAM,MAAM,MAAM,MAAM,QAAO,UAAA,CAAU;AAAA,QAC1D;AAAA,QACA;AAAA,MAAA,IAEF;AAAA,MAEN;AAAA,MACA,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA,OAAO,SAAS;AAAA,MACf,GAAG;AAAA,IAAA;AAAA,EAAA;AAGV;"}

package/dist/src/components/alert/Alert.module.css.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const alert = "_alert_1yhxg_2";
+const alert = "_alert_iflcw_2";
 const styles = {
   alert
 };

package/dist/src/components/alert/Alert.module.css.js

@@ -1,4 +1,4 @@
-const alert = "_alert_1yhxg_2";
+const alert = "_alert_iflcw_2";
 const styles = {
   alert
 };

package/dist/src/components/card/Card.cjs

@@ -25,7 +25,7 @@ const Card = ({
         className
       ),
       ...props,
-      size: size === "large" || size === "compact" ? "default" : size,
+      size: size === "small" ? "small" : "medium",
       title,
       loading,
       children

package/dist/src/components/card/Card.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Card.cjs","sources":["../../../../src/components/card/Card.tsx"],"sourcesContent":["import { Card as AntdCard, CardProps } from 'antd'\nimport cx from 'classnames'\n\n// import this file to enable styling defined in there\nimport './Card.css'\n\nexport type Props = Omit<CardProps, 'size'> & {\n  /** Card title */\n  title?: string\n  /** Card contents */\n  children: React.ReactNode\n  /** Loading state */\n  loading?: boolean\n  /** Card size */\n  size?: 'default' | 'small' | 'compact' | 'large'\n  /**\n   * Inner card type variant.\n   * It allows inner card to have variants independent of other props.\n   * Works only with type=\"inner\".\n   */\n  innerVariant?: 'default' | 'basic'\n}\n\nconst Card = ({\n  title,\n  children,\n  loading,\n  size = 'default',\n  innerVariant = 'default',\n  className,\n  ...props\n}: Props) => {\n  const isInner = props.type === 'inner'\n  const isInnerBasic = isInner && innerVariant === 'basic'\n  return (\n    <AntdCard\n      className={cx(\n        'j2-card',\n        `j2-card-${size}`,\n        isInnerBasic && 'inner-basic',\n        className\n      )}\n      {...props}\n      size={size === 'large' || size === 'compact' ? 'default' : size}\n      title={title}\n      loading={loading}\n    >\n      {children}\n    </AntdCard>\n  )\n}\n\nexport { Card }\n"],"names":["jsx","AntdCard"],"mappings":";;;;;;AAuBA,MAAM,OAAO,CAAC;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,eAAe;AAAA,EACf;AAAA,EACA,GAAG;AACL,MAAa;AACX,QAAM,UAAU,MAAM,SAAS;AAC/B,QAAM,eAAe,WAAW,iBAAiB;AACjD,SACEA,2BAAAA;AAAAA,IAACC,KAAAA;AAAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,WAAW,IAAI;AAAA,QACf,gBAAgB;AAAA,QAChB;AAAA,MAAA;AAAA,MAED,GAAG;AAAA,MACJ,MAAM,SAAS,WAAW,SAAS,YAAY,YAAY;AAAA,MAC3D;AAAA,MACA;AAAA,MAEC;AAAA,IAAA;AAAA,EAAA;AAGP;;"}
+{"version":3,"file":"Card.cjs","sources":["../../../../src/components/card/Card.tsx"],"sourcesContent":["import { Card as AntdCard, CardProps } from 'antd'\nimport cx from 'classnames'\n\n// import this file to enable styling defined in there\nimport './Card.css'\n\nexport type Props = Omit<CardProps, 'size'> & {\n  /** Card title */\n  title?: string\n  /** Card contents */\n  children: React.ReactNode\n  /** Loading state */\n  loading?: boolean\n  /** Card size */\n  size?: 'default' | 'small' | 'compact' | 'large'\n  /**\n   * Inner card type variant.\n   * It allows inner card to have variants independent of other props.\n   * Works only with type=\"inner\".\n   */\n  innerVariant?: 'default' | 'basic'\n}\n\nconst Card = ({\n  title,\n  children,\n  loading,\n  size = 'default',\n  innerVariant = 'default',\n  className,\n  ...props\n}: Props) => {\n  const isInner = props.type === 'inner'\n  const isInnerBasic = isInner && innerVariant === 'basic'\n  return (\n    <AntdCard\n      className={cx(\n        'j2-card',\n        `j2-card-${size}`,\n        isInnerBasic && 'inner-basic',\n        className\n      )}\n      {...props}\n      size={size === 'small' ? 'small' : 'medium'}\n      title={title}\n      loading={loading}\n    >\n      {children}\n    </AntdCard>\n  )\n}\n\nexport { Card }\n"],"names":["jsx","AntdCard"],"mappings":";;;;;;AAuBA,MAAM,OAAO,CAAC;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,eAAe;AAAA,EACf;AAAA,EACA,GAAG;AACL,MAAa;AACX,QAAM,UAAU,MAAM,SAAS;AAC/B,QAAM,eAAe,WAAW,iBAAiB;AACjD,SACEA,2BAAAA;AAAAA,IAACC,KAAAA;AAAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,WAAW,IAAI;AAAA,QACf,gBAAgB;AAAA,QAChB;AAAA,MAAA;AAAA,MAED,GAAG;AAAA,MACJ,MAAM,SAAS,UAAU,UAAU;AAAA,MACnC;AAAA,MACA;AAAA,MAEC;AAAA,IAAA;AAAA,EAAA;AAGP;;"}

package/dist/src/components/card/Card.js

@@ -23,7 +23,7 @@ const Card = ({
         className
       ),
       ...props,
-      size: size === "large" || size === "compact" ? "default" : size,
+      size: size === "small" ? "small" : "medium",
       title,
       loading,
       children

package/dist/src/components/card/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","sources":["../../../../src/components/card/Card.tsx"],"sourcesContent":["import { Card as AntdCard, CardProps } from 'antd'\nimport cx from 'classnames'\n\n// import this file to enable styling defined in there\nimport './Card.css'\n\nexport type Props = Omit<CardProps, 'size'> & {\n  /** Card title */\n  title?: string\n  /** Card contents */\n  children: React.ReactNode\n  /** Loading state */\n  loading?: boolean\n  /** Card size */\n  size?: 'default' | 'small' | 'compact' | 'large'\n  /**\n   * Inner card type variant.\n   * It allows inner card to have variants independent of other props.\n   * Works only with type=\"inner\".\n   */\n  innerVariant?: 'default' | 'basic'\n}\n\nconst Card = ({\n  title,\n  children,\n  loading,\n  size = 'default',\n  innerVariant = 'default',\n  className,\n  ...props\n}: Props) => {\n  const isInner = props.type === 'inner'\n  const isInnerBasic = isInner && innerVariant === 'basic'\n  return (\n    <AntdCard\n      className={cx(\n        'j2-card',\n        `j2-card-${size}`,\n        isInnerBasic && 'inner-basic',\n        className\n      )}\n      {...props}\n      size={size === 'large' || size === 'compact' ? 'default' : size}\n      title={title}\n      loading={loading}\n    >\n      {children}\n    </AntdCard>\n  )\n}\n\nexport { Card }\n"],"names":["AntdCard"],"mappings":";;;;AAuBA,MAAM,OAAO,CAAC;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,eAAe;AAAA,EACf;AAAA,EACA,GAAG;AACL,MAAa;AACX,QAAM,UAAU,MAAM,SAAS;AAC/B,QAAM,eAAe,WAAW,iBAAiB;AACjD,SACE;AAAA,IAACA;AAAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,WAAW,IAAI;AAAA,QACf,gBAAgB;AAAA,QAChB;AAAA,MAAA;AAAA,MAED,GAAG;AAAA,MACJ,MAAM,SAAS,WAAW,SAAS,YAAY,YAAY;AAAA,MAC3D;AAAA,MACA;AAAA,MAEC;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"Card.js","sources":["../../../../src/components/card/Card.tsx"],"sourcesContent":["import { Card as AntdCard, CardProps } from 'antd'\nimport cx from 'classnames'\n\n// import this file to enable styling defined in there\nimport './Card.css'\n\nexport type Props = Omit<CardProps, 'size'> & {\n  /** Card title */\n  title?: string\n  /** Card contents */\n  children: React.ReactNode\n  /** Loading state */\n  loading?: boolean\n  /** Card size */\n  size?: 'default' | 'small' | 'compact' | 'large'\n  /**\n   * Inner card type variant.\n   * It allows inner card to have variants independent of other props.\n   * Works only with type=\"inner\".\n   */\n  innerVariant?: 'default' | 'basic'\n}\n\nconst Card = ({\n  title,\n  children,\n  loading,\n  size = 'default',\n  innerVariant = 'default',\n  className,\n  ...props\n}: Props) => {\n  const isInner = props.type === 'inner'\n  const isInnerBasic = isInner && innerVariant === 'basic'\n  return (\n    <AntdCard\n      className={cx(\n        'j2-card',\n        `j2-card-${size}`,\n        isInnerBasic && 'inner-basic',\n        className\n      )}\n      {...props}\n      size={size === 'small' ? 'small' : 'medium'}\n      title={title}\n      loading={loading}\n    >\n      {children}\n    </AntdCard>\n  )\n}\n\nexport { Card }\n"],"names":["AntdCard"],"mappings":";;;;AAuBA,MAAM,OAAO,CAAC;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,eAAe;AAAA,EACf;AAAA,EACA,GAAG;AACL,MAAa;AACX,QAAM,UAAU,MAAM,SAAS;AAC/B,QAAM,eAAe,WAAW,iBAAiB;AACjD,SACE;AAAA,IAACA;AAAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,WAAW,IAAI;AAAA,QACf,gBAAgB;AAAA,QAChB;AAAA,MAAA;AAAA,MAED,GAAG;AAAA,MACJ,MAAM,SAAS,UAAU,UAAU;AAAA,MACnC;AAAA,MACA;AAAA,MAEC;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/src/components/collapse/Collapse.module.css.cjs

@@ -1,9 +1,9 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const warning = "_warning_yukjt_2";
-const error = "_error_yukjt_3";
+const warning = "_warning_1t61q_2";
+const error = "_error_1t61q_3";
 const styles = {
-  "default": "_default_yukjt_1",
+  "default": "_default_1t61q_1",
   warning,
   error
 };

package/dist/src/components/collapse/Collapse.module.css.js

@@ -1,7 +1,7 @@
-const warning = "_warning_yukjt_2";
-const error = "_error_yukjt_3";
+const warning = "_warning_1t61q_2";
+const error = "_error_1t61q_3";
 const styles = {
-  "default": "_default_yukjt_1",
+  "default": "_default_1t61q_1",
   warning,
   error
 };

package/dist/src/components/drawer/Drawer.cjs

@@ -16,7 +16,9 @@ const Drawer = ({
     {
       ...props,
       closable: false,
-      ...fillPage && { height: "100vh", width: "100vw" },
+      ...fillPage && {
+        size: props.placement === "top" || props.placement === "bottom" ? "100vh" : "100vw"
+      },
       ...footer && { footer },
       extra: /* @__PURE__ */ jsxRuntime.jsxs(antd.Space, { children: [
         extraContent,

package/dist/src/components/drawer/Drawer.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.cjs","sources":["../../../../src/components/drawer/Drawer.tsx"],"sourcesContent":["import { Drawer as AntdDrawer, DrawerProps, Space } from 'antd'\nimport { Button } from '../button'\nimport { XIcon } from '@phosphor-icons/react'\nimport './Drawer.css'\n\ntype AllProps = Omit<DrawerProps, 'extra' | 'closable'> & {\n  fillPage?: boolean\n  footer?: React.ReactNode\n  extraContent?: React.ReactNode\n}\n\nexport type Props = Expand<AllProps>\n\nexport const Drawer = ({\n  fillPage = false,\n  footer,\n  extraContent,\n  ...props\n}: Props) => {\n  return (\n    <AntdDrawer\n      {...props}\n      closable={false}\n      {...(fillPage && { height: '100vh', width: '100vw' })}\n      {...(footer && { footer })}\n      extra={\n        <Space>\n          {extraContent}\n          <Button\n            className=\"p-0\"\n            type=\"link\"\n            onClick={props.onClose}\n            aria-label=\"Close\"\n          >\n            <XIcon size={22} weight=\"regular\" />\n          </Button>\n        </Space>\n      }\n      className=\"j2-drawer\"\n    />\n  )\n}\n"],"names":["jsx","AntdDrawer","Space","Button","XIcon"],"mappings":";;;;;;;AAaO,MAAM,SAAS,CAAC;AAAA,EACrB,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAa;AACX,SACEA,2BAAAA;AAAAA,IAACC,KAAAA;AAAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,UAAU;AAAA,MACT,GAAI,YAAY,EAAE,QAAQ,SAAS,OAAO,QAAA;AAAA,MAC1C,GAAI,UAAU,EAAE,OAAA;AAAA,MACjB,uCACGC,YAAA,EACE,UAAA;AAAA,QAAA;AAAA,QACDF,2BAAAA;AAAAA,UAACG,OAAAA;AAAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,MAAK;AAAA,YACL,SAAS,MAAM;AAAA,YACf,cAAW;AAAA,YAEX,UAAAH,2BAAAA,IAACI,aAAA,EAAM,MAAM,IAAI,QAAO,UAAA,CAAU;AAAA,UAAA;AAAA,QAAA;AAAA,MACpC,GACF;AAAA,MAEF,WAAU;AAAA,IAAA;AAAA,EAAA;AAGhB;;"}
+{"version":3,"file":"Drawer.cjs","sources":["../../../../src/components/drawer/Drawer.tsx"],"sourcesContent":["import { Drawer as AntdDrawer, DrawerProps, Space } from 'antd'\nimport { Button } from '../button'\nimport { XIcon } from '@phosphor-icons/react'\nimport './Drawer.css'\n\ntype AllProps = Omit<DrawerProps, 'extra' | 'closable'> & {\n  fillPage?: boolean\n  footer?: React.ReactNode\n  extraContent?: React.ReactNode\n}\n\nexport type Props = Expand<AllProps>\n\nexport const Drawer = ({\n  fillPage = false,\n  footer,\n  extraContent,\n  ...props\n}: Props) => {\n  return (\n    <AntdDrawer\n      {...props}\n      closable={false}\n      {...(fillPage && {\n        size:\n          props.placement === 'top' || props.placement === 'bottom'\n            ? '100vh'\n            : '100vw',\n      })}\n      {...(footer && { footer })}\n      extra={\n        <Space>\n          {extraContent}\n          <Button\n            className=\"p-0\"\n            type=\"link\"\n            onClick={props.onClose}\n            aria-label=\"Close\"\n          >\n            <XIcon size={22} weight=\"regular\" />\n          </Button>\n        </Space>\n      }\n      className=\"j2-drawer\"\n    />\n  )\n}\n"],"names":["jsx","AntdDrawer","Space","Button","XIcon"],"mappings":";;;;;;;AAaO,MAAM,SAAS,CAAC;AAAA,EACrB,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAa;AACX,SACEA,2BAAAA;AAAAA,IAACC,KAAAA;AAAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,UAAU;AAAA,MACT,GAAI,YAAY;AAAA,QACf,MACE,MAAM,cAAc,SAAS,MAAM,cAAc,WAC7C,UACA;AAAA,MAAA;AAAA,MAEP,GAAI,UAAU,EAAE,OAAA;AAAA,MACjB,uCACGC,YAAA,EACE,UAAA;AAAA,QAAA;AAAA,QACDF,2BAAAA;AAAAA,UAACG,OAAAA;AAAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,MAAK;AAAA,YACL,SAAS,MAAM;AAAA,YACf,cAAW;AAAA,YAEX,UAAAH,2BAAAA,IAACI,aAAA,EAAM,MAAM,IAAI,QAAO,UAAA,CAAU;AAAA,UAAA;AAAA,QAAA;AAAA,MACpC,GACF;AAAA,MAEF,WAAU;AAAA,IAAA;AAAA,EAAA;AAGhB;;"}

package/dist/src/components/drawer/Drawer.js

@@ -14,7 +14,9 @@ const Drawer = ({
     {
       ...props,
       closable: false,
-      ...fillPage && { height: "100vh", width: "100vw" },
+      ...fillPage && {
+        size: props.placement === "top" || props.placement === "bottom" ? "100vh" : "100vw"
+      },
       ...footer && { footer },
       extra: /* @__PURE__ */ jsxs(Space, { children: [
         extraContent,

package/dist/src/components/drawer/Drawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.js","sources":["../../../../src/components/drawer/Drawer.tsx"],"sourcesContent":["import { Drawer as AntdDrawer, DrawerProps, Space } from 'antd'\nimport { Button } from '../button'\nimport { XIcon } from '@phosphor-icons/react'\nimport './Drawer.css'\n\ntype AllProps = Omit<DrawerProps, 'extra' | 'closable'> & {\n  fillPage?: boolean\n  footer?: React.ReactNode\n  extraContent?: React.ReactNode\n}\n\nexport type Props = Expand<AllProps>\n\nexport const Drawer = ({\n  fillPage = false,\n  footer,\n  extraContent,\n  ...props\n}: Props) => {\n  return (\n    <AntdDrawer\n      {...props}\n      closable={false}\n      {...(fillPage && { height: '100vh', width: '100vw' })}\n      {...(footer && { footer })}\n      extra={\n        <Space>\n          {extraContent}\n          <Button\n            className=\"p-0\"\n            type=\"link\"\n            onClick={props.onClose}\n            aria-label=\"Close\"\n          >\n            <XIcon size={22} weight=\"regular\" />\n          </Button>\n        </Space>\n      }\n      className=\"j2-drawer\"\n    />\n  )\n}\n"],"names":["AntdDrawer"],"mappings":";;;;;AAaO,MAAM,SAAS,CAAC;AAAA,EACrB,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAa;AACX,SACE;AAAA,IAACA;AAAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,UAAU;AAAA,MACT,GAAI,YAAY,EAAE,QAAQ,SAAS,OAAO,QAAA;AAAA,MAC1C,GAAI,UAAU,EAAE,OAAA;AAAA,MACjB,4BACG,OAAA,EACE,UAAA;AAAA,QAAA;AAAA,QACD;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,MAAK;AAAA,YACL,SAAS,MAAM;AAAA,YACf,cAAW;AAAA,YAEX,UAAA,oBAAC,OAAA,EAAM,MAAM,IAAI,QAAO,UAAA,CAAU;AAAA,UAAA;AAAA,QAAA;AAAA,MACpC,GACF;AAAA,MAEF,WAAU;AAAA,IAAA;AAAA,EAAA;AAGhB;"}
+{"version":3,"file":"Drawer.js","sources":["../../../../src/components/drawer/Drawer.tsx"],"sourcesContent":["import { Drawer as AntdDrawer, DrawerProps, Space } from 'antd'\nimport { Button } from '../button'\nimport { XIcon } from '@phosphor-icons/react'\nimport './Drawer.css'\n\ntype AllProps = Omit<DrawerProps, 'extra' | 'closable'> & {\n  fillPage?: boolean\n  footer?: React.ReactNode\n  extraContent?: React.ReactNode\n}\n\nexport type Props = Expand<AllProps>\n\nexport const Drawer = ({\n  fillPage = false,\n  footer,\n  extraContent,\n  ...props\n}: Props) => {\n  return (\n    <AntdDrawer\n      {...props}\n      closable={false}\n      {...(fillPage && {\n        size:\n          props.placement === 'top' || props.placement === 'bottom'\n            ? '100vh'\n            : '100vw',\n      })}\n      {...(footer && { footer })}\n      extra={\n        <Space>\n          {extraContent}\n          <Button\n            className=\"p-0\"\n            type=\"link\"\n            onClick={props.onClose}\n            aria-label=\"Close\"\n          >\n            <XIcon size={22} weight=\"regular\" />\n          </Button>\n        </Space>\n      }\n      className=\"j2-drawer\"\n    />\n  )\n}\n"],"names":["AntdDrawer"],"mappings":";;;;;AAaO,MAAM,SAAS,CAAC;AAAA,EACrB,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAa;AACX,SACE;AAAA,IAACA;AAAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,UAAU;AAAA,MACT,GAAI,YAAY;AAAA,QACf,MACE,MAAM,cAAc,SAAS,MAAM,cAAc,WAC7C,UACA;AAAA,MAAA;AAAA,MAEP,GAAI,UAAU,EAAE,OAAA;AAAA,MACjB,4BACG,OAAA,EACE,UAAA;AAAA,QAAA;AAAA,QACD;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,MAAK;AAAA,YACL,SAAS,MAAM;AAAA,YACf,cAAW;AAAA,YAEX,UAAA,oBAAC,OAAA,EAAM,MAAM,IAAI,QAAO,UAAA,CAAU;AAAA,UAAA;AAAA,QAAA;AAAA,MACpC,GACF;AAAA,MAEF,WAAU;AAAA,IAAA;AAAA,EAAA;AAGhB;"}

package/dist/src/components/form/Form.cjs

@@ -1,11 +1,28 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
-const formikAntd = require("formik-antd");
+const antd = require("antd");
+const formik = require("formik");
+const FormItem = require("./FormItem.cjs");
 ;/* empty css           */
-const Form = ({ children, ...props }) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(formikAntd.Form, { ...props, children });
+const Form = ({ children, onFinish, onReset, ...props }) => {
+  const { handleSubmit, handleReset } = formik.useFormikContext();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    antd.Form,
+    {
+      ...props,
+      onFinish: (values) => {
+        handleSubmit();
+        onFinish == null ? void 0 : onFinish(values);
+      },
+      onReset: (event) => {
+        handleReset(event);
+        onReset == null ? void 0 : onReset(event);
+      },
+      children
+    }
+  );
 };
-Form.Item = formikAntd.FormItem;
+Form.Item = FormItem.FormItem;
 exports.Form = Form;
 //# sourceMappingURL=Form.cjs.map

package/dist/src/components/form/Form.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Form.cjs","sources":["../../../../src/components/form/Form.tsx"],"sourcesContent":["import { FormProps } from 'antd'\nimport { Form as AntdForm, FormItem } from 'formik-antd'\nimport './Form.css'\n\ntype Props = Expand<FormProps>\n\nexport const Form = ({ children, ...props }: Props) => {\n  return <AntdForm {...props}>{children}</AntdForm>\n}\n\nForm.Item = FormItem\n"],"names":["jsx","AntdForm","FormItem"],"mappings":";;;;;AAMO,MAAM,OAAO,CAAC,EAAE,UAAU,GAAG,YAAmB;AACrD,SAAOA,2BAAAA,IAACC,WAAAA,MAAA,EAAU,GAAG,OAAQ,SAAA,CAAS;AACxC;AAEA,KAAK,OAAOC,WAAAA;;"}
+{"version":3,"file":"Form.cjs","sources":["../../../../src/components/form/Form.tsx"],"sourcesContent":["import { Form as AntdForm, type FormProps } from 'antd'\nimport { useFormikContext } from 'formik'\nimport type { ReactNode } from 'react'\nimport { FormItem } from './FormItem'\nimport './Form.css'\n\ntype Props = Expand<Omit<FormProps, 'children'> & { children?: ReactNode }>\n\nexport const Form = ({ children, onFinish, onReset, ...props }: Props) => {\n  const { handleSubmit, handleReset } = useFormikContext()\n  return (\n    <AntdForm\n      {...props}\n      onFinish={(values) => {\n        handleSubmit()\n        onFinish?.(values)\n      }}\n      onReset={(event) => {\n        handleReset(event)\n        onReset?.(event)\n      }}\n    >\n      {children}\n    </AntdForm>\n  )\n}\n\nForm.Item = FormItem\n"],"names":["useFormikContext","jsx","AntdForm","FormItem"],"mappings":";;;;;;;AAQO,MAAM,OAAO,CAAC,EAAE,UAAU,UAAU,SAAS,GAAG,YAAmB;AACxE,QAAM,EAAE,cAAc,YAAA,IAAgBA,wBAAA;AACtC,SACEC,2BAAAA;AAAAA,IAACC,KAAAA;AAAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,UAAU,CAAC,WAAW;AACpB,qBAAA;AACA,6CAAW;AAAA,MACb;AAAA,MACA,SAAS,CAAC,UAAU;AAClB,oBAAY,KAAK;AACjB,2CAAU;AAAA,MACZ;AAAA,MAEC;AAAA,IAAA;AAAA,EAAA;AAGP;AAEA,KAAK,OAAOC,SAAAA;;"}

package/dist/src/components/form/Form.d.ts

@@ -1,7 +1,14 @@
 import { FormProps } from 'antd';
-type Props = Expand<FormProps>;
+import { ReactNode } from 'react';
+type Props = Expand<Omit<FormProps, 'children'> & {
+    children?: ReactNode;
+}>;
 export declare const Form: {
-    ({ children, ...props }: Props): import("react").JSX.Element;
-    Item: ({ name, __debug, showValidateSuccess, showInitialErrorAfterTouched, children, validate, ...restProps }: import('formik-antd').FormItemProps) => JSX.Element;
+    ({ children, onFinish, onReset, ...props }: Props): import("react").JSX.Element;
+    Item: ({ name, validate, children, showValidateSuccess, showInitialErrorAfterTouched, ...props }: Omit<import('antd').FormItemProps<any>, "children" | "name"> & Pick<import('./FormikField.js').FormikFieldProps, "name" | "validate"> & {
+        children: ReactNode;
+        showValidateSuccess?: boolean;
+        showInitialErrorAfterTouched?: boolean;
+    }) => import("react").JSX.Element;
 };
 export {};

package/dist/src/components/form/Form.js

@@ -1,8 +1,25 @@
 import { jsx } from "react/jsx-runtime";
-import { Form as Form$1, FormItem } from "formik-antd";
+import { Form as Form$1 } from "antd";
+import { useFormikContext } from "formik";
+import { FormItem } from "./FormItem.js";
 /* empty css         */
-const Form = ({ children, ...props }) => {
-  return /* @__PURE__ */ jsx(Form$1, { ...props, children });
+const Form = ({ children, onFinish, onReset, ...props }) => {
+  const { handleSubmit, handleReset } = useFormikContext();
+  return /* @__PURE__ */ jsx(
+    Form$1,
+    {
+      ...props,
+      onFinish: (values) => {
+        handleSubmit();
+        onFinish == null ? void 0 : onFinish(values);
+      },
+      onReset: (event) => {
+        handleReset(event);
+        onReset == null ? void 0 : onReset(event);
+      },
+      children
+    }
+  );
 };
 Form.Item = FormItem;
 export {

package/dist/src/components/form/Form.js.map

@@ -1 +1 @@
-{"version":3,"file":"Form.js","sources":["../../../../src/components/form/Form.tsx"],"sourcesContent":["import { FormProps } from 'antd'\nimport { Form as AntdForm, FormItem } from 'formik-antd'\nimport './Form.css'\n\ntype Props = Expand<FormProps>\n\nexport const Form = ({ children, ...props }: Props) => {\n  return <AntdForm {...props}>{children}</AntdForm>\n}\n\nForm.Item = FormItem\n"],"names":["AntdForm"],"mappings":";;;AAMO,MAAM,OAAO,CAAC,EAAE,UAAU,GAAG,YAAmB;AACrD,SAAO,oBAACA,QAAA,EAAU,GAAG,OAAQ,SAAA,CAAS;AACxC;AAEA,KAAK,OAAO;"}
+{"version":3,"file":"Form.js","sources":["../../../../src/components/form/Form.tsx"],"sourcesContent":["import { Form as AntdForm, type FormProps } from 'antd'\nimport { useFormikContext } from 'formik'\nimport type { ReactNode } from 'react'\nimport { FormItem } from './FormItem'\nimport './Form.css'\n\ntype Props = Expand<Omit<FormProps, 'children'> & { children?: ReactNode }>\n\nexport const Form = ({ children, onFinish, onReset, ...props }: Props) => {\n  const { handleSubmit, handleReset } = useFormikContext()\n  return (\n    <AntdForm\n      {...props}\n      onFinish={(values) => {\n        handleSubmit()\n        onFinish?.(values)\n      }}\n      onReset={(event) => {\n        handleReset(event)\n        onReset?.(event)\n      }}\n    >\n      {children}\n    </AntdForm>\n  )\n}\n\nForm.Item = FormItem\n"],"names":["AntdForm"],"mappings":";;;;;AAQO,MAAM,OAAO,CAAC,EAAE,UAAU,UAAU,SAAS,GAAG,YAAmB;AACxE,QAAM,EAAE,cAAc,YAAA,IAAgB,iBAAA;AACtC,SACE;AAAA,IAACA;AAAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,UAAU,CAAC,WAAW;AACpB,qBAAA;AACA,6CAAW;AAAA,MACb;AAAA,MACA,SAAS,CAAC,UAAU;AAClB,oBAAY,KAAK;AACjB,2CAAU;AAAA,MACZ;AAAA,MAEC;AAAA,IAAA;AAAA,EAAA;AAGP;AAEA,KAAK,OAAO;"}

package/dist/src/components/form/FormItem.cjs

@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const antd = require("antd");
+const formik = require("formik");
+const FormikField = require("./FormikField.cjs");
+const FormItemFieldContext = require("./FormItemFieldContext.cjs");
+const FormItem = ({
+  name,
+  validate,
+  children,
+  showValidateSuccess,
+  showInitialErrorAfterTouched = false,
+  ...props
+}) => {
+  const form = formik.useFormikContext();
+  const error = formik.getIn(form.errors, name);
+  const initialError = formik.getIn(form.initialErrors, name);
+  const touched = formik.getIn(form.touched, name, false);
+  const isTouched = Array.isArray(touched) ? touched.length === 0 || touched.some(Boolean) : touched;
+  const hasError = error !== void 0 && isTouched;
+  const showInitialError = initialError !== void 0 && (!isTouched || showInitialErrorAfterTouched);
+  const isValid = !error && isTouched;
+  const item = /* @__PURE__ */ jsxRuntime.jsx(
+    antd.Form.Item,
+    {
+      htmlFor: name,
+      id: name,
+      validateStatus: hasError || initialError !== void 0 && !isTouched ? "error" : isValid && showValidateSuccess ? "success" : void 0,
+      hasFeedback: isValid,
+      help: hasError || showInitialError ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        hasError && /* @__PURE__ */ jsxRuntime.jsx("li", { children: error }),
+        showInitialError && /* @__PURE__ */ jsxRuntime.jsx("li", { children: initialError })
+      ] }) : null,
+      ...props,
+      children
+    }
+  );
+  return validate ? /* @__PURE__ */ jsxRuntime.jsx(FormikField.FormikField, { name, validate, children: (fieldProps) => /* @__PURE__ */ jsxRuntime.jsx(FormItemFieldContext.FormItemFieldContext.Provider, { value: fieldProps, children: item }) }) : item;
+};
+exports.FormItem = FormItem;
+//# sourceMappingURL=FormItem.cjs.map

package/dist/src/components/form/FormItem.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormItem.cjs","sources":["../../../../src/components/form/FormItem.tsx"],"sourcesContent":["import { Form as AntdForm, type FormItemProps as AntdFormItemProps } from 'antd'\nimport { getIn, useFormikContext } from 'formik'\nimport type { ReactNode } from 'react'\nimport { FormikField, type FormikFieldProps } from './FormikField'\nimport { FormItemFieldContext } from './FormItemFieldContext'\n\ntype Props = Omit<AntdFormItemProps, 'name' | 'children'> &\n  Pick<FormikFieldProps, 'name' | 'validate'> & {\n    children: ReactNode\n    showValidateSuccess?: boolean\n    showInitialErrorAfterTouched?: boolean\n  }\n\nexport const FormItem = ({\n  name,\n  validate,\n  children,\n  showValidateSuccess,\n  showInitialErrorAfterTouched = false,\n  ...props\n}: Props) => {\n  const form = useFormikContext()\n  const error = getIn(form.errors, name)\n  const initialError = getIn(form.initialErrors, name)\n  const touched = getIn(form.touched, name, false)\n  const isTouched = Array.isArray(touched)\n    ? touched.length === 0 || touched.some(Boolean)\n    : touched\n  const hasError = error !== undefined && isTouched\n  const showInitialError =\n    initialError !== undefined && (!isTouched || showInitialErrorAfterTouched)\n  const isValid = !error && isTouched\n\n  const item = (\n    <AntdForm.Item\n      htmlFor={name}\n      id={name}\n      validateStatus={\n        hasError || (initialError !== undefined && !isTouched)\n          ? 'error'\n          : isValid && showValidateSuccess\n            ? 'success'\n            : undefined\n      }\n      hasFeedback={isValid}\n      help={\n        hasError || showInitialError ? (\n          <>\n            {hasError && <li>{error}</li>}\n            {showInitialError && <li>{initialError}</li>}\n          </>\n        ) : null\n      }\n      {...props}\n    >\n      {/* Formik owns values and validation; do not register an antd field. */}\n      {children}\n    </AntdForm.Item>\n  )\n  // Display-only items must not register a second field over their control.\n  // When validate is supplied, the item owns validation (as before).\n  return validate ? (\n    <FormikField name={name} validate={validate}>\n      {(fieldProps) => (\n        <FormItemFieldContext.Provider value={fieldProps}>\n          {item}\n        </FormItemFieldContext.Provider>\n      )}\n    </FormikField>\n  ) : (\n    item\n  )\n}\n"],"names":["useFormikContext","getIn","jsx","AntdForm","jsxs","Fragment","FormikField","FormItemFieldContext"],"mappings":";;;;;;;AAaO,MAAM,WAAW,CAAC;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,+BAA+B;AAAA,EAC/B,GAAG;AACL,MAAa;AACX,QAAM,OAAOA,OAAAA,iBAAA;AACb,QAAM,QAAQC,OAAAA,MAAM,KAAK,QAAQ,IAAI;AACrC,QAAM,eAAeA,OAAAA,MAAM,KAAK,eAAe,IAAI;AACnD,QAAM,UAAUA,OAAAA,MAAM,KAAK,SAAS,MAAM,KAAK;AAC/C,QAAM,YAAY,MAAM,QAAQ,OAAO,IACnC,QAAQ,WAAW,KAAK,QAAQ,KAAK,OAAO,IAC5C;AACJ,QAAM,WAAW,UAAU,UAAa;AACxC,QAAM,mBACJ,iBAAiB,WAAc,CAAC,aAAa;AAC/C,QAAM,UAAU,CAAC,SAAS;AAE1B,QAAM,OACJC,2BAAAA;AAAAA,IAACC,KAAAA,KAAS;AAAA,IAAT;AAAA,MACC,SAAS;AAAA,MACT,IAAI;AAAA,MACJ,gBACE,YAAa,iBAAiB,UAAa,CAAC,YACxC,UACA,WAAW,sBACT,YACA;AAAA,MAER,aAAa;AAAA,MACb,MACE,YAAY,mBACVC,2BAAAA,KAAAC,WAAAA,UAAA,EACG,UAAA;AAAA,QAAA,YAAYH,2BAAAA,IAAC,QAAI,UAAA,MAAA,CAAM;AAAA,QACvB,oBAAoBA,2BAAAA,IAAC,MAAA,EAAI,UAAA,aAAA,CAAa;AAAA,MAAA,EAAA,CACzC,IACE;AAAA,MAEL,GAAG;AAAA,MAGH;AAAA,IAAA;AAAA,EAAA;AAKL,SAAO,WACLA,2BAAAA,IAACI,yBAAA,EAAY,MAAY,UACtB,UAAA,CAAC,eACAJ,2BAAAA,IAACK,qBAAAA,qBAAqB,UAArB,EAA8B,OAAO,YACnC,UAAA,KAAA,CACH,GAEJ,IAEA;AAEJ;;"}

package/dist/src/components/form/FormItem.d.ts

@@ -0,0 +1,10 @@
+import { FormItemProps as AntdFormItemProps } from 'antd';
+import { ReactNode } from 'react';
+import { FormikFieldProps } from './FormikField.js';
+type Props = Omit<AntdFormItemProps, 'name' | 'children'> & Pick<FormikFieldProps, 'name' | 'validate'> & {
+    children: ReactNode;
+    showValidateSuccess?: boolean;
+    showInitialErrorAfterTouched?: boolean;
+};
+export declare const FormItem: ({ name, validate, children, showValidateSuccess, showInitialErrorAfterTouched, ...props }: Props) => import("react").JSX.Element;
+export {};

package/dist/src/components/form/FormItem.js

@@ -0,0 +1,42 @@
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { Form } from "antd";
+import { useFormikContext, getIn } from "formik";
+import { FormikField } from "./FormikField.js";
+import { FormItemFieldContext } from "./FormItemFieldContext.js";
+const FormItem = ({
+  name,
+  validate,
+  children,
+  showValidateSuccess,
+  showInitialErrorAfterTouched = false,
+  ...props
+}) => {
+  const form = useFormikContext();
+  const error = getIn(form.errors, name);
+  const initialError = getIn(form.initialErrors, name);
+  const touched = getIn(form.touched, name, false);
+  const isTouched = Array.isArray(touched) ? touched.length === 0 || touched.some(Boolean) : touched;
+  const hasError = error !== void 0 && isTouched;
+  const showInitialError = initialError !== void 0 && (!isTouched || showInitialErrorAfterTouched);
+  const isValid = !error && isTouched;
+  const item = /* @__PURE__ */ jsx(
+    Form.Item,
+    {
+      htmlFor: name,
+      id: name,
+      validateStatus: hasError || initialError !== void 0 && !isTouched ? "error" : isValid && showValidateSuccess ? "success" : void 0,
+      hasFeedback: isValid,
+      help: hasError || showInitialError ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        hasError && /* @__PURE__ */ jsx("li", { children: error }),
+        showInitialError && /* @__PURE__ */ jsx("li", { children: initialError })
+      ] }) : null,
+      ...props,
+      children
+    }
+  );
+  return validate ? /* @__PURE__ */ jsx(FormikField, { name, validate, children: (fieldProps) => /* @__PURE__ */ jsx(FormItemFieldContext.Provider, { value: fieldProps, children: item }) }) : item;
+};
+export {
+  FormItem
+};
+//# sourceMappingURL=FormItem.js.map

package/dist/src/components/form/FormItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormItem.js","sources":["../../../../src/components/form/FormItem.tsx"],"sourcesContent":["import { Form as AntdForm, type FormItemProps as AntdFormItemProps } from 'antd'\nimport { getIn, useFormikContext } from 'formik'\nimport type { ReactNode } from 'react'\nimport { FormikField, type FormikFieldProps } from './FormikField'\nimport { FormItemFieldContext } from './FormItemFieldContext'\n\ntype Props = Omit<AntdFormItemProps, 'name' | 'children'> &\n  Pick<FormikFieldProps, 'name' | 'validate'> & {\n    children: ReactNode\n    showValidateSuccess?: boolean\n    showInitialErrorAfterTouched?: boolean\n  }\n\nexport const FormItem = ({\n  name,\n  validate,\n  children,\n  showValidateSuccess,\n  showInitialErrorAfterTouched = false,\n  ...props\n}: Props) => {\n  const form = useFormikContext()\n  const error = getIn(form.errors, name)\n  const initialError = getIn(form.initialErrors, name)\n  const touched = getIn(form.touched, name, false)\n  const isTouched = Array.isArray(touched)\n    ? touched.length === 0 || touched.some(Boolean)\n    : touched\n  const hasError = error !== undefined && isTouched\n  const showInitialError =\n    initialError !== undefined && (!isTouched || showInitialErrorAfterTouched)\n  const isValid = !error && isTouched\n\n  const item = (\n    <AntdForm.Item\n      htmlFor={name}\n      id={name}\n      validateStatus={\n        hasError || (initialError !== undefined && !isTouched)\n          ? 'error'\n          : isValid && showValidateSuccess\n            ? 'success'\n            : undefined\n      }\n      hasFeedback={isValid}\n      help={\n        hasError || showInitialError ? (\n          <>\n            {hasError && <li>{error}</li>}\n            {showInitialError && <li>{initialError}</li>}\n          </>\n        ) : null\n      }\n      {...props}\n    >\n      {/* Formik owns values and validation; do not register an antd field. */}\n      {children}\n    </AntdForm.Item>\n  )\n  // Display-only items must not register a second field over their control.\n  // When validate is supplied, the item owns validation (as before).\n  return validate ? (\n    <FormikField name={name} validate={validate}>\n      {(fieldProps) => (\n        <FormItemFieldContext.Provider value={fieldProps}>\n          {item}\n        </FormItemFieldContext.Provider>\n      )}\n    </FormikField>\n  ) : (\n    item\n  )\n}\n"],"names":["AntdForm"],"mappings":";;;;;AAaO,MAAM,WAAW,CAAC;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,+BAA+B;AAAA,EAC/B,GAAG;AACL,MAAa;AACX,QAAM,OAAO,iBAAA;AACb,QAAM,QAAQ,MAAM,KAAK,QAAQ,IAAI;AACrC,QAAM,eAAe,MAAM,KAAK,eAAe,IAAI;AACnD,QAAM,UAAU,MAAM,KAAK,SAAS,MAAM,KAAK;AAC/C,QAAM,YAAY,MAAM,QAAQ,OAAO,IACnC,QAAQ,WAAW,KAAK,QAAQ,KAAK,OAAO,IAC5C;AACJ,QAAM,WAAW,UAAU,UAAa;AACxC,QAAM,mBACJ,iBAAiB,WAAc,CAAC,aAAa;AAC/C,QAAM,UAAU,CAAC,SAAS;AAE1B,QAAM,OACJ;AAAA,IAACA,KAAS;AAAA,IAAT;AAAA,MACC,SAAS;AAAA,MACT,IAAI;AAAA,MACJ,gBACE,YAAa,iBAAiB,UAAa,CAAC,YACxC,UACA,WAAW,sBACT,YACA;AAAA,MAER,aAAa;AAAA,MACb,MACE,YAAY,mBACV,qBAAA,UAAA,EACG,UAAA;AAAA,QAAA,YAAY,oBAAC,QAAI,UAAA,MAAA,CAAM;AAAA,QACvB,oBAAoB,oBAAC,MAAA,EAAI,UAAA,aAAA,CAAa;AAAA,MAAA,EAAA,CACzC,IACE;AAAA,MAEL,GAAG;AAAA,MAGH;AAAA,IAAA;AAAA,EAAA;AAKL,SAAO,WACL,oBAAC,aAAA,EAAY,MAAY,UACtB,UAAA,CAAC,eACA,oBAAC,qBAAqB,UAArB,EAA8B,OAAO,YACnC,UAAA,KAAA,CACH,GAEJ,IAEA;AAEJ;"}

package/dist/src/components/form/FormItemFieldContext.cjs

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const React = require("react");
+const FormItemFieldContext = React.createContext(
+  void 0
+);
+exports.FormItemFieldContext = FormItemFieldContext;
+//# sourceMappingURL=FormItemFieldContext.cjs.map

package/dist/src/components/form/FormItemFieldContext.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormItemFieldContext.cjs","sources":["../../../../src/components/form/FormItemFieldContext.ts"],"sourcesContent":["import type { FieldProps } from 'formik'\nimport { createContext } from 'react'\n\n// An item with its own validator owns the field registration. Its controls\n// reuse that binding so mounting or unmounting them cannot replace the validator.\nexport const FormItemFieldContext = createContext<FieldProps | undefined>(\n  undefined\n)\n"],"names":["createContext"],"mappings":";;;AAKO,MAAM,uBAAuBA,MAAAA;AAAAA,EAClC;AACF;;"}

package/dist/src/components/form/FormItemFieldContext.d.ts

@@ -0,0 +1,2 @@
+import { FieldProps } from 'formik';
+export declare const FormItemFieldContext: import('react').Context<FieldProps<any, any> | undefined>;