@layers-app/shared 0.4.4 → 0.4.6

package/dist/components/CollapsibleContainer/CollapsibleContainer.module.css.js

@@ -1,4 +1,4 @@
-const o = "_accordionRoot_3pkfo_1", c = "_accordionControl_3pkfo_5", n = "_accordionItem_3pkfo_9", t = {
+const o = "_accordionRoot_1of7x_1", c = "_accordionControl_1of7x_9", n = "_accordionItem_1of7x_17", t = {
   accordionRoot: o,
   accordionControl: c,
   accordionItem: n

package/dist/components/ColorPicker/ColorPicker.module.css.js

@@ -1,31 +1,37 @@
-const i = "_section_lidow_2", t = "_sectionLabel_lidow_15", n = "_listItem_lidow_46", e = "_listItemActive_lidow_72", l = "_listItemLabel_lidow_76", o = "_listItemSwatch_lidow_84", c = "_grid_lidow_92", _ = "_inlineSection_lidow_162", s = "_inlineSectionLabel_lidow_172", w = "_inlineRow_lidow_180", a = "_inlineSwatch_lidow_189", d = "_inlineSwatchActive_lidow_215", S = "_inlineSwatchRound_lidow_225", h = {
+const i = "_section_1go5u_3", n = "_sectionLabel_1go5u_29", t = "_listItemCaption_1go5u_45", e = "_listItem_1go5u_45", o = "_listItemActive_1go5u_155", c = "_listItemLabel_1go5u_163", l = "_listItemSwatch_1go5u_179", _ = "_grid_1go5u_195", s = "_inlineSection_1go5u_335", a = "_inlineSectionLabel_1go5u_355", S = "_inlineSectionLabelRow_1go5u_371", u = "_inlineSectionCaption_1go5u_383", g = "_inlineRow_1go5u_395", w = "_inlineSwatch_1go5u_413", m = "_inlineSwatchActive_1go5u_465", I = "_inlineSwatchRound_1go5u_485", b = {
   section: i,
-  sectionLabel: t,
-  listItem: n,
-  listItemActive: e,
-  listItemLabel: l,
-  listItemSwatch: o,
-  grid: c,
-  inlineSection: _,
-  inlineSectionLabel: s,
-  inlineRow: w,
-  inlineSwatch: a,
-  inlineSwatchActive: d,
-  inlineSwatchRound: S
+  sectionLabel: n,
+  listItemCaption: t,
+  listItem: e,
+  listItemActive: o,
+  listItemLabel: c,
+  listItemSwatch: l,
+  grid: _,
+  inlineSection: s,
+  inlineSectionLabel: a,
+  inlineSectionLabelRow: S,
+  inlineSectionCaption: u,
+  inlineRow: g,
+  inlineSwatch: w,
+  inlineSwatchActive: m,
+  inlineSwatchRound: I
 };
 export {
-  h as default,
-  c as grid,
-  w as inlineRow,
-  _ as inlineSection,
-  s as inlineSectionLabel,
-  a as inlineSwatch,
-  d as inlineSwatchActive,
-  S as inlineSwatchRound,
-  n as listItem,
-  e as listItemActive,
-  l as listItemLabel,
-  o as listItemSwatch,
+  b as default,
+  _ as grid,
+  g as inlineRow,
+  s as inlineSection,
+  u as inlineSectionCaption,
+  a as inlineSectionLabel,
+  S as inlineSectionLabelRow,
+  w as inlineSwatch,
+  m as inlineSwatchActive,
+  I as inlineSwatchRound,
+  e as listItem,
+  o as listItemActive,
+  t as listItemCaption,
+  c as listItemLabel,
+  l as listItemSwatch,
   i as section,
-  t as sectionLabel
+  n as sectionLabel
 };

package/dist/components/ColorPicker/ColorPickerList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ColorPickerList.d.ts","sourceRoot":"","sources":["../../../src/components/ColorPicker/ColorPickerList.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,oBAAoB,EAAgB,MAAM,SAAS,CAAC;AAqHlE;;oEAEoE;AACpE,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,MAAM,EACN,KAAK,EACL,QAAQ,EACR,OAAW,EACX,gBAAgB,GACjB,EAAE,oBAAoB,2CA4CtB"}
+{"version":3,"file":"ColorPickerList.d.ts","sourceRoot":"","sources":["../../../src/components/ColorPicker/ColorPickerList.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,oBAAoB,EAAgB,MAAM,SAAS,CAAC;AAiIlE;;oEAEoE;AACpE,wBAAgB,eAAe,CAAC,EAC9B,QAAQ,EACR,MAAM,EACN,KAAK,EACL,QAAQ,EACR,OAAW,EACX,gBAAgB,GACjB,EAAE,oBAAoB,2CAkEtB"}

package/dist/components/ColorPicker/ColorPickerList.js

@@ -1,32 +1,32 @@
-import { jsxs as y, jsx as t } from "react/jsx-runtime";
-import { useTranslation as g } from "react-i18next";
-import { Tick02Icon as k } from "@hugeicons/core-free-icons";
-import { HugeiconsIcon as x } from "@hugeicons/react";
-import { useMantineColorScheme as L, Box as F, useMantineTheme as N, getThemeColor as S, ColorSwatch as T } from "@mantine/core";
-import { TextColorIcon as z } from "./icons.js";
-import { resolveColorLabel as D, isDefaultColor as b, normalizeColorItem as $ } from "./types.js";
-import { useRecentColors as w } from "./useRecentColors.js";
-import a from "./ColorPicker.module.css.js";
+import { jsxs as C, jsx as r } from "react/jsx-runtime";
+import { useTranslation as x } from "react-i18next";
+import { Tick02Icon as L } from "@hugeicons/core-free-icons";
+import { HugeiconsIcon as T } from "@hugeicons/react";
+import { useComputedColorScheme as S, Box as F, useMantineTheme as E, getThemeColor as O, ColorSwatch as R } from "@mantine/core";
+import { TextColorIcon as w } from "./icons.js";
+import { normalizeColorItem as I, RECENT_COLOR_HOTKEY as z, resolveRecentKind as D, colorsEqual as K, resolveColorLabel as $, isDefaultColor as N } from "./types.js";
+import { useRecentColors as M } from "./useRecentColors.js";
+import s from "./ColorPicker.module.css.js";
 function j({
   type: e,
-  colorValue: l,
-  resolvedColor: n,
-  border: i,
-  bg: c
+  colorValue: n,
+  resolvedColor: i,
+  border: c,
+  bg: m
 }) {
   if (e === "text")
-    return /* @__PURE__ */ t(z, { size: 16, color: n, showBorder: !0 });
-  const s = b(l);
-  return /* @__PURE__ */ t(
-    T,
+    return /* @__PURE__ */ r(w, { size: 16, color: i, showBorder: !0 });
+  const a = N(n);
+  return /* @__PURE__ */ r(
+    R,
     {
-      color: s ? "var(--mantine-color-body)" : c || i || l,
+      color: a ? "var(--mantine-color-body)" : m || c || n,
       size: 16,
       radius: "xl",
-      className: a.listItemSwatch,
+      className: s.listItemSwatch,
       styles: {
         root: {
-          border: `1.5px solid ${s ? "var(--mantine-color-default-border)" : i || n}`
+          border: `1.5px solid ${a ? "var(--mantine-color-default-border)" : c || i}`
         },
         alphaOverlay: { display: "none" },
         shadowOverlay: { display: "none" }
@@ -34,100 +34,113 @@ function j({
     }
   );
 }
-function v({
+function g({
   section: e,
-  columns: l,
-  onChange: n,
-  isDark: i
+  columns: n,
+  onChange: i,
+  isDark: c,
+  itemCaption: m
 }) {
-  const c = N(), { t: s } = g("ui"), d = l > 1;
-  return /* @__PURE__ */ y("div", { className: a.section, children: [
-    e.label && /* @__PURE__ */ t("div", { className: a.sectionLabel, children: e.label }),
-    /* @__PURE__ */ t(
+  const a = E(), { t: v } = x("ui"), y = n > 1;
+  return /* @__PURE__ */ C("div", { className: s.section, children: [
+    e.label && /* @__PURE__ */ r("div", { className: s.sectionLabel, children: e.label }),
+    /* @__PURE__ */ r(
       "div",
       {
-        className: d ? a.grid : void 0,
-        style: d ? { gridTemplateColumns: `repeat(${l}, minmax(0, 1fr))` } : void 0,
+        className: y ? s.grid : void 0,
+        style: y ? { gridTemplateColumns: `repeat(${n}, minmax(0, 1fr))` } : void 0,
         children: e.colors.map((u) => {
           const {
-            value: o,
-            label: f,
+            value: l,
+            label: b,
             border: p,
-            bg: h
-          } = $(u), r = b(o), m = o === e.value, C = r ? i ? "#FFFFFF" : "#000000" : S(o, c), I = D(s, o, f);
-          return /* @__PURE__ */ y(
+            bg: f
+          } = I(u), t = N(l), d = K(l, e.value), h = t ? c ? "#FFFFFF" : "#000000" : O(l, a), o = $(v, l, b);
+          return /* @__PURE__ */ C(
             "button",
             {
               type: "button",
-              className: `${a.listItem} ${m ? a.listItemActive : ""}`,
-              onClick: () => n(o, e.key),
+              className: `${s.listItem} ${d ? s.listItemActive : ""}`,
+              onClick: () => i(l, e.key),
               children: [
-                /* @__PURE__ */ t(
+                /* @__PURE__ */ r(
                   j,
                   {
                     type: e.type,
-                    colorValue: o,
-                    resolvedColor: C,
+                    colorValue: l,
+                    resolvedColor: h,
                     border: p,
-                    bg: h
+                    bg: f
                   }
                 ),
-                /* @__PURE__ */ t("span", { className: a.listItemLabel, children: I }),
-                m && /* @__PURE__ */ t(
-                  x,
+                /* @__PURE__ */ r("span", { className: s.listItemLabel, children: o }),
+                m && /* @__PURE__ */ r("span", { className: s.listItemCaption, children: m }),
+                d && /* @__PURE__ */ r(
+                  T,
                   {
                     size: 16,
-                    icon: k,
+                    icon: L,
                     color: "var(--mantine-primary-color-filled)"
                   }
                 )
               ]
             },
-            o
+            l
           );
         })
       }
     )
   ] });
 }
-function q({
+function J({
   sections: e,
-  colors: l,
-  value: n,
-  onChange: i,
-  columns: c = 1,
-  withRecentColors: s
+  colors: n,
+  value: i,
+  onChange: c,
+  columns: m = 1,
+  withRecentColors: a
 }) {
-  const { colorScheme: d } = L(), u = d === "dark", { recentColors: o, addRecent: f } = w(), p = (r, m) => {
-    s && f(r, m), i?.(r, m);
-  }, h = e || (l ? [{ key: "default", label: "", colors: l, value: n }] : []);
-  return /* @__PURE__ */ y(F, { children: [
-    s && o.length > 0 && /* @__PURE__ */ t(
-      v,
+  const { t: v } = x("ui"), u = S("light", {
+    getInitialValueInEffect: !0
+  }) === "dark", { recentColors: l, addRecent: b } = M(), p = (o, k) => {
+    a && b(o, k), c?.(o, k);
+  }, f = e || (n ? [{ key: "default", label: "", colors: n, value: i }] : []), t = l[0], d = t ? f.find((o) => o.key === t.sectionKey)?.colors.find(
+    (o) => I(o).value === t.value
+  ) : void 0, h = d ? I(d) : void 0;
+  return /* @__PURE__ */ C(F, { w: "100%", children: [
+    a && t && /* @__PURE__ */ r(
+      g,
       {
         section: {
-          key: "__recent",
-          label: "Recently used",
-          colors: o.map((r) => r.value),
-          value: n
+          key: t.sectionKey ?? "",
+          label: v("colorPicker.recentlyUsed"),
+          type: D(t.sectionKey),
+          colors: [
+            {
+              value: t.value,
+              label: h?.label,
+              border: t.border ?? h?.border
+            }
+          ]
         },
         columns: 1,
+        itemCaption: z,
         onChange: p,
         isDark: u
       }
     ),
-    h.map((r) => /* @__PURE__ */ t(
-      v,
+    f.map((o) => /* @__PURE__ */ r(
+      g,
       {
-        section: r,
-        columns: c,
+        section: o,
+        columns: m,
         onChange: p,
         isDark: u
       },
-      r.key
+      o.key
     ))
   ] });
 }
 export {
-  q as ColorPickerList
+  J as ColorPickerList
 };

package/dist/components/ColorPicker/ColorPickerToolbar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ColorPickerToolbar.d.ts","sourceRoot":"","sources":["../../../src/components/ColorPicker/ColorPickerToolbar.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAMjE;6DAC6D;AAC7D,MAAM,WAAW,uBAAuB;IACtC,QAAQ,EAAE,YAAY,EAAE,CAAC;IACzB,QAAQ,EAAE,mBAAmB,CAAC;IAC9B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAsCD,eAAO,MAAM,kBAAkB,oHA+L9B,CAAC"}
+{"version":3,"file":"ColorPickerToolbar.d.ts","sourceRoot":"","sources":["../../../src/components/ColorPicker/ColorPickerToolbar.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAYjE;6DAC6D;AAC7D,MAAM,WAAW,uBAAuB;IACtC,QAAQ,EAAE,YAAY,EAAE,CAAC;IACzB,QAAQ,EAAE,mBAAmB,CAAC;IAC9B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAsCD,eAAO,MAAM,kBAAkB,oHA0M9B,CAAC"}

package/dist/components/ColorPicker/ColorPickerToolbar.js

@@ -1,107 +1,112 @@
-import { jsxs as g, jsx as r } from "react/jsx-runtime";
-import { forwardRef as H, useState as j, useCallback as S, useMemo as P } from "react";
-import { useTranslation as U } from "react-i18next";
-import { useMantineColorScheme as q, Box as h, Flex as B, Tooltip as E, UnstyledButton as G } from "@mantine/core";
-import { TextColorIcon as K, HighlightSwatch as T } from "./icons.js";
-import { normalizeColorItem as w, resolveColorLabel as z, isDefaultColor as J } from "./types.js";
-import { useRecentColors as O } from "./useRecentColors.js";
-import n from "./ColorPicker.module.css.js";
+import { jsxs as k, jsx as t } from "react/jsx-runtime";
+import { forwardRef as y, useState as M, useCallback as g, useMemo as O } from "react";
+import { useTranslation as j } from "react-i18next";
+import { useComputedColorScheme as P, Box as u, Flex as I, Tooltip as U, UnstyledButton as _ } from "@mantine/core";
+import { TextColorIcon as K, HighlightSwatch as A } from "./icons.js";
+import { normalizeColorItem as w, resolveColorLabel as B, isDefaultColor as q, RECENT_COLOR_HOTKEY as V, colorsEqual as Y } from "./types.js";
+import { useRecentColors as G } from "./useRecentColors.js";
+import r from "./ColorPicker.module.css.js";
 function v({
-  isActive: a,
+  isActive: m,
   round: d,
-  disabled: u,
+  disabled: h,
   onClick: f,
   children: i,
   tooltipLabel: p
 }) {
-  const b = /* @__PURE__ */ r(
-    G,
+  const b = /* @__PURE__ */ t(
+    _,
     {
       type: "button",
-      className: `${n.inlineSwatch}${d ? ` ${n.inlineSwatchRound}` : ""}${a ? ` ${n.inlineSwatchActive}` : ""}`,
-      onMouseDown: (m) => m.preventDefault(),
+      className: `${r.inlineSwatch}${d ? ` ${r.inlineSwatchRound}` : ""}${m ? ` ${r.inlineSwatchActive}` : ""}`,
+      onMouseDown: (a) => a.preventDefault(),
       onClick: f,
-      disabled: u,
+      disabled: h,
       children: i
     }
   );
-  return p ? /* @__PURE__ */ r(E, { label: p, withArrow: !0, zIndex: 300, children: b }) : b;
+  return p ? /* @__PURE__ */ t(U, { label: p, withArrow: !0, zIndex: 400, children: b }) : b;
 }
-const oe = H(
+const re = y(
   ({
-    sections: a,
+    sections: m,
     onChange: d,
-    withRecentColors: u,
-    maxRecentColors: f = 9,
+    withRecentColors: h,
+    maxRecentColors: f = 10,
     disabled: i,
-    recentColorsLabel: p = "Recently used"
+    recentColorsLabel: p
   }, b) => {
-    const { t: m } = U("ui"), { colorScheme: D } = q(), x = D === "dark", { recentColors: I, addRecent: $ } = O({
+    const { t: a } = j("ui"), E = p ?? a("colorPicker.recentlyUsed"), L = P("light", {
+      getInitialValueInEffect: !0
+    }) === "dark", { recentColors: z, addRecent: x } = G({
       maxItems: f
-    }), [L, M] = j(I), k = S(
+    }), [$, D] = M(z), C = g(
       (e, o, c) => {
-        u && ($(e, o, c), M((l) => {
-          const t = l.filter(
+        h && (x(e, o, c), D((l) => {
+          const n = l.filter(
             (s) => !(s.value === e && s.sectionKey === o)
           );
-          return [{ value: e, sectionKey: o, border: c }, ...t].slice(
+          return [{ value: e, sectionKey: o, border: c }, ...n].slice(
             0,
             f
           );
         })), d(e, o);
       },
-      [d, u, $]
-    ), C = P(() => {
+      [d, h, x]
+    ), S = O(() => {
       const e = {};
-      for (const o of a) e[o.key] = o;
+      for (const o of m) e[o.key] = o;
       return e;
-    }, [a]), y = S(
+    }, [m]), H = g(
       (e, o) => {
-        const l = (o ? C[o] : void 0)?.colors.find(
+        const l = (o ? S[o] : void 0)?.colors.find(
           (s) => w(s).value === e
-        ), t = l ? w(l).label : void 0;
-        return z(m, e, t);
+        ), n = l ? w(l).label : void 0;
+        return B(a, e, n);
       },
-      [C, m]
-    ), F = S(
-      (e) => J(e) ? x ? "#FFFFFF" : "#000000" : e,
-      [x]
+      [S, a]
+    ), N = g(
+      (e) => q(e) ? L ? "#FFFFFF" : "#000000" : e,
+      [L]
     );
-    return /* @__PURE__ */ g(h, { ref: b, children: [
-      u && L.length > 0 && /* @__PURE__ */ g(h, { className: n.inlineSection, children: [
-        /* @__PURE__ */ r(h, { className: n.inlineSectionLabel, children: p }),
-        /* @__PURE__ */ r(B, { className: n.inlineRow, gap: 2, children: L.map((e, o) => {
-          const c = e.sectionKey ? C[e.sectionKey] : void 0, l = c?.key === "textColor" || c?.key === "color" || e.sectionKey === "color", t = y(
+    return /* @__PURE__ */ k(u, { ref: b, children: [
+      h && $.length > 0 && /* @__PURE__ */ k(u, { className: r.inlineSection, children: [
+        /* @__PURE__ */ k(u, { className: r.inlineSectionLabelRow, children: [
+          /* @__PURE__ */ t(u, { className: r.inlineSectionLabel, children: E }),
+          /* @__PURE__ */ t("span", { className: r.inlineSectionCaption, children: V })
+        ] }),
+        /* @__PURE__ */ t(I, { className: r.inlineRow, gap: 2, children: $.map((e, o) => {
+          const c = e.sectionKey ? S[e.sectionKey] : void 0, l = c?.key === "textColor" || c?.key === "color" || e.sectionKey === "color", n = H(
             e.value,
             e.sectionKey
           );
-          return l ? /* @__PURE__ */ r(
+          return l ? /* @__PURE__ */ t(
             v,
             {
               isActive: !1,
               disabled: i,
-              tooltipLabel: t,
-              onClick: () => k(e.value, e.sectionKey ?? ""),
-              children: /* @__PURE__ */ r(
+              tooltipLabel: n,
+              onClick: () => C(e.value, e.sectionKey ?? ""),
+              children: /* @__PURE__ */ t(
                 K,
                 {
                   size: 20,
-                  color: F(e.value),
+                  color: N(e.value),
                   showBorder: !0
                 }
               )
             },
             `${e.sectionKey}-${e.value}-${o}`
-          ) : /* @__PURE__ */ r(
+          ) : /* @__PURE__ */ t(
             v,
             {
               isActive: !1,
               round: !0,
               disabled: i,
-              tooltipLabel: t,
-              onClick: () => k(e.value, e.sectionKey ?? ""),
-              children: /* @__PURE__ */ r(
-                T,
+              tooltipLabel: n,
+              onClick: () => C(e.value, e.sectionKey ?? ""),
+              children: /* @__PURE__ */ t(
+                A,
                 {
                   bgColor: e.value,
                   borderColor: e.border || "var(--mantine-color-default-border)"
@@ -112,37 +117,37 @@ const oe = H(
           );
         }) })
       ] }),
-      a.map((e) => {
+      m.map((e) => {
         const o = e.key === "highlight" || e.key === "background" || e.key === "textHighlight";
-        return /* @__PURE__ */ g(h, { className: n.inlineSection, children: [
-          e.label && /* @__PURE__ */ r(h, { className: n.inlineSectionLabel, children: e.label }),
-          /* @__PURE__ */ r(B, { className: n.inlineRow, gap: 2, children: e.colors.map((c) => {
-            const { value: l, border: t, label: s } = w(c), N = l === e.value, R = F(l), A = z(m, l, s);
-            return o ? /* @__PURE__ */ r(
+        return /* @__PURE__ */ k(u, { className: r.inlineSection, children: [
+          e.label && /* @__PURE__ */ t(u, { className: r.inlineSectionLabel, children: e.label }),
+          /* @__PURE__ */ t(I, { className: r.inlineRow, gap: 2, children: e.colors.map((c) => {
+            const { value: l, border: n, label: s } = w(c), R = Y(l, e.value), F = N(l), T = B(a, l, s);
+            return o ? /* @__PURE__ */ t(
               v,
               {
-                isActive: N,
+                isActive: R,
                 round: !0,
                 disabled: i,
-                tooltipLabel: A,
-                onClick: () => k(l, e.key, t),
-                children: /* @__PURE__ */ r(
-                  T,
+                tooltipLabel: T,
+                onClick: () => C(l, e.key, n),
+                children: /* @__PURE__ */ t(
+                  A,
                   {
                     bgColor: l,
-                    borderColor: t || R
+                    borderColor: n || F
                   }
                 )
               },
               l
-            ) : /* @__PURE__ */ r(
+            ) : /* @__PURE__ */ t(
               v,
               {
-                isActive: N,
+                isActive: R,
                 disabled: i,
-                tooltipLabel: A,
-                onClick: () => k(l, e.key),
-                children: /* @__PURE__ */ r(K, { size: 20, color: R, showBorder: !0 })
+                tooltipLabel: T,
+                onClick: () => C(l, e.key),
+                children: /* @__PURE__ */ t(K, { size: 20, color: F, showBorder: !0 })
               },
               l
             );
@@ -153,5 +158,5 @@ const oe = H(
   }
 );
 export {
-  oe as ColorPickerToolbar
+  re as ColorPickerToolbar
 };

package/dist/components/ColorPicker/icons.js

@@ -1,10 +1,10 @@
-import { jsx as n, jsxs as c } from "react/jsx-runtime";
+import { jsx as n, jsxs as a } from "react/jsx-runtime";
 function s({
   size: t = 20,
   color: r = "var(--mantine-color-white)",
   showBorder: e
 }) {
-  return /* @__PURE__ */ c(
+  return /* @__PURE__ */ a(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
@@ -21,7 +21,7 @@ function s({
             width: "19",
             height: "19",
             rx: "5.5",
-            stroke: "var(--mantine-color-gray-4)",
+            stroke: "light-dark(var(--mantine-color-gray-4), var(--mantine-color-dark-4))",
             strokeWidth: "1",
             fill: "none"
           }
@@ -37,7 +37,7 @@ function s({
     }
   );
 }
-function w({
+function d({
   size: t = 24,
   bgColor: r,
   borderColor: e
@@ -66,6 +66,6 @@ function w({
   );
 }
 export {
-  w as HighlightSwatch,
+  d as HighlightSwatch,
   s as TextColorIcon
 };

package/dist/components/ColorPicker/types.d.ts

@@ -18,6 +18,11 @@ export interface RecentColorEntry {
     sectionKey?: string;
     border?: string;
 }
+export type RecentColorKind = 'text' | 'highlight';
+export declare function isTextSectionKey(sectionKey?: string): boolean;
+export declare function resolveRecentKind(sectionKey?: string): RecentColorKind;
+export declare const IS_APPLE: boolean;
+export declare const RECENT_COLOR_HOTKEY: string;
 export type ColorPickerOnChange = (value: string, sectionKey?: string) => void;
 export interface ColorPickerBaseProps {
     colors?: ColorItem[];
@@ -47,5 +52,6 @@ export declare function normalizeColorItem(item: ColorItem): {
     bg?: string;
 };
 export declare function isDefaultColor(value: string): boolean;
+export declare function colorsEqual(a?: string | null, b?: string | null): boolean;
 export declare const resolveColorLabel: (t: TFunction, value: string | null | undefined, explicitLabel?: string) => string;
 //# sourceMappingURL=types.d.ts.map

package/dist/components/ColorPicker/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/ColorPicker/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEzC,MAAM,MAAM,SAAS,GACjB,MAAM,GACN;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IAAC,EAAE,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAEpE,MAAM,WAAW,YAAY;IAC3B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,SAAS,EAAE,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,GAAG,WAAW,CAAC;CAC7B;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,MAAM,mBAAmB,GAAG,CAAC,KAAK,EAAE,MAAM,EAAE,UAAU,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;AAE/E,MAAM,WAAW,oBAAoB;IACnC,MAAM,CAAC,EAAE,SAAS,EAAE,CAAC;IACrB,QAAQ,CAAC,EAAE,YAAY,EAAE,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,mBAAmB,CAAC;IAC/B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,sBACf,SAAQ,oBAAoB,EAC1B,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IAC7B,WAAW,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAClC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,MAAM,WAAW,oBAAqB,SAAQ,oBAAoB;IAChE,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,uBACf,SAAQ,IAAI,CAAC,oBAAoB,EAAE,UAAU,GAAG,kBAAkB,CAAC,EACjE,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IAC7B,WAAW,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;CACnC;AAED,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,SAAS,GAAG;IACnD,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,EAAE,CAAC,EAAE,MAAM,CAAC;CACb,CAEA;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAErD;AAED,eAAO,MAAM,iBAAiB,GAC5B,GAAG,SAAS,EACZ,OAAO,MAAM,GAAG,IAAI,GAAG,SAAS,EAChC,gBAAgB,MAAM,KACrB,MAIF,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/ColorPicker/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEzC,MAAM,MAAM,SAAS,GACjB,MAAM,GACN;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IAAC,EAAE,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAEpE,MAAM,WAAW,YAAY;IAC3B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,SAAS,EAAE,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,GAAG,WAAW,CAAC;CAC7B;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,MAAM,eAAe,GAAG,MAAM,GAAG,WAAW,CAAC;AAEnD,wBAAgB,gBAAgB,CAAC,UAAU,CAAC,EAAE,MAAM,GAAG,OAAO,CAE7D;AAED,wBAAgB,iBAAiB,CAAC,UAAU,CAAC,EAAE,MAAM,GAAG,eAAe,CAEtE;AAED,eAAO,MAAM,QAAQ,SAEoD,CAAC;AAE1E,eAAO,MAAM,mBAAmB,QAAoC,CAAC;AAErE,MAAM,MAAM,mBAAmB,GAAG,CAAC,KAAK,EAAE,MAAM,EAAE,UAAU,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;AAE/E,MAAM,WAAW,oBAAoB;IACnC,MAAM,CAAC,EAAE,SAAS,EAAE,CAAC;IACrB,QAAQ,CAAC,EAAE,YAAY,EAAE,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,mBAAmB,CAAC;IAC/B,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,sBACf,SAAQ,oBAAoB,EAC1B,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IAC7B,WAAW,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAClC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B;AAED,MAAM,WAAW,oBAAqB,SAAQ,oBAAoB;IAChE,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,uBACf,SAAQ,IAAI,CAAC,oBAAoB,EAAE,UAAU,GAAG,kBAAkB,CAAC,EACjE,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IAC7B,WAAW,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;CACnC;AAED,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,SAAS,GAAG;IACnD,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,EAAE,CAAC,EAAE,MAAM,CAAC;CACb,CAEA;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAErD;AA0CD,wBAAgB,WAAW,CAAC,CAAC,CAAC,EAAE,MAAM,GAAG,IAAI,EAAE,CAAC,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,OAAO,CAIzE;AAED,eAAO,MAAM,iBAAiB,GAC5B,GAAG,SAAS,EACZ,OAAO,MAAM,GAAG,IAAI,GAAG,SAAS,EAChC,gBAAgB,MAAM,KACrB,MAIF,CAAC"}