@kopexa/theme 0.0.0 → 1.0.0

package/dist/index.js

@@ -20,7 +20,10 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
-  button: () => button
+  button: () => button,
+  dialog: () => dialog,
+  drawer: () => drawer,
+  popover: () => popover
 });
 module.exports = __toCommonJS(index_exports);
 
@@ -28,7 +31,9 @@ module.exports = __toCommonJS(index_exports);
 var import_tailwind_variants = require("tailwind-variants");
 var button = (0, import_tailwind_variants.tv)({
   base: [
-    "inline-flex items-center justify-center gap-2",
+    "relative inline-flex group items-center justify-center select-none",
+    "box-border appearance-none min-w-max subpixel-antialiased overflow-hidden cursor-pointer",
+    "gap-2",
     "whitespace-nowrap rounded-md transition-all disabled:pointer-events-none disabled:opacity-50",
     "shrink-0 [&_svg]:shrink-0 outline-none",
     "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
@@ -36,12 +41,213 @@ var button = (0, import_tailwind_variants.tv)({
     "text-sm font-medium"
   ],
   variants: {
-    variant: {},
-    size: {}
+    variant: {
+      solid: "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
+      destructive: "bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+      outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+      secondary: "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80",
+      ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
+      link: "text-primary underline-offset-4 hover:underline"
+    },
+    size: {
+      sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
+      md: "h-9 px-4 py-2 has-[>svg]:px-3",
+      lg: "h-10 rounded-md px-6 has-[>svg]:px-4"
+    }
   },
-  defaultVariants: {}
+  defaultVariants: {
+    variant: "solid",
+    size: "sm"
+  }
+});
+
+// src/components/dialog.ts
+var import_tailwind_variants2 = require("tailwind-variants");
+var dialog = (0, import_tailwind_variants2.tv)({
+  slots: {
+    overlay: ["fixed inset-0 z-50 bg-black/25"],
+    content: [
+      "bg-background fixed top-[50%] left-[50%] z-50",
+      "grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%]",
+      "gap-4 border shadow-lg",
+      //  mobile animation vars
+      "[--scale-enter:100%]",
+      "[--scale-exit:100%]",
+      "[--slide-enter:0px]",
+      "[--slide-exit:80px]",
+      // tablet/desktop animation vars
+      "sm:[--scale-enter:100%]",
+      "sm:[--scale-exit:103%]",
+      "sm:[--slide-enter:0px]",
+      "sm:[--slide-exit:0px]"
+    ],
+    close: [
+      "ring-offset-background focus:ring-ring",
+      "data-[state=open]:bg-accent data-[state=open]:text-muted-foreground",
+      "absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100",
+      "focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none",
+      "[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4"
+    ],
+    closeTrigger: [],
+    header: "flex flex-col gap-1 text-center sm:text-left shrink grow-0 px-6 pt-4",
+    footer: "flex flex-col-reverse gap-2 px-6 pt-2 pb-4 sm:flex-row sm:justify-end",
+    body: "px-6 py-2 flex-1 overflow-auto",
+    title: "text-lg leading-none font-semibold",
+    description: "text-muted-foreground text-sm"
+  },
+  variants: {
+    size: {
+      xs: {
+        content: "sm:max-w-xs"
+      },
+      sm: {
+        content: "sm:max-w-sm"
+      },
+      md: {
+        content: "sm:max-w-md"
+      },
+      lg: {
+        content: "sm:max-w-lg"
+      },
+      xl: {
+        content: "sm:max-w-xl"
+      },
+      "2xl": {
+        content: "sm:max-w-2xl"
+      },
+      "3xl": {
+        content: "sm:max-w-3xl"
+      },
+      "4xl": {
+        content: "sm:max-w-4xl"
+      },
+      "5xl": {
+        content: "sm:max-w-5xl"
+      },
+      full: {
+        content: [
+          "my-0 mx:0 sm:mx-0 sm:my-0 max-w-[calc(100%-1rem)] w-full h-[calc(100dvh-1rem)] inset-2",
+          "translate-0"
+        ]
+      }
+    },
+    placement: { top: {}, bottom: {}, left: {}, right: {} },
+    radius: {
+      none: "",
+      sm: {
+        content: "rounded-sm"
+      },
+      md: {
+        content: "rounded-md"
+      },
+      lg: {
+        content: "rounded-lg"
+      }
+    }
+  },
+  defaultVariants: {
+    size: "md",
+    placement: "right",
+    radius: "lg"
+  }
+});
+
+// src/components/drawer.ts
+var import_tailwind_variants3 = require("tailwind-variants");
+var drawer = (0, import_tailwind_variants3.tv)({
+  slots: {
+    overlay: dialog.slots.overlay,
+    content: [
+      "bg-background fixed z-50 flex flex-col w-full gap-4 shadow-lg max-h-dvh",
+      "outline-hidden"
+    ],
+    close: dialog.slots.close,
+    closeTrigger: dialog.slots.closeTrigger,
+    header: dialog.slots.header,
+    footer: dialog.slots.footer,
+    body: dialog.slots.body,
+    title: dialog.slots.title,
+    description: dialog.slots.description
+  },
+  variants: {
+    size: {
+      xs: {
+        content: "max-w-xs"
+      },
+      sm: {
+        content: "max-w-sm"
+      },
+      md: {
+        content: "max-w-md"
+      },
+      lg: {
+        content: "max-w-lg"
+      },
+      xl: {
+        content: "max-w-xl"
+      },
+      "2xl": {
+        content: "max-w-2xl"
+      },
+      "3xl": {
+        content: "max-w-3xl"
+      },
+      "4xl": {
+        content: "max-w-4xl"
+      },
+      "5xl": {
+        content: "max-w-5xl"
+      },
+      "6xl": {
+        content: "max-w-6xl"
+      },
+      full: {
+        content: "max-w-full max-h-full h-[calc(100dvh_-_1rem)] inset-2"
+      }
+    },
+    placement: {
+      top: {},
+      bottom: {},
+      left: {},
+      right: {
+        content: "inset-y-2 me-2 right-0 h-[calc(100%-1rem)] border-l"
+      }
+    },
+    radius: {
+      none: "",
+      sm: {
+        content: "rounded-sm"
+      },
+      md: {
+        content: "rounded-md"
+      },
+      lg: {
+        content: "rounded-lg"
+      }
+    }
+  },
+  defaultVariants: {
+    placement: "right",
+    size: "md",
+    radius: "lg"
+  }
+});
+
+// src/components/popover.ts
+var import_tailwind_variants4 = require("tailwind-variants");
+var popover = (0, import_tailwind_variants4.tv)({
+  slots: {
+    content: [
+      "bg-popover text-popover-foreground z-50 w-72",
+      "origin-(--radix-popover-content-transform-origin)",
+      "rounded-md border p-4 shadow-md outline-hidden"
+    ]
+  }
 });
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  button
+  button,
+  dialog,
+  drawer,
+  popover
 });

package/dist/index.mjs

@@ -1,7 +1,19 @@
-import "./chunk-BJZMR7WC.mjs";
+import "./chunk-BFZUC56W.mjs";
 import {
   button
-} from "./chunk-74SC7LQR.mjs";
+} from "./chunk-GSHMDS47.mjs";
+import {
+  drawer
+} from "./chunk-V74N5X6Z.mjs";
+import {
+  dialog
+} from "./chunk-OEVKY5EP.mjs";
+import {
+  popover
+} from "./chunk-J35D7RWA.mjs";
 export {
-  button
+  button,
+  dialog,
+  drawer,
+  popover
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kopexa/theme",
-  "version": "0.0.0",
+  "version": "1.0.0",
   "description": "The default theme for Kopexa components",
   "keywords": [
     "theme",
@@ -44,7 +44,7 @@
     "flat": "^6.0.1",
     "tailwind-merge": "3.3.1",
     "tailwind-variants": "1.0.0",
-    "@kopexa/shared-utils": "0.0.0"
+    "@kopexa/shared-utils": "1.0.0"
   },
   "peerDependencies": {
     "tailwindcss": ">=4.0.0"

package/dist/chunk-74SC7LQR.mjs

@@ -1,21 +0,0 @@
-// src/components/button.ts
-import { tv } from "tailwind-variants";
-var button = tv({
-  base: [
-    "inline-flex items-center justify-center gap-2",
-    "whitespace-nowrap rounded-md transition-all disabled:pointer-events-none disabled:opacity-50",
-    "shrink-0 [&_svg]:shrink-0 outline-none",
-    "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
-    "[&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4",
-    "text-sm font-medium"
-  ],
-  variants: {
-    variant: {},
-    size: {}
-  },
-  defaultVariants: {}
-});
-
-export {
-  button
-};