lizaui 12.0.19 → 12.0.21

package/dist/tabs/index.cjs.js

@@ -0,0 +1,1400 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const compilerRuntime = require("react/compiler-runtime");
+const React = require("react");
+const useHasTabbableChild = require("../chunks/useHasTabbableChild-kl2T5gEX.js");
+const utils = require("../chunks/utils-DvHk9ofL.js");
+const SharedElementTransition = require("../chunks/SharedElementTransition-BSCoaphV.js");
+const filterDOMProps = require("../chunks/filterDOMProps-JgzPXl3Q.js");
+const useHover = require("../chunks/useHover-D9f9xyxz.js");
+const focusSafely = require("../chunks/focusSafely-CKxVSn6H.js");
+const useLabels = require("../chunks/useLabels-BiXnWBSL.js");
+const I18nProvider = require("../chunks/I18nProvider-BUfkOEhQ.js");
+const BaseCollection = require("../chunks/BaseCollection-DxI8p0cP.js");
+const Hidden = require("../chunks/Hidden-BY45Dc0j.js");
+const useControlledState = require("../chunks/useControlledState-DE_m1RML.js");
+const ReactDOM = require("react-dom");
+const tailwindVariants = require("tailwind-variants");
+const mergeRefs = require("../chunks/mergeRefs-Y9oG13yB.js");
+const scrollShadow = require("../scroll-shadow/index.cjs.js");
+class $f664a81d022446b5$export$d085fb9e920b5ca7 {
+  constructor(nodes) {
+    this.keyMap = /* @__PURE__ */ new Map();
+    this.firstKey = null;
+    this.lastKey = null;
+    this.iterable = nodes;
+    let visit = (node) => {
+      this.keyMap.set(node.key, node);
+      if (node.childNodes && node.type === "section") for (let child of node.childNodes) visit(child);
+    };
+    for (let node of nodes) visit(node);
+    let last = null;
+    let index = 0;
+    let size = 0;
+    for (let [key, node] of this.keyMap) {
+      if (last) {
+        last.nextKey = key;
+        node.prevKey = last.key;
+      } else {
+        this.firstKey = key;
+        node.prevKey = void 0;
+      }
+      if (node.type === "item") node.index = index++;
+      if (node.type === "section" || node.type === "item") size++;
+      last = node;
+      last.nextKey = void 0;
+    }
+    this._size = size;
+    this.lastKey = last?.key ?? null;
+  }
+  *[Symbol.iterator]() {
+    yield* this.iterable;
+  }
+  get size() {
+    return this._size;
+  }
+  getKeys() {
+    return this.keyMap.keys();
+  }
+  getKeyBefore(key) {
+    let node = this.keyMap.get(key);
+    return node ? node.prevKey ?? null : null;
+  }
+  getKeyAfter(key) {
+    let node = this.keyMap.get(key);
+    return node ? node.nextKey ?? null : null;
+  }
+  getFirstKey() {
+    return this.firstKey;
+  }
+  getLastKey() {
+    return this.lastKey;
+  }
+  getItem(key) {
+    return this.keyMap.get(key) ?? null;
+  }
+  at(idx) {
+    const keys = [
+      ...this.getKeys()
+    ];
+    return this.getItem(keys[idx]);
+  }
+  getChildren(key) {
+    let node = this.keyMap.get(key);
+    return node?.childNodes || [];
+  }
+}
+function $b14b6f590b50af39$export$2f645645f7bca764(props) {
+  let { filter, layoutDelegate } = props;
+  let selectionState = useHasTabbableChild.$60f19cefd567a3e4$export$253fe78d46329472(props);
+  let disabledKeys = React.useMemo(() => props.disabledKeys ? new Set(props.disabledKeys) : /* @__PURE__ */ new Set(), [
+    props.disabledKeys
+  ]);
+  let factory = React.useCallback((nodes) => filter ? new $f664a81d022446b5$export$d085fb9e920b5ca7(filter(nodes)) : new $f664a81d022446b5$export$d085fb9e920b5ca7(nodes), [
+    filter
+  ]);
+  let context = React.useMemo(() => ({
+    suppressTextValueWarning: props.suppressTextValueWarning
+  }), [
+    props.suppressTextValueWarning
+  ]);
+  let collection = useHasTabbableChild.$d03379b88399b8c5$export$6cd28814d92fa9c9(props, factory, context);
+  let selectionManager = React.useMemo(() => new useHasTabbableChild.$4a07ac835f260f78$export$6c8a5aaad13c9852(collection, selectionState, {
+    layoutDelegate
+  }), [
+    collection,
+    selectionState,
+    layoutDelegate
+  ]);
+  $b14b6f590b50af39$var$useFocusedKeyReset(collection, selectionManager);
+  return {
+    collection,
+    disabledKeys,
+    selectionManager
+  };
+}
+function $b14b6f590b50af39$var$useFocusedKeyReset(collection, selectionManager) {
+  const cachedCollection = React.useRef(null);
+  React.useEffect(() => {
+    if (selectionManager.focusedKey != null && !collection.getItem(selectionManager.focusedKey) && cachedCollection.current) {
+      let key = cachedCollection.current.getKeyAfter(selectionManager.focusedKey);
+      let nextFocusedKey = null;
+      while (key != null) {
+        let node = collection.getItem(key);
+        if (node && node.type === "item" && !selectionManager.isDisabled(key)) {
+          nextFocusedKey = key;
+          break;
+        }
+        key = cachedCollection.current.getKeyAfter(key);
+      }
+      if (nextFocusedKey == null) {
+        key = cachedCollection.current.getKeyBefore(selectionManager.focusedKey);
+        while (key != null) {
+          let node = collection.getItem(key);
+          if (node && node.type === "item" && !selectionManager.isDisabled(key)) {
+            nextFocusedKey = key;
+            break;
+          }
+          key = cachedCollection.current.getKeyBefore(key);
+        }
+      }
+      selectionManager.setFocusedKey(nextFocusedKey);
+    }
+    cachedCollection.current = collection;
+  }, [
+    collection,
+    selectionManager
+  ]);
+}
+function $fcc7165e876206c6$export$6d3443f2c48bfc20(ref, isReady = true, onEnter) {
+  let [isEntering, setEntering] = React.useState(true);
+  let isAnimationReady = isEntering && isReady;
+  utils.$c4867b2f328c2698$export$e5c5a5f917a5871c(() => {
+    if (!isReady && ref.current) return utils.$a4e76a5424781910$export$e08e3b67e392101e(focusSafely.$d447af545b77c9f1$export$37a5fde709c1db82(ref.current, "opacity", "0"), focusSafely.$d447af545b77c9f1$export$37a5fde709c1db82(ref.current, "clip", "rect(0 0 0 0)"), focusSafely.$d447af545b77c9f1$export$37a5fde709c1db82(ref.current, "clip-path", "inset(50%)"), focusSafely.$d447af545b77c9f1$export$37a5fde709c1db82(ref.current, "mask-image", "linear-gradient(#0000, #0000)"));
+  }, [
+    ref,
+    isReady
+  ]);
+  utils.$c4867b2f328c2698$export$e5c5a5f917a5871c(() => {
+    if (isAnimationReady && ref.current && "getAnimations" in ref.current) {
+      for (let animation of ref.current.getAnimations()) if (animation instanceof CSSTransition) animation.cancel();
+    }
+  }, [
+    ref,
+    isAnimationReady
+  ]);
+  $fcc7165e876206c6$var$useAnimation(ref, isAnimationReady, onEnter, React.useCallback(() => setEntering(false), []));
+  return isAnimationReady;
+}
+function $fcc7165e876206c6$export$45fda7c47f93fd48(ref, isOpen, onExit) {
+  let [exitState, setExitState] = React.useState(isOpen ? "open" : "closed");
+  switch (exitState) {
+    case "open":
+      if (!isOpen) setExitState("exiting");
+      break;
+    case "closed":
+    case "exiting":
+      if (isOpen) setExitState("open");
+      break;
+  }
+  let isExiting = exitState === "exiting";
+  $fcc7165e876206c6$var$useAnimation(ref, isExiting, onExit, React.useCallback(() => {
+    setExitState((state) => state === "exiting" ? "closed" : state);
+  }, []));
+  return isExiting;
+}
+function $fcc7165e876206c6$var$useAnimation(ref, isActive, onStart, onEnd) {
+  let isActiveRef = React.useRef(null);
+  let start = useHover.$fe16bffc7a557bf0$export$7f54fc3180508a52(onStart);
+  utils.$c4867b2f328c2698$export$e5c5a5f917a5871c(() => {
+    if (isActive && ref.current && isActiveRef.current !== isActive) {
+      isActiveRef.current = isActive;
+      if (!("getAnimations" in ref.current)) {
+        onEnd();
+        return;
+      }
+      let startPromise = start?.(ref.current);
+      let animations = ref.current.getAnimations().filter((a) => (typeof DocumentTimeline === "undefined" || a.timeline instanceof DocumentTimeline) && a.playState === "running");
+      if (animations.length === 0 && !startPromise) {
+        onEnd();
+        return;
+      }
+      Promise.all([
+        startPromise,
+        ...animations.map((a) => a.finished)
+      ]).then(() => {
+        ReactDOM.flushSync(() => {
+          onEnd();
+        });
+      }).catch(() => {
+      });
+    }
+    isActiveRef.current = isActive;
+  }, [
+    ref,
+    isActive,
+    onEnd
+  ]);
+}
+const $a251981b23baaa12$export$c5f62239608282b6 = /* @__PURE__ */ new WeakMap();
+function $a251981b23baaa12$export$567fc7097e064344(state, key, role) {
+  if (!state)
+    return "";
+  if (typeof key === "string") key = key.replace(/\s+/g, "");
+  let baseId = $a251981b23baaa12$export$c5f62239608282b6.get(state);
+  if (process.env.NODE_ENV !== "production" && !baseId) ;
+  return `${baseId}-${role}-${key}`;
+}
+function $1b6fa05bad3d7740$export$fdf4756d5b8ef90a(props, state, ref) {
+  let { key, isDisabled: propsDisabled, shouldSelectOnPressUp } = props;
+  let { selectionManager: manager, selectedKey } = state;
+  let isSelected = key === selectedKey;
+  let isDisabled = propsDisabled || state.isDisabled || state.selectionManager.isDisabled(key);
+  let item = state.collection.getItem(key);
+  let { itemProps, isPressed } = useHasTabbableChild.$f6ba6936bfd098a0$export$ecf600387e221c37({
+    selectionManager: manager,
+    key,
+    ref,
+    isDisabled,
+    // Link tabs should behave like native anchors (navigate on press up)
+    // This avoids reopening beforeunload dialogs when browsers replay
+    // queued pointer enter/leave events after cancellation.
+    shouldSelectOnPressUp: shouldSelectOnPressUp ?? item?.props.href != null,
+    linkBehavior: "selection"
+  });
+  let tabId = $a251981b23baaa12$export$567fc7097e064344(state, key, "tab");
+  let tabPanelId = $a251981b23baaa12$export$567fc7097e064344(state, key, "tabpanel");
+  let { tabIndex } = itemProps;
+  let domProps = filterDOMProps.$8e9d2fae0ecb9001$export$457c3d6518dd4c6f(item?.props, {
+    labelable: true
+  });
+  delete domProps.id;
+  let linkProps = focusSafely.$caaf0dd3060ed57c$export$7e924b3091a3bd18(item?.props);
+  let { focusableProps } = useHover.$d1116acdf220c2da$export$4c014de7c8940b4c({
+    ...item?.props,
+    isDisabled
+  }, ref);
+  return {
+    tabProps: utils.$bbaa08b3cd72f041$export$9d1611c77c2fe928(domProps, focusableProps, linkProps, itemProps, {
+      id: tabId,
+      "aria-selected": isSelected,
+      "aria-disabled": isDisabled || void 0,
+      "aria-controls": isSelected ? tabPanelId : void 0,
+      tabIndex: isDisabled ? void 0 : tabIndex,
+      role: "tab"
+    }),
+    isSelected,
+    isDisabled,
+    isPressed
+  };
+}
+function $7d951241dadd72e4$export$fae0121b5afe572d(props, state, ref) {
+  let tabIndex = useHasTabbableChild.$bf14c9739fda2eb3$export$eac1895992b9f3d6(ref) ? void 0 : 0;
+  const id = $a251981b23baaa12$export$567fc7097e064344(state, props.id ?? state?.selectedKey, "tabpanel");
+  const tabPanelProps = useLabels.$e8ac3c3f5d4bae7f$export$d6875122194c7b44({
+    ...props,
+    id,
+    "aria-labelledby": $a251981b23baaa12$export$567fc7097e064344(state, state?.selectedKey, "tab")
+  });
+  return {
+    tabPanelProps: utils.$bbaa08b3cd72f041$export$9d1611c77c2fe928(tabPanelProps, {
+      tabIndex,
+      role: "tabpanel",
+      "aria-describedby": props["aria-describedby"],
+      "aria-details": props["aria-details"]
+    })
+  };
+}
+class $a226bee26c88efd7$export$15010ca3c1abe90b {
+  constructor(collection, direction, orientation, disabledKeys = /* @__PURE__ */ new Set()) {
+    this.collection = collection;
+    this.flipDirection = direction === "rtl";
+    this.disabledKeys = disabledKeys;
+    this.tabDirection = orientation === "horizontal";
+  }
+  getKeyLeftOf(key) {
+    if (this.flipDirection) return this.getNextKey(key);
+    return this.getPreviousKey(key);
+  }
+  getKeyRightOf(key) {
+    if (this.flipDirection) return this.getPreviousKey(key);
+    return this.getNextKey(key);
+  }
+  isDisabled(key) {
+    return this.disabledKeys.has(key) || !!this.collection.getItem(key)?.props?.isDisabled;
+  }
+  getFirstKey() {
+    let key = this.collection.getFirstKey();
+    if (key != null && this.isDisabled(key)) key = this.getNextKey(key);
+    return key;
+  }
+  getLastKey() {
+    let key = this.collection.getLastKey();
+    if (key != null && this.isDisabled(key)) key = this.getPreviousKey(key);
+    return key;
+  }
+  getKeyAbove(key) {
+    if (this.tabDirection) return null;
+    return this.getPreviousKey(key);
+  }
+  getKeyBelow(key) {
+    if (this.tabDirection) return null;
+    return this.getNextKey(key);
+  }
+  getNextKey(startKey) {
+    let key = startKey;
+    do {
+      key = this.collection.getKeyAfter(key);
+      if (key == null) key = this.collection.getFirstKey();
+    } while (key != null && this.isDisabled(key) && key !== startKey);
+    return key;
+  }
+  getPreviousKey(startKey) {
+    let key = startKey;
+    do {
+      key = this.collection.getKeyBefore(key);
+      if (key == null) key = this.collection.getLastKey();
+    } while (key != null && this.isDisabled(key) && key !== startKey);
+    return key;
+  }
+}
+function $83428e53deb13caf$export$773e389e644c5874(props, state, ref) {
+  let { orientation = "horizontal", keyboardActivation = "automatic" } = props;
+  let { collection, selectionManager: manager, disabledKeys } = state;
+  let { direction } = I18nProvider.$2eb8e6d23f3d0cb0$export$43bb16f9c6d9e3f7();
+  let delegate = React.useMemo(() => new $a226bee26c88efd7$export$15010ca3c1abe90b(collection, direction, orientation, disabledKeys), [
+    collection,
+    disabledKeys,
+    orientation,
+    direction
+  ]);
+  let { collectionProps } = useHasTabbableChild.$d667c2af82d35a98$export$d6daf82dcd84e87c({
+    ref,
+    selectionManager: manager,
+    keyboardDelegate: delegate,
+    selectOnFocus: keyboardActivation === "automatic",
+    disallowEmptySelection: true,
+    scrollRef: ref,
+    linkBehavior: "selection"
+  });
+  let tabsId = utils.$390e54f620492c70$export$f680877a34711e37();
+  $a251981b23baaa12$export$c5f62239608282b6.set(state, tabsId);
+  let tabListLabelProps = useLabels.$e8ac3c3f5d4bae7f$export$d6875122194c7b44({
+    ...props,
+    id: tabsId
+  });
+  return {
+    tabListProps: {
+      ...utils.$bbaa08b3cd72f041$export$9d1611c77c2fe928(collectionProps, tabListLabelProps),
+      role: "tablist",
+      "aria-orientation": orientation,
+      tabIndex: void 0
+    }
+  };
+}
+function $0fdb127d377ffd84$export$e7f05e985daf4b5f(props) {
+  let [selectedKey, setSelectedKey] = useControlledState.$3e6197669829fe11$export$40bfa8c7b0832715(props.selectedKey, props.defaultSelectedKey ?? null, props.onSelectionChange);
+  let selectedKeys = React.useMemo(() => selectedKey != null ? [
+    selectedKey
+  ] : [], [
+    selectedKey
+  ]);
+  let { collection, disabledKeys, selectionManager } = $b14b6f590b50af39$export$2f645645f7bca764({
+    ...props,
+    selectionMode: "single",
+    disallowEmptySelection: true,
+    allowDuplicateSelectionEvents: true,
+    selectedKeys,
+    onSelectionChange: (keys) => {
+      if (keys === "all") return;
+      let key = keys.values().next().value ?? null;
+      if (key === selectedKey && props.onSelectionChange) props.onSelectionChange(key);
+      setSelectedKey(key);
+    }
+  });
+  let selectedItem = selectedKey != null ? collection.getItem(selectedKey) : null;
+  return {
+    collection,
+    disabledKeys,
+    selectionManager,
+    selectedKey,
+    setSelectedKey,
+    selectedItem
+  };
+}
+function $caeb030f09a278a1$export$4ba071daf4e486(props) {
+  let state = $0fdb127d377ffd84$export$e7f05e985daf4b5f({
+    ...props,
+    onSelectionChange: props.onSelectionChange ? (key) => {
+      if (key != null) props.onSelectionChange?.(key);
+    } : void 0,
+    suppressTextValueWarning: true,
+    defaultSelectedKey: props.defaultSelectedKey ?? $caeb030f09a278a1$var$findDefaultSelectedKey(props.collection, props.disabledKeys ? new Set(props.disabledKeys) : /* @__PURE__ */ new Set()) ?? void 0
+  });
+  let { selectionManager, collection, selectedKey: currentSelectedKey } = state;
+  let lastSelectedKey = React.useRef(currentSelectedKey);
+  React.useEffect(() => {
+    let selectedKey = currentSelectedKey;
+    if (props.selectedKey == null && (selectionManager.isEmpty || selectedKey == null || !collection.getItem(selectedKey))) {
+      selectedKey = $caeb030f09a278a1$var$findDefaultSelectedKey(collection, state.disabledKeys);
+      if (selectedKey != null)
+        selectionManager.setSelectedKeys([
+          selectedKey
+        ]);
+    }
+    if (selectedKey != null && selectionManager.focusedKey == null || !selectionManager.isFocused && selectedKey !== lastSelectedKey.current) selectionManager.setFocusedKey(selectedKey);
+    lastSelectedKey.current = selectedKey;
+  });
+  return {
+    ...state,
+    isDisabled: props.isDisabled || false
+  };
+}
+function $caeb030f09a278a1$var$findDefaultSelectedKey(collection, disabledKeys) {
+  let selectedKey = null;
+  if (collection) {
+    selectedKey = collection.getFirstKey();
+    while (selectedKey != null && (disabledKeys.has(selectedKey) || collection.getItem(selectedKey)?.props?.isDisabled) && selectedKey !== collection.getLastKey()) selectedKey = collection.getKeyAfter(selectedKey);
+    if (selectedKey != null && (disabledKeys.has(selectedKey) || collection.getItem(selectedKey)?.props?.isDisabled) && selectedKey === collection.getLastKey()) selectedKey = collection.getFirstKey();
+  }
+  return selectedKey;
+}
+const $b4f18e3395fe64d7$export$cfa7aa87c26e7d1f = /* @__PURE__ */ React.createContext(null);
+const $b4f18e3395fe64d7$export$364712098d2aa57c = /* @__PURE__ */ React.createContext(null);
+const $b4f18e3395fe64d7$export$b2539bed5023c21c = /* @__PURE__ */ React.forwardRef(function Tabs(props, ref) {
+  [props, ref] = utils.$7230ffa83bc0c2cf$export$29f1550f4b0d4415(props, ref, $b4f18e3395fe64d7$export$cfa7aa87c26e7d1f);
+  let { children, orientation = "horizontal" } = props;
+  children = React.useMemo(() => typeof children === "function" ? children({
+    orientation,
+    defaultChildren: null
+  }) : children, [
+    children,
+    orientation
+  ]);
+  return /* @__PURE__ */ React.createElement(useHasTabbableChild.$42ceafc619f9c3ba$export$bf788dd355e3a401, {
+    content: children
+  }, (collection) => /* @__PURE__ */ React.createElement($b4f18e3395fe64d7$var$TabsInner, {
+    props,
+    collection,
+    tabsRef: ref
+  }));
+});
+function $b4f18e3395fe64d7$var$TabsInner({ props, tabsRef: ref, collection }) {
+  let { orientation = "horizontal" } = props;
+  let state = $caeb030f09a278a1$export$4ba071daf4e486({
+    ...props,
+    collection,
+    children: void 0
+  });
+  let { focusProps, isFocused, isFocusVisible } = useHover.$0c4a58759813079a$export$4e328f61c538687f({
+    within: true
+  });
+  let values = React.useMemo(() => ({
+    orientation,
+    isFocusWithin: isFocused,
+    isFocusVisible
+  }), [
+    orientation,
+    isFocused,
+    isFocusVisible
+  ]);
+  let renderProps = utils.$7230ffa83bc0c2cf$export$4d86445c2cf5e3({
+    ...props,
+    defaultClassName: "react-aria-Tabs",
+    values
+  });
+  let DOMProps = filterDOMProps.$8e9d2fae0ecb9001$export$457c3d6518dd4c6f(props, {
+    global: true
+  });
+  return /* @__PURE__ */ React.createElement(utils.$7230ffa83bc0c2cf$export$df3a06d6289f983e.div, {
+    ...utils.$bbaa08b3cd72f041$export$9d1611c77c2fe928(DOMProps, renderProps, focusProps),
+    ref,
+    slot: props.slot || void 0,
+    "data-focused": isFocused || void 0,
+    "data-orientation": orientation,
+    "data-focus-visible": isFocusVisible || void 0,
+    "data-disabled": state.isDisabled || void 0
+  }, /* @__PURE__ */ React.createElement(utils.$7230ffa83bc0c2cf$export$2881499e37b75b9a, {
+    values: [
+      [
+        $b4f18e3395fe64d7$export$cfa7aa87c26e7d1f,
+        props
+      ],
+      [
+        $b4f18e3395fe64d7$export$364712098d2aa57c,
+        state
+      ]
+    ]
+  }, renderProps.children));
+}
+const $b4f18e3395fe64d7$export$e51a686c67fdaa2d = /* @__PURE__ */ React.forwardRef(function TabList(props, ref) {
+  let state = React.useContext($b4f18e3395fe64d7$export$364712098d2aa57c);
+  return state ? /* @__PURE__ */ React.createElement($b4f18e3395fe64d7$var$TabListInner, {
+    props,
+    forwardedRef: ref
+  }) : /* @__PURE__ */ React.createElement(useHasTabbableChild.$42ceafc619f9c3ba$export$fb8073518f34e6ec, props);
+});
+function $b4f18e3395fe64d7$var$TabListInner({ props, forwardedRef: ref }) {
+  let state = React.useContext($b4f18e3395fe64d7$export$364712098d2aa57c);
+  let { CollectionRoot } = React.useContext(useHasTabbableChild.$263ab7fc0f95ccdb$export$4feb769f8ddf26c5);
+  let { orientation = "horizontal", keyboardActivation = "automatic" } = utils.$7230ffa83bc0c2cf$export$fabf2dc03a41866e($b4f18e3395fe64d7$export$cfa7aa87c26e7d1f);
+  let objectRef = utils.$03e8ab2d84d7657a$export$4338b53315abf666(ref);
+  let { tabListProps } = $83428e53deb13caf$export$773e389e644c5874({
+    ...props,
+    orientation,
+    keyboardActivation
+  }, state, objectRef);
+  let renderProps = utils.$7230ffa83bc0c2cf$export$4d86445c2cf5e3({
+    ...props,
+    children: null,
+    defaultClassName: "react-aria-TabList",
+    values: {
+      orientation,
+      state
+    }
+  });
+  let DOMProps = filterDOMProps.$8e9d2fae0ecb9001$export$457c3d6518dd4c6f(props, {
+    global: true
+  });
+  delete DOMProps.id;
+  return /* @__PURE__ */ React.createElement(utils.$7230ffa83bc0c2cf$export$df3a06d6289f983e.div, {
+    ...utils.$bbaa08b3cd72f041$export$9d1611c77c2fe928(DOMProps, renderProps, tabListProps),
+    ref: objectRef,
+    "data-orientation": orientation || void 0
+  }, /* @__PURE__ */ React.createElement(SharedElementTransition.$792f28e438b9ad5f$export$758399f318e6385a, null, /* @__PURE__ */ React.createElement(CollectionRoot, {
+    collection: state.collection,
+    persistedKeys: useHasTabbableChild.$263ab7fc0f95ccdb$export$90e00781bc59d8f9(state.selectionManager.focusedKey)
+  })));
+}
+const _$b4f18e3395fe64d7$var$TabItemNode = class _$b4f18e3395fe64d7$var$TabItemNode extends BaseCollection.$6f0c29017aeec335$export$d68d59712b04d9d1 {
+};
+_$b4f18e3395fe64d7$var$TabItemNode.type = "item";
+let $b4f18e3395fe64d7$var$TabItemNode = _$b4f18e3395fe64d7$var$TabItemNode;
+const $b4f18e3395fe64d7$export$3e41faf802a29e71 = /* @__PURE__ */ useHasTabbableChild.$42ceafc619f9c3ba$export$18af5c7a9e9b3664($b4f18e3395fe64d7$var$TabItemNode, (props, forwardedRef, item) => {
+  let state = React.useContext($b4f18e3395fe64d7$export$364712098d2aa57c);
+  let ref = utils.$03e8ab2d84d7657a$export$4338b53315abf666(forwardedRef);
+  let { tabProps, isSelected, isDisabled, isPressed } = $1b6fa05bad3d7740$export$fdf4756d5b8ef90a({
+    key: item.key,
+    ...props
+  }, state, ref);
+  let { focusProps, isFocused, isFocusVisible } = useHover.$0c4a58759813079a$export$4e328f61c538687f();
+  let { hoverProps, isHovered } = useHover.$e969f22b6713ca4a$export$ae780daf29e6d456({
+    isDisabled,
+    onHoverStart: props.onHoverStart,
+    onHoverEnd: props.onHoverEnd,
+    onHoverChange: props.onHoverChange
+  });
+  let renderProps = utils.$7230ffa83bc0c2cf$export$4d86445c2cf5e3({
+    ...props,
+    id: void 0,
+    children: item.rendered,
+    defaultClassName: "react-aria-Tab",
+    values: {
+      isSelected,
+      isDisabled,
+      isFocused,
+      isFocusVisible,
+      isPressed,
+      isHovered
+    }
+  });
+  let ElementType = item.props.href ? utils.$7230ffa83bc0c2cf$export$df3a06d6289f983e.a : utils.$7230ffa83bc0c2cf$export$df3a06d6289f983e.div;
+  let DOMProps = filterDOMProps.$8e9d2fae0ecb9001$export$457c3d6518dd4c6f(props, {
+    global: true
+  });
+  delete DOMProps.id;
+  delete DOMProps.onClick;
+  return /* @__PURE__ */ React.createElement(ElementType, {
+    ...utils.$bbaa08b3cd72f041$export$9d1611c77c2fe928(DOMProps, renderProps, tabProps, focusProps, hoverProps),
+    ref,
+    "data-selected": isSelected || void 0,
+    "data-disabled": isDisabled || void 0,
+    "data-focused": isFocused || void 0,
+    "data-focus-visible": isFocusVisible || void 0,
+    "data-pressed": isPressed || void 0,
+    "data-hovered": isHovered || void 0
+  }, /* @__PURE__ */ React.createElement(useHasTabbableChild.$91fe5e721c7f36c1$export$c9549807523555e0.Provider, {
+    value: {
+      isSelected
+    }
+  }, renderProps.children));
+});
+const $b4f18e3395fe64d7$export$3d96ec278d3efce4 = /* @__PURE__ */ Hidden.$d7f64c32b702fe2c$export$86427a43e3e48ebb(function TabPanel(props, forwardedRef) {
+  const state = React.useContext($b4f18e3395fe64d7$export$364712098d2aa57c);
+  let ref = utils.$03e8ab2d84d7657a$export$4338b53315abf666(forwardedRef);
+  let isSelected = state.selectedKey === props.id;
+  let [isInitiallySelected, setInitiallySelected] = React.useState(state.selectedKey != null ? isSelected : null);
+  if (isInitiallySelected == null && state.selectedKey != null) setInitiallySelected(isSelected);
+  else if (!isSelected && isInitiallySelected) setInitiallySelected(false);
+  let isExiting = $fcc7165e876206c6$export$45fda7c47f93fd48(ref, isSelected);
+  if (!isSelected && !props.shouldForceMount && !isExiting) return null;
+  return /* @__PURE__ */ React.createElement($b4f18e3395fe64d7$var$TabPanelInner, {
+    ...props,
+    tabPanelRef: ref,
+    isInitiallySelected: isInitiallySelected || false,
+    isExiting
+  });
+});
+function $b4f18e3395fe64d7$var$TabPanelInner(props) {
+  let state = React.useContext($b4f18e3395fe64d7$export$364712098d2aa57c);
+  let { id, tabPanelRef: ref, isInitiallySelected, isExiting, ...otherProps } = props;
+  let { tabPanelProps } = $7d951241dadd72e4$export$fae0121b5afe572d(props, state, ref);
+  let { focusProps, isFocused, isFocusVisible } = useHover.$0c4a58759813079a$export$4e328f61c538687f();
+  let isSelected = state.selectedKey === props.id;
+  let isEntering = $fcc7165e876206c6$export$6d3443f2c48bfc20(ref) && !isInitiallySelected;
+  let renderProps = utils.$7230ffa83bc0c2cf$export$4d86445c2cf5e3({
+    ...props,
+    defaultClassName: "react-aria-TabPanel",
+    values: {
+      isFocused,
+      isFocusVisible,
+      // @ts-ignore - compatibility with React < 19
+      isInert: useHasTabbableChild.$b24d1bc31a0f941d$export$a9d04c5684123369(!isSelected),
+      isEntering,
+      isExiting,
+      state
+    }
+  });
+  let DOMProps = filterDOMProps.$8e9d2fae0ecb9001$export$457c3d6518dd4c6f(otherProps, {
+    global: true
+  });
+  delete DOMProps.id;
+  let domProps = isSelected ? utils.$bbaa08b3cd72f041$export$9d1611c77c2fe928(DOMProps, tabPanelProps, focusProps, renderProps) : utils.$bbaa08b3cd72f041$export$9d1611c77c2fe928(DOMProps, renderProps);
+  return /* @__PURE__ */ React.createElement(utils.$7230ffa83bc0c2cf$export$df3a06d6289f983e.div, {
+    ...domProps,
+    ref,
+    "data-focused": isFocused || void 0,
+    "data-focus-visible": isFocusVisible || void 0,
+    // @ts-ignore
+    inert: useHasTabbableChild.$b24d1bc31a0f941d$export$a9d04c5684123369(!isSelected || props.inert),
+    "data-inert": !isSelected ? "true" : void 0,
+    "data-entering": isEntering || void 0,
+    "data-exiting": isExiting || void 0
+  }, /* @__PURE__ */ React.createElement(utils.$7230ffa83bc0c2cf$export$2881499e37b75b9a, {
+    values: [
+      [
+        $b4f18e3395fe64d7$export$cfa7aa87c26e7d1f,
+        null
+      ],
+      [
+        $b4f18e3395fe64d7$export$364712098d2aa57c,
+        null
+      ]
+    ]
+  }, /* @__PURE__ */ React.createElement(useHasTabbableChild.$263ab7fc0f95ccdb$export$4feb769f8ddf26c5.Provider, {
+    value: useHasTabbableChild.$263ab7fc0f95ccdb$export$a164736487e3f0ae
+  }, renderProps.children)));
+}
+const tabsVariants = tailwindVariants.tv({
+  defaultVariants: {
+    align: "center",
+    variant: "primary"
+  },
+  slots: {
+    base: "tabs",
+    scrollNext: "tabs__list-container__scroll-next",
+    scrollPrev: "tabs__list-container__scroll-prev",
+    scroller: "tabs__list-container__scroller",
+    separator: "tabs__separator",
+    tab: "tabs__tab",
+    tabIndicator: "tabs__indicator",
+    tabList: "tabs__list",
+    tabListContainer: "tabs__list-container",
+    tabPanel: "tabs__panel"
+  },
+  variants: {
+    align: {
+      center: {},
+      // No class as the base already centers tab content
+      end: {
+        base: "tabs--align-end"
+      },
+      start: {
+        base: "tabs--align-start"
+      }
+    },
+    variant: {
+      primary: {},
+      secondary: {
+        base: "tabs--secondary"
+      }
+    }
+  }
+});
+const colors = {
+  blue: "\x1B[34m",
+  green: "\x1B[32m",
+  magenta: "\x1B[35m",
+  red: "\x1B[31m",
+  reset: "\x1B[0m",
+  yellow: "\x1B[33m"
+};
+const levelColors = {
+  debug: colors.magenta,
+  error: colors.red,
+  info: colors.blue,
+  success: colors.green,
+  warn: colors.yellow
+};
+const levelEmojis = {
+  debug: "🔍",
+  error: "❌",
+  info: "ℹ️",
+  success: "✅",
+  warn: "⚠️"
+};
+class Logger {
+  enabled;
+  prefix;
+  constructor(options = {}) {
+    this.enabled = options.enabled ?? true;
+    this.prefix = options.prefix ?? "HeroUI";
+  }
+  formatMessage(level, message) {
+    const color = levelColors[level];
+    const emoji = levelEmojis[level];
+    return `${color}[${this.prefix}]${colors.reset} ${emoji}  ${message}`;
+  }
+  log(level, message, ...args) {
+    if (!this.enabled) return;
+    this.formatMessage(level, message);
+  }
+  info(message, ...args) {
+    this.log("info", message, ...args);
+  }
+  success(message, ...args) {
+    this.log("success", message, ...args);
+  }
+  warn(message, ...args) {
+    this.log("warn", message, ...args);
+  }
+  error(message, ...args) {
+    this.log("error", message, ...args);
+  }
+  debug(message, ...args) {
+    this.log("debug", message, ...args);
+  }
+  divider(char = "=", length = 80) {
+    if (!this.enabled) return;
+  }
+  newline() {
+    if (!this.enabled) return;
+  }
+}
+const logger = new Logger({
+  prefix: "LizaUI"
+});
+let registry;
+const __DEV__ = typeof process !== "undefined" && process.env?.["NODE_ENV"] !== "production";
+const createCollectionSlot = (name) => {
+  if (__DEV__) {
+    registry ??= /* @__PURE__ */ new Set();
+    if (registry.has(name)) {
+      logger.warn(`Duplicate collection slot "${name}". Use a unique, namespaced name (e.g. "tabs.listContainer", "menu.popover").`);
+    }
+    registry.add(name);
+  }
+  const key = `$$heroui.collection.${name}`;
+  const SlotContext = React.createContext(void 0);
+  const inject = (children, value) => {
+    return React.Children.map(children, (child) => {
+      if (!React.isValidElement(child)) {
+        return child;
+      }
+      return React.cloneElement(child, {
+        [key]: value
+      });
+    });
+  };
+  const consume = (props) => {
+    const {
+      [key]: injected,
+      ...rest
+    } = props;
+    return [injected, rest];
+  };
+  const useSlot = (props) => {
+    const $ = compilerRuntime.c(5);
+    let t0;
+    if ($[0] !== props) {
+      t0 = consume(props);
+      $[0] = props;
+      $[1] = t0;
+    } else {
+      t0 = $[1];
+    }
+    const [fromProps, rest] = t0;
+    const fromContext = React.useContext(SlotContext);
+    const t1 = fromProps ?? fromContext;
+    let t2;
+    if ($[2] !== rest || $[3] !== t1) {
+      t2 = [t1, rest];
+      $[2] = rest;
+      $[3] = t1;
+      $[4] = t2;
+    } else {
+      t2 = $[4];
+    }
+    return t2;
+  };
+  const Injector = (t0) => {
+    const $ = compilerRuntime.c(8);
+    let T0;
+    let t1;
+    let t2;
+    if ($[0] !== t0) {
+      const {
+        children,
+        ...value
+      } = t0;
+      T0 = SlotContext.Provider;
+      t1 = value;
+      t2 = inject(children, value);
+      $[0] = t0;
+      $[1] = T0;
+      $[2] = t1;
+      $[3] = t2;
+    } else {
+      T0 = $[1];
+      t1 = $[2];
+      t2 = $[3];
+    }
+    let t3;
+    if ($[4] !== T0 || $[5] !== t1 || $[6] !== t2) {
+      t3 = /* @__PURE__ */ jsxRuntime.jsx(T0, { value: t1, children: t2 });
+      $[4] = T0;
+      $[5] = t1;
+      $[6] = t2;
+      $[7] = t3;
+    } else {
+      t3 = $[7];
+    }
+    return t3;
+  };
+  Injector.displayName = `HeroUI.CollectionSlot(${name})`;
+  const withSlot = (Primitive, defaultRender) => {
+    const Wrapped = React.forwardRef(function CollectionSlotTarget(props, forwardedRef) {
+      const [injected, rest] = useSlot(props);
+      const {
+        children,
+        ...restProps
+      } = rest;
+      if (!injected) {
+        return /* @__PURE__ */ jsxRuntime.jsx(Primitive, { ...restProps, ref: forwardedRef, children });
+      }
+      if (defaultRender) {
+        return defaultRender({
+          ...restProps,
+          children
+        }, injected, forwardedRef);
+      }
+      const {
+        className: containerClassName,
+        render: customRender,
+        ...containerRest
+      } = injected;
+      return /* @__PURE__ */ jsxRuntime.jsx(Primitive, { ...restProps, ref: forwardedRef, children: customRender ? customRender({
+        children,
+        className: containerClassName,
+        ...containerRest
+      }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: containerClassName, "data-slot": `${name}-container`, ...containerRest, children }) });
+    });
+    Wrapped.displayName = `HeroUI.withCollectionSlot(${Primitive.displayName || Primitive.name || name})`;
+    return Wrapped;
+  };
+  return {
+    key,
+    inject,
+    consume,
+    useSlot,
+    Injector,
+    withSlot,
+    Context: SlotContext
+  };
+};
+function composeTwRenderProps(className, tailwind) {
+  return utils.$7230ffa83bc0c2cf$export$c245e6201fed2f75(className, (className2, renderProps) => {
+    const tw = typeof tailwind === "function" ? tailwind(renderProps) ?? "" : tailwind ?? "";
+    const cls = className2 ?? "";
+    return tailwindVariants.cx(tw, cls) ?? "";
+  });
+}
+const composeSlotClassName = (slotFn, className, variants) => {
+  return typeof slotFn === "function" ? slotFn({
+    ...{},
+    className
+  }) : className;
+};
+function DOMElement(ElementType, props) {
+  const {
+    ref: forwardedRef,
+    render,
+    ...otherProps
+  } = props;
+  const elementRef = React.useRef(null);
+  const ref = React.useMemo(() => mergeRefs.$4064df0d6f9620e1$export$c9058316764c140e(forwardedRef, elementRef), [forwardedRef, elementRef]);
+  utils.$c4867b2f328c2698$export$e5c5a5f917a5871c(() => {
+    if (typeof process !== "undefined" && process.env?.["NODE_ENV"] !== "production" && render) {
+      if (!elementRef.current) ;
+    }
+  }, [ElementType, render]);
+  const domProps = {
+    ...otherProps,
+    ref
+  };
+  if (render) {
+    return render(domProps, void 0);
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(ElementType, { ...domProps });
+}
+const domComponentCache = {};
+const dom = new Proxy({}, {
+  get(_target, elementType) {
+    if (typeof elementType !== "string") {
+      return void 0;
+    }
+    let res = domComponentCache[elementType];
+    if (!res) {
+      res = DOMElement.bind(null, elementType);
+      domComponentCache[elementType] = res;
+    }
+    return res;
+  }
+});
+const IconChevronDown = (props) => {
+  const $ = compilerRuntime.c(3);
+  let t0;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t0 = /* @__PURE__ */ jsxRuntime.jsx("path", { clipRule: "evenodd", d: "M2.97 5.47a.75.75 0 0 1 1.06 0L8 9.44l3.97-3.97a.75.75 0 1 1 1.06 1.06l-4.5 4.5a.75.75 0 0 1-1.06 0l-4.5-4.5a.75.75 0 0 1 0-1.06", fill: "currentColor", fillRule: "evenodd" });
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+  let t1;
+  if ($[1] !== props) {
+    t1 = /* @__PURE__ */ jsxRuntime.jsx("svg", { "aria-hidden": "true", fill: "none", height: 16, role: "presentation", viewBox: "0 0 16 16", width: 16, xmlns: "http://www.w3.org/2000/svg", ...props, children: t0 });
+    $[1] = props;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  return t1;
+};
+const IconChevronUp = (props) => {
+  const $ = compilerRuntime.c(3);
+  let t0;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t0 = /* @__PURE__ */ jsxRuntime.jsx("path", { clipRule: "evenodd", d: "M13.03 10.53a.75.75 0 0 1-1.06 0L8 6.56l-3.97 3.97a.75.75 0 0 1-1.06-1.06l4.5-4.5a.75.75 0 0 1 1.06 0l4.5 4.5a.75.75 0 0 1 0 1.06", fill: "currentColor", fillRule: "evenodd" });
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+  let t1;
+  if ($[1] !== props) {
+    t1 = /* @__PURE__ */ jsxRuntime.jsx("svg", { "aria-hidden": "true", fill: "none", height: 16, role: "presentation", viewBox: "0 0 16 16", width: 16, xmlns: "http://www.w3.org/2000/svg", ...props, children: t0 });
+    $[1] = props;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  return t1;
+};
+const IconChevronLeft = (props) => {
+  const $ = compilerRuntime.c(3);
+  let t0;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t0 = /* @__PURE__ */ jsxRuntime.jsx("path", { clipRule: "evenodd", d: "M10.53 2.97a.75.75 0 0 1 0 1.06L6.56 8l3.97 3.97a.75.75 0 1 1-1.06 1.06l-4.5-4.5a.75.75 0 0 1 0-1.06l4.5-4.5a.75.75 0 0 1 1.06 0", fill: "currentColor", fillRule: "evenodd" });
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+  let t1;
+  if ($[1] !== props) {
+    t1 = /* @__PURE__ */ jsxRuntime.jsx("svg", { "aria-hidden": "true", fill: "none", height: 16, role: "presentation", viewBox: "0 0 16 16", width: 16, xmlns: "http://www.w3.org/2000/svg", ...props, children: t0 });
+    $[1] = props;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  return t1;
+};
+const IconChevronRight = (props) => {
+  const $ = compilerRuntime.c(3);
+  let t0;
+  if ($[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
+    t0 = /* @__PURE__ */ jsxRuntime.jsx("path", { clipRule: "evenodd", d: "M5.47 2.97a.75.75 0 0 1 1.06 0l4.5 4.5a.75.75 0 0 1 0 1.06l-4.5 4.5a.75.75 0 1 1-1.06-1.06L9.44 8 5.47 4.03a.75.75 0 0 1 0-1.06Z", fill: "currentColor", fillRule: "evenodd" });
+    $[0] = t0;
+  } else {
+    t0 = $[0];
+  }
+  let t1;
+  if ($[1] !== props) {
+    t1 = /* @__PURE__ */ jsxRuntime.jsx("svg", { "aria-hidden": "true", fill: "none", height: 16, role: "presentation", viewBox: "0 0 16 16", width: 16, xmlns: "http://www.w3.org/2000/svg", ...props, children: t0 });
+    $[1] = props;
+    $[2] = t1;
+  } else {
+    t1 = $[2];
+  }
+  return t1;
+};
+const TabsContext = React.createContext({});
+const listContainerSlot = createCollectionSlot("tabs.listContainer");
+const TabsRoot = (t0) => {
+  const $ = compilerRuntime.c(24);
+  let align;
+  let children;
+  let className;
+  let props;
+  let t1;
+  let variant;
+  if ($[0] !== t0) {
+    ({
+      align,
+      children,
+      className,
+      orientation: t1,
+      variant,
+      ...props
+    } = t0);
+    $[0] = t0;
+    $[1] = align;
+    $[2] = children;
+    $[3] = className;
+    $[4] = props;
+    $[5] = t1;
+    $[6] = variant;
+  } else {
+    align = $[1];
+    children = $[2];
+    className = $[3];
+    props = $[4];
+    t1 = $[5];
+    variant = $[6];
+  }
+  const orientation = t1 === void 0 ? "horizontal" : t1;
+  let t2;
+  if ($[7] !== align || $[8] !== variant) {
+    t2 = tabsVariants({
+      align,
+      variant
+    });
+    $[7] = align;
+    $[8] = variant;
+    $[9] = t2;
+  } else {
+    t2 = $[9];
+  }
+  const slots = t2;
+  let t3;
+  if ($[10] !== orientation || $[11] !== slots) {
+    t3 = {
+      orientation,
+      slots
+    };
+    $[10] = orientation;
+    $[11] = slots;
+    $[12] = t3;
+  } else {
+    t3 = $[12];
+  }
+  const contextValue = t3;
+  let t4;
+  if ($[13] !== className || $[14] !== slots) {
+    t4 = composeTwRenderProps(className, slots.base());
+    $[13] = className;
+    $[14] = slots;
+    $[15] = t4;
+  } else {
+    t4 = $[15];
+  }
+  let t5;
+  if ($[16] !== children || $[17] !== orientation || $[18] !== props || $[19] !== t4) {
+    t5 = /* @__PURE__ */ jsxRuntime.jsx($b4f18e3395fe64d7$export$b2539bed5023c21c, { ...props, className: t4, "data-slot": "tabs", orientation, children });
+    $[16] = children;
+    $[17] = orientation;
+    $[18] = props;
+    $[19] = t4;
+    $[20] = t5;
+  } else {
+    t5 = $[20];
+  }
+  let t6;
+  if ($[21] !== contextValue || $[22] !== t5) {
+    t6 = /* @__PURE__ */ jsxRuntime.jsx(TabsContext, { value: contextValue, children: t5 });
+    $[21] = contextValue;
+    $[22] = t5;
+    $[23] = t6;
+  } else {
+    t6 = $[23];
+  }
+  return t6;
+};
+const TabListContainer = (t0) => {
+  const $ = compilerRuntime.c(12);
+  let children;
+  let className;
+  let containerProps;
+  let render;
+  if ($[0] !== t0) {
+    ({
+      children,
+      className,
+      render,
+      ...containerProps
+    } = t0);
+    $[0] = t0;
+    $[1] = children;
+    $[2] = className;
+    $[3] = containerProps;
+    $[4] = render;
+  } else {
+    children = $[1];
+    className = $[2];
+    containerProps = $[3];
+    render = $[4];
+  }
+  let t1;
+  if ($[5] !== className || $[6] !== containerProps || $[7] !== render) {
+    t1 = {
+      ...containerProps,
+      className,
+      render
+    };
+    $[5] = className;
+    $[6] = containerProps;
+    $[7] = render;
+    $[8] = t1;
+  } else {
+    t1 = $[8];
+  }
+  const t2 = t1;
+  let t3;
+  if ($[9] !== children || $[10] !== t2) {
+    t3 = /* @__PURE__ */ jsxRuntime.jsx(listContainerSlot.Injector, { ...t2, children });
+    $[9] = children;
+    $[10] = t2;
+    $[11] = t3;
+  } else {
+    t3 = $[11];
+  }
+  return t3;
+};
+const TabList2 = ({
+  children,
+  className,
+  ...props
+}) => {
+  const {
+    orientation = "horizontal",
+    slots
+  } = React.use(TabsContext);
+  const scrollerRef = React.useRef(null);
+  const isVertical = orientation === "vertical";
+  const [listContainerProps, restProps] = listContainerSlot.useSlot(props);
+  const scrollBy = React.useCallback((direction) => {
+    const el = scrollerRef.current;
+    if (!el) return;
+    const size = isVertical ? el.clientHeight : el.clientWidth;
+    const scrollSize = isVertical ? el.scrollHeight : el.scrollWidth;
+    const maxScroll = Math.max(0, scrollSize - size);
+    const isRTL = !isVertical && getComputedStyle(el).direction === "rtl";
+    const delta = direction * size * 0.8 * (isRTL ? -1 : 1);
+    const current = isVertical ? el.scrollTop : el.scrollLeft;
+    const next = Math.min(isRTL ? 0 : maxScroll, Math.max(isRTL ? -maxScroll : 0, current + delta));
+    if (next === current) return;
+    el.scrollTo({
+      behavior: "smooth",
+      [isVertical ? "top" : "left"]: next
+    });
+  }, [isVertical]);
+  if (!listContainerProps) {
+    return /* @__PURE__ */ jsxRuntime.jsx($b4f18e3395fe64d7$export$e51a686c67fdaa2d, { ...restProps, className: composeTwRenderProps(className, slots?.tabList()), "data-slot": "tabs-list", children });
+  }
+  const {
+    className: containerClassName,
+    render: containerRender,
+    ...containerRest
+  } = listContainerProps;
+  return /* @__PURE__ */ jsxRuntime.jsx($b4f18e3395fe64d7$export$e51a686c67fdaa2d, { ...restProps, className: composeTwRenderProps(className, slots?.tabList()), "data-slot": "tabs-list", render: (renderProps) => {
+    const {
+      children: listChildren,
+      className: listClassName,
+      ref: listRef,
+      ...listRest
+    } = renderProps;
+    return /* @__PURE__ */ jsxRuntime.jsxs(dom.div, { className: composeSlotClassName(slots?.tabListContainer, containerClassName), "data-slot": "tabs-list-container", render: containerRender, ...containerRest, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(scrollShadow.ScrollShadow, { ref: scrollerRef, hideScrollBar: true, className: composeSlotClassName(slots?.scroller), orientation, size: 64, children: /* @__PURE__ */ jsxRuntime.jsx("div", { ...listRest, ref: listRef, className: listClassName, children: listChildren }) }),
+      /* @__PURE__ */ jsxRuntime.jsx("button", { "aria-label": isVertical ? "Scroll tabs up" : "Scroll tabs left", className: composeSlotClassName(slots?.scrollPrev), tabIndex: -1, type: "button", onClick: () => scrollBy(-1), children: isVertical ? /* @__PURE__ */ jsxRuntime.jsx(IconChevronUp, {}) : /* @__PURE__ */ jsxRuntime.jsx(IconChevronLeft, {}) }),
+      /* @__PURE__ */ jsxRuntime.jsx("button", { "aria-label": isVertical ? "Scroll tabs down" : "Scroll tabs right", className: composeSlotClassName(slots?.scrollNext), tabIndex: -1, type: "button", onClick: () => scrollBy(1), children: isVertical ? /* @__PURE__ */ jsxRuntime.jsx(IconChevronDown, {}) : /* @__PURE__ */ jsxRuntime.jsx(IconChevronRight, {}) })
+    ] });
+  }, children });
+};
+const Tab = (t0) => {
+  const $ = compilerRuntime.c(11);
+  let children;
+  let className;
+  let props;
+  if ($[0] !== t0) {
+    ({
+      children,
+      className,
+      ...props
+    } = t0);
+    $[0] = t0;
+    $[1] = children;
+    $[2] = className;
+    $[3] = props;
+  } else {
+    children = $[1];
+    className = $[2];
+    props = $[3];
+  }
+  const {
+    slots
+  } = React.use(TabsContext);
+  let t1;
+  if ($[4] !== className || $[5] !== slots) {
+    t1 = composeTwRenderProps(className, slots?.tab());
+    $[4] = className;
+    $[5] = slots;
+    $[6] = t1;
+  } else {
+    t1 = $[6];
+  }
+  let t2;
+  if ($[7] !== children || $[8] !== props || $[9] !== t1) {
+    t2 = /* @__PURE__ */ jsxRuntime.jsx($b4f18e3395fe64d7$export$3e41faf802a29e71, { ...props, className: t1, "data-slot": "tabs-tab", children });
+    $[7] = children;
+    $[8] = props;
+    $[9] = t1;
+    $[10] = t2;
+  } else {
+    t2 = $[10];
+  }
+  return t2;
+};
+const TabIndicator = (t0) => {
+  const $ = compilerRuntime.c(9);
+  let className;
+  let props;
+  if ($[0] !== t0) {
+    ({
+      className,
+      ...props
+    } = t0);
+    $[0] = t0;
+    $[1] = className;
+    $[2] = props;
+  } else {
+    className = $[1];
+    props = $[2];
+  }
+  const {
+    slots
+  } = React.use(TabsContext);
+  const t1 = slots?.tabIndicator;
+  let t2;
+  if ($[3] !== className || $[4] !== t1) {
+    t2 = composeSlotClassName(t1, className);
+    $[3] = className;
+    $[4] = t1;
+    $[5] = t2;
+  } else {
+    t2 = $[5];
+  }
+  let t3;
+  if ($[6] !== props || $[7] !== t2) {
+    t3 = /* @__PURE__ */ jsxRuntime.jsx(useHasTabbableChild.$91fe5e721c7f36c1$export$17f80983afe4e444, { className: t2, "data-slot": "tabs-indicator", ...props });
+    $[6] = props;
+    $[7] = t2;
+    $[8] = t3;
+  } else {
+    t3 = $[8];
+  }
+  return t3;
+};
+const TabPanel2 = (t0) => {
+  const $ = compilerRuntime.c(11);
+  let children;
+  let className;
+  let props;
+  if ($[0] !== t0) {
+    ({
+      children,
+      className,
+      ...props
+    } = t0);
+    $[0] = t0;
+    $[1] = children;
+    $[2] = className;
+    $[3] = props;
+  } else {
+    children = $[1];
+    className = $[2];
+    props = $[3];
+  }
+  const {
+    slots
+  } = React.use(TabsContext);
+  let t1;
+  if ($[4] !== className || $[5] !== slots) {
+    t1 = composeTwRenderProps(className, slots?.tabPanel());
+    $[4] = className;
+    $[5] = slots;
+    $[6] = t1;
+  } else {
+    t1 = $[6];
+  }
+  let t2;
+  if ($[7] !== children || $[8] !== props || $[9] !== t1) {
+    t2 = /* @__PURE__ */ jsxRuntime.jsx($b4f18e3395fe64d7$export$3d96ec278d3efce4, { ...props, className: t1, "data-slot": "tabs-panel", children });
+    $[7] = children;
+    $[8] = props;
+    $[9] = t1;
+    $[10] = t2;
+  } else {
+    t2 = $[10];
+  }
+  return t2;
+};
+const TabSeparator = (t0) => {
+  const $ = compilerRuntime.c(9);
+  let className;
+  let props;
+  if ($[0] !== t0) {
+    ({
+      className,
+      ...props
+    } = t0);
+    $[0] = t0;
+    $[1] = className;
+    $[2] = props;
+  } else {
+    className = $[1];
+    props = $[2];
+  }
+  const {
+    slots
+  } = React.use(TabsContext);
+  const t1 = slots?.separator;
+  let t2;
+  if ($[3] !== className || $[4] !== t1) {
+    t2 = composeSlotClassName(t1, className);
+    $[3] = className;
+    $[4] = t1;
+    $[5] = t2;
+  } else {
+    t2 = $[5];
+  }
+  const t3 = props;
+  let t4;
+  if ($[6] !== t2 || $[7] !== t3) {
+    t4 = /* @__PURE__ */ jsxRuntime.jsx(dom.span, { "aria-hidden": "true", className: t2, "data-slot": "tabs-separator", ...t3 });
+    $[6] = t2;
+    $[7] = t3;
+    $[8] = t4;
+  } else {
+    t4 = $[8];
+  }
+  return t4;
+};
+const Tabs2 = Object.assign(TabsRoot, {
+  Root: TabsRoot,
+  ListContainer: TabListContainer,
+  List: TabList2,
+  Tab,
+  Indicator: TabIndicator,
+  Separator: TabSeparator,
+  Panel: TabPanel2
+});
+exports.Tab = Tab;
+exports.TabIndicator = TabIndicator;
+exports.TabList = TabList2;
+exports.TabListContainer = TabListContainer;
+exports.TabPanel = TabPanel2;
+exports.TabSeparator = TabSeparator;
+exports.Tabs = Tabs2;
+exports.TabsRoot = TabsRoot;
+exports.tabsVariants = tabsVariants;
+//# sourceMappingURL=index.cjs.js.map