@wordpress/ui 0.4.1-next.76cff8c98.0 → 0.5.0

package/build-module/form/primitives/input-layout/input-layout.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/form/primitives/input-layout/input-layout.tsx", "../../../../src/utils/css/resets.module.css", "../../../../src/form/primitives/input-layout/style.module.css"],
+  "sourcesContent": ["import clsx from 'clsx';\nimport { forwardRef } from '@wordpress/element';\nimport resetStyles from '../../../utils/css/resets.module.css';\nimport styles from './style.module.css';\nimport type { InputLayoutProps } from './types';\nimport { SlotContextProvider } from './context';\n\n/**\n * A low-level component that handles the visual layout of an input-like field,\n * including disabled states and standard prefix/suffix slots.\n */\nexport const InputLayout = forwardRef< HTMLDivElement, InputLayoutProps >(\n\tfunction InputLayout(\n\t\t{\n\t\t\tclassName,\n\t\t\tchildren,\n\t\t\tvisuallyDisabled,\n\t\t\tsize = 'default',\n\t\t\tisBorderless,\n\t\t\tprefix,\n\t\t\tsuffix,\n\t\t\t...restProps\n\t\t},\n\t\tref\n\t) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tref={ ref }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\tresetStyles[ 'box-sizing' ],\n\t\t\t\t\tstyles[ 'input-layout' ],\n\t\t\t\t\tstyles[ `is-size-${ size }` ],\n\t\t\t\t\tvisuallyDisabled && styles[ 'is-disabled' ],\n\t\t\t\t\tisBorderless && styles[ 'is-borderless' ],\n\t\t\t\t\tclassName\n\t\t\t\t) }\n\t\t\t\t{ ...restProps }\n\t\t\t>\n\t\t\t\t<SlotContextProvider type=\"prefix\">\n\t\t\t\t\t{ prefix }\n\t\t\t\t</SlotContextProvider>\n\t\t\t\t{ children }\n\t\t\t\t<SlotContextProvider type=\"suffix\">\n\t\t\t\t\t{ suffix }\n\t\t\t\t</SlotContextProvider>\n\t\t\t</div>\n\t\t);\n\t}\n);\n", "const css = `@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;\n\n@layer wp-ui-utilities {\n\t.resets-module__box-sizing__M2zT5 {\n\t\tbox-sizing: border-box;\n\n\t\t*,\n\t\t*::before,\n\t\t*::after {\n\t\t\tbox-sizing: inherit;\n\t\t}\n\t}\n}\n`;\ndocument.head\n    .appendChild(document.createElement(\"style\"))\n    .appendChild(document.createTextNode(css));\nexport {css};\nexport default {\n  \"box-sizing\": \"resets-module__box-sizing__M2zT5\"\n};", "const css = `@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;\n\n@layer wp-ui-components {\n\t.style-module__input-layout__yyuq- {\n\t\t/* TODO: Use padding tokens */\n\t\t--wp-ui-input-layout-padding-inline: calc(var(--wpds-dimension-base) * 3);\n\n\t\tdisplay: flex;\n\t\theight: 40px;\n\t\tbackground-color: var(--wpds-color-bg-interactive-neutral-weak);\n\t\tborder-width: var(--wpds-border-width-surface-xs);\n\t\tborder-style: solid;\n\t\tborder-color: var(--wpds-color-stroke-interactive-neutral);\n\t\tborder-radius: var(--wpds-border-radius-surface-sm);\n\t\tfont-family: var(--wpds-font-family-body);\n\t\tfont-size: max(var(--wpds-font-size-md), 16px); /* avoid mobile zoom */\n\t\tline-height: 1;\n\t\tcolor: var(--wpds-color-fg-interactive-neutral);\n\n\t\t@media (min-width: 600px) {\n\t\t\tfont-size: var(--wpds-font-size-md);\n\t\t}\n\n\t\t&.style-module__is-size-compact__DIB6h {\n\t\t\t/* TODO: Use padding tokens */\n\t\t\t--wp-ui-input-layout-padding-inline: calc(var(--wpds-dimension-base) * 2);\n\t\t\theight: 32px;\n\t\t}\n\n\t\t&.style-module__is-size-small__7WfNo {\n\t\t\t/* TODO: Use padding tokens */\n\t\t\t--wp-ui-input-layout-padding-inline: calc(var(--wpds-dimension-base) * 2);\n\t\t\theight: 24px;\n\t\t}\n\n\t\t&.style-module__is-disabled__b7cQR {\n\t\t\tbackground-color: var(--wpds-color-bg-interactive-neutral-weak-disabled);\n\t\t\tborder-color: var(--wpds-color-stroke-interactive-neutral-disabled);\n\t\t\tcolor: var(--wpds-color-fg-interactive-neutral-disabled);\n\n\t\t\t@media (forced-colors: active) {\n\t\t\t\tborder-color: GrayText;\n\t\t\t\tcolor: GrayText;\n\t\t\t}\n\t\t}\n\n\t\t&.style-module__is-borderless__gJcnB {\n\t\t\tborder-color: transparent;\n\t\t}\n\n\t\t/* Don't show focus ring when the focus is in the prefix or suffix slots */\n\t\t&:has(.style-module__input-layout-slot__DXr61:focus-within) {\n\t\t\toutline: none;\n\t\t}\n\n\t\t&:hover:not(.style-module__is-disabled__b7cQR, .style-module__is-borderless__gJcnB) {\n\t\t\tborder-color: var(--wpds-color-stroke-interactive-neutral-active);\n\t\t}\n\t}\n\n\t.style-module__input-layout-slot__DXr61 {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\n\t\t&.style-module__is-padding-minimal__DJUmg {\n\t\t\t--wp-ui-input-layout-prefix-padding-start:\n\t\t\t\tcalc(var(--wp-ui-input-layout-padding-inline) -\n\t\t\t\tvar(--wpds-dimension-base));\n\t\t\t--wp-ui-input-layout-suffix-padding-end:\n\t\t\t\tcalc(var(--wp-ui-input-layout-padding-inline) -\n\t\t\t\tvar(--wpds-dimension-base));\n\t\t}\n\n\t\t&.style-module__is-prefix__ezQzb {\n\t\t\tpadding-inline-start: var(--wp-ui-input-layout-prefix-padding-start, var(--wp-ui-input-layout-padding-inline));\n\t\t}\n\n\t\t&.style-module__is-suffix__R6el3 {\n\t\t\tpadding-inline-end: var(--wp-ui-input-layout-suffix-padding-end, var(--wp-ui-input-layout-padding-inline));\n\t\t}\n\t}\n}\n`;\ndocument.head\n    .appendChild(document.createElement(\"style\"))\n    .appendChild(document.createTextNode(css));\nexport {css};\nexport default {\n  \"input-layout\": \"style-module__input-layout__yyuq-\",\n  \"is-size-compact\": \"style-module__is-size-compact__DIB6h\",\n  \"is-size-small\": \"style-module__is-size-small__7WfNo\",\n  \"is-disabled\": \"style-module__is-disabled__b7cQR\",\n  \"is-borderless\": \"style-module__is-borderless__gJcnB\",\n  \"input-layout-slot\": \"style-module__input-layout-slot__DXr61\",\n  \"is-padding-minimal\": \"style-module__is-padding-minimal__DJUmg\",\n  \"is-prefix\": \"style-module__is-prefix__ezQzb\",\n  \"is-suffix\": \"style-module__is-suffix__R6el3\"\n};"],
+  "mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,kBAAkB;;;ACD3B,IAAM,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAcZ,SAAS,KACJ,YAAY,SAAS,cAAc,OAAO,CAAC,EAC3C,YAAY,SAAS,eAAe,GAAG,CAAC;AAE7C,IAAO,iBAAQ;AAAA,EACb,cAAc;AAChB;;;ACpBA,IAAMA,OAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAmFZ,SAAS,KACJ,YAAY,SAAS,cAAc,OAAO,CAAC,EAC3C,YAAY,SAAS,eAAeA,IAAG,CAAC;AAE7C,IAAO,gBAAQ;AAAA,EACb,gBAAgB;AAAA,EAChB,mBAAmB;AAAA,EACnB,iBAAiB;AAAA,EACjB,eAAe;AAAA,EACf,iBAAiB;AAAA,EACjB,qBAAqB;AAAA,EACrB,sBAAsB;AAAA,EACtB,aAAa;AAAA,EACb,aAAa;AACf;;;AF5FA,SAAS,2BAA2B;AAqBjC,SAYC,KAZD;AAfI,IAAM,cAAc;AAAA,EAC1B,SAASC,aACR;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACJ,GACA,KACC;AACD,WACC;AAAA,MAAC;AAAA;AAAA,QACA;AAAA,QACA,WAAY;AAAA,UACX,eAAa,YAAa;AAAA,UAC1B,cAAQ,cAAe;AAAA,UACvB,cAAQ,WAAY,IAAK,EAAG;AAAA,UAC5B,oBAAoB,cAAQ,aAAc;AAAA,UAC1C,gBAAgB,cAAQ,eAAgB;AAAA,UACxC;AAAA,QACD;AAAA,QACE,GAAG;AAAA,QAEL;AAAA,8BAAC,uBAAoB,MAAK,UACvB,kBACH;AAAA,UACE;AAAA,UACF,oBAAC,uBAAoB,MAAK,UACvB,kBACH;AAAA;AAAA;AAAA,IACD;AAAA,EAEF;AACD;",
+  "names": ["css", "InputLayout"]
+}

package/build-module/form/primitives/input-layout/slot.mjs

@@ -0,0 +1,130 @@
+// packages/ui/src/form/primitives/input-layout/slot.tsx
+import clsx from "clsx";
+import { forwardRef } from "@wordpress/element";
+
+// packages/ui/src/form/primitives/input-layout/style.module.css
+var css = `@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;
+
+@layer wp-ui-components {
+	.style-module__input-layout__yyuq- {
+		/* TODO: Use padding tokens */
+		--wp-ui-input-layout-padding-inline: calc(var(--wpds-dimension-base) * 3);
+
+		display: flex;
+		height: 40px;
+		background-color: var(--wpds-color-bg-interactive-neutral-weak);
+		border-width: var(--wpds-border-width-surface-xs);
+		border-style: solid;
+		border-color: var(--wpds-color-stroke-interactive-neutral);
+		border-radius: var(--wpds-border-radius-surface-sm);
+		font-family: var(--wpds-font-family-body);
+		font-size: max(var(--wpds-font-size-md), 16px); /* avoid mobile zoom */
+		line-height: 1;
+		color: var(--wpds-color-fg-interactive-neutral);
+
+		@media (min-width: 600px) {
+			font-size: var(--wpds-font-size-md);
+		}
+
+		&.style-module__is-size-compact__DIB6h {
+			/* TODO: Use padding tokens */
+			--wp-ui-input-layout-padding-inline: calc(var(--wpds-dimension-base) * 2);
+			height: 32px;
+		}
+
+		&.style-module__is-size-small__7WfNo {
+			/* TODO: Use padding tokens */
+			--wp-ui-input-layout-padding-inline: calc(var(--wpds-dimension-base) * 2);
+			height: 24px;
+		}
+
+		&.style-module__is-disabled__b7cQR {
+			background-color: var(--wpds-color-bg-interactive-neutral-weak-disabled);
+			border-color: var(--wpds-color-stroke-interactive-neutral-disabled);
+			color: var(--wpds-color-fg-interactive-neutral-disabled);
+
+			@media (forced-colors: active) {
+				border-color: GrayText;
+				color: GrayText;
+			}
+		}
+
+		&.style-module__is-borderless__gJcnB {
+			border-color: transparent;
+		}
+
+		/* Don't show focus ring when the focus is in the prefix or suffix slots */
+		&:has(.style-module__input-layout-slot__DXr61:focus-within) {
+			outline: none;
+		}
+
+		&:hover:not(.style-module__is-disabled__b7cQR, .style-module__is-borderless__gJcnB) {
+			border-color: var(--wpds-color-stroke-interactive-neutral-active);
+		}
+	}
+
+	.style-module__input-layout-slot__DXr61 {
+		display: flex;
+		align-items: center;
+
+		&.style-module__is-padding-minimal__DJUmg {
+			--wp-ui-input-layout-prefix-padding-start:
+				calc(var(--wp-ui-input-layout-padding-inline) -
+				var(--wpds-dimension-base));
+			--wp-ui-input-layout-suffix-padding-end:
+				calc(var(--wp-ui-input-layout-padding-inline) -
+				var(--wpds-dimension-base));
+		}
+
+		&.style-module__is-prefix__ezQzb {
+			padding-inline-start: var(--wp-ui-input-layout-prefix-padding-start, var(--wp-ui-input-layout-padding-inline));
+		}
+
+		&.style-module__is-suffix__R6el3 {
+			padding-inline-end: var(--wp-ui-input-layout-suffix-padding-end, var(--wp-ui-input-layout-padding-inline));
+		}
+	}
+}
+`;
+document.head.appendChild(document.createElement("style")).appendChild(document.createTextNode(css));
+var style_default = {
+  "input-layout": "style-module__input-layout__yyuq-",
+  "is-size-compact": "style-module__is-size-compact__DIB6h",
+  "is-size-small": "style-module__is-size-small__7WfNo",
+  "is-disabled": "style-module__is-disabled__b7cQR",
+  "is-borderless": "style-module__is-borderless__gJcnB",
+  "input-layout-slot": "style-module__input-layout-slot__DXr61",
+  "is-padding-minimal": "style-module__is-padding-minimal__DJUmg",
+  "is-prefix": "style-module__is-prefix__ezQzb",
+  "is-suffix": "style-module__is-suffix__R6el3"
+};
+
+// packages/ui/src/form/primitives/input-layout/slot.tsx
+import { useInputLayoutSlotContext } from "./context.mjs";
+import { jsx } from "react/jsx-runtime";
+var InputLayoutSlot = forwardRef(function InputLayoutSlot2({ type: typeProp, padding = "default", ...restProps }, ref) {
+  const typeContext = useInputLayoutSlotContext();
+  const type = typeProp ?? typeContext;
+  if (!type) {
+    throw new Error(
+      "InputLayoutSlot requires a `type` prop or must be used within an InputLayout prefix/suffix slot."
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      className: clsx(
+        style_default["input-layout-slot"],
+        style_default[`is-${type}`],
+        style_default[`is-padding-${padding}`]
+      ),
+      ...restProps
+    }
+  );
+});
+InputLayoutSlot.displayName = "InputLayout.Slot";
+export {
+  InputLayoutSlot
+};
+//# sourceMappingURL=slot.mjs.map

package/build-module/form/primitives/input-layout/slot.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/form/primitives/input-layout/slot.tsx", "../../../../src/form/primitives/input-layout/style.module.css"],
+  "sourcesContent": ["import clsx from 'clsx';\nimport { forwardRef } from '@wordpress/element';\nimport styles from './style.module.css';\nimport type { InputLayoutSlotProps } from './types';\nimport { useInputLayoutSlotContext } from './context';\n\n/**\n * A layout helper to add paddings in a prefix or suffix.\n */\nexport const InputLayoutSlot = forwardRef<\n\tHTMLDivElement,\n\tInputLayoutSlotProps\n>( function InputLayoutSlot(\n\t{ type: typeProp, padding = 'default', ...restProps },\n\tref\n) {\n\tconst typeContext = useInputLayoutSlotContext();\n\tconst type = typeProp ?? typeContext;\n\n\tif ( ! type ) {\n\t\tthrow new Error(\n\t\t\t'InputLayoutSlot requires a `type` prop or must be used within an InputLayout prefix/suffix slot.'\n\t\t);\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tref={ ref }\n\t\t\tclassName={ clsx(\n\t\t\t\tstyles[ 'input-layout-slot' ],\n\t\t\t\tstyles[ `is-${ type }` ],\n\t\t\t\tstyles[ `is-padding-${ padding }` ]\n\t\t\t) }\n\t\t\t{ ...restProps }\n\t\t/>\n\t);\n} );\n\nInputLayoutSlot.displayName = 'InputLayout.Slot';\n", "const css = `@layer wp-ui-utilities, wp-ui-components, wp-ui-compositions, wp-ui-overrides;\n\n@layer wp-ui-components {\n\t.style-module__input-layout__yyuq- {\n\t\t/* TODO: Use padding tokens */\n\t\t--wp-ui-input-layout-padding-inline: calc(var(--wpds-dimension-base) * 3);\n\n\t\tdisplay: flex;\n\t\theight: 40px;\n\t\tbackground-color: var(--wpds-color-bg-interactive-neutral-weak);\n\t\tborder-width: var(--wpds-border-width-surface-xs);\n\t\tborder-style: solid;\n\t\tborder-color: var(--wpds-color-stroke-interactive-neutral);\n\t\tborder-radius: var(--wpds-border-radius-surface-sm);\n\t\tfont-family: var(--wpds-font-family-body);\n\t\tfont-size: max(var(--wpds-font-size-md), 16px); /* avoid mobile zoom */\n\t\tline-height: 1;\n\t\tcolor: var(--wpds-color-fg-interactive-neutral);\n\n\t\t@media (min-width: 600px) {\n\t\t\tfont-size: var(--wpds-font-size-md);\n\t\t}\n\n\t\t&.style-module__is-size-compact__DIB6h {\n\t\t\t/* TODO: Use padding tokens */\n\t\t\t--wp-ui-input-layout-padding-inline: calc(var(--wpds-dimension-base) * 2);\n\t\t\theight: 32px;\n\t\t}\n\n\t\t&.style-module__is-size-small__7WfNo {\n\t\t\t/* TODO: Use padding tokens */\n\t\t\t--wp-ui-input-layout-padding-inline: calc(var(--wpds-dimension-base) * 2);\n\t\t\theight: 24px;\n\t\t}\n\n\t\t&.style-module__is-disabled__b7cQR {\n\t\t\tbackground-color: var(--wpds-color-bg-interactive-neutral-weak-disabled);\n\t\t\tborder-color: var(--wpds-color-stroke-interactive-neutral-disabled);\n\t\t\tcolor: var(--wpds-color-fg-interactive-neutral-disabled);\n\n\t\t\t@media (forced-colors: active) {\n\t\t\t\tborder-color: GrayText;\n\t\t\t\tcolor: GrayText;\n\t\t\t}\n\t\t}\n\n\t\t&.style-module__is-borderless__gJcnB {\n\t\t\tborder-color: transparent;\n\t\t}\n\n\t\t/* Don't show focus ring when the focus is in the prefix or suffix slots */\n\t\t&:has(.style-module__input-layout-slot__DXr61:focus-within) {\n\t\t\toutline: none;\n\t\t}\n\n\t\t&:hover:not(.style-module__is-disabled__b7cQR, .style-module__is-borderless__gJcnB) {\n\t\t\tborder-color: var(--wpds-color-stroke-interactive-neutral-active);\n\t\t}\n\t}\n\n\t.style-module__input-layout-slot__DXr61 {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\n\t\t&.style-module__is-padding-minimal__DJUmg {\n\t\t\t--wp-ui-input-layout-prefix-padding-start:\n\t\t\t\tcalc(var(--wp-ui-input-layout-padding-inline) -\n\t\t\t\tvar(--wpds-dimension-base));\n\t\t\t--wp-ui-input-layout-suffix-padding-end:\n\t\t\t\tcalc(var(--wp-ui-input-layout-padding-inline) -\n\t\t\t\tvar(--wpds-dimension-base));\n\t\t}\n\n\t\t&.style-module__is-prefix__ezQzb {\n\t\t\tpadding-inline-start: var(--wp-ui-input-layout-prefix-padding-start, var(--wp-ui-input-layout-padding-inline));\n\t\t}\n\n\t\t&.style-module__is-suffix__R6el3 {\n\t\t\tpadding-inline-end: var(--wp-ui-input-layout-suffix-padding-end, var(--wp-ui-input-layout-padding-inline));\n\t\t}\n\t}\n}\n`;\ndocument.head\n    .appendChild(document.createElement(\"style\"))\n    .appendChild(document.createTextNode(css));\nexport {css};\nexport default {\n  \"input-layout\": \"style-module__input-layout__yyuq-\",\n  \"is-size-compact\": \"style-module__is-size-compact__DIB6h\",\n  \"is-size-small\": \"style-module__is-size-small__7WfNo\",\n  \"is-disabled\": \"style-module__is-disabled__b7cQR\",\n  \"is-borderless\": \"style-module__is-borderless__gJcnB\",\n  \"input-layout-slot\": \"style-module__input-layout-slot__DXr61\",\n  \"is-padding-minimal\": \"style-module__is-padding-minimal__DJUmg\",\n  \"is-prefix\": \"style-module__is-prefix__ezQzb\",\n  \"is-suffix\": \"style-module__is-suffix__R6el3\"\n};"],
+  "mappings": ";AAAA,OAAO,UAAU;AACjB,SAAS,kBAAkB;;;ACD3B,IAAM,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAmFZ,SAAS,KACJ,YAAY,SAAS,cAAc,OAAO,CAAC,EAC3C,YAAY,SAAS,eAAe,GAAG,CAAC;AAE7C,IAAO,gBAAQ;AAAA,EACb,gBAAgB;AAAA,EAChB,mBAAmB;AAAA,EACnB,iBAAiB;AAAA,EACjB,eAAe;AAAA,EACf,iBAAiB;AAAA,EACjB,qBAAqB;AAAA,EACrB,sBAAsB;AAAA,EACtB,aAAa;AAAA,EACb,aAAa;AACf;;;AD7FA,SAAS,iCAAiC;AAsBxC;AAjBK,IAAM,kBAAkB,WAG5B,SAASA,iBACX,EAAE,MAAM,UAAU,UAAU,WAAW,GAAG,UAAU,GACpD,KACC;AACD,QAAM,cAAc,0BAA0B;AAC9C,QAAM,OAAO,YAAY;AAEzB,MAAK,CAAE,MAAO;AACb,UAAM,IAAI;AAAA,MACT;AAAA,IACD;AAAA,EACD;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA,WAAY;AAAA,QACX,cAAQ,mBAAoB;AAAA,QAC5B,cAAQ,MAAO,IAAK,EAAG;AAAA,QACvB,cAAQ,cAAe,OAAQ,EAAG;AAAA,MACnC;AAAA,MACE,GAAG;AAAA;AAAA,EACN;AAEF,CAAE;AAEF,gBAAgB,cAAc;",
+  "names": ["InputLayoutSlot"]
+}

package/build-module/form/primitives/input-layout/types.mjs

@@ -0,0 +1 @@
+//# sourceMappingURL=types.mjs.map

package/build-module/form/primitives/input-layout/types.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/build-module/icon/icon.mjs

@@ -0,0 +1,21 @@
+// packages/ui/src/icon/icon.tsx
+import { forwardRef } from "@wordpress/element";
+import { SVG } from "@wordpress/primitives";
+import { jsx } from "react/jsx-runtime";
+var Icon = forwardRef(function Icon2({ icon, size = 24, ...restProps }, ref) {
+  return /* @__PURE__ */ jsx(
+    SVG,
+    {
+      ref,
+      fill: "currentColor",
+      ...icon.props,
+      ...restProps,
+      width: size,
+      height: size
+    }
+  );
+});
+export {
+  Icon
+};
+//# sourceMappingURL=icon.mjs.map

package/build-module/icon/icon.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/icon/icon.tsx"],
+  "sourcesContent": ["import { forwardRef } from '@wordpress/element';\nimport { SVG } from '@wordpress/primitives';\nimport type { IconProps } from './types';\n\n/**\n * Renders an SVG icon with a 24px default size.\n *\n * If no `fill` colors are explicitly set on the icon itself, it will be rendered with a `currentColor` fill.\n *\n * ```jsx\n * import { wordpress } from '@wordpress/icons';\n *\n * <Icon icon={ wordpress } />\n * ```\n */\nexport const Icon = forwardRef< SVGSVGElement, IconProps >( function Icon(\n\t{ icon, size = 24, ...restProps },\n\tref\n) {\n\treturn (\n\t\t<SVG\n\t\t\tref={ ref }\n\t\t\tfill=\"currentColor\"\n\t\t\t{ ...icon.props }\n\t\t\t{ ...restProps }\n\t\t\twidth={ size }\n\t\t\theight={ size }\n\t\t/>\n\t);\n} );\n"],
+  "mappings": ";AAAA,SAAS,kBAAkB;AAC3B,SAAS,WAAW;AAmBlB;AALK,IAAM,OAAO,WAAwC,SAASA,MACpE,EAAE,MAAM,OAAO,IAAI,GAAG,UAAU,GAChC,KACC;AACD,SACC;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA,MAAK;AAAA,MACH,GAAG,KAAK;AAAA,MACR,GAAG;AAAA,MACL,OAAQ;AAAA,MACR,QAAS;AAAA;AAAA,EACV;AAEF,CAAE;",
+  "names": ["Icon"]
+}

package/build-module/icon/index.mjs

@@ -0,0 +1,6 @@
+// packages/ui/src/icon/index.ts
+import { Icon } from "./icon.mjs";
+export {
+  Icon
+};
+//# sourceMappingURL=index.mjs.map

package/build-module/icon/index.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/icon/index.ts"],
+  "sourcesContent": ["export { Icon } from './icon';\n"],
+  "mappings": ";AAAA,SAAS,YAAY;",
+  "names": []
+}

package/build-module/icon/types.mjs

@@ -0,0 +1 @@
+//# sourceMappingURL=types.mjs.map

package/build-module/icon/types.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/build-module/index.mjs

@@ -1,7 +1,9 @@
 // packages/ui/src/index.ts
 export * from "./badge/index.mjs";
 export * from "./box/index.mjs";
+export * from "./button/index.mjs";
 export * from "./form/primitives/index.mjs";
+export * from "./icon/index.mjs";
 export * from "./stack/index.mjs";
 export * from "./visually-hidden/index.mjs";
 //# sourceMappingURL=index.mjs.map

package/build-module/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../src/index.ts"],
-  "sourcesContent": ["export * from './badge';\nexport * from './box';\nexport * from './form/primitives';\nexport * from './stack';\nexport * from './visually-hidden';\n"],
-  "mappings": ";AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;",
+  "sourcesContent": ["export * from './badge';\nexport * from './box';\nexport * from './button';\nexport * from './form/primitives';\nexport * from './icon';\nexport * from './stack';\nexport * from './visually-hidden';\n"],
+  "mappings": ";AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;",
   "names": []
 }

package/build-types/badge/badge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../src/badge/badge.tsx"],"names":[],"mappings":"AAUA,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAwD1C;;;GAGG;AACH,eAAO,MAAM,KAAK,uGAwBf,CAAC"}
+{"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["../../src/badge/badge.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAwD1C;;;GAGG;AACH,eAAO,MAAM,KAAK,uGAwBf,CAAC"}

package/build-types/badge/stories/index.story.d.ts

@@ -1,10 +1,4 @@
-/**
- * External dependencies
- */
-import type { Meta, StoryObj } from '@storybook/react-webpack5';
-/**
- * Internal dependencies
- */
+import type { Meta, StoryObj } from '@storybook/react-vite';
 import { Badge } from '../index';
 declare const meta: Meta<typeof Badge>;
 export default meta;

package/build-types/badge/stories/index.story.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/badge/stories/index.story.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAOhE;;GAEG;AACH,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAEjC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,KAAK,CAI7B,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAE,OAAO,KAAK,CAAE,CAAC;AAEtC,eAAO,MAAM,OAAO,EAAE,KAIrB,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KAMlB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAMpB,CAAC;AAEF,eAAO,MAAM,GAAG,EAAE,KAMjB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAMpB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAM3B,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAMnB,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KAMlB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KA8CxB,CAAC"}
+{"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/badge/stories/index.story.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAEjC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,KAAK,CAG7B,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAE,OAAO,KAAK,CAAE,CAAC;AAEtC,eAAO,MAAM,OAAO,EAAE,KAIrB,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KAMlB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAMpB,CAAC;AAEF,eAAO,MAAM,GAAG,EAAE,KAMjB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAMpB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAM3B,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAMnB,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KAMlB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KA6CxB,CAAC"}

package/build-types/badge/types.d.ts

@@ -1,6 +1,3 @@
-/**
- * Internal dependencies
- */
 import { type ComponentProps } from '../utils/types';
 export interface BadgeProps extends ComponentProps<'span'> {
     /**

package/build-types/badge/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/badge/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAErD,MAAM,WAAW,UAAW,SAAQ,cAAc,CAAE,MAAM,CAAE;IAC3D;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC;IAEjB;;;;OAIG;IACH,MAAM,CAAC,EACJ,MAAM,GACN,QAAQ,GACR,KAAK,GACL,QAAQ,GACR,eAAe,GACf,OAAO,GACP,MAAM,CAAC;CACV"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/badge/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAErD,MAAM,WAAW,UAAW,SAAQ,cAAc,CAAE,MAAM,CAAE;IAC3D;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC;IAEjB;;;;OAIG;IACH,MAAM,CAAC,EACJ,MAAM,GACN,QAAQ,GACR,KAAK,GACL,QAAQ,GACR,eAAe,GACf,OAAO,GACP,MAAM,CAAC;CACV"}

package/build-types/box/stories/index.story.d.ts

@@ -1,4 +1,4 @@
-import { type Meta, type StoryObj } from '@storybook/react-webpack5';
+import { type Meta, type StoryObj } from '@storybook/react-vite';
 import { Box } from '../box';
 declare const meta: Meta<typeof Box>;
 export default meta;

package/build-types/box/stories/index.story.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/box/stories/index.story.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,IAAI,EAAE,KAAK,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAErE,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAC;AAE7B,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,GAAG,CAI3B,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAE,OAAO,GAAG,CAAE,CAAC;AAEpC,eAAO,MAAM,OAAO,EAAE,KAgBrB,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAUhC,CAAC"}
+{"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/box/stories/index.story.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,IAAI,EAAE,KAAK,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAEjE,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAC;AAE7B,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,GAAG,CAG3B,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAE,OAAO,GAAG,CAAE,CAAC;AAEpC,eAAO,MAAM,OAAO,EAAE,KAgBrB,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAUhC,CAAC"}

package/build-types/button/button.d.ts

@@ -0,0 +1,3 @@
+import { type ButtonProps } from './types';
+export declare const Button: import("react").ForwardRefExoticComponent<ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
+//# sourceMappingURL=button.d.ts.map

package/build-types/button/button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/button/button.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,SAAS,CAAC;AAK3C,eAAO,MAAM,MAAM,2GA8ClB,CAAC"}

package/build-types/button/icon.d.ts

@@ -0,0 +1,10 @@
+import { type IconProps } from '../icon/types';
+interface ButtonIconProps extends IconProps {
+    /**
+     * The icon to display, from the `@wordpress/icons` package.
+     */
+    icon: IconProps['icon'];
+}
+export declare const ButtonIcon: import("react").ForwardRefExoticComponent<Omit<ButtonIconProps, "ref"> & import("react").RefAttributes<SVGSVGElement>>;
+export {};
+//# sourceMappingURL=icon.d.ts.map

package/build-types/button/icon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../src/button/icon.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,eAAe,CAAC;AAG/C,UAAU,eAAgB,SAAQ,SAAS;IAC1C;;OAEG;IACH,IAAI,EAAE,SAAS,CAAE,MAAM,CAAE,CAAC;CAC1B;AAED,eAAO,MAAM,UAAU,wHAYtB,CAAC"}

package/build-types/button/index.d.ts

@@ -0,0 +1,10 @@
+import { Button as ButtonButton } from './button';
+import { ButtonIcon } from './icon';
+/**
+ * A versatile button component with multiple variants, tones, and sizes.
+ * Built on design tokens for consistent theming and accessibility.
+ */
+export declare const Button: typeof ButtonButton & {
+    Icon: typeof ButtonIcon;
+};
+//# sourceMappingURL=index.d.ts.map

package/build-types/button/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/button/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,UAAU,CAAC;AAClD,OAAO,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AAEpC;;;GAGG;AACH,eAAO,MAAM,MAAM,EAMZ,OAAO,YAAY,GAAG;IAC5B,IAAI,EAAE,OAAO,UAAU,CAAC;CACxB,CAAC"}

package/build-types/button/stories/index.story.d.ts

@@ -0,0 +1,23 @@
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { Button } from '../index';
+declare const meta: Meta<typeof Button>;
+export default meta;
+type Story = StoryObj<typeof Button>;
+export declare const Default: Story;
+export declare const Outline: Story;
+export declare const Minimal: Story;
+export declare const Compact: Story;
+export declare const Small: Story;
+export declare const Neutral: Story;
+export declare const NeutralOutline: Story;
+export declare const Unstyled: Story;
+export declare const AllTonesAndVariants: Story;
+export declare const WithIcon: Story;
+export declare const Loading: Story;
+/**
+ * The pressed state is only available for buttons with `tone="neutral"` and
+ * `variant="minimal"`. This represents a toggle button that is currently in an
+ * active/pressed state.
+ */
+export declare const Pressed: Story;
+//# sourceMappingURL=index.story.d.ts.map

package/build-types/button/stories/index.story.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../src/button/stories/index.story.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,MAAM,CAQ9B,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAE,OAAO,MAAM,CAAE,CAAC;AAEvC,eAAO,MAAM,OAAO,EAAE,KAIrB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAMnB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAO5B,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAMtB,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KA6DjC,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAWtB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAOrB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,OAAO,EAAE,KAoBrB,CAAC"}

package/build-types/button/test/button.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=button.test.d.ts.map

package/build-types/button/test/button.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.test.d.ts","sourceRoot":"","sources":["../../../src/button/test/button.test.tsx"],"names":[],"mappings":""}

package/build-types/button/test/icon.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=icon.test.d.ts.map

package/build-types/button/test/icon.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon.test.d.ts","sourceRoot":"","sources":["../../../src/button/test/icon.test.tsx"],"names":[],"mappings":""}

package/build-types/button/types.d.ts

@@ -0,0 +1,63 @@
+import { type ReactNode, type HTMLAttributes } from 'react';
+import type { Button as _Button } from '@base-ui/react/button';
+import type { ComponentProps } from '../utils/types';
+type _ButtonProps = ComponentProps<typeof _Button>;
+export interface ButtonProps extends Omit<_ButtonProps, 'disabled' | 'aria-pressed'> {
+    /**
+     * The variant of the button. Variants describe the visual style treatment
+     * of the button.
+     *
+     * @default "solid"
+     */
+    variant?: 'solid' | 'outline' | 'minimal' | 'unstyled';
+    /**
+     * The tone of the button, describing a semantic color intent:
+     *
+     * - `'brand': for the most prominent actions, using the brand colors.
+     * - `'neutral'` for less prominent actions.
+     *
+     * @default "brand"
+     */
+    tone?: 'brand' | 'neutral';
+    /**
+     * The size of the button.
+     *
+     * - `'default'`: For normal text-label buttons, unless it is a toggle button.
+     * - `'compact'`: For toggle buttons, icon buttons, and buttons when used in context of either.
+     * - `'small'`: For icon buttons associated with more advanced or auxiliary features.
+     *
+     * @default "default"
+     */
+    size?: 'default' | 'compact' | 'small';
+    /**
+     * Whether the button is disabled.
+     */
+    disabled?: boolean;
+    /**
+     * Whether the element should be focusable even when it is disabled.
+     *
+     * @default true
+     */
+    focusableWhenDisabled?: _ButtonProps['focusableWhenDisabled'];
+    /**
+     * Indicates the current "pressed" state of toggle buttons. This should only
+     * be used with neutral minimal buttons.
+     */
+    'aria-pressed'?: HTMLAttributes<HTMLButtonElement>['aria-pressed'];
+    /**
+     * The content of the button.
+     */
+    children?: ReactNode;
+    /**
+     * Whether the button is in a loading state, such as when an action is being
+     * performed.
+     * @default false
+     */
+    loading?: boolean;
+    /**
+     * The text used for assistive technology to indicate the loading state.
+     */
+    loadingAnnouncement?: string;
+}
+export {};
+//# sourceMappingURL=types.d.ts.map

package/build-types/button/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/button/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAC5D,OAAO,KAAK,EAAE,MAAM,IAAI,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAC/D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAErD,KAAK,YAAY,GAAG,cAAc,CAAE,OAAO,OAAO,CAAE,CAAC;AAErD,MAAM,WAAW,WAChB,SAAQ,IAAI,CAAE,YAAY,EAAE,UAAU,GAAG,cAAc,CAAE;IACzD;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,CAAC;IAEvD;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAE3B;;;;;;;;OAQG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;IAEvC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,YAAY,CAAE,uBAAuB,CAAE,CAAC;IAEhE;;;OAGG;IACH,cAAc,CAAC,EAAE,cAAc,CAAE,iBAAiB,CAAE,CAAE,cAAc,CAAE,CAAC;IAEvE;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;OAEG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC7B"}

package/build-types/form/primitives/field/control.d.ts

@@ -1,5 +1,5 @@
 import { Field as _Field } from '@base-ui/react/field';
-export declare const Control: import("react").ForwardRefExoticComponent<Omit<import("../../../utils/types").ComponentProps<import("react").ForwardRefExoticComponent<import("@base-ui/react/field").FieldControlProps & import("react").RefAttributes<HTMLInputElement>>>, "defaultValue"> & {
+export declare const Control: import("react").ForwardRefExoticComponent<Omit<import("../../../utils/types").ComponentProps<import("react").ForwardRefExoticComponent<import("@base-ui/react").FieldControlProps & import("react").RefAttributes<HTMLInputElement>>>, "defaultValue"> & {
     children?: _Field.Control.Props["children"];
     defaultValue?: _Field.Control.Props["defaultValue"];
 } & import("react").RefAttributes<HTMLInputElement>>;

package/build-types/form/primitives/field/description.d.ts

@@ -1,4 +1,4 @@
-export declare const Description: import("react").ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/field").FieldDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>, "ref">, "className" | "children" | "render"> & {
+export declare const Description: import("react").ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").FieldDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>, "ref">, "className" | "children" | "render"> & {
     className?: string;
     render?: ((props: import("react").HTMLAttributes<any> & {
         ref?: import("react").Ref<any> | undefined;

package/build-types/form/primitives/field/label.d.ts

@@ -1,5 +1,5 @@
 import { Field as _Field } from '@base-ui/react/field';
-export declare const Label: import("react").ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react/field").FieldLabelProps & import("react").RefAttributes<any>, "ref">, "className" | "children" | "render"> & {
+export declare const Label: import("react").ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").FieldLabelProps & import("react").RefAttributes<any>, "ref">, "className" | "children" | "render"> & {
     className?: string;
     render?: ((props: import("react").HTMLAttributes<any> & {
         ref?: import("react").Ref<any> | undefined;

package/build-types/form/primitives/field/root.d.ts

@@ -3,10 +3,12 @@ import { Field as _Field } from '@base-ui/react/field';
  * A low-level component that associates an accessible label and description
  * with a single form control element.
  *
+ * To label a group of multiple form control elements, use the `Fieldset` component instead.
+ *
  * Simply wrapping a control with this component does not guarantee
  * accessible labeling. See examples for how to associate the label in different cases.
  */
-export declare const Root: import("react").ForwardRefExoticComponent<Omit<import("../../../utils/types").ComponentProps<import("react").ForwardRefExoticComponent<import("@base-ui/react/field").FieldRootProps & import("react").RefAttributes<HTMLDivElement>>>, "disabled" | "validate" | "validationMode" | "validationDebounceTime" | "invalid" | "dirty" | "touched"> & {
+export declare const Root: import("react").ForwardRefExoticComponent<Omit<import("../../../utils/types").ComponentProps<import("react").ForwardRefExoticComponent<import("@base-ui/react").FieldRootProps & import("react").RefAttributes<HTMLDivElement>>>, "disabled" | "validate" | "validationMode" | "validationDebounceTime" | "invalid" | "dirty" | "touched"> & {
     children?: _Field.Root.Props["children"];
     disabled?: _Field.Root.Props["disabled"];
 } & import("react").RefAttributes<HTMLDivElement>>;

package/build-types/form/primitives/field/root.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"root.d.ts","sourceRoot":"","sources":["../../../../src/form/primitives/field/root.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,IAAI,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAUvD;;;;;;GAMG;AACH,eAAO,MAAM,IAAI;;;kDAYd,CAAC"}
+{"version":3,"file":"root.d.ts","sourceRoot":"","sources":["../../../../src/form/primitives/field/root.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,IAAI,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAUvD;;;;;;;;GAQG;AACH,eAAO,MAAM,IAAI;;;kDAYd,CAAC"}

package/build-types/form/primitives/field/stories/index.story.d.ts

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from '@storybook/react-webpack5';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 import '@wordpress/theme/design-tokens.css';
 import { Field } from '../../../..';
 declare const meta: Meta<typeof Field.Root>;

package/build-types/form/primitives/field/stories/index.story.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../../../src/form/primitives/field/stories/index.story.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAEhE,OAAO,oCAAoC,CAAC;AAC5C,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,KAAK,CAAC,IAAI,CAUlC,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB;;;;GAIG;AACH,eAAO,MAAM,OAAO,EAAE,QAAQ,CAAE,OAAO,KAAK,CAAC,IAAI,CAchD,CAAC;AAQF;;;;;;;GAOG;AACH,eAAO,MAAM,YAAY,EAAE,QAAQ,CAAE,OAAO,KAAK,CAAC,IAAI,CAoBrD,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,mBAAmB,EAAE,QAAQ,CAAE,OAAO,KAAK,CAAC,IAAI,CAoB5D,CAAC;AAEF;;;;;;;;;GASG;AACH,eAAO,MAAM,WAAW,EAAE,QAAQ,CAAE,OAAO,KAAK,CAAC,IAAI,CAkBpD,CAAC"}
+{"version":3,"file":"index.story.d.ts","sourceRoot":"","sources":["../../../../../src/form/primitives/field/stories/index.story.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,oCAAoC,CAAC;AAC5C,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAE,OAAO,KAAK,CAAC,IAAI,CAUlC,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB;;;;GAIG;AACH,eAAO,MAAM,OAAO,EAAE,QAAQ,CAAE,OAAO,KAAK,CAAC,IAAI,CAchD,CAAC;AAQF;;;;;;;GAOG;AACH,eAAO,MAAM,YAAY,EAAE,QAAQ,CAAE,OAAO,KAAK,CAAC,IAAI,CAoBrD,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,mBAAmB,EAAE,QAAQ,CAAE,OAAO,KAAK,CAAC,IAAI,CAoB5D,CAAC;AAEF;;;;;;;;;GASG;AACH,eAAO,MAAM,WAAW,EAAE,QAAQ,CAAE,OAAO,KAAK,CAAC,IAAI,CAkBpD,CAAC"}

package/build-types/form/primitives/fieldset/context.d.ts

@@ -0,0 +1,8 @@
+type FieldsetContextType = {
+    registerDescriptionId: (id: string) => void;
+    unregisterDescriptionId: () => void;
+};
+export declare const FieldsetContext: import("react").Context<FieldsetContextType>;
+export declare const useFieldsetContext: () => FieldsetContextType;
+export {};
+//# sourceMappingURL=context.d.ts.map

package/build-types/form/primitives/fieldset/context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../../../../src/form/primitives/fieldset/context.tsx"],"names":[],"mappings":"AAEA,KAAK,mBAAmB,GAAG;IAC1B,qBAAqB,EAAE,CAAE,EAAE,EAAE,MAAM,KAAM,IAAI,CAAC;IAC9C,uBAAuB,EAAE,MAAM,IAAI,CAAC;CACpC,CAAC;AAEF,eAAO,MAAM,eAAe,8CAGzB,CAAC;AAEJ,eAAO,MAAM,kBAAkB,2BAAsC,CAAC"}

package/build-types/form/primitives/fieldset/description.d.ts

@@ -0,0 +1,9 @@
+export declare const FieldsetDescription: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref">, "className" | "children" | "render"> & {
+    className?: string;
+    render?: ((props: import("react").HTMLAttributes<any> & {
+        ref?: import("react").Ref<any> | undefined;
+    }) => React.ReactElement<unknown>) | React.ReactElement<Record<string, unknown>>;
+} & {
+    children?: string;
+} & import("react").RefAttributes<HTMLParagraphElement>>;
+//# sourceMappingURL=description.d.ts.map

package/build-types/form/primitives/fieldset/description.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"description.d.ts","sourceRoot":"","sources":["../../../../src/form/primitives/fieldset/description.tsx"],"names":[],"mappings":"AAOA,eAAO,MAAM,mBAAmB;;;;;;;wDA4B7B,CAAC"}

package/build-types/form/primitives/fieldset/details.d.ts

@@ -0,0 +1,21 @@
+/**
+ * A component for showing additional information about the fieldset,
+ * styled similarly to a normal `Fieldset.Description`.
+ * Unlike a normal description, it can include links and other semantic elements.
+ *
+ * Although this content is not associated with the fieldset using direct semantics,
+ * it is made discoverable to screen reader users via a visually hidden description,
+ * alerting them to the presence of additional information below.
+ *
+ * If the content only includes plain text, use `Fieldset.Description` instead,
+ * so the readout is not unnecessarily verbose for screen reader users.
+ */
+export declare const FieldsetDetails: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "className" | "children" | "render"> & {
+    className?: string;
+    render?: ((props: import("react").HTMLAttributes<any> & {
+        ref?: import("react").Ref<any> | undefined;
+    }) => React.ReactElement<unknown>) | React.ReactElement<Record<string, unknown>>;
+} & {
+    children?: React.ReactNode;
+} & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=details.d.ts.map

package/build-types/form/primitives/fieldset/details.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"details.d.ts","sourceRoot":"","sources":["../../../../src/form/primitives/fieldset/details.tsx"],"names":[],"mappings":"AAQA;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,eAAe;;;;;;;kDAyBzB,CAAC"}

package/build-types/form/primitives/fieldset/index.d.ts

@@ -0,0 +1,6 @@
+import { FieldsetRoot as Root } from './root';
+import { FieldsetLegend as Legend } from './legend';
+import { FieldsetDescription as Description } from './description';
+import { FieldsetDetails as Details } from './details';
+export { Root, Legend, Description, Details };
+//# sourceMappingURL=index.d.ts.map

package/build-types/form/primitives/fieldset/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/form/primitives/fieldset/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9C,OAAO,EAAE,cAAc,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AACpD,OAAO,EAAE,mBAAmB,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACnE,OAAO,EAAE,eAAe,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAEvD,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,WAAW,EAAE,OAAO,EAAE,CAAC"}

package/build-types/form/primitives/fieldset/legend.d.ts

@@ -0,0 +1,9 @@
+export declare const FieldsetLegend: import("react").ForwardRefExoticComponent<Omit<Omit<import("@base-ui/react").FieldsetLegendProps & import("react").RefAttributes<HTMLDivElement>, "ref">, "className" | "children" | "render"> & {
+    className?: string;
+    render?: ((props: import("react").HTMLAttributes<any> & {
+        ref?: import("react").Ref<any> | undefined;
+    }) => React.ReactElement<unknown>) | React.ReactElement<Record<string, unknown>>;
+} & {
+    children?: React.ReactNode;
+} & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=legend.d.ts.map