@bigbinary/neeto-atoms 1.0.8 → 1.0.9

package/dist/ColorPicker-D-7QGnf9.js

@@ -0,0 +1,277 @@
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { useCallback, useSyncExternalStore, forwardRef, useState, useRef } from 'react';
+import { useTranslation } from 'react-i18next';
+import { HexAlphaColorPicker, HexColorPicker, HexColorInput } from 'react-colorful';
+import { Button } from './primitives/Button.js';
+import { Popover, PopoverTrigger, PopoverContent } from './primitives/Popover.js';
+import { c as cn } from './utils-DdHUxIdC.js';
+import { c as cva } from './index-D7Zy7P05.js';
+import { C as ChevronDown } from './chevron-down-BNi0ntys.js';
+import { c as createLucideIcon } from './createLucideIcon-C8ycilSN.js';
+
+/**
+ * @license lucide-react v0.577.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+
+
+const __iconNode = [
+  [
+    "path",
+    {
+      d: "m12 9-8.414 8.414A2 2 0 0 0 3 18.828v1.344a2 2 0 0 1-.586 1.414A2 2 0 0 1 3.828 21h1.344a2 2 0 0 0 1.414-.586L15 12",
+      key: "1y3wsu"
+    }
+  ],
+  [
+    "path",
+    {
+      d: "m18 9 .4.4a1 1 0 1 1-3 3l-3.8-3.8a1 1 0 1 1 3-3l.4.4 3.4-3.4a1 1 0 1 1 3 3z",
+      key: "110lr1"
+    }
+  ],
+  ["path", { d: "m2 22 .414-.414", key: "jhxm08" }]
+];
+const Pipette = createLucideIcon("pipette", __iconNode);
+
+const isSupported = typeof window !== "undefined" && "EyeDropper" in window;
+const useEyeDropper = () => {
+    const open = useCallback(async () => {
+        if (!window.EyeDropper)
+            throw new Error("EyeDropper API not supported");
+        const dropper = new window.EyeDropper();
+        const result = await dropper.open();
+        return result.sRGBHex;
+    }, []);
+    return { isSupported, open };
+};
+
+const DEFAULT_PALETTE_COLORS = [
+    { hex: "#FFFFFF" },
+    { hex: "#D6D6D6" },
+    { hex: "#0A0E13" },
+    { hex: "#FECE1E" },
+    { hex: "#F32E48" },
+    { hex: "#02C39A" },
+    { hex: "#2A79C4" },
+    { hex: "#B3E5FC" },
+    { hex: "#C3C6F9" },
+    { hex: "#8064CE" },
+    { hex: "#FE861E" },
+    { hex: "#FF7DC9" },
+    { hex: "#028090" },
+    { hex: "#095482" },
+];
+const RECENTLY_USED_STORAGE_KEY = "recently-used-colors";
+const PICKER_HEIGHT = {
+    small: "100px",
+    medium: "120px",
+    large: "140px",
+};
+
+const getFromStorage = (key, fallback) => {
+    try {
+        const stored = localStorage.getItem(key);
+        return stored ? JSON.parse(stored) : fallback;
+    }
+    catch {
+        return fallback;
+    }
+};
+const setToStorage = (key, value) => {
+    try {
+        localStorage.setItem(key, JSON.stringify(value));
+    }
+    catch {
+        // Silently fail if storage is unavailable
+    }
+};
+const createSyncedStore = (storageKey) => {
+    const listeners = new Set();
+    const store = {
+        value: getFromStorage(storageKey, []),
+        getSnapshot: () => store.value,
+        getServerSnapshot: () => [],
+        setValue: (newValue) => {
+            store.value = newValue;
+            setToStorage(storageKey, newValue);
+            listeners.forEach(listener => listener());
+        },
+        subscribe: (callback) => {
+            listeners.add(callback);
+            const storageEventHandler = (event) => {
+                if (event.key !== storageKey)
+                    return;
+                store.value = getFromStorage(storageKey, []);
+                listeners.forEach(listener => listener());
+            };
+            if (listeners.size === 1) {
+                window.addEventListener("storage", storageEventHandler);
+            }
+            return () => {
+                listeners.delete(callback);
+                if (listeners.size === 0) {
+                    window.removeEventListener("storage", storageEventHandler);
+                }
+            };
+        },
+    };
+    return store;
+};
+const store = createSyncedStore(RECENTLY_USED_STORAGE_KEY);
+const useRecentlyUsedColors = () => [
+    useSyncExternalStore(store.subscribe, store.getSnapshot, store.getServerSnapshot),
+    store.setValue,
+];
+
+/**
+ * Validates a hex color string (3, 4, 6, or 8 digits with optional #).
+ */
+const isValidHex = (hex) => /^#?([0-9A-Fa-f]{3}|[0-9A-Fa-f]{4}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(hex);
+/**
+ * Parses a hex color string into RGBA components.
+ * Returns { r: 0, g: 0, b: 0, a: 1 } for invalid inputs.
+ */
+const hexToRgb = (hex) => {
+    const raw = hex.replace(/^#/, "");
+    if (!/^([0-9A-Fa-f]{3}|[0-9A-Fa-f]{4}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(raw)) {
+        return { r: 0, g: 0, b: 0, a: 1 };
+    }
+    let r, g, b, a = 255;
+    if (raw.length === 3 || raw.length === 4) {
+        r = parseInt(raw[0] + raw[0], 16);
+        g = parseInt(raw[1] + raw[1], 16);
+        b = parseInt(raw[2] + raw[2], 16);
+        if (raw.length === 4)
+            a = parseInt(raw[3] + raw[3], 16);
+    }
+    else {
+        r = parseInt(raw.slice(0, 2), 16);
+        g = parseInt(raw.slice(2, 4), 16);
+        b = parseInt(raw.slice(4, 6), 16);
+        if (raw.length === 8)
+            a = parseInt(raw.slice(6, 8), 16);
+    }
+    return { r, g, b, a: Math.round((a / 255) * 100) / 100 };
+};
+/**
+ * Converts a hex color to an 8-digit hex string (#RRGGBBAA).
+ */
+const hexToHex8 = (hex) => {
+    const { r, g, b, a } = hexToRgb(hex);
+    const alpha = Math.round(a * 255);
+    return `#${[r, g, b, alpha].map(v => v.toString(16).padStart(2, "0")).join("")}`;
+};
+/**
+ * Converts a color value to a normalized { hex, rgb } object.
+ * Handles transparency and validity checks.
+ */
+const getColor = (colorValue, showTransparencyControl) => {
+    if (!isValidHex(colorValue)) {
+        return { hex: colorValue, rgb: { r: 0, g: 0, b: 0, a: 1 } };
+    }
+    const rgb = hexToRgb(colorValue);
+    if (rgb.a === 0) {
+        return { hex: colorValue, rgb };
+    }
+    const hex = showTransparencyControl
+        ? hexToHex8(colorValue)
+        : `#${colorValue.replace(/^#/, "").slice(0, 6)}`;
+    return { hex, rgb: hexToRgb(hex) };
+};
+
+const Palette = forwardRef(({ color, colorList = DEFAULT_PALETTE_COLORS, onChange, className, ...props }, ref) => (jsx("div", { ref: ref, className: cn("flex flex-row flex-wrap items-start justify-start gap-1", className), ...props, children: colorList.map(item => {
+        const value = item.hex ?? item.rgb ?? "";
+        const isActive = !!color && !!value && color.toLowerCase() === value.toLowerCase();
+        return (jsx("button", { type: "button", "data-testid": "color-palette-item", className: cn("size-6 rounded-[5px] border cursor-pointer overflow-hidden transition-colors", isActive
+                ? "border-muted-foreground"
+                : "border-border hover:border-muted-foreground/50"), onClick: () => onChange?.(value), children: jsx("span", { className: cn("block size-full", isValidHex(value)
+                    ? ""
+                    : "bg-[repeating-conic-gradient(#ccc_0_25%,transparent_0_50%)] bg-[length:8px_8px]"), style: isValidHex(value) ? { backgroundColor: value } : undefined }) }, value));
+    }) })));
+Palette.displayName = "ColorPicker.Palette";
+
+const targetVariants = cva("inline-flex items-center justify-between rounded-md border border-input bg-background transition-colors hover:border-muted-foreground focus-visible:outline-none focus-visible:border-primary focus-visible:ring-3 focus-visible:ring-primary/15 cursor-pointer", {
+    variants: {
+        size: {
+            small: "h-7 p-0.5 gap-2",
+            medium: "h-8 p-1 gap-2",
+            large: "h-10 p-1.5 gap-3",
+        },
+    },
+    defaultVariants: {
+        size: "large",
+    },
+});
+const Target = forwardRef(({ size = "large", showHexValue, color, colorValue, className, ...props }, ref) => (jsxs("button", { ref: ref, type: "button", "data-testid": "color-picker-target", className: cn(targetVariants({ size }), className), ...props, children: [showHexValue && (jsx("span", { className: "text-sm font-medium text-foreground min-w-[4.5rem] ps-1", children: color })), jsxs("span", { className: "inline-flex items-center gap-2", children: [jsx("span", { className: "block size-5 rounded-md border border-border", style: { backgroundColor: colorValue } }), jsx(ChevronDown, { className: "size-4 text-muted-foreground" })] })] })));
+Target.displayName = "ColorPicker.Target";
+
+const ColorPicker = forwardRef(({ color = "", size = "large", onChange, dropdownProps, showEyeDropper = true, showHexValue = false, showTransparencyControl = false, showPicker = true, showHexPicker = true, colorPalette, showRecentlyUsedColors = showPicker, className, }, ref) => {
+    const { t } = useTranslation();
+    const [colorInternal, setColorInternal] = useState(color);
+    const [isColorSelected, setIsColorSelected] = useState(false);
+    const [open, setOpen] = useState(false);
+    const hexColorInputValue = useRef("");
+    const { isSupported: eyeDropperSupported, open: openEyeDropper } = useEyeDropper();
+    const [recentlyUsedColors, setRecentlyUsedColors] = useRecentlyUsedColors();
+    const PickerComponent = showTransparencyControl
+        ? HexAlphaColorPicker
+        : HexColorPicker;
+    const colorValue = color ?? colorInternal ?? "";
+    const onColorChange = (value) => {
+        setIsColorSelected(true);
+        if (onChange) {
+            onChange(getColor(value, showTransparencyControl));
+        }
+        else {
+            setColorInternal(value);
+        }
+    };
+    const onColorInputChange = (hex) => {
+        hexColorInputValue.current = hex;
+        const expectedLength = showTransparencyControl ? 9 : 7;
+        if (hex.length !== expectedLength)
+            return;
+        onColorChange(hex);
+        hexColorInputValue.current = "";
+    };
+    const onBlur = () => {
+        if (!hexColorInputValue.current)
+            return;
+        onColorChange(hexColorInputValue.current);
+        hexColorInputValue.current = "";
+    };
+    const pickColor = async () => {
+        try {
+            const hex = await openEyeDropper();
+            onColorChange(hex);
+        }
+        catch {
+            // User cancelled or API unavailable
+        }
+    };
+    const onOpenChange = (nextOpen) => {
+        if (!nextOpen && showRecentlyUsedColors && isColorSelected) {
+            const newColor = getColor(colorValue, showTransparencyControl);
+            const filtered = recentlyUsedColors.filter(({ hex }) => hex !== newColor.hex);
+            const updated = [newColor, ...filtered];
+            if (updated.length > 14)
+                updated.pop();
+            setRecentlyUsedColors(updated);
+            setIsColorSelected(false);
+        }
+        setOpen(nextOpen);
+    };
+    return (jsxs(Popover, { open: open, onOpenChange: onOpenChange, children: [jsx(PopoverTrigger, { asChild: true, children: jsx(Target, { color: color, colorValue: colorValue, showHexValue: showHexValue, size: size }) }), jsx(PopoverContent, { ref: ref, align: "start", side: "bottom", className: cn("w-auto p-3", className), ...dropdownProps, children: jsxs("div", { className: "flex flex-col gap-3 w-56", children: [showPicker && (jsxs(Fragment, { children: [showHexPicker && (jsx("div", { "data-testid": "neeto-color-picker-section", style: {
+                                        ["--react-colorful-height"]: PICKER_HEIGHT[size] ?? "140px",
+                                    }, children: jsx(PickerComponent, { color: colorValue, onChange: onColorChange, style: {
+                                            width: "100%",
+                                            height: PICKER_HEIGHT[size] ?? "140px",
+                                        } }) })), jsxs("div", { className: "flex items-center justify-center gap-2", children: [showEyeDropper && eyeDropperSupported && (jsx(Button, { type: "button", variant: "ghost", size: "icon-sm", onClick: pickColor, "aria-label": t("neetoatoms.colorPicker.pickColor", "Pick color from screen"), children: jsx(Pipette, { className: "size-4" }) })), jsx("div", { className: "flex-1", "data-testid": "colorpicker-editable-input", children: jsx(HexColorInput, { prefixed: true, alpha: !!showTransparencyControl, color: colorValue, "data-testid": "colorpicker-editable-input-textbox", onChange: onColorInputChange, onBlur: onBlur, className: "h-8 w-full rounded-lg border border-input bg-transparent px-2.5 text-sm outline-none focus-visible:border-primary focus-visible:ring-3 focus-visible:ring-primary/15" }) })] })] })), jsx("div", { "data-testid": "color-palette", className: cn(showPicker && "border-t border-border pt-3"), children: jsx(Palette, { color: color, colorList: colorPalette, onChange: onColorChange }) }), showRecentlyUsedColors && recentlyUsedColors.length > 0 && (jsxs("div", { className: "border-t border-border pt-3", "data-testid": "color-palette-recently-used", children: [jsx("p", { className: "text-xs font-medium text-muted-foreground mb-2", children: t("neetoatoms.colorPicker.recentlyUsed", "Recently used") }), jsx(Palette, { colorList: recentlyUsedColors, onChange: onColorChange })] }))] }) })] }));
+});
+ColorPicker.displayName = "ColorPicker";
+
+export { ColorPicker as C };
+//# sourceMappingURL=ColorPicker-D-7QGnf9.js.map

package/dist/ColorPicker-D-7QGnf9.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorPicker-D-7QGnf9.js","sources":["../node_modules/lucide-react/dist/esm/icons/pipette.js","../src/components/ColorPicker/hooks/useEyeDropper.ts","../src/components/ColorPicker/constants.ts","../src/components/ColorPicker/hooks/useRecentlyUsedColors.ts","../src/components/ColorPicker/utils.ts","../src/components/ColorPicker/Palette.tsx","../src/components/ColorPicker/Target.tsx","../src/components/ColorPicker/ColorPicker.tsx"],"sourcesContent":["/**\n * @license lucide-react v0.577.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createLucideIcon from '../createLucideIcon.js';\n\nconst __iconNode = [\n  [\n    \"path\",\n    {\n      d: \"m12 9-8.414 8.414A2 2 0 0 0 3 18.828v1.344a2 2 0 0 1-.586 1.414A2 2 0 0 1 3.828 21h1.344a2 2 0 0 0 1.414-.586L15 12\",\n      key: \"1y3wsu\"\n    }\n  ],\n  [\n    \"path\",\n    {\n      d: \"m18 9 .4.4a1 1 0 1 1-3 3l-3.8-3.8a1 1 0 1 1 3-3l.4.4 3.4-3.4a1 1 0 1 1 3 3z\",\n      key: \"110lr1\"\n    }\n  ],\n  [\"path\", { d: \"m2 22 .414-.414\", key: \"jhxm08\" }]\n];\nconst Pipette = createLucideIcon(\"pipette\", __iconNode);\n\nexport { __iconNode, Pipette as default };\n//# sourceMappingURL=pipette.js.map\n","import { useCallback } from \"react\";\n\ninterface EyeDropperResult {\n  sRGBHex: string;\n}\n\ndeclare global {\n  interface Window {\n    EyeDropper?: new () => { open: () => Promise<EyeDropperResult> };\n  }\n}\n\nconst isSupported = typeof window !== \"undefined\" && \"EyeDropper\" in window;\n\nexport const useEyeDropper = () => {\n  const open = useCallback(async (): Promise<string> => {\n    if (!window.EyeDropper) throw new Error(\"EyeDropper API not supported\");\n\n    const dropper = new window.EyeDropper();\n    const result = await dropper.open();\n\n    return result.sRGBHex;\n  }, []);\n\n  return { isSupported, open };\n};\n","export const DEFAULT_PALETTE_COLORS = [\n  { hex: \"#FFFFFF\" },\n  { hex: \"#D6D6D6\" },\n  { hex: \"#0A0E13\" },\n  { hex: \"#FECE1E\" },\n  { hex: \"#F32E48\" },\n  { hex: \"#02C39A\" },\n  { hex: \"#2A79C4\" },\n  { hex: \"#B3E5FC\" },\n  { hex: \"#C3C6F9\" },\n  { hex: \"#8064CE\" },\n  { hex: \"#FE861E\" },\n  { hex: \"#FF7DC9\" },\n  { hex: \"#028090\" },\n  { hex: \"#095482\" },\n];\n\nexport const RECENTLY_USED_STORAGE_KEY = \"recently-used-colors\";\n\nexport const TARGET_SIZES = {\n  small: \"small\",\n  medium: \"medium\",\n  large: \"large\",\n} as const;\n\nexport const PICKER_HEIGHT: Record<string, string> = {\n  small: \"100px\",\n  medium: \"120px\",\n  large: \"140px\",\n};\n","import { useSyncExternalStore } from \"react\";\n\nimport { RECENTLY_USED_STORAGE_KEY } from \"../constants\";\n\ninterface ColorValue {\n  hex: string;\n  rgb: string | { r: number; g: number; b: number; a?: number };\n}\n\nconst getFromStorage = (key: string, fallback: ColorValue[]): ColorValue[] => {\n  try {\n    const stored = localStorage.getItem(key);\n\n    return stored ? JSON.parse(stored) : fallback;\n  } catch {\n    return fallback;\n  }\n};\n\nconst setToStorage = (key: string, value: ColorValue[]) => {\n  try {\n    localStorage.setItem(key, JSON.stringify(value));\n  } catch {\n    // Silently fail if storage is unavailable\n  }\n};\n\nconst createSyncedStore = (storageKey: string) => {\n  const listeners = new Set<() => void>();\n\n  const store = {\n    value: getFromStorage(storageKey, []),\n    getSnapshot: () => store.value,\n    getServerSnapshot: () => [] as ColorValue[],\n    setValue: (newValue: ColorValue[]) => {\n      store.value = newValue;\n      setToStorage(storageKey, newValue);\n      listeners.forEach(listener => listener());\n    },\n    subscribe: (callback: () => void) => {\n      listeners.add(callback);\n\n      const storageEventHandler = (event: StorageEvent) => {\n        if (event.key !== storageKey) return;\n        store.value = getFromStorage(storageKey, []);\n        listeners.forEach(listener => listener());\n      };\n\n      if (listeners.size === 1) {\n        window.addEventListener(\"storage\", storageEventHandler);\n      }\n\n      return () => {\n        listeners.delete(callback);\n        if (listeners.size === 0) {\n          window.removeEventListener(\"storage\", storageEventHandler);\n        }\n      };\n    },\n  };\n\n  return store;\n};\n\nconst store = createSyncedStore(RECENTLY_USED_STORAGE_KEY);\n\nexport const useRecentlyUsedColors = (): [\n  ColorValue[],\n  (value: ColorValue[]) => void,\n] => [\n  useSyncExternalStore(\n    store.subscribe,\n    store.getSnapshot,\n    store.getServerSnapshot\n  ),\n  store.setValue,\n];\n","/**\n * Validates a hex color string (3, 4, 6, or 8 digits with optional #).\n */\nexport const isValidHex = (hex: string): boolean =>\n  /^#?([0-9A-Fa-f]{3}|[0-9A-Fa-f]{4}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(hex);\n\n/**\n * Parses a hex color string into RGBA components.\n * Returns { r: 0, g: 0, b: 0, a: 1 } for invalid inputs.\n */\nexport const hexToRgb = (\n  hex: string\n): { r: number; g: number; b: number; a: number } => {\n  const raw = hex.replace(/^#/, \"\");\n\n  if (\n    !/^([0-9A-Fa-f]{3}|[0-9A-Fa-f]{4}|[0-9A-Fa-f]{6}|[0-9A-Fa-f]{8})$/.test(raw)\n  ) {\n    return { r: 0, g: 0, b: 0, a: 1 };\n  }\n\n  let r: number,\n    g: number,\n    b: number,\n    a = 255;\n  if (raw.length === 3 || raw.length === 4) {\n    r = parseInt(raw[0] + raw[0], 16);\n    g = parseInt(raw[1] + raw[1], 16);\n    b = parseInt(raw[2] + raw[2], 16);\n    if (raw.length === 4) a = parseInt(raw[3] + raw[3], 16);\n  } else {\n    r = parseInt(raw.slice(0, 2), 16);\n    g = parseInt(raw.slice(2, 4), 16);\n    b = parseInt(raw.slice(4, 6), 16);\n    if (raw.length === 8) a = parseInt(raw.slice(6, 8), 16);\n  }\n\n  return { r, g, b, a: Math.round((a / 255) * 100) / 100 };\n};\n\n/**\n * Converts a hex color to an 8-digit hex string (#RRGGBBAA).\n */\nexport const hexToHex8 = (hex: string): string => {\n  const { r, g, b, a } = hexToRgb(hex);\n  const alpha = Math.round(a * 255);\n\n  return `#${[r, g, b, alpha].map(v => v.toString(16).padStart(2, \"0\")).join(\"\")}`;\n};\n\n/**\n * Converts a color value to a normalized { hex, rgb } object.\n * Handles transparency and validity checks.\n */\nexport const getColor = (\n  colorValue: string,\n  showTransparencyControl: boolean\n): { hex: string; rgb: { r: number; g: number; b: number; a: number } } => {\n  if (!isValidHex(colorValue)) {\n    return { hex: colorValue, rgb: { r: 0, g: 0, b: 0, a: 1 } };\n  }\n\n  const rgb = hexToRgb(colorValue);\n\n  if (rgb.a === 0) {\n    return { hex: colorValue, rgb };\n  }\n\n  const hex = showTransparencyControl\n    ? hexToHex8(colorValue)\n    : `#${colorValue.replace(/^#/, \"\").slice(0, 6)}`;\n\n  return { hex, rgb: hexToRgb(hex) };\n};\n","import React, { forwardRef } from \"react\";\n\nimport { cn } from \"src/shadcn/lib/utils\";\n\nimport { isValidHex } from \"./utils\";\nimport { DEFAULT_PALETTE_COLORS } from \"./constants\";\nimport type { PaletteColor } from \"./types\";\n\nexport interface PaletteProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Currently selected color. */\n  color?: string;\n  /** List of colors to render. */\n  colorList?: PaletteColor[];\n  /** Callback when a color swatch is clicked. */\n  onChange?: (color: string) => void;\n}\n\nconst Palette = forwardRef<HTMLDivElement, PaletteProps>(\n  (\n    {\n      color,\n      colorList = DEFAULT_PALETTE_COLORS,\n      onChange,\n      className,\n      ...props\n    },\n    ref\n  ) => (\n    <div\n      ref={ref}\n      className={cn(\n        \"flex flex-row flex-wrap items-start justify-start gap-1\",\n        className\n      )}\n      {...props}\n    >\n      {colorList.map(item => {\n        const value = item.hex ?? item.rgb ?? \"\";\n        const isActive =\n          !!color && !!value && color.toLowerCase() === value.toLowerCase();\n\n        return (\n          <button\n            type=\"button\"\n            key={value}\n            data-testid=\"color-palette-item\"\n            className={cn(\n              \"size-6 rounded-[5px] border cursor-pointer overflow-hidden transition-colors\",\n              isActive\n                ? \"border-muted-foreground\"\n                : \"border-border hover:border-muted-foreground/50\"\n            )}\n            onClick={() => onChange?.(value)}\n          >\n            <span\n              className={cn(\n                \"block size-full\",\n                isValidHex(value)\n                  ? \"\"\n                  : \"bg-[repeating-conic-gradient(#ccc_0_25%,transparent_0_50%)] bg-[length:8px_8px]\"\n              )}\n              style={isValidHex(value) ? { backgroundColor: value } : undefined}\n            />\n          </button>\n        );\n      })}\n    </div>\n  )\n);\n\nPalette.displayName = \"ColorPicker.Palette\";\n\nexport { Palette };\n","import React, { forwardRef } from \"react\";\n\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { ChevronDown } from \"lucide-react\";\nimport { cn } from \"src/shadcn/lib/utils\";\n\nconst targetVariants = cva(\n  \"inline-flex items-center justify-between rounded-md border border-input bg-background transition-colors hover:border-muted-foreground focus-visible:outline-none focus-visible:border-primary focus-visible:ring-3 focus-visible:ring-primary/15 cursor-pointer\",\n  {\n    variants: {\n      size: {\n        small: \"h-7 p-0.5 gap-2\",\n        medium: \"h-8 p-1 gap-2\",\n        large: \"h-10 p-1.5 gap-3\",\n      },\n    },\n    defaultVariants: {\n      size: \"large\",\n    },\n  }\n);\n\nexport interface TargetProps\n  extends\n    Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, \"size\">,\n    VariantProps<typeof targetVariants> {\n  /** Show hex code text beside the color swatch. */\n  showHexValue?: boolean;\n  /** The original color prop value. */\n  color?: string;\n  /** The resolved color value to display. */\n  colorValue?: string;\n}\n\nconst Target = forwardRef<HTMLButtonElement, TargetProps>(\n  (\n    { size = \"large\", showHexValue, color, colorValue, className, ...props },\n    ref\n  ) => (\n    <button\n      ref={ref}\n      type=\"button\"\n      data-testid=\"color-picker-target\"\n      className={cn(targetVariants({ size }), className)}\n      {...props}\n    >\n      {showHexValue && (\n        <span className=\"text-sm font-medium text-foreground min-w-[4.5rem] ps-1\">\n          {color}\n        </span>\n      )}\n      <span className=\"inline-flex items-center gap-2\">\n        <span\n          className=\"block size-5 rounded-md border border-border\"\n          style={{ backgroundColor: colorValue }}\n        />\n        <ChevronDown className=\"size-4 text-muted-foreground\" />\n      </span>\n    </button>\n  )\n);\n\nTarget.displayName = \"ColorPicker.Target\";\n\nexport { Target };\n","import React, { forwardRef, useState, useRef } from \"react\";\n\nimport { Pipette } from \"lucide-react\";\nimport { useTranslation } from \"react-i18next\";\nimport {\n  HexColorPicker,\n  HexColorInput,\n  HexAlphaColorPicker,\n} from \"react-colorful\";\nimport { Button } from \"src/primitives/Button\";\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from \"src/primitives/Popover\";\nimport { cn } from \"src/shadcn/lib/utils\";\n\nimport { useEyeDropper } from \"./hooks/useEyeDropper\";\nimport { useRecentlyUsedColors } from \"./hooks/useRecentlyUsedColors\";\nimport { Palette } from \"./Palette\";\nimport { Target } from \"./Target\";\nimport { PICKER_HEIGHT } from \"./constants\";\nimport type { ColorPickerProps } from \"./types\";\nimport { getColor } from \"./utils\";\n\nconst ColorPicker = forwardRef<HTMLDivElement, ColorPickerProps>(\n  (\n    {\n      color = \"\",\n      size = \"large\",\n      onChange,\n      dropdownProps,\n      showEyeDropper = true,\n      showHexValue = false,\n      showTransparencyControl = false,\n      showPicker = true,\n      showHexPicker = true,\n      colorPalette,\n      showRecentlyUsedColors = showPicker,\n      className,\n    },\n    ref\n  ) => {\n    const { t } = useTranslation();\n    const [colorInternal, setColorInternal] = useState(color);\n    const [isColorSelected, setIsColorSelected] = useState(false);\n    const [open, setOpen] = useState(false);\n    const hexColorInputValue = useRef(\"\");\n    const { isSupported: eyeDropperSupported, open: openEyeDropper } =\n      useEyeDropper();\n    const [recentlyUsedColors, setRecentlyUsedColors] = useRecentlyUsedColors();\n\n    const PickerComponent = showTransparencyControl\n      ? HexAlphaColorPicker\n      : HexColorPicker;\n\n    const colorValue = color ?? colorInternal ?? \"\";\n\n    const onColorChange = (value: string) => {\n      setIsColorSelected(true);\n\n      if (onChange) {\n        onChange(getColor(value, showTransparencyControl));\n      } else {\n        setColorInternal(value);\n      }\n    };\n\n    const onColorInputChange = (hex: string) => {\n      hexColorInputValue.current = hex;\n      const expectedLength = showTransparencyControl ? 9 : 7;\n      if (hex.length !== expectedLength) return;\n\n      onColorChange(hex);\n      hexColorInputValue.current = \"\";\n    };\n\n    const onBlur = () => {\n      if (!hexColorInputValue.current) return;\n\n      onColorChange(hexColorInputValue.current);\n      hexColorInputValue.current = \"\";\n    };\n\n    const pickColor = async () => {\n      try {\n        const hex = await openEyeDropper();\n        onColorChange(hex);\n      } catch {\n        // User cancelled or API unavailable\n      }\n    };\n\n    const onOpenChange = (nextOpen: boolean) => {\n      if (!nextOpen && showRecentlyUsedColors && isColorSelected) {\n        const newColor = getColor(colorValue, showTransparencyControl);\n        const filtered = recentlyUsedColors.filter(\n          ({ hex }) => hex !== newColor.hex\n        );\n        const updated = [newColor, ...filtered];\n        if (updated.length > 14) updated.pop();\n\n        setRecentlyUsedColors(updated);\n        setIsColorSelected(false);\n      }\n\n      setOpen(nextOpen);\n    };\n\n    return (\n      <Popover open={open} onOpenChange={onOpenChange}>\n        <PopoverTrigger asChild>\n          <Target\n            color={color}\n            colorValue={colorValue}\n            showHexValue={showHexValue}\n            size={size}\n          />\n        </PopoverTrigger>\n        <PopoverContent\n          ref={ref}\n          align=\"start\"\n          side=\"bottom\"\n          className={cn(\"w-auto p-3\", className)}\n          {...dropdownProps}\n        >\n          <div className=\"flex flex-col gap-3 w-56\">\n            {showPicker && (\n              <>\n                {showHexPicker && (\n                  <div\n                    data-testid=\"neeto-color-picker-section\"\n                    style={{\n                      [\"--react-colorful-height\" as string]:\n                        PICKER_HEIGHT[size] ?? \"140px\",\n                    }}\n                  >\n                    <PickerComponent\n                      color={colorValue}\n                      onChange={onColorChange}\n                      style={{\n                        width: \"100%\",\n                        height: PICKER_HEIGHT[size] ?? \"140px\",\n                      }}\n                    />\n                  </div>\n                )}\n                <div className=\"flex items-center justify-center gap-2\">\n                  {showEyeDropper && eyeDropperSupported && (\n                    <Button\n                      type=\"button\"\n                      variant=\"ghost\"\n                      size=\"icon-sm\"\n                      onClick={pickColor}\n                      aria-label={t(\n                        \"neetoatoms.colorPicker.pickColor\",\n                        \"Pick color from screen\"\n                      )}\n                    >\n                      <Pipette className=\"size-4\" />\n                    </Button>\n                  )}\n                  <div\n                    className=\"flex-1\"\n                    data-testid=\"colorpicker-editable-input\"\n                  >\n                    <HexColorInput\n                      prefixed\n                      alpha={!!showTransparencyControl}\n                      color={colorValue}\n                      data-testid=\"colorpicker-editable-input-textbox\"\n                      onChange={onColorInputChange}\n                      onBlur={onBlur}\n                      className=\"h-8 w-full rounded-lg border border-input bg-transparent px-2.5 text-sm outline-none focus-visible:border-primary focus-visible:ring-3 focus-visible:ring-primary/15\"\n                    />\n                  </div>\n                </div>\n              </>\n            )}\n            <div\n              data-testid=\"color-palette\"\n              className={cn(showPicker && \"border-t border-border pt-3\")}\n            >\n              <Palette\n                color={color}\n                colorList={colorPalette}\n                onChange={onColorChange}\n              />\n            </div>\n            {showRecentlyUsedColors && recentlyUsedColors.length > 0 && (\n              <div\n                className=\"border-t border-border pt-3\"\n                data-testid=\"color-palette-recently-used\"\n              >\n                <p className=\"text-xs font-medium text-muted-foreground mb-2\">\n                  {t(\"neetoatoms.colorPicker.recentlyUsed\", \"Recently used\")}\n                </p>\n                <Palette\n                  colorList={recentlyUsedColors}\n                  onChange={onColorChange}\n                />\n              </div>\n            )}\n          </div>\n        </PopoverContent>\n      </Popover>\n    );\n  }\n);\n\nColorPicker.displayName = \"ColorPicker\";\n\nexport { ColorPicker };\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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","x_google_ignoreList":[0]}

package/dist/{DataTable-BKe9K5XP.js → DataTable-DWR9gX9d.js}

@@ -3,6 +3,7 @@ import * as React from 'react';
 import { useState, useCallback, useEffect, useMemo, useRef } from 'react';
 import { TableRow, TableCell, Table, TableHeader, TableHead, TableBody } from './primitives/Table.js';
 import { c as cn } from './utils-DdHUxIdC.js';
+import { useTranslation } from 'react-i18next';
 import { Checkbox } from './primitives/Checkbox.js';
 import { Spinner } from './primitives/Spinner.js';
 import { c as createLucideIcon } from './createLucideIcon-C8ycilSN.js';
@@ -3300,7 +3301,10 @@ const useTablePagination = ({ totalCount = 0, pageSize = DEFAULT_PAGE_SIZE, curr
     };
 };
 
-const SelectionCheckbox = ({ checked, onCheckedChange, ariaLabel, }) => (jsx("div", { className: "flex items-center justify-center", children: jsx(Checkbox, { checked: checked, onCheckedChange: onCheckedChange, "aria-label": ariaLabel ?? "Select row" }) }));
+const SelectionCheckbox = ({ checked, onCheckedChange, ariaLabel, }) => {
+    const { t } = useTranslation();
+    return (jsx("div", { className: "flex items-center justify-center", children: jsx(Checkbox, { checked: checked, onCheckedChange: onCheckedChange, "aria-label": ariaLabel ?? t("neetoatoms.dataTable.selectRow", "Select row") }) }));
+};
 
 const useTableSelection = ({ enableRowSelection, selectedRowKeys, onRowSelect, data, getRowId, }) => {
     const isControlled = selectedRowKeys !== undefined;
@@ -3505,7 +3509,11 @@ const useColumnOrdering = ({ enabled = false, columnOrder: controlledOrder, onCo
 
 const LoadingOverlay = () => (jsx("div", { className: "absolute inset-0 z-10 flex items-center justify-center bg-background/50", children: jsx(Spinner, { className: "size-6" }) }));
 
-const EmptyState = ({ colSpan, message = "No results.", }) => (jsx(TableRow, { children: jsx(TableCell, { colSpan: colSpan, className: "min-h-24 text-center text-muted-foreground", children: message }) }));
+const EmptyState = ({ colSpan, message }) => {
+    const { t } = useTranslation();
+    const resolvedMessage = message ?? t("neetoatoms.dataTable.noResults", "No results.");
+    return (jsx(TableRow, { children: jsx(TableCell, { colSpan: colSpan, className: "min-h-24 text-center text-muted-foreground", children: resolvedMessage }) }));
+};
 
 const SortIndicator = ({ column, }) => {
     if (!column.getCanSort())
@@ -3734,4 +3742,4 @@ const DataTable = ({ columns, data, getRowId: getRowIdProp, sorting: sortingProp
 };
 
 export { DataTable as D, useColumnPinning as a, useColumnVisibility as b, useTablePagination as c, useTableSelection as d, useTableSort as e, useColumnOrdering as u };
-//# sourceMappingURL=DataTable-BKe9K5XP.js.map
+//# sourceMappingURL=DataTable-DWR9gX9d.js.map