var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  // If the importer is in node compatibility mode or this is not an ESM
  // file that has been converted to a CommonJS file using a Babel-
  // compatible transform (i.e. "__esModule" has not been set), then set
  // "default" to the CommonJS "module.exports" for node compatibility.
  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// src/plus/productSelect/components/TabsStructure/TabsStructure.tsx
var TabsStructure_exports = {};
__export(TabsStructure_exports, {
  ChevronButton: () => ChevronButton,
  ChevronControls: () => ChevronControls,
  Rail: () => Rail,
  ScrollShadow: () => ScrollShadow,
  SelectionIndicator: () => SelectionIndicator,
  TabItem: () => TabItem,
  TabListContainer: () => TabListContainer,
  default: () => TabsStructure_default
});
module.exports = __toCommonJS(TabsStructure_exports);
var import_react = __toESM(require("react"));
var import_classnames = __toESM(require("classnames"));
var import_styles = require("./styles");
var import_utils = require("./utils");
var import_ChevronLeft = __toESM(require("@pisell/icon/es/ChevronLeft"));
var import_ChevronRight = __toESM(require("@pisell/icon/es/ChevronRight"));
var TabContext = (0, import_react.createContext)({});
var useTabContext = () => {
  const context = (0, import_react.useContext)(TabContext);
  if (!context) {
    throw new Error("useTabContext must be used within a TabContext.Provider");
  }
  return context;
};
var TabListContainer = (0, import_react.forwardRef)(
  ({ children, className, ...props }, ref) => {
    return /* @__PURE__ */ import_react.default.createElement(
      "ul",
      {
        ref,
        className: (0, import_classnames.default)(import_styles.tabListClasses.list, className),
        role: "tablist",
        ...props
      },
      children
    );
  }
);
var TabItem = (0, import_react.forwardRef)(
  ({
    children,
    isSelected = false,
    isDisabled = false,
    className,
    onClick,
    tabId,
    autoRegister = true,
    ...props
  }, ref) => {
    const { selectedTab, onTabChange, registerTab, unregisterTab } = useTabContext();
    const elementRef = (0, import_react.useRef)(null);
    const combinedRef = (0, import_react.useCallback)(
      (element) => {
        elementRef.current = element;
        if (typeof ref === "function") {
          ref(element);
        } else if (ref && "current" in ref) {
          ref.current = element;
        }
      },
      [ref]
    );
    (0, import_react.useEffect)(() => {
      if (autoRegister && tabId && elementRef.current && registerTab) {
        registerTab(tabId, elementRef.current);
        return () => {
          if (unregisterTab) {
            unregisterTab(tabId);
          }
        };
      }
    }, [tabId, autoRegister, registerTab, unregisterTab]);
    const handleClick = (0, import_react.useCallback)(() => {
      if (!isDisabled) {
        if (tabId && onTabChange) {
          onTabChange(tabId);
        }
        onClick == null ? void 0 : onClick(tabId);
      }
    }, [isDisabled, tabId, onTabChange, onClick]);
    const isTabSelected = tabId ? selectedTab === tabId : isSelected;
    return /* @__PURE__ */ import_react.default.createElement("li", { role: "presentation", style: { lineHeight: 0 } }, /* @__PURE__ */ import_react.default.createElement(
      "button",
      {
        id: tabId,
        ref: combinedRef,
        className: (0, import_classnames.default)(
          import_styles.tabItemClasses.item,
          isTabSelected && import_styles.tabItemClasses.selected,
          isDisabled && import_styles.tabItemClasses.disabled,
          className
        ),
        role: "tab",
        "aria-selected": isTabSelected,
        "aria-disabled": isDisabled,
        disabled: isDisabled,
        onClick: handleClick,
        tabIndex: isTabSelected ? 0 : -1,
        ...props
      },
      children
    ));
  }
);
var Rail = (0, import_react.forwardRef)(
  ({ children, className, ...props }, ref) => {
    const { railRef: contextRailRef } = useTabContext();
    const mergedRef = (0, import_react.useCallback)(
      (element) => {
        if (contextRailRef && "current" in contextRailRef) {
          contextRailRef.current = element;
        }
        if (typeof ref === "function") {
          ref(element);
        } else if (ref && "current" in ref) {
          ref.current = element;
        }
      },
      [ref, contextRailRef]
    );
    return /* @__PURE__ */ import_react.default.createElement(
      "div",
      {
        ref: mergedRef,
        className: (0, import_classnames.default)(import_styles.railClasses.rail, className),
        ...props
      },
      children
    );
  }
);
var SelectionIndicator = (0, import_react.forwardRef)(
  ({ focusRingClasses, isFocusVisible = false, style, className, ...props }, ref) => {
    return /* @__PURE__ */ import_react.default.createElement(
      "div",
      {
        ref,
        className: (0, import_classnames.default)(
          import_styles.selectionClasses.selection,
          import_styles.selectionClasses.position,
          {
            [import_styles.selectionClasses.focused]: isFocusVisible && focusRingClasses
          },
          className
        ),
        style,
        "aria-hidden": "true",
        ...props
      }
    );
  }
);
var ScrollShadow = (0, import_react.forwardRef)(
  ({ visible, location, className, ...props }, ref) => {
    return /* @__PURE__ */ import_react.default.createElement(
      "div",
      {
        ref,
        className: (0, import_classnames.default)(
          import_styles.shadowClasses.shadow,
          {
            [import_styles.shadowClasses.isVisible]: visible,
            [import_styles.shadowClasses.locationStart]: location === "start",
            [import_styles.shadowClasses.locationEnd]: location === "end"
          },
          className
        ),
        ...props
      }
    );
  }
);
var ChevronButton = (0, import_react.forwardRef)(
  ({
    direction,
    disabled = false,
    onClick,
    className,
    "aria-label": ariaLabel,
    ...props
  }, ref) => {
    const defaultAriaLabel = direction === "prev" ? "prev" : "next";
    return /* @__PURE__ */ import_react.default.createElement(
      "button",
      {
        ref,
        className: (0, import_classnames.default)(
          import_styles.chevronButtonClasses.button,
          {
            [import_styles.chevronButtonClasses.disabled]: disabled,
            [import_styles.chevronButtonClasses.prev]: direction === "prev",
            [import_styles.chevronButtonClasses.next]: direction === "next"
          },
          className
        ),
        disabled,
        onClick,
        "aria-label": ariaLabel || defaultAriaLabel,
        type: "button",
        ...props
      },
      direction === "prev" ? /* @__PURE__ */ import_react.default.createElement(import_ChevronLeft.default, null) : /* @__PURE__ */ import_react.default.createElement(import_ChevronRight.default, null)
    );
  }
);
var ChevronControls = ({
  isPrevDisabled = false,
  isNextDisabled = false,
  onPrevClick,
  onNextClick,
  prevAction,
  nextAction,
  className,
  ...props
}) => {
  const handlePrevClick = onPrevClick || prevAction;
  const handleNextClick = onNextClick || nextAction;
  return /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)(import_styles.chevronClasses.controls, className), ...props }, /* @__PURE__ */ import_react.default.createElement(
    ChevronButton,
    {
      direction: "prev",
      disabled: isPrevDisabled,
      onClick: handlePrevClick
    }
  ), /* @__PURE__ */ import_react.default.createElement(
    ChevronButton,
    {
      direction: "next",
      disabled: isNextDisabled,
      onClick: handleNextClick
    }
  ));
};
var TabsStructure = ({
  selectedTab,
  onTabChange,
  autoScrollToSelected = true,
  children,
  className,
  railRef: externalRailRef,
  ...props
}) => {
  const tabElementsRef = (0, import_react.useRef)(/* @__PURE__ */ new Map());
  const internalRailRef = (0, import_react.useRef)(null);
  const railRef = externalRailRef || internalRailRef;
  if (!selectedTab && children) {
    console.warn("TabsStructure: No selectedTab provided, consider setting a default value");
  }
  const registerTab = (0, import_react.useCallback)((tabId, element) => {
    if (!tabId || !element) {
      console.warn("TabsStructure: Invalid tabId or element provided to registerTab");
      return;
    }
    if (typeof WeakRef !== "undefined") {
      tabElementsRef.current.set(tabId, new WeakRef(element));
    } else {
      tabElementsRef.current.set(tabId, element);
    }
  }, []);
  const unregisterTab = (0, import_react.useCallback)((tabId) => {
    if (tabId) {
      tabElementsRef.current.delete(tabId);
    }
  }, []);
  const clearAllTabs = (0, import_react.useCallback)(() => {
    tabElementsRef.current.clear();
  }, []);
  (0, import_react.useEffect)(() => {
    return () => {
      if (typeof WeakRef === "undefined") {
        clearAllTabs();
      }
    };
  }, [clearAllTabs]);
  const getTabElement = (0, import_react.useCallback)((tabId) => {
    const ref = tabElementsRef.current.get(tabId);
    if (!ref) return null;
    if (typeof WeakRef !== "undefined" && ref instanceof WeakRef) {
      const element = ref.deref();
      if (!element) {
        tabElementsRef.current.delete(tabId);
        return null;
      }
      return element;
    } else {
      return ref;
    }
  }, []);
  const scrollToTab = (0, import_react.useCallback)((tabId) => {
    if (!tabId || !railRef.current) {
      return;
    }
    const targetElement = getTabElement(tabId);
    if (!targetElement) {
      console.warn(`TabsStructure: Tab element with id "${tabId}" not found`);
      return;
    }
    if (!targetElement.offsetParent) {
      console.warn(`TabsStructure: Tab element "${tabId}" is not visible or not in DOM`);
      return;
    }
    const rail = railRef.current;
    const targetLeft = targetElement.offsetLeft;
    const currentScrollLeft = rail.scrollLeft;
    if (Math.abs(targetLeft - currentScrollLeft) > 1) {
      (0, import_utils.safeScrollTo)(rail, {
        left: targetLeft,
        behavior: "smooth"
      });
    }
  }, [getTabElement]);
  (0, import_react.useEffect)(() => {
    if (autoScrollToSelected && selectedTab) {
      scrollToTab(selectedTab);
    }
  }, [selectedTab, autoScrollToSelected, scrollToTab]);
  const contextValue = (0, import_react.useMemo)(
    () => ({
      selectedTab,
      onTabChange,
      registerTab,
      unregisterTab,
      railRef
    }),
    [selectedTab, onTabChange, registerTab, unregisterTab, railRef]
  );
  return /* @__PURE__ */ import_react.default.createElement(TabContext.Provider, { value: contextValue }, /* @__PURE__ */ import_react.default.createElement(
    "div",
    {
      ...props,
      className: (0, import_classnames.default)(import_styles.tabWrapperClasses.wrapper, className)
    },
    children
  ));
};
var TabsStructureWithSubComponents = TabsStructure;
TabsStructureWithSubComponents.Rail = Rail;
TabsStructureWithSubComponents.ListContainer = TabListContainer;
TabsStructureWithSubComponents.Item = TabItem;
TabsStructureWithSubComponents.SelectionIndicator = SelectionIndicator;
TabsStructureWithSubComponents.ScrollShadow = ScrollShadow;
TabsStructureWithSubComponents.ChevronControls = ChevronControls;
TabsStructureWithSubComponents.ChevronButton = ChevronButton;
TabsStructure.displayName = "TabsStructure";
Rail.displayName = "TabsStructure.Rail";
TabListContainer.displayName = "TabsStructure.ListContainer";
TabItem.displayName = "TabsStructure.Item";
SelectionIndicator.displayName = "TabsStructure.SelectionIndicator";
ScrollShadow.displayName = "TabsStructure.ScrollShadow";
ChevronControls.displayName = "TabsStructure.ChevronControls";
ChevronButton.displayName = "TabsStructure.ChevronButton";
var TabsStructure_default = TabsStructureWithSubComponents;
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  ChevronButton,
  ChevronControls,
  Rail,
  ScrollShadow,
  SelectionIndicator,
  TabItem,
  TabListContainer
});
