@duskmoon-dev/components 0.1.2

package/dist/components/dm-tree/index.js

@@ -0,0 +1,1852 @@
+"use client";
+
+// src/components/input/Input.tsx
+import {
+  forwardRef,
+  useImperativeHandle,
+  useRef,
+  useState
+} from "react";
+
+// ../../node_modules/.bun/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs
+function r(e) {
+  var t, f, n = "";
+  if (typeof e == "string" || typeof e == "number")
+    n += e;
+  else if (typeof e == "object")
+    if (Array.isArray(e)) {
+      var o = e.length;
+      for (t = 0;t < o; t++)
+        e[t] && (f = r(e[t])) && (n && (n += " "), n += f);
+    } else
+      for (f in e)
+        e[f] && (n && (n += " "), n += f);
+  return n;
+}
+function clsx() {
+  for (var e, t, f = 0, n = "", o = arguments.length;f < o; f++)
+    (e = arguments[f]) && (t = r(e)) && (n && (n += " "), n += t);
+  return n;
+}
+
+// src/utils/cn.ts
+function cn(...inputs) {
+  return clsx(inputs);
+}
+// src/classes/input.ts
+var inputBaseClass = "input";
+var inputWrapperClass = "input-wrapper";
+var inputAffixWrapperClass = "input-affix-wrapper";
+var inputPrefixClass = "input-prefix";
+var inputSuffixClass = "input-suffix";
+var inputClearClass = "input-clear";
+var inputSearchClass = "input-search";
+var inputSearchButtonClass = "input-search-button";
+var inputPasswordClass = "input-password";
+var inputPasswordToggleClass = "input-password-toggle";
+var inputGroupClass = "input-group";
+var textAreaBaseClass = "textarea";
+var textAreaWrapperClass = "textarea-wrapper";
+var textAreaCountClass = "textarea-counter";
+var textAreaCountExceededClass = "textarea-counter-exceeded";
+var textAreaAutoSizeClass = "textarea-auto-resize";
+var inputVariantClasses = {
+  filled: "input-filled",
+  outlined: "input-outlined"
+};
+var inputSizeClasses = {
+  sm: "input-sm",
+  md: "input-md",
+  lg: "input-lg"
+};
+var inputStatusClasses = {
+  error: "input-error",
+  success: "input-success"
+};
+var textAreaVariantClasses = {
+  filled: "textarea-filled",
+  outlined: "textarea-outlined"
+};
+var textAreaSizeClasses = {
+  sm: "textarea-sm",
+  md: "",
+  lg: "textarea-lg"
+};
+var textAreaStatusClasses = {
+  error: "textarea-error",
+  success: "textarea-success"
+};
+var textAreaResizeClasses = {
+  none: "textarea-resize-none",
+  both: "textarea-resize-both",
+  horizontal: "textarea-resize-horizontal",
+  vertical: "textarea-resize-vertical"
+};
+function getInputClasses({
+  size = "md",
+  status,
+  variant = "outlined",
+  className
+}) {
+  return cn(inputBaseClass, inputVariantClasses[variant], inputSizeClasses[size], status && inputStatusClasses[status], className);
+}
+function getInputWrapperClasses({
+  affixed,
+  className
+}) {
+  return cn(inputWrapperClass, affixed && inputAffixWrapperClass, className);
+}
+function getSearchWrapperClasses({ className }) {
+  return cn(inputSearchClass, className);
+}
+function getPasswordWrapperClasses({
+  className
+}) {
+  return cn(inputPasswordClass, className);
+}
+function getTextAreaClasses({
+  size = "md",
+  status,
+  variant = "outlined",
+  resize = "vertical",
+  autoSize,
+  className
+}) {
+  return cn(textAreaBaseClass, textAreaVariantClasses[variant], textAreaSizeClasses[size], status && textAreaStatusClasses[status], textAreaResizeClasses[resize], autoSize && textAreaAutoSizeClass, className);
+}
+function getTextAreaCountClasses({ exceeded }) {
+  return cn(textAreaCountClass, exceeded && textAreaCountExceededClass);
+}
+
+// src/components/input/Input.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function toTextValue(value) {
+  if (Array.isArray(value)) {
+    return value.join(",");
+  }
+  return value == null ? "" : String(value);
+}
+var InputRoot = forwardRef(({
+  allowClear,
+  className,
+  defaultValue,
+  disabled,
+  onChange,
+  prefix,
+  size = "md",
+  status,
+  suffix,
+  type = "text",
+  value,
+  variant = "outlined",
+  ...props
+}, ref) => {
+  const inputRef = useRef(null);
+  const [internalValue, setInternalValue] = useState(() => toTextValue(defaultValue));
+  const isControlled = value !== undefined;
+  const currentValue = isControlled ? toTextValue(value) : internalValue;
+  const hasAffix = prefix != null || suffix != null || allowClear;
+  useImperativeHandle(ref, () => inputRef.current);
+  function handleChange(event) {
+    if (!isControlled) {
+      setInternalValue(event.currentTarget.value);
+    }
+    onChange?.(event);
+  }
+  function handleClear() {
+    const input = inputRef.current;
+    if (!input || disabled) {
+      return;
+    }
+    input.value = "";
+    if (!isControlled) {
+      setInternalValue("");
+    }
+    onChange?.({
+      currentTarget: input,
+      target: input,
+      type: "change"
+    });
+    input.focus();
+  }
+  const control = /* @__PURE__ */ jsx("input", {
+    ...props,
+    ref: inputRef,
+    type,
+    className: getInputClasses({ size, status, variant, className }),
+    disabled,
+    value: currentValue,
+    onChange: handleChange
+  });
+  if (!hasAffix) {
+    return control;
+  }
+  const showClear = allowClear && !disabled && currentValue.length > 0;
+  return /* @__PURE__ */ jsxs("span", {
+    className: getInputWrapperClasses({ affixed: hasAffix }),
+    children: [
+      prefix != null ? /* @__PURE__ */ jsx("span", {
+        className: inputPrefixClass,
+        children: prefix
+      }) : null,
+      control,
+      showClear ? /* @__PURE__ */ jsx("button", {
+        type: "button",
+        className: inputClearClass,
+        "aria-label": "Clear input",
+        onClick: handleClear,
+        children: "x"
+      }) : null,
+      suffix != null ? /* @__PURE__ */ jsx("span", {
+        className: inputSuffixClass,
+        children: suffix
+      }) : null
+    ]
+  });
+});
+InputRoot.displayName = "Input";
+var Search = forwardRef(({
+  className,
+  disabled,
+  enterButton,
+  loading,
+  onKeyDown,
+  onSearch,
+  ...props
+}, ref) => {
+  const inputRef = useRef(null);
+  useImperativeHandle(ref, () => inputRef.current);
+  function emitSearch(event) {
+    onSearch?.(inputRef.current?.value ?? "", event);
+  }
+  function handleKeyDown(event) {
+    onKeyDown?.(event);
+    if (!event.defaultPrevented && event.key === "Enter") {
+      emitSearch(event);
+    }
+  }
+  const buttonContent = enterButton === true ? "Search" : enterButton ?? "Search";
+  return /* @__PURE__ */ jsxs("span", {
+    className: getSearchWrapperClasses({ className }),
+    children: [
+      /* @__PURE__ */ jsx(InputRoot, {
+        ...props,
+        ref: inputRef,
+        disabled,
+        onKeyDown: handleKeyDown
+      }),
+      enterButton || loading ? /* @__PURE__ */ jsx("button", {
+        type: "button",
+        className: inputSearchButtonClass,
+        disabled: disabled || loading,
+        "aria-busy": loading || undefined,
+        onClick: emitSearch,
+        children: loading ? "Loading" : buttonContent
+      }) : null
+    ]
+  });
+});
+Search.displayName = "Input.Search";
+var Password = forwardRef(({ className, disabled, visibilityToggle = true, ...props }, ref) => {
+  const [visible, setVisible] = useState(false);
+  const type = visible ? "text" : "password";
+  const toggle = visibilityToggle ? /* @__PURE__ */ jsx("button", {
+    type: "button",
+    className: inputPasswordToggleClass,
+    disabled,
+    "aria-label": visible ? "Hide password" : "Show password",
+    onClick: () => {
+      setVisible((current) => !current);
+    },
+    children: visible ? "Hide" : "Show"
+  }) : undefined;
+  return /* @__PURE__ */ jsx("span", {
+    className: getPasswordWrapperClasses({ className }),
+    children: /* @__PURE__ */ jsx(InputRoot, {
+      ...props,
+      ref,
+      disabled,
+      type,
+      suffix: toggle
+    })
+  });
+});
+Password.displayName = "Input.Password";
+var TextArea = forwardRef(({
+  autoSize,
+  className,
+  defaultValue,
+  maxLength,
+  onChange,
+  resize = "vertical",
+  showCount,
+  size = "md",
+  status,
+  value,
+  variant = "outlined",
+  ...props
+}, ref) => {
+  const [internalValue, setInternalValue] = useState(() => toTextValue(defaultValue));
+  const isControlled = value !== undefined;
+  const currentValue = isControlled ? toTextValue(value) : internalValue;
+  const count = currentValue.length;
+  const exceeded = maxLength !== undefined && count > maxLength;
+  function handleChange(event) {
+    if (!isControlled) {
+      setInternalValue(event.currentTarget.value);
+    }
+    onChange?.(event);
+  }
+  const control = /* @__PURE__ */ jsx("textarea", {
+    ...props,
+    ref,
+    className: getTextAreaClasses({
+      size,
+      status,
+      variant,
+      resize,
+      autoSize: Boolean(autoSize),
+      className
+    }),
+    maxLength,
+    value: currentValue,
+    onChange: handleChange
+  });
+  if (!showCount) {
+    return control;
+  }
+  return /* @__PURE__ */ jsxs("span", {
+    className: textAreaWrapperClass,
+    children: [
+      control,
+      /* @__PURE__ */ jsxs("span", {
+        className: getTextAreaCountClasses({ exceeded }),
+        children: [
+          count,
+          maxLength !== undefined ? ` / ${maxLength}` : null
+        ]
+      })
+    ]
+  });
+});
+TextArea.displayName = "Input.TextArea";
+var Group = forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("div", {
+  ...props,
+  ref,
+  className: cn(inputGroupClass, className),
+  children
+}));
+Group.displayName = "Input.Group";
+var Input = Object.assign(InputRoot, {
+  Search,
+  Password,
+  TextArea,
+  Group
+});
+// src/components/empty/Empty.tsx
+import { forwardRef as forwardRef2 } from "react";
+
+// src/classes/empty.ts
+var emptyBaseClass = "empty";
+var emptyImageClass = "empty-image";
+var emptyDescriptionClass = "empty-description";
+var emptyFooterClass = "empty-footer";
+function getEmptyClasses({ className }) {
+  return cn(emptyBaseClass, className);
+}
+
+// src/components/empty/Empty.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var defaultImage = /* @__PURE__ */ jsxs2("svg", {
+  "aria-hidden": "true",
+  focusable: "false",
+  viewBox: "0 0 64 48",
+  width: "64",
+  height: "48",
+  children: [
+    /* @__PURE__ */ jsx2("rect", {
+      x: "8",
+      y: "12",
+      width: "48",
+      height: "28",
+      rx: "4",
+      fill: "currentColor",
+      opacity: "0.16"
+    }),
+    /* @__PURE__ */ jsx2("path", {
+      d: "M16 20h32M16 28h20",
+      stroke: "currentColor",
+      strokeWidth: "3",
+      strokeLinecap: "round",
+      opacity: "0.38"
+    })
+  ]
+});
+var simpleImage = /* @__PURE__ */ jsx2("svg", {
+  "aria-hidden": "true",
+  focusable: "false",
+  viewBox: "0 0 48 36",
+  width: "48",
+  height: "36",
+  children: /* @__PURE__ */ jsx2("rect", {
+    x: "6",
+    y: "10",
+    width: "36",
+    height: "20",
+    rx: "3",
+    fill: "currentColor",
+    opacity: "0.16"
+  })
+});
+var EmptyBase = forwardRef2(({
+  image = defaultImage,
+  imageStyle,
+  description = "No data",
+  children,
+  className,
+  ...props
+}, ref) => /* @__PURE__ */ jsxs2("div", {
+  ref,
+  className: getEmptyClasses({ className }),
+  ...props,
+  children: [
+    image !== null && image !== false ? /* @__PURE__ */ jsx2("div", {
+      className: emptyImageClass,
+      style: imageStyle,
+      children: image
+    }) : null,
+    description !== false ? /* @__PURE__ */ jsx2("div", {
+      className: emptyDescriptionClass,
+      children: description
+    }) : null,
+    children ? /* @__PURE__ */ jsx2("div", {
+      className: emptyFooterClass,
+      children
+    }) : null
+  ]
+}));
+EmptyBase.displayName = "Empty";
+var Empty = EmptyBase;
+Empty.PRESENTED_IMAGE_DEFAULT = defaultImage;
+Empty.PRESENTED_IMAGE_SIMPLE = simpleImage;
+// src/components/spin/Spin.tsx
+import { forwardRef as forwardRef3, useEffect, useState as useState2 } from "react";
+
+// src/classes/spin.ts
+var spinBaseClass = "spin";
+var spinSpinningClass = "spin-spinning";
+var spinNestedLoadingClass = "spin-nested-loading";
+var spinContainerClass = "spin-container";
+var spinBlurClass = "spin-blur";
+var spinDotClass = "spin-dot";
+var spinTipClass = "spin-tip";
+var spinFullscreenClass = "spin-fullscreen";
+var spinSizeClasses = {
+  small: "spin-sm progress-circular-sm",
+  default: "spin-md progress-circular-md",
+  large: "spin-lg progress-circular-lg"
+};
+function getSpinClasses({
+  spinning,
+  size = "default",
+  fullscreen,
+  className
+}) {
+  return cn(spinBaseClass, "progress-circular progress-circular-indeterminate", spinSizeClasses[size], spinning && spinSpinningClass, fullscreen && spinFullscreenClass, className);
+}
+
+// src/components/spin/Spin.tsx
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+var defaultIndicator;
+function setDefaultIndicator(indicator) {
+  defaultIndicator = indicator;
+}
+function useDelayedSpinning(spinning, delay) {
+  const [delayedActive, setDelayedActive] = useState2(false);
+  const hasDelay = Boolean(delay && delay > 0);
+  useEffect(() => {
+    if (!hasDelay) {
+      return;
+    }
+    if (!spinning) {
+      const resetTimer2 = window.setTimeout(() => setDelayedActive(false), 0);
+      return () => window.clearTimeout(resetTimer2);
+    }
+    const resetTimer = window.setTimeout(() => setDelayedActive(false), 0);
+    const showTimer = window.setTimeout(() => setDelayedActive(true), delay);
+    return () => {
+      window.clearTimeout(resetTimer);
+      window.clearTimeout(showTimer);
+    };
+  }, [delay, hasDelay, spinning]);
+  if (!hasDelay) {
+    return spinning;
+  }
+  return spinning && delayedActive;
+}
+var SpinBase = forwardRef3(({
+  spinning = true,
+  size = "default",
+  tip,
+  indicator,
+  delay,
+  fullscreen,
+  wrapperClassName,
+  className,
+  children,
+  ...props
+}, ref) => {
+  const active = useDelayedSpinning(spinning, delay);
+  const finalIndicator = indicator ?? defaultIndicator;
+  const spin = /* @__PURE__ */ jsxs3("div", {
+    ref,
+    role: "status",
+    "aria-live": "polite",
+    "aria-busy": active,
+    className: getSpinClasses({
+      spinning: active,
+      size,
+      fullscreen,
+      className
+    }),
+    ...props,
+    children: [
+      finalIndicator ?? /* @__PURE__ */ jsx3("span", {
+        className: spinDotClass
+      }),
+      tip ? /* @__PURE__ */ jsx3("div", {
+        className: spinTipClass,
+        children: tip
+      }) : null
+    ]
+  });
+  if (!children) {
+    return spin;
+  }
+  return /* @__PURE__ */ jsxs3("div", {
+    className: cn(spinNestedLoadingClass, wrapperClassName),
+    children: [
+      active ? spin : null,
+      /* @__PURE__ */ jsx3("div", {
+        className: cn(spinContainerClass, active && spinBlurClass),
+        children
+      })
+    ]
+  });
+});
+SpinBase.displayName = "Spin";
+var Spin = SpinBase;
+Spin.setDefaultIndicator = setDefaultIndicator;
+// src/components/dm-status/DmStatus.tsx
+import { forwardRef as forwardRef4 } from "react";
+
+// src/classes/dm-status.ts
+var dmStatusBaseClass = "dm-status";
+var dmStatusLoadingClass = "dm-status-loading";
+var dmStatusContentClass = "dm-status-content";
+var dmStatusImageClass = "dm-status-image";
+var dmStatusTypeClasses = {
+  empty: "dm-status-empty",
+  loading: "dm-status-loading-state",
+  error: "dm-status-error",
+  success: "dm-status-success"
+};
+function getDmStatusClasses({
+  status,
+  className
+}) {
+  return cn(dmStatusBaseClass, dmStatusTypeClasses[status], className);
+}
+
+// src/components/dm-status/DmStatus.tsx
+import { jsx as jsx4, jsxs as jsxs4, Fragment } from "react/jsx-runtime";
+var defaultDescriptions = {
+  empty: "No data",
+  error: "Loading failed"
+};
+var emptyImage = /* @__PURE__ */ jsxs4("svg", {
+  "aria-hidden": "true",
+  focusable: "false",
+  viewBox: "0 0 96 72",
+  width: "96",
+  height: "72",
+  children: [
+    /* @__PURE__ */ jsx4("rect", {
+      x: "14",
+      y: "18",
+      width: "68",
+      height: "40",
+      rx: "6",
+      fill: "currentColor",
+      opacity: "0.12"
+    }),
+    /* @__PURE__ */ jsx4("path", {
+      d: "M28 31h40M28 42h24",
+      stroke: "currentColor",
+      strokeWidth: "4",
+      strokeLinecap: "round",
+      opacity: "0.32"
+    })
+  ]
+});
+var errorImage = /* @__PURE__ */ jsxs4("svg", {
+  "aria-hidden": "true",
+  focusable: "false",
+  viewBox: "0 0 96 72",
+  width: "96",
+  height: "72",
+  children: [
+    /* @__PURE__ */ jsx4("circle", {
+      cx: "48",
+      cy: "36",
+      r: "25",
+      fill: "currentColor",
+      opacity: "0.12"
+    }),
+    /* @__PURE__ */ jsx4("path", {
+      d: "M39 27l18 18M57 27L39 45",
+      stroke: "currentColor",
+      strokeWidth: "5",
+      strokeLinecap: "round",
+      opacity: "0.48"
+    })
+  ]
+});
+function normalizeHeight(height) {
+  if (typeof height === "number") {
+    return `${height}px`;
+  }
+  return height ?? "100%";
+}
+function normalizeImage(image, imageStyle) {
+  if (typeof image !== "string") {
+    return image;
+  }
+  return /* @__PURE__ */ jsx4("img", {
+    src: image,
+    alt: "",
+    className: dmStatusImageClass,
+    style: imageStyle
+  });
+}
+var DmStatus = forwardRef4(({
+  status = "empty",
+  height,
+  style,
+  loadingProps,
+  description,
+  image,
+  imageStyle,
+  className,
+  children,
+  ...props
+}, ref) => {
+  if (status === "success") {
+    return /* @__PURE__ */ jsx4(Fragment, {
+      children
+    });
+  }
+  const mergedStyle = {
+    height: normalizeHeight(height),
+    ...style
+  };
+  if (status === "loading") {
+    return /* @__PURE__ */ jsx4("div", {
+      ref,
+      className: getDmStatusClasses({ status, className }),
+      style: mergedStyle,
+      ...props,
+      children: /* @__PURE__ */ jsx4(Spin, {
+        ...loadingProps,
+        wrapperClassName: dmStatusLoadingClass,
+        children
+      })
+    });
+  }
+  const finalImage = normalizeImage(image ?? (status === "error" ? errorImage : emptyImage), imageStyle);
+  const finalDescription = description ?? defaultDescriptions[status === "error" ? "error" : "empty"];
+  return /* @__PURE__ */ jsx4("div", {
+    ref,
+    className: getDmStatusClasses({ status, className }),
+    style: mergedStyle,
+    ...props,
+    children: /* @__PURE__ */ jsx4("div", {
+      className: dmStatusContentClass,
+      children: /* @__PURE__ */ jsx4(Empty, {
+        image: finalImage,
+        imageStyle: typeof image === "string" ? undefined : imageStyle,
+        description: finalDescription,
+        children
+      })
+    })
+  });
+});
+DmStatus.displayName = "DmStatus";
+// src/components/tabs/Tabs.tsx
+import {
+  Children,
+  Fragment as Fragment2,
+  forwardRef as forwardRef5,
+  isValidElement,
+  useId,
+  useRef as useRef2,
+  useState as useState3
+} from "react";
+
+// src/classes/tabs.ts
+var tabsRootClass = "tabs-root";
+var tabsRootVerticalClass = "tabs-root-vertical";
+var tabsRootBottomClass = "tabs-root-bottom";
+var tabsRootRightClass = "tabs-root-right";
+var tabsBarClass = "tabs-bar";
+var tabsBaseClass = "tabs";
+var tabsVerticalClass = "tabs-vertical";
+var tabsScrollableClass = "tabs-scrollable";
+var tabsCenteredClass = "tabs-center";
+var tabsBoxedClass = "tabs-boxed";
+var tabBaseClass = "tab";
+var tabActiveClass = "tab-active";
+var tabDisabledClass = "tab-disabled";
+var tabIconClass = "tab-icon";
+var tabIconOnlyClass = "tab-icon-only";
+var tabPanelClass = "tab-panel";
+var tabPanelShowClass = "tab-panel-show";
+var tabsAddClass = "tab tab-add";
+var tabsCloseClass = "tab-icon tab-close";
+var tabsSizeClasses = {
+  small: "tabs-sm",
+  middle: "tabs-md",
+  large: "tabs-lg",
+  sm: "tabs-sm",
+  md: "tabs-md",
+  lg: "tabs-lg"
+};
+var tabsTypeClasses = {
+  line: "",
+  card: tabsBoxedClass,
+  "editable-card": tabsBoxedClass
+};
+function getTabsRootClasses({
+  tabPosition = "top",
+  className
+}) {
+  return cn(tabsRootClass, (tabPosition === "left" || tabPosition === "right") && tabsRootVerticalClass, tabPosition === "bottom" && tabsRootBottomClass, tabPosition === "right" && tabsRootRightClass, className);
+}
+function getTabsListClasses({
+  tabPosition = "top",
+  type = "line",
+  size = "middle",
+  centered
+}) {
+  return cn(tabsBaseClass, tabsScrollableClass, (tabPosition === "left" || tabPosition === "right") && tabsVerticalClass, tabsSizeClasses[size], tabsTypeClasses[type], centered && tabsCenteredClass);
+}
+function getTabClasses({
+  active,
+  disabled,
+  iconOnly,
+  className
+}) {
+  return cn(tabBaseClass, active && tabActiveClass, disabled && tabDisabledClass, iconOnly && tabIconOnlyClass, className);
+}
+function getTabPanelClasses({
+  active,
+  className
+}) {
+  return cn(tabPanelClass, active && tabPanelShowClass, className);
+}
+
+// src/components/tabs/Tabs.tsx
+import { jsx as jsx5, jsxs as jsxs5, Fragment as Fragment3 } from "react/jsx-runtime";
+function stringifyKey(key, index) {
+  return key == null ? String(index) : String(key);
+}
+function normalizeItems(items, children) {
+  if (items)
+    return items;
+  const paneItems = [];
+  Children.forEach(children, (child, index) => {
+    if (!isValidElement(child))
+      return;
+    paneItems.push({
+      key: stringifyKey(child.key, index),
+      label: child.props.tab ?? child.props.label,
+      icon: child.props.icon,
+      disabled: child.props.disabled,
+      closable: child.props.closable,
+      closeIcon: child.props.closeIcon,
+      forceRender: child.props.forceRender,
+      className: child.props.className,
+      style: child.props.style,
+      children: child.props.children
+    });
+  });
+  return paneItems;
+}
+function getInitialActiveKey(items, defaultActiveKey) {
+  if (defaultActiveKey !== undefined)
+    return defaultActiveKey;
+  return items.find((item) => !item.disabled)?.key ?? items[0]?.key;
+}
+function getCurrentActiveKey(items, activeKey) {
+  if (activeKey !== undefined && items.some((item) => item.key === activeKey)) {
+    return activeKey;
+  }
+  return items.find((item) => !item.disabled)?.key ?? items[0]?.key;
+}
+function isEditable(type) {
+  return type === "editable-card";
+}
+function getTabLabel(item) {
+  const label = item.label ?? item.key;
+  return /* @__PURE__ */ jsxs5(Fragment3, {
+    children: [
+      item.icon ? /* @__PURE__ */ jsx5("span", {
+        className: tabIconClass,
+        children: item.icon
+      }) : null,
+      label
+    ]
+  });
+}
+function shouldRenderPanel({
+  item,
+  active,
+  destroyInactiveTabPane
+}) {
+  if (active || item.forceRender)
+    return true;
+  return !(item.destroyInactiveTabPane ?? destroyInactiveTabPane);
+}
+var TabPane = (props) => /* @__PURE__ */ jsx5(Fragment3, {
+  children: props.children
+});
+TabPane.displayName = "Tabs.TabPane";
+var TabsBase = forwardRef5(({
+  items,
+  activeKey,
+  defaultActiveKey,
+  onChange,
+  onTabClick,
+  tabPosition = "top",
+  type = "line",
+  size = "middle",
+  hideAdd,
+  addIcon,
+  removeIcon,
+  onEdit,
+  destroyInactiveTabPane,
+  centered,
+  className,
+  children,
+  id,
+  ...props
+}, ref) => {
+  const reactId = useId();
+  const tabsId = id ?? `tabs-${reactId}`;
+  const finalItems = normalizeItems(items, children);
+  const [internalActiveKey, setInternalActiveKey] = useState3(() => getInitialActiveKey(finalItems, defaultActiveKey));
+  const isControlled = activeKey !== undefined;
+  const selectedKey = getCurrentActiveKey(finalItems, isControlled ? activeKey : internalActiveKey);
+  const tabRefs = useRef2([]);
+  const editable = isEditable(type);
+  function changeActive(nextKey) {
+    if (nextKey === selectedKey)
+      return;
+    if (!isControlled) {
+      setInternalActiveKey(nextKey);
+    }
+    onChange?.(nextKey);
+  }
+  function selectItem(item, event) {
+    if (item.disabled)
+      return;
+    if (event) {
+      onTabClick?.(item.key, event);
+    }
+    changeActive(item.key);
+  }
+  function closeItem(item) {
+    if (item.disabled)
+      return;
+    onEdit?.(item.key, "remove");
+  }
+  function addItem(event) {
+    onEdit?.(event, "add");
+  }
+  function focusByOffset(index, offset) {
+    if (finalItems.length === 0)
+      return;
+    for (let step = 1;step <= finalItems.length; step += 1) {
+      const nextIndex = (index + offset * step + finalItems.length) % finalItems.length;
+      const nextItem = finalItems[nextIndex];
+      if (!nextItem.disabled) {
+        tabRefs.current[nextIndex]?.focus();
+        changeActive(nextItem.key);
+        return;
+      }
+    }
+  }
+  function focusEdge(edge) {
+    const candidates = edge === "first" ? finalItems : [...finalItems].reverse();
+    const item = candidates.find((candidate) => !candidate.disabled);
+    if (!item)
+      return;
+    const index = finalItems.findIndex((candidate) => candidate.key === item.key);
+    tabRefs.current[index]?.focus();
+    changeActive(item.key);
+  }
+  function handleKeyDown(item, index, event) {
+    if (event.key === "ArrowRight" || event.key === "ArrowDown") {
+      event.preventDefault();
+      focusByOffset(index, 1);
+    } else if (event.key === "ArrowLeft" || event.key === "ArrowUp") {
+      event.preventDefault();
+      focusByOffset(index, -1);
+    } else if (event.key === "Home") {
+      event.preventDefault();
+      focusEdge("first");
+    } else if (event.key === "End") {
+      event.preventDefault();
+      focusEdge("last");
+    } else if (event.key === "Delete" && editable && item.closable !== false) {
+      event.preventDefault();
+      onEdit?.(item.key, "remove");
+    }
+  }
+  const tabList = /* @__PURE__ */ jsx5("div", {
+    className: tabsBarClass,
+    children: /* @__PURE__ */ jsxs5("div", {
+      role: "tablist",
+      "aria-orientation": tabPosition === "left" || tabPosition === "right" ? "vertical" : "horizontal",
+      className: getTabsListClasses({
+        tabPosition,
+        type,
+        size,
+        centered
+      }),
+      children: [
+        finalItems.map((item, index) => {
+          const active = item.key === selectedKey;
+          const panelId = `${tabsId}-panel-${item.key}`;
+          const tabId = `${tabsId}-tab-${item.key}`;
+          const showClose = editable && item.closable !== false && !item.disabled;
+          return /* @__PURE__ */ jsxs5(Fragment2, {
+            children: [
+              /* @__PURE__ */ jsx5("button", {
+                ref: (element) => {
+                  tabRefs.current[index] = element;
+                },
+                id: tabId,
+                type: "button",
+                role: "tab",
+                "aria-selected": active,
+                "aria-controls": panelId,
+                tabIndex: active ? 0 : -1,
+                disabled: item.disabled,
+                className: getTabClasses({
+                  active,
+                  disabled: item.disabled,
+                  iconOnly: item.icon != null && item.label == null
+                }),
+                onClick: (event) => selectItem(item, event),
+                onKeyDown: (event) => handleKeyDown(item, index, event),
+                children: getTabLabel(item)
+              }),
+              showClose ? /* @__PURE__ */ jsx5("button", {
+                type: "button",
+                className: tabsCloseClass,
+                "aria-label": `Close tab ${item.key}`,
+                onClick: (event) => {
+                  event.stopPropagation();
+                  closeItem(item);
+                },
+                children: item.closeIcon ?? removeIcon ?? "x"
+              }) : null
+            ]
+          }, item.key);
+        }),
+        editable && !hideAdd ? /* @__PURE__ */ jsx5("button", {
+          type: "button",
+          className: tabsAddClass,
+          "aria-label": "Add tab",
+          onClick: addItem,
+          children: addIcon ?? "+"
+        }) : null
+      ]
+    })
+  });
+  const panels = finalItems.map((item) => {
+    const active = item.key === selectedKey;
+    if (!shouldRenderPanel({ item, active, destroyInactiveTabPane })) {
+      return null;
+    }
+    return /* @__PURE__ */ jsx5("div", {
+      id: `${tabsId}-panel-${item.key}`,
+      role: "tabpanel",
+      "aria-labelledby": `${tabsId}-tab-${item.key}`,
+      hidden: !active,
+      "data-active": active ? "true" : undefined,
+      className: getTabPanelClasses({
+        active,
+        className: item.className
+      }),
+      style: item.style,
+      children: item.children
+    }, item.key);
+  });
+  return /* @__PURE__ */ jsxs5("div", {
+    ...props,
+    ref,
+    id,
+    className: getTabsRootClasses({ tabPosition, className }),
+    children: [
+      tabPosition === "bottom" || tabPosition === "right" ? panels : null,
+      tabList,
+      tabPosition === "bottom" || tabPosition === "right" ? null : panels
+    ]
+  });
+});
+TabsBase.displayName = "Tabs";
+var Tabs = Object.assign(TabsBase, {
+  TabPane
+});
+// src/components/dm-tabs/DmTabs.tsx
+import { forwardRef as forwardRef6 } from "react";
+
+// src/classes/dm-tabs.ts
+var dmTabsShellClass = "dm-tabs-shell";
+var dmTabsLineHorizontalClass = "dm-line-horizontal-tabs";
+var dmTabsLineVerticalClass = "dm-line-vertical-tabs";
+var dmTabsCardClass = "dm-card-tabs";
+var dmTabsCardTransparentClass = "dm-card-transparent-tabs";
+var dmTabsOptionTreeClass = "dm-option-tree-tabs";
+function getDmTabsShellClasses({ className }) {
+  return cn(dmTabsShellClass, className);
+}
+function getDmTabsClasses({
+  type = "line",
+  tabPosition = "top",
+  transparentCard,
+  optionTree,
+  className
+}) {
+  const isVerticalLine = type === "line" && (tabPosition === "left" || tabPosition === "right");
+  return cn(type === "line" && (isVerticalLine ? dmTabsLineVerticalClass : dmTabsLineHorizontalClass), type !== "line" && (transparentCard ? dmTabsCardTransparentClass : dmTabsCardClass), optionTree && dmTabsOptionTreeClass, className);
+}
+
+// src/components/dm-tabs/DmTabs.tsx
+import { jsx as jsx6 } from "react/jsx-runtime";
+var DmTabs = forwardRef6(({
+  type = "line",
+  tabPosition = "top",
+  transparentCard = false,
+  optionTree = false,
+  destroyOnHidden = true,
+  destroyInactiveTabPane,
+  className,
+  style,
+  items,
+  ...props
+}, ref) => /* @__PURE__ */ jsx6("div", {
+  className: getDmTabsShellClasses({}),
+  style,
+  children: /* @__PURE__ */ jsx6(Tabs, {
+    ...props,
+    ref,
+    items,
+    type,
+    tabPosition,
+    destroyInactiveTabPane: destroyInactiveTabPane ?? destroyOnHidden,
+    className: getDmTabsClasses({
+      type,
+      tabPosition,
+      transparentCard,
+      optionTree,
+      className
+    })
+  })
+}));
+DmTabs.displayName = "DmTabs";
+// src/components/tree/Tree.tsx
+import React6, { forwardRef as forwardRef7, useMemo, useState as useState4 } from "react";
+
+// src/classes/tree.ts
+var treeBaseClass = "tree";
+var treeDirectoryClass = "tree-directory";
+var treeDisabledClass = "tree-disabled";
+var treeShowLineClass = "tree-show-line";
+var treeCheckableClass = "tree-checkable";
+var treeMultipleClass = "tree-multiple";
+var treeListClass = "tree-list";
+var treeNodeClass = "tree-node";
+var treeNodeSelectedClass = "tree-node-selected";
+var treeNodeCheckedClass = "tree-node-checked";
+var treeNodeDisabledClass = "tree-node-disabled";
+var treeNodeExpandedClass = "tree-node-expanded";
+var treeNodeDraggableClass = "tree-node-draggable";
+var treeNodeSwitcherClass = "tree-node-switcher";
+var treeNodeCheckboxClass = "tree-node-checkbox";
+var treeNodeIconClass = "tree-node-icon";
+var treeNodeTitleClass = "tree-node-title";
+var treeNodeChildrenClass = "tree-node-children";
+function getTreeClasses({
+  disabled,
+  checkable,
+  multiple,
+  showLine,
+  directory,
+  className
+}) {
+  return cn(treeBaseClass, disabled && treeDisabledClass, checkable && treeCheckableClass, multiple && treeMultipleClass, showLine && treeShowLineClass, directory && treeDirectoryClass, className);
+}
+function getTreeNodeClasses({
+  selected,
+  checked,
+  disabled,
+  expanded,
+  draggable,
+  className
+}) {
+  return cn(treeNodeClass, selected && treeNodeSelectedClass, checked && treeNodeCheckedClass, disabled && treeNodeDisabledClass, expanded && treeNodeExpandedClass, draggable && treeNodeDraggableClass, className);
+}
+
+// src/components/tree/Tree.tsx
+import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+function normalizeKeys(keys) {
+  return keys?.map(String) ?? [];
+}
+function uniqueKeys(keys) {
+  return Array.from(new Set(keys));
+}
+function hasNode(node) {
+  return node !== undefined && node !== null && node !== false;
+}
+function isCurrentTreeItemEvent(event) {
+  return event.target instanceof Element && event.target.closest('[role="treeitem"]') === event.currentTarget;
+}
+function isActivationKey(key) {
+  return key === "Enter" || key === " ";
+}
+function buildFlatTree(nodes, level = 0, parentKey = undefined, parentPos = "0") {
+  return nodes.map((node, index) => {
+    const keyString = String(node.key);
+    const pos = `${parentPos}-${index}`;
+    const item = {
+      key: node.key,
+      keyString,
+      node,
+      parentKey,
+      children: [],
+      level,
+      pos
+    };
+    item.children = buildFlatTree(node.children ?? [], level + 1, keyString, pos);
+    return item;
+  });
+}
+function flattenTree(nodes) {
+  return nodes.flatMap((node) => [node, ...flattenTree(node.children)]);
+}
+function descendantKeys(node) {
+  return flattenTree(node.children).map((child) => child.keyString);
+}
+function eventNode(item) {
+  return {
+    ...item.node,
+    key: item.key,
+    pos: item.pos,
+    data: item.node
+  };
+}
+function eventInfo(item, nativeEvent) {
+  return {
+    node: eventNode(item),
+    nativeEvent
+  };
+}
+function checkedNodesFromKeys(flatNodes, keys) {
+  const keySet = new Set(keys);
+  return flatNodes.filter((item) => keySet.has(item.keyString)).map((item) => item.node);
+}
+function treeDataFromChildren(children) {
+  return React6.Children.toArray(children).flatMap((child, index) => {
+    if (!React6.isValidElement(child)) {
+      return [];
+    }
+    const {
+      title,
+      eventKey,
+      children: childChildren,
+      disabled,
+      disableCheckbox,
+      selectable,
+      checkable,
+      icon,
+      isLeaf,
+      className
+    } = child.props;
+    return [
+      {
+        key: eventKey ?? child.key ?? index,
+        title,
+        disabled,
+        disableCheckbox,
+        selectable,
+        checkable,
+        icon,
+        isLeaf,
+        className,
+        children: treeDataFromChildren(childChildren)
+      }
+    ];
+  });
+}
+var TreeNode = forwardRef7(({
+  title,
+  children,
+  disabled,
+  checkable,
+  selectable,
+  icon,
+  className,
+  ...props
+}, ref) => /* @__PURE__ */ jsxs6("div", {
+  ...props,
+  ref,
+  "aria-disabled": disabled || undefined,
+  className: getTreeNodeClasses({ disabled, className }),
+  children: [
+    checkable ? /* @__PURE__ */ jsx7("input", {
+      type: "checkbox",
+      className: treeNodeCheckboxClass,
+      disabled,
+      readOnly: true
+    }) : null,
+    hasNode(icon) ? /* @__PURE__ */ jsx7("span", {
+      className: treeNodeIconClass,
+      children: icon
+    }) : null,
+    /* @__PURE__ */ jsx7("span", {
+      className: treeNodeTitleClass,
+      children: title
+    }),
+    selectable === false ? null : children
+  ]
+}));
+TreeNode.displayName = "Tree.TreeNode";
+function TreeRoot({
+  treeData,
+  children,
+  expandedKeys,
+  defaultExpandedKeys,
+  selectedKeys,
+  defaultSelectedKeys,
+  checkedKeys,
+  defaultCheckedKeys,
+  checkable,
+  selectable = true,
+  multiple,
+  disabled,
+  showLine,
+  showIcon,
+  draggable,
+  blockNode,
+  defaultExpandAll,
+  loadData,
+  titleRender,
+  onExpand,
+  onSelect,
+  onCheck,
+  onDragStart,
+  onDragEnter,
+  onDragOver,
+  onDragLeave,
+  onDragEnd,
+  onDrop,
+  className,
+  ...props
+}, ref) {
+  const data = useMemo(() => treeData ?? treeDataFromChildren(children), [children, treeData]);
+  const flatRoots = useMemo(() => buildFlatTree(data), [data]);
+  const flatNodes = useMemo(() => flattenTree(flatRoots), [flatRoots]);
+  const allExpandableKeys = useMemo(() => flatNodes.filter((item) => item.children.length > 0 || item.node.isLeaf === false).map((item) => item.keyString), [flatNodes]);
+  const expandedControlled = expandedKeys !== undefined;
+  const selectedControlled = selectedKeys !== undefined;
+  const checkedControlled = checkedKeys !== undefined;
+  const [internalExpandedKeys, setInternalExpandedKeys] = useState4(() => defaultExpandAll ? allExpandableKeys : normalizeKeys(defaultExpandedKeys));
+  const [internalSelectedKeys, setInternalSelectedKeys] = useState4(() => normalizeKeys(defaultSelectedKeys));
+  const [internalCheckedKeys, setInternalCheckedKeys] = useState4(() => normalizeKeys(defaultCheckedKeys));
+  const [dragNodeKey, setDragNodeKey] = useState4();
+  const currentExpandedKeys = expandedControlled ? normalizeKeys(expandedKeys) : internalExpandedKeys;
+  const currentSelectedKeys = selectedControlled ? normalizeKeys(selectedKeys) : internalSelectedKeys;
+  const currentCheckedKeys = checkedControlled ? normalizeKeys(checkedKeys) : internalCheckedKeys;
+  const expandedKeySet = useMemo(() => new Set(currentExpandedKeys), [currentExpandedKeys]);
+  const selectedKeySet = useMemo(() => new Set(currentSelectedKeys), [currentSelectedKeys]);
+  const checkedKeySet = useMemo(() => new Set(currentCheckedKeys), [currentCheckedKeys]);
+  function updateExpandedKeys(nextExpandedKeys, item, nativeEvent, expanded) {
+    if (!expandedControlled) {
+      setInternalExpandedKeys(nextExpandedKeys);
+    }
+    onExpand?.(nextExpandedKeys, {
+      ...eventInfo(item, nativeEvent),
+      expanded
+    });
+  }
+  function toggleExpand(item, nativeEvent) {
+    if (disabled || item.node.disabled || item.node.isLeaf) {
+      return;
+    }
+    const expanded = !expandedKeySet.has(item.keyString);
+    const nextExpandedKeys = expanded ? uniqueKeys([...currentExpandedKeys, item.keyString]) : currentExpandedKeys.filter((key) => key !== item.keyString);
+    updateExpandedKeys(nextExpandedKeys, item, nativeEvent, expanded);
+    if (expanded && loadData) {
+      loadData(eventNode(item));
+    }
+  }
+  function selectNode(item, nativeEvent) {
+    if (disabled || item.node.disabled || selectable === false || item.node.selectable === false) {
+      return;
+    }
+    const selected = selectedKeySet.has(item.keyString);
+    const nextSelectedKeys = selected && multiple ? currentSelectedKeys.filter((key) => key !== item.keyString) : selected ? currentSelectedKeys : multiple ? uniqueKeys([...currentSelectedKeys, item.keyString]) : [item.keyString];
+    if (!selectedControlled) {
+      setInternalSelectedKeys(nextSelectedKeys);
+    }
+    onSelect?.(nextSelectedKeys, {
+      ...eventInfo(item, nativeEvent),
+      selected: !selected,
+      selectedNodes: flatNodes.filter((node) => nextSelectedKeys.includes(node.keyString)).map((node) => node.node)
+    });
+  }
+  function checkNode(item, nativeEvent) {
+    if (disabled || item.node.disabled || item.node.disableCheckbox || checkable === false || item.node.checkable === false) {
+      return;
+    }
+    const checked = checkedKeySet.has(item.keyString);
+    const affectedKeys = [item.keyString, ...descendantKeys(item)];
+    const nextCheckedKeys = checked ? currentCheckedKeys.filter((key) => !affectedKeys.includes(key)) : uniqueKeys([...currentCheckedKeys, ...affectedKeys]);
+    if (!checkedControlled) {
+      setInternalCheckedKeys(nextCheckedKeys);
+    }
+    onCheck?.(nextCheckedKeys, {
+      ...eventInfo(item, nativeEvent),
+      checked: !checked,
+      checkedNodes: checkedNodesFromKeys(flatNodes, nextCheckedKeys)
+    });
+  }
+  function dragInfo(item, event) {
+    return {
+      ...eventInfo(item, event),
+      event
+    };
+  }
+  function handleDrop(item, event) {
+    event.preventDefault();
+    const dragNode = flatNodes.find((node) => node.keyString === dragNodeKey);
+    const info = {
+      ...dragInfo(item, event),
+      dragNode: dragNode ? eventNode(dragNode) : undefined,
+      dragNodesKeys: dragNode ? [dragNode.key] : [],
+      dropPosition: 0,
+      dropToGap: false
+    };
+    onDrop?.(info);
+  }
+  function renderNode(item) {
+    const nodeDisabled = disabled || item.node.disabled;
+    const expanded = expandedKeySet.has(item.keyString);
+    const checked = checkedKeySet.has(item.keyString);
+    const selected = selectedKeySet.has(item.keyString);
+    const expandable = item.children.length > 0 || item.node.isLeaf === false;
+    const nodeCheckable = checkable && item.node.checkable !== false;
+    const nodeDraggable = Boolean(draggable && !nodeDisabled);
+    const title = titleRender?.(item.node) ?? item.node.title ?? item.key;
+    return /* @__PURE__ */ jsxs6("li", {
+      role: "treeitem",
+      "aria-expanded": expandable ? expanded : undefined,
+      "aria-selected": selected,
+      "aria-disabled": nodeDisabled || undefined,
+      tabIndex: nodeDisabled ? undefined : 0,
+      onClick: (event) => {
+        if (isCurrentTreeItemEvent(event)) {
+          selectNode(item, event);
+        }
+      },
+      onKeyDown: (event) => {
+        if (isActivationKey(event.key) && isCurrentTreeItemEvent(event)) {
+          event.preventDefault();
+          selectNode(item, event);
+        }
+      },
+      onDragStart: (event) => {
+        setDragNodeKey(item.keyString);
+        onDragStart?.(dragInfo(item, event));
+      },
+      onDragEnter: (event) => onDragEnter?.(dragInfo(item, event)),
+      onDragOver: (event) => {
+        if (onDrop) {
+          event.preventDefault();
+        }
+        onDragOver?.(dragInfo(item, event));
+      },
+      onDragLeave: (event) => onDragLeave?.(dragInfo(item, event)),
+      onDragEnd: (event) => onDragEnd?.(dragInfo(item, event)),
+      onDrop: (event) => handleDrop(item, event),
+      children: [
+        /* @__PURE__ */ jsxs6("div", {
+          className: getTreeNodeClasses({
+            selected,
+            checked,
+            disabled: nodeDisabled,
+            expanded,
+            draggable: nodeDraggable,
+            className: cn(item.node.className, blockNode && "tree-node-block")
+          }),
+          style: { paddingInlineStart: item.level * 16 },
+          draggable: nodeDraggable,
+          children: [
+            /* @__PURE__ */ jsx7("button", {
+              type: "button",
+              "aria-label": expanded ? `Collapse ${item.keyString}` : `Expand ${item.keyString}`,
+              className: treeNodeSwitcherClass,
+              disabled: nodeDisabled || !expandable,
+              onClick: (event) => {
+                event.stopPropagation();
+                toggleExpand(item, event);
+              },
+              children: expandable ? expanded ? "v" : ">" : showLine ? "-" : ""
+            }),
+            nodeCheckable ? /* @__PURE__ */ jsx7("input", {
+              type: "checkbox",
+              className: treeNodeCheckboxClass,
+              "aria-label": `Check ${item.keyString}`,
+              checked,
+              disabled: nodeDisabled || item.node.disableCheckbox,
+              onChange: (event) => checkNode(item, event),
+              onClick: (event) => event.stopPropagation()
+            }) : null,
+            showIcon && hasNode(item.node.icon) ? /* @__PURE__ */ jsx7("span", {
+              className: treeNodeIconClass,
+              children: item.node.icon
+            }) : null,
+            /* @__PURE__ */ jsx7("span", {
+              className: treeNodeTitleClass,
+              children: title
+            })
+          ]
+        }),
+        expanded && item.children.length > 0 ? /* @__PURE__ */ jsx7("ul", {
+          className: treeNodeChildrenClass,
+          role: "group",
+          children: item.children.map(renderNode)
+        }) : null
+      ]
+    }, item.keyString);
+  }
+  return /* @__PURE__ */ jsx7("div", {
+    ...props,
+    ref,
+    className: getTreeClasses({
+      disabled,
+      checkable,
+      multiple,
+      showLine,
+      className
+    }),
+    role: "tree",
+    "aria-multiselectable": multiple || undefined,
+    children: /* @__PURE__ */ jsx7("ul", {
+      className: treeListClass,
+      children: flatRoots.map(renderNode)
+    })
+  });
+}
+var TreeBase = forwardRef7(TreeRoot);
+function DirectoryTreeRoot({ className, multiple = true, ...props }, ref) {
+  return /* @__PURE__ */ jsx7(TreeBase, {
+    ...props,
+    ref,
+    multiple,
+    className: cn("tree-directory", className)
+  });
+}
+var DirectoryTree = forwardRef7(DirectoryTreeRoot);
+var TreeNodeComponent = TreeNode;
+var Tree = TreeBase;
+Tree.TreeNode = TreeNodeComponent;
+Tree.DirectoryTree = DirectoryTree;
+Tree.displayName = "Tree";
+// src/components/dm-tree/DmTree.tsx
+import { useMemo as useMemo2, useState as useState5 } from "react";
+
+// src/classes/dm-tree.ts
+var dmTreeBaseClass = "dm-tree";
+var dmTreeAutoWidthClass = "dm-tree-auto-width";
+var dmTreeContentClass = "dm-tree-content";
+var dmTreeToolbarClass = "dm-tree-toolbar";
+var dmTreeIconToolbarClass = "dm-tree-icon-toolbar";
+var dmTreeAllButtonClass = "dm-tree-all-button";
+var dmTreeAllButtonSelectedClass = "dm-tree-all-button-selected";
+var dmTreeSearchClass = "dm-tree-search";
+var dmTreeBodyClass = "dm-tree-body";
+var dmTreeNodeTitleClass = "dm-tree-node-title";
+var dmTreeNodePrefixClass = "dm-tree-node-prefix";
+var dmTreeItemToolbarClass = "dm-tree-item-toolbar";
+var dmTreeItemToolbarVisibleClass = "dm-tree-item-toolbar-visible";
+var dmTreeOptionClass = "dm-tree-option";
+function getDmTreeClasses({
+  autoWidth,
+  optionTree,
+  className
+}) {
+  return cn(dmTreeBaseClass, autoWidth && dmTreeAutoWidthClass, optionTree && dmTreeOptionClass, className);
+}
+function getDmTreeAllButtonClasses({
+  selected,
+  className
+}) {
+  return cn(dmTreeAllButtonClass, selected && dmTreeAllButtonSelectedClass, className);
+}
+function getDmTreeItemToolbarClasses({
+  alwaysShow,
+  className
+}) {
+  return cn(dmTreeItemToolbarClass, alwaysShow && dmTreeItemToolbarVisibleClass, className);
+}
+
+// src/components/dm-tree/DmTree.tsx
+import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
+var defaultFieldNames = {
+  title: "title",
+  key: "key",
+  children: "children"
+};
+function cssSize(value) {
+  if (value === undefined)
+    return;
+  return typeof value === "number" ? `${value}px` : value;
+}
+function fieldName(fieldNames, name) {
+  return String(fieldNames?.[name] ?? defaultFieldNames[name]);
+}
+function readField(node, field) {
+  return node[field];
+}
+function normalizeTreeData(treeData, fieldNames) {
+  const titleField = fieldName(fieldNames, "title");
+  const keyField = fieldName(fieldNames, "key");
+  const childrenField = fieldName(fieldNames, "children");
+  return treeData.map((node) => {
+    const record = node;
+    const children = readField(record, childrenField);
+    return {
+      ...node,
+      key: readField(record, keyField) ?? node.key,
+      title: readField(record, titleField) ?? node.title,
+      children: Array.isArray(children) ? normalizeTreeData(children, fieldNames) : undefined,
+      data: node
+    };
+  });
+}
+function findNode(treeData, key, fieldNames) {
+  if (key === undefined)
+    return;
+  const keyField = fieldName(fieldNames, "key");
+  const childrenField = fieldName(fieldNames, "children");
+  const queue = [...treeData];
+  for (const node of queue) {
+    if (node[keyField] === key || node.key === key) {
+      return node;
+    }
+    const children = node[childrenField];
+    if (Array.isArray(children)) {
+      queue.push(...children);
+    }
+  }
+  return;
+}
+function filterTreeData(treeData, search, fieldNames) {
+  if (!search)
+    return treeData;
+  const titleField = fieldName(fieldNames, "title");
+  const childrenField = fieldName(fieldNames, "children");
+  const needle = search.toLowerCase();
+  return treeData.flatMap((node) => {
+    const record = node;
+    const children = record[childrenField];
+    const filteredChildren = Array.isArray(children) ? filterTreeData(children, search, fieldNames) : [];
+    const title = String(record[titleField] ?? node.title ?? "");
+    const matched = title.toLowerCase().includes(needle);
+    if (!matched && filteredChildren.length === 0)
+      return [];
+    return [
+      {
+        ...node,
+        [childrenField]: filteredChildren.length > 0 ? filteredChildren : undefined
+      }
+    ];
+  });
+}
+function parentKeys(treeData, fieldNames) {
+  if (!treeData)
+    return [];
+  const keyField = fieldName(fieldNames, "key");
+  const childrenField = fieldName(fieldNames, "children");
+  const keys = [];
+  function visit(nodes) {
+    nodes.forEach((node) => {
+      const children = node[childrenField];
+      if (Array.isArray(children) && children.length > 0) {
+        keys.push(node[keyField] ?? node.key);
+        visit(children);
+      }
+    });
+  }
+  visit(treeData);
+  return keys;
+}
+function renderToolbar(toolbar, selectedKey, getSelectedItem) {
+  if (!toolbar)
+    return null;
+  if (typeof toolbar === "function") {
+    return toolbar(selectedKey, getSelectedItem);
+  }
+  return toolbar.map((item, index) => /* @__PURE__ */ jsxs7("button", {
+    type: "button",
+    disabled: item.disabled,
+    title: typeof item.label === "string" ? item.label : undefined,
+    onClick: () => item.onClick?.(selectedKey, getSelectedItem),
+    children: [
+      item.icon,
+      item.label
+    ]
+  }, index));
+}
+function shouldShowAction(action, item) {
+  if (typeof action.show === "function")
+    return action.show(item);
+  return action.show !== false;
+}
+function isActionDisabled(action, item) {
+  if (typeof action.disabled === "function")
+    return action.disabled(item);
+  return Boolean(action.disabled);
+}
+function CommonDmTree({
+  treeData = [],
+  selectedKey,
+  showAll = true,
+  allItem = { value: 0, label: "All" },
+  buttonTopToolbar,
+  iconTopToolbar,
+  customTopToolbar,
+  itemToolbar,
+  itemToolbarAlwaysShow,
+  beforeSelect,
+  onChange,
+  loading,
+  showSearch,
+  searchPlaceholder = "Search",
+  customSearch,
+  beforeIcon,
+  emptyNode,
+  width = "auto",
+  minNodeWidth = "3rem",
+  fieldNames,
+  className,
+  style,
+  defaultExpandedKeys,
+  expandedKeys,
+  onExpand,
+  showLine,
+  ...treeProps
+}) {
+  const [searchValue, setSearchValue] = useState5("");
+  const [internalExpandedKeys, setInternalExpandedKeys] = useState5(() => defaultExpandedKeys ?? parentKeys(treeData, fieldNames));
+  const filteredTree = useMemo2(() => customSearch || !searchValue ? treeData : filterTreeData(treeData, searchValue, fieldNames), [customSearch, fieldNames, searchValue, treeData]);
+  const normalizedTree = useMemo2(() => normalizeTreeData(filteredTree, fieldNames), [fieldNames, filteredTree]);
+  const searchExpandedKeys = useMemo2(() => parentKeys(filteredTree, fieldNames), [fieldNames, filteredTree]);
+  const treeExpandedKeys = expandedKeys ?? (searchValue && !customSearch ? searchExpandedKeys : internalExpandedKeys);
+  const selectedItem = () => findNode(treeData, selectedKey, fieldNames);
+  const autoWidth = width === "auto";
+  const mergedWidth = autoWidth ? "100%" : cssSize(width);
+  function handleSearch(event) {
+    setSearchValue(event.currentTarget.value);
+    customSearch?.(event);
+  }
+  function commitSelection(nextItem, nextKey) {
+    onChange?.(nextItem, nextKey, selectedKey);
+  }
+  function handleSelect(keys) {
+    const nextKey = keys[0];
+    const nextItem = findNode(treeData, nextKey, fieldNames);
+    if (!nextItem || nextKey === undefined)
+      return;
+    const allowed = beforeSelect?.(nextItem, nextKey, selectedKey);
+    if (allowed && typeof allowed.then === "function") {
+      Promise.resolve(allowed).then((result) => {
+        if (result !== false)
+          commitSelection(nextItem, nextKey);
+      });
+      return;
+    }
+    if (allowed !== false) {
+      commitSelection(nextItem, nextKey);
+    }
+  }
+  function renderTitle(node) {
+    const source = node.data ?? node;
+    const titleField = fieldName(fieldNames, "title");
+    const title = source[titleField] ?? source.title;
+    const actions = typeof itemToolbar === "function" ? itemToolbar(source) : Array.isArray(itemToolbar) ? /* @__PURE__ */ jsx8("span", {
+      className: getDmTreeItemToolbarClasses({ alwaysShow: itemToolbarAlwaysShow }),
+      children: itemToolbar.filter((action) => shouldShowAction(action, source)).map((action, index) => {
+        const disabled = isActionDisabled(action, source);
+        return /* @__PURE__ */ jsx8("button", {
+          type: "button",
+          className: dmTreeItemToolbarClass,
+          "aria-label": action.title,
+          title: action.title,
+          disabled,
+          onClick: (event) => {
+            event.stopPropagation();
+            if (!disabled)
+              action.onClick?.(source);
+          },
+          children: action.icon
+        }, index);
+      })
+    }) : null;
+    return /* @__PURE__ */ jsxs7("span", {
+      className: dmTreeNodeTitleClass,
+      children: [
+        beforeIcon ? /* @__PURE__ */ jsx8("span", {
+          className: dmTreeNodePrefixClass,
+          children: typeof beforeIcon === "function" ? beforeIcon(source) : beforeIcon
+        }) : null,
+        /* @__PURE__ */ jsx8("span", {
+          style: { minWidth: cssSize(minNodeWidth) },
+          children: title
+        }),
+        actions
+      ]
+    });
+  }
+  return /* @__PURE__ */ jsx8("div", {
+    className: getDmTreeClasses({ autoWidth, className }),
+    style: { width: mergedWidth, height: "100%", ...style },
+    children: /* @__PURE__ */ jsxs7("div", {
+      className: dmTreeContentClass,
+      children: [
+        customTopToolbar ? /* @__PURE__ */ jsx8("div", {
+          className: dmTreeToolbarClass,
+          children: customTopToolbar
+        }) : null,
+        buttonTopToolbar ? /* @__PURE__ */ jsx8("div", {
+          className: dmTreeToolbarClass,
+          children: renderToolbar(buttonTopToolbar, selectedKey, selectedItem)
+        }) : null,
+        iconTopToolbar ? /* @__PURE__ */ jsx8("div", {
+          className: dmTreeIconToolbarClass,
+          children: renderToolbar(iconTopToolbar, selectedKey, selectedItem)
+        }) : null,
+        showAll ? /* @__PURE__ */ jsx8("button", {
+          type: "button",
+          className: getDmTreeAllButtonClasses({
+            selected: selectedKey === allItem.value
+          }),
+          onClick: () => onChange?.(undefined, allItem.value, selectedKey),
+          children: allItem.label
+        }) : null,
+        showSearch ? /* @__PURE__ */ jsx8("div", {
+          className: dmTreeSearchClass,
+          children: /* @__PURE__ */ jsx8(Input, {
+            allowClear: true,
+            placeholder: searchPlaceholder,
+            value: searchValue,
+            onChange: handleSearch
+          })
+        }) : null,
+        /* @__PURE__ */ jsx8("div", {
+          className: dmTreeBodyClass,
+          children: loading ? /* @__PURE__ */ jsx8(DmStatus, {
+            status: "loading"
+          }) : normalizedTree.length > 0 ? /* @__PURE__ */ jsx8(Tree, {
+            ...treeProps,
+            treeData: normalizedTree,
+            selectedKeys: selectedKey === undefined ? [] : [selectedKey],
+            expandedKeys: treeExpandedKeys,
+            showLine: showLine ?? parentKeys(treeData, fieldNames).length > 0,
+            blockNode: true,
+            titleRender: renderTitle,
+            onSelect: (keys) => handleSelect(keys),
+            onExpand: (keys, info) => {
+              setInternalExpandedKeys(keys);
+              onExpand?.(keys, info);
+            }
+          }) : emptyNode ?? /* @__PURE__ */ jsx8(DmStatus, {
+            status: "empty"
+          })
+        })
+      ]
+    })
+  });
+}
+function OptionDmTree(props) {
+  const {
+    items,
+    defaultActiveKey,
+    activeKey,
+    clearOtherSelection = true,
+    width = "auto",
+    minNodeWidth,
+    onChange,
+    className,
+    style,
+    isTabTree,
+    ...rest
+  } = props;
+  const tabItems = items.map(({ TreeSetting, key, ...item }) => ({
+    ...item,
+    key,
+    children: /* @__PURE__ */ jsx8(CommonDmTree, {
+      ...TreeSetting,
+      minNodeWidth: TreeSetting.minNodeWidth ?? minNodeWidth,
+      onChange: (node, selected, before) => {
+        if (clearOtherSelection) {
+          items.forEach((other) => {
+            if (other.key !== key && other.TreeSetting.selectedKey !== undefined) {
+              other.TreeSetting.onChange?.(undefined, undefined, other.TreeSetting.selectedKey);
+            }
+          });
+        }
+        TreeSetting.onChange?.(node, selected, before);
+      }
+    })
+  }));
+  return /* @__PURE__ */ jsx8("div", {
+    ...rest,
+    className: getDmTreeClasses({ optionTree: true, className }),
+    style: { width: cssSize(width) ?? "100%", height: "100%", ...style },
+    children: /* @__PURE__ */ jsx8(DmTabs, {
+      centered: true,
+      optionTree: true,
+      type: "line",
+      activeKey,
+      defaultActiveKey,
+      items: tabItems,
+      onChange
+    })
+  });
+}
+var DmTree = (props) => {
+  if ("isTabTree" in props && props.isTabTree) {
+    return /* @__PURE__ */ jsx8(OptionDmTree, {
+      ...props
+    });
+  }
+  return CommonDmTree(props);
+};
+export {
+  DmTree
+};