@wordpress/components 28.8.7 → 28.8.9
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.
- package/build/border-control/border-control-dropdown/component.js +12 -12
- package/build/border-control/border-control-dropdown/component.js.map +1 -1
- package/build/color-palette/index.js +1 -1
- package/build/color-palette/index.js.map +1 -1
- package/build/custom-gradient-picker/gradient-bar/control-points.js +1 -1
- package/build/custom-gradient-picker/gradient-bar/control-points.js.map +1 -1
- package/build/font-size-picker/index.native.js +6 -6
- package/build/font-size-picker/index.native.js.map +1 -1
- package/build/mobile/bottom-sheet/range-cell.native.js +1 -1
- package/build/mobile/bottom-sheet/range-cell.native.js.map +1 -1
- package/build/mobile/bottom-sheet/stepper-cell/index.native.js +1 -1
- package/build/mobile/bottom-sheet/stepper-cell/index.native.js.map +1 -1
- package/build/mobile/bottom-sheet-select-control/index.native.js +2 -2
- package/build/mobile/bottom-sheet-select-control/index.native.js.map +1 -1
- package/build/tabs/styles.js +3 -3
- package/build/tabs/styles.js.map +1 -1
- package/build/tools-panel/tools-panel-header/component.js +1 -1
- package/build/tools-panel/tools-panel-header/component.js.map +1 -1
- package/build-module/border-control/border-control-dropdown/component.js +12 -12
- package/build-module/border-control/border-control-dropdown/component.js.map +1 -1
- package/build-module/color-palette/index.js +1 -1
- package/build-module/color-palette/index.js.map +1 -1
- package/build-module/custom-gradient-picker/gradient-bar/control-points.js +1 -1
- package/build-module/custom-gradient-picker/gradient-bar/control-points.js.map +1 -1
- package/build-module/font-size-picker/index.native.js +7 -7
- package/build-module/font-size-picker/index.native.js.map +1 -1
- package/build-module/mobile/bottom-sheet/range-cell.native.js +1 -1
- package/build-module/mobile/bottom-sheet/range-cell.native.js.map +1 -1
- package/build-module/mobile/bottom-sheet/stepper-cell/index.native.js +1 -1
- package/build-module/mobile/bottom-sheet/stepper-cell/index.native.js.map +1 -1
- package/build-module/mobile/bottom-sheet-select-control/index.native.js +2 -2
- package/build-module/mobile/bottom-sheet-select-control/index.native.js.map +1 -1
- package/build-module/tabs/styles.js +3 -3
- package/build-module/tabs/styles.js.map +1 -1
- package/build-module/tools-panel/tools-panel-header/component.js +1 -1
- package/build-module/tools-panel/tools-panel-header/component.js.map +1 -1
- package/build-types/border-control/border-control-dropdown/component.d.ts.map +1 -1
- package/package.json +2 -2
- package/src/border-control/border-control-dropdown/component.tsx +24 -12
- package/src/color-palette/index.tsx +1 -1
- package/src/custom-gradient-picker/gradient-bar/control-points.tsx +1 -1
- package/src/font-size-picker/index.native.js +7 -7
- package/src/mobile/bottom-sheet/range-cell.native.js +1 -1
- package/src/mobile/bottom-sheet/stepper-cell/index.native.js +1 -1
- package/src/mobile/bottom-sheet-select-control/index.native.js +2 -2
- package/src/tabs/styles.ts +1 -1
- package/src/tools-panel/tools-panel-header/component.tsx +1 -1
- package/tsconfig.tsbuildinfo +1 -1
|
@@ -61,30 +61,30 @@ const getToggleAriaLabel = (colorValue, colorObject, style, isStyleEnabled) => {
|
|
|
61
61
|
if (colorObject) {
|
|
62
62
|
const ariaLabelValue = getAriaLabelColorValue(colorObject.color);
|
|
63
63
|
return style ? (0, _i18n.sprintf)(
|
|
64
|
-
// translators:
|
|
65
|
-
'Border color and style picker. The currently selected color is called "%1$s" and has a value of "%2$s". The currently selected style is "%3$s".', colorObject.name, ariaLabelValue, style) : (0, _i18n.sprintf)(
|
|
66
|
-
// translators:
|
|
67
|
-
'Border color and style picker. The currently selected color is called "%1$s" and has a value of "%2$s".', colorObject.name, ariaLabelValue);
|
|
64
|
+
// translators: 1: The name of the color e.g. "vivid red". 2: The color's hex code e.g.: "#f00:". 3: The current border style selection e.g. "solid".
|
|
65
|
+
(0, _i18n.__)('Border color and style picker. The currently selected color is called "%1$s" and has a value of "%2$s". The currently selected style is "%3$s".'), colorObject.name, ariaLabelValue, style) : (0, _i18n.sprintf)(
|
|
66
|
+
// translators: 1: The name of the color e.g. "vivid red". 2: The color's hex code e.g.: "#f00:".
|
|
67
|
+
(0, _i18n.__)('Border color and style picker. The currently selected color is called "%1$s" and has a value of "%2$s".'), colorObject.name, ariaLabelValue);
|
|
68
68
|
}
|
|
69
69
|
if (colorValue) {
|
|
70
70
|
const ariaLabelValue = getAriaLabelColorValue(colorValue);
|
|
71
71
|
return style ? (0, _i18n.sprintf)(
|
|
72
|
-
// translators:
|
|
73
|
-
'Border color and style picker. The currently selected color has a value of "%1$s". The currently selected style is "%2$s".', ariaLabelValue, style) : (0, _i18n.sprintf)(
|
|
74
|
-
// translators: %
|
|
75
|
-
'Border color and style picker. The currently selected color has a value of "%
|
|
72
|
+
// translators: 1: The color's hex code e.g.: "#f00:". 2: The current border style selection e.g. "solid".
|
|
73
|
+
(0, _i18n.__)('Border color and style picker. The currently selected color has a value of "%1$s". The currently selected style is "%2$s".'), ariaLabelValue, style) : (0, _i18n.sprintf)(
|
|
74
|
+
// translators: %s: The color's hex code e.g: "#f00".
|
|
75
|
+
(0, _i18n.__)('Border color and style picker. The currently selected color has a value of "%s".'), ariaLabelValue);
|
|
76
76
|
}
|
|
77
77
|
return (0, _i18n.__)('Border color and style picker.');
|
|
78
78
|
}
|
|
79
79
|
if (colorObject) {
|
|
80
80
|
return (0, _i18n.sprintf)(
|
|
81
|
-
// translators:
|
|
82
|
-
'Border color picker. The currently selected color is called "%1$s" and has a value of "%2$s".', colorObject.name, getAriaLabelColorValue(colorObject.color));
|
|
81
|
+
// translators: 1: The name of the color e.g. "vivid red". 2: The color's hex code e.g: "#f00".
|
|
82
|
+
(0, _i18n.__)('Border color picker. The currently selected color is called "%1$s" and has a value of "%2$s".'), colorObject.name, getAriaLabelColorValue(colorObject.color));
|
|
83
83
|
}
|
|
84
84
|
if (colorValue) {
|
|
85
85
|
return (0, _i18n.sprintf)(
|
|
86
|
-
// translators: %
|
|
87
|
-
'Border color picker. The currently selected color has a value of "%
|
|
86
|
+
// translators: %s: The color's hex code e.g: "#f00".
|
|
87
|
+
(0, _i18n.__)('Border color picker. The currently selected color has a value of "%s".'), getAriaLabelColorValue(colorValue));
|
|
88
88
|
}
|
|
89
89
|
return (0, _i18n.__)('Border color picker.');
|
|
90
90
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_i18n","require","_icons","_borderControlStylePicker","_interopRequireDefault","_button","_colorIndicator","_colorPalette","_dropdown","_hStack","_vStack","_context","_hook","_baseControlStyles","_dropdownContentWrapper","_utils","_jsxRuntime","getAriaLabelColorValue","colorValue","replace","getColorObject","colors","isMultiplePaletteArray","matchedColor","some","origin","color","find","getToggleAriaLabel","colorObject","style","isStyleEnabled","ariaLabelValue","sprintf","name","__","BorderControlDropdown","props","forwardedRef","__experimentalIsRenderedInSidebar","border","disableCustomColors","enableAlpha","enableStyle","indicatorClassName","indicatorWrapperClassName","isStyleSettable","onReset","onColorChange","onStyleChange","popoverContentClassName","popoverControlsClassName","resetButtonClassName","showDropdownHeader","size","__unstablePopoverProps","otherProps","useBorderControlDropdown","toggleAriaLabel","showResetButton","dropdownPosition","undefined","renderToggle","onToggle","jsx","default","onClick","variant","tooltipPosition","label","showTooltip","__next40pxDefaultSize","children","className","renderContent","onClose","jsxs","Fragment","paddingSize","VStack","spacing","HStack","StyledLabel","icon","closeSmall","value","onChange","clearable","popoverProps","ref","ConnectedBorderControlDropdown","contextConnect","_default","exports"],"sources":["@wordpress/components/src/border-control/border-control-dropdown/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { CSSProperties } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { closeSmall } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport BorderControlStylePicker from '../border-control-style-picker';\nimport Button from '../../button';\nimport ColorIndicator from '../../color-indicator';\nimport ColorPalette from '../../color-palette';\nimport Dropdown from '../../dropdown';\nimport { HStack } from '../../h-stack';\nimport { VStack } from '../../v-stack';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport { useBorderControlDropdown } from './hook';\nimport { StyledLabel } from '../../base-control/styles/base-control-styles';\nimport DropdownContentWrapper from '../../dropdown/dropdown-content-wrapper';\n\nimport type { ColorObject } from '../../color-palette/types';\nimport { isMultiplePaletteArray } from '../../color-palette/utils';\nimport type { DropdownProps as DropdownComponentProps } from '../../dropdown/types';\nimport type { ColorProps, DropdownProps } from '../types';\n\nconst getAriaLabelColorValue = ( colorValue: string ) => {\n\t// Leave hex values as-is. Remove the `var()` wrapper from CSS vars.\n\treturn colorValue.replace( /^var\\((.+)\\)$/, '$1' );\n};\n\nconst getColorObject = (\n\tcolorValue: CSSProperties[ 'borderColor' ],\n\tcolors: ColorProps[ 'colors' ] | undefined\n) => {\n\tif ( ! colorValue || ! colors ) {\n\t\treturn;\n\t}\n\n\tif ( isMultiplePaletteArray( colors ) ) {\n\t\t// Multiple origins\n\t\tlet matchedColor;\n\n\t\tcolors.some( ( origin ) =>\n\t\t\torigin.colors.some( ( color ) => {\n\t\t\t\tif ( color.color === colorValue ) {\n\t\t\t\t\tmatchedColor = color;\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\n\t\t\t\treturn false;\n\t\t\t} )\n\t\t);\n\n\t\treturn matchedColor;\n\t}\n\n\t// Single origin\n\treturn colors.find( ( color ) => color.color === colorValue );\n};\n\nconst getToggleAriaLabel = (\n\tcolorValue: CSSProperties[ 'borderColor' ],\n\tcolorObject: ColorObject | undefined,\n\tstyle: CSSProperties[ 'borderStyle' ],\n\tisStyleEnabled: boolean\n) => {\n\tif ( isStyleEnabled ) {\n\t\tif ( colorObject ) {\n\t\t\tconst ariaLabelValue = getAriaLabelColorValue( colorObject.color );\n\t\t\treturn style\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t// translators: %1$s: The name of the color e.g. \"vivid red\". %2$s: The color's hex code e.g.: \"#f00:\". %3$s: The current border style selection e.g. \"solid\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\". The currently selected style is \"%3$s\".',\n\t\t\t\t\t\tcolorObject.name,\n\t\t\t\t\t\tariaLabelValue,\n\t\t\t\t\t\tstyle\n\t\t\t\t )\n\t\t\t\t: sprintf(\n\t\t\t\t\t\t// translators: %1$s: The name of the color e.g. \"vivid red\". %2$s: The color's hex code e.g.: \"#f00:\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".',\n\t\t\t\t\t\tcolorObject.name,\n\t\t\t\t\t\tariaLabelValue\n\t\t\t\t );\n\t\t}\n\n\t\tif ( colorValue ) {\n\t\t\tconst ariaLabelValue = getAriaLabelColorValue( colorValue );\n\t\t\treturn style\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t// translators: %1$s: The color's hex code e.g.: \"#f00:\". %2$s: The current border style selection e.g. \"solid\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color has a value of \"%1$s\". The currently selected style is \"%2$s\".',\n\t\t\t\t\t\tariaLabelValue,\n\t\t\t\t\t\tstyle\n\t\t\t\t )\n\t\t\t\t: sprintf(\n\t\t\t\t\t\t// translators: %1$s: The color's hex code e.g: \"#f00\".\n\t\t\t\t\t\t'Border color and style picker. The currently selected color has a value of \"%1$s\".',\n\t\t\t\t\t\tariaLabelValue\n\t\t\t\t );\n\t\t}\n\n\t\treturn __( 'Border color and style picker.' );\n\t}\n\n\tif ( colorObject ) {\n\t\treturn sprintf(\n\t\t\t// translators: %1$s: The name of the color e.g. \"vivid red\". %2$s: The color's hex code e.g: \"#f00\".\n\t\t\t'Border color picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".',\n\t\t\tcolorObject.name,\n\t\t\tgetAriaLabelColorValue( colorObject.color )\n\t\t);\n\t}\n\n\tif ( colorValue ) {\n\t\treturn sprintf(\n\t\t\t// translators: %1$s: The color's hex code e.g: \"#f00\".\n\t\t\t'Border color picker. The currently selected color has a value of \"%1$s\".',\n\t\t\tgetAriaLabelColorValue( colorValue )\n\t\t);\n\t}\n\n\treturn __( 'Border color picker.' );\n};\n\nconst BorderControlDropdown = (\n\tprops: WordPressComponentProps< DropdownProps, 'div' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\t__experimentalIsRenderedInSidebar,\n\t\tborder,\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\tindicatorClassName,\n\t\tindicatorWrapperClassName,\n\t\tisStyleSettable,\n\t\tonReset,\n\t\tonColorChange,\n\t\tonStyleChange,\n\t\tpopoverContentClassName,\n\t\tpopoverControlsClassName,\n\t\tresetButtonClassName,\n\t\tshowDropdownHeader,\n\t\tsize,\n\t\t__unstablePopoverProps,\n\t\t...otherProps\n\t} = useBorderControlDropdown( props );\n\n\tconst { color, style } = border || {};\n\tconst colorObject = getColorObject( color, colors );\n\n\tconst toggleAriaLabel = getToggleAriaLabel(\n\t\tcolor,\n\t\tcolorObject,\n\t\tstyle,\n\t\tenableStyle\n\t);\n\n\tconst showResetButton = color || ( style && style !== 'none' );\n\tconst dropdownPosition = __experimentalIsRenderedInSidebar\n\t\t? 'bottom left'\n\t\t: undefined;\n\n\tconst renderToggle: DropdownComponentProps[ 'renderToggle' ] = ( {\n\t\tonToggle,\n\t} ) => (\n\t\t<Button\n\t\t\tonClick={ onToggle }\n\t\t\tvariant=\"tertiary\"\n\t\t\taria-label={ toggleAriaLabel }\n\t\t\ttooltipPosition={ dropdownPosition }\n\t\t\tlabel={ __( 'Border color and style picker' ) }\n\t\t\tshowTooltip\n\t\t\t__next40pxDefaultSize={ size === '__unstable-large' ? true : false }\n\t\t>\n\t\t\t<span className={ indicatorWrapperClassName }>\n\t\t\t\t<ColorIndicator\n\t\t\t\t\tclassName={ indicatorClassName }\n\t\t\t\t\tcolorValue={ color }\n\t\t\t\t/>\n\t\t\t</span>\n\t\t</Button>\n\t);\n\n\tconst renderContent: DropdownComponentProps[ 'renderContent' ] = ( {\n\t\tonClose,\n\t} ) => (\n\t\t<>\n\t\t\t<DropdownContentWrapper paddingSize=\"medium\">\n\t\t\t\t<VStack className={ popoverControlsClassName } spacing={ 6 }>\n\t\t\t\t\t{ showDropdownHeader ? (\n\t\t\t\t\t\t<HStack>\n\t\t\t\t\t\t\t<StyledLabel>{ __( 'Border color' ) }</StyledLabel>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\tlabel={ __( 'Close border color' ) }\n\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\tonClick={ onClose }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</HStack>\n\t\t\t\t\t) : undefined }\n\t\t\t\t\t<ColorPalette\n\t\t\t\t\t\tclassName={ popoverContentClassName }\n\t\t\t\t\t\tvalue={ color }\n\t\t\t\t\t\tonChange={ onColorChange }\n\t\t\t\t\t\t{ ...{ colors, disableCustomColors } }\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t}\n\t\t\t\t\t\tclearable={ false }\n\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t/>\n\t\t\t\t\t{ enableStyle && isStyleSettable && (\n\t\t\t\t\t\t<BorderControlStylePicker\n\t\t\t\t\t\t\tlabel={ __( 'Style' ) }\n\t\t\t\t\t\t\tvalue={ style }\n\t\t\t\t\t\t\tonChange={ onStyleChange }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</VStack>\n\t\t\t</DropdownContentWrapper>\n\t\t\t{ showResetButton && (\n\t\t\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName={ resetButtonClassName }\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tonReset();\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Reset' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</DropdownContentWrapper>\n\t\t\t) }\n\t\t</>\n\t);\n\n\treturn (\n\t\t<Dropdown\n\t\t\trenderToggle={ renderToggle }\n\t\t\trenderContent={ renderContent }\n\t\t\tpopoverProps={ {\n\t\t\t\t...__unstablePopoverProps,\n\t\t\t} }\n\t\t\t{ ...otherProps }\n\t\t\tref={ forwardedRef }\n\t\t/>\n\t);\n};\n\nconst ConnectedBorderControlDropdown = contextConnect(\n\tBorderControlDropdown,\n\t'BorderControlDropdown'\n);\n\nexport default ConnectedBorderControlDropdown;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["_i18n","require","_icons","_borderControlStylePicker","_interopRequireDefault","_button","_colorIndicator","_colorPalette","_dropdown","_hStack","_vStack","_context","_hook","_baseControlStyles","_dropdownContentWrapper","_utils","_jsxRuntime","getAriaLabelColorValue","colorValue","replace","getColorObject","colors","isMultiplePaletteArray","matchedColor","some","origin","color","find","getToggleAriaLabel","colorObject","style","isStyleEnabled","ariaLabelValue","sprintf","__","name","BorderControlDropdown","props","forwardedRef","__experimentalIsRenderedInSidebar","border","disableCustomColors","enableAlpha","enableStyle","indicatorClassName","indicatorWrapperClassName","isStyleSettable","onReset","onColorChange","onStyleChange","popoverContentClassName","popoverControlsClassName","resetButtonClassName","showDropdownHeader","size","__unstablePopoverProps","otherProps","useBorderControlDropdown","toggleAriaLabel","showResetButton","dropdownPosition","undefined","renderToggle","onToggle","jsx","default","onClick","variant","tooltipPosition","label","showTooltip","__next40pxDefaultSize","children","className","renderContent","onClose","jsxs","Fragment","paddingSize","VStack","spacing","HStack","StyledLabel","icon","closeSmall","value","onChange","clearable","popoverProps","ref","ConnectedBorderControlDropdown","contextConnect","_default","exports"],"sources":["@wordpress/components/src/border-control/border-control-dropdown/component.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { CSSProperties } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { closeSmall } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport BorderControlStylePicker from '../border-control-style-picker';\nimport Button from '../../button';\nimport ColorIndicator from '../../color-indicator';\nimport ColorPalette from '../../color-palette';\nimport Dropdown from '../../dropdown';\nimport { HStack } from '../../h-stack';\nimport { VStack } from '../../v-stack';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport { useBorderControlDropdown } from './hook';\nimport { StyledLabel } from '../../base-control/styles/base-control-styles';\nimport DropdownContentWrapper from '../../dropdown/dropdown-content-wrapper';\n\nimport type { ColorObject } from '../../color-palette/types';\nimport { isMultiplePaletteArray } from '../../color-palette/utils';\nimport type { DropdownProps as DropdownComponentProps } from '../../dropdown/types';\nimport type { ColorProps, DropdownProps } from '../types';\n\nconst getAriaLabelColorValue = ( colorValue: string ) => {\n\t// Leave hex values as-is. Remove the `var()` wrapper from CSS vars.\n\treturn colorValue.replace( /^var\\((.+)\\)$/, '$1' );\n};\n\nconst getColorObject = (\n\tcolorValue: CSSProperties[ 'borderColor' ],\n\tcolors: ColorProps[ 'colors' ] | undefined\n) => {\n\tif ( ! colorValue || ! colors ) {\n\t\treturn;\n\t}\n\n\tif ( isMultiplePaletteArray( colors ) ) {\n\t\t// Multiple origins\n\t\tlet matchedColor;\n\n\t\tcolors.some( ( origin ) =>\n\t\t\torigin.colors.some( ( color ) => {\n\t\t\t\tif ( color.color === colorValue ) {\n\t\t\t\t\tmatchedColor = color;\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\n\t\t\t\treturn false;\n\t\t\t} )\n\t\t);\n\n\t\treturn matchedColor;\n\t}\n\n\t// Single origin\n\treturn colors.find( ( color ) => color.color === colorValue );\n};\n\nconst getToggleAriaLabel = (\n\tcolorValue: CSSProperties[ 'borderColor' ],\n\tcolorObject: ColorObject | undefined,\n\tstyle: CSSProperties[ 'borderStyle' ],\n\tisStyleEnabled: boolean\n) => {\n\tif ( isStyleEnabled ) {\n\t\tif ( colorObject ) {\n\t\t\tconst ariaLabelValue = getAriaLabelColorValue( colorObject.color );\n\t\t\treturn style\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t// translators: 1: The name of the color e.g. \"vivid red\". 2: The color's hex code e.g.: \"#f00:\". 3: The current border style selection e.g. \"solid\".\n\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t'Border color and style picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\". The currently selected style is \"%3$s\".'\n\t\t\t\t\t\t),\n\t\t\t\t\t\tcolorObject.name,\n\t\t\t\t\t\tariaLabelValue,\n\t\t\t\t\t\tstyle\n\t\t\t\t )\n\t\t\t\t: sprintf(\n\t\t\t\t\t\t// translators: 1: The name of the color e.g. \"vivid red\". 2: The color's hex code e.g.: \"#f00:\".\n\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t'Border color and style picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".'\n\t\t\t\t\t\t),\n\t\t\t\t\t\tcolorObject.name,\n\t\t\t\t\t\tariaLabelValue\n\t\t\t\t );\n\t\t}\n\n\t\tif ( colorValue ) {\n\t\t\tconst ariaLabelValue = getAriaLabelColorValue( colorValue );\n\t\t\treturn style\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t// translators: 1: The color's hex code e.g.: \"#f00:\". 2: The current border style selection e.g. \"solid\".\n\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t'Border color and style picker. The currently selected color has a value of \"%1$s\". The currently selected style is \"%2$s\".'\n\t\t\t\t\t\t),\n\t\t\t\t\t\tariaLabelValue,\n\t\t\t\t\t\tstyle\n\t\t\t\t )\n\t\t\t\t: sprintf(\n\t\t\t\t\t\t// translators: %s: The color's hex code e.g: \"#f00\".\n\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t'Border color and style picker. The currently selected color has a value of \"%s\".'\n\t\t\t\t\t\t),\n\t\t\t\t\t\tariaLabelValue\n\t\t\t\t );\n\t\t}\n\n\t\treturn __( 'Border color and style picker.' );\n\t}\n\n\tif ( colorObject ) {\n\t\treturn sprintf(\n\t\t\t// translators: 1: The name of the color e.g. \"vivid red\". 2: The color's hex code e.g: \"#f00\".\n\t\t\t__(\n\t\t\t\t'Border color picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".'\n\t\t\t),\n\t\t\tcolorObject.name,\n\t\t\tgetAriaLabelColorValue( colorObject.color )\n\t\t);\n\t}\n\n\tif ( colorValue ) {\n\t\treturn sprintf(\n\t\t\t// translators: %s: The color's hex code e.g: \"#f00\".\n\t\t\t__(\n\t\t\t\t'Border color picker. The currently selected color has a value of \"%s\".'\n\t\t\t),\n\t\t\tgetAriaLabelColorValue( colorValue )\n\t\t);\n\t}\n\n\treturn __( 'Border color picker.' );\n};\n\nconst BorderControlDropdown = (\n\tprops: WordPressComponentProps< DropdownProps, 'div' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\t__experimentalIsRenderedInSidebar,\n\t\tborder,\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\tindicatorClassName,\n\t\tindicatorWrapperClassName,\n\t\tisStyleSettable,\n\t\tonReset,\n\t\tonColorChange,\n\t\tonStyleChange,\n\t\tpopoverContentClassName,\n\t\tpopoverControlsClassName,\n\t\tresetButtonClassName,\n\t\tshowDropdownHeader,\n\t\tsize,\n\t\t__unstablePopoverProps,\n\t\t...otherProps\n\t} = useBorderControlDropdown( props );\n\n\tconst { color, style } = border || {};\n\tconst colorObject = getColorObject( color, colors );\n\n\tconst toggleAriaLabel = getToggleAriaLabel(\n\t\tcolor,\n\t\tcolorObject,\n\t\tstyle,\n\t\tenableStyle\n\t);\n\n\tconst showResetButton = color || ( style && style !== 'none' );\n\tconst dropdownPosition = __experimentalIsRenderedInSidebar\n\t\t? 'bottom left'\n\t\t: undefined;\n\n\tconst renderToggle: DropdownComponentProps[ 'renderToggle' ] = ( {\n\t\tonToggle,\n\t} ) => (\n\t\t<Button\n\t\t\tonClick={ onToggle }\n\t\t\tvariant=\"tertiary\"\n\t\t\taria-label={ toggleAriaLabel }\n\t\t\ttooltipPosition={ dropdownPosition }\n\t\t\tlabel={ __( 'Border color and style picker' ) }\n\t\t\tshowTooltip\n\t\t\t__next40pxDefaultSize={ size === '__unstable-large' ? true : false }\n\t\t>\n\t\t\t<span className={ indicatorWrapperClassName }>\n\t\t\t\t<ColorIndicator\n\t\t\t\t\tclassName={ indicatorClassName }\n\t\t\t\t\tcolorValue={ color }\n\t\t\t\t/>\n\t\t\t</span>\n\t\t</Button>\n\t);\n\n\tconst renderContent: DropdownComponentProps[ 'renderContent' ] = ( {\n\t\tonClose,\n\t} ) => (\n\t\t<>\n\t\t\t<DropdownContentWrapper paddingSize=\"medium\">\n\t\t\t\t<VStack className={ popoverControlsClassName } spacing={ 6 }>\n\t\t\t\t\t{ showDropdownHeader ? (\n\t\t\t\t\t\t<HStack>\n\t\t\t\t\t\t\t<StyledLabel>{ __( 'Border color' ) }</StyledLabel>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\tlabel={ __( 'Close border color' ) }\n\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\tonClick={ onClose }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</HStack>\n\t\t\t\t\t) : undefined }\n\t\t\t\t\t<ColorPalette\n\t\t\t\t\t\tclassName={ popoverContentClassName }\n\t\t\t\t\t\tvalue={ color }\n\t\t\t\t\t\tonChange={ onColorChange }\n\t\t\t\t\t\t{ ...{ colors, disableCustomColors } }\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t}\n\t\t\t\t\t\tclearable={ false }\n\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t/>\n\t\t\t\t\t{ enableStyle && isStyleSettable && (\n\t\t\t\t\t\t<BorderControlStylePicker\n\t\t\t\t\t\t\tlabel={ __( 'Style' ) }\n\t\t\t\t\t\t\tvalue={ style }\n\t\t\t\t\t\t\tonChange={ onStyleChange }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</VStack>\n\t\t\t</DropdownContentWrapper>\n\t\t\t{ showResetButton && (\n\t\t\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName={ resetButtonClassName }\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tonReset();\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Reset' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</DropdownContentWrapper>\n\t\t\t) }\n\t\t</>\n\t);\n\n\treturn (\n\t\t<Dropdown\n\t\t\trenderToggle={ renderToggle }\n\t\t\trenderContent={ renderContent }\n\t\t\tpopoverProps={ {\n\t\t\t\t...__unstablePopoverProps,\n\t\t\t} }\n\t\t\t{ ...otherProps }\n\t\t\tref={ forwardedRef }\n\t\t/>\n\t);\n};\n\nconst ConnectedBorderControlDropdown = contextConnect(\n\tBorderControlDropdown,\n\t'BorderControlDropdown'\n);\n\nexport default ConnectedBorderControlDropdown;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -180,7 +180,7 @@ function UnforwardedColorPalette(props, forwardedRef) {
|
|
|
180
180
|
// Leave hex values as-is. Remove the `var()` wrapper from CSS vars.
|
|
181
181
|
const displayValue = value?.replace(/^var\((.+)\)$/, '$1');
|
|
182
182
|
const customColorAccessibleLabel = !!displayValue ? (0, _i18n.sprintf)(
|
|
183
|
-
// translators:
|
|
183
|
+
// translators: 1: The name of the color e.g: "vivid red". 2: The color's hex code e.g: "#f00".
|
|
184
184
|
(0, _i18n.__)('Custom color picker. The currently selected color is called "%1$s" and has a value of "%2$s".'), buttonLabelName, displayValue) : (0, _i18n.__)('Custom color picker.');
|
|
185
185
|
const paletteCommonProps = {
|
|
186
186
|
clearColor,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_colord","require","_names","_interopRequireDefault","_a11y","_clsx","_compose","_i18n","_element","_dropdown","_colorPicker","_circularOptionPicker","_vStack","_truncate","_styles","_dropdownContentWrapper","_utils","_jsxRuntime","extend","namesPlugin","a11yPlugin","SinglePalette","className","clearColor","colors","onChange","value","additionalProps","colorOptions","useMemo","map","color","name","index","colordColor","colord","isSelected","jsx","default","Option","selectedIconProps","fill","contrast","tooltipText","sprintf","__","style","backgroundColor","onClick","OptionGroup","options","MultiplePalettes","headingLevel","instanceId","useInstanceId","length","VStack","spacing","children","colorPalette","id","jsxs","ColorHeading","level","newColor","CustomColorPickerDropdown","isRenderedInSidebar","popoverProps","receivedPopoverProps","props","shift","resize","placement","offset","contentClassName","UnforwardedColorPalette","forwardedRef","asButtons","loop","clearable","disableCustomColors","enableAlpha","__experimentalIsRenderedInSidebar","ariaLabel","ariaLabelledby","normalizedColorValue","setNormalizedColorValue","useState","useCallback","undefined","customColorPaletteCallbackRef","node","normalizeColorValue","hasMultipleColorOrigins","isMultiplePaletteArray","buttonLabelName","extractColorNameFromCurrentValue","renderCustomColorPicker","paddingSize","ColorPicker","isHex","startsWith","displayValue","replace","customColorAccessibleLabel","paletteCommonProps","actions","ButtonAction","metaProps","_metaProps","ref","renderContent","renderToggle","isOpen","onToggle","background","type","Truncate","clsx","ColorPalette","exports","forwardRef","_default"],"sources":["@wordpress/components/src/color-palette/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\nimport { colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\nimport a11yPlugin from 'colord/plugins/a11y';\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback, useMemo, useState, forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Dropdown from '../dropdown';\nimport { ColorPicker } from '../color-picker';\nimport CircularOptionPicker from '../circular-option-picker';\nimport { VStack } from '../v-stack';\nimport { Truncate } from '../truncate';\nimport { ColorHeading } from './styles';\nimport DropdownContentWrapper from '../dropdown/dropdown-content-wrapper';\nimport type {\n\tColorObject,\n\tColorPaletteProps,\n\tCustomColorPickerDropdownProps,\n\tMultiplePalettesProps,\n\tPaletteObject,\n\tSinglePaletteProps,\n} from './types';\nimport type { WordPressComponentProps } from '../context';\nimport type { DropdownProps } from '../dropdown/types';\nimport {\n\textractColorNameFromCurrentValue,\n\tisMultiplePaletteArray,\n\tnormalizeColorValue,\n} from './utils';\n\nextend( [ namesPlugin, a11yPlugin ] );\n\nfunction SinglePalette( {\n\tclassName,\n\tclearColor,\n\tcolors,\n\tonChange,\n\tvalue,\n\t...additionalProps\n}: SinglePaletteProps ) {\n\tconst colorOptions = useMemo( () => {\n\t\treturn colors.map( ( { color, name }, index ) => {\n\t\t\tconst colordColor = colord( color );\n\t\t\tconst isSelected = value === color;\n\n\t\t\treturn (\n\t\t\t\t<CircularOptionPicker.Option\n\t\t\t\t\tkey={ `${ color }-${ index }` }\n\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\tselectedIconProps={\n\t\t\t\t\t\tisSelected\n\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\tfill:\n\t\t\t\t\t\t\t\t\t\tcolordColor.contrast() >\n\t\t\t\t\t\t\t\t\t\tcolordColor.contrast( '#000' )\n\t\t\t\t\t\t\t\t\t\t\t? '#fff'\n\t\t\t\t\t\t\t\t\t\t\t: '#000',\n\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t: {}\n\t\t\t\t\t}\n\t\t\t\t\ttooltipText={\n\t\t\t\t\t\tname ||\n\t\t\t\t\t\t// translators: %s: color hex code e.g: \"#f00\".\n\t\t\t\t\t\tsprintf( __( 'Color code: %s' ), color )\n\t\t\t\t\t}\n\t\t\t\t\tstyle={ { backgroundColor: color, color } }\n\t\t\t\t\tonClick={\n\t\t\t\t\t\tisSelected ? clearColor : () => onChange( color, index )\n\t\t\t\t\t}\n\t\t\t\t\taria-label={\n\t\t\t\t\t\tname\n\t\t\t\t\t\t\t? // translators: %s: The name of the color e.g: \"vivid red\".\n\t\t\t\t\t\t\t sprintf( __( 'Color: %s' ), name )\n\t\t\t\t\t\t\t: // translators: %s: color hex code e.g: \"#f00\".\n\t\t\t\t\t\t\t sprintf( __( 'Color code: %s' ), color )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t);\n\t\t} );\n\t}, [ colors, value, onChange, clearColor ] );\n\n\treturn (\n\t\t<CircularOptionPicker.OptionGroup\n\t\t\tclassName={ className }\n\t\t\toptions={ colorOptions }\n\t\t\t{ ...additionalProps }\n\t\t/>\n\t);\n}\n\nfunction MultiplePalettes( {\n\tclassName,\n\tclearColor,\n\tcolors,\n\tonChange,\n\tvalue,\n\theadingLevel,\n}: MultiplePalettesProps ) {\n\tconst instanceId = useInstanceId( MultiplePalettes, 'color-palette' );\n\n\tif ( colors.length === 0 ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<VStack spacing={ 3 } className={ className }>\n\t\t\t{ colors.map( ( { name, colors: colorPalette }, index ) => {\n\t\t\t\tconst id = `${ instanceId }-${ index }`;\n\t\t\t\treturn (\n\t\t\t\t\t<VStack spacing={ 2 } key={ index }>\n\t\t\t\t\t\t<ColorHeading id={ id } level={ headingLevel }>\n\t\t\t\t\t\t\t{ name }\n\t\t\t\t\t\t</ColorHeading>\n\t\t\t\t\t\t<SinglePalette\n\t\t\t\t\t\t\tclearColor={ clearColor }\n\t\t\t\t\t\t\tcolors={ colorPalette }\n\t\t\t\t\t\t\tonChange={ ( newColor ) =>\n\t\t\t\t\t\t\t\tonChange( newColor, index )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\taria-labelledby={ id }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</VStack>\n\t);\n}\n\nexport function CustomColorPickerDropdown( {\n\tisRenderedInSidebar,\n\tpopoverProps: receivedPopoverProps,\n\t...props\n}: CustomColorPickerDropdownProps ) {\n\tconst popoverProps = useMemo< DropdownProps[ 'popoverProps' ] >(\n\t\t() => ( {\n\t\t\tshift: true,\n\t\t\t// Disabling resize as it would otherwise cause the popover to show\n\t\t\t// scrollbars while dragging the color picker's handle close to the\n\t\t\t// popover edge.\n\t\t\tresize: false,\n\t\t\t...( isRenderedInSidebar\n\t\t\t\t? {\n\t\t\t\t\t\t// When in the sidebar: open to the left (stacking),\n\t\t\t\t\t\t// leaving the same gap as the parent popover.\n\t\t\t\t\t\tplacement: 'left-start',\n\t\t\t\t\t\toffset: 34,\n\t\t\t\t }\n\t\t\t\t: {\n\t\t\t\t\t\t// Default behavior: open below the anchor\n\t\t\t\t\t\tplacement: 'bottom',\n\t\t\t\t\t\toffset: 8,\n\t\t\t\t } ),\n\t\t\t...receivedPopoverProps,\n\t\t} ),\n\t\t[ isRenderedInSidebar, receivedPopoverProps ]\n\t);\n\n\treturn (\n\t\t<Dropdown\n\t\t\tcontentClassName=\"components-color-palette__custom-color-dropdown-content\"\n\t\t\tpopoverProps={ popoverProps }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\nfunction UnforwardedColorPalette(\n\tprops: WordPressComponentProps< ColorPaletteProps, 'div' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\tasButtons,\n\t\tloop,\n\t\tclearable = true,\n\t\tcolors = [],\n\t\tdisableCustomColors = false,\n\t\tenableAlpha = false,\n\t\tonChange,\n\t\tvalue,\n\t\t__experimentalIsRenderedInSidebar = false,\n\t\theadingLevel = 2,\n\t\t'aria-label': ariaLabel,\n\t\t'aria-labelledby': ariaLabelledby,\n\t\t...additionalProps\n\t} = props;\n\tconst [ normalizedColorValue, setNormalizedColorValue ] = useState( value );\n\n\tconst clearColor = useCallback( () => onChange( undefined ), [ onChange ] );\n\n\tconst customColorPaletteCallbackRef = useCallback(\n\t\t( node: HTMLElement | null ) => {\n\t\t\tsetNormalizedColorValue( normalizeColorValue( value, node ) );\n\t\t},\n\t\t[ value ]\n\t);\n\n\tconst hasMultipleColorOrigins = isMultiplePaletteArray( colors );\n\tconst buttonLabelName = useMemo(\n\t\t() =>\n\t\t\textractColorNameFromCurrentValue(\n\t\t\t\tvalue,\n\t\t\t\tcolors,\n\t\t\t\thasMultipleColorOrigins\n\t\t\t),\n\t\t[ value, colors, hasMultipleColorOrigins ]\n\t);\n\n\tconst renderCustomColorPicker = () => (\n\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t<ColorPicker\n\t\t\t\tcolor={ normalizedColorValue }\n\t\t\t\tonChange={ ( color ) => onChange( color ) }\n\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t/>\n\t\t</DropdownContentWrapper>\n\t);\n\tconst isHex = value?.startsWith( '#' );\n\n\t// Leave hex values as-is. Remove the `var()` wrapper from CSS vars.\n\tconst displayValue = value?.replace( /^var\\((.+)\\)$/, '$1' );\n\tconst customColorAccessibleLabel = !! displayValue\n\t\t? sprintf(\n\t\t\t\t// translators: %1$s: The name of the color e.g: \"vivid red\". %2$s: The color's hex code e.g: \"#f00\".\n\t\t\t\t__(\n\t\t\t\t\t'Custom color picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".'\n\t\t\t\t),\n\t\t\t\tbuttonLabelName,\n\t\t\t\tdisplayValue\n\t\t )\n\t\t: __( 'Custom color picker.' );\n\n\tconst paletteCommonProps = {\n\t\tclearColor,\n\t\tonChange,\n\t\tvalue,\n\t};\n\n\tconst actions = !! clearable && (\n\t\t<CircularOptionPicker.ButtonAction onClick={ clearColor }>\n\t\t\t{ __( 'Clear' ) }\n\t\t</CircularOptionPicker.ButtonAction>\n\t);\n\n\tlet metaProps:\n\t\t| { asButtons: false; loop?: boolean; 'aria-label': string }\n\t\t| { asButtons: false; loop?: boolean; 'aria-labelledby': string }\n\t\t| { asButtons: true };\n\n\tif ( asButtons ) {\n\t\tmetaProps = { asButtons: true };\n\t} else {\n\t\tconst _metaProps: { asButtons: false; loop?: boolean } = {\n\t\t\tasButtons: false,\n\t\t\tloop,\n\t\t};\n\n\t\tif ( ariaLabel ) {\n\t\t\tmetaProps = { ..._metaProps, 'aria-label': ariaLabel };\n\t\t} else if ( ariaLabelledby ) {\n\t\t\tmetaProps = {\n\t\t\t\t..._metaProps,\n\t\t\t\t'aria-labelledby': ariaLabelledby,\n\t\t\t};\n\t\t} else {\n\t\t\tmetaProps = {\n\t\t\t\t..._metaProps,\n\t\t\t\t'aria-label': __( 'Custom color picker.' ),\n\t\t\t};\n\t\t}\n\t}\n\n\treturn (\n\t\t<VStack spacing={ 3 } ref={ forwardedRef } { ...additionalProps }>\n\t\t\t{ ! disableCustomColors && (\n\t\t\t\t<CustomColorPickerDropdown\n\t\t\t\t\tisRenderedInSidebar={ __experimentalIsRenderedInSidebar }\n\t\t\t\t\trenderContent={ renderCustomColorPicker }\n\t\t\t\t\trenderToggle={ ( { isOpen, onToggle } ) => (\n\t\t\t\t\t\t<VStack\n\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color-wrapper\"\n\t\t\t\t\t\t\tspacing={ 0 }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\tref={ customColorPaletteCallbackRef }\n\t\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color-button\"\n\t\t\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\t\t\taria-label={ customColorAccessibleLabel }\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\tbackground: value,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<VStack\n\t\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color-text-wrapper\"\n\t\t\t\t\t\t\t\tspacing={ 0.5 }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Truncate className=\"components-color-palette__custom-color-name\">\n\t\t\t\t\t\t\t\t\t{ value\n\t\t\t\t\t\t\t\t\t\t? buttonLabelName\n\t\t\t\t\t\t\t\t\t\t: __( 'No color selected' ) }\n\t\t\t\t\t\t\t\t</Truncate>\n\t\t\t\t\t\t\t\t{ /*\n\t\t\t\t\t\t\t\tThis `Truncate` is always rendered, even if\n\t\t\t\t\t\t\t\tthere is no `displayValue`, to ensure the layout\n\t\t\t\t\t\t\t\tdoes not shift\n\t\t\t\t\t\t\t\t*/ }\n\t\t\t\t\t\t\t\t<Truncate\n\t\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t\t'components-color-palette__custom-color-value',\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t'components-color-palette__custom-color-value--is-hex':\n\t\t\t\t\t\t\t\t\t\t\t\tisHex,\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ displayValue }\n\t\t\t\t\t\t\t\t</Truncate>\n\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t</VStack>\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ ( colors.length > 0 || actions ) && (\n\t\t\t\t<CircularOptionPicker\n\t\t\t\t\t{ ...metaProps }\n\t\t\t\t\tactions={ actions }\n\t\t\t\t\toptions={\n\t\t\t\t\t\thasMultipleColorOrigins ? (\n\t\t\t\t\t\t\t<MultiplePalettes\n\t\t\t\t\t\t\t\t{ ...paletteCommonProps }\n\t\t\t\t\t\t\t\theadingLevel={ headingLevel }\n\t\t\t\t\t\t\t\tcolors={ colors as PaletteObject[] }\n\t\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<SinglePalette\n\t\t\t\t\t\t\t\t{ ...paletteCommonProps }\n\t\t\t\t\t\t\t\tcolors={ colors as ColorObject[] }\n\t\t\t\t\t\t\t\tvalue={ value }\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</VStack>\n\t);\n}\n\n/**\n * Allows the user to pick a color from a list of pre-defined color entries.\n *\n * ```jsx\n * import { ColorPalette } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyColorPalette = () => {\n * const [ color, setColor ] = useState ( '#f00' )\n * const colors = [\n * { name: 'red', color: '#f00' },\n * { name: 'white', color: '#fff' },\n * { name: 'blue', color: '#00f' },\n * ];\n * return (\n * <ColorPalette\n * colors={ colors }\n * value={ color }\n * onChange={ ( color ) => setColor( color ) }\n * />\n * );\n * } );\n * ```\n */\nexport const ColorPalette = forwardRef( UnforwardedColorPalette );\n\nexport default ColorPalette;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["_colord","require","_names","_interopRequireDefault","_a11y","_clsx","_compose","_i18n","_element","_dropdown","_colorPicker","_circularOptionPicker","_vStack","_truncate","_styles","_dropdownContentWrapper","_utils","_jsxRuntime","extend","namesPlugin","a11yPlugin","SinglePalette","className","clearColor","colors","onChange","value","additionalProps","colorOptions","useMemo","map","color","name","index","colordColor","colord","isSelected","jsx","default","Option","selectedIconProps","fill","contrast","tooltipText","sprintf","__","style","backgroundColor","onClick","OptionGroup","options","MultiplePalettes","headingLevel","instanceId","useInstanceId","length","VStack","spacing","children","colorPalette","id","jsxs","ColorHeading","level","newColor","CustomColorPickerDropdown","isRenderedInSidebar","popoverProps","receivedPopoverProps","props","shift","resize","placement","offset","contentClassName","UnforwardedColorPalette","forwardedRef","asButtons","loop","clearable","disableCustomColors","enableAlpha","__experimentalIsRenderedInSidebar","ariaLabel","ariaLabelledby","normalizedColorValue","setNormalizedColorValue","useState","useCallback","undefined","customColorPaletteCallbackRef","node","normalizeColorValue","hasMultipleColorOrigins","isMultiplePaletteArray","buttonLabelName","extractColorNameFromCurrentValue","renderCustomColorPicker","paddingSize","ColorPicker","isHex","startsWith","displayValue","replace","customColorAccessibleLabel","paletteCommonProps","actions","ButtonAction","metaProps","_metaProps","ref","renderContent","renderToggle","isOpen","onToggle","background","type","Truncate","clsx","ColorPalette","exports","forwardRef","_default"],"sources":["@wordpress/components/src/color-palette/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\nimport { colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\nimport a11yPlugin from 'colord/plugins/a11y';\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback, useMemo, useState, forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Dropdown from '../dropdown';\nimport { ColorPicker } from '../color-picker';\nimport CircularOptionPicker from '../circular-option-picker';\nimport { VStack } from '../v-stack';\nimport { Truncate } from '../truncate';\nimport { ColorHeading } from './styles';\nimport DropdownContentWrapper from '../dropdown/dropdown-content-wrapper';\nimport type {\n\tColorObject,\n\tColorPaletteProps,\n\tCustomColorPickerDropdownProps,\n\tMultiplePalettesProps,\n\tPaletteObject,\n\tSinglePaletteProps,\n} from './types';\nimport type { WordPressComponentProps } from '../context';\nimport type { DropdownProps } from '../dropdown/types';\nimport {\n\textractColorNameFromCurrentValue,\n\tisMultiplePaletteArray,\n\tnormalizeColorValue,\n} from './utils';\n\nextend( [ namesPlugin, a11yPlugin ] );\n\nfunction SinglePalette( {\n\tclassName,\n\tclearColor,\n\tcolors,\n\tonChange,\n\tvalue,\n\t...additionalProps\n}: SinglePaletteProps ) {\n\tconst colorOptions = useMemo( () => {\n\t\treturn colors.map( ( { color, name }, index ) => {\n\t\t\tconst colordColor = colord( color );\n\t\t\tconst isSelected = value === color;\n\n\t\t\treturn (\n\t\t\t\t<CircularOptionPicker.Option\n\t\t\t\t\tkey={ `${ color }-${ index }` }\n\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\tselectedIconProps={\n\t\t\t\t\t\tisSelected\n\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\tfill:\n\t\t\t\t\t\t\t\t\t\tcolordColor.contrast() >\n\t\t\t\t\t\t\t\t\t\tcolordColor.contrast( '#000' )\n\t\t\t\t\t\t\t\t\t\t\t? '#fff'\n\t\t\t\t\t\t\t\t\t\t\t: '#000',\n\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t: {}\n\t\t\t\t\t}\n\t\t\t\t\ttooltipText={\n\t\t\t\t\t\tname ||\n\t\t\t\t\t\t// translators: %s: color hex code e.g: \"#f00\".\n\t\t\t\t\t\tsprintf( __( 'Color code: %s' ), color )\n\t\t\t\t\t}\n\t\t\t\t\tstyle={ { backgroundColor: color, color } }\n\t\t\t\t\tonClick={\n\t\t\t\t\t\tisSelected ? clearColor : () => onChange( color, index )\n\t\t\t\t\t}\n\t\t\t\t\taria-label={\n\t\t\t\t\t\tname\n\t\t\t\t\t\t\t? // translators: %s: The name of the color e.g: \"vivid red\".\n\t\t\t\t\t\t\t sprintf( __( 'Color: %s' ), name )\n\t\t\t\t\t\t\t: // translators: %s: color hex code e.g: \"#f00\".\n\t\t\t\t\t\t\t sprintf( __( 'Color code: %s' ), color )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t);\n\t\t} );\n\t}, [ colors, value, onChange, clearColor ] );\n\n\treturn (\n\t\t<CircularOptionPicker.OptionGroup\n\t\t\tclassName={ className }\n\t\t\toptions={ colorOptions }\n\t\t\t{ ...additionalProps }\n\t\t/>\n\t);\n}\n\nfunction MultiplePalettes( {\n\tclassName,\n\tclearColor,\n\tcolors,\n\tonChange,\n\tvalue,\n\theadingLevel,\n}: MultiplePalettesProps ) {\n\tconst instanceId = useInstanceId( MultiplePalettes, 'color-palette' );\n\n\tif ( colors.length === 0 ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<VStack spacing={ 3 } className={ className }>\n\t\t\t{ colors.map( ( { name, colors: colorPalette }, index ) => {\n\t\t\t\tconst id = `${ instanceId }-${ index }`;\n\t\t\t\treturn (\n\t\t\t\t\t<VStack spacing={ 2 } key={ index }>\n\t\t\t\t\t\t<ColorHeading id={ id } level={ headingLevel }>\n\t\t\t\t\t\t\t{ name }\n\t\t\t\t\t\t</ColorHeading>\n\t\t\t\t\t\t<SinglePalette\n\t\t\t\t\t\t\tclearColor={ clearColor }\n\t\t\t\t\t\t\tcolors={ colorPalette }\n\t\t\t\t\t\t\tonChange={ ( newColor ) =>\n\t\t\t\t\t\t\t\tonChange( newColor, index )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\taria-labelledby={ id }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</VStack>\n\t);\n}\n\nexport function CustomColorPickerDropdown( {\n\tisRenderedInSidebar,\n\tpopoverProps: receivedPopoverProps,\n\t...props\n}: CustomColorPickerDropdownProps ) {\n\tconst popoverProps = useMemo< DropdownProps[ 'popoverProps' ] >(\n\t\t() => ( {\n\t\t\tshift: true,\n\t\t\t// Disabling resize as it would otherwise cause the popover to show\n\t\t\t// scrollbars while dragging the color picker's handle close to the\n\t\t\t// popover edge.\n\t\t\tresize: false,\n\t\t\t...( isRenderedInSidebar\n\t\t\t\t? {\n\t\t\t\t\t\t// When in the sidebar: open to the left (stacking),\n\t\t\t\t\t\t// leaving the same gap as the parent popover.\n\t\t\t\t\t\tplacement: 'left-start',\n\t\t\t\t\t\toffset: 34,\n\t\t\t\t }\n\t\t\t\t: {\n\t\t\t\t\t\t// Default behavior: open below the anchor\n\t\t\t\t\t\tplacement: 'bottom',\n\t\t\t\t\t\toffset: 8,\n\t\t\t\t } ),\n\t\t\t...receivedPopoverProps,\n\t\t} ),\n\t\t[ isRenderedInSidebar, receivedPopoverProps ]\n\t);\n\n\treturn (\n\t\t<Dropdown\n\t\t\tcontentClassName=\"components-color-palette__custom-color-dropdown-content\"\n\t\t\tpopoverProps={ popoverProps }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\nfunction UnforwardedColorPalette(\n\tprops: WordPressComponentProps< ColorPaletteProps, 'div' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\tasButtons,\n\t\tloop,\n\t\tclearable = true,\n\t\tcolors = [],\n\t\tdisableCustomColors = false,\n\t\tenableAlpha = false,\n\t\tonChange,\n\t\tvalue,\n\t\t__experimentalIsRenderedInSidebar = false,\n\t\theadingLevel = 2,\n\t\t'aria-label': ariaLabel,\n\t\t'aria-labelledby': ariaLabelledby,\n\t\t...additionalProps\n\t} = props;\n\tconst [ normalizedColorValue, setNormalizedColorValue ] = useState( value );\n\n\tconst clearColor = useCallback( () => onChange( undefined ), [ onChange ] );\n\n\tconst customColorPaletteCallbackRef = useCallback(\n\t\t( node: HTMLElement | null ) => {\n\t\t\tsetNormalizedColorValue( normalizeColorValue( value, node ) );\n\t\t},\n\t\t[ value ]\n\t);\n\n\tconst hasMultipleColorOrigins = isMultiplePaletteArray( colors );\n\tconst buttonLabelName = useMemo(\n\t\t() =>\n\t\t\textractColorNameFromCurrentValue(\n\t\t\t\tvalue,\n\t\t\t\tcolors,\n\t\t\t\thasMultipleColorOrigins\n\t\t\t),\n\t\t[ value, colors, hasMultipleColorOrigins ]\n\t);\n\n\tconst renderCustomColorPicker = () => (\n\t\t<DropdownContentWrapper paddingSize=\"none\">\n\t\t\t<ColorPicker\n\t\t\t\tcolor={ normalizedColorValue }\n\t\t\t\tonChange={ ( color ) => onChange( color ) }\n\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t/>\n\t\t</DropdownContentWrapper>\n\t);\n\tconst isHex = value?.startsWith( '#' );\n\n\t// Leave hex values as-is. Remove the `var()` wrapper from CSS vars.\n\tconst displayValue = value?.replace( /^var\\((.+)\\)$/, '$1' );\n\tconst customColorAccessibleLabel = !! displayValue\n\t\t? sprintf(\n\t\t\t\t// translators: 1: The name of the color e.g: \"vivid red\". 2: The color's hex code e.g: \"#f00\".\n\t\t\t\t__(\n\t\t\t\t\t'Custom color picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".'\n\t\t\t\t),\n\t\t\t\tbuttonLabelName,\n\t\t\t\tdisplayValue\n\t\t )\n\t\t: __( 'Custom color picker.' );\n\n\tconst paletteCommonProps = {\n\t\tclearColor,\n\t\tonChange,\n\t\tvalue,\n\t};\n\n\tconst actions = !! clearable && (\n\t\t<CircularOptionPicker.ButtonAction onClick={ clearColor }>\n\t\t\t{ __( 'Clear' ) }\n\t\t</CircularOptionPicker.ButtonAction>\n\t);\n\n\tlet metaProps:\n\t\t| { asButtons: false; loop?: boolean; 'aria-label': string }\n\t\t| { asButtons: false; loop?: boolean; 'aria-labelledby': string }\n\t\t| { asButtons: true };\n\n\tif ( asButtons ) {\n\t\tmetaProps = { asButtons: true };\n\t} else {\n\t\tconst _metaProps: { asButtons: false; loop?: boolean } = {\n\t\t\tasButtons: false,\n\t\t\tloop,\n\t\t};\n\n\t\tif ( ariaLabel ) {\n\t\t\tmetaProps = { ..._metaProps, 'aria-label': ariaLabel };\n\t\t} else if ( ariaLabelledby ) {\n\t\t\tmetaProps = {\n\t\t\t\t..._metaProps,\n\t\t\t\t'aria-labelledby': ariaLabelledby,\n\t\t\t};\n\t\t} else {\n\t\t\tmetaProps = {\n\t\t\t\t..._metaProps,\n\t\t\t\t'aria-label': __( 'Custom color picker.' ),\n\t\t\t};\n\t\t}\n\t}\n\n\treturn (\n\t\t<VStack spacing={ 3 } ref={ forwardedRef } { ...additionalProps }>\n\t\t\t{ ! disableCustomColors && (\n\t\t\t\t<CustomColorPickerDropdown\n\t\t\t\t\tisRenderedInSidebar={ __experimentalIsRenderedInSidebar }\n\t\t\t\t\trenderContent={ renderCustomColorPicker }\n\t\t\t\t\trenderToggle={ ( { isOpen, onToggle } ) => (\n\t\t\t\t\t\t<VStack\n\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color-wrapper\"\n\t\t\t\t\t\t\tspacing={ 0 }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\tref={ customColorPaletteCallbackRef }\n\t\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color-button\"\n\t\t\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\t\t\taria-label={ customColorAccessibleLabel }\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\tbackground: value,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<VStack\n\t\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color-text-wrapper\"\n\t\t\t\t\t\t\t\tspacing={ 0.5 }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Truncate className=\"components-color-palette__custom-color-name\">\n\t\t\t\t\t\t\t\t\t{ value\n\t\t\t\t\t\t\t\t\t\t? buttonLabelName\n\t\t\t\t\t\t\t\t\t\t: __( 'No color selected' ) }\n\t\t\t\t\t\t\t\t</Truncate>\n\t\t\t\t\t\t\t\t{ /*\n\t\t\t\t\t\t\t\tThis `Truncate` is always rendered, even if\n\t\t\t\t\t\t\t\tthere is no `displayValue`, to ensure the layout\n\t\t\t\t\t\t\t\tdoes not shift\n\t\t\t\t\t\t\t\t*/ }\n\t\t\t\t\t\t\t\t<Truncate\n\t\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t\t'components-color-palette__custom-color-value',\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t'components-color-palette__custom-color-value--is-hex':\n\t\t\t\t\t\t\t\t\t\t\t\tisHex,\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ displayValue }\n\t\t\t\t\t\t\t\t</Truncate>\n\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t</VStack>\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ ( colors.length > 0 || actions ) && (\n\t\t\t\t<CircularOptionPicker\n\t\t\t\t\t{ ...metaProps }\n\t\t\t\t\tactions={ actions }\n\t\t\t\t\toptions={\n\t\t\t\t\t\thasMultipleColorOrigins ? (\n\t\t\t\t\t\t\t<MultiplePalettes\n\t\t\t\t\t\t\t\t{ ...paletteCommonProps }\n\t\t\t\t\t\t\t\theadingLevel={ headingLevel }\n\t\t\t\t\t\t\t\tcolors={ colors as PaletteObject[] }\n\t\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<SinglePalette\n\t\t\t\t\t\t\t\t{ ...paletteCommonProps }\n\t\t\t\t\t\t\t\tcolors={ colors as ColorObject[] }\n\t\t\t\t\t\t\t\tvalue={ value }\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</VStack>\n\t);\n}\n\n/**\n * Allows the user to pick a color from a list of pre-defined color entries.\n *\n * ```jsx\n * import { ColorPalette } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyColorPalette = () => {\n * const [ color, setColor ] = useState ( '#f00' )\n * const colors = [\n * { name: 'red', color: '#f00' },\n * { name: 'white', color: '#fff' },\n * { name: 'blue', color: '#00f' },\n * ];\n * return (\n * <ColorPalette\n * colors={ colors }\n * value={ color }\n * onChange={ ( color ) => setColor( color ) }\n * />\n * );\n * } );\n * ```\n */\nexport const ColorPalette = forwardRef( UnforwardedColorPalette );\n\nexport default ColorPalette;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -43,7 +43,7 @@ function ControlPointButton({
|
|
|
43
43
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
|
|
44
44
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_button.default, {
|
|
45
45
|
"aria-label": (0, _i18n.sprintf)(
|
|
46
|
-
// translators:
|
|
46
|
+
// translators: 1: gradient position e.g: 70. 2: gradient color code e.g: rgb(52,121,151).
|
|
47
47
|
(0, _i18n.__)('Gradient control point at position %1$s%% with color code %2$s.'), position, color),
|
|
48
48
|
"aria-describedby": descriptionId,
|
|
49
49
|
"aria-haspopup": "true",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_clsx","_interopRequireDefault","require","_colord","_compose","_element","_i18n","_icons","_button","_hStack","_colorPicker","_visuallyHidden","_colorPalette","_utils","_constants","_dropdownContentWrapper","_jsxRuntime","ControlPointButton","isOpen","position","color","additionalProps","instanceId","useInstanceId","descriptionId","jsxs","Fragment","children","jsx","default","sprintf","__","className","clsx","VisuallyHidden","id","GradientColorPickerDropdown","isRenderedInSidebar","props","popoverProps","useMemo","placement","offset","resize","mergedClassName","CustomColorPickerDropdown","ControlPoints","disableRemove","disableAlpha","gradientPickerDomRef","ignoreMarkerPosition","value","controlPoints","onChange","onStartControlPointChange","onStopControlPointChange","__experimentalIsRenderedInSidebar","controlPointMoveStateRef","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","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 clsx from 'clsx';\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={ clsx(\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 = clsx(\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 controlPointMoveStateRef = useRef< ControlPointMoveState >();\n\n\tconst onMouseMove = ( event: MouseEvent ) => {\n\t\tif (\n\t\t\tcontrolPointMoveStateRef.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\tcontrolPointMoveStateRef.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\tcontrolPointMoveStateRef.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\tcontrolPointMoveStateRef.current &&\n\t\t\tcontrolPointMoveStateRef.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\tcontrolPointMoveStateRef.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\tcontrolPointMoveStateRef.current &&\n\t\t\t\t\t\t\t\t\t\t\tcontrolPointMoveStateRef.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\tcontrolPointMoveStateRef.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":[]}
|
|
1
|
+
{"version":3,"names":["_clsx","_interopRequireDefault","require","_colord","_compose","_element","_i18n","_icons","_button","_hStack","_colorPicker","_visuallyHidden","_colorPalette","_utils","_constants","_dropdownContentWrapper","_jsxRuntime","ControlPointButton","isOpen","position","color","additionalProps","instanceId","useInstanceId","descriptionId","jsxs","Fragment","children","jsx","default","sprintf","__","className","clsx","VisuallyHidden","id","GradientColorPickerDropdown","isRenderedInSidebar","props","popoverProps","useMemo","placement","offset","resize","mergedClassName","CustomColorPickerDropdown","ControlPoints","disableRemove","disableAlpha","gradientPickerDomRef","ignoreMarkerPosition","value","controlPoints","onChange","onStartControlPointChange","onStopControlPointChange","__experimentalIsRenderedInSidebar","controlPointMoveStateRef","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","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 clsx from 'clsx';\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: gradient position e.g: 70. 2: 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={ clsx(\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 = clsx(\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 controlPointMoveStateRef = useRef< ControlPointMoveState >();\n\n\tconst onMouseMove = ( event: MouseEvent ) => {\n\t\tif (\n\t\t\tcontrolPointMoveStateRef.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\tcontrolPointMoveStateRef.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\tcontrolPointMoveStateRef.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\tcontrolPointMoveStateRef.current &&\n\t\t\tcontrolPointMoveStateRef.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\tcontrolPointMoveStateRef.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\tcontrolPointMoveStateRef.current &&\n\t\t\t\t\t\t\t\t\t\t\tcontrolPointMoveStateRef.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\tcontrolPointMoveStateRef.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":[]}
|
|
@@ -73,20 +73,20 @@ function FontSizePicker({
|
|
|
73
73
|
availableUnits: ['px', 'em', 'rem', 'vw', 'vh']
|
|
74
74
|
});
|
|
75
75
|
const accessibilityLabel = (0, _i18n.sprintf)(
|
|
76
|
-
// translators: %
|
|
77
|
-
(0, _i18n.__)('Font Size, %
|
|
76
|
+
// translators: %s: Font size name e.g. Small
|
|
77
|
+
(0, _i18n.__)('Font Size, %s'), selectedOption.name);
|
|
78
78
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_bottomSheet.default.SubSheet, {
|
|
79
79
|
navigationButton: /*#__PURE__*/(0, _jsxRuntime.jsx)(_bottomSheet.default.Cell, {
|
|
80
80
|
label: label,
|
|
81
81
|
separatorType: "none",
|
|
82
82
|
value: selectedValue ? (0, _i18n.sprintf)(
|
|
83
|
-
// translators:
|
|
84
|
-
(0, _i18n.
|
|
83
|
+
// translators: 1: Select control font size name e.g. Small. 2: Select control font size e.g. 12px
|
|
84
|
+
(0, _i18n._x)('%1$s (%2$s)', 'font size'), selectedOption.name, selectedPxValue) : (0, _i18n.__)('Default'),
|
|
85
85
|
onPress: openSubSheet,
|
|
86
86
|
accessibilityRole: "button",
|
|
87
87
|
accessibilityLabel: accessibilityLabel,
|
|
88
88
|
accessibilityHint: (0, _i18n.sprintf)(
|
|
89
|
-
// translators: %s: Select control button label e.g.
|
|
89
|
+
// translators: %s: Select control button label e.g. "Button width"
|
|
90
90
|
(0, _i18n.__)('Navigates to select %s'), selectedOption.name),
|
|
91
91
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.Icon, {
|
|
92
92
|
icon: _icons.chevronRight
|
|
@@ -130,7 +130,7 @@ function FontSizePicker({
|
|
|
130
130
|
leftAlign: true,
|
|
131
131
|
accessibilityRole: "button",
|
|
132
132
|
accessibilityLabel: item.sizePx === selectedValue ? (0, _i18n.sprintf)(
|
|
133
|
-
// translators: %s:
|
|
133
|
+
// translators: %s: The selected option.
|
|
134
134
|
(0, _i18n.__)('Selected: %s'), item.name) : item.name,
|
|
135
135
|
accessibilityHint: (0, _i18n.__)('Double tap to select font size'),
|
|
136
136
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_reactNative","require","_native","_element","_icons","_i18n","_getPxFromCssUnit","_interopRequireDefault","_unitControl","_interopRequireWildcard","_style","_bottomSheet","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","DEFAULT_FONT_SIZE","FontSizePicker","fontSizes","disableCustomFontSizes","onChange","value","selectedValue","_fontSizes$find","showSubSheet","setShowSubSheet","useState","navigation","useNavigation","height","width","useWindowDimensions","cssUnitOptions","fontSize","selectedPxValue","getPxFromCssUnit","onChangeValue","goBack","selectedOption","find","option","sizePx","name","openSubSheet","navigate","BottomSheet","SubSheet","screenName","label","__","units","useCustomUnits","availableUnits","accessibilityLabel","sprintf","jsx","navigationButton","Cell","separatorType","onPress","accessibilityRole","accessibilityHint","children","Icon","icon","chevronRight","showSheet","jsxs","Fragment","NavBar","BackButton","Heading","View","style","styles","customActionButton","undefined","leftAlign","check","map","item","index","parseFloat","subLabel","min","max","step","nextSize","_default","exports"],"sources":["@wordpress/components/src/font-size-picker/index.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { View, useWindowDimensions } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { useNavigation } from '@react-navigation/native';\nimport { useState } from '@wordpress/element';\nimport { Icon, chevronRight, check } from '@wordpress/icons';\nimport { __, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { default as getPxFromCssUnit } from '../mobile/utils/get-px-from-css-unit';\nimport { default as UnitControl, useCustomUnits } from '../unit-control';\nimport styles from './style.scss';\nimport BottomSheet from '../mobile/bottom-sheet';\n\nconst DEFAULT_FONT_SIZE = 16;\n\nfunction FontSizePicker( {\n\tfontSizes = [],\n\tdisableCustomFontSizes = false,\n\tonChange,\n\tvalue: selectedValue,\n} ) {\n\tconst [ showSubSheet, setShowSubSheet ] = useState( false );\n\tconst navigation = useNavigation();\n\n\tconst { height, width } = useWindowDimensions();\n\tconst cssUnitOptions = { height, width, fontSize: DEFAULT_FONT_SIZE };\n\t// We need to always convert to px units because the selected value\n\t// could be coming from the web where it could be stored as a different unit.\n\tconst selectedPxValue = getPxFromCssUnit( selectedValue, cssUnitOptions );\n\n\tconst onChangeValue = ( value ) => {\n\t\treturn () => {\n\t\t\tgoBack();\n\t\t\tonChange( value );\n\t\t};\n\t};\n\n\tconst selectedOption = fontSizes.find(\n\t\t( option ) => option.sizePx === selectedPxValue\n\t) ?? { name: 'Custom' };\n\n\tconst goBack = () => {\n\t\tsetShowSubSheet( false );\n\t\tnavigation.goBack();\n\t};\n\n\tconst openSubSheet = () => {\n\t\tnavigation.navigate( BottomSheet.SubSheet.screenName );\n\t\tsetShowSubSheet( true );\n\t};\n\tconst label = __( 'Font Size' );\n\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: [ 'px', 'em', 'rem', 'vw', 'vh' ],\n\t} );\n\n\tconst accessibilityLabel = sprintf(\n\t\t// translators: %1$s: Font size name e.g. Small\n\t\t__( 'Font Size, %1$s' ),\n\t\tselectedOption.name\n\t);\n\n\treturn (\n\t\t<BottomSheet.SubSheet\n\t\t\tnavigationButton={\n\t\t\t\t<BottomSheet.Cell\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tseparatorType=\"none\"\n\t\t\t\t\tvalue={\n\t\t\t\t\t\tselectedValue\n\t\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t\t// translators: %1$s: Select control font size name e.g. Small, %2$s: Select control font size e.g. 12px\n\t\t\t\t\t\t\t\t\t__( '%1$s (%2$s)' ),\n\t\t\t\t\t\t\t\t\tselectedOption.name,\n\t\t\t\t\t\t\t\t\tselectedPxValue\n\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t: __( 'Default' )\n\t\t\t\t\t}\n\t\t\t\t\tonPress={ openSubSheet }\n\t\t\t\t\taccessibilityRole=\"button\"\n\t\t\t\t\taccessibilityLabel={ accessibilityLabel }\n\t\t\t\t\taccessibilityHint={ sprintf(\n\t\t\t\t\t\t// translators: %s: Select control button label e.g. Small\n\t\t\t\t\t\t__( 'Navigates to select %s' ),\n\t\t\t\t\t\tselectedOption.name\n\t\t\t\t\t) }\n\t\t\t\t>\n\t\t\t\t\t<Icon icon={ chevronRight }></Icon>\n\t\t\t\t</BottomSheet.Cell>\n\t\t\t}\n\t\t\tshowSheet={ showSubSheet }\n\t\t>\n\t\t\t<>\n\t\t\t\t<BottomSheet.NavBar>\n\t\t\t\t\t<BottomSheet.NavBar.BackButton onPress={ goBack } />\n\t\t\t\t\t<BottomSheet.NavBar.Heading>\n\t\t\t\t\t\t{ label }\n\t\t\t\t\t</BottomSheet.NavBar.Heading>\n\t\t\t\t</BottomSheet.NavBar>\n\t\t\t\t<View style={ styles[ 'components-font-size-picker' ] }>\n\t\t\t\t\t<BottomSheet.Cell\n\t\t\t\t\t\tcustomActionButton\n\t\t\t\t\t\tseparatorType=\"none\"\n\t\t\t\t\t\tlabel={ __( 'Default' ) }\n\t\t\t\t\t\tonPress={ onChangeValue( undefined ) }\n\t\t\t\t\t\tleftAlign\n\t\t\t\t\t\tkey=\"default\"\n\t\t\t\t\t\taccessibilityRole=\"button\"\n\t\t\t\t\t\taccessibilityLabel={ __( 'Selected: Default' ) }\n\t\t\t\t\t\taccessibilityHint={ __(\n\t\t\t\t\t\t\t'Double tap to select default font size'\n\t\t\t\t\t\t) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<View>\n\t\t\t\t\t\t\t{ selectedValue === undefined && (\n\t\t\t\t\t\t\t\t<Icon icon={ check }></Icon>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</View>\n\t\t\t\t\t</BottomSheet.Cell>\n\t\t\t\t\t{ fontSizes.map( ( item, index ) => {\n\t\t\t\t\t\t// Only display a choice that we can currenly select.\n\t\t\t\t\t\tif ( ! parseFloat( item.sizePx ) ) {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<BottomSheet.Cell\n\t\t\t\t\t\t\t\tcustomActionButton\n\t\t\t\t\t\t\t\tseparatorType=\"none\"\n\t\t\t\t\t\t\t\tlabel={ item.name }\n\t\t\t\t\t\t\t\tsubLabel={ item.sizePx }\n\t\t\t\t\t\t\t\tonPress={ onChangeValue( item.sizePx ) }\n\t\t\t\t\t\t\t\tleftAlign\n\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\taccessibilityRole=\"button\"\n\t\t\t\t\t\t\t\taccessibilityLabel={\n\t\t\t\t\t\t\t\t\titem.sizePx === selectedValue\n\t\t\t\t\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t\t\t\t\t// translators: %s: Select font size option value e.g: \"Selected: Large\".\n\t\t\t\t\t\t\t\t\t\t\t\t__( 'Selected: %s' ),\n\t\t\t\t\t\t\t\t\t\t\t\titem.name\n\t\t\t\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t\t\t\t: item.name\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\taccessibilityHint={ __(\n\t\t\t\t\t\t\t\t\t'Double tap to select font size'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<View>\n\t\t\t\t\t\t\t\t\t{ item.sizePx === selectedPxValue && (\n\t\t\t\t\t\t\t\t\t\t<Icon icon={ check }></Icon>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</View>\n\t\t\t\t\t\t\t</BottomSheet.Cell>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t\t{ ! disableCustomFontSizes && (\n\t\t\t\t\t\t<UnitControl\n\t\t\t\t\t\t\tlabel={ __( 'Custom' ) }\n\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\tmax={ 200 }\n\t\t\t\t\t\t\tstep={ 1 }\n\t\t\t\t\t\t\tvalue={ selectedValue }\n\t\t\t\t\t\t\tonChange={ ( nextSize ) => {\n\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t0 === parseFloat( nextSize ) ||\n\t\t\t\t\t\t\t\t\t! nextSize\n\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\tonChange( undefined );\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tonChange( nextSize );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</View>\n\t\t\t</>\n\t\t</BottomSheet.SubSheet>\n\t);\n}\n\nexport default FontSizePicker;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["_reactNative","require","_native","_element","_icons","_i18n","_getPxFromCssUnit","_interopRequireDefault","_unitControl","_interopRequireWildcard","_style","_bottomSheet","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","DEFAULT_FONT_SIZE","FontSizePicker","fontSizes","disableCustomFontSizes","onChange","value","selectedValue","_fontSizes$find","showSubSheet","setShowSubSheet","useState","navigation","useNavigation","height","width","useWindowDimensions","cssUnitOptions","fontSize","selectedPxValue","getPxFromCssUnit","onChangeValue","goBack","selectedOption","find","option","sizePx","name","openSubSheet","navigate","BottomSheet","SubSheet","screenName","label","__","units","useCustomUnits","availableUnits","accessibilityLabel","sprintf","jsx","navigationButton","Cell","separatorType","_x","onPress","accessibilityRole","accessibilityHint","children","Icon","icon","chevronRight","showSheet","jsxs","Fragment","NavBar","BackButton","Heading","View","style","styles","customActionButton","undefined","leftAlign","check","map","item","index","parseFloat","subLabel","min","max","step","nextSize","_default","exports"],"sources":["@wordpress/components/src/font-size-picker/index.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { View, useWindowDimensions } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { useNavigation } from '@react-navigation/native';\nimport { useState } from '@wordpress/element';\nimport { Icon, chevronRight, check } from '@wordpress/icons';\nimport { __, _x, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { default as getPxFromCssUnit } from '../mobile/utils/get-px-from-css-unit';\nimport { default as UnitControl, useCustomUnits } from '../unit-control';\nimport styles from './style.scss';\nimport BottomSheet from '../mobile/bottom-sheet';\n\nconst DEFAULT_FONT_SIZE = 16;\n\nfunction FontSizePicker( {\n\tfontSizes = [],\n\tdisableCustomFontSizes = false,\n\tonChange,\n\tvalue: selectedValue,\n} ) {\n\tconst [ showSubSheet, setShowSubSheet ] = useState( false );\n\tconst navigation = useNavigation();\n\n\tconst { height, width } = useWindowDimensions();\n\tconst cssUnitOptions = { height, width, fontSize: DEFAULT_FONT_SIZE };\n\t// We need to always convert to px units because the selected value\n\t// could be coming from the web where it could be stored as a different unit.\n\tconst selectedPxValue = getPxFromCssUnit( selectedValue, cssUnitOptions );\n\n\tconst onChangeValue = ( value ) => {\n\t\treturn () => {\n\t\t\tgoBack();\n\t\t\tonChange( value );\n\t\t};\n\t};\n\n\tconst selectedOption = fontSizes.find(\n\t\t( option ) => option.sizePx === selectedPxValue\n\t) ?? { name: 'Custom' };\n\n\tconst goBack = () => {\n\t\tsetShowSubSheet( false );\n\t\tnavigation.goBack();\n\t};\n\n\tconst openSubSheet = () => {\n\t\tnavigation.navigate( BottomSheet.SubSheet.screenName );\n\t\tsetShowSubSheet( true );\n\t};\n\tconst label = __( 'Font Size' );\n\n\tconst units = useCustomUnits( {\n\t\tavailableUnits: [ 'px', 'em', 'rem', 'vw', 'vh' ],\n\t} );\n\n\tconst accessibilityLabel = sprintf(\n\t\t// translators: %s: Font size name e.g. Small\n\t\t__( 'Font Size, %s' ),\n\t\tselectedOption.name\n\t);\n\n\treturn (\n\t\t<BottomSheet.SubSheet\n\t\t\tnavigationButton={\n\t\t\t\t<BottomSheet.Cell\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tseparatorType=\"none\"\n\t\t\t\t\tvalue={\n\t\t\t\t\t\tselectedValue\n\t\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t\t// translators: 1: Select control font size name e.g. Small. 2: Select control font size e.g. 12px\n\t\t\t\t\t\t\t\t\t_x( '%1$s (%2$s)', 'font size' ),\n\t\t\t\t\t\t\t\t\tselectedOption.name,\n\t\t\t\t\t\t\t\t\tselectedPxValue\n\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t: __( 'Default' )\n\t\t\t\t\t}\n\t\t\t\t\tonPress={ openSubSheet }\n\t\t\t\t\taccessibilityRole=\"button\"\n\t\t\t\t\taccessibilityLabel={ accessibilityLabel }\n\t\t\t\t\taccessibilityHint={ sprintf(\n\t\t\t\t\t\t// translators: %s: Select control button label e.g. \"Button width\"\n\t\t\t\t\t\t__( 'Navigates to select %s' ),\n\t\t\t\t\t\tselectedOption.name\n\t\t\t\t\t) }\n\t\t\t\t>\n\t\t\t\t\t<Icon icon={ chevronRight }></Icon>\n\t\t\t\t</BottomSheet.Cell>\n\t\t\t}\n\t\t\tshowSheet={ showSubSheet }\n\t\t>\n\t\t\t<>\n\t\t\t\t<BottomSheet.NavBar>\n\t\t\t\t\t<BottomSheet.NavBar.BackButton onPress={ goBack } />\n\t\t\t\t\t<BottomSheet.NavBar.Heading>\n\t\t\t\t\t\t{ label }\n\t\t\t\t\t</BottomSheet.NavBar.Heading>\n\t\t\t\t</BottomSheet.NavBar>\n\t\t\t\t<View style={ styles[ 'components-font-size-picker' ] }>\n\t\t\t\t\t<BottomSheet.Cell\n\t\t\t\t\t\tcustomActionButton\n\t\t\t\t\t\tseparatorType=\"none\"\n\t\t\t\t\t\tlabel={ __( 'Default' ) }\n\t\t\t\t\t\tonPress={ onChangeValue( undefined ) }\n\t\t\t\t\t\tleftAlign\n\t\t\t\t\t\tkey=\"default\"\n\t\t\t\t\t\taccessibilityRole=\"button\"\n\t\t\t\t\t\taccessibilityLabel={ __( 'Selected: Default' ) }\n\t\t\t\t\t\taccessibilityHint={ __(\n\t\t\t\t\t\t\t'Double tap to select default font size'\n\t\t\t\t\t\t) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<View>\n\t\t\t\t\t\t\t{ selectedValue === undefined && (\n\t\t\t\t\t\t\t\t<Icon icon={ check }></Icon>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</View>\n\t\t\t\t\t</BottomSheet.Cell>\n\t\t\t\t\t{ fontSizes.map( ( item, index ) => {\n\t\t\t\t\t\t// Only display a choice that we can currenly select.\n\t\t\t\t\t\tif ( ! parseFloat( item.sizePx ) ) {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<BottomSheet.Cell\n\t\t\t\t\t\t\t\tcustomActionButton\n\t\t\t\t\t\t\t\tseparatorType=\"none\"\n\t\t\t\t\t\t\t\tlabel={ item.name }\n\t\t\t\t\t\t\t\tsubLabel={ item.sizePx }\n\t\t\t\t\t\t\t\tonPress={ onChangeValue( item.sizePx ) }\n\t\t\t\t\t\t\t\tleftAlign\n\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\taccessibilityRole=\"button\"\n\t\t\t\t\t\t\t\taccessibilityLabel={\n\t\t\t\t\t\t\t\t\titem.sizePx === selectedValue\n\t\t\t\t\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t\t\t\t\t// translators: %s: The selected option.\n\t\t\t\t\t\t\t\t\t\t\t\t__( 'Selected: %s' ),\n\t\t\t\t\t\t\t\t\t\t\t\titem.name\n\t\t\t\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t\t\t\t: item.name\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\taccessibilityHint={ __(\n\t\t\t\t\t\t\t\t\t'Double tap to select font size'\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<View>\n\t\t\t\t\t\t\t\t\t{ item.sizePx === selectedPxValue && (\n\t\t\t\t\t\t\t\t\t\t<Icon icon={ check }></Icon>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</View>\n\t\t\t\t\t\t\t</BottomSheet.Cell>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t\t{ ! disableCustomFontSizes && (\n\t\t\t\t\t\t<UnitControl\n\t\t\t\t\t\t\tlabel={ __( 'Custom' ) }\n\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\tmax={ 200 }\n\t\t\t\t\t\t\tstep={ 1 }\n\t\t\t\t\t\t\tvalue={ selectedValue }\n\t\t\t\t\t\t\tonChange={ ( nextSize ) => {\n\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t0 === parseFloat( nextSize ) ||\n\t\t\t\t\t\t\t\t\t! nextSize\n\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\tonChange( undefined );\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tonChange( nextSize );\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tunits={ units }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</View>\n\t\t\t</>\n\t\t</BottomSheet.SubSheet>\n\t);\n}\n\nexport default FontSizePicker;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -187,7 +187,7 @@ class BottomSheetRangeCell extends _element.Component {
|
|
|
187
187
|
return openUnitPicker ? (0, _i18n.__)('double-tap to change unit') : '';
|
|
188
188
|
};
|
|
189
189
|
const getAccessibilityLabel = () => {
|
|
190
|
-
return (0, _i18n.sprintf)( /* translators: accessibility text. Inform about current value.
|
|
190
|
+
return (0, _i18n.sprintf)( /* translators: accessibility text. Inform about current value. 1: Control label. 2: setting label (example: width). 3: Current value. 4: value measurement unit (example: pixels) */
|
|
191
191
|
(0, _i18n.__)('%1$s. %2$s is %3$s %4$s.'), cellProps.label, settingLabel, (0, _utils.toFixed)(value, decimalNum), unitLabel);
|
|
192
192
|
};
|
|
193
193
|
const containerStyle = [_rangeCell.default.container, isIOS ? _rangeCell.default.containerIOS : _rangeCell.default.containerAndroid];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_reactNative","require","_slider","_interopRequireDefault","_i18n","_element","_compose","_cell","_lockIcon","_rangeCell","_rangeTextInput","_utils","_jsxRuntime","isIOS","Platform","OS","BottomSheetRangeCell","Component","constructor","props","onSliderChange","bind","onCompleteSliderChange","onTextInputChange","a11yIncrementValue","a11yDecrementValue","a11yUpdateValue","value","defaultValue","minimumValue","initialValue","Number","state","inputValue","sliderValue","componentWillUnmount","clearTimeout","timeoutAnnounceValue","decimalNum","onChange","toFixed","setState","nextValue","onComplete","step","maximumValue","newValue","undefined","announceValue","label","unitLabel","setTimeout","AccessibilityInfo","announceForAccessibility","render","disabled","preferredColorScheme","minimumTrackTintColor","maximumTrackTintColor","thumbTintColor","preview","cellContainerStyle","shouldDisplayTextInput","settingLabel","openUnitPicker","children","cellProps","getAccessibilityHint","__","getAccessibilityLabel","sprintf","containerStyle","styles","container","containerIOS","containerAndroid","jsx","View","accessible","accessibilityRole","accessibilityActions","name","onAccessibilityAction","event","nativeEvent","actionName","accessibilityLabel","accessibilityHint","importantForAccessibility","default","cellContainerStyles","cellRowContainerStyle","leftAlign","editable","activeOpacity","valueStyle","showLockIcon","jsxs","style","testID","onValueChange","onSlidingComplete","ref","slider","sliderRef","sliderIOS","sliderAndroid","min","max","_default","exports","withPreferredColorScheme"],"sources":["@wordpress/components/src/mobile/bottom-sheet/range-cell.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { Platform, AccessibilityInfo, View } from 'react-native';\nimport Slider from '@react-native-community/slider';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { Component } from '@wordpress/element';\nimport { withPreferredColorScheme } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Cell from './cell';\nimport LockIcon from './lock-icon';\nimport styles from './range-cell.scss';\nimport RangeTextInput from './range-text-input';\nimport { toFixed } from '../utils';\n\nconst isIOS = Platform.OS === 'ios';\n\nclass BottomSheetRangeCell extends Component {\n\tconstructor( props ) {\n\t\tsuper( props );\n\t\tthis.onSliderChange = this.onSliderChange.bind( this );\n\t\tthis.onCompleteSliderChange = this.onCompleteSliderChange.bind( this );\n\t\tthis.onTextInputChange = this.onTextInputChange.bind( this );\n\t\tthis.a11yIncrementValue = this.a11yIncrementValue.bind( this );\n\t\tthis.a11yDecrementValue = this.a11yDecrementValue.bind( this );\n\t\tthis.a11yUpdateValue = this.a11yUpdateValue.bind( this );\n\n\t\tconst { value, defaultValue, minimumValue } = props;\n\t\tconst initialValue = Number( value || defaultValue || minimumValue );\n\n\t\tthis.state = {\n\t\t\tinputValue: initialValue,\n\t\t\tsliderValue: initialValue,\n\t\t};\n\t}\n\n\tcomponentWillUnmount() {\n\t\tclearTimeout( this.timeoutAnnounceValue );\n\t}\n\n\tonSliderChange( initialValue ) {\n\t\tconst { decimalNum, onChange } = this.props;\n\t\tinitialValue = toFixed( initialValue, decimalNum );\n\t\tthis.setState( { inputValue: initialValue } );\n\t\tonChange( initialValue );\n\t}\n\n\tonTextInputChange( nextValue ) {\n\t\tconst { onChange, onComplete } = this.props;\n\t\tthis.setState( {\n\t\t\tsliderValue: nextValue,\n\t\t} );\n\t\tonChange( nextValue );\n\t\tif ( onComplete ) {\n\t\t\tonComplete( nextValue );\n\t\t}\n\t}\n\n\tonCompleteSliderChange( nextValue ) {\n\t\tconst { decimalNum, onComplete } = this.props;\n\t\tnextValue = toFixed( nextValue, decimalNum );\n\t\tif ( onComplete ) {\n\t\t\tonComplete( nextValue );\n\t\t}\n\t}\n\n\t/*\n\t * Only used with screenreaders like VoiceOver and TalkBack. Increments the\n\t * value of this setting programmatically.\n\t */\n\ta11yIncrementValue() {\n\t\tconst { step = 5, maximumValue, decimalNum } = this.props;\n\t\tconst { inputValue } = this.state;\n\n\t\tconst newValue = toFixed( inputValue + step, decimalNum );\n\n\t\tif ( newValue <= maximumValue || maximumValue === undefined ) {\n\t\t\tthis.a11yUpdateValue( newValue );\n\t\t}\n\t}\n\n\t/*\n\t * Only used with screenreaders like VoiceOver and TalkBack. Decrements the\n\t * value of this setting programmatically.\n\t */\n\ta11yDecrementValue() {\n\t\tconst { step = 5, minimumValue, decimalNum } = this.props;\n\t\tconst { sliderValue } = this.state;\n\n\t\tconst newValue = toFixed( sliderValue - step, decimalNum );\n\n\t\tif ( newValue >= minimumValue ) {\n\t\t\tthis.a11yUpdateValue( newValue );\n\t\t}\n\t}\n\n\ta11yUpdateValue( newValue ) {\n\t\tconst { onChange, onComplete } = this.props;\n\t\tthis.setState( {\n\t\t\tsliderValue: newValue,\n\t\t\tinputValue: newValue,\n\t\t} );\n\t\tonChange( newValue );\n\t\tif ( onComplete ) {\n\t\t\tonComplete( newValue );\n\t\t}\n\t\tthis.announceValue( newValue );\n\t}\n\n\t/*\n\t * Only used with screenreaders like VoiceOver and TalkBack.\n\t */\n\tannounceValue( value ) {\n\t\tconst { label, unitLabel = '' } = this.props;\n\n\t\tif ( isIOS ) {\n\t\t\t// On Android it triggers the accessibilityLabel with the value change, but\n\t\t\t// on iOS we need to do this manually.\n\t\t\tclearTimeout( this.timeoutAnnounceValue );\n\t\t\tthis.timeoutAnnounceValue = setTimeout( () => {\n\t\t\t\tAccessibilityInfo.announceForAccessibility(\n\t\t\t\t\t`${ value } ${ unitLabel }, ${ label }`\n\t\t\t\t);\n\t\t\t}, 300 );\n\t\t}\n\t}\n\n\trender() {\n\t\tconst {\n\t\t\tvalue,\n\t\t\tdefaultValue,\n\t\t\tminimumValue = 0,\n\t\t\tmaximumValue = 10,\n\t\t\tdisabled,\n\t\t\tstep = 1,\n\t\t\tpreferredColorScheme,\n\t\t\tminimumTrackTintColor = preferredColorScheme === 'light'\n\t\t\t\t? '#00669b'\n\t\t\t\t: '#5198d9',\n\t\t\tmaximumTrackTintColor = isIOS ? '#e9eff3' : '#909090',\n\t\t\tthumbTintColor = ! isIOS && '#00669b',\n\t\t\tpreview,\n\t\t\tcellContainerStyle,\n\t\t\tshouldDisplayTextInput = true,\n\t\t\tunitLabel = '',\n\t\t\tsettingLabel = 'Value',\n\t\t\topenUnitPicker,\n\t\t\tchildren,\n\t\t\tdecimalNum,\n\t\t\t...cellProps\n\t\t} = this.props;\n\n\t\tconst { inputValue, sliderValue } = this.state;\n\n\t\tconst getAccessibilityHint = () => {\n\t\t\treturn openUnitPicker ? __( 'double-tap to change unit' ) : '';\n\t\t};\n\n\t\tconst getAccessibilityLabel = () => {\n\t\t\treturn sprintf(\n\t\t\t\t/* translators: accessibility text. Inform about current value. %1$s: Control label %2$s: setting label (example: width), %3$s: Current value. %4$s: value measurement unit (example: pixels) */\n\t\t\t\t__( '%1$s. %2$s is %3$s %4$s.' ),\n\t\t\t\tcellProps.label,\n\t\t\t\tsettingLabel,\n\t\t\t\ttoFixed( value, decimalNum ),\n\t\t\t\tunitLabel\n\t\t\t);\n\t\t};\n\n\t\tconst containerStyle = [\n\t\t\tstyles.container,\n\t\t\tisIOS ? styles.containerIOS : styles.containerAndroid,\n\t\t];\n\n\t\treturn (\n\t\t\t<View\n\t\t\t\taccessible\n\t\t\t\taccessibilityRole=\"adjustable\"\n\t\t\t\taccessibilityActions={ [\n\t\t\t\t\t{ name: 'increment' },\n\t\t\t\t\t{ name: 'decrement' },\n\t\t\t\t\t{ name: 'activate' },\n\t\t\t\t] }\n\t\t\t\tonAccessibilityAction={ ( event ) => {\n\t\t\t\t\tswitch ( event.nativeEvent.actionName ) {\n\t\t\t\t\t\tcase 'increment':\n\t\t\t\t\t\t\tthis.a11yIncrementValue();\n\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\tcase 'decrement':\n\t\t\t\t\t\t\tthis.a11yDecrementValue();\n\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\tcase 'activate':\n\t\t\t\t\t\t\tif ( openUnitPicker ) {\n\t\t\t\t\t\t\t\topenUnitPicker();\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t\taccessibilityLabel={ getAccessibilityLabel() }\n\t\t\t\taccessibilityHint={ getAccessibilityHint() }\n\t\t\t>\n\t\t\t\t<View importantForAccessibility=\"no-hide-descendants\">\n\t\t\t\t\t<Cell\n\t\t\t\t\t\t{ ...cellProps }\n\t\t\t\t\t\tcellContainerStyle={ [\n\t\t\t\t\t\t\tstyles.cellContainerStyles,\n\t\t\t\t\t\t\tcellContainerStyle,\n\t\t\t\t\t\t] }\n\t\t\t\t\t\tcellRowContainerStyle={ containerStyle }\n\t\t\t\t\t\tleftAlign\n\t\t\t\t\t\teditable={ false }\n\t\t\t\t\t\tactiveOpacity={ 1 }\n\t\t\t\t\t\taccessible={ false }\n\t\t\t\t\t\tvalueStyle={ styles.valueStyle }\n\t\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t\t\tshowLockIcon={ false }\n\t\t\t\t\t>\n\t\t\t\t\t\t<View style={ containerStyle }>\n\t\t\t\t\t\t\t{ preview }\n\t\t\t\t\t\t\t<Slider\n\t\t\t\t\t\t\t\ttestID={ `Slider ${ cellProps.label }` }\n\t\t\t\t\t\t\t\tvalue={ sliderValue }\n\t\t\t\t\t\t\t\tdefaultValue={ defaultValue }\n\t\t\t\t\t\t\t\tdisabled={ disabled && ! isIOS }\n\t\t\t\t\t\t\t\tstep={ step }\n\t\t\t\t\t\t\t\tminimumValue={ minimumValue }\n\t\t\t\t\t\t\t\tmaximumValue={ maximumValue }\n\t\t\t\t\t\t\t\tminimumTrackTintColor={ minimumTrackTintColor }\n\t\t\t\t\t\t\t\tmaximumTrackTintColor={ maximumTrackTintColor }\n\t\t\t\t\t\t\t\tthumbTintColor={ thumbTintColor }\n\t\t\t\t\t\t\t\tonValueChange={ this.onSliderChange }\n\t\t\t\t\t\t\t\tonSlidingComplete={\n\t\t\t\t\t\t\t\t\tthis.onCompleteSliderChange\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tref={ ( slider ) => {\n\t\t\t\t\t\t\t\t\tthis.sliderRef = slider;\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t\tisIOS\n\t\t\t\t\t\t\t\t\t\t? styles.sliderIOS\n\t\t\t\t\t\t\t\t\t\t: styles.sliderAndroid\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{ shouldDisplayTextInput && (\n\t\t\t\t\t\t\t\t<RangeTextInput\n\t\t\t\t\t\t\t\t\tlabel={ cellProps.label }\n\t\t\t\t\t\t\t\t\tonChange={ this.onTextInputChange }\n\t\t\t\t\t\t\t\t\tdefaultValue={ `${ inputValue }` }\n\t\t\t\t\t\t\t\t\tvalue={ inputValue }\n\t\t\t\t\t\t\t\t\tmin={ minimumValue }\n\t\t\t\t\t\t\t\t\tmax={ maximumValue }\n\t\t\t\t\t\t\t\t\tstep={ step }\n\t\t\t\t\t\t\t\t\tdecimalNum={ decimalNum }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t\t\t</RangeTextInput>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t{ disabled && <LockIcon /> }\n\t\t\t\t\t\t</View>\n\t\t\t\t\t</Cell>\n\t\t\t\t</View>\n\t\t\t</View>\n\t\t);\n\t}\n}\n\nexport default withPreferredColorScheme( BottomSheetRangeCell );\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["_reactNative","require","_slider","_interopRequireDefault","_i18n","_element","_compose","_cell","_lockIcon","_rangeCell","_rangeTextInput","_utils","_jsxRuntime","isIOS","Platform","OS","BottomSheetRangeCell","Component","constructor","props","onSliderChange","bind","onCompleteSliderChange","onTextInputChange","a11yIncrementValue","a11yDecrementValue","a11yUpdateValue","value","defaultValue","minimumValue","initialValue","Number","state","inputValue","sliderValue","componentWillUnmount","clearTimeout","timeoutAnnounceValue","decimalNum","onChange","toFixed","setState","nextValue","onComplete","step","maximumValue","newValue","undefined","announceValue","label","unitLabel","setTimeout","AccessibilityInfo","announceForAccessibility","render","disabled","preferredColorScheme","minimumTrackTintColor","maximumTrackTintColor","thumbTintColor","preview","cellContainerStyle","shouldDisplayTextInput","settingLabel","openUnitPicker","children","cellProps","getAccessibilityHint","__","getAccessibilityLabel","sprintf","containerStyle","styles","container","containerIOS","containerAndroid","jsx","View","accessible","accessibilityRole","accessibilityActions","name","onAccessibilityAction","event","nativeEvent","actionName","accessibilityLabel","accessibilityHint","importantForAccessibility","default","cellContainerStyles","cellRowContainerStyle","leftAlign","editable","activeOpacity","valueStyle","showLockIcon","jsxs","style","testID","onValueChange","onSlidingComplete","ref","slider","sliderRef","sliderIOS","sliderAndroid","min","max","_default","exports","withPreferredColorScheme"],"sources":["@wordpress/components/src/mobile/bottom-sheet/range-cell.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { Platform, AccessibilityInfo, View } from 'react-native';\nimport Slider from '@react-native-community/slider';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { Component } from '@wordpress/element';\nimport { withPreferredColorScheme } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Cell from './cell';\nimport LockIcon from './lock-icon';\nimport styles from './range-cell.scss';\nimport RangeTextInput from './range-text-input';\nimport { toFixed } from '../utils';\n\nconst isIOS = Platform.OS === 'ios';\n\nclass BottomSheetRangeCell extends Component {\n\tconstructor( props ) {\n\t\tsuper( props );\n\t\tthis.onSliderChange = this.onSliderChange.bind( this );\n\t\tthis.onCompleteSliderChange = this.onCompleteSliderChange.bind( this );\n\t\tthis.onTextInputChange = this.onTextInputChange.bind( this );\n\t\tthis.a11yIncrementValue = this.a11yIncrementValue.bind( this );\n\t\tthis.a11yDecrementValue = this.a11yDecrementValue.bind( this );\n\t\tthis.a11yUpdateValue = this.a11yUpdateValue.bind( this );\n\n\t\tconst { value, defaultValue, minimumValue } = props;\n\t\tconst initialValue = Number( value || defaultValue || minimumValue );\n\n\t\tthis.state = {\n\t\t\tinputValue: initialValue,\n\t\t\tsliderValue: initialValue,\n\t\t};\n\t}\n\n\tcomponentWillUnmount() {\n\t\tclearTimeout( this.timeoutAnnounceValue );\n\t}\n\n\tonSliderChange( initialValue ) {\n\t\tconst { decimalNum, onChange } = this.props;\n\t\tinitialValue = toFixed( initialValue, decimalNum );\n\t\tthis.setState( { inputValue: initialValue } );\n\t\tonChange( initialValue );\n\t}\n\n\tonTextInputChange( nextValue ) {\n\t\tconst { onChange, onComplete } = this.props;\n\t\tthis.setState( {\n\t\t\tsliderValue: nextValue,\n\t\t} );\n\t\tonChange( nextValue );\n\t\tif ( onComplete ) {\n\t\t\tonComplete( nextValue );\n\t\t}\n\t}\n\n\tonCompleteSliderChange( nextValue ) {\n\t\tconst { decimalNum, onComplete } = this.props;\n\t\tnextValue = toFixed( nextValue, decimalNum );\n\t\tif ( onComplete ) {\n\t\t\tonComplete( nextValue );\n\t\t}\n\t}\n\n\t/*\n\t * Only used with screenreaders like VoiceOver and TalkBack. Increments the\n\t * value of this setting programmatically.\n\t */\n\ta11yIncrementValue() {\n\t\tconst { step = 5, maximumValue, decimalNum } = this.props;\n\t\tconst { inputValue } = this.state;\n\n\t\tconst newValue = toFixed( inputValue + step, decimalNum );\n\n\t\tif ( newValue <= maximumValue || maximumValue === undefined ) {\n\t\t\tthis.a11yUpdateValue( newValue );\n\t\t}\n\t}\n\n\t/*\n\t * Only used with screenreaders like VoiceOver and TalkBack. Decrements the\n\t * value of this setting programmatically.\n\t */\n\ta11yDecrementValue() {\n\t\tconst { step = 5, minimumValue, decimalNum } = this.props;\n\t\tconst { sliderValue } = this.state;\n\n\t\tconst newValue = toFixed( sliderValue - step, decimalNum );\n\n\t\tif ( newValue >= minimumValue ) {\n\t\t\tthis.a11yUpdateValue( newValue );\n\t\t}\n\t}\n\n\ta11yUpdateValue( newValue ) {\n\t\tconst { onChange, onComplete } = this.props;\n\t\tthis.setState( {\n\t\t\tsliderValue: newValue,\n\t\t\tinputValue: newValue,\n\t\t} );\n\t\tonChange( newValue );\n\t\tif ( onComplete ) {\n\t\t\tonComplete( newValue );\n\t\t}\n\t\tthis.announceValue( newValue );\n\t}\n\n\t/*\n\t * Only used with screenreaders like VoiceOver and TalkBack.\n\t */\n\tannounceValue( value ) {\n\t\tconst { label, unitLabel = '' } = this.props;\n\n\t\tif ( isIOS ) {\n\t\t\t// On Android it triggers the accessibilityLabel with the value change, but\n\t\t\t// on iOS we need to do this manually.\n\t\t\tclearTimeout( this.timeoutAnnounceValue );\n\t\t\tthis.timeoutAnnounceValue = setTimeout( () => {\n\t\t\t\tAccessibilityInfo.announceForAccessibility(\n\t\t\t\t\t`${ value } ${ unitLabel }, ${ label }`\n\t\t\t\t);\n\t\t\t}, 300 );\n\t\t}\n\t}\n\n\trender() {\n\t\tconst {\n\t\t\tvalue,\n\t\t\tdefaultValue,\n\t\t\tminimumValue = 0,\n\t\t\tmaximumValue = 10,\n\t\t\tdisabled,\n\t\t\tstep = 1,\n\t\t\tpreferredColorScheme,\n\t\t\tminimumTrackTintColor = preferredColorScheme === 'light'\n\t\t\t\t? '#00669b'\n\t\t\t\t: '#5198d9',\n\t\t\tmaximumTrackTintColor = isIOS ? '#e9eff3' : '#909090',\n\t\t\tthumbTintColor = ! isIOS && '#00669b',\n\t\t\tpreview,\n\t\t\tcellContainerStyle,\n\t\t\tshouldDisplayTextInput = true,\n\t\t\tunitLabel = '',\n\t\t\tsettingLabel = 'Value',\n\t\t\topenUnitPicker,\n\t\t\tchildren,\n\t\t\tdecimalNum,\n\t\t\t...cellProps\n\t\t} = this.props;\n\n\t\tconst { inputValue, sliderValue } = this.state;\n\n\t\tconst getAccessibilityHint = () => {\n\t\t\treturn openUnitPicker ? __( 'double-tap to change unit' ) : '';\n\t\t};\n\n\t\tconst getAccessibilityLabel = () => {\n\t\t\treturn sprintf(\n\t\t\t\t/* translators: accessibility text. Inform about current value. 1: Control label. 2: setting label (example: width). 3: Current value. 4: value measurement unit (example: pixels) */\n\t\t\t\t__( '%1$s. %2$s is %3$s %4$s.' ),\n\t\t\t\tcellProps.label,\n\t\t\t\tsettingLabel,\n\t\t\t\ttoFixed( value, decimalNum ),\n\t\t\t\tunitLabel\n\t\t\t);\n\t\t};\n\n\t\tconst containerStyle = [\n\t\t\tstyles.container,\n\t\t\tisIOS ? styles.containerIOS : styles.containerAndroid,\n\t\t];\n\n\t\treturn (\n\t\t\t<View\n\t\t\t\taccessible\n\t\t\t\taccessibilityRole=\"adjustable\"\n\t\t\t\taccessibilityActions={ [\n\t\t\t\t\t{ name: 'increment' },\n\t\t\t\t\t{ name: 'decrement' },\n\t\t\t\t\t{ name: 'activate' },\n\t\t\t\t] }\n\t\t\t\tonAccessibilityAction={ ( event ) => {\n\t\t\t\t\tswitch ( event.nativeEvent.actionName ) {\n\t\t\t\t\t\tcase 'increment':\n\t\t\t\t\t\t\tthis.a11yIncrementValue();\n\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\tcase 'decrement':\n\t\t\t\t\t\t\tthis.a11yDecrementValue();\n\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\tcase 'activate':\n\t\t\t\t\t\t\tif ( openUnitPicker ) {\n\t\t\t\t\t\t\t\topenUnitPicker();\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t\taccessibilityLabel={ getAccessibilityLabel() }\n\t\t\t\taccessibilityHint={ getAccessibilityHint() }\n\t\t\t>\n\t\t\t\t<View importantForAccessibility=\"no-hide-descendants\">\n\t\t\t\t\t<Cell\n\t\t\t\t\t\t{ ...cellProps }\n\t\t\t\t\t\tcellContainerStyle={ [\n\t\t\t\t\t\t\tstyles.cellContainerStyles,\n\t\t\t\t\t\t\tcellContainerStyle,\n\t\t\t\t\t\t] }\n\t\t\t\t\t\tcellRowContainerStyle={ containerStyle }\n\t\t\t\t\t\tleftAlign\n\t\t\t\t\t\teditable={ false }\n\t\t\t\t\t\tactiveOpacity={ 1 }\n\t\t\t\t\t\taccessible={ false }\n\t\t\t\t\t\tvalueStyle={ styles.valueStyle }\n\t\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t\t\tshowLockIcon={ false }\n\t\t\t\t\t>\n\t\t\t\t\t\t<View style={ containerStyle }>\n\t\t\t\t\t\t\t{ preview }\n\t\t\t\t\t\t\t<Slider\n\t\t\t\t\t\t\t\ttestID={ `Slider ${ cellProps.label }` }\n\t\t\t\t\t\t\t\tvalue={ sliderValue }\n\t\t\t\t\t\t\t\tdefaultValue={ defaultValue }\n\t\t\t\t\t\t\t\tdisabled={ disabled && ! isIOS }\n\t\t\t\t\t\t\t\tstep={ step }\n\t\t\t\t\t\t\t\tminimumValue={ minimumValue }\n\t\t\t\t\t\t\t\tmaximumValue={ maximumValue }\n\t\t\t\t\t\t\t\tminimumTrackTintColor={ minimumTrackTintColor }\n\t\t\t\t\t\t\t\tmaximumTrackTintColor={ maximumTrackTintColor }\n\t\t\t\t\t\t\t\tthumbTintColor={ thumbTintColor }\n\t\t\t\t\t\t\t\tonValueChange={ this.onSliderChange }\n\t\t\t\t\t\t\t\tonSlidingComplete={\n\t\t\t\t\t\t\t\t\tthis.onCompleteSliderChange\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tref={ ( slider ) => {\n\t\t\t\t\t\t\t\t\tthis.sliderRef = slider;\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t\tisIOS\n\t\t\t\t\t\t\t\t\t\t? styles.sliderIOS\n\t\t\t\t\t\t\t\t\t\t: styles.sliderAndroid\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{ shouldDisplayTextInput && (\n\t\t\t\t\t\t\t\t<RangeTextInput\n\t\t\t\t\t\t\t\t\tlabel={ cellProps.label }\n\t\t\t\t\t\t\t\t\tonChange={ this.onTextInputChange }\n\t\t\t\t\t\t\t\t\tdefaultValue={ `${ inputValue }` }\n\t\t\t\t\t\t\t\t\tvalue={ inputValue }\n\t\t\t\t\t\t\t\t\tmin={ minimumValue }\n\t\t\t\t\t\t\t\t\tmax={ maximumValue }\n\t\t\t\t\t\t\t\t\tstep={ step }\n\t\t\t\t\t\t\t\t\tdecimalNum={ decimalNum }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t\t\t</RangeTextInput>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t{ disabled && <LockIcon /> }\n\t\t\t\t\t\t</View>\n\t\t\t\t\t</Cell>\n\t\t\t\t</View>\n\t\t\t</View>\n\t\t);\n\t}\n}\n\nexport default withPreferredColorScheme( BottomSheetRangeCell );\n"],"mappings":"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","ignoreList":[]}
|