@expcat/tigercat-vue 2.0.19 → 2.1.1

package/dist/chunk-WC5MKASU.mjs

@@ -1,393 +0,0 @@
-import {
-  renderVueOverlayTeleport,
-  useVueAnchoredOverlay
-} from "./chunk-Q7Y22OFX.mjs";
-import {
-  useTigerConfig
-} from "./chunk-UOJOJBEU.mjs";
-
-// src/components/TreeSelect.ts
-import { defineComponent, h, ref, computed } from "vue";
-import {
-  treeSelectBaseClasses,
-  treeSelectDropdownClasses,
-  treeSelectSearchClasses,
-  treeSelectEmptyClasses,
-  getTreeSelectTriggerClasses,
-  getTreeSelectNodeClasses,
-  getTreeSelectDisplayLabel,
-  getAllTreeSelectKeys,
-  flattenTreeSelectNodes,
-  filterTreeSelectNodes,
-  getPickerComboboxAria,
-  getPickerListboxAria,
-  getPickerOptionAria,
-  getPickerTriggerKeyAction,
-  coerceClassValue,
-  classNames,
-  icon20ViewBox,
-  chevronDownSolidIcon20PathD,
-  chevronRightSolidIcon20PathD,
-  closeSolidIcon20PathD,
-  resolveLocaleText,
-  mergeTigerLocale
-} from "@expcat/tigercat-core";
-var treeSelectInstanceId = 0;
-var ChevronDownIcon = h(
-  "svg",
-  {
-    class: "w-4 h-4 transition-transform",
-    viewBox: icon20ViewBox,
-    fill: "currentColor",
-    xmlns: "http://www.w3.org/2000/svg"
-  },
-  [
-    h("path", {
-      d: chevronDownSolidIcon20PathD,
-      "fill-rule": "evenodd",
-      "clip-rule": "evenodd"
-    })
-  ]
-);
-var ClearIcon = h(
-  "svg",
-  {
-    class: "w-4 h-4",
-    viewBox: icon20ViewBox,
-    fill: "currentColor",
-    xmlns: "http://www.w3.org/2000/svg"
-  },
-  [
-    h("path", {
-      d: closeSolidIcon20PathD,
-      "fill-rule": "evenodd",
-      "clip-rule": "evenodd"
-    })
-  ]
-);
-var TreeSelect = defineComponent({
-  name: "TigerTreeSelect",
-  props: {
-    modelValue: {
-      type: [String, Number, Array],
-      default: void 0
-    },
-    treeData: {
-      type: Array,
-      default: () => []
-    },
-    placeholder: {
-      type: String,
-      default: "Please select"
-    },
-    size: {
-      type: String,
-      default: "md"
-    },
-    disabled: {
-      type: Boolean,
-      default: false
-    },
-    clearable: {
-      type: Boolean,
-      default: false
-    },
-    multiple: {
-      type: Boolean,
-      default: false
-    },
-    searchable: {
-      type: Boolean,
-      default: false
-    },
-    searchValue: {
-      type: String,
-      default: void 0
-    },
-    defaultSearchValue: {
-      type: String,
-      default: ""
-    },
-    emptyText: {
-      type: String,
-      default: void 0
-    },
-    defaultExpandAll: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Locale overrides merged on top of ConfigProvider locale
-     */
-    locale: {
-      type: Object,
-      default: void 0
-    }
-  },
-  emits: ["update:modelValue", "update:searchValue", "change", "search-change"],
-  setup(props, { emit, attrs }) {
-    const instanceId = ++treeSelectInstanceId;
-    const config = useTigerConfig();
-    const mergedLocale = computed(() => mergeTigerLocale(config.value.locale, props.locale));
-    const listboxId = `tiger-treeselect-listbox-${instanceId}`;
-    const isOpen = ref(false);
-    const uncontrolledSearchValue = ref(props.defaultSearchValue);
-    const searchQuery = computed(() => props.searchValue ?? uncontrolledSearchValue.value);
-    const containerRef = ref(null);
-    const triggerRef = ref(null);
-    const dropdownRef = ref(null);
-    const overlay = useVueAnchoredOverlay({
-      enabled: isOpen,
-      referenceRef: triggerRef,
-      floatingRef: dropdownRef,
-      containerRef,
-      placement: "bottom-start",
-      offset: 4,
-      matchReferenceWidth: true,
-      dismissOnOutside: true,
-      dismissOnEscape: true,
-      restoreFocusOnDismiss: true,
-      onDismiss: closeDropdown
-    });
-    const expandedKeys = ref(
-      props.defaultExpandAll ? new Set(getAllTreeSelectKeys(props.treeData)) : /* @__PURE__ */ new Set()
-    );
-    const displayLabel = computed(() => getTreeSelectDisplayLabel(props.treeData, props.modelValue));
-    const showClearButton = computed(
-      () => props.clearable && !props.disabled && props.modelValue !== void 0 && (Array.isArray(props.modelValue) ? props.modelValue.length > 0 : props.modelValue !== "")
-    );
-    const matchedKeys = computed(() => {
-      if (!searchQuery.value) return null;
-      return filterTreeSelectNodes(props.treeData, searchQuery.value);
-    });
-    const effectiveExpandedKeys = computed(() => {
-      if (matchedKeys.value) {
-        return matchedKeys.value;
-      }
-      return expandedKeys.value;
-    });
-    const flatNodes = computed(
-      () => flattenTreeSelectNodes(props.treeData, effectiveExpandedKeys.value)
-    );
-    const visibleNodes = computed(() => {
-      if (!matchedKeys.value) return flatNodes.value;
-      return flatNodes.value.filter((f) => matchedKeys.value.has(f.node.key));
-    });
-    function openDropdown() {
-      if (props.disabled) return;
-      isOpen.value = true;
-    }
-    function closeDropdown() {
-      isOpen.value = false;
-      updateSearchValue("");
-    }
-    function updateSearchValue(value) {
-      if (props.searchValue === void 0) {
-        uncontrolledSearchValue.value = value;
-      }
-      emit("update:searchValue", value);
-      emit("search-change", value);
-    }
-    function toggleDropdown() {
-      if (isOpen.value) closeDropdown();
-      else openDropdown();
-    }
-    function toggleExpand(key) {
-      const next = new Set(expandedKeys.value);
-      if (next.has(key)) next.delete(key);
-      else next.add(key);
-      expandedKeys.value = next;
-    }
-    function isSelected(key) {
-      if (props.multiple && Array.isArray(props.modelValue)) {
-        return props.modelValue.includes(key);
-      }
-      return props.modelValue === key;
-    }
-    function handleNodeSelect(node) {
-      if (node.disabled) return;
-      if (props.multiple) {
-        const current = Array.isArray(props.modelValue) ? [...props.modelValue] : [];
-        const idx = current.indexOf(node.key);
-        if (idx >= 0) {
-          current.splice(idx, 1);
-        } else {
-          current.push(node.key);
-        }
-        emit("update:modelValue", current);
-        emit("change", current);
-      } else {
-        emit("update:modelValue", node.key);
-        emit("change", node.key);
-        closeDropdown();
-      }
-    }
-    function handleClear(e) {
-      e.stopPropagation();
-      const val = props.multiple ? [] : void 0;
-      emit("update:modelValue", val);
-      emit("change", val);
-    }
-    function handleKeyDown(e) {
-      const action = getPickerTriggerKeyAction(e.key, isOpen.value);
-      if (action === "none") return;
-      e.preventDefault();
-      if (action === "toggle") {
-        if (isOpen.value) closeDropdown();
-        else openDropdown();
-      } else if (action === "open") {
-        openDropdown();
-      } else if (action === "close") {
-        closeDropdown();
-      }
-    }
-    return () => {
-      const containerClasses = classNames(treeSelectBaseClasses, coerceClassValue(attrs.class));
-      return h("div", { ref: containerRef, class: containerClasses }, [
-        // Trigger
-        h(
-          "button",
-          {
-            ref: triggerRef,
-            type: "button",
-            class: getTreeSelectTriggerClasses(props.size, props.disabled, isOpen.value),
-            ...getPickerComboboxAria({ expanded: isOpen.value, listboxId }),
-            disabled: props.disabled,
-            onClick: toggleDropdown,
-            onKeydown: handleKeyDown
-          },
-          [
-            h(
-              "span",
-              {
-                class: classNames(
-                  "flex-1 truncate",
-                  !displayLabel.value ? "text-[var(--tiger-treeselect-placeholder,var(--tiger-text-muted,#9ca3af))]" : ""
-                )
-              },
-              displayLabel.value || props.placeholder
-            ),
-            // Clear or chevron
-            showClearButton.value ? h(
-              "span",
-              {
-                class: "absolute right-2 top-1/2 -translate-y-1/2 text-[var(--tiger-treeselect-clear,var(--tiger-text-muted,#9ca3af))] hover:text-[var(--tiger-treeselect-clear-hover,var(--tiger-text,#111827))]",
-                "aria-label": resolveLocaleText(
-                  "Clear selection",
-                  mergedLocale.value?.common?.clearText
-                ),
-                onClick: handleClear
-              },
-              [ClearIcon]
-            ) : h(
-              "span",
-              {
-                class: "absolute right-2 top-1/2 -translate-y-1/2 text-[var(--tiger-text-muted,#9ca3af)] pointer-events-none"
-              },
-              [ChevronDownIcon]
-            )
-          ]
-        ),
-        // Dropdown
-        isOpen.value ? renderVueOverlayTeleport(
-          h(
-            "div",
-            {
-              ref: dropdownRef,
-              ...getPickerListboxAria({ id: listboxId }),
-              class: classNames(treeSelectDropdownClasses, overlay.floatingClasses.value),
-              style: overlay.floatingStyles.value,
-              "data-positioned": overlay.positioned.value
-            },
-            [
-              // Search
-              props.searchable ? h("input", {
-                type: "text",
-                class: treeSelectSearchClasses,
-                placeholder: resolveLocaleText(
-                  "Search...",
-                  mergedLocale.value?.common?.searchPlaceholder
-                ),
-                value: searchQuery.value,
-                "aria-label": resolveLocaleText(
-                  "Search tree",
-                  mergedLocale.value?.common?.searchPlaceholder
-                ),
-                onInput: (e) => updateSearchValue(e.target.value)
-              }) : null,
-              // Tree nodes
-              visibleNodes.value.length > 0 ? visibleNodes.value.map((flatNode) => {
-                const { node, level, hasChildren, isExpanded } = flatNode;
-                const selected = isSelected(node.key);
-                const indent = level * 20;
-                return h(
-                  "div",
-                  {
-                    key: node.key,
-                    ...getPickerOptionAria({ selected, disabled: !!node.disabled }),
-                    class: getTreeSelectNodeClasses(selected, !!node.disabled, props.size),
-                    style: { paddingLeft: `${indent + 8}px` },
-                    onClick: (e) => {
-                      e.stopPropagation();
-                      handleNodeSelect(node);
-                    }
-                  },
-                  [
-                    // Expand toggle
-                    hasChildren ? h(
-                      "span",
-                      {
-                        class: classNames(
-                          "inline-flex items-center justify-center w-4 h-4 mr-1 transition-transform",
-                          isExpanded ? "rotate-90" : ""
-                        ),
-                        onClick: (e) => {
-                          e.stopPropagation();
-                          toggleExpand(node.key);
-                        }
-                      },
-                      [
-                        h(
-                          "svg",
-                          {
-                            class: "w-3 h-3",
-                            viewBox: icon20ViewBox,
-                            fill: "currentColor"
-                          },
-                          [
-                            h("path", {
-                              d: chevronRightSolidIcon20PathD,
-                              "fill-rule": "evenodd",
-                              "clip-rule": "evenodd"
-                            })
-                          ]
-                        )
-                      ]
-                    ) : h("span", { class: "w-4 mr-1" }),
-                    // Label
-                    h("span", { class: "flex-1 truncate" }, node.label)
-                  ]
-                );
-              }) : h(
-                "div",
-                { class: treeSelectEmptyClasses },
-                resolveLocaleText(
-                  "No data",
-                  props.emptyText,
-                  mergedLocale.value?.common?.emptyText
-                )
-              )
-            ]
-          ),
-          overlay.target.value
-        ) : null
-      ]);
-    };
-  }
-});
-var TreeSelect_default = TreeSelect;
-
-export {
-  TreeSelect,
-  TreeSelect_default
-};