@particle-academy/react-fancy 5.51.2 → 5.53.0

package/dist/{chunk-YD4SXA6K.js → chunk-UVMIJCY3.js}

@@ -55,7 +55,7 @@ function SidebarItem({
         "flex w-full items-center rounded-md text-sm font-medium transition-colors",
         "outline-none focus-visible:ring-2 focus-visible:ring-blue-500",
         collapsed ? "justify-center px-2 py-2" : "gap-2 px-3 py-2",
-        active ? "bg-zinc-100 text-zinc-900 dark:bg-zinc-800 dark:text-zinc-100" : "text-zinc-600 hover:bg-zinc-50 hover:text-zinc-900 dark:text-zinc-400 dark:hover:bg-zinc-800/50 dark:hover:text-zinc-100",
+        active ? "bg-[color:var(--fancy-surface-muted,var(--color-zinc-100))] text-[color:var(--fancy-text,var(--color-zinc-900))] dark:bg-[color:var(--fancy-surface-muted-dark,var(--color-zinc-800))] dark:text-[color:var(--fancy-text-dark,var(--color-zinc-100))]" : "text-zinc-600 hover:bg-zinc-50 hover:text-[color:var(--fancy-text,var(--color-zinc-900))] dark:text-zinc-400 dark:hover:bg-zinc-800/50 dark:hover:text-[color:var(--fancy-text-dark,var(--color-zinc-100))]",
         disabled && "pointer-events-none opacity-50",
         className
       ),
@@ -75,8 +75,8 @@ SidebarItem.displayName = "SidebarItem";
 function SidebarGroup({ children, label, className }) {
   const { collapsed } = useSidebar();
   return /* @__PURE__ */ jsxs("div", { "data-react-fancy-sidebar-group": "", className: cn("py-1", className), children: [
-    label && !collapsed && /* @__PURE__ */ jsx("p", { className: "mb-1 px-3 text-xs font-semibold uppercase tracking-wider text-zinc-400 dark:text-zinc-500", children: label }),
-    label && collapsed && /* @__PURE__ */ jsx("div", { className: "mx-auto mb-1 h-px w-6 bg-zinc-200 dark:bg-zinc-700" }),
+    label && !collapsed && /* @__PURE__ */ jsx("p", { className: "mb-1 px-3 text-xs font-semibold uppercase tracking-wider text-[color:var(--fancy-text-faint,var(--color-zinc-400))] dark:text-[color:var(--fancy-text-faint-dark,var(--color-zinc-500))]", children: label }),
+    label && collapsed && /* @__PURE__ */ jsx("div", { className: "mx-auto mb-1 h-px w-6 bg-[color:var(--fancy-border,var(--color-zinc-200))] dark:bg-[color:var(--fancy-border-dark,var(--color-zinc-700))]" }),
     children
   ] });
 }
@@ -147,7 +147,7 @@ function SidebarSubmenu({
           "grid transition-[grid-template-rows] duration-200",
           open ? "grid-rows-[1fr]" : "grid-rows-[0fr]"
         ),
-        children: /* @__PURE__ */ jsx("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "ml-4 border-l border-zinc-200 pl-2 pt-1 dark:border-zinc-700", children }) })
+        children: /* @__PURE__ */ jsx("div", { className: "overflow-hidden", children: /* @__PURE__ */ jsx("div", { className: "ml-4 border-l border-[color:var(--fancy-border,var(--color-zinc-200))] pl-2 pt-1 dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))]", children }) })
       }
     )
   ] });
@@ -164,7 +164,7 @@ function SidebarToggle({ className }) {
       title: collapsed ? "Expand sidebar" : "Collapse sidebar",
       className: cn(
         "flex items-center justify-center rounded-md p-1.5 text-zinc-400 transition-colors",
-        "hover:bg-zinc-100 hover:text-zinc-600 dark:hover:bg-zinc-800 dark:hover:text-zinc-300",
+        "hover:bg-[color:var(--fancy-surface-muted,var(--color-zinc-100))] hover:text-zinc-600 dark:hover:bg-[color:var(--fancy-surface-muted-dark,var(--color-zinc-800))] dark:hover:text-zinc-300",
         className
       ),
       children: collapsed ? /* @__PURE__ */ jsx(PanelLeftOpen, { className: "h-4 w-4" }) : /* @__PURE__ */ jsx(PanelLeftClose, { className: "h-4 w-4" })
@@ -198,7 +198,7 @@ function SidebarRoot({
         // and actively wrong inside a container that already draws its own —
         // a 240px rail in a 300px card puts its right border 240px in, which
         // reads as a stray line slicing the panel rather than an edge.
-        !embedded && "border-r border-zinc-200 bg-white dark:border-zinc-700 dark:bg-zinc-900",
+        !embedded && "border-r border-[color:var(--fancy-border,var(--color-zinc-200))] bg-[color:var(--fancy-surface,var(--color-white))] dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-surface-dark,var(--color-zinc-900))]",
         // Collapsed is a fixed icon rail either way; only the expanded width
         // defers to the container.
         collapsed ? "w-16" : embedded ? "w-full" : "w-60",
@@ -216,5 +216,5 @@ var Sidebar = Object.assign(SidebarRoot, {
 });
 
 export { Sidebar, useSidebar };
-//# sourceMappingURL=chunk-YD4SXA6K.js.map
-//# sourceMappingURL=chunk-YD4SXA6K.js.map
+//# sourceMappingURL=chunk-UVMIJCY3.js.map
+//# sourceMappingURL=chunk-UVMIJCY3.js.map

package/dist/chunk-UVMIJCY3.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Sidebar/Sidebar.context.ts","../src/components/Sidebar/SidebarItem.tsx","../src/components/Sidebar/SidebarGroup.tsx","../src/components/Sidebar/SidebarSubmenu.tsx","../src/components/Sidebar/SidebarToggle.tsx","../src/components/Sidebar/Sidebar.tsx"],"names":["jsxs","jsx","getLetters"],"mappings":"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","file":"chunk-UVMIJCY3.js","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { SidebarContextValue } from \"./Sidebar.types\";\n\nexport const SidebarContext = createContext<SidebarContextValue | null>(null);\n\nexport function useSidebar(): SidebarContextValue {\n  const ctx = useContext(SidebarContext);\n  if (!ctx) {\n    throw new Error(\"useSidebar must be used within a <Sidebar> component\");\n  }\n  return ctx;\n}\n","import type { ElementType } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useSidebar } from \"./Sidebar.context\";\nimport type { SidebarItemProps } from \"./Sidebar.types\";\n\n/** Extract first 3 characters from a ReactNode if it's a string. */\nfunction getLetters(children: React.ReactNode): string {\n  if (typeof children === \"string\") return children.slice(0, 3);\n  return \"...\";\n}\n\nexport function SidebarItem({\n  children,\n  href,\n  as: As,\n  icon,\n  active = false,\n  disabled = false,\n  badge,\n  onClick,\n  className,\n  ...rest\n}: SidebarItemProps) {\n  const { collapsed, collapseMode } = useSidebar();\n\n  // Link mode engages on `href` OR `as` — a `to`-based router (TanStack Router,\n  // React Router) passes no href, and would otherwise render a <button> that\n  // navigates nowhere. `onClick` now rides along in link mode instead of being\n  // dropped: an item that both navigates and closes a drawer is the common case.\n  const isLink = Boolean(href || As);\n  const Tag = isLink ? ((As ?? \"a\") as ElementType) : \"button\";\n  const tagProps = isLink\n    ? { ...(href ? { href } : {}), onClick }\n    : { type: \"button\" as const, onClick };\n\n  const showIconOnly = collapsed && collapseMode === \"icons\" && icon;\n  const showLetters = collapsed && (collapseMode === \"letters\" || (collapseMode === \"icons\" && !icon));\n\n  const title = typeof children === \"string\" ? children : undefined;\n\n  return (\n    <Tag\n      {...tagProps}\n      {...rest}\n      data-react-fancy-sidebar-item=\"\"\n      data-active={active || undefined}\n      aria-current={active ? \"page\" : undefined}\n      aria-disabled={disabled || undefined}\n      title={collapsed ? title : undefined}\n      className={cn(\n        // `w-full` matters when the Tag is a <button>: form controls size to\n        // FIT-CONTENT, not to their parent, so a long label made the item wider\n        // than the sidebar and an ancestor clipped the overflow — which reads as\n        // a label cut off mid-word rather than an ellipsis. Without this,\n        // `min-w-0` on the label below can never engage, because the item is\n        // never under width pressure in the first place.\n        \"flex w-full items-center rounded-md text-sm font-medium transition-colors\",\n        \"outline-none focus-visible:ring-2 focus-visible:ring-blue-500\",\n        collapsed ? \"justify-center px-2 py-2\" : \"gap-2 px-3 py-2\",\n        active\n          ? \"bg-[color:var(--fancy-surface-muted,var(--color-zinc-100))] text-[color:var(--fancy-text,var(--color-zinc-900))] dark:bg-[color:var(--fancy-surface-muted-dark,var(--color-zinc-800))] dark:text-[color:var(--fancy-text-dark,var(--color-zinc-100))]\"\n          : \"text-zinc-600 hover:bg-zinc-50 hover:text-[color:var(--fancy-text,var(--color-zinc-900))] dark:text-zinc-400 dark:hover:bg-zinc-800/50 dark:hover:text-[color:var(--fancy-text-dark,var(--color-zinc-100))]\",\n        disabled && \"pointer-events-none opacity-50\",\n        className,\n      )}\n    >\n      {showIconOnly && (\n        <span className=\"flex h-5 w-5 shrink-0 items-center justify-center\">{icon}</span>\n      )}\n      {showLetters && (\n        <span className=\"text-xs font-semibold uppercase\">{getLetters(children)}</span>\n      )}\n      {!collapsed && (\n        <>\n          {icon && <span className=\"flex h-5 w-5 shrink-0 items-center justify-center\">{icon}</span>}\n          {/*\n            `min-w-0` is load-bearing, not tidiness. A flex item defaults to\n            `min-width: auto`, which resolves to its MIN-CONTENT width — so with\n            `truncate` alone the span refuses to shrink below the full label,\n            and the item grows wider than the sidebar instead of ellipsing.\n            The overflow then gets clipped by an ancestor, which looks like a\n            mid-word cut rather than a truncation.\n\n            Only shows up with labels longer than the sidebar is wide, which is\n            why it survived: short nav labels never trigger it.\n          */}\n          <span className=\"min-w-0 flex-1 truncate text-left\">{children}</span>\n          {badge && <span className=\"shrink-0\">{badge}</span>}\n        </>\n      )}\n    </Tag>\n  );\n}\n\nSidebarItem.displayName = \"SidebarItem\";\n","import { cn } from \"../../utils/cn\";\nimport { useSidebar } from \"./Sidebar.context\";\nimport type { SidebarGroupProps } from \"./Sidebar.types\";\n\nexport function SidebarGroup({ children, label, className }: SidebarGroupProps) {\n  const { collapsed } = useSidebar();\n\n  return (\n    <div data-react-fancy-sidebar-group=\"\" className={cn(\"py-1\", className)}>\n      {label && !collapsed && (\n        <p className=\"mb-1 px-3 text-xs font-semibold uppercase tracking-wider text-[color:var(--fancy-text-faint,var(--color-zinc-400))] dark:text-[color:var(--fancy-text-faint-dark,var(--color-zinc-500))]\">\n          {label}\n        </p>\n      )}\n      {label && collapsed && (\n        <div className=\"mx-auto mb-1 h-px w-6 bg-[color:var(--fancy-border,var(--color-zinc-200))] dark:bg-[color:var(--fancy-border-dark,var(--color-zinc-700))]\" />\n      )}\n      {children}\n    </div>\n  );\n}\n\nSidebarGroup.displayName = \"SidebarGroup\";\n","import { useState } from \"react\";\nimport { ChevronDown } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport { useSidebar } from \"./Sidebar.context\";\nimport type { SidebarSubmenuProps } from \"./Sidebar.types\";\n\n/** Extract first 3 characters from a string. */\nfunction getLetters(label: string): string {\n  return label.slice(0, 3);\n}\n\nexport function SidebarSubmenu({\n  children,\n  label,\n  icon,\n  defaultOpen = false,\n  className,\n}: SidebarSubmenuProps) {\n  const [open, setOpen] = useState(defaultOpen);\n  const { collapsed, collapseMode } = useSidebar();\n\n  const showIconOnly = collapsed && collapseMode === \"icons\" && icon;\n  const showLetters = collapsed && (collapseMode === \"letters\" || (collapseMode === \"icons\" && !icon));\n\n  // When collapsed, just show the icon/letters as a simple item (no expand)\n  if (collapsed) {\n    return (\n      <div\n        data-react-fancy-sidebar-submenu=\"\"\n        title={label}\n        className={cn(\n          \"flex items-center justify-center rounded-md px-2 py-2 text-sm font-medium transition-colors\",\n          \"text-zinc-600 hover:bg-zinc-50 hover:text-zinc-900\",\n          \"dark:text-zinc-400 dark:hover:bg-zinc-800/50 dark:hover:text-zinc-100\",\n          className,\n        )}\n      >\n        {showIconOnly && (\n          <span className=\"flex h-5 w-5 shrink-0 items-center justify-center\">{icon}</span>\n        )}\n        {showLetters && (\n          <span className=\"text-xs font-semibold uppercase\">{getLetters(label)}</span>\n        )}\n      </div>\n    );\n  }\n\n  return (\n    <div data-react-fancy-sidebar-submenu=\"\" className={className}>\n      <button\n        type=\"button\"\n        onClick={() => setOpen((v) => !v)}\n        className={cn(\n          \"flex w-full items-center gap-2 rounded-md px-3 py-2 text-sm font-medium transition-colors\",\n          \"text-zinc-600 hover:bg-zinc-50 hover:text-zinc-900\",\n          \"dark:text-zinc-400 dark:hover:bg-zinc-800/50 dark:hover:text-zinc-100\",\n        )}\n      >\n        {icon && <span className=\"flex h-5 w-5 shrink-0 items-center justify-center\">{icon}</span>}\n        <span className=\"flex-1 text-left\">{label}</span>\n        <ChevronDown\n          className={cn(\n            \"h-3.5 w-3.5 opacity-60 transition-transform duration-200\",\n            open && \"rotate-180\",\n          )}\n        />\n      </button>\n      <div\n        className={cn(\n          \"grid transition-[grid-template-rows] duration-200\",\n          open ? \"grid-rows-[1fr]\" : \"grid-rows-[0fr]\",\n        )}\n      >\n        <div className=\"overflow-hidden\">\n          <div className=\"ml-4 border-l border-[color:var(--fancy-border,var(--color-zinc-200))] pl-2 pt-1 dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))]\">\n            {children}\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n}\n\nSidebarSubmenu.displayName = \"SidebarSubmenu\";\n","import { PanelLeftClose, PanelLeftOpen } from \"lucide-react\";\nimport { cn } from \"../../utils/cn\";\nimport { useSidebar } from \"./Sidebar.context\";\nimport type { SidebarToggleProps } from \"./Sidebar.types\";\n\nexport function SidebarToggle({ className }: SidebarToggleProps) {\n  const { collapsed, setCollapsed } = useSidebar();\n\n  return (\n    <button\n      type=\"button\"\n      data-react-fancy-sidebar-toggle=\"\"\n      onClick={() => setCollapsed(!collapsed)}\n      title={collapsed ? \"Expand sidebar\" : \"Collapse sidebar\"}\n      className={cn(\n        \"flex items-center justify-center rounded-md p-1.5 text-zinc-400 transition-colors\",\n        \"hover:bg-[color:var(--fancy-surface-muted,var(--color-zinc-100))] hover:text-zinc-600 dark:hover:bg-[color:var(--fancy-surface-muted-dark,var(--color-zinc-800))] dark:hover:text-zinc-300\",\n        className,\n      )}\n    >\n      {collapsed ? (\n        <PanelLeftOpen className=\"h-4 w-4\" />\n      ) : (\n        <PanelLeftClose className=\"h-4 w-4\" />\n      )}\n    </button>\n  );\n}\n\nSidebarToggle.displayName = \"SidebarToggle\";\n","import { cn } from \"../../utils/cn\";\nimport { useControllableState } from \"../../hooks\";\nimport { SidebarContext } from \"./Sidebar.context\";\nimport { SidebarItem } from \"./SidebarItem\";\nimport { SidebarGroup } from \"./SidebarGroup\";\nimport { SidebarSubmenu } from \"./SidebarSubmenu\";\nimport { SidebarToggle } from \"./SidebarToggle\";\nimport type { SidebarProps } from \"./Sidebar.types\";\n\nfunction SidebarRoot({\n  children,\n  collapsed: controlledCollapsed,\n  defaultCollapsed = false,\n  onCollapsedChange,\n  collapseMode = \"icons\",\n  embedded = false,\n  className,\n}: SidebarProps) {\n  const [collapsed, setCollapsed] = useControllableState(\n    controlledCollapsed,\n    defaultCollapsed,\n    onCollapsedChange,\n  );\n\n  return (\n    <SidebarContext.Provider value={{ collapsed, collapseMode, setCollapsed }}>\n      <aside\n        data-react-fancy-sidebar=\"\"\n        data-collapsed={collapsed || undefined}\n        data-embedded={embedded || undefined}\n        className={cn(\n          \"flex flex-col gap-0.5 transition-[width] duration-200\",\n          // The app-shell chrome. Correct for the rail this is usually used as,\n          // and actively wrong inside a container that already draws its own —\n          // a 240px rail in a 300px card puts its right border 240px in, which\n          // reads as a stray line slicing the panel rather than an edge.\n          !embedded && \"border-r border-[color:var(--fancy-border,var(--color-zinc-200))] bg-[color:var(--fancy-surface,var(--color-white))] dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-surface-dark,var(--color-zinc-900))]\",\n          // Collapsed is a fixed icon rail either way; only the expanded width\n          // defers to the container.\n          collapsed ? \"w-16\" : embedded ? \"w-full\" : \"w-60\",\n          className,\n        )}\n      >\n        {children}\n      </aside>\n    </SidebarContext.Provider>\n  );\n}\n\nexport const Sidebar = Object.assign(SidebarRoot, {\n  Item: SidebarItem,\n  Group: SidebarGroup,\n  Submenu: SidebarSubmenu,\n  Toggle: SidebarToggle,\n});\n"]}

package/dist/{chunk-DEFGT75G.js → chunk-UVUBV4VZ.js}

@@ -1,7 +1,7 @@
-import { InputWrapper } from './chunk-PWEZCMIY.js';
-import { DisplayValue } from './chunk-KKWNKBKR.js';
-import { Field } from './chunk-5MU6X3KO.js';
-import { inputBaseClasses, inputSizeClasses, dirtyClasses, errorClasses } from './chunk-GFYSELJF.js';
+import { InputWrapper } from './chunk-KXYMMNNV.js';
+import { DisplayValue } from './chunk-WX5XYDVN.js';
+import { Field } from './chunk-5WQ6FPSP.js';
+import { inputBaseClasses, inputSizeClasses, dirtyClasses, errorClasses } from './chunk-USWQAMI3.js';
 import { useInlineEdit } from './chunk-OL53XYHF.js';
 import { useFieldMode } from './chunk-NRXK42LO.js';
 import { cn } from './chunk-MMW2JGKZ.js';
@@ -127,5 +127,5 @@ var Textarea = forwardRef(
 Textarea.displayName = "Textarea";
 
 export { Textarea };
-//# sourceMappingURL=chunk-DEFGT75G.js.map
-//# sourceMappingURL=chunk-DEFGT75G.js.map
+//# sourceMappingURL=chunk-UVUBV4VZ.js.map
+//# sourceMappingURL=chunk-UVUBV4VZ.js.map

package/dist/{chunk-DEFGT75G.js.map → chunk-UVUBV4VZ.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/inputs/Textarea/Textarea.tsx"],"names":[],"mappings":"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","file":"chunk-DEFGT75G.js","sourcesContent":["import { forwardRef, useEffect, useId, useRef } from \"react\";\nimport { cn } from \"../../../utils/cn\";\nimport { Field } from \"../Field\";\nimport { InputWrapper } from \"../InputWrapper\";\nimport {\n  dirtyClasses,\n  errorClasses,\n  inputBaseClasses,\n  inputSizeClasses,\n} from \"../inputs.utils\";\nimport { useFieldMode } from \"../mode/FieldMode.context\";\nimport { DisplayValue } from \"../mode/DisplayValue\";\nimport { useInlineEdit } from \"../mode/useInlineEdit\";\nimport type { TextareaProps } from \"./Textarea.types\";\n\nexport const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(\n  (\n    {\n      size = \"md\",\n      dirty,\n      error,\n      label,\n      labelHidden,\n      description,\n      required,\n      disabled,\n      className,\n      id,\n      autoResize,\n      minRows = 3,\n      maxRows,\n      prefix,\n      suffix,\n      prefixPosition: _prefixPosition,\n      suffixPosition: _suffixPosition,\n      mode,\n      onValueChange,\n      onChange,\n      value,\n      defaultValue,\n      ...props\n    },\n    ref,\n  ) => {\n    const autoId = useId();\n    const textareaId = id ?? autoId;\n    const internalRef = useRef<HTMLTextAreaElement | null>(null);\n    const resolvedMode = useFieldMode(mode);\n    const { showControl, interactive, enterEdit, exitEdit } = useInlineEdit(resolvedMode, disabled);\n\n    useEffect(() => {\n      const el = internalRef.current;\n      if (!autoResize || !el) return;\n      el.style.height = \"auto\";\n      const lineHeight = parseInt(getComputedStyle(el).lineHeight) || 20;\n      const minHeight = minRows * lineHeight;\n      const maxHeight = maxRows ? maxRows * lineHeight : Infinity;\n      el.style.height = `${Math.min(Math.max(el.scrollHeight, minHeight), maxHeight)}px`;\n    }, [autoResize, minRows, maxRows, value, defaultValue]);\n\n    const textarea = !showControl ? (\n      <DisplayValue\n        size={size}\n        className=\"whitespace-pre-wrap\"\n        interactive={interactive}\n        onActivate={enterEdit}\n      >\n        {(value ?? defaultValue) as string | undefined}\n      </DisplayValue>\n    ) : (\n      <InputWrapper\n        prefix={prefix}\n        suffix={suffix}\n        prefixPosition=\"outside\"\n        suffixPosition=\"outside\"\n        size={size}\n      >\n        <textarea\n          data-react-fancy-textarea=\"\"\n          ref={(node) => {\n            internalRef.current = node;\n            if (typeof ref === \"function\") {\n              ref(node);\n            } else if (ref) {\n              ref.current = node;\n            }\n          }}\n          id={textareaId}\n          disabled={disabled}\n          required={required}\n          rows={autoResize ? minRows : minRows}\n          value={value}\n          defaultValue={defaultValue}\n          className={cn(\n            inputBaseClasses,\n            inputSizeClasses[size],\n            dirtyClasses(dirty),\n            errorClasses(error),\n            \"w-full resize-y\",\n            autoResize && \"resize-none overflow-hidden\",\n            className,\n          )}\n          onChange={(e) => {\n            onChange?.(e);\n            onValueChange?.(e.target.value);\n          }}\n          {...props}\n          autoFocus={interactive || props.autoFocus}\n          onBlur={(e) => {\n            props.onBlur?.(e);\n            if (interactive) exitEdit();\n          }}\n        />\n      </InputWrapper>\n    );\n\n    if (label || error || description) {\n      return (\n        <Field\n          label={label}\n          labelHidden={labelHidden}\n          description={description}\n          error={error}\n          required={required}\n          htmlFor={textareaId}\n          size={size}\n        >\n          {textarea}\n        </Field>\n      );\n    }\n\n    return textarea;\n  },\n);\n\nTextarea.displayName = \"Textarea\";\n"]}
+{"version":3,"sources":["../src/components/inputs/Textarea/Textarea.tsx"],"names":[],"mappings":"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","file":"chunk-UVUBV4VZ.js","sourcesContent":["import { forwardRef, useEffect, useId, useRef } from \"react\";\nimport { cn } from \"../../../utils/cn\";\nimport { Field } from \"../Field\";\nimport { InputWrapper } from \"../InputWrapper\";\nimport {\n  dirtyClasses,\n  errorClasses,\n  inputBaseClasses,\n  inputSizeClasses,\n} from \"../inputs.utils\";\nimport { useFieldMode } from \"../mode/FieldMode.context\";\nimport { DisplayValue } from \"../mode/DisplayValue\";\nimport { useInlineEdit } from \"../mode/useInlineEdit\";\nimport type { TextareaProps } from \"./Textarea.types\";\n\nexport const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(\n  (\n    {\n      size = \"md\",\n      dirty,\n      error,\n      label,\n      labelHidden,\n      description,\n      required,\n      disabled,\n      className,\n      id,\n      autoResize,\n      minRows = 3,\n      maxRows,\n      prefix,\n      suffix,\n      prefixPosition: _prefixPosition,\n      suffixPosition: _suffixPosition,\n      mode,\n      onValueChange,\n      onChange,\n      value,\n      defaultValue,\n      ...props\n    },\n    ref,\n  ) => {\n    const autoId = useId();\n    const textareaId = id ?? autoId;\n    const internalRef = useRef<HTMLTextAreaElement | null>(null);\n    const resolvedMode = useFieldMode(mode);\n    const { showControl, interactive, enterEdit, exitEdit } = useInlineEdit(resolvedMode, disabled);\n\n    useEffect(() => {\n      const el = internalRef.current;\n      if (!autoResize || !el) return;\n      el.style.height = \"auto\";\n      const lineHeight = parseInt(getComputedStyle(el).lineHeight) || 20;\n      const minHeight = minRows * lineHeight;\n      const maxHeight = maxRows ? maxRows * lineHeight : Infinity;\n      el.style.height = `${Math.min(Math.max(el.scrollHeight, minHeight), maxHeight)}px`;\n    }, [autoResize, minRows, maxRows, value, defaultValue]);\n\n    const textarea = !showControl ? (\n      <DisplayValue\n        size={size}\n        className=\"whitespace-pre-wrap\"\n        interactive={interactive}\n        onActivate={enterEdit}\n      >\n        {(value ?? defaultValue) as string | undefined}\n      </DisplayValue>\n    ) : (\n      <InputWrapper\n        prefix={prefix}\n        suffix={suffix}\n        prefixPosition=\"outside\"\n        suffixPosition=\"outside\"\n        size={size}\n      >\n        <textarea\n          data-react-fancy-textarea=\"\"\n          ref={(node) => {\n            internalRef.current = node;\n            if (typeof ref === \"function\") {\n              ref(node);\n            } else if (ref) {\n              ref.current = node;\n            }\n          }}\n          id={textareaId}\n          disabled={disabled}\n          required={required}\n          rows={autoResize ? minRows : minRows}\n          value={value}\n          defaultValue={defaultValue}\n          className={cn(\n            inputBaseClasses,\n            inputSizeClasses[size],\n            dirtyClasses(dirty),\n            errorClasses(error),\n            \"w-full resize-y\",\n            autoResize && \"resize-none overflow-hidden\",\n            className,\n          )}\n          onChange={(e) => {\n            onChange?.(e);\n            onValueChange?.(e.target.value);\n          }}\n          {...props}\n          autoFocus={interactive || props.autoFocus}\n          onBlur={(e) => {\n            props.onBlur?.(e);\n            if (interactive) exitEdit();\n          }}\n        />\n      </InputWrapper>\n    );\n\n    if (label || error || description) {\n      return (\n        <Field\n          label={label}\n          labelHidden={labelHidden}\n          description={description}\n          error={error}\n          required={required}\n          htmlFor={textareaId}\n          size={size}\n        >\n          {textarea}\n        </Field>\n      );\n    }\n\n    return textarea;\n  },\n);\n\nTextarea.displayName = \"Textarea\";\n"]}

package/dist/{chunk-CRR3AMJ4.js → chunk-UZCR7DK5.js}

@@ -56,7 +56,7 @@ var Avatar = forwardRef(
         className: cn(
           "relative inline-flex items-center justify-center rounded-full",
           containerSizeClasses[size],
-          !src && "bg-zinc-200 dark:bg-zinc-700",
+          !src && "bg-[color:var(--fancy-border,var(--color-zinc-200))] dark:bg-[color:var(--fancy-border-dark,var(--color-zinc-700))]",
           className
         ),
         children: [
@@ -90,7 +90,7 @@ var Avatar = forwardRef(
             "span",
             {
               className: cn(
-                "absolute bottom-0 right-0 rounded-full ring-2 ring-white dark:ring-zinc-900",
+                "absolute bottom-0 right-0 rounded-full ring-2 ring-[color:var(--fancy-surface,var(--color-white))] dark:ring-[color:var(--fancy-surface-dark,var(--color-zinc-900))]",
                 statusSizeClasses[size],
                 statusColorClasses[status]
               )
@@ -104,5 +104,5 @@ var Avatar = forwardRef(
 Avatar.displayName = "Avatar";
 
 export { Avatar };
-//# sourceMappingURL=chunk-CRR3AMJ4.js.map
-//# sourceMappingURL=chunk-CRR3AMJ4.js.map
+//# sourceMappingURL=chunk-UZCR7DK5.js.map
+//# sourceMappingURL=chunk-UZCR7DK5.js.map

package/dist/{chunk-CRR3AMJ4.js.map → chunk-UZCR7DK5.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":";;;;AAIA,IAAM,UAAA,GAAa;AAAA,EACjB,EAAA,EAAI,SAAA;AAAA;AAAA,EACJ,EAAA,EAAI,SAAA;AAAA;AAAA,EACJ,WAAA,EAAa;AAAA;AACf,CAAA;AAKA,IAAM,oBAAA,GAAmD;AAAA,EACvD,EAAA,EAAI,SAAA;AAAA,EACJ,EAAA,EAAI,SAAA;AAAA,EACJ,EAAA,EAAI,WAAA;AAAA,EACJ,EAAA,EAAI,WAAA;AAAA,EACJ,EAAA,EAAI;AACN,CAAA;AAEA,IAAM,gBAAA,GAA+C;AAAA,EACnD,EAAA,EAAI,SAAA;AAAA,EACJ,EAAA,EAAI,SAAA;AAAA,EACJ,EAAA,EAAI,SAAA;AAAA,EACJ,EAAA,EAAI,WAAA;AAAA,EACJ,EAAA,EAAI;AACN,CAAA;AAEA,IAAM,iBAAA,GAAgD;AAAA,EACpD,EAAA,EAAI,aAAA;AAAA,EACJ,EAAA,EAAI,SAAA;AAAA,EACJ,EAAA,EAAI,aAAA;AAAA,EACJ,EAAA,EAAI,SAAA;AAAA,EACJ,EAAA,EAAI;AACN,CAAA;AAEA,IAAM,kBAAA,GAAmD;AAAA,EACvD,MAAA,EAAQ,cAAA;AAAA,EACR,OAAA,EAAS,aAAA;AAAA,EACT,IAAA,EAAM,YAAA;AAAA,EACN,IAAA,EAAM;AACR,CAAA;AAEO,IAAM,MAAA,GAAS,UAAA;AAAA,EACpB,CACE;AAAA,IACE,GAAA;AAAA,IACA,GAAA,GAAM,EAAA;AAAA,IACN,QAAA;AAAA,IACA,IAAA,GAAO,IAAA;AAAA,IACP,MAAA;AAAA,IACA,IAAA;AAAA,IACA;AAAA,KAEF,GAAA,KACG;AACH,IAAA,MAAM,OAAA,GAAU,IAAA,KAAS,IAAA,GAAO,IAAA,GAAO,IAAA,IAAQ,IAAA;AAC/C,IAAA,uBACE,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,yBAAA,EAAwB,EAAA;AAAA,QACxB,SAAA,EAAW,EAAA;AAAA,UACT,+DAAA;AAAA,UACA,qBAAqB,IAAI,CAAA;AAAA,UACzB,CAAC,GAAA,IAAO,8BAAA;AAAA,UACR;AAAA,SACF;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,OAAA,oBACC,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,aAAA,EAAW,IAAA;AAAA,cACX,8BAAA,EAA8B,OAAA;AAAA,cAC9B,SAAA,EAAU,mBAAA;AAAA,cACV,KAAA,EAAO,EAAE,cAAA,EAAgB,UAAA,CAAW,OAAO,CAAA;AAAE;AAAA,WAC/C;AAAA,UAED,GAAA,mBACC,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,GAAA;AAAA,cACA,GAAA;AAAA,cACA,SAAA,EAAU;AAAA;AAAA,WACZ,mBAEA,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,EAAA;AAAA,gBACT,0DAAA;AAAA,gBACA,iBAAiB,IAAI;AAAA,eACvB;AAAA,cAEC,QAAA,EAAA;AAAA;AAAA,WACH;AAAA,UAED,MAAA,oBACC,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,EAAA;AAAA,gBACT,6EAAA;AAAA,gBACA,kBAAkB,IAAI,CAAA;AAAA,gBACtB,mBAAmB,MAAM;AAAA;AAC3B;AAAA;AACF;AAAA;AAAA,KAEJ;AAAA,EAEJ;AACF;AAEA,MAAA,CAAO,WAAA,GAAc,QAAA","file":"chunk-CRR3AMJ4.js","sourcesContent":["import { forwardRef, type CSSProperties } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { AvatarProps } from \"./Avatar.types\";\n\nconst glowColors = {\n  on: \"#a855f7\", // violet — neutral\n  xp: \"#22c55e\", // green\n  achievement: \"#f59e0b\", // amber\n} as const;\n\ntype AvatarSize = NonNullable<AvatarProps[\"size\"]>;\ntype AvatarStatus = NonNullable<AvatarProps[\"status\"]>;\n\nconst containerSizeClasses: Record<AvatarSize, string> = {\n  xs: \"h-6 w-6\",\n  sm: \"h-8 w-8\",\n  md: \"h-10 w-10\",\n  lg: \"h-12 w-12\",\n  xl: \"h-16 w-16\",\n};\n\nconst fallbackTextSize: Record<AvatarSize, string> = {\n  xs: \"text-xs\",\n  sm: \"text-xs\",\n  md: \"text-sm\",\n  lg: \"text-base\",\n  xl: \"text-lg\",\n};\n\nconst statusSizeClasses: Record<AvatarSize, string> = {\n  xs: \"h-1.5 w-1.5\",\n  sm: \"h-2 w-2\",\n  md: \"h-2.5 w-2.5\",\n  lg: \"h-3 w-3\",\n  xl: \"h-4 w-4\",\n};\n\nconst statusColorClasses: Record<AvatarStatus, string> = {\n  online: \"bg-green-500\",\n  offline: \"bg-zinc-400\",\n  busy: \"bg-red-500\",\n  away: \"bg-amber-500\",\n};\n\nexport const Avatar = forwardRef<HTMLDivElement, AvatarProps>(\n  (\n    {\n      src,\n      alt = \"\",\n      fallback,\n      size = \"md\",\n      status,\n      glow,\n      className,\n    },\n    ref,\n  ) => {\n    const glowKey = glow === true ? \"on\" : glow || null;\n    return (\n      <div\n        ref={ref}\n        data-react-fancy-avatar=\"\"\n        className={cn(\n          \"relative inline-flex items-center justify-center rounded-full\",\n          containerSizeClasses[size],\n          !src && \"bg-zinc-200 dark:bg-zinc-700\",\n          className,\n        )}\n      >\n        {glowKey && (\n          <span\n            aria-hidden\n            data-react-fancy-avatar-glow={glowKey}\n            className=\"fancy-avatar-glow\"\n            style={{ \"--fancy-glow\": glowColors[glowKey] } as CSSProperties}\n          />\n        )}\n        {src ? (\n          <img\n            src={src}\n            alt={alt}\n            className=\"h-full w-full rounded-full object-cover\"\n          />\n        ) : (\n          <span\n            className={cn(\n              \"font-medium text-zinc-600 dark:text-zinc-300 select-none\",\n              fallbackTextSize[size],\n            )}\n          >\n            {fallback}\n          </span>\n        )}\n        {status && (\n          <span\n            className={cn(\n              \"absolute bottom-0 right-0 rounded-full ring-2 ring-white dark:ring-zinc-900\",\n              statusSizeClasses[size],\n              statusColorClasses[status],\n            )}\n          />\n        )}\n      </div>\n    );\n  },\n);\n\nAvatar.displayName = \"Avatar\";\n"]}
+{"version":3,"sources":["../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":";;;;AAIA,IAAM,UAAA,GAAa;AAAA,EACjB,EAAA,EAAI,SAAA;AAAA;AAAA,EACJ,EAAA,EAAI,SAAA;AAAA;AAAA,EACJ,WAAA,EAAa;AAAA;AACf,CAAA;AAKA,IAAM,oBAAA,GAAmD;AAAA,EACvD,EAAA,EAAI,SAAA;AAAA,EACJ,EAAA,EAAI,SAAA;AAAA,EACJ,EAAA,EAAI,WAAA;AAAA,EACJ,EAAA,EAAI,WAAA;AAAA,EACJ,EAAA,EAAI;AACN,CAAA;AAEA,IAAM,gBAAA,GAA+C;AAAA,EACnD,EAAA,EAAI,SAAA;AAAA,EACJ,EAAA,EAAI,SAAA;AAAA,EACJ,EAAA,EAAI,SAAA;AAAA,EACJ,EAAA,EAAI,WAAA;AAAA,EACJ,EAAA,EAAI;AACN,CAAA;AAEA,IAAM,iBAAA,GAAgD;AAAA,EACpD,EAAA,EAAI,aAAA;AAAA,EACJ,EAAA,EAAI,SAAA;AAAA,EACJ,EAAA,EAAI,aAAA;AAAA,EACJ,EAAA,EAAI,SAAA;AAAA,EACJ,EAAA,EAAI;AACN,CAAA;AAEA,IAAM,kBAAA,GAAmD;AAAA,EACvD,MAAA,EAAQ,cAAA;AAAA,EACR,OAAA,EAAS,aAAA;AAAA,EACT,IAAA,EAAM,YAAA;AAAA,EACN,IAAA,EAAM;AACR,CAAA;AAEO,IAAM,MAAA,GAAS,UAAA;AAAA,EACpB,CACE;AAAA,IACE,GAAA;AAAA,IACA,GAAA,GAAM,EAAA;AAAA,IACN,QAAA;AAAA,IACA,IAAA,GAAO,IAAA;AAAA,IACP,MAAA;AAAA,IACA,IAAA;AAAA,IACA;AAAA,KAEF,GAAA,KACG;AACH,IAAA,MAAM,OAAA,GAAU,IAAA,KAAS,IAAA,GAAO,IAAA,GAAO,IAAA,IAAQ,IAAA;AAC/C,IAAA,uBACE,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,yBAAA,EAAwB,EAAA;AAAA,QACxB,SAAA,EAAW,EAAA;AAAA,UACT,+DAAA;AAAA,UACA,qBAAqB,IAAI,CAAA;AAAA,UACzB,CAAC,GAAA,IAAO,qHAAA;AAAA,UACR;AAAA,SACF;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,OAAA,oBACC,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,aAAA,EAAW,IAAA;AAAA,cACX,8BAAA,EAA8B,OAAA;AAAA,cAC9B,SAAA,EAAU,mBAAA;AAAA,cACV,KAAA,EAAO,EAAE,cAAA,EAAgB,UAAA,CAAW,OAAO,CAAA;AAAE;AAAA,WAC/C;AAAA,UAED,GAAA,mBACC,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,GAAA;AAAA,cACA,GAAA;AAAA,cACA,SAAA,EAAU;AAAA;AAAA,WACZ,mBAEA,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,EAAA;AAAA,gBACT,0DAAA;AAAA,gBACA,iBAAiB,IAAI;AAAA,eACvB;AAAA,cAEC,QAAA,EAAA;AAAA;AAAA,WACH;AAAA,UAED,MAAA,oBACC,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,EAAA;AAAA,gBACT,sKAAA;AAAA,gBACA,kBAAkB,IAAI,CAAA;AAAA,gBACtB,mBAAmB,MAAM;AAAA;AAC3B;AAAA;AACF;AAAA;AAAA,KAEJ;AAAA,EAEJ;AACF;AAEA,MAAA,CAAO,WAAA,GAAc,QAAA","file":"chunk-UZCR7DK5.js","sourcesContent":["import { forwardRef, type CSSProperties } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { AvatarProps } from \"./Avatar.types\";\n\nconst glowColors = {\n  on: \"#a855f7\", // violet — neutral\n  xp: \"#22c55e\", // green\n  achievement: \"#f59e0b\", // amber\n} as const;\n\ntype AvatarSize = NonNullable<AvatarProps[\"size\"]>;\ntype AvatarStatus = NonNullable<AvatarProps[\"status\"]>;\n\nconst containerSizeClasses: Record<AvatarSize, string> = {\n  xs: \"h-6 w-6\",\n  sm: \"h-8 w-8\",\n  md: \"h-10 w-10\",\n  lg: \"h-12 w-12\",\n  xl: \"h-16 w-16\",\n};\n\nconst fallbackTextSize: Record<AvatarSize, string> = {\n  xs: \"text-xs\",\n  sm: \"text-xs\",\n  md: \"text-sm\",\n  lg: \"text-base\",\n  xl: \"text-lg\",\n};\n\nconst statusSizeClasses: Record<AvatarSize, string> = {\n  xs: \"h-1.5 w-1.5\",\n  sm: \"h-2 w-2\",\n  md: \"h-2.5 w-2.5\",\n  lg: \"h-3 w-3\",\n  xl: \"h-4 w-4\",\n};\n\nconst statusColorClasses: Record<AvatarStatus, string> = {\n  online: \"bg-green-500\",\n  offline: \"bg-zinc-400\",\n  busy: \"bg-red-500\",\n  away: \"bg-amber-500\",\n};\n\nexport const Avatar = forwardRef<HTMLDivElement, AvatarProps>(\n  (\n    {\n      src,\n      alt = \"\",\n      fallback,\n      size = \"md\",\n      status,\n      glow,\n      className,\n    },\n    ref,\n  ) => {\n    const glowKey = glow === true ? \"on\" : glow || null;\n    return (\n      <div\n        ref={ref}\n        data-react-fancy-avatar=\"\"\n        className={cn(\n          \"relative inline-flex items-center justify-center rounded-full\",\n          containerSizeClasses[size],\n          !src && \"bg-[color:var(--fancy-border,var(--color-zinc-200))] dark:bg-[color:var(--fancy-border-dark,var(--color-zinc-700))]\",\n          className,\n        )}\n      >\n        {glowKey && (\n          <span\n            aria-hidden\n            data-react-fancy-avatar-glow={glowKey}\n            className=\"fancy-avatar-glow\"\n            style={{ \"--fancy-glow\": glowColors[glowKey] } as CSSProperties}\n          />\n        )}\n        {src ? (\n          <img\n            src={src}\n            alt={alt}\n            className=\"h-full w-full rounded-full object-cover\"\n          />\n        ) : (\n          <span\n            className={cn(\n              \"font-medium text-zinc-600 dark:text-zinc-300 select-none\",\n              fallbackTextSize[size],\n            )}\n          >\n            {fallback}\n          </span>\n        )}\n        {status && (\n          <span\n            className={cn(\n              \"absolute bottom-0 right-0 rounded-full ring-2 ring-[color:var(--fancy-surface,var(--color-white))] dark:ring-[color:var(--fancy-surface-dark,var(--color-zinc-900))]\",\n              statusSizeClasses[size],\n              statusColorClasses[status],\n            )}\n          />\n        )}\n      </div>\n    );\n  },\n);\n\nAvatar.displayName = \"Avatar\";\n"]}

package/dist/{chunk-WKNVZUWZ.cjs → chunk-UZG6LO4Z.cjs}

@@ -58,7 +58,7 @@ function PopoverContent({ children, className, style, ...rest }) {
       },
       "data-react-fancy-popover": "",
       className: chunkZU5Q77OT_cjs.cn(
-        "fixed z-50 rounded-xl border border-zinc-200 bg-white p-4 text-zinc-700 shadow-lg dark:border-zinc-700 dark:bg-zinc-900 dark:text-zinc-200 dark:shadow-zinc-950/50",
+        "fixed z-50 rounded-xl border border-[color:var(--fancy-border,var(--color-zinc-200))] bg-[color:var(--fancy-surface,var(--color-white))] p-4 text-zinc-700 shadow-lg dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-surface-dark,var(--color-zinc-900))] dark:text-zinc-200 dark:shadow-zinc-950/50",
         positioned ? "fancy-scale-in" : "invisible",
         className
       ),
@@ -117,5 +117,5 @@ var Popover = Object.assign(PopoverRoot, {
 
 exports.Popover = Popover;
 exports.usePopover = usePopover;
-//# sourceMappingURL=chunk-WKNVZUWZ.cjs.map
-//# sourceMappingURL=chunk-WKNVZUWZ.cjs.map
+//# sourceMappingURL=chunk-UZG6LO4Z.cjs.map
+//# sourceMappingURL=chunk-UZG6LO4Z.cjs.map

package/dist/{chunk-WKNVZUWZ.cjs.map → chunk-UZG6LO4Z.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Popover/Popover.context.ts","../src/components/Popover/PopoverTrigger.tsx","../src/components/Popover/PopoverContent.tsx","../src/components/Popover/Popover.tsx"],"names":["createContext","useContext","jsx","cn","useRef","useFloatingPosition","useCallback","useOutsideClick","useEscapeKey","Portal","useState","useMemo"],"mappings":"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","file":"chunk-WKNVZUWZ.cjs","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { PopoverContextValue } from \"./Popover.types\";\n\nexport const PopoverContext = createContext<PopoverContextValue | null>(null);\n\nexport function usePopover(): PopoverContextValue {\n  const ctx = useContext(PopoverContext);\n  if (!ctx) {\n    throw new Error(\"Popover compound components must be used within <Popover>\");\n  }\n  return ctx;\n}\n","import { cn } from \"../../utils/cn\";\nimport { usePopover } from \"./Popover.context\";\nimport type { PopoverTriggerProps } from \"./Popover.types\";\n\nexport function PopoverTrigger({ children, className, ...rest }: PopoverTriggerProps) {\n  const { setOpen, open, anchorRef, hover, onHoverEnter, onHoverLeave } = usePopover();\n\n  return (\n    <span\n      {...rest}\n      ref={anchorRef as React.RefObject<HTMLSpanElement>}\n      data-react-fancy-popover-trigger=\"\"\n      className={cn(\"inline-flex\", className)}\n      onClick={hover ? undefined : () => setOpen(!open)}\n      onMouseEnter={hover ? onHoverEnter : undefined}\n      onMouseLeave={hover ? onHoverLeave : undefined}\n      aria-expanded={open}\n      aria-haspopup\n    >\n      {children}\n    </span>\n  );\n}\n\nPopoverTrigger.displayName = \"PopoverTrigger\";\n","import { useCallback, useRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { usePopover } from \"./Popover.context\";\nimport { useFloatingPosition } from \"../../hooks/use-floating-position\";\nimport { useOutsideClick } from \"../../hooks/use-outside-click\";\nimport { useEscapeKey } from \"../../hooks/use-escape-key\";\nimport type { PopoverContentProps } from \"./Popover.types\";\n\nexport function PopoverContent({ children, className, style, ...rest }: PopoverContentProps) {\n  const { open, setOpen, anchorRef, floatingRef, placement, offset, hover, onHoverEnter, onHoverLeave } = usePopover();\n  const outsideRef = useRef<HTMLDivElement>(null);\n\n  const position = useFloatingPosition(anchorRef, floatingRef, {\n    placement,\n    offset,\n    enabled: open,\n  });\n\n  const close = useCallback(() => setOpen(false), [setOpen]);\n  useOutsideClick(outsideRef, close, open && !hover, anchorRef);\n  useEscapeKey(close, open);\n\n  // Hide until position is calculated to prevent flash at (-9999, -9999)\n  const positioned = position.x !== -9999 && position.y !== -9999;\n\n  if (!open) return null;\n\n  return (\n    <Portal>\n      <div\n        {...rest}\n        ref={(node) => {\n          outsideRef.current = node;\n          (floatingRef as React.MutableRefObject<HTMLDivElement | null>).current = node;\n        }}\n        data-react-fancy-popover=\"\"\n        className={cn(\n          \"fixed z-50 rounded-xl border border-zinc-200 bg-white p-4 text-zinc-700 shadow-lg dark:border-zinc-700 dark:bg-zinc-900 dark:text-zinc-200 dark:shadow-zinc-950/50\",\n          positioned ? \"fancy-scale-in\" : \"invisible\",\n          className,\n        )}\n        style={{ ...style, left: position.x, top: position.y }}\n        onMouseEnter={hover ? onHoverEnter : undefined}\n        onMouseLeave={hover ? onHoverLeave : undefined}\n      >\n        {children}\n      </div>\n    </Portal>\n  );\n}\n\nPopoverContent.displayName = \"PopoverContent\";\n","import { useCallback, useMemo, useRef, useState } from \"react\";\nimport { PopoverContext } from \"./Popover.context\";\nimport { PopoverTrigger } from \"./PopoverTrigger\";\nimport { PopoverContent } from \"./PopoverContent\";\nimport type { PopoverProps } from \"./Popover.types\";\n\nfunction PopoverRoot({\n  children,\n  open: controlledOpen,\n  defaultOpen = false,\n  onOpenChange,\n  placement = \"bottom\",\n  offset = 8,\n  hover = false,\n  hoverDelay = 200,\n  hoverCloseDelay = 300,\n}: PopoverProps) {\n  const [internalOpen, setInternalOpen] = useState(defaultOpen);\n  const isControlled = controlledOpen !== undefined;\n  const open = isControlled ? controlledOpen : internalOpen;\n\n  const anchorRef = useRef<HTMLElement>(null);\n  const floatingRef = useRef<HTMLDivElement>(null);\n  const hoverTimeoutRef = useRef<ReturnType<typeof setTimeout>>(undefined);\n\n  const setOpen = useCallback(\n    (next: boolean) => {\n      if (!isControlled) setInternalOpen(next);\n      onOpenChange?.(next);\n    },\n    [isControlled, onOpenChange],\n  );\n\n  const onHoverEnter = useCallback(() => {\n    if (!hover) return;\n    clearTimeout(hoverTimeoutRef.current);\n    hoverTimeoutRef.current = setTimeout(() => setOpen(true), hoverDelay);\n  }, [hover, hoverDelay, setOpen]);\n\n  const onHoverLeave = useCallback(() => {\n    if (!hover) return;\n    clearTimeout(hoverTimeoutRef.current);\n    hoverTimeoutRef.current = setTimeout(() => setOpen(false), hoverCloseDelay);\n  }, [hover, hoverCloseDelay, setOpen]);\n\n  const ctx = useMemo(\n    () => ({ open, setOpen, anchorRef, floatingRef, placement, offset, hover, onHoverEnter, onHoverLeave }),\n    [open, setOpen, placement, offset, hover, onHoverEnter, onHoverLeave],\n  );\n\n  return (\n    <PopoverContext.Provider value={ctx}>{children}</PopoverContext.Provider>\n  );\n}\n\nexport const Popover = Object.assign(PopoverRoot, {\n  Trigger: PopoverTrigger,\n  Content: PopoverContent,\n});\n"]}
+{"version":3,"sources":["../src/components/Popover/Popover.context.ts","../src/components/Popover/PopoverTrigger.tsx","../src/components/Popover/PopoverContent.tsx","../src/components/Popover/Popover.tsx"],"names":["createContext","useContext","jsx","cn","useRef","useFloatingPosition","useCallback","useOutsideClick","useEscapeKey","Portal","useState","useMemo"],"mappings":"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","file":"chunk-UZG6LO4Z.cjs","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { PopoverContextValue } from \"./Popover.types\";\n\nexport const PopoverContext = createContext<PopoverContextValue | null>(null);\n\nexport function usePopover(): PopoverContextValue {\n  const ctx = useContext(PopoverContext);\n  if (!ctx) {\n    throw new Error(\"Popover compound components must be used within <Popover>\");\n  }\n  return ctx;\n}\n","import { cn } from \"../../utils/cn\";\nimport { usePopover } from \"./Popover.context\";\nimport type { PopoverTriggerProps } from \"./Popover.types\";\n\nexport function PopoverTrigger({ children, className, ...rest }: PopoverTriggerProps) {\n  const { setOpen, open, anchorRef, hover, onHoverEnter, onHoverLeave } = usePopover();\n\n  return (\n    <span\n      {...rest}\n      ref={anchorRef as React.RefObject<HTMLSpanElement>}\n      data-react-fancy-popover-trigger=\"\"\n      className={cn(\"inline-flex\", className)}\n      onClick={hover ? undefined : () => setOpen(!open)}\n      onMouseEnter={hover ? onHoverEnter : undefined}\n      onMouseLeave={hover ? onHoverLeave : undefined}\n      aria-expanded={open}\n      aria-haspopup\n    >\n      {children}\n    </span>\n  );\n}\n\nPopoverTrigger.displayName = \"PopoverTrigger\";\n","import { useCallback, useRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { Portal } from \"../Portal\";\nimport { usePopover } from \"./Popover.context\";\nimport { useFloatingPosition } from \"../../hooks/use-floating-position\";\nimport { useOutsideClick } from \"../../hooks/use-outside-click\";\nimport { useEscapeKey } from \"../../hooks/use-escape-key\";\nimport type { PopoverContentProps } from \"./Popover.types\";\n\nexport function PopoverContent({ children, className, style, ...rest }: PopoverContentProps) {\n  const { open, setOpen, anchorRef, floatingRef, placement, offset, hover, onHoverEnter, onHoverLeave } = usePopover();\n  const outsideRef = useRef<HTMLDivElement>(null);\n\n  const position = useFloatingPosition(anchorRef, floatingRef, {\n    placement,\n    offset,\n    enabled: open,\n  });\n\n  const close = useCallback(() => setOpen(false), [setOpen]);\n  useOutsideClick(outsideRef, close, open && !hover, anchorRef);\n  useEscapeKey(close, open);\n\n  // Hide until position is calculated to prevent flash at (-9999, -9999)\n  const positioned = position.x !== -9999 && position.y !== -9999;\n\n  if (!open) return null;\n\n  return (\n    <Portal>\n      <div\n        {...rest}\n        ref={(node) => {\n          outsideRef.current = node;\n          (floatingRef as React.MutableRefObject<HTMLDivElement | null>).current = node;\n        }}\n        data-react-fancy-popover=\"\"\n        className={cn(\n          \"fixed z-50 rounded-xl border border-[color:var(--fancy-border,var(--color-zinc-200))] bg-[color:var(--fancy-surface,var(--color-white))] p-4 text-zinc-700 shadow-lg dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-surface-dark,var(--color-zinc-900))] dark:text-zinc-200 dark:shadow-zinc-950/50\",\n          positioned ? \"fancy-scale-in\" : \"invisible\",\n          className,\n        )}\n        style={{ ...style, left: position.x, top: position.y }}\n        onMouseEnter={hover ? onHoverEnter : undefined}\n        onMouseLeave={hover ? onHoverLeave : undefined}\n      >\n        {children}\n      </div>\n    </Portal>\n  );\n}\n\nPopoverContent.displayName = \"PopoverContent\";\n","import { useCallback, useMemo, useRef, useState } from \"react\";\nimport { PopoverContext } from \"./Popover.context\";\nimport { PopoverTrigger } from \"./PopoverTrigger\";\nimport { PopoverContent } from \"./PopoverContent\";\nimport type { PopoverProps } from \"./Popover.types\";\n\nfunction PopoverRoot({\n  children,\n  open: controlledOpen,\n  defaultOpen = false,\n  onOpenChange,\n  placement = \"bottom\",\n  offset = 8,\n  hover = false,\n  hoverDelay = 200,\n  hoverCloseDelay = 300,\n}: PopoverProps) {\n  const [internalOpen, setInternalOpen] = useState(defaultOpen);\n  const isControlled = controlledOpen !== undefined;\n  const open = isControlled ? controlledOpen : internalOpen;\n\n  const anchorRef = useRef<HTMLElement>(null);\n  const floatingRef = useRef<HTMLDivElement>(null);\n  const hoverTimeoutRef = useRef<ReturnType<typeof setTimeout>>(undefined);\n\n  const setOpen = useCallback(\n    (next: boolean) => {\n      if (!isControlled) setInternalOpen(next);\n      onOpenChange?.(next);\n    },\n    [isControlled, onOpenChange],\n  );\n\n  const onHoverEnter = useCallback(() => {\n    if (!hover) return;\n    clearTimeout(hoverTimeoutRef.current);\n    hoverTimeoutRef.current = setTimeout(() => setOpen(true), hoverDelay);\n  }, [hover, hoverDelay, setOpen]);\n\n  const onHoverLeave = useCallback(() => {\n    if (!hover) return;\n    clearTimeout(hoverTimeoutRef.current);\n    hoverTimeoutRef.current = setTimeout(() => setOpen(false), hoverCloseDelay);\n  }, [hover, hoverCloseDelay, setOpen]);\n\n  const ctx = useMemo(\n    () => ({ open, setOpen, anchorRef, floatingRef, placement, offset, hover, onHoverEnter, onHoverLeave }),\n    [open, setOpen, placement, offset, hover, onHoverEnter, onHoverLeave],\n  );\n\n  return (\n    <PopoverContext.Provider value={ctx}>{children}</PopoverContext.Provider>\n  );\n}\n\nexport const Popover = Object.assign(PopoverRoot, {\n  Trigger: PopoverTrigger,\n  Content: PopoverContent,\n});\n"]}

package/dist/{chunk-DCVR6NPP.js → chunk-V4235IZO.js}

@@ -55,7 +55,7 @@ ActivityLight.displayName = "ActivityLight";
 var LEVEL_CLASS = {
   live: "text-emerald-500 dark:text-emerald-400",
   recent: "text-sky-500 dark:text-sky-400",
-  quiet: "text-zinc-400 dark:text-zinc-500",
+  quiet: "text-[color:var(--fancy-text-faint,var(--color-zinc-400))] dark:text-[color:var(--fancy-text-faint-dark,var(--color-zinc-500))]",
   unseen: "text-amber-500 dark:text-amber-400"
 };
 var DIRECTION_GLYPH = {
@@ -65,5 +65,5 @@ var DIRECTION_GLYPH = {
 };
 
 export { ActivityLight };
-//# sourceMappingURL=chunk-DCVR6NPP.js.map
-//# sourceMappingURL=chunk-DCVR6NPP.js.map
+//# sourceMappingURL=chunk-V4235IZO.js.map
+//# sourceMappingURL=chunk-V4235IZO.js.map

package/dist/{chunk-DCVR6NPP.js.map → chunk-V4235IZO.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/ActivityLight/ActivityLight.tsx"],"names":[],"mappings":";;;;AAkCO,IAAM,aAAA,GAAgB,UAAA;AAAA,EAC3B,CAAC,EAAE,KAAA,EAAO,SAAA,EAAW,KAAA,GAAQ,IAAA,EAAM,KAAA,EAAO,SAAA,EAAW,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AAEvE,IAAA,IAAI,KAAA,KAAU,MAAM,OAAO,IAAA;AAE3B,IAAA,MAAM,UAAU,OAAO,KAAA,KAAU,QAAA,IAAY,MAAA,CAAO,SAAS,KAAK,CAAA;AAElE,IAAA,uBACE,IAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,iCAAA,EAAiC,KAAA;AAAA,QAChC,GAAI,SAAA,GAAY,EAAE,2CAAA,EAA6C,SAAA,KAAc,EAAC;AAAA,QAC/E,YAAA,EAAY,OAAA,GAAU,CAAA,EAAG,KAAK,CAAA,EAAA,EAAK,KAAK,CAAA,EAAA,EAAK,KAAK,CAAA,CAAA,GAAK,CAAA,EAAG,KAAK,CAAA,EAAA,EAAK,KAAK,CAAA,CAAA;AAAA,QACzE,IAAA,EAAK,KAAA;AAAA,QACL,SAAA,EAAW,EAAA;AAAA,UACT,6CAAA;AAAA,UACA,YAAY,KAAK,CAAA;AAAA,UACjB;AAAA,SACF;AAAA,QACC,GAAG,KAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,qCAAA,EAAoC,EAAA;AAAA,cACpC,aAAA,EAAY,MAAA;AAAA,cACZ,SAAA,EAAW,EAAA,CAAG,yCAAA,EAA2C,KAAA,KAAU,UAAU,eAAe;AAAA;AAAA,WAC9F;AAAA,UAEC,SAAA,oBACC,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,uCAAA,EAAsC,EAAA;AAAA,cACtC,aAAA,EAAY,MAAA;AAAA,cACZ,SAAA,EAAU,wCAAA;AAAA,cAET,0BAAgB,SAAS;AAAA;AAAA,WAC5B;AAAA,UAID,OAAA,oBACC,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,uCAAA,EAAsC,EAAA;AAAA,cACtC,SAAA,EAAU,6CAAA;AAAA,cAET,QAAA,EAAA;AAAA;AAAA;AACH;AAAA;AAAA,KAEJ;AAAA,EAEJ;AACF;AAEA,aAAA,CAAc,WAAA,GAAc,eAAA;AAM5B,IAAM,WAAA,GAA6C;AAAA,EACjD,IAAA,EAAM,wCAAA;AAAA,EACN,MAAA,EAAQ,gCAAA;AAAA,EACR,KAAA,EAAO,kCAAA;AAAA,EACP,MAAA,EAAQ;AACV,CAAA;AAwBA,IAAM,eAAA,GAAyD;AAAA,EAC7D,EAAA,EAAI,QAAA;AAAA,EACJ,GAAA,EAAK,QAAA;AAAA,EACL,IAAA,EAAM;AACR,CAAA","file":"chunk-DCVR6NPP.js","sourcesContent":["import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { ActivityLightProps, ActivityLevel } from \"./ActivityLight.types\";\n\n/**\n * Activity on an **edge** — a relationship between two parties — with a recency\n * ramp and an optional volume.\n *\n * Not a presence dot. `Avatar status` belongs to one party and says whether\n * *they* are online; this belongs to a pair and says when *the link between\n * them* last moved. Use it in a comms column, a collaborator lane, anywhere the\n * subject is the relationship rather than the participant.\n *\n * ## Two kinds of nothing, and they must not look alike\n *\n * - **`level: null`** — the edge is real, its recency is not observable. Renders\n *   NOTHING: no dot, no dash, no placeholder. A grey dot would assert \"quiet\",\n *   which is a claim we cannot make.\n * - **`count: null`** or omitted — the edge's recency is known but its volume is\n *   not. Renders the light with no number.\n * - **`count: 0`** — measured, and none. Renders `0`, because that is a fact.\n *   Suppressing it would be indistinguishable from not having looked.\n *\n * The distinction reads as pedantic until a count is wrong in the direction\n * that flatters: a `0` where the truth is \"unknown\" tells the reader an agent\n * works alone, and they believe it.\n *\n * @example\n * ```tsx\n * <ActivityLight level=\"live\" direction=\"both\" count={12} label=\"Genie and Tynn\" />\n * <ActivityLight level=\"quiet\" count={0} label=\"Genie and Weaver\" />\n * <ActivityLight level={null} label=\"Genie and an unknown peer\" />\n * ```\n */\nexport const ActivityLight = forwardRef<HTMLSpanElement, ActivityLightProps>(\n  ({ level, direction, count = null, label, className, ...props }, ref) => {\n    // The one early return in the component, and the most important line in it.\n    if (level === null) return null;\n\n    const counted = typeof count === \"number\" && Number.isFinite(count);\n\n    return (\n      <span\n        ref={ref}\n        data-react-fancy-activity-light={level}\n        {...(direction ? { \"data-react-fancy-activity-light-direction\": direction } : {})}\n        aria-label={counted ? `${label}: ${level}, ${count}` : `${label}: ${level}`}\n        role=\"img\"\n        className={cn(\n          \"inline-flex items-center gap-1 align-middle\",\n          LEVEL_CLASS[level],\n          className,\n        )}\n        {...props}\n      >\n        <span\n          data-react-fancy-activity-light-dot=\"\"\n          aria-hidden=\"true\"\n          className={cn(\"size-2 shrink-0 rounded-full bg-current\", level === \"live\" && \"animate-pulse\")}\n        />\n\n        {direction && (\n          <span\n            data-react-fancy-activity-light-arrow=\"\"\n            aria-hidden=\"true\"\n            className=\"font-mono text-[0.625rem] leading-none\"\n          >\n            {DIRECTION_GLYPH[direction]}\n          </span>\n        )}\n\n        {/* `counted` is the gate, NOT `count` — `0` is falsy and would vanish. */}\n        {counted && (\n          <span\n            data-react-fancy-activity-light-count=\"\"\n            className=\"font-mono text-xs tabular-nums leading-none\"\n          >\n            {count}\n          </span>\n        )}\n      </span>\n    );\n  },\n);\n\nActivityLight.displayName = \"ActivityLight\";\n\n/**\n * The ramp. Each level is visually distinct from every other — a test asserts\n * that, because two levels that look alike make the ramp a lie.\n */\nconst LEVEL_CLASS: Record<ActivityLevel, string> = {\n  live: \"text-emerald-500 dark:text-emerald-400\",\n  recent: \"text-sky-500 dark:text-sky-400\",\n  quiet: \"text-zinc-400 dark:text-zinc-500\",\n  unseen: \"text-amber-500 dark:text-amber-400\",\n};\n\n/**\n * The direction marks, CHOSEN FOR FONT COVERAGE as much as for meaning.\n *\n * `both` was U+21C4 (⇄), which has no coverage in the Liberation fonts — so in\n * a container carrying only those, `in` and `out` drew arrows and `both` drew a\n * tofu box. One of three states failing is worse than all three failing,\n * because the reader cannot tell a font gap from a state: they see two working\n * indicators and one they have no reason to distrust.\n *\n * U+2194 (↔) is in **WGL4**, the repertoire Liberation targets, and that is the\n * line these three sit on — U+2190–2195 are in it, U+21C4 and the whole\n * Dingbats block are not. MEASURED by `claude · tynn` in a Liberation-only\n * container (2026-10-10), rasterising each character and comparing it\n * pixel-for-pixel against a Private Use Area codepoint no font covers: `↔`\n * draws, and U+21C6 `⇆` — the near neighbour, included as a falsifier — does\n * not, which is what makes it evidence of the repertoire rather than of\n * \"Liberation covers arrows\".\n *\n * **So do not \"improve\" `both` back to a prettier arrow.** U+21C4, U+21C6 and\n * the Dingbats (`✓` `✕` `✦`) all need a font many lean images do not ship.\n * A test pins this set.\n */\nconst DIRECTION_GLYPH: Record<\"in\" | \"out\" | \"both\", string> = {\n  in: \"←\",\n  out: \"→\",\n  both: \"↔\",\n};\n"]}
+{"version":3,"sources":["../src/components/ActivityLight/ActivityLight.tsx"],"names":[],"mappings":";;;;AAkCO,IAAM,aAAA,GAAgB,UAAA;AAAA,EAC3B,CAAC,EAAE,KAAA,EAAO,SAAA,EAAW,KAAA,GAAQ,IAAA,EAAM,KAAA,EAAO,SAAA,EAAW,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AAEvE,IAAA,IAAI,KAAA,KAAU,MAAM,OAAO,IAAA;AAE3B,IAAA,MAAM,UAAU,OAAO,KAAA,KAAU,QAAA,IAAY,MAAA,CAAO,SAAS,KAAK,CAAA;AAElE,IAAA,uBACE,IAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,iCAAA,EAAiC,KAAA;AAAA,QAChC,GAAI,SAAA,GAAY,EAAE,2CAAA,EAA6C,SAAA,KAAc,EAAC;AAAA,QAC/E,YAAA,EAAY,OAAA,GAAU,CAAA,EAAG,KAAK,CAAA,EAAA,EAAK,KAAK,CAAA,EAAA,EAAK,KAAK,CAAA,CAAA,GAAK,CAAA,EAAG,KAAK,CAAA,EAAA,EAAK,KAAK,CAAA,CAAA;AAAA,QACzE,IAAA,EAAK,KAAA;AAAA,QACL,SAAA,EAAW,EAAA;AAAA,UACT,6CAAA;AAAA,UACA,YAAY,KAAK,CAAA;AAAA,UACjB;AAAA,SACF;AAAA,QACC,GAAG,KAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,qCAAA,EAAoC,EAAA;AAAA,cACpC,aAAA,EAAY,MAAA;AAAA,cACZ,SAAA,EAAW,EAAA,CAAG,yCAAA,EAA2C,KAAA,KAAU,UAAU,eAAe;AAAA;AAAA,WAC9F;AAAA,UAEC,SAAA,oBACC,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,uCAAA,EAAsC,EAAA;AAAA,cACtC,aAAA,EAAY,MAAA;AAAA,cACZ,SAAA,EAAU,wCAAA;AAAA,cAET,0BAAgB,SAAS;AAAA;AAAA,WAC5B;AAAA,UAID,OAAA,oBACC,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,uCAAA,EAAsC,EAAA;AAAA,cACtC,SAAA,EAAU,6CAAA;AAAA,cAET,QAAA,EAAA;AAAA;AAAA;AACH;AAAA;AAAA,KAEJ;AAAA,EAEJ;AACF;AAEA,aAAA,CAAc,WAAA,GAAc,eAAA;AAM5B,IAAM,WAAA,GAA6C;AAAA,EACjD,IAAA,EAAM,wCAAA;AAAA,EACN,MAAA,EAAQ,gCAAA;AAAA,EACR,KAAA,EAAO,iIAAA;AAAA,EACP,MAAA,EAAQ;AACV,CAAA;AAwBA,IAAM,eAAA,GAAyD;AAAA,EAC7D,EAAA,EAAI,QAAA;AAAA,EACJ,GAAA,EAAK,QAAA;AAAA,EACL,IAAA,EAAM;AACR,CAAA","file":"chunk-V4235IZO.js","sourcesContent":["import { forwardRef } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { ActivityLightProps, ActivityLevel } from \"./ActivityLight.types\";\n\n/**\n * Activity on an **edge** — a relationship between two parties — with a recency\n * ramp and an optional volume.\n *\n * Not a presence dot. `Avatar status` belongs to one party and says whether\n * *they* are online; this belongs to a pair and says when *the link between\n * them* last moved. Use it in a comms column, a collaborator lane, anywhere the\n * subject is the relationship rather than the participant.\n *\n * ## Two kinds of nothing, and they must not look alike\n *\n * - **`level: null`** — the edge is real, its recency is not observable. Renders\n *   NOTHING: no dot, no dash, no placeholder. A grey dot would assert \"quiet\",\n *   which is a claim we cannot make.\n * - **`count: null`** or omitted — the edge's recency is known but its volume is\n *   not. Renders the light with no number.\n * - **`count: 0`** — measured, and none. Renders `0`, because that is a fact.\n *   Suppressing it would be indistinguishable from not having looked.\n *\n * The distinction reads as pedantic until a count is wrong in the direction\n * that flatters: a `0` where the truth is \"unknown\" tells the reader an agent\n * works alone, and they believe it.\n *\n * @example\n * ```tsx\n * <ActivityLight level=\"live\" direction=\"both\" count={12} label=\"Genie and Tynn\" />\n * <ActivityLight level=\"quiet\" count={0} label=\"Genie and Weaver\" />\n * <ActivityLight level={null} label=\"Genie and an unknown peer\" />\n * ```\n */\nexport const ActivityLight = forwardRef<HTMLSpanElement, ActivityLightProps>(\n  ({ level, direction, count = null, label, className, ...props }, ref) => {\n    // The one early return in the component, and the most important line in it.\n    if (level === null) return null;\n\n    const counted = typeof count === \"number\" && Number.isFinite(count);\n\n    return (\n      <span\n        ref={ref}\n        data-react-fancy-activity-light={level}\n        {...(direction ? { \"data-react-fancy-activity-light-direction\": direction } : {})}\n        aria-label={counted ? `${label}: ${level}, ${count}` : `${label}: ${level}`}\n        role=\"img\"\n        className={cn(\n          \"inline-flex items-center gap-1 align-middle\",\n          LEVEL_CLASS[level],\n          className,\n        )}\n        {...props}\n      >\n        <span\n          data-react-fancy-activity-light-dot=\"\"\n          aria-hidden=\"true\"\n          className={cn(\"size-2 shrink-0 rounded-full bg-current\", level === \"live\" && \"animate-pulse\")}\n        />\n\n        {direction && (\n          <span\n            data-react-fancy-activity-light-arrow=\"\"\n            aria-hidden=\"true\"\n            className=\"font-mono text-[0.625rem] leading-none\"\n          >\n            {DIRECTION_GLYPH[direction]}\n          </span>\n        )}\n\n        {/* `counted` is the gate, NOT `count` — `0` is falsy and would vanish. */}\n        {counted && (\n          <span\n            data-react-fancy-activity-light-count=\"\"\n            className=\"font-mono text-xs tabular-nums leading-none\"\n          >\n            {count}\n          </span>\n        )}\n      </span>\n    );\n  },\n);\n\nActivityLight.displayName = \"ActivityLight\";\n\n/**\n * The ramp. Each level is visually distinct from every other — a test asserts\n * that, because two levels that look alike make the ramp a lie.\n */\nconst LEVEL_CLASS: Record<ActivityLevel, string> = {\n  live: \"text-emerald-500 dark:text-emerald-400\",\n  recent: \"text-sky-500 dark:text-sky-400\",\n  quiet: \"text-[color:var(--fancy-text-faint,var(--color-zinc-400))] dark:text-[color:var(--fancy-text-faint-dark,var(--color-zinc-500))]\",\n  unseen: \"text-amber-500 dark:text-amber-400\",\n};\n\n/**\n * The direction marks, CHOSEN FOR FONT COVERAGE as much as for meaning.\n *\n * `both` was U+21C4 (⇄), which has no coverage in the Liberation fonts — so in\n * a container carrying only those, `in` and `out` drew arrows and `both` drew a\n * tofu box. One of three states failing is worse than all three failing,\n * because the reader cannot tell a font gap from a state: they see two working\n * indicators and one they have no reason to distrust.\n *\n * U+2194 (↔) is in **WGL4**, the repertoire Liberation targets, and that is the\n * line these three sit on — U+2190–2195 are in it, U+21C4 and the whole\n * Dingbats block are not. MEASURED by `claude · tynn` in a Liberation-only\n * container (2026-10-10), rasterising each character and comparing it\n * pixel-for-pixel against a Private Use Area codepoint no font covers: `↔`\n * draws, and U+21C6 `⇆` — the near neighbour, included as a falsifier — does\n * not, which is what makes it evidence of the repertoire rather than of\n * \"Liberation covers arrows\".\n *\n * **So do not \"improve\" `both` back to a prettier arrow.** U+21C4, U+21C6 and\n * the Dingbats (`✓` `✕` `✦`) all need a font many lean images do not ship.\n * A test pins this set.\n */\nconst DIRECTION_GLYPH: Record<\"in\" | \"out\" | \"both\", string> = {\n  in: \"←\",\n  out: \"→\",\n  both: \"↔\",\n};\n"]}

package/dist/{chunk-WIS4QRGK.cjs → chunk-V5JTTLJP.cjs}

@@ -89,12 +89,12 @@ function EmojiSelect({ value, defaultValue, onChange, placeholder = "Search emoj
       "button",
       {
         type: "button",
-        className: "flex items-center gap-2 rounded-lg border border-zinc-300 px-3 py-2 text-sm transition-[border-color,box-shadow] duration-150 dark:border-zinc-700 dark:bg-[#1e1e24]",
+        className: "flex items-center gap-2 rounded-lg border border-[color:var(--fancy-border-strong,var(--color-zinc-300))] px-3 py-2 text-sm transition-[border-color,box-shadow] duration-150 dark:border-[color:var(--fancy-border-strong-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-input-dark,#1e1e24)]",
         onClick: () => setOpen((v) => !v),
         children: selected ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xl", children: selected }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-zinc-400", children: "Pick emoji" })
       }
     ),
-    open && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute z-50 mt-1 w-80 rounded-lg border border-zinc-200 bg-white p-2 shadow-lg dark:border-zinc-700 dark:bg-zinc-800 fancy-fade-in", children: [
+    open && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute z-50 mt-1 w-80 rounded-lg border border-[color:var(--fancy-border,var(--color-zinc-200))] bg-white p-2 shadow-lg dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-zinc-800 fancy-fade-in", children: [
       /* @__PURE__ */ jsxRuntime.jsx(
         "input",
         {
@@ -102,7 +102,7 @@ function EmojiSelect({ value, defaultValue, onChange, placeholder = "Search emoj
           value: query,
           onChange: (e) => setQuery(e.target.value),
           placeholder,
-          className: "mb-2 w-full rounded-md border border-zinc-200 px-2 py-1 text-sm transition-[border-color,box-shadow] duration-150 dark:border-zinc-700 dark:bg-[#1e1e24] dark:text-zinc-100",
+          className: "mb-2 w-full rounded-md border border-[color:var(--fancy-border,var(--color-zinc-200))] px-2 py-1 text-sm transition-[border-color,box-shadow] duration-150 dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-input-dark,#1e1e24)] dark:text-zinc-100",
           autoFocus: true
         }
       ),
@@ -257,7 +257,7 @@ function TonePopover({ target, onPickBase, onPickTone, onMouseEnter, onMouseLeav
     "div",
     {
       style: { ...style, zIndex: 9999 },
-      className: "flex gap-0.5 rounded-md border border-zinc-200 bg-white p-1 shadow-lg dark:border-zinc-700 dark:bg-zinc-800",
+      className: "flex gap-0.5 rounded-md border border-[color:var(--fancy-border,var(--color-zinc-200))] bg-white p-1 shadow-lg dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-zinc-800",
       onMouseEnter,
       onMouseLeave,
       children: [
@@ -288,5 +288,5 @@ function TonePopover({ target, onPickBase, onPickTone, onMouseEnter, onMouseLeav
 }
 
 exports.EmojiSelect = EmojiSelect;
-//# sourceMappingURL=chunk-WIS4QRGK.cjs.map
-//# sourceMappingURL=chunk-WIS4QRGK.cjs.map
+//# sourceMappingURL=chunk-V5JTTLJP.cjs.map
+//# sourceMappingURL=chunk-V5JTTLJP.cjs.map

package/dist/{chunk-WIS4QRGK.cjs.map → chunk-V5JTTLJP.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/EmojiSelect/EmojiSelect.tsx"],"names":["SKIN_TONES","useControllableState","useState","useRef","useCallback","useMemo","EMOJI_DATA","applyTone","useEffect","jsxs","cn","jsx","EMOJI_CATEGORY_ORDER","createPortal"],"mappings":"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","file":"chunk-WIS4QRGK.cjs","sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { cn } from \"../../utils/cn\";\nimport { useControllableState } from \"../../hooks/use-controllable-state\";\nimport { EMOJI_CATEGORY_ORDER, EMOJI_DATA, type EmojiCategoryKey, type EmojiEntry } from \"../../data/emoji-data\";\nimport { applyTone, SKIN_TONES, type SkinTone } from \"../../data/emoji-utils\";\nimport type { EmojiSelectProps } from \"./EmojiSelect.types\";\n\nconst TONE_STORAGE_KEY = \"fancy:emoji-tone\";\nconst LONG_PRESS_MS = 400;\nconst HOVER_INTENT_MS = 120;\nconst HOVER_LEAVE_GRACE_MS = 220;\n\ntype ToneTarget = {\n  emoji: EmojiEntry;\n  rect: { left: number; top: number; width: number };\n};\n\n// Deliberately no hover-capability gate. We use `pointerType` on pointer events so touch\n// inputs never trigger the hover path (they go through long-press instead), and mouse/pen\n// inputs always work regardless of what `(hover: hover)` resolves to in the current env.\n\nfunction readStoredTone(): SkinTone | null {\n  if (typeof window === \"undefined\") return null;\n  try {\n    const v = window.localStorage?.getItem(TONE_STORAGE_KEY);\n    return (SKIN_TONES as readonly string[]).includes(v ?? \"\") ? (v as SkinTone) : null;\n  } catch {\n    return null;\n  }\n}\n\nexport function EmojiSelect({ value, defaultValue, onChange, placeholder = \"Search emojis...\", className }: EmojiSelectProps) {\n  const [selected, setSelected] = useControllableState(value, defaultValue ?? \"\", onChange);\n  const [open, setOpen] = useState(false);\n  const [query, setQuery] = useState(\"\");\n  const [activeCategory, setActiveCategory] = useState<EmojiCategoryKey>(\"smileys\");\n  const [tone, setToneState] = useState<SkinTone | null>(() => readStoredTone());\n  const [toneTarget, setToneTarget] = useState<ToneTarget | null>(null);\n  const leaveTimer = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  const setTone = useCallback((t: SkinTone | null) => {\n    setToneState(t);\n    if (typeof window === \"undefined\") return;\n    try {\n      if (t) window.localStorage?.setItem(TONE_STORAGE_KEY, t);\n      else window.localStorage?.removeItem(TONE_STORAGE_KEY);\n    } catch {}\n  }, []);\n\n  const filtered = useMemo(() => {\n    if (!query) return null;\n    const lower = query.toLowerCase();\n    const hits: EmojiEntry[] = [];\n    for (const group of Object.values(EMOJI_DATA)) {\n      for (const e of group.emojis) {\n        if (e.name.includes(lower)) hits.push(e);\n      }\n    }\n    return hits;\n  }, [query]);\n\n  const closePicker = useCallback(() => setToneTarget(null), []);\n\n  const openPicker = useCallback((target: ToneTarget) => {\n    if (leaveTimer.current) {\n      clearTimeout(leaveTimer.current);\n      leaveTimer.current = null;\n    }\n    setToneTarget(target);\n  }, []);\n\n  const scheduleClose = useCallback(() => {\n    if (leaveTimer.current) clearTimeout(leaveTimer.current);\n    leaveTimer.current = setTimeout(closePicker, HOVER_LEAVE_GRACE_MS);\n  }, [closePicker]);\n\n  const cancelClose = useCallback(() => {\n    if (leaveTimer.current) {\n      clearTimeout(leaveTimer.current);\n      leaveTimer.current = null;\n    }\n  }, []);\n\n  const pick = (emoji: EmojiEntry) => {\n    const char = emoji.skinTones && tone ? applyTone(emoji.char, tone) : emoji.char;\n    setSelected(char);\n    setOpen(false);\n    setQuery(\"\");\n    closePicker();\n  };\n\n  const pickTone = (emoji: EmojiEntry, t: SkinTone) => {\n    setTone(t);\n    const char = applyTone(emoji.char, t);\n    setSelected(char);\n    setOpen(false);\n    setQuery(\"\");\n    closePicker();\n  };\n\n  useEffect(() => {\n    if (!open) closePicker();\n  }, [open, closePicker]);\n\n  return (\n    <div className={cn(\"relative inline-block\", className)} data-react-fancy-emoji-select=\"\">\n      <button\n        type=\"button\"\n        className=\"flex items-center gap-2 rounded-lg border border-zinc-300 px-3 py-2 text-sm transition-[border-color,box-shadow] duration-150 dark:border-zinc-700 dark:bg-[#1e1e24]\"\n        onClick={() => setOpen((v) => !v)}\n      >\n        {selected ? <span className=\"text-xl\">{selected}</span> : <span className=\"text-zinc-400\">Pick emoji</span>}\n      </button>\n\n      {open && (\n        <div className=\"absolute z-50 mt-1 w-80 rounded-lg border border-zinc-200 bg-white p-2 shadow-lg dark:border-zinc-700 dark:bg-zinc-800 fancy-fade-in\">\n          <input\n            type=\"text\"\n            value={query}\n            onChange={(e) => setQuery(e.target.value)}\n            placeholder={placeholder}\n            className=\"mb-2 w-full rounded-md border border-zinc-200 px-2 py-1 text-sm transition-[border-color,box-shadow] duration-150 dark:border-zinc-700 dark:bg-[#1e1e24] dark:text-zinc-100\"\n            autoFocus\n          />\n\n          {!query && (\n            <div className=\"mb-2 flex gap-1 overflow-x-auto border-b border-zinc-100 pb-2 dark:border-zinc-700\">\n              {EMOJI_CATEGORY_ORDER.map((key) => (\n                <button\n                  key={key}\n                  type=\"button\"\n                  onClick={() => setActiveCategory(key)}\n                  className={cn(\n                    \"shrink-0 rounded p-1 text-lg hover:bg-zinc-100 dark:hover:bg-zinc-700\",\n                    activeCategory === key && \"bg-zinc-100 dark:bg-zinc-700\",\n                  )}\n                  aria-label={EMOJI_DATA[key].label}\n                >\n                  {EMOJI_DATA[key].icon}\n                </button>\n              ))}\n            </div>\n          )}\n\n          <div className=\"max-h-64 overflow-y-auto\">\n            {query ? (\n              <EmojiGrid\n                emojis={filtered ?? []}\n                tone={tone}\n                openPicker={openPicker}\n                scheduleClose={scheduleClose}\n                cancelClose={cancelClose}\n                onPick={pick}\n              />\n            ) : (\n              <div>\n                <div className=\"px-1 py-1 text-xs font-semibold uppercase text-zinc-500\">\n                  {EMOJI_DATA[activeCategory].label}\n                </div>\n                <EmojiGrid\n                  emojis={EMOJI_DATA[activeCategory].emojis}\n                  tone={tone}\n                  openPicker={openPicker}\n                  scheduleClose={scheduleClose}\n                  cancelClose={cancelClose}\n                  onPick={pick}\n                />\n              </div>\n            )}\n          </div>\n        </div>\n      )}\n\n      {toneTarget && typeof document !== \"undefined\" &&\n        createPortal(\n          <TonePopover\n            target={toneTarget}\n            onPickBase={() => pick(toneTarget.emoji)}\n            onPickTone={(t) => pickTone(toneTarget.emoji, t)}\n            onMouseEnter={cancelClose}\n            onMouseLeave={scheduleClose}\n          />,\n          document.body,\n        )}\n    </div>\n  );\n}\n\ntype GridProps = {\n  emojis: EmojiEntry[];\n  tone: SkinTone | null;\n  openPicker: (target: ToneTarget) => void;\n  scheduleClose: () => void;\n  cancelClose: () => void;\n  onPick: (emoji: EmojiEntry) => void;\n};\n\nfunction EmojiGrid({ emojis, tone, openPicker, scheduleClose, cancelClose, onPick }: GridProps) {\n  return (\n    <div className=\"grid grid-cols-8 gap-0.5\">\n      {emojis.map((emoji) => (\n        <EmojiCell\n          key={emoji.char}\n          emoji={emoji}\n          tone={tone}\n          openPicker={openPicker}\n          scheduleClose={scheduleClose}\n          cancelClose={cancelClose}\n          onPick={() => onPick(emoji)}\n        />\n      ))}\n    </div>\n  );\n}\n\ntype CellProps = {\n  emoji: EmojiEntry;\n  tone: SkinTone | null;\n  openPicker: (target: ToneTarget) => void;\n  scheduleClose: () => void;\n  cancelClose: () => void;\n  onPick: () => void;\n};\n\nfunction EmojiCell({ emoji, tone, openPicker, scheduleClose, cancelClose, onPick }: CellProps) {\n  const buttonRef = useRef<HTMLButtonElement | null>(null);\n  const longPressTimer = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const hoverTimer = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const longPressed = useRef(false);\n\n  const tonable = !!emoji.skinTones;\n  const displayChar = tonable && tone ? applyTone(emoji.char, tone) : emoji.char;\n\n  useEffect(() => () => {\n    if (longPressTimer.current) clearTimeout(longPressTimer.current);\n    if (hoverTimer.current) clearTimeout(hoverTimer.current);\n  }, []);\n\n  const triggerOpen = () => {\n    const node = buttonRef.current;\n    if (!node) return;\n    const r = node.getBoundingClientRect();\n    openPicker({ emoji, rect: { left: r.left, top: r.top, width: r.width } });\n  };\n\n  const handlePointerEnter = (e: React.PointerEvent) => {\n    if (!tonable || e.pointerType === \"touch\") return;\n    cancelClose();\n    if (hoverTimer.current) clearTimeout(hoverTimer.current);\n    hoverTimer.current = setTimeout(triggerOpen, HOVER_INTENT_MS);\n  };\n\n  const handlePointerLeave = (e: React.PointerEvent) => {\n    if (e.pointerType === \"touch\") return;\n    if (hoverTimer.current) {\n      clearTimeout(hoverTimer.current);\n      hoverTimer.current = null;\n    }\n    if (tonable) scheduleClose();\n  };\n\n  const handlePointerDown = (e: React.PointerEvent) => {\n    if (!tonable || e.pointerType !== \"touch\") return;\n    longPressed.current = false;\n    longPressTimer.current = setTimeout(() => {\n      longPressed.current = true;\n      triggerOpen();\n    }, LONG_PRESS_MS);\n  };\n  const handlePointerUp = () => {\n    if (longPressTimer.current) clearTimeout(longPressTimer.current);\n    longPressTimer.current = null;\n  };\n\n  const handleClick = () => {\n    if (longPressed.current) {\n      longPressed.current = false;\n      return;\n    }\n    onPick();\n  };\n\n  return (\n    <button\n      ref={buttonRef}\n      type=\"button\"\n      onClick={handleClick}\n      onPointerEnter={handlePointerEnter}\n      onPointerLeave={handlePointerLeave}\n      onPointerDown={handlePointerDown}\n      onPointerUp={handlePointerUp}\n      onPointerCancel={handlePointerUp}\n      className=\"relative rounded p-1 text-xl hover:bg-zinc-100 dark:hover:bg-zinc-700\"\n      aria-label={emoji.name}\n      title={emoji.name}\n    >\n      {displayChar}\n      {tonable && (\n        <span className=\"absolute right-0.5 bottom-0.5 h-1 w-1 rounded-full bg-amber-400\" aria-hidden />\n      )}\n    </button>\n  );\n}\n\ntype PopoverProps = {\n  target: ToneTarget;\n  onPickBase: () => void;\n  onPickTone: (tone: SkinTone) => void;\n  onMouseEnter: () => void;\n  onMouseLeave: () => void;\n};\n\nfunction TonePopover({ target, onPickBase, onPickTone, onMouseEnter, onMouseLeave }: PopoverProps) {\n  const { emoji, rect } = target;\n  if (!emoji.skinTones) return null;\n\n  const centerX = rect.left + rect.width / 2;\n  const top = rect.top;\n  const POPOVER_HEIGHT_APPROX = 44;\n  const flipDown = top < POPOVER_HEIGHT_APPROX + 8;\n\n  const style: React.CSSProperties = flipDown\n    ? { position: \"fixed\", left: centerX, top: top + 32, transform: \"translateX(-50%)\" }\n    : { position: \"fixed\", left: centerX, top: top - 4, transform: \"translate(-50%, -100%)\" };\n\n  return (\n    <div\n      style={{ ...style, zIndex: 9999 }}\n      className=\"flex gap-0.5 rounded-md border border-zinc-200 bg-white p-1 shadow-lg dark:border-zinc-700 dark:bg-zinc-800\"\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n    >\n      <button\n        type=\"button\"\n        onClick={onPickBase}\n        className=\"rounded p-1 text-lg hover:bg-zinc-100 dark:hover:bg-zinc-700\"\n        aria-label={`${emoji.name} (no tone)`}\n      >\n        {emoji.char}\n      </button>\n      {SKIN_TONES.map((t, i) => (\n        <button\n          key={t}\n          type=\"button\"\n          onClick={() => onPickTone(t)}\n          className=\"rounded p-1 text-lg hover:bg-zinc-100 dark:hover:bg-zinc-700\"\n          aria-label={`${emoji.name} ${t} skin tone`}\n        >\n          {emoji.skinTones![i]}\n        </button>\n      ))}\n    </div>\n  );\n}\n"]}
+{"version":3,"sources":["../src/components/EmojiSelect/EmojiSelect.tsx"],"names":["SKIN_TONES","useControllableState","useState","useRef","useCallback","useMemo","EMOJI_DATA","applyTone","useEffect","jsxs","cn","jsx","EMOJI_CATEGORY_ORDER","createPortal"],"mappings":";;;;;;;;;AAQA,IAAM,gBAAA,GAAmB,kBAAA;AACzB,IAAM,aAAA,GAAgB,GAAA;AACtB,IAAM,eAAA,GAAkB,GAAA;AACxB,IAAM,oBAAA,GAAuB,GAAA;AAW7B,SAAS,cAAA,GAAkC;AACzC,EAAA,IAAI,OAAO,MAAA,KAAW,WAAA,EAAa,OAAO,IAAA;AAC1C,EAAA,IAAI;AACF,IAAA,MAAM,CAAA,GAAI,MAAA,CAAO,YAAA,EAAc,OAAA,CAAQ,gBAAgB,CAAA;AACvD,IAAA,OAAQA,4BAAA,CAAiC,QAAA,CAAS,CAAA,IAAK,EAAE,IAAK,CAAA,GAAiB,IAAA;AAAA,EACjF,CAAA,CAAA,MAAQ;AACN,IAAA,OAAO,IAAA;AAAA,EACT;AACF;AAEO,SAAS,WAAA,CAAY,EAAE,KAAA,EAAO,YAAA,EAAc,UAAU,WAAA,GAAc,kBAAA,EAAoB,WAAU,EAAqB;AAC5H,EAAA,MAAM,CAAC,UAAU,WAAW,CAAA,GAAIC,uCAAqB,KAAA,EAAO,YAAA,IAAgB,IAAI,QAAQ,CAAA;AACxF,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAIC,eAAS,KAAK,CAAA;AACtC,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAIA,eAAS,EAAE,CAAA;AACrC,EAAA,MAAM,CAAC,cAAA,EAAgB,iBAAiB,CAAA,GAAIA,eAA2B,SAAS,CAAA;AAChF,EAAA,MAAM,CAAC,IAAA,EAAM,YAAY,IAAIA,cAAA,CAA0B,MAAM,gBAAgB,CAAA;AAC7E,EAAA,MAAM,CAAC,UAAA,EAAY,aAAa,CAAA,GAAIA,eAA4B,IAAI,CAAA;AACpE,EAAA,MAAM,UAAA,GAAaC,aAA6C,IAAI,CAAA;AAEpE,EAAA,MAAM,OAAA,GAAUC,iBAAA,CAAY,CAAC,CAAA,KAAuB;AAClD,IAAA,YAAA,CAAa,CAAC,CAAA;AACd,IAAA,IAAI,OAAO,WAAW,WAAA,EAAa;AACnC,IAAA,IAAI;AACF,MAAA,IAAI,CAAA,EAAG,MAAA,CAAO,YAAA,EAAc,OAAA,CAAQ,kBAAkB,CAAC,CAAA;AAAA,WAClD,MAAA,CAAO,YAAA,EAAc,UAAA,CAAW,gBAAgB,CAAA;AAAA,IACvD,CAAA,CAAA,MAAQ;AAAA,IAAC;AAAA,EACX,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,QAAA,GAAWC,cAAQ,MAAM;AAC7B,IAAA,IAAI,CAAC,OAAO,OAAO,IAAA;AACnB,IAAA,MAAM,KAAA,GAAQ,MAAM,WAAA,EAAY;AAChC,IAAA,MAAM,OAAqB,EAAC;AAC5B,IAAA,KAAA,MAAW,KAAA,IAAS,MAAA,CAAO,MAAA,CAAOC,4BAAU,CAAA,EAAG;AAC7C,MAAA,KAAA,MAAW,CAAA,IAAK,MAAM,MAAA,EAAQ;AAC5B,QAAA,IAAI,EAAE,IAAA,CAAK,QAAA,CAAS,KAAK,CAAA,EAAG,IAAA,CAAK,KAAK,CAAC,CAAA;AAAA,MACzC;AAAA,IACF;AACA,IAAA,OAAO,IAAA;AAAA,EACT,CAAA,EAAG,CAAC,KAAK,CAAC,CAAA;AAEV,EAAA,MAAM,cAAcF,iBAAA,CAAY,MAAM,cAAc,IAAI,CAAA,EAAG,EAAE,CAAA;AAE7D,EAAA,MAAM,UAAA,GAAaA,iBAAA,CAAY,CAAC,MAAA,KAAuB;AACrD,IAAA,IAAI,WAAW,OAAA,EAAS;AACtB,MAAA,YAAA,CAAa,WAAW,OAAO,CAAA;AAC/B,MAAA,UAAA,CAAW,OAAA,GAAU,IAAA;AAAA,IACvB;AACA,IAAA,aAAA,CAAc,MAAM,CAAA;AAAA,EACtB,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,aAAA,GAAgBA,kBAAY,MAAM;AACtC,IAAA,IAAI,UAAA,CAAW,OAAA,EAAS,YAAA,CAAa,UAAA,CAAW,OAAO,CAAA;AACvD,IAAA,UAAA,CAAW,OAAA,GAAU,UAAA,CAAW,WAAA,EAAa,oBAAoB,CAAA;AAAA,EACnE,CAAA,EAAG,CAAC,WAAW,CAAC,CAAA;AAEhB,EAAA,MAAM,WAAA,GAAcA,kBAAY,MAAM;AACpC,IAAA,IAAI,WAAW,OAAA,EAAS;AACtB,MAAA,YAAA,CAAa,WAAW,OAAO,CAAA;AAC/B,MAAA,UAAA,CAAW,OAAA,GAAU,IAAA;AAAA,IACvB;AAAA,EACF,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,IAAA,GAAO,CAAC,KAAA,KAAsB;AAClC,IAAA,MAAM,IAAA,GAAO,MAAM,SAAA,IAAa,IAAA,GAAOG,4BAAU,KAAA,CAAM,IAAA,EAAM,IAAI,CAAA,GAAI,KAAA,CAAM,IAAA;AAC3E,IAAA,WAAA,CAAY,IAAI,CAAA;AAChB,IAAA,OAAA,CAAQ,KAAK,CAAA;AACb,IAAA,QAAA,CAAS,EAAE,CAAA;AACX,IAAA,WAAA,EAAY;AAAA,EACd,CAAA;AAEA,EAAA,MAAM,QAAA,GAAW,CAAC,KAAA,EAAmB,CAAA,KAAgB;AACnD,IAAA,OAAA,CAAQ,CAAC,CAAA;AACT,IAAA,MAAM,IAAA,GAAOA,2BAAA,CAAU,KAAA,CAAM,IAAA,EAAM,CAAC,CAAA;AACpC,IAAA,WAAA,CAAY,IAAI,CAAA;AAChB,IAAA,OAAA,CAAQ,KAAK,CAAA;AACb,IAAA,QAAA,CAAS,EAAE,CAAA;AACX,IAAA,WAAA,EAAY;AAAA,EACd,CAAA;AAEA,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,MAAM,WAAA,EAAY;AAAA,EACzB,CAAA,EAAG,CAAC,IAAA,EAAM,WAAW,CAAC,CAAA;AAEtB,EAAA,uBACEC,eAAA,CAAC,SAAI,SAAA,EAAWC,oBAAA,CAAG,yBAAyB,SAAS,CAAA,EAAG,iCAA8B,EAAA,EACpF,QAAA,EAAA;AAAA,oBAAAC,cAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,QAAA;AAAA,QACL,SAAA,EAAU,ySAAA;AAAA,QACV,SAAS,MAAM,OAAA,CAAQ,CAAC,CAAA,KAAM,CAAC,CAAC,CAAA;AAAA,QAE/B,QAAA,EAAA,QAAA,mBAAWA,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,SAAA,EAAW,QAAA,EAAA,QAAA,EAAS,CAAA,mBAAUA,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,eAAA,EAAgB,QAAA,EAAA,YAAA,EAAU;AAAA;AAAA,KACtG;AAAA,IAEC,IAAA,oBACCF,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,6NAAA,EACb,QAAA,EAAA;AAAA,sBAAAE,cAAA;AAAA,QAAC,OAAA;AAAA,QAAA;AAAA,UACC,IAAA,EAAK,MAAA;AAAA,UACL,KAAA,EAAO,KAAA;AAAA,UACP,UAAU,CAAC,CAAA,KAAM,QAAA,CAAS,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,UACxC,WAAA;AAAA,UACA,SAAA,EAAU,kSAAA;AAAA,UACV,SAAA,EAAS;AAAA;AAAA,OACX;AAAA,MAEC,CAAC,yBACAA,cAAA,CAAC,KAAA,EAAA,EAAI,WAAU,oFAAA,EACZ,QAAA,EAAAC,sCAAA,CAAqB,GAAA,CAAI,CAAC,GAAA,qBACzBD,cAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UAEC,IAAA,EAAK,QAAA;AAAA,UACL,OAAA,EAAS,MAAM,iBAAA,CAAkB,GAAG,CAAA;AAAA,UACpC,SAAA,EAAWD,oBAAA;AAAA,YACT,uEAAA;AAAA,YACA,mBAAmB,GAAA,IAAO;AAAA,WAC5B;AAAA,UACA,YAAA,EAAYJ,4BAAA,CAAW,GAAG,CAAA,CAAE,KAAA;AAAA,UAE3B,QAAA,EAAAA,4BAAA,CAAW,GAAG,CAAA,CAAE;AAAA,SAAA;AAAA,QATZ;AAAA,OAWR,CAAA,EACH,CAAA;AAAA,sBAGFK,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,0BAAA,EACZ,QAAA,EAAA,KAAA,mBACCA,cAAA;AAAA,QAAC,SAAA;AAAA,QAAA;AAAA,UACC,MAAA,EAAQ,YAAY,EAAC;AAAA,UACrB,IAAA;AAAA,UACA,UAAA;AAAA,UACA,aAAA;AAAA,UACA,WAAA;AAAA,UACA,MAAA,EAAQ;AAAA;AAAA,OACV,mCAEC,KAAA,EAAA,EACC,QAAA,EAAA;AAAA,wBAAAA,cAAA,CAAC,SAAI,SAAA,EAAU,yDAAA,EACZ,QAAA,EAAAL,4BAAA,CAAW,cAAc,EAAE,KAAA,EAC9B,CAAA;AAAA,wBACAK,cAAA;AAAA,UAAC,SAAA;AAAA,UAAA;AAAA,YACC,MAAA,EAAQL,4BAAA,CAAW,cAAc,CAAA,CAAE,MAAA;AAAA,YACnC,IAAA;AAAA,YACA,UAAA;AAAA,YACA,aAAA;AAAA,YACA,WAAA;AAAA,YACA,MAAA,EAAQ;AAAA;AAAA;AACV,OAAA,EACF,CAAA,EAEJ;AAAA,KAAA,EACF,CAAA;AAAA,IAGD,UAAA,IAAc,OAAO,QAAA,KAAa,WAAA,IACjCO,qBAAA;AAAA,sBACEF,cAAA;AAAA,QAAC,WAAA;AAAA,QAAA;AAAA,UACC,MAAA,EAAQ,UAAA;AAAA,UACR,UAAA,EAAY,MAAM,IAAA,CAAK,UAAA,CAAW,KAAK,CAAA;AAAA,UACvC,YAAY,CAAC,CAAA,KAAM,QAAA,CAAS,UAAA,CAAW,OAAO,CAAC,CAAA;AAAA,UAC/C,YAAA,EAAc,WAAA;AAAA,UACd,YAAA,EAAc;AAAA;AAAA,OAChB;AAAA,MACA,QAAA,CAAS;AAAA;AACX,GAAA,EACJ,CAAA;AAEJ;AAWA,SAAS,SAAA,CAAU,EAAE,MAAA,EAAQ,IAAA,EAAM,YAAY,aAAA,EAAe,WAAA,EAAa,QAAO,EAAc;AAC9F,EAAA,sCACG,KAAA,EAAA,EAAI,SAAA,EAAU,4BACZ,QAAA,EAAA,MAAA,CAAO,GAAA,CAAI,CAAC,KAAA,qBACXA,cAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MAEC,KAAA;AAAA,MACA,IAAA;AAAA,MACA,UAAA;AAAA,MACA,aAAA;AAAA,MACA,WAAA;AAAA,MACA,MAAA,EAAQ,MAAM,MAAA,CAAO,KAAK;AAAA,KAAA;AAAA,IANrB,KAAA,CAAM;AAAA,GAQd,CAAA,EACH,CAAA;AAEJ;AAWA,SAAS,SAAA,CAAU,EAAE,KAAA,EAAO,IAAA,EAAM,YAAY,aAAA,EAAe,WAAA,EAAa,QAAO,EAAc;AAC7F,EAAA,MAAM,SAAA,GAAYR,aAAiC,IAAI,CAAA;AACvD,EAAA,MAAM,cAAA,GAAiBA,aAA6C,IAAI,CAAA;AACxE,EAAA,MAAM,UAAA,GAAaA,aAA6C,IAAI,CAAA;AACpE,EAAA,MAAM,WAAA,GAAcA,aAAO,KAAK,CAAA;AAEhC,EAAA,MAAM,OAAA,GAAU,CAAC,CAAC,KAAA,CAAM,SAAA;AACxB,EAAA,MAAM,WAAA,GAAc,WAAW,IAAA,GAAOI,2BAAA,CAAU,MAAM,IAAA,EAAM,IAAI,IAAI,KAAA,CAAM,IAAA;AAE1E,EAAAC,eAAA,CAAU,MAAM,MAAM;AACpB,IAAA,IAAI,cAAA,CAAe,OAAA,EAAS,YAAA,CAAa,cAAA,CAAe,OAAO,CAAA;AAC/D,IAAA,IAAI,UAAA,CAAW,OAAA,EAAS,YAAA,CAAa,UAAA,CAAW,OAAO,CAAA;AAAA,EACzD,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,cAAc,MAAM;AACxB,IAAA,MAAM,OAAO,SAAA,CAAU,OAAA;AACvB,IAAA,IAAI,CAAC,IAAA,EAAM;AACX,IAAA,MAAM,CAAA,GAAI,KAAK,qBAAA,EAAsB;AACrC,IAAA,UAAA,CAAW,EAAE,KAAA,EAAO,IAAA,EAAM,EAAE,MAAM,CAAA,CAAE,IAAA,EAAM,GAAA,EAAK,CAAA,CAAE,GAAA,EAAK,KAAA,EAAO,CAAA,CAAE,KAAA,IAAS,CAAA;AAAA,EAC1E,CAAA;AAEA,EAAA,MAAM,kBAAA,GAAqB,CAAC,CAAA,KAA0B;AACpD,IAAA,IAAI,CAAC,OAAA,IAAW,CAAA,CAAE,WAAA,KAAgB,OAAA,EAAS;AAC3C,IAAA,WAAA,EAAY;AACZ,IAAA,IAAI,UAAA,CAAW,OAAA,EAAS,YAAA,CAAa,UAAA,CAAW,OAAO,CAAA;AACvD,IAAA,UAAA,CAAW,OAAA,GAAU,UAAA,CAAW,WAAA,EAAa,eAAe,CAAA;AAAA,EAC9D,CAAA;AAEA,EAAA,MAAM,kBAAA,GAAqB,CAAC,CAAA,KAA0B;AACpD,IAAA,IAAI,CAAA,CAAE,gBAAgB,OAAA,EAAS;AAC/B,IAAA,IAAI,WAAW,OAAA,EAAS;AACtB,MAAA,YAAA,CAAa,WAAW,OAAO,CAAA;AAC/B,MAAA,UAAA,CAAW,OAAA,GAAU,IAAA;AAAA,IACvB;AACA,IAAA,IAAI,SAAS,aAAA,EAAc;AAAA,EAC7B,CAAA;AAEA,EAAA,MAAM,iBAAA,GAAoB,CAAC,CAAA,KAA0B;AACnD,IAAA,IAAI,CAAC,OAAA,IAAW,CAAA,CAAE,WAAA,KAAgB,OAAA,EAAS;AAC3C,IAAA,WAAA,CAAY,OAAA,GAAU,KAAA;AACtB,IAAA,cAAA,CAAe,OAAA,GAAU,WAAW,MAAM;AACxC,MAAA,WAAA,CAAY,OAAA,GAAU,IAAA;AACtB,MAAA,WAAA,EAAY;AAAA,IACd,GAAG,aAAa,CAAA;AAAA,EAClB,CAAA;AACA,EAAA,MAAM,kBAAkB,MAAM;AAC5B,IAAA,IAAI,cAAA,CAAe,OAAA,EAAS,YAAA,CAAa,cAAA,CAAe,OAAO,CAAA;AAC/D,IAAA,cAAA,CAAe,OAAA,GAAU,IAAA;AAAA,EAC3B,CAAA;AAEA,EAAA,MAAM,cAAc,MAAM;AACxB,IAAA,IAAI,YAAY,OAAA,EAAS;AACvB,MAAA,WAAA,CAAY,OAAA,GAAU,KAAA;AACtB,MAAA;AAAA,IACF;AACA,IAAA,MAAA,EAAO;AAAA,EACT,CAAA;AAEA,EAAA,uBACEC,eAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,GAAA,EAAK,SAAA;AAAA,MACL,IAAA,EAAK,QAAA;AAAA,MACL,OAAA,EAAS,WAAA;AAAA,MACT,cAAA,EAAgB,kBAAA;AAAA,MAChB,cAAA,EAAgB,kBAAA;AAAA,MAChB,aAAA,EAAe,iBAAA;AAAA,MACf,WAAA,EAAa,eAAA;AAAA,MACb,eAAA,EAAiB,eAAA;AAAA,MACjB,SAAA,EAAU,uEAAA;AAAA,MACV,cAAY,KAAA,CAAM,IAAA;AAAA,MAClB,OAAO,KAAA,CAAM,IAAA;AAAA,MAEZ,QAAA,EAAA;AAAA,QAAA,WAAA;AAAA,QACA,2BACCE,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,iEAAA,EAAkE,eAAW,IAAA,EAAC;AAAA;AAAA;AAAA,GAElG;AAEJ;AAUA,SAAS,YAAY,EAAE,MAAA,EAAQ,YAAY,UAAA,EAAY,YAAA,EAAc,cAAa,EAAiB;AACjG,EAAA,MAAM,EAAE,KAAA,EAAO,IAAA,EAAK,GAAI,MAAA;AACxB,EAAA,IAAI,CAAC,KAAA,CAAM,SAAA,EAAW,OAAO,IAAA;AAE7B,EAAA,MAAM,OAAA,GAAU,IAAA,CAAK,IAAA,GAAO,IAAA,CAAK,KAAA,GAAQ,CAAA;AACzC,EAAA,MAAM,MAAM,IAAA,CAAK,GAAA;AACjB,EAAA,MAAM,qBAAA,GAAwB,EAAA;AAC9B,EAAA,MAAM,QAAA,GAAW,MAAM,qBAAA,GAAwB,CAAA;AAE/C,EAAA,MAAM,KAAA,GAA6B,WAC/B,EAAE,QAAA,EAAU,SAAS,IAAA,EAAM,OAAA,EAAS,GAAA,EAAK,GAAA,GAAM,EAAA,EAAI,SAAA,EAAW,oBAAmB,GACjF,EAAE,UAAU,OAAA,EAAS,IAAA,EAAM,SAAS,GAAA,EAAK,GAAA,GAAM,CAAA,EAAG,SAAA,EAAW,wBAAA,EAAyB;AAE1F,EAAA,uBACEF,eAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAA,EAAO,EAAE,GAAG,KAAA,EAAO,QAAQ,IAAA,EAAK;AAAA,MAChC,SAAA,EAAU,oMAAA;AAAA,MACV,YAAA;AAAA,MACA,YAAA;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAAE,cAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACC,IAAA,EAAK,QAAA;AAAA,YACL,OAAA,EAAS,UAAA;AAAA,YACT,SAAA,EAAU,8DAAA;AAAA,YACV,YAAA,EAAY,CAAA,EAAG,KAAA,CAAM,IAAI,CAAA,UAAA,CAAA;AAAA,YAExB,QAAA,EAAA,KAAA,CAAM;AAAA;AAAA,SACT;AAAA,QACCX,4BAAA,CAAW,GAAA,CAAI,CAAC,CAAA,EAAG,CAAA,qBAClBW,cAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YAEC,IAAA,EAAK,QAAA;AAAA,YACL,OAAA,EAAS,MAAM,UAAA,CAAW,CAAC,CAAA;AAAA,YAC3B,SAAA,EAAU,8DAAA;AAAA,YACV,YAAA,EAAY,CAAA,EAAG,KAAA,CAAM,IAAI,IAAI,CAAC,CAAA,UAAA,CAAA;AAAA,YAE7B,QAAA,EAAA,KAAA,CAAM,UAAW,CAAC;AAAA,WAAA;AAAA,UANd;AAAA,SAQR;AAAA;AAAA;AAAA,GACH;AAEJ","file":"chunk-V5JTTLJP.cjs","sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { cn } from \"../../utils/cn\";\nimport { useControllableState } from \"../../hooks/use-controllable-state\";\nimport { EMOJI_CATEGORY_ORDER, EMOJI_DATA, type EmojiCategoryKey, type EmojiEntry } from \"../../data/emoji-data\";\nimport { applyTone, SKIN_TONES, type SkinTone } from \"../../data/emoji-utils\";\nimport type { EmojiSelectProps } from \"./EmojiSelect.types\";\n\nconst TONE_STORAGE_KEY = \"fancy:emoji-tone\";\nconst LONG_PRESS_MS = 400;\nconst HOVER_INTENT_MS = 120;\nconst HOVER_LEAVE_GRACE_MS = 220;\n\ntype ToneTarget = {\n  emoji: EmojiEntry;\n  rect: { left: number; top: number; width: number };\n};\n\n// Deliberately no hover-capability gate. We use `pointerType` on pointer events so touch\n// inputs never trigger the hover path (they go through long-press instead), and mouse/pen\n// inputs always work regardless of what `(hover: hover)` resolves to in the current env.\n\nfunction readStoredTone(): SkinTone | null {\n  if (typeof window === \"undefined\") return null;\n  try {\n    const v = window.localStorage?.getItem(TONE_STORAGE_KEY);\n    return (SKIN_TONES as readonly string[]).includes(v ?? \"\") ? (v as SkinTone) : null;\n  } catch {\n    return null;\n  }\n}\n\nexport function EmojiSelect({ value, defaultValue, onChange, placeholder = \"Search emojis...\", className }: EmojiSelectProps) {\n  const [selected, setSelected] = useControllableState(value, defaultValue ?? \"\", onChange);\n  const [open, setOpen] = useState(false);\n  const [query, setQuery] = useState(\"\");\n  const [activeCategory, setActiveCategory] = useState<EmojiCategoryKey>(\"smileys\");\n  const [tone, setToneState] = useState<SkinTone | null>(() => readStoredTone());\n  const [toneTarget, setToneTarget] = useState<ToneTarget | null>(null);\n  const leaveTimer = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  const setTone = useCallback((t: SkinTone | null) => {\n    setToneState(t);\n    if (typeof window === \"undefined\") return;\n    try {\n      if (t) window.localStorage?.setItem(TONE_STORAGE_KEY, t);\n      else window.localStorage?.removeItem(TONE_STORAGE_KEY);\n    } catch {}\n  }, []);\n\n  const filtered = useMemo(() => {\n    if (!query) return null;\n    const lower = query.toLowerCase();\n    const hits: EmojiEntry[] = [];\n    for (const group of Object.values(EMOJI_DATA)) {\n      for (const e of group.emojis) {\n        if (e.name.includes(lower)) hits.push(e);\n      }\n    }\n    return hits;\n  }, [query]);\n\n  const closePicker = useCallback(() => setToneTarget(null), []);\n\n  const openPicker = useCallback((target: ToneTarget) => {\n    if (leaveTimer.current) {\n      clearTimeout(leaveTimer.current);\n      leaveTimer.current = null;\n    }\n    setToneTarget(target);\n  }, []);\n\n  const scheduleClose = useCallback(() => {\n    if (leaveTimer.current) clearTimeout(leaveTimer.current);\n    leaveTimer.current = setTimeout(closePicker, HOVER_LEAVE_GRACE_MS);\n  }, [closePicker]);\n\n  const cancelClose = useCallback(() => {\n    if (leaveTimer.current) {\n      clearTimeout(leaveTimer.current);\n      leaveTimer.current = null;\n    }\n  }, []);\n\n  const pick = (emoji: EmojiEntry) => {\n    const char = emoji.skinTones && tone ? applyTone(emoji.char, tone) : emoji.char;\n    setSelected(char);\n    setOpen(false);\n    setQuery(\"\");\n    closePicker();\n  };\n\n  const pickTone = (emoji: EmojiEntry, t: SkinTone) => {\n    setTone(t);\n    const char = applyTone(emoji.char, t);\n    setSelected(char);\n    setOpen(false);\n    setQuery(\"\");\n    closePicker();\n  };\n\n  useEffect(() => {\n    if (!open) closePicker();\n  }, [open, closePicker]);\n\n  return (\n    <div className={cn(\"relative inline-block\", className)} data-react-fancy-emoji-select=\"\">\n      <button\n        type=\"button\"\n        className=\"flex items-center gap-2 rounded-lg border border-[color:var(--fancy-border-strong,var(--color-zinc-300))] px-3 py-2 text-sm transition-[border-color,box-shadow] duration-150 dark:border-[color:var(--fancy-border-strong-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-input-dark,#1e1e24)]\"\n        onClick={() => setOpen((v) => !v)}\n      >\n        {selected ? <span className=\"text-xl\">{selected}</span> : <span className=\"text-zinc-400\">Pick emoji</span>}\n      </button>\n\n      {open && (\n        <div className=\"absolute z-50 mt-1 w-80 rounded-lg border border-[color:var(--fancy-border,var(--color-zinc-200))] bg-white p-2 shadow-lg dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-zinc-800 fancy-fade-in\">\n          <input\n            type=\"text\"\n            value={query}\n            onChange={(e) => setQuery(e.target.value)}\n            placeholder={placeholder}\n            className=\"mb-2 w-full rounded-md border border-[color:var(--fancy-border,var(--color-zinc-200))] px-2 py-1 text-sm transition-[border-color,box-shadow] duration-150 dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-input-dark,#1e1e24)] dark:text-zinc-100\"\n            autoFocus\n          />\n\n          {!query && (\n            <div className=\"mb-2 flex gap-1 overflow-x-auto border-b border-zinc-100 pb-2 dark:border-zinc-700\">\n              {EMOJI_CATEGORY_ORDER.map((key) => (\n                <button\n                  key={key}\n                  type=\"button\"\n                  onClick={() => setActiveCategory(key)}\n                  className={cn(\n                    \"shrink-0 rounded p-1 text-lg hover:bg-zinc-100 dark:hover:bg-zinc-700\",\n                    activeCategory === key && \"bg-zinc-100 dark:bg-zinc-700\",\n                  )}\n                  aria-label={EMOJI_DATA[key].label}\n                >\n                  {EMOJI_DATA[key].icon}\n                </button>\n              ))}\n            </div>\n          )}\n\n          <div className=\"max-h-64 overflow-y-auto\">\n            {query ? (\n              <EmojiGrid\n                emojis={filtered ?? []}\n                tone={tone}\n                openPicker={openPicker}\n                scheduleClose={scheduleClose}\n                cancelClose={cancelClose}\n                onPick={pick}\n              />\n            ) : (\n              <div>\n                <div className=\"px-1 py-1 text-xs font-semibold uppercase text-zinc-500\">\n                  {EMOJI_DATA[activeCategory].label}\n                </div>\n                <EmojiGrid\n                  emojis={EMOJI_DATA[activeCategory].emojis}\n                  tone={tone}\n                  openPicker={openPicker}\n                  scheduleClose={scheduleClose}\n                  cancelClose={cancelClose}\n                  onPick={pick}\n                />\n              </div>\n            )}\n          </div>\n        </div>\n      )}\n\n      {toneTarget && typeof document !== \"undefined\" &&\n        createPortal(\n          <TonePopover\n            target={toneTarget}\n            onPickBase={() => pick(toneTarget.emoji)}\n            onPickTone={(t) => pickTone(toneTarget.emoji, t)}\n            onMouseEnter={cancelClose}\n            onMouseLeave={scheduleClose}\n          />,\n          document.body,\n        )}\n    </div>\n  );\n}\n\ntype GridProps = {\n  emojis: EmojiEntry[];\n  tone: SkinTone | null;\n  openPicker: (target: ToneTarget) => void;\n  scheduleClose: () => void;\n  cancelClose: () => void;\n  onPick: (emoji: EmojiEntry) => void;\n};\n\nfunction EmojiGrid({ emojis, tone, openPicker, scheduleClose, cancelClose, onPick }: GridProps) {\n  return (\n    <div className=\"grid grid-cols-8 gap-0.5\">\n      {emojis.map((emoji) => (\n        <EmojiCell\n          key={emoji.char}\n          emoji={emoji}\n          tone={tone}\n          openPicker={openPicker}\n          scheduleClose={scheduleClose}\n          cancelClose={cancelClose}\n          onPick={() => onPick(emoji)}\n        />\n      ))}\n    </div>\n  );\n}\n\ntype CellProps = {\n  emoji: EmojiEntry;\n  tone: SkinTone | null;\n  openPicker: (target: ToneTarget) => void;\n  scheduleClose: () => void;\n  cancelClose: () => void;\n  onPick: () => void;\n};\n\nfunction EmojiCell({ emoji, tone, openPicker, scheduleClose, cancelClose, onPick }: CellProps) {\n  const buttonRef = useRef<HTMLButtonElement | null>(null);\n  const longPressTimer = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const hoverTimer = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const longPressed = useRef(false);\n\n  const tonable = !!emoji.skinTones;\n  const displayChar = tonable && tone ? applyTone(emoji.char, tone) : emoji.char;\n\n  useEffect(() => () => {\n    if (longPressTimer.current) clearTimeout(longPressTimer.current);\n    if (hoverTimer.current) clearTimeout(hoverTimer.current);\n  }, []);\n\n  const triggerOpen = () => {\n    const node = buttonRef.current;\n    if (!node) return;\n    const r = node.getBoundingClientRect();\n    openPicker({ emoji, rect: { left: r.left, top: r.top, width: r.width } });\n  };\n\n  const handlePointerEnter = (e: React.PointerEvent) => {\n    if (!tonable || e.pointerType === \"touch\") return;\n    cancelClose();\n    if (hoverTimer.current) clearTimeout(hoverTimer.current);\n    hoverTimer.current = setTimeout(triggerOpen, HOVER_INTENT_MS);\n  };\n\n  const handlePointerLeave = (e: React.PointerEvent) => {\n    if (e.pointerType === \"touch\") return;\n    if (hoverTimer.current) {\n      clearTimeout(hoverTimer.current);\n      hoverTimer.current = null;\n    }\n    if (tonable) scheduleClose();\n  };\n\n  const handlePointerDown = (e: React.PointerEvent) => {\n    if (!tonable || e.pointerType !== \"touch\") return;\n    longPressed.current = false;\n    longPressTimer.current = setTimeout(() => {\n      longPressed.current = true;\n      triggerOpen();\n    }, LONG_PRESS_MS);\n  };\n  const handlePointerUp = () => {\n    if (longPressTimer.current) clearTimeout(longPressTimer.current);\n    longPressTimer.current = null;\n  };\n\n  const handleClick = () => {\n    if (longPressed.current) {\n      longPressed.current = false;\n      return;\n    }\n    onPick();\n  };\n\n  return (\n    <button\n      ref={buttonRef}\n      type=\"button\"\n      onClick={handleClick}\n      onPointerEnter={handlePointerEnter}\n      onPointerLeave={handlePointerLeave}\n      onPointerDown={handlePointerDown}\n      onPointerUp={handlePointerUp}\n      onPointerCancel={handlePointerUp}\n      className=\"relative rounded p-1 text-xl hover:bg-zinc-100 dark:hover:bg-zinc-700\"\n      aria-label={emoji.name}\n      title={emoji.name}\n    >\n      {displayChar}\n      {tonable && (\n        <span className=\"absolute right-0.5 bottom-0.5 h-1 w-1 rounded-full bg-amber-400\" aria-hidden />\n      )}\n    </button>\n  );\n}\n\ntype PopoverProps = {\n  target: ToneTarget;\n  onPickBase: () => void;\n  onPickTone: (tone: SkinTone) => void;\n  onMouseEnter: () => void;\n  onMouseLeave: () => void;\n};\n\nfunction TonePopover({ target, onPickBase, onPickTone, onMouseEnter, onMouseLeave }: PopoverProps) {\n  const { emoji, rect } = target;\n  if (!emoji.skinTones) return null;\n\n  const centerX = rect.left + rect.width / 2;\n  const top = rect.top;\n  const POPOVER_HEIGHT_APPROX = 44;\n  const flipDown = top < POPOVER_HEIGHT_APPROX + 8;\n\n  const style: React.CSSProperties = flipDown\n    ? { position: \"fixed\", left: centerX, top: top + 32, transform: \"translateX(-50%)\" }\n    : { position: \"fixed\", left: centerX, top: top - 4, transform: \"translate(-50%, -100%)\" };\n\n  return (\n    <div\n      style={{ ...style, zIndex: 9999 }}\n      className=\"flex gap-0.5 rounded-md border border-[color:var(--fancy-border,var(--color-zinc-200))] bg-white p-1 shadow-lg dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-zinc-800\"\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n    >\n      <button\n        type=\"button\"\n        onClick={onPickBase}\n        className=\"rounded p-1 text-lg hover:bg-zinc-100 dark:hover:bg-zinc-700\"\n        aria-label={`${emoji.name} (no tone)`}\n      >\n        {emoji.char}\n      </button>\n      {SKIN_TONES.map((t, i) => (\n        <button\n          key={t}\n          type=\"button\"\n          onClick={() => onPickTone(t)}\n          className=\"rounded p-1 text-lg hover:bg-zinc-100 dark:hover:bg-zinc-700\"\n          aria-label={`${emoji.name} ${t} skin tone`}\n        >\n          {emoji.skinTones![i]}\n        </button>\n      ))}\n    </div>\n  );\n}\n"]}

package/dist/{chunk-IAUJKZAQ.js → chunk-VOHTL6WN.js}

@@ -1,16 +1,16 @@
-import { Input } from './chunk-XB6YHUKW.js';
-import { Select } from './chunk-IECPLOSZ.js';
-import { Switch } from './chunk-NBAHXZHJ.js';
-import { DatePicker } from './chunk-OC75GWX5.js';
-import { Textarea } from './chunk-DEFGT75G.js';
-import { DisplayValue } from './chunk-KKWNKBKR.js';
-import { resolveOption } from './chunk-GFYSELJF.js';
-import { ColorPicker } from './chunk-F2GAZZVS.js';
+import { Input } from './chunk-XQDGUXMS.js';
+import { Select } from './chunk-OFNA5HS5.js';
+import { Switch } from './chunk-VQXXX6DK.js';
+import { DatePicker } from './chunk-2UTN3EFK.js';
+import { Textarea } from './chunk-UVUBV4VZ.js';
+import { DisplayValue } from './chunk-WX5XYDVN.js';
+import { resolveOption } from './chunk-USWQAMI3.js';
+import { Text } from './chunk-XM3V3RSU.js';
+import { ColorPicker } from './chunk-SVSQXKFL.js';
+import { useInlineEdit } from './chunk-OL53XYHF.js';
 import { Badge } from './chunk-6FCQD2KQ.js';
-import { Button } from './chunk-KODD54GT.js';
+import { Button } from './chunk-26JZ47BJ.js';
 import { Callout } from './chunk-ZXZJYVWP.js';
-import { Text } from './chunk-5RLP77KK.js';
-import { useInlineEdit } from './chunk-OL53XYHF.js';
 import { cn } from './chunk-MMW2JGKZ.js';
 import { createContext, forwardRef, useId, useRef, useMemo, useState, useEffect, useCallback, useContext } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
@@ -1197,7 +1197,7 @@ var JsonEditor = forwardRef(function JsonEditor2({
       "data-keymap-error": parsedKeyMap.ok ? void 0 : "true",
       "data-mode": readOnly ? "readonly" : mode,
       className: cn(
-        "overflow-hidden rounded-lg border border-zinc-200 bg-white text-zinc-900 dark:border-zinc-700 dark:bg-zinc-900 dark:text-zinc-100",
+        "overflow-hidden rounded-lg border border-[color:var(--fancy-border,var(--color-zinc-200))] bg-[color:var(--fancy-surface,var(--color-white))] text-[color:var(--fancy-text,var(--color-zinc-900))] dark:border-[color:var(--fancy-border-dark,var(--color-zinc-700))] dark:bg-[color:var(--fancy-surface-dark,var(--color-zinc-900))] dark:text-[color:var(--fancy-text-dark,var(--color-zinc-100))]",
         className
       ),
       children: [
@@ -1337,5 +1337,5 @@ function buildItems({
 }
 
 export { JSON_FIELD_TYPES, JsonEditor, applyJsonEdit, describeEdit, findJsonConflicts, getAtPath, inferType, parseKeyMap, parsePath, pathToString, resolveKeyRule, typeMatches };
-//# sourceMappingURL=chunk-IAUJKZAQ.js.map
-//# sourceMappingURL=chunk-IAUJKZAQ.js.map
+//# sourceMappingURL=chunk-VOHTL6WN.js.map
+//# sourceMappingURL=chunk-VOHTL6WN.js.map