@wordpress/dataviews 14.0.0 → 14.1.0

package/build-module/components/dataform-controls/datetime.mjs

@@ -9,6 +9,7 @@ import { dateI18n, getDate, getSettings } from "@wordpress/date";
 import { Stack } from "@wordpress/ui";
 import { OPERATOR_IN_THE_PAST, OPERATOR_OVER } from "../../constants.mjs";
 import RelativeDateControl from "./utils/relative-date-control.mjs";
+import useDisabledDateMatchers from "./utils/use-disabled-date-matchers.mjs";
 import getCustomValidity from "./utils/get-custom-validity.mjs";
 import parseDateTime from "../../field-types/utils/parse-date-time.mjs";
 import { unlock } from "../../lock-unlock.mjs";
@@ -31,6 +32,7 @@ function CalendarDateTimeControl({
 }) {
   const { compact } = config || {};
   const { id, label, description, setValue, getValue, isValid } = field;
+  const disabled = field.isDisabled({ item: data, field });
   const fieldValue = getValue({ item: data });
   const value = typeof fieldValue === "string" ? fieldValue : void 0;
   const [calendarMonth, setCalendarMonth] = useState(() => {
@@ -40,6 +42,7 @@ function CalendarDateTimeControl({
   const inputControlRef = useRef(null);
   const validationTimeoutRef = useRef(void 0);
   const previousFocusRef = useRef(null);
+  const { minConstraint, maxConstraint, disabledMatchers } = useDisabledDateMatchers(isValid, parseDateTime);
   const onChangeCallback = useCallback(
     (newValue) => onChange(setValue({ item: data, value: newValue })),
     [data, onChange, setValue]
@@ -130,7 +133,10 @@ function CalendarDateTimeControl({
             label: __("Date time"),
             hideLabelFromVision: true,
             value: formatDateTime(value),
-            onChange: handleManualDateTimeChange
+            onChange: handleManualDateTimeChange,
+            disabled,
+            min: minConstraint ? formatDateTime(minConstraint) : void 0,
+            max: maxConstraint ? formatDateTime(maxConstraint) : void 0
           }
         ),
         !compact && /* @__PURE__ */ jsx(
@@ -142,7 +148,8 @@ function CalendarDateTimeControl({
             month: calendarMonth,
             onMonthChange: setCalendarMonth,
             timeZone: timezoneString || void 0,
-            weekStartsOn
+            weekStartsOn,
+            disabled: disabled || disabledMatchers
           }
         )
       ] })

package/build-module/components/dataform-controls/datetime.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/dataform-controls/datetime.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tBaseControl,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { useCallback, useEffect, useRef, useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { dateI18n, getDate, getSettings } from '@wordpress/date';\nimport { Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport type { DataFormControlProps, FormatDatetime } from '../../types';\nimport { OPERATOR_IN_THE_PAST, OPERATOR_OVER } from '../../constants';\nimport RelativeDateControl from './utils/relative-date-control';\nimport getCustomValidity from './utils/get-custom-validity';\nimport parseDateTime from '../../field-types/utils/parse-date-time';\nimport { unlock } from '../../lock-unlock';\n\nconst { DateCalendar, ValidatedInputControl } = unlock( componentsPrivateApis );\n\nconst formatDateTime = ( value?: string ): string => {\n\tif ( ! value ) {\n\t\treturn '';\n\t}\n\t// Format in WordPress timezone for datetime-local input: YYYY-MM-DDTHH:mm\n\treturn dateI18n( 'Y-m-d\\\\TH:i', getDate( value ) );\n};\n\nfunction CalendarDateTimeControl< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\tvalidity,\n\tconfig,\n}: DataFormControlProps< Item > ) {\n\tconst { compact } = config || {};\n\tconst { id, label, description, setValue, getValue, isValid } = field;\n\tconst fieldValue = getValue( { item: data } );\n\tconst value = typeof fieldValue === 'string' ? fieldValue : undefined;\n\n\tconst [ calendarMonth, setCalendarMonth ] = useState< Date >( () => {\n\t\tconst parsedDate = parseDateTime( value );\n\t\treturn parsedDate || new Date(); // Default to current month\n\t} );\n\n\tconst inputControlRef = useRef< HTMLInputElement >( null );\n\tconst validationTimeoutRef =\n\t\tuseRef< ReturnType< typeof setTimeout > >( undefined );\n\tconst previousFocusRef = useRef< Element | null >( null );\n\n\tconst onChangeCallback = useCallback(\n\t\t( newValue: string | undefined ) =>\n\t\t\tonChange( setValue( { item: data, value: newValue } ) ),\n\t\t[ data, onChange, setValue ]\n\t);\n\n\t// Cleanup timeout on unmount\n\tuseEffect( () => {\n\t\treturn () => {\n\t\t\tif ( validationTimeoutRef.current ) {\n\t\t\t\tclearTimeout( validationTimeoutRef.current );\n\t\t\t}\n\t\t};\n\t}, [] );\n\n\tconst onSelectDate = useCallback(\n\t\t( newDate: Date | undefined | null ) => {\n\t\t\tlet dateTimeValue: string | undefined;\n\t\t\tif ( newDate ) {\n\t\t\t\t// Extract the date part in WP timezone from the calendar selection\n\t\t\t\tconst wpDate = dateI18n( 'Y-m-d', newDate );\n\n\t\t\t\t// Preserve time if it exists in current value, otherwise use current time\n\t\t\t\tlet wpTime: string;\n\t\t\t\tif ( value ) {\n\t\t\t\t\twpTime = dateI18n( 'H:i', getDate( value ) );\n\t\t\t\t} else {\n\t\t\t\t\twpTime = dateI18n( 'H:i', newDate );\n\t\t\t\t}\n\n\t\t\t\t// Combine date and time in WP timezone and convert to ISO\n\t\t\t\tconst finalDateTime = getDate( `${ wpDate }T${ wpTime }` );\n\t\t\t\tdateTimeValue = finalDateTime.toISOString();\n\t\t\t\tonChangeCallback( dateTimeValue );\n\n\t\t\t\t// Clear any existing timeout\n\t\t\t\tif ( validationTimeoutRef.current ) {\n\t\t\t\t\tclearTimeout( validationTimeoutRef.current );\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tonChangeCallback( undefined );\n\t\t\t}\n\t\t\t// Save the currently focused element\n\t\t\tpreviousFocusRef.current =\n\t\t\t\tinputControlRef.current &&\n\t\t\t\tinputControlRef.current.ownerDocument.activeElement;\n\n\t\t\t// Trigger validation display by simulating focus, blur, and changes.\n\t\t\t// Use a timeout to ensure it runs after the value update.\n\t\t\tvalidationTimeoutRef.current = setTimeout( () => {\n\t\t\t\tif ( inputControlRef.current ) {\n\t\t\t\t\tinputControlRef.current.focus();\n\t\t\t\t\tinputControlRef.current.blur();\n\t\t\t\t\tonChangeCallback( dateTimeValue );\n\n\t\t\t\t\t// Restore focus to the previously focused element\n\t\t\t\t\tif (\n\t\t\t\t\t\tpreviousFocusRef.current &&\n\t\t\t\t\t\tpreviousFocusRef.current instanceof HTMLElement\n\t\t\t\t\t) {\n\t\t\t\t\t\tpreviousFocusRef.current.focus();\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}, 0 );\n\t\t},\n\t\t[ onChangeCallback, value ]\n\t);\n\n\tconst handleManualDateTimeChange = useCallback(\n\t\t( newValue?: string ) => {\n\t\t\tif ( newValue ) {\n\t\t\t\t// Interpret the datetime-local value in WordPress timezone\n\t\t\t\tconst dateTime = getDate( newValue );\n\t\t\t\tonChangeCallback( dateTime.toISOString() );\n\n\t\t\t\t// Update calendar month to match\n\t\t\t\tconst parsedDate = parseDateTime( dateTime.toISOString() );\n\t\t\t\tif ( parsedDate ) {\n\t\t\t\t\tsetCalendarMonth( parsedDate );\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tonChangeCallback( undefined );\n\t\t\t}\n\t\t},\n\t\t[ onChangeCallback ]\n\t);\n\n\tconst { format: fieldFormat } = field;\n\tconst weekStartsOn =\n\t\t( fieldFormat as FormatDatetime ).weekStartsOn ??\n\t\tgetSettings().l10n.startOfWeek;\n\tconst {\n\t\ttimezone: { string: timezoneString },\n\t} = getSettings();\n\n\tlet displayLabel = label;\n\tif ( isValid?.required && ! markWhenOptional && ! hideLabelFromVision ) {\n\t\tdisplayLabel = `${ label } (${ __( 'Required' ) })`;\n\t} else if (\n\t\t! isValid?.required &&\n\t\tmarkWhenOptional &&\n\t\t! hideLabelFromVision\n\t) {\n\t\tdisplayLabel = `${ label } (${ __( 'Optional' ) })`;\n\t}\n\n\treturn (\n\t\t<BaseControl\n\t\t\tid={ id }\n\t\t\tlabel={ displayLabel }\n\t\t\thelp={ description }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t>\n\t\t\t<Stack direction=\"column\" gap=\"lg\">\n\t\t\t\t{ /* Manual datetime input */ }\n\t\t\t\t<ValidatedInputControl\n\t\t\t\t\tref={ inputControlRef }\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\trequired={ !! isValid?.required }\n\t\t\t\t\tcustomValidity={ getCustomValidity( isValid, validity ) }\n\t\t\t\t\ttype=\"datetime-local\"\n\t\t\t\t\tlabel={ __( 'Date time' ) }\n\t\t\t\t\thideLabelFromVision\n\t\t\t\t\tvalue={ formatDateTime( value ) }\n\t\t\t\t\tonChange={ handleManualDateTimeChange }\n\t\t\t\t/>\n\t\t\t\t{ /* Calendar widget */ }\n\t\t\t\t{ ! compact && (\n\t\t\t\t\t<DateCalendar\n\t\t\t\t\t\tstyle={ { width: '100%' } }\n\t\t\t\t\t\tselected={\n\t\t\t\t\t\t\tvalue\n\t\t\t\t\t\t\t\t? parseDateTime( value ) || undefined\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonSelect={ onSelectDate }\n\t\t\t\t\t\tmonth={ calendarMonth }\n\t\t\t\t\t\tonMonthChange={ setCalendarMonth }\n\t\t\t\t\t\ttimeZone={ timezoneString || undefined }\n\t\t\t\t\t\tweekStartsOn={ weekStartsOn }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</Stack>\n\t\t</BaseControl>\n\t);\n}\n\nexport default function DateTime< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\toperator,\n\tvalidity,\n\tconfig,\n}: DataFormControlProps< Item > ) {\n\tif ( operator === OPERATOR_IN_THE_PAST || operator === OPERATOR_OVER ) {\n\t\treturn (\n\t\t\t<RelativeDateControl\n\t\t\t\tclassName=\"dataviews-controls__datetime\"\n\t\t\t\tdata={ data }\n\t\t\t\tfield={ field }\n\t\t\t\tonChange={ onChange }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\toperator={ operator }\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<CalendarDateTimeControl\n\t\t\tdata={ data }\n\t\t\tfield={ field }\n\t\t\tonChange={ onChange }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tvalidity={ validity }\n\t\t\tconfig={ config }\n\t\t/>\n\t);\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tBaseControl,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { useCallback, useEffect, useRef, useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { dateI18n, getDate, getSettings } from '@wordpress/date';\nimport { Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport type { DataFormControlProps, FormatDatetime } from '../../types';\nimport { OPERATOR_IN_THE_PAST, OPERATOR_OVER } from '../../constants';\nimport RelativeDateControl from './utils/relative-date-control';\nimport useDisabledDateMatchers from './utils/use-disabled-date-matchers';\nimport getCustomValidity from './utils/get-custom-validity';\nimport parseDateTime from '../../field-types/utils/parse-date-time';\nimport { unlock } from '../../lock-unlock';\n\nconst { DateCalendar, ValidatedInputControl } = unlock( componentsPrivateApis );\n\nconst formatDateTime = ( value?: string ): string => {\n\tif ( ! value ) {\n\t\treturn '';\n\t}\n\t// Format in WordPress timezone for datetime-local input: YYYY-MM-DDTHH:mm\n\treturn dateI18n( 'Y-m-d\\\\TH:i', getDate( value ) );\n};\n\nfunction CalendarDateTimeControl< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\tvalidity,\n\tconfig,\n}: DataFormControlProps< Item > ) {\n\tconst { compact } = config || {};\n\tconst { id, label, description, setValue, getValue, isValid } = field;\n\tconst disabled = field.isDisabled( { item: data, field } );\n\tconst fieldValue = getValue( { item: data } );\n\tconst value = typeof fieldValue === 'string' ? fieldValue : undefined;\n\n\tconst [ calendarMonth, setCalendarMonth ] = useState< Date >( () => {\n\t\tconst parsedDate = parseDateTime( value );\n\t\treturn parsedDate || new Date(); // Default to current month\n\t} );\n\n\tconst inputControlRef = useRef< HTMLInputElement >( null );\n\tconst validationTimeoutRef =\n\t\tuseRef< ReturnType< typeof setTimeout > >( undefined );\n\tconst previousFocusRef = useRef< Element | null >( null );\n\n\tconst { minConstraint, maxConstraint, disabledMatchers } =\n\t\tuseDisabledDateMatchers( isValid, parseDateTime );\n\n\tconst onChangeCallback = useCallback(\n\t\t( newValue: string | undefined ) =>\n\t\t\tonChange( setValue( { item: data, value: newValue } ) ),\n\t\t[ data, onChange, setValue ]\n\t);\n\n\t// Cleanup timeout on unmount\n\tuseEffect( () => {\n\t\treturn () => {\n\t\t\tif ( validationTimeoutRef.current ) {\n\t\t\t\tclearTimeout( validationTimeoutRef.current );\n\t\t\t}\n\t\t};\n\t}, [] );\n\n\tconst onSelectDate = useCallback(\n\t\t( newDate: Date | undefined | null ) => {\n\t\t\tlet dateTimeValue: string | undefined;\n\t\t\tif ( newDate ) {\n\t\t\t\t// Extract the date part in WP timezone from the calendar selection\n\t\t\t\tconst wpDate = dateI18n( 'Y-m-d', newDate );\n\n\t\t\t\t// Preserve time if it exists in current value, otherwise use current time\n\t\t\t\tlet wpTime: string;\n\t\t\t\tif ( value ) {\n\t\t\t\t\twpTime = dateI18n( 'H:i', getDate( value ) );\n\t\t\t\t} else {\n\t\t\t\t\twpTime = dateI18n( 'H:i', newDate );\n\t\t\t\t}\n\n\t\t\t\t// Combine date and time in WP timezone and convert to ISO\n\t\t\t\tconst finalDateTime = getDate( `${ wpDate }T${ wpTime }` );\n\t\t\t\tdateTimeValue = finalDateTime.toISOString();\n\t\t\t\tonChangeCallback( dateTimeValue );\n\n\t\t\t\t// Clear any existing timeout\n\t\t\t\tif ( validationTimeoutRef.current ) {\n\t\t\t\t\tclearTimeout( validationTimeoutRef.current );\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tonChangeCallback( undefined );\n\t\t\t}\n\t\t\t// Save the currently focused element\n\t\t\tpreviousFocusRef.current =\n\t\t\t\tinputControlRef.current &&\n\t\t\t\tinputControlRef.current.ownerDocument.activeElement;\n\n\t\t\t// Trigger validation display by simulating focus, blur, and changes.\n\t\t\t// Use a timeout to ensure it runs after the value update.\n\t\t\tvalidationTimeoutRef.current = setTimeout( () => {\n\t\t\t\tif ( inputControlRef.current ) {\n\t\t\t\t\tinputControlRef.current.focus();\n\t\t\t\t\tinputControlRef.current.blur();\n\t\t\t\t\tonChangeCallback( dateTimeValue );\n\n\t\t\t\t\t// Restore focus to the previously focused element\n\t\t\t\t\tif (\n\t\t\t\t\t\tpreviousFocusRef.current &&\n\t\t\t\t\t\tpreviousFocusRef.current instanceof HTMLElement\n\t\t\t\t\t) {\n\t\t\t\t\t\tpreviousFocusRef.current.focus();\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}, 0 );\n\t\t},\n\t\t[ onChangeCallback, value ]\n\t);\n\n\tconst handleManualDateTimeChange = useCallback(\n\t\t( newValue?: string ) => {\n\t\t\tif ( newValue ) {\n\t\t\t\t// Interpret the datetime-local value in WordPress timezone\n\t\t\t\tconst dateTime = getDate( newValue );\n\t\t\t\tonChangeCallback( dateTime.toISOString() );\n\n\t\t\t\t// Update calendar month to match\n\t\t\t\tconst parsedDate = parseDateTime( dateTime.toISOString() );\n\t\t\t\tif ( parsedDate ) {\n\t\t\t\t\tsetCalendarMonth( parsedDate );\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tonChangeCallback( undefined );\n\t\t\t}\n\t\t},\n\t\t[ onChangeCallback ]\n\t);\n\n\tconst { format: fieldFormat } = field;\n\tconst weekStartsOn =\n\t\t( fieldFormat as FormatDatetime ).weekStartsOn ??\n\t\tgetSettings().l10n.startOfWeek;\n\tconst {\n\t\ttimezone: { string: timezoneString },\n\t} = getSettings();\n\n\tlet displayLabel = label;\n\tif ( isValid?.required && ! markWhenOptional && ! hideLabelFromVision ) {\n\t\tdisplayLabel = `${ label } (${ __( 'Required' ) })`;\n\t} else if (\n\t\t! isValid?.required &&\n\t\tmarkWhenOptional &&\n\t\t! hideLabelFromVision\n\t) {\n\t\tdisplayLabel = `${ label } (${ __( 'Optional' ) })`;\n\t}\n\n\treturn (\n\t\t<BaseControl\n\t\t\tid={ id }\n\t\t\tlabel={ displayLabel }\n\t\t\thelp={ description }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t>\n\t\t\t<Stack direction=\"column\" gap=\"lg\">\n\t\t\t\t{ /* Manual datetime input */ }\n\t\t\t\t<ValidatedInputControl\n\t\t\t\t\tref={ inputControlRef }\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\trequired={ !! isValid?.required }\n\t\t\t\t\tcustomValidity={ getCustomValidity( isValid, validity ) }\n\t\t\t\t\ttype=\"datetime-local\"\n\t\t\t\t\tlabel={ __( 'Date time' ) }\n\t\t\t\t\thideLabelFromVision\n\t\t\t\t\tvalue={ formatDateTime( value ) }\n\t\t\t\t\tonChange={ handleManualDateTimeChange }\n\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t\tmin={\n\t\t\t\t\t\tminConstraint\n\t\t\t\t\t\t\t? formatDateTime( minConstraint )\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tmax={\n\t\t\t\t\t\tmaxConstraint\n\t\t\t\t\t\t\t? formatDateTime( maxConstraint )\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t\t{ /* Calendar widget */ }\n\t\t\t\t{ ! compact && (\n\t\t\t\t\t<DateCalendar\n\t\t\t\t\t\tstyle={ { width: '100%' } }\n\t\t\t\t\t\tselected={\n\t\t\t\t\t\t\tvalue\n\t\t\t\t\t\t\t\t? parseDateTime( value ) || undefined\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonSelect={ onSelectDate }\n\t\t\t\t\t\tmonth={ calendarMonth }\n\t\t\t\t\t\tonMonthChange={ setCalendarMonth }\n\t\t\t\t\t\ttimeZone={ timezoneString || undefined }\n\t\t\t\t\t\tweekStartsOn={ weekStartsOn }\n\t\t\t\t\t\tdisabled={ disabled || disabledMatchers }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</Stack>\n\t\t</BaseControl>\n\t);\n}\n\nexport default function DateTime< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\toperator,\n\tvalidity,\n\tconfig,\n}: DataFormControlProps< Item > ) {\n\tif ( operator === OPERATOR_IN_THE_PAST || operator === OPERATOR_OVER ) {\n\t\treturn (\n\t\t\t<RelativeDateControl\n\t\t\t\tclassName=\"dataviews-controls__datetime\"\n\t\t\t\tdata={ data }\n\t\t\t\tfield={ field }\n\t\t\t\tonChange={ onChange }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\toperator={ operator }\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<CalendarDateTimeControl\n\t\t\tdata={ data }\n\t\t\tfield={ field }\n\t\t\tonChange={ onChange }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tvalidity={ validity }\n\t\t\tconfig={ config }\n\t\t/>\n\t);\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/components/dataform-controls/password.mjs

@@ -17,6 +17,7 @@ function Password({
   validity
 }) {
   const [isVisible, setIsVisible] = useState(false);
+  const disabled = field.isDisabled({ item: data, field });
   const toggleVisibility = useCallback(() => {
     setIsVisible((prev) => !prev);
   }, []);
@@ -37,7 +38,9 @@ function Password({
             icon: isVisible ? unseen : seen,
             onClick: toggleVisibility,
             size: "small",
-            label: isVisible ? __("Hide password") : __("Show password")
+            label: isVisible ? __("Hide password") : __("Show password"),
+            disabled,
+            accessibleWhenDisabled: true
           }
         ) })
       }

package/build-module/components/dataform-controls/password.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/dataform-controls/password.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalInputControlSuffixWrapper as InputControlSuffixWrapper,\n\tButton,\n} from '@wordpress/components';\nimport { useCallback, useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { seen, unseen } from '@wordpress/icons';\n/**\n * Internal dependencies\n */\nimport ValidatedText from './utils/validated-input';\nimport type { DataFormControlProps } from '../../types';\n\nexport default function Password< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\tconst [ isVisible, setIsVisible ] = useState( false );\n\n\tconst toggleVisibility = useCallback( () => {\n\t\tsetIsVisible( ( prev ) => ! prev );\n\t}, [] );\n\n\treturn (\n\t\t<ValidatedText\n\t\t\t{ ...{\n\t\t\t\tdata,\n\t\t\t\tfield,\n\t\t\t\tonChange,\n\t\t\t\thideLabelFromVision,\n\t\t\t\tmarkWhenOptional,\n\t\t\t\tvalidity,\n\t\t\t\ttype: isVisible ? 'text' : 'password',\n\t\t\t\tsuffix: (\n\t\t\t\t\t<InputControlSuffixWrapper variant=\"control\">\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\ticon={ isVisible ? unseen : seen }\n\t\t\t\t\t\t\tonClick={ toggleVisibility }\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\tisVisible\n\t\t\t\t\t\t\t\t\t? __( 'Hide password' )\n\t\t\t\t\t\t\t\t\t: __( 'Show password' )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</InputControlSuffixWrapper>\n\t\t\t\t),\n\t\t\t} }\n\t\t/>\n\t);\n}\n"],
-  "mappings": ";AAGA;AAAA,EACC,2CAA2C;AAAA,EAC3C;AAAA,OACM;AACP,SAAS,aAAa,gBAAgB;AACtC,SAAS,UAAU;AACnB,SAAS,MAAM,cAAc;AAI7B,OAAO,mBAAmB;AA6BpB;AA1BS,SAAR,SAAmC;AAAA,EACzC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAkC;AACjC,QAAM,CAAE,WAAW,YAAa,IAAI,SAAU,KAAM;AAEpD,QAAM,mBAAmB,YAAa,MAAM;AAC3C,iBAAc,CAAE,SAAU,CAAE,IAAK;AAAA,EAClC,GAAG,CAAC,CAAE;AAEN,SACC;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,QACJ;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,MAAM,YAAY,SAAS;AAAA,QAC3B,QACC,oBAAC,6BAA0B,SAAQ,WAClC;AAAA,UAAC;AAAA;AAAA,YACA,MAAO,YAAY,SAAS;AAAA,YAC5B,SAAU;AAAA,YACV,MAAK;AAAA,YACL,OACC,YACG,GAAI,eAAgB,IACpB,GAAI,eAAgB;AAAA;AAAA,QAEzB,GACD;AAAA,MAEF;AAAA;AAAA,EACD;AAEF;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalInputControlSuffixWrapper as InputControlSuffixWrapper,\n\tButton,\n} from '@wordpress/components';\nimport { useCallback, useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { seen, unseen } from '@wordpress/icons';\n/**\n * Internal dependencies\n */\nimport ValidatedText from './utils/validated-input';\nimport type { DataFormControlProps } from '../../types';\n\nexport default function Password< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\tconst [ isVisible, setIsVisible ] = useState( false );\n\tconst disabled = field.isDisabled( { item: data, field } );\n\n\tconst toggleVisibility = useCallback( () => {\n\t\tsetIsVisible( ( prev ) => ! prev );\n\t}, [] );\n\n\treturn (\n\t\t<ValidatedText\n\t\t\t{ ...{\n\t\t\t\tdata,\n\t\t\t\tfield,\n\t\t\t\tonChange,\n\t\t\t\thideLabelFromVision,\n\t\t\t\tmarkWhenOptional,\n\t\t\t\tvalidity,\n\t\t\t\ttype: isVisible ? 'text' : 'password',\n\t\t\t\tsuffix: (\n\t\t\t\t\t<InputControlSuffixWrapper variant=\"control\">\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\ticon={ isVisible ? unseen : seen }\n\t\t\t\t\t\t\tonClick={ toggleVisibility }\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\tisVisible\n\t\t\t\t\t\t\t\t\t? __( 'Hide password' )\n\t\t\t\t\t\t\t\t\t: __( 'Show password' )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t/>\n\t\t\t\t\t</InputControlSuffixWrapper>\n\t\t\t\t),\n\t\t\t} }\n\t\t/>\n\t);\n}\n"],
+  "mappings": ";AAGA;AAAA,EACC,2CAA2C;AAAA,EAC3C;AAAA,OACM;AACP,SAAS,aAAa,gBAAgB;AACtC,SAAS,UAAU;AACnB,SAAS,MAAM,cAAc;AAI7B,OAAO,mBAAmB;AA8BpB;AA3BS,SAAR,SAAmC;AAAA,EACzC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAkC;AACjC,QAAM,CAAE,WAAW,YAAa,IAAI,SAAU,KAAM;AACpD,QAAM,WAAW,MAAM,WAAY,EAAE,MAAM,MAAM,MAAM,CAAE;AAEzD,QAAM,mBAAmB,YAAa,MAAM;AAC3C,iBAAc,CAAE,SAAU,CAAE,IAAK;AAAA,EAClC,GAAG,CAAC,CAAE;AAEN,SACC;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,QACJ;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,MAAM,YAAY,SAAS;AAAA,QAC3B,QACC,oBAAC,6BAA0B,SAAQ,WAClC;AAAA,UAAC;AAAA;AAAA,YACA,MAAO,YAAY,SAAS;AAAA,YAC5B,SAAU;AAAA,YACV,MAAK;AAAA,YACL,OACC,YACG,GAAI,eAAgB,IACpB,GAAI,eAAgB;AAAA,YAExB;AAAA,YACA,wBAAsB;AAAA;AAAA,QACvB,GACD;AAAA,MAEF;AAAA;AAAA,EACD;AAEF;",
   "names": []
 }

package/build-module/components/dataform-controls/radio.mjs

@@ -15,6 +15,7 @@ function Radio({
   validity
 }) {
   const { label, description, getValue, setValue, isValid } = field;
+  const disabled = field.isDisabled({ item: data, field });
   const { elements, isLoading } = useElements({
     elements: field.elements,
     getElements: field.getElements
@@ -38,7 +39,8 @@ function Radio({
       onChange: onChangeControl,
       options: elements,
       selected: value,
-      hideLabelFromVision
+      hideLabelFromVision,
+      disabled
     }
   );
 }

package/build-module/components/dataform-controls/radio.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/dataform-controls/radio.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { privateApis, Spinner } from '@wordpress/components';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { DataFormControlProps } from '../../types';\nimport { unlock } from '../../lock-unlock';\nimport getCustomValidity from './utils/get-custom-validity';\nimport useElements from '../../hooks/use-elements';\n\nconst { ValidatedRadioControl } = unlock( privateApis );\n\nexport default function Radio< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\tconst { label, description, getValue, setValue, isValid } = field;\n\tconst { elements, isLoading } = useElements( {\n\t\telements: field.elements,\n\t\tgetElements: field.getElements,\n\t} );\n\tconst value = getValue( { item: data } );\n\n\tconst onChangeControl = useCallback(\n\t\t( newValue: string ) =>\n\t\t\tonChange( setValue( { item: data, value: newValue } ) ),\n\t\t[ data, onChange, setValue ]\n\t);\n\n\tif ( isLoading ) {\n\t\treturn <Spinner />;\n\t}\n\n\treturn (\n\t\t<ValidatedRadioControl\n\t\t\trequired={ !! field.isValid?.required }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tcustomValidity={ getCustomValidity( isValid, validity ) }\n\t\t\tlabel={ label }\n\t\t\thelp={ description }\n\t\t\tonChange={ onChangeControl }\n\t\t\toptions={ elements }\n\t\t\tselected={ value }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t/>\n\t);\n}\n"],
-  "mappings": ";AAGA,SAAS,aAAa,eAAe;AACrC,SAAS,mBAAmB;AAM5B,SAAS,cAAc;AACvB,OAAO,uBAAuB;AAC9B,OAAO,iBAAiB;AA0Bf;AAxBT,IAAM,EAAE,sBAAsB,IAAI,OAAQ,WAAY;AAEvC,SAAR,MAAgC;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAkC;AACjC,QAAM,EAAE,OAAO,aAAa,UAAU,UAAU,QAAQ,IAAI;AAC5D,QAAM,EAAE,UAAU,UAAU,IAAI,YAAa;AAAA,IAC5C,UAAU,MAAM;AAAA,IAChB,aAAa,MAAM;AAAA,EACpB,CAAE;AACF,QAAM,QAAQ,SAAU,EAAE,MAAM,KAAK,CAAE;AAEvC,QAAM,kBAAkB;AAAA,IACvB,CAAE,aACD,SAAU,SAAU,EAAE,MAAM,MAAM,OAAO,SAAS,CAAE,CAAE;AAAA,IACvD,CAAE,MAAM,UAAU,QAAS;AAAA,EAC5B;AAEA,MAAK,WAAY;AAChB,WAAO,oBAAC,WAAQ;AAAA,EACjB;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAW,CAAC,CAAE,MAAM,SAAS;AAAA,MAC7B;AAAA,MACA,gBAAiB,kBAAmB,SAAS,QAAS;AAAA,MACtD;AAAA,MACA,MAAO;AAAA,MACP,UAAW;AAAA,MACX,SAAU;AAAA,MACV,UAAW;AAAA,MACX;AAAA;AAAA,EACD;AAEF;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { privateApis, Spinner } from '@wordpress/components';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { DataFormControlProps } from '../../types';\nimport { unlock } from '../../lock-unlock';\nimport getCustomValidity from './utils/get-custom-validity';\nimport useElements from '../../hooks/use-elements';\n\nconst { ValidatedRadioControl } = unlock( privateApis );\n\nexport default function Radio< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\tconst { label, description, getValue, setValue, isValid } = field;\n\tconst disabled = field.isDisabled( { item: data, field } );\n\tconst { elements, isLoading } = useElements( {\n\t\telements: field.elements,\n\t\tgetElements: field.getElements,\n\t} );\n\tconst value = getValue( { item: data } );\n\n\tconst onChangeControl = useCallback(\n\t\t( newValue: string ) =>\n\t\t\tonChange( setValue( { item: data, value: newValue } ) ),\n\t\t[ data, onChange, setValue ]\n\t);\n\n\tif ( isLoading ) {\n\t\treturn <Spinner />;\n\t}\n\n\treturn (\n\t\t<ValidatedRadioControl\n\t\t\trequired={ !! field.isValid?.required }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tcustomValidity={ getCustomValidity( isValid, validity ) }\n\t\t\tlabel={ label }\n\t\t\thelp={ description }\n\t\t\tonChange={ onChangeControl }\n\t\t\toptions={ elements }\n\t\t\tselected={ value }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\tdisabled={ disabled }\n\t\t/>\n\t);\n}\n"],
+  "mappings": ";AAGA,SAAS,aAAa,eAAe;AACrC,SAAS,mBAAmB;AAM5B,SAAS,cAAc;AACvB,OAAO,uBAAuB;AAC9B,OAAO,iBAAiB;AA2Bf;AAzBT,IAAM,EAAE,sBAAsB,IAAI,OAAQ,WAAY;AAEvC,SAAR,MAAgC;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAkC;AACjC,QAAM,EAAE,OAAO,aAAa,UAAU,UAAU,QAAQ,IAAI;AAC5D,QAAM,WAAW,MAAM,WAAY,EAAE,MAAM,MAAM,MAAM,CAAE;AACzD,QAAM,EAAE,UAAU,UAAU,IAAI,YAAa;AAAA,IAC5C,UAAU,MAAM;AAAA,IAChB,aAAa,MAAM;AAAA,EACpB,CAAE;AACF,QAAM,QAAQ,SAAU,EAAE,MAAM,KAAK,CAAE;AAEvC,QAAM,kBAAkB;AAAA,IACvB,CAAE,aACD,SAAU,SAAU,EAAE,MAAM,MAAM,OAAO,SAAS,CAAE,CAAE;AAAA,IACvD,CAAE,MAAM,UAAU,QAAS;AAAA,EAC5B;AAEA,MAAK,WAAY;AAChB,WAAO,oBAAC,WAAQ;AAAA,EACjB;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAW,CAAC,CAAE,MAAM,SAAS;AAAA,MAC7B;AAAA,MACA,gBAAiB,kBAAmB,SAAS,QAAS;AAAA,MACtD;AAAA,MACA,MAAO;AAAA,MACP,UAAW;AAAA,MACX,SAAU;AAAA,MACV,UAAW;AAAA,MACX;AAAA,MACA;AAAA;AAAA,EACD;AAEF;",
   "names": []
 }

package/build-module/components/dataform-controls/select.mjs

@@ -15,6 +15,7 @@ function Select({
   validity
 }) {
   const { type, label, description, getValue, setValue, isValid } = field;
+  const disabled = field.isDisabled({ item: data, field });
   const isMultiple = type === "array";
   const value = getValue({ item: data }) ?? (isMultiple ? [] : "");
   const onChangeControl = useCallback(
@@ -41,7 +42,8 @@ function Select({
       onChange: onChangeControl,
       __next40pxDefaultSize: true,
       hideLabelFromVision,
-      multiple: isMultiple
+      multiple: isMultiple,
+      disabled
     }
   );
 }

package/build-module/components/dataform-controls/select.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/dataform-controls/select.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { privateApis, Spinner } from '@wordpress/components';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { DataFormControlProps } from '../../types';\nimport useElements from '../../hooks/use-elements';\nimport { unlock } from '../../lock-unlock';\nimport getCustomValidity from './utils/get-custom-validity';\n\nconst { ValidatedSelectControl } = unlock( privateApis );\n\nexport default function Select< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\tconst { type, label, description, getValue, setValue, isValid } = field;\n\n\tconst isMultiple = type === 'array';\n\tconst value = getValue( { item: data } ) ?? ( isMultiple ? [] : '' );\n\n\tconst onChangeControl = useCallback(\n\t\t( newValue: any ) =>\n\t\t\tonChange( setValue( { item: data, value: newValue } ) ),\n\t\t[ data, onChange, setValue ]\n\t);\n\n\tconst { elements, isLoading } = useElements( {\n\t\telements: field.elements,\n\t\tgetElements: field.getElements,\n\t} );\n\n\tif ( isLoading ) {\n\t\treturn <Spinner />;\n\t}\n\n\treturn (\n\t\t<ValidatedSelectControl\n\t\t\trequired={ !! field.isValid?.required }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tcustomValidity={ getCustomValidity( isValid, validity ) }\n\t\t\tlabel={ label }\n\t\t\tvalue={ value }\n\t\t\thelp={ description }\n\t\t\toptions={ elements }\n\t\t\tonChange={ onChangeControl }\n\t\t\t__next40pxDefaultSize\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\tmultiple={ isMultiple }\n\t\t/>\n\t);\n}\n"],
-  "mappings": ";AAGA,SAAS,aAAa,eAAe;AACrC,SAAS,mBAAmB;AAM5B,OAAO,iBAAiB;AACxB,SAAS,cAAc;AACvB,OAAO,uBAAuB;AA6BrB;AA3BT,IAAM,EAAE,uBAAuB,IAAI,OAAQ,WAAY;AAExC,SAAR,OAAiC;AAAA,EACvC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAkC;AACjC,QAAM,EAAE,MAAM,OAAO,aAAa,UAAU,UAAU,QAAQ,IAAI;AAElE,QAAM,aAAa,SAAS;AAC5B,QAAM,QAAQ,SAAU,EAAE,MAAM,KAAK,CAAE,MAAO,aAAa,CAAC,IAAI;AAEhE,QAAM,kBAAkB;AAAA,IACvB,CAAE,aACD,SAAU,SAAU,EAAE,MAAM,MAAM,OAAO,SAAS,CAAE,CAAE;AAAA,IACvD,CAAE,MAAM,UAAU,QAAS;AAAA,EAC5B;AAEA,QAAM,EAAE,UAAU,UAAU,IAAI,YAAa;AAAA,IAC5C,UAAU,MAAM;AAAA,IAChB,aAAa,MAAM;AAAA,EACpB,CAAE;AAEF,MAAK,WAAY;AAChB,WAAO,oBAAC,WAAQ;AAAA,EACjB;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAW,CAAC,CAAE,MAAM,SAAS;AAAA,MAC7B;AAAA,MACA,gBAAiB,kBAAmB,SAAS,QAAS;AAAA,MACtD;AAAA,MACA;AAAA,MACA,MAAO;AAAA,MACP,SAAU;AAAA,MACV,UAAW;AAAA,MACX,uBAAqB;AAAA,MACrB;AAAA,MACA,UAAW;AAAA;AAAA,EACZ;AAEF;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { privateApis, Spinner } from '@wordpress/components';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { DataFormControlProps } from '../../types';\nimport useElements from '../../hooks/use-elements';\nimport { unlock } from '../../lock-unlock';\nimport getCustomValidity from './utils/get-custom-validity';\n\nconst { ValidatedSelectControl } = unlock( privateApis );\n\nexport default function Select< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\tconst { type, label, description, getValue, setValue, isValid } = field;\n\tconst disabled = field.isDisabled( { item: data, field } );\n\n\tconst isMultiple = type === 'array';\n\tconst value = getValue( { item: data } ) ?? ( isMultiple ? [] : '' );\n\n\tconst onChangeControl = useCallback(\n\t\t( newValue: any ) =>\n\t\t\tonChange( setValue( { item: data, value: newValue } ) ),\n\t\t[ data, onChange, setValue ]\n\t);\n\n\tconst { elements, isLoading } = useElements( {\n\t\telements: field.elements,\n\t\tgetElements: field.getElements,\n\t} );\n\n\tif ( isLoading ) {\n\t\treturn <Spinner />;\n\t}\n\n\treturn (\n\t\t<ValidatedSelectControl\n\t\t\trequired={ !! field.isValid?.required }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tcustomValidity={ getCustomValidity( isValid, validity ) }\n\t\t\tlabel={ label }\n\t\t\tvalue={ value }\n\t\t\thelp={ description }\n\t\t\toptions={ elements }\n\t\t\tonChange={ onChangeControl }\n\t\t\t__next40pxDefaultSize\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\tmultiple={ isMultiple }\n\t\t\tdisabled={ disabled }\n\t\t/>\n\t);\n}\n"],
+  "mappings": ";AAGA,SAAS,aAAa,eAAe;AACrC,SAAS,mBAAmB;AAM5B,OAAO,iBAAiB;AACxB,SAAS,cAAc;AACvB,OAAO,uBAAuB;AA8BrB;AA5BT,IAAM,EAAE,uBAAuB,IAAI,OAAQ,WAAY;AAExC,SAAR,OAAiC;AAAA,EACvC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAkC;AACjC,QAAM,EAAE,MAAM,OAAO,aAAa,UAAU,UAAU,QAAQ,IAAI;AAClE,QAAM,WAAW,MAAM,WAAY,EAAE,MAAM,MAAM,MAAM,CAAE;AAEzD,QAAM,aAAa,SAAS;AAC5B,QAAM,QAAQ,SAAU,EAAE,MAAM,KAAK,CAAE,MAAO,aAAa,CAAC,IAAI;AAEhE,QAAM,kBAAkB;AAAA,IACvB,CAAE,aACD,SAAU,SAAU,EAAE,MAAM,MAAM,OAAO,SAAS,CAAE,CAAE;AAAA,IACvD,CAAE,MAAM,UAAU,QAAS;AAAA,EAC5B;AAEA,QAAM,EAAE,UAAU,UAAU,IAAI,YAAa;AAAA,IAC5C,UAAU,MAAM;AAAA,IAChB,aAAa,MAAM;AAAA,EACpB,CAAE;AAEF,MAAK,WAAY;AAChB,WAAO,oBAAC,WAAQ;AAAA,EACjB;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAW,CAAC,CAAE,MAAM,SAAS;AAAA,MAC7B;AAAA,MACA,gBAAiB,kBAAmB,SAAS,QAAS;AAAA,MACtD;AAAA,MACA;AAAA,MACA,MAAO;AAAA,MACP,SAAU;AAAA,MACV,UAAW;AAAA,MACX,uBAAqB;AAAA,MACrB;AAAA,MACA,UAAW;AAAA,MACX;AAAA;AAAA,EACD;AAEF;",
   "names": []
 }

package/build-module/components/dataform-controls/textarea.mjs

@@ -15,6 +15,7 @@ function Textarea({
   validity
 }) {
   const { rows = 4 } = config || {};
+  const disabled = field.isDisabled({ item: data, field });
   const { label, placeholder, description, setValue, isValid } = field;
   const value = field.getValue({ item: data });
   const onChangeControl = useCallback(
@@ -33,6 +34,7 @@ function Textarea({
       help: description,
       onChange: onChangeControl,
       rows,
+      disabled,
       minLength: isValid.minLength ? isValid.minLength.constraint : void 0,
       maxLength: isValid.maxLength ? isValid.maxLength.constraint : void 0,
       __next40pxDefaultSize: true,

package/build-module/components/dataform-controls/textarea.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/dataform-controls/textarea.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { privateApis } from '@wordpress/components';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { DataFormControlProps } from '../../types';\nimport { unlock } from '../../lock-unlock';\nimport getCustomValidity from './utils/get-custom-validity';\n\nconst { ValidatedTextareaControl } = unlock( privateApis );\n\nexport default function Textarea< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\tconfig,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\tconst { rows = 4 } = config || {};\n\tconst { label, placeholder, description, setValue, isValid } = field;\n\tconst value = field.getValue( { item: data } );\n\n\tconst onChangeControl = useCallback(\n\t\t( newValue: string ) =>\n\t\t\tonChange( setValue( { item: data, value: newValue } ) ),\n\t\t[ data, onChange, setValue ]\n\t);\n\n\treturn (\n\t\t<ValidatedTextareaControl\n\t\t\trequired={ !! isValid.required }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tcustomValidity={ getCustomValidity( isValid, validity ) }\n\t\t\tlabel={ label }\n\t\t\tplaceholder={ placeholder }\n\t\t\tvalue={ value ?? '' }\n\t\t\thelp={ description }\n\t\t\tonChange={ onChangeControl }\n\t\t\trows={ rows }\n\t\t\tminLength={\n\t\t\t\tisValid.minLength ? isValid.minLength.constraint : undefined\n\t\t\t}\n\t\t\tmaxLength={\n\t\t\t\tisValid.maxLength ? isValid.maxLength.constraint : undefined\n\t\t\t}\n\t\t\t__next40pxDefaultSize\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t/>\n\t);\n}\n"],
-  "mappings": ";AAGA,SAAS,mBAAmB;AAC5B,SAAS,mBAAmB;AAM5B,SAAS,cAAc;AACvB,OAAO,uBAAuB;AAwB5B;AAtBF,IAAM,EAAE,yBAAyB,IAAI,OAAQ,WAAY;AAE1C,SAAR,SAAmC;AAAA,EACzC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAkC;AACjC,QAAM,EAAE,OAAO,EAAE,IAAI,UAAU,CAAC;AAChC,QAAM,EAAE,OAAO,aAAa,aAAa,UAAU,QAAQ,IAAI;AAC/D,QAAM,QAAQ,MAAM,SAAU,EAAE,MAAM,KAAK,CAAE;AAE7C,QAAM,kBAAkB;AAAA,IACvB,CAAE,aACD,SAAU,SAAU,EAAE,MAAM,MAAM,OAAO,SAAS,CAAE,CAAE;AAAA,IACvD,CAAE,MAAM,UAAU,QAAS;AAAA,EAC5B;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAW,CAAC,CAAE,QAAQ;AAAA,MACtB;AAAA,MACA,gBAAiB,kBAAmB,SAAS,QAAS;AAAA,MACtD;AAAA,MACA;AAAA,MACA,OAAQ,SAAS;AAAA,MACjB,MAAO;AAAA,MACP,UAAW;AAAA,MACX;AAAA,MACA,WACC,QAAQ,YAAY,QAAQ,UAAU,aAAa;AAAA,MAEpD,WACC,QAAQ,YAAY,QAAQ,UAAU,aAAa;AAAA,MAEpD,uBAAqB;AAAA,MACrB;AAAA;AAAA,EACD;AAEF;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { privateApis } from '@wordpress/components';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { DataFormControlProps } from '../../types';\nimport { unlock } from '../../lock-unlock';\nimport getCustomValidity from './utils/get-custom-validity';\n\nconst { ValidatedTextareaControl } = unlock( privateApis );\n\nexport default function Textarea< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\tconfig,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\tconst { rows = 4 } = config || {};\n\tconst disabled = field.isDisabled( { item: data, field } );\n\tconst { label, placeholder, description, setValue, isValid } = field;\n\tconst value = field.getValue( { item: data } );\n\n\tconst onChangeControl = useCallback(\n\t\t( newValue: string ) =>\n\t\t\tonChange( setValue( { item: data, value: newValue } ) ),\n\t\t[ data, onChange, setValue ]\n\t);\n\n\treturn (\n\t\t<ValidatedTextareaControl\n\t\t\trequired={ !! isValid.required }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tcustomValidity={ getCustomValidity( isValid, validity ) }\n\t\t\tlabel={ label }\n\t\t\tplaceholder={ placeholder }\n\t\t\tvalue={ value ?? '' }\n\t\t\thelp={ description }\n\t\t\tonChange={ onChangeControl }\n\t\t\trows={ rows }\n\t\t\tdisabled={ disabled }\n\t\t\tminLength={\n\t\t\t\tisValid.minLength ? isValid.minLength.constraint : undefined\n\t\t\t}\n\t\t\tmaxLength={\n\t\t\t\tisValid.maxLength ? isValid.maxLength.constraint : undefined\n\t\t\t}\n\t\t\t__next40pxDefaultSize\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t/>\n\t);\n}\n"],
+  "mappings": ";AAGA,SAAS,mBAAmB;AAC5B,SAAS,mBAAmB;AAM5B,SAAS,cAAc;AACvB,OAAO,uBAAuB;AAyB5B;AAvBF,IAAM,EAAE,yBAAyB,IAAI,OAAQ,WAAY;AAE1C,SAAR,SAAmC;AAAA,EACzC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAkC;AACjC,QAAM,EAAE,OAAO,EAAE,IAAI,UAAU,CAAC;AAChC,QAAM,WAAW,MAAM,WAAY,EAAE,MAAM,MAAM,MAAM,CAAE;AACzD,QAAM,EAAE,OAAO,aAAa,aAAa,UAAU,QAAQ,IAAI;AAC/D,QAAM,QAAQ,MAAM,SAAU,EAAE,MAAM,KAAK,CAAE;AAE7C,QAAM,kBAAkB;AAAA,IACvB,CAAE,aACD,SAAU,SAAU,EAAE,MAAM,MAAM,OAAO,SAAS,CAAE,CAAE;AAAA,IACvD,CAAE,MAAM,UAAU,QAAS;AAAA,EAC5B;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAW,CAAC,CAAE,QAAQ;AAAA,MACtB;AAAA,MACA,gBAAiB,kBAAmB,SAAS,QAAS;AAAA,MACtD;AAAA,MACA;AAAA,MACA,OAAQ,SAAS;AAAA,MACjB,MAAO;AAAA,MACP,UAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA,WACC,QAAQ,YAAY,QAAQ,UAAU,aAAa;AAAA,MAEpD,WACC,QAAQ,YAAY,QAAQ,UAAU,aAAa;AAAA,MAEpD,uBAAqB;AAAA,MACrB;AAAA;AAAA,EACD;AAEF;",
   "names": []
 }

package/build-module/components/dataform-controls/toggle-group.mjs

@@ -19,6 +19,7 @@ function ToggleGroup({
   validity
 }) {
   const { getValue, setValue, isValid } = field;
+  const disabled = field.isDisabled({ item: data, field });
   const value = getValue({ item: data });
   const onChangeControl = useCallback(
     (newValue) => onChange(setValue({ item: data, value: newValue })),
@@ -52,7 +53,8 @@ function ToggleGroup({
         ToggleGroupControlOption,
         {
           label: el.label,
-          value: el.value
+          value: el.value,
+          disabled
         },
         el.value
       ))

package/build-module/components/dataform-controls/toggle-group.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/dataform-controls/toggle-group.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tprivateApis,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n\tSpinner,\n} from '@wordpress/components';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { DataFormControlProps } from '../../types';\nimport { unlock } from '../../lock-unlock';\nimport getCustomValidity from './utils/get-custom-validity';\nimport useElements from '../../hooks/use-elements';\n\nconst { ValidatedToggleGroupControl } = unlock( privateApis );\n\nexport default function ToggleGroup< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\tconst { getValue, setValue, isValid } = field;\n\tconst value = getValue( { item: data } );\n\n\tconst onChangeControl = useCallback(\n\t\t( newValue: string | number | undefined ) =>\n\t\t\tonChange( setValue( { item: data, value: newValue } ) ),\n\t\t[ data, onChange, setValue ]\n\t);\n\n\tconst { elements, isLoading } = useElements( {\n\t\telements: field.elements,\n\t\tgetElements: field.getElements,\n\t} );\n\n\tif ( isLoading ) {\n\t\treturn <Spinner />;\n\t}\n\n\tif ( elements.length === 0 ) {\n\t\treturn null;\n\t}\n\n\tconst selectedOption = elements.find( ( el ) => el.value === value );\n\treturn (\n\t\t<ValidatedToggleGroupControl\n\t\t\trequired={ !! field.isValid?.required }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tcustomValidity={ getCustomValidity( isValid, validity ) }\n\t\t\t__next40pxDefaultSize\n\t\t\tisBlock\n\t\t\tlabel={ field.label }\n\t\t\thelp={ selectedOption?.description || field.description }\n\t\t\tonChange={ onChangeControl }\n\t\t\tvalue={ value }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t>\n\t\t\t{ elements.map( ( el ) => (\n\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\tkey={ el.value }\n\t\t\t\t\tlabel={ el.label }\n\t\t\t\t\tvalue={ el.value }\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t</ValidatedToggleGroupControl>\n\t);\n}\n"],
-  "mappings": ";AAGA;AAAA,EACC;AAAA,EACA,0CAA0C;AAAA,EAC1C;AAAA,OACM;AACP,SAAS,mBAAmB;AAM5B,SAAS,cAAc;AACvB,OAAO,uBAAuB;AAC9B,OAAO,iBAAiB;AA2Bf;AAzBT,IAAM,EAAE,4BAA4B,IAAI,OAAQ,WAAY;AAE7C,SAAR,YAAsC;AAAA,EAC5C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAkC;AACjC,QAAM,EAAE,UAAU,UAAU,QAAQ,IAAI;AACxC,QAAM,QAAQ,SAAU,EAAE,MAAM,KAAK,CAAE;AAEvC,QAAM,kBAAkB;AAAA,IACvB,CAAE,aACD,SAAU,SAAU,EAAE,MAAM,MAAM,OAAO,SAAS,CAAE,CAAE;AAAA,IACvD,CAAE,MAAM,UAAU,QAAS;AAAA,EAC5B;AAEA,QAAM,EAAE,UAAU,UAAU,IAAI,YAAa;AAAA,IAC5C,UAAU,MAAM;AAAA,IAChB,aAAa,MAAM;AAAA,EACpB,CAAE;AAEF,MAAK,WAAY;AAChB,WAAO,oBAAC,WAAQ;AAAA,EACjB;AAEA,MAAK,SAAS,WAAW,GAAI;AAC5B,WAAO;AAAA,EACR;AAEA,QAAM,iBAAiB,SAAS,KAAM,CAAE,OAAQ,GAAG,UAAU,KAAM;AACnE,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAW,CAAC,CAAE,MAAM,SAAS;AAAA,MAC7B;AAAA,MACA,gBAAiB,kBAAmB,SAAS,QAAS;AAAA,MACtD,uBAAqB;AAAA,MACrB,SAAO;AAAA,MACP,OAAQ,MAAM;AAAA,MACd,MAAO,gBAAgB,eAAe,MAAM;AAAA,MAC5C,UAAW;AAAA,MACX;AAAA,MACA;AAAA,MAEE,mBAAS,IAAK,CAAE,OACjB;AAAA,QAAC;AAAA;AAAA,UAEA,OAAQ,GAAG;AAAA,UACX,OAAQ,GAAG;AAAA;AAAA,QAFL,GAAG;AAAA,MAGV,CACC;AAAA;AAAA,EACH;AAEF;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tprivateApis,\n\t__experimentalToggleGroupControlOption as ToggleGroupControlOption,\n\tSpinner,\n} from '@wordpress/components';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { DataFormControlProps } from '../../types';\nimport { unlock } from '../../lock-unlock';\nimport getCustomValidity from './utils/get-custom-validity';\nimport useElements from '../../hooks/use-elements';\n\nconst { ValidatedToggleGroupControl } = unlock( privateApis );\n\nexport default function ToggleGroup< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\tconst { getValue, setValue, isValid } = field;\n\tconst disabled = field.isDisabled( { item: data, field } );\n\tconst value = getValue( { item: data } );\n\n\tconst onChangeControl = useCallback(\n\t\t( newValue: string | number | undefined ) =>\n\t\t\tonChange( setValue( { item: data, value: newValue } ) ),\n\t\t[ data, onChange, setValue ]\n\t);\n\n\tconst { elements, isLoading } = useElements( {\n\t\telements: field.elements,\n\t\tgetElements: field.getElements,\n\t} );\n\n\tif ( isLoading ) {\n\t\treturn <Spinner />;\n\t}\n\n\tif ( elements.length === 0 ) {\n\t\treturn null;\n\t}\n\n\tconst selectedOption = elements.find( ( el ) => el.value === value );\n\treturn (\n\t\t<ValidatedToggleGroupControl\n\t\t\trequired={ !! field.isValid?.required }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tcustomValidity={ getCustomValidity( isValid, validity ) }\n\t\t\t__next40pxDefaultSize\n\t\t\tisBlock\n\t\t\tlabel={ field.label }\n\t\t\thelp={ selectedOption?.description || field.description }\n\t\t\tonChange={ onChangeControl }\n\t\t\tvalue={ value }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t>\n\t\t\t{ elements.map( ( el ) => (\n\t\t\t\t<ToggleGroupControlOption\n\t\t\t\t\tkey={ el.value }\n\t\t\t\t\tlabel={ el.label }\n\t\t\t\t\tvalue={ el.value }\n\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t</ValidatedToggleGroupControl>\n\t);\n}\n"],
+  "mappings": ";AAGA;AAAA,EACC;AAAA,EACA,0CAA0C;AAAA,EAC1C;AAAA,OACM;AACP,SAAS,mBAAmB;AAM5B,SAAS,cAAc;AACvB,OAAO,uBAAuB;AAC9B,OAAO,iBAAiB;AA4Bf;AA1BT,IAAM,EAAE,4BAA4B,IAAI,OAAQ,WAAY;AAE7C,SAAR,YAAsC;AAAA,EAC5C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAkC;AACjC,QAAM,EAAE,UAAU,UAAU,QAAQ,IAAI;AACxC,QAAM,WAAW,MAAM,WAAY,EAAE,MAAM,MAAM,MAAM,CAAE;AACzD,QAAM,QAAQ,SAAU,EAAE,MAAM,KAAK,CAAE;AAEvC,QAAM,kBAAkB;AAAA,IACvB,CAAE,aACD,SAAU,SAAU,EAAE,MAAM,MAAM,OAAO,SAAS,CAAE,CAAE;AAAA,IACvD,CAAE,MAAM,UAAU,QAAS;AAAA,EAC5B;AAEA,QAAM,EAAE,UAAU,UAAU,IAAI,YAAa;AAAA,IAC5C,UAAU,MAAM;AAAA,IAChB,aAAa,MAAM;AAAA,EACpB,CAAE;AAEF,MAAK,WAAY;AAChB,WAAO,oBAAC,WAAQ;AAAA,EACjB;AAEA,MAAK,SAAS,WAAW,GAAI;AAC5B,WAAO;AAAA,EACR;AAEA,QAAM,iBAAiB,SAAS,KAAM,CAAE,OAAQ,GAAG,UAAU,KAAM;AACnE,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAW,CAAC,CAAE,MAAM,SAAS;AAAA,MAC7B;AAAA,MACA,gBAAiB,kBAAmB,SAAS,QAAS;AAAA,MACtD,uBAAqB;AAAA,MACrB,SAAO;AAAA,MACP,OAAQ,MAAM;AAAA,MACd,MAAO,gBAAgB,eAAe,MAAM;AAAA,MAC5C,UAAW;AAAA,MACX;AAAA,MACA;AAAA,MAEE,mBAAS,IAAK,CAAE,OACjB;AAAA,QAAC;AAAA;AAAA,UAEA,OAAQ,GAAG;AAAA,UACX,OAAQ,GAAG;AAAA,UACX;AAAA;AAAA,QAHM,GAAG;AAAA,MAIV,CACC;AAAA;AAAA,EACH;AAEF;",
   "names": []
 }

package/build-module/components/dataform-controls/toggle.mjs

@@ -14,6 +14,7 @@ function Toggle({
   validity
 }) {
   const { label, description, getValue, setValue, isValid } = field;
+  const disabled = field.isDisabled({ item: data, field });
   const onChangeControl = useCallback(() => {
     onChange(
       setValue({ item: data, value: !getValue({ item: data }) })
@@ -29,7 +30,8 @@ function Toggle({
       label,
       help: description,
       checked: getValue({ item: data }),
-      onChange: onChangeControl
+      onChange: onChangeControl,
+      disabled
     }
   );
 }

package/build-module/components/dataform-controls/toggle.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/components/dataform-controls/toggle.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { privateApis } from '@wordpress/components';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { DataFormControlProps } from '../../types';\nimport { unlock } from '../../lock-unlock';\nimport getCustomValidity from './utils/get-custom-validity';\n\nconst { ValidatedToggleControl } = unlock( privateApis );\n\nexport default function Toggle< Item >( {\n\tfield,\n\tonChange,\n\tdata,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\tconst { label, description, getValue, setValue, isValid } = field;\n\n\tconst onChangeControl = useCallback( () => {\n\t\tonChange(\n\t\t\tsetValue( { item: data, value: ! getValue( { item: data } ) } )\n\t\t);\n\t}, [ onChange, setValue, data, getValue ] );\n\n\treturn (\n\t\t<ValidatedToggleControl\n\t\t\trequired={ !! isValid.required }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tcustomValidity={ getCustomValidity( isValid, validity ) }\n\t\t\thidden={ hideLabelFromVision }\n\t\t\tlabel={ label }\n\t\t\thelp={ description }\n\t\t\tchecked={ getValue( { item: data } ) }\n\t\t\tonChange={ onChangeControl }\n\t\t/>\n\t);\n}\n"],
-  "mappings": ";AAGA,SAAS,mBAAmB;AAC5B,SAAS,mBAAmB;AAM5B,SAAS,cAAc;AACvB,OAAO,uBAAuB;AAqB5B;AAnBF,IAAM,EAAE,uBAAuB,IAAI,OAAQ,WAAY;AAExC,SAAR,OAAiC;AAAA,EACvC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAkC;AACjC,QAAM,EAAE,OAAO,aAAa,UAAU,UAAU,QAAQ,IAAI;AAE5D,QAAM,kBAAkB,YAAa,MAAM;AAC1C;AAAA,MACC,SAAU,EAAE,MAAM,MAAM,OAAO,CAAE,SAAU,EAAE,MAAM,KAAK,CAAE,EAAE,CAAE;AAAA,IAC/D;AAAA,EACD,GAAG,CAAE,UAAU,UAAU,MAAM,QAAS,CAAE;AAE1C,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAW,CAAC,CAAE,QAAQ;AAAA,MACtB;AAAA,MACA,gBAAiB,kBAAmB,SAAS,QAAS;AAAA,MACtD,QAAS;AAAA,MACT;AAAA,MACA,MAAO;AAAA,MACP,SAAU,SAAU,EAAE,MAAM,KAAK,CAAE;AAAA,MACnC,UAAW;AAAA;AAAA,EACZ;AAEF;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { privateApis } from '@wordpress/components';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { DataFormControlProps } from '../../types';\nimport { unlock } from '../../lock-unlock';\nimport getCustomValidity from './utils/get-custom-validity';\n\nconst { ValidatedToggleControl } = unlock( privateApis );\n\nexport default function Toggle< Item >( {\n\tfield,\n\tonChange,\n\tdata,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\tconst { label, description, getValue, setValue, isValid } = field;\n\tconst disabled = field.isDisabled( { item: data, field } );\n\n\tconst onChangeControl = useCallback( () => {\n\t\tonChange(\n\t\t\tsetValue( { item: data, value: ! getValue( { item: data } ) } )\n\t\t);\n\t}, [ onChange, setValue, data, getValue ] );\n\n\treturn (\n\t\t<ValidatedToggleControl\n\t\t\trequired={ !! isValid.required }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tcustomValidity={ getCustomValidity( isValid, validity ) }\n\t\t\thidden={ hideLabelFromVision }\n\t\t\tlabel={ label }\n\t\t\thelp={ description }\n\t\t\tchecked={ getValue( { item: data } ) }\n\t\t\tonChange={ onChangeControl }\n\t\t\tdisabled={ disabled }\n\t\t/>\n\t);\n}\n"],
+  "mappings": ";AAGA,SAAS,mBAAmB;AAC5B,SAAS,mBAAmB;AAM5B,SAAS,cAAc;AACvB,OAAO,uBAAuB;AAsB5B;AApBF,IAAM,EAAE,uBAAuB,IAAI,OAAQ,WAAY;AAExC,SAAR,OAAiC;AAAA,EACvC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAkC;AACjC,QAAM,EAAE,OAAO,aAAa,UAAU,UAAU,QAAQ,IAAI;AAC5D,QAAM,WAAW,MAAM,WAAY,EAAE,MAAM,MAAM,MAAM,CAAE;AAEzD,QAAM,kBAAkB,YAAa,MAAM;AAC1C;AAAA,MACC,SAAU,EAAE,MAAM,MAAM,OAAO,CAAE,SAAU,EAAE,MAAM,KAAK,CAAE,EAAE,CAAE;AAAA,IAC/D;AAAA,EACD,GAAG,CAAE,UAAU,UAAU,MAAM,QAAS,CAAE;AAE1C,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAW,CAAC,CAAE,QAAQ;AAAA,MACtB;AAAA,MACA,gBAAiB,kBAAmB,SAAS,QAAS;AAAA,MACtD,QAAS;AAAA,MACT;AAAA,MACA,MAAO;AAAA,MACP,SAAU,SAAU,EAAE,MAAM,KAAK,CAAE;AAAA,MACnC,UAAW;AAAA,MACX;AAAA;AAAA,EACD;AAEF;",
   "names": []
 }

package/build-module/components/dataform-controls/utils/relative-date-control.mjs

@@ -34,6 +34,7 @@ function RelativeDateControl({
 }) {
   const options = TIME_UNITS_OPTIONS[operator === OPERATOR_IN_THE_PAST ? "inThePast" : "over"];
   const { id, label, description, getValue, setValue } = field;
+  const disabled = field.isDisabled({ item: data, field });
   const fieldValue = getValue({ item: data });
   const { value: relValue = "", unit = options[0].value } = fieldValue && typeof fieldValue === "object" ? fieldValue : {};
   const onChangeValue = useCallback(
@@ -72,7 +73,8 @@ function RelativeDateControl({
             min: 1,
             step: 1,
             value: relValue,
-            onChange: onChangeValue
+            onChange: onChangeValue,
+            disabled
           }
         ),
         /* @__PURE__ */ jsx(
@@ -84,7 +86,8 @@ function RelativeDateControl({
             value: unit,
             options,
             onChange: onChangeUnit,
-            hideLabelFromVision: true
+            hideLabelFromVision: true,
+            disabled
           }
         )
       ] })

package/build-module/components/dataform-controls/utils/relative-date-control.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/dataform-controls/utils/relative-date-control.tsx"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tBaseControl,\n\tSelectControl,\n\t__experimentalNumberControl as NumberControl,\n} from '@wordpress/components';\nimport { useCallback } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport { OPERATOR_IN_THE_PAST, OPERATOR_OVER } from '../../../constants';\nimport type { DataFormControlProps } from '../../../types';\n\ntype VALID_OPERATORS = 'inThePast' | 'over';\n\ninterface TimeUnitOption {\n\tvalue: string;\n\tlabel: string;\n}\n\nconst TIME_UNITS_OPTIONS: Record< VALID_OPERATORS, TimeUnitOption[] > = {\n\t[ OPERATOR_IN_THE_PAST ]: [\n\t\t{ value: 'days', label: __( 'Days' ) },\n\t\t{ value: 'weeks', label: __( 'Weeks' ) },\n\t\t{ value: 'months', label: __( 'Months' ) },\n\t\t{ value: 'years', label: __( 'Years' ) },\n\t],\n\t[ OPERATOR_OVER ]: [\n\t\t{ value: 'days', label: __( 'Days ago' ) },\n\t\t{ value: 'weeks', label: __( 'Weeks ago' ) },\n\t\t{ value: 'months', label: __( 'Months ago' ) },\n\t\t{ value: 'years', label: __( 'Years ago' ) },\n\t],\n};\n\nexport default function RelativeDateControl< Item >( {\n\tclassName,\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\toperator,\n}: DataFormControlProps< Item > & {\n\tclassName: string;\n} ) {\n\tconst options: TimeUnitOption[] =\n\t\tTIME_UNITS_OPTIONS[\n\t\t\toperator === OPERATOR_IN_THE_PAST ? 'inThePast' : 'over'\n\t\t];\n\n\tconst { id, label, description, getValue, setValue } = field;\n\tconst fieldValue = getValue( { item: data } );\n\tconst { value: relValue = '', unit = options[ 0 ].value } =\n\t\tfieldValue && typeof fieldValue === 'object' ? fieldValue : {};\n\n\tconst onChangeValue = useCallback(\n\t\t( newValue: string | undefined ) =>\n\t\t\tonChange(\n\t\t\t\tsetValue( {\n\t\t\t\t\titem: data,\n\t\t\t\t\tvalue: { value: Number( newValue ), unit },\n\t\t\t\t} )\n\t\t\t),\n\t\t[ onChange, setValue, data, unit ]\n\t);\n\n\tconst onChangeUnit = useCallback(\n\t\t( newUnit: string | undefined ) =>\n\t\t\tonChange(\n\t\t\t\tsetValue( {\n\t\t\t\t\titem: data,\n\t\t\t\t\tvalue: { value: relValue, unit: newUnit },\n\t\t\t\t} )\n\t\t\t),\n\t\t[ onChange, setValue, data, relValue ]\n\t);\n\n\treturn (\n\t\t<BaseControl\n\t\t\tid={ id }\n\t\t\tclassName={ clsx( className, 'dataviews-controls__relative-date' ) }\n\t\t\tlabel={ label }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\thelp={ description }\n\t\t>\n\t\t\t<Stack direction=\"row\" gap=\"sm\">\n\t\t\t\t<NumberControl\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\tclassName=\"dataviews-controls__relative-date-number\"\n\t\t\t\t\tspinControls=\"none\"\n\t\t\t\t\tmin={ 1 }\n\t\t\t\t\tstep={ 1 }\n\t\t\t\t\tvalue={ relValue }\n\t\t\t\t\tonChange={ onChangeValue }\n\t\t\t\t/>\n\t\t\t\t<SelectControl\n\t\t\t\t\tclassName=\"dataviews-controls__relative-date-unit\"\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\tlabel={ __( 'Unit' ) }\n\t\t\t\t\tvalue={ unit }\n\t\t\t\t\toptions={ options }\n\t\t\t\t\tonChange={ onChangeUnit }\n\t\t\t\t\thideLabelFromVision\n\t\t\t\t/>\n\t\t\t</Stack>\n\t\t</BaseControl>\n\t);\n}\n"],
-  "mappings": ";AAGA,OAAO,UAAU;AAKjB;AAAA,EACC;AAAA,EACA;AAAA,EACA,+BAA+B;AAAA,OACzB;AACP,SAAS,mBAAmB;AAC5B,SAAS,UAAU;AACnB,SAAS,aAAa;AAKtB,SAAS,sBAAsB,qBAAqB;AA2EjD,SACC,KADD;AAjEH,IAAM,qBAAkE;AAAA,EACvE,CAAE,oBAAqB,GAAG;AAAA,IACzB,EAAE,OAAO,QAAQ,OAAO,GAAI,MAAO,EAAE;AAAA,IACrC,EAAE,OAAO,SAAS,OAAO,GAAI,OAAQ,EAAE;AAAA,IACvC,EAAE,OAAO,UAAU,OAAO,GAAI,QAAS,EAAE;AAAA,IACzC,EAAE,OAAO,SAAS,OAAO,GAAI,OAAQ,EAAE;AAAA,EACxC;AAAA,EACA,CAAE,aAAc,GAAG;AAAA,IAClB,EAAE,OAAO,QAAQ,OAAO,GAAI,UAAW,EAAE;AAAA,IACzC,EAAE,OAAO,SAAS,OAAO,GAAI,WAAY,EAAE;AAAA,IAC3C,EAAE,OAAO,UAAU,OAAO,GAAI,YAAa,EAAE;AAAA,IAC7C,EAAE,OAAO,SAAS,OAAO,GAAI,WAAY,EAAE;AAAA,EAC5C;AACD;AAEe,SAAR,oBAA8C;AAAA,EACpD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAEI;AACH,QAAM,UACL,mBACC,aAAa,uBAAuB,cAAc,MACnD;AAED,QAAM,EAAE,IAAI,OAAO,aAAa,UAAU,SAAS,IAAI;AACvD,QAAM,aAAa,SAAU,EAAE,MAAM,KAAK,CAAE;AAC5C,QAAM,EAAE,OAAO,WAAW,IAAI,OAAO,QAAS,CAAE,EAAE,MAAM,IACvD,cAAc,OAAO,eAAe,WAAW,aAAa,CAAC;AAE9D,QAAM,gBAAgB;AAAA,IACrB,CAAE,aACD;AAAA,MACC,SAAU;AAAA,QACT,MAAM;AAAA,QACN,OAAO,EAAE,OAAO,OAAQ,QAAS,GAAG,KAAK;AAAA,MAC1C,CAAE;AAAA,IACH;AAAA,IACD,CAAE,UAAU,UAAU,MAAM,IAAK;AAAA,EAClC;AAEA,QAAM,eAAe;AAAA,IACpB,CAAE,YACD;AAAA,MACC,SAAU;AAAA,QACT,MAAM;AAAA,QACN,OAAO,EAAE,OAAO,UAAU,MAAM,QAAQ;AAAA,MACzC,CAAE;AAAA,IACH;AAAA,IACD,CAAE,UAAU,UAAU,MAAM,QAAS;AAAA,EACtC;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA,WAAY,KAAM,WAAW,mCAAoC;AAAA,MACjE;AAAA,MACA;AAAA,MACA,MAAO;AAAA,MAEP,+BAAC,SAAM,WAAU,OAAM,KAAI,MAC1B;AAAA;AAAA,UAAC;AAAA;AAAA,YACA,uBAAqB;AAAA,YACrB,WAAU;AAAA,YACV,cAAa;AAAA,YACb,KAAM;AAAA,YACN,MAAO;AAAA,YACP,OAAQ;AAAA,YACR,UAAW;AAAA;AAAA,QACZ;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACA,WAAU;AAAA,YACV,uBAAqB;AAAA,YACrB,OAAQ,GAAI,MAAO;AAAA,YACnB,OAAQ;AAAA,YACR;AAAA,YACA,UAAW;AAAA,YACX,qBAAmB;AAAA;AAAA,QACpB;AAAA,SACD;AAAA;AAAA,EACD;AAEF;",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tBaseControl,\n\tSelectControl,\n\t__experimentalNumberControl as NumberControl,\n} from '@wordpress/components';\nimport { useCallback } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { Stack } from '@wordpress/ui';\n\n/**\n * Internal dependencies\n */\nimport { OPERATOR_IN_THE_PAST, OPERATOR_OVER } from '../../../constants';\nimport type { DataFormControlProps } from '../../../types';\n\ntype VALID_OPERATORS = 'inThePast' | 'over';\n\ninterface TimeUnitOption {\n\tvalue: string;\n\tlabel: string;\n}\n\nconst TIME_UNITS_OPTIONS: Record< VALID_OPERATORS, TimeUnitOption[] > = {\n\t[ OPERATOR_IN_THE_PAST ]: [\n\t\t{ value: 'days', label: __( 'Days' ) },\n\t\t{ value: 'weeks', label: __( 'Weeks' ) },\n\t\t{ value: 'months', label: __( 'Months' ) },\n\t\t{ value: 'years', label: __( 'Years' ) },\n\t],\n\t[ OPERATOR_OVER ]: [\n\t\t{ value: 'days', label: __( 'Days ago' ) },\n\t\t{ value: 'weeks', label: __( 'Weeks ago' ) },\n\t\t{ value: 'months', label: __( 'Months ago' ) },\n\t\t{ value: 'years', label: __( 'Years ago' ) },\n\t],\n};\n\nexport default function RelativeDateControl< Item >( {\n\tclassName,\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\toperator,\n}: DataFormControlProps< Item > & {\n\tclassName: string;\n} ) {\n\tconst options: TimeUnitOption[] =\n\t\tTIME_UNITS_OPTIONS[\n\t\t\toperator === OPERATOR_IN_THE_PAST ? 'inThePast' : 'over'\n\t\t];\n\n\tconst { id, label, description, getValue, setValue } = field;\n\tconst disabled = field.isDisabled( { item: data, field } );\n\tconst fieldValue = getValue( { item: data } );\n\tconst { value: relValue = '', unit = options[ 0 ].value } =\n\t\tfieldValue && typeof fieldValue === 'object' ? fieldValue : {};\n\n\tconst onChangeValue = useCallback(\n\t\t( newValue: string | undefined ) =>\n\t\t\tonChange(\n\t\t\t\tsetValue( {\n\t\t\t\t\titem: data,\n\t\t\t\t\tvalue: { value: Number( newValue ), unit },\n\t\t\t\t} )\n\t\t\t),\n\t\t[ onChange, setValue, data, unit ]\n\t);\n\n\tconst onChangeUnit = useCallback(\n\t\t( newUnit: string | undefined ) =>\n\t\t\tonChange(\n\t\t\t\tsetValue( {\n\t\t\t\t\titem: data,\n\t\t\t\t\tvalue: { value: relValue, unit: newUnit },\n\t\t\t\t} )\n\t\t\t),\n\t\t[ onChange, setValue, data, relValue ]\n\t);\n\n\treturn (\n\t\t<BaseControl\n\t\t\tid={ id }\n\t\t\tclassName={ clsx( className, 'dataviews-controls__relative-date' ) }\n\t\t\tlabel={ label }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\thelp={ description }\n\t\t>\n\t\t\t<Stack direction=\"row\" gap=\"sm\">\n\t\t\t\t<NumberControl\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\tclassName=\"dataviews-controls__relative-date-number\"\n\t\t\t\t\tspinControls=\"none\"\n\t\t\t\t\tmin={ 1 }\n\t\t\t\t\tstep={ 1 }\n\t\t\t\t\tvalue={ relValue }\n\t\t\t\t\tonChange={ onChangeValue }\n\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t/>\n\t\t\t\t<SelectControl\n\t\t\t\t\tclassName=\"dataviews-controls__relative-date-unit\"\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\tlabel={ __( 'Unit' ) }\n\t\t\t\t\tvalue={ unit }\n\t\t\t\t\toptions={ options }\n\t\t\t\t\tonChange={ onChangeUnit }\n\t\t\t\t\thideLabelFromVision\n\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t/>\n\t\t\t</Stack>\n\t\t</BaseControl>\n\t);\n}\n"],
+  "mappings": ";AAGA,OAAO,UAAU;AAKjB;AAAA,EACC;AAAA,EACA;AAAA,EACA,+BAA+B;AAAA,OACzB;AACP,SAAS,mBAAmB;AAC5B,SAAS,UAAU;AACnB,SAAS,aAAa;AAKtB,SAAS,sBAAsB,qBAAqB;AA4EjD,SACC,KADD;AAlEH,IAAM,qBAAkE;AAAA,EACvE,CAAE,oBAAqB,GAAG;AAAA,IACzB,EAAE,OAAO,QAAQ,OAAO,GAAI,MAAO,EAAE;AAAA,IACrC,EAAE,OAAO,SAAS,OAAO,GAAI,OAAQ,EAAE;AAAA,IACvC,EAAE,OAAO,UAAU,OAAO,GAAI,QAAS,EAAE;AAAA,IACzC,EAAE,OAAO,SAAS,OAAO,GAAI,OAAQ,EAAE;AAAA,EACxC;AAAA,EACA,CAAE,aAAc,GAAG;AAAA,IAClB,EAAE,OAAO,QAAQ,OAAO,GAAI,UAAW,EAAE;AAAA,IACzC,EAAE,OAAO,SAAS,OAAO,GAAI,WAAY,EAAE;AAAA,IAC3C,EAAE,OAAO,UAAU,OAAO,GAAI,YAAa,EAAE;AAAA,IAC7C,EAAE,OAAO,SAAS,OAAO,GAAI,WAAY,EAAE;AAAA,EAC5C;AACD;AAEe,SAAR,oBAA8C;AAAA,EACpD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAEI;AACH,QAAM,UACL,mBACC,aAAa,uBAAuB,cAAc,MACnD;AAED,QAAM,EAAE,IAAI,OAAO,aAAa,UAAU,SAAS,IAAI;AACvD,QAAM,WAAW,MAAM,WAAY,EAAE,MAAM,MAAM,MAAM,CAAE;AACzD,QAAM,aAAa,SAAU,EAAE,MAAM,KAAK,CAAE;AAC5C,QAAM,EAAE,OAAO,WAAW,IAAI,OAAO,QAAS,CAAE,EAAE,MAAM,IACvD,cAAc,OAAO,eAAe,WAAW,aAAa,CAAC;AAE9D,QAAM,gBAAgB;AAAA,IACrB,CAAE,aACD;AAAA,MACC,SAAU;AAAA,QACT,MAAM;AAAA,QACN,OAAO,EAAE,OAAO,OAAQ,QAAS,GAAG,KAAK;AAAA,MAC1C,CAAE;AAAA,IACH;AAAA,IACD,CAAE,UAAU,UAAU,MAAM,IAAK;AAAA,EAClC;AAEA,QAAM,eAAe;AAAA,IACpB,CAAE,YACD;AAAA,MACC,SAAU;AAAA,QACT,MAAM;AAAA,QACN,OAAO,EAAE,OAAO,UAAU,MAAM,QAAQ;AAAA,MACzC,CAAE;AAAA,IACH;AAAA,IACD,CAAE,UAAU,UAAU,MAAM,QAAS;AAAA,EACtC;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA;AAAA,MACA,WAAY,KAAM,WAAW,mCAAoC;AAAA,MACjE;AAAA,MACA;AAAA,MACA,MAAO;AAAA,MAEP,+BAAC,SAAM,WAAU,OAAM,KAAI,MAC1B;AAAA;AAAA,UAAC;AAAA;AAAA,YACA,uBAAqB;AAAA,YACrB,WAAU;AAAA,YACV,cAAa;AAAA,YACb,KAAM;AAAA,YACN,MAAO;AAAA,YACP,OAAQ;AAAA,YACR,UAAW;AAAA,YACX;AAAA;AAAA,QACD;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACA,WAAU;AAAA,YACV,uBAAqB;AAAA,YACrB,OAAQ,GAAI,MAAO;AAAA,YACnB,OAAQ;AAAA,YACR;AAAA,YACA,UAAW;AAAA,YACX,qBAAmB;AAAA,YACnB;AAAA;AAAA,QACD;AAAA,SACD;AAAA;AAAA,EACD;AAEF;",
   "names": []
 }

package/build-module/components/dataform-controls/utils/use-disabled-date-matchers.mjs

@@ -0,0 +1,27 @@
+// packages/dataviews/src/components/dataform-controls/utils/use-disabled-date-matchers.ts
+import { useMemo } from "@wordpress/element";
+function useDisabledDateMatchers(isValid, parseDateFn) {
+  const minConstraint = typeof isValid.min?.constraint === "string" ? isValid.min.constraint : void 0;
+  const maxConstraint = typeof isValid.max?.constraint === "string" ? isValid.max.constraint : void 0;
+  const disabledMatchers = useMemo(() => {
+    const matchers = [];
+    if (minConstraint) {
+      const minDate = parseDateFn(minConstraint);
+      if (minDate) {
+        matchers.push({ before: minDate });
+      }
+    }
+    if (maxConstraint) {
+      const maxDate = parseDateFn(maxConstraint);
+      if (maxDate) {
+        matchers.push({ after: maxDate });
+      }
+    }
+    return matchers.length > 0 ? matchers : void 0;
+  }, [minConstraint, maxConstraint, parseDateFn]);
+  return { minConstraint, maxConstraint, disabledMatchers };
+}
+export {
+  useDisabledDateMatchers as default
+};
+//# sourceMappingURL=use-disabled-date-matchers.mjs.map

package/build-module/components/dataform-controls/utils/use-disabled-date-matchers.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/components/dataform-controls/utils/use-disabled-date-matchers.ts"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { NormalizedRules } from '../../../types';\n\ntype DateMatcher = { before: Date } | { after: Date };\n\nexport default function useDisabledDateMatchers< Item >(\n\tisValid: NormalizedRules< Item >,\n\tparseDateFn: ( dateString?: string ) => Date | null\n): {\n\tminConstraint: string | undefined;\n\tmaxConstraint: string | undefined;\n\tdisabledMatchers: DateMatcher[] | undefined;\n} {\n\tconst minConstraint =\n\t\ttypeof isValid.min?.constraint === 'string'\n\t\t\t? isValid.min.constraint\n\t\t\t: undefined;\n\tconst maxConstraint =\n\t\ttypeof isValid.max?.constraint === 'string'\n\t\t\t? isValid.max.constraint\n\t\t\t: undefined;\n\n\tconst disabledMatchers = useMemo( () => {\n\t\tconst matchers: DateMatcher[] = [];\n\t\tif ( minConstraint ) {\n\t\t\tconst minDate = parseDateFn( minConstraint );\n\t\t\tif ( minDate ) {\n\t\t\t\tmatchers.push( { before: minDate } );\n\t\t\t}\n\t\t}\n\t\tif ( maxConstraint ) {\n\t\t\tconst maxDate = parseDateFn( maxConstraint );\n\t\t\tif ( maxDate ) {\n\t\t\t\tmatchers.push( { after: maxDate } );\n\t\t\t}\n\t\t}\n\t\treturn matchers.length > 0 ? matchers : undefined;\n\t}, [ minConstraint, maxConstraint, parseDateFn ] );\n\n\treturn { minConstraint, maxConstraint, disabledMatchers };\n}\n"],
+  "mappings": ";AAGA,SAAS,eAAe;AAST,SAAR,wBACN,SACA,aAKC;AACD,QAAM,gBACL,OAAO,QAAQ,KAAK,eAAe,WAChC,QAAQ,IAAI,aACZ;AACJ,QAAM,gBACL,OAAO,QAAQ,KAAK,eAAe,WAChC,QAAQ,IAAI,aACZ;AAEJ,QAAM,mBAAmB,QAAS,MAAM;AACvC,UAAM,WAA0B,CAAC;AACjC,QAAK,eAAgB;AACpB,YAAM,UAAU,YAAa,aAAc;AAC3C,UAAK,SAAU;AACd,iBAAS,KAAM,EAAE,QAAQ,QAAQ,CAAE;AAAA,MACpC;AAAA,IACD;AACA,QAAK,eAAgB;AACpB,YAAM,UAAU,YAAa,aAAc;AAC3C,UAAK,SAAU;AACd,iBAAS,KAAM,EAAE,OAAO,QAAQ,CAAE;AAAA,MACnC;AAAA,IACD;AACA,WAAO,SAAS,SAAS,IAAI,WAAW;AAAA,EACzC,GAAG,CAAE,eAAe,eAAe,WAAY,CAAE;AAEjD,SAAO,EAAE,eAAe,eAAe,iBAAiB;AACzD;",
+  "names": []
+}

package/build-module/components/dataform-controls/utils/validated-input.mjs

@@ -18,6 +18,7 @@ function ValidatedText({
 }) {
   const { label, placeholder, description, getValue, setValue, isValid } = field;
   const value = getValue({ item: data });
+  const disabled = field.isDisabled({ item: data, field });
   const onChangeControl = useCallback(
     (newValue) => onChange(
       setValue({
@@ -42,6 +43,7 @@ function ValidatedText({
       type,
       prefix,
       suffix,
+      disabled,
       pattern: isValid.pattern ? isValid.pattern.constraint : void 0,
       minLength: isValid.minLength ? isValid.minLength.constraint : void 0,
       maxLength: isValid.maxLength ? isValid.maxLength.constraint : void 0,

package/build-module/components/dataform-controls/utils/validated-input.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/dataform-controls/utils/validated-input.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { privateApis } from '@wordpress/components';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { DataFormControlProps } from '../../../types';\nimport { unlock } from '../../../lock-unlock';\nimport getCustomValidity from './get-custom-validity';\n\nconst { ValidatedInputControl } = unlock( privateApis );\n\nexport type DataFormValidatedTextControlProps< Item > =\n\tDataFormControlProps< Item > & {\n\t\t/**\n\t\t * The input type of the control.\n\t\t */\n\t\ttype?: 'text' | 'email' | 'tel' | 'url' | 'password';\n\t\t/**\n\t\t * Optional prefix element to display before the input.\n\t\t */\n\t\tprefix?: React.ReactElement;\n\t\t/**\n\t\t * Optional suffix element to display after the input.\n\t\t */\n\t\tsuffix?: React.ReactElement;\n\t};\n\nexport default function ValidatedText< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\ttype,\n\tprefix,\n\tsuffix,\n\tvalidity,\n}: DataFormValidatedTextControlProps< Item > ) {\n\tconst { label, placeholder, description, getValue, setValue, isValid } =\n\t\tfield;\n\tconst value = getValue( { item: data } );\n\n\tconst onChangeControl = useCallback(\n\t\t( newValue: string ) =>\n\t\t\tonChange(\n\t\t\t\tsetValue( {\n\t\t\t\t\titem: data,\n\t\t\t\t\tvalue: newValue,\n\t\t\t\t} )\n\t\t\t),\n\t\t[ data, setValue, onChange ]\n\t);\n\n\treturn (\n\t\t<ValidatedInputControl\n\t\t\trequired={ !! isValid.required }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tcustomValidity={ getCustomValidity( isValid, validity ) }\n\t\t\tlabel={ label }\n\t\t\tplaceholder={ placeholder }\n\t\t\tvalue={ value ?? '' }\n\t\t\thelp={ description }\n\t\t\tonChange={ onChangeControl }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\ttype={ type }\n\t\t\tprefix={ prefix }\n\t\t\tsuffix={ suffix }\n\t\t\tpattern={ isValid.pattern ? isValid.pattern.constraint : undefined }\n\t\t\tminLength={\n\t\t\t\tisValid.minLength ? isValid.minLength.constraint : undefined\n\t\t\t}\n\t\t\tmaxLength={\n\t\t\t\tisValid.maxLength ? isValid.maxLength.constraint : undefined\n\t\t\t}\n\t\t\t__next40pxDefaultSize\n\t\t/>\n\t);\n}\n"],
-  "mappings": ";AAGA,SAAS,mBAAmB;AAC5B,SAAS,mBAAmB;AAM5B,SAAS,cAAc;AACvB,OAAO,uBAAuB;AA+C5B;AA7CF,IAAM,EAAE,sBAAsB,IAAI,OAAQ,WAAY;AAkBvC,SAAR,cAAwC;AAAA,EAC9C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAA+C;AAC9C,QAAM,EAAE,OAAO,aAAa,aAAa,UAAU,UAAU,QAAQ,IACpE;AACD,QAAM,QAAQ,SAAU,EAAE,MAAM,KAAK,CAAE;AAEvC,QAAM,kBAAkB;AAAA,IACvB,CAAE,aACD;AAAA,MACC,SAAU;AAAA,QACT,MAAM;AAAA,QACN,OAAO;AAAA,MACR,CAAE;AAAA,IACH;AAAA,IACD,CAAE,MAAM,UAAU,QAAS;AAAA,EAC5B;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAW,CAAC,CAAE,QAAQ;AAAA,MACtB;AAAA,MACA,gBAAiB,kBAAmB,SAAS,QAAS;AAAA,MACtD;AAAA,MACA;AAAA,MACA,OAAQ,SAAS;AAAA,MACjB,MAAO;AAAA,MACP,UAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,SAAU,QAAQ,UAAU,QAAQ,QAAQ,aAAa;AAAA,MACzD,WACC,QAAQ,YAAY,QAAQ,UAAU,aAAa;AAAA,MAEpD,WACC,QAAQ,YAAY,QAAQ,UAAU,aAAa;AAAA,MAEpD,uBAAqB;AAAA;AAAA,EACtB;AAEF;",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { privateApis } from '@wordpress/components';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { DataFormControlProps } from '../../../types';\nimport { unlock } from '../../../lock-unlock';\nimport getCustomValidity from './get-custom-validity';\n\nconst { ValidatedInputControl } = unlock( privateApis );\n\nexport type DataFormValidatedTextControlProps< Item > =\n\tDataFormControlProps< Item > & {\n\t\t/**\n\t\t * The input type of the control.\n\t\t */\n\t\ttype?: 'text' | 'email' | 'tel' | 'url' | 'password';\n\t\t/**\n\t\t * Optional prefix element to display before the input.\n\t\t */\n\t\tprefix?: React.ReactElement;\n\t\t/**\n\t\t * Optional suffix element to display after the input.\n\t\t */\n\t\tsuffix?: React.ReactElement;\n\t};\n\nexport default function ValidatedText< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\ttype,\n\tprefix,\n\tsuffix,\n\tvalidity,\n}: DataFormValidatedTextControlProps< Item > ) {\n\tconst { label, placeholder, description, getValue, setValue, isValid } =\n\t\tfield;\n\tconst value = getValue( { item: data } );\n\tconst disabled = field.isDisabled( { item: data, field } );\n\n\tconst onChangeControl = useCallback(\n\t\t( newValue: string ) =>\n\t\t\tonChange(\n\t\t\t\tsetValue( {\n\t\t\t\t\titem: data,\n\t\t\t\t\tvalue: newValue,\n\t\t\t\t} )\n\t\t\t),\n\t\t[ data, setValue, onChange ]\n\t);\n\n\treturn (\n\t\t<ValidatedInputControl\n\t\t\trequired={ !! isValid.required }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tcustomValidity={ getCustomValidity( isValid, validity ) }\n\t\t\tlabel={ label }\n\t\t\tplaceholder={ placeholder }\n\t\t\tvalue={ value ?? '' }\n\t\t\thelp={ description }\n\t\t\tonChange={ onChangeControl }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\ttype={ type }\n\t\t\tprefix={ prefix }\n\t\t\tsuffix={ suffix }\n\t\t\tdisabled={ disabled }\n\t\t\tpattern={ isValid.pattern ? isValid.pattern.constraint : undefined }\n\t\t\tminLength={\n\t\t\t\tisValid.minLength ? isValid.minLength.constraint : undefined\n\t\t\t}\n\t\t\tmaxLength={\n\t\t\t\tisValid.maxLength ? isValid.maxLength.constraint : undefined\n\t\t\t}\n\t\t\t__next40pxDefaultSize\n\t\t/>\n\t);\n}\n"],
+  "mappings": ";AAGA,SAAS,mBAAmB;AAC5B,SAAS,mBAAmB;AAM5B,SAAS,cAAc;AACvB,OAAO,uBAAuB;AAgD5B;AA9CF,IAAM,EAAE,sBAAsB,IAAI,OAAQ,WAAY;AAkBvC,SAAR,cAAwC;AAAA,EAC9C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAA+C;AAC9C,QAAM,EAAE,OAAO,aAAa,aAAa,UAAU,UAAU,QAAQ,IACpE;AACD,QAAM,QAAQ,SAAU,EAAE,MAAM,KAAK,CAAE;AACvC,QAAM,WAAW,MAAM,WAAY,EAAE,MAAM,MAAM,MAAM,CAAE;AAEzD,QAAM,kBAAkB;AAAA,IACvB,CAAE,aACD;AAAA,MACC,SAAU;AAAA,QACT,MAAM;AAAA,QACN,OAAO;AAAA,MACR,CAAE;AAAA,IACH;AAAA,IACD,CAAE,MAAM,UAAU,QAAS;AAAA,EAC5B;AAEA,SACC;AAAA,IAAC;AAAA;AAAA,MACA,UAAW,CAAC,CAAE,QAAQ;AAAA,MACtB;AAAA,MACA,gBAAiB,kBAAmB,SAAS,QAAS;AAAA,MACtD;AAAA,MACA;AAAA,MACA,OAAQ,SAAS;AAAA,MACjB,MAAO;AAAA,MACP,UAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,SAAU,QAAQ,UAAU,QAAQ,QAAQ,aAAa;AAAA,MACzD,WACC,QAAQ,YAAY,QAAQ,UAAU,aAAa;AAAA,MAEpD,WACC,QAAQ,YAAY,QAAQ,UAAU,aAAa;AAAA,MAEpD,uBAAqB;AAAA;AAAA,EACtB;AAEF;",
   "names": []
 }

package/build-module/components/dataform-controls/utils/validated-number.mjs

@@ -80,6 +80,7 @@ function ValidatedNumber({
   const step = Math.pow(10, Math.abs(decimals) * -1);
   const { label, description, getValue, setValue, isValid } = field;
   const value = getValue({ item: data }) ?? "";
+  const disabled = field.isDisabled({ item: data, field });
   const onChangeControl = useCallback(
     (newValue) => {
       onChange(
@@ -136,7 +137,8 @@ function ValidatedNumber({
       hideLabelFromVision,
       step,
       min: isValid.min ? isValid.min.constraint : void 0,
-      max: isValid.max ? isValid.max.constraint : void 0
+      max: isValid.max ? isValid.max.constraint : void 0,
+      disabled
     }
   );
 }

package/build-module/components/dataform-controls/utils/validated-number.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/dataform-controls/utils/validated-number.tsx"],
-  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tFlex,\n\tBaseControl,\n\t__experimentalNumberControl as NumberControl,\n\tprivateApis,\n} from '@wordpress/components';\nimport { useCallback } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { OPERATOR_BETWEEN } from '../../../constants';\nimport type { DataFormControlProps, FormatNumber } from '../../../types';\nimport { unlock } from '../../../lock-unlock';\nimport getCustomValidity from './get-custom-validity';\n\nconst { ValidatedNumberControl } = unlock( privateApis );\n\ntype NumberBetween = [ number | string, number | string ];\n\nfunction toNumberOrEmpty( value?: string ) {\n\tif ( value === '' || value === undefined ) {\n\t\treturn '';\n\t}\n\tconst number = Number( value );\n\treturn Number.isFinite( number ) ? number : '';\n}\n\nfunction BetweenControls( {\n\tvalue,\n\tonChange,\n\thideLabelFromVision,\n\tstep,\n}: {\n\tvalue: NumberBetween;\n\tonChange: ( [ min, max ]: NumberBetween ) => void;\n\thideLabelFromVision?: boolean;\n\tstep: number;\n} ) {\n\tconst [ min = '', max = '' ] = value;\n\n\tconst onChangeMin = useCallback(\n\t\t( newValue: string | undefined ) =>\n\t\t\tonChange( [ toNumberOrEmpty( newValue ), max ] ),\n\t\t[ onChange, max ]\n\t);\n\n\tconst onChangeMax = useCallback(\n\t\t( newValue: string | undefined ) =>\n\t\t\tonChange( [ min, toNumberOrEmpty( newValue ) ] ),\n\t\t[ onChange, min ]\n\t);\n\n\treturn (\n\t\t<BaseControl\n\t\t\thelp={ __( 'The max. value must be greater than the min. value.' ) }\n\t\t>\n\t\t\t<Flex direction=\"row\" gap={ 4 }>\n\t\t\t\t<NumberControl\n\t\t\t\t\tlabel={ __( 'Min.' ) }\n\t\t\t\t\tvalue={ min }\n\t\t\t\t\tmax={ max ? Number( max ) - step : undefined }\n\t\t\t\t\tonChange={ onChangeMin }\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\t\tstep={ step }\n\t\t\t\t/>\n\t\t\t\t<NumberControl\n\t\t\t\t\tlabel={ __( 'Max.' ) }\n\t\t\t\t\tvalue={ max }\n\t\t\t\t\tmin={ min ? Number( min ) + step : undefined }\n\t\t\t\t\tonChange={ onChangeMax }\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\t\tstep={ step }\n\t\t\t\t/>\n\t\t\t</Flex>\n\t\t</BaseControl>\n\t);\n}\n\nexport default function ValidatedNumber< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\toperator,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\tconst decimals = ( field.format as FormatNumber )?.decimals ?? 0;\n\tconst step = Math.pow( 10, Math.abs( decimals ) * -1 );\n\tconst { label, description, getValue, setValue, isValid } = field;\n\tconst value = getValue( { item: data } ) ?? '';\n\n\tconst onChangeControl = useCallback(\n\t\t( newValue: string | undefined ) => {\n\t\t\tonChange(\n\t\t\t\tsetValue( {\n\t\t\t\t\titem: data,\n\t\t\t\t\t// Do not convert an empty string or undefined to a number,\n\t\t\t\t\t// otherwise there's a mismatch between the UI control (empty)\n\t\t\t\t\t// and the data relied by onChange (0).\n\t\t\t\t\tvalue: [ '', undefined ].includes( newValue )\n\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t: Number( newValue ),\n\t\t\t\t} )\n\t\t\t);\n\t\t},\n\t\t[ data, onChange, setValue ]\n\t);\n\n\tconst onChangeBetweenControls = useCallback(\n\t\t( newValue: NumberBetween ) => {\n\t\t\tonChange(\n\t\t\t\tsetValue( {\n\t\t\t\t\titem: data,\n\t\t\t\t\tvalue: newValue,\n\t\t\t\t} )\n\t\t\t);\n\t\t},\n\t\t[ data, onChange, setValue ]\n\t);\n\n\tif ( operator === OPERATOR_BETWEEN ) {\n\t\tlet valueBetween: NumberBetween = [ '', '' ];\n\t\tif (\n\t\t\tArray.isArray( value ) &&\n\t\t\tvalue.length === 2 &&\n\t\t\tvalue.every(\n\t\t\t\t( element ) => typeof element === 'number' || element === ''\n\t\t\t)\n\t\t) {\n\t\t\tvalueBetween = value as NumberBetween;\n\t\t}\n\t\treturn (\n\t\t\t<BetweenControls\n\t\t\t\tvalue={ valueBetween }\n\t\t\t\tonChange={ onChangeBetweenControls }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\tstep={ step }\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<ValidatedNumberControl\n\t\t\trequired={ !! isValid.required }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tcustomValidity={ getCustomValidity( isValid, validity ) }\n\t\t\tlabel={ label }\n\t\t\thelp={ description }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChangeControl }\n\t\t\t__next40pxDefaultSize\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\tstep={ step }\n\t\t\tmin={ isValid.min ? isValid.min.constraint : undefined }\n\t\t\tmax={ isValid.max ? isValid.max.constraint : undefined }\n\t\t/>\n\t);\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport {\n\tFlex,\n\tBaseControl,\n\t__experimentalNumberControl as NumberControl,\n\tprivateApis,\n} from '@wordpress/components';\nimport { useCallback } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { OPERATOR_BETWEEN } from '../../../constants';\nimport type { DataFormControlProps, FormatNumber } from '../../../types';\nimport { unlock } from '../../../lock-unlock';\nimport getCustomValidity from './get-custom-validity';\n\nconst { ValidatedNumberControl } = unlock( privateApis );\n\ntype NumberBetween = [ number | string, number | string ];\n\nfunction toNumberOrEmpty( value?: string ) {\n\tif ( value === '' || value === undefined ) {\n\t\treturn '';\n\t}\n\tconst number = Number( value );\n\treturn Number.isFinite( number ) ? number : '';\n}\n\nfunction BetweenControls( {\n\tvalue,\n\tonChange,\n\thideLabelFromVision,\n\tstep,\n}: {\n\tvalue: NumberBetween;\n\tonChange: ( [ min, max ]: NumberBetween ) => void;\n\thideLabelFromVision?: boolean;\n\tstep: number;\n} ) {\n\tconst [ min = '', max = '' ] = value;\n\n\tconst onChangeMin = useCallback(\n\t\t( newValue: string | undefined ) =>\n\t\t\tonChange( [ toNumberOrEmpty( newValue ), max ] ),\n\t\t[ onChange, max ]\n\t);\n\n\tconst onChangeMax = useCallback(\n\t\t( newValue: string | undefined ) =>\n\t\t\tonChange( [ min, toNumberOrEmpty( newValue ) ] ),\n\t\t[ onChange, min ]\n\t);\n\n\treturn (\n\t\t<BaseControl\n\t\t\thelp={ __( 'The max. value must be greater than the min. value.' ) }\n\t\t>\n\t\t\t<Flex direction=\"row\" gap={ 4 }>\n\t\t\t\t<NumberControl\n\t\t\t\t\tlabel={ __( 'Min.' ) }\n\t\t\t\t\tvalue={ min }\n\t\t\t\t\tmax={ max ? Number( max ) - step : undefined }\n\t\t\t\t\tonChange={ onChangeMin }\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\t\tstep={ step }\n\t\t\t\t/>\n\t\t\t\t<NumberControl\n\t\t\t\t\tlabel={ __( 'Max.' ) }\n\t\t\t\t\tvalue={ max }\n\t\t\t\t\tmin={ min ? Number( min ) + step : undefined }\n\t\t\t\t\tonChange={ onChangeMax }\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\t\tstep={ step }\n\t\t\t\t/>\n\t\t\t</Flex>\n\t\t</BaseControl>\n\t);\n}\n\nexport default function ValidatedNumber< Item >( {\n\tdata,\n\tfield,\n\tonChange,\n\thideLabelFromVision,\n\tmarkWhenOptional,\n\toperator,\n\tvalidity,\n}: DataFormControlProps< Item > ) {\n\tconst decimals = ( field.format as FormatNumber )?.decimals ?? 0;\n\tconst step = Math.pow( 10, Math.abs( decimals ) * -1 );\n\tconst { label, description, getValue, setValue, isValid } = field;\n\tconst value = getValue( { item: data } ) ?? '';\n\tconst disabled = field.isDisabled( { item: data, field } );\n\n\tconst onChangeControl = useCallback(\n\t\t( newValue: string | undefined ) => {\n\t\t\tonChange(\n\t\t\t\tsetValue( {\n\t\t\t\t\titem: data,\n\t\t\t\t\t// Do not convert an empty string or undefined to a number,\n\t\t\t\t\t// otherwise there's a mismatch between the UI control (empty)\n\t\t\t\t\t// and the data relied by onChange (0).\n\t\t\t\t\tvalue: [ '', undefined ].includes( newValue )\n\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t: Number( newValue ),\n\t\t\t\t} )\n\t\t\t);\n\t\t},\n\t\t[ data, onChange, setValue ]\n\t);\n\n\tconst onChangeBetweenControls = useCallback(\n\t\t( newValue: NumberBetween ) => {\n\t\t\tonChange(\n\t\t\t\tsetValue( {\n\t\t\t\t\titem: data,\n\t\t\t\t\tvalue: newValue,\n\t\t\t\t} )\n\t\t\t);\n\t\t},\n\t\t[ data, onChange, setValue ]\n\t);\n\n\tif ( operator === OPERATOR_BETWEEN ) {\n\t\tlet valueBetween: NumberBetween = [ '', '' ];\n\t\tif (\n\t\t\tArray.isArray( value ) &&\n\t\t\tvalue.length === 2 &&\n\t\t\tvalue.every(\n\t\t\t\t( element ) => typeof element === 'number' || element === ''\n\t\t\t)\n\t\t) {\n\t\t\tvalueBetween = value as NumberBetween;\n\t\t}\n\t\treturn (\n\t\t\t<BetweenControls\n\t\t\t\tvalue={ valueBetween }\n\t\t\t\tonChange={ onChangeBetweenControls }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\tstep={ step }\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<ValidatedNumberControl\n\t\t\trequired={ !! isValid.required }\n\t\t\tmarkWhenOptional={ markWhenOptional }\n\t\t\tcustomValidity={ getCustomValidity( isValid, validity ) }\n\t\t\tlabel={ label }\n\t\t\thelp={ description }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChangeControl }\n\t\t\t__next40pxDefaultSize\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\tstep={ step }\n\t\t\tmin={ isValid.min ? isValid.min.constraint : undefined }\n\t\t\tmax={ isValid.max ? isValid.max.constraint : undefined }\n\t\t\tdisabled={ disabled }\n\t\t/>\n\t);\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/build-module/components/dataform-layouts/panel/summary-button.mjs

@@ -115,7 +115,6 @@ function SummaryButton({
           {
             className: "dataforms-layouts-panel__field-trigger-icon",
             label: ariaLabel,
-            showTooltip: false,
             icon: pencil,
             size: "small",
             "aria-expanded": ariaExpanded,