@wordpress/components 30.3.2-next.6f42e1382.0 → 30.3.2-next.a730c9c8c.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  ## Unreleased
4
4
 
5
- ## 30.3.1-next.0 (2025-09-12)
5
+ ## 30.3.1-next.0 (2025-09-17)
6
6
 
7
7
  ### Bug Fixes
8
8
 
@@ -10,9 +10,12 @@
10
10
 
11
11
  ### Internal
12
12
 
13
+ - Expose `ValidatedRadioControl` via private API's ([#71664](https://github.com/WordPress/gutenberg/pull/71664)).
13
14
  - `ValidatedCheckboxControl`: Expose the component under private API's ([#71505](https://github.com/WordPress/gutenberg/pull/71505/)).
14
15
  - Expose `ValidatedTextareaControl` via Private APIs ([#71495](https://github.com/WordPress/gutenberg/pull/71495))
15
16
  - Add support for ValidatedFormTokenField [#71350](https://github.com/WordPress/gutenberg/pull/71350).
17
+ - Expose `ValidatedSelectControl` via Private APIs ([#71665](https://github.com/WordPress/gutenberg/pull/71665))
18
+ - Expose `ValidatedToggleGroupControl` via private APIs. Also properly detects `undefined` values for `required` validation ([#71666](https://github.com/WordPress/gutenberg/pull/71666)).
16
19
 
17
20
  ## 30.3.0 (2025-09-03)
18
21
 
@@ -39,8 +39,11 @@ const privateApis = exports.privateApis = {};
39
39
  ValidatedInputControl: _validatedFormControls.ValidatedInputControl,
40
40
  ValidatedCheckboxControl: _validatedFormControls.ValidatedCheckboxControl,
41
41
  ValidatedNumberControl: _validatedFormControls.ValidatedNumberControl,
42
+ ValidatedSelectControl: _validatedFormControls.ValidatedSelectControl,
43
+ ValidatedRadioControl: _validatedFormControls.ValidatedRadioControl,
42
44
  ValidatedTextControl: _validatedFormControls.ValidatedTextControl,
43
45
  ValidatedTextareaControl: _validatedFormControls.ValidatedTextareaControl,
44
- ValidatedToggleControl: _validatedFormControls.ValidatedToggleControl
46
+ ValidatedToggleControl: _validatedFormControls.ValidatedToggleControl,
47
+ ValidatedToggleGroupControl: _validatedFormControls.ValidatedToggleGroupControl
45
48
  });
46
49
  //# sourceMappingURL=private-apis.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["_utils","require","_menu","_contextSystemProvider","_theme","_interopRequireDefault","_tabs","_strings","_withIgnoreImeEvents","_lockUnlock","_badge","_calendar","_validatedFormControls","_picker","privateApis","exports","lock","__experimentalPopoverLegacyPositionToPlacement","ComponentsContext","Tabs","Theme","Menu","kebabCase","withIgnoreIMEEvents","Badge","normalizeTextString","DateCalendar","DateRangeCalendar","TZDate","Picker","ValidatedInputControl","ValidatedCheckboxControl","ValidatedNumberControl","ValidatedTextControl","ValidatedTextareaControl","ValidatedToggleControl"],"sources":["@wordpress/components/src/private-apis.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport { positionToPlacement as __experimentalPopoverLegacyPositionToPlacement } from './popover/utils';\nimport { Menu } from './menu';\nimport { ComponentsContext } from './context/context-system-provider';\nimport Theme from './theme';\nimport { Tabs } from './tabs';\nimport { kebabCase, normalizeTextString } from './utils/strings';\nimport { withIgnoreIMEEvents } from './utils/with-ignore-ime-events';\nimport { lock } from './lock-unlock';\nimport Badge from './badge';\n\nimport { DateCalendar, DateRangeCalendar, TZDate } from './calendar';\nimport {\n\tValidatedCheckboxControl,\n\tValidatedInputControl,\n\tValidatedNumberControl,\n\tValidatedTextControl,\n\tValidatedTextareaControl,\n\tValidatedToggleControl,\n} from './validated-form-controls';\nimport { Picker } from './color-picker/picker';\n\nexport const privateApis = {};\nlock( privateApis, {\n\t__experimentalPopoverLegacyPositionToPlacement,\n\tComponentsContext,\n\tTabs,\n\tTheme,\n\tMenu,\n\tkebabCase,\n\twithIgnoreIMEEvents,\n\tBadge,\n\tnormalizeTextString,\n\tDateCalendar,\n\tDateRangeCalendar,\n\tTZDate,\n\tPicker,\n\tValidatedInputControl,\n\tValidatedCheckboxControl,\n\tValidatedNumberControl,\n\tValidatedTextControl,\n\tValidatedTextareaControl,\n\tValidatedToggleControl,\n} );\n"],"mappings":";;;;;;;AAGA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,sBAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAC,sBAAA,CAAAJ,OAAA;AACA,IAAAK,KAAA,GAAAL,OAAA;AACA,IAAAM,QAAA,GAAAN,OAAA;AACA,IAAAO,oBAAA,GAAAP,OAAA;AACA,IAAAQ,WAAA,GAAAR,OAAA;AACA,IAAAS,MAAA,GAAAL,sBAAA,CAAAJ,OAAA;AAEA,IAAAU,SAAA,GAAAV,OAAA;AACA,IAAAW,sBAAA,GAAAX,OAAA;AAQA,IAAAY,OAAA,GAAAZ,OAAA;AAtBA;AACA;AACA;;AAsBO,MAAMa,WAAW,GAAAC,OAAA,CAAAD,WAAA,GAAG,CAAC,CAAC;AAC7B,IAAAE,gBAAI,EAAEF,WAAW,EAAE;EAClBG,8CAA8C,EAA9CA,0BAA8C;EAC9CC,iBAAiB,EAAjBA,wCAAiB;EACjBC,IAAI,EAAJA,UAAI;EACJC,KAAK,EAALA,cAAK;EACLC,IAAI,EAAJA,UAAI;EACJC,SAAS,EAATA,kBAAS;EACTC,mBAAmB,EAAnBA,wCAAmB;EACnBC,KAAK,EAALA,cAAK;EACLC,mBAAmB,EAAnBA,4BAAmB;EACnBC,YAAY,EAAZA,sBAAY;EACZC,iBAAiB,EAAjBA,2BAAiB;EACjBC,MAAM,EAANA,gBAAM;EACNC,MAAM,EAANA,cAAM;EACNC,qBAAqB,EAArBA,4CAAqB;EACrBC,wBAAwB,EAAxBA,+CAAwB;EACxBC,sBAAsB,EAAtBA,6CAAsB;EACtBC,oBAAoB,EAApBA,2CAAoB;EACpBC,wBAAwB,EAAxBA,+CAAwB;EACxBC,sBAAsB,EAAtBA;AACD,CAAE,CAAC","ignoreList":[]}
1
+ {"version":3,"names":["_utils","require","_menu","_contextSystemProvider","_theme","_interopRequireDefault","_tabs","_strings","_withIgnoreImeEvents","_lockUnlock","_badge","_calendar","_validatedFormControls","_picker","privateApis","exports","lock","__experimentalPopoverLegacyPositionToPlacement","ComponentsContext","Tabs","Theme","Menu","kebabCase","withIgnoreIMEEvents","Badge","normalizeTextString","DateCalendar","DateRangeCalendar","TZDate","Picker","ValidatedInputControl","ValidatedCheckboxControl","ValidatedNumberControl","ValidatedSelectControl","ValidatedRadioControl","ValidatedTextControl","ValidatedTextareaControl","ValidatedToggleControl","ValidatedToggleGroupControl"],"sources":["@wordpress/components/src/private-apis.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport { positionToPlacement as __experimentalPopoverLegacyPositionToPlacement } from './popover/utils';\nimport { Menu } from './menu';\nimport { ComponentsContext } from './context/context-system-provider';\nimport Theme from './theme';\nimport { Tabs } from './tabs';\nimport { kebabCase, normalizeTextString } from './utils/strings';\nimport { withIgnoreIMEEvents } from './utils/with-ignore-ime-events';\nimport { lock } from './lock-unlock';\nimport Badge from './badge';\n\nimport { DateCalendar, DateRangeCalendar, TZDate } from './calendar';\nimport {\n\tValidatedCheckboxControl,\n\tValidatedInputControl,\n\tValidatedNumberControl,\n\tValidatedSelectControl,\n\tValidatedRadioControl,\n\tValidatedTextControl,\n\tValidatedTextareaControl,\n\tValidatedToggleControl,\n\tValidatedToggleGroupControl,\n} from './validated-form-controls';\nimport { Picker } from './color-picker/picker';\n\nexport const privateApis = {};\nlock( privateApis, {\n\t__experimentalPopoverLegacyPositionToPlacement,\n\tComponentsContext,\n\tTabs,\n\tTheme,\n\tMenu,\n\tkebabCase,\n\twithIgnoreIMEEvents,\n\tBadge,\n\tnormalizeTextString,\n\tDateCalendar,\n\tDateRangeCalendar,\n\tTZDate,\n\tPicker,\n\tValidatedInputControl,\n\tValidatedCheckboxControl,\n\tValidatedNumberControl,\n\tValidatedSelectControl,\n\tValidatedRadioControl,\n\tValidatedTextControl,\n\tValidatedTextareaControl,\n\tValidatedToggleControl,\n\tValidatedToggleGroupControl,\n} );\n"],"mappings":";;;;;;;AAGA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,sBAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAC,sBAAA,CAAAJ,OAAA;AACA,IAAAK,KAAA,GAAAL,OAAA;AACA,IAAAM,QAAA,GAAAN,OAAA;AACA,IAAAO,oBAAA,GAAAP,OAAA;AACA,IAAAQ,WAAA,GAAAR,OAAA;AACA,IAAAS,MAAA,GAAAL,sBAAA,CAAAJ,OAAA;AAEA,IAAAU,SAAA,GAAAV,OAAA;AACA,IAAAW,sBAAA,GAAAX,OAAA;AAWA,IAAAY,OAAA,GAAAZ,OAAA;AAzBA;AACA;AACA;;AAyBO,MAAMa,WAAW,GAAAC,OAAA,CAAAD,WAAA,GAAG,CAAC,CAAC;AAC7B,IAAAE,gBAAI,EAAEF,WAAW,EAAE;EAClBG,8CAA8C,EAA9CA,0BAA8C;EAC9CC,iBAAiB,EAAjBA,wCAAiB;EACjBC,IAAI,EAAJA,UAAI;EACJC,KAAK,EAALA,cAAK;EACLC,IAAI,EAAJA,UAAI;EACJC,SAAS,EAATA,kBAAS;EACTC,mBAAmB,EAAnBA,wCAAmB;EACnBC,KAAK,EAALA,cAAK;EACLC,mBAAmB,EAAnBA,4BAAmB;EACnBC,YAAY,EAAZA,sBAAY;EACZC,iBAAiB,EAAjBA,2BAAiB;EACjBC,MAAM,EAANA,gBAAM;EACNC,MAAM,EAANA,cAAM;EACNC,qBAAqB,EAArBA,4CAAqB;EACrBC,wBAAwB,EAAxBA,+CAAwB;EACxBC,sBAAsB,EAAtBA,6CAAsB;EACtBC,sBAAsB,EAAtBA,6CAAsB;EACtBC,qBAAqB,EAArBA,4CAAqB;EACrBC,oBAAoB,EAApBA,2CAAoB;EACpBC,wBAAwB,EAAxBA,+CAAwB;EACxBC,sBAAsB,EAAtBA,6CAAsB;EACtBC,2BAA2B,EAA3BA;AACD,CAAE,CAAC","ignoreList":[]}
@@ -40,10 +40,7 @@ const UnforwardedValidatedToggleGroupControl = ({
40
40
  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_toggleGroupControl.ToggleGroupControl, {
41
41
  __nextHasNoMarginBottom: true,
42
42
  __next40pxDefaultSize: true,
43
- ref: forwardedRef
44
- // TODO: Upstream limitation - In uncontrolled mode, starting from an undefined value then
45
- // setting a value has a visual bug.
46
- ,
43
+ ref: forwardedRef,
47
44
  onChange: value => {
48
45
  valueRef.current = value;
49
46
  onChange?.(value);
@@ -55,7 +52,7 @@ const UnforwardedValidatedToggleGroupControl = ({
55
52
  type: "radio",
56
53
  ref: validityTargetRef,
57
54
  required: required,
58
- checked: restProps.value !== null,
55
+ checked: restProps.value !== undefined,
59
56
  tabIndex: -1
60
57
  // A name attribute is needed for the `required` behavior to work.
61
58
  ,
@@ -1 +1 @@
1
- {"version":3,"names":["_element","require","_controlWithError","_toggleGroupControl","_jsxRuntime","UnforwardedValidatedToggleGroupControl","required","onValidate","customValidity","onChange","markWhenOptional","restProps","forwardedRef","validityTargetRef","useRef","valueRef","value","nameAttr","useId","jsxs","className","children","jsx","ControlWithError","current","getValidityTarget","ToggleGroupControl","__nextHasNoMarginBottom","__next40pxDefaultSize","ref","type","checked","tabIndex","name","onFocus","e","target","previousElementSibling","querySelector","focus","ValidatedToggleGroupControl","exports","forwardRef"],"sources":["@wordpress/components/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 type { ValidatedControlProps } from './types';\nimport { ToggleGroupControl } from '../../toggle-group-control';\nimport type { ToggleGroupControlProps } from '../../toggle-group-control/types';\n\ntype Value = ToggleGroupControlProps[ 'value' ];\n\nconst UnforwardedValidatedToggleGroupControl = (\n\t{\n\t\trequired,\n\t\tonValidate,\n\t\tcustomValidity,\n\t\tonChange,\n\t\tmarkWhenOptional,\n\t\t...restProps\n\t}: Omit<\n\t\tReact.ComponentProps< typeof ToggleGroupControl >,\n\t\t'__next40pxDefaultSize' | '__nextHasNoMarginBottom'\n\t> &\n\t\tValidatedControlProps< Value >,\n\tforwardedRef: React.ForwardedRef< HTMLInputElement >\n) => {\n\tconst validityTargetRef = useRef< HTMLInputElement >( null );\n\tconst valueRef = useRef< Value >( restProps.value );\n\n\tconst nameAttr = useId();\n\n\treturn (\n\t\t<div className=\"components-validated-control__wrapper-with-error-delegate\">\n\t\t\t<ControlWithError\n\t\t\t\trequired={ required }\n\t\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\t\tonValidate={ () => {\n\t\t\t\t\treturn onValidate?.( valueRef.current );\n\t\t\t\t} }\n\t\t\t\tcustomValidity={ customValidity }\n\t\t\t\tgetValidityTarget={ () => validityTargetRef.current }\n\t\t\t>\n\t\t\t\t<ToggleGroupControl\n\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\tref={ forwardedRef }\n\t\t\t\t\t// TODO: Upstream limitation - In uncontrolled mode, starting from an undefined value then\n\t\t\t\t\t// setting a value has a visual bug.\n\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\tvalueRef.current = value;\n\t\t\t\t\t\tonChange?.( value );\n\t\t\t\t\t} }\n\t\t\t\t\t{ ...restProps }\n\t\t\t\t/>\n\t\t\t</ControlWithError>\n\t\t\t<input\n\t\t\t\tclassName=\"components-validated-control__error-delegate\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\tref={ validityTargetRef }\n\t\t\t\trequired={ required }\n\t\t\t\tchecked={ restProps.value !== null }\n\t\t\t\ttabIndex={ -1 }\n\t\t\t\t// A name attribute is needed for the `required` behavior to work.\n\t\t\t\tname={ nameAttr }\n\t\t\t\tonChange={ () => {} }\n\t\t\t\tonFocus={ ( e ) => {\n\t\t\t\t\te.target.previousElementSibling\n\t\t\t\t\t\t?.querySelector< HTMLButtonElement | HTMLInputElement >(\n\t\t\t\t\t\t\t'[data-active-item=\"true\"]'\n\t\t\t\t\t\t)\n\t\t\t\t\t\t?.focus();\n\t\t\t\t} }\n\t\t\t/>\n\t\t</div>\n\t);\n};\n\nexport const ValidatedToggleGroupControl = forwardRef(\n\tUnforwardedValidatedToggleGroupControl\n);\n"],"mappings":";;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAKA,IAAAC,iBAAA,GAAAD,OAAA;AAEA,IAAAE,mBAAA,GAAAF,OAAA;AAAgE,IAAAG,WAAA,GAAAH,OAAA;AAVhE;AACA;AACA;;AAGA;AACA;AACA;;AAQA,MAAMI,sCAAsC,GAAGA,CAC9C;EACCC,QAAQ;EACRC,UAAU;EACVC,cAAc;EACdC,QAAQ;EACRC,gBAAgB;EAChB,GAAGC;AAK0B,CAAC,EAC/BC,YAAoD,KAChD;EACJ,MAAMC,iBAAiB,GAAG,IAAAC,eAAM,EAAsB,IAAK,CAAC;EAC5D,MAAMC,QAAQ,GAAG,IAAAD,eAAM,EAAWH,SAAS,CAACK,KAAM,CAAC;EAEnD,MAAMC,QAAQ,GAAG,IAAAC,cAAK,EAAC,CAAC;EAExB,oBACC,IAAAd,WAAA,CAAAe,IAAA;IAAKC,SAAS,EAAC,2DAA2D;IAAAC,QAAA,gBACzE,IAAAjB,WAAA,CAAAkB,GAAA,EAACpB,iBAAA,CAAAqB,gBAAgB;MAChBjB,QAAQ,EAAGA,QAAU;MACrBI,gBAAgB,EAAGA,gBAAkB;MACrCH,UAAU,EAAGA,CAAA,KAAM;QAClB,OAAOA,UAAU,GAAIQ,QAAQ,CAACS,OAAQ,CAAC;MACxC,CAAG;MACHhB,cAAc,EAAGA,cAAgB;MACjCiB,iBAAiB,EAAGA,CAAA,KAAMZ,iBAAiB,CAACW,OAAS;MAAAH,QAAA,eAErD,IAAAjB,WAAA,CAAAkB,GAAA,EAACnB,mBAAA,CAAAuB,kBAAkB;QAClBC,uBAAuB;QACvBC,qBAAqB;QACrBC,GAAG,EAAGjB;QACN;QACA;QAAA;QACAH,QAAQ,EAAKO,KAAK,IAAM;UACvBD,QAAQ,CAACS,OAAO,GAAGR,KAAK;UACxBP,QAAQ,GAAIO,KAAM,CAAC;QACpB,CAAG;QAAA,GACEL;MAAS,CACd;IAAC,CACe,CAAC,eACnB,IAAAP,WAAA,CAAAkB,GAAA;MACCF,SAAS,EAAC,8CAA8C;MACxDU,IAAI,EAAC,OAAO;MACZD,GAAG,EAAGhB,iBAAmB;MACzBP,QAAQ,EAAGA,QAAU;MACrByB,OAAO,EAAGpB,SAAS,CAACK,KAAK,KAAK,IAAM;MACpCgB,QAAQ,EAAG,CAAC;MACZ;MAAA;MACAC,IAAI,EAAGhB,QAAU;MACjBR,QAAQ,EAAGA,CAAA,KAAM,CAAC,CAAG;MACrByB,OAAO,EAAKC,CAAC,IAAM;QAClBA,CAAC,CAACC,MAAM,CAACC,sBAAsB,EAC5BC,aAAa,CACd,2BACD,CAAC,EACCC,KAAK,CAAC,CAAC;MACX;IAAG,CACH,CAAC;EAAA,CACE,CAAC;AAER,CAAC;AAEM,MAAMC,2BAA2B,GAAAC,OAAA,CAAAD,2BAAA,GAAG,IAAAE,mBAAU,EACpDrC,sCACD,CAAC","ignoreList":[]}
1
+ {"version":3,"names":["_element","require","_controlWithError","_toggleGroupControl","_jsxRuntime","UnforwardedValidatedToggleGroupControl","required","onValidate","customValidity","onChange","markWhenOptional","restProps","forwardedRef","validityTargetRef","useRef","valueRef","value","nameAttr","useId","jsxs","className","children","jsx","ControlWithError","current","getValidityTarget","ToggleGroupControl","__nextHasNoMarginBottom","__next40pxDefaultSize","ref","type","checked","undefined","tabIndex","name","onFocus","e","target","previousElementSibling","querySelector","focus","ValidatedToggleGroupControl","exports","forwardRef"],"sources":["@wordpress/components/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 type { ValidatedControlProps } from './types';\nimport { ToggleGroupControl } from '../../toggle-group-control';\nimport type { ToggleGroupControlProps } from '../../toggle-group-control/types';\n\ntype Value = ToggleGroupControlProps[ 'value' ];\n\nconst UnforwardedValidatedToggleGroupControl = (\n\t{\n\t\trequired,\n\t\tonValidate,\n\t\tcustomValidity,\n\t\tonChange,\n\t\tmarkWhenOptional,\n\t\t...restProps\n\t}: Omit<\n\t\tReact.ComponentProps< typeof ToggleGroupControl >,\n\t\t'__next40pxDefaultSize' | '__nextHasNoMarginBottom'\n\t> &\n\t\tValidatedControlProps< Value >,\n\tforwardedRef: React.ForwardedRef< HTMLInputElement >\n) => {\n\tconst validityTargetRef = useRef< HTMLInputElement >( null );\n\tconst valueRef = useRef< Value >( restProps.value );\n\n\tconst nameAttr = useId();\n\n\treturn (\n\t\t<div className=\"components-validated-control__wrapper-with-error-delegate\">\n\t\t\t<ControlWithError\n\t\t\t\trequired={ required }\n\t\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\t\tonValidate={ () => {\n\t\t\t\t\treturn onValidate?.( valueRef.current );\n\t\t\t\t} }\n\t\t\t\tcustomValidity={ customValidity }\n\t\t\t\tgetValidityTarget={ () => validityTargetRef.current }\n\t\t\t>\n\t\t\t\t<ToggleGroupControl\n\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\tref={ forwardedRef }\n\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\tvalueRef.current = value;\n\t\t\t\t\t\tonChange?.( value );\n\t\t\t\t\t} }\n\t\t\t\t\t{ ...restProps }\n\t\t\t\t/>\n\t\t\t</ControlWithError>\n\t\t\t<input\n\t\t\t\tclassName=\"components-validated-control__error-delegate\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\tref={ validityTargetRef }\n\t\t\t\trequired={ required }\n\t\t\t\tchecked={ restProps.value !== undefined }\n\t\t\t\ttabIndex={ -1 }\n\t\t\t\t// A name attribute is needed for the `required` behavior to work.\n\t\t\t\tname={ nameAttr }\n\t\t\t\tonChange={ () => {} }\n\t\t\t\tonFocus={ ( e ) => {\n\t\t\t\t\te.target.previousElementSibling\n\t\t\t\t\t\t?.querySelector< HTMLButtonElement | HTMLInputElement >(\n\t\t\t\t\t\t\t'[data-active-item=\"true\"]'\n\t\t\t\t\t\t)\n\t\t\t\t\t\t?.focus();\n\t\t\t\t} }\n\t\t\t/>\n\t\t</div>\n\t);\n};\n\nexport const ValidatedToggleGroupControl = forwardRef(\n\tUnforwardedValidatedToggleGroupControl\n);\n"],"mappings":";;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAKA,IAAAC,iBAAA,GAAAD,OAAA;AAEA,IAAAE,mBAAA,GAAAF,OAAA;AAAgE,IAAAG,WAAA,GAAAH,OAAA;AAVhE;AACA;AACA;;AAGA;AACA;AACA;;AAQA,MAAMI,sCAAsC,GAAGA,CAC9C;EACCC,QAAQ;EACRC,UAAU;EACVC,cAAc;EACdC,QAAQ;EACRC,gBAAgB;EAChB,GAAGC;AAK0B,CAAC,EAC/BC,YAAoD,KAChD;EACJ,MAAMC,iBAAiB,GAAG,IAAAC,eAAM,EAAsB,IAAK,CAAC;EAC5D,MAAMC,QAAQ,GAAG,IAAAD,eAAM,EAAWH,SAAS,CAACK,KAAM,CAAC;EAEnD,MAAMC,QAAQ,GAAG,IAAAC,cAAK,EAAC,CAAC;EAExB,oBACC,IAAAd,WAAA,CAAAe,IAAA;IAAKC,SAAS,EAAC,2DAA2D;IAAAC,QAAA,gBACzE,IAAAjB,WAAA,CAAAkB,GAAA,EAACpB,iBAAA,CAAAqB,gBAAgB;MAChBjB,QAAQ,EAAGA,QAAU;MACrBI,gBAAgB,EAAGA,gBAAkB;MACrCH,UAAU,EAAGA,CAAA,KAAM;QAClB,OAAOA,UAAU,GAAIQ,QAAQ,CAACS,OAAQ,CAAC;MACxC,CAAG;MACHhB,cAAc,EAAGA,cAAgB;MACjCiB,iBAAiB,EAAGA,CAAA,KAAMZ,iBAAiB,CAACW,OAAS;MAAAH,QAAA,eAErD,IAAAjB,WAAA,CAAAkB,GAAA,EAACnB,mBAAA,CAAAuB,kBAAkB;QAClBC,uBAAuB;QACvBC,qBAAqB;QACrBC,GAAG,EAAGjB,YAAc;QACpBH,QAAQ,EAAKO,KAAK,IAAM;UACvBD,QAAQ,CAACS,OAAO,GAAGR,KAAK;UACxBP,QAAQ,GAAIO,KAAM,CAAC;QACpB,CAAG;QAAA,GACEL;MAAS,CACd;IAAC,CACe,CAAC,eACnB,IAAAP,WAAA,CAAAkB,GAAA;MACCF,SAAS,EAAC,8CAA8C;MACxDU,IAAI,EAAC,OAAO;MACZD,GAAG,EAAGhB,iBAAmB;MACzBP,QAAQ,EAAGA,QAAU;MACrByB,OAAO,EAAGpB,SAAS,CAACK,KAAK,KAAKgB,SAAW;MACzCC,QAAQ,EAAG,CAAC;MACZ;MAAA;MACAC,IAAI,EAAGjB,QAAU;MACjBR,QAAQ,EAAGA,CAAA,KAAM,CAAC,CAAG;MACrB0B,OAAO,EAAKC,CAAC,IAAM;QAClBA,CAAC,CAACC,MAAM,CAACC,sBAAsB,EAC5BC,aAAa,CACd,2BACD,CAAC,EACCC,KAAK,CAAC,CAAC;MACX;IAAG,CACH,CAAC;EAAA,CACE,CAAC;AAER,CAAC;AAEM,MAAMC,2BAA2B,GAAAC,OAAA,CAAAD,2BAAA,GAAG,IAAAE,mBAAU,EACpDtC,sCACD,CAAC","ignoreList":[]}
@@ -11,7 +11,7 @@ import { withIgnoreIMEEvents } from './utils/with-ignore-ime-events';
11
11
  import { lock } from './lock-unlock';
12
12
  import Badge from './badge';
13
13
  import { DateCalendar, DateRangeCalendar, TZDate } from './calendar';
14
- import { ValidatedCheckboxControl, ValidatedInputControl, ValidatedNumberControl, ValidatedTextControl, ValidatedTextareaControl, ValidatedToggleControl } from './validated-form-controls';
14
+ import { ValidatedCheckboxControl, ValidatedInputControl, ValidatedNumberControl, ValidatedSelectControl, ValidatedRadioControl, ValidatedTextControl, ValidatedTextareaControl, ValidatedToggleControl, ValidatedToggleGroupControl } from './validated-form-controls';
15
15
  import { Picker } from './color-picker/picker';
16
16
  export const privateApis = {};
17
17
  lock(privateApis, {
@@ -31,8 +31,11 @@ lock(privateApis, {
31
31
  ValidatedInputControl,
32
32
  ValidatedCheckboxControl,
33
33
  ValidatedNumberControl,
34
+ ValidatedSelectControl,
35
+ ValidatedRadioControl,
34
36
  ValidatedTextControl,
35
37
  ValidatedTextareaControl,
36
- ValidatedToggleControl
38
+ ValidatedToggleControl,
39
+ ValidatedToggleGroupControl
37
40
  });
38
41
  //# sourceMappingURL=private-apis.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["positionToPlacement","__experimentalPopoverLegacyPositionToPlacement","Menu","ComponentsContext","Theme","Tabs","kebabCase","normalizeTextString","withIgnoreIMEEvents","lock","Badge","DateCalendar","DateRangeCalendar","TZDate","ValidatedCheckboxControl","ValidatedInputControl","ValidatedNumberControl","ValidatedTextControl","ValidatedTextareaControl","ValidatedToggleControl","Picker","privateApis"],"sources":["@wordpress/components/src/private-apis.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport { positionToPlacement as __experimentalPopoverLegacyPositionToPlacement } from './popover/utils';\nimport { Menu } from './menu';\nimport { ComponentsContext } from './context/context-system-provider';\nimport Theme from './theme';\nimport { Tabs } from './tabs';\nimport { kebabCase, normalizeTextString } from './utils/strings';\nimport { withIgnoreIMEEvents } from './utils/with-ignore-ime-events';\nimport { lock } from './lock-unlock';\nimport Badge from './badge';\n\nimport { DateCalendar, DateRangeCalendar, TZDate } from './calendar';\nimport {\n\tValidatedCheckboxControl,\n\tValidatedInputControl,\n\tValidatedNumberControl,\n\tValidatedTextControl,\n\tValidatedTextareaControl,\n\tValidatedToggleControl,\n} from './validated-form-controls';\nimport { Picker } from './color-picker/picker';\n\nexport const privateApis = {};\nlock( privateApis, {\n\t__experimentalPopoverLegacyPositionToPlacement,\n\tComponentsContext,\n\tTabs,\n\tTheme,\n\tMenu,\n\tkebabCase,\n\twithIgnoreIMEEvents,\n\tBadge,\n\tnormalizeTextString,\n\tDateCalendar,\n\tDateRangeCalendar,\n\tTZDate,\n\tPicker,\n\tValidatedInputControl,\n\tValidatedCheckboxControl,\n\tValidatedNumberControl,\n\tValidatedTextControl,\n\tValidatedTextareaControl,\n\tValidatedToggleControl,\n} );\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,mBAAmB,IAAIC,8CAA8C,QAAQ,iBAAiB;AACvG,SAASC,IAAI,QAAQ,QAAQ;AAC7B,SAASC,iBAAiB,QAAQ,mCAAmC;AACrE,OAAOC,KAAK,MAAM,SAAS;AAC3B,SAASC,IAAI,QAAQ,QAAQ;AAC7B,SAASC,SAAS,EAAEC,mBAAmB,QAAQ,iBAAiB;AAChE,SAASC,mBAAmB,QAAQ,gCAAgC;AACpE,SAASC,IAAI,QAAQ,eAAe;AACpC,OAAOC,KAAK,MAAM,SAAS;AAE3B,SAASC,YAAY,EAAEC,iBAAiB,EAAEC,MAAM,QAAQ,YAAY;AACpE,SACCC,wBAAwB,EACxBC,qBAAqB,EACrBC,sBAAsB,EACtBC,oBAAoB,EACpBC,wBAAwB,EACxBC,sBAAsB,QAChB,2BAA2B;AAClC,SAASC,MAAM,QAAQ,uBAAuB;AAE9C,OAAO,MAAMC,WAAW,GAAG,CAAC,CAAC;AAC7BZ,IAAI,CAAEY,WAAW,EAAE;EAClBpB,8CAA8C;EAC9CE,iBAAiB;EACjBE,IAAI;EACJD,KAAK;EACLF,IAAI;EACJI,SAAS;EACTE,mBAAmB;EACnBE,KAAK;EACLH,mBAAmB;EACnBI,YAAY;EACZC,iBAAiB;EACjBC,MAAM;EACNO,MAAM;EACNL,qBAAqB;EACrBD,wBAAwB;EACxBE,sBAAsB;EACtBC,oBAAoB;EACpBC,wBAAwB;EACxBC;AACD,CAAE,CAAC","ignoreList":[]}
1
+ {"version":3,"names":["positionToPlacement","__experimentalPopoverLegacyPositionToPlacement","Menu","ComponentsContext","Theme","Tabs","kebabCase","normalizeTextString","withIgnoreIMEEvents","lock","Badge","DateCalendar","DateRangeCalendar","TZDate","ValidatedCheckboxControl","ValidatedInputControl","ValidatedNumberControl","ValidatedSelectControl","ValidatedRadioControl","ValidatedTextControl","ValidatedTextareaControl","ValidatedToggleControl","ValidatedToggleGroupControl","Picker","privateApis"],"sources":["@wordpress/components/src/private-apis.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport { positionToPlacement as __experimentalPopoverLegacyPositionToPlacement } from './popover/utils';\nimport { Menu } from './menu';\nimport { ComponentsContext } from './context/context-system-provider';\nimport Theme from './theme';\nimport { Tabs } from './tabs';\nimport { kebabCase, normalizeTextString } from './utils/strings';\nimport { withIgnoreIMEEvents } from './utils/with-ignore-ime-events';\nimport { lock } from './lock-unlock';\nimport Badge from './badge';\n\nimport { DateCalendar, DateRangeCalendar, TZDate } from './calendar';\nimport {\n\tValidatedCheckboxControl,\n\tValidatedInputControl,\n\tValidatedNumberControl,\n\tValidatedSelectControl,\n\tValidatedRadioControl,\n\tValidatedTextControl,\n\tValidatedTextareaControl,\n\tValidatedToggleControl,\n\tValidatedToggleGroupControl,\n} from './validated-form-controls';\nimport { Picker } from './color-picker/picker';\n\nexport const privateApis = {};\nlock( privateApis, {\n\t__experimentalPopoverLegacyPositionToPlacement,\n\tComponentsContext,\n\tTabs,\n\tTheme,\n\tMenu,\n\tkebabCase,\n\twithIgnoreIMEEvents,\n\tBadge,\n\tnormalizeTextString,\n\tDateCalendar,\n\tDateRangeCalendar,\n\tTZDate,\n\tPicker,\n\tValidatedInputControl,\n\tValidatedCheckboxControl,\n\tValidatedNumberControl,\n\tValidatedSelectControl,\n\tValidatedRadioControl,\n\tValidatedTextControl,\n\tValidatedTextareaControl,\n\tValidatedToggleControl,\n\tValidatedToggleGroupControl,\n} );\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,mBAAmB,IAAIC,8CAA8C,QAAQ,iBAAiB;AACvG,SAASC,IAAI,QAAQ,QAAQ;AAC7B,SAASC,iBAAiB,QAAQ,mCAAmC;AACrE,OAAOC,KAAK,MAAM,SAAS;AAC3B,SAASC,IAAI,QAAQ,QAAQ;AAC7B,SAASC,SAAS,EAAEC,mBAAmB,QAAQ,iBAAiB;AAChE,SAASC,mBAAmB,QAAQ,gCAAgC;AACpE,SAASC,IAAI,QAAQ,eAAe;AACpC,OAAOC,KAAK,MAAM,SAAS;AAE3B,SAASC,YAAY,EAAEC,iBAAiB,EAAEC,MAAM,QAAQ,YAAY;AACpE,SACCC,wBAAwB,EACxBC,qBAAqB,EACrBC,sBAAsB,EACtBC,sBAAsB,EACtBC,qBAAqB,EACrBC,oBAAoB,EACpBC,wBAAwB,EACxBC,sBAAsB,EACtBC,2BAA2B,QACrB,2BAA2B;AAClC,SAASC,MAAM,QAAQ,uBAAuB;AAE9C,OAAO,MAAMC,WAAW,GAAG,CAAC,CAAC;AAC7Bf,IAAI,CAAEe,WAAW,EAAE;EAClBvB,8CAA8C;EAC9CE,iBAAiB;EACjBE,IAAI;EACJD,KAAK;EACLF,IAAI;EACJI,SAAS;EACTE,mBAAmB;EACnBE,KAAK;EACLH,mBAAmB;EACnBI,YAAY;EACZC,iBAAiB;EACjBC,MAAM;EACNU,MAAM;EACNR,qBAAqB;EACrBD,wBAAwB;EACxBE,sBAAsB;EACtBC,sBAAsB;EACtBC,qBAAqB;EACrBC,oBAAoB;EACpBC,wBAAwB;EACxBC,sBAAsB;EACtBC;AACD,CAAE,CAAC","ignoreList":[]}
@@ -33,10 +33,7 @@ const UnforwardedValidatedToggleGroupControl = ({
33
33
  children: /*#__PURE__*/_jsx(ToggleGroupControl, {
34
34
  __nextHasNoMarginBottom: true,
35
35
  __next40pxDefaultSize: true,
36
- ref: forwardedRef
37
- // TODO: Upstream limitation - In uncontrolled mode, starting from an undefined value then
38
- // setting a value has a visual bug.
39
- ,
36
+ ref: forwardedRef,
40
37
  onChange: value => {
41
38
  valueRef.current = value;
42
39
  onChange?.(value);
@@ -48,7 +45,7 @@ const UnforwardedValidatedToggleGroupControl = ({
48
45
  type: "radio",
49
46
  ref: validityTargetRef,
50
47
  required: required,
51
- checked: restProps.value !== null,
48
+ checked: restProps.value !== undefined,
52
49
  tabIndex: -1
53
50
  // A name attribute is needed for the `required` behavior to work.
54
51
  ,
@@ -1 +1 @@
1
- {"version":3,"names":["forwardRef","useId","useRef","ControlWithError","ToggleGroupControl","jsx","_jsx","jsxs","_jsxs","UnforwardedValidatedToggleGroupControl","required","onValidate","customValidity","onChange","markWhenOptional","restProps","forwardedRef","validityTargetRef","valueRef","value","nameAttr","className","children","current","getValidityTarget","__nextHasNoMarginBottom","__next40pxDefaultSize","ref","type","checked","tabIndex","name","onFocus","e","target","previousElementSibling","querySelector","focus","ValidatedToggleGroupControl"],"sources":["@wordpress/components/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 type { ValidatedControlProps } from './types';\nimport { ToggleGroupControl } from '../../toggle-group-control';\nimport type { ToggleGroupControlProps } from '../../toggle-group-control/types';\n\ntype Value = ToggleGroupControlProps[ 'value' ];\n\nconst UnforwardedValidatedToggleGroupControl = (\n\t{\n\t\trequired,\n\t\tonValidate,\n\t\tcustomValidity,\n\t\tonChange,\n\t\tmarkWhenOptional,\n\t\t...restProps\n\t}: Omit<\n\t\tReact.ComponentProps< typeof ToggleGroupControl >,\n\t\t'__next40pxDefaultSize' | '__nextHasNoMarginBottom'\n\t> &\n\t\tValidatedControlProps< Value >,\n\tforwardedRef: React.ForwardedRef< HTMLInputElement >\n) => {\n\tconst validityTargetRef = useRef< HTMLInputElement >( null );\n\tconst valueRef = useRef< Value >( restProps.value );\n\n\tconst nameAttr = useId();\n\n\treturn (\n\t\t<div className=\"components-validated-control__wrapper-with-error-delegate\">\n\t\t\t<ControlWithError\n\t\t\t\trequired={ required }\n\t\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\t\tonValidate={ () => {\n\t\t\t\t\treturn onValidate?.( valueRef.current );\n\t\t\t\t} }\n\t\t\t\tcustomValidity={ customValidity }\n\t\t\t\tgetValidityTarget={ () => validityTargetRef.current }\n\t\t\t>\n\t\t\t\t<ToggleGroupControl\n\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\tref={ forwardedRef }\n\t\t\t\t\t// TODO: Upstream limitation - In uncontrolled mode, starting from an undefined value then\n\t\t\t\t\t// setting a value has a visual bug.\n\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\tvalueRef.current = value;\n\t\t\t\t\t\tonChange?.( value );\n\t\t\t\t\t} }\n\t\t\t\t\t{ ...restProps }\n\t\t\t\t/>\n\t\t\t</ControlWithError>\n\t\t\t<input\n\t\t\t\tclassName=\"components-validated-control__error-delegate\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\tref={ validityTargetRef }\n\t\t\t\trequired={ required }\n\t\t\t\tchecked={ restProps.value !== null }\n\t\t\t\ttabIndex={ -1 }\n\t\t\t\t// A name attribute is needed for the `required` behavior to work.\n\t\t\t\tname={ nameAttr }\n\t\t\t\tonChange={ () => {} }\n\t\t\t\tonFocus={ ( e ) => {\n\t\t\t\t\te.target.previousElementSibling\n\t\t\t\t\t\t?.querySelector< HTMLButtonElement | HTMLInputElement >(\n\t\t\t\t\t\t\t'[data-active-item=\"true\"]'\n\t\t\t\t\t\t)\n\t\t\t\t\t\t?.focus();\n\t\t\t\t} }\n\t\t\t/>\n\t\t</div>\n\t);\n};\n\nexport const ValidatedToggleGroupControl = forwardRef(\n\tUnforwardedValidatedToggleGroupControl\n);\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,UAAU,EAAEC,KAAK,EAAEC,MAAM,QAAQ,oBAAoB;;AAE9D;AACA;AACA;AACA,SAASC,gBAAgB,QAAQ,uBAAuB;AAExD,SAASC,kBAAkB,QAAQ,4BAA4B;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAKhE,MAAMC,sCAAsC,GAAGA,CAC9C;EACCC,QAAQ;EACRC,UAAU;EACVC,cAAc;EACdC,QAAQ;EACRC,gBAAgB;EAChB,GAAGC;AAK0B,CAAC,EAC/BC,YAAoD,KAChD;EACJ,MAAMC,iBAAiB,GAAGf,MAAM,CAAsB,IAAK,CAAC;EAC5D,MAAMgB,QAAQ,GAAGhB,MAAM,CAAWa,SAAS,CAACI,KAAM,CAAC;EAEnD,MAAMC,QAAQ,GAAGnB,KAAK,CAAC,CAAC;EAExB,oBACCO,KAAA;IAAKa,SAAS,EAAC,2DAA2D;IAAAC,QAAA,gBACzEhB,IAAA,CAACH,gBAAgB;MAChBO,QAAQ,EAAGA,QAAU;MACrBI,gBAAgB,EAAGA,gBAAkB;MACrCH,UAAU,EAAGA,CAAA,KAAM;QAClB,OAAOA,UAAU,GAAIO,QAAQ,CAACK,OAAQ,CAAC;MACxC,CAAG;MACHX,cAAc,EAAGA,cAAgB;MACjCY,iBAAiB,EAAGA,CAAA,KAAMP,iBAAiB,CAACM,OAAS;MAAAD,QAAA,eAErDhB,IAAA,CAACF,kBAAkB;QAClBqB,uBAAuB;QACvBC,qBAAqB;QACrBC,GAAG,EAAGX;QACN;QACA;QAAA;QACAH,QAAQ,EAAKM,KAAK,IAAM;UACvBD,QAAQ,CAACK,OAAO,GAAGJ,KAAK;UACxBN,QAAQ,GAAIM,KAAM,CAAC;QACpB,CAAG;QAAA,GACEJ;MAAS,CACd;IAAC,CACe,CAAC,eACnBT,IAAA;MACCe,SAAS,EAAC,8CAA8C;MACxDO,IAAI,EAAC,OAAO;MACZD,GAAG,EAAGV,iBAAmB;MACzBP,QAAQ,EAAGA,QAAU;MACrBmB,OAAO,EAAGd,SAAS,CAACI,KAAK,KAAK,IAAM;MACpCW,QAAQ,EAAG,CAAC;MACZ;MAAA;MACAC,IAAI,EAAGX,QAAU;MACjBP,QAAQ,EAAGA,CAAA,KAAM,CAAC,CAAG;MACrBmB,OAAO,EAAKC,CAAC,IAAM;QAClBA,CAAC,CAACC,MAAM,CAACC,sBAAsB,EAC5BC,aAAa,CACd,2BACD,CAAC,EACCC,KAAK,CAAC,CAAC;MACX;IAAG,CACH,CAAC;EAAA,CACE,CAAC;AAER,CAAC;AAED,OAAO,MAAMC,2BAA2B,GAAGtC,UAAU,CACpDS,sCACD,CAAC","ignoreList":[]}
1
+ {"version":3,"names":["forwardRef","useId","useRef","ControlWithError","ToggleGroupControl","jsx","_jsx","jsxs","_jsxs","UnforwardedValidatedToggleGroupControl","required","onValidate","customValidity","onChange","markWhenOptional","restProps","forwardedRef","validityTargetRef","valueRef","value","nameAttr","className","children","current","getValidityTarget","__nextHasNoMarginBottom","__next40pxDefaultSize","ref","type","checked","undefined","tabIndex","name","onFocus","e","target","previousElementSibling","querySelector","focus","ValidatedToggleGroupControl"],"sources":["@wordpress/components/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 type { ValidatedControlProps } from './types';\nimport { ToggleGroupControl } from '../../toggle-group-control';\nimport type { ToggleGroupControlProps } from '../../toggle-group-control/types';\n\ntype Value = ToggleGroupControlProps[ 'value' ];\n\nconst UnforwardedValidatedToggleGroupControl = (\n\t{\n\t\trequired,\n\t\tonValidate,\n\t\tcustomValidity,\n\t\tonChange,\n\t\tmarkWhenOptional,\n\t\t...restProps\n\t}: Omit<\n\t\tReact.ComponentProps< typeof ToggleGroupControl >,\n\t\t'__next40pxDefaultSize' | '__nextHasNoMarginBottom'\n\t> &\n\t\tValidatedControlProps< Value >,\n\tforwardedRef: React.ForwardedRef< HTMLInputElement >\n) => {\n\tconst validityTargetRef = useRef< HTMLInputElement >( null );\n\tconst valueRef = useRef< Value >( restProps.value );\n\n\tconst nameAttr = useId();\n\n\treturn (\n\t\t<div className=\"components-validated-control__wrapper-with-error-delegate\">\n\t\t\t<ControlWithError\n\t\t\t\trequired={ required }\n\t\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\t\tonValidate={ () => {\n\t\t\t\t\treturn onValidate?.( valueRef.current );\n\t\t\t\t} }\n\t\t\t\tcustomValidity={ customValidity }\n\t\t\t\tgetValidityTarget={ () => validityTargetRef.current }\n\t\t\t>\n\t\t\t\t<ToggleGroupControl\n\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\tref={ forwardedRef }\n\t\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\t\tvalueRef.current = value;\n\t\t\t\t\t\tonChange?.( value );\n\t\t\t\t\t} }\n\t\t\t\t\t{ ...restProps }\n\t\t\t\t/>\n\t\t\t</ControlWithError>\n\t\t\t<input\n\t\t\t\tclassName=\"components-validated-control__error-delegate\"\n\t\t\t\ttype=\"radio\"\n\t\t\t\tref={ validityTargetRef }\n\t\t\t\trequired={ required }\n\t\t\t\tchecked={ restProps.value !== undefined }\n\t\t\t\ttabIndex={ -1 }\n\t\t\t\t// A name attribute is needed for the `required` behavior to work.\n\t\t\t\tname={ nameAttr }\n\t\t\t\tonChange={ () => {} }\n\t\t\t\tonFocus={ ( e ) => {\n\t\t\t\t\te.target.previousElementSibling\n\t\t\t\t\t\t?.querySelector< HTMLButtonElement | HTMLInputElement >(\n\t\t\t\t\t\t\t'[data-active-item=\"true\"]'\n\t\t\t\t\t\t)\n\t\t\t\t\t\t?.focus();\n\t\t\t\t} }\n\t\t\t/>\n\t\t</div>\n\t);\n};\n\nexport const ValidatedToggleGroupControl = forwardRef(\n\tUnforwardedValidatedToggleGroupControl\n);\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,UAAU,EAAEC,KAAK,EAAEC,MAAM,QAAQ,oBAAoB;;AAE9D;AACA;AACA;AACA,SAASC,gBAAgB,QAAQ,uBAAuB;AAExD,SAASC,kBAAkB,QAAQ,4BAA4B;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAKhE,MAAMC,sCAAsC,GAAGA,CAC9C;EACCC,QAAQ;EACRC,UAAU;EACVC,cAAc;EACdC,QAAQ;EACRC,gBAAgB;EAChB,GAAGC;AAK0B,CAAC,EAC/BC,YAAoD,KAChD;EACJ,MAAMC,iBAAiB,GAAGf,MAAM,CAAsB,IAAK,CAAC;EAC5D,MAAMgB,QAAQ,GAAGhB,MAAM,CAAWa,SAAS,CAACI,KAAM,CAAC;EAEnD,MAAMC,QAAQ,GAAGnB,KAAK,CAAC,CAAC;EAExB,oBACCO,KAAA;IAAKa,SAAS,EAAC,2DAA2D;IAAAC,QAAA,gBACzEhB,IAAA,CAACH,gBAAgB;MAChBO,QAAQ,EAAGA,QAAU;MACrBI,gBAAgB,EAAGA,gBAAkB;MACrCH,UAAU,EAAGA,CAAA,KAAM;QAClB,OAAOA,UAAU,GAAIO,QAAQ,CAACK,OAAQ,CAAC;MACxC,CAAG;MACHX,cAAc,EAAGA,cAAgB;MACjCY,iBAAiB,EAAGA,CAAA,KAAMP,iBAAiB,CAACM,OAAS;MAAAD,QAAA,eAErDhB,IAAA,CAACF,kBAAkB;QAClBqB,uBAAuB;QACvBC,qBAAqB;QACrBC,GAAG,EAAGX,YAAc;QACpBH,QAAQ,EAAKM,KAAK,IAAM;UACvBD,QAAQ,CAACK,OAAO,GAAGJ,KAAK;UACxBN,QAAQ,GAAIM,KAAM,CAAC;QACpB,CAAG;QAAA,GACEJ;MAAS,CACd;IAAC,CACe,CAAC,eACnBT,IAAA;MACCe,SAAS,EAAC,8CAA8C;MACxDO,IAAI,EAAC,OAAO;MACZD,GAAG,EAAGV,iBAAmB;MACzBP,QAAQ,EAAGA,QAAU;MACrBmB,OAAO,EAAGd,SAAS,CAACI,KAAK,KAAKW,SAAW;MACzCC,QAAQ,EAAG,CAAC;MACZ;MAAA;MACAC,IAAI,EAAGZ,QAAU;MACjBP,QAAQ,EAAGA,CAAA,KAAM,CAAC,CAAG;MACrBoB,OAAO,EAAKC,CAAC,IAAM;QAClBA,CAAC,CAACC,MAAM,CAACC,sBAAsB,EAC5BC,aAAa,CACd,2BACD,CAAC,EACCC,KAAK,CAAC,CAAC;MACX;IAAG,CACH,CAAC;EAAA,CACE,CAAC;AAER,CAAC;AAED,OAAO,MAAMC,2BAA2B,GAAGvC,UAAU,CACpDS,sCACD,CAAC","ignoreList":[]}
@@ -1 +1 @@
1
- {"version":3,"file":"private-apis.d.ts","sourceRoot":"","sources":["../src/private-apis.ts"],"names":[],"mappings":"AAwBA,eAAO,MAAM,WAAW,IAAK,CAAC"}
1
+ {"version":3,"file":"private-apis.d.ts","sourceRoot":"","sources":["../src/private-apis.ts"],"names":[],"mappings":"AA2BA,eAAO,MAAM,WAAW,IAAK,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"toggle-group-control.d.ts","sourceRoot":"","sources":["../../../src/validated-form-controls/components/toggle-group-control.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAwErD,eAAO,MAAM,2BAA2B;;;;;;;;;;;;2lBAEvC,CAAC"}
1
+ {"version":3,"file":"toggle-group-control.d.ts","sourceRoot":"","sources":["../../../src/validated-form-controls/components/toggle-group-control.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAsErD,eAAO,MAAM,2BAA2B;;;;;;;;;;;;2lBAEvC,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wordpress/components",
3
- "version": "30.3.2-next.6f42e1382.0",
3
+ "version": "30.3.2-next.a730c9c8c.0",
4
4
  "description": "UI components for WordPress.",
5
5
  "author": "The WordPress Contributors",
6
6
  "license": "GPL-2.0-or-later",
@@ -44,23 +44,23 @@
44
44
  "@types/gradient-parser": "1.1.0",
45
45
  "@types/highlight-words-core": "1.2.1",
46
46
  "@use-gesture/react": "^10.3.1",
47
- "@wordpress/a11y": "^4.30.1-next.6f42e1382.0",
48
- "@wordpress/compose": "^7.30.1-next.6f42e1382.0",
49
- "@wordpress/date": "^5.30.1-next.6f42e1382.0",
50
- "@wordpress/deprecated": "^4.30.1-next.6f42e1382.0",
51
- "@wordpress/dom": "^4.30.1-next.6f42e1382.0",
52
- "@wordpress/element": "^6.30.1-next.6f42e1382.0",
53
- "@wordpress/escape-html": "^3.30.1-next.6f42e1382.0",
54
- "@wordpress/hooks": "^4.30.1-next.6f42e1382.0",
55
- "@wordpress/html-entities": "^4.30.1-next.6f42e1382.0",
56
- "@wordpress/i18n": "^6.3.1-next.6f42e1382.0",
57
- "@wordpress/icons": "^10.30.1-next.6f42e1382.0",
58
- "@wordpress/is-shallow-equal": "^5.30.1-next.6f42e1382.0",
59
- "@wordpress/keycodes": "^4.30.1-next.6f42e1382.0",
60
- "@wordpress/primitives": "^4.30.1-next.6f42e1382.0",
61
- "@wordpress/private-apis": "^1.30.1-next.6f42e1382.0",
62
- "@wordpress/rich-text": "^7.30.1-next.6f42e1382.0",
63
- "@wordpress/warning": "^3.30.1-next.6f42e1382.0",
47
+ "@wordpress/a11y": "^4.30.1-next.a730c9c8c.0",
48
+ "@wordpress/compose": "^7.30.1-next.a730c9c8c.0",
49
+ "@wordpress/date": "^5.30.1-next.a730c9c8c.0",
50
+ "@wordpress/deprecated": "^4.30.1-next.a730c9c8c.0",
51
+ "@wordpress/dom": "^4.30.1-next.a730c9c8c.0",
52
+ "@wordpress/element": "^6.30.1-next.a730c9c8c.0",
53
+ "@wordpress/escape-html": "^3.30.1-next.a730c9c8c.0",
54
+ "@wordpress/hooks": "^4.30.1-next.a730c9c8c.0",
55
+ "@wordpress/html-entities": "^4.30.1-next.a730c9c8c.0",
56
+ "@wordpress/i18n": "^6.3.1-next.a730c9c8c.0",
57
+ "@wordpress/icons": "^10.30.1-next.a730c9c8c.0",
58
+ "@wordpress/is-shallow-equal": "^5.30.1-next.a730c9c8c.0",
59
+ "@wordpress/keycodes": "^4.30.1-next.a730c9c8c.0",
60
+ "@wordpress/primitives": "^4.30.1-next.a730c9c8c.0",
61
+ "@wordpress/private-apis": "^1.30.1-next.a730c9c8c.0",
62
+ "@wordpress/rich-text": "^7.30.1-next.a730c9c8c.0",
63
+ "@wordpress/warning": "^3.30.1-next.a730c9c8c.0",
64
64
  "change-case": "^4.1.2",
65
65
  "clsx": "^2.1.1",
66
66
  "colord": "^2.7.0",
@@ -86,5 +86,5 @@
86
86
  "publishConfig": {
87
87
  "access": "public"
88
88
  },
89
- "gitHead": "8806899f598577a3c90a55d9aa79fbc372fe1e75"
89
+ "gitHead": "85a580bd2c55f811c8969b42dbb10209d19d514e"
90
90
  }
@@ -16,9 +16,12 @@ import {
16
16
  ValidatedCheckboxControl,
17
17
  ValidatedInputControl,
18
18
  ValidatedNumberControl,
19
+ ValidatedSelectControl,
20
+ ValidatedRadioControl,
19
21
  ValidatedTextControl,
20
22
  ValidatedTextareaControl,
21
23
  ValidatedToggleControl,
24
+ ValidatedToggleGroupControl,
22
25
  } from './validated-form-controls';
23
26
  import { Picker } from './color-picker/picker';
24
27
 
@@ -40,7 +43,10 @@ lock( privateApis, {
40
43
  ValidatedInputControl,
41
44
  ValidatedCheckboxControl,
42
45
  ValidatedNumberControl,
46
+ ValidatedSelectControl,
47
+ ValidatedRadioControl,
43
48
  ValidatedTextControl,
44
49
  ValidatedTextareaControl,
45
50
  ValidatedToggleControl,
51
+ ValidatedToggleGroupControl,
46
52
  } );
@@ -48,8 +48,6 @@ const UnforwardedValidatedToggleGroupControl = (
48
48
  __nextHasNoMarginBottom
49
49
  __next40pxDefaultSize
50
50
  ref={ forwardedRef }
51
- // TODO: Upstream limitation - In uncontrolled mode, starting from an undefined value then
52
- // setting a value has a visual bug.
53
51
  onChange={ ( value ) => {
54
52
  valueRef.current = value;
55
53
  onChange?.( value );
@@ -62,7 +60,7 @@ const UnforwardedValidatedToggleGroupControl = (
62
60
  type="radio"
63
61
  ref={ validityTargetRef }
64
62
  required={ required }
65
- checked={ restProps.value !== null }
63
+ checked={ restProps.value !== undefined }
66
64
  tabIndex={ -1 }
67
65
  // A name attribute is needed for the `required` behavior to work.
68
66
  name={ nameAttr }