@vuer-ai/vuer-uikit 0.0.75 → 0.0.77

package/dist/chunk-ILGNKXK2.mjs

@@ -1,485 +0,0 @@
-import { TooltipProvider, Tooltip, TooltipTrigger, TooltipContent } from './chunk-PCSY5IJ2.mjs';
-import { SyncScroll } from './chunk-BEJIZ56L.mjs';
-import { InputRoot, InputSlot } from './chunk-JXALL32A.mjs';
-import { cn } from './chunk-HMN4IKTG.mjs';
-import { Search, CaseSensitive, Regex, ChevronDown } from 'lucide-react';
-import { useState, useMemo, useEffect } from 'react';
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-
-function TreeView({
-  data,
-  getIcon,
-  onVisibleDataChange,
-  onItemHover,
-  className,
-  hoveredId,
-  isSelectable = false,
-  selectedItemId,
-  onSelectChange,
-  isSearchable = true,
-  alwaysShowExpand = false,
-  useSyncScroll = false
-}) {
-  const [expandedItems, setExpandedItems] = useState(() => {
-    const initial = /* @__PURE__ */ new Set();
-    data.forEach((item) => {
-      if (item.isCollapsible) initial.add(item.id);
-    });
-    return initial;
-  });
-  const [searchQuery, setSearchQuery] = useState("");
-  const [isCaseSensitive, setIsCaseSensitive] = useState(false);
-  const [isRegex, setIsRegex] = useState(false);
-  const [isRegexValid, setIsRegexValid] = useState(true);
-  const toggleItem = (id) => {
-    setExpandedItems((prev) => {
-      const newSet = new Set(prev);
-      if (newSet.has(id)) {
-        newSet.delete(id);
-      } else {
-        newSet.add(id);
-      }
-      return newSet;
-    });
-  };
-  const handleItemSelect = (id) => {
-    if (isSelectable && onSelectChange) {
-      onSelectChange(selectedItemId === id ? null : id);
-    }
-  };
-  const hasDescendants = (itemId) => {
-    return (childrenMap.get(itemId) || []).length > 0;
-  };
-  const childrenMap = useMemo(() => {
-    const map = /* @__PURE__ */ new Map();
-    data.forEach((item) => {
-      if (!map.has(item.parentId)) {
-        map.set(item.parentId, []);
-      }
-      map.get(item.parentId).push(item);
-    });
-    return map;
-  }, [data]);
-  const dataWithMeta = useMemo(() => {
-    const dataMap = new Map(data.map((item) => [item.id, item]));
-    const getAncestors = (item) => {
-      const ancestors = [];
-      let current = item.parentId;
-      while (current) {
-        const parent = dataMap.get(current);
-        if (parent) {
-          ancestors.unshift(parent);
-          current = parent.parentId;
-        } else {
-          break;
-        }
-      }
-      return ancestors;
-    };
-    const sortedData = [];
-    const visited = /* @__PURE__ */ new Set();
-    const traverseNode = (nodeId, depth = 0) => {
-      const children = childrenMap.get(nodeId) || [];
-      children.forEach((child) => {
-        if (!visited.has(child.id)) {
-          visited.add(child.id);
-          sortedData.push(child);
-          traverseNode(child.id, depth + 1);
-        }
-      });
-    };
-    traverseNode(null);
-    return sortedData.map((item) => {
-      const siblings = childrenMap.get(item.parentId) || [];
-      const isLast = siblings.length > 0 && siblings[siblings.length - 1].id === item.id;
-      const ancestors = getAncestors(item);
-      const indent = ancestors.length;
-      return { ...item, indent, isLast, ancestors };
-    });
-  }, [data, childrenMap]);
-  const visibleData = useMemo(() => {
-    const dataMap = new Map(data.map((item) => [item.id, item]));
-    if (!searchQuery) {
-      const isVisible = (item) => {
-        return item.ancestors.every((ancestor) => expandedItems.has(ancestor.id));
-      };
-      return dataWithMeta.filter(isVisible);
-    }
-    const matchingAndAncestorIds = /* @__PURE__ */ new Set();
-    let regex = null;
-    if (isRegex) {
-      try {
-        regex = new RegExp(searchQuery, isCaseSensitive ? "" : "i");
-        if (!isRegexValid) setIsRegexValid(true);
-      } catch {
-        if (isRegexValid) setIsRegexValid(false);
-        return [];
-      }
-    }
-    data.forEach((item) => {
-      let labelMatches = false;
-      if (regex) {
-        labelMatches = regex.test(item.label);
-      } else {
-        const source = isCaseSensitive ? item.label : item.label.toLowerCase();
-        const query = isCaseSensitive ? searchQuery : searchQuery.toLowerCase();
-        labelMatches = source.includes(query);
-      }
-      if (labelMatches) {
-        matchingAndAncestorIds.add(item.id);
-        let current = item.parentId;
-        while (current) {
-          const parent = dataMap.get(current);
-          if (parent) {
-            matchingAndAncestorIds.add(parent.id);
-            current = parent.parentId;
-          } else {
-            break;
-          }
-        }
-      }
-    });
-    return dataWithMeta.filter((item) => matchingAndAncestorIds.has(item.id));
-  }, [searchQuery, dataWithMeta, expandedItems, isCaseSensitive, isRegex, isRegexValid, data]);
-  const searchResultsCount = useMemo(() => {
-    if (!searchQuery || !isRegexValid) return 0;
-    let count = 0;
-    let regex = null;
-    if (isRegex) {
-      try {
-        regex = new RegExp(searchQuery, isCaseSensitive ? "" : "i");
-      } catch {
-        return 0;
-      }
-    }
-    data.forEach((item) => {
-      let labelMatches = false;
-      if (regex) {
-        labelMatches = regex.test(item.label);
-      } else {
-        const source = isCaseSensitive ? item.label : item.label.toLowerCase();
-        const query = isCaseSensitive ? searchQuery : searchQuery.toLowerCase();
-        labelMatches = source.includes(query);
-      }
-      if (labelMatches) {
-        count++;
-      }
-    });
-    return count;
-  }, [searchQuery, data, isCaseSensitive, isRegex, isRegexValid]);
-  useEffect(() => {
-    onVisibleDataChange?.(visibleData);
-  }, [visibleData, onVisibleDataChange]);
-  const renderLabel = (label) => {
-    if (!searchQuery || !isRegexValid) {
-      return label;
-    }
-    let regex;
-    try {
-      regex = new RegExp(`(${searchQuery})`, isCaseSensitive ? "g" : "gi");
-    } catch {
-      return label;
-    }
-    const parts = label.split(regex);
-    return /* @__PURE__ */ jsx(Fragment, { children: parts.map(
-      (part, i) => i % 2 === 1 ? /* @__PURE__ */ jsx("span", { className: "rounded-uk-xs bg-accent-warning", children: part }, i) : part
-    ) });
-  };
-  return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col", className), children: [
-    isSearchable && /* @__PURE__ */ jsxs("div", { className: "shrink-0", children: [
-      /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1 py-1", children: /* @__PURE__ */ jsxs(
-        InputRoot,
-        {
-          type: "text",
-          placeholder: "Search...",
-          size: "md",
-          className: "flex-1",
-          inputClassName: cn(
-            !isRegexValid && "text-red-500"
-          ),
-          value: searchQuery,
-          onChange: (e) => setSearchQuery(e.target.value),
-          children: [
-            /* @__PURE__ */ jsx(InputSlot, { side: "left", children: /* @__PURE__ */ jsx(Search, { className: "text-text-secondary size-4 stroke-1" }) }),
-            /* @__PURE__ */ jsx(InputSlot, { side: "right", children: /* @__PURE__ */ jsxs(TooltipProvider, { delayDuration: 200, children: [
-              /* @__PURE__ */ jsxs(Tooltip, { children: [
-                /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
-                  "button",
-                  {
-                    onClick: () => setIsCaseSensitive((prev) => !prev),
-                    className: cn("rounded-uk-sm p-1 mr-1", isCaseSensitive && "bg-shadow-secondary"),
-                    children: /* @__PURE__ */ jsx(CaseSensitive, { className: "size-4" })
-                  }
-                ) }),
-                /* @__PURE__ */ jsx(TooltipContent, { children: /* @__PURE__ */ jsx("p", { children: "Case Sensitive" }) })
-              ] }),
-              /* @__PURE__ */ jsxs(Tooltip, { children: [
-                /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
-                  "button",
-                  {
-                    onClick: () => setIsRegex((prev) => !prev),
-                    className: cn("rounded-uk-sm p-1", isRegex && "bg-shadow-secondary"),
-                    children: /* @__PURE__ */ jsx(Regex, { className: "size-4" })
-                  }
-                ) }),
-                /* @__PURE__ */ jsx(TooltipContent, { children: /* @__PURE__ */ jsx("p", { children: "Use Regular Expression" }) })
-              ] })
-            ] }) })
-          ]
-        }
-      ) }),
-      searchQuery && isRegexValid && /* @__PURE__ */ jsx("div", { className: "flex justify-end px-2 pb-1", children: /* @__PURE__ */ jsxs("span", { className: "text-uk-xs text-text-secondary", children: [
-        searchResultsCount,
-        " result",
-        searchResultsCount !== 1 ? "s" : ""
-      ] }) })
-    ] }),
-    useSyncScroll ? /* @__PURE__ */ jsx(SyncScroll, { className: "scrollbar-track-transparent flex-1", children: visibleData.map((item) => /* @__PURE__ */ jsxs(
-      "div",
-      {
-        className: cn(
-          "group relative flex h-[32px] items-center",
-          isSelectable && "rounded-uk-md",
-          !item.disable && "cursor-pointer",
-          hoveredId === item.id && !item.disable && "bg-bg-secondary",
-          isSelectable && selectedItemId === item.id && "bg-brand-primary text-text-withbg"
-        ),
-        onMouseEnter: () => onItemHover?.(item.id),
-        onMouseLeave: () => onItemHover?.(null),
-        onClick: () => !item.disable && handleItemSelect(item.id),
-        children: [
-          /* @__PURE__ */ jsxs("div", { className: "absolute top-0 left-[-0.28rem] z-0 flex h-full items-center", children: [
-            item.ancestors.map((ancestor, index) => {
-              const parentIsLast = dataWithMeta.find((d) => d.id === ancestor.id)?.isLast;
-              return /* @__PURE__ */ jsx(
-                "div",
-                {
-                  className: cn(
-                    "h-full w-[1.25rem]",
-                    parentIsLast ? "" : "border-l",
-                    "border-line-primary"
-                  )
-                },
-                index
-              );
-            }),
-            item.indent > 0 && /* @__PURE__ */ jsxs("div", { className: "relative h-full w-[1.24rem]", children: [
-              /* @__PURE__ */ jsx(
-                "div",
-                {
-                  className: cn(
-                    "absolute top-0 left-0 h-1/2 w-1/2 border-b border-l",
-                    item.isLast ? "rounded-bl-md" : "",
-                    "border-line-primary"
-                  )
-                }
-              ),
-              !item.isLast && /* @__PURE__ */ jsx("div", { className: "border-line-primary absolute top-1/2 left-0 h-1/2 w-1/2 border-l" })
-            ] })
-          ] }),
-          /* @__PURE__ */ jsxs(
-            "div",
-            {
-              className: "text-uk-md z-10 flex w-full items-center justify-between gap-2 px-2 whitespace-nowrap",
-              style: { paddingLeft: `${item.indent * 1.25 + 0.5}rem` },
-              children: [
-                /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
-                  alwaysShowExpand && hasDescendants(item.id) && !expandedItems.has(item.id) ? /* @__PURE__ */ jsxs(Fragment, { children: [
-                    /* @__PURE__ */ jsx(
-                      "button",
-                      {
-                        onClick: (e) => {
-                          e.stopPropagation();
-                          toggleItem(item.id);
-                        },
-                        className: "flex size-4 cursor-pointer items-center justify-center",
-                        children: /* @__PURE__ */ jsx(
-                          ChevronDown,
-                          {
-                            className: cn(
-                              "size-4 -rotate-90 transition-transform",
-                              item.disable && "text-icon-tertiary"
-                            )
-                          }
-                        )
-                      }
-                    ),
-                    /* @__PURE__ */ jsx(
-                      "div",
-                      {
-                        className: cn(
-                          "flex size-4 items-center justify-center",
-                          item.disable && "text-icon-tertiary"
-                        ),
-                        children: getIcon(item)
-                      }
-                    )
-                  ] }) : /* @__PURE__ */ jsxs("div", { className: "relative flex size-4 items-center justify-center", children: [
-                    item.isCollapsible && /* @__PURE__ */ jsx(
-                      "button",
-                      {
-                        onClick: (e) => {
-                          e.stopPropagation();
-                          toggleItem(item.id);
-                        },
-                        className: "absolute z-20 flex cursor-pointer items-center justify-center opacity-0 transition-opacity group-hover:opacity-100",
-                        children: /* @__PURE__ */ jsx(
-                          ChevronDown,
-                          {
-                            className: cn(
-                              "size-4 transition-transform",
-                              !expandedItems.has(item.id) && "-rotate-90",
-                              item.disable && "text-icon-tertiary"
-                            )
-                          }
-                        )
-                      }
-                    ),
-                    /* @__PURE__ */ jsx(
-                      "div",
-                      {
-                        className: cn(
-                          "cursor-pointer transition-opacity",
-                          item.isCollapsible && "group-hover:opacity-0",
-                          item.disable && "text-icon-tertiary"
-                        ),
-                        children: getIcon(item)
-                      }
-                    )
-                  ] }),
-                  /* @__PURE__ */ jsx("span", { className: cn("truncate", item.disable && "text-text-tertiary"), children: renderLabel(item.label) })
-                ] }),
-                item.actions && /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1", onClick: (e) => e.stopPropagation(), children: item.actions })
-              ]
-            }
-          )
-        ]
-      },
-      item.id
-    )) }) : /* @__PURE__ */ jsx("div", { className: "flex-1 overflow-y-auto", children: visibleData.map((item) => /* @__PURE__ */ jsxs(
-      "div",
-      {
-        className: cn(
-          "group relative flex h-[32px] items-center",
-          isSelectable && "rounded-uk-md",
-          !item.disable && "cursor-pointer",
-          hoveredId === item.id && !item.disable && "bg-bg-secondary",
-          isSelectable && selectedItemId === item.id && "bg-brand-primary text-text-withbg"
-        ),
-        onMouseEnter: () => onItemHover?.(item.id),
-        onMouseLeave: () => onItemHover?.(null),
-        onClick: () => !item.disable && handleItemSelect(item.id),
-        children: [
-          /* @__PURE__ */ jsxs("div", { className: "absolute top-0 left-[-0.28rem] z-0 flex h-full items-center", children: [
-            item.ancestors.map((ancestor, index) => {
-              const parentIsLast = dataWithMeta.find((d) => d.id === ancestor.id)?.isLast;
-              return /* @__PURE__ */ jsx(
-                "div",
-                {
-                  className: cn(
-                    "h-full w-[1.25rem]",
-                    parentIsLast ? "" : "border-l",
-                    "border-line-primary"
-                  )
-                },
-                index
-              );
-            }),
-            item.indent > 0 && /* @__PURE__ */ jsxs("div", { className: "relative h-full w-[1.24rem]", children: [
-              /* @__PURE__ */ jsx(
-                "div",
-                {
-                  className: cn(
-                    "absolute top-0 left-0 h-1/2 w-1/2 border-b border-l",
-                    item.isLast ? "rounded-bl-md" : "",
-                    "border-line-primary"
-                  )
-                }
-              ),
-              !item.isLast && /* @__PURE__ */ jsx("div", { className: "border-line-primary absolute top-1/2 left-0 h-1/2 w-1/2 border-l" })
-            ] })
-          ] }),
-          /* @__PURE__ */ jsxs(
-            "div",
-            {
-              className: "text-uk-md z-10 flex w-full items-center justify-between gap-2 px-2 whitespace-nowrap",
-              style: { paddingLeft: `${item.indent * 1.25 + 0.5}rem` },
-              children: [
-                /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
-                  alwaysShowExpand && hasDescendants(item.id) && !expandedItems.has(item.id) ? /* @__PURE__ */ jsxs(Fragment, { children: [
-                    /* @__PURE__ */ jsx(
-                      "button",
-                      {
-                        onClick: (e) => {
-                          e.stopPropagation();
-                          toggleItem(item.id);
-                        },
-                        className: "flex size-4 cursor-pointer items-center justify-center",
-                        children: /* @__PURE__ */ jsx(
-                          ChevronDown,
-                          {
-                            className: cn(
-                              "size-4 -rotate-90 transition-transform",
-                              item.disable && "text-icon-tertiary"
-                            )
-                          }
-                        )
-                      }
-                    ),
-                    /* @__PURE__ */ jsx(
-                      "div",
-                      {
-                        className: cn(
-                          "flex size-4 items-center justify-center",
-                          item.disable && "text-icon-tertiary"
-                        ),
-                        children: getIcon(item)
-                      }
-                    )
-                  ] }) : /* @__PURE__ */ jsxs("div", { className: "relative flex size-4 items-center justify-center", children: [
-                    item.isCollapsible && /* @__PURE__ */ jsx(
-                      "button",
-                      {
-                        onClick: (e) => {
-                          e.stopPropagation();
-                          toggleItem(item.id);
-                        },
-                        className: "absolute z-20 flex cursor-pointer items-center justify-center opacity-0 transition-opacity group-hover:opacity-100",
-                        children: /* @__PURE__ */ jsx(
-                          ChevronDown,
-                          {
-                            className: cn(
-                              "size-4 transition-transform",
-                              !expandedItems.has(item.id) && "-rotate-90",
-                              item.disable && "text-icon-tertiary"
-                            )
-                          }
-                        )
-                      }
-                    ),
-                    /* @__PURE__ */ jsx(
-                      "div",
-                      {
-                        className: cn(
-                          "cursor-pointer transition-opacity",
-                          item.isCollapsible && "group-hover:opacity-0",
-                          item.disable && "text-icon-tertiary"
-                        ),
-                        children: getIcon(item)
-                      }
-                    )
-                  ] }),
-                  /* @__PURE__ */ jsx("span", { className: cn("truncate", item.disable && "text-text-tertiary"), children: renderLabel(item.label) })
-                ] }),
-                item.actions && /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1", onClick: (e) => e.stopPropagation(), children: item.actions })
-              ]
-            }
-          )
-        ]
-      },
-      item.id
-    )) })
-  ] });
-}
-
-export { TreeView };

package/dist/ui/tree-view-v2.cjs

@@ -1,25 +0,0 @@
-'use strict';
-
-var chunkFD5AAGON_cjs = require('../chunk-FD5AAGON.cjs');
-require('../chunk-LCCNBVKZ.cjs');
-require('../chunk-JMCH2AFN.cjs');
-require('../chunk-VBBJSIY7.cjs');
-require('../chunk-G4FJGNY5.cjs');
-require('../chunk-YQCSEMRB.cjs');
-require('../chunk-QN4N4I3Z.cjs');
-require('../chunk-Q7E73DVJ.cjs');
-require('../chunk-JR4TVE43.cjs');
-require('../chunk-VXZURKMQ.cjs');
-require('../chunk-Q4XH2Z5M.cjs');
-require('../chunk-6BOWMGFG.cjs');
-require('../chunk-YZIR6LIY.cjs');
-require('../chunk-RPTRTGC2.cjs');
-require('../chunk-LBWMTA5T.cjs');
-require('../chunk-OHIB3TEN.cjs');
-
-
-
-Object.defineProperty(exports, "TreeViewV2", {
-  enumerable: true,
-  get: function () { return chunkFD5AAGON_cjs.TreeView; }
-});

package/dist/ui/tree-view-v2.d.cts

@@ -1,43 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ReactNode } from 'react';
-
-/**
- * Minimal tree node shape used by `TreeViewV2`.
- */
-type TreeDataItem = {
-    id: string;
-    parentId: string | null;
-    label: string;
-    isCollapsible?: boolean;
-    actions?: ReactNode;
-    disable?: boolean;
-    [key: string]: unknown;
-};
-/**
- * Props for the virtualized filterable tree view.
- */
-type TreeViewProps<T extends TreeDataItem> = {
-    data: T[];
-    getIcon: (item: T) => ReactNode;
-    onVisibleDataChange?: (data: (T & {
-        indent: number;
-        isLast: boolean;
-        ancestors: T[];
-    })[]) => void;
-    onItemHover?: (id: string | null) => void;
-    className?: string;
-    hoveredId?: string | null;
-    isSelectable?: boolean;
-    selectedItemId?: string | null;
-    onSelectChange?: (id: string | null) => void;
-    isSearchable?: boolean;
-    alwaysShowExpand?: boolean;
-    useSyncScroll?: boolean;
-};
-/**
- * Filterable and highlightable tree view with keyboardless interactions.
- * Supports search (plain or regex), hover highlights, and collapsible nodes.
- */
-declare function TreeView<T extends TreeDataItem>({ data, getIcon, onVisibleDataChange, onItemHover, className, hoveredId, isSelectable, selectedItemId, onSelectChange, isSearchable, alwaysShowExpand, useSyncScroll, }: TreeViewProps<T>): react_jsx_runtime.JSX.Element;
-
-export { type TreeDataItem as TreeDataItemV2, TreeView as TreeViewV2 };

package/dist/ui/tree-view-v2.d.ts

@@ -1,43 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ReactNode } from 'react';
-
-/**
- * Minimal tree node shape used by `TreeViewV2`.
- */
-type TreeDataItem = {
-    id: string;
-    parentId: string | null;
-    label: string;
-    isCollapsible?: boolean;
-    actions?: ReactNode;
-    disable?: boolean;
-    [key: string]: unknown;
-};
-/**
- * Props for the virtualized filterable tree view.
- */
-type TreeViewProps<T extends TreeDataItem> = {
-    data: T[];
-    getIcon: (item: T) => ReactNode;
-    onVisibleDataChange?: (data: (T & {
-        indent: number;
-        isLast: boolean;
-        ancestors: T[];
-    })[]) => void;
-    onItemHover?: (id: string | null) => void;
-    className?: string;
-    hoveredId?: string | null;
-    isSelectable?: boolean;
-    selectedItemId?: string | null;
-    onSelectChange?: (id: string | null) => void;
-    isSearchable?: boolean;
-    alwaysShowExpand?: boolean;
-    useSyncScroll?: boolean;
-};
-/**
- * Filterable and highlightable tree view with keyboardless interactions.
- * Supports search (plain or regex), hover highlights, and collapsible nodes.
- */
-declare function TreeView<T extends TreeDataItem>({ data, getIcon, onVisibleDataChange, onItemHover, className, hoveredId, isSelectable, selectedItemId, onSelectChange, isSearchable, alwaysShowExpand, useSyncScroll, }: TreeViewProps<T>): react_jsx_runtime.JSX.Element;
-
-export { type TreeDataItem as TreeDataItemV2, TreeView as TreeViewV2 };