@react95/core/cjs/Tabs/Tabs.cjs

Windows 95 styleguide

"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const React = require("react");
const cn = require("classnames");
const Tab = require("./Tab.cjs");
const Tabs_css = require("./Tabs.css.cjs");
const Frame = require("../Frame/Frame.cjs");
const Tabs = React.forwardRef(
  ({ children, defaultActiveTab, onChange, ...rest }, ref) => {
    const [firstTab] = React.Children.toArray(children);
    const [activeTab, setActiveTab] = React.useState(
      defaultActiveTab || firstTab.props.title
    );
    return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
      Frame.Frame,
      {
        ...rest,
        className: cn(Tabs_css.navbar, rest.className),
        as: "ol",
        ref
      },
      React.Children.map(children, (child) => {
        const { title, disabled } = child.props;
        return /* @__PURE__ */ React.createElement(
          Tab.Tab,
          {
            key: title,
            ...child.props,
            activeTab,
            onClick: (e) => {
              if (!disabled) {
                if (onChange) {
                  onChange(title, e);
                }
                setActiveTab(title);
              }
            }
          }
        );
      })
    ), /* @__PURE__ */ React.createElement(Frame.Frame, { className: Tabs_css.navContainer, width: rest.width || rest.w }, React.Children.map(
      children,
      (child) => child.props.title === activeTab && child.props.children
    )));
  }
);
exports.Tabs = Tabs;