@ngrok/mantle 0.73.3 → 0.73.4

package/dist/empty.js.map

@@ -1 +1 @@
-{"version":3,"file":"empty.js","names":[],"sources":["../src/components/empty/empty.tsx"],"sourcesContent":["import type { ComponentProps, HTMLAttributes, ReactNode } from \"react\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { SvgOnly } from \"../icon/svg-only.js\";\nimport type { SvgAttributes } from \"../icon/types.js\";\nimport { Slot } from \"../slot/index.js\";\n\n/**\n * The root container for an empty state. Centers content horizontally\n * with consistent vertical padding and max-width.\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * ```tsx\n * <Empty.Root>\n *   <Empty.Icon svg={<GhostIcon />} />\n *   <Empty.Title>No results found</Empty.Title>\n *   <Empty.Description>Try adjusting your search or filters.</Empty.Description>\n *   <Empty.Actions>\n *     <Button>Clear filters</Button>\n *   </Empty.Actions>\n * </Empty.Root>\n * ```\n */\nconst Root = ({ asChild, children, className, ...props }: ComponentProps<\"div\"> & WithAsChild) => {\n\tconst Comp = asChild ? Slot : \"div\";\n\n\treturn (\n\t\t<Comp\n\t\t\tdata-slot=\"empty\"\n\t\t\tclassName={cx(\"mx-auto flex max-w-lg flex-col items-center py-14 text-center\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</Comp>\n\t);\n};\nRoot.displayName = \"Empty\";\n\ntype EmptyIconProps = Omit<SvgAttributes, \"children\"> & {\n\t/**\n\t * A single SVG icon element.\n\t */\n\tsvg: ReactNode;\n};\n\n/**\n * Renders a large icon for the empty state. Pass a single SVG icon element\n * via the `svg` prop (e.g. from `@phosphor-icons/react`).\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * ```tsx\n * <Empty.Root>\n *   <Empty.Icon svg={<GhostIcon />} />\n *   <Empty.Title>No endpoints yet</Empty.Title>\n *   <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n *   <Empty.Actions>\n *     <Button>Create endpoint</Button>\n *   </Empty.Actions>\n * </Empty.Root>\n * ```\n */\nconst Icon = ({ className, svg, ...props }: EmptyIconProps) => {\n\treturn (\n\t\t<SvgOnly\n\t\t\tdata-slot=\"empty-icon\"\n\t\t\tclassName={cx(\"mb-2 size-16 text-muted\", className)}\n\t\t\tsvg={svg}\n\t\t\t{...props}\n\t\t/>\n\t);\n};\nIcon.displayName = \"EmptyIcon\";\n\n/**\n * The heading text for the empty state. Renders as an `h3` by default. Use the\n * `asChild` prop to render as a different heading level (e.g. `h1`, `h2`).\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * ```tsx\n * <Empty.Root>\n *   <Empty.Icon svg={<GhostIcon />} />\n *   <Empty.Title>No endpoints yet</Empty.Title>\n *   <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n *   <Empty.Actions>\n *     <Button>Create endpoint</Button>\n *   </Empty.Actions>\n * </Empty.Root>\n *\n * <Empty.Title asChild>\n *   <h2>No results found</h2>\n * </Empty.Title>\n * ```\n */\nconst Title = ({\n\tasChild,\n\tchildren,\n\tclassName,\n\t...props\n}: HTMLAttributes<HTMLHeadingElement> & WithAsChild) => {\n\tconst Comp = asChild ? Slot : \"h3\";\n\n\treturn (\n\t\t<Comp\n\t\t\tdata-slot=\"empty-title\"\n\t\t\tclassName={cx(\"text-strong text-xl font-medium\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</Comp>\n\t);\n};\nTitle.displayName = \"EmptyTitle\";\n\n/**\n * Supporting descriptive text below the title. Renders as a `div` with\n * `space-y-4` so multiple paragraphs can be placed inside. Use the `asChild`\n * prop to render as a different element.\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * ```tsx\n * <Empty.Root>\n *   <Empty.Icon svg={<GhostIcon />} />\n *   <Empty.Title>No endpoints yet</Empty.Title>\n *   <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n *   <Empty.Actions>\n *     <Button>Create endpoint</Button>\n *   </Empty.Actions>\n * </Empty.Root>\n *\n * <Empty.Description>\n *   <p>Something went wrong.</p>\n *   <p>Please try again in a few minutes.</p>\n * </Empty.Description>\n * ```\n */\nconst Description = ({\n\tasChild,\n\tchildren,\n\tclassName,\n\t...props\n}: ComponentProps<\"div\"> & WithAsChild) => {\n\tconst Comp = asChild ? Slot : \"div\";\n\n\treturn (\n\t\t<Comp\n\t\t\tdata-slot=\"empty-description\"\n\t\t\tclassName={cx(\"text-body mt-1 space-y-4 text-sm\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</Comp>\n\t);\n};\nDescription.displayName = \"EmptyDescription\";\n\n/**\n * A container for action buttons or links in the empty state.\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * ```tsx\n * <Empty.Root>\n *   <Empty.Icon svg={<GhostIcon />} />\n *   <Empty.Title>No endpoints yet</Empty.Title>\n *   <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n *   <Empty.Actions>\n *     <Button>Create endpoint</Button>\n *     <Button appearance=\"outlined\">Go back</Button>\n *   </Empty.Actions>\n * </Empty.Root>\n * ```\n */\nconst Actions = ({\n\tasChild,\n\tchildren,\n\tclassName,\n\t...props\n}: ComponentProps<\"div\"> & WithAsChild) => {\n\tconst Comp = asChild ? Slot : \"div\";\n\n\treturn (\n\t\t<Comp\n\t\t\tdata-slot=\"empty-actions\"\n\t\t\tclassName={cx(\"mt-4 flex items-center gap-2\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</Comp>\n\t);\n};\nActions.displayName = \"EmptyActions\";\n\n/**\n * Compound component for rendering empty states. Use with `Empty.Root`,\n * `Empty.Icon`, `Empty.Title`, `Empty.Description`, and `Empty.Actions`.\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * Composition:\n * ```\n * Empty.Root\n * ├── Empty.Icon\n * ├── Empty.Title\n * ├── Empty.Description\n * └── Empty.Actions\n * ```\n *\n * @example\n * ```tsx\n * <Empty.Root>\n *   <Empty.Icon svg={<GhostIcon />} />\n *   <Empty.Title>No endpoints yet</Empty.Title>\n *   <Empty.Description>\n *     Create your first endpoint to get started.\n *   </Empty.Description>\n *   <Empty.Actions>\n *     <Button>Create endpoint</Button>\n *   </Empty.Actions>\n * </Empty.Root>\n * ```\n */\nconst Empty = {\n\t/**\n\t * The root container for an empty state. Centers content vertically and\n\t * horizontally with consistent padding and max-width.\n\t *\n\t * @see https://mantle.ngrok.com/components/empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Empty.Root>\n\t *   <Empty.Icon svg={<GhostIcon />} />\n\t *   <Empty.Title>No endpoints yet</Empty.Title>\n\t *   <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n\t *   <Empty.Actions>\n\t *     <Button>Create endpoint</Button>\n\t *   </Empty.Actions>\n\t * </Empty.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * Renders a large icon for the empty state. Pass a single SVG icon element\n\t * via the `svg` prop.\n\t *\n\t * @see https://mantle.ngrok.com/components/empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Empty.Root>\n\t *   <Empty.Icon svg={<GhostIcon />} />\n\t *   <Empty.Title>No endpoints yet</Empty.Title>\n\t *   <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n\t *   <Empty.Actions>\n\t *     <Button>Create endpoint</Button>\n\t *   </Empty.Actions>\n\t * </Empty.Root>\n\t * ```\n\t */\n\tIcon,\n\t/**\n\t * The heading text for the empty state. Renders as an `h3` by default.\n\t * Use `asChild` to render as a different heading level.\n\t *\n\t * @see https://mantle.ngrok.com/components/empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Empty.Root>\n\t *   <Empty.Icon svg={<GhostIcon />} />\n\t *   <Empty.Title>No endpoints yet</Empty.Title>\n\t *   <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n\t *   <Empty.Actions>\n\t *     <Button>Create endpoint</Button>\n\t *   </Empty.Actions>\n\t * </Empty.Root>\n\t *\n\t * <Empty.Title asChild>\n\t *   <h2>No results found</h2>\n\t * </Empty.Title>\n\t * ```\n\t */\n\tTitle,\n\t/**\n\t * Supporting descriptive text below the title. Renders as a `div` with\n\t * `space-y-4` for multiple paragraphs. Use `asChild` to render as a\n\t * different element.\n\t *\n\t * @see https://mantle.ngrok.com/components/empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Empty.Root>\n\t *   <Empty.Icon svg={<GhostIcon />} />\n\t *   <Empty.Title>No endpoints yet</Empty.Title>\n\t *   <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n\t *   <Empty.Actions>\n\t *     <Button>Create endpoint</Button>\n\t *   </Empty.Actions>\n\t * </Empty.Root>\n\t * ```\n\t */\n\tDescription,\n\t/**\n\t * A container for action buttons or links in the empty state.\n\t *\n\t * @see https://mantle.ngrok.com/components/empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Empty.Root>\n\t *   <Empty.Icon svg={<GhostIcon />} />\n\t *   <Empty.Title>No endpoints yet</Empty.Title>\n\t *   <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n\t *   <Empty.Actions>\n\t *     <Button>Create endpoint</Button>\n\t *   </Empty.Actions>\n\t * </Empty.Root>\n\t * ```\n\t */\n\tActions,\n} as const;\n\nexport {\n\t//,\n\tEmpty,\n};\n"],"mappings":"0JAyBA,MAAM,GAAQ,CAAE,UAAS,WAAU,YAAW,GAAG,KAI/C,EAHY,EAAU,EAAO,MAG7B,CACC,YAAU,QACV,UAAW,EAAG,gEAAiE,EAAU,CACzF,GAAI,EAEH,WACK,CAAA,CAGT,EAAK,YAAc,QA2BnB,MAAM,GAAQ,CAAE,YAAW,MAAK,GAAG,KAEjC,EAAC,EAAD,CACC,YAAU,aACV,UAAW,EAAG,0BAA2B,EAAU,CAC9C,MACL,GAAI,EACH,CAAA,CAGJ,EAAK,YAAc,YAwBnB,MAAM,GAAS,CACd,UACA,WACA,YACA,GAAG,KAKF,EAHY,EAAU,EAAO,KAG7B,CACC,YAAU,cACV,UAAW,EAAG,kCAAmC,EAAU,CAC3D,GAAI,EAEH,WACK,CAAA,CAGT,EAAM,YAAc,aA0BpB,MAAM,GAAe,CACpB,UACA,WACA,YACA,GAAG,KAKF,EAHY,EAAU,EAAO,MAG7B,CACC,YAAU,oBACV,UAAW,EAAG,mCAAoC,EAAU,CAC5D,GAAI,EAEH,WACK,CAAA,CAGT,EAAY,YAAc,mBAoB1B,MAAM,GAAW,CAChB,UACA,WACA,YACA,GAAG,KAKF,EAHY,EAAU,EAAO,MAG7B,CACC,YAAU,gBACV,UAAW,EAAG,+BAAgC,EAAU,CACxD,GAAI,EAEH,WACK,CAAA,CAGT,EAAQ,YAAc,eAgCtB,MAAM,EAAQ,CAmBb,OAmBA,OAuBA,QAoBA,cAkBA,UACA"}
+{"version":3,"file":"empty.js","names":[],"sources":["../src/components/empty/empty.tsx"],"sourcesContent":["import type { ComponentProps, HTMLAttributes, ReactNode } from \"react\";\nimport type { WithAsChild } from \"../../types/as-child.js\";\nimport { cx } from \"../../utils/cx/cx.js\";\nimport { SvgOnly } from \"../icon/svg-only.js\";\nimport type { SvgAttributes } from \"../icon/types.js\";\nimport { Slot } from \"../slot/index.js\";\n\n/**\n * The root container for an empty state. Centers content horizontally\n * with consistent vertical padding and max-width.\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * ```tsx\n * <Empty.Root>\n *   <Empty.Icon svg={<GhostIcon />} />\n *   <Empty.Title>No results found</Empty.Title>\n *   <Empty.Description>Try adjusting your search or filters.</Empty.Description>\n *   <Empty.Actions>\n *     <Button>Clear filters</Button>\n *   </Empty.Actions>\n * </Empty.Root>\n * ```\n */\nconst Root = ({ asChild, children, className, ...props }: ComponentProps<\"div\"> & WithAsChild) => {\n\tconst Comp = asChild ? Slot : \"div\";\n\n\treturn (\n\t\t<Comp\n\t\t\tdata-slot=\"empty\"\n\t\t\tclassName={cx(\"mx-auto flex max-w-lg flex-col items-center py-14 text-center\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</Comp>\n\t);\n};\nRoot.displayName = \"Empty\";\n\ntype EmptyIconProps = Omit<SvgAttributes, \"children\"> & {\n\t/**\n\t * A single SVG icon element.\n\t */\n\tsvg: ReactNode;\n};\n\n/**\n * Renders a large icon for the empty state. Pass a single SVG icon element\n * via the `svg` prop (e.g. from `@phosphor-icons/react`).\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * ```tsx\n * <Empty.Root>\n *   <Empty.Icon svg={<GhostIcon />} />\n *   <Empty.Title>No endpoints yet</Empty.Title>\n *   <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n *   <Empty.Actions>\n *     <Button>Create endpoint</Button>\n *   </Empty.Actions>\n * </Empty.Root>\n * ```\n */\nconst Icon = ({ className, svg, ...props }: EmptyIconProps) => {\n\treturn (\n\t\t<SvgOnly\n\t\t\tdata-slot=\"empty-icon\"\n\t\t\tclassName={cx(\"mb-2 size-16 text-muted\", className)}\n\t\t\tsvg={svg}\n\t\t\t{...props}\n\t\t/>\n\t);\n};\nIcon.displayName = \"EmptyIcon\";\n\n/**\n * The heading text for the empty state. Renders as an `h3` by default. Use the\n * `asChild` prop to render as a different heading level (e.g. `h1`, `h2`).\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * ```tsx\n * <Empty.Root>\n *   <Empty.Icon svg={<GhostIcon />} />\n *   <Empty.Title>No endpoints yet</Empty.Title>\n *   <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n *   <Empty.Actions>\n *     <Button>Create endpoint</Button>\n *   </Empty.Actions>\n * </Empty.Root>\n *\n * <Empty.Title asChild>\n *   <h2>No results found</h2>\n * </Empty.Title>\n * ```\n */\nconst Title = ({\n\tasChild,\n\tchildren,\n\tclassName,\n\t...props\n}: HTMLAttributes<HTMLHeadingElement> & WithAsChild) => {\n\tconst Comp = asChild ? Slot : \"h3\";\n\n\treturn (\n\t\t<Comp\n\t\t\tdata-slot=\"empty-title\"\n\t\t\tclassName={cx(\"text-strong text-xl font-medium\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</Comp>\n\t);\n};\nTitle.displayName = \"EmptyTitle\";\n\n/**\n * Supporting descriptive text below the title. Renders as a `div` with\n * `space-y-4` so multiple paragraphs can be placed inside. Use the `asChild`\n * prop to render as a different element.\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * ```tsx\n * <Empty.Root>\n *   <Empty.Icon svg={<GhostIcon />} />\n *   <Empty.Title>No endpoints yet</Empty.Title>\n *   <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n *   <Empty.Actions>\n *     <Button>Create endpoint</Button>\n *   </Empty.Actions>\n * </Empty.Root>\n *\n * <Empty.Description>\n *   <p>Something went wrong.</p>\n *   <p>Please try again in a few minutes.</p>\n * </Empty.Description>\n * ```\n */\nconst Description = ({\n\tasChild,\n\tchildren,\n\tclassName,\n\t...props\n}: ComponentProps<\"div\"> & WithAsChild) => {\n\tconst Comp = asChild ? Slot : \"div\";\n\n\treturn (\n\t\t<Comp\n\t\t\tdata-slot=\"empty-description\"\n\t\t\tclassName={cx(\"text-body mt-1 space-y-4 text-sm\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</Comp>\n\t);\n};\nDescription.displayName = \"EmptyDescription\";\n\n/**\n * A container for action buttons or links in the empty state.\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * ```tsx\n * <Empty.Root>\n *   <Empty.Icon svg={<GhostIcon />} />\n *   <Empty.Title>No endpoints yet</Empty.Title>\n *   <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n *   <Empty.Actions>\n *     <Button>Create endpoint</Button>\n *     <Button appearance=\"outlined\">Go back</Button>\n *   </Empty.Actions>\n * </Empty.Root>\n * ```\n */\nconst Actions = ({\n\tasChild,\n\tchildren,\n\tclassName,\n\t...props\n}: ComponentProps<\"div\"> & WithAsChild) => {\n\tconst Comp = asChild ? Slot : \"div\";\n\n\treturn (\n\t\t<Comp\n\t\t\tdata-slot=\"empty-actions\"\n\t\t\tclassName={cx(\"mt-4 flex items-center gap-2\", className)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t</Comp>\n\t);\n};\nActions.displayName = \"EmptyActions\";\n\n/**\n * Compound component for rendering empty states. Use with `Empty.Root`,\n * `Empty.Icon`, `Empty.Title`, `Empty.Description`, and `Empty.Actions`.\n *\n * @see https://mantle.ngrok.com/components/empty\n *\n * @example\n * Composition:\n * ```\n * Empty.Root\n * ├── Empty.Icon\n * ├── Empty.Title\n * ├── Empty.Description\n * └── Empty.Actions\n * ```\n *\n * @example\n * ```tsx\n * <Empty.Root>\n *   <Empty.Icon svg={<GhostIcon />} />\n *   <Empty.Title>No endpoints yet</Empty.Title>\n *   <Empty.Description>\n *     Create your first endpoint to get started.\n *   </Empty.Description>\n *   <Empty.Actions>\n *     <Button>Create endpoint</Button>\n *   </Empty.Actions>\n * </Empty.Root>\n * ```\n */\nconst Empty = {\n\t/**\n\t * The root container for an empty state. Centers content vertically and\n\t * horizontally with consistent padding and max-width.\n\t *\n\t * @see https://mantle.ngrok.com/components/empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Empty.Root>\n\t *   <Empty.Icon svg={<GhostIcon />} />\n\t *   <Empty.Title>No endpoints yet</Empty.Title>\n\t *   <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n\t *   <Empty.Actions>\n\t *     <Button>Create endpoint</Button>\n\t *   </Empty.Actions>\n\t * </Empty.Root>\n\t * ```\n\t */\n\tRoot,\n\t/**\n\t * Renders a large icon for the empty state. Pass a single SVG icon element\n\t * via the `svg` prop.\n\t *\n\t * @see https://mantle.ngrok.com/components/empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Empty.Root>\n\t *   <Empty.Icon svg={<GhostIcon />} />\n\t *   <Empty.Title>No endpoints yet</Empty.Title>\n\t *   <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n\t *   <Empty.Actions>\n\t *     <Button>Create endpoint</Button>\n\t *   </Empty.Actions>\n\t * </Empty.Root>\n\t * ```\n\t */\n\tIcon,\n\t/**\n\t * The heading text for the empty state. Renders as an `h3` by default.\n\t * Use `asChild` to render as a different heading level.\n\t *\n\t * @see https://mantle.ngrok.com/components/empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Empty.Root>\n\t *   <Empty.Icon svg={<GhostIcon />} />\n\t *   <Empty.Title>No endpoints yet</Empty.Title>\n\t *   <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n\t *   <Empty.Actions>\n\t *     <Button>Create endpoint</Button>\n\t *   </Empty.Actions>\n\t * </Empty.Root>\n\t *\n\t * <Empty.Title asChild>\n\t *   <h2>No results found</h2>\n\t * </Empty.Title>\n\t * ```\n\t */\n\tTitle,\n\t/**\n\t * Supporting descriptive text below the title. Renders as a `div` with\n\t * `space-y-4` for multiple paragraphs. Use `asChild` to render as a\n\t * different element.\n\t *\n\t * @see https://mantle.ngrok.com/components/empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Empty.Root>\n\t *   <Empty.Icon svg={<GhostIcon />} />\n\t *   <Empty.Title>No endpoints yet</Empty.Title>\n\t *   <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n\t *   <Empty.Actions>\n\t *     <Button>Create endpoint</Button>\n\t *   </Empty.Actions>\n\t * </Empty.Root>\n\t * ```\n\t */\n\tDescription,\n\t/**\n\t * A container for action buttons or links in the empty state.\n\t *\n\t * @see https://mantle.ngrok.com/components/empty\n\t *\n\t * @example\n\t * ```tsx\n\t * <Empty.Root>\n\t *   <Empty.Icon svg={<GhostIcon />} />\n\t *   <Empty.Title>No endpoints yet</Empty.Title>\n\t *   <Empty.Description>Create your first endpoint to get started.</Empty.Description>\n\t *   <Empty.Actions>\n\t *     <Button>Create endpoint</Button>\n\t *   </Empty.Actions>\n\t * </Empty.Root>\n\t * ```\n\t */\n\tActions,\n} as const;\n\nexport {\n\t//,\n\tEmpty,\n};\n"],"mappings":"0JAyBA,MAAM,GAAQ,CAAE,UAAS,WAAU,YAAW,GAAG,KAI/C,EAHY,EAAU,EAAO,MAG7B,CACC,YAAU,QACV,UAAW,EAAG,gEAAiE,CAAS,EACxF,GAAI,EAEH,UACI,CAAA,EAGR,EAAK,YAAc,QA2BnB,MAAM,GAAQ,CAAE,YAAW,MAAK,GAAG,KAEjC,EAAC,EAAD,CACC,YAAU,aACV,UAAW,EAAG,0BAA2B,CAAS,EAC7C,MACL,GAAI,CACJ,CAAA,EAGH,EAAK,YAAc,YAwBnB,MAAM,GAAS,CACd,UACA,WACA,YACA,GAAG,KAKF,EAHY,EAAU,EAAO,KAG7B,CACC,YAAU,cACV,UAAW,EAAG,kCAAmC,CAAS,EAC1D,GAAI,EAEH,UACI,CAAA,EAGR,EAAM,YAAc,aA0BpB,MAAM,GAAe,CACpB,UACA,WACA,YACA,GAAG,KAKF,EAHY,EAAU,EAAO,MAG7B,CACC,YAAU,oBACV,UAAW,EAAG,mCAAoC,CAAS,EAC3D,GAAI,EAEH,UACI,CAAA,EAGR,EAAY,YAAc,mBAoB1B,MAAM,GAAW,CAChB,UACA,WACA,YACA,GAAG,KAKF,EAHY,EAAU,EAAO,MAG7B,CACC,YAAU,gBACV,UAAW,EAAG,+BAAgC,CAAS,EACvD,GAAI,EAEH,UACI,CAAA,EAGR,EAAQ,YAAc,eAgCtB,MAAM,EAAQ,CAmBb,OAmBA,OAuBA,QAoBA,cAkBA,SACD"}

package/dist/{field-context-B7Z1cmZW.js → field-context-4k1kI7Bo.js}

@@ -1,2 +1,2 @@
-import{r as e}from"./validation-BYME8rWN.js";import{createContext as t}from"react";const n=t(null),r=t(null),i=({context:t})=>{if(!t)return{ariaProps:{},validation:void 0};let n=e({defaultAriaInvalid:!1,validation:t.validation});return{ariaProps:{"aria-describedby":`${t.descriptionId} ${t.errorId}`,"aria-errormessage":n.isInvalid?t.errorId:void 0,"aria-invalid":n.ariaInvalid,id:t.controlId,name:t.name},validation:n.validation}};export{n,i as r,r as t};
-//# sourceMappingURL=field-context-B7Z1cmZW.js.map
+import{r as e}from"./validation-DCyx-ceH.js";import{createContext as t}from"react";const n=t(null),r=t(null),i=({context:t})=>{if(!t)return{ariaProps:{},validation:void 0};let n=e({defaultAriaInvalid:!1,validation:t.validation});return{ariaProps:{"aria-describedby":`${t.descriptionId} ${t.errorId}`,"aria-errormessage":n.isInvalid?t.errorId:void 0,"aria-invalid":n.ariaInvalid,id:t.controlId,name:t.name},validation:n.validation}};export{n,i as r,r as t};
+//# sourceMappingURL=field-context-4k1kI7Bo.js.map

package/dist/{field-context-B7Z1cmZW.js.map → field-context-4k1kI7Bo.js.map}

@@ -1 +1 @@
-{"version":3,"file":"field-context-B7Z1cmZW.js","names":[],"sources":["../src/components/field/field-context.ts"],"sourcesContent":["import { createContext, type ComponentProps } from \"react\";\nimport { parseValidation, type ValidationState } from \"./validation.js\";\n\n/**\n * ARIA and identity props that `Field.Control` applies to the field's\n * focusable control. `id` and `name` come from the surrounding `Field.Item`\n * so a caller only needs to declare `name` once.\n */\ntype FieldControlAriaProps = {\n\t/**\n\t * IDREFs for helper or error text that describe the focusable control.\n\t */\n\t\"aria-describedby\"?: string;\n\t/**\n\t * IDREFs for error text that represent the control's current error state.\n\t */\n\t\"aria-errormessage\"?: string;\n\t/**\n\t * The resolved ARIA invalid state for the focusable control.\n\t */\n\t\"aria-invalid\"?: ComponentProps<\"input\">[\"aria-invalid\"];\n\t/**\n\t * Stable DOM id for the focusable control, generated by `Field.Item` and\n\t * also used as `Field.Label`'s default `htmlFor`.\n\t */\n\tid?: string;\n\t/**\n\t * Form value identity from `Field.Item`'s required `name` prop.\n\t */\n\tname?: string;\n};\n\n/**\n * Context value owned by `Field.Item` and consumed by message/control parts.\n *\n * `Field.Item` owns the two stable slot IDs (one for the description, one for\n * the error list) so consumers don't manage ARIA wiring themselves. The IDs\n * are emitted unconditionally; ARIA treats unresolved IDREFs as no-ops, so\n * dangling IDs (when no description or error list is rendered) are harmless.\n */\ntype FieldItemContextValue = {\n\t/**\n\t * Stable DOM id applied to the `Field.Control` child and consumed by\n\t * `Field.Label` as the default `htmlFor` target.\n\t */\n\tcontrolId: string;\n\t/**\n\t * Stable ID for the rendered `Field.Description` slot, generated once per\n\t * `Field.Item`.\n\t */\n\tdescriptionId: string;\n\t/**\n\t * Stable ID for the rendered `Field.Errors` / `Field.ErrorList` slot,\n\t * generated once per `Field.Item`.\n\t */\n\terrorId: string;\n\t/**\n\t * Form-value name for the field, supplied by the required `name` prop on\n\t * `Field.Item` and splatted onto the `Field.Control` child.\n\t */\n\tname: string;\n\t/**\n\t * `true` while a non-empty `Field.Errors` / `Field.ErrorList` is mounted\n\t * under this `Field.Item`. Used by `Field.Item` to infer an `\"error\"`\n\t * validation state when no explicit `validation` prop is supplied.\n\t */\n\thasErrors: boolean;\n\t/**\n\t * Marks a non-empty `Field.Errors` / `Field.ErrorList` as mounted. Returns\n\t * its cleanup callback.\n\t */\n\tregisterError: () => () => void;\n\t/**\n\t * Validation state inferred or supplied by the surrounding `Field.Item`.\n\t */\n\tvalidation?: ValidationState;\n};\n\n/**\n * Options for resolving the ARIA props that `Field.Control` applies.\n */\ntype ResolveFieldControlAriaPropsOptions = {\n\t/**\n\t * The nearest `Field.Item` context, when the control is rendered inside one.\n\t */\n\tcontext: FieldItemContextValue | null;\n};\n\n/**\n * Context shared by the parts of a single `Field.Item`.\n */\nconst FieldItemContext = createContext<FieldItemContextValue | null>(null);\n\n/**\n * Context published by `Field.Control` carrying the resolved ARIA / identity\n * props that should land on the focusable control. Mantle compound triggers\n * (`Select.Trigger`, `MultiSelect.Trigger`, …) consume this so wrapping a\n * compound widget in `Field.Control` works — `cloneElement` only reaches the\n * direct child, which for a compound widget is a context provider that does\n * not forward ARIA props to its inner trigger.\n *\n * `null` when no `Field.Control` is in the tree.\n */\nconst FieldControlContext = createContext<FieldControlAriaProps | null>(null);\n\n/**\n * Resolves the ARIA, identity, and validation props that `Field.Control`\n * applies to its focusable child. `Field.Item` is the single source of truth\n * for `id`, `name`, `aria-*`, and `validation` — the resolver reads only the\n * surrounding `Field.Item` context and ignores anything supplied on the child\n * element. To override these values, set them on `Field.Item` itself.\n */\nconst resolveFieldControlAriaProps = ({ context }: ResolveFieldControlAriaPropsOptions) => {\n\tif (!context) {\n\t\treturn {\n\t\t\tariaProps: {} as const satisfies FieldControlAriaProps,\n\t\t\tvalidation: undefined,\n\t\t};\n\t}\n\n\tconst parsedValidation = parseValidation({\n\t\tdefaultAriaInvalid: false,\n\t\tvalidation: context.validation,\n\t});\n\t// Always emit both slot IDs in aria-describedby when inside a Field.Item.\n\t// Per WAI-ARIA, unresolved IDREFs are ignored by assistive tech, so the\n\t// dangling ID is harmless when the corresponding slot isn't rendered and\n\t// lets us skip mount-time bookkeeping. aria-errormessage is additionally\n\t// spec-gated on aria-invalid=\"true\", so it stays inert until the field is\n\t// actually invalid.\n\tconst ariaDescribedBy = `${context.descriptionId} ${context.errorId}`;\n\tconst ariaErrorMessage = parsedValidation.isInvalid ? context.errorId : undefined;\n\n\treturn {\n\t\tariaProps: {\n\t\t\t\"aria-describedby\": ariaDescribedBy,\n\t\t\t\"aria-errormessage\": ariaErrorMessage,\n\t\t\t\"aria-invalid\": parsedValidation.ariaInvalid,\n\t\t\tid: context.controlId,\n\t\t\tname: context.name,\n\t\t} satisfies FieldControlAriaProps,\n\t\tvalidation: parsedValidation.validation,\n\t};\n};\n\nexport {\n\t//,\n\tFieldControlContext,\n\tFieldItemContext,\n\tresolveFieldControlAriaProps,\n};\nexport type {\n\t//,\n\tFieldControlAriaProps,\n\tFieldItemContextValue,\n};\n"],"mappings":"mFA2FA,MAAM,EAAmB,EAA4C,KAAK,CAYpE,EAAsB,EAA4C,KAAK,CASvE,GAAgC,CAAE,aAAmD,CAC1F,GAAI,CAAC,EACJ,MAAO,CACN,UAAW,EAAE,CACb,WAAY,IAAA,GACZ,CAGF,IAAM,EAAmB,EAAgB,CACxC,mBAAoB,GACpB,WAAY,EAAQ,WACpB,CAAC,CAUF,MAAO,CACN,UAAW,CACV,mBAAoB,GALK,EAAQ,cAAc,GAAG,EAAQ,UAM1D,oBALuB,EAAiB,UAAY,EAAQ,QAAU,IAAA,GAMtE,eAAgB,EAAiB,YACjC,GAAI,EAAQ,UACZ,KAAM,EAAQ,KACd,CACD,WAAY,EAAiB,WAC7B"}
+{"version":3,"file":"field-context-4k1kI7Bo.js","names":[],"sources":["../src/components/field/field-context.ts"],"sourcesContent":["import { createContext, type ComponentProps } from \"react\";\nimport { parseValidation, type ValidationState } from \"./validation.js\";\n\n/**\n * ARIA and identity props that `Field.Control` applies to the field's\n * focusable control. `id` and `name` come from the surrounding `Field.Item`\n * so a caller only needs to declare `name` once.\n */\ntype FieldControlAriaProps = {\n\t/**\n\t * IDREFs for helper or error text that describe the focusable control.\n\t */\n\t\"aria-describedby\"?: string;\n\t/**\n\t * IDREFs for error text that represent the control's current error state.\n\t */\n\t\"aria-errormessage\"?: string;\n\t/**\n\t * The resolved ARIA invalid state for the focusable control.\n\t */\n\t\"aria-invalid\"?: ComponentProps<\"input\">[\"aria-invalid\"];\n\t/**\n\t * Stable DOM id for the focusable control, generated by `Field.Item` and\n\t * also used as `Field.Label`'s default `htmlFor`.\n\t */\n\tid?: string;\n\t/**\n\t * Form value identity from `Field.Item`'s required `name` prop.\n\t */\n\tname?: string;\n};\n\n/**\n * Context value owned by `Field.Item` and consumed by message/control parts.\n *\n * `Field.Item` owns the two stable slot IDs (one for the description, one for\n * the error list) so consumers don't manage ARIA wiring themselves. The IDs\n * are emitted unconditionally; ARIA treats unresolved IDREFs as no-ops, so\n * dangling IDs (when no description or error list is rendered) are harmless.\n */\ntype FieldItemContextValue = {\n\t/**\n\t * Stable DOM id applied to the `Field.Control` child and consumed by\n\t * `Field.Label` as the default `htmlFor` target.\n\t */\n\tcontrolId: string;\n\t/**\n\t * Stable ID for the rendered `Field.Description` slot, generated once per\n\t * `Field.Item`.\n\t */\n\tdescriptionId: string;\n\t/**\n\t * Stable ID for the rendered `Field.Errors` / `Field.ErrorList` slot,\n\t * generated once per `Field.Item`.\n\t */\n\terrorId: string;\n\t/**\n\t * Form-value name for the field, supplied by the required `name` prop on\n\t * `Field.Item` and splatted onto the `Field.Control` child.\n\t */\n\tname: string;\n\t/**\n\t * `true` while a non-empty `Field.Errors` / `Field.ErrorList` is mounted\n\t * under this `Field.Item`. Used by `Field.Item` to infer an `\"error\"`\n\t * validation state when no explicit `validation` prop is supplied.\n\t */\n\thasErrors: boolean;\n\t/**\n\t * Marks a non-empty `Field.Errors` / `Field.ErrorList` as mounted. Returns\n\t * its cleanup callback.\n\t */\n\tregisterError: () => () => void;\n\t/**\n\t * Validation state inferred or supplied by the surrounding `Field.Item`.\n\t */\n\tvalidation?: ValidationState;\n};\n\n/**\n * Options for resolving the ARIA props that `Field.Control` applies.\n */\ntype ResolveFieldControlAriaPropsOptions = {\n\t/**\n\t * The nearest `Field.Item` context, when the control is rendered inside one.\n\t */\n\tcontext: FieldItemContextValue | null;\n};\n\n/**\n * Context shared by the parts of a single `Field.Item`.\n */\nconst FieldItemContext = createContext<FieldItemContextValue | null>(null);\n\n/**\n * Context published by `Field.Control` carrying the resolved ARIA / identity\n * props that should land on the focusable control. Mantle compound triggers\n * (`Select.Trigger`, `MultiSelect.Trigger`, …) consume this so wrapping a\n * compound widget in `Field.Control` works — `cloneElement` only reaches the\n * direct child, which for a compound widget is a context provider that does\n * not forward ARIA props to its inner trigger.\n *\n * `null` when no `Field.Control` is in the tree.\n */\nconst FieldControlContext = createContext<FieldControlAriaProps | null>(null);\n\n/**\n * Resolves the ARIA, identity, and validation props that `Field.Control`\n * applies to its focusable child. `Field.Item` is the single source of truth\n * for `id`, `name`, `aria-*`, and `validation` — the resolver reads only the\n * surrounding `Field.Item` context and ignores anything supplied on the child\n * element. To override these values, set them on `Field.Item` itself.\n */\nconst resolveFieldControlAriaProps = ({ context }: ResolveFieldControlAriaPropsOptions) => {\n\tif (!context) {\n\t\treturn {\n\t\t\tariaProps: {} as const satisfies FieldControlAriaProps,\n\t\t\tvalidation: undefined,\n\t\t};\n\t}\n\n\tconst parsedValidation = parseValidation({\n\t\tdefaultAriaInvalid: false,\n\t\tvalidation: context.validation,\n\t});\n\t// Always emit both slot IDs in aria-describedby when inside a Field.Item.\n\t// Per WAI-ARIA, unresolved IDREFs are ignored by assistive tech, so the\n\t// dangling ID is harmless when the corresponding slot isn't rendered and\n\t// lets us skip mount-time bookkeeping. aria-errormessage is additionally\n\t// spec-gated on aria-invalid=\"true\", so it stays inert until the field is\n\t// actually invalid.\n\tconst ariaDescribedBy = `${context.descriptionId} ${context.errorId}`;\n\tconst ariaErrorMessage = parsedValidation.isInvalid ? context.errorId : undefined;\n\n\treturn {\n\t\tariaProps: {\n\t\t\t\"aria-describedby\": ariaDescribedBy,\n\t\t\t\"aria-errormessage\": ariaErrorMessage,\n\t\t\t\"aria-invalid\": parsedValidation.ariaInvalid,\n\t\t\tid: context.controlId,\n\t\t\tname: context.name,\n\t\t} satisfies FieldControlAriaProps,\n\t\tvalidation: parsedValidation.validation,\n\t};\n};\n\nexport {\n\t//,\n\tFieldControlContext,\n\tFieldItemContext,\n\tresolveFieldControlAriaProps,\n};\nexport type {\n\t//,\n\tFieldControlAriaProps,\n\tFieldItemContextValue,\n};\n"],"mappings":"mFA2FA,MAAM,EAAmB,EAA4C,IAAI,EAYnE,EAAsB,EAA4C,IAAI,EAStE,GAAgC,CAAE,aAAmD,CAC1F,GAAI,CAAC,EACJ,MAAO,CACN,UAAW,CAAC,EACZ,WAAY,IAAA,EACb,EAGD,IAAM,EAAmB,EAAgB,CACxC,mBAAoB,GACpB,WAAY,EAAQ,UACrB,CAAC,EAUD,MAAO,CACN,UAAW,CACV,mBAAoB,GALK,EAAQ,cAAc,GAAG,EAAQ,UAM1D,oBALuB,EAAiB,UAAY,EAAQ,QAAU,IAAA,GAMtE,eAAgB,EAAiB,YACjC,GAAI,EAAQ,UACZ,KAAM,EAAQ,IACf,EACA,WAAY,EAAiB,UAC9B,CACD"}

package/dist/field.d.ts

@@ -1,10 +1,8 @@
-import { t as WithAsChild } from "./as-child-CpZKMqTE.js";
-import { n as IconButtonProps } from "./icon-button-BDTb-lxs.js";
-import { a as ValidationState, c as parseValidation, i as ValidationProp, l as resolveValidation, n as ParsedValidation, o as WithValidation, r as Validation, s as isAriaInvalid, t as AriaInvalid } from "./validation-CBSOmooP.js";
-import { t as Slot } from "./index-BhlxYL_y.js";
-import * as _$react from "react";
+import { t as WithAsChild } from "./as-child-uN_018tj.js";
+import { n as IconButtonProps } from "./icon-button-ntupABbM.js";
+import { a as ValidationState, c as parseValidation, i as ValidationProp, l as resolveValidation, n as ParsedValidation, o as WithValidation, r as Validation, s as isAriaInvalid, t as AriaInvalid } from "./validation-xyX_6kph.js";
+import { t as Slot } from "./index-BL5WVva_.js";
 import { ComponentProps, ReactElement, ReactNode } from "react";
-import * as _$_radix_ui_react_popover0 from "@radix-ui/react-popover";
 
 //#region src/components/field/field-context.d.ts
 /**
@@ -227,7 +225,7 @@ declare const Field: {
    * </Field.Group>
    * ```
    */
-  readonly Item: _$react.ForwardRefExoticComponent<Omit<FieldItemProps, "ref"> & _$react.RefAttributes<HTMLDivElement>>;
+  readonly Item: import("react").ForwardRefExoticComponent<Omit<FieldItemProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
   /**
    * Applies generated field ARIA props and validation state to a single
    * focusable control. Accepts either a single React element child (cloned
@@ -267,7 +265,7 @@ declare const Field: {
    * </Field.Item>
    * ```
    */
-  readonly Control: _$react.ForwardRefExoticComponent<(Omit<FieldControlElementProps, "ref"> | Omit<FieldControlRenderProps, "ref">) & _$react.RefAttributes<HTMLElement>>;
+  readonly Control: import("react").ForwardRefExoticComponent<(Omit<FieldControlElementProps, "ref"> | Omit<FieldControlRenderProps, "ref">) & import("react").RefAttributes<HTMLElement>>;
   /**
    * Layout container that stacks multiple `Field.Item`s vertically.
    *
@@ -295,7 +293,7 @@ declare const Field: {
    * </Field.Group>
    * ```
    */
-  readonly Group: _$react.ForwardRefExoticComponent<Omit<_$react.ClassAttributes<HTMLDivElement> & _$react.HTMLAttributes<HTMLDivElement> & WithAsChild, "ref"> & _$react.RefAttributes<HTMLDivElement>>;
+  readonly Group: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & WithAsChild, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
   /**
    * Semantic `<fieldset>` for related controls that share one accessible
    * name from `Field.Legend`.
@@ -313,7 +311,7 @@ declare const Field: {
    * </Field.Set>
    * ```
    */
-  readonly Set: _$react.ForwardRefExoticComponent<Omit<_$react.DetailedHTMLProps<_$react.FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, "ref"> & _$react.RefAttributes<HTMLFieldSetElement>>;
+  readonly Set: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, "ref"> & import("react").RefAttributes<HTMLFieldSetElement>>;
   /**
    * Caption for `Field.Set`. Renders a semantic `<legend>`.
    *
@@ -330,7 +328,7 @@ declare const Field: {
    * </Field.Set>
    * ```
    */
-  readonly Legend: _$react.ForwardRefExoticComponent<Omit<_$react.DetailedHTMLProps<_$react.HTMLAttributes<HTMLLegendElement>, HTMLLegendElement>, "ref"> & _$react.RefAttributes<HTMLLegendElement>>;
+  readonly Legend: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLLegendElement>, HTMLLegendElement>, "ref"> & import("react").RefAttributes<HTMLLegendElement>>;
   /**
    * The Mantle `Label`, exposed on `Field` for field composition. Inside a
    * `Field.Item`, `htmlFor` defaults to the same stable id that `Field.Control`
@@ -365,9 +363,9 @@ declare const Field: {
    * </Field.Group>
    * ```
    */
-  readonly Label: _$react.ForwardRefExoticComponent<Omit<Omit<_$react.DetailedHTMLProps<_$react.LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "ref"> & {
+  readonly Label: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, "ref"> & {
     disabled?: boolean;
-  } & _$react.RefAttributes<HTMLLabelElement>, "ref"> & _$react.RefAttributes<HTMLLabelElement>>;
+  } & import("react").RefAttributes<HTMLLabelElement>, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
   /**
    * Static, label-styled text for a `Field.Item` row that has no focusable
    * control to caption. Renders a `<p>` with the same typography as
@@ -389,7 +387,7 @@ declare const Field: {
    * </Field.Item>
    * ```
    */
-  readonly LabelText: _$react.ForwardRefExoticComponent<Omit<_$react.ClassAttributes<HTMLParagraphElement> & _$react.HTMLAttributes<HTMLParagraphElement> & WithAsChild, "ref"> & _$react.RefAttributes<HTMLParagraphElement>>;
+  readonly LabelText: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLParagraphElement> & import("react").HTMLAttributes<HTMLParagraphElement> & WithAsChild, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>;
   /**
    * Horizontal layout container for the label area of a field. Aligns a
    * `<Field.Label>` (which may contain `Field.Optional`) with adjacent affordances
@@ -419,7 +417,7 @@ declare const Field: {
    * </Field.Group>
    * ```
    */
-  readonly LabelRow: _$react.ForwardRefExoticComponent<Omit<_$react.ClassAttributes<HTMLDivElement> & _$react.HTMLAttributes<HTMLDivElement> & WithAsChild, "ref"> & _$react.RefAttributes<HTMLDivElement>>;
+  readonly LabelRow: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & WithAsChild, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
   /**
    * `Popover.Root` re-export for the help-affordance pattern. Pair with
    * `Field.HelpTrigger` and `Field.HelpContent` to drop a `?` button next to
@@ -449,7 +447,7 @@ declare const Field: {
    * </Field.Group>
    * ```
    */
-  readonly Help: _$react.FC<_$_radix_ui_react_popover0.PopoverProps>;
+  readonly Help: import("react").FC<import("@radix-ui/react-popover").PopoverProps>;
   /**
    * Trigger for a `Field.Help` popover — a ghost `IconButton` with a default
    * `QuestionIcon`. Requires a contextual `label`; pass `icon` to swap the
@@ -479,13 +477,13 @@ declare const Field: {
    * </Field.Group>
    * ```
    */
-  readonly HelpTrigger: _$react.ForwardRefExoticComponent<Partial<Omit<IconButtonProps, "icon" | "label">> & Pick<IconButtonProps, "label"> & {
+  readonly HelpTrigger: import("react").ForwardRefExoticComponent<Partial<Omit<IconButtonProps, "label" | "icon">> & Pick<IconButtonProps, "label"> & {
     /**
      * The icon to render inside the trigger button. Defaults to a Phosphor
      * `QuestionIcon` so the most common case only needs a contextual label.
      */
     icon?: ReactNode;
-  } & _$react.RefAttributes<HTMLButtonElement>>;
+  } & import("react").RefAttributes<HTMLButtonElement>>;
   /**
    * Body of a `Field.Help` popover. Re-exports `Popover.Content` so all
    * positioning / sizing options (`side`, `align`, `preferredWidth`, etc.)
@@ -515,9 +513,9 @@ declare const Field: {
    * </Field.Group>
    * ```
    */
-  readonly HelpContent: _$react.ForwardRefExoticComponent<Omit<Omit<_$_radix_ui_react_popover0.PopoverContentProps & _$react.RefAttributes<HTMLDivElement>, "ref"> & {
+  readonly HelpContent: import("react").ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-popover").PopoverContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & {
     preferredWidth?: `max-w-${string}`;
-  } & _$react.RefAttributes<HTMLDivElement>, "ref"> & _$react.RefAttributes<HTMLDivElement>>;
+  } & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
   /**
    * Inline "(Optional)" suffix to mark a field as optional. Default content
    * is `(Optional)`; pass children to translate or replace it. Place inside
@@ -548,7 +546,7 @@ declare const Field: {
    * </Field.Group>
    * ```
    */
-  readonly Optional: _$react.ForwardRefExoticComponent<Omit<_$react.ClassAttributes<HTMLSpanElement> & _$react.HTMLAttributes<HTMLSpanElement> & WithAsChild, "ref"> & _$react.RefAttributes<HTMLSpanElement>>;
+  readonly Optional: import("react").ForwardRefExoticComponent<Omit<import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement> & WithAsChild, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
   /**
    * Helper / hint text rendered below the control in the muted body color.
    *
@@ -576,7 +574,7 @@ declare const Field: {
    * </Field.Group>
    * ```
    */
-  readonly Description: _$react.ForwardRefExoticComponent<Omit<Omit<_$react.DetailedHTMLProps<_$react.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "id"> & WithAsChild, "ref"> & _$react.RefAttributes<HTMLParagraphElement>>;
+  readonly Description: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "id"> & WithAsChild, "ref"> & import("react").RefAttributes<HTMLParagraphElement>>;
   /**
    * Convenience renderer for validation messages. Trims string messages,
    * filters empty values, and renders a `Field.ErrorList` with one
@@ -606,7 +604,7 @@ declare const Field: {
    * </Field.Group>
    * ```
    */
-  readonly Errors: _$react.ForwardRefExoticComponent<Omit<FieldErrorsProps, "ref"> & _$react.RefAttributes<HTMLUListElement>>;
+  readonly Errors: import("react").ForwardRefExoticComponent<Omit<FieldErrorsProps, "ref"> & import("react").RefAttributes<HTMLUListElement>>;
   /**
    * Wraps one or more `Field.ErrorItem` children in a semantic `<ul>`.
    * Renders nothing when given no renderable children.
@@ -630,7 +628,7 @@ declare const Field: {
    * </Field.Group>
    * ```
    */
-  readonly ErrorList: _$react.ForwardRefExoticComponent<Omit<Omit<_$react.DetailedHTMLProps<_$react.HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "id"> & WithAsChild, "ref"> & _$react.RefAttributes<HTMLUListElement>>;
+  readonly ErrorList: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, "id"> & WithAsChild, "ref"> & import("react").RefAttributes<HTMLUListElement>>;
   /**
    * A single error message list item for a field. Renders an `<li>` in
    * `text-danger-600` and must be nested inside a `Field.ErrorList`.
@@ -654,7 +652,7 @@ declare const Field: {
    * </Field.Group>
    * ```
    */
-  readonly ErrorItem: _$react.ForwardRefExoticComponent<Omit<_$react.DetailedHTMLProps<_$react.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & _$react.RefAttributes<HTMLLIElement>>;
+  readonly ErrorItem: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & import("react").RefAttributes<HTMLLIElement>>;
 };
 //#endregion
 //#region src/components/field/field-error-messages.d.ts

package/dist/field.js

@@ -1,2 +1,2 @@
-import{t as e}from"./cx-D1HYnpvA.js";import{t}from"./slot-D_ZUrdEW.js";import{t as n}from"./icon-button-ZKN0sRIJ.js";import{i as r,n as i,r as a,t as o}from"./validation-BYME8rWN.js";import{t as s}from"./use-isomorphic-layout-effect-CNSD0lhi.js";import{t as c}from"./label-x6FcOpxc.js";import{t as l}from"./popover-CoZxokw_.js";import{n as u,r as d,t as f}from"./field-context-B7Z1cmZW.js";import{Children as p,Fragment as m,cloneElement as h,forwardRef as g,isValidElement as _,useCallback as v,useContext as y,useId as b,useMemo as x,useState as S}from"react";import C from"tiny-invariant";import{jsx as w}from"react/jsx-runtime";import{QuestionIcon as T}from"@phosphor-icons/react/Question";const E=e=>{let t=[],n=new Set;for(let r of e??[]){if(typeof r!=`string`)continue;let e=r.trim();e.length===0||n.has(e)||(n.add(e),t.push(e))}return t},D=e=>!(e==null||typeof e==`boolean`||typeof e==`string`&&e.trim().length===0),O=({children:e,errorItemType:t})=>{let n=!1;return p.forEach(e,e=>{if(!(n||e==null||typeof e==`boolean`)){if(typeof e==`string`){e.trim().length>0&&(n=!0);return}if(!_(e)){n=!0;return}if(e.type===t){n=D(e.props.children);return}if(e.type===m){n=O({children:e.props.children,errorItemType:t});return}n=!0}}),n},k=g(({className:t,...n},r)=>w(`fieldset`,{ref:r,"data-slot":`field-set`,className:e(`flex w-full min-w-0 flex-col gap-4 border-0 p-0`,t),...n}));k.displayName=`FieldSet`;const A=g(({className:t,...n},r)=>w(`legend`,{ref:r,"data-slot":`field-legend`,className:e(`text-strong mb-1.5 text-sm font-medium font-sans`,t),...n}));A.displayName=`FieldLegend`;const j=g(({htmlFor:e,...t},n)=>{let r=y(u);return w(c,{ref:n,htmlFor:e??r?.controlId,...t})});j.displayName=`FieldLabel`;const M=g(({asChild:n,className:r,...i},a)=>w(n?t:`p`,{ref:a,"data-slot":`field-label-text`,className:e(`text-strong text-sm font-medium font-sans`,r),...i}));M.displayName=`FieldLabelText`;const N=g(({asChild:n,className:r,...i},a)=>w(n?t:`div`,{ref:a,"data-slot":`field-label-row`,className:e(`flex items-center gap-1`,r),...i}));N.displayName=`FieldLabelRow`;const P=l.Root,F=g(({appearance:t=`ghost`,className:r,icon:i=w(T,{}),label:a,size:o=`xs`,type:s=`button`,...c},u)=>w(l.Trigger,{asChild:!0,children:w(n,{ref:u,appearance:t,className:e(`text-body -my-0.5`,r),icon:i,label:a,size:o,type:s,...c})}));F.displayName=`FieldHelpTrigger`;const I=g((e,t)=>w(l.Content,{ref:t,"data-slot":`field-help-content`,...e}));I.displayName=`FieldHelpContent`;const L=g(({asChild:n,children:r,className:i,...a},o)=>w(n?t:`span`,{ref:o,"data-slot":`field-optional`,className:e(`text-muted text-sm font-normal font-sans`,i),...a,children:r??`(Optional)`}));L.displayName=`FieldOptional`;const R=g(({asChild:n,className:r,...i},a)=>w(n?t:`div`,{ref:a,"data-slot":`field-group`,className:e(`flex w-full flex-col gap-4`,r),...i}));R.displayName=`FieldGroup`;const z=g(({asChild:n,children:i,className:a,name:s,validation:c,...l},d)=>{let f=n?t:`div`,p=b(),m=b(),h=b(),[g,_]=S(!1),y=r(c??(g?`error`:void 0)),C=v(()=>(_(!0),()=>{_(!1)}),[]),T=x(()=>({controlId:p,descriptionId:m,errorId:h,hasErrors:g,name:s,registerError:C,validation:y}),[p,m,h,g,s,C,y]);return w(u.Provider,{value:T,children:w(o,{validation:y,children:w(f,{ref:d,"data-slot":`field-item`,"data-validation":y,className:e(`flex w-full flex-col gap-1.5`,a),...l,children:i})})})});z.displayName=`FieldItem`;const B=g(({children:e,...n},r)=>{let i=y(u),a=d({context:i});return typeof e==`function`?w(o,{validation:a.validation,children:w(f.Provider,{value:i?a.ariaProps:null,children:e(a.ariaProps)})}):(C(_(e),`Field.Control expects a single React element child (or a render-prop function). Got a non-element value (string, array, fragment, null, or undefined). Wrap the control in a single element, or use the function child form: <Field.Control>{(props) => <YourControl {...props} />}</Field.Control>.`),w(o,{validation:a.validation,children:w(f.Provider,{value:i?a.ariaProps:null,children:w(t,{ref:r,...n,children:h(e,a.ariaProps)})})}))});B.displayName=`FieldControl`;const V=g(({asChild:n,className:r,...i},a)=>w(n?t:`p`,{ref:a,"data-slot":`field-description`,id:y(u)?.descriptionId,className:e(`text-body text-sm leading-4`,`[:where([data-slot=field-error-list]+&)]:-mt-1.5`,r),...i}));V.displayName=`FieldDescription`;const H=g(({children:t,className:n,...r},i)=>D(t)?w(`li`,{ref:i,"data-slot":`field-error`,className:e(`text-danger-600 text-sm leading-4`,n),...r,children:t}):null);H.displayName=`FieldErrorItem`;const U=g(({messages:e,...t},n)=>w(W,{ref:n,...t,children:E(e).map((e,t)=>w(H,{children:e},t))}));U.displayName=`FieldErrors`;const W=g(({asChild:n,children:r,className:i,...a},o)=>{let c=O({children:r,errorItemType:H}),l=y(u),d=l?.registerError;return s(()=>{if(!(!c||d==null))return d()},[c,d]),c?w(n?t:`ul`,{ref:o,"data-slot":`field-error-list`,id:l?.errorId,role:`list`,className:e(`m-0 flex w-full flex-col list-none p-0`,i),...a,children:r}):null});W.displayName=`FieldErrorList`;const G={Item:z,Control:B,Group:R,Set:k,Legend:A,Label:j,LabelText:M,LabelRow:N,Help:P,HelpTrigger:F,HelpContent:I,Optional:L,Description:V,Errors:U,ErrorList:W,ErrorItem:H},K=e=>E(e?.map(e=>typeof e==`string`||!e?e:e.message));export{G as Field,i as isAriaInvalid,a as parseValidation,r as resolveValidation,K as toErrorMessages};
+import{t as e}from"./cx-CBSnSC36.js";import{t}from"./slot-CV5fmqFr.js";import{t as n}from"./icon-button-C_Ht_g1C.js";import{i as r,n as i,r as a,t as o}from"./validation-DCyx-ceH.js";import{t as s}from"./use-isomorphic-layout-effect-DdTRtMY-.js";import{t as c}from"./label-DhIUmTN2.js";import{t as l}from"./popover-DponNBot.js";import{n as u,r as d,t as f}from"./field-context-4k1kI7Bo.js";import{Children as p,Fragment as m,cloneElement as h,forwardRef as g,isValidElement as _,useCallback as v,useContext as y,useId as b,useMemo as x,useState as S}from"react";import C from"tiny-invariant";import{jsx as w}from"react/jsx-runtime";import{QuestionIcon as T}from"@phosphor-icons/react/Question";const E=e=>{let t=[],n=new Set;for(let r of e??[]){if(typeof r!=`string`)continue;let e=r.trim();e.length===0||n.has(e)||(n.add(e),t.push(e))}return t},D=e=>!(e==null||typeof e==`boolean`||typeof e==`string`&&e.trim().length===0),O=({children:e,errorItemType:t})=>{let n=!1;return p.forEach(e,e=>{if(!(n||e==null||typeof e==`boolean`)){if(typeof e==`string`){e.trim().length>0&&(n=!0);return}if(!_(e)){n=!0;return}if(e.type===t){n=D(e.props.children);return}if(e.type===m){n=O({children:e.props.children,errorItemType:t});return}n=!0}}),n},k=g(({className:t,...n},r)=>w(`fieldset`,{ref:r,"data-slot":`field-set`,className:e(`flex w-full min-w-0 flex-col gap-4 border-0 p-0`,t),...n}));k.displayName=`FieldSet`;const A=g(({className:t,...n},r)=>w(`legend`,{ref:r,"data-slot":`field-legend`,className:e(`text-strong mb-1.5 text-sm font-medium font-sans`,t),...n}));A.displayName=`FieldLegend`;const j=g(({htmlFor:e,...t},n)=>{let r=y(u);return w(c,{ref:n,htmlFor:e??r?.controlId,...t})});j.displayName=`FieldLabel`;const M=g(({asChild:n,className:r,...i},a)=>w(n?t:`p`,{ref:a,"data-slot":`field-label-text`,className:e(`text-strong text-sm font-medium font-sans`,r),...i}));M.displayName=`FieldLabelText`;const N=g(({asChild:n,className:r,...i},a)=>w(n?t:`div`,{ref:a,"data-slot":`field-label-row`,className:e(`flex items-center gap-1`,r),...i}));N.displayName=`FieldLabelRow`;const P=l.Root,F=w(T,{}),I=g(({appearance:t=`ghost`,className:r,icon:i=F,label:a,size:o=`xs`,type:s=`button`,...c},u)=>w(l.Trigger,{asChild:!0,children:w(n,{ref:u,appearance:t,className:e(`text-body -my-0.5`,r),icon:i,label:a,size:o,type:s,...c})}));I.displayName=`FieldHelpTrigger`;const L=g((e,t)=>w(l.Content,{ref:t,"data-slot":`field-help-content`,...e}));L.displayName=`FieldHelpContent`;const R=g(({asChild:n,children:r,className:i,...a},o)=>w(n?t:`span`,{ref:o,"data-slot":`field-optional`,className:e(`text-muted text-sm font-normal font-sans`,i),...a,children:r??`(Optional)`}));R.displayName=`FieldOptional`;const z=g(({asChild:n,className:r,...i},a)=>w(n?t:`div`,{ref:a,"data-slot":`field-group`,className:e(`flex w-full flex-col gap-4`,r),...i}));z.displayName=`FieldGroup`;const B=g(({asChild:n,children:i,className:a,name:s,validation:c,...l},d)=>{let f=n?t:`div`,p=b(),m=b(),h=b(),[g,_]=S(!1),y=r(c??(g?`error`:void 0)),C=v(()=>(_(!0),()=>{_(!1)}),[]),T=x(()=>({controlId:p,descriptionId:m,errorId:h,hasErrors:g,name:s,registerError:C,validation:y}),[p,m,h,g,s,C,y]);return w(u.Provider,{value:T,children:w(o,{validation:y,children:w(f,{ref:d,"data-slot":`field-item`,"data-validation":y,className:e(`flex w-full flex-col gap-1.5`,a),...l,children:i})})})});B.displayName=`FieldItem`;const V=g(({children:e,...n},r)=>{let i=y(u),a=d({context:i});return typeof e==`function`?w(o,{validation:a.validation,children:w(f.Provider,{value:i?a.ariaProps:null,children:e(a.ariaProps)})}):(C(_(e),`Field.Control expects a single React element child (or a render-prop function). Got a non-element value (string, array, fragment, null, or undefined). Wrap the control in a single element, or use the function child form: <Field.Control>{(props) => <YourControl {...props} />}</Field.Control>.`),w(o,{validation:a.validation,children:w(f.Provider,{value:i?a.ariaProps:null,children:w(t,{ref:r,...n,children:h(e,a.ariaProps)})})}))});V.displayName=`FieldControl`;const H=g(({asChild:n,className:r,...i},a)=>w(n?t:`p`,{ref:a,"data-slot":`field-description`,id:y(u)?.descriptionId,className:e(`text-body text-sm leading-4`,`[:where([data-slot=field-error-list]+&)]:-mt-1.5`,r),...i}));H.displayName=`FieldDescription`;const U=g(({children:t,className:n,...r},i)=>D(t)?w(`li`,{ref:i,"data-slot":`field-error`,className:e(`text-danger-600 text-sm leading-4`,n),...r,children:t}):null);U.displayName=`FieldErrorItem`;const W=g(({messages:e,...t},n)=>w(G,{ref:n,...t,children:E(e).map(e=>w(U,{children:e},e))}));W.displayName=`FieldErrors`;const G=g(({asChild:n,children:r,className:i,...a},o)=>{let c=O({children:r,errorItemType:U}),l=y(u),d=l?.registerError;return s(()=>{if(!(!c||d==null))return d()},[c,d]),c?w(n?t:`ul`,{ref:o,"data-slot":`field-error-list`,id:l?.errorId,role:`list`,className:e(`m-0 flex w-full flex-col list-none p-0`,i),...a,children:r}):null});G.displayName=`FieldErrorList`;const K={Item:B,Control:V,Group:z,Set:k,Legend:A,Label:j,LabelText:M,LabelRow:N,Help:P,HelpTrigger:I,HelpContent:L,Optional:R,Description:H,Errors:W,ErrorList:G,ErrorItem:U},q=e=>E(e?.map(e=>typeof e==`string`||!e?e:e.message));export{K as Field,i as isAriaInvalid,a as parseValidation,r as resolveValidation,q as toErrorMessages};
 //# sourceMappingURL=field.js.map