@strapi/plugin-color-picker 4.15.0 → 4.15.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (13) hide show
  1. package/dist/_chunks/{ColorPickerInput-f3a9f863.mjs → ColorPickerInput-ca8fbb6e.mjs} +19 -19
  2. package/dist/_chunks/{ColorPickerInput-f3a9f863.mjs.map → ColorPickerInput-ca8fbb6e.mjs.map} +1 -1
  3. package/dist/_chunks/{ColorPickerInput-6f0d1bb5.js → ColorPickerInput-cddbeb1a.js} +19 -19
  4. package/dist/_chunks/{ColorPickerInput-6f0d1bb5.js.map → ColorPickerInput-cddbeb1a.js.map} +1 -1
  5. package/dist/_chunks/{index-476267d4.js → index-0b5f614d.js} +6 -7
  6. package/dist/_chunks/index-0b5f614d.js.map +1 -0
  7. package/dist/_chunks/{index-e797ad4f.mjs → index-e7d8fc7b.mjs} +6 -7
  8. package/dist/_chunks/index-e7d8fc7b.mjs.map +1 -0
  9. package/dist/admin/index.js +1 -1
  10. package/dist/admin/index.mjs +1 -1
  11. package/package.json +4 -4
  12. package/dist/_chunks/index-476267d4.js.map +0 -1
  13. package/dist/_chunks/index-e797ad4f.mjs.map +0 -1
package/dist/_chunks/{ColorPickerInput-f3a9f863.mjs → ColorPickerInput-ca8fbb6e.mjs} RENAMED
@@ -5,7 +5,7 @@ import { CarretDown } from "@strapi/icons";
5
5
  import { HexColorPicker } from "react-colorful";
6
6
  import { useIntl } from "react-intl";
7
7
  import styled from "styled-components";
8
- import { g as getTrad } from "./index-e797ad4f.mjs";
8
+ import { g as getTrad } from "./index-e7d8fc7b.mjs";
9
9
  import "@strapi/helper-plugin";
10
10
  function setRef(ref, value) {
11
11
  if (typeof ref === "function") {
@@ -103,7 +103,7 @@ const ColorPickerInput = React.forwardRef(
103
103
  required,
104
104
  children: /* @__PURE__ */ jsxDEV(Flex, { direction: "column", alignItems: "stretch", gap: 1, children: [
105
105
  /* @__PURE__ */ jsxDEV(FieldLabel, { action: labelAction, children: formatMessage(intlLabel) }, void 0, false, {
106
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
106
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
107
107
  lineNumber: 138,
108
108
  columnNumber: 11
109
109
  }, globalThis),
@@ -124,7 +124,7 @@ const ColorPickerInput = React.forwardRef(
124
124
  children: [
125
125
  /* @__PURE__ */ jsxDEV(Flex, { children: [
126
126
  /* @__PURE__ */ jsxDEV(ColorPreview, { color }, void 0, false, {
127
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
127
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
128
128
  lineNumber: 153,
129
129
  columnNumber: 15
130
130
  }, globalThis),
@@ -139,19 +139,19 @@ const ColorPickerInput = React.forwardRef(
139
139
  void 0,
140
140
  false,
141
141
  {
142
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
142
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
143
143
  lineNumber: 154,
144
144
  columnNumber: 15
145
145
  },
146
146
  globalThis
147
147
  )
148
148
  ] }, void 0, true, {
149
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
149
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
150
150
  lineNumber: 152,
151
151
  columnNumber: 13
152
152
  }, globalThis),
153
153
  /* @__PURE__ */ jsxDEV(CarretDown, { "aria-hidden": true }, void 0, false, {
154
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
154
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
155
155
  lineNumber: 162,
156
156
  columnNumber: 13
157
157
  }, globalThis)
@@ -160,7 +160,7 @@ const ColorPickerInput = React.forwardRef(
160
160
  void 0,
161
161
  true,
162
162
  {
163
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
163
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
164
164
  lineNumber: 139,
165
165
  columnNumber: 11
166
166
  },
@@ -183,7 +183,7 @@ const ColorPickerInput = React.forwardRef(
183
183
  void 0,
184
184
  false,
185
185
  {
186
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
186
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
187
187
  lineNumber: 172,
188
188
  columnNumber: 17
189
189
  },
@@ -194,11 +194,11 @@ const ColorPickerInput = React.forwardRef(
194
194
  id: getTrad("color-picker.input.format"),
195
195
  defaultMessage: "HEX"
196
196
  }) }, void 0, false, {
197
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
197
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
198
198
  lineNumber: 180,
199
199
  columnNumber: 21
200
200
  }, globalThis) }, void 0, false, {
201
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
201
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
202
202
  lineNumber: 179,
203
203
  columnNumber: 19
204
204
  }, globalThis),
@@ -218,19 +218,19 @@ const ColorPickerInput = React.forwardRef(
218
218
  void 0,
219
219
  false,
220
220
  {
221
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
221
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
222
222
  lineNumber: 187,
223
223
  columnNumber: 19
224
224
  },
225
225
  globalThis
226
226
  )
227
227
  ] }, void 0, true, {
228
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
228
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
229
229
  lineNumber: 178,
230
230
  columnNumber: 17
231
231
  }, globalThis)
232
232
  ] }, void 0, true, {
233
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
233
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
234
234
  lineNumber: 171,
235
235
  columnNumber: 15
236
236
  }, globalThis)
@@ -238,24 +238,24 @@ const ColorPickerInput = React.forwardRef(
238
238
  void 0,
239
239
  false,
240
240
  {
241
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
241
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
242
242
  lineNumber: 165,
243
243
  columnNumber: 13
244
244
  },
245
245
  globalThis
246
246
  ),
247
247
  /* @__PURE__ */ jsxDEV(FieldHint, {}, void 0, false, {
248
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
248
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
249
249
  lineNumber: 202,
250
250
  columnNumber: 11
251
251
  }, globalThis),
252
252
  /* @__PURE__ */ jsxDEV(FieldError, {}, void 0, false, {
253
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
253
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
254
254
  lineNumber: 203,
255
255
  columnNumber: 11
256
256
  }, globalThis)
257
257
  ] }, void 0, true, {
258
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
258
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
259
259
  lineNumber: 137,
260
260
  columnNumber: 9
261
261
  }, globalThis)
@@ -263,7 +263,7 @@ const ColorPickerInput = React.forwardRef(
263
263
  void 0,
264
264
  false,
265
265
  {
266
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
266
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
267
267
  lineNumber: 129,
268
268
  columnNumber: 7
269
269
  },
@@ -274,4 +274,4 @@ const ColorPickerInput = React.forwardRef(
274
274
  export {
275
275
  ColorPickerInput
276
276
  };
277
- //# sourceMappingURL=ColorPickerInput-f3a9f863.mjs.map
277
+ //# sourceMappingURL=ColorPickerInput-ca8fbb6e.mjs.map
package/dist/_chunks/{ColorPickerInput-f3a9f863.mjs.map → ColorPickerInput-ca8fbb6e.mjs.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"file":"ColorPickerInput-f3a9f863.mjs","sources":["../../admin/src/hooks/useComposeRefs.ts","../../admin/src/components/ColorPickerInput.tsx"],"sourcesContent":["import * as React from 'react';\n\ntype PossibleRef<T> = React.Ref<T> | undefined;\n\n/**\n * Set a given ref to a given value\n * This utility takes care of different types of refs: callback refs and RefObject(s)\n */\nfunction setRef<T>(ref: PossibleRef<T>, value: T) {\n if (typeof ref === 'function') {\n ref(value);\n } else if (ref !== null && ref !== undefined) {\n (ref as React.MutableRefObject<T>).current = value;\n }\n}\n\n/**\n * A utility to compose multiple refs together\n * Accepts callback refs and RefObject(s)\n */\nfunction composeRefs<T>(...refs: PossibleRef<T>[]) {\n return (node: T) => refs.forEach((ref) => setRef(ref, node));\n}\n\n/**\n * Takes multiple React like refs either React.Ref or a callback:\n * (node: T) => void and returns a single function that can be\n * passed to a React component as a ref.\n *\n * Example:\n * ```tsx\n * import { useComposedRefs } from '../hooks/useComposedRefs';\n *\n * const Component = React.forwardRef<HTMLInputElement, ComponentProps>((props, forwardedRef) => {\n * const ref = useComposedRefs(internalRef, forwardedRef);\n *\n * React.useEffect(() => {\n * ref.current.focus();\n * }, [ref]);\n *\n * return <input ref={ref} />\n * }\n * ```\n */\nfunction useComposedRefs<T>(...refs: PossibleRef<T>[]) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n return React.useCallback(composeRefs(...refs), refs);\n}\n\nexport { composeRefs, useComposedRefs };\n","import * as React from 'react';\n\nimport {\n BaseButton,\n Box,\n Field,\n FieldError,\n FieldHint,\n FieldInput,\n FieldLabel,\n Flex,\n FocusTrap,\n Popover,\n Typography,\n} from '@strapi/design-system';\nimport { CarretDown } from '@strapi/icons';\nimport { HexColorPicker } from 'react-colorful';\nimport { useIntl, MessageDescriptor } from 'react-intl';\nimport styled from 'styled-components';\n\nimport { useComposedRefs } from '../hooks/useComposeRefs';\nimport { getTrad } from '../utils/getTrad';\n\nconst ColorPreview = styled.div`\n border-radius: 50%;\n width: 20px;\n height: 20px;\n margin-right: 10px;\n background-color: ${(props) => props.color};\n border: 1px solid rgba(0, 0, 0, 0.1);\n`;\n\nconst ColorPicker = styled(HexColorPicker)`\n && {\n width: 100%;\n aspect-ratio: 1.5;\n }\n\n .react-colorful__pointer {\n width: ${({ theme }) => theme.spaces[3]};\n height: ${({ theme }) => theme.spaces[3]};\n }\n\n .react-colorful__saturation {\n border-radius: ${({ theme }) => theme.spaces[1]};\n border-bottom: none;\n }\n\n .react-colorful__hue {\n border-radius: 10px;\n height: ${({ theme }) => theme.spaces[3]};\n margin-top: ${({ theme }) => theme.spaces[2]};\n }\n`;\n\nconst ColorPickerToggle = styled(BaseButton)`\n display: flex;\n justify-content: space-between;\n align-items: center;\n\n svg {\n width: ${({ theme }) => theme.spaces[2]};\n height: ${({ theme }) => theme.spaces[2]};\n }\n\n svg > path {\n fill: ${({ theme }) => theme.colors.neutral500};\n justify-self: flex-end;\n }\n`;\n\nconst ColorPickerPopover = styled(Popover)`\n padding: ${({ theme }) => theme.spaces[2]};\n min-height: 270px;\n`;\n\n/**\n * TODO: A lot of these props should extend `FieldProps`\n */\ninterface ColorPickerInputProps {\n intlLabel: MessageDescriptor;\n /**\n * TODO: this should be extended from `FieldInputProps['onChange']\n * but that conflicts with it's secondary usage in `HexColorPicker`\n */\n onChange: (event: { target: { name: string; value: string; type: string } }) => void;\n attribute: { type: string; [key: string]: unknown };\n name: string;\n description?: MessageDescriptor;\n disabled?: boolean;\n error?: string;\n labelAction?: React.ReactNode;\n required?: boolean;\n value?: string;\n}\n\nexport const ColorPickerInput = React.forwardRef<HTMLButtonElement, ColorPickerInputProps>(\n (\n {\n attribute,\n description,\n disabled = false,\n error,\n intlLabel,\n labelAction,\n name,\n onChange,\n required = false,\n value = '',\n },\n forwardedRef\n ) => {\n const [showColorPicker, setShowColorPicker] = React.useState(false);\n const colorPickerButtonRef = React.useRef<HTMLButtonElement>(null!);\n const { formatMessage } = useIntl();\n const color = value || '#000000';\n\n const handleBlur: React.FocusEventHandler<HTMLDivElement> = (e) => {\n e.preventDefault();\n\n if (!e.currentTarget.contains(e.relatedTarget)) {\n setShowColorPicker(false);\n }\n };\n\n const composedRefs = useComposedRefs(forwardedRef, colorPickerButtonRef);\n\n return (\n <Field\n name={name}\n id={name}\n // GenericInput calls formatMessage and returns a string for the error\n error={error}\n hint={description && formatMessage(description)}\n required={required}\n >\n <Flex direction=\"column\" alignItems=\"stretch\" gap={1}>\n <FieldLabel action={labelAction}>{formatMessage(intlLabel)}</FieldLabel>\n <ColorPickerToggle\n ref={composedRefs}\n aria-label={formatMessage({\n id: getTrad('color-picker.toggle.aria-label'),\n defaultMessage: 'Color picker toggle',\n })}\n aria-controls=\"color-picker-value\"\n aria-haspopup=\"dialog\"\n aria-expanded={showColorPicker}\n aria-disabled={disabled}\n disabled={disabled}\n onClick={() => setShowColorPicker(!showColorPicker)}\n >\n <Flex>\n <ColorPreview color={color} />\n <Typography\n style={{ textTransform: 'uppercase' }}\n textColor={value ? undefined : 'neutral600'}\n variant=\"omega\"\n >\n {color}\n </Typography>\n </Flex>\n <CarretDown aria-hidden />\n </ColorPickerToggle>\n {showColorPicker && (\n <ColorPickerPopover\n onBlur={handleBlur}\n role=\"dialog\"\n source={colorPickerButtonRef}\n spacing={4}\n >\n <FocusTrap onEscape={() => setShowColorPicker(false)}>\n <ColorPicker\n color={color}\n onChange={(hexValue) =>\n onChange({ target: { name, value: hexValue, type: attribute.type } })\n }\n />\n <Flex paddingTop={3} paddingLeft={4} justifyContent=\"flex-end\">\n <Box paddingRight={2}>\n <Typography variant=\"omega\" as=\"label\" textColor=\"neutral600\">\n {formatMessage({\n id: getTrad('color-picker.input.format'),\n defaultMessage: 'HEX',\n })}\n </Typography>\n </Box>\n <FieldInput\n id=\"color-picker-value\"\n aria-label={formatMessage({\n id: getTrad('color-picker.input.aria-label'),\n defaultMessage: 'Color picker input',\n })}\n style={{ textTransform: 'uppercase' }}\n value={value}\n placeholder=\"#000000\"\n onChange={onChange}\n />\n </Flex>\n </FocusTrap>\n </ColorPickerPopover>\n )}\n <FieldHint />\n <FieldError />\n </Flex>\n </Field>\n );\n }\n);\n"],"names":["this"],"mappings":"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"}
1
+ {"version":3,"file":"ColorPickerInput-ca8fbb6e.mjs","sources":["../../admin/src/hooks/useComposeRefs.ts","../../admin/src/components/ColorPickerInput.tsx"],"sourcesContent":["import * as React from 'react';\n\ntype PossibleRef<T> = React.Ref<T> | undefined;\n\n/**\n * Set a given ref to a given value\n * This utility takes care of different types of refs: callback refs and RefObject(s)\n */\nfunction setRef<T>(ref: PossibleRef<T>, value: T) {\n if (typeof ref === 'function') {\n ref(value);\n } else if (ref !== null && ref !== undefined) {\n (ref as React.MutableRefObject<T>).current = value;\n }\n}\n\n/**\n * A utility to compose multiple refs together\n * Accepts callback refs and RefObject(s)\n */\nfunction composeRefs<T>(...refs: PossibleRef<T>[]) {\n return (node: T) => refs.forEach((ref) => setRef(ref, node));\n}\n\n/**\n * Takes multiple React like refs either React.Ref or a callback:\n * (node: T) => void and returns a single function that can be\n * passed to a React component as a ref.\n *\n * Example:\n * ```tsx\n * import { useComposedRefs } from '../hooks/useComposedRefs';\n *\n * const Component = React.forwardRef<HTMLInputElement, ComponentProps>((props, forwardedRef) => {\n * const ref = useComposedRefs(internalRef, forwardedRef);\n *\n * React.useEffect(() => {\n * ref.current.focus();\n * }, [ref]);\n *\n * return <input ref={ref} />\n * }\n * ```\n */\nfunction useComposedRefs<T>(...refs: PossibleRef<T>[]) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n return React.useCallback(composeRefs(...refs), refs);\n}\n\nexport { composeRefs, useComposedRefs };\n","import * as React from 'react';\n\nimport {\n BaseButton,\n Box,\n Field,\n FieldError,\n FieldHint,\n FieldInput,\n FieldLabel,\n Flex,\n FocusTrap,\n Popover,\n Typography,\n} from '@strapi/design-system';\nimport { CarretDown } from '@strapi/icons';\nimport { HexColorPicker } from 'react-colorful';\nimport { useIntl, MessageDescriptor } from 'react-intl';\nimport styled from 'styled-components';\n\nimport { useComposedRefs } from '../hooks/useComposeRefs';\nimport { getTrad } from '../utils/getTrad';\n\nconst ColorPreview = styled.div`\n border-radius: 50%;\n width: 20px;\n height: 20px;\n margin-right: 10px;\n background-color: ${(props) => props.color};\n border: 1px solid rgba(0, 0, 0, 0.1);\n`;\n\nconst ColorPicker = styled(HexColorPicker)`\n && {\n width: 100%;\n aspect-ratio: 1.5;\n }\n\n .react-colorful__pointer {\n width: ${({ theme }) => theme.spaces[3]};\n height: ${({ theme }) => theme.spaces[3]};\n }\n\n .react-colorful__saturation {\n border-radius: ${({ theme }) => theme.spaces[1]};\n border-bottom: none;\n }\n\n .react-colorful__hue {\n border-radius: 10px;\n height: ${({ theme }) => theme.spaces[3]};\n margin-top: ${({ theme }) => theme.spaces[2]};\n }\n`;\n\nconst ColorPickerToggle = styled(BaseButton)`\n display: flex;\n justify-content: space-between;\n align-items: center;\n\n svg {\n width: ${({ theme }) => theme.spaces[2]};\n height: ${({ theme }) => theme.spaces[2]};\n }\n\n svg > path {\n fill: ${({ theme }) => theme.colors.neutral500};\n justify-self: flex-end;\n }\n`;\n\nconst ColorPickerPopover = styled(Popover)`\n padding: ${({ theme }) => theme.spaces[2]};\n min-height: 270px;\n`;\n\n/**\n * TODO: A lot of these props should extend `FieldProps`\n */\ninterface ColorPickerInputProps {\n intlLabel: MessageDescriptor;\n /**\n * TODO: this should be extended from `FieldInputProps['onChange']\n * but that conflicts with it's secondary usage in `HexColorPicker`\n */\n onChange: (event: { target: { name: string; value: string; type: string } }) => void;\n attribute: { type: string; [key: string]: unknown };\n name: string;\n description?: MessageDescriptor;\n disabled?: boolean;\n error?: string;\n labelAction?: React.ReactNode;\n required?: boolean;\n value?: string;\n}\n\nexport const ColorPickerInput = React.forwardRef<HTMLButtonElement, ColorPickerInputProps>(\n (\n {\n attribute,\n description,\n disabled = false,\n error,\n intlLabel,\n labelAction,\n name,\n onChange,\n required = false,\n value = '',\n },\n forwardedRef\n ) => {\n const [showColorPicker, setShowColorPicker] = React.useState(false);\n const colorPickerButtonRef = React.useRef<HTMLButtonElement>(null!);\n const { formatMessage } = useIntl();\n const color = value || '#000000';\n\n const handleBlur: React.FocusEventHandler<HTMLDivElement> = (e) => {\n e.preventDefault();\n\n if (!e.currentTarget.contains(e.relatedTarget)) {\n setShowColorPicker(false);\n }\n };\n\n const composedRefs = useComposedRefs(forwardedRef, colorPickerButtonRef);\n\n return (\n <Field\n name={name}\n id={name}\n // GenericInput calls formatMessage and returns a string for the error\n error={error}\n hint={description && formatMessage(description)}\n required={required}\n >\n <Flex direction=\"column\" alignItems=\"stretch\" gap={1}>\n <FieldLabel action={labelAction}>{formatMessage(intlLabel)}</FieldLabel>\n <ColorPickerToggle\n ref={composedRefs}\n aria-label={formatMessage({\n id: getTrad('color-picker.toggle.aria-label'),\n defaultMessage: 'Color picker toggle',\n })}\n aria-controls=\"color-picker-value\"\n aria-haspopup=\"dialog\"\n aria-expanded={showColorPicker}\n aria-disabled={disabled}\n disabled={disabled}\n onClick={() => setShowColorPicker(!showColorPicker)}\n >\n <Flex>\n <ColorPreview color={color} />\n <Typography\n style={{ textTransform: 'uppercase' }}\n textColor={value ? undefined : 'neutral600'}\n variant=\"omega\"\n >\n {color}\n </Typography>\n </Flex>\n <CarretDown aria-hidden />\n </ColorPickerToggle>\n {showColorPicker && (\n <ColorPickerPopover\n onBlur={handleBlur}\n role=\"dialog\"\n source={colorPickerButtonRef}\n spacing={4}\n >\n <FocusTrap onEscape={() => setShowColorPicker(false)}>\n <ColorPicker\n color={color}\n onChange={(hexValue) =>\n onChange({ target: { name, value: hexValue, type: attribute.type } })\n }\n />\n <Flex paddingTop={3} paddingLeft={4} justifyContent=\"flex-end\">\n <Box paddingRight={2}>\n <Typography variant=\"omega\" as=\"label\" textColor=\"neutral600\">\n {formatMessage({\n id: getTrad('color-picker.input.format'),\n defaultMessage: 'HEX',\n })}\n </Typography>\n </Box>\n <FieldInput\n id=\"color-picker-value\"\n aria-label={formatMessage({\n id: getTrad('color-picker.input.aria-label'),\n defaultMessage: 'Color picker input',\n })}\n style={{ textTransform: 'uppercase' }}\n value={value}\n placeholder=\"#000000\"\n onChange={onChange}\n />\n </Flex>\n </FocusTrap>\n </ColorPickerPopover>\n )}\n <FieldHint />\n <FieldError />\n </Flex>\n </Field>\n );\n }\n);\n"],"names":["this"],"mappings":"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"}
package/dist/_chunks/{ColorPickerInput-6f0d1bb5.js → ColorPickerInput-cddbeb1a.js} RENAMED
@@ -7,7 +7,7 @@ const icons = require("@strapi/icons");
7
7
  const reactColorful = require("react-colorful");
8
8
  const reactIntl = require("react-intl");
9
9
  const styled = require("styled-components");
10
- const index = require("./index-476267d4.js");
10
+ const index = require("./index-0b5f614d.js");
11
11
  require("@strapi/helper-plugin");
12
12
  const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
13
13
  function _interopNamespace(e) {
@@ -126,7 +126,7 @@ const ColorPickerInput = React__namespace.forwardRef(
126
126
  required,
127
127
  children: /* @__PURE__ */ jsxDevRuntime.jsxDEV(designSystem.Flex, { direction: "column", alignItems: "stretch", gap: 1, children: [
128
128
  /* @__PURE__ */ jsxDevRuntime.jsxDEV(designSystem.FieldLabel, { action: labelAction, children: formatMessage(intlLabel) }, void 0, false, {
129
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
129
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
130
130
  lineNumber: 138,
131
131
  columnNumber: 11
132
132
  }, globalThis),
@@ -147,7 +147,7 @@ const ColorPickerInput = React__namespace.forwardRef(
147
147
  children: [
148
148
  /* @__PURE__ */ jsxDevRuntime.jsxDEV(designSystem.Flex, { children: [
149
149
  /* @__PURE__ */ jsxDevRuntime.jsxDEV(ColorPreview, { color }, void 0, false, {
150
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
150
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
151
151
  lineNumber: 153,
152
152
  columnNumber: 15
153
153
  }, globalThis),
@@ -162,19 +162,19 @@ const ColorPickerInput = React__namespace.forwardRef(
162
162
  void 0,
163
163
  false,
164
164
  {
165
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
165
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
166
166
  lineNumber: 154,
167
167
  columnNumber: 15
168
168
  },
169
169
  globalThis
170
170
  )
171
171
  ] }, void 0, true, {
172
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
172
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
173
173
  lineNumber: 152,
174
174
  columnNumber: 13
175
175
  }, globalThis),
176
176
  /* @__PURE__ */ jsxDevRuntime.jsxDEV(icons.CarretDown, { "aria-hidden": true }, void 0, false, {
177
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
177
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
178
178
  lineNumber: 162,
179
179
  columnNumber: 13
180
180
  }, globalThis)
@@ -183,7 +183,7 @@ const ColorPickerInput = React__namespace.forwardRef(
183
183
  void 0,
184
184
  true,
185
185
  {
186
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
186
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
187
187
  lineNumber: 139,
188
188
  columnNumber: 11
189
189
  },
@@ -206,7 +206,7 @@ const ColorPickerInput = React__namespace.forwardRef(
206
206
  void 0,
207
207
  false,
208
208
  {
209
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
209
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
210
210
  lineNumber: 172,
211
211
  columnNumber: 17
212
212
  },
@@ -217,11 +217,11 @@ const ColorPickerInput = React__namespace.forwardRef(
217
217
  id: index.getTrad("color-picker.input.format"),
218
218
  defaultMessage: "HEX"
219
219
  }) }, void 0, false, {
220
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
220
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
221
221
  lineNumber: 180,
222
222
  columnNumber: 21
223
223
  }, globalThis) }, void 0, false, {
224
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
224
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
225
225
  lineNumber: 179,
226
226
  columnNumber: 19
227
227
  }, globalThis),
@@ -241,19 +241,19 @@ const ColorPickerInput = React__namespace.forwardRef(
241
241
  void 0,
242
242
  false,
243
243
  {
244
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
244
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
245
245
  lineNumber: 187,
246
246
  columnNumber: 19
247
247
  },
248
248
  globalThis
249
249
  )
250
250
  ] }, void 0, true, {
251
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
251
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
252
252
  lineNumber: 178,
253
253
  columnNumber: 17
254
254
  }, globalThis)
255
255
  ] }, void 0, true, {
256
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
256
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
257
257
  lineNumber: 171,
258
258
  columnNumber: 15
259
259
  }, globalThis)
@@ -261,24 +261,24 @@ const ColorPickerInput = React__namespace.forwardRef(
261
261
  void 0,
262
262
  false,
263
263
  {
264
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
264
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
265
265
  lineNumber: 165,
266
266
  columnNumber: 13
267
267
  },
268
268
  globalThis
269
269
  ),
270
270
  /* @__PURE__ */ jsxDevRuntime.jsxDEV(designSystem.FieldHint, {}, void 0, false, {
271
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
271
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
272
272
  lineNumber: 202,
273
273
  columnNumber: 11
274
274
  }, globalThis),
275
275
  /* @__PURE__ */ jsxDevRuntime.jsxDEV(designSystem.FieldError, {}, void 0, false, {
276
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
276
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
277
277
  lineNumber: 203,
278
278
  columnNumber: 11
279
279
  }, globalThis)
280
280
  ] }, void 0, true, {
281
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
281
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
282
282
  lineNumber: 137,
283
283
  columnNumber: 9
284
284
  }, globalThis)
@@ -286,7 +286,7 @@ const ColorPickerInput = React__namespace.forwardRef(
286
286
  void 0,
287
287
  false,
288
288
  {
289
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
289
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerInput.tsx",
290
290
  lineNumber: 129,
291
291
  columnNumber: 7
292
292
  },
@@ -295,4 +295,4 @@ const ColorPickerInput = React__namespace.forwardRef(
295
295
  }
296
296
  );
297
297
  exports.ColorPickerInput = ColorPickerInput;
298
- //# sourceMappingURL=ColorPickerInput-6f0d1bb5.js.map
298
+ //# sourceMappingURL=ColorPickerInput-cddbeb1a.js.map
package/dist/_chunks/{ColorPickerInput-6f0d1bb5.js.map → ColorPickerInput-cddbeb1a.js.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"file":"ColorPickerInput-6f0d1bb5.js","sources":["../../admin/src/hooks/useComposeRefs.ts","../../admin/src/components/ColorPickerInput.tsx"],"sourcesContent":["import * as React from 'react';\n\ntype PossibleRef<T> = React.Ref<T> | undefined;\n\n/**\n * Set a given ref to a given value\n * This utility takes care of different types of refs: callback refs and RefObject(s)\n */\nfunction setRef<T>(ref: PossibleRef<T>, value: T) {\n if (typeof ref === 'function') {\n ref(value);\n } else if (ref !== null && ref !== undefined) {\n (ref as React.MutableRefObject<T>).current = value;\n }\n}\n\n/**\n * A utility to compose multiple refs together\n * Accepts callback refs and RefObject(s)\n */\nfunction composeRefs<T>(...refs: PossibleRef<T>[]) {\n return (node: T) => refs.forEach((ref) => setRef(ref, node));\n}\n\n/**\n * Takes multiple React like refs either React.Ref or a callback:\n * (node: T) => void and returns a single function that can be\n * passed to a React component as a ref.\n *\n * Example:\n * ```tsx\n * import { useComposedRefs } from '../hooks/useComposedRefs';\n *\n * const Component = React.forwardRef<HTMLInputElement, ComponentProps>((props, forwardedRef) => {\n * const ref = useComposedRefs(internalRef, forwardedRef);\n *\n * React.useEffect(() => {\n * ref.current.focus();\n * }, [ref]);\n *\n * return <input ref={ref} />\n * }\n * ```\n */\nfunction useComposedRefs<T>(...refs: PossibleRef<T>[]) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n return React.useCallback(composeRefs(...refs), refs);\n}\n\nexport { composeRefs, useComposedRefs };\n","import * as React from 'react';\n\nimport {\n BaseButton,\n Box,\n Field,\n FieldError,\n FieldHint,\n FieldInput,\n FieldLabel,\n Flex,\n FocusTrap,\n Popover,\n Typography,\n} from '@strapi/design-system';\nimport { CarretDown } from '@strapi/icons';\nimport { HexColorPicker } from 'react-colorful';\nimport { useIntl, MessageDescriptor } from 'react-intl';\nimport styled from 'styled-components';\n\nimport { useComposedRefs } from '../hooks/useComposeRefs';\nimport { getTrad } from '../utils/getTrad';\n\nconst ColorPreview = styled.div`\n border-radius: 50%;\n width: 20px;\n height: 20px;\n margin-right: 10px;\n background-color: ${(props) => props.color};\n border: 1px solid rgba(0, 0, 0, 0.1);\n`;\n\nconst ColorPicker = styled(HexColorPicker)`\n && {\n width: 100%;\n aspect-ratio: 1.5;\n }\n\n .react-colorful__pointer {\n width: ${({ theme }) => theme.spaces[3]};\n height: ${({ theme }) => theme.spaces[3]};\n }\n\n .react-colorful__saturation {\n border-radius: ${({ theme }) => theme.spaces[1]};\n border-bottom: none;\n }\n\n .react-colorful__hue {\n border-radius: 10px;\n height: ${({ theme }) => theme.spaces[3]};\n margin-top: ${({ theme }) => theme.spaces[2]};\n }\n`;\n\nconst ColorPickerToggle = styled(BaseButton)`\n display: flex;\n justify-content: space-between;\n align-items: center;\n\n svg {\n width: ${({ theme }) => theme.spaces[2]};\n height: ${({ theme }) => theme.spaces[2]};\n }\n\n svg > path {\n fill: ${({ theme }) => theme.colors.neutral500};\n justify-self: flex-end;\n }\n`;\n\nconst ColorPickerPopover = styled(Popover)`\n padding: ${({ theme }) => theme.spaces[2]};\n min-height: 270px;\n`;\n\n/**\n * TODO: A lot of these props should extend `FieldProps`\n */\ninterface ColorPickerInputProps {\n intlLabel: MessageDescriptor;\n /**\n * TODO: this should be extended from `FieldInputProps['onChange']\n * but that conflicts with it's secondary usage in `HexColorPicker`\n */\n onChange: (event: { target: { name: string; value: string; type: string } }) => void;\n attribute: { type: string; [key: string]: unknown };\n name: string;\n description?: MessageDescriptor;\n disabled?: boolean;\n error?: string;\n labelAction?: React.ReactNode;\n required?: boolean;\n value?: string;\n}\n\nexport const ColorPickerInput = React.forwardRef<HTMLButtonElement, ColorPickerInputProps>(\n (\n {\n attribute,\n description,\n disabled = false,\n error,\n intlLabel,\n labelAction,\n name,\n onChange,\n required = false,\n value = '',\n },\n forwardedRef\n ) => {\n const [showColorPicker, setShowColorPicker] = React.useState(false);\n const colorPickerButtonRef = React.useRef<HTMLButtonElement>(null!);\n const { formatMessage } = useIntl();\n const color = value || '#000000';\n\n const handleBlur: React.FocusEventHandler<HTMLDivElement> = (e) => {\n e.preventDefault();\n\n if (!e.currentTarget.contains(e.relatedTarget)) {\n setShowColorPicker(false);\n }\n };\n\n const composedRefs = useComposedRefs(forwardedRef, colorPickerButtonRef);\n\n return (\n <Field\n name={name}\n id={name}\n // GenericInput calls formatMessage and returns a string for the error\n error={error}\n hint={description && formatMessage(description)}\n required={required}\n >\n <Flex direction=\"column\" alignItems=\"stretch\" gap={1}>\n <FieldLabel action={labelAction}>{formatMessage(intlLabel)}</FieldLabel>\n <ColorPickerToggle\n ref={composedRefs}\n aria-label={formatMessage({\n id: getTrad('color-picker.toggle.aria-label'),\n defaultMessage: 'Color picker toggle',\n })}\n aria-controls=\"color-picker-value\"\n aria-haspopup=\"dialog\"\n aria-expanded={showColorPicker}\n aria-disabled={disabled}\n disabled={disabled}\n onClick={() => setShowColorPicker(!showColorPicker)}\n >\n <Flex>\n <ColorPreview color={color} />\n <Typography\n style={{ textTransform: 'uppercase' }}\n textColor={value ? undefined : 'neutral600'}\n variant=\"omega\"\n >\n {color}\n </Typography>\n </Flex>\n <CarretDown aria-hidden />\n </ColorPickerToggle>\n {showColorPicker && (\n <ColorPickerPopover\n onBlur={handleBlur}\n role=\"dialog\"\n source={colorPickerButtonRef}\n spacing={4}\n >\n <FocusTrap onEscape={() => setShowColorPicker(false)}>\n <ColorPicker\n color={color}\n onChange={(hexValue) =>\n onChange({ target: { name, value: hexValue, type: attribute.type } })\n }\n />\n <Flex paddingTop={3} paddingLeft={4} justifyContent=\"flex-end\">\n <Box paddingRight={2}>\n <Typography variant=\"omega\" as=\"label\" textColor=\"neutral600\">\n {formatMessage({\n id: getTrad('color-picker.input.format'),\n defaultMessage: 'HEX',\n })}\n </Typography>\n </Box>\n <FieldInput\n id=\"color-picker-value\"\n aria-label={formatMessage({\n id: getTrad('color-picker.input.aria-label'),\n defaultMessage: 'Color picker input',\n })}\n style={{ textTransform: 'uppercase' }}\n value={value}\n placeholder=\"#000000\"\n onChange={onChange}\n />\n </Flex>\n </FocusTrap>\n </ColorPickerPopover>\n )}\n <FieldHint />\n <FieldError />\n </Flex>\n </Field>\n );\n }\n);\n"],"names":["React","styled","HexColorPicker","BaseButton","Popover","useIntl","jsxDEV","Field","Flex","FieldLabel","this","getTrad","Typography","CarretDown","FocusTrap","Box","FieldInput","FieldHint","FieldError"],"mappings":"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"}
1
+ {"version":3,"file":"ColorPickerInput-cddbeb1a.js","sources":["../../admin/src/hooks/useComposeRefs.ts","../../admin/src/components/ColorPickerInput.tsx"],"sourcesContent":["import * as React from 'react';\n\ntype PossibleRef<T> = React.Ref<T> | undefined;\n\n/**\n * Set a given ref to a given value\n * This utility takes care of different types of refs: callback refs and RefObject(s)\n */\nfunction setRef<T>(ref: PossibleRef<T>, value: T) {\n if (typeof ref === 'function') {\n ref(value);\n } else if (ref !== null && ref !== undefined) {\n (ref as React.MutableRefObject<T>).current = value;\n }\n}\n\n/**\n * A utility to compose multiple refs together\n * Accepts callback refs and RefObject(s)\n */\nfunction composeRefs<T>(...refs: PossibleRef<T>[]) {\n return (node: T) => refs.forEach((ref) => setRef(ref, node));\n}\n\n/**\n * Takes multiple React like refs either React.Ref or a callback:\n * (node: T) => void and returns a single function that can be\n * passed to a React component as a ref.\n *\n * Example:\n * ```tsx\n * import { useComposedRefs } from '../hooks/useComposedRefs';\n *\n * const Component = React.forwardRef<HTMLInputElement, ComponentProps>((props, forwardedRef) => {\n * const ref = useComposedRefs(internalRef, forwardedRef);\n *\n * React.useEffect(() => {\n * ref.current.focus();\n * }, [ref]);\n *\n * return <input ref={ref} />\n * }\n * ```\n */\nfunction useComposedRefs<T>(...refs: PossibleRef<T>[]) {\n // eslint-disable-next-line react-hooks/exhaustive-deps\n return React.useCallback(composeRefs(...refs), refs);\n}\n\nexport { composeRefs, useComposedRefs };\n","import * as React from 'react';\n\nimport {\n BaseButton,\n Box,\n Field,\n FieldError,\n FieldHint,\n FieldInput,\n FieldLabel,\n Flex,\n FocusTrap,\n Popover,\n Typography,\n} from '@strapi/design-system';\nimport { CarretDown } from '@strapi/icons';\nimport { HexColorPicker } from 'react-colorful';\nimport { useIntl, MessageDescriptor } from 'react-intl';\nimport styled from 'styled-components';\n\nimport { useComposedRefs } from '../hooks/useComposeRefs';\nimport { getTrad } from '../utils/getTrad';\n\nconst ColorPreview = styled.div`\n border-radius: 50%;\n width: 20px;\n height: 20px;\n margin-right: 10px;\n background-color: ${(props) => props.color};\n border: 1px solid rgba(0, 0, 0, 0.1);\n`;\n\nconst ColorPicker = styled(HexColorPicker)`\n && {\n width: 100%;\n aspect-ratio: 1.5;\n }\n\n .react-colorful__pointer {\n width: ${({ theme }) => theme.spaces[3]};\n height: ${({ theme }) => theme.spaces[3]};\n }\n\n .react-colorful__saturation {\n border-radius: ${({ theme }) => theme.spaces[1]};\n border-bottom: none;\n }\n\n .react-colorful__hue {\n border-radius: 10px;\n height: ${({ theme }) => theme.spaces[3]};\n margin-top: ${({ theme }) => theme.spaces[2]};\n }\n`;\n\nconst ColorPickerToggle = styled(BaseButton)`\n display: flex;\n justify-content: space-between;\n align-items: center;\n\n svg {\n width: ${({ theme }) => theme.spaces[2]};\n height: ${({ theme }) => theme.spaces[2]};\n }\n\n svg > path {\n fill: ${({ theme }) => theme.colors.neutral500};\n justify-self: flex-end;\n }\n`;\n\nconst ColorPickerPopover = styled(Popover)`\n padding: ${({ theme }) => theme.spaces[2]};\n min-height: 270px;\n`;\n\n/**\n * TODO: A lot of these props should extend `FieldProps`\n */\ninterface ColorPickerInputProps {\n intlLabel: MessageDescriptor;\n /**\n * TODO: this should be extended from `FieldInputProps['onChange']\n * but that conflicts with it's secondary usage in `HexColorPicker`\n */\n onChange: (event: { target: { name: string; value: string; type: string } }) => void;\n attribute: { type: string; [key: string]: unknown };\n name: string;\n description?: MessageDescriptor;\n disabled?: boolean;\n error?: string;\n labelAction?: React.ReactNode;\n required?: boolean;\n value?: string;\n}\n\nexport const ColorPickerInput = React.forwardRef<HTMLButtonElement, ColorPickerInputProps>(\n (\n {\n attribute,\n description,\n disabled = false,\n error,\n intlLabel,\n labelAction,\n name,\n onChange,\n required = false,\n value = '',\n },\n forwardedRef\n ) => {\n const [showColorPicker, setShowColorPicker] = React.useState(false);\n const colorPickerButtonRef = React.useRef<HTMLButtonElement>(null!);\n const { formatMessage } = useIntl();\n const color = value || '#000000';\n\n const handleBlur: React.FocusEventHandler<HTMLDivElement> = (e) => {\n e.preventDefault();\n\n if (!e.currentTarget.contains(e.relatedTarget)) {\n setShowColorPicker(false);\n }\n };\n\n const composedRefs = useComposedRefs(forwardedRef, colorPickerButtonRef);\n\n return (\n <Field\n name={name}\n id={name}\n // GenericInput calls formatMessage and returns a string for the error\n error={error}\n hint={description && formatMessage(description)}\n required={required}\n >\n <Flex direction=\"column\" alignItems=\"stretch\" gap={1}>\n <FieldLabel action={labelAction}>{formatMessage(intlLabel)}</FieldLabel>\n <ColorPickerToggle\n ref={composedRefs}\n aria-label={formatMessage({\n id: getTrad('color-picker.toggle.aria-label'),\n defaultMessage: 'Color picker toggle',\n })}\n aria-controls=\"color-picker-value\"\n aria-haspopup=\"dialog\"\n aria-expanded={showColorPicker}\n aria-disabled={disabled}\n disabled={disabled}\n onClick={() => setShowColorPicker(!showColorPicker)}\n >\n <Flex>\n <ColorPreview color={color} />\n <Typography\n style={{ textTransform: 'uppercase' }}\n textColor={value ? undefined : 'neutral600'}\n variant=\"omega\"\n >\n {color}\n </Typography>\n </Flex>\n <CarretDown aria-hidden />\n </ColorPickerToggle>\n {showColorPicker && (\n <ColorPickerPopover\n onBlur={handleBlur}\n role=\"dialog\"\n source={colorPickerButtonRef}\n spacing={4}\n >\n <FocusTrap onEscape={() => setShowColorPicker(false)}>\n <ColorPicker\n color={color}\n onChange={(hexValue) =>\n onChange({ target: { name, value: hexValue, type: attribute.type } })\n }\n />\n <Flex paddingTop={3} paddingLeft={4} justifyContent=\"flex-end\">\n <Box paddingRight={2}>\n <Typography variant=\"omega\" as=\"label\" textColor=\"neutral600\">\n {formatMessage({\n id: getTrad('color-picker.input.format'),\n defaultMessage: 'HEX',\n })}\n </Typography>\n </Box>\n <FieldInput\n id=\"color-picker-value\"\n aria-label={formatMessage({\n id: getTrad('color-picker.input.aria-label'),\n defaultMessage: 'Color picker input',\n })}\n style={{ textTransform: 'uppercase' }}\n value={value}\n placeholder=\"#000000\"\n onChange={onChange}\n />\n </Flex>\n </FocusTrap>\n </ColorPickerPopover>\n )}\n <FieldHint />\n <FieldError />\n </Flex>\n </Field>\n );\n }\n);\n"],"names":["React","styled","HexColorPicker","BaseButton","Popover","useIntl","jsxDEV","Field","Flex","FieldLabel","this","getTrad","Typography","CarretDown","FocusTrap","Box","FieldInput","FieldHint","FieldError"],"mappings":"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"}
package/dist/_chunks/{index-476267d4.js → index-0b5f614d.js} RENAMED
@@ -27,11 +27,11 @@ const IconBox = styled__default.default(designSystem.Flex)`
27
27
  `;
28
28
  const ColorPickerIcon = () => {
29
29
  return /* @__PURE__ */ jsxDevRuntime.jsxDEV(IconBox, { justifyContent: "center", alignItems: "center", width: 7, height: 6, hasRadius: true, "aria-hidden": true, children: /* @__PURE__ */ jsxDevRuntime.jsxDEV(designSystem.Icon, { as: icons.Paint }, void 0, false, {
30
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerIcon.tsx",
30
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerIcon.tsx",
31
31
  lineNumber: 19,
32
32
  columnNumber: 7
33
33
  }, globalThis) }, void 0, false, {
34
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerIcon.tsx",
34
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerIcon.tsx",
35
35
  lineNumber: 18,
36
36
  columnNumber: 5
37
37
  }, globalThis);
@@ -58,10 +58,9 @@ const index = {
58
58
  defaultMessage: "Select any color"
59
59
  },
60
60
  components: {
61
- Input: async () => Promise.resolve().then(() => require(
62
- /* webpackChunkName: "color-picker-input-component" */
63
- "./ColorPickerInput-6f0d1bb5.js"
64
- )).then((module2) => ({ default: module2.ColorPickerInput }))
61
+ Input: async () => Promise.resolve().then(() => require("./ColorPickerInput-cddbeb1a.js")).then((module2) => ({
62
+ default: module2.ColorPickerInput
63
+ }))
65
64
  },
66
65
  options: {
67
66
  advanced: [
@@ -123,4 +122,4 @@ const index = {
123
122
  };
124
123
  exports.getTrad = getTrad;
125
124
  exports.index = index;
126
- //# sourceMappingURL=index-476267d4.js.map
125
+ //# sourceMappingURL=index-0b5f614d.js.map
package/dist/_chunks/index-0b5f614d.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index-0b5f614d.js","sources":["../../admin/src/components/ColorPickerIcon.tsx","../../admin/src/pluginId.ts","../../admin/src/utils/getTrad.ts","../../admin/src/index.ts"],"sourcesContent":["import { Flex, Icon } from '@strapi/design-system';\nimport { Paint } from '@strapi/icons';\nimport styled from 'styled-components';\n\nconst IconBox = styled(Flex)`\n /* Hard code color values */\n /* to stay consistent between themes */\n background-color: #f0f0ff; /* primary100 */\n border: 1px solid #d9d8ff; /* primary200 */\n\n svg > path {\n fill: #4945ff; /* primary600 */\n }\n`;\n\nexport const ColorPickerIcon = () => {\n return (\n <IconBox justifyContent=\"center\" alignItems=\"center\" width={7} height={6} hasRadius aria-hidden>\n <Icon as={Paint} />\n </IconBox>\n );\n};\n","export const pluginId = 'color-picker';\n","import { pluginId } from '../pluginId';\n\nexport const getTrad = (id: string) => `${pluginId}.${id}`;\n","import { prefixPluginTranslations } from '@strapi/helper-plugin';\n\nimport { ColorPickerIcon } from './components/ColorPickerIcon';\nimport { pluginId } from './pluginId';\nimport { getTrad } from './utils/getTrad';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n /**\n * TODO: we need to have the type for StrapiApp done from `@strapi/admin` package.\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n register(app: any) {\n app.customFields.register({\n name: 'color',\n pluginId: 'color-picker',\n type: 'string',\n icon: ColorPickerIcon,\n intlLabel: {\n id: getTrad('color-picker.label'),\n defaultMessage: 'Color',\n },\n intlDescription: {\n id: getTrad('color-picker.description'),\n defaultMessage: 'Select any color',\n },\n components: {\n Input: async () =>\n import('./components/ColorPickerInput').then((module) => ({\n default: module.ColorPickerInput,\n })),\n },\n options: {\n advanced: [\n {\n intlLabel: {\n id: getTrad('color-picker.options.advanced.regex'),\n defaultMessage: 'RegExp pattern',\n },\n name: 'regex',\n type: 'text',\n defaultValue: '^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$',\n description: {\n id: getTrad('color-picker.options.advanced.regex.description'),\n defaultMessage: 'The text of the regular expression',\n },\n },\n {\n sectionTitle: {\n id: 'global.settings',\n defaultMessage: 'Settings',\n },\n items: [\n {\n name: 'required',\n type: 'checkbox',\n intlLabel: {\n id: getTrad('color-picker.options.advanced.requiredField'),\n defaultMessage: 'Required field',\n },\n description: {\n id: getTrad('color-picker.options.advanced.requiredField.description'),\n defaultMessage: \"You won't be able to create an entry if this field is empty\",\n },\n },\n ],\n },\n ],\n },\n });\n },\n async registerTrads({ locales }: { locales: string[] }) {\n const importedTrads = await Promise.all(\n locales.map((locale) => {\n return import(`./translations/${locale}.json`)\n .then(({ default: data }) => {\n return {\n data: prefixPluginTranslations(data, pluginId),\n locale,\n };\n })\n .catch(() => {\n return {\n data: {},\n locale,\n };\n });\n })\n );\n\n return Promise.resolve(importedTrads);\n },\n};\n"],"names":["styled","Flex","jsxDEV","Icon","Paint","this","module","prefixPluginTranslations"],"mappings":"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"}
package/dist/_chunks/{index-e797ad4f.mjs → index-e7d8fc7b.mjs} RENAMED
@@ -24,11 +24,11 @@ const IconBox = styled(Flex)`
24
24
  `;
25
25
  const ColorPickerIcon = () => {
26
26
  return /* @__PURE__ */ jsxDEV(IconBox, { justifyContent: "center", alignItems: "center", width: 7, height: 6, hasRadius: true, "aria-hidden": true, children: /* @__PURE__ */ jsxDEV(Icon, { as: Paint }, void 0, false, {
27
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerIcon.tsx",
27
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerIcon.tsx",
28
28
  lineNumber: 19,
29
29
  columnNumber: 7
30
30
  }, globalThis) }, void 0, false, {
31
- fileName: "/Users/marcroig/Documents/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerIcon.tsx",
31
+ fileName: "/Users/alex/dev/strapi/strapi/packages/plugins/color-picker/admin/src/components/ColorPickerIcon.tsx",
32
32
  lineNumber: 18,
33
33
  columnNumber: 5
34
34
  }, globalThis);
@@ -55,10 +55,9 @@ const index = {
55
55
  defaultMessage: "Select any color"
56
56
  },
57
57
  components: {
58
- Input: async () => import(
59
- /* webpackChunkName: "color-picker-input-component" */
60
- "./ColorPickerInput-f3a9f863.mjs"
61
- ).then((module) => ({ default: module.ColorPickerInput }))
58
+ Input: async () => import("./ColorPickerInput-ca8fbb6e.mjs").then((module) => ({
59
+ default: module.ColorPickerInput
60
+ }))
62
61
  },
63
62
  options: {
64
63
  advanced: [
@@ -122,4 +121,4 @@ export {
122
121
  getTrad as g,
123
122
  index as i
124
123
  };
125
- //# sourceMappingURL=index-e797ad4f.mjs.map
124
+ //# sourceMappingURL=index-e7d8fc7b.mjs.map
package/dist/_chunks/index-e7d8fc7b.mjs.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index-e7d8fc7b.mjs","sources":["../../admin/src/components/ColorPickerIcon.tsx","../../admin/src/pluginId.ts","../../admin/src/utils/getTrad.ts","../../admin/src/index.ts"],"sourcesContent":["import { Flex, Icon } from '@strapi/design-system';\nimport { Paint } from '@strapi/icons';\nimport styled from 'styled-components';\n\nconst IconBox = styled(Flex)`\n /* Hard code color values */\n /* to stay consistent between themes */\n background-color: #f0f0ff; /* primary100 */\n border: 1px solid #d9d8ff; /* primary200 */\n\n svg > path {\n fill: #4945ff; /* primary600 */\n }\n`;\n\nexport const ColorPickerIcon = () => {\n return (\n <IconBox justifyContent=\"center\" alignItems=\"center\" width={7} height={6} hasRadius aria-hidden>\n <Icon as={Paint} />\n </IconBox>\n );\n};\n","export const pluginId = 'color-picker';\n","import { pluginId } from '../pluginId';\n\nexport const getTrad = (id: string) => `${pluginId}.${id}`;\n","import { prefixPluginTranslations } from '@strapi/helper-plugin';\n\nimport { ColorPickerIcon } from './components/ColorPickerIcon';\nimport { pluginId } from './pluginId';\nimport { getTrad } from './utils/getTrad';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n /**\n * TODO: we need to have the type for StrapiApp done from `@strapi/admin` package.\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n register(app: any) {\n app.customFields.register({\n name: 'color',\n pluginId: 'color-picker',\n type: 'string',\n icon: ColorPickerIcon,\n intlLabel: {\n id: getTrad('color-picker.label'),\n defaultMessage: 'Color',\n },\n intlDescription: {\n id: getTrad('color-picker.description'),\n defaultMessage: 'Select any color',\n },\n components: {\n Input: async () =>\n import('./components/ColorPickerInput').then((module) => ({\n default: module.ColorPickerInput,\n })),\n },\n options: {\n advanced: [\n {\n intlLabel: {\n id: getTrad('color-picker.options.advanced.regex'),\n defaultMessage: 'RegExp pattern',\n },\n name: 'regex',\n type: 'text',\n defaultValue: '^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$',\n description: {\n id: getTrad('color-picker.options.advanced.regex.description'),\n defaultMessage: 'The text of the regular expression',\n },\n },\n {\n sectionTitle: {\n id: 'global.settings',\n defaultMessage: 'Settings',\n },\n items: [\n {\n name: 'required',\n type: 'checkbox',\n intlLabel: {\n id: getTrad('color-picker.options.advanced.requiredField'),\n defaultMessage: 'Required field',\n },\n description: {\n id: getTrad('color-picker.options.advanced.requiredField.description'),\n defaultMessage: \"You won't be able to create an entry if this field is empty\",\n },\n },\n ],\n },\n ],\n },\n });\n },\n async registerTrads({ locales }: { locales: string[] }) {\n const importedTrads = await Promise.all(\n locales.map((locale) => {\n return import(`./translations/${locale}.json`)\n .then(({ default: data }) => {\n return {\n data: prefixPluginTranslations(data, pluginId),\n locale,\n };\n })\n .catch(() => {\n return {\n data: {},\n locale,\n };\n });\n })\n );\n\n return Promise.resolve(importedTrads);\n },\n};\n"],"names":["this"],"mappings":"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"}
package/dist/admin/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  "use strict";
2
- const index = require("../_chunks/index-476267d4.js");
2
+ const index = require("../_chunks/index-0b5f614d.js");
3
3
  require("@strapi/helper-plugin");
4
4
  require("react/jsx-dev-runtime");
5
5
  require("@strapi/design-system");
package/dist/admin/index.mjs CHANGED
@@ -1,4 +1,4 @@
1
- import { i } from "../_chunks/index-e797ad4f.mjs";
1
+ import { i } from "../_chunks/index-e7d8fc7b.mjs";
2
2
  import "@strapi/helper-plugin";
3
3
  import "react/jsx-dev-runtime";
4
4
  import "@strapi/design-system";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@strapi/plugin-color-picker",
3
- "version": "4.15.0",
3
+ "version": "4.15.1",
4
4
  "description": "Strapi maintained Custom Fields",
5
5
  "repository": {
6
6
  "type": "git",
@@ -58,14 +58,14 @@
58
58
  },
59
59
  "dependencies": {
60
60
  "@strapi/design-system": "1.13.0",
61
- "@strapi/helper-plugin": "4.15.0",
61
+ "@strapi/helper-plugin": "4.15.1",
62
62
  "@strapi/icons": "1.13.0",
63
63
  "prop-types": "^15.8.1",
64
64
  "react-colorful": "5.6.1",
65
65
  "react-intl": "6.4.1"
66
66
  },
67
67
  "devDependencies": {
68
- "@strapi/strapi": "4.15.0",
68
+ "@strapi/strapi": "4.15.1",
69
69
  "@testing-library/react": "14.0.0",
70
70
  "@testing-library/user-event": "14.4.3",
71
71
  "@types/styled-components": "5.1.26",
@@ -92,5 +92,5 @@
92
92
  "kind": "plugin",
93
93
  "displayName": "Color Picker"
94
94
  },
95
- "gitHead": "6e44e1e68db5153e485e61bdc03f42efb0311406"
95
+ "gitHead": "b6c085052f108fcfe47d22972a664dfa85aa0358"
96
96
  }
package/dist/_chunks/index-476267d4.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"index-476267d4.js","sources":["../../admin/src/components/ColorPickerIcon.tsx","../../admin/src/pluginId.ts","../../admin/src/utils/getTrad.ts","../../admin/src/index.ts"],"sourcesContent":["import { Flex, Icon } from '@strapi/design-system';\nimport { Paint } from '@strapi/icons';\nimport styled from 'styled-components';\n\nconst IconBox = styled(Flex)`\n /* Hard code color values */\n /* to stay consistent between themes */\n background-color: #f0f0ff; /* primary100 */\n border: 1px solid #d9d8ff; /* primary200 */\n\n svg > path {\n fill: #4945ff; /* primary600 */\n }\n`;\n\nexport const ColorPickerIcon = () => {\n return (\n <IconBox justifyContent=\"center\" alignItems=\"center\" width={7} height={6} hasRadius aria-hidden>\n <Icon as={Paint} />\n </IconBox>\n );\n};\n","export const pluginId = 'color-picker';\n","import { pluginId } from '../pluginId';\n\nexport const getTrad = (id: string) => `${pluginId}.${id}`;\n","import { prefixPluginTranslations } from '@strapi/helper-plugin';\n\nimport { ColorPickerIcon } from './components/ColorPickerIcon';\nimport { pluginId } from './pluginId';\nimport { getTrad } from './utils/getTrad';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n /**\n * TODO: we need to have the type for StrapiApp done from `@strapi/admin` package.\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n register(app: any) {\n app.customFields.register({\n name: 'color',\n pluginId: 'color-picker',\n type: 'string',\n icon: ColorPickerIcon,\n intlLabel: {\n id: getTrad('color-picker.label'),\n defaultMessage: 'Color',\n },\n intlDescription: {\n id: getTrad('color-picker.description'),\n defaultMessage: 'Select any color',\n },\n components: {\n Input: async () =>\n import(\n /* webpackChunkName: \"color-picker-input-component\" */ './components/ColorPickerInput'\n ).then((module) => ({ default: module.ColorPickerInput })),\n },\n options: {\n advanced: [\n {\n intlLabel: {\n id: getTrad('color-picker.options.advanced.regex'),\n defaultMessage: 'RegExp pattern',\n },\n name: 'regex',\n type: 'text',\n defaultValue: '^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$',\n description: {\n id: getTrad('color-picker.options.advanced.regex.description'),\n defaultMessage: 'The text of the regular expression',\n },\n },\n {\n sectionTitle: {\n id: 'global.settings',\n defaultMessage: 'Settings',\n },\n items: [\n {\n name: 'required',\n type: 'checkbox',\n intlLabel: {\n id: getTrad('color-picker.options.advanced.requiredField'),\n defaultMessage: 'Required field',\n },\n description: {\n id: getTrad('color-picker.options.advanced.requiredField.description'),\n defaultMessage: \"You won't be able to create an entry if this field is empty\",\n },\n },\n ],\n },\n ],\n },\n });\n },\n async registerTrads({ locales }: { locales: string[] }) {\n const importedTrads = await Promise.all(\n locales.map((locale) => {\n return import(`./translations/${locale}.json`)\n .then(({ default: data }) => {\n return {\n data: prefixPluginTranslations(data, pluginId),\n locale,\n };\n })\n .catch(() => {\n return {\n data: {},\n locale,\n };\n });\n })\n );\n\n return Promise.resolve(importedTrads);\n },\n};\n"],"names":["styled","Flex","jsxDEV","Icon","Paint","this","module","prefixPluginTranslations"],"mappings":"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"}
package/dist/_chunks/index-e797ad4f.mjs.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"index-e797ad4f.mjs","sources":["../../admin/src/components/ColorPickerIcon.tsx","../../admin/src/pluginId.ts","../../admin/src/utils/getTrad.ts","../../admin/src/index.ts"],"sourcesContent":["import { Flex, Icon } from '@strapi/design-system';\nimport { Paint } from '@strapi/icons';\nimport styled from 'styled-components';\n\nconst IconBox = styled(Flex)`\n /* Hard code color values */\n /* to stay consistent between themes */\n background-color: #f0f0ff; /* primary100 */\n border: 1px solid #d9d8ff; /* primary200 */\n\n svg > path {\n fill: #4945ff; /* primary600 */\n }\n`;\n\nexport const ColorPickerIcon = () => {\n return (\n <IconBox justifyContent=\"center\" alignItems=\"center\" width={7} height={6} hasRadius aria-hidden>\n <Icon as={Paint} />\n </IconBox>\n );\n};\n","export const pluginId = 'color-picker';\n","import { pluginId } from '../pluginId';\n\nexport const getTrad = (id: string) => `${pluginId}.${id}`;\n","import { prefixPluginTranslations } from '@strapi/helper-plugin';\n\nimport { ColorPickerIcon } from './components/ColorPickerIcon';\nimport { pluginId } from './pluginId';\nimport { getTrad } from './utils/getTrad';\n\n// eslint-disable-next-line import/no-default-export\nexport default {\n /**\n * TODO: we need to have the type for StrapiApp done from `@strapi/admin` package.\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n register(app: any) {\n app.customFields.register({\n name: 'color',\n pluginId: 'color-picker',\n type: 'string',\n icon: ColorPickerIcon,\n intlLabel: {\n id: getTrad('color-picker.label'),\n defaultMessage: 'Color',\n },\n intlDescription: {\n id: getTrad('color-picker.description'),\n defaultMessage: 'Select any color',\n },\n components: {\n Input: async () =>\n import(\n /* webpackChunkName: \"color-picker-input-component\" */ './components/ColorPickerInput'\n ).then((module) => ({ default: module.ColorPickerInput })),\n },\n options: {\n advanced: [\n {\n intlLabel: {\n id: getTrad('color-picker.options.advanced.regex'),\n defaultMessage: 'RegExp pattern',\n },\n name: 'regex',\n type: 'text',\n defaultValue: '^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$',\n description: {\n id: getTrad('color-picker.options.advanced.regex.description'),\n defaultMessage: 'The text of the regular expression',\n },\n },\n {\n sectionTitle: {\n id: 'global.settings',\n defaultMessage: 'Settings',\n },\n items: [\n {\n name: 'required',\n type: 'checkbox',\n intlLabel: {\n id: getTrad('color-picker.options.advanced.requiredField'),\n defaultMessage: 'Required field',\n },\n description: {\n id: getTrad('color-picker.options.advanced.requiredField.description'),\n defaultMessage: \"You won't be able to create an entry if this field is empty\",\n },\n },\n ],\n },\n ],\n },\n });\n },\n async registerTrads({ locales }: { locales: string[] }) {\n const importedTrads = await Promise.all(\n locales.map((locale) => {\n return import(`./translations/${locale}.json`)\n .then(({ default: data }) => {\n return {\n data: prefixPluginTranslations(data, pluginId),\n locale,\n };\n })\n .catch(() => {\n return {\n data: {},\n locale,\n };\n });\n })\n );\n\n return Promise.resolve(importedTrads);\n },\n};\n"],"names":["this"],"mappings":"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"}