"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
Object.defineProperty(exports, "Tab", {
    enumerable: true,
    get: function() {
        return Tab;
    }
});
const _jsxruntime = require("react/jsx-runtime");
const _react = /*#__PURE__*/ _interop_require_default(require("react"));
const _css = require("../utils/css");
const _constants = require("./constants");
function _interop_require_default(obj) {
    return obj && obj.__esModule ? obj : {
        default: obj
    };
}
const Tab = (props)=>{
    const { active, disabled, title, fullWidth, mode, className } = props;
    return /*#__PURE__*/ (0, _jsxruntime.jsx)("button", {
        className: (0, _css.cn)("orderly-text-base-contrast-36 desktop:orderly-text-base-contrast-54 orderly-h-full orderly-tab-item orderly-min-h-[32px] orderly-relative after:orderly-hidden after:orderly-content-[''] after:orderly-absolute after:orderly-bottom-0 after:orderly-left-0 after:orderly-right-0 after:orderly-h-[3px] after:desktop:orderly-h-[2px] after:orderly-bg-base-contrast", className, active && mode === _constants.TabViewMode.Tab && "orderly-text-base-contrast desktop:orderly-text-base-contrast active after:orderly-block", disabled && "orderly-cursor-not-allowed orderly-text-base-contrast-36 desktop:orderly-text-base-contrast-54", fullWidth && "orderly-flex-1"),
        "data-active": active,
        disabled: props.disabled,
        onClick: (event)=>{
            props.onClick(props.value, event);
        },
        id: `tab-${props.value}`,
        children: title
    });
};

//# sourceMappingURL=tab.js.map