@frontify/fondue-components 10.0.0 → 11.0.0

package/dist/fondue-components34.js

@@ -1,9 +1,9 @@
-import { jsxs as o, jsx as e } from "react/jsx-runtime";
+import { jsxs as n, jsx as e } from "react/jsx-runtime";
 import { forwardRef as N, useState as b, useEffect as R } from "react";
 import { Select as c } from "./fondue-components18.js";
 import { TextInput as r } from "./fondue-components23.js";
 import a from "./fondue-components35.js";
-import { rgbColorToHex as d, isValidHexColor as m, hexColorToRgba as I, getLimitedColorChannelValue as n, DEFAULT_COLOR as x, DEFAULT_FORMAT as S } from "./fondue-components36.js";
+import { rgbColorToHex as d, isValidHexColor as m, hexColorToRgba as I, getLimitedColorChannelValue as o, DEFAULT_COLOR as x, DEFAULT_FORMAT as S } from "./fondue-components36.js";
 const h = ({
   currentColor: t = x,
   onColorChange: i = () => {
@@ -16,8 +16,8 @@ const h = ({
   const [u, p] = b(d(t));
   return R(() => {
     p(d(t));
-  }, [t]), /* @__PURE__ */ o("div", { className: a.inputs, "data-test-id": f, ref: g, children: [
-    /* @__PURE__ */ e("div", { className: a.colorFormatInput, children: /* @__PURE__ */ o(
+  }, [t]), /* @__PURE__ */ n("div", { className: a.inputs, "data-test-id": f, ref: g, children: [
+    /* @__PURE__ */ e("div", { className: a.colorFormatInput, children: /* @__PURE__ */ n(
       c,
       {
         "data-test-id": "color-picker-select-format",
@@ -49,7 +49,7 @@ const h = ({
         "aria-label": "Hex color value",
         children: /* @__PURE__ */ e(r.Slot, { name: "left", children: /* @__PURE__ */ e("span", { className: a.inputDecorator, children: "#" }) })
       }
-    ) : /* @__PURE__ */ o("div", { className: a.colorChannelInputGroup, children: [
+    ) : /* @__PURE__ */ n("div", { className: a.colorChannelInputGroup, children: [
       /* @__PURE__ */ e(
         r.Root,
         {
@@ -60,7 +60,7 @@ const h = ({
           onChange: (l) => {
             i({
               ...t,
-              red: n(l.target.value)
+              red: o(l.target.value)
             });
           },
           "aria-label": "Red Color Channel",
@@ -77,7 +77,7 @@ const h = ({
           onChange: (l) => {
             i({
               ...t,
-              green: n(l.target.value)
+              green: o(l.target.value)
             });
           },
           "aria-label": "Green Color Channel",
@@ -94,7 +94,7 @@ const h = ({
           onChange: (l) => {
             i({
               ...t,
-              blue: n(l.target.value)
+              blue: o(l.target.value)
             });
           },
           "aria-label": "Blue Color Channel",
@@ -102,7 +102,7 @@ const h = ({
         }
       )
     ] }),
-    /* @__PURE__ */ e("div", { className: a.colorAlphaInput, children: /* @__PURE__ */ o(
+    /* @__PURE__ */ e("div", { className: a.colorAlphaInput, children: /* @__PURE__ */ n(
       r.Root,
       {
         "data-test-id": "color-picker-value-input-alpha",
@@ -112,7 +112,7 @@ const h = ({
         onChange: (l) => {
           i({
             ...t,
-            alpha: n(l.target.value, 0, 100) / 100
+            alpha: o(l.target.value, 0, 100) / 100
           });
         },
         "aria-label": "Color Opacity",

package/dist/fondue-components36.js

@@ -2,18 +2,18 @@ const s = { red: 255, green: 255, blue: 255, alpha: 1, name: "" }, g = "HEX", $
   if (e)
     return `rgba(${e.red}, ${e.green}, ${e.blue}, ${e.alpha || 1})`;
 }, p = (e) => {
-  const r = /^([\dA-Fa-f]{3}){1,2}$/;
-  return e.length > 2 && r.test(e);
-}, h = (e) => {
-  const r = /^([\dA-Fa-f]{3}){1,2}$/, n = e.match(r);
-  if (!n)
+  const n = /^([\dA-Fa-f]{3}){1,2}$/;
+  return e.length > 2 && n.test(e);
+}, u = (e) => {
+  const n = /^([\dA-Fa-f]{3}){1,2}$/, r = e.match(n);
+  if (!r)
     return {
       red: 0,
       green: 0,
       blue: 0,
       alpha: 0
     };
-  const t = n[0];
+  const t = r[0];
   return t.length === 3 ? {
     red: parseInt(`${t[0]}${t[0]}`, 16),
     green: parseInt(`${t[1]}${t[1]}`, 16),
@@ -26,22 +26,22 @@ const s = { red: 255, green: 255, blue: 255, alpha: 1, name: "" }, g = "HEX", $
     alpha: 1
   };
 }, a = (e) => {
-  const { red: r, green: n, blue: t } = e;
-  return `${r.toString(16).padStart(2, "0")}${n.toString(16).padStart(2, "0")}${t.toString(16).padStart(2, "0")}`;
-}, i = (e, r) => r === "HEX" ? {
+  const { red: n, green: r, blue: t } = e;
+  return `${n.toString(16).padStart(2, "0")}${r.toString(16).padStart(2, "0")}${t.toString(16).padStart(2, "0")}`;
+}, h = (e, n) => n === "HEX" ? {
   ...e,
   name: `#${a(e)}`
 } : {
   ...e,
   name: `rgba(${e.red}, ${e.green}, ${e.blue}, ${e.alpha || 1})`
-}, u = (e, r = 0, n = 255) => e.length === 0 || parseInt(e) < r ? r : parseInt(e) > n ? n : parseInt(e);
+}, i = (e, n = 0, r = 255) => e.length === 0 || parseInt(e) < n ? n : parseInt(e) > r ? r : parseInt(e);
 export {
   s as DEFAULT_COLOR,
   g as DEFAULT_FORMAT,
   $ as colorToCss,
-  i as getColorWithName,
-  u as getLimitedColorChannelValue,
-  h as hexColorToRgba,
+  h as getColorWithName,
+  i as getLimitedColorChannelValue,
+  u as hexColorToRgba,
   p as isValidHexColor,
   a as rgbColorToHex
 };