npm - @wordpress/components - Versions diffs - 27.4.0 → 27.6.0 - Mend

@wordpress/components 27.4.0 → 27.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1287) hide show

package/build/custom-gradient-picker/gradient-bar/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_classnames","_interopRequireDefault","require","_element","_controlPoints","_utils","_constants","customGradientBarReducer","state","action","type","id","insertPosition","customGradientBarReducerInitialState","CustomGradientBar","background","hasGradient","value","controlPoints","onChange","disableInserter","disableAlpha","__experimentalIsRenderedInSidebar","gradientMarkersContainerDomRef","useRef","gradientBarState","gradientBarStateDispatch","useReducer","onMouseEnterAndMove","event","current","getHorizontalRelativeGradientPosition","clientX","some","position","Math","abs","MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT","onMouseLeave","isMovingInserter","isInsertingControlPoint","_react","createElement","className","classnames","onMouseEnter","onMouseMove","style","opacity","ref","default","InsertPoint","onOpenInserter","onCloseInserter","disableRemove","gradientPickerDomRef","ignoreMarkerPosition","undefined","onStartControlPointChange","onStopControlPointChange"],"sources":["@wordpress/components/src/custom-gradient-picker/gradient-bar/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { useRef, useReducer } from '@wordpress/element';\n\n/\n Internal dependencies\n */\nimport ControlPoints from './control-points';\nimport { getHorizontalRelativeGradientPosition } from './utils';\nimport { MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT } from './constants';\nimport type {\n\tCustomGradientBarProps,\n\tCustomGradientBarReducerState,\n\tCustomGradientBarReducerAction,\n\tCustomGradientBarIdleState,\n} from '../types';\nimport type { MouseEventHandler } from 'react';\n\nconst customGradientBarReducer = (\n\tstate: CustomGradientBarReducerState,\n\taction: CustomGradientBarReducerAction\n): CustomGradientBarReducerState => {\n\tswitch ( action.type ) {\n\t\tcase 'MOVE_INSERTER':\n\t\t\tif ( state.id === 'IDLE' \|\| state.id === 'MOVING_INSERTER' ) {\n\t\t\t\treturn {\n\t\t\t\t\tid: 'MOVING_INSERTER',\n\t\t\t\t\tinsertPosition: action.insertPosition,\n\t\t\t\t};\n\t\t\t}\n\t\t\tbreak;\n\t\tcase 'STOP_INSERTER_MOVE':\n\t\t\tif ( state.id === 'MOVING_INSERTER' ) {\n\t\t\t\treturn {\n\t\t\t\t\tid: 'IDLE',\n\t\t\t\t};\n\t\t\t}\n\t\t\tbreak;\n\t\tcase 'OPEN_INSERTER':\n\t\t\tif ( state.id === 'MOVING_INSERTER' ) {\n\t\t\t\treturn {\n\t\t\t\t\tid: 'INSERTING_CONTROL_POINT',\n\t\t\t\t\tinsertPosition: state.insertPosition,\n\t\t\t\t};\n\t\t\t}\n\t\t\tbreak;\n\t\tcase 'CLOSE_INSERTER':\n\t\t\tif ( state.id === 'INSERTING_CONTROL_POINT' ) {\n\t\t\t\treturn {\n\t\t\t\t\tid: 'IDLE',\n\t\t\t\t};\n\t\t\t}\n\t\t\tbreak;\n\t\tcase 'START_CONTROL_CHANGE':\n\t\t\tif ( state.id === 'IDLE' ) {\n\t\t\t\treturn {\n\t\t\t\t\tid: 'MOVING_CONTROL_POINT',\n\t\t\t\t};\n\t\t\t}\n\t\t\tbreak;\n\t\tcase 'STOP_CONTROL_CHANGE':\n\t\t\tif ( state.id === 'MOVING_CONTROL_POINT' ) {\n\t\t\t\treturn {\n\t\t\t\t\tid: 'IDLE',\n\t\t\t\t};\n\t\t\t}\n\t\t\tbreak;\n\t}\n\treturn state;\n};\nconst customGradientBarReducerInitialState: CustomGradientBarIdleState = {\n\tid: 'IDLE',\n};\n\nexport default function CustomGradientBar( {\n\tbackground,\n\thasGradient,\n\tvalue: controlPoints,\n\tonChange,\n\tdisableInserter = false,\n\tdisableAlpha = false,\n\t__experimentalIsRenderedInSidebar = false,\n}: CustomGradientBarProps ) {\n\tconst gradientMarkersContainerDomRef = useRef< HTMLDivElement >( null );\n\n\tconst [ gradientBarState, gradientBarStateDispatch ] = useReducer(\n\t\tcustomGradientBarReducer,\n\t\tcustomGradientBarReducerInitialState\n\t);\n\tconst onMouseEnterAndMove: MouseEventHandler< HTMLDivElement > = (\n\t\tevent\n\t) => {\n\t\tif ( ! gradientMarkersContainerDomRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst insertPosition = getHorizontalRelativeGradientPosition(\n\t\t\tevent.clientX,\n\t\t\tgradientMarkersContainerDomRef.current\n\t\t);\n\n\t\t// If the insert point is close to an existing control point don't show it.\n\t\tif (\n\t\t\tcontrolPoints.some( ( { position } ) => {\n\t\t\t\treturn (\n\t\t\t\t\tMath.abs( insertPosition - position ) <\n\t\t\t\t\tMINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT\n\t\t\t\t);\n\t\t\t} )\n\t\t) {\n\t\t\tif ( gradientBarState.id === 'MOVING_INSERTER' ) {\n\t\t\t\tgradientBarStateDispatch( { type: 'STOP_INSERTER_MOVE' } );\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\n\t\tgradientBarStateDispatch( { type: 'MOVE_INSERTER', insertPosition } );\n\t};\n\n\tconst onMouseLeave = () => {\n\t\tgradientBarStateDispatch( { type: 'STOP_INSERTER_MOVE' } );\n\t};\n\n\tconst isMovingInserter = gradientBarState.id === 'MOVING_INSERTER';\n\tconst isInsertingControlPoint =\n\t\tgradientBarState.id === 'INSERTING_CONTROL_POINT';\n\n\treturn (\n\t\t<div\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-custom-gradient-picker__gradient-bar',\n\t\t\t\t{ 'has-gradient': hasGradient }\n\t\t\t) }\n\t\t\tonMouseEnter={ onMouseEnterAndMove }\n\t\t\tonMouseMove={ onMouseEnterAndMove }\n\t\t\tonMouseLeave={ onMouseLeave }\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName=\"components-custom-gradient-picker__gradient-bar-background\"\n\t\t\t\tstyle={ {\n\t\t\t\t\tbackground,\n\t\t\t\t\topacity: hasGradient ? 1 : 0.4,\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t<div\n\t\t\t\tref={ gradientMarkersContainerDomRef }\n\t\t\t\tclassName=\"components-custom-gradient-picker__markers-container\"\n\t\t\t>\n\t\t\t\t{ ! disableInserter &&\n\t\t\t\t\t( isMovingInserter \|\| isInsertingControlPoint ) && (\n\t\t\t\t\t\t<ControlPoints.InsertPoint\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tdisableAlpha={ disableAlpha }\n\t\t\t\t\t\t\tinsertPosition={ gradientBarState.insertPosition }\n\t\t\t\t\t\t\tvalue={ controlPoints }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\tonOpenInserter={ () => {\n\t\t\t\t\t\t\t\tgradientBarStateDispatch( {\n\t\t\t\t\t\t\t\t\ttype: 'OPEN_INSERTER',\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tonCloseInserter={ () => {\n\t\t\t\t\t\t\t\tgradientBarStateDispatch( {\n\t\t\t\t\t\t\t\t\ttype: 'CLOSE_INSERTER',\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t<ControlPoints\n\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t}\n\t\t\t\t\tdisableAlpha={ disableAlpha }\n\t\t\t\t\tdisableRemove={ disableInserter }\n\t\t\t\t\tgradientPickerDomRef={ gradientMarkersContainerDomRef }\n\t\t\t\t\tignoreMarkerPosition={\n\t\t\t\t\t\tisInsertingControlPoint\n\t\t\t\t\t\t\t? gradientBarState.insertPosition\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tvalue={ controlPoints }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tonStartControlPointChange={ () => {\n\t\t\t\t\t\tgradientBarStateDispatch( {\n\t\t\t\t\t\t\ttype: 'START_CONTROL_CHANGE',\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\tonStopControlPointChange={ () => {\n\t\t\t\t\t\tgradientBarStateDispatch( {\n\t\t\t\t\t\t\ttype: 'STOP_CONTROL_CHANGE',\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"names":["_clsx","_interopRequireDefault","require","_element","_controlPoints","_utils","_constants","customGradientBarReducer","state","action","type","id","insertPosition","customGradientBarReducerInitialState","CustomGradientBar","background","hasGradient","value","controlPoints","onChange","disableInserter","disableAlpha","__experimentalIsRenderedInSidebar","gradientMarkersContainerDomRef","useRef","gradientBarState","gradientBarStateDispatch","useReducer","onMouseEnterAndMove","event","current","getHorizontalRelativeGradientPosition","clientX","some","position","Math","abs","MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT","onMouseLeave","isMovingInserter","isInsertingControlPoint","_react","createElement","className","clsx","onMouseEnter","onMouseMove","style","opacity","ref","default","InsertPoint","onOpenInserter","onCloseInserter","disableRemove","gradientPickerDomRef","ignoreMarkerPosition","undefined","onStartControlPointChange","onStopControlPointChange"],"sources":["@wordpress/components/src/custom-gradient-picker/gradient-bar/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport clsx from 'clsx';\n\n/\n WordPress dependencies\n /\nimport { useRef, useReducer } from '@wordpress/element';\n\n/\n Internal dependencies\n */\nimport ControlPoints from './control-points';\nimport { getHorizontalRelativeGradientPosition } from './utils';\nimport { MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT } from './constants';\nimport type {\n\tCustomGradientBarProps,\n\tCustomGradientBarReducerState,\n\tCustomGradientBarReducerAction,\n\tCustomGradientBarIdleState,\n} from '../types';\nimport type { MouseEventHandler } from 'react';\n\nconst customGradientBarReducer = (\n\tstate: CustomGradientBarReducerState,\n\taction: CustomGradientBarReducerAction\n): CustomGradientBarReducerState => {\n\tswitch ( action.type ) {\n\t\tcase 'MOVE_INSERTER':\n\t\t\tif ( state.id === 'IDLE' \|\| state.id === 'MOVING_INSERTER' ) {\n\t\t\t\treturn {\n\t\t\t\t\tid: 'MOVING_INSERTER',\n\t\t\t\t\tinsertPosition: action.insertPosition,\n\t\t\t\t};\n\t\t\t}\n\t\t\tbreak;\n\t\tcase 'STOP_INSERTER_MOVE':\n\t\t\tif ( state.id === 'MOVING_INSERTER' ) {\n\t\t\t\treturn {\n\t\t\t\t\tid: 'IDLE',\n\t\t\t\t};\n\t\t\t}\n\t\t\tbreak;\n\t\tcase 'OPEN_INSERTER':\n\t\t\tif ( state.id === 'MOVING_INSERTER' ) {\n\t\t\t\treturn {\n\t\t\t\t\tid: 'INSERTING_CONTROL_POINT',\n\t\t\t\t\tinsertPosition: state.insertPosition,\n\t\t\t\t};\n\t\t\t}\n\t\t\tbreak;\n\t\tcase 'CLOSE_INSERTER':\n\t\t\tif ( state.id === 'INSERTING_CONTROL_POINT' ) {\n\t\t\t\treturn {\n\t\t\t\t\tid: 'IDLE',\n\t\t\t\t};\n\t\t\t}\n\t\t\tbreak;\n\t\tcase 'START_CONTROL_CHANGE':\n\t\t\tif ( state.id === 'IDLE' ) {\n\t\t\t\treturn {\n\t\t\t\t\tid: 'MOVING_CONTROL_POINT',\n\t\t\t\t};\n\t\t\t}\n\t\t\tbreak;\n\t\tcase 'STOP_CONTROL_CHANGE':\n\t\t\tif ( state.id === 'MOVING_CONTROL_POINT' ) {\n\t\t\t\treturn {\n\t\t\t\t\tid: 'IDLE',\n\t\t\t\t};\n\t\t\t}\n\t\t\tbreak;\n\t}\n\treturn state;\n};\nconst customGradientBarReducerInitialState: CustomGradientBarIdleState = {\n\tid: 'IDLE',\n};\n\nexport default function CustomGradientBar( {\n\tbackground,\n\thasGradient,\n\tvalue: controlPoints,\n\tonChange,\n\tdisableInserter = false,\n\tdisableAlpha = false,\n\t__experimentalIsRenderedInSidebar = false,\n}: CustomGradientBarProps ) {\n\tconst gradientMarkersContainerDomRef = useRef< HTMLDivElement >( null );\n\n\tconst [ gradientBarState, gradientBarStateDispatch ] = useReducer(\n\t\tcustomGradientBarReducer,\n\t\tcustomGradientBarReducerInitialState\n\t);\n\tconst onMouseEnterAndMove: MouseEventHandler< HTMLDivElement > = (\n\t\tevent\n\t) => {\n\t\tif ( ! gradientMarkersContainerDomRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst insertPosition = getHorizontalRelativeGradientPosition(\n\t\t\tevent.clientX,\n\t\t\tgradientMarkersContainerDomRef.current\n\t\t);\n\n\t\t// If the insert point is close to an existing control point don't show it.\n\t\tif (\n\t\t\tcontrolPoints.some( ( { position } ) => {\n\t\t\t\treturn (\n\t\t\t\t\tMath.abs( insertPosition - position ) <\n\t\t\t\t\tMINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT\n\t\t\t\t);\n\t\t\t} )\n\t\t) {\n\t\t\tif ( gradientBarState.id === 'MOVING_INSERTER' ) {\n\t\t\t\tgradientBarStateDispatch( { type: 'STOP_INSERTER_MOVE' } );\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\n\t\tgradientBarStateDispatch( { type: 'MOVE_INSERTER', insertPosition } );\n\t};\n\n\tconst onMouseLeave = () => {\n\t\tgradientBarStateDispatch( { type: 'STOP_INSERTER_MOVE' } );\n\t};\n\n\tconst isMovingInserter = gradientBarState.id === 'MOVING_INSERTER';\n\tconst isInsertingControlPoint =\n\t\tgradientBarState.id === 'INSERTING_CONTROL_POINT';\n\n\treturn (\n\t\t<div\n\t\t\tclassName={ clsx(\n\t\t\t\t'components-custom-gradient-picker__gradient-bar',\n\t\t\t\t{ 'has-gradient': hasGradient }\n\t\t\t) }\n\t\t\tonMouseEnter={ onMouseEnterAndMove }\n\t\t\tonMouseMove={ onMouseEnterAndMove }\n\t\t\tonMouseLeave={ onMouseLeave }\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName=\"components-custom-gradient-picker__gradient-bar-background\"\n\t\t\t\tstyle={ {\n\t\t\t\t\tbackground,\n\t\t\t\t\topacity: hasGradient ? 1 : 0.4,\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t<div\n\t\t\t\tref={ gradientMarkersContainerDomRef }\n\t\t\t\tclassName=\"components-custom-gradient-picker__markers-container\"\n\t\t\t>\n\t\t\t\t{ ! disableInserter &&\n\t\t\t\t\t( isMovingInserter \|\| isInsertingControlPoint ) && (\n\t\t\t\t\t\t<ControlPoints.InsertPoint\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tdisableAlpha={ disableAlpha }\n\t\t\t\t\t\t\tinsertPosition={ gradientBarState.insertPosition }\n\t\t\t\t\t\t\tvalue={ controlPoints }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\tonOpenInserter={ () => {\n\t\t\t\t\t\t\t\tgradientBarStateDispatch( {\n\t\t\t\t\t\t\t\t\ttype: 'OPEN_INSERTER',\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tonCloseInserter={ () => {\n\t\t\t\t\t\t\t\tgradientBarStateDispatch( {\n\t\t\t\t\t\t\t\t\ttype: 'CLOSE_INSERTER',\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t<ControlPoints\n\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t}\n\t\t\t\t\tdisableAlpha={ disableAlpha }\n\t\t\t\t\tdisableRemove={ disableInserter }\n\t\t\t\t\tgradientPickerDomRef={ gradientMarkersContainerDomRef }\n\t\t\t\t\tignoreMarkerPosition={\n\t\t\t\t\t\tisInsertingControlPoint\n\t\t\t\t\t\t\t? gradientBarState.insertPosition\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tvalue={ controlPoints }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tonStartControlPointChange={ () => {\n\t\t\t\t\t\tgradientBarStateDispatch( {\n\t\t\t\t\t\t\ttype: 'START_CONTROL_CHANGE',\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t\tonStopControlPointChange={ () => {\n\t\t\t\t\t\tgradientBarStateDispatch( {\n\t\t\t\t\t\t\ttype: 'STOP_CONTROL_CHANGE',\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}

package/build/custom-gradient-picker/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_i18n","require","_anglePickerControl","_interopRequireDefault","_gradientBar","_flex","_selectControl","_vStack","_utils","_serializer","_constants","_customGradientPickerStyles","GradientAnglePicker","gradientAST","hasGradient","onChange","_gradientAST$orientat","angle","orientation","value","DEFAULT_LINEAR_GRADIENT_ANGLE","onAngleChange","newAngle","serializeGradient","type","_react","createElement","default","GradientTypePicker","onSetLinearGradient","undefined","HORIZONTAL_GRADIENT_ORIENTATION","onSetRadialGradient","restGradientAST","handleOnChange","next","__nextHasNoMarginBottom","className","label","__","labelPosition","options","GRADIENT_OPTIONS","size","CustomGradientPicker","__experimentalIsRenderedInSidebar","getGradientAstWithDefault","background","getLinearGradientRepresentation","controlPoints","colorStops","map","colorStop","color","getStopCssColor","position","parseInt","length","VStack","spacing","newControlPoints","getGradientAstWithControlPoints","Flex","gap","SelectWrapper","AccessoryWrapper","_default","exports"],"sources":["@wordpress/components/src/custom-gradient-picker/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport type gradientParser from 'gradient-parser';\n\n/\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\n\n/\n Internal dependencies\n /\nimport AnglePickerControl from '../angle-picker-control';\nimport CustomGradientBar from './gradient-bar';\nimport { Flex } from '../flex';\nimport SelectControl from '../select-control';\nimport { VStack } from '../v-stack';\nimport {\n\tgetGradientAstWithDefault,\n\tgetLinearGradientRepresentation,\n\tgetGradientAstWithControlPoints,\n\tgetStopCssColor,\n} from './utils';\nimport { serializeGradient } from './serializer';\nimport {\n\tDEFAULT_LINEAR_GRADIENT_ANGLE,\n\tHORIZONTAL_GRADIENT_ORIENTATION,\n\tGRADIENT_OPTIONS,\n} from './constants';\nimport {\n\tAccessoryWrapper,\n\tSelectWrapper,\n} from './styles/custom-gradient-picker-styles';\nimport type {\n\tCustomGradientPickerProps,\n\tGradientAnglePickerProps,\n\tGradientTypePickerProps,\n} from './types';\n\nconst GradientAnglePicker = ( {\n\tgradientAST,\n\thasGradient,\n\tonChange,\n}: GradientAnglePickerProps ) => {\n\tconst angle =\n\t\tgradientAST?.orientation?.value ?? DEFAULT_LINEAR_GRADIENT_ANGLE;\n\tconst onAngleChange = ( newAngle: number ) => {\n\t\tonChange(\n\t\t\tserializeGradient( {\n\t\t\t\t...gradientAST,\n\t\t\t\torientation: {\n\t\t\t\t\ttype: 'angular',\n\t\t\t\t\tvalue: `${ newAngle }`,\n\t\t\t\t},\n\t\t\t} )\n\t\t);\n\t};\n\treturn (\n\t\t<AnglePickerControl\n\t\t\tonChange={ onAngleChange }\n\t\t\tvalue={ hasGradient ? angle : '' }\n\t\t/>\n\t);\n};\n\nconst GradientTypePicker = ( {\n\tgradientAST,\n\thasGradient,\n\tonChange,\n}: GradientTypePickerProps ) => {\n\tconst { type } = gradientAST;\n\n\tconst onSetLinearGradient = () => {\n\t\tonChange(\n\t\t\tserializeGradient( {\n\t\t\t\t...gradientAST,\n\t\t\t\torientation: gradientAST.orientation\n\t\t\t\t\t? undefined\n\t\t\t\t\t: HORIZONTAL_GRADIENT_ORIENTATION,\n\t\t\t\ttype: 'linear-gradient',\n\t\t\t} as gradientParser.LinearGradientNode )\n\t\t);\n\t};\n\n\tconst onSetRadialGradient = () => {\n\t\tconst { orientation, ...restGradientAST } = gradientAST;\n\t\tonChange(\n\t\t\tserializeGradient( {\n\t\t\t\t...restGradientAST,\n\t\t\t\ttype: 'radial-gradient',\n\t\t\t} )\n\t\t);\n\t};\n\n\tconst handleOnChange = ( next: string ) => {\n\t\tif ( next === 'linear-gradient' ) {\n\t\t\tonSetLinearGradient();\n\t\t}\n\t\tif ( next === 'radial-gradient' ) {\n\t\t\tonSetRadialGradient();\n\t\t}\n\t};\n\n\treturn (\n\t\t<SelectControl\n\t\t\t__nextHasNoMarginBottom\n\t\t\tclassName=\"components-custom-gradient-picker__type-picker\"\n\t\t\tlabel={ __( 'Type' ) }\n\t\t\tlabelPosition=\"top\"\n\t\t\tonChange={ handleOnChange }\n\t\t\toptions={ GRADIENT_OPTIONS }\n\t\t\tsize=\"__unstable-large\"\n\t\t\tvalue={ hasGradient ? type : undefined }\n\t\t/>\n\t);\n};\n\n/\n CustomGradientPicker is a React component that renders a UI for specifying\n * linear or radial gradients. Radial gradients are displayed in the picker as\n * a slice of the gradient from the center to the outside.\n \n ```jsx\n * import { CustomGradientPicker } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n \n const MyCustomGradientPicker = () => {\n * const [ gradient, setGradient ] = useState();\n \n return (\n * <CustomGradientPicker\n \t\t\tvalue={ gradient }\n \t\t\tonChange={ setGradient }\n * />\n * );\n * };\n * ```\n */\nexport function CustomGradientPicker( {\n\tvalue,\n\tonChange,\n\t__experimentalIsRenderedInSidebar = false,\n}: CustomGradientPickerProps ) {\n\tconst { gradientAST, hasGradient } = getGradientAstWithDefault( value );\n\n\t// On radial gradients the bar should display a linear gradient.\n\t// On radial gradients the bar represents a slice of the gradient from the center until the outside.\n\t// On liner gradients the bar represents the color stops from left to right independently of the angle.\n\tconst background = getLinearGradientRepresentation( gradientAST );\n\n\t// Control points color option may be hex from presets, custom colors will be rgb.\n\t// The position should always be a percentage.\n\tconst controlPoints = gradientAST.colorStops.map( ( colorStop ) => {\n\t\treturn {\n\t\t\tcolor: getStopCssColor( colorStop ),\n\t\t\t// Although it's already been checked by `hasUnsupportedLength` in `getGradientAstWithDefault`,\n\t\t\t// TypeScript doesn't know that `colorStop.length` is not undefined here.\n\t\t\t// @ts-expect-error\n\t\t\tposition: parseInt( colorStop.length.value ),\n\t\t};\n\t} );\n\n\treturn (\n\t\t<VStack spacing={ 4 } className=\"components-custom-gradient-picker\">\n\t\t\t<CustomGradientBar\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tbackground={ background }\n\t\t\t\thasGradient={ hasGradient }\n\t\t\t\tvalue={ controlPoints }\n\t\t\t\tonChange={ ( newControlPoints ) => {\n\t\t\t\t\tonChange(\n\t\t\t\t\t\tserializeGradient(\n\t\t\t\t\t\t\tgetGradientAstWithControlPoints(\n\t\t\t\t\t\t\t\tgradientAST,\n\t\t\t\t\t\t\t\tnewControlPoints\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t)\n\t\t\t\t\t);\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t<Flex\n\t\t\t\tgap={ 3 }\n\t\t\t\tclassName=\"components-custom-gradient-picker__ui-line\"\n\t\t\t>\n\t\t\t\t<SelectWrapper>\n\t\t\t\t\t<GradientTypePicker\n\t\t\t\t\t\tgradientAST={ gradientAST }\n\t\t\t\t\t\thasGradient={ hasGradient }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t</SelectWrapper>\n\t\t\t\t<AccessoryWrapper>\n\t\t\t\t\t{ gradientAST.type === 'linear-gradient' && (\n\t\t\t\t\t\t<GradientAnglePicker\n\t\t\t\t\t\t\tgradientAST={ gradientAST }\n\t\t\t\t\t\t\thasGradient={ hasGradient }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</AccessoryWrapper>\n\t\t\t</Flex>\n\t\t</VStack>\n\t);\n}\n\nexport default CustomGradientPicker;\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"names":["_i18n","require","_anglePickerControl","_interopRequireDefault","_gradientBar","_flex","_selectControl","_vStack","_utils","_serializer","_constants","_customGradientPickerStyles","GradientAnglePicker","gradientAST","hasGradient","onChange","_gradientAST$orientat","angle","orientation","value","DEFAULT_LINEAR_GRADIENT_ANGLE","onAngleChange","newAngle","serializeGradient","type","_react","createElement","default","GradientTypePicker","onSetLinearGradient","undefined","HORIZONTAL_GRADIENT_ORIENTATION","onSetRadialGradient","restGradientAST","handleOnChange","next","__nextHasNoMarginBottom","className","label","__","labelPosition","options","GRADIENT_OPTIONS","size","CustomGradientPicker","__experimentalIsRenderedInSidebar","getGradientAstWithDefault","background","getLinearGradientRepresentation","controlPoints","colorStops","map","colorStop","color","getStopCssColor","position","parseInt","length","VStack","spacing","newControlPoints","getGradientAstWithControlPoints","Flex","gap","SelectWrapper","AccessoryWrapper","_default","exports"],"sources":["@wordpress/components/src/custom-gradient-picker/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport { type LinearGradientNode } from 'gradient-parser';\n\n/\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\n\n/\n Internal dependencies\n /\nimport AnglePickerControl from '../angle-picker-control';\nimport CustomGradientBar from './gradient-bar';\nimport { Flex } from '../flex';\nimport SelectControl from '../select-control';\nimport { VStack } from '../v-stack';\nimport {\n\tgetGradientAstWithDefault,\n\tgetLinearGradientRepresentation,\n\tgetGradientAstWithControlPoints,\n\tgetStopCssColor,\n} from './utils';\nimport { serializeGradient } from './serializer';\nimport {\n\tDEFAULT_LINEAR_GRADIENT_ANGLE,\n\tHORIZONTAL_GRADIENT_ORIENTATION,\n\tGRADIENT_OPTIONS,\n} from './constants';\nimport {\n\tAccessoryWrapper,\n\tSelectWrapper,\n} from './styles/custom-gradient-picker-styles';\nimport type {\n\tCustomGradientPickerProps,\n\tGradientAnglePickerProps,\n\tGradientTypePickerProps,\n} from './types';\n\nconst GradientAnglePicker = ( {\n\tgradientAST,\n\thasGradient,\n\tonChange,\n}: GradientAnglePickerProps ) => {\n\tconst angle =\n\t\tgradientAST?.orientation?.value ?? DEFAULT_LINEAR_GRADIENT_ANGLE;\n\tconst onAngleChange = ( newAngle: number ) => {\n\t\tonChange(\n\t\t\tserializeGradient( {\n\t\t\t\t...gradientAST,\n\t\t\t\torientation: {\n\t\t\t\t\ttype: 'angular',\n\t\t\t\t\tvalue: `${ newAngle }`,\n\t\t\t\t},\n\t\t\t} )\n\t\t);\n\t};\n\treturn (\n\t\t<AnglePickerControl\n\t\t\tonChange={ onAngleChange }\n\t\t\tvalue={ hasGradient ? angle : '' }\n\t\t/>\n\t);\n};\n\nconst GradientTypePicker = ( {\n\tgradientAST,\n\thasGradient,\n\tonChange,\n}: GradientTypePickerProps ) => {\n\tconst { type } = gradientAST;\n\n\tconst onSetLinearGradient = () => {\n\t\tonChange(\n\t\t\tserializeGradient( {\n\t\t\t\t...gradientAST,\n\t\t\t\torientation: gradientAST.orientation\n\t\t\t\t\t? undefined\n\t\t\t\t\t: HORIZONTAL_GRADIENT_ORIENTATION,\n\t\t\t\ttype: 'linear-gradient',\n\t\t\t} satisfies LinearGradientNode )\n\t\t);\n\t};\n\n\tconst onSetRadialGradient = () => {\n\t\tconst { orientation, ...restGradientAST } = gradientAST;\n\t\tonChange(\n\t\t\tserializeGradient( {\n\t\t\t\t...restGradientAST,\n\t\t\t\ttype: 'radial-gradient',\n\t\t\t} )\n\t\t);\n\t};\n\n\tconst handleOnChange = ( next: string ) => {\n\t\tif ( next === 'linear-gradient' ) {\n\t\t\tonSetLinearGradient();\n\t\t}\n\t\tif ( next === 'radial-gradient' ) {\n\t\t\tonSetRadialGradient();\n\t\t}\n\t};\n\n\treturn (\n\t\t<SelectControl\n\t\t\t__nextHasNoMarginBottom\n\t\t\tclassName=\"components-custom-gradient-picker__type-picker\"\n\t\t\tlabel={ __( 'Type' ) }\n\t\t\tlabelPosition=\"top\"\n\t\t\tonChange={ handleOnChange }\n\t\t\toptions={ GRADIENT_OPTIONS }\n\t\t\tsize=\"__unstable-large\"\n\t\t\tvalue={ hasGradient ? type : undefined }\n\t\t/>\n\t);\n};\n\n/\n CustomGradientPicker is a React component that renders a UI for specifying\n * linear or radial gradients. Radial gradients are displayed in the picker as\n * a slice of the gradient from the center to the outside.\n \n ```jsx\n * import { CustomGradientPicker } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n \n const MyCustomGradientPicker = () => {\n * const [ gradient, setGradient ] = useState();\n \n return (\n * <CustomGradientPicker\n \t\t\tvalue={ gradient }\n \t\t\tonChange={ setGradient }\n * />\n * );\n * };\n * ```\n */\nexport function CustomGradientPicker( {\n\tvalue,\n\tonChange,\n\t__experimentalIsRenderedInSidebar = false,\n}: CustomGradientPickerProps ) {\n\tconst { gradientAST, hasGradient } = getGradientAstWithDefault( value );\n\n\t// On radial gradients the bar should display a linear gradient.\n\t// On radial gradients the bar represents a slice of the gradient from the center until the outside.\n\t// On liner gradients the bar represents the color stops from left to right independently of the angle.\n\tconst background = getLinearGradientRepresentation( gradientAST );\n\n\t// Control points color option may be hex from presets, custom colors will be rgb.\n\t// The position should always be a percentage.\n\tconst controlPoints = gradientAST.colorStops.map( ( colorStop ) => {\n\t\treturn {\n\t\t\tcolor: getStopCssColor( colorStop ),\n\t\t\t// Although it's already been checked by `hasUnsupportedLength` in `getGradientAstWithDefault`,\n\t\t\t// TypeScript doesn't know that `colorStop.length` is not undefined here.\n\t\t\t// @ts-expect-error\n\t\t\tposition: parseInt( colorStop.length.value ),\n\t\t};\n\t} );\n\n\treturn (\n\t\t<VStack spacing={ 4 } className=\"components-custom-gradient-picker\">\n\t\t\t<CustomGradientBar\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tbackground={ background }\n\t\t\t\thasGradient={ hasGradient }\n\t\t\t\tvalue={ controlPoints }\n\t\t\t\tonChange={ ( newControlPoints ) => {\n\t\t\t\t\tonChange(\n\t\t\t\t\t\tserializeGradient(\n\t\t\t\t\t\t\tgetGradientAstWithControlPoints(\n\t\t\t\t\t\t\t\tgradientAST,\n\t\t\t\t\t\t\t\tnewControlPoints\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t)\n\t\t\t\t\t);\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t<Flex\n\t\t\t\tgap={ 3 }\n\t\t\t\tclassName=\"components-custom-gradient-picker__ui-line\"\n\t\t\t>\n\t\t\t\t<SelectWrapper>\n\t\t\t\t\t<GradientTypePicker\n\t\t\t\t\t\tgradientAST={ gradientAST }\n\t\t\t\t\t\thasGradient={ hasGradient }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t</SelectWrapper>\n\t\t\t\t<AccessoryWrapper>\n\t\t\t\t\t{ gradientAST.type === 'linear-gradient' && (\n\t\t\t\t\t\t<GradientAnglePicker\n\t\t\t\t\t\t\tgradientAST={ gradientAST }\n\t\t\t\t\t\t\thasGradient={ hasGradient }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</AccessoryWrapper>\n\t\t\t</Flex>\n\t\t</VStack>\n\t);\n}\n\nexport default CustomGradientPicker;\n"],"mappings":"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","ignoreList":[]}

package/build/custom-select-control/index.js CHANGED Viewed

@@ -8,7 +8,7 @@ exports.StableCustomSelectControl = StableCustomSelectControl;
 exports.default = CustomSelectControl;
 var _react = require("react");
 var _downshift = require("downshift");
-var _classnames = _interopRequireDefault(require("classnames"));
+var _clsx = _interopRequireDefault(require("clsx"));
 var _icons = require("@wordpress/icons");
 var _i18n = require("@wordpress/i18n");
 var _element = require("@wordpress/element");
@@ -124,7 +124,7 @@ function CustomSelectControl(props) {
     delete menuProps['aria-activedescendant'];
   }
   return (0, _react.createElement)("div", {
-    className: (0, _classnames.default)('components-custom-select-control', className)
+    className: (0, _clsx.default)('components-custom-select-control', className)
   }, hideLabelFromVision ? (0, _react.createElement)(_visuallyHidden.VisuallyHidden, {
     as: "label",
     ...getLabelProps()
@@ -166,7 +166,7 @@ function CustomSelectControl(props) {
       item,
       index,
       key: item.key,
-      className: (0, _classnames.default)(item.className, 'components-custom-select-control__item', {
+      className: (0, _clsx.default)(item.className, 'components-custom-select-control__item', {
         'is-highlighted': index === highlightedIndex,
         'has-hint': !!item.__experimentalHint,
         'is-next-40px-default-size': __next40pxDefaultSize

package/build/custom-select-control/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_downshift","require","_classnames","_interopRequireDefault","_icons","_i18n","_element","_visuallyHidden","_selectControlStyles","_chevronDown","_baseControlStyles","_useDeprecatedProps","_inputBase","itemToString","item","name","stateReducer","selectedItem","type","changes","props","items","useSelect","stateChangeTypes","ToggleButtonKeyDownArrowDown","Math","min","indexOf","length","ToggleButtonKeyDownArrowUp","max","CustomSelectControl","__next40pxDefaultSize","className","hideLabelFromVision","label","describedBy","options","onChange","onSelectedItemChange","size","value","_selectedItem","onMouseOver","onMouseOut","onFocus","onBlur","__experimentalShowSelectedHint","useDeprecated36pxDefaultSizeProp","getLabelProps","getToggleButtonProps","getMenuProps","getItemProps","isOpen","highlightedIndex","initialSelectedItem","undefined","getDescribedBy","__","sprintf","menuProps","onKeyDownHandler","useCallback","e","stopPropagation","onKeyDown","startsWith","_react","createElement","classnames","VisuallyHidden","as","StyledLabel","default","suffix","Select","selectSize","__experimentalHint","map","index","key","style","Icon","icon","check","StableCustomSelectControl"],"sources":["@wordpress/components/src/custom-select-control/index.js"],"sourcesContent":["// @ts-nocheck\n/*\n External dependencies\n /\nimport { useSelect } from 'downshift';\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { Icon, check } from '@wordpress/icons';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport { VisuallyHidden } from '../visually-hidden';\nimport { Select as SelectControlSelect } from '../select-control/styles/select-control-styles';\nimport SelectControlChevronDown from '../select-control/chevron-down';\nimport { StyledLabel } from '../base-control/styles/base-control-styles';\nimport { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';\nimport InputBase from '../input-control/input-base';\n\nconst itemToString = ( item ) => item?.name;\n// This is needed so that in Windows, where\n// the menu does not necessarily open on\n// key up/down, you can still switch between\n// options with the menu closed.\nconst stateReducer = (\n\t{ selectedItem },\n\t{ type, changes, props: { items } }\n) => {\n\tswitch ( type ) {\n\t\tcase useSelect.stateChangeTypes.ToggleButtonKeyDownArrowDown:\n\t\t\t// If we already have a selected item, try to select the next one,\n\t\t\t// without circular navigation. Otherwise, select the first item.\n\t\t\treturn {\n\t\t\t\tselectedItem:\n\t\t\t\t\titems[\n\t\t\t\t\t\tselectedItem\n\t\t\t\t\t\t\t? Math.min(\n\t\t\t\t\t\t\t\t\titems.indexOf( selectedItem ) + 1,\n\t\t\t\t\t\t\t\t\titems.length - 1\n\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t: 0\n\t\t\t\t\t],\n\t\t\t};\n\t\tcase useSelect.stateChangeTypes.ToggleButtonKeyDownArrowUp:\n\t\t\t// If we already have a selected item, try to select the previous one,\n\t\t\t// without circular navigation. Otherwise, select the last item.\n\t\t\treturn {\n\t\t\t\tselectedItem:\n\t\t\t\t\titems[\n\t\t\t\t\t\tselectedItem\n\t\t\t\t\t\t\t? Math.max( items.indexOf( selectedItem ) - 1, 0 )\n\t\t\t\t\t\t\t: items.length - 1\n\t\t\t\t\t],\n\t\t\t};\n\t\tdefault:\n\t\t\treturn changes;\n\t}\n};\n\nexport default function CustomSelectControl( props ) {\n\tconst {\n\t\t/* Start opting into the larger default height that will become the default size in a future version. /\n\t\t__next40pxDefaultSize = false,\n\t\tclassName,\n\t\thideLabelFromVision,\n\t\tlabel,\n\t\tdescribedBy,\n\t\toptions: items,\n\t\tonChange: onSelectedItemChange,\n\t\t/* @type {import('../select-control/types').SelectControlProps.size} /\n\t\tsize = 'default',\n\t\tvalue: _selectedItem,\n\t\tonMouseOver,\n\t\tonMouseOut,\n\t\tonFocus,\n\t\tonBlur,\n\t\t__experimentalShowSelectedHint = false,\n\t} = useDeprecated36pxDefaultSizeProp( props );\n\n\tconst {\n\t\tgetLabelProps,\n\t\tgetToggleButtonProps,\n\t\tgetMenuProps,\n\t\tgetItemProps,\n\t\tisOpen,\n\t\thighlightedIndex,\n\t\tselectedItem,\n\t} = useSelect( {\n\t\tinitialSelectedItem: items[ 0 ],\n\t\titems,\n\t\titemToString,\n\t\tonSelectedItemChange,\n\t\t...( typeof _selectedItem !== 'undefined' && _selectedItem !== null\n\t\t\t? { selectedItem: _selectedItem }\n\t\t\t: undefined ),\n\t\tstateReducer,\n\t} );\n\n\tfunction getDescribedBy() {\n\t\tif ( describedBy ) {\n\t\t\treturn describedBy;\n\t\t}\n\n\t\tif ( ! selectedItem ) {\n\t\t\treturn __( 'No selection' );\n\t\t}\n\n\t\t// translators: %s: The selected option.\n\t\treturn sprintf( __( 'Currently selected: %s' ), selectedItem.name );\n\t}\n\n\tconst menuProps = getMenuProps( {\n\t\tclassName: 'components-custom-select-control__menu',\n\t\t'aria-hidden': ! isOpen,\n\t} );\n\n\tconst onKeyDownHandler = useCallback(\n\t\t( e ) => {\n\t\t\te.stopPropagation();\n\t\t\tmenuProps?.onKeyDown?.( e );\n\t\t},\n\t\t[ menuProps ]\n\t);\n\n\t// We need this here, because the null active descendant is not fully ARIA compliant.\n\tif (\n\t\tmenuProps[ 'aria-activedescendant' ]?.startsWith( 'downshift-null' )\n\t) {\n\t\tdelete menuProps[ 'aria-activedescendant' ];\n\t}\n\treturn (\n\t\t<div\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-custom-select-control',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t>\n\t\t\t{ hideLabelFromVision ? (\n\t\t\t\t<VisuallyHidden as=\"label\" { ...getLabelProps() }>\n\t\t\t\t\t{ label }\n\t\t\t\t</VisuallyHidden>\n\t\t\t) : (\n\t\t\t\t/ eslint-disable-next-line jsx-a11y/label-has-associated-control, jsx-a11y/label-has-for /\n\t\t\t\t<StyledLabel\n\t\t\t\t\t{ ...getLabelProps( {\n\t\t\t\t\t\tclassName: 'components-custom-select-control__label',\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t{ label }\n\t\t\t\t</StyledLabel>\n\t\t\t) }\n\t\t\t<InputBase\n\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\tsize={ size }\n\t\t\t\tsuffix={ <SelectControlChevronDown /> }\n\t\t\t>\n\t\t\t\t<SelectControlSelect\n\t\t\t\t\tonMouseOver={ onMouseOver }\n\t\t\t\t\tonMouseOut={ onMouseOut }\n\t\t\t\t\tas=\"button\"\n\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\tonBlur={ onBlur }\n\t\t\t\t\tselectSize={ size }\n\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t{ ...getToggleButtonProps( {\n\t\t\t\t\t\t// This is needed because some speech recognition software don't support `aria-labelledby`.\n\t\t\t\t\t\t'aria-label': label,\n\t\t\t\t\t\t'aria-labelledby': undefined,\n\t\t\t\t\t\tclassName: 'components-custom-select-control__button',\n\t\t\t\t\t\tdescribedBy: getDescribedBy(),\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t{ itemToString( selectedItem ) }\n\t\t\t\t\t{ __experimentalShowSelectedHint &&\n\t\t\t\t\t\tselectedItem.__experimentalHint && (\n\t\t\t\t\t\t\t<span className=\"components-custom-select-control__hint\">\n\t\t\t\t\t\t\t\t{ selectedItem.__experimentalHint }\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t) }\n\t\t\t\t</SelectControlSelect>\n\t\t\t\t<div className=\"components-custom-select-control__menu-wrapper\">\n\t\t\t\t\t{ / eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */ }\n\t\t\t\t\t<ul { ...menuProps } onKeyDown={ onKeyDownHandler }>\n\t\t\t\t\t\t{ isOpen &&\n\t\t\t\t\t\t\titems.map( ( item, index ) => (\n\t\t\t\t\t\t\t\t// eslint-disable-next-line react/jsx-key\n\t\t\t\t\t\t\t\t<li\n\t\t\t\t\t\t\t\t\t{ ...getItemProps( {\n\t\t\t\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\tkey: item.key,\n\t\t\t\t\t\t\t\t\t\tclassName: classnames(\n\t\t\t\t\t\t\t\t\t\t\titem.className,\n\t\t\t\t\t\t\t\t\t\t\t'components-custom-select-control__item',\n\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t'is-highlighted':\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex === highlightedIndex,\n\t\t\t\t\t\t\t\t\t\t\t\t'has-hint':\n\t\t\t\t\t\t\t\t\t\t\t\t\t!! item.__experimentalHint,\n\t\t\t\t\t\t\t\t\t\t\t\t'is-next-40px-default-size':\n\t\t\t\t\t\t\t\t\t\t\t\t\t__next40pxDefaultSize,\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\tstyle: item.style,\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\t\t{ item.name }\n\t\t\t\t\t\t\t\t\t{ item.__experimentalHint && (\n\t\t\t\t\t\t\t\t\t\t<span className=\"components-custom-select-control__item-hint\">\n\t\t\t\t\t\t\t\t\t\t\t{ item.__experimentalHint }\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{ item === selectedItem && (\n\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\ticon={ check }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-custom-select-control__item-icon\"\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</li>\n\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t</ul>\n\t\t\t\t</div>\n\t\t\t</InputBase>\n\t\t</div>\n\t);\n}\n\nexport function StableCustomSelectControl( props ) {\n\treturn (\n\t\t<CustomSelectControl\n\t\t\t{ ...props }\n\t\t\t__experimentalShowSelectedHint={ false }\n\t\t/>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"names":["_downshift","require","_clsx","_interopRequireDefault","_icons","_i18n","_element","_visuallyHidden","_selectControlStyles","_chevronDown","_baseControlStyles","_useDeprecatedProps","_inputBase","itemToString","item","name","stateReducer","selectedItem","type","changes","props","items","useSelect","stateChangeTypes","ToggleButtonKeyDownArrowDown","Math","min","indexOf","length","ToggleButtonKeyDownArrowUp","max","CustomSelectControl","__next40pxDefaultSize","className","hideLabelFromVision","label","describedBy","options","onChange","onSelectedItemChange","size","value","_selectedItem","onMouseOver","onMouseOut","onFocus","onBlur","__experimentalShowSelectedHint","useDeprecated36pxDefaultSizeProp","getLabelProps","getToggleButtonProps","getMenuProps","getItemProps","isOpen","highlightedIndex","initialSelectedItem","undefined","getDescribedBy","__","sprintf","menuProps","onKeyDownHandler","useCallback","e","stopPropagation","onKeyDown","startsWith","_react","createElement","clsx","VisuallyHidden","as","StyledLabel","default","suffix","Select","selectSize","__experimentalHint","map","index","key","style","Icon","icon","check","StableCustomSelectControl"],"sources":["@wordpress/components/src/custom-select-control/index.js"],"sourcesContent":["// @ts-nocheck\n/*\n External dependencies\n /\nimport { useSelect } from 'downshift';\nimport clsx from 'clsx';\n\n/\n WordPress dependencies\n /\nimport { Icon, check } from '@wordpress/icons';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport { VisuallyHidden } from '../visually-hidden';\nimport { Select as SelectControlSelect } from '../select-control/styles/select-control-styles';\nimport SelectControlChevronDown from '../select-control/chevron-down';\nimport { StyledLabel } from '../base-control/styles/base-control-styles';\nimport { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';\nimport InputBase from '../input-control/input-base';\n\nconst itemToString = ( item ) => item?.name;\n// This is needed so that in Windows, where\n// the menu does not necessarily open on\n// key up/down, you can still switch between\n// options with the menu closed.\nconst stateReducer = (\n\t{ selectedItem },\n\t{ type, changes, props: { items } }\n) => {\n\tswitch ( type ) {\n\t\tcase useSelect.stateChangeTypes.ToggleButtonKeyDownArrowDown:\n\t\t\t// If we already have a selected item, try to select the next one,\n\t\t\t// without circular navigation. Otherwise, select the first item.\n\t\t\treturn {\n\t\t\t\tselectedItem:\n\t\t\t\t\titems[\n\t\t\t\t\t\tselectedItem\n\t\t\t\t\t\t\t? Math.min(\n\t\t\t\t\t\t\t\t\titems.indexOf( selectedItem ) + 1,\n\t\t\t\t\t\t\t\t\titems.length - 1\n\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t: 0\n\t\t\t\t\t],\n\t\t\t};\n\t\tcase useSelect.stateChangeTypes.ToggleButtonKeyDownArrowUp:\n\t\t\t// If we already have a selected item, try to select the previous one,\n\t\t\t// without circular navigation. Otherwise, select the last item.\n\t\t\treturn {\n\t\t\t\tselectedItem:\n\t\t\t\t\titems[\n\t\t\t\t\t\tselectedItem\n\t\t\t\t\t\t\t? Math.max( items.indexOf( selectedItem ) - 1, 0 )\n\t\t\t\t\t\t\t: items.length - 1\n\t\t\t\t\t],\n\t\t\t};\n\t\tdefault:\n\t\t\treturn changes;\n\t}\n};\n\nexport default function CustomSelectControl( props ) {\n\tconst {\n\t\t/* Start opting into the larger default height that will become the default size in a future version. /\n\t\t__next40pxDefaultSize = false,\n\t\tclassName,\n\t\thideLabelFromVision,\n\t\tlabel,\n\t\tdescribedBy,\n\t\toptions: items,\n\t\tonChange: onSelectedItemChange,\n\t\t/* @type {import('../select-control/types').SelectControlProps.size} /\n\t\tsize = 'default',\n\t\tvalue: _selectedItem,\n\t\tonMouseOver,\n\t\tonMouseOut,\n\t\tonFocus,\n\t\tonBlur,\n\t\t__experimentalShowSelectedHint = false,\n\t} = useDeprecated36pxDefaultSizeProp( props );\n\n\tconst {\n\t\tgetLabelProps,\n\t\tgetToggleButtonProps,\n\t\tgetMenuProps,\n\t\tgetItemProps,\n\t\tisOpen,\n\t\thighlightedIndex,\n\t\tselectedItem,\n\t} = useSelect( {\n\t\tinitialSelectedItem: items[ 0 ],\n\t\titems,\n\t\titemToString,\n\t\tonSelectedItemChange,\n\t\t...( typeof _selectedItem !== 'undefined' && _selectedItem !== null\n\t\t\t? { selectedItem: _selectedItem }\n\t\t\t: undefined ),\n\t\tstateReducer,\n\t} );\n\n\tfunction getDescribedBy() {\n\t\tif ( describedBy ) {\n\t\t\treturn describedBy;\n\t\t}\n\n\t\tif ( ! selectedItem ) {\n\t\t\treturn __( 'No selection' );\n\t\t}\n\n\t\t// translators: %s: The selected option.\n\t\treturn sprintf( __( 'Currently selected: %s' ), selectedItem.name );\n\t}\n\n\tconst menuProps = getMenuProps( {\n\t\tclassName: 'components-custom-select-control__menu',\n\t\t'aria-hidden': ! isOpen,\n\t} );\n\n\tconst onKeyDownHandler = useCallback(\n\t\t( e ) => {\n\t\t\te.stopPropagation();\n\t\t\tmenuProps?.onKeyDown?.( e );\n\t\t},\n\t\t[ menuProps ]\n\t);\n\n\t// We need this here, because the null active descendant is not fully ARIA compliant.\n\tif (\n\t\tmenuProps[ 'aria-activedescendant' ]?.startsWith( 'downshift-null' )\n\t) {\n\t\tdelete menuProps[ 'aria-activedescendant' ];\n\t}\n\treturn (\n\t\t<div\n\t\t\tclassName={ clsx( 'components-custom-select-control', className ) }\n\t\t>\n\t\t\t{ hideLabelFromVision ? (\n\t\t\t\t<VisuallyHidden as=\"label\" { ...getLabelProps() }>\n\t\t\t\t\t{ label }\n\t\t\t\t</VisuallyHidden>\n\t\t\t) : (\n\t\t\t\t/ eslint-disable-next-line jsx-a11y/label-has-associated-control, jsx-a11y/label-has-for /\n\t\t\t\t<StyledLabel\n\t\t\t\t\t{ ...getLabelProps( {\n\t\t\t\t\t\tclassName: 'components-custom-select-control__label',\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t{ label }\n\t\t\t\t</StyledLabel>\n\t\t\t) }\n\t\t\t<InputBase\n\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\tsize={ size }\n\t\t\t\tsuffix={ <SelectControlChevronDown /> }\n\t\t\t>\n\t\t\t\t<SelectControlSelect\n\t\t\t\t\tonMouseOver={ onMouseOver }\n\t\t\t\t\tonMouseOut={ onMouseOut }\n\t\t\t\t\tas=\"button\"\n\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\tonBlur={ onBlur }\n\t\t\t\t\tselectSize={ size }\n\t\t\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\t\t\t{ ...getToggleButtonProps( {\n\t\t\t\t\t\t// This is needed because some speech recognition software don't support `aria-labelledby`.\n\t\t\t\t\t\t'aria-label': label,\n\t\t\t\t\t\t'aria-labelledby': undefined,\n\t\t\t\t\t\tclassName: 'components-custom-select-control__button',\n\t\t\t\t\t\tdescribedBy: getDescribedBy(),\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t{ itemToString( selectedItem ) }\n\t\t\t\t\t{ __experimentalShowSelectedHint &&\n\t\t\t\t\t\tselectedItem.__experimentalHint && (\n\t\t\t\t\t\t\t<span className=\"components-custom-select-control__hint\">\n\t\t\t\t\t\t\t\t{ selectedItem.__experimentalHint }\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t) }\n\t\t\t\t</SelectControlSelect>\n\t\t\t\t<div className=\"components-custom-select-control__menu-wrapper\">\n\t\t\t\t\t{ / eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */ }\n\t\t\t\t\t<ul { ...menuProps } onKeyDown={ onKeyDownHandler }>\n\t\t\t\t\t\t{ isOpen &&\n\t\t\t\t\t\t\titems.map( ( item, index ) => (\n\t\t\t\t\t\t\t\t// eslint-disable-next-line react/jsx-key\n\t\t\t\t\t\t\t\t<li\n\t\t\t\t\t\t\t\t\t{ ...getItemProps( {\n\t\t\t\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\tkey: item.key,\n\t\t\t\t\t\t\t\t\t\tclassName: clsx(\n\t\t\t\t\t\t\t\t\t\t\titem.className,\n\t\t\t\t\t\t\t\t\t\t\t'components-custom-select-control__item',\n\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t'is-highlighted':\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex === highlightedIndex,\n\t\t\t\t\t\t\t\t\t\t\t\t'has-hint':\n\t\t\t\t\t\t\t\t\t\t\t\t\t!! item.__experimentalHint,\n\t\t\t\t\t\t\t\t\t\t\t\t'is-next-40px-default-size':\n\t\t\t\t\t\t\t\t\t\t\t\t\t__next40pxDefaultSize,\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\tstyle: item.style,\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\t\t{ item.name }\n\t\t\t\t\t\t\t\t\t{ item.__experimentalHint && (\n\t\t\t\t\t\t\t\t\t\t<span className=\"components-custom-select-control__item-hint\">\n\t\t\t\t\t\t\t\t\t\t\t{ item.__experimentalHint }\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{ item === selectedItem && (\n\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\ticon={ check }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-custom-select-control__item-icon\"\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</li>\n\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t</ul>\n\t\t\t\t</div>\n\t\t\t</InputBase>\n\t\t</div>\n\t);\n}\n\nexport function StableCustomSelectControl( props ) {\n\treturn (\n\t\t<CustomSelectControl\n\t\t\t{ ...props }\n\t\t\t__experimentalShowSelectedHint={ false }\n\t\t/>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}

package/build/custom-select-control-v2/legacy-component/index.js CHANGED Viewed

@@ -41,7 +41,9 @@ function CustomSelectControl(props) {
   // Forward props + store from v2 implementation
   const store = Ariakit.useSelectStore({
     async setValue(nextValue) {
-      if (!onChange) return;
+      if (!onChange) {
+        return;
+      }
       // Executes the logic in a microtask after the popup is closed.
       // This is simply to ensure the isOpen state matches that in Downshift.

package/build/custom-select-control-v2/legacy-component/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["Ariakit","_interopRequireWildcard","require","_element","_customSelect","_interopRequireDefault","_item","Styled","_context","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","CustomSelectControl","props","__experimentalShowSelectedHint","__next40pxDefaultSize","options","onChange","size","value","restProps","store","useSelectStore","setValue","nextValue","Promise","resolve","state","getState","changeObject","highlightedIndex","renderedItems","findIndex","item","inputValue","isOpen","open","selectedItem","name","key","type","children","map","__experimentalHint","rest","withHint","_react","createElement","WithHintWrapper","ExperimentalHintItem","className","renderSelectedValueHint","currentValue","currentHint","find","Fragment","SelectedExperimentalHintItem","contextSystemValue","useMemo","selectedSize","CustomSelectControlButton","_overrides","translatedProps","describedBy","renderSelectedValue","undefined","ContextSystemProvider","_default","exports"],"sources":["@wordpress/components/src/custom-select-control-v2/legacy-component/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\n// eslint-disable-next-line no-restricted-imports\nimport as Ariakit from '@ariakit/react';\n/*\n WordPress dependencies\n /\nimport { useMemo } from '@wordpress/element';\n/\n Internal dependencies\n /\nimport _CustomSelect from '../custom-select';\nimport CustomSelectItem from '../item';\nimport type { LegacyCustomSelectProps } from '../types';\nimport as Styled from '../styles';\nimport { ContextSystemProvider } from '../../context';\n\nfunction CustomSelectControl( props: LegacyCustomSelectProps ) {\n\tconst {\n\t\t__experimentalShowSelectedHint,\n\t\t__next40pxDefaultSize = false,\n\t\toptions,\n\t\tonChange,\n\t\tsize = 'default',\n\t\tvalue,\n\t\t...restProps\n\t} = props;\n\n\t// Forward props + store from v2 implementation\n\tconst store = Ariakit.useSelectStore( {\n\t\tasync setValue( nextValue ) {\n\t\t\tif ( ! onChange ) ~~return~~;\n\n\t\t\t// Executes the logic in a microtask after the popup is closed.\n\t\t\t// This is simply to ensure the isOpen state matches that in Downshift.\n\t\t\tawait Promise.resolve();\n\t\t\tconst state = store.getState();\n\n\t\t\tconst changeObject = {\n\t\t\t\thighlightedIndex: state.renderedItems.findIndex(\n\t\t\t\t\t( item ) => item.value === nextValue\n\t\t\t\t),\n\t\t\t\tinputValue: '',\n\t\t\t\tisOpen: state.open,\n\t\t\t\tselectedItem: {\n\t\t\t\t\tname: nextValue as string,\n\t\t\t\t\tkey: nextValue as string,\n\t\t\t\t},\n\t\t\t\ttype: '',\n\t\t\t};\n\t\t\tonChange( changeObject );\n\t\t},\n\t} );\n\n\tconst children = options.map(\n\t\t( { name, key, __experimentalHint, ...rest } ) => {\n\t\t\tconst withHint = (\n\t\t\t\t<Styled.WithHintWrapper>\n\t\t\t\t\t<span>{ name }</span>\n\t\t\t\t\t<Styled.ExperimentalHintItem className=\"components-custom-select-control__item-hint\">\n\t\t\t\t\t\t{ __experimentalHint }\n\t\t\t\t\t</Styled.ExperimentalHintItem>\n\t\t\t\t</Styled.WithHintWrapper>\n\t\t\t);\n\n\t\t\treturn (\n\t\t\t\t<CustomSelectItem\n\t\t\t\t\tkey={ key }\n\t\t\t\t\tvalue={ name }\n\t\t\t\t\tchildren={ __experimentalHint ? withHint : name }\n\t\t\t\t\t{ ...rest }\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\t);\n\n\tconst renderSelectedValueHint = () => {\n\t\tconst { value: currentValue } = store.getState();\n\n\t\tconst currentHint = options?.find(\n\t\t\t( { name } ) => currentValue === name\n\t\t);\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ currentValue }\n\t\t\t\t<Styled.SelectedExperimentalHintItem className=\"components-custom-select-control__hint\">\n\t\t\t\t\t{ currentHint?.__experimentalHint }\n\t\t\t\t</Styled.SelectedExperimentalHintItem>\n\t\t\t</>\n\t\t);\n\t};\n\n\t// translate legacy button sizing\n\tconst contextSystemValue = useMemo( () => {\n\t\tlet selectedSize;\n\n\t\tif (\n\t\t\t( __next40pxDefaultSize && size === 'default' ) \|\|\n\t\t\tsize === '__unstable-large'\n\t\t) {\n\t\t\tselectedSize = 'default';\n\t\t} else if ( ! __next40pxDefaultSize && size === 'default' ) {\n\t\t\tselectedSize = 'compact';\n\t\t} else {\n\t\t\tselectedSize = size;\n\t\t}\n\n\t\treturn {\n\t\t\tCustomSelectControlButton: { _overrides: { size: selectedSize } },\n\t\t};\n\t}, [ __next40pxDefaultSize, size ] );\n\n\tconst translatedProps = {\n\t\t'aria-describedby': props.describedBy,\n\t\tchildren,\n\t\trenderSelectedValue: __experimentalShowSelectedHint\n\t\t\t? renderSelectedValueHint\n\t\t\t: undefined,\n\t\t...restProps,\n\t};\n\n\treturn (\n\t\t<ContextSystemProvider value={ contextSystemValue }>\n\t\t\t<_CustomSelect { ...translatedProps } store={ store } />\n\t\t</ContextSystemProvider>\n\t);\n}\n\nexport default CustomSelectControl;\n"],"mappings":";;;;;;;;AAIA,IAAAA,OAAA,GAAAC,uBAAA,CAAAC,OAAA;AAIA,IAAAC,QAAA,GAAAD,OAAA;AAIA,IAAAE,aAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,KAAA,GAAAD,sBAAA,CAAAH,OAAA;AAEA,IAAAK,MAAA,GAAAN,uBAAA,CAAAC,OAAA;AACA,IAAAM,QAAA,GAAAN,OAAA;AAAsD,SAAAO,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAT,wBAAAS,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAhBtD;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAOA,SAASW,mBAAmBA,CAAEC,KAA8B,EAAG;EAC9D,MAAM;IACLC,8BAA8B;IAC9BC,qBAAqB,GAAG,KAAK;IAC7BC,OAAO;IACPC,QAAQ;IACRC,IAAI,GAAG,SAAS;IAChBC,KAAK;IACL,GAAGC;EACJ,CAAC,GAAGP,KAAK;;EAET;EACA,MAAMQ,KAAK,GAAGtC,OAAO,CAACuC,cAAc,CAAE;IACrC,MAAMC,QAAQA,CAAEC,SAAS,EAAG;MAC3B,IAAK,CAAEP,QAAQ,EAAG;;~~MAElB~~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","ignoreList":[]}
1	+ {"version":3,"names":["Ariakit","_interopRequireWildcard","require","_element","_customSelect","_interopRequireDefault","_item","Styled","_context","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","CustomSelectControl","props","__experimentalShowSelectedHint","__next40pxDefaultSize","options","onChange","size","value","restProps","store","useSelectStore","setValue","nextValue","Promise","resolve","state","getState","changeObject","highlightedIndex","renderedItems","findIndex","item","inputValue","isOpen","open","selectedItem","name","key","type","children","map","__experimentalHint","rest","withHint","_react","createElement","WithHintWrapper","ExperimentalHintItem","className","renderSelectedValueHint","currentValue","currentHint","find","Fragment","SelectedExperimentalHintItem","contextSystemValue","useMemo","selectedSize","CustomSelectControlButton","_overrides","translatedProps","describedBy","renderSelectedValue","undefined","ContextSystemProvider","_default","exports"],"sources":["@wordpress/components/src/custom-select-control-v2/legacy-component/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\n// eslint-disable-next-line no-restricted-imports\nimport as Ariakit from '@ariakit/react';\n/*\n WordPress dependencies\n /\nimport { useMemo } from '@wordpress/element';\n/\n Internal dependencies\n /\nimport _CustomSelect from '../custom-select';\nimport CustomSelectItem from '../item';\nimport type { LegacyCustomSelectProps } from '../types';\nimport as Styled from '../styles';\nimport { ContextSystemProvider } from '../../context';\n\nfunction CustomSelectControl( props: LegacyCustomSelectProps ) {\n\tconst {\n\t\t__experimentalShowSelectedHint,\n\t\t__next40pxDefaultSize = false,\n\t\toptions,\n\t\tonChange,\n\t\tsize = 'default',\n\t\tvalue,\n\t\t...restProps\n\t} = props;\n\n\t// Forward props + store from v2 implementation\n\tconst store = Ariakit.useSelectStore( {\n\t\tasync setValue( nextValue ) {\n\t\t\tif ( ! onChange ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Executes the logic in a microtask after the popup is closed.\n\t\t\t// This is simply to ensure the isOpen state matches that in Downshift.\n\t\t\tawait Promise.resolve();\n\t\t\tconst state = store.getState();\n\n\t\t\tconst changeObject = {\n\t\t\t\thighlightedIndex: state.renderedItems.findIndex(\n\t\t\t\t\t( item ) => item.value === nextValue\n\t\t\t\t),\n\t\t\t\tinputValue: '',\n\t\t\t\tisOpen: state.open,\n\t\t\t\tselectedItem: {\n\t\t\t\t\tname: nextValue as string,\n\t\t\t\t\tkey: nextValue as string,\n\t\t\t\t},\n\t\t\t\ttype: '',\n\t\t\t};\n\t\t\tonChange( changeObject );\n\t\t},\n\t} );\n\n\tconst children = options.map(\n\t\t( { name, key, __experimentalHint, ...rest } ) => {\n\t\t\tconst withHint = (\n\t\t\t\t<Styled.WithHintWrapper>\n\t\t\t\t\t<span>{ name }</span>\n\t\t\t\t\t<Styled.ExperimentalHintItem className=\"components-custom-select-control__item-hint\">\n\t\t\t\t\t\t{ __experimentalHint }\n\t\t\t\t\t</Styled.ExperimentalHintItem>\n\t\t\t\t</Styled.WithHintWrapper>\n\t\t\t);\n\n\t\t\treturn (\n\t\t\t\t<CustomSelectItem\n\t\t\t\t\tkey={ key }\n\t\t\t\t\tvalue={ name }\n\t\t\t\t\tchildren={ __experimentalHint ? withHint : name }\n\t\t\t\t\t{ ...rest }\n\t\t\t\t/>\n\t\t\t);\n\t\t}\n\t);\n\n\tconst renderSelectedValueHint = () => {\n\t\tconst { value: currentValue } = store.getState();\n\n\t\tconst currentHint = options?.find(\n\t\t\t( { name } ) => currentValue === name\n\t\t);\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ currentValue }\n\t\t\t\t<Styled.SelectedExperimentalHintItem className=\"components-custom-select-control__hint\">\n\t\t\t\t\t{ currentHint?.__experimentalHint }\n\t\t\t\t</Styled.SelectedExperimentalHintItem>\n\t\t\t</>\n\t\t);\n\t};\n\n\t// translate legacy button sizing\n\tconst contextSystemValue = useMemo( () => {\n\t\tlet selectedSize;\n\n\t\tif (\n\t\t\t( __next40pxDefaultSize && size === 'default' ) \|\|\n\t\t\tsize === '__unstable-large'\n\t\t) {\n\t\t\tselectedSize = 'default';\n\t\t} else if ( ! __next40pxDefaultSize && size === 'default' ) {\n\t\t\tselectedSize = 'compact';\n\t\t} else {\n\t\t\tselectedSize = size;\n\t\t}\n\n\t\treturn {\n\t\t\tCustomSelectControlButton: { _overrides: { size: selectedSize } },\n\t\t};\n\t}, [ __next40pxDefaultSize, size ] );\n\n\tconst translatedProps = {\n\t\t'aria-describedby': props.describedBy,\n\t\tchildren,\n\t\trenderSelectedValue: __experimentalShowSelectedHint\n\t\t\t? renderSelectedValueHint\n\t\t\t: undefined,\n\t\t...restProps,\n\t};\n\n\treturn (\n\t\t<ContextSystemProvider value={ contextSystemValue }>\n\t\t\t<_CustomSelect { ...translatedProps } store={ store } />\n\t\t</ContextSystemProvider>\n\t);\n}\n\nexport default CustomSelectControl;\n"],"mappings":"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","ignoreList":[]}

package/build/dimension-control/index.js CHANGED Viewed

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.DimensionControl = DimensionControl;
 exports.default = void 0;
 var _react = require("react");
-var _classnames = _interopRequireDefault(require("classnames"));
+var _clsx = _interopRequireDefault(require("clsx"));
 var _i18n = require("@wordpress/i18n");
 var _icon = _interopRequireDefault(require("../icon"));
 var _selectControl = _interopRequireDefault(require("../select-control"));
@@ -85,7 +85,7 @@ function DimensionControl(props) {
   }), label);
   return (0, _react.createElement)(_selectControl.default, {
     __next40pxDefaultSize: __next40pxDefaultSize,
-    className: (0, _classnames.default)(className, 'block-editor-dimension-control'),
+    className: (0, _clsx.default)(className, 'block-editor-dimension-control'),
     label: selectLabel,
     hideLabelFromVision: false,
     value: value,

package/build/dimension-control/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["~~_classnames~~","_interopRequireDefault","require","_i18n","_icon","_selectControl","_sizes","_interopRequireWildcard","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","DimensionControl","props","__next40pxDefaultSize","label","value","sizes","sizesTable","icon","onChange","className","onChangeSpacingSize","val","theSize","findSizeBySlug","slug","undefined","formatSizesAsOptions","theSizes","options","map","name","__","selectLabel","_react","createElement","Fragment","~~classnames~~","hideLabelFromVision","_default","exports"],"sources":["@wordpress/components/src/dimension-control/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport ~~classnames~~ from '~~classnames~~';\n\n/\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\n\n/\n Internal dependencies\n /\nimport Icon from '../icon';\nimport SelectControl from '../select-control';\nimport sizesTable, { findSizeBySlug } from './sizes';\nimport type { DimensionControlProps, Size } from './types';\nimport type { SelectControlSingleSelectionProps } from '../select-control/types';\n\n/\n `DimensionControl` is a component designed to provide a UI to control spacing and/or dimensions.\n \n This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.\n \n ```jsx\n * import { __experimentalDimensionControl as DimensionControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n \n export default function MyCustomDimensionControl() {\n * \tconst [ paddingSize, setPaddingSize ] = useState( '' );\n \n \treturn (\n * \t\t<DimensionControl\n * \t\t\tlabel={ 'Padding' }\n * \t\t\ticon={ 'desktop' }\n * \t\t\tonChange={ ( value ) => setPaddingSize( value ) }\n * \t\t\tvalue={ paddingSize }\n * \t\t/>\n * \t);\n * }\n * ```\n */\nexport function DimensionControl( props: DimensionControlProps ) {\n\tconst {\n\t\t__next40pxDefaultSize = false,\n\t\tlabel,\n\t\tvalue,\n\t\tsizes = sizesTable,\n\t\ticon,\n\t\tonChange,\n\t\tclassName = '',\n\t} = props;\n\n\tconst onChangeSpacingSize: SelectControlSingleSelectionProps[ 'onChange' ] =\n\t\t( val ) => {\n\t\t\tconst theSize = findSizeBySlug( sizes, val );\n\n\t\t\tif ( ! theSize \|\| value === theSize.slug ) {\n\t\t\t\tonChange?.( undefined );\n\t\t\t} else if ( typeof onChange === 'function' ) {\n\t\t\t\tonChange( theSize.slug );\n\t\t\t}\n\t\t};\n\n\tconst formatSizesAsOptions = ( theSizes: Size[] ) => {\n\t\tconst options = theSizes.map( ( { name, slug } ) => ( {\n\t\t\tlabel: name,\n\t\t\tvalue: slug,\n\t\t} ) );\n\n\t\treturn [\n\t\t\t{\n\t\t\t\tlabel: __( 'Default' ),\n\t\t\t\tvalue: '',\n\t\t\t},\n\t\t\t...options,\n\t\t];\n\t};\n\n\tconst selectLabel = (\n\t\t<>\n\t\t\t{ icon && <Icon icon={ icon } /> }\n\t\t\t{ label }\n\t\t</>\n\t);\n\n\treturn (\n\t\t<SelectControl\n\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\tclassName={ ~~classnames~~(~~\n\t\t\t\tclassName,\n\t\t\t\t~~'block-editor-dimension-control'~~\n\t\t\t~~) }\n\t\t\tlabel={ selectLabel }\n\t\t\thideLabelFromVision={ false }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChangeSpacingSize }\n\t\t\toptions={ formatSizesAsOptions( sizes ) }\n\t\t/>\n\t);\n}\n\nexport default DimensionControl;\n"],"mappings":";;;;;;;;;AAGA,IAAAA,~~WAAA~~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~~mBAAU~~,~~EACrBjB~~,SAAS,~~EACT~~,~~gCACD~~,CAAG;~~IACHN~~,KAAK,EAAGmB,WAAa;IACrBK,mBAAmB,EAAG,KAAO;IAC7BvB,KAAK,EAAGA,KAAO;IACfI,QAAQ,EAAGE,mBAAqB;IAChCQ,OAAO,EAAGF,oBAAoB,CAAEX,KAAM;EAAG,CACzC,CAAC;AAEJ;AAAC,IAAAuB,QAAA,GAAAC,OAAA,CAAA3C,OAAA,GAEcc,gBAAgB","ignoreList":[]}
1	+ {"version":3,"names":["_clsx","_interopRequireDefault","require","_i18n","_icon","_selectControl","_sizes","_interopRequireWildcard","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","DimensionControl","props","__next40pxDefaultSize","label","value","sizes","sizesTable","icon","onChange","className","onChangeSpacingSize","val","theSize","findSizeBySlug","slug","undefined","formatSizesAsOptions","theSizes","options","map","name","__","selectLabel","_react","createElement","Fragment","clsx","hideLabelFromVision","_default","exports"],"sources":["@wordpress/components/src/dimension-control/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport clsx from 'clsx';\n\n/\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\n\n/\n Internal dependencies\n /\nimport Icon from '../icon';\nimport SelectControl from '../select-control';\nimport sizesTable, { findSizeBySlug } from './sizes';\nimport type { DimensionControlProps, Size } from './types';\nimport type { SelectControlSingleSelectionProps } from '../select-control/types';\n\n/\n `DimensionControl` is a component designed to provide a UI to control spacing and/or dimensions.\n \n This feature is still experimental. “Experimental” means this is an early implementation subject to drastic and breaking changes.\n \n ```jsx\n * import { __experimentalDimensionControl as DimensionControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n \n export default function MyCustomDimensionControl() {\n * \tconst [ paddingSize, setPaddingSize ] = useState( '' );\n \n \treturn (\n * \t\t<DimensionControl\n * \t\t\tlabel={ 'Padding' }\n * \t\t\ticon={ 'desktop' }\n * \t\t\tonChange={ ( value ) => setPaddingSize( value ) }\n * \t\t\tvalue={ paddingSize }\n * \t\t/>\n * \t);\n * }\n * ```\n */\nexport function DimensionControl( props: DimensionControlProps ) {\n\tconst {\n\t\t__next40pxDefaultSize = false,\n\t\tlabel,\n\t\tvalue,\n\t\tsizes = sizesTable,\n\t\ticon,\n\t\tonChange,\n\t\tclassName = '',\n\t} = props;\n\n\tconst onChangeSpacingSize: SelectControlSingleSelectionProps[ 'onChange' ] =\n\t\t( val ) => {\n\t\t\tconst theSize = findSizeBySlug( sizes, val );\n\n\t\t\tif ( ! theSize \|\| value === theSize.slug ) {\n\t\t\t\tonChange?.( undefined );\n\t\t\t} else if ( typeof onChange === 'function' ) {\n\t\t\t\tonChange( theSize.slug );\n\t\t\t}\n\t\t};\n\n\tconst formatSizesAsOptions = ( theSizes: Size[] ) => {\n\t\tconst options = theSizes.map( ( { name, slug } ) => ( {\n\t\t\tlabel: name,\n\t\t\tvalue: slug,\n\t\t} ) );\n\n\t\treturn [\n\t\t\t{\n\t\t\t\tlabel: __( 'Default' ),\n\t\t\t\tvalue: '',\n\t\t\t},\n\t\t\t...options,\n\t\t];\n\t};\n\n\tconst selectLabel = (\n\t\t<>\n\t\t\t{ icon && <Icon icon={ icon } /> }\n\t\t\t{ label }\n\t\t</>\n\t);\n\n\treturn (\n\t\t<SelectControl\n\t\t\t__next40pxDefaultSize={ __next40pxDefaultSize }\n\t\t\tclassName={ clsx( className, 'block-editor-dimension-control' ) }\n\t\t\tlabel={ selectLabel }\n\t\t\thideLabelFromVision={ false }\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChangeSpacingSize }\n\t\t\toptions={ formatSizesAsOptions( sizes ) }\n\t\t/>\n\t);\n}\n\nexport default DimensionControl;\n"],"mappings":"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","ignoreList":[]}

package/build/drop-zone/index.js CHANGED Viewed

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.DropZoneComponent = DropZoneComponent;
 exports.default = void 0;
 var _react = require("react");
-var _classnames = _interopRequireDefault(require("classnames"));
+var _clsx = _interopRequireDefault(require("clsx"));
 var _i18n = require("@wordpress/i18n");
 var _element = require("@wordpress/element");
 var _icons = require("@wordpress/icons");
@@ -26,6 +26,75 @@ var _animation = require("../animation");
  * Internal dependencies
  */
+const backdrop = {
+  hidden: {
+    opacity: 0
+  },
+  show: {
+    opacity: 1,
+    transition: {
+      type: 'tween',
+      duration: 0.2,
+      delay: 0,
+      delayChildren: 0.1
+    }
+  },
+  exit: {
+    opacity: 0,
+    transition: {
+      duration: 0.2,
+      delayChildren: 0
+    }
+  }
+};
+const foreground = {
+  hidden: {
+    opacity: 0,
+    scale: 0.9
+  },
+  show: {
+    opacity: 1,
+    scale: 1,
+    transition: {
+      duration: 0.1
+    }
+  },
+  exit: {
+    opacity: 0,
+    scale: 0.9
+  }
+};
+function DropIndicator({
+  label
+}) {
+  const disableMotion = (0, _compose.useReducedMotion)();
+  const children = (0, _react.createElement)(_animation.__unstableMotion.div, {
+    variants: backdrop,
+    initial: disableMotion ? 'show' : 'hidden',
+    animate: "show",
+    exit: disableMotion ? 'show' : 'exit',
+    className: "components-drop-zone__content"
+    // Without this, when this div is shown,
+    // Safari calls a onDropZoneLeave causing a loop because of this bug
+    // https://bugs.webkit.org/show_bug.cgi?id=66547
+    ,
+    style: {
+      pointerEvents: 'none'
+    }
+  }, (0, _react.createElement)(_animation.__unstableMotion.div, {
+    variants: foreground
+  }, (0, _react.createElement)(_icons.Icon, {
+    icon: _icons.upload,
+    className: "components-drop-zone__content-icon"
+  }), (0, _react.createElement)("span", {
+    className: "components-drop-zone__content-text"
+  }, label ? label : (0, _i18n.__)('Drop files to upload'))));
+  if (disableMotion) {
+    return children;
+  }
+  return (0, _react.createElement)(_animation.__unstableAnimatePresence, null, children);
+}
 /**
  * `DropZone` is a component creating a drop zone area taking the full size of its parent element. It supports dropping files, HTML content or any other HTML drop event.
  *
@@ -106,70 +175,7 @@ function DropZoneComponent({
       setIsDraggingOverElement(false);
     }
   });
-  const disableMotion = (0, _compose.useReducedMotion)();
-  let children;
-  const backdrop = {
-    hidden: {
-      opacity: 0
-    },
-    show: {
-      opacity: 1,
-      transition: {
-        type: 'tween',
-        duration: 0.2,
-        delay: 0,
-        delayChildren: 0.1
-      }
-    },
-    exit: {
-      opacity: 0,
-      transition: {
-        duration: 0.2,
-        delayChildren: 0
-      }
-    }
-  };
-  const foreground = {
-    hidden: {
-      opacity: 0,
-      scale: 0.9
-    },
-    show: {
-      opacity: 1,
-      scale: 1,
-      transition: {
-        duration: 0.1
-      }
-    },
-    exit: {
-      opacity: 0,
-      scale: 0.9
-    }
-  };
-  if (isDraggingOverElement) {
-    children = (0, _react.createElement)(_animation.__unstableMotion.div, {
-      variants: backdrop,
-      initial: disableMotion ? 'show' : 'hidden',
-      animate: "show",
-      exit: disableMotion ? 'show' : 'exit',
-      className: "components-drop-zone__content"
-      // Without this, when this div is shown,
-      // Safari calls a onDropZoneLeave causing a loop because of this bug
-      // https://bugs.webkit.org/show_bug.cgi?id=66547
-      ,
-      style: {
-        pointerEvents: 'none'
-      }
-    }, (0, _react.createElement)(_animation.__unstableMotion.div, {
-      variants: foreground
-    }, (0, _react.createElement)(_icons.Icon, {
-      icon: _icons.upload,
-      className: "components-drop-zone__content-icon"
-    }), (0, _react.createElement)("span", {
-      className: "components-drop-zone__content-text"
-    }, label ? label : (0, _i18n.__)('Drop files to upload'))));
-  }
-  const classes = (0, _classnames.default)('components-drop-zone', className, {
+  const classes = (0, _clsx.default)('components-drop-zone', className, {
     'is-active': (isDraggingOverDocument || isDraggingOverElement) && (type === 'file' && onFilesDrop || type === 'html' && onHTMLDrop || type === 'default' && onDrop),
     'is-dragging-over-document': isDraggingOverDocument,
     'is-dragging-over-element': isDraggingOverElement,
@@ -179,7 +185,9 @@ function DropZoneComponent({
     ...restProps,
     ref: ref,
     className: classes
-  }, disableMotion ? children : (0, _react.createElement)(_animation.__unstableAnimatePresence, null, children));
+  }, isDraggingOverElement && (0, _react.createElement)(DropIndicator, {
+    label: label
+  }));
 }
 var _default = exports.default = DropZoneComponent;
 //# sourceMappingURL=index.js.map

package/build/drop-zone/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_classnames","_interopRequireDefault","require","_i18n","_element","_icons","_dom","_compose","_animation","DropZoneComponent","className","label","onFilesDrop","onHTMLDrop","onDrop","restProps","isDraggingOverDocument","setIsDraggingOverDocument","useState","isDraggingOverElement","setIsDraggingOverElement","type","setType","ref","useDropZone","event","files","dataTransfer","getFilesFromDataTransfer","html","getData","length","onDragStart","_type","types","includes","onDragEnd","undefined","onDragEnter","onDragLeave","disableMotion","useReducedMotion","children","backdrop","hidden","opacity","show","transition","duration","delay","delayChildren","exit","foreground","scale","_react","createElement","__unstableMotion","div","variants","initial","animate","style","pointerEvents","Icon","icon","upload","__","classes","classnames","__unstableAnimatePresence","_default","exports","default"],"sources":["@wordpress/components/src/drop-zone/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\nimport { upload, Icon } from '@wordpress/icons';\nimport { getFilesFromDataTransfer } from '@wordpress/dom';\nimport {\n\t__experimentalUseDropZone as useDropZone,\n\tuseReducedMotion,\n} from '@wordpress/compose';\n\n/\n Internal dependencies\n /\nimport {\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n} from '../animation';\nimport type { DropType, DropZoneProps } from './types';\nimport type { WordPressComponentProps } from '../context';\n\n/\n `DropZone` is a component creating a drop zone area taking the full size of its parent element. It supports dropping files, HTML content or any other HTML drop event.\n \n ```jsx\n * import { DropZone } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n \n const MyDropZone = () => {\n * const [ hasDropped, setHasDropped ] = useState( false );\n \n return (\n * <div>\n * { hasDropped ? 'Dropped!' : 'Drop something here' }\n * <DropZone\n * onFilesDrop={ () => setHasDropped( true ) }\n * onHTMLDrop={ () => setHasDropped( true ) }\n * onDrop={ () => setHasDropped( true ) }\n * />\n * </div>\n * );\n * }\n * ```\n /\nexport function DropZoneComponent( {\n\tclassName,\n\tlabel,\n\tonFilesDrop,\n\tonHTMLDrop,\n\tonDrop,\n\t...restProps\n}: WordPressComponentProps< DropZoneProps, 'div', false > ) {\n\tconst [ isDraggingOverDocument, setIsDraggingOverDocument ] =\n\t\tuseState< boolean >();\n\tconst [ isDraggingOverElement, setIsDraggingOverElement ] =\n\t\tuseState< boolean >();\n\tconst [ type, setType ] = useState< DropType >();\n\tconst ref = useDropZone( {\n\t\tonDrop( event ) {\n\t\t\tconst files = event.dataTransfer\n\t\t\t\t? getFilesFromDataTransfer( event.dataTransfer )\n\t\t\t\t: [];\n\t\t\tconst html = event.dataTransfer?.getData( 'text/html' );\n\n\t\t\t/\n\t\t\t From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.\n\t\t\t * The order of the checks is important to recognise the HTML drop.\n\t\t\t /\n\t\t\tif ( html && onHTMLDrop ) {\n\t\t\t\tonHTMLDrop( html );\n\t\t\t} else if ( files.length && onFilesDrop ) {\n\t\t\t\tonFilesDrop( files );\n\t\t\t} else if ( onDrop ) {\n\t\t\t\tonDrop( event );\n\t\t\t}\n\t\t},\n\t\tonDragStart( event ) {\n\t\t\tsetIsDraggingOverDocument( true );\n\n\t\t\tlet _type: DropType = 'default';\n\n\t\t\t/\n\t\t\t From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.\n\t\t\t * The order of the checks is important to recognise the HTML drop.\n\t\t\t */\n\t\t\tif ( event.dataTransfer?.types.includes( 'text/html' ) ) {\n\t\t\t\t_type = 'html';\n\t\t\t} else if (\n\t\t\t\t// Check for the types because sometimes the files themselves\n\t\t\t\t// are only available on drop.\n\t\t\t\tevent.dataTransfer?.types.includes( 'Files' ) \|\|\n\t\t\t\t( event.dataTransfer\n\t\t\t\t\t? getFilesFromDataTransfer( event.dataTransfer )\n\t\t\t\t\t: []\n\t\t\t\t).length > 0\n\t\t\t) {\n\t\t\t\t_type = 'file';\n\t\t\t}\n\n\t\t\tsetType( _type );\n\t\t},\n\t\tonDragEnd() {\n\t\t\tsetIsDraggingOverDocument( false );\n\t\t\tsetType( undefined );\n\t\t},\n\t\tonDragEnter() {\n\t\t\tsetIsDraggingOverElement( true );\n\t\t},\n\t\tonDragLeave() {\n\t\t\tsetIsDraggingOverElement( false );\n\t\t},\n\t} );\n\tconst disableMotion = useReducedMotion();\n\n\tlet children;\n\tconst backdrop = {\n\t\thidden: { opacity: 0 },\n\t\tshow: {\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\ttype: 'tween',\n\t\t\t\tduration: 0.2,\n\t\t\t\tdelay: 0,\n\t\t\t\tdelayChildren: 0.1,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.2,\n\t\t\t\tdelayChildren: 0,\n\t\t\t},\n\t\t},\n\t};\n\n\tconst foreground = {\n\t\thidden: { opacity: 0, scale: 0.9 },\n\t\tshow: {\n\t\t\topacity: 1,\n\t\t\tscale: 1,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.1,\n\t\t\t},\n\t\t},\n\t\texit: { opacity: 0, scale: 0.9 },\n\t};\n\n\tif ( isDraggingOverElement ) {\n\t\tchildren = (\n\t\t\t<motion.div\n\t\t\t\tvariants={ backdrop }\n\t\t\t\tinitial={ disableMotion ? 'show' : 'hidden' }\n\t\t\t\tanimate=\"show\"\n\t\t\t\texit={ disableMotion ? 'show' : 'exit' }\n\t\t\t\tclassName=\"components-drop-zone__content\"\n\t\t\t\t// Without this, when this div is shown,\n\t\t\t\t// Safari calls a onDropZoneLeave causing a loop because of this bug\n\t\t\t\t// https://bugs.webkit.org/show_bug.cgi?id=66547\n\t\t\t\tstyle={ { pointerEvents: 'none' } }\n\t\t\t>\n\t\t\t\t<motion.div variants={ foreground }>\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ticon={ upload }\n\t\t\t\t\t\tclassName=\"components-drop-zone__content-icon\"\n\t\t\t\t\t/>\n\t\t\t\t\t<span className=\"components-drop-zone__content-text\">\n\t\t\t\t\t\t{ label ? label : __( 'Drop files to upload' ) }\n\t\t\t\t\t</span>\n\t\t\t\t</motion.div>\n\t\t\t</motion.div>\n\t\t);\n\t}\n\n\tconst classes = classnames( 'components-drop-zone', className, {\n\t\t'is-active':\n\t\t\t( isDraggingOverDocument \|\| isDraggingOverElement ) &&\n\t\t\t( ( type === 'file' && onFilesDrop ) \|\|\n\t\t\t\t( type === 'html' && onHTMLDrop ) \|\|\n\t\t\t\t( type === 'default' && onDrop ) ),\n\t\t'is-dragging-over-document': isDraggingOverDocument,\n\t\t'is-dragging-over-element': isDraggingOverElement,\n\t\t[ `is-dragging-${ type }` ]: !! type,\n\t} );\n\n\treturn (\n\t\t<div { ...restProps } ref={ ref } className={ classes }>\n\t\t\t{ disableMotion ? (\n\t\t\t\tchildren\n\t\t\t) : (\n\t\t\t\t<AnimatePresence>{ children }</AnimatePresence>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nexport default DropZoneComponent;\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"names":["_clsx","_interopRequireDefault","require","_i18n","_element","_icons","_dom","_compose","_animation","backdrop","hidden","opacity","show","transition","type","duration","delay","delayChildren","exit","foreground","scale","DropIndicator","label","disableMotion","useReducedMotion","children","_react","createElement","__unstableMotion","div","variants","initial","animate","className","style","pointerEvents","Icon","icon","upload","__","__unstableAnimatePresence","DropZoneComponent","onFilesDrop","onHTMLDrop","onDrop","restProps","isDraggingOverDocument","setIsDraggingOverDocument","useState","isDraggingOverElement","setIsDraggingOverElement","setType","ref","useDropZone","event","files","dataTransfer","getFilesFromDataTransfer","html","getData","length","onDragStart","_type","types","includes","onDragEnd","undefined","onDragEnter","onDragLeave","classes","clsx","_default","exports","default"],"sources":["@wordpress/components/src/drop-zone/index.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport clsx from 'clsx';\n\n/\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\nimport { upload, Icon } from '@wordpress/icons';\nimport { getFilesFromDataTransfer } from '@wordpress/dom';\nimport {\n\t__experimentalUseDropZone as useDropZone,\n\tuseReducedMotion,\n} from '@wordpress/compose';\n\n/\n Internal dependencies\n /\nimport {\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n} from '../animation';\nimport type { DropType, DropZoneProps } from './types';\nimport type { WordPressComponentProps } from '../context';\n\nconst backdrop = {\n\thidden: { opacity: 0 },\n\tshow: {\n\t\topacity: 1,\n\t\ttransition: {\n\t\t\ttype: 'tween',\n\t\t\tduration: 0.2,\n\t\t\tdelay: 0,\n\t\t\tdelayChildren: 0.1,\n\t\t},\n\t},\n\texit: {\n\t\topacity: 0,\n\t\ttransition: {\n\t\t\tduration: 0.2,\n\t\t\tdelayChildren: 0,\n\t\t},\n\t},\n};\n\nconst foreground = {\n\thidden: { opacity: 0, scale: 0.9 },\n\tshow: {\n\t\topacity: 1,\n\t\tscale: 1,\n\t\ttransition: {\n\t\t\tduration: 0.1,\n\t\t},\n\t},\n\texit: { opacity: 0, scale: 0.9 },\n};\n\nfunction DropIndicator( { label }: { label?: string } ) {\n\tconst disableMotion = useReducedMotion();\n\tconst children = (\n\t\t<motion.div\n\t\t\tvariants={ backdrop }\n\t\t\tinitial={ disableMotion ? 'show' : 'hidden' }\n\t\t\tanimate=\"show\"\n\t\t\texit={ disableMotion ? 'show' : 'exit' }\n\t\t\tclassName=\"components-drop-zone__content\"\n\t\t\t// Without this, when this div is shown,\n\t\t\t// Safari calls a onDropZoneLeave causing a loop because of this bug\n\t\t\t// https://bugs.webkit.org/show_bug.cgi?id=66547\n\t\t\tstyle={ { pointerEvents: 'none' } }\n\t\t>\n\t\t\t<motion.div variants={ foreground }>\n\t\t\t\t<Icon\n\t\t\t\t\ticon={ upload }\n\t\t\t\t\tclassName=\"components-drop-zone__content-icon\"\n\t\t\t\t/>\n\t\t\t\t<span className=\"components-drop-zone__content-text\">\n\t\t\t\t\t{ label ? label : __( 'Drop files to upload' ) }\n\t\t\t\t</span>\n\t\t\t</motion.div>\n\t\t</motion.div>\n\t);\n\n\tif ( disableMotion ) {\n\t\treturn children;\n\t}\n\n\treturn <AnimatePresence>{ children }</AnimatePresence>;\n}\n\n/\n `DropZone` is a component creating a drop zone area taking the full size of its parent element. It supports dropping files, HTML content or any other HTML drop event.\n \n ```jsx\n * import { DropZone } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n \n const MyDropZone = () => {\n * const [ hasDropped, setHasDropped ] = useState( false );\n \n return (\n * <div>\n * { hasDropped ? 'Dropped!' : 'Drop something here' }\n * <DropZone\n * onFilesDrop={ () => setHasDropped( true ) }\n * onHTMLDrop={ () => setHasDropped( true ) }\n * onDrop={ () => setHasDropped( true ) }\n * />\n * </div>\n * );\n * }\n * ```\n /\nexport function DropZoneComponent( {\n\tclassName,\n\tlabel,\n\tonFilesDrop,\n\tonHTMLDrop,\n\tonDrop,\n\t...restProps\n}: WordPressComponentProps< DropZoneProps, 'div', false > ) {\n\tconst [ isDraggingOverDocument, setIsDraggingOverDocument ] =\n\t\tuseState< boolean >();\n\tconst [ isDraggingOverElement, setIsDraggingOverElement ] =\n\t\tuseState< boolean >();\n\tconst [ type, setType ] = useState< DropType >();\n\tconst ref = useDropZone( {\n\t\tonDrop( event ) {\n\t\t\tconst files = event.dataTransfer\n\t\t\t\t? getFilesFromDataTransfer( event.dataTransfer )\n\t\t\t\t: [];\n\t\t\tconst html = event.dataTransfer?.getData( 'text/html' );\n\n\t\t\t/\n\t\t\t From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.\n\t\t\t * The order of the checks is important to recognise the HTML drop.\n\t\t\t /\n\t\t\tif ( html && onHTMLDrop ) {\n\t\t\t\tonHTMLDrop( html );\n\t\t\t} else if ( files.length && onFilesDrop ) {\n\t\t\t\tonFilesDrop( files );\n\t\t\t} else if ( onDrop ) {\n\t\t\t\tonDrop( event );\n\t\t\t}\n\t\t},\n\t\tonDragStart( event ) {\n\t\t\tsetIsDraggingOverDocument( true );\n\n\t\t\tlet _type: DropType = 'default';\n\n\t\t\t/\n\t\t\t From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.\n\t\t\t * The order of the checks is important to recognise the HTML drop.\n\t\t\t */\n\t\t\tif ( event.dataTransfer?.types.includes( 'text/html' ) ) {\n\t\t\t\t_type = 'html';\n\t\t\t} else if (\n\t\t\t\t// Check for the types because sometimes the files themselves\n\t\t\t\t// are only available on drop.\n\t\t\t\tevent.dataTransfer?.types.includes( 'Files' ) \|\|\n\t\t\t\t( event.dataTransfer\n\t\t\t\t\t? getFilesFromDataTransfer( event.dataTransfer )\n\t\t\t\t\t: []\n\t\t\t\t).length > 0\n\t\t\t) {\n\t\t\t\t_type = 'file';\n\t\t\t}\n\n\t\t\tsetType( _type );\n\t\t},\n\t\tonDragEnd() {\n\t\t\tsetIsDraggingOverDocument( false );\n\t\t\tsetType( undefined );\n\t\t},\n\t\tonDragEnter() {\n\t\t\tsetIsDraggingOverElement( true );\n\t\t},\n\t\tonDragLeave() {\n\t\t\tsetIsDraggingOverElement( false );\n\t\t},\n\t} );\n\tconst classes = clsx( 'components-drop-zone', className, {\n\t\t'is-active':\n\t\t\t( isDraggingOverDocument \|\| isDraggingOverElement ) &&\n\t\t\t( ( type === 'file' && onFilesDrop ) \|\|\n\t\t\t\t( type === 'html' && onHTMLDrop ) \|\|\n\t\t\t\t( type === 'default' && onDrop ) ),\n\t\t'is-dragging-over-document': isDraggingOverDocument,\n\t\t'is-dragging-over-element': isDraggingOverElement,\n\t\t[ `is-dragging-${ type }` ]: !! type,\n\t} );\n\n\treturn (\n\t\t<div { ...restProps } ref={ ref } className={ classes }>\n\t\t\t{ isDraggingOverElement && <DropIndicator label={ label } /> }\n\t\t</div>\n\t);\n}\n\nexport default DropZoneComponent;\n"],"mappings":"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","ignoreList":[]}

package/build/dropdown/index.js CHANGED Viewed

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = exports.Dropdown = void 0;
 var _react = require("react");
-var _classnames = _interopRequireDefault(require("classnames"));
+var _clsx = _interopRequireDefault(require("clsx"));
 var _element = require("@wordpress/element");
 var _compose = require("@wordpress/compose");
 var _deprecated = _interopRequireDefault(require("@wordpress/deprecated"));
@@ -117,7 +117,7 @@ const UnconnectedDropdown = (props, forwardedRef) => {
     anchor: !popoverPropsHaveAnchor ? fallbackPopoverAnchor : undefined,
     variant: variant,
     ...popoverProps,
-    className: (0, _classnames.default)('components-dropdown__content', popoverProps?.className, contentClassName)
+    className: (0, _clsx.default)('components-dropdown__content', popoverProps?.className, contentClassName)
   }, renderContent(args)));
 };