UNPKG

@sikka/hawa

Version:

Modern UI Kit made with Tailwind

94 lines (90 loc) 3.51 kB
"use client"; "use strict"; 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); // layout/appTabs/index.ts var appTabs_exports = {}; __export(appTabs_exports, { AppTabs: () => AppTabs }); module.exports = __toCommonJS(appTabs_exports); // layout/appTabs/AppTabs.tsx var import_react = __toESM(require("react")); // util/index.ts var import_clsx = require("clsx"); var import_tailwind_merge = require("tailwind-merge"); function cn(...inputs) { return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs)); } // layout/appTabs/AppTabs.tsx var AppTabs = ({ tabs, className }) => { const [selectedIndex, setSelectedIndex] = (0, import_react.useState)(0); return /* @__PURE__ */ import_react.default.createElement( "div", { className: cn( "hawa-w-full hawa-border-b hawa-bg-card hawa-p-6 hawa-pb-0", className ) }, /* @__PURE__ */ import_react.default.createElement("div", { className: "hawa-flex hawa-flex-row hawa-justify-center" }, tabs.map((tab, index) => { const selected = index === selectedIndex; return /* @__PURE__ */ import_react.default.createElement( "a", { href: tab.path, key: index, onMouseDown: (e) => { if (tab.onMouseDown) { tab.onMouseDown(e); } }, onClick: (e) => { if (tab.onClick) { tab.onClick(e); } setSelectedIndex(index); }, className: cn( "hawa-z-10 hawa-flex hawa-items-center hawa-translate-y-[1.1px] hawa-select-none hawa-flex-row hawa-gap-2 hawa-rounded-t hawa-p-4 hawa-py-2 hawa-text-sm hawa-transition-all", "hawa-border", // Always have a border but make it transparent selected ? "hawa-border hawa-border-b-transparent hawa-bg-background" : "hawa-cursor-pointer hawa-border-transparent hover:hawa-bg-card-foreground/5" ) }, tab.icon && tab.icon, tab.label ); })) ); }; // Annotate the CommonJS export names for ESM import in node: 0 && (module.exports = { AppTabs }); //# sourceMappingURL=index.js.map