@strapi/plugin-color-picker 0.0.0-next.837384c065457f44cba22eb6fb56079cc4b04a2b → 0.0.0-next.83f9ccf1fd746ed4fad4bebf04cf998ddaafb5bc

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@strapi/plugin-color-picker",
-  "version": "0.0.0-next.837384c065457f44cba22eb6fb56079cc4b04a2b",
+  "version": "0.0.0-next.83f9ccf1fd746ed4fad4bebf04cf998ddaafb5bc",
   "description": "Strapi maintained Custom Fields",
   "repository": {
     "type": "git",
@@ -42,7 +42,11 @@
     "strapi-server.js"
   ],
   "scripts": {
-    "build": "strapi-plugin build",
+    "build": "run -T npm-run-all clean --parallel build:code build:types",
+    "build:code": "run -T rollup -c",
+    "build:types": "run -T run-p build:types:server build:types:admin",
+    "build:types:server": "run -T tsc -p server/tsconfig.build.json --emitDeclarationOnly",
+    "build:types:admin": "run -T tsc -p admin/tsconfig.build.json --emitDeclarationOnly",
     "clean": "run -T rimraf ./dist",
     "lint": "run -T eslint .",
     "test:front": "run -T cross-env IS_EE=true jest --config ./jest.config.front.js",
@@ -50,24 +54,23 @@
     "test:front:watch": "run -T cross-env IS_EE=true jest --config ./jest.config.front.js --watchAll",
     "test:front:watch:ce": "run -T cross-env IS_EE=false jest --config ./jest.config.front.js --watchAll",
     "test:ts:front": "run -T tsc -p admin/tsconfig.json",
-    "watch": "strapi-plugin watch"
+    "watch": "run -T rollup -c -w"
   },
   "dependencies": {
-    "@strapi/design-system": "2.0.0-rc.14",
-    "@strapi/icons": "2.0.0-rc.14",
+    "@strapi/design-system": "2.0.1",
+    "@strapi/icons": "2.0.1",
     "react-colorful": "5.6.1",
     "react-intl": "6.6.2"
   },
   "devDependencies": {
-    "@strapi/sdk-plugin": "^5.2.0",
-    "@strapi/strapi": "0.0.0-next.837384c065457f44cba22eb6fb56079cc4b04a2b",
-    "@testing-library/react": "15.0.7",
-    "@testing-library/user-event": "14.5.2",
+    "@strapi/strapi": "0.0.0-next.83f9ccf1fd746ed4fad4bebf04cf998ddaafb5bc",
+    "@testing-library/react": "16.3.0",
+    "@testing-library/user-event": "14.6.1",
     "react": "18.3.1",
     "react-dom": "18.3.1",
     "react-router-dom": "6.22.3",
     "styled-components": "6.1.8",
-    "typescript": "5.3.2"
+    "typescript": "5.4.4"
   },
   "peerDependencies": {
     "@strapi/strapi": "^5.0.0",
@@ -77,7 +80,7 @@
     "styled-components": "^6.0.0"
   },
   "engines": {
-    "node": ">=18.0.0 <=22.x.x",
+    "node": ">=20.0.0 <=24.x.x",
     "npm": ">=6.0.0"
   },
   "strapi": {
@@ -85,6 +88,5 @@
     "description": "Color picker custom field",
     "kind": "plugin",
     "displayName": "Color Picker"
-  },
-  "gitHead": "837384c065457f44cba22eb6fb56079cc4b04a2b"
+  }
 }

package/dist/_chunks/ColorPickerInput-D6xkBHIN.js

@@ -1,151 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("react/jsx-runtime");
-const React = require("react");
-const designSystem = require("@strapi/design-system");
-const icons = require("@strapi/icons");
-const reactColorful = require("react-colorful");
-const reactIntl = require("react-intl");
-const styledComponents = require("styled-components");
-const index = require("./index-CCLaPAwT.js");
-function _interopNamespace(e) {
-  if (e && e.__esModule) return e;
-  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
-  if (e) {
-    for (const k in e) {
-      if (k !== "default") {
-        const d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: () => e[k]
-        });
-      }
-    }
-  }
-  n.default = e;
-  return Object.freeze(n);
-}
-const React__namespace = /* @__PURE__ */ _interopNamespace(React);
-const ColorPreview = styledComponents.styled.div`
-  border-radius: 50%;
-  width: 20px;
-  height: 20px;
-  margin-right: 10px;
-  background-color: ${(props) => props.color};
-  border: 1px solid rgba(0, 0, 0, 0.1);
-`;
-const ColorPicker = styledComponents.styled(reactColorful.HexColorPicker)`
-  && {
-    width: 100%;
-    aspect-ratio: 1.5;
-  }
-
-  .react-colorful__pointer {
-    width: ${({ theme }) => theme.spaces[3]};
-    height: ${({ theme }) => theme.spaces[3]};
-  }
-
-  .react-colorful__saturation {
-    border-radius: ${({ theme }) => theme.spaces[1]};
-    border-bottom: none;
-  }
-
-  .react-colorful__hue {
-    border-radius: 10px;
-    height: ${({ theme }) => theme.spaces[3]};
-    margin-top: ${({ theme }) => theme.spaces[2]};
-  }
-`;
-const ColorPickerToggle = styledComponents.styled(designSystem.Button)`
-  & > span {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    width: 100%;
-  }
-
-  svg {
-    width: ${({ theme }) => theme.spaces[2]};
-    height: ${({ theme }) => theme.spaces[2]};
-  }
-
-  svg > path {
-    fill: ${({ theme }) => theme.colors.neutral500};
-    justify-self: flex-end;
-  }
-`;
-const ColorPickerPopover = styledComponents.styled(designSystem.Popover.Content)`
-  padding: ${({ theme }) => theme.spaces[2]};
-  min-height: 270px;
-`;
-const ColorPickerInput = React__namespace.forwardRef(
-  ({ hint, disabled = false, labelAction, label, name, required = false, onChange, value, error }, forwardedRef) => {
-    const [showColorPicker, setShowColorPicker] = React__namespace.useState(false);
-    const colorPickerButtonRef = React__namespace.useRef(null);
-    const { formatMessage } = reactIntl.useIntl();
-    const color = value || "#000000";
-    const composedRefs = designSystem.useComposedRefs(forwardedRef, colorPickerButtonRef);
-    return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Root, { name, id: name, error, hint, required, children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { direction: "column", alignItems: "stretch", gap: 1, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { action: labelAction, children: label }),
-      /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Popover.Root, { onOpenChange: setShowColorPicker, children: [
-        /* @__PURE__ */ jsxRuntime.jsx(designSystem.Popover.Trigger, { children: /* @__PURE__ */ jsxRuntime.jsxs(
-          ColorPickerToggle,
-          {
-            ref: composedRefs,
-            "aria-label": formatMessage({
-              id: index.getTrad("color-picker.toggle.aria-label"),
-              defaultMessage: "Color picker toggle"
-            }),
-            "aria-controls": "color-picker-value",
-            "aria-haspopup": "dialog",
-            "aria-expanded": showColorPicker,
-            "aria-disabled": disabled,
-            disabled,
-            variant: "tertiary",
-            size: "L",
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { children: [
-                /* @__PURE__ */ jsxRuntime.jsx(ColorPreview, { color }),
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  designSystem.Typography,
-                  {
-                    style: { textTransform: "uppercase" },
-                    textColor: value ? void 0 : "neutral600",
-                    variant: "omega",
-                    children: color
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ jsxRuntime.jsx(icons.CaretDown, { "aria-hidden": true })
-            ]
-          }
-        ) }),
-        /* @__PURE__ */ jsxRuntime.jsxs(ColorPickerPopover, { sideOffset: 4, children: [
-          /* @__PURE__ */ jsxRuntime.jsx(ColorPicker, { color, onChange: (hexValue) => onChange(name, hexValue) }),
-          /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { paddingTop: 3, paddingLeft: 4, justifyContent: "flex-end", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { paddingRight: 2, children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { variant: "omega", tag: "label", textColor: "neutral600", children: formatMessage({
-              id: index.getTrad("color-picker.input.format"),
-              defaultMessage: "HEX"
-            }) }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Root, { children: /* @__PURE__ */ jsxRuntime.jsx(
-              designSystem.Field.Input,
-              {
-                "aria-label": formatMessage({
-                  id: index.getTrad("color-picker.input.aria-label"),
-                  defaultMessage: "Color picker input"
-                }),
-                style: { textTransform: "uppercase" },
-                value,
-                placeholder: "#000000",
-                onChange
-              }
-            ) })
-          ] })
-        ] })
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Hint, {}),
-      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Error, {})
-    ] }) });
-  }
-);
-exports.ColorPickerInput = ColorPickerInput;

package/dist/_chunks/ColorPickerInput-m6ZX3Kq-.mjs

@@ -1,133 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import * as React from "react";
-import { Button, Popover, useComposedRefs, Field, Flex, Typography, Box } from "@strapi/design-system";
-import { CaretDown } from "@strapi/icons";
-import { HexColorPicker } from "react-colorful";
-import { useIntl } from "react-intl";
-import { styled } from "styled-components";
-import { g as getTrad } from "./index-CgXv8Era.mjs";
-const ColorPreview = styled.div`
-  border-radius: 50%;
-  width: 20px;
-  height: 20px;
-  margin-right: 10px;
-  background-color: ${(props) => props.color};
-  border: 1px solid rgba(0, 0, 0, 0.1);
-`;
-const ColorPicker = styled(HexColorPicker)`
-  && {
-    width: 100%;
-    aspect-ratio: 1.5;
-  }
-
-  .react-colorful__pointer {
-    width: ${({ theme }) => theme.spaces[3]};
-    height: ${({ theme }) => theme.spaces[3]};
-  }
-
-  .react-colorful__saturation {
-    border-radius: ${({ theme }) => theme.spaces[1]};
-    border-bottom: none;
-  }
-
-  .react-colorful__hue {
-    border-radius: 10px;
-    height: ${({ theme }) => theme.spaces[3]};
-    margin-top: ${({ theme }) => theme.spaces[2]};
-  }
-`;
-const ColorPickerToggle = styled(Button)`
-  & > span {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    width: 100%;
-  }
-
-  svg {
-    width: ${({ theme }) => theme.spaces[2]};
-    height: ${({ theme }) => theme.spaces[2]};
-  }
-
-  svg > path {
-    fill: ${({ theme }) => theme.colors.neutral500};
-    justify-self: flex-end;
-  }
-`;
-const ColorPickerPopover = styled(Popover.Content)`
-  padding: ${({ theme }) => theme.spaces[2]};
-  min-height: 270px;
-`;
-const ColorPickerInput = React.forwardRef(
-  ({ hint, disabled = false, labelAction, label, name, required = false, onChange, value, error }, forwardedRef) => {
-    const [showColorPicker, setShowColorPicker] = React.useState(false);
-    const colorPickerButtonRef = React.useRef(null);
-    const { formatMessage } = useIntl();
-    const color = value || "#000000";
-    const composedRefs = useComposedRefs(forwardedRef, colorPickerButtonRef);
-    return /* @__PURE__ */ jsx(Field.Root, { name, id: name, error, hint, required, children: /* @__PURE__ */ jsxs(Flex, { direction: "column", alignItems: "stretch", gap: 1, children: [
-      /* @__PURE__ */ jsx(Field.Label, { action: labelAction, children: label }),
-      /* @__PURE__ */ jsxs(Popover.Root, { onOpenChange: setShowColorPicker, children: [
-        /* @__PURE__ */ jsx(Popover.Trigger, { children: /* @__PURE__ */ jsxs(
-          ColorPickerToggle,
-          {
-            ref: composedRefs,
-            "aria-label": formatMessage({
-              id: getTrad("color-picker.toggle.aria-label"),
-              defaultMessage: "Color picker toggle"
-            }),
-            "aria-controls": "color-picker-value",
-            "aria-haspopup": "dialog",
-            "aria-expanded": showColorPicker,
-            "aria-disabled": disabled,
-            disabled,
-            variant: "tertiary",
-            size: "L",
-            children: [
-              /* @__PURE__ */ jsxs(Flex, { children: [
-                /* @__PURE__ */ jsx(ColorPreview, { color }),
-                /* @__PURE__ */ jsx(
-                  Typography,
-                  {
-                    style: { textTransform: "uppercase" },
-                    textColor: value ? void 0 : "neutral600",
-                    variant: "omega",
-                    children: color
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ jsx(CaretDown, { "aria-hidden": true })
-            ]
-          }
-        ) }),
-        /* @__PURE__ */ jsxs(ColorPickerPopover, { sideOffset: 4, children: [
-          /* @__PURE__ */ jsx(ColorPicker, { color, onChange: (hexValue) => onChange(name, hexValue) }),
-          /* @__PURE__ */ jsxs(Flex, { paddingTop: 3, paddingLeft: 4, justifyContent: "flex-end", children: [
-            /* @__PURE__ */ jsx(Box, { paddingRight: 2, children: /* @__PURE__ */ jsx(Typography, { variant: "omega", tag: "label", textColor: "neutral600", children: formatMessage({
-              id: getTrad("color-picker.input.format"),
-              defaultMessage: "HEX"
-            }) }) }),
-            /* @__PURE__ */ jsx(Field.Root, { children: /* @__PURE__ */ jsx(
-              Field.Input,
-              {
-                "aria-label": formatMessage({
-                  id: getTrad("color-picker.input.aria-label"),
-                  defaultMessage: "Color picker input"
-                }),
-                style: { textTransform: "uppercase" },
-                value,
-                placeholder: "#000000",
-                onChange
-              }
-            ) })
-          ] })
-        ] })
-      ] }),
-      /* @__PURE__ */ jsx(Field.Hint, {}),
-      /* @__PURE__ */ jsx(Field.Error, {})
-    ] }) });
-  }
-);
-export {
-  ColorPickerInput
-};

package/dist/_chunks/cs-CKl0OyEH.js

@@ -1,15 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const cs = {
-  "color-picker.description": "Vyberte libovolnou barvu",
-  "color-picker.input.aria-label": "Vstup pro výběr barvy",
-  "color-picker.input.format": "HEX",
-  "color-picker.label": "Barva",
-  "color-picker.options.advanced.regex": "RegExp vzor",
-  "color-picker.options.advanced.regex.description": "Zadejte regulární výraz pro ověření hodnoty HEX",
-  "color-picker.options.advanced.requiredField": "Povinné pole",
-  "color-picker.options.advanced.requiredField.description": "Pokud je toto pole prázdné, nebudete moci vytvořit záznam",
-  "color-picker.settings": "Nastavení",
-  "color-picker.toggle.aria-label": "Přepínač výběru barvy"
-};
-exports.default = cs;

package/dist/_chunks/cs-DMmE6LK7.mjs

@@ -1,15 +0,0 @@
-const cs = {
-  "color-picker.description": "Vyberte libovolnou barvu",
-  "color-picker.input.aria-label": "Vstup pro výběr barvy",
-  "color-picker.input.format": "HEX",
-  "color-picker.label": "Barva",
-  "color-picker.options.advanced.regex": "RegExp vzor",
-  "color-picker.options.advanced.regex.description": "Zadejte regulární výraz pro ověření hodnoty HEX",
-  "color-picker.options.advanced.requiredField": "Povinné pole",
-  "color-picker.options.advanced.requiredField.description": "Pokud je toto pole prázdné, nebudete moci vytvořit záznam",
-  "color-picker.settings": "Nastavení",
-  "color-picker.toggle.aria-label": "Přepínač výběru barvy"
-};
-export {
-  cs as default
-};

package/dist/_chunks/en-BlDau3us.mjs

@@ -1,18 +0,0 @@
-const en = {
-  "color-picker.description": "Select any color",
-  "color-picker.input.aria-label": "Color picker input",
-  "color-picker.input.format": "HEX",
-  "color-picker.label": "Color",
-  "color-picker.options.advanced.regex": "RegExp pattern",
-  "color-picker.options.advanced.regex.description": "Provide a regular expression to validate the HEX value",
-  "color-picker.options.advanced.requiredField": "Required field",
-  "color-picker.options.advanced.requiredField.description": "You won't be able to create an entry if this field is empty",
-  "color-picker.settings": "Settings",
-  "color-picker.toggle.aria-label": "Color picker toggle",
-  "plugin.description.long": "A Strapi-maintained color picker custom field. Use saturation and hue sliders to select a color and save the value as a HEX string.",
-  "plugin.description.short": "A Strapi-maintained color picker custom field.",
-  "plugin.name": "Color picker"
-};
-export {
-  en as default
-};

package/dist/_chunks/en-Ct0C5cA2.js

@@ -1,18 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const en = {
-  "color-picker.description": "Select any color",
-  "color-picker.input.aria-label": "Color picker input",
-  "color-picker.input.format": "HEX",
-  "color-picker.label": "Color",
-  "color-picker.options.advanced.regex": "RegExp pattern",
-  "color-picker.options.advanced.regex.description": "Provide a regular expression to validate the HEX value",
-  "color-picker.options.advanced.requiredField": "Required field",
-  "color-picker.options.advanced.requiredField.description": "You won't be able to create an entry if this field is empty",
-  "color-picker.settings": "Settings",
-  "color-picker.toggle.aria-label": "Color picker toggle",
-  "plugin.description.long": "A Strapi-maintained color picker custom field. Use saturation and hue sliders to select a color and save the value as a HEX string.",
-  "plugin.description.short": "A Strapi-maintained color picker custom field.",
-  "plugin.name": "Color picker"
-};
-exports.default = en;

package/dist/_chunks/index-CCLaPAwT.js

@@ -1,126 +0,0 @@
-"use strict";
-const jsxRuntime = require("react/jsx-runtime");
-const designSystem = require("@strapi/design-system");
-const icons = require("@strapi/icons");
-const styledComponents = require("styled-components");
-const __variableDynamicImportRuntimeHelper = (glob, path, segs) => {
-  const v = glob[path];
-  if (v) {
-    return typeof v === "function" ? v() : Promise.resolve(v);
-  }
-  return new Promise((_, reject) => {
-    (typeof queueMicrotask === "function" ? queueMicrotask : setTimeout)(
-      reject.bind(
-        null,
-        new Error(
-          "Unknown variable dynamic import: " + path + (path.split("/").length !== segs ? ". Note that variables only represent file names one level deep." : "")
-        )
-      )
-    );
-  });
-};
-const IconBox = styledComponents.styled(designSystem.Flex)`
-  /* Hard code color values */
-  /* to stay consistent between themes */
-  background-color: #f0f0ff; /* primary100 */
-  border: 1px solid #d9d8ff; /* primary200 */
-
-  svg > path {
-    fill: #4945ff; /* primary600 */
-  }
-`;
-const ColorPickerIcon = () => {
-  return /* @__PURE__ */ jsxRuntime.jsx(IconBox, { justifyContent: "center", alignItems: "center", width: 7, height: 6, hasRadius: true, "aria-hidden": true, children: /* @__PURE__ */ jsxRuntime.jsx(icons.PaintBrush, {}) });
-};
-const pluginId = "color-picker";
-const getTrad = (id) => `${pluginId}.${id}`;
-const prefixPluginTranslations = (trad, pluginId2) => {
-  return Object.keys(trad).reduce((acc, current) => {
-    acc[`${pluginId2}.${current}`] = trad[current];
-    return acc;
-  }, {});
-};
-const index = {
-  /**
-   * TODO: we need to have the type for StrapiApp done from `@strapi/admin` package.
-   */
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  register(app) {
-    app.customFields.register({
-      name: "color",
-      pluginId: "color-picker",
-      type: "string",
-      icon: ColorPickerIcon,
-      intlLabel: {
-        id: getTrad("color-picker.label"),
-        defaultMessage: "Color"
-      },
-      intlDescription: {
-        id: getTrad("color-picker.description"),
-        defaultMessage: "Select any color"
-      },
-      components: {
-        Input: async () => Promise.resolve().then(() => require("./ColorPickerInput-D6xkBHIN.js")).then((module2) => ({
-          default: module2.ColorPickerInput
-        }))
-      },
-      options: {
-        advanced: [
-          {
-            intlLabel: {
-              id: getTrad("color-picker.options.advanced.regex"),
-              defaultMessage: "RegExp pattern"
-            },
-            name: "regex",
-            type: "text",
-            defaultValue: "^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$",
-            description: {
-              id: getTrad("color-picker.options.advanced.regex.description"),
-              defaultMessage: "The text of the regular expression"
-            }
-          },
-          {
-            sectionTitle: {
-              id: "global.settings",
-              defaultMessage: "Settings"
-            },
-            items: [
-              {
-                name: "required",
-                type: "checkbox",
-                intlLabel: {
-                  id: getTrad("color-picker.options.advanced.requiredField"),
-                  defaultMessage: "Required field"
-                },
-                description: {
-                  id: getTrad("color-picker.options.advanced.requiredField.description"),
-                  defaultMessage: "You won't be able to create an entry if this field is empty"
-                }
-              }
-            ]
-          }
-        ]
-      }
-    });
-  },
-  async registerTrads({ locales }) {
-    const importedTrads = await Promise.all(
-      locales.map((locale) => {
-        return __variableDynamicImportRuntimeHelper(/* @__PURE__ */ Object.assign({ "./translations/cs.json": () => Promise.resolve().then(() => require("./cs-CKl0OyEH.js")), "./translations/en.json": () => Promise.resolve().then(() => require("./en-Ct0C5cA2.js")), "./translations/ru.json": () => Promise.resolve().then(() => require("./ru-Wrg-npZz.js")), "./translations/sv.json": () => Promise.resolve().then(() => require("./sv-CKY6es_6.js")), "./translations/tr.json": () => Promise.resolve().then(() => require("./tr-DcLzQS-J.js")), "./translations/zh.json": () => Promise.resolve().then(() => require("./zh-T5cJzhPD.js")) }), `./translations/${locale}.json`, 3).then(({ default: data }) => {
-          return {
-            data: prefixPluginTranslations(data, pluginId),
-            locale
-          };
-        }).catch(() => {
-          return {
-            data: {},
-            locale
-          };
-        });
-      })
-    );
-    return Promise.resolve(importedTrads);
-  }
-};
-exports.getTrad = getTrad;
-exports.index = index;

package/dist/_chunks/index-CgXv8Era.mjs

@@ -1,127 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { Flex } from "@strapi/design-system";
-import { PaintBrush } from "@strapi/icons";
-import { styled } from "styled-components";
-const __variableDynamicImportRuntimeHelper = (glob, path, segs) => {
-  const v = glob[path];
-  if (v) {
-    return typeof v === "function" ? v() : Promise.resolve(v);
-  }
-  return new Promise((_, reject) => {
-    (typeof queueMicrotask === "function" ? queueMicrotask : setTimeout)(
-      reject.bind(
-        null,
-        new Error(
-          "Unknown variable dynamic import: " + path + (path.split("/").length !== segs ? ". Note that variables only represent file names one level deep." : "")
-        )
-      )
-    );
-  });
-};
-const IconBox = styled(Flex)`
-  /* Hard code color values */
-  /* to stay consistent between themes */
-  background-color: #f0f0ff; /* primary100 */
-  border: 1px solid #d9d8ff; /* primary200 */
-
-  svg > path {
-    fill: #4945ff; /* primary600 */
-  }
-`;
-const ColorPickerIcon = () => {
-  return /* @__PURE__ */ jsx(IconBox, { justifyContent: "center", alignItems: "center", width: 7, height: 6, hasRadius: true, "aria-hidden": true, children: /* @__PURE__ */ jsx(PaintBrush, {}) });
-};
-const pluginId = "color-picker";
-const getTrad = (id) => `${pluginId}.${id}`;
-const prefixPluginTranslations = (trad, pluginId2) => {
-  return Object.keys(trad).reduce((acc, current) => {
-    acc[`${pluginId2}.${current}`] = trad[current];
-    return acc;
-  }, {});
-};
-const index = {
-  /**
-   * TODO: we need to have the type for StrapiApp done from `@strapi/admin` package.
-   */
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  register(app) {
-    app.customFields.register({
-      name: "color",
-      pluginId: "color-picker",
-      type: "string",
-      icon: ColorPickerIcon,
-      intlLabel: {
-        id: getTrad("color-picker.label"),
-        defaultMessage: "Color"
-      },
-      intlDescription: {
-        id: getTrad("color-picker.description"),
-        defaultMessage: "Select any color"
-      },
-      components: {
-        Input: async () => import("./ColorPickerInput-m6ZX3Kq-.mjs").then((module) => ({
-          default: module.ColorPickerInput
-        }))
-      },
-      options: {
-        advanced: [
-          {
-            intlLabel: {
-              id: getTrad("color-picker.options.advanced.regex"),
-              defaultMessage: "RegExp pattern"
-            },
-            name: "regex",
-            type: "text",
-            defaultValue: "^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$",
-            description: {
-              id: getTrad("color-picker.options.advanced.regex.description"),
-              defaultMessage: "The text of the regular expression"
-            }
-          },
-          {
-            sectionTitle: {
-              id: "global.settings",
-              defaultMessage: "Settings"
-            },
-            items: [
-              {
-                name: "required",
-                type: "checkbox",
-                intlLabel: {
-                  id: getTrad("color-picker.options.advanced.requiredField"),
-                  defaultMessage: "Required field"
-                },
-                description: {
-                  id: getTrad("color-picker.options.advanced.requiredField.description"),
-                  defaultMessage: "You won't be able to create an entry if this field is empty"
-                }
-              }
-            ]
-          }
-        ]
-      }
-    });
-  },
-  async registerTrads({ locales }) {
-    const importedTrads = await Promise.all(
-      locales.map((locale) => {
-        return __variableDynamicImportRuntimeHelper(/* @__PURE__ */ Object.assign({ "./translations/cs.json": () => import("./cs-DMmE6LK7.mjs"), "./translations/en.json": () => import("./en-BlDau3us.mjs"), "./translations/ru.json": () => import("./ru-aOnA-eym.mjs"), "./translations/sv.json": () => import("./sv-BaFDND79.mjs"), "./translations/tr.json": () => import("./tr-CHHW_hYI.mjs"), "./translations/zh.json": () => import("./zh-DBH6uCXb.mjs") }), `./translations/${locale}.json`, 3).then(({ default: data }) => {
-          return {
-            data: prefixPluginTranslations(data, pluginId),
-            locale
-          };
-        }).catch(() => {
-          return {
-            data: {},
-            locale
-          };
-        });
-      })
-    );
-    return Promise.resolve(importedTrads);
-  }
-};
-export {
-  getTrad as g,
-  index as i
-};