@wordpress/components 19.10.0 → 19.13.0

package/build-module/custom-gradient-bar/index.js

@@ -16,7 +16,7 @@ import { useRef, useReducer } from '@wordpress/element';
 
 import ControlPoints from './control-points';
 import { getHorizontalRelativeGradientPosition } from './utils';
-import { INSERT_POINT_WIDTH, MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT } from './constants';
+import { MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT } from './constants';
 
 function customGradientBarReducer(state, action) {
   switch (action.type) {
@@ -93,11 +93,11 @@ export default function CustomGradientBar(_ref) {
     disableAlpha = false,
     __experimentalIsRenderedInSidebar
   } = _ref;
-  const gradientPickerDomRef = useRef();
+  const gradientMarkersContainerDomRef = useRef();
   const [gradientBarState, gradientBarStateDispatch] = useReducer(customGradientBarReducer, customGradientBarReducerInitialState);
 
   const onMouseEnterAndMove = event => {
-    const insertPosition = getHorizontalRelativeGradientPosition(event.clientX, gradientPickerDomRef.current, INSERT_POINT_WIDTH); // If the insert point is close to an existing control point don't show it.
+    const insertPosition = getHorizontalRelativeGradientPosition(event.clientX, gradientMarkersContainerDomRef.current); // If the insert point is close to an existing control point don't show it.
 
     if (some(controlPoints, _ref2 => {
       let {
@@ -129,7 +129,6 @@ export default function CustomGradientBar(_ref) {
   const isMovingInserter = gradientBarState.id === 'MOVING_INSERTER';
   const isInsertingControlPoint = gradientBarState.id === 'INSERTING_CONTROL_POINT';
   return createElement("div", {
-    ref: gradientPickerDomRef,
     className: classnames('components-custom-gradient-picker__gradient-bar', {
       'has-gradient': hasGradient
     }),
@@ -140,10 +139,11 @@ export default function CustomGradientBar(_ref) {
     },
     onMouseLeave: onMouseLeave
   }, createElement("div", {
+    ref: gradientMarkersContainerDomRef,
     className: "components-custom-gradient-picker__markers-container"
   }, !disableInserter && (isMovingInserter || isInsertingControlPoint) && createElement(ControlPoints.InsertPoint, {
     __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
-    gradientPickerDomRef: gradientPickerDomRef,
+    gradientPickerDomRef: gradientMarkersContainerDomRef,
     disableAlpha: disableAlpha,
     insertPosition: gradientBarState.insertPosition,
     value: controlPoints,
@@ -162,7 +162,7 @@ export default function CustomGradientBar(_ref) {
     __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
     disableAlpha: disableAlpha,
     disableRemove: disableInserter,
-    gradientPickerDomRef: gradientPickerDomRef,
+    gradientPickerDomRef: gradientMarkersContainerDomRef,
     ignoreMarkerPosition: isInsertingControlPoint ? gradientBarState.insertPosition : undefined,
     value: controlPoints,
     onChange: onChange,

package/build-module/custom-gradient-bar/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/custom-gradient-bar/index.js"],"names":["some","classnames","useRef","useReducer","ControlPoints","getHorizontalRelativeGradientPosition","INSERT_POINT_WIDTH","MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT","customGradientBarReducer","state","action","type","id","insertPosition","customGradientBarReducerInitialState","CustomGradientBar","background","hasGradient","value","controlPoints","onChange","disableInserter","disableAlpha","__experimentalIsRenderedInSidebar","gradientPickerDomRef","gradientBarState","gradientBarStateDispatch","onMouseEnterAndMove","event","clientX","current","position","Math","abs","onMouseLeave","isMovingInserter","isInsertingControlPoint","undefined"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\n\nimport { some } from 'lodash';\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 {\n\tINSERT_POINT_WIDTH,\n\tMINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT,\n} from './constants';\n\nfunction customGradientBarReducer( state, action ) {\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 = { id: 'IDLE' };\n\nexport default function CustomGradientBar( {\n\tbackground,\n\thasGradient,\n\tvalue: controlPoints,\n\tonChange,\n\tdisableInserter = false,\n\tdisableAlpha = false,\n\t__experimentalIsRenderedInSidebar,\n} ) {\n\tconst gradientPickerDomRef = useRef();\n\n\tconst [ gradientBarState, gradientBarStateDispatch ] = useReducer(\n\t\tcustomGradientBarReducer,\n\t\tcustomGradientBarReducerInitialState\n\t);\n\tconst onMouseEnterAndMove = ( event ) => {\n\t\tconst insertPosition = getHorizontalRelativeGradientPosition(\n\t\t\tevent.clientX,\n\t\t\tgradientPickerDomRef.current,\n\t\t\tINSERT_POINT_WIDTH\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\tsome( controlPoints, ( { 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\tref={ gradientPickerDomRef }\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\tstyle={ { background } }\n\t\t\tonMouseLeave={ onMouseLeave }\n\t\t>\n\t\t\t<div className=\"components-custom-gradient-picker__markers-container\">\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\tgradientPickerDomRef={ gradientPickerDomRef }\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={ gradientPickerDomRef }\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"]}
+{"version":3,"sources":["@wordpress/components/src/custom-gradient-bar/index.js"],"names":["some","classnames","useRef","useReducer","ControlPoints","getHorizontalRelativeGradientPosition","MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT","customGradientBarReducer","state","action","type","id","insertPosition","customGradientBarReducerInitialState","CustomGradientBar","background","hasGradient","value","controlPoints","onChange","disableInserter","disableAlpha","__experimentalIsRenderedInSidebar","gradientMarkersContainerDomRef","gradientBarState","gradientBarStateDispatch","onMouseEnterAndMove","event","clientX","current","position","Math","abs","onMouseLeave","isMovingInserter","isInsertingControlPoint","undefined"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\n\nimport { some } from 'lodash';\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';\n\nfunction customGradientBarReducer( state, action ) {\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 = { id: 'IDLE' };\n\nexport default function CustomGradientBar( {\n\tbackground,\n\thasGradient,\n\tvalue: controlPoints,\n\tonChange,\n\tdisableInserter = false,\n\tdisableAlpha = false,\n\t__experimentalIsRenderedInSidebar,\n} ) {\n\tconst gradientMarkersContainerDomRef = useRef();\n\n\tconst [ gradientBarState, gradientBarStateDispatch ] = useReducer(\n\t\tcustomGradientBarReducer,\n\t\tcustomGradientBarReducerInitialState\n\t);\n\tconst onMouseEnterAndMove = ( event ) => {\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\tsome( controlPoints, ( { 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\tstyle={ { background } }\n\t\t\tonMouseLeave={ onMouseLeave }\n\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\tgradientPickerDomRef={\n\t\t\t\t\t\t\t\tgradientMarkersContainerDomRef\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"]}

package/build-module/custom-gradient-bar/utils.js

@@ -1,7 +1,7 @@
 /**
  * Internal dependencies
  */
-import { MINIMUM_DISTANCE_BETWEEN_POINTS, MINIMUM_ABSOLUTE_LEFT_POSITION, INSERT_POINT_WIDTH } from './constants';
+import { MINIMUM_DISTANCE_BETWEEN_POINTS } from './constants';
 /**
  * Control point for the gradient bar.
  *
@@ -156,14 +156,13 @@ export function updateControlPointColorByPosition(points, position, newColor) {
 /**
  * Gets the horizontal coordinate when dragging a control point with the mouse.
  *
- * @param {number}  mouseXCoordinate       Horizontal coordinate of the mouse position.
- * @param {Element} containerElement       Container for the gradient picker.
- * @param {number}  positionedElementWidth Width of the positioned element.
+ * @param {number}  mouseXCoordinate Horizontal coordinate of the mouse position.
+ * @param {Element} containerElement Container for the gradient picker.
  *
  * @return {number} Whole number percentage from the left.
  */
 
-export function getHorizontalRelativeGradientPosition(mouseXCoordinate, containerElement, positionedElementWidth) {
+export function getHorizontalRelativeGradientPosition(mouseXCoordinate, containerElement) {
   if (!containerElement) {
     return;
   }
@@ -172,8 +171,7 @@ export function getHorizontalRelativeGradientPosition(mouseXCoordinate, containe
     x,
     width
   } = containerElement.getBoundingClientRect();
-  const absolutePositionValue = mouseXCoordinate - x - MINIMUM_ABSOLUTE_LEFT_POSITION - positionedElementWidth / 2;
-  const availableWidth = width - MINIMUM_ABSOLUTE_LEFT_POSITION - INSERT_POINT_WIDTH;
-  return Math.round(clampPercent(absolutePositionValue * 100 / availableWidth));
+  const absolutePositionValue = mouseXCoordinate - x;
+  return Math.round(clampPercent(absolutePositionValue * 100 / width));
 }
 //# sourceMappingURL=utils.js.map

package/build-module/custom-gradient-bar/utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/custom-gradient-bar/utils.js"],"names":["MINIMUM_DISTANCE_BETWEEN_POINTS","MINIMUM_ABSOLUTE_LEFT_POSITION","INSERT_POINT_WIDTH","clampPercent","value","Math","max","min","isOverlapping","initialIndex","newPosition","minDistance","initialPosition","position","minPosition","maxPosition","some","index","abs","addControlPoint","points","color","nextIndex","findIndex","point","newPoint","newPoints","slice","splice","removeControlPoint","filter","pointIndex","updateControlPoint","newValue","updateControlPointPosition","updateControlPointColor","newColor","updateControlPointColorByPosition","getHorizontalRelativeGradientPosition","mouseXCoordinate","containerElement","positionedElementWidth","x","width","getBoundingClientRect","absolutePositionValue","availableWidth","round"],"mappings":"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","sourcesContent":["/**\n * Internal dependencies\n */\nimport {\n\tMINIMUM_DISTANCE_BETWEEN_POINTS,\n\tMINIMUM_ABSOLUTE_LEFT_POSITION,\n\tINSERT_POINT_WIDTH,\n} from './constants';\n\n/**\n * Control point for the gradient bar.\n *\n * @typedef {Object} ControlPoint\n * @property {string} color    Color of the control point.\n * @property {number} position Integer position of the control point as a percentage.\n */\n\n/**\n * Color as parsed from the gradient by gradient-parser.\n *\n * @typedef {Object} Color\n * @property {string} r   Red component.\n * @property {string} g   Green component.\n * @property {string} b   Green component.\n * @property {string} [a] Optional alpha component.\n */\n\n/**\n * Clamps a number between 0 and 100.\n *\n * @param {number} value Value to clamp.\n *\n * @return {number} Value clamped between 0 and 100.\n */\nexport function clampPercent( value ) {\n\treturn Math.max( 0, Math.min( 100, value ) );\n}\n\n/**\n * Check if a control point is overlapping with another.\n *\n * @param {ControlPoint[]} value        Array of control points.\n * @param {number}         initialIndex Index of the position to test.\n * @param {number}         newPosition  New position of the control point.\n * @param {number}         minDistance  Distance considered to be overlapping.\n *\n * @return {boolean} True if the point is overlapping.\n */\nexport function isOverlapping(\n\tvalue,\n\tinitialIndex,\n\tnewPosition,\n\tminDistance = MINIMUM_DISTANCE_BETWEEN_POINTS\n) {\n\tconst initialPosition = value[ initialIndex ].position;\n\tconst minPosition = Math.min( initialPosition, newPosition );\n\tconst maxPosition = Math.max( initialPosition, newPosition );\n\n\treturn value.some( ( { position }, index ) => {\n\t\treturn (\n\t\t\tindex !== initialIndex &&\n\t\t\t( Math.abs( position - newPosition ) < minDistance ||\n\t\t\t\t( minPosition < position && position < maxPosition ) )\n\t\t);\n\t} );\n}\n\n/**\n * Adds a control point from an array and returns the new array.\n *\n * @param {ControlPoint[]} points   Array of control points.\n * @param {number}         position Position to insert the new point.\n * @param {Color}          color    Color to update the control point at index.\n *\n * @return {ControlPoint[]} New array of control points.\n */\nexport function addControlPoint( points, position, color ) {\n\tconst nextIndex = points.findIndex(\n\t\t( point ) => point.position > position\n\t);\n\tconst newPoint = { color, position };\n\tconst newPoints = points.slice();\n\tnewPoints.splice( nextIndex - 1, 0, newPoint );\n\treturn newPoints;\n}\n\n/**\n * Removes a control point from an array and returns the new array.\n *\n * @param {ControlPoint[]} points Array of control points.\n * @param {number}         index  Index to remove.\n *\n * @return {ControlPoint[]} New array of control points.\n */\nexport function removeControlPoint( points, index ) {\n\treturn points.filter( ( point, pointIndex ) => {\n\t\treturn pointIndex !== index;\n\t} );\n}\n\n/**\n * Updates a control point from an array and returns the new array.\n *\n * @param {ControlPoint[]} points   Array of control points.\n * @param {number}         index    Index to update.\n * @param {ControlPoint[]} newPoint New control point to replace the index.\n *\n * @return {ControlPoint[]} New array of control points.\n */\nexport function updateControlPoint( points, index, newPoint ) {\n\tconst newValue = points.slice();\n\tnewValue[ index ] = newPoint;\n\treturn newValue;\n}\n\n/**\n * Updates the position of a control point from an array and returns the new array.\n *\n * @param {ControlPoint[]} points      Array of control points.\n * @param {number}         index       Index to update.\n * @param {number}         newPosition Position to move the control point at index.\n *\n * @return {ControlPoint[]} New array of control points.\n */\nexport function updateControlPointPosition( points, index, newPosition ) {\n\tif ( isOverlapping( points, index, newPosition ) ) {\n\t\treturn points;\n\t}\n\tconst newPoint = {\n\t\t...points[ index ],\n\t\tposition: newPosition,\n\t};\n\treturn updateControlPoint( points, index, newPoint );\n}\n\n/**\n * Updates the position of a control point from an array and returns the new array.\n *\n * @param {ControlPoint[]} points   Array of control points.\n * @param {number}         index    Index to update.\n * @param {Color}          newColor Color to update the control point at index.\n *\n * @return {ControlPoint[]} New array of control points.\n */\nexport function updateControlPointColor( points, index, newColor ) {\n\tconst newPoint = {\n\t\t...points[ index ],\n\t\tcolor: newColor,\n\t};\n\treturn updateControlPoint( points, index, newPoint );\n}\n\n/**\n * Updates the position of a control point from an array and returns the new array.\n *\n * @param {ControlPoint[]} points   Array of control points.\n * @param {number}         position Position of the color stop.\n * @param {string}         newColor Color to update the control point at index.\n *\n * @return {ControlPoint[]} New array of control points.\n */\nexport function updateControlPointColorByPosition(\n\tpoints,\n\tposition,\n\tnewColor\n) {\n\tconst index = points.findIndex( ( point ) => point.position === position );\n\treturn updateControlPointColor( points, index, newColor );\n}\n\n/**\n * Gets the horizontal coordinate when dragging a control point with the mouse.\n *\n * @param {number}  mouseXCoordinate       Horizontal coordinate of the mouse position.\n * @param {Element} containerElement       Container for the gradient picker.\n * @param {number}  positionedElementWidth Width of the positioned element.\n *\n * @return {number} Whole number percentage from the left.\n */\nexport function getHorizontalRelativeGradientPosition(\n\tmouseXCoordinate,\n\tcontainerElement,\n\tpositionedElementWidth\n) {\n\tif ( ! containerElement ) {\n\t\treturn;\n\t}\n\tconst { x, width } = containerElement.getBoundingClientRect();\n\tconst absolutePositionValue =\n\t\tmouseXCoordinate -\n\t\tx -\n\t\tMINIMUM_ABSOLUTE_LEFT_POSITION -\n\t\tpositionedElementWidth / 2;\n\tconst availableWidth =\n\t\twidth - MINIMUM_ABSOLUTE_LEFT_POSITION - INSERT_POINT_WIDTH;\n\treturn Math.round(\n\t\tclampPercent( ( absolutePositionValue * 100 ) / availableWidth )\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/custom-gradient-bar/utils.js"],"names":["MINIMUM_DISTANCE_BETWEEN_POINTS","clampPercent","value","Math","max","min","isOverlapping","initialIndex","newPosition","minDistance","initialPosition","position","minPosition","maxPosition","some","index","abs","addControlPoint","points","color","nextIndex","findIndex","point","newPoint","newPoints","slice","splice","removeControlPoint","filter","pointIndex","updateControlPoint","newValue","updateControlPointPosition","updateControlPointColor","newColor","updateControlPointColorByPosition","getHorizontalRelativeGradientPosition","mouseXCoordinate","containerElement","x","width","getBoundingClientRect","absolutePositionValue","round"],"mappings":"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","sourcesContent":["/**\n * Internal dependencies\n */\nimport { MINIMUM_DISTANCE_BETWEEN_POINTS } from './constants';\n\n/**\n * Control point for the gradient bar.\n *\n * @typedef {Object} ControlPoint\n * @property {string} color    Color of the control point.\n * @property {number} position Integer position of the control point as a percentage.\n */\n\n/**\n * Color as parsed from the gradient by gradient-parser.\n *\n * @typedef {Object} Color\n * @property {string} r   Red component.\n * @property {string} g   Green component.\n * @property {string} b   Green component.\n * @property {string} [a] Optional alpha component.\n */\n\n/**\n * Clamps a number between 0 and 100.\n *\n * @param {number} value Value to clamp.\n *\n * @return {number} Value clamped between 0 and 100.\n */\nexport function clampPercent( value ) {\n\treturn Math.max( 0, Math.min( 100, value ) );\n}\n\n/**\n * Check if a control point is overlapping with another.\n *\n * @param {ControlPoint[]} value        Array of control points.\n * @param {number}         initialIndex Index of the position to test.\n * @param {number}         newPosition  New position of the control point.\n * @param {number}         minDistance  Distance considered to be overlapping.\n *\n * @return {boolean} True if the point is overlapping.\n */\nexport function isOverlapping(\n\tvalue,\n\tinitialIndex,\n\tnewPosition,\n\tminDistance = MINIMUM_DISTANCE_BETWEEN_POINTS\n) {\n\tconst initialPosition = value[ initialIndex ].position;\n\tconst minPosition = Math.min( initialPosition, newPosition );\n\tconst maxPosition = Math.max( initialPosition, newPosition );\n\n\treturn value.some( ( { position }, index ) => {\n\t\treturn (\n\t\t\tindex !== initialIndex &&\n\t\t\t( Math.abs( position - newPosition ) < minDistance ||\n\t\t\t\t( minPosition < position && position < maxPosition ) )\n\t\t);\n\t} );\n}\n\n/**\n * Adds a control point from an array and returns the new array.\n *\n * @param {ControlPoint[]} points   Array of control points.\n * @param {number}         position Position to insert the new point.\n * @param {Color}          color    Color to update the control point at index.\n *\n * @return {ControlPoint[]} New array of control points.\n */\nexport function addControlPoint( points, position, color ) {\n\tconst nextIndex = points.findIndex(\n\t\t( point ) => point.position > position\n\t);\n\tconst newPoint = { color, position };\n\tconst newPoints = points.slice();\n\tnewPoints.splice( nextIndex - 1, 0, newPoint );\n\treturn newPoints;\n}\n\n/**\n * Removes a control point from an array and returns the new array.\n *\n * @param {ControlPoint[]} points Array of control points.\n * @param {number}         index  Index to remove.\n *\n * @return {ControlPoint[]} New array of control points.\n */\nexport function removeControlPoint( points, index ) {\n\treturn points.filter( ( point, pointIndex ) => {\n\t\treturn pointIndex !== index;\n\t} );\n}\n\n/**\n * Updates a control point from an array and returns the new array.\n *\n * @param {ControlPoint[]} points   Array of control points.\n * @param {number}         index    Index to update.\n * @param {ControlPoint[]} newPoint New control point to replace the index.\n *\n * @return {ControlPoint[]} New array of control points.\n */\nexport function updateControlPoint( points, index, newPoint ) {\n\tconst newValue = points.slice();\n\tnewValue[ index ] = newPoint;\n\treturn newValue;\n}\n\n/**\n * Updates the position of a control point from an array and returns the new array.\n *\n * @param {ControlPoint[]} points      Array of control points.\n * @param {number}         index       Index to update.\n * @param {number}         newPosition Position to move the control point at index.\n *\n * @return {ControlPoint[]} New array of control points.\n */\nexport function updateControlPointPosition( points, index, newPosition ) {\n\tif ( isOverlapping( points, index, newPosition ) ) {\n\t\treturn points;\n\t}\n\tconst newPoint = {\n\t\t...points[ index ],\n\t\tposition: newPosition,\n\t};\n\treturn updateControlPoint( points, index, newPoint );\n}\n\n/**\n * Updates the position of a control point from an array and returns the new array.\n *\n * @param {ControlPoint[]} points   Array of control points.\n * @param {number}         index    Index to update.\n * @param {Color}          newColor Color to update the control point at index.\n *\n * @return {ControlPoint[]} New array of control points.\n */\nexport function updateControlPointColor( points, index, newColor ) {\n\tconst newPoint = {\n\t\t...points[ index ],\n\t\tcolor: newColor,\n\t};\n\treturn updateControlPoint( points, index, newPoint );\n}\n\n/**\n * Updates the position of a control point from an array and returns the new array.\n *\n * @param {ControlPoint[]} points   Array of control points.\n * @param {number}         position Position of the color stop.\n * @param {string}         newColor Color to update the control point at index.\n *\n * @return {ControlPoint[]} New array of control points.\n */\nexport function updateControlPointColorByPosition(\n\tpoints,\n\tposition,\n\tnewColor\n) {\n\tconst index = points.findIndex( ( point ) => point.position === position );\n\treturn updateControlPointColor( points, index, newColor );\n}\n\n/**\n * Gets the horizontal coordinate when dragging a control point with the mouse.\n *\n * @param {number}  mouseXCoordinate Horizontal coordinate of the mouse position.\n * @param {Element} containerElement Container for the gradient picker.\n *\n * @return {number} Whole number percentage from the left.\n */\nexport function getHorizontalRelativeGradientPosition(\n\tmouseXCoordinate,\n\tcontainerElement\n) {\n\tif ( ! containerElement ) {\n\t\treturn;\n\t}\n\tconst { x, width } = containerElement.getBoundingClientRect();\n\tconst absolutePositionValue = mouseXCoordinate - x;\n\treturn Math.round(\n\t\tclampPercent( ( absolutePositionValue * 100 ) / width )\n\t);\n}\n"]}

package/build-module/custom-gradient-picker/utils.js

@@ -75,7 +75,7 @@ export function getGradientAstWithControlPoints(gradientAST, newControlPoints) {
       return {
         length: {
           type: '%',
-          value: position.toString()
+          value: position === null || position === void 0 ? void 0 : position.toString()
         },
         type: a < 1 ? 'rgba' : 'rgb',
         value: a < 1 ? [r, g, b, a] : [r, g, b]

package/build-module/custom-gradient-picker/utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/custom-gradient-picker/utils.js"],"names":["gradientParser","colord","extend","namesPlugin","DEFAULT_GRADIENT","HORIZONTAL_GRADIENT_ORIENTATION","DIRECTIONAL_ORIENTATION_ANGLE_MAP","serializeGradient","getLinearGradientRepresentation","gradientAST","type","orientation","colorStops","hasUnsupportedLength","item","length","undefined","getGradientAstWithDefault","value","parse","error","toString","some","step","forEach","stop","index","getGradientAstWithControlPoints","newControlPoints","map","position","color","r","g","b","a","toRgb","getStopCssColor","colorStop","join"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport gradientParser from 'gradient-parser';\nimport { colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\n\n/**\n * Internal dependencies\n */\nimport {\n\tDEFAULT_GRADIENT,\n\tHORIZONTAL_GRADIENT_ORIENTATION,\n\tDIRECTIONAL_ORIENTATION_ANGLE_MAP,\n} from './constants';\nimport { serializeGradient } from './serializer';\n\nextend( [ namesPlugin ] );\n\nexport function getLinearGradientRepresentation( gradientAST ) {\n\treturn serializeGradient( {\n\t\ttype: 'linear-gradient',\n\t\torientation: HORIZONTAL_GRADIENT_ORIENTATION,\n\t\tcolorStops: gradientAST.colorStops,\n\t} );\n}\n\nfunction hasUnsupportedLength( item ) {\n\treturn item.length === undefined || item.length.type !== '%';\n}\n\nexport function getGradientAstWithDefault( value ) {\n\t// gradientAST will contain the gradient AST as parsed by gradient-parser npm module.\n\t// More information of its structure available at https://www.npmjs.com/package/gradient-parser#ast.\n\tlet gradientAST;\n\n\ttry {\n\t\tgradientAST = gradientParser.parse( value )[ 0 ];\n\t\tgradientAST.value = value;\n\t} catch ( error ) {\n\t\tgradientAST = gradientParser.parse( DEFAULT_GRADIENT )[ 0 ];\n\t\tgradientAST.value = DEFAULT_GRADIENT;\n\t}\n\n\tif ( gradientAST.orientation?.type === 'directional' ) {\n\t\tgradientAST.orientation.type = 'angular';\n\t\tgradientAST.orientation.value = DIRECTIONAL_ORIENTATION_ANGLE_MAP[\n\t\t\tgradientAST.orientation.value\n\t\t].toString();\n\t}\n\n\tif ( gradientAST.colorStops.some( hasUnsupportedLength ) ) {\n\t\tconst { colorStops } = gradientAST;\n\t\tconst step = 100 / ( colorStops.length - 1 );\n\t\tcolorStops.forEach( ( stop, index ) => {\n\t\t\tstop.length = {\n\t\t\t\tvalue: step * index,\n\t\t\t\ttype: '%',\n\t\t\t};\n\t\t} );\n\t\tgradientAST.value = serializeGradient( gradientAST );\n\t}\n\n\treturn gradientAST;\n}\n\nexport function getGradientAstWithControlPoints(\n\tgradientAST,\n\tnewControlPoints\n) {\n\treturn {\n\t\t...gradientAST,\n\t\tcolorStops: newControlPoints.map( ( { position, color } ) => {\n\t\t\tconst { r, g, b, a } = colord( color ).toRgb();\n\t\t\treturn {\n\t\t\t\tlength: {\n\t\t\t\t\ttype: '%',\n\t\t\t\t\tvalue: position.toString(),\n\t\t\t\t},\n\t\t\t\ttype: a < 1 ? 'rgba' : 'rgb',\n\t\t\t\tvalue: a < 1 ? [ r, g, b, a ] : [ r, g, b ],\n\t\t\t};\n\t\t} ),\n\t};\n}\n\nexport function getStopCssColor( colorStop ) {\n\tswitch ( colorStop.type ) {\n\t\tcase 'hex':\n\t\t\treturn `#${ colorStop.value }`;\n\t\tcase 'literal':\n\t\t\treturn colorStop.value;\n\t\tcase 'rgb':\n\t\tcase 'rgba':\n\t\t\treturn `${ colorStop.type }(${ colorStop.value.join( ',' ) })`;\n\t\tdefault:\n\t\t\t// Should be unreachable if passing an AST from gradient-parser.\n\t\t\t// See https://github.com/rafaelcaricio/gradient-parser#ast.\n\t\t\treturn 'transparent';\n\t}\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/custom-gradient-picker/utils.js"],"names":["gradientParser","colord","extend","namesPlugin","DEFAULT_GRADIENT","HORIZONTAL_GRADIENT_ORIENTATION","DIRECTIONAL_ORIENTATION_ANGLE_MAP","serializeGradient","getLinearGradientRepresentation","gradientAST","type","orientation","colorStops","hasUnsupportedLength","item","length","undefined","getGradientAstWithDefault","value","parse","error","toString","some","step","forEach","stop","index","getGradientAstWithControlPoints","newControlPoints","map","position","color","r","g","b","a","toRgb","getStopCssColor","colorStop","join"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport gradientParser from 'gradient-parser';\nimport { colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\n\n/**\n * Internal dependencies\n */\nimport {\n\tDEFAULT_GRADIENT,\n\tHORIZONTAL_GRADIENT_ORIENTATION,\n\tDIRECTIONAL_ORIENTATION_ANGLE_MAP,\n} from './constants';\nimport { serializeGradient } from './serializer';\n\nextend( [ namesPlugin ] );\n\nexport function getLinearGradientRepresentation( gradientAST ) {\n\treturn serializeGradient( {\n\t\ttype: 'linear-gradient',\n\t\torientation: HORIZONTAL_GRADIENT_ORIENTATION,\n\t\tcolorStops: gradientAST.colorStops,\n\t} );\n}\n\nfunction hasUnsupportedLength( item ) {\n\treturn item.length === undefined || item.length.type !== '%';\n}\n\nexport function getGradientAstWithDefault( value ) {\n\t// gradientAST will contain the gradient AST as parsed by gradient-parser npm module.\n\t// More information of its structure available at https://www.npmjs.com/package/gradient-parser#ast.\n\tlet gradientAST;\n\n\ttry {\n\t\tgradientAST = gradientParser.parse( value )[ 0 ];\n\t\tgradientAST.value = value;\n\t} catch ( error ) {\n\t\tgradientAST = gradientParser.parse( DEFAULT_GRADIENT )[ 0 ];\n\t\tgradientAST.value = DEFAULT_GRADIENT;\n\t}\n\n\tif ( gradientAST.orientation?.type === 'directional' ) {\n\t\tgradientAST.orientation.type = 'angular';\n\t\tgradientAST.orientation.value =\n\t\t\tDIRECTIONAL_ORIENTATION_ANGLE_MAP[\n\t\t\t\tgradientAST.orientation.value\n\t\t\t].toString();\n\t}\n\n\tif ( gradientAST.colorStops.some( hasUnsupportedLength ) ) {\n\t\tconst { colorStops } = gradientAST;\n\t\tconst step = 100 / ( colorStops.length - 1 );\n\t\tcolorStops.forEach( ( stop, index ) => {\n\t\t\tstop.length = {\n\t\t\t\tvalue: step * index,\n\t\t\t\ttype: '%',\n\t\t\t};\n\t\t} );\n\t\tgradientAST.value = serializeGradient( gradientAST );\n\t}\n\n\treturn gradientAST;\n}\n\nexport function getGradientAstWithControlPoints(\n\tgradientAST,\n\tnewControlPoints\n) {\n\treturn {\n\t\t...gradientAST,\n\t\tcolorStops: newControlPoints.map( ( { position, color } ) => {\n\t\t\tconst { r, g, b, a } = colord( color ).toRgb();\n\t\t\treturn {\n\t\t\t\tlength: {\n\t\t\t\t\ttype: '%',\n\t\t\t\t\tvalue: position?.toString(),\n\t\t\t\t},\n\t\t\t\ttype: a < 1 ? 'rgba' : 'rgb',\n\t\t\t\tvalue: a < 1 ? [ r, g, b, a ] : [ r, g, b ],\n\t\t\t};\n\t\t} ),\n\t};\n}\n\nexport function getStopCssColor( colorStop ) {\n\tswitch ( colorStop.type ) {\n\t\tcase 'hex':\n\t\t\treturn `#${ colorStop.value }`;\n\t\tcase 'literal':\n\t\t\treturn colorStop.value;\n\t\tcase 'rgb':\n\t\tcase 'rgba':\n\t\t\treturn `${ colorStop.type }(${ colorStop.value.join( ',' ) })`;\n\t\tdefault:\n\t\t\t// Should be unreachable if passing an AST from gradient-parser.\n\t\t\t// See https://github.com/rafaelcaricio/gradient-parser#ast.\n\t\t\treturn 'transparent';\n\t}\n}\n"]}

package/build-module/custom-select-control/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/components/src/custom-select-control/index.js"],"names":["useSelect","classnames","Icon","check","chevronDown","__","sprintf","useCallback","Button","VisuallyHidden","itemToString","item","name","stateReducer","selectedItem","type","changes","props","items","stateChangeTypes","ToggleButtonKeyDownArrowDown","Math","min","indexOf","length","ToggleButtonKeyDownArrowUp","max","CustomSelectControl","__next36pxDefaultSize","className","hideLabelFromVision","label","describedBy","options","onChange","onSelectedItemChange","value","_selectedItem","getLabelProps","getToggleButtonProps","getMenuProps","getItemProps","isOpen","highlightedIndex","initialSelectedItem","undefined","getDescribedBy","menuProps","onKeyDownHandler","e","stopPropagation","onKeyDown","startsWith","isSmall","map","index","key","__experimentalHint","style"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { useSelect } from 'downshift';\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { Icon, check, chevronDown } from '@wordpress/icons';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { Button, VisuallyHidden } from '../';\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};\nexport default function CustomSelectControl( {\n\t/** Start opting into the larger default height that will become the default size in a future version. */\n\t__next36pxDefaultSize = false,\n\tclassName,\n\thideLabelFromVision,\n\tlabel,\n\tdescribedBy,\n\toptions: items,\n\tonChange: onSelectedItemChange,\n\tvalue: _selectedItem,\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<label\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</label>\n\t\t\t) }\n\t\t\t<Button\n\t\t\t\t{ ...getToggleButtonProps( {\n\t\t\t\t\t// This is needed because some speech recognition software don't support `aria-labelledby`.\n\t\t\t\t\t'aria-label': label,\n\t\t\t\t\t'aria-labelledby': undefined,\n\t\t\t\t\tclassName: classnames(\n\t\t\t\t\t\t'components-custom-select-control__button',\n\t\t\t\t\t\t{ 'is-next-36px-default-size': __next36pxDefaultSize }\n\t\t\t\t\t),\n\t\t\t\t\tisSmall: ! __next36pxDefaultSize,\n\t\t\t\t\tdescribedBy: getDescribedBy(),\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t{ itemToString( selectedItem ) }\n\t\t\t\t<Icon\n\t\t\t\t\ticon={ chevronDown }\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'components-custom-select-control__button-icon',\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'is-next-36px-default-size': __next36pxDefaultSize,\n\t\t\t\t\t\t}\n\t\t\t\t\t) }\n\t\t\t\t\tsize={ 18 }\n\t\t\t\t/>\n\t\t\t</Button>\n\t\t\t{ /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */ }\n\t\t\t<ul { ...menuProps } onKeyDown={ onKeyDownHandler }>\n\t\t\t\t{ isOpen &&\n\t\t\t\t\titems.map( ( item, index ) => (\n\t\t\t\t\t\t// eslint-disable-next-line react/jsx-key\n\t\t\t\t\t\t<li\n\t\t\t\t\t\t\t{ ...getItemProps( {\n\t\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\tkey: item.key,\n\t\t\t\t\t\t\t\tclassName: classnames(\n\t\t\t\t\t\t\t\t\titem.className,\n\t\t\t\t\t\t\t\t\t'components-custom-select-control__item',\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t'is-highlighted':\n\t\t\t\t\t\t\t\t\t\t\tindex === highlightedIndex,\n\t\t\t\t\t\t\t\t\t\t'has-hint': !! item.__experimentalHint,\n\t\t\t\t\t\t\t\t\t\t'is-next-36px-default-size': __next36pxDefaultSize,\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\tstyle: item.style,\n\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ item.name }\n\t\t\t\t\t\t\t{ item.__experimentalHint && (\n\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{ item.__experimentalHint }\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t{ item === selectedItem && (\n\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\ticon={ check }\n\t\t\t\t\t\t\t\t\tclassName=\"components-custom-select-control__item-icon\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</li>\n\t\t\t\t\t) ) }\n\t\t\t</ul>\n\t\t</div>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/components/src/custom-select-control/index.js"],"names":["useSelect","classnames","Icon","check","chevronDown","__","sprintf","useCallback","Button","VisuallyHidden","itemToString","item","name","stateReducer","selectedItem","type","changes","props","items","stateChangeTypes","ToggleButtonKeyDownArrowDown","Math","min","indexOf","length","ToggleButtonKeyDownArrowUp","max","CustomSelectControl","__next36pxDefaultSize","className","hideLabelFromVision","label","describedBy","options","onChange","onSelectedItemChange","value","_selectedItem","getLabelProps","getToggleButtonProps","getMenuProps","getItemProps","isOpen","highlightedIndex","initialSelectedItem","undefined","getDescribedBy","menuProps","onKeyDownHandler","e","stopPropagation","onKeyDown","startsWith","isSmall","map","index","key","__experimentalHint","style"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { useSelect } from 'downshift';\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { Icon, check, chevronDown } from '@wordpress/icons';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { Button, VisuallyHidden } from '../';\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};\nexport default function CustomSelectControl( {\n\t/** Start opting into the larger default height that will become the default size in a future version. */\n\t__next36pxDefaultSize = false,\n\tclassName,\n\thideLabelFromVision,\n\tlabel,\n\tdescribedBy,\n\toptions: items,\n\tonChange: onSelectedItemChange,\n\tvalue: _selectedItem,\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<label\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</label>\n\t\t\t) }\n\t\t\t<Button\n\t\t\t\t{ ...getToggleButtonProps( {\n\t\t\t\t\t// This is needed because some speech recognition software don't support `aria-labelledby`.\n\t\t\t\t\t'aria-label': label,\n\t\t\t\t\t'aria-labelledby': undefined,\n\t\t\t\t\tclassName: classnames(\n\t\t\t\t\t\t'components-custom-select-control__button',\n\t\t\t\t\t\t{ 'is-next-36px-default-size': __next36pxDefaultSize }\n\t\t\t\t\t),\n\t\t\t\t\tisSmall: ! __next36pxDefaultSize,\n\t\t\t\t\tdescribedBy: getDescribedBy(),\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t{ itemToString( selectedItem ) }\n\t\t\t\t<Icon\n\t\t\t\t\ticon={ chevronDown }\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'components-custom-select-control__button-icon',\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'is-next-36px-default-size': __next36pxDefaultSize,\n\t\t\t\t\t\t}\n\t\t\t\t\t) }\n\t\t\t\t\tsize={ 18 }\n\t\t\t\t/>\n\t\t\t</Button>\n\t\t\t{ /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */ }\n\t\t\t<ul { ...menuProps } onKeyDown={ onKeyDownHandler }>\n\t\t\t\t{ isOpen &&\n\t\t\t\t\titems.map( ( item, index ) => (\n\t\t\t\t\t\t// eslint-disable-next-line react/jsx-key\n\t\t\t\t\t\t<li\n\t\t\t\t\t\t\t{ ...getItemProps( {\n\t\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\tkey: item.key,\n\t\t\t\t\t\t\t\tclassName: classnames(\n\t\t\t\t\t\t\t\t\titem.className,\n\t\t\t\t\t\t\t\t\t'components-custom-select-control__item',\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t'is-highlighted':\n\t\t\t\t\t\t\t\t\t\t\tindex === highlightedIndex,\n\t\t\t\t\t\t\t\t\t\t'has-hint': !! item.__experimentalHint,\n\t\t\t\t\t\t\t\t\t\t'is-next-36px-default-size':\n\t\t\t\t\t\t\t\t\t\t\t__next36pxDefaultSize,\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\tstyle: item.style,\n\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ item.name }\n\t\t\t\t\t\t\t{ item.__experimentalHint && (\n\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{ item.__experimentalHint }\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t{ item === selectedItem && (\n\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\ticon={ check }\n\t\t\t\t\t\t\t\t\tclassName=\"components-custom-select-control__item-icon\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</li>\n\t\t\t\t\t) ) }\n\t\t\t</ul>\n\t\t</div>\n\t);\n}\n"]}

package/build-module/date-time/{date.js → date/index.js}

@@ -1,11 +1,14 @@
-import { createElement } from "@wordpress/element";
+import _extends from "@babel/runtime/helpers/esm/extends";
+import { createElement, Fragment } from "@wordpress/element";
 
 /**
  * External dependencies
  */
 import moment from 'moment';
-import classnames from 'classnames'; // react-dates doesn't tree-shake correctly, so we import from the individual
-// component here, to avoid including too much of the library
+// Needed to initialise the default datepicker styles.
+// See: https://github.com/airbnb/react-dates#initialize
+import 'react-dates/initialize'; // `react-dates` doesn't tree-shake correctly, so we import from the individual
+// component here.
 
 import DayPickerSingleDateController from 'react-dates/lib/components/DayPickerSingleDateController';
 /**
@@ -14,24 +17,24 @@ import DayPickerSingleDateController from 'react-dates/lib/components/DayPickerS
 
 import { useEffect, useRef } from '@wordpress/element';
 import { isRTL, _n, sprintf } from '@wordpress/i18n';
+import { arrowLeft, arrowRight } from '@wordpress/icons';
 /**
  * Internal dependencies
  */
 
 import { getMomentDate } from './utils';
-/**
- * Module Constants
- */
-
+import { Day, NavPrevButton, NavNextButton } from './styles';
 const TIMEZONELESS_FORMAT = 'YYYY-MM-DDTHH:mm:ss';
 const ARIAL_LABEL_TIME_FORMAT = 'dddd, LL';
 
+const noop = () => {};
+
 function DatePickerDay(_ref) {
   let {
     day,
     events = []
   } = _ref;
-  const ref = useRef();
+  const ref = useRef(null);
   /*
    * a11y hack to make the `There is/are n events` string
    * available speaking for readers,
@@ -43,7 +46,7 @@ function DatePickerDay(_ref) {
     var _ref$current;
 
     // Bail when no parent node.
-    if (!(ref !== null && ref !== void 0 && (_ref$current = ref.current) !== null && _ref$current !== void 0 && _ref$current.parentNode)) {
+    if (!((ref === null || ref === void 0 ? void 0 : (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.parentNode) instanceof Element)) {
       return;
     }
 
@@ -61,16 +64,37 @@ function DatePickerDay(_ref) {
     const dayWithEventsDescription = sprintf( // translators: 1: Calendar day format, 2: Calendar event number.
     _n('%1$s. There is %2$d event.', '%1$s. There are %2$d events.', events.length), dayAriaLabel, events.length);
     parentNode.setAttribute('aria-label', dayWithEventsDescription);
-  }, [events.length]);
-  return createElement("div", {
+  }, [day, events.length]);
+  return createElement(Day, {
     ref: ref,
-    className: classnames('components-datetime__date__day', {
-      'has-events': events === null || events === void 0 ? void 0 : events.length
-    })
+    className: "components-datetime__date__day" // Unused, for backwards compatibility.
+    ,
+    hasEvents: !!(events !== null && events !== void 0 && events.length),
+    alignment: "center"
   }, day.format('D'));
 }
+/**
+ * DatePicker is a React component that renders a calendar for date selection.
+ *
+ * ```jsx
+ * import { DatePicker } from '@wordpress/components';
+ * import { useState } from '@wordpress/element';
+ *
+ * const MyDatePicker = () => {
+ *   const [ date, setDate ] = useState( new Date() );
+ *
+ *   return (
+ *     <DatePicker
+ *       currentDate={ date }
+ *       onChange={ ( newDate ) => setDate( newDate ) }
+ *     />
+ *   );
+ * };
+ * ```
+ */
 
-function DatePicker(_ref2) {
+
+export function DatePicker(_ref2) {
   let {
     currentDate,
     onChange,
@@ -78,7 +102,7 @@ function DatePicker(_ref2) {
     isInvalidDate,
     onMonthPreviewed
   } = _ref2;
-  const nodeRef = useRef();
+  const nodeRef = useRef(null);
 
   const onMonthPreviewedHandler = newMonthDate => {
     onMonthPreviewed === null || onMonthPreviewed === void 0 ? void 0 : onMonthPreviewed(newMonthDate.toISOString());
@@ -108,7 +132,7 @@ function DatePicker(_ref2) {
       // Retrieve the focus region div.
       const focusRegion = nodeRef.current.querySelector('.DayPicker_focusRegion');
 
-      if (!focusRegion) {
+      if (!(focusRegion instanceof HTMLElement)) {
         return;
       } // Keep the focus on focus region.
 
@@ -118,14 +142,18 @@ function DatePicker(_ref2) {
   };
 
   const onChangeMoment = newDate => {
-    // If currentDate is null, use now as momentTime to designate hours, minutes, seconds.
+    if (!newDate) {
+      return;
+    } // If currentDate is null, use now as momentTime to designate hours, minutes, seconds.
+
+
     const momentDate = currentDate ? moment(currentDate) : moment();
     const momentTime = {
       hours: momentDate.hours(),
       minutes: momentDate.minutes(),
       seconds: 0
     };
-    onChange(newDate.set(momentTime).format(TIMEZONELESS_FORMAT)); // Keep focus on the date picker.
+    onChange === null || onChange === void 0 ? void 0 : onChange(newDate.set(momentTime).format(TIMEZONELESS_FORMAT)); // Keep focus on the date picker.
 
     keepFocusInside();
   };
@@ -144,7 +172,9 @@ function DatePicker(_ref2) {
     ref: nodeRef
   }, createElement(DayPickerSingleDateController, {
     date: momentDate,
+    initialVisibleMonth: null,
     daySize: 30,
+    horizontalMonthPadding: 0,
     focused: true,
     hideKeyboardShortcutsPanel: true // This is a hack to force the calendar to update on month or year change
     // https://github.com/airbnb/react-dates/issues/240#issuecomment-361776665
@@ -158,16 +188,44 @@ function DatePicker(_ref2) {
     dayAriaLabelFormat: ARIAL_LABEL_TIME_FORMAT,
     isRTL: isRTL(),
     isOutsideRange: date => {
-      return isInvalidDate && isInvalidDate(date.toDate());
+      return !!isInvalidDate && isInvalidDate(date.toDate());
     },
     onPrevMonthClick: onMonthPreviewedHandler,
     onNextMonthClick: onMonthPreviewedHandler,
     renderDayContents: day => createElement(DatePickerDay, {
       day: day,
       events: getEventsPerDay(day)
-    })
+    }),
+    renderMonthElement: _ref3 => {
+      let {
+        month
+      } = _ref3;
+      return createElement(Fragment, null, createElement("strong", null, month.format('MMMM')), ' ', month.format('YYYY'));
+    },
+    renderNavPrevButton: _ref4 => {
+      let {
+        ariaLabel,
+        ...props
+      } = _ref4;
+      return createElement(NavPrevButton, _extends({
+        icon: arrowLeft,
+        variant: "tertiary",
+        "aria-label": ariaLabel
+      }, props));
+    },
+    renderNavNextButton: _ref5 => {
+      let {
+        ariaLabel,
+        ...props
+      } = _ref5;
+      return createElement(NavNextButton, _extends({
+        icon: arrowRight,
+        variant: "tertiary",
+        "aria-label": ariaLabel
+      }, props));
+    },
+    onFocusChange: noop
   }));
 }
-
 export default DatePicker;
-//# sourceMappingURL=date.js.map
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/components/src/date-time/date/index.tsx"],"names":["moment","DayPickerSingleDateController","useEffect","useRef","isRTL","_n","sprintf","arrowLeft","arrowRight","getMomentDate","Day","NavPrevButton","NavNextButton","TIMEZONELESS_FORMAT","ARIAL_LABEL_TIME_FORMAT","noop","DatePickerDay","day","events","ref","current","parentNode","Element","dayAriaLabel","format","length","setAttribute","dayWithEventsDescription","DatePicker","currentDate","onChange","isInvalidDate","onMonthPreviewed","nodeRef","onMonthPreviewedHandler","newMonthDate","toISOString","keepFocusInside","ownerDocument","activeElement","contains","focusRegion","querySelector","HTMLElement","focus","onChangeMoment","newDate","momentDate","momentTime","hours","minutes","seconds","set","getEventsPerDay","filter","eventDay","isSame","date","toDate","month","ariaLabel","props"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport moment from 'moment';\nimport type { Moment } from 'moment';\n// Needed to initialise the default datepicker styles.\n// See: https://github.com/airbnb/react-dates#initialize\nimport 'react-dates/initialize';\n// `react-dates` doesn't tree-shake correctly, so we import from the individual\n// component here.\nimport DayPickerSingleDateController from 'react-dates/lib/components/DayPickerSingleDateController';\n\n/**\n * WordPress dependencies\n */\nimport { useEffect, useRef } from '@wordpress/element';\nimport { isRTL, _n, sprintf } from '@wordpress/i18n';\nimport { arrowLeft, arrowRight } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { getMomentDate } from './utils';\nimport type { DatePickerDayProps, DatePickerProps } from '../types';\nimport { Day, NavPrevButton, NavNextButton } from './styles';\n\nconst TIMEZONELESS_FORMAT = 'YYYY-MM-DDTHH:mm:ss';\nconst ARIAL_LABEL_TIME_FORMAT = 'dddd, LL';\nconst noop = () => {};\n\nfunction DatePickerDay( { day, events = [] }: DatePickerDayProps ) {\n\tconst ref = useRef< HTMLDivElement >( null );\n\n\t/*\n\t * a11y hack to make the `There is/are n events` string\n\t * available speaking for readers,\n\t * re-defining the aria-label attribute.\n\t * This attribute is handled by the react-dates component.\n\t */\n\tuseEffect( () => {\n\t\t// Bail when no parent node.\n\t\tif ( ! ( ref?.current?.parentNode instanceof Element ) ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { parentNode } = ref.current;\n\t\tconst dayAriaLabel = moment( day ).format( ARIAL_LABEL_TIME_FORMAT );\n\n\t\tif ( ! events.length ) {\n\t\t\t// Set aria-label without event description.\n\t\t\tparentNode.setAttribute( 'aria-label', dayAriaLabel );\n\t\t\treturn;\n\t\t}\n\n\t\tconst dayWithEventsDescription = sprintf(\n\t\t\t// translators: 1: Calendar day format, 2: Calendar event number.\n\t\t\t_n(\n\t\t\t\t'%1$s. There is %2$d event.',\n\t\t\t\t'%1$s. There are %2$d events.',\n\t\t\t\tevents.length\n\t\t\t),\n\t\t\tdayAriaLabel,\n\t\t\tevents.length\n\t\t);\n\n\t\tparentNode.setAttribute( 'aria-label', dayWithEventsDescription );\n\t}, [ day, events.length ] );\n\n\treturn (\n\t\t<Day\n\t\t\tref={ ref }\n\t\t\tclassName=\"components-datetime__date__day\" // Unused, for backwards compatibility.\n\t\t\thasEvents={ !! events?.length }\n\t\t\talignment=\"center\"\n\t\t>\n\t\t\t{ day.format( 'D' ) }\n\t\t</Day>\n\t);\n}\n\n/**\n * DatePicker is a React component that renders a calendar for date selection.\n *\n * ```jsx\n * import { DatePicker } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyDatePicker = () => {\n *   const [ date, setDate ] = useState( new Date() );\n *\n *   return (\n *     <DatePicker\n *       currentDate={ date }\n *       onChange={ ( newDate ) => setDate( newDate ) }\n *     />\n *   );\n * };\n * ```\n */\nexport function DatePicker( {\n\tcurrentDate,\n\tonChange,\n\tevents,\n\tisInvalidDate,\n\tonMonthPreviewed,\n}: DatePickerProps ) {\n\tconst nodeRef = useRef< HTMLDivElement >( null );\n\n\tconst onMonthPreviewedHandler = ( newMonthDate: Moment ) => {\n\t\tonMonthPreviewed?.( newMonthDate.toISOString() );\n\t\tkeepFocusInside();\n\t};\n\n\t/*\n\t * Todo: We should remove this function ASAP.\n\t * It is kept because focus is lost when we click on the previous and next month buttons.\n\t * This focus loss closes the date picker popover.\n\t * Ideally we should add an upstream commit on react-dates to fix this issue.\n\t */\n\tconst keepFocusInside = () => {\n\t\tif ( ! nodeRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { ownerDocument } = nodeRef.current;\n\t\tconst { activeElement } = ownerDocument;\n\n\t\t// If focus was lost.\n\t\tif (\n\t\t\t! activeElement ||\n\t\t\t! nodeRef.current.contains( ownerDocument.activeElement )\n\t\t) {\n\t\t\t// Retrieve the focus region div.\n\t\t\tconst focusRegion = nodeRef.current.querySelector(\n\t\t\t\t'.DayPicker_focusRegion'\n\t\t\t);\n\t\t\tif ( ! ( focusRegion instanceof HTMLElement ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\t// Keep the focus on focus region.\n\t\t\tfocusRegion.focus();\n\t\t}\n\t};\n\n\tconst onChangeMoment = ( newDate: Moment | null ) => {\n\t\tif ( ! newDate ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// If currentDate is null, use now as momentTime to designate hours, minutes, seconds.\n\t\tconst momentDate = currentDate ? moment( currentDate ) : moment();\n\t\tconst momentTime = {\n\t\t\thours: momentDate.hours(),\n\t\t\tminutes: momentDate.minutes(),\n\t\t\tseconds: 0,\n\t\t};\n\n\t\tonChange?.( newDate.set( momentTime ).format( TIMEZONELESS_FORMAT ) );\n\n\t\t// Keep focus on the date picker.\n\t\tkeepFocusInside();\n\t};\n\n\tconst getEventsPerDay = ( day: Moment ) => {\n\t\tif ( ! events?.length ) {\n\t\t\treturn [];\n\t\t}\n\n\t\treturn events.filter( ( eventDay ) =>\n\t\t\tday.isSame( eventDay.date, 'day' )\n\t\t);\n\t};\n\n\tconst momentDate = getMomentDate( currentDate );\n\n\treturn (\n\t\t<div className=\"components-datetime__date\" ref={ nodeRef }>\n\t\t\t<DayPickerSingleDateController\n\t\t\t\tdate={ momentDate }\n\t\t\t\tinitialVisibleMonth={ null }\n\t\t\t\tdaySize={ 30 }\n\t\t\t\thorizontalMonthPadding={ 0 }\n\t\t\t\tfocused\n\t\t\t\thideKeyboardShortcutsPanel\n\t\t\t\t// This is a hack to force the calendar to update on month or year change\n\t\t\t\t// https://github.com/airbnb/react-dates/issues/240#issuecomment-361776665\n\t\t\t\tkey={ `datepicker-controller-${\n\t\t\t\t\tmomentDate ? momentDate.format( 'MM-YYYY' ) : 'null'\n\t\t\t\t}` }\n\t\t\t\tnoBorder\n\t\t\t\tnumberOfMonths={ 1 }\n\t\t\t\tonDateChange={ onChangeMoment }\n\t\t\t\ttransitionDuration={ 0 }\n\t\t\t\tweekDayFormat=\"ddd\"\n\t\t\t\tdayAriaLabelFormat={ ARIAL_LABEL_TIME_FORMAT }\n\t\t\t\tisRTL={ isRTL() }\n\t\t\t\tisOutsideRange={ ( date ) => {\n\t\t\t\t\treturn !! isInvalidDate && isInvalidDate( date.toDate() );\n\t\t\t\t} }\n\t\t\t\tonPrevMonthClick={ onMonthPreviewedHandler }\n\t\t\t\tonNextMonthClick={ onMonthPreviewedHandler }\n\t\t\t\trenderDayContents={ ( day ) => (\n\t\t\t\t\t<DatePickerDay\n\t\t\t\t\t\tday={ day }\n\t\t\t\t\t\tevents={ getEventsPerDay( day ) }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\trenderMonthElement={ ( { month } ) => (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<strong>{ month.format( 'MMMM' ) }</strong>{ ' ' }\n\t\t\t\t\t\t{ month.format( 'YYYY' ) }\n\t\t\t\t\t</>\n\t\t\t\t) }\n\t\t\t\trenderNavPrevButton={ ( { ariaLabel, ...props } ) => (\n\t\t\t\t\t<NavPrevButton\n\t\t\t\t\t\ticon={ arrowLeft }\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\taria-label={ ariaLabel }\n\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\trenderNavNextButton={ ( { ariaLabel, ...props } ) => (\n\t\t\t\t\t<NavNextButton\n\t\t\t\t\t\ticon={ arrowRight }\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\taria-label={ ariaLabel }\n\t\t\t\t\t\t{ ...props }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\tonFocusChange={ noop }\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nexport default DatePicker;\n"]}

package/build-module/date-time/date/styles.js

@@ -0,0 +1,61 @@
+import _styled from "@emotion/styled/base";
+
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+
+/**
+ * External dependencies
+ */
+import { css } from '@emotion/react';
+/**
+ * Internal dependencies
+ */
+
+import Button from '../../button';
+import { COLORS } from '../../utils';
+import { VStack } from '../../v-stack'; // Styles that overrides the calendar styling provided by react-dates go in
+// style.scss. Everything else goes here.
+
+export const Day = /*#__PURE__*/_styled(VStack, process.env.NODE_ENV === "production" ? {
+  target: "e105ri6r2"
+} : {
+  target: "e105ri6r2",
+  label: "Day"
+})("height:100%;position:relative;", props => props.hasEvents && `
+		::before {
+			background: var(--wp-admin-theme-color);
+			border-radius: 2px;
+			bottom: 0;
+			content: " ";
+			height: 4px;
+			left: 50%;
+			margin-left: -2px;
+			position: absolute;
+			width: 4px;
+
+			.CalendarDay__selected & {
+				background: ${COLORS.white};
+			}
+		}
+		`, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGF0ZS10aW1lL2RhdGUvc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWdCNkQiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9kYXRlLXRpbWUvZGF0ZS9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBCdXR0b24gZnJvbSAnLi4vLi4vYnV0dG9uJztcbmltcG9ydCB7IENPTE9SUyB9IGZyb20gJy4uLy4uL3V0aWxzJztcbmltcG9ydCB7IFZTdGFjayB9IGZyb20gJy4uLy4uL3Ytc3RhY2snO1xuXG4vLyBTdHlsZXMgdGhhdCBvdmVycmlkZXMgdGhlIGNhbGVuZGFyIHN0eWxpbmcgcHJvdmlkZWQgYnkgcmVhY3QtZGF0ZXMgZ28gaW5cbi8vIHN0eWxlLnNjc3MuIEV2ZXJ5dGhpbmcgZWxzZSBnb2VzIGhlcmUuXG5cbmV4cG9ydCBjb25zdCBEYXkgPSBzdHlsZWQoIFZTdGFjayApPCB7IGhhc0V2ZW50czogYm9vbGVhbiB9ID5gXG5cdGhlaWdodDogMTAwJTtcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXG5cdCR7ICggcHJvcHMgKSA9PlxuXHRcdHByb3BzLmhhc0V2ZW50cyAmJlxuXHRcdGBcblx0XHQ6OmJlZm9yZSB7XG5cdFx0XHRiYWNrZ3JvdW5kOiB2YXIoLS13cC1hZG1pbi10aGVtZS1jb2xvcik7XG5cdFx0XHRib3JkZXItcmFkaXVzOiAycHg7XG5cdFx0XHRib3R0b206IDA7XG5cdFx0XHRjb250ZW50OiBcIiBcIjtcblx0XHRcdGhlaWdodDogNHB4O1xuXHRcdFx0bGVmdDogNTAlO1xuXHRcdFx0bWFyZ2luLWxlZnQ6IC0ycHg7XG5cdFx0XHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdFx0XHR3aWR0aDogNHB4O1xuXG5cdFx0XHQuQ2FsZW5kYXJEYXlfX3NlbGVjdGVkICYge1xuXHRcdFx0XHRiYWNrZ3JvdW5kOiAkeyBDT0xPUlMud2hpdGUgfTtcblx0XHRcdH1cblx0XHR9XG5cdFx0YCB9XG5gO1xuXG5jb25zdCBiYXNlTmF2QnV0dG9uID0gY3NzYFxuXHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdHRvcDogMTVweDtcbmA7XG5cbmV4cG9ydCBjb25zdCBOYXZQcmV2QnV0dG9uID0gc3R5bGVkKCBCdXR0b24gKWBcblx0JHsgYmFzZU5hdkJ1dHRvbiB9XG5cdGxlZnQ6IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgTmF2TmV4dEJ1dHRvbiA9IHN0eWxlZCggQnV0dG9uIClgXG5cdCR7IGJhc2VOYXZCdXR0b24gfVxuXHRyaWdodDogMDtcbmA7XG4iXX0= */"));
+const baseNavButton = process.env.NODE_ENV === "production" ? {
+  name: "1zok93",
+  styles: "position:absolute;top:15px"
+} : {
+  name: "1az9v34-baseNavButton",
+  styles: "position:absolute;top:15px;label:baseNavButton;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGF0ZS10aW1lL2RhdGUvc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXlDeUIiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9kYXRlLXRpbWUvZGF0ZS9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBCdXR0b24gZnJvbSAnLi4vLi4vYnV0dG9uJztcbmltcG9ydCB7IENPTE9SUyB9IGZyb20gJy4uLy4uL3V0aWxzJztcbmltcG9ydCB7IFZTdGFjayB9IGZyb20gJy4uLy4uL3Ytc3RhY2snO1xuXG4vLyBTdHlsZXMgdGhhdCBvdmVycmlkZXMgdGhlIGNhbGVuZGFyIHN0eWxpbmcgcHJvdmlkZWQgYnkgcmVhY3QtZGF0ZXMgZ28gaW5cbi8vIHN0eWxlLnNjc3MuIEV2ZXJ5dGhpbmcgZWxzZSBnb2VzIGhlcmUuXG5cbmV4cG9ydCBjb25zdCBEYXkgPSBzdHlsZWQoIFZTdGFjayApPCB7IGhhc0V2ZW50czogYm9vbGVhbiB9ID5gXG5cdGhlaWdodDogMTAwJTtcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXG5cdCR7ICggcHJvcHMgKSA9PlxuXHRcdHByb3BzLmhhc0V2ZW50cyAmJlxuXHRcdGBcblx0XHQ6OmJlZm9yZSB7XG5cdFx0XHRiYWNrZ3JvdW5kOiB2YXIoLS13cC1hZG1pbi10aGVtZS1jb2xvcik7XG5cdFx0XHRib3JkZXItcmFkaXVzOiAycHg7XG5cdFx0XHRib3R0b206IDA7XG5cdFx0XHRjb250ZW50OiBcIiBcIjtcblx0XHRcdGhlaWdodDogNHB4O1xuXHRcdFx0bGVmdDogNTAlO1xuXHRcdFx0bWFyZ2luLWxlZnQ6IC0ycHg7XG5cdFx0XHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdFx0XHR3aWR0aDogNHB4O1xuXG5cdFx0XHQuQ2FsZW5kYXJEYXlfX3NlbGVjdGVkICYge1xuXHRcdFx0XHRiYWNrZ3JvdW5kOiAkeyBDT0xPUlMud2hpdGUgfTtcblx0XHRcdH1cblx0XHR9XG5cdFx0YCB9XG5gO1xuXG5jb25zdCBiYXNlTmF2QnV0dG9uID0gY3NzYFxuXHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdHRvcDogMTVweDtcbmA7XG5cbmV4cG9ydCBjb25zdCBOYXZQcmV2QnV0dG9uID0gc3R5bGVkKCBCdXR0b24gKWBcblx0JHsgYmFzZU5hdkJ1dHRvbiB9XG5cdGxlZnQ6IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgTmF2TmV4dEJ1dHRvbiA9IHN0eWxlZCggQnV0dG9uIClgXG5cdCR7IGJhc2VOYXZCdXR0b24gfVxuXHRyaWdodDogMDtcbmA7XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+export const NavPrevButton = /*#__PURE__*/_styled(Button, process.env.NODE_ENV === "production" ? {
+  target: "e105ri6r1"
+} : {
+  target: "e105ri6r1",
+  label: "NavPrevButton"
+})(baseNavButton, " left:0;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGF0ZS10aW1lL2RhdGUvc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQThDNkMiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9kYXRlLXRpbWUvZGF0ZS9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBCdXR0b24gZnJvbSAnLi4vLi4vYnV0dG9uJztcbmltcG9ydCB7IENPTE9SUyB9IGZyb20gJy4uLy4uL3V0aWxzJztcbmltcG9ydCB7IFZTdGFjayB9IGZyb20gJy4uLy4uL3Ytc3RhY2snO1xuXG4vLyBTdHlsZXMgdGhhdCBvdmVycmlkZXMgdGhlIGNhbGVuZGFyIHN0eWxpbmcgcHJvdmlkZWQgYnkgcmVhY3QtZGF0ZXMgZ28gaW5cbi8vIHN0eWxlLnNjc3MuIEV2ZXJ5dGhpbmcgZWxzZSBnb2VzIGhlcmUuXG5cbmV4cG9ydCBjb25zdCBEYXkgPSBzdHlsZWQoIFZTdGFjayApPCB7IGhhc0V2ZW50czogYm9vbGVhbiB9ID5gXG5cdGhlaWdodDogMTAwJTtcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXG5cdCR7ICggcHJvcHMgKSA9PlxuXHRcdHByb3BzLmhhc0V2ZW50cyAmJlxuXHRcdGBcblx0XHQ6OmJlZm9yZSB7XG5cdFx0XHRiYWNrZ3JvdW5kOiB2YXIoLS13cC1hZG1pbi10aGVtZS1jb2xvcik7XG5cdFx0XHRib3JkZXItcmFkaXVzOiAycHg7XG5cdFx0XHRib3R0b206IDA7XG5cdFx0XHRjb250ZW50OiBcIiBcIjtcblx0XHRcdGhlaWdodDogNHB4O1xuXHRcdFx0bGVmdDogNTAlO1xuXHRcdFx0bWFyZ2luLWxlZnQ6IC0ycHg7XG5cdFx0XHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdFx0XHR3aWR0aDogNHB4O1xuXG5cdFx0XHQuQ2FsZW5kYXJEYXlfX3NlbGVjdGVkICYge1xuXHRcdFx0XHRiYWNrZ3JvdW5kOiAkeyBDT0xPUlMud2hpdGUgfTtcblx0XHRcdH1cblx0XHR9XG5cdFx0YCB9XG5gO1xuXG5jb25zdCBiYXNlTmF2QnV0dG9uID0gY3NzYFxuXHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdHRvcDogMTVweDtcbmA7XG5cbmV4cG9ydCBjb25zdCBOYXZQcmV2QnV0dG9uID0gc3R5bGVkKCBCdXR0b24gKWBcblx0JHsgYmFzZU5hdkJ1dHRvbiB9XG5cdGxlZnQ6IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgTmF2TmV4dEJ1dHRvbiA9IHN0eWxlZCggQnV0dG9uIClgXG5cdCR7IGJhc2VOYXZCdXR0b24gfVxuXHRyaWdodDogMDtcbmA7XG4iXX0= */"));
+export const NavNextButton = /*#__PURE__*/_styled(Button, process.env.NODE_ENV === "production" ? {
+  target: "e105ri6r0"
+} : {
+  target: "e105ri6r0",
+  label: "NavNextButton"
+})(baseNavButton, " right:0;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGF0ZS10aW1lL2RhdGUvc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQW1ENkMiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9kYXRlLXRpbWUvZGF0ZS9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBCdXR0b24gZnJvbSAnLi4vLi4vYnV0dG9uJztcbmltcG9ydCB7IENPTE9SUyB9IGZyb20gJy4uLy4uL3V0aWxzJztcbmltcG9ydCB7IFZTdGFjayB9IGZyb20gJy4uLy4uL3Ytc3RhY2snO1xuXG4vLyBTdHlsZXMgdGhhdCBvdmVycmlkZXMgdGhlIGNhbGVuZGFyIHN0eWxpbmcgcHJvdmlkZWQgYnkgcmVhY3QtZGF0ZXMgZ28gaW5cbi8vIHN0eWxlLnNjc3MuIEV2ZXJ5dGhpbmcgZWxzZSBnb2VzIGhlcmUuXG5cbmV4cG9ydCBjb25zdCBEYXkgPSBzdHlsZWQoIFZTdGFjayApPCB7IGhhc0V2ZW50czogYm9vbGVhbiB9ID5gXG5cdGhlaWdodDogMTAwJTtcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXG5cdCR7ICggcHJvcHMgKSA9PlxuXHRcdHByb3BzLmhhc0V2ZW50cyAmJlxuXHRcdGBcblx0XHQ6OmJlZm9yZSB7XG5cdFx0XHRiYWNrZ3JvdW5kOiB2YXIoLS13cC1hZG1pbi10aGVtZS1jb2xvcik7XG5cdFx0XHRib3JkZXItcmFkaXVzOiAycHg7XG5cdFx0XHRib3R0b206IDA7XG5cdFx0XHRjb250ZW50OiBcIiBcIjtcblx0XHRcdGhlaWdodDogNHB4O1xuXHRcdFx0bGVmdDogNTAlO1xuXHRcdFx0bWFyZ2luLWxlZnQ6IC0ycHg7XG5cdFx0XHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdFx0XHR3aWR0aDogNHB4O1xuXG5cdFx0XHQuQ2FsZW5kYXJEYXlfX3NlbGVjdGVkICYge1xuXHRcdFx0XHRiYWNrZ3JvdW5kOiAkeyBDT0xPUlMud2hpdGUgfTtcblx0XHRcdH1cblx0XHR9XG5cdFx0YCB9XG5gO1xuXG5jb25zdCBiYXNlTmF2QnV0dG9uID0gY3NzYFxuXHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdHRvcDogMTVweDtcbmA7XG5cbmV4cG9ydCBjb25zdCBOYXZQcmV2QnV0dG9uID0gc3R5bGVkKCBCdXR0b24gKWBcblx0JHsgYmFzZU5hdkJ1dHRvbiB9XG5cdGxlZnQ6IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgTmF2TmV4dEJ1dHRvbiA9IHN0eWxlZCggQnV0dG9uIClgXG5cdCR7IGJhc2VOYXZCdXR0b24gfVxuXHRyaWdodDogMDtcbmA7XG4iXX0= */"));
+//# sourceMappingURL=styles.js.map

package/build-module/date-time/date/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/components/src/date-time/date/styles.ts"],"names":["css","Button","COLORS","VStack","Day","props","hasEvents","white","baseNavButton","NavPrevButton","NavNextButton"],"mappings":";;;;AAAA;AACA;AACA;AAEA,SAASA,GAAT,QAAoB,gBAApB;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,cAAnB;AACA,SAASC,MAAT,QAAuB,aAAvB;AACA,SAASC,MAAT,QAAuB,eAAvB,C,CAEA;AACA;;AAEA,OAAO,MAAMC,GAAG,GAAG,qBAAQD,MAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,mCAIVE,KAAF,IACFA,KAAK,CAACC,SAAN,IACC;AACH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,kBAAmBJ,MAAM,CAACK,KAAO;AACjC;AACA;AACA,GAtBgB,i3DAAT;AAyBP,MAAMC,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAAnB;AAKA,OAAO,MAAMC,aAAa,GAAG,qBAAQR,MAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,CACtBO,aADsB,w3DAAnB;AAKP,OAAO,MAAME,aAAa,GAAG,qBAAQT,MAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,CACtBO,aADsB,y3DAAnB","sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\nimport { css } from '@emotion/react';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport { COLORS } from '../../utils';\nimport { VStack } from '../../v-stack';\n\n// Styles that overrides the calendar styling provided by react-dates go in\n// style.scss. Everything else goes here.\n\nexport const Day = styled( VStack )< { hasEvents: boolean } >`\n\theight: 100%;\n\tposition: relative;\n\n\t${ ( props ) =>\n\t\tprops.hasEvents &&\n\t\t`\n\t\t::before {\n\t\t\tbackground: var(--wp-admin-theme-color);\n\t\t\tborder-radius: 2px;\n\t\t\tbottom: 0;\n\t\t\tcontent: \" \";\n\t\t\theight: 4px;\n\t\t\tleft: 50%;\n\t\t\tmargin-left: -2px;\n\t\t\tposition: absolute;\n\t\t\twidth: 4px;\n\n\t\t\t.CalendarDay__selected & {\n\t\t\t\tbackground: ${ COLORS.white };\n\t\t\t}\n\t\t}\n\t\t` }\n`;\n\nconst baseNavButton = css`\n\tposition: absolute;\n\ttop: 15px;\n`;\n\nexport const NavPrevButton = styled( Button )`\n\t${ baseNavButton }\n\tleft: 0;\n`;\n\nexport const NavNextButton = styled( Button )`\n\t${ baseNavButton }\n\tright: 0;\n`;\n"]}