@flanksource/clicky-ui 0.2.2 → 0.2.4

package/dist/data/TreeNode.cjs

@@ -0,0 +1,109 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const react = require("react");
+const utils = require("../lib/utils.cjs");
+const Icon = require("./Icon.cjs");
+const UiChevronDown = require("../icons/components/UiChevronDown.cjs");
+const UiChevronRight = require("../icons/components/UiChevronRight.cjs");
+function TreeNode({
+  node,
+  depth = 0,
+  expandAll = null,
+  forcedOpenKeys = null,
+  selected = null,
+  defaultOpen,
+  getChildren,
+  getKey,
+  onSelect,
+  renderRow,
+  rowClass,
+  indentPx = 16,
+  basePaddingPx = 8,
+  isSecondary
+}) {
+  const children = getChildren(node);
+  const hasChildren = ((children == null ? void 0 : children.length) ?? 0) > 0;
+  const initialOpen = defaultOpen ? defaultOpen(node, depth) : depth < 1;
+  const [open, setOpen] = react.useState(initialOpen);
+  const prevExpandAll = react.useRef(expandAll);
+  const isSelected = selected === node;
+  const key = getKey(node);
+  const isForcedOpen = (forcedOpenKeys == null ? void 0 : forcedOpenKeys.has(key)) ?? false;
+  const isOpen = isForcedOpen || open;
+  const secondaryNode = (isSecondary == null ? void 0 : isSecondary(node)) ?? false;
+  const childrenAllSecondary = hasChildren && isSecondary != null && children.every((c) => isSecondary(c));
+  const skipExpandAll = secondaryNode || childrenAllSecondary;
+  react.useEffect(() => {
+    if (expandAll !== null && expandAll !== prevExpandAll.current && !skipExpandAll) {
+      setOpen(expandAll);
+    }
+    prevExpandAll.current = expandAll;
+  }, [expandAll, skipExpandAll]);
+  function toggle() {
+    if (hasChildren) setOpen((o) => !o);
+  }
+  const defaultRowBg = isSelected ? "bg-primary/10 border-l-2 border-primary" : "hover:bg-accent";
+  const rowClassName = rowClass ? rowClass(node, isSelected) : defaultRowBg;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      role: "treeitem",
+      "aria-expanded": hasChildren ? isOpen : void 0,
+      "aria-selected": isSelected,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: utils.cn("flex items-center gap-1.5 py-1 px-2 cursor-pointer text-sm", rowClassName),
+            style: { paddingLeft: `${depth * indentPx + basePaddingPx}px` },
+            onClick: (e) => {
+              e.stopPropagation();
+              onSelect == null ? void 0 : onSelect(node);
+              toggle();
+            },
+            children: [
+              hasChildren ? /* @__PURE__ */ jsxRuntime.jsx(
+                Icon.Icon,
+                {
+                  icon: isOpen ? UiChevronDown.UiChevronDown : UiChevronRight.UiChevronRight,
+                  className: "text-muted-foreground text-xs w-3"
+                }
+              ) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "w-3 shrink-0", "aria-hidden": true }),
+              renderRow({
+                node,
+                depth,
+                open: isOpen,
+                selected: isSelected,
+                hasChildren,
+                toggle
+              })
+            ]
+          }
+        ),
+        isOpen && hasChildren && /* @__PURE__ */ jsxRuntime.jsx("div", { role: "group", children: children.map((child) => /* @__PURE__ */ jsxRuntime.jsx(
+          TreeNode,
+          {
+            node: child,
+            depth: depth + 1,
+            expandAll,
+            forcedOpenKeys,
+            selected,
+            getChildren,
+            getKey,
+            renderRow,
+            indentPx,
+            basePaddingPx,
+            ...defaultOpen ? { defaultOpen } : {},
+            ...onSelect ? { onSelect } : {},
+            ...rowClass ? { rowClass } : {},
+            ...isSecondary ? { isSecondary } : {}
+          },
+          getKey(child)
+        )) })
+      ]
+    }
+  );
+}
+exports.TreeNode = TreeNode;
+//# sourceMappingURL=TreeNode.cjs.map

package/dist/data/TreeNode.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TreeNode.cjs","sources":["../../src/data/TreeNode.tsx"],"sourcesContent":["import { useEffect, useRef, useState, type ReactNode } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"./Icon\";\nimport { UiChevronDown, UiChevronRight } from \"../icons\";\n\nexport type TreeRowContext<T> = {\n  node: T;\n  depth: number;\n  open: boolean;\n  selected: boolean;\n  hasChildren: boolean;\n  toggle: () => void;\n};\n\nexport type TreeNodeProps<T> = {\n  node: T;\n  depth?: number;\n  expandAll?: boolean | null;\n  forcedOpenKeys?: Set<string | number> | null;\n  selected?: T | null;\n  defaultOpen?: (node: T, depth: number) => boolean;\n  getChildren: (node: T) => T[] | undefined;\n  getKey: (node: T) => string | number;\n  onSelect?: (node: T) => void;\n  renderRow: (ctx: TreeRowContext<T>) => ReactNode;\n  rowClass?: (node: T, selected: boolean) => string;\n  indentPx?: number;\n  basePaddingPx?: number;\n  /**\n   * Marks a node as a **secondary child** of its parent. Secondary\n   * children keep the full tree structure (they render, they can be\n   * opened manually) but opt out of the bulk behaviours a caller\n   * typically wants when they click the toolbar:\n   *\n   *  - Tree-wide filter: their text is skipped during match detection\n   *    so typing in the search box never surfaces a row because one\n   *    of its secondary children happened to match.\n   *  - Expand all: secondary nodes stay at their default-open state\n   *    instead of being forced open, preventing 28k field rows from\n   *    flooding the viewport when an operator hits the button on a\n   *    schema with hundreds of tables.\n   *\n   * Default: every node is primary (returns false).\n   */\n  isSecondary?: (node: T) => boolean;\n};\n\nexport function TreeNode<T>({\n  node,\n  depth = 0,\n  expandAll = null,\n  forcedOpenKeys = null,\n  selected = null,\n  defaultOpen,\n  getChildren,\n  getKey,\n  onSelect,\n  renderRow,\n  rowClass,\n  indentPx = 16,\n  basePaddingPx = 8,\n  isSecondary,\n}: TreeNodeProps<T>) {\n  const children = getChildren(node);\n  const hasChildren = (children?.length ?? 0) > 0;\n  const initialOpen = defaultOpen ? defaultOpen(node, depth) : depth < 1;\n  const [open, setOpen] = useState(initialOpen);\n  const prevExpandAll = useRef(expandAll);\n  const isSelected = selected === node;\n  const key = getKey(node);\n  const isForcedOpen = forcedOpenKeys?.has(key) ?? false;\n  const isOpen = isForcedOpen || open;\n  // A node opts out of bulk expand-all in two distinct cases:\n  //\n  //  1. The node itself is secondary (its edge from the parent is\n  //     secondary) — rare at the root, but the rule is symmetric.\n  //  2. All of the node's children are secondary — the common case.\n  //     This is what keeps an \"Expand all\" on a schema tree from\n  //     flooding the viewport with every table's field rows: the\n  //     table opens to nothing structural worth seeing in bulk, so\n  //     we leave it closed until the operator clicks it manually.\n  //\n  // In both cases the manual toggle still works, and filter matches\n  // still force the row open via forcedOpenKeys, so users never\n  // lose access — they just don't get auto-flooded.\n  const secondaryNode = isSecondary?.(node) ?? false;\n  const childrenAllSecondary =\n    hasChildren && isSecondary != null && children!.every((c) => isSecondary(c));\n  const skipExpandAll = secondaryNode || childrenAllSecondary;\n\n  useEffect(() => {\n    if (expandAll !== null && expandAll !== prevExpandAll.current && !skipExpandAll) {\n      setOpen(expandAll);\n    }\n    prevExpandAll.current = expandAll;\n  }, [expandAll, skipExpandAll]);\n\n  function toggle() {\n    if (hasChildren) setOpen((o) => !o);\n  }\n\n  const defaultRowBg = isSelected ? \"bg-primary/10 border-l-2 border-primary\" : \"hover:bg-accent\";\n  const rowClassName = rowClass ? rowClass(node, isSelected) : defaultRowBg;\n\n  return (\n    <div\n      role=\"treeitem\"\n      aria-expanded={hasChildren ? isOpen : undefined}\n      aria-selected={isSelected}\n    >\n      <div\n        className={cn(\"flex items-center gap-1.5 py-1 px-2 cursor-pointer text-sm\", rowClassName)}\n        style={{ paddingLeft: `${depth * indentPx + basePaddingPx}px` }}\n        onClick={(e) => {\n          e.stopPropagation();\n          onSelect?.(node);\n          toggle();\n        }}\n      >\n        {hasChildren ? (\n          <Icon\n            icon={isOpen ? UiChevronDown : UiChevronRight}\n            className=\"text-muted-foreground text-xs w-3\"\n          />\n        ) : (\n          <span className=\"w-3 shrink-0\" aria-hidden />\n        )}\n        {renderRow({\n          node,\n          depth,\n          open: isOpen,\n          selected: isSelected,\n          hasChildren,\n          toggle,\n        })}\n      </div>\n      {isOpen && hasChildren && (\n        <div role=\"group\">\n          {children!.map((child) => (\n            <TreeNode\n              key={getKey(child)}\n              node={child}\n              depth={depth + 1}\n              expandAll={expandAll}\n              forcedOpenKeys={forcedOpenKeys}\n              selected={selected}\n              getChildren={getChildren}\n              getKey={getKey}\n              renderRow={renderRow}\n              indentPx={indentPx}\n              basePaddingPx={basePaddingPx}\n              {...(defaultOpen ? { defaultOpen } : {})}\n              {...(onSelect ? { onSelect } : {})}\n              {...(rowClass ? { rowClass } : {})}\n              {...(isSecondary ? { isSecondary } : {})}\n            />\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n"],"names":["useState","useRef","useEffect","jsxs","cn","jsx","Icon","UiChevronDown","UiChevronRight"],"mappings":"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"}

package/dist/data/TreeNode.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TreeNode.d.ts","sourceRoot":"","sources":["../../src/data/TreeNode.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA+B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAIpE,MAAM,MAAM,cAAc,CAAC,CAAC,IAAI;IAC9B,IAAI,EAAE,CAAC,CAAC;IACR,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,OAAO,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,OAAO,CAAC;IACrB,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,aAAa,CAAC,CAAC,IAAI;IAC7B,IAAI,EAAE,CAAC,CAAC;IACR,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IAC3B,cAAc,CAAC,EAAE,GAAG,CAAC,MAAM,GAAG,MAAM,CAAC,GAAG,IAAI,CAAC;IAC7C,QAAQ,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC;IACpB,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC;IAClD,WAAW,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,EAAE,GAAG,SAAS,CAAC;IAC1C,MAAM,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,GAAG,MAAM,CAAC;IACrC,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;IAC7B,SAAS,EAAE,CAAC,GAAG,EAAE,cAAc,CAAC,CAAC,CAAC,KAAK,SAAS,CAAC;IACjD,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,QAAQ,EAAE,OAAO,KAAK,MAAM,CAAC;IAClD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;;;;;;;;;;;;;OAeG;IACH,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,OAAO,CAAC;CACpC,CAAC;AAEF,wBAAgB,QAAQ,CAAC,CAAC,EAAE,EAC1B,IAAI,EACJ,KAAS,EACT,SAAgB,EAChB,cAAqB,EACrB,QAAe,EACf,WAAW,EACX,WAAW,EACX,MAAM,EACN,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,QAAa,EACb,aAAiB,EACjB,WAAW,GACZ,EAAE,aAAa,CAAC,CAAC,CAAC,2CA4FlB"}
+{"version":3,"file":"TreeNode.d.ts","sourceRoot":"","sources":["../../src/data/TreeNode.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA+B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAKpE,MAAM,MAAM,cAAc,CAAC,CAAC,IAAI;IAC9B,IAAI,EAAE,CAAC,CAAC;IACR,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,OAAO,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,OAAO,CAAC;IACrB,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,aAAa,CAAC,CAAC,IAAI;IAC7B,IAAI,EAAE,CAAC,CAAC;IACR,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IAC3B,cAAc,CAAC,EAAE,GAAG,CAAC,MAAM,GAAG,MAAM,CAAC,GAAG,IAAI,CAAC;IAC7C,QAAQ,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC;IACpB,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC;IAClD,WAAW,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,EAAE,GAAG,SAAS,CAAC;IAC1C,MAAM,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,GAAG,MAAM,CAAC;IACrC,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,CAAC;IAC7B,SAAS,EAAE,CAAC,GAAG,EAAE,cAAc,CAAC,CAAC,CAAC,KAAK,SAAS,CAAC;IACjD,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,QAAQ,EAAE,OAAO,KAAK,MAAM,CAAC;IAClD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;;;;;;;;;;;;;OAeG;IACH,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,OAAO,CAAC;CACpC,CAAC;AAEF,wBAAgB,QAAQ,CAAC,CAAC,EAAE,EAC1B,IAAI,EACJ,KAAS,EACT,SAAgB,EAChB,cAAqB,EACrB,QAAe,EACf,WAAW,EACX,WAAW,EACX,MAAM,EACN,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,QAAa,EACb,aAAiB,EACjB,WAAW,GACZ,EAAE,aAAa,CAAC,CAAC,CAAC,2CAmGlB"}

package/dist/data/TreeNode.js

@@ -2,6 +2,8 @@ import { jsxs, jsx } from "react/jsx-runtime";
 import { useState, useRef, useEffect } from "react";
 import { cn } from "../lib/utils.js";
 import { Icon } from "./Icon.js";
+import { UiChevronDown } from "../icons/components/UiChevronDown.js";
+import { UiChevronRight } from "../icons/components/UiChevronRight.js";
 function TreeNode({
   node,
   depth = 0,
@@ -62,11 +64,18 @@ function TreeNode({
               hasChildren ? /* @__PURE__ */ jsx(
                 Icon,
                 {
-                  name: isOpen ? "codicon:chevron-down" : "codicon:chevron-right",
+                  icon: isOpen ? UiChevronDown : UiChevronRight,
                   className: "text-muted-foreground text-xs w-3"
                 }
               ) : /* @__PURE__ */ jsx("span", { className: "w-3 shrink-0", "aria-hidden": true }),
-              renderRow({ node, depth, open: isOpen, selected: isSelected, hasChildren, toggle })
+              renderRow({
+                node,
+                depth,
+                open: isOpen,
+                selected: isSelected,
+                hasChildren,
+                toggle
+              })
             ]
           }
         ),

package/dist/data/TreeNode.js.map

@@ -1 +1 @@
-{"version":3,"file":"TreeNode.js","sources":["../../src/data/TreeNode.tsx"],"sourcesContent":["import { useEffect, useRef, useState, type ReactNode } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"./Icon\";\n\nexport type TreeRowContext<T> = {\n  node: T;\n  depth: number;\n  open: boolean;\n  selected: boolean;\n  hasChildren: boolean;\n  toggle: () => void;\n};\n\nexport type TreeNodeProps<T> = {\n  node: T;\n  depth?: number;\n  expandAll?: boolean | null;\n  forcedOpenKeys?: Set<string | number> | null;\n  selected?: T | null;\n  defaultOpen?: (node: T, depth: number) => boolean;\n  getChildren: (node: T) => T[] | undefined;\n  getKey: (node: T) => string | number;\n  onSelect?: (node: T) => void;\n  renderRow: (ctx: TreeRowContext<T>) => ReactNode;\n  rowClass?: (node: T, selected: boolean) => string;\n  indentPx?: number;\n  basePaddingPx?: number;\n  /**\n   * Marks a node as a **secondary child** of its parent. Secondary\n   * children keep the full tree structure (they render, they can be\n   * opened manually) but opt out of the bulk behaviours a caller\n   * typically wants when they click the toolbar:\n   *\n   *  - Tree-wide filter: their text is skipped during match detection\n   *    so typing in the search box never surfaces a row because one\n   *    of its secondary children happened to match.\n   *  - Expand all: secondary nodes stay at their default-open state\n   *    instead of being forced open, preventing 28k field rows from\n   *    flooding the viewport when an operator hits the button on a\n   *    schema with hundreds of tables.\n   *\n   * Default: every node is primary (returns false).\n   */\n  isSecondary?: (node: T) => boolean;\n};\n\nexport function TreeNode<T>({\n  node,\n  depth = 0,\n  expandAll = null,\n  forcedOpenKeys = null,\n  selected = null,\n  defaultOpen,\n  getChildren,\n  getKey,\n  onSelect,\n  renderRow,\n  rowClass,\n  indentPx = 16,\n  basePaddingPx = 8,\n  isSecondary,\n}: TreeNodeProps<T>) {\n  const children = getChildren(node);\n  const hasChildren = (children?.length ?? 0) > 0;\n  const initialOpen = defaultOpen ? defaultOpen(node, depth) : depth < 1;\n  const [open, setOpen] = useState(initialOpen);\n  const prevExpandAll = useRef(expandAll);\n  const isSelected = selected === node;\n  const key = getKey(node);\n  const isForcedOpen = forcedOpenKeys?.has(key) ?? false;\n  const isOpen = isForcedOpen || open;\n  // A node opts out of bulk expand-all in two distinct cases:\n  //\n  //  1. The node itself is secondary (its edge from the parent is\n  //     secondary) — rare at the root, but the rule is symmetric.\n  //  2. All of the node's children are secondary — the common case.\n  //     This is what keeps an \"Expand all\" on a schema tree from\n  //     flooding the viewport with every table's field rows: the\n  //     table opens to nothing structural worth seeing in bulk, so\n  //     we leave it closed until the operator clicks it manually.\n  //\n  // In both cases the manual toggle still works, and filter matches\n  // still force the row open via forcedOpenKeys, so users never\n  // lose access — they just don't get auto-flooded.\n  const secondaryNode = isSecondary?.(node) ?? false;\n  const childrenAllSecondary =\n    hasChildren && isSecondary != null && children!.every((c) => isSecondary(c));\n  const skipExpandAll = secondaryNode || childrenAllSecondary;\n\n  useEffect(() => {\n    if (expandAll !== null && expandAll !== prevExpandAll.current && !skipExpandAll) {\n      setOpen(expandAll);\n    }\n    prevExpandAll.current = expandAll;\n  }, [expandAll, skipExpandAll]);\n\n  function toggle() {\n    if (hasChildren) setOpen((o) => !o);\n  }\n\n  const defaultRowBg = isSelected ? \"bg-primary/10 border-l-2 border-primary\" : \"hover:bg-accent\";\n  const rowClassName = rowClass ? rowClass(node, isSelected) : defaultRowBg;\n\n  return (\n    <div\n      role=\"treeitem\"\n      aria-expanded={hasChildren ? isOpen : undefined}\n      aria-selected={isSelected}\n    >\n      <div\n        className={cn(\"flex items-center gap-1.5 py-1 px-2 cursor-pointer text-sm\", rowClassName)}\n        style={{ paddingLeft: `${depth * indentPx + basePaddingPx}px` }}\n        onClick={(e) => {\n          e.stopPropagation();\n          onSelect?.(node);\n          toggle();\n        }}\n      >\n        {hasChildren ? (\n          <Icon\n            name={isOpen ? \"codicon:chevron-down\" : \"codicon:chevron-right\"}\n            className=\"text-muted-foreground text-xs w-3\"\n          />\n        ) : (\n          <span className=\"w-3 shrink-0\" aria-hidden />\n        )}\n        {renderRow({ node, depth, open: isOpen, selected: isSelected, hasChildren, toggle })}\n      </div>\n      {isOpen && hasChildren && (\n        <div role=\"group\">\n          {children!.map((child) => (\n            <TreeNode\n              key={getKey(child)}\n              node={child}\n              depth={depth + 1}\n              expandAll={expandAll}\n              forcedOpenKeys={forcedOpenKeys}\n              selected={selected}\n              getChildren={getChildren}\n              getKey={getKey}\n              renderRow={renderRow}\n              indentPx={indentPx}\n              basePaddingPx={basePaddingPx}\n              {...(defaultOpen ? { defaultOpen } : {})}\n              {...(onSelect ? { onSelect } : {})}\n              {...(rowClass ? { rowClass } : {})}\n              {...(isSecondary ? { isSecondary } : {})}\n            />\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;AA8CO,SAAS,SAAY;AAAA,EAC1B;AAAA,EACA,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,iBAAiB;AAAA,EACjB,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,gBAAgB;AAAA,EAChB;AACF,GAAqB;AACnB,QAAM,WAAW,YAAY,IAAI;AACjC,QAAM,gBAAe,qCAAU,WAAU,KAAK;AAC9C,QAAM,cAAc,cAAc,YAAY,MAAM,KAAK,IAAI,QAAQ;AACrE,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,WAAW;AAC5C,QAAM,gBAAgB,OAAO,SAAS;AACtC,QAAM,aAAa,aAAa;AAChC,QAAM,MAAM,OAAO,IAAI;AACvB,QAAM,gBAAe,iDAAgB,IAAI,SAAQ;AACjD,QAAM,SAAS,gBAAgB;AAc/B,QAAM,iBAAgB,2CAAc,UAAS;AAC7C,QAAM,uBACJ,eAAe,eAAe,QAAQ,SAAU,MAAM,CAAC,MAAM,YAAY,CAAC,CAAC;AAC7E,QAAM,gBAAgB,iBAAiB;AAEvC,YAAU,MAAM;AACd,QAAI,cAAc,QAAQ,cAAc,cAAc,WAAW,CAAC,eAAe;AAC/E,cAAQ,SAAS;AAAA,IACnB;AACA,kBAAc,UAAU;AAAA,EAC1B,GAAG,CAAC,WAAW,aAAa,CAAC;AAE7B,WAAS,SAAS;AAChB,QAAI,YAAa,SAAQ,CAAC,MAAM,CAAC,CAAC;AAAA,EACpC;AAEA,QAAM,eAAe,aAAa,4CAA4C;AAC9E,QAAM,eAAe,WAAW,SAAS,MAAM,UAAU,IAAI;AAE7D,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,iBAAe,cAAc,SAAS;AAAA,MACtC,iBAAe;AAAA,MAEf,UAAA;AAAA,QAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,GAAG,8DAA8D,YAAY;AAAA,YACxF,OAAO,EAAE,aAAa,GAAG,QAAQ,WAAW,aAAa,KAAA;AAAA,YACzD,SAAS,CAAC,MAAM;AACd,gBAAE,gBAAA;AACF,mDAAW;AACX,qBAAA;AAAA,YACF;AAAA,YAEC,UAAA;AAAA,cAAA,cACC;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,MAAM,SAAS,yBAAyB;AAAA,kBACxC,WAAU;AAAA,gBAAA;AAAA,cAAA,IAGZ,oBAAC,QAAA,EAAK,WAAU,gBAAe,eAAW,MAAC;AAAA,cAE5C,UAAU,EAAE,MAAM,OAAO,MAAM,QAAQ,UAAU,YAAY,aAAa,OAAA,CAAQ;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,QAEpF,UAAU,eACT,oBAAC,OAAA,EAAI,MAAK,SACP,UAAA,SAAU,IAAI,CAAC,UACd;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,MAAM;AAAA,YACN,OAAO,QAAQ;AAAA,YACf;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACC,GAAI,cAAc,EAAE,YAAA,IAAgB,CAAA;AAAA,YACpC,GAAI,WAAW,EAAE,SAAA,IAAa,CAAA;AAAA,YAC9B,GAAI,WAAW,EAAE,SAAA,IAAa,CAAA;AAAA,YAC9B,GAAI,cAAc,EAAE,gBAAgB,CAAA;AAAA,UAAC;AAAA,UAdjC,OAAO,KAAK;AAAA,QAAA,CAgBpB,EAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR;"}
+{"version":3,"file":"TreeNode.js","sources":["../../src/data/TreeNode.tsx"],"sourcesContent":["import { useEffect, useRef, useState, type ReactNode } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon } from \"./Icon\";\nimport { UiChevronDown, UiChevronRight } from \"../icons\";\n\nexport type TreeRowContext<T> = {\n  node: T;\n  depth: number;\n  open: boolean;\n  selected: boolean;\n  hasChildren: boolean;\n  toggle: () => void;\n};\n\nexport type TreeNodeProps<T> = {\n  node: T;\n  depth?: number;\n  expandAll?: boolean | null;\n  forcedOpenKeys?: Set<string | number> | null;\n  selected?: T | null;\n  defaultOpen?: (node: T, depth: number) => boolean;\n  getChildren: (node: T) => T[] | undefined;\n  getKey: (node: T) => string | number;\n  onSelect?: (node: T) => void;\n  renderRow: (ctx: TreeRowContext<T>) => ReactNode;\n  rowClass?: (node: T, selected: boolean) => string;\n  indentPx?: number;\n  basePaddingPx?: number;\n  /**\n   * Marks a node as a **secondary child** of its parent. Secondary\n   * children keep the full tree structure (they render, they can be\n   * opened manually) but opt out of the bulk behaviours a caller\n   * typically wants when they click the toolbar:\n   *\n   *  - Tree-wide filter: their text is skipped during match detection\n   *    so typing in the search box never surfaces a row because one\n   *    of its secondary children happened to match.\n   *  - Expand all: secondary nodes stay at their default-open state\n   *    instead of being forced open, preventing 28k field rows from\n   *    flooding the viewport when an operator hits the button on a\n   *    schema with hundreds of tables.\n   *\n   * Default: every node is primary (returns false).\n   */\n  isSecondary?: (node: T) => boolean;\n};\n\nexport function TreeNode<T>({\n  node,\n  depth = 0,\n  expandAll = null,\n  forcedOpenKeys = null,\n  selected = null,\n  defaultOpen,\n  getChildren,\n  getKey,\n  onSelect,\n  renderRow,\n  rowClass,\n  indentPx = 16,\n  basePaddingPx = 8,\n  isSecondary,\n}: TreeNodeProps<T>) {\n  const children = getChildren(node);\n  const hasChildren = (children?.length ?? 0) > 0;\n  const initialOpen = defaultOpen ? defaultOpen(node, depth) : depth < 1;\n  const [open, setOpen] = useState(initialOpen);\n  const prevExpandAll = useRef(expandAll);\n  const isSelected = selected === node;\n  const key = getKey(node);\n  const isForcedOpen = forcedOpenKeys?.has(key) ?? false;\n  const isOpen = isForcedOpen || open;\n  // A node opts out of bulk expand-all in two distinct cases:\n  //\n  //  1. The node itself is secondary (its edge from the parent is\n  //     secondary) — rare at the root, but the rule is symmetric.\n  //  2. All of the node's children are secondary — the common case.\n  //     This is what keeps an \"Expand all\" on a schema tree from\n  //     flooding the viewport with every table's field rows: the\n  //     table opens to nothing structural worth seeing in bulk, so\n  //     we leave it closed until the operator clicks it manually.\n  //\n  // In both cases the manual toggle still works, and filter matches\n  // still force the row open via forcedOpenKeys, so users never\n  // lose access — they just don't get auto-flooded.\n  const secondaryNode = isSecondary?.(node) ?? false;\n  const childrenAllSecondary =\n    hasChildren && isSecondary != null && children!.every((c) => isSecondary(c));\n  const skipExpandAll = secondaryNode || childrenAllSecondary;\n\n  useEffect(() => {\n    if (expandAll !== null && expandAll !== prevExpandAll.current && !skipExpandAll) {\n      setOpen(expandAll);\n    }\n    prevExpandAll.current = expandAll;\n  }, [expandAll, skipExpandAll]);\n\n  function toggle() {\n    if (hasChildren) setOpen((o) => !o);\n  }\n\n  const defaultRowBg = isSelected ? \"bg-primary/10 border-l-2 border-primary\" : \"hover:bg-accent\";\n  const rowClassName = rowClass ? rowClass(node, isSelected) : defaultRowBg;\n\n  return (\n    <div\n      role=\"treeitem\"\n      aria-expanded={hasChildren ? isOpen : undefined}\n      aria-selected={isSelected}\n    >\n      <div\n        className={cn(\"flex items-center gap-1.5 py-1 px-2 cursor-pointer text-sm\", rowClassName)}\n        style={{ paddingLeft: `${depth * indentPx + basePaddingPx}px` }}\n        onClick={(e) => {\n          e.stopPropagation();\n          onSelect?.(node);\n          toggle();\n        }}\n      >\n        {hasChildren ? (\n          <Icon\n            icon={isOpen ? UiChevronDown : UiChevronRight}\n            className=\"text-muted-foreground text-xs w-3\"\n          />\n        ) : (\n          <span className=\"w-3 shrink-0\" aria-hidden />\n        )}\n        {renderRow({\n          node,\n          depth,\n          open: isOpen,\n          selected: isSelected,\n          hasChildren,\n          toggle,\n        })}\n      </div>\n      {isOpen && hasChildren && (\n        <div role=\"group\">\n          {children!.map((child) => (\n            <TreeNode\n              key={getKey(child)}\n              node={child}\n              depth={depth + 1}\n              expandAll={expandAll}\n              forcedOpenKeys={forcedOpenKeys}\n              selected={selected}\n              getChildren={getChildren}\n              getKey={getKey}\n              renderRow={renderRow}\n              indentPx={indentPx}\n              basePaddingPx={basePaddingPx}\n              {...(defaultOpen ? { defaultOpen } : {})}\n              {...(onSelect ? { onSelect } : {})}\n              {...(rowClass ? { rowClass } : {})}\n              {...(isSecondary ? { isSecondary } : {})}\n            />\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;;AA+CO,SAAS,SAAY;AAAA,EAC1B;AAAA,EACA,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,iBAAiB;AAAA,EACjB,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,gBAAgB;AAAA,EAChB;AACF,GAAqB;AACnB,QAAM,WAAW,YAAY,IAAI;AACjC,QAAM,gBAAe,qCAAU,WAAU,KAAK;AAC9C,QAAM,cAAc,cAAc,YAAY,MAAM,KAAK,IAAI,QAAQ;AACrE,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,WAAW;AAC5C,QAAM,gBAAgB,OAAO,SAAS;AACtC,QAAM,aAAa,aAAa;AAChC,QAAM,MAAM,OAAO,IAAI;AACvB,QAAM,gBAAe,iDAAgB,IAAI,SAAQ;AACjD,QAAM,SAAS,gBAAgB;AAc/B,QAAM,iBAAgB,2CAAc,UAAS;AAC7C,QAAM,uBACJ,eAAe,eAAe,QAAQ,SAAU,MAAM,CAAC,MAAM,YAAY,CAAC,CAAC;AAC7E,QAAM,gBAAgB,iBAAiB;AAEvC,YAAU,MAAM;AACd,QAAI,cAAc,QAAQ,cAAc,cAAc,WAAW,CAAC,eAAe;AAC/E,cAAQ,SAAS;AAAA,IACnB;AACA,kBAAc,UAAU;AAAA,EAC1B,GAAG,CAAC,WAAW,aAAa,CAAC;AAE7B,WAAS,SAAS;AAChB,QAAI,YAAa,SAAQ,CAAC,MAAM,CAAC,CAAC;AAAA,EACpC;AAEA,QAAM,eAAe,aAAa,4CAA4C;AAC9E,QAAM,eAAe,WAAW,SAAS,MAAM,UAAU,IAAI;AAE7D,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,iBAAe,cAAc,SAAS;AAAA,MACtC,iBAAe;AAAA,MAEf,UAAA;AAAA,QAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,GAAG,8DAA8D,YAAY;AAAA,YACxF,OAAO,EAAE,aAAa,GAAG,QAAQ,WAAW,aAAa,KAAA;AAAA,YACzD,SAAS,CAAC,MAAM;AACd,gBAAE,gBAAA;AACF,mDAAW;AACX,qBAAA;AAAA,YACF;AAAA,YAEC,UAAA;AAAA,cAAA,cACC;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,MAAM,SAAS,gBAAgB;AAAA,kBAC/B,WAAU;AAAA,gBAAA;AAAA,cAAA,IAGZ,oBAAC,QAAA,EAAK,WAAU,gBAAe,eAAW,MAAC;AAAA,cAE5C,UAAU;AAAA,gBACT;AAAA,gBACA;AAAA,gBACA,MAAM;AAAA,gBACN,UAAU;AAAA,gBACV;AAAA,gBACA;AAAA,cAAA,CACD;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,QAEF,UAAU,eACT,oBAAC,OAAA,EAAI,MAAK,SACP,UAAA,SAAU,IAAI,CAAC,UACd;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,MAAM;AAAA,YACN,OAAO,QAAQ;AAAA,YACf;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACC,GAAI,cAAc,EAAE,YAAA,IAAgB,CAAA;AAAA,YACpC,GAAI,WAAW,EAAE,SAAA,IAAa,CAAA;AAAA,YAC9B,GAAI,WAAW,EAAE,SAAA,IAAa,CAAA;AAAA,YAC9B,GAAI,cAAc,EAAE,gBAAgB,CAAA;AAAA,UAAC;AAAA,UAdjC,OAAO,KAAK;AAAA,QAAA,CAgBpB,EAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR;"}

package/dist/data/cells/StatusDot.cjs

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const utils = require("../../lib/utils.cjs");
+const DOT_COLOR = {
+  success: "bg-emerald-500",
+  error: "bg-rose-500",
+  warning: "bg-amber-500",
+  info: "bg-sky-500"
+};
+const DOT_SIZE = {
+  xs: "h-1.5 w-1.5",
+  sm: "h-2 w-2",
+  md: "h-2.5 w-2.5"
+};
+function StatusDot({ status, size = "sm", label, title, className }) {
+  const tooltip = title ?? label ?? status;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "span",
+    {
+      className: utils.cn("inline-flex items-center gap-1.5 align-middle", className),
+      title: tooltip,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            role: "img",
+            "aria-label": label ?? status,
+            className: utils.cn("inline-block shrink-0 rounded-full", DOT_COLOR[status], DOT_SIZE[size])
+          }
+        ),
+        label && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-xs", children: label })
+      ]
+    }
+  );
+}
+exports.StatusDot = StatusDot;
+//# sourceMappingURL=StatusDot.cjs.map

package/dist/data/cells/StatusDot.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusDot.cjs","sources":["../../../src/data/cells/StatusDot.tsx"],"sourcesContent":["import { cn } from \"../../lib/utils\";\nimport type { BadgeStatus } from \"../Badge\";\n\nexport type StatusDotSize = \"xs\" | \"sm\" | \"md\";\n\nconst DOT_COLOR: Record<BadgeStatus, string> = {\n  success: \"bg-emerald-500\",\n  error: \"bg-rose-500\",\n  warning: \"bg-amber-500\",\n  info: \"bg-sky-500\",\n};\n\nconst DOT_SIZE: Record<StatusDotSize, string> = {\n  xs: \"h-1.5 w-1.5\",\n  sm: \"h-2 w-2\",\n  md: \"h-2.5 w-2.5\",\n};\n\nexport type StatusDotProps = {\n  status: BadgeStatus;\n  size?: StatusDotSize;\n  label?: string;\n  title?: string;\n  className?: string;\n};\n\nexport function StatusDot({ status, size = \"sm\", label, title, className }: StatusDotProps) {\n  const tooltip = title ?? label ?? status;\n  return (\n    <span\n      className={cn(\"inline-flex items-center gap-1.5 align-middle\", className)}\n      title={tooltip}\n    >\n      <span\n        role=\"img\"\n        aria-label={label ?? status}\n        className={cn(\"inline-block shrink-0 rounded-full\", DOT_COLOR[status], DOT_SIZE[size])}\n      />\n      {label && <span className=\"truncate text-xs\">{label}</span>}\n    </span>\n  );\n}\n"],"names":["jsxs","cn","jsx"],"mappings":";;;;AAKA,MAAM,YAAyC;AAAA,EAC7C,SAAS;AAAA,EACT,OAAO;AAAA,EACP,SAAS;AAAA,EACT,MAAM;AACR;AAEA,MAAM,WAA0C;AAAA,EAC9C,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAUO,SAAS,UAAU,EAAE,QAAQ,OAAO,MAAM,OAAO,OAAO,aAA6B;AAC1F,QAAM,UAAU,SAAS,SAAS;AAClC,SACEA,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,MAAAA,GAAG,iDAAiD,SAAS;AAAA,MACxE,OAAO;AAAA,MAEP,UAAA;AAAA,QAAAC,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,cAAY,SAAS;AAAA,YACrB,WAAWD,MAAAA,GAAG,sCAAsC,UAAU,MAAM,GAAG,SAAS,IAAI,CAAC;AAAA,UAAA;AAAA,QAAA;AAAA,QAEtF,SAASC,2BAAAA,IAAC,QAAA,EAAK,WAAU,oBAAoB,UAAA,MAAA,CAAM;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAG1D;;"}

package/dist/data/cells/TagList.cjs

@@ -0,0 +1,332 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const react = require("react");
+const Badge = require("../Badge.cjs");
+const HoverCard = require("../../overlay/HoverCard.cjs");
+const Icon = require("../Icon.cjs");
+const Properties = require("../Properties.cjs");
+const useDensity = require("../../hooks/use-density.cjs");
+const utils = require("../../lib/utils.cjs");
+const UiZoomIn = require("../../icons/components/UiZoomIn.cjs");
+const UiZoomOut = require("../../icons/components/UiZoomOut.cjs");
+const UiCopy = require("../../icons/components/UiCopy.cjs");
+function normalizeTags(value, separator = "=") {
+  if (value == null) return [];
+  if (Array.isArray(value)) {
+    return value.map((entry) => normalizeOne(entry, separator)).filter((tag) => tag.value !== "");
+  }
+  if (typeof value === "object") {
+    return Object.entries(value).map(([key, raw]) => {
+      if (raw == null) return null;
+      const valueStr = String(raw).trim();
+      if (!valueStr) return null;
+      return {
+        key,
+        value: valueStr,
+        display: `${key}${separator}${valueStr}`,
+        token: `${key}${separator}${valueStr}`
+      };
+    }).filter((tag) => tag !== null);
+  }
+  return [];
+}
+function normalizeOne(entry, separator) {
+  if (typeof entry === "string") {
+    const trimmed = entry.trim();
+    const eq = trimmed.indexOf("=");
+    const colon = trimmed.indexOf(":");
+    const splitAt = eq >= 0 && (colon < 0 || eq < colon) ? eq : colon >= 0 && colon < trimmed.length - 1 ? colon : -1;
+    if (splitAt > 0) {
+      const key2 = trimmed.slice(0, splitAt);
+      const value2 = trimmed.slice(splitAt + 1);
+      return {
+        key: key2,
+        value: value2,
+        display: `${key2}${separator}${value2}`,
+        token: `${key2}${separator}${value2}`
+      };
+    }
+    return { value: trimmed, display: trimmed, token: trimmed };
+  }
+  const key = "key" in entry && typeof entry.key === "string" ? entry.key : "name" in entry && typeof entry.name === "string" ? entry.name : void 0;
+  const value = String(entry.value ?? "").trim();
+  if (key) {
+    return {
+      key,
+      value,
+      display: `${key}${separator}${value}`,
+      token: `${key}${separator}${value}`
+    };
+  }
+  return { value, display: value, token: value };
+}
+function tagFilterTokens(value, separator = "=") {
+  return normalizeTags(value, separator).map((tag) => tag.token);
+}
+function splitTagToken(token, separator = "=") {
+  const idx = token.indexOf(separator);
+  if (idx <= 0) return { key: "", value: token };
+  return {
+    key: token.slice(0, idx),
+    value: token.slice(idx + separator.length)
+  };
+}
+const noop = {
+  getMode: () => "neutral",
+  toggleInclude: () => {
+  },
+  toggleExclude: () => {
+  }
+};
+const TagActionsContext = react.createContext(noop);
+function TagActionsProvider({
+  value,
+  children
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(TagActionsContext.Provider, { value, children });
+}
+function useTagActions() {
+  return react.useContext(TagActionsContext);
+}
+function copyToClipboard(text) {
+  var _a;
+  if (typeof navigator !== "undefined" && ((_a = navigator.clipboard) == null ? void 0 : _a.writeText)) {
+    navigator.clipboard.writeText(text).catch(() => void 0);
+  }
+}
+function TagBadge({
+  tag,
+  actions: actionMode,
+  compact = false
+}) {
+  const actions = useTagActions();
+  const mode = actions.getMode(tag.token);
+  const onPlus = react.useCallback(
+    (event) => {
+      event.stopPropagation();
+      actions.toggleInclude(tag.token);
+    },
+    [actions, tag.token]
+  );
+  const onMinus = react.useCallback(
+    (event) => {
+      event.stopPropagation();
+      actions.toggleExclude(tag.token);
+    },
+    [actions, tag.token]
+  );
+  const onCopy = react.useCallback(
+    (event) => {
+      event.stopPropagation();
+      copyToClipboard(tag.value);
+    },
+    [tag.value]
+  );
+  const includeActive = mode === "include";
+  const excludeActive = mode === "exclude";
+  const showTooltip = compact && !!tag.key;
+  const badge = /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      ...showTooltip ? { title: tag.display } : {},
+      className: utils.cn(
+        "inline-flex items-center rounded-md border bg-background align-middle",
+        includeActive ? "border-green-500/50 bg-green-500/5" : excludeActive ? "border-red-500/50 bg-red-500/5" : "border-border"
+      ),
+      children: tag.key && !compact ? /* @__PURE__ */ jsxRuntime.jsx(
+        Badge.Badge,
+        {
+          size: "xs",
+          variant: "label",
+          tone: "neutral",
+          label: tag.key,
+          value: tag.value,
+          maxWidth: 32,
+          truncate: "auto",
+          clickToCopy: false,
+          className: "border-transparent shadow-none"
+        }
+      ) : /* @__PURE__ */ jsxRuntime.jsx(
+        Badge.Badge,
+        {
+          size: "xs",
+          variant: "soft",
+          tone: "neutral",
+          maxWidth: 32,
+          truncate: "auto",
+          clickToCopy: false,
+          children: tag.value
+        }
+      )
+    }
+  );
+  const toolbar = /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-0.5", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      TagActionButton,
+      {
+        ariaLabel: `Include ${tag.display}`,
+        onClick: onPlus,
+        active: includeActive,
+        activeClassName: "bg-green-500/20 text-green-700 dark:text-green-400",
+        icon: UiZoomIn.UiZoomIn
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      TagActionButton,
+      {
+        ariaLabel: `Exclude ${tag.display}`,
+        onClick: onMinus,
+        active: excludeActive,
+        activeClassName: "bg-red-500/20 text-red-700 dark:text-red-400",
+        icon: UiZoomOut.UiZoomOut
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(TagActionButton, { ariaLabel: `Copy ${tag.display}`, onClick: onCopy, icon: UiCopy.UiCopy })
+  ] });
+  if (actionMode === "inline") {
+    return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-0.5 rounded-md border border-border bg-background pr-0.5", children: [
+      badge,
+      toolbar
+    ] });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(HoverCard.HoverCard, { placement: "top", delay: 120, arrow: false, trigger: badge, cardClassName: "!p-1", children: toolbar });
+}
+function TagActionButton({
+  ariaLabel,
+  onClick,
+  active,
+  activeClassName,
+  icon
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "button",
+    {
+      type: "button",
+      "aria-label": ariaLabel,
+      title: ariaLabel,
+      onClick,
+      className: utils.cn(
+        "inline-flex h-5 w-5 items-center justify-center rounded text-muted-foreground",
+        "hover:bg-accent hover:text-foreground",
+        active && activeClassName
+      ),
+      children: /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon, className: "text-xs" })
+    }
+  );
+}
+function TagList({
+  tags,
+  maxVisible = 3,
+  className,
+  actions = "hover",
+  compact
+}) {
+  const density = useDensity.useDensityValue();
+  const isCompact = compact ?? density === "compact";
+  if (tags.length === 0) {
+    return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: "—" });
+  }
+  const visible = tags.slice(0, maxVisible);
+  const overflow = tags.slice(maxVisible);
+  return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: utils.cn("flex min-w-0 items-center gap-1", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex min-w-0 flex-1 flex-nowrap items-center gap-1 overflow-hidden", children: visible.map((tag, index) => /* @__PURE__ */ jsxRuntime.jsx(
+      TagBadge,
+      {
+        tag,
+        actions,
+        compact: isCompact
+      },
+      `${tag.display}-${index}`
+    )) }),
+    overflow.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
+      HoverCard.HoverCard,
+      {
+        placement: "top",
+        trigger: /* @__PURE__ */ jsxRuntime.jsxs(
+          Badge.Badge,
+          {
+            size: "xs",
+            variant: "outlined",
+            tone: "neutral",
+            clickToCopy: false,
+            className: "shrink-0",
+            children: [
+              "+",
+              overflow.length
+            ]
+          }
+        ),
+        cardClassName: "min-w-72 max-w-[90vw] whitespace-normal !p-0",
+        children: /* @__PURE__ */ jsxRuntime.jsx(TagPropertiesList, { tags: overflow })
+      }
+    )
+  ] });
+}
+function TagPropertiesList({ tags }) {
+  const tagActions = useTagActions();
+  const items = react.useMemo(
+    () => tags.map((tag, index) => ({ key: `${tag.token}-${index}`, value: tag })),
+    [tags]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Properties.Properties,
+    {
+      items,
+      density: "compact",
+      className: "border-0 bg-transparent",
+      rowClassName: "grid-cols-[minmax(4rem,8rem)_minmax(0,1fr)]",
+      renderLabel: (_key, tag) => tag.key ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-mono", children: tag.key }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "italic text-muted-foreground", children: "tag" }),
+      renderValue: (_key, tag) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block truncate font-mono", title: tag.value, children: tag.value }),
+      suffixActions: [
+        {
+          id: "include",
+          icon: UiZoomIn.UiZoomIn,
+          label: (_key, tag) => `Include ${tag.display}`,
+          onClick: (_key, tag) => tagActions.toggleInclude(tag.token)
+        },
+        {
+          id: "exclude",
+          icon: UiZoomOut.UiZoomOut,
+          label: (_key, tag) => `Exclude ${tag.display}`,
+          onClick: (_key, tag) => tagActions.toggleExclude(tag.token)
+        },
+        {
+          id: "copy",
+          icon: UiCopy.UiCopy,
+          label: (_key, tag) => `Copy ${tag.display}`,
+          onClick: (_key, tag) => copyToClipboard(tag.value)
+        }
+      ]
+    }
+  );
+}
+function tagActionsFromRecord(value, onChange) {
+  return {
+    getMode: (token) => value[token] ?? "neutral",
+    toggleInclude: (token) => {
+      const next = { ...value };
+      if (next[token] === "include") delete next[token];
+      else next[token] = "include";
+      onChange(next);
+    },
+    toggleExclude: (token) => {
+      const next = { ...value };
+      if (next[token] === "exclude") delete next[token];
+      else next[token] = "exclude";
+      onChange(next);
+    }
+  };
+}
+function useTagActionsValue(value, onChange) {
+  return react.useMemo(() => tagActionsFromRecord(value, onChange), [value, onChange]);
+}
+exports.TagActionsProvider = TagActionsProvider;
+exports.TagList = TagList;
+exports.normalizeTags = normalizeTags;
+exports.splitTagToken = splitTagToken;
+exports.tagActionsFromRecord = tagActionsFromRecord;
+exports.tagFilterTokens = tagFilterTokens;
+exports.useTagActions = useTagActions;
+exports.useTagActionsValue = useTagActionsValue;
+//# sourceMappingURL=TagList.cjs.map

package/dist/data/cells/TagList.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TagList.cjs","sources":["../../../src/data/cells/TagList.tsx"],"sourcesContent":["import { createContext, useCallback, useContext, useMemo } from \"react\";\nimport { Badge } from \"../Badge\";\nimport { HoverCard } from \"../../overlay/HoverCard\";\nimport { Icon, type StaticIconComponent } from \"../Icon\";\nimport { Properties, type PropertiesItem } from \"../Properties\";\nimport { UiCopy, UiZoomIn, UiZoomOut } from \"../../icons\";\nimport { useDensityValue } from \"../../hooks/use-density\";\nimport { cn } from \"../../lib/utils\";\nimport type { FilterMode } from \"../FilterPill\";\n\nexport type TagInput = string | { key: string; value: string } | { name: string; value: string };\n\nexport type NormalizedTag = {\n  key?: string;\n  value: string;\n  display: string;\n  token: string;\n};\n\nexport type TagsValue =\n  | TagInput[]\n  | Record<string, string | number | boolean | null>\n  | null\n  | undefined;\n\nexport type TagsOptions = {\n  /** Number of tags to show inline before using the `+N` overflow popover. */\n  maxVisible?: number;\n  /** Separator between tag keys and values. Defaults to `=`. */\n  separator?: string;\n};\n\nexport function normalizeTags(value: TagsValue, separator = \"=\"): NormalizedTag[] {\n  if (value == null) return [];\n\n  if (Array.isArray(value)) {\n    return value.map((entry) => normalizeOne(entry, separator)).filter((tag) => tag.value !== \"\");\n  }\n\n  if (typeof value === \"object\") {\n    return Object.entries(value)\n      .map(([key, raw]): NormalizedTag | null => {\n        if (raw == null) return null;\n        const valueStr = String(raw).trim();\n        if (!valueStr) return null;\n        return {\n          key,\n          value: valueStr,\n          display: `${key}${separator}${valueStr}`,\n          token: `${key}${separator}${valueStr}`,\n        } satisfies NormalizedTag;\n      })\n      .filter((tag): tag is NormalizedTag => tag !== null);\n  }\n\n  return [];\n}\n\nfunction normalizeOne(entry: TagInput, separator: string): NormalizedTag {\n  if (typeof entry === \"string\") {\n    const trimmed = entry.trim();\n    const eq = trimmed.indexOf(\"=\");\n    const colon = trimmed.indexOf(\":\");\n    const splitAt =\n      eq >= 0 && (colon < 0 || eq < colon)\n        ? eq\n        : colon >= 0 && colon < trimmed.length - 1\n          ? colon\n          : -1;\n\n    if (splitAt > 0) {\n      const key = trimmed.slice(0, splitAt);\n      const value = trimmed.slice(splitAt + 1);\n      return {\n        key,\n        value,\n        display: `${key}${separator}${value}`,\n        token: `${key}${separator}${value}`,\n      };\n    }\n\n    return { value: trimmed, display: trimmed, token: trimmed };\n  }\n\n  const key =\n    \"key\" in entry && typeof entry.key === \"string\"\n      ? entry.key\n      : \"name\" in entry && typeof entry.name === \"string\"\n        ? entry.name\n        : undefined;\n  const value = String(entry.value ?? \"\").trim();\n\n  if (key) {\n    return {\n      key,\n      value,\n      display: `${key}${separator}${value}`,\n      token: `${key}${separator}${value}`,\n    };\n  }\n  return { value, display: value, token: value };\n}\n\nexport function tagFilterTokens(value: TagsValue, separator = \"=\"): string[] {\n  return normalizeTags(value, separator).map((tag) => tag.token);\n}\n\n/**\n * Splits a token previously produced by `normalizeTags`/`tagFilterTokens`\n * back into its key and value parts using the same separator. Tokens\n * without a separator (bare tags) return `{ key: \"\", value: token }`.\n */\nexport function splitTagToken(token: string, separator = \"=\"): { key: string; value: string } {\n  const idx = token.indexOf(separator);\n  if (idx <= 0) return { key: \"\", value: token };\n  return {\n    key: token.slice(0, idx),\n    value: token.slice(idx + separator.length),\n  };\n}\n\n// Filter mode mapping (re-using FilterPill's tri-state vocabulary so the wire\n// shape matches DataTable's existing multiFilters state).\nexport type TagFilterMode = Extract<FilterMode, \"include\" | \"exclude\">;\n\nexport type TagActionsContextValue = {\n  /** Returns the current mode for a token; \"neutral\" if the user hasn't acted on it. */\n  getMode: (token: string) => FilterMode;\n  /** Toggle include for this token (off → include → off). */\n  toggleInclude: (token: string) => void;\n  /** Toggle exclude for this token (off → exclude → off). */\n  toggleExclude: (token: string) => void;\n};\n\nconst noop: TagActionsContextValue = {\n  getMode: () => \"neutral\",\n  toggleInclude: () => {},\n  toggleExclude: () => {},\n};\n\nconst TagActionsContext = createContext<TagActionsContextValue>(noop);\n\nexport function TagActionsProvider({\n  value,\n  children,\n}: {\n  value: TagActionsContextValue;\n  children: React.ReactNode;\n}) {\n  return <TagActionsContext.Provider value={value}>{children}</TagActionsContext.Provider>;\n}\n\nexport function useTagActions(): TagActionsContextValue {\n  return useContext(TagActionsContext);\n}\n\nexport type TagListProps = {\n  /** Normalized tags to render. */\n  tags: NormalizedTag[];\n  /** Number of tags to show inline before the overflow popover. */\n  maxVisible?: number;\n  /** Classes applied to the tag row. */\n  className?: string;\n  /** Whether copy/zoom actions appear on hover or inline. */\n  actions?: \"hover\" | \"inline\";\n  /**\n   * When `true`, visible tag badges render only their value — the key is\n   * dropped from the inline display. The full `key=value` text is still\n   * available in `tag.display` (used for tooltips, copy actions, and the\n   * overflow `+N` popover). Defaults to whether the surrounding density\n   * (via {@link useDensityValue}) is `\"compact\"`.\n   */\n  compact?: boolean;\n};\n\nfunction copyToClipboard(text: string) {\n  if (typeof navigator !== \"undefined\" && navigator.clipboard?.writeText) {\n    navigator.clipboard.writeText(text).catch(() => undefined);\n  }\n}\n\nfunction TagBadge({\n  tag,\n  actions: actionMode,\n  compact = false,\n}: {\n  tag: NormalizedTag;\n  actions: \"hover\" | \"inline\";\n  compact?: boolean;\n}) {\n  const actions = useTagActions();\n  const mode = actions.getMode(tag.token);\n\n  const onPlus = useCallback(\n    (event: React.MouseEvent) => {\n      event.stopPropagation();\n      actions.toggleInclude(tag.token);\n    },\n    [actions, tag.token],\n  );\n  const onMinus = useCallback(\n    (event: React.MouseEvent) => {\n      event.stopPropagation();\n      actions.toggleExclude(tag.token);\n    },\n    [actions, tag.token],\n  );\n  const onCopy = useCallback(\n    (event: React.MouseEvent) => {\n      event.stopPropagation();\n      copyToClipboard(tag.value);\n    },\n    [tag.value],\n  );\n\n  // Active state colors mirror FilterPill: include = green, exclude = red.\n  const includeActive = mode === \"include\";\n  const excludeActive = mode === \"exclude\";\n\n  const showTooltip = compact && !!tag.key;\n  const badge = (\n    <span\n      {...(showTooltip ? { title: tag.display } : {})}\n      className={cn(\n        \"inline-flex items-center rounded-md border bg-background align-middle\",\n        includeActive\n          ? \"border-green-500/50 bg-green-500/5\"\n          : excludeActive\n            ? \"border-red-500/50 bg-red-500/5\"\n            : \"border-border\",\n      )}\n    >\n      {tag.key && !compact ? (\n        <Badge\n          size=\"xs\"\n          variant=\"label\"\n          tone=\"neutral\"\n          label={tag.key}\n          value={tag.value}\n          maxWidth={32}\n          truncate=\"auto\"\n          clickToCopy={false}\n          className=\"border-transparent shadow-none\"\n        />\n      ) : (\n        <Badge\n          size=\"xs\"\n          variant=\"soft\"\n          tone=\"neutral\"\n          maxWidth={32}\n          truncate=\"auto\"\n          clickToCopy={false}\n        >\n          {tag.value}\n        </Badge>\n      )}\n    </span>\n  );\n\n  const toolbar = (\n    <span className=\"inline-flex items-center gap-0.5\">\n      <TagActionButton\n        ariaLabel={`Include ${tag.display}`}\n        onClick={onPlus}\n        active={includeActive}\n        activeClassName=\"bg-green-500/20 text-green-700 dark:text-green-400\"\n        icon={UiZoomIn}\n      />\n      <TagActionButton\n        ariaLabel={`Exclude ${tag.display}`}\n        onClick={onMinus}\n        active={excludeActive}\n        activeClassName=\"bg-red-500/20 text-red-700 dark:text-red-400\"\n        icon={UiZoomOut}\n      />\n      <TagActionButton ariaLabel={`Copy ${tag.display}`} onClick={onCopy} icon={UiCopy} />\n    </span>\n  );\n\n  if (actionMode === \"inline\") {\n    return (\n      <span className=\"inline-flex items-center gap-0.5 rounded-md border border-border bg-background pr-0.5\">\n        {badge}\n        {toolbar}\n      </span>\n    );\n  }\n\n  // Action icons live in a hover popover above the tag — the cell stays\n  // clean, and hovering reveals the magnifier-plus / magnifier-minus / copy\n  // toolbar.\n  return (\n    <HoverCard placement=\"top\" delay={120} arrow={false} trigger={badge} cardClassName=\"!p-1\">\n      {toolbar}\n    </HoverCard>\n  );\n}\n\nfunction TagActionButton({\n  ariaLabel,\n  onClick,\n  active,\n  activeClassName,\n  icon,\n}: {\n  ariaLabel: string;\n  onClick: (event: React.MouseEvent) => void;\n  active?: boolean;\n  activeClassName?: string;\n  icon: StaticIconComponent;\n}) {\n  return (\n    <button\n      type=\"button\"\n      aria-label={ariaLabel}\n      title={ariaLabel}\n      onClick={onClick}\n      className={cn(\n        \"inline-flex h-5 w-5 items-center justify-center rounded text-muted-foreground\",\n        \"hover:bg-accent hover:text-foreground\",\n        active && activeClassName,\n      )}\n    >\n      <Icon icon={icon} className=\"text-xs\" />\n    </button>\n  );\n}\n\nexport function TagList({\n  tags,\n  maxVisible = 3,\n  className,\n  actions = \"hover\",\n  compact,\n}: TagListProps) {\n  const density = useDensityValue();\n  const isCompact = compact ?? density === \"compact\";\n\n  if (tags.length === 0) {\n    return <span className=\"text-muted-foreground\">—</span>;\n  }\n\n  const visible = tags.slice(0, maxVisible);\n  const overflow = tags.slice(maxVisible);\n\n  return (\n    <span className={cn(\"flex min-w-0 items-center gap-1\", className)}>\n      <span className=\"flex min-w-0 flex-1 flex-nowrap items-center gap-1 overflow-hidden\">\n        {visible.map((tag, index) => (\n          <TagBadge\n            key={`${tag.display}-${index}`}\n            tag={tag}\n            actions={actions}\n            compact={isCompact}\n          />\n        ))}\n      </span>\n      {overflow.length > 0 && (\n        <HoverCard\n          placement=\"top\"\n          trigger={\n            <Badge\n              size=\"xs\"\n              variant=\"outlined\"\n              tone=\"neutral\"\n              clickToCopy={false}\n              className=\"shrink-0\"\n            >\n              +{overflow.length}\n            </Badge>\n          }\n          cardClassName=\"min-w-72 max-w-[90vw] whitespace-normal !p-0\"\n        >\n          <TagPropertiesList tags={overflow} />\n        </HoverCard>\n      )}\n    </span>\n  );\n}\n\nfunction TagPropertiesList({ tags }: { tags: NormalizedTag[] }) {\n  const tagActions = useTagActions();\n  const items = useMemo<PropertiesItem<NormalizedTag>[]>(\n    () => tags.map((tag, index) => ({ key: `${tag.token}-${index}`, value: tag })),\n    [tags],\n  );\n\n  return (\n    <Properties<NormalizedTag>\n      items={items}\n      density=\"compact\"\n      className=\"border-0 bg-transparent\"\n      rowClassName=\"grid-cols-[minmax(4rem,8rem)_minmax(0,1fr)]\"\n      renderLabel={(_key, tag) =>\n        tag.key ? (\n          <span className=\"font-mono\">{tag.key}</span>\n        ) : (\n          <span className=\"italic text-muted-foreground\">tag</span>\n        )\n      }\n      renderValue={(_key, tag) => (\n        <span className=\"block truncate font-mono\" title={tag.value}>\n          {tag.value}\n        </span>\n      )}\n      suffixActions={[\n        {\n          id: \"include\",\n          icon: UiZoomIn,\n          label: (_key, tag) => `Include ${tag.display}`,\n          onClick: (_key, tag) => tagActions.toggleInclude(tag.token),\n        },\n        {\n          id: \"exclude\",\n          icon: UiZoomOut,\n          label: (_key, tag) => `Exclude ${tag.display}`,\n          onClick: (_key, tag) => tagActions.toggleExclude(tag.token),\n        },\n        {\n          id: \"copy\",\n          icon: UiCopy,\n          label: (_key, tag) => `Copy ${tag.display}`,\n          onClick: (_key, tag) => copyToClipboard(tag.value),\n        },\n      ]}\n    />\n  );\n}\n\n/**\n * Builds a TagActionsContextValue from a flat record-of-modes (the same\n * shape used by FilterBar's multi/nested-multi filters). Useful when\n * connecting DataTable's multiFilters state to the in-cell + / − buttons.\n */\nexport function tagActionsFromRecord(\n  value: Record<string, TagFilterMode>,\n  onChange: (next: Record<string, TagFilterMode>) => void,\n): TagActionsContextValue {\n  return {\n    getMode: (token) => value[token] ?? \"neutral\",\n    toggleInclude: (token) => {\n      const next = { ...value };\n      if (next[token] === \"include\") delete next[token];\n      else next[token] = \"include\";\n      onChange(next);\n    },\n    toggleExclude: (token) => {\n      const next = { ...value };\n      if (next[token] === \"exclude\") delete next[token];\n      else next[token] = \"exclude\";\n      onChange(next);\n    },\n  };\n}\n\n// Memoizing the context value avoids re-rendering every TagList cell on\n// unrelated state changes.\nexport function useTagActionsValue(\n  value: Record<string, TagFilterMode>,\n  onChange: (next: Record<string, TagFilterMode>) => void,\n): TagActionsContextValue {\n  return useMemo(() => tagActionsFromRecord(value, onChange), [value, onChange]);\n}\n"],"names":["key","value","createContext","jsx","useContext","useCallback","cn","Badge","jsxs","UiZoomIn","UiZoomOut","UiCopy","HoverCard","Icon","useDensityValue","useMemo","Properties"],"mappings":"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"}