UNPKG

@sikka/hawa

Version:

Modern UI Kit made with Tailwind

276 lines (267 loc) • 10.2 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); // elements/accordion/index.ts var accordion_exports = {}; __export(accordion_exports, { Accordion: () => Accordion, AccordionContent: () => AccordionContent, AccordionItem: () => AccordionItem, AccordionRoot: () => AccordionRoot, AccordionTrigger: () => AccordionTrigger }); module.exports = __toCommonJS(accordion_exports); // elements/accordion/Accordion.tsx var React4 = __toESM(require("react")); var AccordionPrimitive3 = __toESM(require("@radix-ui/react-accordion")); // 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)); } // elements/chip/Chip.tsx var import_react = __toESM(require("react")); var Chip = import_react.default.forwardRef( ({ label, size = "normal", icon, color, radius = "inherit", dot, dotStatus = "none", ...rest }, ref) => { let defaultStyles = "hawa-flex hawa-flex-row hawa-w-fit hawa-gap-1 hawa-items-center hawa-px-2.5 hawa-py-1 hawa-font-bold "; let radiusStyles = { inherit: " hawa-rounded", full: "hawa-rounded-full", none: "hawa-rounded-none" }; let sizeStyles = { small: "hawa-h-[15px] hawa-leading-4 hawa-px-0 hawa-py-0 hawa-text-[9px] hawa-gap-0.5 ", normal: "hawa-h-fit hawa-text-xs", large: "hawa-text-base" }; let dotStyles = { small: "hawa-flex hawa-h-1 hawa-w-1 hawa-rounded-full", normal: "hawa-flex hawa-h-2 hawa-w-2 hawa-rounded-full", large: "hawa-flex hawa-h-3 hawa-w-3 hawa-rounded-full" }; let dotStatusStyles = { none: "hawa-bg-gray-500 dark:hawa-bg-gray-800", available: "hawa-bg-green-500", unavailable: "hawa-bg-red-500" }; let colorStyles = { green: "hawa-bg-green-200 hawa-text-green-700 dark:hawa-bg-green-700 dark:hawa-text-green-200", blue: "hawa-bg-blue-200 hawa-text-blue-700 dark:hawa-bg-blue-700 dark:hawa-text-blue-100", red: "hawa-bg-red-200 hawa-text-red-700 dark:hawa-bg-red-700 dark:hawa-text-red-100", yellow: "hawa-bg-yellow-200 hawa-text-yellow-700 dark:hawa-bg-yellow-600 dark:hawa-text-black", orange: "hawa-bg-orange-200 hawa-text-orange-700 dark:hawa-bg-orange-700 dark:hawa-text-orange-100", purple: "hawa-bg-purple-200 hawa-text-purple-700 dark:hawa-bg-purple-700 dark:hawa-text-purple-100", cyan: "hawa-bg-cyan-200 hawa-text-cyan-700 dark:hawa-bg-cyan-700 dark:hawa-text-cyan-100", hyper: "hawa-text-white dark:hawa-text-black hawa-bg-gradient-to-tl hawa-from-pink-500 hawa-via-red-500 hawa-to-yellow-500 ", oceanic: "hawa-text-white dark:hawa-text-black hawa-bg-gradient-to-bl hawa-from-green-300 hawa-via-blue-500 hawa-to-purple-600" }; if (label) { return /* @__PURE__ */ import_react.default.createElement( "span", { ...rest, ref, className: cn( defaultStyles, sizeStyles[size], radiusStyles[radius], color ? colorStyles[color] : "hawa-border hawa-bg-none", rest.className ) }, dot && /* @__PURE__ */ import_react.default.createElement( "span", { className: cn(dotStyles[size], dotStatusStyles[dotStatus]) } ), icon && icon, label ); } else { return /* @__PURE__ */ import_react.default.createElement( "span", { ...rest, ref, className: cn( "hawa-h-2 hawa-w-2 hawa-rounded-full", color ? colorStyles[color] : "hawa-border hawa-bg-none" ) } ); } } ); // elements/accordion/AccordionContent.tsx var React2 = __toESM(require("react")); var AccordionPrimitive = __toESM(require("@radix-ui/react-accordion")); var AccordionContent = React2.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React2.createElement( AccordionPrimitive.Content, { ref, className: !props.unstyled ? cn( "hawa-overflow-hidden hawa-text-sm hawa-transition-all data-[state=closed]:hawa-animate-accordion-up data-[state=open]:hawa-animate-accordion-down", className ) : className, ...props }, /* @__PURE__ */ React2.createElement("div", { className: "hawa-bg-background hawa-p-4" }, children) )); AccordionContent.displayName = AccordionPrimitive.Content.displayName; // elements/accordion/AccordionTrigger.tsx var React3 = __toESM(require("react")); var AccordionPrimitive2 = __toESM(require("@radix-ui/react-accordion")); var AccordionTrigger = React3.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React3.createElement(AccordionPrimitive2.Header, { className: "hawa-flex" }, /* @__PURE__ */ React3.createElement( AccordionPrimitive2.Trigger, { ref, className: !props.unstyled ? cn( "hawa-flex hawa-flex-1 hawa-items-center hawa-justify-between hawa-bg-muted/50 hawa-p-4 hawa-font-medium hawa-transition-all [&[data-state=open]>svg]:hawa-rotate-180", props.disabled ? "hawa-bg-muted/30 hawa-text-muted-foreground/50" : "hover:hawa-bg-muted", className ) : className, ...props }, children, !props.hideArrow && /* @__PURE__ */ React3.createElement( "svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "hawa-icon hawa-shrink-0 hawa-transition-transform hawa-duration-200" }, /* @__PURE__ */ React3.createElement("path", { d: "m6 9 6 6 6-6" }) ) ))); AccordionTrigger.displayName = AccordionPrimitive2.Trigger.displayName; // elements/accordion/Accordion.tsx var Accordion = React4.forwardRef( ({ items, design = "default", itemClassNames, triggerclassNames, contentclassNames, className, ...props }, ref) => /* @__PURE__ */ React4.createElement(AccordionPrimitive3.Root, { type: props.type, collapsible: true }, /* @__PURE__ */ React4.createElement( "div", { className: cn("hawa-flex hawa-flex-col", { "hawa-gap-4": design === "separated", "hawa-gap-0": design === "default" }) }, items.map((item, index) => /* @__PURE__ */ React4.createElement( AccordionPrimitive3.Item, { disabled: item.disabled || false, className: cn(itemClassNames, "hawa-rounded"), key: index, value: `item-${index}` }, /* @__PURE__ */ React4.createElement( AccordionTrigger, { disabled: item.disabled || false, className: cn( "hawa-transition-all hawa-text-start", design === "separated" ? "hawa-rounded data-[state=open]:hawa-rounded-b-none" : { "hawa-rounded-t": index === 0, "data-[state=closed]:hawa-rounded-b": index === items.length - 1 }, triggerclassNames ) }, /* @__PURE__ */ React4.createElement( "span", { className: cn( "hawa-flex hawa-flex-row", item.chip && "hawa-gap-2" ) }, item.trigger, " ", item.chip && /* @__PURE__ */ React4.createElement(Chip, { ...item.chip }) ) ), /* @__PURE__ */ React4.createElement( AccordionContent, { "aria-disabled": item.disabled || false, className: cn( "hawa-border hawa-transition-all", design === "separated" ? "hawa-rounded data-[state=open]:hawa-rounded-t-none" : { "data-[state=open]:hawa-rounded-b": index === items.length - 1 }, contentclassNames ) }, item.content ) )) )) ); Accordion.displayName = "Accordion"; // elements/accordion/AccordionItem.tsx var React5 = __toESM(require("react")); var AccordionPrimitive4 = __toESM(require("@radix-ui/react-accordion")); var AccordionItem = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React5.createElement(AccordionPrimitive4.Item, { ref, className: cn(className), ...props })); AccordionItem.displayName = "AccordionItem"; // elements/accordion/AccordionRoot.tsx var AccordionPrimitive5 = __toESM(require("@radix-ui/react-accordion")); var AccordionRoot = AccordionPrimitive5.Root; // Annotate the CommonJS export names for ESM import in node: 0 && (module.exports = { Accordion, AccordionContent, AccordionItem, AccordionRoot, AccordionTrigger }); //# sourceMappingURL=index.js.map