@layers-app/shared 0.3.8 → 0.4.0

package/dist/components/ColorPicker/ColorPickerList.js

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

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

@@ -0,0 +1,13 @@
+import type { ColorPickerOnChange, ColorSection } from './types';
+/** Toolbar dropdown with text colors (A icons) + highlights (circles) + recently used.
+ * Use inside Menu.Dropdown, Popover, or floating toolbar. */
+export interface ColorPickerToolbarProps {
+    sections: ColorSection[];
+    onChange: ColorPickerOnChange;
+    withRecentColors?: boolean;
+    maxRecentColors?: number;
+    disabled?: boolean;
+    recentColorsLabel?: string;
+}
+export declare const ColorPickerToolbar: import("react").ForwardRefExoticComponent<ColorPickerToolbarProps & import("react").RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=ColorPickerToolbar.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ColorPickerToolbar.d.ts","sourceRoot":"","sources":["../../../src/components/ColorPicker/ColorPickerToolbar.tsx"],"names":[],"mappings":"AAMA,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,oHA2K7B,CAAC"}

package/dist/components/ColorPicker/ColorPickerToolbar.js

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

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

@@ -0,0 +1,11 @@
+export declare function TextColorIcon({ size, color, showBorder, }: {
+    size?: number;
+    color?: string;
+    showBorder?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function HighlightSwatch({ size, bgColor, borderColor, }: {
+    size?: number;
+    bgColor: string;
+    borderColor: string;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=icons.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"icons.d.ts","sourceRoot":"","sources":["../../../src/components/ColorPicker/icons.tsx"],"names":[],"mappings":"AAAA,wBAAgB,aAAa,CAAC,EAC5B,IAAS,EACT,KAAoC,EACpC,UAAU,GACX,EAAE;IACD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,2CAgCA;AAED,wBAAgB,eAAe,CAAC,EAC9B,IAAS,EACT,OAAO,EACP,WAAW,GACZ,EAAE;IACD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,EAAE,MAAM,CAAC;CACrB,2CA4BA"}

package/dist/components/ColorPicker/icons.js

@@ -0,0 +1,71 @@
+import { jsx as n, jsxs as c } from "react/jsx-runtime";
+function s({
+  size: t = 20,
+  color: r = "var(--mantine-color-white)",
+  showBorder: e
+}) {
+  return /* @__PURE__ */ c(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: t,
+      height: t,
+      viewBox: "0 0 20 20",
+      fill: "none",
+      children: [
+        e && /* @__PURE__ */ n(
+          "rect",
+          {
+            x: "0.5",
+            y: "0.5",
+            width: "19",
+            height: "19",
+            rx: "5.5",
+            stroke: "var(--mantine-color-default-border)",
+            strokeWidth: "1",
+            fill: "none"
+          }
+        ),
+        /* @__PURE__ */ n("g", { transform: "translate(4.54, 4.2) scale(0.95)", children: /* @__PURE__ */ n(
+          "path",
+          {
+            d: "M5.74945 0C6.57421 0 7.09678 0.678265 7.50336 1.43555C7.93323 2.23628 8.38332 3.42022 8.95843 4.92676L11.4623 11.4873C11.5716 11.7742 11.4279 12.0955 11.1411 12.2051C10.8541 12.3144 10.5329 12.1706 10.4233 11.8838L8.5766 7.04883H2.9223L1.07562 11.8838C0.965974 12.1707 0.644849 12.3146 0.357848 12.2051C0.0710441 12.0955 -0.0726477 11.7742 0.0365593 11.4873L2.54047 4.92676C3.11563 3.42012 3.56662 2.23629 3.99652 1.43555C4.40306 0.678393 4.92485 8.51363e-05 5.74945 0ZM5.74945 1.11328C5.62925 1.11335 5.38778 1.19685 4.97699 1.96191C4.5893 2.68404 4.16803 3.7852 3.5805 5.32422L3.34711 5.93555H8.15179L7.9184 5.32422C7.33089 3.78522 6.9096 2.68403 6.52191 1.96191C6.11099 1.19664 5.86959 1.11328 5.74945 1.11328Z",
+            fill: r === "inherit" || r === "currentColor" ? "var(--mantine-color-white)" : r
+          }
+        ) })
+      ]
+    }
+  );
+}
+function d({
+  size: t = 24,
+  bgColor: r,
+  borderColor: e
+}) {
+  const o = r === "inherit" || r === "" || r === "default", i = t / 2 - 2, l = o ? "var(--mantine-color-body)" : r, h = o ? "var(--mantine-color-default-border)" : e;
+  return /* @__PURE__ */ n(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: t,
+      height: t,
+      viewBox: `0 0 ${t} ${t}`,
+      fill: "none",
+      children: /* @__PURE__ */ n(
+        "circle",
+        {
+          cx: t / 2,
+          cy: t / 2,
+          r: i,
+          fill: l,
+          stroke: h,
+          strokeWidth: "1"
+        }
+      )
+    }
+  );
+}
+export {
+  d as HighlightSwatch,
+  s as TextColorIcon
+};

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

@@ -0,0 +1,49 @@
+import type { FlexProps } from '@mantine/core';
+export type ColorItem = string | {
+    value: string;
+    label?: string;
+    border?: string;
+    bg?: string;
+};
+export interface ColorSection {
+    key: string;
+    label: string;
+    colors: ColorItem[];
+    value?: string;
+    type?: 'text' | 'highlight';
+}
+export interface RecentColorEntry {
+    value: string;
+    sectionKey?: string;
+    border?: string;
+}
+export type ColorPickerOnChange = (value: string, sectionKey?: string) => void;
+export interface ColorPickerBaseProps {
+    colors?: ColorItem[];
+    sections?: ColorSection[];
+    value?: string;
+    onChange?: ColorPickerOnChange;
+    withRecentColors?: boolean;
+    maxRecentColors?: number;
+    swatchSize?: number;
+    withTick?: boolean;
+}
+export interface ColorPickerInlineProps extends ColorPickerBaseProps, Omit<FlexProps, 'onChange'> {
+    swatchShape?: 'circle' | 'square';
+    fullWidth?: boolean;
+    allowCustomColor?: boolean;
+}
+export interface ColorPickerListProps extends ColorPickerBaseProps {
+    columns?: number;
+}
+export interface ColorPickerCompactProps extends Omit<ColorPickerBaseProps, 'sections' | 'withRecentColors'>, Omit<FlexProps, 'onChange'> {
+    swatchShape?: 'circle' | 'square';
+}
+export declare function normalizeColorItem(item: ColorItem): {
+    value: string;
+    label: string;
+    border?: string;
+    bg?: string;
+};
+export declare function isDefaultColor(value: string): boolean;
+//# sourceMappingURL=types.d.ts.map

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

@@ -0,0 +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;AAE/C,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG;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;AAEjG,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,CAChC,KAAK,EAAE,MAAM,EACb,UAAU,CAAC,EAAE,MAAM,KAChB,IAAI,CAAC;AAEV,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,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,EAAE,CAAC,EAAE,MAAM,CAAC;CACb,CAKA;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAErD"}

package/dist/components/ColorPicker/types.js

@@ -0,0 +1,10 @@
+function n(r) {
+  return typeof r == "string" ? { value: r, label: r } : { label: r.value, ...r };
+}
+function l(r) {
+  return r === "inherit" || r === "" || r === "default";
+}
+export {
+  l as isDefaultColor,
+  n as normalizeColorItem
+};

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

@@ -0,0 +1,13 @@
+import type { RecentColorEntry } from './types';
+interface UseRecentColorsOptions {
+    storageKey?: string;
+    maxItems?: number;
+}
+export declare function useRecentColors(options?: UseRecentColorsOptions): {
+    recentColors: RecentColorEntry[];
+    addRecent: (value: string, sectionKey?: string, border?: string) => void;
+    clearRecent: () => void;
+    reload: () => void;
+};
+export {};
+//# sourceMappingURL=useRecentColors.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useRecentColors.d.ts","sourceRoot":"","sources":["../../../src/components/ColorPicker/useRecentColors.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAKhD,UAAU,sBAAsB;IAC9B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAmBD,wBAAgB,eAAe,CAAC,OAAO,CAAC,EAAE,sBAAsB;;uBAYpD,MAAM,eAAe,MAAM,WAAW,MAAM;;;EAsBvD"}

package/dist/components/ColorPicker/useRecentColors.js

@@ -0,0 +1,39 @@
+import { useState as I, useCallback as c } from "react";
+const d = "color-picker-recent", p = 11;
+function n(e) {
+  try {
+    const t = localStorage.getItem(e);
+    return t ? JSON.parse(t) : [];
+  } catch {
+    return [];
+  }
+}
+function E(e, t, o) {
+  try {
+    localStorage.setItem(e, JSON.stringify(t.slice(0, o)));
+  } catch {
+  }
+}
+function v(e) {
+  const t = e?.storageKey ?? d, o = e?.maxItems ?? p, [i, r] = I(() => n(t)), S = c(() => {
+    r(n(t));
+  }, [t]), g = c(
+    (s, a, f) => {
+      const y = n(t).filter(
+        (m) => !(m.value === s && m.sectionKey === a)
+      ), l = [{ value: s, sectionKey: a, border: f }, ...y].slice(0, o);
+      E(t, l, o), r(l);
+    },
+    [t, o]
+  ), u = c(() => {
+    try {
+      localStorage.removeItem(t);
+    } catch {
+    }
+    r([]);
+  }, [t]);
+  return { recentColors: i, addRecent: g, clearRecent: u, reload: S };
+}
+export {
+  v as useRecentColors
+};

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

@@ -1,15 +1,15 @@
-const o = "_commentComposerWrapper_1mv8w_1", e = "_commentComposerFloat_1mv8w_68", r = "_composerContainer_1mv8w_97", t = "_editorWrapper_1mv8w_113", m = "_editMode_1mv8w_181", p = {
+const o = "_commentComposerWrapper_f5dl7_1", e = "_commentComposerFloat_f5dl7_135", r = "_composerContainer_f5dl7_193", t = "_editorWrapper_f5dl7_225", p = "_editMode_f5dl7_361", m = {
   commentComposerWrapper: o,
   commentComposerFloat: e,
   composerContainer: r,
   editorWrapper: t,
-  editMode: m
+  editMode: p
 };
 export {
   e as commentComposerFloat,
   o as commentComposerWrapper,
   r as composerContainer,
-  p as default,
-  m as editMode,
+  m as default,
+  p as editMode,
   t as editorWrapper
 };

package/dist/components/CommentComposer/CommentEditorHotkeys.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CommentEditorHotkeys.d.ts","sourceRoot":"","sources":["../../../src/components/CommentComposer/CommentEditorHotkeys.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAIjD,OAAO,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAI/C,eAAO,MAAM,oBAAoB,GAAI,8GAWlC;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,EAAE,KAAK,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC;IACvC,iBAAiB,EAAE,KAAK,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC;IAC/C,YAAY,EAAE;QACZ,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,EAAE,oBAAoB,CAAC,iBAAiB,EAAE,CAAC;KACjD,CAAC;IACF,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,OAAO,CAAC;IAChB,UAAU,EAAE,OAAO,CAAC;IACpB,EAAE,EAAE,MAAM,CAAC;CACZ,4CAuJA,CAAC"}
+{"version":3,"file":"CommentEditorHotkeys.d.ts","sourceRoot":"","sources":["../../../src/components/CommentComposer/CommentEditorHotkeys.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAIjD,OAAO,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAI/C,eAAO,MAAM,oBAAoB,GAAI,8GAWlC;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,EAAE,KAAK,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC;IACvC,iBAAiB,EAAE,KAAK,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC;IAC/C,YAAY,EAAE;QACZ,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,EAAE,oBAAoB,CAAC,iBAAiB,EAAE,CAAC;KACjD,CAAC;IACF,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,OAAO,CAAC;IAChB,UAAU,EAAE,OAAO,CAAC;IACpB,EAAE,EAAE,MAAM,CAAC;CACZ,4CAwJA,CAAC"}

package/dist/components/CommentComposer/CommentEditorHotkeys.js

@@ -1,6 +1,6 @@
 import { jsx as S } from "react/jsx-runtime";
-import { useRef as D, useEffect as m } from "react";
-import { useTranslation as T } from "react-i18next";
+import { useRef as x, useEffect as m } from "react";
+import { useTranslation as D } from "react-i18next";
 import { openRemoveConfirmModal as g } from "../modals/RemoveConfirmModal.js";
 import w from "./CommentComposer.module.css.js";
 const W = ({
@@ -15,7 +15,7 @@ const W = ({
   hasChanges: s,
   ns: P
 }) => {
-  const p = D(null), L = i || f, { t: r } = T(P);
+  const p = x(null), L = i || f, { t: r } = D(P);
   return m(() => {
     const o = (e) => {
       if (e.code === "Enter" && !e.shiftKey) {
@@ -85,6 +85,7 @@ const W = ({
                 cancel: r("editor.composer.cancel")
               },
               icon: null,
+              zIndex: 301,
               onConfirm: () => c?.()
             });
             return;

package/dist/components/CommentComposer/index.js

@@ -296,7 +296,7 @@ const Ne = ({
       offset: 10,
       withinPortal: !1,
       floatingStrategy: "fixed",
-      zIndex: 100,
+      zIndex: 300,
       middlewares: {
         flip: { padding: 8 },
         shift: { padding: 8 },

package/dist/components/CommentComposer/useVirtualAnchor.d.ts

@@ -10,6 +10,6 @@ interface UseVirtualAnchorProps {
         elements: HTMLSpanElement[];
     };
 }
-export declare function useVirtualAnchor({ isFloat, updateLocation, selectionRef, selectionState, }: UseVirtualAnchorProps): import("react").RefObject<HTMLDivElement | null>;
+export declare function useVirtualAnchor({ isFloat, updateLocation, selectionRef, selectionState, }: UseVirtualAnchorProps): import("react").MutableRefObject<HTMLDivElement | null>;
 export {};
 //# sourceMappingURL=useVirtualAnchor.d.ts.map

package/dist/components/CommentComposer/useVirtualAnchor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useVirtualAnchor.d.ts","sourceRoot":"","sources":["../../../src/components/CommentComposer/useVirtualAnchor.ts"],"names":[],"mappings":"AAEA,UAAU,qBAAqB;IAC7B,OAAO,EAAE,OAAO,CAAC;IACjB,cAAc,CAAC,EAAE,CACf,OAAO,EAAE,cAAc,EACvB,YAAY,EAAE,KAAK,CAAC,gBAAgB,CAAC,GAAG,CAAC,EACzC,cAAc,EAAE;QACd,SAAS,EAAE,cAAc,CAAC;QAC1B,QAAQ,EAAE,eAAe,EAAE,CAAC;KAC7B,KACE,IAAI,CAAC;IACV,YAAY,EAAE,KAAK,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC;IAC1C,cAAc,EAAE;QACd,SAAS,EAAE,cAAc,CAAC;QAC1B,QAAQ,EAAE,eAAe,EAAE,CAAC;KAC7B,CAAC;CACH;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,OAAO,EACP,cAAc,EACd,YAAY,EACZ,cAAc,GACf,EAAE,qBAAqB,oDAsHvB"}
+{"version":3,"file":"useVirtualAnchor.d.ts","sourceRoot":"","sources":["../../../src/components/CommentComposer/useVirtualAnchor.ts"],"names":[],"mappings":"AAEA,UAAU,qBAAqB;IAC7B,OAAO,EAAE,OAAO,CAAC;IACjB,cAAc,CAAC,EAAE,CACf,OAAO,EAAE,cAAc,EACvB,YAAY,EAAE,KAAK,CAAC,gBAAgB,CAAC,GAAG,CAAC,EACzC,cAAc,EAAE;QACd,SAAS,EAAE,cAAc,CAAC;QAC1B,QAAQ,EAAE,eAAe,EAAE,CAAC;KAC7B,KACE,IAAI,CAAC;IACV,YAAY,EAAE,KAAK,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC;IAC1C,cAAc,EAAE;QACd,SAAS,EAAE,cAAc,CAAC;QAC1B,QAAQ,EAAE,eAAe,EAAE,CAAC;KAC7B,CAAC;CACH;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,OAAO,EACP,cAAc,EACd,YAAY,EACZ,cAAc,GACf,EAAE,qBAAqB,2DAsHvB"}

package/dist/components/CommunitiesDialog/styles.module.css.js

@@ -1,4 +1,4 @@
-const s = "_section_s7rqu_1", t = {
+const s = "_section_6nzxb_1", t = {
   section: s
 };
 export {

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

@@ -1,4 +1,4 @@
-const r = "_brandingWrapper_vvk0o_1", a = {
+const r = "_brandingWrapper_ag0no_1", a = {
   brandingWrapper: r
 };
 export {

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

@@ -1,4 +1,4 @@
-const o = "_root_195do_1", t = {
+const o = "_root_122b9_1", t = {
   root: o
 };
 export {

package/dist/components/EmojiPicker/EmojiPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EmojiPanel.d.ts","sourceRoot":"","sources":["../../../src/components/EmojiPicker/EmojiPanel.tsx"],"names":[],"mappings":"AAyCA,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAsBjD,eAAO,MAAM,UAAU,GAAI,6DAMxB,IAAI,CAAC,gBAAgB,EAAE,SAAS,GAAG,OAAO,GAAG,UAAU,GAAG,aAAa,CAAC,GAAG;IAC5E,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,aAAa,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC,4CAmTA,CAAC"}
+{"version":3,"file":"EmojiPanel.d.ts","sourceRoot":"","sources":["../../../src/components/EmojiPicker/EmojiPanel.tsx"],"names":[],"mappings":"AAyCA,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAsBjD,eAAO,MAAM,UAAU,GAAI,6DAMxB,IAAI,CAAC,gBAAgB,EAAE,SAAS,GAAG,OAAO,GAAG,UAAU,GAAG,aAAa,CAAC,GAAG;IAC5E,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,aAAa,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC,4CAiTA,CAAC"}