npm - @wordpress/components - Versions diffs - 25.8.0 → 25.8.1 - Mend

@wordpress/components 25.8.0 → 25.8.1

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.

Files changed (34) hide show

package/CHANGELOG.md +11 -0
package/build/date-time/time/index.js +6 -1
package/build/date-time/time/index.js.map +1 -1
package/build/modal/index.js +12 -3
package/build/modal/index.js.map +1 -1
package/build/modal/types.js.map +1 -1
package/build/placeholder/index.js +10 -4
package/build/placeholder/index.js.map +1 -1
package/build-module/date-time/time/index.js +6 -1
package/build-module/date-time/time/index.js.map +1 -1
package/build-module/modal/index.js +12 -3
package/build-module/modal/index.js.map +1 -1
package/build-module/modal/types.js.map +1 -1
package/build-module/placeholder/index.js +11 -4
package/build-module/placeholder/index.js.map +1 -1
package/build-style/style-rtl.css +0 -10
package/build-style/style.css +0 -10
package/build-types/date-time/time/index.d.ts.map +1 -1
package/build-types/modal/index.d.ts.map +1 -1
package/build-types/modal/stories/index.story.d.ts.map +1 -1
package/build-types/modal/types.d.ts +1 -1
package/build-types/modal/types.d.ts.map +1 -1
package/build-types/placeholder/index.d.ts.map +1 -1
package/package.json +20 -20
package/src/date-time/time/index.tsx +8 -1
package/src/modal/README.md +7 -1
package/src/modal/index.tsx +27 -3
package/src/modal/stories/index.story.tsx +2 -1
package/src/modal/test/index.tsx +124 -0
package/src/modal/types.ts +3 -1
package/src/placeholder/index.tsx +15 -8
package/src/placeholder/style.scss +0 -12
package/src/placeholder/test/index.tsx +34 -15
package/tsconfig.tsbuildinfo +1 -1

package/CHANGELOG.md CHANGED Viewed

@@ -2,10 +2,21 @@
 ## Unreleased
+### Bug Fix
+-   `Placeholder`: Improved DOM structure and screen reader announcements ([#45801](https://github.com/WordPress/gutenberg/pull/45801)).
+-   `DateTimePicker`: fix onChange callback check so that it also works inside iframes ([#54669](https://github.com/WordPress/gutenberg/pull/54669)).
+### Internal
+-   `Tooltip`, `Shortcut`: Remove unused `ui/` components from the codebase ([#54573](https://github.com/WordPress/gutenberg/pull/54573))
+-   Update `uuid` package to 9.0.1 ([#54725](https://github.com/WordPress/gutenberg/pull/54725)).
 ## 25.8.0 (2023-09-20)
 ### Enhancements
+-   Add new option `firstContentElement` to Modal's `focusOnMount` prop to allow consumers to focus the first element within the Modal's **contents** ([#54590](https://github.com/WordPress/gutenberg/pull/54590)).
 -   `Notice`: Improve accessibility by adding visually hidden text to clarify what a notice text is about and the notice type (success, error, warning, info) ([#54498](https://github.com/WordPress/gutenberg/pull/54498)).
 -   Making Circular Option Picker a `listbox`. Note that while this changes some public API, new props are optional, and currently have default values; this will change in another patch ([#52255](https://github.com/WordPress/gutenberg/pull/52255)).
 -   `ToggleGroupControl`: Rewrite backdrop animation using framer motion shared layout animations, add better support for controlled and uncontrolled modes ([#50278](https://github.com/WordPress/gutenberg/pull/50278)).

package/build/date-time/time/index.js CHANGED Viewed

@@ -109,7 +109,12 @@ function TimePicker({
     const callback = (value, {
       event
     }) => {
-      if (!(event.target instanceof HTMLInputElement)) {
+      var _ownerDocument$defaul;
+      // `instanceof` checks need to get the instance definition from the
+      // corresponding window object — therefore, the following logic makes
+      // the component work correctly even when rendered inside an iframe.
+      const HTMLInputElementInstance = (_ownerDocument$defaul = event.target?.ownerDocument.defaultView?.HTMLInputElement) !== null && _ownerDocument$defaul !== void 0 ? _ownerDocument$defaul : HTMLInputElement;
+      if (!(event.target instanceof HTMLInputElementInstance)) {
         return;
       }
       if (!event.target.validity.valid) {

package/build/date-time/time/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_element","require","_dateFns","_i18n","_baseControl","_interopRequireDefault","_button","_buttonGroup","_timezone","_styles","_hStack","_spacer","_actions","_utils","_constants","from12hTo24h","hours","isPm","buildPadInputStateReducer","pad","state","action","nextState","type","COMMIT","PRESS_UP","PRESS_DOWN","value","undefined","toString","padStart","TimePicker","is12Hour","currentTime","onChange","date","setDate","useState","startOfMinute","inputToDate","Date","useEffect","day","month","year","minutes","am","useMemo","format","buildNumberControlChangeCallback","method","callback","event","target","HTMLInputElement","validity","valid","numberValue","Number","newDate","set","TIMEZONELESS_FORMAT","buildAmPmChangeCallback","parsedHours","parseInt","setHours","dayField","createElement","DayInput","className","label","__","hideLabelFromVision","__next36pxDefaultSize","step","min","max","required","spinControls","isPressEnterToChange","isDragEnabled","isShiftStepEnabled","monthField","MonthSelectWrapper","MonthSelect","__nextHasNoMarginBottom","options","setMonth","Wrapper","Fieldset","default","VisualLabel","as","HStack","TimeWrapper","HoursInput","__unstableStateReducer","TimeSeparator","MinutesInput","variant","onClick","Spacer","Fragment","YearInput","_default","exports"],"sources":["@wordpress/components/src/date-time/time/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport { startOfMinute, format, set, setHours, setMonth } from 'date-fns';\n\n/\n WordPress dependencies\n /\nimport { useState, useMemo, useEffect } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/\n Internal dependencies\n /\nimport BaseControl from '../../base-control';\nimport Button from '../../button';\nimport ButtonGroup from '../../button-group';\nimport TimeZone from './timezone';\nimport type { TimePickerProps } from '../types';\nimport {\n\tWrapper,\n\tFieldset,\n\tHoursInput,\n\tTimeSeparator,\n\tMinutesInput,\n\tMonthSelectWrapper,\n\tMonthSelect,\n\tDayInput,\n\tYearInput,\n\tTimeWrapper,\n} from './styles';\nimport { HStack } from '../../h-stack';\nimport { Spacer } from '../../spacer';\nimport type { InputChangeCallback } from '../../input-control/types';\nimport type { InputState } from '../../input-control/reducer/state';\nimport type { InputAction } from '../../input-control/reducer/actions';\nimport {\n\tCOMMIT,\n\tPRESS_DOWN,\n\tPRESS_UP,\n} from '../../input-control/reducer/actions';\nimport { inputToDate } from '../utils';\nimport { TIMEZONELESS_FORMAT } from '../constants';\n\nfunction from12hTo24h( hours: number, isPm: boolean ) {\n\treturn isPm ? ( ( hours % 12 ) + 12 ) % 24 : hours % 12;\n}\n\n/\n Creates an InputControl reducer used to pad an input so that it is always a\n * given width. For example, the hours and minutes inputs are padded to 2 so\n * that '4' appears as '04'.\n \n @param pad How many digits the value should be.\n /\nfunction buildPadInputStateReducer( pad: number ) {\n\treturn ( state: InputState, action: InputAction ) => {\n\t\tconst nextState = { ...state };\n\t\tif (\n\t\t\taction.type === COMMIT \|\|\n\t\t\taction.type === PRESS_UP \|\|\n\t\t\taction.type === PRESS_DOWN\n\t\t) {\n\t\t\tif ( nextState.value !== undefined ) {\n\t\t\t\tnextState.value = nextState.value\n\t\t\t\t\t.toString()\n\t\t\t\t\t.padStart( pad, '0' );\n\t\t\t}\n\t\t}\n\t\treturn nextState;\n\t};\n}\n\n/\n TimePicker is a React component that renders a clock for time selection.\n \n ```jsx\n * import { TimePicker } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n \n const MyTimePicker = () => {\n * const [ time, setTime ] = useState( new Date() );\n \n return (\n * <TimePicker\n * currentTime={ date }\n * onChange={ ( newTime ) => setTime( newTime ) }\n * is12Hour\n * />\n * );\n * };\n * ```\n */\nexport function TimePicker( {\n\tis12Hour,\n\tcurrentTime,\n\tonChange,\n}: TimePickerProps ) {\n\tconst [ date, setDate ] = useState( () =>\n\t\t// Truncate the date at the minutes, see: #15495.\n\t\tcurrentTime ? startOfMinute( inputToDate( currentTime ) ) : new Date()\n\t);\n\n\t// Reset the state when currentTime changed.\n\t// TODO: useEffect() shouldn't be used like this, causes an unnecessary render\n\tuseEffect( () => {\n\t\tsetDate(\n\t\t\tcurrentTime\n\t\t\t\t? startOfMinute( inputToDate( currentTime ) )\n\t\t\t\t: new Date()\n\t\t);\n\t}, [ currentTime ] );\n\n\tconst { day, month, year, minutes, hours, am } = useMemo(\n\t\t() => ( {\n\t\t\tday: format( date, 'dd' ),\n\t\t\tmonth: format( date, 'MM' ),\n\t\t\tyear: format( date, 'yyyy' ),\n\t\t\tminutes: format( date, 'mm' ),\n\t\t\thours: format( date, is12Hour ? 'hh' : 'HH' ),\n\t\t\tam: format( date, 'a' ),\n\t\t} ),\n\t\t[ date, is12Hour ]\n\t);\n\n\tconst buildNumberControlChangeCallback = (\n\t\tmethod: 'hours' \| 'minutes' \| 'date' \| 'year'\n\t) => {\n\t\tconst callback: InputChangeCallback = ( value, { event } ) => {\n\t\t\tif ( ! ( event.target instanceof HTMLInputElement ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( ! event.target.validity.valid ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// We can safely assume value is a number if target is valid.\n\t\t\tlet numberValue = Number( value );\n\n\t\t\t// If the 12-hour format is being used and the 'PM' period is\n\t\t\t// selected, then the incoming value (which ranges 1-12) should be\n\t\t\t// increased by 12 to match the expected 24-hour format.\n\t\t\tif ( method === 'hours' && is12Hour ) {\n\t\t\t\tnumberValue = from12hTo24h( numberValue, am === 'PM' );\n\t\t\t}\n\n\t\t\tconst newDate = set( date, { [ method ]: numberValue } );\n\t\t\tsetDate( newDate );\n\t\t\tonChange?.( format( newDate, TIMEZONELESS_FORMAT ) );\n\t\t};\n\t\treturn callback;\n\t};\n\n\tfunction buildAmPmChangeCallback( value: 'AM' \| 'PM' ) {\n\t\treturn () => {\n\t\t\tif ( am === value ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst parsedHours = parseInt( hours, 10 );\n\n\t\t\tconst newDate = setHours(\n\t\t\t\tdate,\n\t\t\t\tfrom12hTo24h( parsedHours, value === 'PM' )\n\t\t\t);\n\t\t\tsetDate( newDate );\n\t\t\tonChange?.( format( newDate, TIMEZONELESS_FORMAT ) );\n\t\t};\n\t}\n\n\tconst dayField = (\n\t\t<DayInput\n\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-day\" // Unused, for backwards compatibility.\n\t\t\tlabel={ __( 'Day' ) }\n\t\t\thideLabelFromVision\n\t\t\t__next36pxDefaultSize\n\t\t\tvalue={ day }\n\t\t\tstep={ 1 }\n\t\t\tmin={ 1 }\n\t\t\tmax={ 31 }\n\t\t\trequired\n\t\t\tspinControls=\"none\"\n\t\t\tisPressEnterToChange\n\t\t\tisDragEnabled={ false }\n\t\t\tisShiftStepEnabled={ false }\n\t\t\tonChange={ buildNumberControlChangeCallback( 'date' ) }\n\t\t/>\n\t);\n\n\tconst monthField = (\n\t\t<MonthSelectWrapper>\n\t\t\t<MonthSelect\n\t\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-month\" // Unused, for backwards compatibility.\n\t\t\t\tlabel={ __( 'Month' ) }\n\t\t\t\thideLabelFromVision\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\tvalue={ month }\n\t\t\t\toptions={ [\n\t\t\t\t\t{ value: '01', label: __( 'January' ) },\n\t\t\t\t\t{ value: '02', label: __( 'February' ) },\n\t\t\t\t\t{ value: '03', label: __( 'March' ) },\n\t\t\t\t\t{ value: '04', label: __( 'April' ) },\n\t\t\t\t\t{ value: '05', label: __( 'May' ) },\n\t\t\t\t\t{ value: '06', label: __( 'June' ) },\n\t\t\t\t\t{ value: '07', label: __( 'July' ) },\n\t\t\t\t\t{ value: '08', label: __( 'August' ) },\n\t\t\t\t\t{ value: '09', label: __( 'September' ) },\n\t\t\t\t\t{ value: '10', label: __( 'October' ) },\n\t\t\t\t\t{ value: '11', label: __( 'November' ) },\n\t\t\t\t\t{ value: '12', label: __( 'December' ) },\n\t\t\t\t] }\n\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\tconst newDate = setMonth( date, Number( value ) - 1 );\n\t\t\t\t\tsetDate( newDate );\n\t\t\t\t\tonChange?.( format( newDate, TIMEZONELESS_FORMAT ) );\n\t\t\t\t} }\n\t\t\t/>\n\t\t</MonthSelectWrapper>\n\t);\n\n\treturn (\n\t\t<Wrapper\n\t\t\tclassName=\"components-datetime__time\" // Unused, for backwards compatibility.\n\t\t>\n\t\t\t<Fieldset>\n\t\t\t\t<BaseControl.VisualLabel\n\t\t\t\t\tas=\"legend\"\n\t\t\t\t\tclassName=\"components-datetime__time-legend\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Time' ) }\n\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t<HStack\n\t\t\t\t\tclassName=\"components-datetime__time-wrapper\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t<TimeWrapper\n\t\t\t\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-time\" // Unused, for backwards compatibility.\n\t\t\t\t\t>\n\t\t\t\t\t\t<HoursInput\n\t\t\t\t\t\t\tclassName=\"components-datetime__time-field-hours-input\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\tlabel={ __( 'Hours' ) }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t__next36pxDefaultSize\n\t\t\t\t\t\t\tvalue={ hours }\n\t\t\t\t\t\t\tstep={ 1 }\n\t\t\t\t\t\t\tmin={ is12Hour ? 1 : 0 }\n\t\t\t\t\t\t\tmax={ is12Hour ? 12 : 23 }\n\t\t\t\t\t\t\trequired\n\t\t\t\t\t\t\tspinControls=\"none\"\n\t\t\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\t\t\tisDragEnabled={ false }\n\t\t\t\t\t\t\tisShiftStepEnabled={ false }\n\t\t\t\t\t\t\tonChange={ buildNumberControlChangeCallback(\n\t\t\t\t\t\t\t\t'hours'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t__unstableStateReducer={ buildPadInputStateReducer(\n\t\t\t\t\t\t\t\t2\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<TimeSeparator\n\t\t\t\t\t\t\tclassName=\"components-datetime__time-separator\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t:\n\t\t\t\t\t\t</TimeSeparator>\n\t\t\t\t\t\t<MinutesInput\n\t\t\t\t\t\t\tclassName=\"components-datetime__time-field-minutes-input\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\tlabel={ __( 'Minutes' ) }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t__next36pxDefaultSize\n\t\t\t\t\t\t\tvalue={ minutes }\n\t\t\t\t\t\t\tstep={ 1 }\n\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\tmax={ 59 }\n\t\t\t\t\t\t\trequired\n\t\t\t\t\t\t\tspinControls=\"none\"\n\t\t\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\t\t\tisDragEnabled={ false }\n\t\t\t\t\t\t\tisShiftStepEnabled={ false }\n\t\t\t\t\t\t\tonChange={ buildNumberControlChangeCallback(\n\t\t\t\t\t\t\t\t'minutes'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t__unstableStateReducer={ buildPadInputStateReducer(\n\t\t\t\t\t\t\t\t2\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</TimeWrapper>\n\t\t\t\t\t{ is12Hour && (\n\t\t\t\t\t\t<ButtonGroup\n\t\t\t\t\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-am-pm\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tclassName=\"components-datetime__time-am-button\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\tam === 'AM' ? 'primary' : 'secondary'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonClick={ buildAmPmChangeCallback( 'AM' ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'AM' ) }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tclassName=\"components-datetime__time-pm-button\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\tam === 'PM' ? 'primary' : 'secondary'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonClick={ buildAmPmChangeCallback( 'PM' ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'PM' ) }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</ButtonGroup>\n\t\t\t\t\t) }\n\t\t\t\t\t<Spacer />\n\t\t\t\t\t<TimeZone />\n\t\t\t\t</HStack>\n\t\t\t</Fieldset>\n\t\t\t<Fieldset>\n\t\t\t\t<BaseControl.VisualLabel\n\t\t\t\t\tas=\"legend\"\n\t\t\t\t\tclassName=\"components-datetime__time-legend\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Date' ) }\n\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t<HStack\n\t\t\t\t\tclassName=\"components-datetime__time-wrapper\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t{ is12Hour ? (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{ monthField }\n\t\t\t\t\t\t\t{ dayField }\n\t\t\t\t\t\t</>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{ dayField }\n\t\t\t\t\t\t\t{ monthField }\n\t\t\t\t\t\t</>\n\t\t\t\t\t) }\n\t\t\t\t\t<YearInput\n\t\t\t\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-year\" // Unused, for backwards compatibility.\n\t\t\t\t\t\tlabel={ __( 'Year' ) }\n\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t__next36pxDefaultSize\n\t\t\t\t\t\tvalue={ year }\n\t\t\t\t\t\tstep={ 1 }\n\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\tmax={ 9999 }\n\t\t\t\t\t\trequired\n\t\t\t\t\t\tspinControls=\"none\"\n\t\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\t\tisDragEnabled={ false }\n\t\t\t\t\t\tisShiftStepEnabled={ false }\n\t\t\t\t\t\tonChange={ buildNumberControlChangeCallback( 'year' ) }\n\t\t\t\t\t\t__unstableStateReducer={ buildPadInputStateReducer(\n\t\t\t\t\t\t\t4\n\t\t\t\t\t\t) }\n\t\t\t\t\t/>\n\t\t\t\t</HStack>\n\t\t\t</Fieldset>\n\t\t</Wrapper>\n\t);\n}\n\nexport default TimePicker;\n"],"mappings":"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"}
1	+ {"version":3,"names":["_element","require","_dateFns","_i18n","_baseControl","_interopRequireDefault","_button","_buttonGroup","_timezone","_styles","_hStack","_spacer","_actions","_utils","_constants","from12hTo24h","hours","isPm","buildPadInputStateReducer","pad","state","action","nextState","type","COMMIT","PRESS_UP","PRESS_DOWN","value","undefined","toString","padStart","TimePicker","is12Hour","currentTime","onChange","date","setDate","useState","startOfMinute","inputToDate","Date","useEffect","day","month","year","minutes","am","useMemo","format","buildNumberControlChangeCallback","method","callback","event","_ownerDocument$defaul","HTMLInputElementInstance","target","ownerDocument","defaultView","HTMLInputElement","validity","valid","numberValue","Number","newDate","set","TIMEZONELESS_FORMAT","buildAmPmChangeCallback","parsedHours","parseInt","setHours","dayField","createElement","DayInput","className","label","__","hideLabelFromVision","__next36pxDefaultSize","step","min","max","required","spinControls","isPressEnterToChange","isDragEnabled","isShiftStepEnabled","monthField","MonthSelectWrapper","MonthSelect","__nextHasNoMarginBottom","options","setMonth","Wrapper","Fieldset","default","VisualLabel","as","HStack","TimeWrapper","HoursInput","__unstableStateReducer","TimeSeparator","MinutesInput","variant","onClick","Spacer","Fragment","YearInput","_default","exports"],"sources":["@wordpress/components/src/date-time/time/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport { startOfMinute, format, set, setHours, setMonth } from 'date-fns';\n\n/\n WordPress dependencies\n /\nimport { useState, useMemo, useEffect } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/\n Internal dependencies\n /\nimport BaseControl from '../../base-control';\nimport Button from '../../button';\nimport ButtonGroup from '../../button-group';\nimport TimeZone from './timezone';\nimport type { TimePickerProps } from '../types';\nimport {\n\tWrapper,\n\tFieldset,\n\tHoursInput,\n\tTimeSeparator,\n\tMinutesInput,\n\tMonthSelectWrapper,\n\tMonthSelect,\n\tDayInput,\n\tYearInput,\n\tTimeWrapper,\n} from './styles';\nimport { HStack } from '../../h-stack';\nimport { Spacer } from '../../spacer';\nimport type { InputChangeCallback } from '../../input-control/types';\nimport type { InputState } from '../../input-control/reducer/state';\nimport type { InputAction } from '../../input-control/reducer/actions';\nimport {\n\tCOMMIT,\n\tPRESS_DOWN,\n\tPRESS_UP,\n} from '../../input-control/reducer/actions';\nimport { inputToDate } from '../utils';\nimport { TIMEZONELESS_FORMAT } from '../constants';\n\nfunction from12hTo24h( hours: number, isPm: boolean ) {\n\treturn isPm ? ( ( hours % 12 ) + 12 ) % 24 : hours % 12;\n}\n\n/\n Creates an InputControl reducer used to pad an input so that it is always a\n * given width. For example, the hours and minutes inputs are padded to 2 so\n * that '4' appears as '04'.\n \n @param pad How many digits the value should be.\n /\nfunction buildPadInputStateReducer( pad: number ) {\n\treturn ( state: InputState, action: InputAction ) => {\n\t\tconst nextState = { ...state };\n\t\tif (\n\t\t\taction.type === COMMIT \|\|\n\t\t\taction.type === PRESS_UP \|\|\n\t\t\taction.type === PRESS_DOWN\n\t\t) {\n\t\t\tif ( nextState.value !== undefined ) {\n\t\t\t\tnextState.value = nextState.value\n\t\t\t\t\t.toString()\n\t\t\t\t\t.padStart( pad, '0' );\n\t\t\t}\n\t\t}\n\t\treturn nextState;\n\t};\n}\n\n/\n TimePicker is a React component that renders a clock for time selection.\n \n ```jsx\n * import { TimePicker } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n \n const MyTimePicker = () => {\n * const [ time, setTime ] = useState( new Date() );\n \n return (\n * <TimePicker\n * currentTime={ date }\n * onChange={ ( newTime ) => setTime( newTime ) }\n * is12Hour\n * />\n * );\n * };\n * ```\n */\nexport function TimePicker( {\n\tis12Hour,\n\tcurrentTime,\n\tonChange,\n}: TimePickerProps ) {\n\tconst [ date, setDate ] = useState( () =>\n\t\t// Truncate the date at the minutes, see: #15495.\n\t\tcurrentTime ? startOfMinute( inputToDate( currentTime ) ) : new Date()\n\t);\n\n\t// Reset the state when currentTime changed.\n\t// TODO: useEffect() shouldn't be used like this, causes an unnecessary render\n\tuseEffect( () => {\n\t\tsetDate(\n\t\t\tcurrentTime\n\t\t\t\t? startOfMinute( inputToDate( currentTime ) )\n\t\t\t\t: new Date()\n\t\t);\n\t}, [ currentTime ] );\n\n\tconst { day, month, year, minutes, hours, am } = useMemo(\n\t\t() => ( {\n\t\t\tday: format( date, 'dd' ),\n\t\t\tmonth: format( date, 'MM' ),\n\t\t\tyear: format( date, 'yyyy' ),\n\t\t\tminutes: format( date, 'mm' ),\n\t\t\thours: format( date, is12Hour ? 'hh' : 'HH' ),\n\t\t\tam: format( date, 'a' ),\n\t\t} ),\n\t\t[ date, is12Hour ]\n\t);\n\n\tconst buildNumberControlChangeCallback = (\n\t\tmethod: 'hours' \| 'minutes' \| 'date' \| 'year'\n\t) => {\n\t\tconst callback: InputChangeCallback = ( value, { event } ) => {\n\t\t\t// `instanceof` checks need to get the instance definition from the\n\t\t\t// corresponding window object — therefore, the following logic makes\n\t\t\t// the component work correctly even when rendered inside an iframe.\n\t\t\tconst HTMLInputElementInstance =\n\t\t\t\t( event.target as HTMLInputElement )?.ownerDocument.defaultView\n\t\t\t\t\t?.HTMLInputElement ?? HTMLInputElement;\n\n\t\t\tif ( ! ( event.target instanceof HTMLInputElementInstance ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( ! event.target.validity.valid ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// We can safely assume value is a number if target is valid.\n\t\t\tlet numberValue = Number( value );\n\n\t\t\t// If the 12-hour format is being used and the 'PM' period is\n\t\t\t// selected, then the incoming value (which ranges 1-12) should be\n\t\t\t// increased by 12 to match the expected 24-hour format.\n\t\t\tif ( method === 'hours' && is12Hour ) {\n\t\t\t\tnumberValue = from12hTo24h( numberValue, am === 'PM' );\n\t\t\t}\n\n\t\t\tconst newDate = set( date, { [ method ]: numberValue } );\n\t\t\tsetDate( newDate );\n\t\t\tonChange?.( format( newDate, TIMEZONELESS_FORMAT ) );\n\t\t};\n\t\treturn callback;\n\t};\n\n\tfunction buildAmPmChangeCallback( value: 'AM' \| 'PM' ) {\n\t\treturn () => {\n\t\t\tif ( am === value ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst parsedHours = parseInt( hours, 10 );\n\n\t\t\tconst newDate = setHours(\n\t\t\t\tdate,\n\t\t\t\tfrom12hTo24h( parsedHours, value === 'PM' )\n\t\t\t);\n\t\t\tsetDate( newDate );\n\t\t\tonChange?.( format( newDate, TIMEZONELESS_FORMAT ) );\n\t\t};\n\t}\n\n\tconst dayField = (\n\t\t<DayInput\n\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-day\" // Unused, for backwards compatibility.\n\t\t\tlabel={ __( 'Day' ) }\n\t\t\thideLabelFromVision\n\t\t\t__next36pxDefaultSize\n\t\t\tvalue={ day }\n\t\t\tstep={ 1 }\n\t\t\tmin={ 1 }\n\t\t\tmax={ 31 }\n\t\t\trequired\n\t\t\tspinControls=\"none\"\n\t\t\tisPressEnterToChange\n\t\t\tisDragEnabled={ false }\n\t\t\tisShiftStepEnabled={ false }\n\t\t\tonChange={ buildNumberControlChangeCallback( 'date' ) }\n\t\t/>\n\t);\n\n\tconst monthField = (\n\t\t<MonthSelectWrapper>\n\t\t\t<MonthSelect\n\t\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-month\" // Unused, for backwards compatibility.\n\t\t\t\tlabel={ __( 'Month' ) }\n\t\t\t\thideLabelFromVision\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\tvalue={ month }\n\t\t\t\toptions={ [\n\t\t\t\t\t{ value: '01', label: __( 'January' ) },\n\t\t\t\t\t{ value: '02', label: __( 'February' ) },\n\t\t\t\t\t{ value: '03', label: __( 'March' ) },\n\t\t\t\t\t{ value: '04', label: __( 'April' ) },\n\t\t\t\t\t{ value: '05', label: __( 'May' ) },\n\t\t\t\t\t{ value: '06', label: __( 'June' ) },\n\t\t\t\t\t{ value: '07', label: __( 'July' ) },\n\t\t\t\t\t{ value: '08', label: __( 'August' ) },\n\t\t\t\t\t{ value: '09', label: __( 'September' ) },\n\t\t\t\t\t{ value: '10', label: __( 'October' ) },\n\t\t\t\t\t{ value: '11', label: __( 'November' ) },\n\t\t\t\t\t{ value: '12', label: __( 'December' ) },\n\t\t\t\t] }\n\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\tconst newDate = setMonth( date, Number( value ) - 1 );\n\t\t\t\t\tsetDate( newDate );\n\t\t\t\t\tonChange?.( format( newDate, TIMEZONELESS_FORMAT ) );\n\t\t\t\t} }\n\t\t\t/>\n\t\t</MonthSelectWrapper>\n\t);\n\n\treturn (\n\t\t<Wrapper\n\t\t\tclassName=\"components-datetime__time\" // Unused, for backwards compatibility.\n\t\t>\n\t\t\t<Fieldset>\n\t\t\t\t<BaseControl.VisualLabel\n\t\t\t\t\tas=\"legend\"\n\t\t\t\t\tclassName=\"components-datetime__time-legend\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Time' ) }\n\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t<HStack\n\t\t\t\t\tclassName=\"components-datetime__time-wrapper\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t<TimeWrapper\n\t\t\t\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-time\" // Unused, for backwards compatibility.\n\t\t\t\t\t>\n\t\t\t\t\t\t<HoursInput\n\t\t\t\t\t\t\tclassName=\"components-datetime__time-field-hours-input\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\tlabel={ __( 'Hours' ) }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t__next36pxDefaultSize\n\t\t\t\t\t\t\tvalue={ hours }\n\t\t\t\t\t\t\tstep={ 1 }\n\t\t\t\t\t\t\tmin={ is12Hour ? 1 : 0 }\n\t\t\t\t\t\t\tmax={ is12Hour ? 12 : 23 }\n\t\t\t\t\t\t\trequired\n\t\t\t\t\t\t\tspinControls=\"none\"\n\t\t\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\t\t\tisDragEnabled={ false }\n\t\t\t\t\t\t\tisShiftStepEnabled={ false }\n\t\t\t\t\t\t\tonChange={ buildNumberControlChangeCallback(\n\t\t\t\t\t\t\t\t'hours'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t__unstableStateReducer={ buildPadInputStateReducer(\n\t\t\t\t\t\t\t\t2\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<TimeSeparator\n\t\t\t\t\t\t\tclassName=\"components-datetime__time-separator\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t:\n\t\t\t\t\t\t</TimeSeparator>\n\t\t\t\t\t\t<MinutesInput\n\t\t\t\t\t\t\tclassName=\"components-datetime__time-field-minutes-input\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\tlabel={ __( 'Minutes' ) }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t__next36pxDefaultSize\n\t\t\t\t\t\t\tvalue={ minutes }\n\t\t\t\t\t\t\tstep={ 1 }\n\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\tmax={ 59 }\n\t\t\t\t\t\t\trequired\n\t\t\t\t\t\t\tspinControls=\"none\"\n\t\t\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\t\t\tisDragEnabled={ false }\n\t\t\t\t\t\t\tisShiftStepEnabled={ false }\n\t\t\t\t\t\t\tonChange={ buildNumberControlChangeCallback(\n\t\t\t\t\t\t\t\t'minutes'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t__unstableStateReducer={ buildPadInputStateReducer(\n\t\t\t\t\t\t\t\t2\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</TimeWrapper>\n\t\t\t\t\t{ is12Hour && (\n\t\t\t\t\t\t<ButtonGroup\n\t\t\t\t\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-am-pm\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tclassName=\"components-datetime__time-am-button\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\tam === 'AM' ? 'primary' : 'secondary'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonClick={ buildAmPmChangeCallback( 'AM' ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'AM' ) }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tclassName=\"components-datetime__time-pm-button\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\tam === 'PM' ? 'primary' : 'secondary'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonClick={ buildAmPmChangeCallback( 'PM' ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'PM' ) }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</ButtonGroup>\n\t\t\t\t\t) }\n\t\t\t\t\t<Spacer />\n\t\t\t\t\t<TimeZone />\n\t\t\t\t</HStack>\n\t\t\t</Fieldset>\n\t\t\t<Fieldset>\n\t\t\t\t<BaseControl.VisualLabel\n\t\t\t\t\tas=\"legend\"\n\t\t\t\t\tclassName=\"components-datetime__time-legend\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Date' ) }\n\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t<HStack\n\t\t\t\t\tclassName=\"components-datetime__time-wrapper\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t{ is12Hour ? (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{ monthField }\n\t\t\t\t\t\t\t{ dayField }\n\t\t\t\t\t\t</>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{ dayField }\n\t\t\t\t\t\t\t{ monthField }\n\t\t\t\t\t\t</>\n\t\t\t\t\t) }\n\t\t\t\t\t<YearInput\n\t\t\t\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-year\" // Unused, for backwards compatibility.\n\t\t\t\t\t\tlabel={ __( 'Year' ) }\n\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t__next36pxDefaultSize\n\t\t\t\t\t\tvalue={ year }\n\t\t\t\t\t\tstep={ 1 }\n\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\tmax={ 9999 }\n\t\t\t\t\t\trequired\n\t\t\t\t\t\tspinControls=\"none\"\n\t\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\t\tisDragEnabled={ false }\n\t\t\t\t\t\tisShiftStepEnabled={ false }\n\t\t\t\t\t\tonChange={ buildNumberControlChangeCallback( 'year' ) }\n\t\t\t\t\t\t__unstableStateReducer={ buildPadInputStateReducer(\n\t\t\t\t\t\t\t4\n\t\t\t\t\t\t) }\n\t\t\t\t\t/>\n\t\t\t\t</HStack>\n\t\t\t</Fieldset>\n\t\t</Wrapper>\n\t);\n}\n\nexport default TimePicker;\n"],"mappings":"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"}

package/build/modal/index.js CHANGED Viewed

@@ -60,7 +60,16 @@ function UnforwardedModal(props, forwardedRef) {
   const ref = (0, _element.useRef)();
   const instanceId = (0, _compose.useInstanceId)(Modal);
   const headingId = title ? `components-modal-header-${instanceId}` : aria.labelledby;
-  const focusOnMountRef = (0, _compose.useFocusOnMount)(focusOnMount);
+  // The focus hook does not support 'firstContentElement' but this is a valid
+  // value for the Modal's focusOnMount prop. The following code ensures the focus
+  // hook will focus the first focusable node within the element to which it is applied.
+  // When `firstContentElement` is passed as the value of the focusOnMount prop,
+  // the focus hook is applied to the Modal's content element.
+  // Otherwise, the focus hook is applied to the Modal's ref. This ensures that the
+  // focus hook will focus the first element in the Modal's **content** when
+  // `firstContentElement` is passed.
+  const focusOnMountRef = (0, _compose.useFocusOnMount)(focusOnMount === 'firstContentElement' ? 'firstElement' : focusOnMount);
   const constrainedTabbingRef = (0, _compose.useConstrainedTabbing)();
   const focusReturnRef = (0, _compose.useFocusReturn)();
   const focusOutsideProps = (0, _compose.__experimentalUseFocusOutside)(onRequestClose);
@@ -175,7 +184,7 @@ function UnforwardedModal(props, forwardedRef) {
       'is-full-screen': isFullScreen
     }),
     style: style,
-    ref: (0, _compose.useMergeRefs)([constrainedTabbingRef, focusReturnRef, focusOnMountRef]),
+    ref: (0, _compose.useMergeRefs)([constrainedTabbingRef, focusReturnRef, focusOnMount !== 'firstContentElement' ? focusOnMountRef : null]),
     role: role,
     "aria-label": contentLabel,
     "aria-labelledby": contentLabel ? undefined : headingId,
@@ -209,7 +218,7 @@ function UnforwardedModal(props, forwardedRef) {
     icon: _icons.close,
     label: closeButtonLabel || (0, _i18n.__)('Close')
   })), (0, _element.createElement)("div", {
-    ref: childrenContainerRef
+    ref: (0, _compose.useMergeRefs)([childrenContainerRef, focusOnMount === 'firstContentElement' ? focusOnMountRef : null])
   }, children))))), document.body);
 }

package/build/modal/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_element","require","_classnames","_interopRequireDefault","_compose","_i18n","_icons","_dom","ariaHelper","_interopRequireWildcard","_button","_styleProvider","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","openModalCount","UnforwardedModal","props","forwardedRef","bodyOpenClassName","role","title","focusOnMount","shouldCloseOnEsc","shouldCloseOnClickOutside","isDismissible","aria","labelledby","undefined","describedby","onRequestClose","icon","closeButtonLabel","children","style","overlayClassName","className","contentLabel","onKeyDown","isFullScreen","headerActions","__experimentalHideHeader","ref","useRef","instanceId","useInstanceId","Modal","headingId","focusOnMountRef","useFocusOnMount","constrainedTabbingRef","useConstrainedTabbing","focusReturnRef","useFocusReturn","focusOutsideProps","useFocusOutside","contentRef","childrenContainerRef","hasScrolledContent","setHasScrolledContent","useState","hasScrollableContent","setHasScrollableContent","isContentScrollable","useCallback","current","closestScrollContainer","getScrollContainer","useEffect","hideApp","document","body","classList","add","remove","showApp","useLayoutEffect","window","ResizeObserver","resizeObserver","observe","disconnect","handleEscapeKeyDown","event","nativeEvent","isComposing","keyCode","code","defaultPrevented","preventDefault","onContentContainerScroll","e","_e$currentTarget$scro","scrollY","currentTarget","scrollTop","pressTarget","overlayPressHandlers","onPointerDown","isPrimary","target","onPointerUp","button","isSameTarget","createPortal","createElement","useMergeRefs","classnames","tabIndex","onScroll","__","id","onClick","close","label","forwardRef","exports","_default"],"sources":["@wordpress/components/src/modal/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\nimport type { ForwardedRef, KeyboardEvent, UIEvent } from 'react';\n\n/\n WordPress dependencies\n /\nimport {\n\tcreatePortal,\n\tuseCallback,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n\tforwardRef,\n\tuseLayoutEffect,\n} from '@wordpress/element';\nimport {\n\tuseInstanceId,\n\tuseFocusReturn,\n\tuseFocusOnMount,\n\t__experimentalUseFocusOutside as useFocusOutside,\n\tuseConstrainedTabbing,\n\tuseMergeRefs,\n} from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { close } from '@wordpress/icons';\nimport { getScrollContainer } from '@wordpress/dom';\n\n/\n Internal dependencies\n /\nimport as ariaHelper from './aria-helper';\nimport Button from '../button';\nimport StyleProvider from '../style-provider';\nimport type { ModalProps } from './types';\n\n// Used to count the number of open modals.\nlet openModalCount = 0;\n\nfunction UnforwardedModal(\n\tprops: ModalProps,\n\tforwardedRef: ForwardedRef< HTMLDivElement >\n) {\n\tconst {\n\t\tbodyOpenClassName = 'modal-open',\n\t\trole = 'dialog',\n\t\ttitle = null,\n\t\tfocusOnMount = true,\n\t\tshouldCloseOnEsc = true,\n\t\tshouldCloseOnClickOutside = true,\n\t\tisDismissible = true,\n\t\t/* Accessibility. /\n\t\taria = {\n\t\t\tlabelledby: undefined,\n\t\t\tdescribedby: undefined,\n\t\t},\n\t\tonRequestClose,\n\t\ticon,\n\t\tcloseButtonLabel,\n\t\tchildren,\n\t\tstyle,\n\t\toverlayClassName,\n\t\tclassName,\n\t\tcontentLabel,\n\t\tonKeyDown,\n\t\tisFullScreen = false,\n\t\theaderActions = null,\n\t\t__experimentalHideHeader = false,\n\t} = props;\n\n\tconst ref = useRef< HTMLDivElement >();\n\tconst instanceId = useInstanceId( Modal );\n\tconst headingId = title\n\t\t? `components-modal-header-${ instanceId }`\n\t\t: aria.labelledby;\n\tconst focusOnMountRef = useFocusOnMount( focusOnMount );\n\tconst constrainedTabbingRef = useConstrainedTabbing();\n\tconst focusReturnRef = useFocusReturn();\n\tconst focusOutsideProps = useFocusOutside( onRequestClose );\n\tconst contentRef = useRef< HTMLDivElement >( null );\n\tconst childrenContainerRef = useRef< HTMLDivElement >( null );\n\n\tconst [ hasScrolledContent, setHasScrolledContent ] = useState( false );\n\tconst [ hasScrollableContent, setHasScrollableContent ] = useState( false );\n\n\t// Determines whether the Modal content is scrollable and updates the state.\n\tconst isContentScrollable = useCallback( () => {\n\t\tif ( ! contentRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst closestScrollContainer = getScrollContainer( contentRef.current );\n\n\t\tif ( contentRef.current === closestScrollContainer ) {\n\t\t\tsetHasScrollableContent( true );\n\t\t} else {\n\t\t\tsetHasScrollableContent( false );\n\t\t}\n\t}, [ contentRef ] );\n\n\tuseEffect( () => {\n\t\topenModalCount++;\n\n\t\tif ( openModalCount === 1 ) {\n\t\t\tariaHelper.hideApp( ref.current );\n\t\t\tdocument.body.classList.add( bodyOpenClassName );\n\t\t}\n\n\t\treturn () => {\n\t\t\topenModalCount--;\n\n\t\t\tif ( openModalCount === 0 ) {\n\t\t\t\tdocument.body.classList.remove( bodyOpenClassName );\n\t\t\t\tariaHelper.showApp();\n\t\t\t}\n\t\t};\n\t}, [ bodyOpenClassName ] );\n\n\t// Calls the isContentScrollable callback when the Modal children container resizes.\n\tuseLayoutEffect( () => {\n\t\tif ( ! window.ResizeObserver \|\| ! childrenContainerRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst resizeObserver = new ResizeObserver( isContentScrollable );\n\t\tresizeObserver.observe( childrenContainerRef.current );\n\n\t\tisContentScrollable();\n\n\t\treturn () => {\n\t\t\tresizeObserver.disconnect();\n\t\t};\n\t}, [ isContentScrollable, childrenContainerRef ] );\n\n\tfunction handleEscapeKeyDown( event: KeyboardEvent< HTMLDivElement > ) {\n\t\tif (\n\t\t\t// Ignore keydowns from IMEs\n\t\t\tevent.nativeEvent.isComposing \|\|\n\t\t\t// Workaround for Mac Safari where the final Enter/Backspace of an IME composition\n\t\t\t// is `isComposing=false`, even though it's technically still part of the composition.\n\t\t\t// These can only be detected by keyCode.\n\t\t\tevent.keyCode === 229\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (\n\t\t\tshouldCloseOnEsc &&\n\t\t\tevent.code === 'Escape' &&\n\t\t\t! event.defaultPrevented\n\t\t) {\n\t\t\tevent.preventDefault();\n\t\t\tif ( onRequestClose ) {\n\t\t\t\tonRequestClose( event );\n\t\t\t}\n\t\t}\n\t}\n\n\tconst onContentContainerScroll = useCallback(\n\t\t( e: UIEvent< HTMLDivElement > ) => {\n\t\t\tconst scrollY = e?.currentTarget?.scrollTop ?? -1;\n\n\t\t\tif ( ! hasScrolledContent && scrollY > 0 ) {\n\t\t\t\tsetHasScrolledContent( true );\n\t\t\t} else if ( hasScrolledContent && scrollY <= 0 ) {\n\t\t\t\tsetHasScrolledContent( false );\n\t\t\t}\n\t\t},\n\t\t[ hasScrolledContent ]\n\t);\n\n\tlet pressTarget: EventTarget \| null = null;\n\tconst overlayPressHandlers: {\n\t\tonPointerDown: React.PointerEventHandler< HTMLDivElement >;\n\t\tonPointerUp: React.PointerEventHandler< HTMLDivElement >;\n\t} = {\n\t\tonPointerDown: ( event ) => {\n\t\t\tif ( event.isPrimary && event.target === event.currentTarget ) {\n\t\t\t\tpressTarget = event.target;\n\t\t\t\t// Avoids loss of focus yet also leaves `useFocusOutside`\n\t\t\t\t// practically useless with its only potential trigger being\n\t\t\t\t// programmatic focus movement. TODO opt for either removing\n\t\t\t\t// the hook or enhancing it such that this isn't needed.\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t},\n\t\t// Closes the modal with two exceptions. 1. Opening the context menu on\n\t\t// the overlay. 2. Pressing on the overlay then dragging the pointer\n\t\t// over the modal and releasing. Due to the modal being a child of the\n\t\t// overlay, such a gesture is a `click` on the overlay and cannot be\n\t\t// excepted by a `click` handler. Thus the tactic of handling\n\t\t// `pointerup` and comparing its target to that of the `pointerdown`.\n\t\tonPointerUp: ( { target, button } ) => {\n\t\t\tconst isSameTarget = target === pressTarget;\n\t\t\tpressTarget = null;\n\t\t\tif ( button === 0 && isSameTarget ) onRequestClose();\n\t\t},\n\t};\n\n\treturn createPortal(\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<div\n\t\t\tref={ useMergeRefs( [ ref, forwardedRef ] ) }\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-modal__screen-overlay',\n\t\t\t\toverlayClassName\n\t\t\t) }\n\t\t\tonKeyDown={ handleEscapeKeyDown }\n\t\t\t{ ...( shouldCloseOnClickOutside ? overlayPressHandlers : {} ) }\n\t\t>\n\t\t\t<StyleProvider document={ document }>\n\t\t\t\t<div\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'components-modal__frame',\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'is-full-screen': isFullScreen,\n\t\t\t\t\t\t}\n\t\t\t\t\t) }\n\t\t\t\t\tstyle={ style }\n\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\tconstrainedTabbingRef,\n\t\t\t\t\t\tfocusReturnRef,\n\t\t\t\t\t\tfocusOnMountRef,\n\t\t\t\t\t] ) }\n\t\t\t\t\trole={ role }\n\t\t\t\t\taria-label={ contentLabel }\n\t\t\t\t\taria-labelledby={ contentLabel ? undefined : headingId }\n\t\t\t\t\taria-describedby={ aria.describedby }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\t{ ...( shouldCloseOnClickOutside\n\t\t\t\t\t\t? focusOutsideProps\n\t\t\t\t\t\t: {} ) }\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ classnames( 'components-modal__content', {\n\t\t\t\t\t\t\t'hide-header': __experimentalHideHeader,\n\t\t\t\t\t\t\t'is-scrollable': hasScrollableContent,\n\t\t\t\t\t\t\t'has-scrolled-content': hasScrolledContent,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\trole=\"document\"\n\t\t\t\t\t\tonScroll={ onContentContainerScroll }\n\t\t\t\t\t\tref={ contentRef }\n\t\t\t\t\t\taria-label={\n\t\t\t\t\t\t\thasScrollableContent\n\t\t\t\t\t\t\t\t? __( 'Scrollable section' )\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\ttabIndex={ hasScrollableContent ? 0 : undefined }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ ! __experimentalHideHeader && (\n\t\t\t\t\t\t\t<div className=\"components-modal__header\">\n\t\t\t\t\t\t\t\t<div className=\"components-modal__header-heading-container\">\n\t\t\t\t\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__icon-container\"\n\t\t\t\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ icon }\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t{ title && (\n\t\t\t\t\t\t\t\t\t\t<h1\n\t\t\t\t\t\t\t\t\t\t\tid={ headingId }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__header-heading\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t\t\t\t</h1>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t{ headerActions }\n\t\t\t\t\t\t\t\t{ isDismissible && (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tonClick={ onRequestClose }\n\t\t\t\t\t\t\t\t\t\ticon={ close }\n\t\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\t\tcloseButtonLabel \|\| __( 'Close' )\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t<div ref={ childrenContainerRef }>{ children }</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</StyleProvider>\n\t\t</div>,\n\t\tdocument.body\n\t);\n}\n\n/\n Modals give users information and choices related to a task they’re trying to\n * accomplish. They can contain critical information, require decisions, or\n * involve multiple tasks.\n \n ```jsx\n * import { Button, Modal } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n \n const MyModal = () => {\n * const [ isOpen, setOpen ] = useState( false );\n * const openModal = () => setOpen( true );\n * const closeModal = () => setOpen( false );\n \n return (\n * <>\n * <Button variant=\"secondary\" onClick={ openModal }>\n * Open Modal\n * </Button>\n * { isOpen && (\n * <Modal title=\"This is my modal\" onRequestClose={ closeModal }>\n * <Button variant=\"secondary\" onClick={ closeModal }>\n * My custom close button\n * </Button>\n * </Modal>\n * ) }\n * </>\n * );\n * };\n * ```\n */\nexport const Modal = forwardRef( UnforwardedModal );\n\nexport default Modal;\n"],"mappings":";;;;;;;AASA,IAAAA,QAAA,GAAAC,OAAA;AANA,IAAAC,WAAA,GAAAC,sBAAA,CAAAF,OAAA;AAeA,IAAAG,QAAA,GAAAH,OAAA;AAQA,IAAAI,KAAA,GAAAJ,OAAA;AACA,IAAAK,MAAA,GAAAL,OAAA;AACA,IAAAM,IAAA,GAAAN,OAAA;AAKA,IAAAO,UAAA,GAAAC,uBAAA,CAAAR,OAAA;AACA,IAAAS,OAAA,GAAAP,sBAAA,CAAAF,OAAA;AACA,IAAAU,cAAA,GAAAR,sBAAA,CAAAF,OAAA;AAA8C,SAAAW,yBAAAC,WAAA,eAAAC,OAAA,kCAAAC,iBAAA,OAAAD,OAAA,QAAAE,gBAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,WAAA,WAAAA,WAAA,GAAAG,gBAAA,GAAAD,iBAAA,KAAAF,WAAA;AAAA,SAAAJ,wBAAAQ,GAAA,EAAAJ,WAAA,SAAAA,WAAA,IAAAI,GAAA,IAAAA,GAAA,CAAAC,UAAA,WAAAD,GAAA,QAAAA,GAAA,oBAAAA,GAAA,wBAAAA,GAAA,4BAAAE,OAAA,EAAAF,GAAA,UAAAG,KAAA,GAAAR,wBAAA,CAAAC,WAAA,OAAAO,KAAA,IAAAA,KAAA,CAAAC,GAAA,CAAAJ,GAAA,YAAAG,KAAA,CAAAE,GAAA,CAAAL,GAAA,SAAAM,MAAA,WAAAC,qBAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,GAAA,IAAAX,GAAA,QAAAW,GAAA,kBAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAd,GAAA,EAAAW,GAAA,SAAAI,IAAA,GAAAR,qBAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAV,GAAA,EAAAW,GAAA,cAAAI,IAAA,KAAAA,IAAA,CAAAV,GAAA,IAAAU,IAAA,CAAAC,GAAA,KAAAR,MAAA,CAAAC,cAAA,CAAAH,MAAA,EAAAK,GAAA,EAAAI,IAAA,YAAAT,MAAA,CAAAK,GAAA,IAAAX,GAAA,CAAAW,GAAA,SAAAL,MAAA,CAAAJ,OAAA,GAAAF,GAAA,MAAAG,KAAA,IAAAA,KAAA,CAAAa,GAAA,CAAAhB,GAAA,EAAAM,MAAA,YAAAA,MAAA;AAnC9C;AACA;AACA;;AAIA;AACA;AACA;;AAsBA;AACA;AACA;;AAMA;AACA,IAAIW,cAAc,GAAG,CAAC;AAEtB,SAASC,gBAAgBA,CACxBC,KAAiB,EACjBC,YAA4C,EAC3C;EACD,MAAM;IACLC,iBAAiB,GAAG,YAAY;IAChCC,IAAI,GAAG,QAAQ;IACfC,KAAK,GAAG,IAAI;IACZC,YAAY,GAAG,IAAI;IACnBC,gBAAgB,GAAG,IAAI;IACvBC,yBAAyB,GAAG,IAAI;IAChCC,aAAa,GAAG,IAAI;IACpB;IACAC,IAAI,GAAG;MACNC,UAAU,EAAEC,SAAS;MACrBC,WAAW,EAAED;IACd,CAAC;IACDE,cAAc;IACdC,IAAI;IACJC,gBAAgB;IAChBC,QAAQ;IACRC,KAAK;IACLC,gBAAgB;IAChBC,SAAS;IACTC,YAAY;IACZC,SAAS;IACTC,YAAY,GAAG,KAAK;IACpBC,aAAa,GAAG,IAAI;IACpBC,wBAAwB,GAAG;EAC5B,CAAC,GAAGxB,KAAK;EAET,MAAMyB,GAAG,GAAG,IAAAC,eAAM,EAAmB,CAAC;EACtC,MAAMC,UAAU,GAAG,IAAAC,sBAAa,EAAEC,KAAM,CAAC;EACzC,MAAMC,SAAS,GAAG1B,KAAK,GACnB,2BAA2BuB,UAAY,EAAC,GACzClB,IAAI,CAACC,UAAU;EAClB,MAAMqB,eAAe,GAAG,IAAAC,wBAAe,EAAE3B,YAAa,CAAC;EACvD,MAAM4B,qBAAqB,GAAG,IAAAC,8BAAqB,EAAC,CAAC;EACrD,MAAMC,cAAc,GAAG,IAAAC,uBAAc,EAAC,CAAC;EACvC,MAAMC,iBAAiB,GAAG,IAAAC,sCAAe,EAAEzB,cAAe,CAAC;EAC3D,MAAM0B,UAAU,GAAG,IAAAb,eAAM,EAAoB,IAAK,CAAC;EACnD,MAAMc,oBAAoB,GAAG,IAAAd,eAAM,EAAoB,IAAK,CAAC;EAE7D,MAAM,CAAEe,kBAAkB,EAAEC,qBAAqB,CAAE,GAAG,IAAAC,iBAAQ,EAAE,KAAM,CAAC;EACvE,MAAM,CAAEC,oBAAoB,EAAEC,uBAAuB,CAAE,GAAG,IAAAF,iBAAQ,EAAE,KAAM,CAAC;;EAE3E;EACA,MAAMG,mBAAmB,GAAG,IAAAC,oBAAW,EAAE,MAAM;IAC9C,IAAK,CAAER,UAAU,CAACS,OAAO,EAAG;MAC3B;IACD;IAEA,MAAMC,sBAAsB,GAAG,IAAAC,uBAAkB,EAAEX,UAAU,CAACS,OAAQ,CAAC;IAEvE,IAAKT,UAAU,CAACS,OAAO,KAAKC,sBAAsB,EAAG;MACpDJ,uBAAuB,CAAE,IAAK,CAAC;IAChC,CAAC,MAAM;MACNA,uBAAuB,CAAE,KAAM,CAAC;IACjC;EACD,CAAC,EAAE,CAAEN,UAAU,CAAG,CAAC;EAEnB,IAAAY,kBAAS,EAAE,MAAM;IAChBrD,cAAc,EAAE;IAEhB,IAAKA,cAAc,KAAK,CAAC,EAAG;MAC3B1B,UAAU,CAACgF,OAAO,CAAE3B,GAAG,CAACuB,OAAQ,CAAC;MACjCK,QAAQ,CAACC,IAAI,CAACC,SAAS,CAACC,GAAG,CAAEtD,iBAAkB,CAAC;IACjD;IAEA,OAAO,MAAM;MACZJ,cAAc,EAAE;MAEhB,IAAKA,cAAc,KAAK,CAAC,EAAG;QAC3BuD,QAAQ,CAACC,IAAI,CAACC,SAAS,CAACE,MAAM,CAAEvD,iBAAkB,CAAC;QACnD9B,UAAU,CAACsF,OAAO,CAAC,CAAC;MACrB;IACD,CAAC;EACF,CAAC,EAAE,CAAExD,iBAAiB,CAAG,CAAC;;EAE1B;EACA,IAAAyD,wBAAe,EAAE,MAAM;IACtB,IAAK,CAAEC,MAAM,CAACC,cAAc,IAAI,CAAErB,oBAAoB,CAACQ,OAAO,EAAG;MAChE;IACD;IAEA,MAAMc,cAAc,GAAG,IAAID,cAAc,CAAEf,mBAAoB,CAAC;IAChEgB,cAAc,CAACC,OAAO,CAAEvB,oBAAoB,CAACQ,OAAQ,CAAC;IAEtDF,mBAAmB,CAAC,CAAC;IAErB,OAAO,MAAM;MACZgB,cAAc,CAACE,UAAU,CAAC,CAAC;IAC5B,CAAC;EACF,CAAC,EAAE,CAAElB,mBAAmB,EAAEN,oBAAoB,CAAG,CAAC;EAElD,SAASyB,mBAAmBA,CAAEC,KAAsC,EAAG;IACtE;IACC;IACAA,KAAK,CAACC,WAAW,CAACC,WAAW;IAC7B;IACA;IACA;IACAF,KAAK,CAACG,OAAO,KAAK,GAAG,EACpB;MACD;IACD;IAEA,IACC/D,gBAAgB,IAChB4D,KAAK,CAACI,IAAI,KAAK,QAAQ,IACvB,CAAEJ,KAAK,CAACK,gBAAgB,EACvB;MACDL,KAAK,CAACM,cAAc,CAAC,CAAC;MACtB,IAAK3D,cAAc,EAAG;QACrBA,cAAc,CAAEqD,KAAM,CAAC;MACxB;IACD;EACD;EAEA,MAAMO,wBAAwB,GAAG,IAAA1B,oBAAW,EACzC2B,CAA4B,IAAM;IAAA,IAAAC,qBAAA;IACnC,MAAMC,OAAO,IAAAD,qBAAA,GAAGD,CAAC,EAAEG,aAAa,EAAEC,SAAS,cAAAH,qBAAA,cAAAA,qBAAA,GAAI,CAAC,CAAC;IAEjD,IAAK,CAAElC,kBAAkB,IAAImC,OAAO,GAAG,CAAC,EAAG;MAC1ClC,qBAAqB,CAAE,IAAK,CAAC;IAC9B,CAAC,MAAM,IAAKD,kBAAkB,IAAImC,OAAO,IAAI,CAAC,EAAG;MAChDlC,qBAAqB,CAAE,KAAM,CAAC;IAC/B;EACD,CAAC,EACD,CAAED,kBAAkB,CACrB,CAAC;EAED,IAAIsC,WAA+B,GAAG,IAAI;EAC1C,MAAMC,oBAGL,GAAG;IACHC,aAAa,EAAIf,KAAK,IAAM;MAC3B,IAAKA,KAAK,CAACgB,SAAS,IAAIhB,KAAK,CAACiB,MAAM,KAAKjB,KAAK,CAACW,aAAa,EAAG;QAC9DE,WAAW,GAAGb,KAAK,CAACiB,MAAM;QAC1B;QACA;QACA;QACA;QACAjB,KAAK,CAACM,cAAc,CAAC,CAAC;MACvB;IACD,CAAC;IACD;IACA;IACA;IACA;IACA;IACA;IACAY,WAAW,EAAEA,CAAE;MAAED,MAAM;MAAEE;IAAO,CAAC,KAAM;MACtC,MAAMC,YAAY,GAAGH,MAAM,KAAKJ,WAAW;MAC3CA,WAAW,GAAG,IAAI;MAClB,IAAKM,MAAM,KAAK,CAAC,IAAIC,YAAY,EAAGzE,cAAc,CAAC,CAAC;IACrD;EACD,CAAC;EAED,OAAO,IAAA0E,qBAAY;EAClB;EACA,IAAA3H,QAAA,CAAA4H,aAAA;IACC/D,GAAG,EAAG,IAAAgE,qBAAY,EAAE,CAAEhE,GAAG,EAAExB,YAAY,CAAG,CAAG;IAC7CkB,SAAS,EAAG,IAAAuE,mBAAU,EACrB,kCAAkC,EAClCxE,gBACD,CAAG;IACHG,SAAS,EAAG4C,mBAAqB;IAAA,IAC1B1D,yBAAyB,GAAGyE,oBAAoB,GAAG,CAAC,CAAC;EAAA,GAE5D,IAAApH,QAAA,CAAA4H,aAAA,EAACjH,cAAA,CAAAQ,OAAa;IAACsE,QAAQ,EAAGA;EAAU,GACnC,IAAAzF,QAAA,CAAA4H,aAAA;IACCrE,SAAS,EAAG,IAAAuE,mBAAU,EACrB,yBAAyB,EACzBvE,SAAS,EACT;MACC,gBAAgB,EAAEG;IACnB,CACD,CAAG;IACHL,KAAK,EAAGA,KAAO;IACfQ,GAAG,EAAG,IAAAgE,qBAAY,EAAE,CACnBxD,qBAAqB,EACrBE,cAAc,EACdJ,eAAe,CACd,CAAG;IACL5B,IAAI,EAAGA,IAAM;IACb,cAAaiB,YAAc;IAC3B,mBAAkBA,YAAY,GAAGT,SAAS,GAAGmB,SAAW;IACxD,oBAAmBrB,IAAI,CAACG,WAAa;IACrC+E,QAAQ,EAAG,CAAC,CAAG;IAAA,IACRpF,yBAAyB,GAC7B8B,iBAAiB,GACjB,CAAC,CAAC;IACLhB,SAAS,EAAGA;EAAW,GAEvB,IAAAzD,QAAA,CAAA4H,aAAA;IACCrE,SAAS,EAAG,IAAAuE,mBAAU,EAAE,2BAA2B,EAAE;MACpD,aAAa,EAAElE,wBAAwB;MACvC,eAAe,EAAEoB,oBAAoB;MACrC,sBAAsB,EAAEH;IACzB,CAAE,CAAG;IACLtC,IAAI,EAAC,UAAU;IACfyF,QAAQ,EAAGnB,wBAA0B;IACrChD,GAAG,EAAGc,UAAY;IAClB,cACCK,oBAAoB,GACjB,IAAAiD,QAAE,EAAE,oBAAqB,CAAC,GAC1BlF,SACH;IACDgF,QAAQ,EAAG/C,oBAAoB,GAAG,CAAC,GAAGjC;EAAW,GAE/C,CAAEa,wBAAwB,IAC3B,IAAA5D,QAAA,CAAA4H,aAAA;IAAKrE,SAAS,EAAC;EAA0B,GACxC,IAAAvD,QAAA,CAAA4H,aAAA;IAAKrE,SAAS,EAAC;EAA4C,GACxDL,IAAI,IACL,IAAAlD,QAAA,CAAA4H,aAAA;IACCrE,SAAS,EAAC,kCAAkC;IAC5C;EAAW,GAETL,IACG,CACN,EACCV,KAAK,IACN,IAAAxC,QAAA,CAAA4H,aAAA;IACCM,EAAE,EAAGhE,SAAW;IAChBX,SAAS,EAAC;EAAkC,GAE1Cf,KACC,CAED,CAAC,EACJmB,aAAa,EACbf,aAAa,IACd,IAAA5C,QAAA,CAAA4H,aAAA,EAAClH,OAAA,CAAAS,OAAM;IACNgH,OAAO,EAAGlF,cAAgB;IAC1BC,IAAI,EAAGkF,YAAO;IACdC,KAAK,EACJlF,gBAAgB,IAAI,IAAA8E,QAAE,EAAE,OAAQ;EAChC,CACD,CAEE,CACL,EACD,IAAAjI,QAAA,CAAA4H,aAAA;IAAK/D,GAAG,EAAGe;EAAsB,GAAGxB,QAAe,CAC/C,CACD,CACS,CACX,CAAC,EACNqC,QAAQ,CAACC,IACV,CAAC;AACF;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMzB,KAAK,GAAG,IAAAqE,mBAAU,EAAEnG,gBAAiB,CAAC;AAACoG,OAAA,CAAAtE,KAAA,GAAAA,KAAA;AAAA,IAAAuE,QAAA,GAErCvE,KAAK;AAAAsE,OAAA,CAAApH,OAAA,GAAAqH,QAAA"}
1	+ {"version":3,"names":["_element","require","_classnames","_interopRequireDefault","_compose","_i18n","_icons","_dom","ariaHelper","_interopRequireWildcard","_button","_styleProvider","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","openModalCount","UnforwardedModal","props","forwardedRef","bodyOpenClassName","role","title","focusOnMount","shouldCloseOnEsc","shouldCloseOnClickOutside","isDismissible","aria","labelledby","undefined","describedby","onRequestClose","icon","closeButtonLabel","children","style","overlayClassName","className","contentLabel","onKeyDown","isFullScreen","headerActions","__experimentalHideHeader","ref","useRef","instanceId","useInstanceId","Modal","headingId","focusOnMountRef","useFocusOnMount","constrainedTabbingRef","useConstrainedTabbing","focusReturnRef","useFocusReturn","focusOutsideProps","useFocusOutside","contentRef","childrenContainerRef","hasScrolledContent","setHasScrolledContent","useState","hasScrollableContent","setHasScrollableContent","isContentScrollable","useCallback","current","closestScrollContainer","getScrollContainer","useEffect","hideApp","document","body","classList","add","remove","showApp","useLayoutEffect","window","ResizeObserver","resizeObserver","observe","disconnect","handleEscapeKeyDown","event","nativeEvent","isComposing","keyCode","code","defaultPrevented","preventDefault","onContentContainerScroll","e","_e$currentTarget$scro","scrollY","currentTarget","scrollTop","pressTarget","overlayPressHandlers","onPointerDown","isPrimary","target","onPointerUp","button","isSameTarget","createPortal","createElement","useMergeRefs","classnames","tabIndex","onScroll","__","id","onClick","close","label","forwardRef","exports","_default"],"sources":["@wordpress/components/src/modal/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\nimport type { ForwardedRef, KeyboardEvent, UIEvent } from 'react';\n\n/\n WordPress dependencies\n /\nimport {\n\tcreatePortal,\n\tuseCallback,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n\tforwardRef,\n\tuseLayoutEffect,\n} from '@wordpress/element';\nimport {\n\tuseInstanceId,\n\tuseFocusReturn,\n\tuseFocusOnMount,\n\t__experimentalUseFocusOutside as useFocusOutside,\n\tuseConstrainedTabbing,\n\tuseMergeRefs,\n} from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { close } from '@wordpress/icons';\nimport { getScrollContainer } from '@wordpress/dom';\n\n/\n Internal dependencies\n /\nimport as ariaHelper from './aria-helper';\nimport Button from '../button';\nimport StyleProvider from '../style-provider';\nimport type { ModalProps } from './types';\n\n// Used to count the number of open modals.\nlet openModalCount = 0;\n\nfunction UnforwardedModal(\n\tprops: ModalProps,\n\tforwardedRef: ForwardedRef< HTMLDivElement >\n) {\n\tconst {\n\t\tbodyOpenClassName = 'modal-open',\n\t\trole = 'dialog',\n\t\ttitle = null,\n\t\tfocusOnMount = true,\n\t\tshouldCloseOnEsc = true,\n\t\tshouldCloseOnClickOutside = true,\n\t\tisDismissible = true,\n\t\t/* Accessibility. /\n\t\taria = {\n\t\t\tlabelledby: undefined,\n\t\t\tdescribedby: undefined,\n\t\t},\n\t\tonRequestClose,\n\t\ticon,\n\t\tcloseButtonLabel,\n\t\tchildren,\n\t\tstyle,\n\t\toverlayClassName,\n\t\tclassName,\n\t\tcontentLabel,\n\t\tonKeyDown,\n\t\tisFullScreen = false,\n\t\theaderActions = null,\n\t\t__experimentalHideHeader = false,\n\t} = props;\n\n\tconst ref = useRef< HTMLDivElement >();\n\n\tconst instanceId = useInstanceId( Modal );\n\tconst headingId = title\n\t\t? `components-modal-header-${ instanceId }`\n\t\t: aria.labelledby;\n\n\t// The focus hook does not support 'firstContentElement' but this is a valid\n\t// value for the Modal's focusOnMount prop. The following code ensures the focus\n\t// hook will focus the first focusable node within the element to which it is applied.\n\t// When `firstContentElement` is passed as the value of the focusOnMount prop,\n\t// the focus hook is applied to the Modal's content element.\n\t// Otherwise, the focus hook is applied to the Modal's ref. This ensures that the\n\t// focus hook will focus the first element in the Modal's content* when\n\t// `firstContentElement` is passed.\n\tconst focusOnMountRef = useFocusOnMount(\n\t\tfocusOnMount === 'firstContentElement' ? 'firstElement' : focusOnMount\n\t);\n\tconst constrainedTabbingRef = useConstrainedTabbing();\n\tconst focusReturnRef = useFocusReturn();\n\tconst focusOutsideProps = useFocusOutside( onRequestClose );\n\tconst contentRef = useRef< HTMLDivElement >( null );\n\tconst childrenContainerRef = useRef< HTMLDivElement >( null );\n\n\tconst [ hasScrolledContent, setHasScrolledContent ] = useState( false );\n\tconst [ hasScrollableContent, setHasScrollableContent ] = useState( false );\n\n\t// Determines whether the Modal content is scrollable and updates the state.\n\tconst isContentScrollable = useCallback( () => {\n\t\tif ( ! contentRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst closestScrollContainer = getScrollContainer( contentRef.current );\n\n\t\tif ( contentRef.current === closestScrollContainer ) {\n\t\t\tsetHasScrollableContent( true );\n\t\t} else {\n\t\t\tsetHasScrollableContent( false );\n\t\t}\n\t}, [ contentRef ] );\n\n\tuseEffect( () => {\n\t\topenModalCount++;\n\n\t\tif ( openModalCount === 1 ) {\n\t\t\tariaHelper.hideApp( ref.current );\n\t\t\tdocument.body.classList.add( bodyOpenClassName );\n\t\t}\n\n\t\treturn () => {\n\t\t\topenModalCount--;\n\n\t\t\tif ( openModalCount === 0 ) {\n\t\t\t\tdocument.body.classList.remove( bodyOpenClassName );\n\t\t\t\tariaHelper.showApp();\n\t\t\t}\n\t\t};\n\t}, [ bodyOpenClassName ] );\n\n\t// Calls the isContentScrollable callback when the Modal children container resizes.\n\tuseLayoutEffect( () => {\n\t\tif ( ! window.ResizeObserver \|\| ! childrenContainerRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst resizeObserver = new ResizeObserver( isContentScrollable );\n\t\tresizeObserver.observe( childrenContainerRef.current );\n\n\t\tisContentScrollable();\n\n\t\treturn () => {\n\t\t\tresizeObserver.disconnect();\n\t\t};\n\t}, [ isContentScrollable, childrenContainerRef ] );\n\n\tfunction handleEscapeKeyDown( event: KeyboardEvent< HTMLDivElement > ) {\n\t\tif (\n\t\t\t// Ignore keydowns from IMEs\n\t\t\tevent.nativeEvent.isComposing \|\|\n\t\t\t// Workaround for Mac Safari where the final Enter/Backspace of an IME composition\n\t\t\t// is `isComposing=false`, even though it's technically still part of the composition.\n\t\t\t// These can only be detected by keyCode.\n\t\t\tevent.keyCode === 229\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (\n\t\t\tshouldCloseOnEsc &&\n\t\t\tevent.code === 'Escape' &&\n\t\t\t! event.defaultPrevented\n\t\t) {\n\t\t\tevent.preventDefault();\n\t\t\tif ( onRequestClose ) {\n\t\t\t\tonRequestClose( event );\n\t\t\t}\n\t\t}\n\t}\n\n\tconst onContentContainerScroll = useCallback(\n\t\t( e: UIEvent< HTMLDivElement > ) => {\n\t\t\tconst scrollY = e?.currentTarget?.scrollTop ?? -1;\n\n\t\t\tif ( ! hasScrolledContent && scrollY > 0 ) {\n\t\t\t\tsetHasScrolledContent( true );\n\t\t\t} else if ( hasScrolledContent && scrollY <= 0 ) {\n\t\t\t\tsetHasScrolledContent( false );\n\t\t\t}\n\t\t},\n\t\t[ hasScrolledContent ]\n\t);\n\n\tlet pressTarget: EventTarget \| null = null;\n\tconst overlayPressHandlers: {\n\t\tonPointerDown: React.PointerEventHandler< HTMLDivElement >;\n\t\tonPointerUp: React.PointerEventHandler< HTMLDivElement >;\n\t} = {\n\t\tonPointerDown: ( event ) => {\n\t\t\tif ( event.isPrimary && event.target === event.currentTarget ) {\n\t\t\t\tpressTarget = event.target;\n\t\t\t\t// Avoids loss of focus yet also leaves `useFocusOutside`\n\t\t\t\t// practically useless with its only potential trigger being\n\t\t\t\t// programmatic focus movement. TODO opt for either removing\n\t\t\t\t// the hook or enhancing it such that this isn't needed.\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t},\n\t\t// Closes the modal with two exceptions. 1. Opening the context menu on\n\t\t// the overlay. 2. Pressing on the overlay then dragging the pointer\n\t\t// over the modal and releasing. Due to the modal being a child of the\n\t\t// overlay, such a gesture is a `click` on the overlay and cannot be\n\t\t// excepted by a `click` handler. Thus the tactic of handling\n\t\t// `pointerup` and comparing its target to that of the `pointerdown`.\n\t\tonPointerUp: ( { target, button } ) => {\n\t\t\tconst isSameTarget = target === pressTarget;\n\t\t\tpressTarget = null;\n\t\t\tif ( button === 0 && isSameTarget ) onRequestClose();\n\t\t},\n\t};\n\n\treturn createPortal(\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<div\n\t\t\tref={ useMergeRefs( [ ref, forwardedRef ] ) }\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-modal__screen-overlay',\n\t\t\t\toverlayClassName\n\t\t\t) }\n\t\t\tonKeyDown={ handleEscapeKeyDown }\n\t\t\t{ ...( shouldCloseOnClickOutside ? overlayPressHandlers : {} ) }\n\t\t>\n\t\t\t<StyleProvider document={ document }>\n\t\t\t\t<div\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'components-modal__frame',\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'is-full-screen': isFullScreen,\n\t\t\t\t\t\t}\n\t\t\t\t\t) }\n\t\t\t\t\tstyle={ style }\n\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\tconstrainedTabbingRef,\n\t\t\t\t\t\tfocusReturnRef,\n\t\t\t\t\t\tfocusOnMount !== 'firstContentElement'\n\t\t\t\t\t\t\t? focusOnMountRef\n\t\t\t\t\t\t\t: null,\n\t\t\t\t\t] ) }\n\t\t\t\t\trole={ role }\n\t\t\t\t\taria-label={ contentLabel }\n\t\t\t\t\taria-labelledby={ contentLabel ? undefined : headingId }\n\t\t\t\t\taria-describedby={ aria.describedby }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\t{ ...( shouldCloseOnClickOutside\n\t\t\t\t\t\t? focusOutsideProps\n\t\t\t\t\t\t: {} ) }\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ classnames( 'components-modal__content', {\n\t\t\t\t\t\t\t'hide-header': __experimentalHideHeader,\n\t\t\t\t\t\t\t'is-scrollable': hasScrollableContent,\n\t\t\t\t\t\t\t'has-scrolled-content': hasScrolledContent,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\trole=\"document\"\n\t\t\t\t\t\tonScroll={ onContentContainerScroll }\n\t\t\t\t\t\tref={ contentRef }\n\t\t\t\t\t\taria-label={\n\t\t\t\t\t\t\thasScrollableContent\n\t\t\t\t\t\t\t\t? __( 'Scrollable section' )\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\ttabIndex={ hasScrollableContent ? 0 : undefined }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ ! __experimentalHideHeader && (\n\t\t\t\t\t\t\t<div className=\"components-modal__header\">\n\t\t\t\t\t\t\t\t<div className=\"components-modal__header-heading-container\">\n\t\t\t\t\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__icon-container\"\n\t\t\t\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ icon }\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t{ title && (\n\t\t\t\t\t\t\t\t\t\t<h1\n\t\t\t\t\t\t\t\t\t\t\tid={ headingId }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__header-heading\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t\t\t\t</h1>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t{ headerActions }\n\t\t\t\t\t\t\t\t{ isDismissible && (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tonClick={ onRequestClose }\n\t\t\t\t\t\t\t\t\t\ticon={ close }\n\t\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\t\tcloseButtonLabel \|\| __( 'Close' )\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\t\t\tchildrenContainerRef,\n\t\t\t\t\t\t\t\tfocusOnMount === 'firstContentElement'\n\t\t\t\t\t\t\t\t\t? focusOnMountRef\n\t\t\t\t\t\t\t\t\t: null,\n\t\t\t\t\t\t\t] ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</StyleProvider>\n\t\t</div>,\n\t\tdocument.body\n\t);\n}\n\n/*\n Modals give users information and choices related to a task they’re trying to\n * accomplish. They can contain critical information, require decisions, or\n * involve multiple tasks.\n \n ```jsx\n * import { Button, Modal } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n \n const MyModal = () => {\n * const [ isOpen, setOpen ] = useState( false );\n * const openModal = () => setOpen( true );\n * const closeModal = () => setOpen( false );\n \n return (\n * <>\n * <Button variant=\"secondary\" onClick={ openModal }>\n * Open Modal\n * </Button>\n * { isOpen && (\n * <Modal title=\"This is my modal\" onRequestClose={ closeModal }>\n * <Button variant=\"secondary\" onClick={ closeModal }>\n * My custom close button\n * </Button>\n * </Modal>\n * ) }\n * </>\n * );\n * };\n * ```\n */\nexport const Modal = forwardRef( UnforwardedModal );\n\nexport default Modal;\n"],"mappings":"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"}

package/build/modal/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":[],"sources":["@wordpress/components/src/modal/types.ts"],"sourcesContent":["/*\n External dependencies\n /\nimport type {\n\tAriaRole,\n\tCSSProperties,\n\tReactNode,\n\tKeyboardEventHandler,\n\tKeyboardEvent,\n\tSyntheticEvent,\n} from 'react';\n\n/\n WordPress dependencies\n /\nimport type { useFocusOnMount } from '@wordpress/compose';\n\nexport type ModalProps = {\n\taria?: {\n\t\t/\n\t\t If this property is added, it will be added to the modal content\n\t\t * `div` as `aria-describedby`.\n\t\t /\n\t\tdescribedby?: string;\n\t\t/\n\t\t If this property is added, it will be added to the modal content\n\t\t * `div` as `aria-labelledby`. Use this when you are rendering the title\n\t\t * yourself within the modal's content area instead of using the `title`\n\t\t * prop. This ensures the title is usable by assistive technology.\n\t\t \n\t\t Titles are required for accessibility reasons, see `contentLabel` and\n\t\t * `title` for other ways to provide a title.\n\t\t /\n\t\tlabelledby?: string;\n\t};\n\t/\n\t Class name added to the body element when the modal is open.\n\t \n\t @default 'modal-open'\n\t /\n\tbodyOpenClassName?: string;\n\t/\n\t The children elements.\n\t /\n\tchildren: ReactNode;\n\t/\n\t If this property is added, it will an additional class name to the modal\n\t * content `div`.\n\t /\n\tclassName?: string;\n\t/\n\t Label on the close button.\n\t \n\t @default `__( 'Close' )`\n\t /\n\tcloseButtonLabel?: string;\n\t/\n\t If this property is added, it will be added to the modal content `div` as\n\t * `aria-label`.\n\t \n\t Titles are required for accessibility reasons, see `aria.labelledby` and\n\t * `title` for other ways to provide a title.\n\t /\n\tcontentLabel?: string;\n\t/\n\t If this property is true, it will focus the first tabbable element\n\t * rendered in the modal.\n\t \n\t @default true\n\t /\n\tfocusOnMount?: Parameters< typeof useFocusOnMount >[ 0 ];\n\t/\n\t Elements that are injected into the modal header to the left of the close button (if rendered).\n\t * Hidden if `__experimentalHideHeader` is `true`.\n\t \n\t @default null\n\t /\n\theaderActions?: ReactNode;\n\n\t/\n\t If this property is added, an icon will be added before the title.\n\t /\n\ticon?: JSX.Element;\n\t/\n\t If this property is set to false, the modal will not display a close icon\n\t * and cannot be dismissed.\n\t \n\t @default true\n\t /\n\tisDismissible?: boolean;\n\t/\n\t This property when set to `true` will render a full screen modal.\n\t \n\t @default false\n\t /\n\tisFullScreen?: boolean;\n\t/\n\t Handle the key down on the modal frame `div`.\n\t /\n\tonKeyDown?: KeyboardEventHandler< HTMLDivElement >;\n\t/\n\t This function is called to indicate that the modal should be closed.\n\t /\n\tonRequestClose: (\n\t\tevent?: KeyboardEvent< HTMLDivElement > \| SyntheticEvent\n\t) => void;\n\t/\n\t If this property is added, it will an additional class name to the modal\n\t * overlay `div`.\n\t /\n\toverlayClassName?: string;\n\t/\n\t If this property is added, it will override the default role of the\n\t * modal.\n\t \n\t @default 'dialog'\n\t /\n\trole?: AriaRole;\n\t/\n\t If this property is added, it will determine whether the modal requests\n\t * to close when a mouse click occurs outside of the modal content.\n\t \n\t @default true\n\t /\n\tshouldCloseOnClickOutside?: boolean;\n\t/\n\t If this property is added, it will determine whether the modal requests\n\t * to close when the escape key is pressed.\n\t \n\t @default true\n\t /\n\tshouldCloseOnEsc?: boolean;\n\t/\n\t If this property is added, it will be added to the modal frame `div`.\n\t /\n\tstyle?: CSSProperties;\n\t/\n\t This property is used as the modal header's title.\n\t \n\t Titles are required for accessibility reasons, see `aria.labelledby` and\n\t * `contentLabel` for other ways to provide a title.\n\t /\n\ttitle?: string;\n\t/\n\t When set to `true`, the Modal's header (including the icon, title and\n\t * close button) will not be rendered.\n\t \n\t _Warning_: This property is still experimental. “Experimental” means this\n\t * is an early implementation subject to drastic and breaking changes.\n\t \n\t @default false\n\t */\n\t__experimentalHideHeader?: boolean;\n};\n"],"mappings":""}
1	+ {"version":3,"names":[],"sources":["@wordpress/components/src/modal/types.ts"],"sourcesContent":["/*\n External dependencies\n /\nimport type {\n\tAriaRole,\n\tCSSProperties,\n\tReactNode,\n\tKeyboardEventHandler,\n\tKeyboardEvent,\n\tSyntheticEvent,\n} from 'react';\n\n/\n WordPress dependencies\n /\nimport type { useFocusOnMount } from '@wordpress/compose';\n\nexport type ModalProps = {\n\taria?: {\n\t\t/\n\t\t If this property is added, it will be added to the modal content\n\t\t * `div` as `aria-describedby`.\n\t\t /\n\t\tdescribedby?: string;\n\t\t/\n\t\t If this property is added, it will be added to the modal content\n\t\t * `div` as `aria-labelledby`. Use this when you are rendering the title\n\t\t * yourself within the modal's content area instead of using the `title`\n\t\t * prop. This ensures the title is usable by assistive technology.\n\t\t \n\t\t Titles are required for accessibility reasons, see `contentLabel` and\n\t\t * `title` for other ways to provide a title.\n\t\t /\n\t\tlabelledby?: string;\n\t};\n\t/\n\t Class name added to the body element when the modal is open.\n\t \n\t @default 'modal-open'\n\t /\n\tbodyOpenClassName?: string;\n\t/\n\t The children elements.\n\t /\n\tchildren: ReactNode;\n\t/\n\t If this property is added, it will an additional class name to the modal\n\t * content `div`.\n\t /\n\tclassName?: string;\n\t/\n\t Label on the close button.\n\t \n\t @default `__( 'Close' )`\n\t /\n\tcloseButtonLabel?: string;\n\t/\n\t If this property is added, it will be added to the modal content `div` as\n\t * `aria-label`.\n\t \n\t Titles are required for accessibility reasons, see `aria.labelledby` and\n\t * `title` for other ways to provide a title.\n\t /\n\tcontentLabel?: string;\n\t/\n\t If this property is true, it will focus the first tabbable element\n\t * rendered in the modal.\n\t \n\t @default true\n\t /\n\tfocusOnMount?:\n\t\t\| Parameters< typeof useFocusOnMount >[ 0 ]\n\t\t\| 'firstContentElement';\n\t/\n\t Elements that are injected into the modal header to the left of the close button (if rendered).\n\t * Hidden if `__experimentalHideHeader` is `true`.\n\t \n\t @default null\n\t /\n\theaderActions?: ReactNode;\n\n\t/\n\t If this property is added, an icon will be added before the title.\n\t /\n\ticon?: JSX.Element;\n\t/\n\t If this property is set to false, the modal will not display a close icon\n\t * and cannot be dismissed.\n\t \n\t @default true\n\t /\n\tisDismissible?: boolean;\n\t/\n\t This property when set to `true` will render a full screen modal.\n\t \n\t @default false\n\t /\n\tisFullScreen?: boolean;\n\t/\n\t Handle the key down on the modal frame `div`.\n\t /\n\tonKeyDown?: KeyboardEventHandler< HTMLDivElement >;\n\t/\n\t This function is called to indicate that the modal should be closed.\n\t /\n\tonRequestClose: (\n\t\tevent?: KeyboardEvent< HTMLDivElement > \| SyntheticEvent\n\t) => void;\n\t/\n\t If this property is added, it will an additional class name to the modal\n\t * overlay `div`.\n\t /\n\toverlayClassName?: string;\n\t/\n\t If this property is added, it will override the default role of the\n\t * modal.\n\t \n\t @default 'dialog'\n\t /\n\trole?: AriaRole;\n\t/\n\t If this property is added, it will determine whether the modal requests\n\t * to close when a mouse click occurs outside of the modal content.\n\t \n\t @default true\n\t /\n\tshouldCloseOnClickOutside?: boolean;\n\t/\n\t If this property is added, it will determine whether the modal requests\n\t * to close when the escape key is pressed.\n\t \n\t @default true\n\t /\n\tshouldCloseOnEsc?: boolean;\n\t/\n\t If this property is added, it will be added to the modal frame `div`.\n\t /\n\tstyle?: CSSProperties;\n\t/\n\t This property is used as the modal header's title.\n\t \n\t Titles are required for accessibility reasons, see `aria.labelledby` and\n\t * `contentLabel` for other ways to provide a title.\n\t /\n\ttitle?: string;\n\t/\n\t When set to `true`, the Modal's header (including the icon, title and\n\t * close button) will not be rendered.\n\t \n\t _Warning_: This property is still experimental. “Experimental” means this\n\t * is an early implementation subject to drastic and breaking changes.\n\t \n\t @default false\n\t */\n\t__experimentalHideHeader?: boolean;\n};\n"],"mappings":""}

package/build/placeholder/index.js CHANGED Viewed

@@ -10,6 +10,7 @@ var _element = require("@wordpress/element");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _compose = require("@wordpress/compose");
 var _primitives = require("@wordpress/primitives");
+var _a11y = require("@wordpress/a11y");
 var _icon = _interopRequireDefault(require("../icon"));
 /**
  * External dependencies
@@ -75,6 +76,11 @@ function Placeholder(props) {
   const fieldsetClasses = (0, _classnames.default)('components-placeholder__fieldset', {
     'is-column-layout': isColumnLayout
   });
+  (0, _element.useEffect)(() => {
+    if (instructions) {
+      (0, _a11y.speak)(instructions);
+    }
+  }, [instructions]);
   return (0, _element.createElement)("div", {
     ...additionalProps,
     className: classes
@@ -84,11 +90,11 @@ function Placeholder(props) {
     className: "components-placeholder__label"
   }, (0, _element.createElement)(_icon.default, {
     icon: icon
-  }), label), (0, _element.createElement)("fieldset", {
-    className: fieldsetClasses
-  }, !!instructions && (0, _element.createElement)("legend", {
+  }), label), !!instructions && (0, _element.createElement)("div", {
     className: "components-placeholder__instructions"
-  }, instructions), children));
+  }, instructions), (0, _element.createElement)("div", {
+    className: fieldsetClasses
+  }, children));
 }
 var _default = Placeholder;
 exports.default = _default;

package/build/placeholder/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["~~_classnames~~","~~_interopRequireDefault~~","~~require~~","_compose","_primitives","~~_icon~~","~~PlaceholderIllustration~~","~~_element~~","createElement","SVG","className","fill","xmlns","viewBox","preserveAspectRatio","Path","vectorEffect","d","Placeholder","props","icon","children","label","instructions","notices","preview","isColumnLayout","withIllustration","additionalProps","resizeListener","width","useResizeObserver","modifierClassNames","classes","classnames","fieldsetClasses","default","_default","exports"],"sources":["@wordpress/components/src/placeholder/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { useResizeObserver } from '@wordpress/compose';\nimport { SVG, Path } from '@wordpress/primitives';\n\n/\n Internal dependencies\n /\nimport Icon from '../icon';\nimport type { PlaceholderProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\nconst PlaceholderIllustration = (\n\t<SVG\n\t\tclassName=\"components-placeholder__illustration\"\n\t\tfill=\"none\"\n\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\tviewBox=\"0 0 60 60\"\n\t\tpreserveAspectRatio=\"none\"\n\t>\n\t\t<Path vectorEffect=\"non-scaling-stroke\" d=\"M60 60 0 0\" />\n\t</SVG>\n);\n\n/\n Renders a placeholder. Normally used by blocks to render their empty state.\n \n ```jsx\n * import { Placeholder } from '@wordpress/components';\n * import { more } from '@wordpress/icons';\n \n const MyPlaceholder = () => <Placeholder icon={ more } label=\"Placeholder\" />;\n * ```\n */\nexport function Placeholder(\n\tprops: WordPressComponentProps< PlaceholderProps, 'div', false >\n) {\n\tconst {\n\t\ticon,\n\t\tchildren,\n\t\tlabel,\n\t\tinstructions,\n\t\tclassName,\n\t\tnotices,\n\t\tpreview,\n\t\tisColumnLayout,\n\t\twithIllustration,\n\t\t...additionalProps\n\t} = props;\n\tconst [ resizeListener, { width } ] = useResizeObserver();\n\n\t// Since `useResizeObserver` will report a width of `null` until after the\n\t// first render, avoid applying any modifier classes until width is known.\n\tlet modifierClassNames;\n\tif ( typeof width === 'number' ) {\n\t\tmodifierClassNames = {\n\t\t\t'is-large': width >= 480,\n\t\t\t'is-medium': width >= 160 && width < 480,\n\t\t\t'is-small': width < 160,\n\t\t};\n\t}\n\n\tconst classes = classnames(\n\t\t'components-placeholder',\n\t\tclassName,\n\t\tmodifierClassNames,\n\t\twithIllustration ? 'has-illustration' : null\n\t);\n\tconst fieldsetClasses = classnames( 'components-placeholder__fieldset', {\n\t\t'is-column-layout': isColumnLayout,\n\t} );\n\n\treturn (\n\t\t<div { ...additionalProps } className={ classes }>\n\t\t\t{ withIllustration ? PlaceholderIllustration : null }\n\t\t\t{ resizeListener }\n\t\t\t{ notices }\n\t\t\t{ preview && (\n\t\t\t\t<div className=\"components-placeholder__preview\">\n\t\t\t\t\t{ preview }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t<div className=\"components-placeholder__label\">\n\t\t\t\t<Icon icon={ icon } />\n\t\t\t\t{ label }\n\t\t\t</div>\n\t\t\t~~<fieldset className=~~{ ~~fieldsetClasses }>\n\t\t\t\t{~~ !! instructions && (\n\t\t\t\t\t<~~legend~~ className=\"components-placeholder__instructions\">\n\t\t\t\t\t\t{ instructions }\n\t\t\t\t\t</~~legend~~>\n\t\t\t\t) }\n\t\t\t\t{ children }~~\n\t\t\t~~</~~fieldset~~>\n\t\t</div>\n\t);\n}\n\nexport default Placeholder;\n"],"mappings":"~~;;;;;;;;;AAGA~~,IAAAA,WAAA,GAAAC,sBAAA,~~CAAAC~~,OAAA;AAKA,~~IAAAC~~,QAAA,~~GAAAD~~,OAAA;AACA,~~IAAAE~~,WAAA,~~GAAAF~~,OAAA;AAKA,~~IAAAG~~,KAAA,GAAAJ,sBAAA,~~CAAAC~~,OAAA;~~AAdA~~;AACA;AACA;;AAGA;AACA;AACA;;~~AAIA~~;AACA;AACA;;AAKA,~~MAAMI~~,uBAAuB,GAC5B,~~IAAAC~~,QAAA,~~CAAAC~~,aAAA,EAACJ,WAAA,CAAAK,GAAG;EACHC,SAAS,EAAC,sCAAsC;EAChDC,IAAI,EAAC,MAAM;EACXC,KAAK,EAAC,4BAA4B;EAClCC,OAAO,EAAC,WAAW;EACnBC,mBAAmB,EAAC;AAAM,GAE1B,~~IAAAP~~,QAAA,~~CAAAC~~,aAAA,EAACJ,WAAA,CAAAW,IAAI;EAACC,YAAY,EAAC,oBAAoB;EAACC,CAAC,EAAC;AAAY,CAAE,CACpD,CACL;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,WAAWA,CAC1BC,KAAgE,EAC/D;EACD,MAAM;IACLC,IAAI;IACJC,QAAQ;IACRC,KAAK;IACLC,YAAY;IACZb,SAAS;IACTc,OAAO;IACPC,OAAO;IACPC,cAAc;IACdC,gBAAgB;IAChB,GAAGC;EACJ,CAAC,GAAGT,KAAK;EACT,MAAM,CAAEU,cAAc,EAAE;IAAEC;EAAM,CAAC,CAAE,GAAG,IAAAC,0BAAiB,EAAC,CAAC;;EAEzD;EACA;EACA,IAAIC,kBAAkB;EACtB,IAAK,OAAOF,KAAK,KAAK,QAAQ,EAAG;IAChCE,kBAAkB,GAAG;MACpB,UAAU,EAAEF,KAAK,IAAI,GAAG;MACxB,WAAW,EAAEA,KAAK,IAAI,GAAG,IAAIA,KAAK,GAAG,GAAG;MACxC,UAAU,EAAEA,KAAK,GAAG;IACrB,CAAC;EACF;EAEA,MAAMG,OAAO,GAAG,IAAAC,mBAAU,EACzB,wBAAwB,EACxBxB,SAAS,EACTsB,kBAAkB,EAClBL,gBAAgB,GAAG,kBAAkB,GAAG,IACzC,CAAC;~~EACD~~,MAAMQ,eAAe,GAAG,IAAAD,mBAAU,EAAE,kCAAkC,EAAE;IACvE,kBAAkB,EAAER;EACrB,CAAE,CAAC;EAEH,OACC,~~IAAAnB~~,QAAA,~~CAAAC~~,aAAA;IAAA,GAAUoB,eAAe;IAAGlB,SAAS,EAAGuB;EAAS,GAC9CN,gBAAgB,~~GAAGrB~~,uBAAuB,GAAG,IAAI,~~EACjDuB~~,cAAc,EACdL,OAAO,EACPC,OAAO,IACR,~~IAAAlB~~,QAAA,~~CAAAC~~,aAAA;IAAKE,SAAS,EAAC;EAAiC,GAC7Ce,OACE,CACL,EACD,~~IAAAlB~~,QAAA,~~CAAAC~~,aAAA;IAAKE,SAAS,EAAC;EAA+B,GAC7C,~~IAAAH~~,QAAA,~~CAAAC~~,aAAA,~~EAACH~~,KAAA,~~CAAA+B~~,OAAI;~~IAAChB~~,IAAI,EAAGA;EAAM,CAAE,CAAC,EACpBE,KACE,CAAC,~~EACN~~,~~IAAAf~~,QAAA,~~CAAAC~~,aAAA;~~IAAUE~~,SAAS,~~EAAGyB~~;~~EAAiB~~,~~GACpC~~,~~CAAC~~,~~CAAEZ~~,~~YAAY~~,~~IAChB~~,~~IAAAhB,~~QAAA,~~CAAAC~~,aAAA;~~IAAQE~~,SAAS,~~EAAC~~;~~EAAsC~~,~~GACrDa~~,~~YACK~~,~~CACR~~,~~EACCF,QACO,CACN,~~CAAC;AAER;AAAC,~~IAAAgB~~,QAAA,~~GAEcnB~~,WAAW;~~AAAAoB~~,OAAA,CAAAF,OAAA,GAAAC,QAAA"}
1	+ {"version":3,"names":["_element","require","_classnames","_interopRequireDefault","_compose","_primitives","_a11y","_icon","PlaceholderIllustration","createElement","SVG","className","fill","xmlns","viewBox","preserveAspectRatio","Path","vectorEffect","d","Placeholder","props","icon","children","label","instructions","notices","preview","isColumnLayout","withIllustration","additionalProps","resizeListener","width","useResizeObserver","modifierClassNames","classes","classnames","fieldsetClasses","useEffect","speak","default","_default","exports"],"sources":["@wordpress/components/src/placeholder/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { useResizeObserver } from '@wordpress/compose';\nimport { SVG, Path } from '@wordpress/primitives';\nimport { useEffect } from '@wordpress/element';\nimport { speak } from '@wordpress/a11y';\n\n/\n Internal dependencies\n /\nimport Icon from '../icon';\nimport type { PlaceholderProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\nconst PlaceholderIllustration = (\n\t<SVG\n\t\tclassName=\"components-placeholder__illustration\"\n\t\tfill=\"none\"\n\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\tviewBox=\"0 0 60 60\"\n\t\tpreserveAspectRatio=\"none\"\n\t>\n\t\t<Path vectorEffect=\"non-scaling-stroke\" d=\"M60 60 0 0\" />\n\t</SVG>\n);\n\n/\n Renders a placeholder. Normally used by blocks to render their empty state.\n \n ```jsx\n * import { Placeholder } from '@wordpress/components';\n * import { more } from '@wordpress/icons';\n \n const MyPlaceholder = () => <Placeholder icon={ more } label=\"Placeholder\" />;\n * ```\n */\nexport function Placeholder(\n\tprops: WordPressComponentProps< PlaceholderProps, 'div', false >\n) {\n\tconst {\n\t\ticon,\n\t\tchildren,\n\t\tlabel,\n\t\tinstructions,\n\t\tclassName,\n\t\tnotices,\n\t\tpreview,\n\t\tisColumnLayout,\n\t\twithIllustration,\n\t\t...additionalProps\n\t} = props;\n\tconst [ resizeListener, { width } ] = useResizeObserver();\n\n\t// Since `useResizeObserver` will report a width of `null` until after the\n\t// first render, avoid applying any modifier classes until width is known.\n\tlet modifierClassNames;\n\tif ( typeof width === 'number' ) {\n\t\tmodifierClassNames = {\n\t\t\t'is-large': width >= 480,\n\t\t\t'is-medium': width >= 160 && width < 480,\n\t\t\t'is-small': width < 160,\n\t\t};\n\t}\n\n\tconst classes = classnames(\n\t\t'components-placeholder',\n\t\tclassName,\n\t\tmodifierClassNames,\n\t\twithIllustration ? 'has-illustration' : null\n\t);\n\n\tconst fieldsetClasses = classnames( 'components-placeholder__fieldset', {\n\t\t'is-column-layout': isColumnLayout,\n\t} );\n\n\tuseEffect( () => {\n\t\tif ( instructions ) {\n\t\t\tspeak( instructions );\n\t\t}\n\t}, [ instructions ] );\n\n\treturn (\n\t\t<div { ...additionalProps } className={ classes }>\n\t\t\t{ withIllustration ? PlaceholderIllustration : null }\n\t\t\t{ resizeListener }\n\t\t\t{ notices }\n\t\t\t{ preview && (\n\t\t\t\t<div className=\"components-placeholder__preview\">\n\t\t\t\t\t{ preview }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t<div className=\"components-placeholder__label\">\n\t\t\t\t<Icon icon={ icon } />\n\t\t\t\t{ label }\n\t\t\t</div>\n\t\t\t{ !! instructions && (\n\t\t\t\t<div className=\"components-placeholder__instructions\">\n\t\t\t\t\t{ instructions }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t<div className={ fieldsetClasses }>{ children }</div>\n\t\t</div>\n\t);\n}\n\nexport default Placeholder;\n"],"mappings":";;;;;;;;AAUA,IAAAA,QAAA,GAAAC,OAAA;AAPA,IAAAC,WAAA,GAAAC,sBAAA,CAAAF,OAAA;AAKA,IAAAG,QAAA,GAAAH,OAAA;AACA,IAAAI,WAAA,GAAAJ,OAAA;AAEA,IAAAK,KAAA,GAAAL,OAAA;AAKA,IAAAM,KAAA,GAAAJ,sBAAA,CAAAF,OAAA;AAhBA;AACA;AACA;;AAGA;AACA;AACA;;AAMA;AACA;AACA;;AAKA,MAAMO,uBAAuB,GAC5B,IAAAR,QAAA,CAAAS,aAAA,EAACJ,WAAA,CAAAK,GAAG;EACHC,SAAS,EAAC,sCAAsC;EAChDC,IAAI,EAAC,MAAM;EACXC,KAAK,EAAC,4BAA4B;EAClCC,OAAO,EAAC,WAAW;EACnBC,mBAAmB,EAAC;AAAM,GAE1B,IAAAf,QAAA,CAAAS,aAAA,EAACJ,WAAA,CAAAW,IAAI;EAACC,YAAY,EAAC,oBAAoB;EAACC,CAAC,EAAC;AAAY,CAAE,CACpD,CACL;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,WAAWA,CAC1BC,KAAgE,EAC/D;EACD,MAAM;IACLC,IAAI;IACJC,QAAQ;IACRC,KAAK;IACLC,YAAY;IACZb,SAAS;IACTc,OAAO;IACPC,OAAO;IACPC,cAAc;IACdC,gBAAgB;IAChB,GAAGC;EACJ,CAAC,GAAGT,KAAK;EACT,MAAM,CAAEU,cAAc,EAAE;IAAEC;EAAM,CAAC,CAAE,GAAG,IAAAC,0BAAiB,EAAC,CAAC;;EAEzD;EACA;EACA,IAAIC,kBAAkB;EACtB,IAAK,OAAOF,KAAK,KAAK,QAAQ,EAAG;IAChCE,kBAAkB,GAAG;MACpB,UAAU,EAAEF,KAAK,IAAI,GAAG;MACxB,WAAW,EAAEA,KAAK,IAAI,GAAG,IAAIA,KAAK,GAAG,GAAG;MACxC,UAAU,EAAEA,KAAK,GAAG;IACrB,CAAC;EACF;EAEA,MAAMG,OAAO,GAAG,IAAAC,mBAAU,EACzB,wBAAwB,EACxBxB,SAAS,EACTsB,kBAAkB,EAClBL,gBAAgB,GAAG,kBAAkB,GAAG,IACzC,CAAC;EAED,MAAMQ,eAAe,GAAG,IAAAD,mBAAU,EAAE,kCAAkC,EAAE;IACvE,kBAAkB,EAAER;EACrB,CAAE,CAAC;EAEH,IAAAU,kBAAS,EAAE,MAAM;IAChB,IAAKb,YAAY,EAAG;MACnB,IAAAc,WAAK,EAAEd,YAAa,CAAC;IACtB;EACD,CAAC,EAAE,CAAEA,YAAY,CAAG,CAAC;EAErB,OACC,IAAAxB,QAAA,CAAAS,aAAA;IAAA,GAAUoB,eAAe;IAAGlB,SAAS,EAAGuB;EAAS,GAC9CN,gBAAgB,GAAGpB,uBAAuB,GAAG,IAAI,EACjDsB,cAAc,EACdL,OAAO,EACPC,OAAO,IACR,IAAA1B,QAAA,CAAAS,aAAA;IAAKE,SAAS,EAAC;EAAiC,GAC7Ce,OACE,CACL,EACD,IAAA1B,QAAA,CAAAS,aAAA;IAAKE,SAAS,EAAC;EAA+B,GAC7C,IAAAX,QAAA,CAAAS,aAAA,EAACF,KAAA,CAAAgC,OAAI;IAAClB,IAAI,EAAGA;EAAM,CAAE,CAAC,EACpBE,KACE,CAAC,EACJ,CAAC,CAAEC,YAAY,IAChB,IAAAxB,QAAA,CAAAS,aAAA;IAAKE,SAAS,EAAC;EAAsC,GAClDa,YACE,CACL,EACD,IAAAxB,QAAA,CAAAS,aAAA;IAAKE,SAAS,EAAGyB;EAAiB,GAAGd,QAAe,CAChD,CAAC;AAER;AAAC,IAAAkB,QAAA,GAEcrB,WAAW;AAAAsB,OAAA,CAAAF,OAAA,GAAAC,QAAA"}

package/build-module/date-time/time/index.js CHANGED Viewed

@@ -101,7 +101,12 @@ export function TimePicker({
     const callback = (value, {
       event
     }) => {
-      if (!(event.target instanceof HTMLInputElement)) {
+      var _ownerDocument$defaul;
+      // `instanceof` checks need to get the instance definition from the
+      // corresponding window object — therefore, the following logic makes
+      // the component work correctly even when rendered inside an iframe.
+      const HTMLInputElementInstance = (_ownerDocument$defaul = event.target?.ownerDocument.defaultView?.HTMLInputElement) !== null && _ownerDocument$defaul !== void 0 ? _ownerDocument$defaul : HTMLInputElement;
+      if (!(event.target instanceof HTMLInputElementInstance)) {
         return;
       }
       if (!event.target.validity.valid) {

package/build-module/date-time/time/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["startOfMinute","format","set","setHours","setMonth","useState","useMemo","useEffect","__","BaseControl","Button","ButtonGroup","TimeZone","Wrapper","Fieldset","HoursInput","TimeSeparator","MinutesInput","MonthSelectWrapper","MonthSelect","DayInput","YearInput","TimeWrapper","HStack","Spacer","COMMIT","PRESS_DOWN","PRESS_UP","inputToDate","TIMEZONELESS_FORMAT","from12hTo24h","hours","isPm","buildPadInputStateReducer","pad","state","action","nextState","type","value","undefined","toString","padStart","TimePicker","is12Hour","currentTime","onChange","date","setDate","Date","day","month","year","minutes","am","buildNumberControlChangeCallback","method","callback","event","target","HTMLInputElement","validity","valid","numberValue","Number","newDate","buildAmPmChangeCallback","parsedHours","parseInt","dayField","createElement","className","label","hideLabelFromVision","__next36pxDefaultSize","step","min","max","required","spinControls","isPressEnterToChange","isDragEnabled","isShiftStepEnabled","monthField","__nextHasNoMarginBottom","options","VisualLabel","as","__unstableStateReducer","variant","onClick","Fragment"],"sources":["@wordpress/components/src/date-time/time/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport { startOfMinute, format, set, setHours, setMonth } from 'date-fns';\n\n/\n WordPress dependencies\n /\nimport { useState, useMemo, useEffect } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/\n Internal dependencies\n /\nimport BaseControl from '../../base-control';\nimport Button from '../../button';\nimport ButtonGroup from '../../button-group';\nimport TimeZone from './timezone';\nimport type { TimePickerProps } from '../types';\nimport {\n\tWrapper,\n\tFieldset,\n\tHoursInput,\n\tTimeSeparator,\n\tMinutesInput,\n\tMonthSelectWrapper,\n\tMonthSelect,\n\tDayInput,\n\tYearInput,\n\tTimeWrapper,\n} from './styles';\nimport { HStack } from '../../h-stack';\nimport { Spacer } from '../../spacer';\nimport type { InputChangeCallback } from '../../input-control/types';\nimport type { InputState } from '../../input-control/reducer/state';\nimport type { InputAction } from '../../input-control/reducer/actions';\nimport {\n\tCOMMIT,\n\tPRESS_DOWN,\n\tPRESS_UP,\n} from '../../input-control/reducer/actions';\nimport { inputToDate } from '../utils';\nimport { TIMEZONELESS_FORMAT } from '../constants';\n\nfunction from12hTo24h( hours: number, isPm: boolean ) {\n\treturn isPm ? ( ( hours % 12 ) + 12 ) % 24 : hours % 12;\n}\n\n/\n Creates an InputControl reducer used to pad an input so that it is always a\n * given width. For example, the hours and minutes inputs are padded to 2 so\n * that '4' appears as '04'.\n \n @param pad How many digits the value should be.\n /\nfunction buildPadInputStateReducer( pad: number ) {\n\treturn ( state: InputState, action: InputAction ) => {\n\t\tconst nextState = { ...state };\n\t\tif (\n\t\t\taction.type === COMMIT \|\|\n\t\t\taction.type === PRESS_UP \|\|\n\t\t\taction.type === PRESS_DOWN\n\t\t) {\n\t\t\tif ( nextState.value !== undefined ) {\n\t\t\t\tnextState.value = nextState.value\n\t\t\t\t\t.toString()\n\t\t\t\t\t.padStart( pad, '0' );\n\t\t\t}\n\t\t}\n\t\treturn nextState;\n\t};\n}\n\n/\n TimePicker is a React component that renders a clock for time selection.\n \n ```jsx\n * import { TimePicker } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n \n const MyTimePicker = () => {\n * const [ time, setTime ] = useState( new Date() );\n \n return (\n * <TimePicker\n * currentTime={ date }\n * onChange={ ( newTime ) => setTime( newTime ) }\n * is12Hour\n * />\n * );\n * };\n * ```\n */\nexport function TimePicker( {\n\tis12Hour,\n\tcurrentTime,\n\tonChange,\n}: TimePickerProps ) {\n\tconst [ date, setDate ] = useState( () =>\n\t\t// Truncate the date at the minutes, see: #15495.\n\t\tcurrentTime ? startOfMinute( inputToDate( currentTime ) ) : new Date()\n\t);\n\n\t// Reset the state when currentTime changed.\n\t// TODO: useEffect() shouldn't be used like this, causes an unnecessary render\n\tuseEffect( () => {\n\t\tsetDate(\n\t\t\tcurrentTime\n\t\t\t\t? startOfMinute( inputToDate( currentTime ) )\n\t\t\t\t: new Date()\n\t\t);\n\t}, [ currentTime ] );\n\n\tconst { day, month, year, minutes, hours, am } = useMemo(\n\t\t() => ( {\n\t\t\tday: format( date, 'dd' ),\n\t\t\tmonth: format( date, 'MM' ),\n\t\t\tyear: format( date, 'yyyy' ),\n\t\t\tminutes: format( date, 'mm' ),\n\t\t\thours: format( date, is12Hour ? 'hh' : 'HH' ),\n\t\t\tam: format( date, 'a' ),\n\t\t} ),\n\t\t[ date, is12Hour ]\n\t);\n\n\tconst buildNumberControlChangeCallback = (\n\t\tmethod: 'hours' \| 'minutes' \| 'date' \| 'year'\n\t) => {\n\t\tconst callback: InputChangeCallback = ( value, { event } ) => {\n\t\t\tif ( ! ( event.target instanceof HTMLInputElement ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( ! event.target.validity.valid ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// We can safely assume value is a number if target is valid.\n\t\t\tlet numberValue = Number( value );\n\n\t\t\t// If the 12-hour format is being used and the 'PM' period is\n\t\t\t// selected, then the incoming value (which ranges 1-12) should be\n\t\t\t// increased by 12 to match the expected 24-hour format.\n\t\t\tif ( method === 'hours' && is12Hour ) {\n\t\t\t\tnumberValue = from12hTo24h( numberValue, am === 'PM' );\n\t\t\t}\n\n\t\t\tconst newDate = set( date, { [ method ]: numberValue } );\n\t\t\tsetDate( newDate );\n\t\t\tonChange?.( format( newDate, TIMEZONELESS_FORMAT ) );\n\t\t};\n\t\treturn callback;\n\t};\n\n\tfunction buildAmPmChangeCallback( value: 'AM' \| 'PM' ) {\n\t\treturn () => {\n\t\t\tif ( am === value ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst parsedHours = parseInt( hours, 10 );\n\n\t\t\tconst newDate = setHours(\n\t\t\t\tdate,\n\t\t\t\tfrom12hTo24h( parsedHours, value === 'PM' )\n\t\t\t);\n\t\t\tsetDate( newDate );\n\t\t\tonChange?.( format( newDate, TIMEZONELESS_FORMAT ) );\n\t\t};\n\t}\n\n\tconst dayField = (\n\t\t<DayInput\n\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-day\" // Unused, for backwards compatibility.\n\t\t\tlabel={ __( 'Day' ) }\n\t\t\thideLabelFromVision\n\t\t\t__next36pxDefaultSize\n\t\t\tvalue={ day }\n\t\t\tstep={ 1 }\n\t\t\tmin={ 1 }\n\t\t\tmax={ 31 }\n\t\t\trequired\n\t\t\tspinControls=\"none\"\n\t\t\tisPressEnterToChange\n\t\t\tisDragEnabled={ false }\n\t\t\tisShiftStepEnabled={ false }\n\t\t\tonChange={ buildNumberControlChangeCallback( 'date' ) }\n\t\t/>\n\t);\n\n\tconst monthField = (\n\t\t<MonthSelectWrapper>\n\t\t\t<MonthSelect\n\t\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-month\" // Unused, for backwards compatibility.\n\t\t\t\tlabel={ __( 'Month' ) }\n\t\t\t\thideLabelFromVision\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\tvalue={ month }\n\t\t\t\toptions={ [\n\t\t\t\t\t{ value: '01', label: __( 'January' ) },\n\t\t\t\t\t{ value: '02', label: __( 'February' ) },\n\t\t\t\t\t{ value: '03', label: __( 'March' ) },\n\t\t\t\t\t{ value: '04', label: __( 'April' ) },\n\t\t\t\t\t{ value: '05', label: __( 'May' ) },\n\t\t\t\t\t{ value: '06', label: __( 'June' ) },\n\t\t\t\t\t{ value: '07', label: __( 'July' ) },\n\t\t\t\t\t{ value: '08', label: __( 'August' ) },\n\t\t\t\t\t{ value: '09', label: __( 'September' ) },\n\t\t\t\t\t{ value: '10', label: __( 'October' ) },\n\t\t\t\t\t{ value: '11', label: __( 'November' ) },\n\t\t\t\t\t{ value: '12', label: __( 'December' ) },\n\t\t\t\t] }\n\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\tconst newDate = setMonth( date, Number( value ) - 1 );\n\t\t\t\t\tsetDate( newDate );\n\t\t\t\t\tonChange?.( format( newDate, TIMEZONELESS_FORMAT ) );\n\t\t\t\t} }\n\t\t\t/>\n\t\t</MonthSelectWrapper>\n\t);\n\n\treturn (\n\t\t<Wrapper\n\t\t\tclassName=\"components-datetime__time\" // Unused, for backwards compatibility.\n\t\t>\n\t\t\t<Fieldset>\n\t\t\t\t<BaseControl.VisualLabel\n\t\t\t\t\tas=\"legend\"\n\t\t\t\t\tclassName=\"components-datetime__time-legend\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Time' ) }\n\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t<HStack\n\t\t\t\t\tclassName=\"components-datetime__time-wrapper\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t<TimeWrapper\n\t\t\t\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-time\" // Unused, for backwards compatibility.\n\t\t\t\t\t>\n\t\t\t\t\t\t<HoursInput\n\t\t\t\t\t\t\tclassName=\"components-datetime__time-field-hours-input\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\tlabel={ __( 'Hours' ) }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t__next36pxDefaultSize\n\t\t\t\t\t\t\tvalue={ hours }\n\t\t\t\t\t\t\tstep={ 1 }\n\t\t\t\t\t\t\tmin={ is12Hour ? 1 : 0 }\n\t\t\t\t\t\t\tmax={ is12Hour ? 12 : 23 }\n\t\t\t\t\t\t\trequired\n\t\t\t\t\t\t\tspinControls=\"none\"\n\t\t\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\t\t\tisDragEnabled={ false }\n\t\t\t\t\t\t\tisShiftStepEnabled={ false }\n\t\t\t\t\t\t\tonChange={ buildNumberControlChangeCallback(\n\t\t\t\t\t\t\t\t'hours'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t__unstableStateReducer={ buildPadInputStateReducer(\n\t\t\t\t\t\t\t\t2\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<TimeSeparator\n\t\t\t\t\t\t\tclassName=\"components-datetime__time-separator\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t:\n\t\t\t\t\t\t</TimeSeparator>\n\t\t\t\t\t\t<MinutesInput\n\t\t\t\t\t\t\tclassName=\"components-datetime__time-field-minutes-input\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\tlabel={ __( 'Minutes' ) }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t__next36pxDefaultSize\n\t\t\t\t\t\t\tvalue={ minutes }\n\t\t\t\t\t\t\tstep={ 1 }\n\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\tmax={ 59 }\n\t\t\t\t\t\t\trequired\n\t\t\t\t\t\t\tspinControls=\"none\"\n\t\t\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\t\t\tisDragEnabled={ false }\n\t\t\t\t\t\t\tisShiftStepEnabled={ false }\n\t\t\t\t\t\t\tonChange={ buildNumberControlChangeCallback(\n\t\t\t\t\t\t\t\t'minutes'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t__unstableStateReducer={ buildPadInputStateReducer(\n\t\t\t\t\t\t\t\t2\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</TimeWrapper>\n\t\t\t\t\t{ is12Hour && (\n\t\t\t\t\t\t<ButtonGroup\n\t\t\t\t\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-am-pm\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tclassName=\"components-datetime__time-am-button\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\tam === 'AM' ? 'primary' : 'secondary'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonClick={ buildAmPmChangeCallback( 'AM' ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'AM' ) }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tclassName=\"components-datetime__time-pm-button\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\tam === 'PM' ? 'primary' : 'secondary'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonClick={ buildAmPmChangeCallback( 'PM' ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'PM' ) }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</ButtonGroup>\n\t\t\t\t\t) }\n\t\t\t\t\t<Spacer />\n\t\t\t\t\t<TimeZone />\n\t\t\t\t</HStack>\n\t\t\t</Fieldset>\n\t\t\t<Fieldset>\n\t\t\t\t<BaseControl.VisualLabel\n\t\t\t\t\tas=\"legend\"\n\t\t\t\t\tclassName=\"components-datetime__time-legend\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Date' ) }\n\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t<HStack\n\t\t\t\t\tclassName=\"components-datetime__time-wrapper\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t{ is12Hour ? (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{ monthField }\n\t\t\t\t\t\t\t{ dayField }\n\t\t\t\t\t\t</>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{ dayField }\n\t\t\t\t\t\t\t{ monthField }\n\t\t\t\t\t\t</>\n\t\t\t\t\t) }\n\t\t\t\t\t<YearInput\n\t\t\t\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-year\" // Unused, for backwards compatibility.\n\t\t\t\t\t\tlabel={ __( 'Year' ) }\n\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t__next36pxDefaultSize\n\t\t\t\t\t\tvalue={ year }\n\t\t\t\t\t\tstep={ 1 }\n\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\tmax={ 9999 }\n\t\t\t\t\t\trequired\n\t\t\t\t\t\tspinControls=\"none\"\n\t\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\t\tisDragEnabled={ false }\n\t\t\t\t\t\tisShiftStepEnabled={ false }\n\t\t\t\t\t\tonChange={ buildNumberControlChangeCallback( 'year' ) }\n\t\t\t\t\t\t__unstableStateReducer={ buildPadInputStateReducer(\n\t\t\t\t\t\t\t4\n\t\t\t\t\t\t) }\n\t\t\t\t\t/>\n\t\t\t\t</HStack>\n\t\t\t</Fieldset>\n\t\t</Wrapper>\n\t);\n}\n\nexport default TimePicker;\n"],"mappings":"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"}
1	+ {"version":3,"names":["startOfMinute","format","set","setHours","setMonth","useState","useMemo","useEffect","__","BaseControl","Button","ButtonGroup","TimeZone","Wrapper","Fieldset","HoursInput","TimeSeparator","MinutesInput","MonthSelectWrapper","MonthSelect","DayInput","YearInput","TimeWrapper","HStack","Spacer","COMMIT","PRESS_DOWN","PRESS_UP","inputToDate","TIMEZONELESS_FORMAT","from12hTo24h","hours","isPm","buildPadInputStateReducer","pad","state","action","nextState","type","value","undefined","toString","padStart","TimePicker","is12Hour","currentTime","onChange","date","setDate","Date","day","month","year","minutes","am","buildNumberControlChangeCallback","method","callback","event","_ownerDocument$defaul","HTMLInputElementInstance","target","ownerDocument","defaultView","HTMLInputElement","validity","valid","numberValue","Number","newDate","buildAmPmChangeCallback","parsedHours","parseInt","dayField","createElement","className","label","hideLabelFromVision","__next36pxDefaultSize","step","min","max","required","spinControls","isPressEnterToChange","isDragEnabled","isShiftStepEnabled","monthField","__nextHasNoMarginBottom","options","VisualLabel","as","__unstableStateReducer","variant","onClick","Fragment"],"sources":["@wordpress/components/src/date-time/time/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport { startOfMinute, format, set, setHours, setMonth } from 'date-fns';\n\n/\n WordPress dependencies\n /\nimport { useState, useMemo, useEffect } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/\n Internal dependencies\n /\nimport BaseControl from '../../base-control';\nimport Button from '../../button';\nimport ButtonGroup from '../../button-group';\nimport TimeZone from './timezone';\nimport type { TimePickerProps } from '../types';\nimport {\n\tWrapper,\n\tFieldset,\n\tHoursInput,\n\tTimeSeparator,\n\tMinutesInput,\n\tMonthSelectWrapper,\n\tMonthSelect,\n\tDayInput,\n\tYearInput,\n\tTimeWrapper,\n} from './styles';\nimport { HStack } from '../../h-stack';\nimport { Spacer } from '../../spacer';\nimport type { InputChangeCallback } from '../../input-control/types';\nimport type { InputState } from '../../input-control/reducer/state';\nimport type { InputAction } from '../../input-control/reducer/actions';\nimport {\n\tCOMMIT,\n\tPRESS_DOWN,\n\tPRESS_UP,\n} from '../../input-control/reducer/actions';\nimport { inputToDate } from '../utils';\nimport { TIMEZONELESS_FORMAT } from '../constants';\n\nfunction from12hTo24h( hours: number, isPm: boolean ) {\n\treturn isPm ? ( ( hours % 12 ) + 12 ) % 24 : hours % 12;\n}\n\n/\n Creates an InputControl reducer used to pad an input so that it is always a\n * given width. For example, the hours and minutes inputs are padded to 2 so\n * that '4' appears as '04'.\n \n @param pad How many digits the value should be.\n /\nfunction buildPadInputStateReducer( pad: number ) {\n\treturn ( state: InputState, action: InputAction ) => {\n\t\tconst nextState = { ...state };\n\t\tif (\n\t\t\taction.type === COMMIT \|\|\n\t\t\taction.type === PRESS_UP \|\|\n\t\t\taction.type === PRESS_DOWN\n\t\t) {\n\t\t\tif ( nextState.value !== undefined ) {\n\t\t\t\tnextState.value = nextState.value\n\t\t\t\t\t.toString()\n\t\t\t\t\t.padStart( pad, '0' );\n\t\t\t}\n\t\t}\n\t\treturn nextState;\n\t};\n}\n\n/\n TimePicker is a React component that renders a clock for time selection.\n \n ```jsx\n * import { TimePicker } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n \n const MyTimePicker = () => {\n * const [ time, setTime ] = useState( new Date() );\n \n return (\n * <TimePicker\n * currentTime={ date }\n * onChange={ ( newTime ) => setTime( newTime ) }\n * is12Hour\n * />\n * );\n * };\n * ```\n */\nexport function TimePicker( {\n\tis12Hour,\n\tcurrentTime,\n\tonChange,\n}: TimePickerProps ) {\n\tconst [ date, setDate ] = useState( () =>\n\t\t// Truncate the date at the minutes, see: #15495.\n\t\tcurrentTime ? startOfMinute( inputToDate( currentTime ) ) : new Date()\n\t);\n\n\t// Reset the state when currentTime changed.\n\t// TODO: useEffect() shouldn't be used like this, causes an unnecessary render\n\tuseEffect( () => {\n\t\tsetDate(\n\t\t\tcurrentTime\n\t\t\t\t? startOfMinute( inputToDate( currentTime ) )\n\t\t\t\t: new Date()\n\t\t);\n\t}, [ currentTime ] );\n\n\tconst { day, month, year, minutes, hours, am } = useMemo(\n\t\t() => ( {\n\t\t\tday: format( date, 'dd' ),\n\t\t\tmonth: format( date, 'MM' ),\n\t\t\tyear: format( date, 'yyyy' ),\n\t\t\tminutes: format( date, 'mm' ),\n\t\t\thours: format( date, is12Hour ? 'hh' : 'HH' ),\n\t\t\tam: format( date, 'a' ),\n\t\t} ),\n\t\t[ date, is12Hour ]\n\t);\n\n\tconst buildNumberControlChangeCallback = (\n\t\tmethod: 'hours' \| 'minutes' \| 'date' \| 'year'\n\t) => {\n\t\tconst callback: InputChangeCallback = ( value, { event } ) => {\n\t\t\t// `instanceof` checks need to get the instance definition from the\n\t\t\t// corresponding window object — therefore, the following logic makes\n\t\t\t// the component work correctly even when rendered inside an iframe.\n\t\t\tconst HTMLInputElementInstance =\n\t\t\t\t( event.target as HTMLInputElement )?.ownerDocument.defaultView\n\t\t\t\t\t?.HTMLInputElement ?? HTMLInputElement;\n\n\t\t\tif ( ! ( event.target instanceof HTMLInputElementInstance ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( ! event.target.validity.valid ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// We can safely assume value is a number if target is valid.\n\t\t\tlet numberValue = Number( value );\n\n\t\t\t// If the 12-hour format is being used and the 'PM' period is\n\t\t\t// selected, then the incoming value (which ranges 1-12) should be\n\t\t\t// increased by 12 to match the expected 24-hour format.\n\t\t\tif ( method === 'hours' && is12Hour ) {\n\t\t\t\tnumberValue = from12hTo24h( numberValue, am === 'PM' );\n\t\t\t}\n\n\t\t\tconst newDate = set( date, { [ method ]: numberValue } );\n\t\t\tsetDate( newDate );\n\t\t\tonChange?.( format( newDate, TIMEZONELESS_FORMAT ) );\n\t\t};\n\t\treturn callback;\n\t};\n\n\tfunction buildAmPmChangeCallback( value: 'AM' \| 'PM' ) {\n\t\treturn () => {\n\t\t\tif ( am === value ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst parsedHours = parseInt( hours, 10 );\n\n\t\t\tconst newDate = setHours(\n\t\t\t\tdate,\n\t\t\t\tfrom12hTo24h( parsedHours, value === 'PM' )\n\t\t\t);\n\t\t\tsetDate( newDate );\n\t\t\tonChange?.( format( newDate, TIMEZONELESS_FORMAT ) );\n\t\t};\n\t}\n\n\tconst dayField = (\n\t\t<DayInput\n\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-day\" // Unused, for backwards compatibility.\n\t\t\tlabel={ __( 'Day' ) }\n\t\t\thideLabelFromVision\n\t\t\t__next36pxDefaultSize\n\t\t\tvalue={ day }\n\t\t\tstep={ 1 }\n\t\t\tmin={ 1 }\n\t\t\tmax={ 31 }\n\t\t\trequired\n\t\t\tspinControls=\"none\"\n\t\t\tisPressEnterToChange\n\t\t\tisDragEnabled={ false }\n\t\t\tisShiftStepEnabled={ false }\n\t\t\tonChange={ buildNumberControlChangeCallback( 'date' ) }\n\t\t/>\n\t);\n\n\tconst monthField = (\n\t\t<MonthSelectWrapper>\n\t\t\t<MonthSelect\n\t\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-month\" // Unused, for backwards compatibility.\n\t\t\t\tlabel={ __( 'Month' ) }\n\t\t\t\thideLabelFromVision\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\tvalue={ month }\n\t\t\t\toptions={ [\n\t\t\t\t\t{ value: '01', label: __( 'January' ) },\n\t\t\t\t\t{ value: '02', label: __( 'February' ) },\n\t\t\t\t\t{ value: '03', label: __( 'March' ) },\n\t\t\t\t\t{ value: '04', label: __( 'April' ) },\n\t\t\t\t\t{ value: '05', label: __( 'May' ) },\n\t\t\t\t\t{ value: '06', label: __( 'June' ) },\n\t\t\t\t\t{ value: '07', label: __( 'July' ) },\n\t\t\t\t\t{ value: '08', label: __( 'August' ) },\n\t\t\t\t\t{ value: '09', label: __( 'September' ) },\n\t\t\t\t\t{ value: '10', label: __( 'October' ) },\n\t\t\t\t\t{ value: '11', label: __( 'November' ) },\n\t\t\t\t\t{ value: '12', label: __( 'December' ) },\n\t\t\t\t] }\n\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\tconst newDate = setMonth( date, Number( value ) - 1 );\n\t\t\t\t\tsetDate( newDate );\n\t\t\t\t\tonChange?.( format( newDate, TIMEZONELESS_FORMAT ) );\n\t\t\t\t} }\n\t\t\t/>\n\t\t</MonthSelectWrapper>\n\t);\n\n\treturn (\n\t\t<Wrapper\n\t\t\tclassName=\"components-datetime__time\" // Unused, for backwards compatibility.\n\t\t>\n\t\t\t<Fieldset>\n\t\t\t\t<BaseControl.VisualLabel\n\t\t\t\t\tas=\"legend\"\n\t\t\t\t\tclassName=\"components-datetime__time-legend\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Time' ) }\n\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t<HStack\n\t\t\t\t\tclassName=\"components-datetime__time-wrapper\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t<TimeWrapper\n\t\t\t\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-time\" // Unused, for backwards compatibility.\n\t\t\t\t\t>\n\t\t\t\t\t\t<HoursInput\n\t\t\t\t\t\t\tclassName=\"components-datetime__time-field-hours-input\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\tlabel={ __( 'Hours' ) }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t__next36pxDefaultSize\n\t\t\t\t\t\t\tvalue={ hours }\n\t\t\t\t\t\t\tstep={ 1 }\n\t\t\t\t\t\t\tmin={ is12Hour ? 1 : 0 }\n\t\t\t\t\t\t\tmax={ is12Hour ? 12 : 23 }\n\t\t\t\t\t\t\trequired\n\t\t\t\t\t\t\tspinControls=\"none\"\n\t\t\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\t\t\tisDragEnabled={ false }\n\t\t\t\t\t\t\tisShiftStepEnabled={ false }\n\t\t\t\t\t\t\tonChange={ buildNumberControlChangeCallback(\n\t\t\t\t\t\t\t\t'hours'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t__unstableStateReducer={ buildPadInputStateReducer(\n\t\t\t\t\t\t\t\t2\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<TimeSeparator\n\t\t\t\t\t\t\tclassName=\"components-datetime__time-separator\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t:\n\t\t\t\t\t\t</TimeSeparator>\n\t\t\t\t\t\t<MinutesInput\n\t\t\t\t\t\t\tclassName=\"components-datetime__time-field-minutes-input\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\tlabel={ __( 'Minutes' ) }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t__next36pxDefaultSize\n\t\t\t\t\t\t\tvalue={ minutes }\n\t\t\t\t\t\t\tstep={ 1 }\n\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\tmax={ 59 }\n\t\t\t\t\t\t\trequired\n\t\t\t\t\t\t\tspinControls=\"none\"\n\t\t\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\t\t\tisDragEnabled={ false }\n\t\t\t\t\t\t\tisShiftStepEnabled={ false }\n\t\t\t\t\t\t\tonChange={ buildNumberControlChangeCallback(\n\t\t\t\t\t\t\t\t'minutes'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t__unstableStateReducer={ buildPadInputStateReducer(\n\t\t\t\t\t\t\t\t2\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</TimeWrapper>\n\t\t\t\t\t{ is12Hour && (\n\t\t\t\t\t\t<ButtonGroup\n\t\t\t\t\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-am-pm\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tclassName=\"components-datetime__time-am-button\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\tam === 'AM' ? 'primary' : 'secondary'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonClick={ buildAmPmChangeCallback( 'AM' ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'AM' ) }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tclassName=\"components-datetime__time-pm-button\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\tam === 'PM' ? 'primary' : 'secondary'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonClick={ buildAmPmChangeCallback( 'PM' ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'PM' ) }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</ButtonGroup>\n\t\t\t\t\t) }\n\t\t\t\t\t<Spacer />\n\t\t\t\t\t<TimeZone />\n\t\t\t\t</HStack>\n\t\t\t</Fieldset>\n\t\t\t<Fieldset>\n\t\t\t\t<BaseControl.VisualLabel\n\t\t\t\t\tas=\"legend\"\n\t\t\t\t\tclassName=\"components-datetime__time-legend\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Date' ) }\n\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t<HStack\n\t\t\t\t\tclassName=\"components-datetime__time-wrapper\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t{ is12Hour ? (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{ monthField }\n\t\t\t\t\t\t\t{ dayField }\n\t\t\t\t\t\t</>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{ dayField }\n\t\t\t\t\t\t\t{ monthField }\n\t\t\t\t\t\t</>\n\t\t\t\t\t) }\n\t\t\t\t\t<YearInput\n\t\t\t\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-year\" // Unused, for backwards compatibility.\n\t\t\t\t\t\tlabel={ __( 'Year' ) }\n\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t__next36pxDefaultSize\n\t\t\t\t\t\tvalue={ year }\n\t\t\t\t\t\tstep={ 1 }\n\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\tmax={ 9999 }\n\t\t\t\t\t\trequired\n\t\t\t\t\t\tspinControls=\"none\"\n\t\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\t\tisDragEnabled={ false }\n\t\t\t\t\t\tisShiftStepEnabled={ false }\n\t\t\t\t\t\tonChange={ buildNumberControlChangeCallback( 'year' ) }\n\t\t\t\t\t\t__unstableStateReducer={ buildPadInputStateReducer(\n\t\t\t\t\t\t\t4\n\t\t\t\t\t\t) }\n\t\t\t\t\t/>\n\t\t\t\t</HStack>\n\t\t\t</Fieldset>\n\t\t</Wrapper>\n\t);\n}\n\nexport default TimePicker;\n"],"mappings":"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"}

package/build-module/modal/index.js CHANGED Viewed

@@ -50,7 +50,16 @@ function UnforwardedModal(props, forwardedRef) {
   const ref = useRef();
   const instanceId = useInstanceId(Modal);
   const headingId = title ? `components-modal-header-${instanceId}` : aria.labelledby;
-  const focusOnMountRef = useFocusOnMount(focusOnMount);
+  // The focus hook does not support 'firstContentElement' but this is a valid
+  // value for the Modal's focusOnMount prop. The following code ensures the focus
+  // hook will focus the first focusable node within the element to which it is applied.
+  // When `firstContentElement` is passed as the value of the focusOnMount prop,
+  // the focus hook is applied to the Modal's content element.
+  // Otherwise, the focus hook is applied to the Modal's ref. This ensures that the
+  // focus hook will focus the first element in the Modal's **content** when
+  // `firstContentElement` is passed.
+  const focusOnMountRef = useFocusOnMount(focusOnMount === 'firstContentElement' ? 'firstElement' : focusOnMount);
   const constrainedTabbingRef = useConstrainedTabbing();
   const focusReturnRef = useFocusReturn();
   const focusOutsideProps = useFocusOutside(onRequestClose);
@@ -165,7 +174,7 @@ function UnforwardedModal(props, forwardedRef) {
       'is-full-screen': isFullScreen
     }),
     style: style,
-    ref: useMergeRefs([constrainedTabbingRef, focusReturnRef, focusOnMountRef]),
+    ref: useMergeRefs([constrainedTabbingRef, focusReturnRef, focusOnMount !== 'firstContentElement' ? focusOnMountRef : null]),
     role: role,
     "aria-label": contentLabel,
     "aria-labelledby": contentLabel ? undefined : headingId,
@@ -199,7 +208,7 @@ function UnforwardedModal(props, forwardedRef) {
     icon: close,
     label: closeButtonLabel || __('Close')
   })), createElement("div", {
-    ref: childrenContainerRef
+    ref: useMergeRefs([childrenContainerRef, focusOnMount === 'firstContentElement' ? focusOnMountRef : null])
   }, children))))), document.body);
 }