npm - @wordpress/components - Versions diffs - 27.3.0 → 27.5.0 - Mend

@wordpress/components 27.3.0 → 27.5.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 (2222) hide show

package/build/context/wordpress-component.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":[],"sources":["@wordpress/components/src/context/wordpress-component.ts"],"sourcesContent":["/*\n External dependencies\n /\nimport type as React from 'react';\n\n// Based on https://github.com/ariakit/ariakit/blob/reakit/packages/reakit-utils/src/types.ts\nexport type WordPressComponentProps<\n\t/** Prop types. /\n\tP,\n\t/* The HTML element to inherit props from. /\n\tT extends React.ElementType \| null,\n\t/* Supports polymorphism through the `as` prop. /\n\tIsPolymorphic extends boolean = true,\n> = P &\n\t( T extends React.ElementType\n\t\t? // The `children` prop is being explicitly omitted since it is otherwise implicitly added\n\t\t // by `ComponentPropsWithRef`. The context is that components should require the `children`\n\t\t // prop explicitly when needed (see https://github.com/WordPress/gutenberg/pull/31817).\n\t\t Omit<\n\t\t\t\tReact.ComponentPropsWithoutRef< T >,\n\t\t\t\t'as' \| keyof P \| 'children'\n\t\t >\n\t\t: {} ) &\n\t( IsPolymorphic extends true\n\t\t? {\n\t\t\t\t/* The HTML element or React component to render the component as. /\n\t\t\t\tas?: T \| keyof JSX.IntrinsicElements;\n\t\t }\n\t\t: {} );\n\nexport type WordPressComponent<\n\tT extends React.ElementType \| null,\n\tO,\n\tIsPolymorphic extends boolean,\n> = {\n\t< TT extends React.ElementType >(\n\t\tprops: WordPressComponentProps< O, TT, IsPolymorphic > &\n\t\t\t( IsPolymorphic extends true ? { as: TT } : {} )\n\t): JSX.Element \| null;\n\t(\n\t\tprops: WordPressComponentProps< O, T, IsPolymorphic >\n\t): JSX.Element \| null;\n\tdisplayName?: string;\n\t/\n\t A CSS selector used to fake component interpolation in styled components\n\t * for components not generated by `styled`. Anything passed to `contextConnect`\n\t * will get this property.\n\t \n\t We restrict it to a class to align with the already existing class names that\n\t * are generated by the context system.\n\t */\n\tselector?: `.${ string }`;\n};\n\nexport type WordPressComponentFromProps<\n\tProps,\n\tForwardsRef extends boolean = true,\n> = Props extends WordPressComponentProps< infer P, infer T, infer I >\n\t? WordPressComponent<\n\t\t\tT,\n\t\t\tP & ( ForwardsRef extends true ? React.RefAttributes< any > : {} ),\n\t\t\tI\n\t >\n\t: never;\n"],"mappings":""}
1	+ {"version":3,"names":[],"sources":["@wordpress/components/src/context/wordpress-component.ts"],"sourcesContent":["/*\n External dependencies\n /\nimport type as React from 'react';\n\n// Based on https://github.com/ariakit/ariakit/blob/reakit/packages/reakit-utils/src/types.ts\nexport type WordPressComponentProps<\n\t/** Prop types. /\n\tP,\n\t/* The HTML element to inherit props from. /\n\tT extends React.ElementType \| null,\n\t/* Supports polymorphism through the `as` prop. /\n\tIsPolymorphic extends boolean = true,\n> = P &\n\t( T extends React.ElementType\n\t\t? // The `children` prop is being explicitly omitted since it is otherwise implicitly added\n\t\t // by `ComponentPropsWithRef`. The context is that components should require the `children`\n\t\t // prop explicitly when needed (see https://github.com/WordPress/gutenberg/pull/31817).\n\t\t Omit<\n\t\t\t\tReact.ComponentPropsWithoutRef< T >,\n\t\t\t\t'as' \| keyof P \| 'children'\n\t\t >\n\t\t: {} ) &\n\t( IsPolymorphic extends true\n\t\t? {\n\t\t\t\t/* The HTML element or React component to render the component as. /\n\t\t\t\tas?: T \| keyof JSX.IntrinsicElements;\n\t\t }\n\t\t: {} );\n\nexport type WordPressComponent<\n\tT extends React.ElementType \| null,\n\tO,\n\tIsPolymorphic extends boolean,\n> = {\n\t< TT extends React.ElementType >(\n\t\tprops: WordPressComponentProps< O, TT, IsPolymorphic > &\n\t\t\t( IsPolymorphic extends true ? { as: TT } : {} )\n\t): JSX.Element \| null;\n\t(\n\t\tprops: WordPressComponentProps< O, T, IsPolymorphic >\n\t): JSX.Element \| null;\n\tdisplayName?: string;\n\t/\n\t A CSS selector used to fake component interpolation in styled components\n\t * for components not generated by `styled`. Anything passed to `contextConnect`\n\t * will get this property.\n\t \n\t We restrict it to a class to align with the already existing class names that\n\t * are generated by the context system.\n\t */\n\tselector?: `.${ string }`;\n};\n\nexport type WordPressComponentFromProps<\n\tProps,\n\tForwardsRef extends boolean = true,\n> = Props extends WordPressComponentProps< infer P, infer T, infer I >\n\t? WordPressComponent<\n\t\t\tT,\n\t\t\tP & ( ForwardsRef extends true ? React.RefAttributes< any > : {} ),\n\t\t\tI\n\t >\n\t: never;\n"],"mappings":"","ignoreList":[]}

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

	@@ -1 +1 @@
1	- {"version":3,"names":["_i18n","require","DEFAULT_GRADIENT","exports","DEFAULT_LINEAR_GRADIENT_ANGLE","HORIZONTAL_GRADIENT_ORIENTATION","type","value","GRADIENT_OPTIONS","label","__","DIRECTIONAL_ORIENTATION_ANGLE_MAP","top","right","bottom","left"],"sources":["@wordpress/components/src/custom-gradient-picker/constants.ts"],"sourcesContent":["/*\n WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\nexport const DEFAULT_GRADIENT =\n\t'linear-gradient(135deg, rgba(6, 147, 227, 1) 0%, rgb(155, 81, 224) 100%)';\n\nexport const DEFAULT_LINEAR_GRADIENT_ANGLE = 180;\n\nexport const HORIZONTAL_GRADIENT_ORIENTATION = {\n\ttype: 'angular',\n\tvalue: '90',\n} as const;\n\nexport const GRADIENT_OPTIONS = [\n\t{ value: 'linear-gradient', label: __( 'Linear' ) },\n\t{ value: 'radial-gradient', label: __( 'Radial' ) },\n];\n\nexport const DIRECTIONAL_ORIENTATION_ANGLE_MAP = {\n\ttop: 0,\n\t'top right': 45,\n\t'right top': 45,\n\tright: 90,\n\t'right bottom': 135,\n\t'bottom right': 135,\n\tbottom: 180,\n\t'bottom left': 225,\n\t'left bottom': 225,\n\tleft: 270,\n\t'top left': 315,\n\t'left top': 315,\n};\n"],"mappings":";;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AAHA;AACA;AACA;;AAGO,MAAMC,gBAAgB,GAAAC,OAAA,CAAAD,gBAAA,GAC5B,0EAA0E;AAEpE,MAAME,6BAA6B,GAAAD,OAAA,CAAAC,6BAAA,GAAG,GAAG;AAEzC,MAAMC,+BAA+B,GAAAF,OAAA,CAAAE,+BAAA,GAAG;EAC9CC,IAAI,EAAE,SAAS;EACfC,KAAK,EAAE;AACR,CAAU;AAEH,MAAMC,gBAAgB,GAAAL,OAAA,CAAAK,gBAAA,GAAG,CAC/B;EAAED,KAAK,EAAE,iBAAiB;EAAEE,KAAK,EAAE,IAAAC,QAAE,EAAE,QAAS;AAAE,CAAC,EACnD;EAAEH,KAAK,EAAE,iBAAiB;EAAEE,KAAK,EAAE,IAAAC,QAAE,EAAE,QAAS;AAAE,CAAC,CACnD;AAEM,MAAMC,iCAAiC,GAAAR,OAAA,CAAAQ,iCAAA,GAAG;EAChDC,GAAG,EAAE,CAAC;EACN,WAAW,EAAE,EAAE;EACf,WAAW,EAAE,EAAE;EACfC,KAAK,EAAE,EAAE;EACT,cAAc,EAAE,GAAG;EACnB,cAAc,EAAE,GAAG;EACnBC,MAAM,EAAE,GAAG;EACX,aAAa,EAAE,GAAG;EAClB,aAAa,EAAE,GAAG;EAClBC,IAAI,EAAE,GAAG;EACT,UAAU,EAAE,GAAG;EACf,UAAU,EAAE;AACb,CAAC"}
1	+ {"version":3,"names":["_i18n","require","DEFAULT_GRADIENT","exports","DEFAULT_LINEAR_GRADIENT_ANGLE","HORIZONTAL_GRADIENT_ORIENTATION","type","value","GRADIENT_OPTIONS","label","__","DIRECTIONAL_ORIENTATION_ANGLE_MAP","top","right","bottom","left"],"sources":["@wordpress/components/src/custom-gradient-picker/constants.ts"],"sourcesContent":["/*\n WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\nexport const DEFAULT_GRADIENT =\n\t'linear-gradient(135deg, rgba(6, 147, 227, 1) 0%, rgb(155, 81, 224) 100%)';\n\nexport const DEFAULT_LINEAR_GRADIENT_ANGLE = 180;\n\nexport const HORIZONTAL_GRADIENT_ORIENTATION = {\n\ttype: 'angular',\n\tvalue: '90',\n} as const;\n\nexport const GRADIENT_OPTIONS = [\n\t{ value: 'linear-gradient', label: __( 'Linear' ) },\n\t{ value: 'radial-gradient', label: __( 'Radial' ) },\n];\n\nexport const DIRECTIONAL_ORIENTATION_ANGLE_MAP = {\n\ttop: 0,\n\t'top right': 45,\n\t'right top': 45,\n\tright: 90,\n\t'right bottom': 135,\n\t'bottom right': 135,\n\tbottom: 180,\n\t'bottom left': 225,\n\t'left bottom': 225,\n\tleft: 270,\n\t'top left': 315,\n\t'left top': 315,\n};\n"],"mappings":";;;;;;AAGA,IAAAA,KAAA,GAAAC,OAAA;AAHA;AACA;AACA;;AAGO,MAAMC,gBAAgB,GAAAC,OAAA,CAAAD,gBAAA,GAC5B,0EAA0E;AAEpE,MAAME,6BAA6B,GAAAD,OAAA,CAAAC,6BAAA,GAAG,GAAG;AAEzC,MAAMC,+BAA+B,GAAAF,OAAA,CAAAE,+BAAA,GAAG;EAC9CC,IAAI,EAAE,SAAS;EACfC,KAAK,EAAE;AACR,CAAU;AAEH,MAAMC,gBAAgB,GAAAL,OAAA,CAAAK,gBAAA,GAAG,CAC/B;EAAED,KAAK,EAAE,iBAAiB;EAAEE,KAAK,EAAE,IAAAC,QAAE,EAAE,QAAS;AAAE,CAAC,EACnD;EAAEH,KAAK,EAAE,iBAAiB;EAAEE,KAAK,EAAE,IAAAC,QAAE,EAAE,QAAS;AAAE,CAAC,CACnD;AAEM,MAAMC,iCAAiC,GAAAR,OAAA,CAAAQ,iCAAA,GAAG;EAChDC,GAAG,EAAE,CAAC;EACN,WAAW,EAAE,EAAE;EACf,WAAW,EAAE,EAAE;EACfC,KAAK,EAAE,EAAE;EACT,cAAc,EAAE,GAAG;EACnB,cAAc,EAAE,GAAG;EACnBC,MAAM,EAAE,GAAG;EACX,aAAa,EAAE,GAAG;EAClB,aAAa,EAAE,GAAG;EAClBC,IAAI,EAAE,GAAG;EACT,UAAU,EAAE,GAAG;EACf,UAAU,EAAE;AACb,CAAC","ignoreList":[]}

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

	@@ -1 +1 @@
1	- {"version":3,"names":["GRADIENT_MARKERS_WIDTH","exports","INSERT_POINT_WIDTH","MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT","MINIMUM_DISTANCE_BETWEEN_POINTS","MINIMUM_SIGNIFICANT_MOVE","KEYBOARD_CONTROL_POINT_VARIATION","MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_MARKER"],"sources":["@wordpress/components/src/custom-gradient-picker/gradient-bar/constants.ts"],"sourcesContent":["export const GRADIENT_MARKERS_WIDTH = 16;\nexport const INSERT_POINT_WIDTH = 16;\nexport const MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT = 10;\nexport const MINIMUM_DISTANCE_BETWEEN_POINTS = 0;\nexport const MINIMUM_SIGNIFICANT_MOVE = 5;\n\nexport const KEYBOARD_CONTROL_POINT_VARIATION =\n\tMINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT;\nexport const MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_MARKER =\n\t( INSERT_POINT_WIDTH + GRADIENT_MARKERS_WIDTH ) / 2;\n"],"mappings":";;;;;;AAAO,MAAMA,sBAAsB,GAAAC,OAAA,CAAAD,sBAAA,GAAG,EAAE;AACjC,MAAME,kBAAkB,GAAAD,OAAA,CAAAC,kBAAA,GAAG,EAAE;AAC7B,MAAMC,2CAA2C,GAAAF,OAAA,CAAAE,2CAAA,GAAG,EAAE;AACtD,MAAMC,+BAA+B,GAAAH,OAAA,CAAAG,+BAAA,GAAG,CAAC;AACzC,MAAMC,wBAAwB,GAAAJ,OAAA,CAAAI,wBAAA,GAAG,CAAC;AAElC,MAAMC,gCAAgC,GAAAL,OAAA,CAAAK,gCAAA,GAC5CH,2CAA2C;AACrC,MAAMI,4CAA4C,GAAAN,OAAA,CAAAM,4CAAA,GACxD,CAAEL,kBAAkB,GAAGF,sBAAsB,IAAK,CAAC"}
1	+ {"version":3,"names":["GRADIENT_MARKERS_WIDTH","exports","INSERT_POINT_WIDTH","MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT","MINIMUM_DISTANCE_BETWEEN_POINTS","MINIMUM_SIGNIFICANT_MOVE","KEYBOARD_CONTROL_POINT_VARIATION","MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_MARKER"],"sources":["@wordpress/components/src/custom-gradient-picker/gradient-bar/constants.ts"],"sourcesContent":["export const GRADIENT_MARKERS_WIDTH = 16;\nexport const INSERT_POINT_WIDTH = 16;\nexport const MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT = 10;\nexport const MINIMUM_DISTANCE_BETWEEN_POINTS = 0;\nexport const MINIMUM_SIGNIFICANT_MOVE = 5;\n\nexport const KEYBOARD_CONTROL_POINT_VARIATION =\n\tMINIMUM_DISTANCE_BETWEEN_INSERTER_AND_POINT;\nexport const MINIMUM_DISTANCE_BETWEEN_INSERTER_AND_MARKER =\n\t( INSERT_POINT_WIDTH + GRADIENT_MARKERS_WIDTH ) / 2;\n"],"mappings":";;;;;;AAAO,MAAMA,sBAAsB,GAAAC,OAAA,CAAAD,sBAAA,GAAG,EAAE;AACjC,MAAME,kBAAkB,GAAAD,OAAA,CAAAC,kBAAA,GAAG,EAAE;AAC7B,MAAMC,2CAA2C,GAAAF,OAAA,CAAAE,2CAAA,GAAG,EAAE;AACtD,MAAMC,+BAA+B,GAAAH,OAAA,CAAAG,+BAAA,GAAG,CAAC;AACzC,MAAMC,wBAAwB,GAAAJ,OAAA,CAAAI,wBAAA,GAAG,CAAC;AAElC,MAAMC,gCAAgC,GAAAL,OAAA,CAAAK,gCAAA,GAC5CH,2CAA2C;AACrC,MAAMI,4CAA4C,GAAAN,OAAA,CAAAM,4CAAA,GACxD,CAAEL,kBAAkB,GAAGF,sBAAsB,IAAK,CAAC","ignoreList":[]}

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

	@@ -1 +1 @@
1	- {"version":3,"names":["_classnames","_interopRequireDefault","require","_colord","_compose","_element","_i18n","_icons","_button","_hStack","_colorPicker","_visuallyHidden","_colorPalette","_utils","_constants","_dropdownContentWrapper","ControlPointButton","isOpen","position","color","additionalProps","instanceId","useInstanceId","descriptionId","_react","createElement","Fragment","default","sprintf","__","className","classnames","VisuallyHidden","id","GradientColorPickerDropdown","isRenderedInSidebar","props","popoverProps","useMemo","placement","offset","resize","mergedClassName","CustomColorPickerDropdown","ControlPoints","disableRemove","disableAlpha","gradientPickerDomRef","ignoreMarkerPosition","value","controlPoints","onChange","onStartControlPointChange","onStopControlPointChange","__experimentalIsRenderedInSidebar","controlPointMoveState","useRef","onMouseMove","event","current","undefined","relativePosition","getHorizontalRelativeGradientPosition","clientX","initialPosition","index","significantMoveHappened","Math","abs","MINIMUM_SIGNIFICANT_MOVE","updateControlPointPosition","cleanEventListeners","window","removeEventListener","listenersActivated","cleanEventListenersRef","useEffect","map","point","key","onClose","renderToggle","onToggle","onClick","onMouseDown","addEventListener","onKeyDown","code","stopPropagation","clampPercent","KEYBOARD_CONTROL_POINT_VARIATION","renderContent","paddingSize","ColorPicker","enableAlpha","updateControlPointColor","colord","toRgbString","length","HStack","alignment","removeControlPoint","variant","style","left","transform","InsertPoint","onOpenInserter","onCloseInserter","insertPosition","alreadyInsertedPoint","setAlreadyInsertedPoint","useState","icon","plus","addControlPoint","updateControlPointColorByPosition","_default","exports"],"sources":["@wordpress/components/src/custom-gradient-picker/gradient-bar/control-points.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\nimport { colord } from 'colord';\n\n/\n WordPress dependencies\n /\nimport { useInstanceId } from '@wordpress/compose';\nimport { useEffect, useRef, useState, useMemo } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { plus } from '@wordpress/icons';\n\n/\n Internal dependencies\n */\nimport Button from '../../button';\nimport { HStack } from '../../h-stack';\nimport { ColorPicker } from '../../color-picker';\nimport { VisuallyHidden } from '../../visually-hidden';\nimport { CustomColorPickerDropdown } from '../../color-palette';\n\nimport {\n\taddControlPoint,\n\tclampPercent,\n\tremoveControlPoint,\n\tupdateControlPointColor,\n\tupdateControlPointColorByPosition,\n\tupdateControlPointPosition,\n\tgetHorizontalRelativeGradientPosition,\n} from './utils';\nimport {\n\tMINIMUM_SIGNIFICANT_MOVE,\n\tKEYBOARD_CONTROL_POINT_VARIATION,\n} from './constants';\nimport type { WordPressComponentProps } from '../../context';\nimport type {\n\tControlPointButtonProps,\n\tControlPointMoveState,\n\tControlPointsProps,\n\tInsertPointProps,\n} from '../types';\nimport type { CustomColorPickerDropdownProps } from '../../color-palette/types';\nimport DropdownContentWrapper from '../../dropdown/dropdown-content-wrapper';\n\nfunction ControlPointButton( {\n\tisOpen,\n\tposition,\n\tcolor,\n\t...additionalProps\n}: WordPressComponentProps< ControlPointButtonProps, 'button', true > ) {\n\tconst instanceId = useInstanceId( ControlPointButton );\n\tconst descriptionId = `components-custom-gradient-picker__control-point-button-description-${ instanceId }`;\n\treturn (\n\t\t<>\n\t\t\t<Button\n\t\t\t\taria-label={ sprintf(\n\t\t\t\t\t// translators: %1$s: gradient position e.g: 70, %2$s: gradient color code e.g: rgb(52,121,151).\n\t\t\t\t\t__(\n\t\t\t\t\t\t'Gradient control point at position %1$s%% with color code %2$s.'\n\t\t\t\t\t),\n\t\t\t\t\tposition,\n\t\t\t\t\tcolor\n\t\t\t\t) }\n\t\t\t\taria-describedby={ descriptionId }\n\t\t\t\taria-haspopup=\"true\"\n\t\t\t\taria-expanded={ isOpen }\n\t\t\t\tclassName={ classnames(\n\t\t\t\t\t'components-custom-gradient-picker__control-point-button',\n\t\t\t\t\t{\n\t\t\t\t\t\t'is-active': isOpen,\n\t\t\t\t\t}\n\t\t\t\t) }\n\t\t\t\t{ ...additionalProps }\n\t\t\t/>\n\t\t\t<VisuallyHidden id={ descriptionId }>\n\t\t\t\t{ __(\n\t\t\t\t\t'Use your left or right arrow keys or drag and drop with the mouse to change the gradient position. Press the button to change the color or remove the control point.'\n\t\t\t\t) }\n\t\t\t</VisuallyHidden>\n\t\t</>\n\t);\n}\n\nfunction GradientColorPickerDropdown( {\n\tisRenderedInSidebar,\n\tclassName,\n\t...props\n}: CustomColorPickerDropdownProps ) {\n\t// Open the popover below the gradient control/insertion point\n\tconst popoverProps = useMemo(\n\t\t() =>\n\t\t\t( {\n\t\t\t\tplacement: 'bottom',\n\t\t\t\toffset: 8,\n\t\t\t\t// Disabling resize as it would otherwise cause the popover to show\n\t\t\t\t// scrollbars while dragging the color picker's handle close to the\n\t\t\t\t// popover edge.\n\t\t\t\tresize: false,\n\t\t\t} ) as const,\n\t\t[]\n\t);\n\n\tconst mergedClassName = classnames(\n\t\t'components-custom-gradient-picker__control-point-dropdown',\n\t\tclassName\n\t);\n\n\treturn (\n\t\t<CustomColorPickerDropdown\n\t\t\tisRenderedInSidebar={ isRenderedInSidebar }\n\t\t\tpopoverProps={ popoverProps }\n\t\t\tclassName={ mergedClassName }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\nfunction ControlPoints( {\n\tdisableRemove,\n\tdisableAlpha,\n\tgradientPickerDomRef,\n\tignoreMarkerPosition,\n\tvalue: controlPoints,\n\tonChange,\n\tonStartControlPointChange,\n\tonStopControlPointChange,\n\t__experimentalIsRenderedInSidebar,\n}: ControlPointsProps ) {\n\tconst controlPointMoveState = useRef< ControlPointMoveState >();\n\n\tconst onMouseMove = ( event: MouseEvent ) => {\n\t\tif (\n\t\t\tcontrolPointMoveState.current === undefined \|\|\n\t\t\tgradientPickerDomRef.current === null\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst relativePosition = getHorizontalRelativeGradientPosition(\n\t\t\tevent.clientX,\n\t\t\tgradientPickerDomRef.current\n\t\t);\n\n\t\tconst { initialPosition, index, significantMoveHappened } =\n\t\t\tcontrolPointMoveState.current;\n\n\t\tif (\n\t\t\t! significantMoveHappened &&\n\t\t\tMath.abs( initialPosition - relativePosition ) >=\n\t\t\t\tMINIMUM_SIGNIFICANT_MOVE\n\t\t) {\n\t\t\tcontrolPointMoveState.current.significantMoveHappened = true;\n\t\t}\n\n\t\tonChange(\n\t\t\tupdateControlPointPosition( controlPoints, index, relativePosition )\n\t\t);\n\t};\n\n\tconst cleanEventListeners = () => {\n\t\tif (\n\t\t\twindow &&\n\t\t\twindow.removeEventListener &&\n\t\t\tcontrolPointMoveState.current &&\n\t\t\tcontrolPointMoveState.current.listenersActivated\n\t\t) {\n\t\t\twindow.removeEventListener( 'mousemove', onMouseMove );\n\t\t\twindow.removeEventListener( 'mouseup', cleanEventListeners );\n\t\t\tonStopControlPointChange();\n\t\t\tcontrolPointMoveState.current.listenersActivated = false;\n\t\t}\n\t};\n\n\t// Adding `cleanEventListeners` to the dependency array below requires the function itself to be wrapped in a `useCallback`\n\t// This memoization would prevent the event listeners from being properly cleaned.\n\t// Instead, we'll pass a ref to the function in our `useEffect` so `cleanEventListeners` itself is no longer a dependency.\n\tconst cleanEventListenersRef = useRef< () => void >();\n\tcleanEventListenersRef.current = cleanEventListeners;\n\n\tuseEffect( () => {\n\t\treturn () => {\n\t\t\tcleanEventListenersRef.current?.();\n\t\t};\n\t}, [] );\n\n\treturn (\n\t\t<>\n\t\t\t{ controlPoints.map( ( point, index ) => {\n\t\t\t\tconst initialPosition = point?.position;\n\t\t\t\treturn (\n\t\t\t\t\tignoreMarkerPosition !== initialPosition && (\n\t\t\t\t\t\t<GradientColorPickerDropdown\n\t\t\t\t\t\t\tisRenderedInSidebar={\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\tkey={ index }\n\t\t\t\t\t\t\tonClose={ onStopControlPointChange }\n\t\t\t\t\t\t\trenderToggle={ ( { isOpen, onToggle } ) => (\n\t\t\t\t\t\t\t\t<ControlPointButton\n\t\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\tcontrolPointMoveState.current &&\n\t\t\t\t\t\t\t\t\t\t\tcontrolPointMoveState.current\n\t\t\t\t\t\t\t\t\t\t\t\t.significantMoveHappened\n\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tif ( isOpen ) {\n\t\t\t\t\t\t\t\t\t\t\tonStopControlPointChange();\n\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\tonStartControlPointChange();\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tonToggle();\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tonMouseDown={ () => {\n\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\twindow &&\n\t\t\t\t\t\t\t\t\t\t\twindow.addEventListener\n\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\tcontrolPointMoveState.current = {\n\t\t\t\t\t\t\t\t\t\t\t\tinitialPosition,\n\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\tsignificantMoveHappened: false,\n\t\t\t\t\t\t\t\t\t\t\t\tlistenersActivated: true,\n\t\t\t\t\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\t\t\t\t\tonStartControlPointChange();\n\t\t\t\t\t\t\t\t\t\t\twindow.addEventListener(\n\t\t\t\t\t\t\t\t\t\t\t\t'mousemove',\n\t\t\t\t\t\t\t\t\t\t\t\tonMouseMove\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\twindow.addEventListener(\n\t\t\t\t\t\t\t\t\t\t\t\t'mouseup',\n\t\t\t\t\t\t\t\t\t\t\t\tcleanEventListeners\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} }\n\t\t\t\t\t\t\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\t\t\t\t\t\t\tif ( event.code === 'ArrowLeft' ) {\n\t\t\t\t\t\t\t\t\t\t\t// Stop propagation of the key press event to avoid focus moving\n\t\t\t\t\t\t\t\t\t\t\t// to another editor area.\n\t\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\t\t\t\tupdateControlPointPosition(\n\t\t\t\t\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\t\tclampPercent(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tpoint.position -\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tKEYBOARD_CONTROL_POINT_VARIATION\n\t\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t} else if (\n\t\t\t\t\t\t\t\t\t\t\tevent.code === 'ArrowRight'\n\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\t// Stop propagation of the key press event to avoid focus moving\n\t\t\t\t\t\t\t\t\t\t\t// to another editor area.\n\t\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\t\t\t\tupdateControlPointPosition(\n\t\t\t\t\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\t\tclampPercent(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tpoint.position +\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tKEYBOARD_CONTROL_POINT_VARIATION\n\t\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t)\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} }\n\t\t\t\t\t\t\t\t\tisOpen={ isOpen }\n\t\t\t\t\t\t\t\t\tposition={ point.position }\n\t\t\t\t\t\t\t\t\tcolor={ point.color }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\trenderContent={ ( { onClose } ) => (\n\t\t\t\t\t\t\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t\t\t\t\t\t\t<ColorPicker\n\t\t\t\t\t\t\t\t\t\tenableAlpha={ ! disableAlpha }\n\t\t\t\t\t\t\t\t\t\tcolor={ point.color }\n\t\t\t\t\t\t\t\t\t\tonChange={ ( color ) => {\n\t\t\t\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\t\t\t\tupdateControlPointColor(\n\t\t\t\t\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\t\tcolord(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcolor\n\t\t\t\t\t\t\t\t\t\t\t\t\t).toRgbString()\n\t\t\t\t\t\t\t\t\t\t\t\t)\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/>\n\t\t\t\t\t\t\t\t\t{ ! disableRemove &&\n\t\t\t\t\t\t\t\t\t\tcontrolPoints.length > 2 && (\n\t\t\t\t\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-custom-gradient-picker__remove-control-point-wrapper\"\n\t\t\t\t\t\t\t\t\t\t\t\talignment=\"center\"\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<Button\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tremoveControlPoint(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"link\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t'Remove Control Point'\n\t\t\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</DropdownContentWrapper>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tleft: `${ point.position }%`,\n\t\t\t\t\t\t\t\ttransform: 'translateX( -50% )',\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</>\n\t);\n}\n\nfunction InsertPoint( {\n\tvalue: controlPoints,\n\tonChange,\n\tonOpenInserter,\n\tonCloseInserter,\n\tinsertPosition,\n\tdisableAlpha,\n\t__experimentalIsRenderedInSidebar,\n}: InsertPointProps ) {\n\tconst [ alreadyInsertedPoint, setAlreadyInsertedPoint ] = useState( false );\n\treturn (\n\t\t<GradientColorPickerDropdown\n\t\t\tisRenderedInSidebar={ __experimentalIsRenderedInSidebar }\n\t\t\tclassName=\"components-custom-gradient-picker__inserter\"\n\t\t\tonClose={ () => {\n\t\t\t\tonCloseInserter();\n\t\t\t} }\n\t\t\trenderToggle={ ( { isOpen, onToggle } ) => (\n\t\t\t\t<Button\n\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tif ( isOpen ) {\n\t\t\t\t\t\t\tonCloseInserter();\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tsetAlreadyInsertedPoint( false );\n\t\t\t\t\t\t\tonOpenInserter();\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonToggle();\n\t\t\t\t\t} }\n\t\t\t\t\tclassName=\"components-custom-gradient-picker__insert-point-dropdown\"\n\t\t\t\t\ticon={ plus }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\trenderContent={ () => (\n\t\t\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t\t\t<ColorPicker\n\t\t\t\t\t\tenableAlpha={ ! disableAlpha }\n\t\t\t\t\t\tonChange={ ( color ) => {\n\t\t\t\t\t\t\tif ( ! alreadyInsertedPoint ) {\n\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\taddControlPoint(\n\t\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\t\tinsertPosition,\n\t\t\t\t\t\t\t\t\t\tcolord( color ).toRgbString()\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\tsetAlreadyInsertedPoint( true );\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\tupdateControlPointColorByPosition(\n\t\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\t\tinsertPosition,\n\t\t\t\t\t\t\t\t\t\tcolord( color ).toRgbString()\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}\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</DropdownContentWrapper>\n\t\t\t) }\n\t\t\tstyle={\n\t\t\t\tinsertPosition !== null\n\t\t\t\t\t? {\n\t\t\t\t\t\t\tleft: `${ insertPosition }%`,\n\t\t\t\t\t\t\ttransform: 'translateX( -50% )',\n\t\t\t\t\t }\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t/>\n\t);\n}\nControlPoints.InsertPoint = InsertPoint;\n\nexport default ControlPoints;\n"],"mappings":"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"}
1	+ {"version":3,"names":["_classnames","_interopRequireDefault","require","_colord","_compose","_element","_i18n","_icons","_button","_hStack","_colorPicker","_visuallyHidden","_colorPalette","_utils","_constants","_dropdownContentWrapper","ControlPointButton","isOpen","position","color","additionalProps","instanceId","useInstanceId","descriptionId","_react","createElement","Fragment","default","sprintf","__","className","classnames","VisuallyHidden","id","GradientColorPickerDropdown","isRenderedInSidebar","props","popoverProps","useMemo","placement","offset","resize","mergedClassName","CustomColorPickerDropdown","ControlPoints","disableRemove","disableAlpha","gradientPickerDomRef","ignoreMarkerPosition","value","controlPoints","onChange","onStartControlPointChange","onStopControlPointChange","__experimentalIsRenderedInSidebar","controlPointMoveState","useRef","onMouseMove","event","current","undefined","relativePosition","getHorizontalRelativeGradientPosition","clientX","initialPosition","index","significantMoveHappened","Math","abs","MINIMUM_SIGNIFICANT_MOVE","updateControlPointPosition","cleanEventListeners","window","removeEventListener","listenersActivated","cleanEventListenersRef","useEffect","map","point","key","onClose","renderToggle","onToggle","onClick","onMouseDown","addEventListener","onKeyDown","code","stopPropagation","clampPercent","KEYBOARD_CONTROL_POINT_VARIATION","renderContent","paddingSize","ColorPicker","enableAlpha","updateControlPointColor","colord","toRgbString","length","HStack","alignment","removeControlPoint","variant","style","left","transform","InsertPoint","onOpenInserter","onCloseInserter","insertPosition","alreadyInsertedPoint","setAlreadyInsertedPoint","useState","icon","plus","addControlPoint","updateControlPointColorByPosition","_default","exports"],"sources":["@wordpress/components/src/custom-gradient-picker/gradient-bar/control-points.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\nimport { colord } from 'colord';\n\n/\n WordPress dependencies\n /\nimport { useInstanceId } from '@wordpress/compose';\nimport { useEffect, useRef, useState, useMemo } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { plus } from '@wordpress/icons';\n\n/\n Internal dependencies\n */\nimport Button from '../../button';\nimport { HStack } from '../../h-stack';\nimport { ColorPicker } from '../../color-picker';\nimport { VisuallyHidden } from '../../visually-hidden';\nimport { CustomColorPickerDropdown } from '../../color-palette';\n\nimport {\n\taddControlPoint,\n\tclampPercent,\n\tremoveControlPoint,\n\tupdateControlPointColor,\n\tupdateControlPointColorByPosition,\n\tupdateControlPointPosition,\n\tgetHorizontalRelativeGradientPosition,\n} from './utils';\nimport {\n\tMINIMUM_SIGNIFICANT_MOVE,\n\tKEYBOARD_CONTROL_POINT_VARIATION,\n} from './constants';\nimport type { WordPressComponentProps } from '../../context';\nimport type {\n\tControlPointButtonProps,\n\tControlPointMoveState,\n\tControlPointsProps,\n\tInsertPointProps,\n} from '../types';\nimport type { CustomColorPickerDropdownProps } from '../../color-palette/types';\nimport DropdownContentWrapper from '../../dropdown/dropdown-content-wrapper';\n\nfunction ControlPointButton( {\n\tisOpen,\n\tposition,\n\tcolor,\n\t...additionalProps\n}: WordPressComponentProps< ControlPointButtonProps, 'button', true > ) {\n\tconst instanceId = useInstanceId( ControlPointButton );\n\tconst descriptionId = `components-custom-gradient-picker__control-point-button-description-${ instanceId }`;\n\treturn (\n\t\t<>\n\t\t\t<Button\n\t\t\t\taria-label={ sprintf(\n\t\t\t\t\t// translators: %1$s: gradient position e.g: 70, %2$s: gradient color code e.g: rgb(52,121,151).\n\t\t\t\t\t__(\n\t\t\t\t\t\t'Gradient control point at position %1$s%% with color code %2$s.'\n\t\t\t\t\t),\n\t\t\t\t\tposition,\n\t\t\t\t\tcolor\n\t\t\t\t) }\n\t\t\t\taria-describedby={ descriptionId }\n\t\t\t\taria-haspopup=\"true\"\n\t\t\t\taria-expanded={ isOpen }\n\t\t\t\tclassName={ classnames(\n\t\t\t\t\t'components-custom-gradient-picker__control-point-button',\n\t\t\t\t\t{\n\t\t\t\t\t\t'is-active': isOpen,\n\t\t\t\t\t}\n\t\t\t\t) }\n\t\t\t\t{ ...additionalProps }\n\t\t\t/>\n\t\t\t<VisuallyHidden id={ descriptionId }>\n\t\t\t\t{ __(\n\t\t\t\t\t'Use your left or right arrow keys or drag and drop with the mouse to change the gradient position. Press the button to change the color or remove the control point.'\n\t\t\t\t) }\n\t\t\t</VisuallyHidden>\n\t\t</>\n\t);\n}\n\nfunction GradientColorPickerDropdown( {\n\tisRenderedInSidebar,\n\tclassName,\n\t...props\n}: CustomColorPickerDropdownProps ) {\n\t// Open the popover below the gradient control/insertion point\n\tconst popoverProps = useMemo(\n\t\t() =>\n\t\t\t( {\n\t\t\t\tplacement: 'bottom',\n\t\t\t\toffset: 8,\n\t\t\t\t// Disabling resize as it would otherwise cause the popover to show\n\t\t\t\t// scrollbars while dragging the color picker's handle close to the\n\t\t\t\t// popover edge.\n\t\t\t\tresize: false,\n\t\t\t} ) as const,\n\t\t[]\n\t);\n\n\tconst mergedClassName = classnames(\n\t\t'components-custom-gradient-picker__control-point-dropdown',\n\t\tclassName\n\t);\n\n\treturn (\n\t\t<CustomColorPickerDropdown\n\t\t\tisRenderedInSidebar={ isRenderedInSidebar }\n\t\t\tpopoverProps={ popoverProps }\n\t\t\tclassName={ mergedClassName }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\nfunction ControlPoints( {\n\tdisableRemove,\n\tdisableAlpha,\n\tgradientPickerDomRef,\n\tignoreMarkerPosition,\n\tvalue: controlPoints,\n\tonChange,\n\tonStartControlPointChange,\n\tonStopControlPointChange,\n\t__experimentalIsRenderedInSidebar,\n}: ControlPointsProps ) {\n\tconst controlPointMoveState = useRef< ControlPointMoveState >();\n\n\tconst onMouseMove = ( event: MouseEvent ) => {\n\t\tif (\n\t\t\tcontrolPointMoveState.current === undefined \|\|\n\t\t\tgradientPickerDomRef.current === null\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst relativePosition = getHorizontalRelativeGradientPosition(\n\t\t\tevent.clientX,\n\t\t\tgradientPickerDomRef.current\n\t\t);\n\n\t\tconst { initialPosition, index, significantMoveHappened } =\n\t\t\tcontrolPointMoveState.current;\n\n\t\tif (\n\t\t\t! significantMoveHappened &&\n\t\t\tMath.abs( initialPosition - relativePosition ) >=\n\t\t\t\tMINIMUM_SIGNIFICANT_MOVE\n\t\t) {\n\t\t\tcontrolPointMoveState.current.significantMoveHappened = true;\n\t\t}\n\n\t\tonChange(\n\t\t\tupdateControlPointPosition( controlPoints, index, relativePosition )\n\t\t);\n\t};\n\n\tconst cleanEventListeners = () => {\n\t\tif (\n\t\t\twindow &&\n\t\t\twindow.removeEventListener &&\n\t\t\tcontrolPointMoveState.current &&\n\t\t\tcontrolPointMoveState.current.listenersActivated\n\t\t) {\n\t\t\twindow.removeEventListener( 'mousemove', onMouseMove );\n\t\t\twindow.removeEventListener( 'mouseup', cleanEventListeners );\n\t\t\tonStopControlPointChange();\n\t\t\tcontrolPointMoveState.current.listenersActivated = false;\n\t\t}\n\t};\n\n\t// Adding `cleanEventListeners` to the dependency array below requires the function itself to be wrapped in a `useCallback`\n\t// This memoization would prevent the event listeners from being properly cleaned.\n\t// Instead, we'll pass a ref to the function in our `useEffect` so `cleanEventListeners` itself is no longer a dependency.\n\tconst cleanEventListenersRef = useRef< () => void >();\n\tcleanEventListenersRef.current = cleanEventListeners;\n\n\tuseEffect( () => {\n\t\treturn () => {\n\t\t\tcleanEventListenersRef.current?.();\n\t\t};\n\t}, [] );\n\n\treturn (\n\t\t<>\n\t\t\t{ controlPoints.map( ( point, index ) => {\n\t\t\t\tconst initialPosition = point?.position;\n\t\t\t\treturn (\n\t\t\t\t\tignoreMarkerPosition !== initialPosition && (\n\t\t\t\t\t\t<GradientColorPickerDropdown\n\t\t\t\t\t\t\tisRenderedInSidebar={\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\tkey={ index }\n\t\t\t\t\t\t\tonClose={ onStopControlPointChange }\n\t\t\t\t\t\t\trenderToggle={ ( { isOpen, onToggle } ) => (\n\t\t\t\t\t\t\t\t<ControlPointButton\n\t\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\tcontrolPointMoveState.current &&\n\t\t\t\t\t\t\t\t\t\t\tcontrolPointMoveState.current\n\t\t\t\t\t\t\t\t\t\t\t\t.significantMoveHappened\n\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tif ( isOpen ) {\n\t\t\t\t\t\t\t\t\t\t\tonStopControlPointChange();\n\t\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\t\tonStartControlPointChange();\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tonToggle();\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tonMouseDown={ () => {\n\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\twindow &&\n\t\t\t\t\t\t\t\t\t\t\twindow.addEventListener\n\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\tcontrolPointMoveState.current = {\n\t\t\t\t\t\t\t\t\t\t\t\tinitialPosition,\n\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\tsignificantMoveHappened: false,\n\t\t\t\t\t\t\t\t\t\t\t\tlistenersActivated: true,\n\t\t\t\t\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\t\t\t\t\tonStartControlPointChange();\n\t\t\t\t\t\t\t\t\t\t\twindow.addEventListener(\n\t\t\t\t\t\t\t\t\t\t\t\t'mousemove',\n\t\t\t\t\t\t\t\t\t\t\t\tonMouseMove\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\twindow.addEventListener(\n\t\t\t\t\t\t\t\t\t\t\t\t'mouseup',\n\t\t\t\t\t\t\t\t\t\t\t\tcleanEventListeners\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} }\n\t\t\t\t\t\t\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\t\t\t\t\t\t\tif ( event.code === 'ArrowLeft' ) {\n\t\t\t\t\t\t\t\t\t\t\t// Stop propagation of the key press event to avoid focus moving\n\t\t\t\t\t\t\t\t\t\t\t// to another editor area.\n\t\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\t\t\t\tupdateControlPointPosition(\n\t\t\t\t\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\t\tclampPercent(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tpoint.position -\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tKEYBOARD_CONTROL_POINT_VARIATION\n\t\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t} else if (\n\t\t\t\t\t\t\t\t\t\t\tevent.code === 'ArrowRight'\n\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\t// Stop propagation of the key press event to avoid focus moving\n\t\t\t\t\t\t\t\t\t\t\t// to another editor area.\n\t\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\t\t\t\tupdateControlPointPosition(\n\t\t\t\t\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\t\tclampPercent(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tpoint.position +\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tKEYBOARD_CONTROL_POINT_VARIATION\n\t\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t)\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} }\n\t\t\t\t\t\t\t\t\tisOpen={ isOpen }\n\t\t\t\t\t\t\t\t\tposition={ point.position }\n\t\t\t\t\t\t\t\t\tcolor={ point.color }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\trenderContent={ ( { onClose } ) => (\n\t\t\t\t\t\t\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t\t\t\t\t\t\t<ColorPicker\n\t\t\t\t\t\t\t\t\t\tenableAlpha={ ! disableAlpha }\n\t\t\t\t\t\t\t\t\t\tcolor={ point.color }\n\t\t\t\t\t\t\t\t\t\tonChange={ ( color ) => {\n\t\t\t\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\t\t\t\tupdateControlPointColor(\n\t\t\t\t\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\t\t\t\t\t\tcolord(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tcolor\n\t\t\t\t\t\t\t\t\t\t\t\t\t).toRgbString()\n\t\t\t\t\t\t\t\t\t\t\t\t)\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/>\n\t\t\t\t\t\t\t\t\t{ ! disableRemove &&\n\t\t\t\t\t\t\t\t\t\tcontrolPoints.length > 2 && (\n\t\t\t\t\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-custom-gradient-picker__remove-control-point-wrapper\"\n\t\t\t\t\t\t\t\t\t\t\t\talignment=\"center\"\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<Button\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tremoveControlPoint(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"link\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t'Remove Control Point'\n\t\t\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</DropdownContentWrapper>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tleft: `${ point.position }%`,\n\t\t\t\t\t\t\t\ttransform: 'translateX( -50% )',\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</>\n\t);\n}\n\nfunction InsertPoint( {\n\tvalue: controlPoints,\n\tonChange,\n\tonOpenInserter,\n\tonCloseInserter,\n\tinsertPosition,\n\tdisableAlpha,\n\t__experimentalIsRenderedInSidebar,\n}: InsertPointProps ) {\n\tconst [ alreadyInsertedPoint, setAlreadyInsertedPoint ] = useState( false );\n\treturn (\n\t\t<GradientColorPickerDropdown\n\t\t\tisRenderedInSidebar={ __experimentalIsRenderedInSidebar }\n\t\t\tclassName=\"components-custom-gradient-picker__inserter\"\n\t\t\tonClose={ () => {\n\t\t\t\tonCloseInserter();\n\t\t\t} }\n\t\t\trenderToggle={ ( { isOpen, onToggle } ) => (\n\t\t\t\t<Button\n\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tif ( isOpen ) {\n\t\t\t\t\t\t\tonCloseInserter();\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tsetAlreadyInsertedPoint( false );\n\t\t\t\t\t\t\tonOpenInserter();\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonToggle();\n\t\t\t\t\t} }\n\t\t\t\t\tclassName=\"components-custom-gradient-picker__insert-point-dropdown\"\n\t\t\t\t\ticon={ plus }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\trenderContent={ () => (\n\t\t\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t\t\t<ColorPicker\n\t\t\t\t\t\tenableAlpha={ ! disableAlpha }\n\t\t\t\t\t\tonChange={ ( color ) => {\n\t\t\t\t\t\t\tif ( ! alreadyInsertedPoint ) {\n\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\taddControlPoint(\n\t\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\t\tinsertPosition,\n\t\t\t\t\t\t\t\t\t\tcolord( color ).toRgbString()\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\tsetAlreadyInsertedPoint( true );\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\t\tupdateControlPointColorByPosition(\n\t\t\t\t\t\t\t\t\t\tcontrolPoints,\n\t\t\t\t\t\t\t\t\t\tinsertPosition,\n\t\t\t\t\t\t\t\t\t\tcolord( color ).toRgbString()\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}\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</DropdownContentWrapper>\n\t\t\t) }\n\t\t\tstyle={\n\t\t\t\tinsertPosition !== null\n\t\t\t\t\t? {\n\t\t\t\t\t\t\tleft: `${ insertPosition }%`,\n\t\t\t\t\t\t\ttransform: 'translateX( -50% )',\n\t\t\t\t\t }\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t/>\n\t);\n}\nControlPoints.InsertPoint = InsertPoint;\n\nexport default ControlPoints;\n"],"mappings":"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","ignoreList":[]}

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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"}
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":[]}

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

	@@ -1 +1 @@
1	- {"version":3,"names":["_constants","require","clampPercent","value","Math","max","min","isOverlapping","initialIndex","newPosition","minDistance","MINIMUM_DISTANCE_BETWEEN_POINTS","initialPosition","position","minPosition","maxPosition","some","index","abs","addControlPoint","points","color","nextIndex","findIndex","point","newPoint","newPoints","slice","splice","removeControlPoint","filter","_point","pointIndex","updateControlPoint","newValue","updateControlPointPosition","updateControlPointColor","newColor","updateControlPointColorByPosition","getHorizontalRelativeGradientPosition","mouseXCoordinate","containerElement","x","width","getBoundingClientRect","absolutePositionValue","round"],"sources":["@wordpress/components/src/custom-gradient-picker/gradient-bar/utils.ts"],"sourcesContent":["/*\n Internal dependencies\n /\nimport { MINIMUM_DISTANCE_BETWEEN_POINTS } from './constants';\nimport type { ControlPoint } from '../types';\n\n/\n Clamps a number between 0 and 100.\n \n @param value Value to clamp.\n \n @return Value clamped between 0 and 100.\n /\nexport function clampPercent( value: number ) {\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 value Array of control points.\n * @param initialIndex Index of the position to test.\n * @param newPosition New position of the control point.\n * @param minDistance Distance considered to be overlapping.\n \n @return True if the point is overlapping.\n /\nexport function isOverlapping(\n\tvalue: ControlPoint[],\n\tinitialIndex: number,\n\tnewPosition: number,\n\tminDistance: number = 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 points Array of control points.\n * @param position Position to insert the new point.\n * @param color Color to update the control point at index.\n \n @return New array of control points.\n /\nexport function addControlPoint(\n\tpoints: ControlPoint[],\n\tposition: number,\n\tcolor: ControlPoint[ 'color' ]\n) {\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 points Array of control points.\n * @param index Index to remove.\n \n @return New array of control points.\n /\nexport function removeControlPoint( points: ControlPoint[], index: number ) {\n\treturn points.filter( ( _point, pointIndex ) => {\n\t\treturn pointIndex !== index;\n\t} );\n}\n/\n Updates a control point from an array and returns the new array.\n \n @param points Array of control points.\n * @param index Index to update.\n * @param newPoint New control point to replace the index.\n \n @return New array of control points.\n /\nexport function updateControlPoint(\n\tpoints: ControlPoint[],\n\tindex: number,\n\tnewPoint: ControlPoint\n) {\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 points Array of control points.\n * @param index Index to update.\n * @param newPosition Position to move the control point at index.\n \n @return New array of control points.\n /\nexport function updateControlPointPosition(\n\tpoints: ControlPoint[],\n\tindex: number,\n\tnewPosition: ControlPoint[ 'position' ]\n) {\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 points Array of control points.\n * @param index Index to update.\n * @param newColor Color to update the control point at index.\n \n @return New array of control points.\n /\nexport function updateControlPointColor(\n\tpoints: ControlPoint[],\n\tindex: number,\n\tnewColor: ControlPoint[ 'color' ]\n) {\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 points Array of control points.\n * @param position Position of the color stop.\n * @param newColor Color to update the control point at index.\n \n @return New array of control points.\n /\nexport function updateControlPointColorByPosition(\n\tpoints: ControlPoint[],\n\tposition: ControlPoint[ 'position' ],\n\tnewColor: ControlPoint[ 'color' ]\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 mouseXcoordinate Horizontal coordinate of the mouse position.\n * @param containerElement Container for the gradient picker.\n \n @return Whole number percentage from the left.\n /\nexport function getHorizontalRelativeGradientPosition(\n\tmouseXcoordinate: number,\n\tcontainerElement: HTMLDivElement\n): number;\nexport function getHorizontalRelativeGradientPosition(\n\tmouseXcoordinate: number,\n\tcontainerElement: null\n): undefined;\nexport function getHorizontalRelativeGradientPosition(\n\tmouseXCoordinate: number,\n\tcontainerElement: HTMLDivElement \| null\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"],"mappings":"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"}
1	+ {"version":3,"names":["_constants","require","clampPercent","value","Math","max","min","isOverlapping","initialIndex","newPosition","minDistance","MINIMUM_DISTANCE_BETWEEN_POINTS","initialPosition","position","minPosition","maxPosition","some","index","abs","addControlPoint","points","color","nextIndex","findIndex","point","newPoint","newPoints","slice","splice","removeControlPoint","filter","_point","pointIndex","updateControlPoint","newValue","updateControlPointPosition","updateControlPointColor","newColor","updateControlPointColorByPosition","getHorizontalRelativeGradientPosition","mouseXCoordinate","containerElement","x","width","getBoundingClientRect","absolutePositionValue","round"],"sources":["@wordpress/components/src/custom-gradient-picker/gradient-bar/utils.ts"],"sourcesContent":["/*\n Internal dependencies\n /\nimport { MINIMUM_DISTANCE_BETWEEN_POINTS } from './constants';\nimport type { ControlPoint } from '../types';\n\n/\n Clamps a number between 0 and 100.\n \n @param value Value to clamp.\n \n @return Value clamped between 0 and 100.\n /\nexport function clampPercent( value: number ) {\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 value Array of control points.\n * @param initialIndex Index of the position to test.\n * @param newPosition New position of the control point.\n * @param minDistance Distance considered to be overlapping.\n \n @return True if the point is overlapping.\n /\nexport function isOverlapping(\n\tvalue: ControlPoint[],\n\tinitialIndex: number,\n\tnewPosition: number,\n\tminDistance: number = 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 points Array of control points.\n * @param position Position to insert the new point.\n * @param color Color to update the control point at index.\n \n @return New array of control points.\n /\nexport function addControlPoint(\n\tpoints: ControlPoint[],\n\tposition: number,\n\tcolor: ControlPoint[ 'color' ]\n) {\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 points Array of control points.\n * @param index Index to remove.\n \n @return New array of control points.\n /\nexport function removeControlPoint( points: ControlPoint[], index: number ) {\n\treturn points.filter( ( _point, pointIndex ) => {\n\t\treturn pointIndex !== index;\n\t} );\n}\n/\n Updates a control point from an array and returns the new array.\n \n @param points Array of control points.\n * @param index Index to update.\n * @param newPoint New control point to replace the index.\n \n @return New array of control points.\n /\nexport function updateControlPoint(\n\tpoints: ControlPoint[],\n\tindex: number,\n\tnewPoint: ControlPoint\n) {\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 points Array of control points.\n * @param index Index to update.\n * @param newPosition Position to move the control point at index.\n \n @return New array of control points.\n /\nexport function updateControlPointPosition(\n\tpoints: ControlPoint[],\n\tindex: number,\n\tnewPosition: ControlPoint[ 'position' ]\n) {\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 points Array of control points.\n * @param index Index to update.\n * @param newColor Color to update the control point at index.\n \n @return New array of control points.\n /\nexport function updateControlPointColor(\n\tpoints: ControlPoint[],\n\tindex: number,\n\tnewColor: ControlPoint[ 'color' ]\n) {\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 points Array of control points.\n * @param position Position of the color stop.\n * @param newColor Color to update the control point at index.\n \n @return New array of control points.\n /\nexport function updateControlPointColorByPosition(\n\tpoints: ControlPoint[],\n\tposition: ControlPoint[ 'position' ],\n\tnewColor: ControlPoint[ 'color' ]\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 mouseXcoordinate Horizontal coordinate of the mouse position.\n * @param containerElement Container for the gradient picker.\n \n @return Whole number percentage from the left.\n /\nexport function getHorizontalRelativeGradientPosition(\n\tmouseXcoordinate: number,\n\tcontainerElement: HTMLDivElement\n): number;\nexport function getHorizontalRelativeGradientPosition(\n\tmouseXcoordinate: number,\n\tcontainerElement: null\n): undefined;\nexport function getHorizontalRelativeGradientPosition(\n\tmouseXCoordinate: number,\n\tcontainerElement: HTMLDivElement \| null\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"],"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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"}
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":[]}

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

	@@ -1 +1 @@
1	- {"version":3,"names":["_components","require","_i18n","_element","_utils","_utils2","_serializer","_constants","_style","_interopRequireDefault","CustomGradientPicker","setColor","currentValue","isGradientColor","gradientOrientation","setGradientOrientation","useState","HORIZONTAL_GRADIENT_ORIENTATION","currentColor","setCurrentColor","getGradientType","gradients","gradientOptions","colorsUtils","gradientAST","getGradientAstWithDefault","gradientType","isLinearGradient","type","linear","getGradientColor","orientation","restGradientAST","serializeGradient","onGradientTypeChange","gradientColor","setGradientAngle","value","getGradientAngle","_gradientAST$orientat","DEFAULT_LINEAR_GRADIENT_ANGLE","_react","createElement","Fragment","PanelBody","title","__","RadioControl","selected","options","onChange","style","styles","angleControl","RangeControl","label","minimumValue","maximumValue","_default","exports","default"],"sources":["@wordpress/components/src/custom-gradient-picker/index.native.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { PanelBody, RadioControl, RangeControl } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\n\n/\n Internal dependencies\n */\nimport { colorsUtils } from '../mobile/color-settings/utils';\nimport { getGradientAstWithDefault } from './utils';\nimport { serializeGradient } from './serializer';\nimport {\n\tDEFAULT_LINEAR_GRADIENT_ANGLE,\n\tHORIZONTAL_GRADIENT_ORIENTATION,\n} from './constants';\nimport styles from './style.scss';\n\nfunction CustomGradientPicker( { setColor, currentValue, isGradientColor } ) {\n\tconst [ gradientOrientation, setGradientOrientation ] = useState(\n\t\tHORIZONTAL_GRADIENT_ORIENTATION\n\t);\n\n\tconst [ currentColor, setCurrentColor ] = useState( currentValue );\n\n\tconst { getGradientType, gradients, gradientOptions } = colorsUtils;\n\tconst { gradientAST } = getGradientAstWithDefault( currentColor );\n\tconst gradientType = getGradientType( currentColor );\n\n\tfunction isLinearGradient( type ) {\n\t\treturn type === gradients.linear;\n\t}\n\n\tfunction getGradientColor( type ) {\n\t\tconst { orientation, ...restGradientAST } = gradientAST;\n\n\t\tif ( orientation ) {\n\t\t\tsetGradientOrientation( orientation );\n\t\t}\n\n\t\treturn serializeGradient(\n\t\t\tisLinearGradient( type )\n\t\t\t\t? {\n\t\t\t\t\t\t...gradientAST,\n\t\t\t\t\t\t...( gradientAST.orientation\n\t\t\t\t\t\t\t? {}\n\t\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\t\torientation: gradientOrientation,\n\t\t\t\t\t\t\t } ),\n\t\t\t\t\t\ttype,\n\t\t\t\t }\n\t\t\t\t: {\n\t\t\t\t\t\t...restGradientAST,\n\t\t\t\t\t\ttype,\n\t\t\t\t }\n\t\t);\n\t}\n\n\tfunction onGradientTypeChange( type ) {\n\t\tconst gradientColor = getGradientColor( type );\n\t\tsetCurrentColor( gradientColor );\n\t\tsetColor( gradientColor );\n\t}\n\n\tfunction setGradientAngle( value ) {\n\t\tconst gradientColor = serializeGradient( {\n\t\t\t...gradientAST,\n\t\t\torientation: {\n\t\t\t\ttype: 'angular',\n\t\t\t\tvalue,\n\t\t\t},\n\t\t} );\n\n\t\tif ( isGradientColor && gradientColor !== currentColor ) {\n\t\t\tsetCurrentColor( gradientColor );\n\t\t\tsetColor( gradientColor );\n\t\t}\n\t}\n\n\tfunction getGradientAngle() {\n\t\treturn gradientAST?.orientation?.value ?? DEFAULT_LINEAR_GRADIENT_ANGLE;\n\t}\n\treturn (\n\t\t<>\n\t\t\t<PanelBody title={ __( 'Gradient Type' ) }>\n\t\t\t\t<RadioControl\n\t\t\t\t\tselected={ gradientType }\n\t\t\t\t\toptions={ gradientOptions }\n\t\t\t\t\tonChange={ onGradientTypeChange }\n\t\t\t\t/>\n\t\t\t</PanelBody>\n\t\t\t{ isLinearGradient( gradientType ) && (\n\t\t\t\t<PanelBody style={ styles.angleControl }>\n\t\t\t\t\t<RangeControl\n\t\t\t\t\t\tlabel={ __( 'Angle' ) }\n\t\t\t\t\t\tminimumValue={ 0 }\n\t\t\t\t\t\tmaximumValue={ 360 }\n\t\t\t\t\t\tvalue={ getGradientAngle() }\n\t\t\t\t\t\tonChange={ setGradientAngle }\n\t\t\t\t\t/>\n\t\t\t\t</PanelBody>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default CustomGradientPicker;\n"],"mappings":";;;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,QAAA,GAAAF,OAAA;AAKA,IAAAG,MAAA,GAAAH,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AACA,IAAAK,WAAA,GAAAL,OAAA;AACA,IAAAM,UAAA,GAAAN,OAAA;AAIA,IAAAO,MAAA,GAAAC,sBAAA,CAAAR,OAAA;AAjBA;AACA;AACA;;AAKA;AACA;AACA;;AAUA,SAASS,oBAAoBA,CAAE;EAAEC,QAAQ;EAAEC,YAAY;EAAEC;AAAgB,CAAC,EAAG;EAC5E,MAAM,CAAEC,mBAAmB,EAAEC,sBAAsB,CAAE,GAAG,IAAAC,iBAAQ,EAC/DC,0CACD,CAAC;EAED,MAAM,CAAEC,YAAY,EAAEC,eAAe,CAAE,GAAG,IAAAH,iBAAQ,EAAEJ,YAAa,CAAC;EAElE,MAAM;IAAEQ,eAAe;IAAEC,SAAS;IAAEC;EAAgB,CAAC,GAAGC,kBAAW;EACnE,MAAM;IAAEC;EAAY,CAAC,GAAG,IAAAC,iCAAyB,EAAEP,YAAa,CAAC;EACjE,MAAMQ,YAAY,GAAGN,eAAe,CAAEF,YAAa,CAAC;EAEpD,SAASS,gBAAgBA,CAAEC,IAAI,EAAG;IACjC,OAAOA,IAAI,KAAKP,SAAS,CAACQ,MAAM;EACjC;EAEA,SAASC,gBAAgBA,CAAEF,IAAI,EAAG;IACjC,MAAM;MAAEG,WAAW;MAAE,GAAGC;IAAgB,CAAC,GAAGR,WAAW;IAEvD,IAAKO,WAAW,EAAG;MAClBhB,sBAAsB,CAAEgB,WAAY,CAAC;IACtC;IAEA,OAAO,IAAAE,6BAAiB,EACvBN,gBAAgB,CAAEC,IAAK,CAAC,GACrB;MACA,GAAGJ,WAAW;MACd,IAAKA,WAAW,CAACO,WAAW,GACzB,CAAC,CAAC,GACF;QACAA,WAAW,EAAEjB;MACb,CAAC,CAAE;MACNc;IACA,CAAC,GACD;MACA,GAAGI,eAAe;MAClBJ;IACA,CACJ,CAAC;EACF;EAEA,SAASM,oBAAoBA,CAAEN,IAAI,EAAG;IACrC,MAAMO,aAAa,GAAGL,gBAAgB,CAAEF,IAAK,CAAC;IAC9CT,eAAe,CAAEgB,aAAc,CAAC;IAChCxB,QAAQ,CAAEwB,aAAc,CAAC;EAC1B;EAEA,SAASC,gBAAgBA,CAAEC,KAAK,EAAG;IAClC,MAAMF,aAAa,GAAG,IAAAF,6BAAiB,EAAE;MACxC,GAAGT,WAAW;MACdO,WAAW,EAAE;QACZH,IAAI,EAAE,SAAS;QACfS;MACD;IACD,CAAE,CAAC;IAEH,IAAKxB,eAAe,IAAIsB,aAAa,KAAKjB,YAAY,EAAG;MACxDC,eAAe,CAAEgB,aAAc,CAAC;MAChCxB,QAAQ,CAAEwB,aAAc,CAAC;IAC1B;EACD;EAEA,SAASG,gBAAgBA,CAAA,EAAG;IAAA,IAAAC,qBAAA;IAC3B,QAAAA,qBAAA,GAAOf,WAAW,EAAEO,WAAW,EAAEM,KAAK,cAAAE,qBAAA,cAAAA,qBAAA,GAAIC,wCAA6B;EACxE;EACA,OACC,IAAAC,MAAA,CAAAC,aAAA,EAAAD,MAAA,CAAAE,QAAA,QACC,IAAAF,MAAA,CAAAC,aAAA,EAAC1C,WAAA,CAAA4C,SAAS;IAACC,KAAK,EAAG,IAAAC,QAAE,EAAE,eAAgB;EAAG,GACzC,IAAAL,MAAA,CAAAC,aAAA,EAAC1C,WAAA,CAAA+C,YAAY;IACZC,QAAQ,EAAGtB,YAAc;IACzBuB,OAAO,EAAG3B,eAAiB;IAC3B4B,QAAQ,EAAGhB;EAAsB,CACjC,CACS,CAAC,EACVP,gBAAgB,CAAED,YAAa,CAAC,IACjC,IAAAe,MAAA,CAAAC,aAAA,EAAC1C,WAAA,CAAA4C,SAAS;IAACO,KAAK,EAAGC,cAAM,CAACC;EAAc,GACvC,IAAAZ,MAAA,CAAAC,aAAA,EAAC1C,WAAA,CAAAsD,YAAY;IACZC,KAAK,EAAG,IAAAT,QAAE,EAAE,OAAQ,CAAG;IACvBU,YAAY,EAAG,CAAG;IAClBC,YAAY,EAAG,GAAK;IACpBpB,KAAK,EAAGC,gBAAgB,CAAC,CAAG;IAC5BY,QAAQ,EAAGd;EAAkB,CAC7B,CACS,CAEX,CAAC;AAEL;AAAC,IAAAsB,QAAA,GAAAC,OAAA,CAAAC,OAAA,GAEclD,oBAAoB"}
1	+ {"version":3,"names":["_components","require","_i18n","_element","_utils","_utils2","_serializer","_constants","_style","_interopRequireDefault","CustomGradientPicker","setColor","currentValue","isGradientColor","gradientOrientation","setGradientOrientation","useState","HORIZONTAL_GRADIENT_ORIENTATION","currentColor","setCurrentColor","getGradientType","gradients","gradientOptions","colorsUtils","gradientAST","getGradientAstWithDefault","gradientType","isLinearGradient","type","linear","getGradientColor","orientation","restGradientAST","serializeGradient","onGradientTypeChange","gradientColor","setGradientAngle","value","getGradientAngle","_gradientAST$orientat","DEFAULT_LINEAR_GRADIENT_ANGLE","_react","createElement","Fragment","PanelBody","title","__","RadioControl","selected","options","onChange","style","styles","angleControl","RangeControl","label","minimumValue","maximumValue","_default","exports","default"],"sources":["@wordpress/components/src/custom-gradient-picker/index.native.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { PanelBody, RadioControl, RangeControl } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\n\n/\n Internal dependencies\n */\nimport { colorsUtils } from '../mobile/color-settings/utils';\nimport { getGradientAstWithDefault } from './utils';\nimport { serializeGradient } from './serializer';\nimport {\n\tDEFAULT_LINEAR_GRADIENT_ANGLE,\n\tHORIZONTAL_GRADIENT_ORIENTATION,\n} from './constants';\nimport styles from './style.scss';\n\nfunction CustomGradientPicker( { setColor, currentValue, isGradientColor } ) {\n\tconst [ gradientOrientation, setGradientOrientation ] = useState(\n\t\tHORIZONTAL_GRADIENT_ORIENTATION\n\t);\n\n\tconst [ currentColor, setCurrentColor ] = useState( currentValue );\n\n\tconst { getGradientType, gradients, gradientOptions } = colorsUtils;\n\tconst { gradientAST } = getGradientAstWithDefault( currentColor );\n\tconst gradientType = getGradientType( currentColor );\n\n\tfunction isLinearGradient( type ) {\n\t\treturn type === gradients.linear;\n\t}\n\n\tfunction getGradientColor( type ) {\n\t\tconst { orientation, ...restGradientAST } = gradientAST;\n\n\t\tif ( orientation ) {\n\t\t\tsetGradientOrientation( orientation );\n\t\t}\n\n\t\treturn serializeGradient(\n\t\t\tisLinearGradient( type )\n\t\t\t\t? {\n\t\t\t\t\t\t...gradientAST,\n\t\t\t\t\t\t...( gradientAST.orientation\n\t\t\t\t\t\t\t? {}\n\t\t\t\t\t\t\t: {\n\t\t\t\t\t\t\t\t\torientation: gradientOrientation,\n\t\t\t\t\t\t\t } ),\n\t\t\t\t\t\ttype,\n\t\t\t\t }\n\t\t\t\t: {\n\t\t\t\t\t\t...restGradientAST,\n\t\t\t\t\t\ttype,\n\t\t\t\t }\n\t\t);\n\t}\n\n\tfunction onGradientTypeChange( type ) {\n\t\tconst gradientColor = getGradientColor( type );\n\t\tsetCurrentColor( gradientColor );\n\t\tsetColor( gradientColor );\n\t}\n\n\tfunction setGradientAngle( value ) {\n\t\tconst gradientColor = serializeGradient( {\n\t\t\t...gradientAST,\n\t\t\torientation: {\n\t\t\t\ttype: 'angular',\n\t\t\t\tvalue,\n\t\t\t},\n\t\t} );\n\n\t\tif ( isGradientColor && gradientColor !== currentColor ) {\n\t\t\tsetCurrentColor( gradientColor );\n\t\t\tsetColor( gradientColor );\n\t\t}\n\t}\n\n\tfunction getGradientAngle() {\n\t\treturn gradientAST?.orientation?.value ?? DEFAULT_LINEAR_GRADIENT_ANGLE;\n\t}\n\treturn (\n\t\t<>\n\t\t\t<PanelBody title={ __( 'Gradient Type' ) }>\n\t\t\t\t<RadioControl\n\t\t\t\t\tselected={ gradientType }\n\t\t\t\t\toptions={ gradientOptions }\n\t\t\t\t\tonChange={ onGradientTypeChange }\n\t\t\t\t/>\n\t\t\t</PanelBody>\n\t\t\t{ isLinearGradient( gradientType ) && (\n\t\t\t\t<PanelBody style={ styles.angleControl }>\n\t\t\t\t\t<RangeControl\n\t\t\t\t\t\tlabel={ __( 'Angle' ) }\n\t\t\t\t\t\tminimumValue={ 0 }\n\t\t\t\t\t\tmaximumValue={ 360 }\n\t\t\t\t\t\tvalue={ getGradientAngle() }\n\t\t\t\t\t\tonChange={ setGradientAngle }\n\t\t\t\t\t/>\n\t\t\t\t</PanelBody>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default CustomGradientPicker;\n"],"mappings":"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","ignoreList":[]}

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

	@@ -1 +1 @@
1	- {"version":3,"names":["serializeGradientColor","type","value","join","serializeGradientPosition","position","serializeGradientColorStop","length","serializeGradientOrientation","orientation","Array","isArray","serializeGradient","colorStops","serializedOrientation","serializedColorStops","sort","colorStop1","colorStop2","getNumericStopValue","colorStop","undefined","parseInt","map","filter","Boolean"],"sources":["@wordpress/components/src/custom-gradient-picker/serializer.ts"],"sourcesContent":["/*\n External dependencies\n */\nimport type gradientParser from 'gradient-parser';\n\nexport function serializeGradientColor( {\n\ttype,\n\tvalue,\n}: gradientParser.ColorStop ) {\n\tif ( type === 'literal' ) {\n\t\treturn value;\n\t}\n\tif ( type === 'hex' ) {\n\t\treturn `#${ value }`;\n\t}\n\treturn `${ type }(${ value.join( ',' ) })`;\n}\n\nexport function serializeGradientPosition(\n\tposition: gradientParser.ColorStop[ 'length' ]\n) {\n\tif ( ! position ) {\n\t\treturn '';\n\t}\n\tconst { value, type } = position;\n\treturn `${ value }${ type }`;\n}\n\nexport function serializeGradientColorStop( {\n\ttype,\n\tvalue,\n\tlength,\n}: gradientParser.ColorStop ) {\n\treturn `${ serializeGradientColor( {\n\t\ttype,\n\t\tvalue,\n\t} as gradientParser.ColorStop ) } ${ serializeGradientPosition( length ) }`;\n}\n\nexport function serializeGradientOrientation(\n\torientation: gradientParser.GradientNode[ 'orientation' ]\n) {\n\tif (\n\t\tArray.isArray( orientation ) \|\|\n\t\t! orientation \|\|\n\t\torientation.type !== 'angular'\n\t) {\n\t\treturn;\n\t}\n\treturn `${ orientation.value }deg`;\n}\n\nexport function serializeGradient( {\n\ttype,\n\torientation,\n\tcolorStops,\n}: gradientParser.GradientNode ) {\n\tconst serializedOrientation = serializeGradientOrientation( orientation );\n\tconst serializedColorStops = colorStops\n\t\t.sort( ( colorStop1, colorStop2 ) => {\n\t\t\tconst getNumericStopValue = (\n\t\t\t\tcolorStop: gradientParser.ColorStop\n\t\t\t) => {\n\t\t\t\treturn colorStop?.length?.value === undefined\n\t\t\t\t\t? 0\n\t\t\t\t\t: parseInt( colorStop.length.value );\n\t\t\t};\n\n\t\t\treturn (\n\t\t\t\tgetNumericStopValue( colorStop1 ) -\n\t\t\t\tgetNumericStopValue( colorStop2 )\n\t\t\t);\n\t\t} )\n\t\t.map( serializeGradientColorStop );\n\treturn `${ type }(${ [ serializedOrientation, ...serializedColorStops ]\n\t\t.filter( Boolean )\n\t\t.join( ',' ) })`;\n}\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;;AAGO,SAASA,sBAAsBA,CAAE;EACvCC,IAAI;EACJC;AACyB,CAAC,EAAG;EAC7B,IAAKD,IAAI,KAAK,SAAS,EAAG;IACzB,OAAOC,KAAK;EACb;EACA,IAAKD,IAAI,KAAK,KAAK,EAAG;IACrB,OAAQ,IAAIC,KAAO,EAAC;EACrB;EACA,OAAQ,GAAGD,IAAM,IAAIC,KAAK,CAACC,IAAI,CAAE,GAAI,CAAG,GAAE;AAC3C;AAEO,SAASC,yBAAyBA,CACxCC,QAA8C,EAC7C;EACD,IAAK,CAAEA,QAAQ,EAAG;IACjB,OAAO,EAAE;EACV;EACA,MAAM;IAAEH,KAAK;IAAED;EAAK,CAAC,GAAGI,QAAQ;EAChC,OAAQ,GAAGH,KAAO,GAAGD,IAAM,EAAC;AAC7B;AAEO,SAASK,0BAA0BA,CAAE;EAC3CL,IAAI;EACJC,KAAK;EACLK;AACyB,CAAC,EAAG;EAC7B,OAAQ,GAAGP,sBAAsB,CAAE;IAClCC,IAAI;IACJC;EACD,CAA8B,CAAG,IAAIE,yBAAyB,CAAEG,MAAO,CAAG,EAAC;AAC5E;AAEO,SAASC,4BAA4BA,CAC3CC,WAAyD,EACxD;EACD,IACCC,KAAK,CAACC,OAAO,CAAEF,WAAY,CAAC,IAC5B,CAAEA,WAAW,IACbA,WAAW,CAACR,IAAI,KAAK,SAAS,EAC7B;IACD;EACD;EACA,OAAQ,GAAGQ,WAAW,CAACP,KAAO,KAAI;AACnC;AAEO,SAASU,iBAAiBA,CAAE;EAClCX,IAAI;EACJQ,WAAW;EACXI;AAC4B,CAAC,EAAG;EAChC,MAAMC,qBAAqB,GAAGN,4BAA4B,CAAEC,WAAY,CAAC;EACzE,MAAMM,oBAAoB,GAAGF,UAAU,CACrCG,IAAI,CAAE,CAAEC,UAAU,EAAEC,UAAU,KAAM;IACpC,MAAMC,mBAAmB,GACxBC,SAAmC,IAC/B;MACJ,OAAOA,SAAS,EAAEb,MAAM,EAAEL,KAAK,KAAKmB,SAAS,GAC1C,CAAC,GACDC,QAAQ,CAAEF,SAAS,CAACb,MAAM,CAACL,KAAM,CAAC;IACtC,CAAC;IAED,OACCiB,mBAAmB,CAAEF,UAAW,CAAC,GACjCE,mBAAmB,CAAED,UAAW,CAAC;EAEnC,CAAE,CAAC,CACFK,GAAG,CAAEjB,0BAA2B,CAAC;EACnC,OAAQ,GAAGL,IAAM,IAAI,CAAEa,qBAAqB,EAAE,GAAGC,oBAAoB,CAAE,CACrES,MAAM,CAAEC,OAAQ,CAAC,CACjBtB,IAAI,CAAE,GAAI,CAAG,GAAE;AAClB"}
1	+ {"version":3,"names":["serializeGradientColor","type","value","join","serializeGradientPosition","position","serializeGradientColorStop","length","serializeGradientOrientation","orientation","Array","isArray","serializeGradient","colorStops","serializedOrientation","serializedColorStops","sort","colorStop1","colorStop2","getNumericStopValue","colorStop","undefined","parseInt","map","filter","Boolean"],"sources":["@wordpress/components/src/custom-gradient-picker/serializer.ts"],"sourcesContent":["/*\n External dependencies\n */\nimport type gradientParser from 'gradient-parser';\n\nexport function serializeGradientColor( {\n\ttype,\n\tvalue,\n}: gradientParser.ColorStop ) {\n\tif ( type === 'literal' ) {\n\t\treturn value;\n\t}\n\tif ( type === 'hex' ) {\n\t\treturn `#${ value }`;\n\t}\n\treturn `${ type }(${ value.join( ',' ) })`;\n}\n\nexport function serializeGradientPosition(\n\tposition: gradientParser.ColorStop[ 'length' ]\n) {\n\tif ( ! position ) {\n\t\treturn '';\n\t}\n\tconst { value, type } = position;\n\treturn `${ value }${ type }`;\n}\n\nexport function serializeGradientColorStop( {\n\ttype,\n\tvalue,\n\tlength,\n}: gradientParser.ColorStop ) {\n\treturn `${ serializeGradientColor( {\n\t\ttype,\n\t\tvalue,\n\t} as gradientParser.ColorStop ) } ${ serializeGradientPosition( length ) }`;\n}\n\nexport function serializeGradientOrientation(\n\torientation: gradientParser.GradientNode[ 'orientation' ]\n) {\n\tif (\n\t\tArray.isArray( orientation ) \|\|\n\t\t! orientation \|\|\n\t\torientation.type !== 'angular'\n\t) {\n\t\treturn;\n\t}\n\treturn `${ orientation.value }deg`;\n}\n\nexport function serializeGradient( {\n\ttype,\n\torientation,\n\tcolorStops,\n}: gradientParser.GradientNode ) {\n\tconst serializedOrientation = serializeGradientOrientation( orientation );\n\tconst serializedColorStops = colorStops\n\t\t.sort( ( colorStop1, colorStop2 ) => {\n\t\t\tconst getNumericStopValue = (\n\t\t\t\tcolorStop: gradientParser.ColorStop\n\t\t\t) => {\n\t\t\t\treturn colorStop?.length?.value === undefined\n\t\t\t\t\t? 0\n\t\t\t\t\t: parseInt( colorStop.length.value );\n\t\t\t};\n\n\t\t\treturn (\n\t\t\t\tgetNumericStopValue( colorStop1 ) -\n\t\t\t\tgetNumericStopValue( colorStop2 )\n\t\t\t);\n\t\t} )\n\t\t.map( serializeGradientColorStop );\n\treturn `${ type }(${ [ serializedOrientation, ...serializedColorStops ]\n\t\t.filter( Boolean )\n\t\t.join( ',' ) })`;\n}\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;;AAGO,SAASA,sBAAsBA,CAAE;EACvCC,IAAI;EACJC;AACyB,CAAC,EAAG;EAC7B,IAAKD,IAAI,KAAK,SAAS,EAAG;IACzB,OAAOC,KAAK;EACb;EACA,IAAKD,IAAI,KAAK,KAAK,EAAG;IACrB,OAAQ,IAAIC,KAAO,EAAC;EACrB;EACA,OAAQ,GAAGD,IAAM,IAAIC,KAAK,CAACC,IAAI,CAAE,GAAI,CAAG,GAAE;AAC3C;AAEO,SAASC,yBAAyBA,CACxCC,QAA8C,EAC7C;EACD,IAAK,CAAEA,QAAQ,EAAG;IACjB,OAAO,EAAE;EACV;EACA,MAAM;IAAEH,KAAK;IAAED;EAAK,CAAC,GAAGI,QAAQ;EAChC,OAAQ,GAAGH,KAAO,GAAGD,IAAM,EAAC;AAC7B;AAEO,SAASK,0BAA0BA,CAAE;EAC3CL,IAAI;EACJC,KAAK;EACLK;AACyB,CAAC,EAAG;EAC7B,OAAQ,GAAGP,sBAAsB,CAAE;IAClCC,IAAI;IACJC;EACD,CAA8B,CAAG,IAAIE,yBAAyB,CAAEG,MAAO,CAAG,EAAC;AAC5E;AAEO,SAASC,4BAA4BA,CAC3CC,WAAyD,EACxD;EACD,IACCC,KAAK,CAACC,OAAO,CAAEF,WAAY,CAAC,IAC5B,CAAEA,WAAW,IACbA,WAAW,CAACR,IAAI,KAAK,SAAS,EAC7B;IACD;EACD;EACA,OAAQ,GAAGQ,WAAW,CAACP,KAAO,KAAI;AACnC;AAEO,SAASU,iBAAiBA,CAAE;EAClCX,IAAI;EACJQ,WAAW;EACXI;AAC4B,CAAC,EAAG;EAChC,MAAMC,qBAAqB,GAAGN,4BAA4B,CAAEC,WAAY,CAAC;EACzE,MAAMM,oBAAoB,GAAGF,UAAU,CACrCG,IAAI,CAAE,CAAEC,UAAU,EAAEC,UAAU,KAAM;IACpC,MAAMC,mBAAmB,GACxBC,SAAmC,IAC/B;MACJ,OAAOA,SAAS,EAAEb,MAAM,EAAEL,KAAK,KAAKmB,SAAS,GAC1C,CAAC,GACDC,QAAQ,CAAEF,SAAS,CAACb,MAAM,CAACL,KAAM,CAAC;IACtC,CAAC;IAED,OACCiB,mBAAmB,CAAEF,UAAW,CAAC,GACjCE,mBAAmB,CAAED,UAAW,CAAC;EAEnC,CAAE,CAAC,CACFK,GAAG,CAAEjB,0BAA2B,CAAC;EACnC,OAAQ,GAAGL,IAAM,IAAI,CAAEa,qBAAqB,EAAE,GAAGC,oBAAoB,CAAE,CACrES,MAAM,CAAEC,OAAQ,CAAC,CACjBtB,IAAI,CAAE,GAAI,CAAG,GAAE;AAClB","ignoreList":[]}

package/build/custom-gradient-picker/styles/custom-gradient-picker-styles.js CHANGED Viewed

@@ -7,8 +7,12 @@ Object.defineProperty(exports, "__esModule", {
 exports.SelectWrapper = exports.AccessoryWrapper = void 0;
 var _base = _interopRequireDefault(require("@emotion/styled/base"));
 var _flex = require("../../flex");
-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)."; }
-const SelectWrapper = exports.SelectWrapper = ( /*#__PURE__*/0, _base.default)(_flex.FlexBlock, process.env.NODE_ENV === "production" ? {
+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
+ */ /**
+ * Internal dependencies
+ */
+const SelectWrapper = exports.SelectWrapper = /*#__PURE__*/(0, _base.default)(_flex.FlexBlock, process.env.NODE_ENV === "production" ? {
   target: "e10bzpgi1"
 } : {
   target: "e10bzpgi1",
@@ -22,7 +26,7 @@ const SelectWrapper = exports.SelectWrapper = ( /*#__PURE__*/0, _base.default)(_
   map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvY3VzdG9tLWdyYWRpZW50LXBpY2tlci9zdHlsZXMvY3VzdG9tLWdyYWRpZW50LXBpY2tlci1zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVNnRCIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2N1c3RvbS1ncmFkaWVudC1waWNrZXIvc3R5bGVzL2N1c3RvbS1ncmFkaWVudC1waWNrZXItc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IEZsZXhCbG9jayB9IGZyb20gJy4uLy4uL2ZsZXgnO1xuXG5leHBvcnQgY29uc3QgU2VsZWN0V3JhcHBlciA9IHN0eWxlZCggRmxleEJsb2NrIClgXG5cdGZsZXgtZ3JvdzogNTtcbmA7XG5cbmV4cG9ydCBjb25zdCBBY2Nlc3NvcnlXcmFwcGVyID0gc3R5bGVkKCBGbGV4QmxvY2sgKWBcblx0ZmxleC1ncm93OiA1O1xuYDtcbiJdfQ== */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
-const AccessoryWrapper = exports.AccessoryWrapper = ( /*#__PURE__*/0, _base.default)(_flex.FlexBlock, process.env.NODE_ENV === "production" ? {
+const AccessoryWrapper = exports.AccessoryWrapper = /*#__PURE__*/(0, _base.default)(_flex.FlexBlock, process.env.NODE_ENV === "production" ? {
   target: "e10bzpgi0"
 } : {
   target: "e10bzpgi0",

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

	@@ -1 +1 @@
1	- {"version":3,"names":["_flex","require","_EMOTION_STRINGIFIED_CSS_ERROR__","SelectWrapper","exports","_base","default","FlexBlock","process","env","NODE_ENV","target","label","name","styles","map","toString","AccessoryWrapper"],"sources":["@wordpress/components/src/custom-gradient-picker/styles/custom-gradient-picker-styles.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport styled from '@emotion/styled';\n/\n Internal dependencies\n */\nimport { FlexBlock } from '../../flex';\n\nexport const SelectWrapper = styled( FlexBlock )`\n\tflex-grow: 5;\n`;\n\nexport const AccessoryWrapper = styled( FlexBlock )`\n\tflex-grow: 5;\n`;\n"],"mappings":";;;;;;;;AAOA,IAAAA,KAAA,GAAAC,OAAA;AAAuC,SAAAC,iCAAA;~~AAEhC~~,MAAMC,aAAa,GAAAC,OAAA,CAAAD,aAAA,~~GAAG~~,~~kBAAAE~~,KAAA,CAAAC,OAAA,EAAQC,eAAS,EAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,CAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAd;AAAA,EAE/C;AAEM,MAAMe,gBAAgB,GAAAb,OAAA,CAAAa,gBAAA,~~GAAG~~,~~kBAAAZ~~,KAAA,CAAAC,OAAA,EAAQC,eAAS,EAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,CAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAd;AAAA,EAElD"}
1	+ {"version":3,"names":["_flex","require","_EMOTION_STRINGIFIED_CSS_ERROR__","SelectWrapper","exports","_base","default","FlexBlock","process","env","NODE_ENV","target","label","name","styles","map","toString","AccessoryWrapper"],"sources":["@wordpress/components/src/custom-gradient-picker/styles/custom-gradient-picker-styles.tsx"],"sourcesContent":["/*\n External dependencies\n /\nimport styled from '@emotion/styled';\n/\n Internal dependencies\n */\nimport { FlexBlock } from '../../flex';\n\nexport const SelectWrapper = styled( FlexBlock )`\n\tflex-grow: 5;\n`;\n\nexport const AccessoryWrapper = styled( FlexBlock )`\n\tflex-grow: 5;\n`;\n"],"mappings":";;;;;;;;AAOA,IAAAA,KAAA,GAAAC,OAAA;AAAuC,SAAAC,iCAAA,gPAPvC;AACA;AACA,GAFA,CAIA;AACA;AACA;AAGO,MAAMC,aAAa,GAAAC,OAAA,CAAAD,aAAA,gBAAG,IAAAE,KAAA,CAAAC,OAAA,EAAQC,eAAS,EAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,CAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAd;AAAA,EAE/C;AAEM,MAAMe,gBAAgB,GAAAb,OAAA,CAAAa,gBAAA,gBAAG,IAAAZ,KAAA,CAAAC,OAAA,EAAQC,eAAS,EAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,CAAC,CAAC,CAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAd;AAAA,EAElD","ignoreList":[]}

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

	@@ -1 +1 @@
1	- {"version":3,"names":[],"sources":["@wordpress/components/src/custom-gradient-picker/types.ts"],"sourcesContent":["/*\n External dependencies\n /\nimport type gradientParser from 'gradient-parser';\n\nexport type CustomGradientPickerProps = {\n\t/\n\t Start opting in to the new margin-free styles that will become the default\n\t * in a future version, currently scheduled to be WordPress 6.4. (The prop\n\t * can be safely removed once this happens.)\n\t \n\t @default false\n\t * @deprecated Default behavior since WP 6.5. Prop can be safely removed.\n\t * @ignore\n\t /\n\t__nextHasNoMargin?: boolean;\n\t/\n\t The current value of the gradient. Pass a css gradient string (See default value for example).\n\t * Optionally pass in a `null` value to specify no gradient is currently selected.\n\t \n\t @default 'linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%)'\n\t /\n\tvalue?: string \| null;\n\t/\n\t The function called when a new gradient has been defined. It is passed to\n\t * the `currentGradient` as an argument.\n\t /\n\tonChange: ( currentGradient: string ) => void;\n\t/\n\t Whether this is rendered in the sidebar.\n\t \n\t @default false\n\t */\n\t__experimentalIsRenderedInSidebar?: boolean;\n};\n\nexport type GradientAnglePickerProps = {\n\tgradientAST:\n\t\t\| gradientParser.LinearGradientNode\n\t\t\| gradientParser.RepeatingLinearGradientNode;\n\thasGradient: boolean;\n\tonChange: ( gradient: string ) => void;\n};\n\nexport type GradientTypePickerProps = {\n\tgradientAST: gradientParser.GradientNode;\n\thasGradient: boolean;\n\tonChange: ( gradient: string ) => void;\n};\n\nexport type ControlPoint = { color: string; position: number };\n\nexport type CustomGradientBarProps = {\n\tbackground: React.CSSProperties[ 'background' ];\n\thasGradient: boolean;\n\tvalue: ControlPoint[];\n\tonChange: ( newControlPoints: ControlPoint[] ) => void;\n\tdisableInserter?: boolean;\n\tdisableAlpha?: boolean;\n\t__experimentalIsRenderedInSidebar?: boolean;\n};\n\nexport type CustomGradientBarIdleState = { id: 'IDLE' };\ntype CustomGradientBarMovingInserterState = {\n\tid: 'MOVING_INSERTER';\n\tinsertPosition: number;\n};\ntype CustomGradientBarInsertingControlPointState = {\n\tid: 'INSERTING_CONTROL_POINT';\n\tinsertPosition: number;\n};\ntype CustomGradientBarMovingControlPointState = { id: 'MOVING_CONTROL_POINT' };\n\nexport type CustomGradientBarReducerState =\n\t\| CustomGradientBarIdleState\n\t\| CustomGradientBarMovingInserterState\n\t\| CustomGradientBarInsertingControlPointState\n\t\| CustomGradientBarMovingControlPointState;\n\nexport type CustomGradientBarReducerAction =\n\t\| { type: 'MOVE_INSERTER'; insertPosition: number }\n\t\| { type: 'STOP_INSERTER_MOVE' }\n\t\| { type: 'OPEN_INSERTER' }\n\t\| { type: 'CLOSE_INSERTER' }\n\t\| { type: 'START_CONTROL_CHANGE' }\n\t\| { type: 'STOP_CONTROL_CHANGE' };\n\nexport type ControlPointButtonProps = {\n\tisOpen: boolean;\n\tposition: ControlPoint[ 'position' ];\n\tcolor: string;\n};\n\nexport type ControlPointsProps = {\n\tdisableRemove: boolean;\n\tdisableAlpha: boolean;\n\tgradientPickerDomRef: React.RefObject< HTMLDivElement >;\n\tignoreMarkerPosition?: number;\n\tvalue: ControlPoint[];\n\tonChange: ( controlPoints: ControlPoint[] ) => void;\n\tonStartControlPointChange: () => void;\n\tonStopControlPointChange: () => void;\n\t__experimentalIsRenderedInSidebar: boolean;\n};\n\nexport type ControlPointMoveState = {\n\tinitialPosition: number;\n\tindex: number;\n\tsignificantMoveHappened: boolean;\n\tlistenersActivated: boolean;\n};\n\nexport type InsertPointProps = {\n\tvalue: ControlPoint[];\n\tonChange: ( controlPoints: ControlPoint[] ) => void;\n\tonOpenInserter: () => void;\n\tonCloseInserter: () => void;\n\tinsertPosition: number;\n\tdisableAlpha: boolean;\n\t__experimentalIsRenderedInSidebar: boolean;\n};\n"],"mappings":""}
1	+ {"version":3,"names":[],"sources":["@wordpress/components/src/custom-gradient-picker/types.ts"],"sourcesContent":["/*\n External dependencies\n /\nimport type gradientParser from 'gradient-parser';\n\nexport type CustomGradientPickerProps = {\n\t/\n\t Start opting in to the new margin-free styles that will become the default\n\t * in a future version, currently scheduled to be WordPress 6.4. (The prop\n\t * can be safely removed once this happens.)\n\t \n\t @default false\n\t * @deprecated Default behavior since WP 6.5. Prop can be safely removed.\n\t * @ignore\n\t /\n\t__nextHasNoMargin?: boolean;\n\t/\n\t The current value of the gradient. Pass a css gradient string (See default value for example).\n\t * Optionally pass in a `null` value to specify no gradient is currently selected.\n\t \n\t @default 'linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%)'\n\t /\n\tvalue?: string \| null;\n\t/\n\t The function called when a new gradient has been defined. It is passed to\n\t * the `currentGradient` as an argument.\n\t /\n\tonChange: ( currentGradient: string ) => void;\n\t/\n\t Whether this is rendered in the sidebar.\n\t \n\t @default false\n\t */\n\t__experimentalIsRenderedInSidebar?: boolean;\n};\n\nexport type GradientAnglePickerProps = {\n\tgradientAST:\n\t\t\| gradientParser.LinearGradientNode\n\t\t\| gradientParser.RepeatingLinearGradientNode;\n\thasGradient: boolean;\n\tonChange: ( gradient: string ) => void;\n};\n\nexport type GradientTypePickerProps = {\n\tgradientAST: gradientParser.GradientNode;\n\thasGradient: boolean;\n\tonChange: ( gradient: string ) => void;\n};\n\nexport type ControlPoint = { color: string; position: number };\n\nexport type CustomGradientBarProps = {\n\tbackground: React.CSSProperties[ 'background' ];\n\thasGradient: boolean;\n\tvalue: ControlPoint[];\n\tonChange: ( newControlPoints: ControlPoint[] ) => void;\n\tdisableInserter?: boolean;\n\tdisableAlpha?: boolean;\n\t__experimentalIsRenderedInSidebar?: boolean;\n};\n\nexport type CustomGradientBarIdleState = { id: 'IDLE' };\ntype CustomGradientBarMovingInserterState = {\n\tid: 'MOVING_INSERTER';\n\tinsertPosition: number;\n};\ntype CustomGradientBarInsertingControlPointState = {\n\tid: 'INSERTING_CONTROL_POINT';\n\tinsertPosition: number;\n};\ntype CustomGradientBarMovingControlPointState = { id: 'MOVING_CONTROL_POINT' };\n\nexport type CustomGradientBarReducerState =\n\t\| CustomGradientBarIdleState\n\t\| CustomGradientBarMovingInserterState\n\t\| CustomGradientBarInsertingControlPointState\n\t\| CustomGradientBarMovingControlPointState;\n\nexport type CustomGradientBarReducerAction =\n\t\| { type: 'MOVE_INSERTER'; insertPosition: number }\n\t\| { type: 'STOP_INSERTER_MOVE' }\n\t\| { type: 'OPEN_INSERTER' }\n\t\| { type: 'CLOSE_INSERTER' }\n\t\| { type: 'START_CONTROL_CHANGE' }\n\t\| { type: 'STOP_CONTROL_CHANGE' };\n\nexport type ControlPointButtonProps = {\n\tisOpen: boolean;\n\tposition: ControlPoint[ 'position' ];\n\tcolor: string;\n};\n\nexport type ControlPointsProps = {\n\tdisableRemove: boolean;\n\tdisableAlpha: boolean;\n\tgradientPickerDomRef: React.RefObject< HTMLDivElement >;\n\tignoreMarkerPosition?: number;\n\tvalue: ControlPoint[];\n\tonChange: ( controlPoints: ControlPoint[] ) => void;\n\tonStartControlPointChange: () => void;\n\tonStopControlPointChange: () => void;\n\t__experimentalIsRenderedInSidebar: boolean;\n};\n\nexport type ControlPointMoveState = {\n\tinitialPosition: number;\n\tindex: number;\n\tsignificantMoveHappened: boolean;\n\tlistenersActivated: boolean;\n};\n\nexport type InsertPointProps = {\n\tvalue: ControlPoint[];\n\tonChange: ( controlPoints: ControlPoint[] ) => void;\n\tonOpenInserter: () => void;\n\tonCloseInserter: () => void;\n\tinsertPosition: number;\n\tdisableAlpha: boolean;\n\t__experimentalIsRenderedInSidebar: boolean;\n};\n"],"mappings":"","ignoreList":[]}

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

	@@ -1 +1 @@
1	- {"version":3,"names":["_gradientParser","_interopRequireDefault","require","_colord","_names","_constants","_serializer","extend","namesPlugin","getLinearGradientRepresentation","gradientAST","serializeGradient","type","orientation","HORIZONTAL_GRADIENT_ORIENTATION","colorStops","hasUnsupportedLength","item","length","undefined","getGradientAstWithDefault","value","hasGradient","valueToParse","DEFAULT_GRADIENT","gradientParser","parse","error","console","warn","Array","isArray","DIRECTIONAL_ORIENTATION_ANGLE_MAP","toString","some","step","forEach","stop","index","getGradientAstWithControlPoints","newControlPoints","map","position","color","r","g","b","a","colord","toRgb","getStopCssColor","colorStop","join"],"sources":["@wordpress/components/src/custom-gradient-picker/utils.ts"],"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';\nimport type { ControlPoint } from './types';\n\nextend( [ namesPlugin ] );\n\nexport function getLinearGradientRepresentation(\n\tgradientAST: gradientParser.GradientNode\n) {\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: gradientParser.ColorStop ) {\n\treturn item.length === undefined \|\| item.length.type !== '%';\n}\n\nexport function getGradientAstWithDefault( value?: string \| null ) {\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: gradientParser.GradientNode \| undefined;\n\tlet hasGradient = !! value;\n\n\tconst valueToParse = value ?? DEFAULT_GRADIENT;\n\n\ttry {\n\t\tgradientAST = gradientParser.parse( valueToParse )[ 0 ];\n\t} catch ( error ) {\n\t\t// eslint-disable-next-line no-console\n\t\tconsole.warn(\n\t\t\t'wp.components.CustomGradientPicker failed to parse the gradient with error',\n\t\t\terror\n\t\t);\n\n\t\tgradientAST = gradientParser.parse( DEFAULT_GRADIENT )[ 0 ];\n\t\thasGradient = false;\n\t}\n\n\tif (\n\t\t! Array.isArray( gradientAST.orientation ) &&\n\t\tgradientAST.orientation?.type === 'directional'\n\t) {\n\t\tgradientAST.orientation = {\n\t\t\ttype: 'angular',\n\t\t\tvalue: DIRECTIONAL_ORIENTATION_ANGLE_MAP[\n\t\t\t\tgradientAST.orientation.value\n\t\t\t].toString(),\n\t\t};\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}\n\n\treturn { gradientAST, hasGradient };\n}\n\nexport function getGradientAstWithControlPoints(\n\tgradientAST: gradientParser.GradientNode,\n\tnewControlPoints: ControlPoint[]\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:\n\t\t\t\t\ta < 1\n\t\t\t\t\t\t? [ `${ r }`, `${ g }`, `${ b }`, `${ a }` ]\n\t\t\t\t\t\t: [ `${ r }`, `${ g }`, `${ b }` ],\n\t\t\t};\n\t\t} ),\n\t} as gradientParser.GradientNode;\n}\n\nexport function getStopCssColor( colorStop: gradientParser.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"],"mappings":"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"}
1	+ {"version":3,"names":["_gradientParser","_interopRequireDefault","require","_colord","_names","_constants","_serializer","extend","namesPlugin","getLinearGradientRepresentation","gradientAST","serializeGradient","type","orientation","HORIZONTAL_GRADIENT_ORIENTATION","colorStops","hasUnsupportedLength","item","length","undefined","getGradientAstWithDefault","value","hasGradient","valueToParse","DEFAULT_GRADIENT","gradientParser","parse","error","console","warn","Array","isArray","DIRECTIONAL_ORIENTATION_ANGLE_MAP","toString","some","step","forEach","stop","index","getGradientAstWithControlPoints","newControlPoints","map","position","color","r","g","b","a","colord","toRgb","getStopCssColor","colorStop","join"],"sources":["@wordpress/components/src/custom-gradient-picker/utils.ts"],"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';\nimport type { ControlPoint } from './types';\n\nextend( [ namesPlugin ] );\n\nexport function getLinearGradientRepresentation(\n\tgradientAST: gradientParser.GradientNode\n) {\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: gradientParser.ColorStop ) {\n\treturn item.length === undefined \|\| item.length.type !== '%';\n}\n\nexport function getGradientAstWithDefault( value?: string \| null ) {\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: gradientParser.GradientNode \| undefined;\n\tlet hasGradient = !! value;\n\n\tconst valueToParse = value ?? DEFAULT_GRADIENT;\n\n\ttry {\n\t\tgradientAST = gradientParser.parse( valueToParse )[ 0 ];\n\t} catch ( error ) {\n\t\t// eslint-disable-next-line no-console\n\t\tconsole.warn(\n\t\t\t'wp.components.CustomGradientPicker failed to parse the gradient with error',\n\t\t\terror\n\t\t);\n\n\t\tgradientAST = gradientParser.parse( DEFAULT_GRADIENT )[ 0 ];\n\t\thasGradient = false;\n\t}\n\n\tif (\n\t\t! Array.isArray( gradientAST.orientation ) &&\n\t\tgradientAST.orientation?.type === 'directional'\n\t) {\n\t\tgradientAST.orientation = {\n\t\t\ttype: 'angular',\n\t\t\tvalue: DIRECTIONAL_ORIENTATION_ANGLE_MAP[\n\t\t\t\tgradientAST.orientation.value\n\t\t\t].toString(),\n\t\t};\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}\n\n\treturn { gradientAST, hasGradient };\n}\n\nexport function getGradientAstWithControlPoints(\n\tgradientAST: gradientParser.GradientNode,\n\tnewControlPoints: ControlPoint[]\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:\n\t\t\t\t\ta < 1\n\t\t\t\t\t\t? [ `${ r }`, `${ g }`, `${ b }`, `${ a }` ]\n\t\t\t\t\t\t: [ `${ r }`, `${ g }`, `${ b }` ],\n\t\t\t};\n\t\t} ),\n\t} as gradientParser.GradientNode;\n}\n\nexport function getStopCssColor( colorStop: gradientParser.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"],"mappings":"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","ignoreList":[]}

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

@@ -99,15 +99,6 @@ function CustomSelectControl(props) {
     } : undefined),
     stateReducer
   });
-  const [isFocused, setIsFocused] = (0, _element.useState)(false);
-  function handleOnFocus(e) {
-    setIsFocused(true);
-    onFocus?.(e);
-  }
-  function handleOnBlur(e) {
-    setIsFocused(false);
-    onBlur?.(e);
-  }
   function getDescribedBy() {
     if (describedBy) {
       return describedBy;
@@ -144,15 +135,14 @@ function CustomSelectControl(props) {
     })
   }, label), (0, _react.createElement)(_inputBase.default, {
     __next40pxDefaultSize: __next40pxDefaultSize,
-    isFocused: isOpen || isFocused,
     size: size,
     suffix: (0, _react.createElement)(_chevronDown.default, null)
   }, (0, _react.createElement)(_selectControlStyles.Select, {
     onMouseOver: onMouseOver,
     onMouseOut: onMouseOut,
     as: "button",
-    onFocus: handleOnFocus,
-    onBlur: handleOnBlur,
+    onFocus: onFocus,
+    onBlur: onBlur,
     selectSize: size,
     __next40pxDefaultSize: __next40pxDefaultSize,
     ...getToggleButtonProps({
@@ -164,7 +154,9 @@ function CustomSelectControl(props) {
     })
   }, itemToString(selectedItem), __experimentalShowSelectedHint && selectedItem.__experimentalHint && (0, _react.createElement)("span", {
     className: "components-custom-select-control__hint"
-  }, selectedItem.__experimentalHint))), (0, _react.createElement)("ul", {
+  }, selectedItem.__experimentalHint)), (0, _react.createElement)("div", {
+    className: "components-custom-select-control__menu-wrapper"
+  }, (0, _react.createElement)("ul", {
     ...menuProps,
     onKeyDown: onKeyDownHandler
   }, isOpen && items.map((item, index) =>
@@ -186,7 +178,7 @@ function CustomSelectControl(props) {
   }, item.__experimentalHint), item === selectedItem && (0, _react.createElement)(_icons.Icon, {
     icon: _icons.check,
     className: "components-custom-select-control__item-icon"
-  })))));
+  })))))));
 }
 function StableCustomSelectControl(props) {
   return (0, _react.createElement)(CustomSelectControl, {