@wordpress/components 36.0.1 → 37.0.0

package/build-module/validated-form-controls/components/content-editable-control.mjs

@@ -0,0 +1,49 @@
+// packages/components/src/validated-form-controls/components/content-editable-control.tsx
+import clsx from "clsx";
+import { forwardRef, useRef } from "@wordpress/element";
+import { ControlWithError } from "../control-with-error.mjs";
+import ContentEditableControl from "../../content-editable-control/index.mjs";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+var UnforwardedValidatedContentEditableControl = ({
+  required,
+  customValidity,
+  markWhenOptional,
+  value,
+  className,
+  ...restProps
+}, forwardedRef) => {
+  const validityTargetRef = useRef(null);
+  return /* @__PURE__ */ _jsxs("div", {
+    className: "components-validated-control__wrapper-with-error-delegate",
+    children: [/* @__PURE__ */ _jsx(ControlWithError, {
+      required,
+      markWhenOptional,
+      customValidity,
+      getValidityTarget: () => validityTargetRef.current,
+      children: /* @__PURE__ */ _jsx(ContentEditableControl, {
+        ref: forwardedRef,
+        className: clsx("components-validated-control__content-editable", className),
+        "aria-invalid": customValidity?.type === "invalid" || void 0,
+        ...restProps
+      })
+    }), /* @__PURE__ */ _jsx("input", {
+      className: "components-validated-control__error-delegate",
+      type: "text",
+      ref: validityTargetRef,
+      required,
+      value: value?.trim() ?? "",
+      tabIndex: -1,
+      onChange: () => {
+      },
+      onFocus: (e) => {
+        e.target.previousElementSibling?.querySelector('[role="textbox"]')?.focus();
+      }
+    })]
+  });
+};
+var ValidatedContentEditableControl = forwardRef(UnforwardedValidatedContentEditableControl);
+ValidatedContentEditableControl.displayName = "ValidatedContentEditableControl";
+export {
+  ValidatedContentEditableControl
+};
+//# sourceMappingURL=content-editable-control.mjs.map

package/build-module/validated-form-controls/components/content-editable-control.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/validated-form-controls/components/content-editable-control.tsx"],
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { ControlWithError } from '../control-with-error';\nimport ContentEditableControl from '../../content-editable-control';\n\n/**\n * A `contentEditable` field does not participate in the Constraint Validation\n * API, so — like `ValidatedToggleGroupControl` — the validity state lives on a\n * visually hidden delegate input that mirrors whether the field has content.\n */\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst UnforwardedValidatedContentEditableControl = ({\n  required,\n  customValidity,\n  markWhenOptional,\n  value,\n  className,\n  ...restProps\n}, forwardedRef) => {\n  const validityTargetRef = useRef(null);\n  return /*#__PURE__*/_jsxs(\"div\", {\n    className: \"components-validated-control__wrapper-with-error-delegate\",\n    children: [/*#__PURE__*/_jsx(ControlWithError, {\n      required: required,\n      markWhenOptional: markWhenOptional,\n      customValidity: customValidity,\n      getValidityTarget: () => validityTargetRef.current,\n      children: /*#__PURE__*/_jsx(ContentEditableControl, {\n        ref: forwardedRef,\n        className: clsx('components-validated-control__content-editable', className),\n        \"aria-invalid\": customValidity?.type === 'invalid' || undefined,\n        ...restProps\n      })\n    }), /*#__PURE__*/_jsx(\"input\", {\n      className: \"components-validated-control__error-delegate\",\n      type: \"text\",\n      ref: validityTargetRef,\n      required: required\n      // Whitespace-only content reads as empty, matching how a\n      // text-oriented form field is expected to validate `required`.\n      ,\n      value: value?.trim() ?? '',\n      tabIndex: -1,\n      onChange: () => {},\n      onFocus: e => {\n        e.target.previousElementSibling?.querySelector('[role=\"textbox\"]')?.focus();\n      }\n    })]\n  });\n};\nexport const ValidatedContentEditableControl = forwardRef(UnforwardedValidatedContentEditableControl);\nValidatedContentEditableControl.displayName = 'ValidatedContentEditableControl';"],
+  "mappings": ";AAGA,OAAO,UAAU;AAKjB,SAAS,YAAY,cAAc;AAKnC,SAAS,wBAAwB;AACjC,OAAO,4BAA4B;AAOnC,SAAS,OAAO,MAAM,QAAQ,aAAa;AAC3C,IAAM,6CAA6C,CAAC;AAAA,EAClD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAG,iBAAiB;AAClB,QAAM,oBAAoB,OAAO,IAAI;AACrC,SAAoB,sBAAM,OAAO;AAAA,IAC/B,WAAW;AAAA,IACX,UAAU,CAAc,qBAAK,kBAAkB;AAAA,MAC7C;AAAA,MACA;AAAA,MACA;AAAA,MACA,mBAAmB,MAAM,kBAAkB;AAAA,MAC3C,UAAuB,qBAAK,wBAAwB;AAAA,QAClD,KAAK;AAAA,QACL,WAAW,KAAK,kDAAkD,SAAS;AAAA,QAC3E,gBAAgB,gBAAgB,SAAS,aAAa;AAAA,QACtD,GAAG;AAAA,MACL,CAAC;AAAA,IACH,CAAC,GAAgB,qBAAK,SAAS;AAAA,MAC7B,WAAW;AAAA,MACX,MAAM;AAAA,MACN,KAAK;AAAA,MACL;AAAA,MAIA,OAAO,OAAO,KAAK,KAAK;AAAA,MACxB,UAAU;AAAA,MACV,UAAU,MAAM;AAAA,MAAC;AAAA,MACjB,SAAS,OAAK;AACZ,UAAE,OAAO,wBAAwB,cAAc,kBAAkB,GAAG,MAAM;AAAA,MAC5E;AAAA,IACF,CAAC,CAAC;AAAA,EACJ,CAAC;AACH;AACO,IAAM,kCAAkC,WAAW,0CAA0C;AACpG,gCAAgC,cAAc;",
+  "names": []
+}

package/build-module/validated-form-controls/components/custom-select-control.mjs

@@ -21,7 +21,6 @@ var UnforwardedValidatedCustomSelectControl = ({
       children: /* @__PURE__ */ _jsx(
         CustomSelectControl,
         {
-          __next40pxDefaultSize: true,
           ...restProps
         }
       )

package/build-module/validated-form-controls/components/custom-select-control.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/validated-form-controls/components/custom-select-control.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { forwardRef, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { ControlWithError } from '../control-with-error';\nimport CustomSelectControl from '../../custom-select-control';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst UnforwardedValidatedCustomSelectControl = ({\n  required,\n  customValidity,\n  markWhenOptional,\n  ...restProps\n}, forwardedRef) => {\n  const validityTargetRef = useRef(null);\n  return /*#__PURE__*/_jsxs(\"div\", {\n    className: \"components-validated-control__wrapper-with-error-delegate\",\n    ref: forwardedRef,\n    children: [/*#__PURE__*/_jsx(ControlWithError, {\n      required: required,\n      markWhenOptional: markWhenOptional,\n      customValidity: customValidity,\n      getValidityTarget: () => validityTargetRef.current,\n      children: /*#__PURE__*/_jsx(CustomSelectControl\n      // TODO: Upstream limitation - Required isn't passed down correctly,\n      // so it needs to be set on a delegate element.\n      , {\n        __next40pxDefaultSize: true,\n        ...restProps\n      })\n    }), /*#__PURE__*/_jsxs(\"select\", {\n      className: \"components-validated-control__error-delegate\",\n      ref: validityTargetRef,\n      required: required,\n      tabIndex: -1,\n      value: restProps.value?.key ? 'hasvalue' : '',\n      onChange: () => {},\n      onFocus: e => {\n        e.target.previousElementSibling?.querySelector('[role=\"combobox\"]')?.focus();\n      },\n      children: [/*#__PURE__*/_jsx(\"option\", {\n        value: \"\",\n        children: \"No selection\"\n      }), /*#__PURE__*/_jsx(\"option\", {\n        value: \"hasvalue\",\n        children: \"Has selection\"\n      })]\n    })]\n  });\n};\nexport const ValidatedCustomSelectControl = forwardRef(UnforwardedValidatedCustomSelectControl);\nValidatedCustomSelectControl.displayName = 'ValidatedCustomSelectControl';"],
-  "mappings": ";AAGA,SAAS,YAAY,cAAc;AAKnC,SAAS,wBAAwB;AACjC,OAAO,yBAAyB;AAChC,SAAS,OAAO,MAAM,QAAQ,aAAa;AAC3C,IAAM,0CAA0C,CAAC;AAAA,EAC/C;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAG,iBAAiB;AAClB,QAAM,oBAAoB,OAAO,IAAI;AACrC,SAAoB,sBAAM,OAAO;AAAA,IAC/B,WAAW;AAAA,IACX,KAAK;AAAA,IACL,UAAU,CAAc,qBAAK,kBAAkB;AAAA,MAC7C;AAAA,MACA;AAAA,MACA;AAAA,MACA,mBAAmB,MAAM,kBAAkB;AAAA,MAC3C,UAAuB;AAAA,QAAK;AAAA,QAG1B;AAAA,UACA,uBAAuB;AAAA,UACvB,GAAG;AAAA,QACL;AAAA,MAAC;AAAA,IACH,CAAC,GAAgB,sBAAM,UAAU;AAAA,MAC/B,WAAW;AAAA,MACX,KAAK;AAAA,MACL;AAAA,MACA,UAAU;AAAA,MACV,OAAO,UAAU,OAAO,MAAM,aAAa;AAAA,MAC3C,UAAU,MAAM;AAAA,MAAC;AAAA,MACjB,SAAS,OAAK;AACZ,UAAE,OAAO,wBAAwB,cAAc,mBAAmB,GAAG,MAAM;AAAA,MAC7E;AAAA,MACA,UAAU,CAAc,qBAAK,UAAU;AAAA,QACrC,OAAO;AAAA,QACP,UAAU;AAAA,MACZ,CAAC,GAAgB,qBAAK,UAAU;AAAA,QAC9B,OAAO;AAAA,QACP,UAAU;AAAA,MACZ,CAAC,CAAC;AAAA,IACJ,CAAC,CAAC;AAAA,EACJ,CAAC;AACH;AACO,IAAM,+BAA+B,WAAW,uCAAuC;AAC9F,6BAA6B,cAAc;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { forwardRef, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { ControlWithError } from '../control-with-error';\nimport CustomSelectControl from '../../custom-select-control';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst UnforwardedValidatedCustomSelectControl = ({\n  required,\n  customValidity,\n  markWhenOptional,\n  ...restProps\n}, forwardedRef) => {\n  const validityTargetRef = useRef(null);\n  return /*#__PURE__*/_jsxs(\"div\", {\n    className: \"components-validated-control__wrapper-with-error-delegate\",\n    ref: forwardedRef,\n    children: [/*#__PURE__*/_jsx(ControlWithError, {\n      required: required,\n      markWhenOptional: markWhenOptional,\n      customValidity: customValidity,\n      getValidityTarget: () => validityTargetRef.current,\n      children: /*#__PURE__*/_jsx(CustomSelectControl\n      // TODO: Upstream limitation - Required isn't passed down correctly,\n      // so it needs to be set on a delegate element.\n      , {\n        ...restProps\n      })\n    }), /*#__PURE__*/_jsxs(\"select\", {\n      className: \"components-validated-control__error-delegate\",\n      ref: validityTargetRef,\n      required: required,\n      tabIndex: -1,\n      value: restProps.value?.key ? 'hasvalue' : '',\n      onChange: () => {},\n      onFocus: e => {\n        e.target.previousElementSibling?.querySelector('[role=\"combobox\"]')?.focus();\n      },\n      children: [/*#__PURE__*/_jsx(\"option\", {\n        value: \"\",\n        children: \"No selection\"\n      }), /*#__PURE__*/_jsx(\"option\", {\n        value: \"hasvalue\",\n        children: \"Has selection\"\n      })]\n    })]\n  });\n};\nexport const ValidatedCustomSelectControl = forwardRef(UnforwardedValidatedCustomSelectControl);\nValidatedCustomSelectControl.displayName = 'ValidatedCustomSelectControl';"],
+  "mappings": ";AAGA,SAAS,YAAY,cAAc;AAKnC,SAAS,wBAAwB;AACjC,OAAO,yBAAyB;AAChC,SAAS,OAAO,MAAM,QAAQ,aAAa;AAC3C,IAAM,0CAA0C,CAAC;AAAA,EAC/C;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAG,iBAAiB;AAClB,QAAM,oBAAoB,OAAO,IAAI;AACrC,SAAoB,sBAAM,OAAO;AAAA,IAC/B,WAAW;AAAA,IACX,KAAK;AAAA,IACL,UAAU,CAAc,qBAAK,kBAAkB;AAAA,MAC7C;AAAA,MACA;AAAA,MACA;AAAA,MACA,mBAAmB,MAAM,kBAAkB;AAAA,MAC3C,UAAuB;AAAA,QAAK;AAAA,QAG1B;AAAA,UACA,GAAG;AAAA,QACL;AAAA,MAAC;AAAA,IACH,CAAC,GAAgB,sBAAM,UAAU;AAAA,MAC/B,WAAW;AAAA,MACX,KAAK;AAAA,MACL;AAAA,MACA,UAAU;AAAA,MACV,OAAO,UAAU,OAAO,MAAM,aAAa;AAAA,MAC3C,UAAU,MAAM;AAAA,MAAC;AAAA,MACjB,SAAS,OAAK;AACZ,UAAE,OAAO,wBAAwB,cAAc,mBAAmB,GAAG,MAAM;AAAA,MAC7E;AAAA,MACA,UAAU,CAAc,qBAAK,UAAU;AAAA,QACrC,OAAO;AAAA,QACP,UAAU;AAAA,MACZ,CAAC,GAAgB,qBAAK,UAAU;AAAA,QAC9B,OAAO;AAAA,QACP,UAAU;AAAA,MACZ,CAAC,CAAC;AAAA,IACJ,CAAC,CAAC;AAAA,EACJ,CAAC;AACH;AACO,IAAM,+BAA+B,WAAW,uCAAuC;AAC9F,6BAA6B,cAAc;",
   "names": []
 }

package/build-module/validated-form-controls/components/form-token-field.mjs

@@ -19,7 +19,6 @@ var UnforwardedValidatedFormTokenField = ({
       customValidity,
       getValidityTarget: () => validityTargetRef.current,
       children: /* @__PURE__ */ _jsx(FormTokenField, {
-        __next40pxDefaultSize: true,
         ...restProps
       })
     }), /* @__PURE__ */ _jsx("input", {

package/build-module/validated-form-controls/components/form-token-field.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/validated-form-controls/components/form-token-field.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { forwardRef, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { ControlWithError } from '../control-with-error';\nimport { FormTokenField } from '../../form-token-field';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst UnforwardedValidatedFormTokenField = ({\n  required,\n  customValidity,\n  markWhenOptional,\n  ...restProps\n}, forwardedRef) => {\n  const validityTargetRef = useRef(null);\n  return /*#__PURE__*/_jsxs(\"div\", {\n    className: \"components-validated-control__wrapper-with-error-delegate\",\n    ref: forwardedRef,\n    children: [/*#__PURE__*/_jsx(ControlWithError, {\n      required: required,\n      markWhenOptional: markWhenOptional,\n      customValidity: customValidity,\n      getValidityTarget: () => validityTargetRef.current,\n      children: /*#__PURE__*/_jsx(FormTokenField, {\n        __next40pxDefaultSize: true,\n        ...restProps\n      })\n    }), /*#__PURE__*/_jsx(\"input\", {\n      className: \"components-validated-control__error-delegate\",\n      type: \"text\",\n      ref: validityTargetRef,\n      required: required,\n      value: restProps.value && restProps.value.length > 0 ? 'hasvalue' : '',\n      tabIndex: -1,\n      onChange: () => {},\n      onFocus: e => {\n        e.target.previousElementSibling?.querySelector('input[type=\"text\"]')?.focus();\n      }\n    })]\n  });\n};\nexport const ValidatedFormTokenField = forwardRef(UnforwardedValidatedFormTokenField);\nValidatedFormTokenField.displayName = 'ValidatedFormTokenField';"],
-  "mappings": ";AAGA,SAAS,YAAY,cAAc;AAKnC,SAAS,wBAAwB;AACjC,SAAS,sBAAsB;AAC/B,SAAS,OAAO,MAAM,QAAQ,aAAa;AAC3C,IAAM,qCAAqC,CAAC;AAAA,EAC1C;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAG,iBAAiB;AAClB,QAAM,oBAAoB,OAAO,IAAI;AACrC,SAAoB,sBAAM,OAAO;AAAA,IAC/B,WAAW;AAAA,IACX,KAAK;AAAA,IACL,UAAU,CAAc,qBAAK,kBAAkB;AAAA,MAC7C;AAAA,MACA;AAAA,MACA;AAAA,MACA,mBAAmB,MAAM,kBAAkB;AAAA,MAC3C,UAAuB,qBAAK,gBAAgB;AAAA,QAC1C,uBAAuB;AAAA,QACvB,GAAG;AAAA,MACL,CAAC;AAAA,IACH,CAAC,GAAgB,qBAAK,SAAS;AAAA,MAC7B,WAAW;AAAA,MACX,MAAM;AAAA,MACN,KAAK;AAAA,MACL;AAAA,MACA,OAAO,UAAU,SAAS,UAAU,MAAM,SAAS,IAAI,aAAa;AAAA,MACpE,UAAU;AAAA,MACV,UAAU,MAAM;AAAA,MAAC;AAAA,MACjB,SAAS,OAAK;AACZ,UAAE,OAAO,wBAAwB,cAAc,oBAAoB,GAAG,MAAM;AAAA,MAC9E;AAAA,IACF,CAAC,CAAC;AAAA,EACJ,CAAC;AACH;AACO,IAAM,0BAA0B,WAAW,kCAAkC;AACpF,wBAAwB,cAAc;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { forwardRef, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { ControlWithError } from '../control-with-error';\nimport { FormTokenField } from '../../form-token-field';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst UnforwardedValidatedFormTokenField = ({\n  required,\n  customValidity,\n  markWhenOptional,\n  ...restProps\n}, forwardedRef) => {\n  const validityTargetRef = useRef(null);\n  return /*#__PURE__*/_jsxs(\"div\", {\n    className: \"components-validated-control__wrapper-with-error-delegate\",\n    ref: forwardedRef,\n    children: [/*#__PURE__*/_jsx(ControlWithError, {\n      required: required,\n      markWhenOptional: markWhenOptional,\n      customValidity: customValidity,\n      getValidityTarget: () => validityTargetRef.current,\n      children: /*#__PURE__*/_jsx(FormTokenField, {\n        ...restProps\n      })\n    }), /*#__PURE__*/_jsx(\"input\", {\n      className: \"components-validated-control__error-delegate\",\n      type: \"text\",\n      ref: validityTargetRef,\n      required: required,\n      value: restProps.value && restProps.value.length > 0 ? 'hasvalue' : '',\n      tabIndex: -1,\n      onChange: () => {},\n      onFocus: e => {\n        e.target.previousElementSibling?.querySelector('input[type=\"text\"]')?.focus();\n      }\n    })]\n  });\n};\nexport const ValidatedFormTokenField = forwardRef(UnforwardedValidatedFormTokenField);\nValidatedFormTokenField.displayName = 'ValidatedFormTokenField';"],
+  "mappings": ";AAGA,SAAS,YAAY,cAAc;AAKnC,SAAS,wBAAwB;AACjC,SAAS,sBAAsB;AAC/B,SAAS,OAAO,MAAM,QAAQ,aAAa;AAC3C,IAAM,qCAAqC,CAAC;AAAA,EAC1C;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAG,iBAAiB;AAClB,QAAM,oBAAoB,OAAO,IAAI;AACrC,SAAoB,sBAAM,OAAO;AAAA,IAC/B,WAAW;AAAA,IACX,KAAK;AAAA,IACL,UAAU,CAAc,qBAAK,kBAAkB;AAAA,MAC7C;AAAA,MACA;AAAA,MACA;AAAA,MACA,mBAAmB,MAAM,kBAAkB;AAAA,MAC3C,UAAuB,qBAAK,gBAAgB;AAAA,QAC1C,GAAG;AAAA,MACL,CAAC;AAAA,IACH,CAAC,GAAgB,qBAAK,SAAS;AAAA,MAC7B,WAAW;AAAA,MACX,MAAM;AAAA,MACN,KAAK;AAAA,MACL;AAAA,MACA,OAAO,UAAU,SAAS,UAAU,MAAM,SAAS,IAAI,aAAa;AAAA,MACpE,UAAU;AAAA,MACV,UAAU,MAAM;AAAA,MAAC;AAAA,MACjB,SAAS,OAAK;AACZ,UAAE,OAAO,wBAAwB,cAAc,oBAAoB,GAAG,MAAM;AAAA,MAC9E;AAAA,IACF,CAAC,CAAC;AAAA,EACJ,CAAC;AACH;AACO,IAAM,0BAA0B,WAAW,kCAAkC;AACpF,wBAAwB,cAAc;",
   "names": []
 }

package/build-module/validated-form-controls/components/index.mjs

@@ -7,6 +7,7 @@ export * from "./input-control.mjs";
 export * from "./number-control.mjs";
 export * from "./radio-control.mjs";
 export * from "./range-control.mjs";
+export * from "./content-editable-control.mjs";
 export * from "./select-control.mjs";
 export * from "./text-control.mjs";
 export * from "./textarea-control.mjs";

package/build-module/validated-form-controls/components/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/validated-form-controls/components/index.ts"],
-  "sourcesContent": ["export * from './checkbox-control';\nexport * from './combobox-control';\nexport * from './custom-select-control';\nexport * from './form-token-field';\nexport * from './input-control';\nexport * from './number-control';\nexport * from './radio-control';\nexport * from './range-control';\nexport * from './select-control';\nexport * from './text-control';\nexport * from './textarea-control';\nexport * from './toggle-control';\nexport * from './toggle-group-control';"],
-  "mappings": ";AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;",
+  "sourcesContent": ["export * from './checkbox-control';\nexport * from './combobox-control';\nexport * from './custom-select-control';\nexport * from './form-token-field';\nexport * from './input-control';\nexport * from './number-control';\nexport * from './radio-control';\nexport * from './range-control';\nexport * from './content-editable-control';\nexport * from './select-control';\nexport * from './text-control';\nexport * from './textarea-control';\nexport * from './toggle-control';\nexport * from './toggle-group-control';"],
+  "mappings": ";AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;",
   "names": []
 }

package/build-module/validated-form-controls/components/input-control.mjs

@@ -18,7 +18,6 @@ var UnforwardedValidatedInputControl = ({
     customValidity,
     getValidityTarget: () => validityTargetRef.current,
     children: /* @__PURE__ */ _jsx(InputControl, {
-      __next40pxDefaultSize: true,
       ref: mergedRefs,
       ...restProps
     })

package/build-module/validated-form-controls/components/input-control.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/validated-form-controls/components/input-control.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { forwardRef, useRef } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { ControlWithError } from '../control-with-error';\nimport InputControl from '../../input-control';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst UnforwardedValidatedInputControl = ({\n  required,\n  customValidity,\n  markWhenOptional,\n  ...restProps\n}, forwardedRef) => {\n  const validityTargetRef = useRef(null);\n  const mergedRefs = useMergeRefs([forwardedRef, validityTargetRef]);\n  return /*#__PURE__*/_jsx(ControlWithError, {\n    required: required,\n    markWhenOptional: markWhenOptional,\n    customValidity: customValidity,\n    getValidityTarget: () => validityTargetRef.current,\n    children: /*#__PURE__*/_jsx(InputControl, {\n      __next40pxDefaultSize: true,\n      ref: mergedRefs,\n      ...restProps\n    })\n  });\n};\nexport const ValidatedInputControl = forwardRef(UnforwardedValidatedInputControl);\nValidatedInputControl.displayName = 'ValidatedInputControl';"],
-  "mappings": ";AAGA,SAAS,YAAY,cAAc;AACnC,SAAS,oBAAoB;AAK7B,SAAS,wBAAwB;AACjC,OAAO,kBAAkB;AACzB,SAAS,OAAO,YAAY;AAC5B,IAAM,mCAAmC,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAG,iBAAiB;AAClB,QAAM,oBAAoB,OAAO,IAAI;AACrC,QAAM,aAAa,aAAa,CAAC,cAAc,iBAAiB,CAAC;AACjE,SAAoB,qBAAK,kBAAkB;AAAA,IACzC;AAAA,IACA;AAAA,IACA;AAAA,IACA,mBAAmB,MAAM,kBAAkB;AAAA,IAC3C,UAAuB,qBAAK,cAAc;AAAA,MACxC,uBAAuB;AAAA,MACvB,KAAK;AAAA,MACL,GAAG;AAAA,IACL,CAAC;AAAA,EACH,CAAC;AACH;AACO,IAAM,wBAAwB,WAAW,gCAAgC;AAChF,sBAAsB,cAAc;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { forwardRef, useRef } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { ControlWithError } from '../control-with-error';\nimport InputControl from '../../input-control';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst UnforwardedValidatedInputControl = ({\n  required,\n  customValidity,\n  markWhenOptional,\n  ...restProps\n}, forwardedRef) => {\n  const validityTargetRef = useRef(null);\n  const mergedRefs = useMergeRefs([forwardedRef, validityTargetRef]);\n  return /*#__PURE__*/_jsx(ControlWithError, {\n    required: required,\n    markWhenOptional: markWhenOptional,\n    customValidity: customValidity,\n    getValidityTarget: () => validityTargetRef.current,\n    children: /*#__PURE__*/_jsx(InputControl, {\n      ref: mergedRefs,\n      ...restProps\n    })\n  });\n};\nexport const ValidatedInputControl = forwardRef(UnforwardedValidatedInputControl);\nValidatedInputControl.displayName = 'ValidatedInputControl';"],
+  "mappings": ";AAGA,SAAS,YAAY,cAAc;AACnC,SAAS,oBAAoB;AAK7B,SAAS,wBAAwB;AACjC,OAAO,kBAAkB;AACzB,SAAS,OAAO,YAAY;AAC5B,IAAM,mCAAmC,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAG,iBAAiB;AAClB,QAAM,oBAAoB,OAAO,IAAI;AACrC,QAAM,aAAa,aAAa,CAAC,cAAc,iBAAiB,CAAC;AACjE,SAAoB,qBAAK,kBAAkB;AAAA,IACzC;AAAA,IACA;AAAA,IACA;AAAA,IACA,mBAAmB,MAAM,kBAAkB;AAAA,IAC3C,UAAuB,qBAAK,cAAc;AAAA,MACxC,KAAK;AAAA,MACL,GAAG;AAAA,IACL,CAAC;AAAA,EACH,CAAC;AACH;AACO,IAAM,wBAAwB,WAAW,gCAAgC;AAChF,sBAAsB,cAAc;",
   "names": []
 }

package/build-module/validated-form-controls/components/number-control.mjs

@@ -18,7 +18,6 @@ var UnforwardedValidatedNumberControl = ({
     customValidity,
     getValidityTarget: () => validityTargetRef.current,
     children: /* @__PURE__ */ _jsx(NumberControl, {
-      __next40pxDefaultSize: true,
       ref: mergedRefs,
       ...restProps
     })

package/build-module/validated-form-controls/components/number-control.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/validated-form-controls/components/number-control.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { forwardRef, useRef } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { ControlWithError } from '../control-with-error';\nimport NumberControl from '../../number-control';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst UnforwardedValidatedNumberControl = ({\n  required,\n  customValidity,\n  markWhenOptional,\n  ...restProps\n}, forwardedRef) => {\n  const validityTargetRef = useRef(null);\n  const mergedRefs = useMergeRefs([forwardedRef, validityTargetRef]);\n  return /*#__PURE__*/_jsx(ControlWithError, {\n    required: required,\n    markWhenOptional: markWhenOptional,\n    customValidity: customValidity,\n    getValidityTarget: () => validityTargetRef.current,\n    children: /*#__PURE__*/_jsx(NumberControl, {\n      __next40pxDefaultSize: true,\n      ref: mergedRefs,\n      ...restProps\n    })\n  });\n};\nexport const ValidatedNumberControl = forwardRef(UnforwardedValidatedNumberControl);\nValidatedNumberControl.displayName = 'ValidatedNumberControl';"],
-  "mappings": ";AAGA,SAAS,YAAY,cAAc;AACnC,SAAS,oBAAoB;AAK7B,SAAS,wBAAwB;AACjC,OAAO,mBAAmB;AAC1B,SAAS,OAAO,YAAY;AAC5B,IAAM,oCAAoC,CAAC;AAAA,EACzC;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAG,iBAAiB;AAClB,QAAM,oBAAoB,OAAO,IAAI;AACrC,QAAM,aAAa,aAAa,CAAC,cAAc,iBAAiB,CAAC;AACjE,SAAoB,qBAAK,kBAAkB;AAAA,IACzC;AAAA,IACA;AAAA,IACA;AAAA,IACA,mBAAmB,MAAM,kBAAkB;AAAA,IAC3C,UAAuB,qBAAK,eAAe;AAAA,MACzC,uBAAuB;AAAA,MACvB,KAAK;AAAA,MACL,GAAG;AAAA,IACL,CAAC;AAAA,EACH,CAAC;AACH;AACO,IAAM,yBAAyB,WAAW,iCAAiC;AAClF,uBAAuB,cAAc;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { forwardRef, useRef } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { ControlWithError } from '../control-with-error';\nimport NumberControl from '../../number-control';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst UnforwardedValidatedNumberControl = ({\n  required,\n  customValidity,\n  markWhenOptional,\n  ...restProps\n}, forwardedRef) => {\n  const validityTargetRef = useRef(null);\n  const mergedRefs = useMergeRefs([forwardedRef, validityTargetRef]);\n  return /*#__PURE__*/_jsx(ControlWithError, {\n    required: required,\n    markWhenOptional: markWhenOptional,\n    customValidity: customValidity,\n    getValidityTarget: () => validityTargetRef.current,\n    children: /*#__PURE__*/_jsx(NumberControl, {\n      ref: mergedRefs,\n      ...restProps\n    })\n  });\n};\nexport const ValidatedNumberControl = forwardRef(UnforwardedValidatedNumberControl);\nValidatedNumberControl.displayName = 'ValidatedNumberControl';"],
+  "mappings": ";AAGA,SAAS,YAAY,cAAc;AACnC,SAAS,oBAAoB;AAK7B,SAAS,wBAAwB;AACjC,OAAO,mBAAmB;AAC1B,SAAS,OAAO,YAAY;AAC5B,IAAM,oCAAoC,CAAC;AAAA,EACzC;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAG,iBAAiB;AAClB,QAAM,oBAAoB,OAAO,IAAI;AACrC,QAAM,aAAa,aAAa,CAAC,cAAc,iBAAiB,CAAC;AACjE,SAAoB,qBAAK,kBAAkB;AAAA,IACzC;AAAA,IACA;AAAA,IACA;AAAA,IACA,mBAAmB,MAAM,kBAAkB;AAAA,IAC3C,UAAuB,qBAAK,eAAe;AAAA,MACzC,KAAK;AAAA,MACL,GAAG;AAAA,IACL,CAAC;AAAA,EACH,CAAC;AACH;AACO,IAAM,yBAAyB,WAAW,iCAAiC;AAClF,uBAAuB,cAAc;",
   "names": []
 }

package/build-module/validated-form-controls/components/range-control.mjs

@@ -18,7 +18,6 @@ var UnforwardedValidatedRangeControl = ({
     customValidity,
     getValidityTarget: () => validityTargetRef.current,
     children: /* @__PURE__ */ _jsx(RangeControl, {
-      __next40pxDefaultSize: true,
       ref: mergedRefs,
       ...restProps
     })

package/build-module/validated-form-controls/components/range-control.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/validated-form-controls/components/range-control.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useMergeRefs } from '@wordpress/compose';\nimport { forwardRef, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { ControlWithError } from '../control-with-error';\nimport RangeControl from '../../range-control';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst UnforwardedValidatedRangeControl = ({\n  required,\n  customValidity,\n  markWhenOptional,\n  ...restProps\n}, forwardedRef) => {\n  const validityTargetRef = useRef(null);\n  const mergedRefs = useMergeRefs([forwardedRef, validityTargetRef]);\n  return /*#__PURE__*/_jsx(ControlWithError, {\n    required: required,\n    markWhenOptional: markWhenOptional,\n    customValidity: customValidity,\n    getValidityTarget: () => validityTargetRef.current,\n    children: /*#__PURE__*/_jsx(RangeControl, {\n      __next40pxDefaultSize: true,\n      ref: mergedRefs,\n      ...restProps\n    })\n  });\n};\nexport const ValidatedRangeControl = forwardRef(UnforwardedValidatedRangeControl);\nValidatedRangeControl.displayName = 'ValidatedRangeControl';"],
-  "mappings": ";AAGA,SAAS,oBAAoB;AAC7B,SAAS,YAAY,cAAc;AAKnC,SAAS,wBAAwB;AACjC,OAAO,kBAAkB;AACzB,SAAS,OAAO,YAAY;AAC5B,IAAM,mCAAmC,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAG,iBAAiB;AAClB,QAAM,oBAAoB,OAAO,IAAI;AACrC,QAAM,aAAa,aAAa,CAAC,cAAc,iBAAiB,CAAC;AACjE,SAAoB,qBAAK,kBAAkB;AAAA,IACzC;AAAA,IACA;AAAA,IACA;AAAA,IACA,mBAAmB,MAAM,kBAAkB;AAAA,IAC3C,UAAuB,qBAAK,cAAc;AAAA,MACxC,uBAAuB;AAAA,MACvB,KAAK;AAAA,MACL,GAAG;AAAA,IACL,CAAC;AAAA,EACH,CAAC;AACH;AACO,IAAM,wBAAwB,WAAW,gCAAgC;AAChF,sBAAsB,cAAc;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useMergeRefs } from '@wordpress/compose';\nimport { forwardRef, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { ControlWithError } from '../control-with-error';\nimport RangeControl from '../../range-control';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst UnforwardedValidatedRangeControl = ({\n  required,\n  customValidity,\n  markWhenOptional,\n  ...restProps\n}, forwardedRef) => {\n  const validityTargetRef = useRef(null);\n  const mergedRefs = useMergeRefs([forwardedRef, validityTargetRef]);\n  return /*#__PURE__*/_jsx(ControlWithError, {\n    required: required,\n    markWhenOptional: markWhenOptional,\n    customValidity: customValidity,\n    getValidityTarget: () => validityTargetRef.current,\n    children: /*#__PURE__*/_jsx(RangeControl, {\n      ref: mergedRefs,\n      ...restProps\n    })\n  });\n};\nexport const ValidatedRangeControl = forwardRef(UnforwardedValidatedRangeControl);\nValidatedRangeControl.displayName = 'ValidatedRangeControl';"],
+  "mappings": ";AAGA,SAAS,oBAAoB;AAC7B,SAAS,YAAY,cAAc;AAKnC,SAAS,wBAAwB;AACjC,OAAO,kBAAkB;AACzB,SAAS,OAAO,YAAY;AAC5B,IAAM,mCAAmC,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAG,iBAAiB;AAClB,QAAM,oBAAoB,OAAO,IAAI;AACrC,QAAM,aAAa,aAAa,CAAC,cAAc,iBAAiB,CAAC;AACjE,SAAoB,qBAAK,kBAAkB;AAAA,IACzC;AAAA,IACA;AAAA,IACA;AAAA,IACA,mBAAmB,MAAM,kBAAkB;AAAA,IAC3C,UAAuB,qBAAK,cAAc;AAAA,MACxC,KAAK;AAAA,MACL,GAAG;AAAA,IACL,CAAC;AAAA,EACH,CAAC;AACH;AACO,IAAM,wBAAwB,WAAW,gCAAgC;AAChF,sBAAsB,cAAc;",
   "names": []
 }

package/build-module/validated-form-controls/components/select-control.mjs

@@ -18,7 +18,6 @@ var UnforwardedValidatedSelectControl = ({
     customValidity,
     getValidityTarget: () => validityTargetRef.current,
     children: /* @__PURE__ */ _jsx(SelectControl, {
-      __next40pxDefaultSize: true,
       ref: mergedRefs,
       ...restProps
     })

package/build-module/validated-form-controls/components/select-control.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/validated-form-controls/components/select-control.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { forwardRef, useRef } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { ControlWithError } from '../control-with-error';\nimport SelectControl from '../../select-control';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst UnforwardedValidatedSelectControl = ({\n  required,\n  customValidity,\n  markWhenOptional,\n  ...restProps\n}, forwardedRef) => {\n  const validityTargetRef = useRef(null);\n  const mergedRefs = useMergeRefs([forwardedRef, validityTargetRef]);\n  return /*#__PURE__*/_jsx(ControlWithError, {\n    required: required,\n    markWhenOptional: markWhenOptional,\n    customValidity: customValidity,\n    getValidityTarget: () => validityTargetRef.current,\n    children: /*#__PURE__*/_jsx(SelectControl, {\n      __next40pxDefaultSize: true,\n      ref: mergedRefs,\n      ...restProps\n    })\n  });\n};\nexport const ValidatedSelectControl = forwardRef(UnforwardedValidatedSelectControl);\nValidatedSelectControl.displayName = 'ValidatedSelectControl';"],
-  "mappings": ";AAGA,SAAS,YAAY,cAAc;AACnC,SAAS,oBAAoB;AAK7B,SAAS,wBAAwB;AACjC,OAAO,mBAAmB;AAC1B,SAAS,OAAO,YAAY;AAC5B,IAAM,oCAAoC,CAAC;AAAA,EACzC;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAG,iBAAiB;AAClB,QAAM,oBAAoB,OAAO,IAAI;AACrC,QAAM,aAAa,aAAa,CAAC,cAAc,iBAAiB,CAAC;AACjE,SAAoB,qBAAK,kBAAkB;AAAA,IACzC;AAAA,IACA;AAAA,IACA;AAAA,IACA,mBAAmB,MAAM,kBAAkB;AAAA,IAC3C,UAAuB,qBAAK,eAAe;AAAA,MACzC,uBAAuB;AAAA,MACvB,KAAK;AAAA,MACL,GAAG;AAAA,IACL,CAAC;AAAA,EACH,CAAC;AACH;AACO,IAAM,yBAAyB,WAAW,iCAAiC;AAClF,uBAAuB,cAAc;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { forwardRef, useRef } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport { ControlWithError } from '../control-with-error';\nimport SelectControl from '../../select-control';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst UnforwardedValidatedSelectControl = ({\n  required,\n  customValidity,\n  markWhenOptional,\n  ...restProps\n}, forwardedRef) => {\n  const validityTargetRef = useRef(null);\n  const mergedRefs = useMergeRefs([forwardedRef, validityTargetRef]);\n  return /*#__PURE__*/_jsx(ControlWithError, {\n    required: required,\n    markWhenOptional: markWhenOptional,\n    customValidity: customValidity,\n    getValidityTarget: () => validityTargetRef.current,\n    children: /*#__PURE__*/_jsx(SelectControl, {\n      ref: mergedRefs,\n      ...restProps\n    })\n  });\n};\nexport const ValidatedSelectControl = forwardRef(UnforwardedValidatedSelectControl);\nValidatedSelectControl.displayName = 'ValidatedSelectControl';"],
+  "mappings": ";AAGA,SAAS,YAAY,cAAc;AACnC,SAAS,oBAAoB;AAK7B,SAAS,wBAAwB;AACjC,OAAO,mBAAmB;AAC1B,SAAS,OAAO,YAAY;AAC5B,IAAM,oCAAoC,CAAC;AAAA,EACzC;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAG,iBAAiB;AAClB,QAAM,oBAAoB,OAAO,IAAI;AACrC,QAAM,aAAa,aAAa,CAAC,cAAc,iBAAiB,CAAC;AACjE,SAAoB,qBAAK,kBAAkB;AAAA,IACzC;AAAA,IACA;AAAA,IACA;AAAA,IACA,mBAAmB,MAAM,kBAAkB;AAAA,IAC3C,UAAuB,qBAAK,eAAe;AAAA,MACzC,KAAK;AAAA,MACL,GAAG;AAAA,IACL,CAAC;AAAA,EACH,CAAC;AACH;AACO,IAAM,yBAAyB,WAAW,iCAAiC;AAClF,uBAAuB,cAAc;",
   "names": []
 }

package/build-module/validated-form-controls/components/toggle-group-control.mjs

@@ -19,7 +19,6 @@ var UnforwardedValidatedToggleGroupControl = ({
       customValidity,
       getValidityTarget: () => validityTargetRef.current,
       children: /* @__PURE__ */ _jsx(ToggleGroupControl, {
-        __next40pxDefaultSize: true,
         ref: forwardedRef,
         ...restProps
       })

package/build-module/validated-form-controls/components/toggle-group-control.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/validated-form-controls/components/toggle-group-control.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { forwardRef, useId, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { ControlWithError } from '../control-with-error';\nimport { ToggleGroupControl } from '../../toggle-group-control';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst UnforwardedValidatedToggleGroupControl = ({\n  required,\n  customValidity,\n  markWhenOptional,\n  ...restProps\n}, forwardedRef) => {\n  const validityTargetRef = useRef(null);\n  const nameAttr = useId();\n  return /*#__PURE__*/_jsxs(\"div\", {\n    className: \"components-validated-control__wrapper-with-error-delegate\",\n    children: [/*#__PURE__*/_jsx(ControlWithError, {\n      required: required,\n      markWhenOptional: markWhenOptional,\n      customValidity: customValidity,\n      getValidityTarget: () => validityTargetRef.current,\n      children: /*#__PURE__*/_jsx(ToggleGroupControl, {\n        __next40pxDefaultSize: true,\n        ref: forwardedRef,\n        ...restProps\n      })\n    }), /*#__PURE__*/_jsx(\"input\", {\n      className: \"components-validated-control__error-delegate\",\n      type: \"radio\",\n      ref: validityTargetRef,\n      required: required,\n      checked: restProps.value !== undefined,\n      tabIndex: -1\n      // A name attribute is needed for the `required` behavior to work.\n      ,\n      name: nameAttr,\n      onChange: () => {},\n      onFocus: e => {\n        e.target.previousElementSibling?.querySelector('[data-active-item=\"true\"]')?.focus();\n      }\n    })]\n  });\n};\nexport const ValidatedToggleGroupControl = forwardRef(UnforwardedValidatedToggleGroupControl);\nValidatedToggleGroupControl.displayName = 'ValidatedToggleGroupControl';"],
-  "mappings": ";AAGA,SAAS,YAAY,OAAO,cAAc;AAK1C,SAAS,wBAAwB;AACjC,SAAS,0BAA0B;AACnC,SAAS,OAAO,MAAM,QAAQ,aAAa;AAC3C,IAAM,yCAAyC,CAAC;AAAA,EAC9C;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAG,iBAAiB;AAClB,QAAM,oBAAoB,OAAO,IAAI;AACrC,QAAM,WAAW,MAAM;AACvB,SAAoB,sBAAM,OAAO;AAAA,IAC/B,WAAW;AAAA,IACX,UAAU,CAAc,qBAAK,kBAAkB;AAAA,MAC7C;AAAA,MACA;AAAA,MACA;AAAA,MACA,mBAAmB,MAAM,kBAAkB;AAAA,MAC3C,UAAuB,qBAAK,oBAAoB;AAAA,QAC9C,uBAAuB;AAAA,QACvB,KAAK;AAAA,QACL,GAAG;AAAA,MACL,CAAC;AAAA,IACH,CAAC,GAAgB,qBAAK,SAAS;AAAA,MAC7B,WAAW;AAAA,MACX,MAAM;AAAA,MACN,KAAK;AAAA,MACL;AAAA,MACA,SAAS,UAAU,UAAU;AAAA,MAC7B,UAAU;AAAA,MAGV,MAAM;AAAA,MACN,UAAU,MAAM;AAAA,MAAC;AAAA,MACjB,SAAS,OAAK;AACZ,UAAE,OAAO,wBAAwB,cAAc,2BAA2B,GAAG,MAAM;AAAA,MACrF;AAAA,IACF,CAAC,CAAC;AAAA,EACJ,CAAC;AACH;AACO,IAAM,8BAA8B,WAAW,sCAAsC;AAC5F,4BAA4B,cAAc;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { forwardRef, useId, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { ControlWithError } from '../control-with-error';\nimport { ToggleGroupControl } from '../../toggle-group-control';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nconst UnforwardedValidatedToggleGroupControl = ({\n  required,\n  customValidity,\n  markWhenOptional,\n  ...restProps\n}, forwardedRef) => {\n  const validityTargetRef = useRef(null);\n  const nameAttr = useId();\n  return /*#__PURE__*/_jsxs(\"div\", {\n    className: \"components-validated-control__wrapper-with-error-delegate\",\n    children: [/*#__PURE__*/_jsx(ControlWithError, {\n      required: required,\n      markWhenOptional: markWhenOptional,\n      customValidity: customValidity,\n      getValidityTarget: () => validityTargetRef.current,\n      children: /*#__PURE__*/_jsx(ToggleGroupControl, {\n        ref: forwardedRef,\n        ...restProps\n      })\n    }), /*#__PURE__*/_jsx(\"input\", {\n      className: \"components-validated-control__error-delegate\",\n      type: \"radio\",\n      ref: validityTargetRef,\n      required: required,\n      checked: restProps.value !== undefined,\n      tabIndex: -1\n      // A name attribute is needed for the `required` behavior to work.\n      ,\n      name: nameAttr,\n      onChange: () => {},\n      onFocus: e => {\n        e.target.previousElementSibling?.querySelector('[data-active-item=\"true\"]')?.focus();\n      }\n    })]\n  });\n};\nexport const ValidatedToggleGroupControl = forwardRef(UnforwardedValidatedToggleGroupControl);\nValidatedToggleGroupControl.displayName = 'ValidatedToggleGroupControl';"],
+  "mappings": ";AAGA,SAAS,YAAY,OAAO,cAAc;AAK1C,SAAS,wBAAwB;AACjC,SAAS,0BAA0B;AACnC,SAAS,OAAO,MAAM,QAAQ,aAAa;AAC3C,IAAM,yCAAyC,CAAC;AAAA,EAC9C;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAG,iBAAiB;AAClB,QAAM,oBAAoB,OAAO,IAAI;AACrC,QAAM,WAAW,MAAM;AACvB,SAAoB,sBAAM,OAAO;AAAA,IAC/B,WAAW;AAAA,IACX,UAAU,CAAc,qBAAK,kBAAkB;AAAA,MAC7C;AAAA,MACA;AAAA,MACA;AAAA,MACA,mBAAmB,MAAM,kBAAkB;AAAA,MAC3C,UAAuB,qBAAK,oBAAoB;AAAA,QAC9C,KAAK;AAAA,QACL,GAAG;AAAA,MACL,CAAC;AAAA,IACH,CAAC,GAAgB,qBAAK,SAAS;AAAA,MAC7B,WAAW;AAAA,MACX,MAAM;AAAA,MACN,KAAK;AAAA,MACL;AAAA,MACA,SAAS,UAAU,UAAU;AAAA,MAC7B,UAAU;AAAA,MAGV,MAAM;AAAA,MACN,UAAU,MAAM;AAAA,MAAC;AAAA,MACjB,SAAS,OAAK;AACZ,UAAE,OAAO,wBAAwB,cAAc,2BAA2B,GAAG,MAAM;AAAA,MACrF;AAAA,IACF,CAAC,CAAC;AAAA,EACJ,CAAC;AACH;AACO,IAAM,8BAA8B,WAAW,sCAAsC;AAC5F,4BAA4B,cAAc;",
   "names": []
 }

package/build-module/validated-form-controls/control-with-error.mjs

@@ -161,10 +161,7 @@ function UnforwardedControlWithError({
     children: [cloneElement(children, {
       label: appendRequiredIndicator(children.props.label, required, markWhenOptional),
       required
-    }), /* @__PURE__ */ _jsx("div", {
-      "aria-live": "polite",
-      children: visibleMessage
-    })]
+    }), visibleMessage]
   });
 }
 var ControlWithError = forwardRef(UnforwardedControlWithError);

package/build-module/validated-form-controls/control-with-error.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/validated-form-controls/control-with-error.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { cloneElement, forwardRef, useEffect, useId, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\n\nimport { ValidityIndicator } from './validity-indicator';\nimport { Fragment as _Fragment, jsxs as _jsxs, jsx as _jsx } from \"react/jsx-runtime\";\nfunction appendRequiredIndicator(label, required, markWhenOptional) {\n  let suffix;\n  if (required && !markWhenOptional) {\n    suffix = `(${__('Required')})`;\n  } else if (!required && markWhenOptional) {\n    suffix = `(${__('Optional')})`;\n  }\n  if (!suffix) {\n    return label;\n  }\n  if (typeof label === 'string') {\n    return `${label} ${suffix}`;\n  }\n  return /*#__PURE__*/_jsxs(_Fragment, {\n    children: [label, \" \", suffix]\n  });\n}\nconst VALIDITY_VISIBLE_ATTRIBUTE = 'data-validity-visible';\nconst className = 'components-validated-control';\n\n/**\n * HTML elements that support the Constraint Validation API.\n *\n * Here, we exclude HTMLButtonElement because although it does technically support the API,\n * normal buttons are actually exempted from any validation.\n * @see https://developer.mozilla.org/en-US/docs/Learn_web_development/Extensions/Forms/Form_validation\n * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLButtonElement/willValidate\n */\n\nfunction UnforwardedControlWithError({\n  required,\n  markWhenOptional,\n  customValidity,\n  getValidityTarget,\n  children\n}, forwardedRef) {\n  const [errorMessage, setErrorMessage] = useState();\n  const [statusMessage, setStatusMessage] = useState();\n  const [showMessage, setShowMessage] = useState(false);\n  const [isTouched, setIsTouched] = useState(false);\n\n  // Ensure that error messages are visible when an `invalid` event is triggered,\n  // e.g. when a form is submitted or reportValidity() is called.\n  useEffect(() => {\n    const validityTarget = getValidityTarget();\n    const handler = () => {\n      setShowMessage(true);\n      validityTarget?.setAttribute(VALIDITY_VISIBLE_ATTRIBUTE, '');\n    };\n    validityTarget?.addEventListener('invalid', handler);\n    return () => validityTarget?.removeEventListener('invalid', handler);\n  }, [getValidityTarget]);\n\n  // Suppress the native error popover, while keeping the focus behavior intact.\n  useEffect(() => {\n    const validityTarget = getValidityTarget();\n    const suppressNativePopover = event => {\n      event.preventDefault();\n      const target = event.target;\n      const firstErrorInForm = Array.from(target.form?.elements ?? []).find(el => !el.validity.valid);\n      if (!target.form || firstErrorInForm === target) {\n        target.focus();\n      }\n    };\n\n    // Radio inputs need special handling because all radio inputs with the\n    // same `name` will be marked as invalid. Without this handling, the last radio option\n    // will be focused with an unsuppressed native popover.\n    const radioSibilings = validityTarget?.type === 'radio' && validityTarget?.name ? Array.from(validityTarget?.closest(`.${className}`)?.querySelectorAll(`input[type=\"radio\"][name=\"${validityTarget?.name}\"]`) ?? []).filter(sibling => sibling !== validityTarget) : [];\n    validityTarget?.addEventListener('invalid', suppressNativePopover);\n    radioSibilings.forEach(sibling => sibling.addEventListener('invalid', suppressNativePopover));\n    return () => {\n      validityTarget?.removeEventListener('invalid', suppressNativePopover);\n      radioSibilings.forEach(sibling => sibling.removeEventListener('invalid', suppressNativePopover));\n    };\n  }, [getValidityTarget]);\n\n  // Handle validity messages.\n  useEffect(() => {\n    const validityTarget = getValidityTarget();\n    if (!customValidity?.type) {\n      validityTarget?.setCustomValidity('');\n      setErrorMessage(validityTarget?.validationMessage);\n      setStatusMessage(undefined);\n      return;\n    }\n    switch (customValidity.type) {\n      case 'validating':\n        {\n          validityTarget?.setCustomValidity('');\n          setErrorMessage(undefined);\n          setStatusMessage({\n            type: 'validating',\n            message: customValidity.message\n          });\n          break;\n        }\n      case 'valid':\n        {\n          validityTarget?.setCustomValidity('');\n          setErrorMessage(validityTarget?.validationMessage);\n          setStatusMessage({\n            type: 'valid',\n            message: customValidity.message\n          });\n          break;\n        }\n      case 'invalid':\n        {\n          validityTarget?.setCustomValidity(customValidity.message ?? '');\n          setErrorMessage(validityTarget?.validationMessage);\n          setStatusMessage(undefined);\n          break;\n        }\n    }\n  }, [customValidity, getValidityTarget]);\n\n  // Show messages if field has been touched (i.e. has blurred at least once),\n  // or validation has been triggered by the consumer/user.\n  useEffect(() => {\n    if (!isTouched || showMessage) {\n      return;\n    }\n    if (customValidity?.type === 'validating') {\n      // Don't show validating indicators for quick calls that take less than 1 sec.\n      const timer = setTimeout(() => {\n        setShowMessage(true);\n      }, 1000);\n      return () => clearTimeout(timer);\n    }\n    setShowMessage(true);\n  }, [isTouched, customValidity?.type, showMessage]);\n\n  // Mark blurred fields as touched.\n  const onBlur = event => {\n    if (isTouched) {\n      return;\n    }\n\n    // Only consider \"blurred from the component\" if focus has fully left the wrapping div.\n    // This prevents unnecessary blurs from components with multiple focusable elements.\n    if (!event.relatedTarget || !event.currentTarget.contains(event.relatedTarget)) {\n      setIsTouched(true);\n      getValidityTarget()?.setAttribute(VALIDITY_VISIBLE_ATTRIBUTE, '');\n    }\n  };\n  const messageId = useId();\n  const message = (() => {\n    if (errorMessage) {\n      return /*#__PURE__*/_jsx(ValidityIndicator, {\n        id: messageId,\n        type: \"invalid\",\n        message: errorMessage\n      });\n    }\n    if (statusMessage?.type) {\n      return /*#__PURE__*/_jsx(ValidityIndicator, {\n        id: messageId,\n        type: statusMessage.type,\n        message: statusMessage.message\n      });\n    }\n    return null;\n  })();\n  const visibleMessage = showMessage ? message : null;\n\n  // Imperatively manage `aria-describedby` on the validity target so we\n  // merge with any value the child control sets internally (e.g. from a\n  // `help` prop), rather than competing with it at the props level.\n  useEffect(() => {\n    const target = getValidityTarget();\n    if (!target) {\n      return;\n    }\n    function setDescribedBy(el, shouldAdd) {\n      const ids = (el.getAttribute('aria-describedby') ?? '').split(' ').filter(id => id && id !== messageId);\n      if (shouldAdd) {\n        ids.push(messageId);\n      }\n      if (ids.length) {\n        el.setAttribute('aria-describedby', ids.join(' '));\n      } else {\n        el.removeAttribute('aria-describedby');\n      }\n    }\n    setDescribedBy(target, !!visibleMessage);\n    return () => setDescribedBy(target, false);\n  }, [visibleMessage, messageId, getValidityTarget]);\n  return /*#__PURE__*/_jsxs(\"div\", {\n    className: className,\n    ref: forwardedRef,\n    onBlur: onBlur,\n    children: [cloneElement(children, {\n      label: appendRequiredIndicator(children.props.label, required, markWhenOptional),\n      required\n    }), /*#__PURE__*/_jsx(\"div\", {\n      \"aria-live\": \"polite\",\n      children: visibleMessage\n    })]\n  });\n}\nexport const ControlWithError = forwardRef(UnforwardedControlWithError);\nControlWithError.displayName = 'ControlWithError';"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { cloneElement, forwardRef, useEffect, useId, useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\n\nimport { ValidityIndicator } from './validity-indicator';\nimport { Fragment as _Fragment, jsxs as _jsxs, jsx as _jsx } from \"react/jsx-runtime\";\nfunction appendRequiredIndicator(label, required, markWhenOptional) {\n  let suffix;\n  if (required && !markWhenOptional) {\n    suffix = `(${__('Required')})`;\n  } else if (!required && markWhenOptional) {\n    suffix = `(${__('Optional')})`;\n  }\n  if (!suffix) {\n    return label;\n  }\n  if (typeof label === 'string') {\n    return `${label} ${suffix}`;\n  }\n  return /*#__PURE__*/_jsxs(_Fragment, {\n    children: [label, \" \", suffix]\n  });\n}\nconst VALIDITY_VISIBLE_ATTRIBUTE = 'data-validity-visible';\nconst className = 'components-validated-control';\n\n/**\n * HTML elements that support the Constraint Validation API.\n *\n * Here, we exclude HTMLButtonElement because although it does technically support the API,\n * normal buttons are actually exempted from any validation.\n * @see https://developer.mozilla.org/en-US/docs/Learn_web_development/Extensions/Forms/Form_validation\n * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLButtonElement/willValidate\n */\n\nfunction UnforwardedControlWithError({\n  required,\n  markWhenOptional,\n  customValidity,\n  getValidityTarget,\n  children\n}, forwardedRef) {\n  const [errorMessage, setErrorMessage] = useState();\n  const [statusMessage, setStatusMessage] = useState();\n  const [showMessage, setShowMessage] = useState(false);\n  const [isTouched, setIsTouched] = useState(false);\n\n  // Ensure that error messages are visible when an `invalid` event is triggered,\n  // e.g. when a form is submitted or reportValidity() is called.\n  useEffect(() => {\n    const validityTarget = getValidityTarget();\n    const handler = () => {\n      setShowMessage(true);\n      validityTarget?.setAttribute(VALIDITY_VISIBLE_ATTRIBUTE, '');\n    };\n    validityTarget?.addEventListener('invalid', handler);\n    return () => validityTarget?.removeEventListener('invalid', handler);\n  }, [getValidityTarget]);\n\n  // Suppress the native error popover, while keeping the focus behavior intact.\n  useEffect(() => {\n    const validityTarget = getValidityTarget();\n    const suppressNativePopover = event => {\n      event.preventDefault();\n      const target = event.target;\n      const firstErrorInForm = Array.from(target.form?.elements ?? []).find(el => !el.validity.valid);\n      if (!target.form || firstErrorInForm === target) {\n        target.focus();\n      }\n    };\n\n    // Radio inputs need special handling because all radio inputs with the\n    // same `name` will be marked as invalid. Without this handling, the last radio option\n    // will be focused with an unsuppressed native popover.\n    const radioSibilings = validityTarget?.type === 'radio' && validityTarget?.name ? Array.from(validityTarget?.closest(`.${className}`)?.querySelectorAll(`input[type=\"radio\"][name=\"${validityTarget?.name}\"]`) ?? []).filter(sibling => sibling !== validityTarget) : [];\n    validityTarget?.addEventListener('invalid', suppressNativePopover);\n    radioSibilings.forEach(sibling => sibling.addEventListener('invalid', suppressNativePopover));\n    return () => {\n      validityTarget?.removeEventListener('invalid', suppressNativePopover);\n      radioSibilings.forEach(sibling => sibling.removeEventListener('invalid', suppressNativePopover));\n    };\n  }, [getValidityTarget]);\n\n  // Handle validity messages.\n  useEffect(() => {\n    const validityTarget = getValidityTarget();\n    if (!customValidity?.type) {\n      validityTarget?.setCustomValidity('');\n      setErrorMessage(validityTarget?.validationMessage);\n      setStatusMessage(undefined);\n      return;\n    }\n    switch (customValidity.type) {\n      case 'validating':\n        {\n          validityTarget?.setCustomValidity('');\n          setErrorMessage(undefined);\n          setStatusMessage({\n            type: 'validating',\n            message: customValidity.message\n          });\n          break;\n        }\n      case 'valid':\n        {\n          validityTarget?.setCustomValidity('');\n          setErrorMessage(validityTarget?.validationMessage);\n          setStatusMessage({\n            type: 'valid',\n            message: customValidity.message\n          });\n          break;\n        }\n      case 'invalid':\n        {\n          validityTarget?.setCustomValidity(customValidity.message ?? '');\n          setErrorMessage(validityTarget?.validationMessage);\n          setStatusMessage(undefined);\n          break;\n        }\n    }\n  }, [customValidity, getValidityTarget]);\n\n  // Show messages if field has been touched (i.e. has blurred at least once),\n  // or validation has been triggered by the consumer/user.\n  useEffect(() => {\n    if (!isTouched || showMessage) {\n      return;\n    }\n    if (customValidity?.type === 'validating') {\n      // Don't show validating indicators for quick calls that take less than 1 sec.\n      const timer = setTimeout(() => {\n        setShowMessage(true);\n      }, 1000);\n      return () => clearTimeout(timer);\n    }\n    setShowMessage(true);\n  }, [isTouched, customValidity?.type, showMessage]);\n\n  // Mark blurred fields as touched.\n  const onBlur = event => {\n    if (isTouched) {\n      return;\n    }\n\n    // Only consider \"blurred from the component\" if focus has fully left the wrapping div.\n    // This prevents unnecessary blurs from components with multiple focusable elements.\n    if (!event.relatedTarget || !event.currentTarget.contains(event.relatedTarget)) {\n      setIsTouched(true);\n      getValidityTarget()?.setAttribute(VALIDITY_VISIBLE_ATTRIBUTE, '');\n    }\n  };\n  const messageId = useId();\n  const message = (() => {\n    if (errorMessage) {\n      return /*#__PURE__*/_jsx(ValidityIndicator, {\n        id: messageId,\n        type: \"invalid\",\n        message: errorMessage\n      });\n    }\n    if (statusMessage?.type) {\n      return /*#__PURE__*/_jsx(ValidityIndicator, {\n        id: messageId,\n        type: statusMessage.type,\n        message: statusMessage.message\n      });\n    }\n    return null;\n  })();\n  const visibleMessage = showMessage ? message : null;\n\n  // Imperatively manage `aria-describedby` on the validity target so we\n  // merge with any value the child control sets internally (e.g. from a\n  // `help` prop), rather than competing with it at the props level.\n  useEffect(() => {\n    const target = getValidityTarget();\n    if (!target) {\n      return;\n    }\n    function setDescribedBy(el, shouldAdd) {\n      const ids = (el.getAttribute('aria-describedby') ?? '').split(' ').filter(id => id && id !== messageId);\n      if (shouldAdd) {\n        ids.push(messageId);\n      }\n      if (ids.length) {\n        el.setAttribute('aria-describedby', ids.join(' '));\n      } else {\n        el.removeAttribute('aria-describedby');\n      }\n    }\n    setDescribedBy(target, !!visibleMessage);\n    return () => setDescribedBy(target, false);\n  }, [visibleMessage, messageId, getValidityTarget]);\n  return /*#__PURE__*/_jsxs(\"div\", {\n    className: className,\n    ref: forwardedRef,\n    onBlur: onBlur,\n    children: [cloneElement(children, {\n      label: appendRequiredIndicator(children.props.label, required, markWhenOptional),\n      required\n    }), visibleMessage]\n  });\n}\nexport const ControlWithError = forwardRef(UnforwardedControlWithError);\nControlWithError.displayName = 'ControlWithError';"],
+  "mappings": "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",
   "names": []
 }

package/build-module/view/component.mjs

@@ -1,19 +1,13 @@
 // packages/components/src/view/component.tsx
-import _styled from "@emotion/styled/base";
 import { forwardRef } from "@wordpress/element";
+import { PolymorphicElement } from "../utils/polymorphic-element.mjs";
 import { jsx as _jsx } from "react/jsx-runtime";
-var PolymorphicDiv = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "production" ? {
-  target: "e19lxcc00"
-} : {
-  target: "e19lxcc00",
-  label: "PolymorphicDiv"
-})(process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImNvbXBvbmVudC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZWlDIiwiZmlsZSI6ImNvbXBvbmVudC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbi8qKlxuICogV29yZFByZXNzIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBmb3J3YXJkUmVmIH0gZnJvbSAnQHdvcmRwcmVzcy9lbGVtZW50JztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHR5cGUgeyBXb3JkUHJlc3NDb21wb25lbnRQcm9wcyB9IGZyb20gJy4uL2NvbnRleHQnO1xuXG5jb25zdCBQb2x5bW9ycGhpY0RpdiA9IHN0eWxlZC5kaXZgYDtcblxuZnVuY3Rpb24gVW5mb3J3YXJkZWRWaWV3PCBUIGV4dGVuZHMgUmVhY3QuRWxlbWVudFR5cGUgPSAnZGl2JyA+KFxuXHR7IGFzLCAuLi5yZXN0UHJvcHMgfTogV29yZFByZXNzQ29tcG9uZW50UHJvcHM8IHt9LCBUID4sXG5cdHJlZjogUmVhY3QuRm9yd2FyZGVkUmVmPCBhbnkgPlxuKSB7XG5cdHJldHVybiA8UG9seW1vcnBoaWNEaXYgYXM9eyBhcyB9IHJlZj17IHJlZiB9IHsgLi4ucmVzdFByb3BzIH0gLz47XG59XG5cbi8qKlxuICogYFZpZXdgIGlzIGEgY29yZSBjb21wb25lbnQgdGhhdCByZW5kZXJzIGV2ZXJ5dGhpbmcgaW4gdGhlIGxpYnJhcnkuXG4gKiBJdCBpcyB0aGUgcHJpbmNpcGxlIGNvbXBvbmVudCBpbiB0aGUgZW50aXJlIGxpYnJhcnkuXG4gKlxuICogYGBganN4XG4gKiBpbXBvcnQgeyBWaWV3IH0gZnJvbSBgQHdvcmRwcmVzcy9jb21wb25lbnRzYDtcbiAqXG4gKiBmdW5jdGlvbiBFeGFtcGxlKCkge1xuICogXHRyZXR1cm4gKFxuICogXHRcdDxWaWV3PlxuICogXHRcdFx0IENvZGUgaXMgUG9ldHJ5XG4gKiBcdFx0PC9WaWV3PlxuICogXHQpO1xuICogfVxuICogYGBgXG4gKi9cbmV4cG9ydCBjb25zdCBWaWV3ID0gT2JqZWN0LmFzc2lnbiggZm9yd2FyZFJlZiggVW5mb3J3YXJkZWRWaWV3ICksIHtcblx0c2VsZWN0b3I6ICcuY29tcG9uZW50cy12aWV3Jyxcbn0gKTtcblxuZXhwb3J0IGRlZmF1bHQgVmlldztcbiJdfQ== */");
 function UnforwardedView({
-  as,
+  css,
   ...restProps
 }, ref) {
-  return /* @__PURE__ */ _jsx(PolymorphicDiv, {
-    as,
+  void css;
+  return /* @__PURE__ */ _jsx(PolymorphicElement, {
     ref,
     ...restProps
   });

package/build-module/view/component.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/view/component.tsx"],
-  "sourcesContent": ["import _styled from \"@emotion/styled/base\";\n/**\n * External dependencies\n */\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst PolymorphicDiv = /*#__PURE__*/_styled(\"div\", process.env.NODE_ENV === \"production\" ? {\n  target: \"e19lxcc00\"\n} : {\n  target: \"e19lxcc00\",\n  label: \"PolymorphicDiv\"\n})(process.env.NODE_ENV === \"production\" ? \"\" : \"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImNvbXBvbmVudC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZWlDIiwiZmlsZSI6ImNvbXBvbmVudC50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbi8qKlxuICogV29yZFByZXNzIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBmb3J3YXJkUmVmIH0gZnJvbSAnQHdvcmRwcmVzcy9lbGVtZW50JztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHR5cGUgeyBXb3JkUHJlc3NDb21wb25lbnRQcm9wcyB9IGZyb20gJy4uL2NvbnRleHQnO1xuXG5jb25zdCBQb2x5bW9ycGhpY0RpdiA9IHN0eWxlZC5kaXZgYDtcblxuZnVuY3Rpb24gVW5mb3J3YXJkZWRWaWV3PCBUIGV4dGVuZHMgUmVhY3QuRWxlbWVudFR5cGUgPSAnZGl2JyA+KFxuXHR7IGFzLCAuLi5yZXN0UHJvcHMgfTogV29yZFByZXNzQ29tcG9uZW50UHJvcHM8IHt9LCBUID4sXG5cdHJlZjogUmVhY3QuRm9yd2FyZGVkUmVmPCBhbnkgPlxuKSB7XG5cdHJldHVybiA8UG9seW1vcnBoaWNEaXYgYXM9eyBhcyB9IHJlZj17IHJlZiB9IHsgLi4ucmVzdFByb3BzIH0gLz47XG59XG5cbi8qKlxuICogYFZpZXdgIGlzIGEgY29yZSBjb21wb25lbnQgdGhhdCByZW5kZXJzIGV2ZXJ5dGhpbmcgaW4gdGhlIGxpYnJhcnkuXG4gKiBJdCBpcyB0aGUgcHJpbmNpcGxlIGNvbXBvbmVudCBpbiB0aGUgZW50aXJlIGxpYnJhcnkuXG4gKlxuICogYGBganN4XG4gKiBpbXBvcnQgeyBWaWV3IH0gZnJvbSBgQHdvcmRwcmVzcy9jb21wb25lbnRzYDtcbiAqXG4gKiBmdW5jdGlvbiBFeGFtcGxlKCkge1xuICogXHRyZXR1cm4gKFxuICogXHRcdDxWaWV3PlxuICogXHRcdFx0IENvZGUgaXMgUG9ldHJ5XG4gKiBcdFx0PC9WaWV3PlxuICogXHQpO1xuICogfVxuICogYGBgXG4gKi9cbmV4cG9ydCBjb25zdCBWaWV3ID0gT2JqZWN0LmFzc2lnbiggZm9yd2FyZFJlZiggVW5mb3J3YXJkZWRWaWV3ICksIHtcblx0c2VsZWN0b3I6ICcuY29tcG9uZW50cy12aWV3Jyxcbn0gKTtcblxuZXhwb3J0IGRlZmF1bHQgVmlldztcbiJdfQ== */\");\nfunction UnforwardedView({\n  as,\n  ...restProps\n}, ref) {\n  return /*#__PURE__*/_jsx(PolymorphicDiv, {\n    as: as,\n    ref: ref,\n    ...restProps\n  });\n}\n\n/**\n * `View` is a core component that renders everything in the library.\n * It is the principle component in the entire library.\n *\n * ```jsx\n * import { View } from `@wordpress/components`;\n *\n * function Example() {\n * \treturn (\n * \t\t<View>\n * \t\t\t Code is Poetry\n * \t\t</View>\n * \t);\n * }\n * ```\n */\nexport const View = Object.assign(forwardRef(UnforwardedView), {\n  selector: '.components-view'\n});\nexport default View;"],
-  "mappings": ";AAAA,OAAO,aAAa;AAQpB,SAAS,kBAAkB;AAK3B,SAAS,OAAO,YAAY;AAC5B,IAAM,iBAA8B,wBAAQ,OAAO,QAAQ,IAAI,aAAa,eAAe;AAAA,EACzF,QAAQ;AACV,IAAI;AAAA,EACF,QAAQ;AAAA,EACR,OAAO;AACT,CAAC,EAAE,QAAQ,IAAI,aAAa,eAAe,KAAK,yhDAAyhD;AACzkD,SAAS,gBAAgB;AAAA,EACvB;AAAA,EACA,GAAG;AACL,GAAG,KAAK;AACN,SAAoB,qBAAK,gBAAgB;AAAA,IACvC;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,CAAC;AACH;AAkBO,IAAM,OAAO,OAAO,OAAO,WAAW,eAAe,GAAG;AAAA,EAC7D,UAAU;AACZ,CAAC;AACD,IAAO,oBAAQ;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\n\nimport { PolymorphicElement } from '../utils/polymorphic-element';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nfunction UnforwardedView({\n  css,\n  ...restProps\n}, ref) {\n  void css;\n  return /*#__PURE__*/_jsx(PolymorphicElement, {\n    ref: ref,\n    ...restProps\n  });\n}\n\n/**\n * `View` is a core component that renders everything in the library.\n * It is the principle component in the entire library.\n *\n * ```jsx\n * import { View } from `@wordpress/components`;\n *\n * function Example() {\n * \treturn (\n * \t\t<View>\n * \t\t\t Code is Poetry\n * \t\t</View>\n * \t);\n * }\n * ```\n */\nexport const View = Object.assign(forwardRef(UnforwardedView), {\n  selector: '.components-view'\n});\nexport default View;"],
+  "mappings": ";AAGA,SAAS,kBAAkB;AAM3B,SAAS,0BAA0B;AACnC,SAAS,OAAO,YAAY;AAC5B,SAAS,gBAAgB;AAAA,EACvB;AAAA,EACA,GAAG;AACL,GAAG,KAAK;AACN,OAAK;AACL,SAAoB,qBAAK,oBAAoB;AAAA,IAC3C;AAAA,IACA,GAAG;AAAA,EACL,CAAC;AACH;AAkBO,IAAM,OAAO,OAAO,OAAO,WAAW,eAAe,GAAG;AAAA,EAC7D,UAAU;AACZ,CAAC;AACD,IAAO,oBAAQ;",
   "names": []
 }