@sth87/shadcn-design-system 0.1.0 → 0.1.2

package/dist/esm/components/Tabs/classes.js

@@ -75,188 +75,188 @@ const J = {
     root: "ds:flex ds:flex-row-reverse",
     list: "ds:flex-col ds:h-fit"
   }
-}, O = (r, t) => {
-  const a = {
+}, O = (a, t) => {
+  const d = {
     primary: {
-      bg: "data-[state=active]:bg-primary dark:data-[state=active]:bg-primary data-[state=active]:text-primary-foreground dark:data-[state=active]:text-primary-foreground",
-      text: "data-[state=active]:text-primary dark:data-[state=active]:text-primary",
-      border: "data-[state=active]:border-primary dark:data-[state=active]:border-primary"
+      bg: "ds:data-[state=active]:bg-primary ds:dark:data-[state=active]:bg-primary ds:data-[state=active]:text-primary-foreground ds:dark:data-[state=active]:text-primary-foreground",
+      text: "ds:data-[state=active]:text-primary ds:dark:data-[state=active]:text-primary",
+      border: "ds:data-[state=active]:border-primary ds:dark:data-[state=active]:border-primary"
     },
     secondary: {
-      bg: "data-[state=active]:bg-secondary dark:data-[state=active]:bg-secondary data-[state=active]:text-secondary-foreground dark:data-[state=active]:text-secondary-foreground",
-      text: "data-[state=active]:text-secondary dark:data-[state=active]:text-secondary",
-      border: "data-[state=active]:border-secondary dark:data-[state=active]:border-secondary"
+      bg: "ds:data-[state=active]:bg-secondary ds:dark:data-[state=active]:bg-secondary ds:data-[state=active]:text-secondary-foreground ds:dark:data-[state=active]:text-secondary-foreground",
+      text: "ds:data-[state=active]:text-secondary ds:dark:data-[state=active]:text-secondary",
+      border: "ds:data-[state=active]:border-secondary ds:dark:data-[state=active]:border-secondary"
     },
     muted: {
-      bg: "data-[state=active]:bg-muted dark:data-[state=active]:bg-muted data-[state=active]:text-muted-foreground dark:data-[state=active]:text-muted-foreground",
-      text: "data-[state=active]:text-muted-foreground dark:data-[state=active]:text-muted-foreground",
-      border: "data-[state=active]:border-border dark:data-[state=active]:border-border"
+      bg: "ds:data-[state=active]:bg-muted ds:dark:data-[state=active]:bg-muted ds:data-[state=active]:text-muted-foreground ds:dark:data-[state=active]:text-muted-foreground",
+      text: "ds:data-[state=active]:text-muted-foreground ds:dark:data-[state=active]:text-muted-foreground",
+      border: "ds:data-[state=active]:border-border ds:dark:data-[state=active]:border-border"
     },
     accent: {
-      bg: "data-[state=active]:bg-accent dark:data-[state=active]:bg-accent data-[state=active]:text-accent-foreground dark:data-[state=active]:text-accent-foreground",
-      text: "data-[state=active]:text-accent-foreground dark:data-[state=active]:text-accent-foreground",
-      border: "data-[state=active]:border-accent dark:data-[state=active]:border-accent"
+      bg: "ds:data-[state=active]:bg-accent ds:dark:data-[state=active]:bg-accent ds:data-[state=active]:text-accent-foreground ds:dark:data-[state=active]:text-accent-foreground",
+      text: "ds:data-[state=active]:text-accent-foreground ds:dark:data-[state=active]:text-accent-foreground",
+      border: "ds:data-[state=active]:border-accent ds:dark:data-[state=active]:border-accent"
     },
     destructive: {
-      bg: "data-[state=active]:bg-destructive dark:data-[state=active]:bg-destructive data-[state=active]:text-destructive-foreground dark:data-[state=active]:text-destructive-foreground",
-      text: "data-[state=active]:text-destructive dark:data-[state=active]:text-destructive",
-      border: "data-[state=active]:border-destructive dark:data-[state=active]:border-destructive"
+      bg: "ds:data-[state=active]:bg-destructive ds:dark:data-[state=active]:bg-destructive ds:data-[state=active]:text-destructive-foreground ds:dark:data-[state=active]:text-destructive-foreground",
+      text: "ds:data-[state=active]:text-destructive ds:dark:data-[state=active]:text-destructive",
+      border: "ds:data-[state=active]:border-destructive ds:dark:data-[state=active]:border-destructive"
     },
     success: {
-      bg: "data-[state=active]:bg-success dark:data-[state=active]:bg-success data-[state=active]:text-success-foreground dark:data-[state=active]:text-success-foreground",
-      text: "data-[state=active]:text-success dark:data-[state=active]:text-success",
-      border: "data-[state=active]:border-success dark:data-[state=active]:border-success"
+      bg: "ds:data-[state=active]:bg-success ds:dark:data-[state=active]:bg-success ds:data-[state=active]:text-success-foreground ds:dark:data-[state=active]:text-success-foreground",
+      text: "ds:data-[state=active]:text-success ds:dark:data-[state=active]:text-success",
+      border: "ds:data-[state=active]:border-success ds:dark:data-[state=active]:border-success"
     },
     warning: {
-      bg: "data-[state=active]:bg-warning dark:data-[state=active]:bg-warning data-[state=active]:text-warning-foreground dark:data-[state=active]:text-warning-foreground",
-      text: "data-[state=active]:text-warning dark:data-[state=active]:text-warning",
-      border: "data-[state=active]:border-warning dark:data-[state=active]:border-warning"
+      bg: "ds:data-[state=active]:bg-warning ds:dark:data-[state=active]:bg-warning ds:data-[state=active]:text-warning-foreground ds:dark:data-[state=active]:text-warning-foreground",
+      text: "ds:data-[state=active]:text-warning ds:dark:data-[state=active]:text-warning",
+      border: "ds:data-[state=active]:border-warning ds:dark:data-[state=active]:border-warning"
     }
   }[t];
-  switch (r) {
+  switch (a) {
     case "bordered":
     case "pills":
-      return `${a.bg} dark:data-[state=active]:border-transparent`;
+      return `${d.bg} ds:dark:data-[state=active]:border-transparent`;
     case "pill-stroke":
-      return "data-[state=active]:bg-transparent dark:data-[state=active]:bg-transparent";
+      return "ds:data-[state=active]:bg-transparent ds:dark:data-[state=active]:bg-transparent";
     case "text":
-      return a.text;
+      return d.text;
     case "outline":
-      return a.border;
+      return d.border;
     case "underlined":
-      return s(a.border, a.text);
+      return s(d.border, d.text);
     case "enclosed":
-      return s(a.border, a.text);
+      return s(d.border, d.text);
     case "enclosed-fill":
-      return s(a.border, a.text);
+      return s(d.border, d.text);
     default:
       return "";
   }
-}, Q = (r, t, e) => {
-  if (r === "underlined")
+}, Q = (a, t, r) => {
+  if (a === "underlined")
     return {
-      top: "border-b",
-      bottom: "border-t",
-      left: "border-r",
-      right: "border-l"
-    }[e];
-  if (r === "enclosed") {
-    const a = {
-      top: "border-b",
-      bottom: "border-t",
-      left: "border-r",
-      right: "border-l"
-    }, d = {
+      top: "ds:border-b",
+      bottom: "ds:border-t",
+      left: "ds:border-r",
+      right: "ds:border-l"
+    }[r];
+  if (a === "enclosed") {
+    const d = {
+      top: "ds:border-b",
+      bottom: "ds:border-t",
+      left: "ds:border-r",
+      right: "ds:border-l"
+    }, e = {
       top: {
-        primary: "border-b-primary",
-        secondary: "border-b-secondary",
-        muted: "border-b-border",
-        accent: "border-b-accent",
-        destructive: "border-b-destructive",
-        success: "border-b-success",
-        warning: "border-b-warning"
+        primary: "ds:border-b-primary",
+        secondary: "ds:border-b-secondary",
+        muted: "ds:border-b-border",
+        accent: "ds:border-b-accent",
+        destructive: "ds:border-b-destructive",
+        success: "ds:border-b-success",
+        warning: "ds:border-b-warning"
       },
       bottom: {
-        primary: "border-t-primary",
-        secondary: "border-t-secondary",
-        muted: "border-t-border",
-        accent: "border-t-accent",
-        destructive: "border-t-destructive",
-        success: "border-t-success",
-        warning: "border-t-warning"
+        primary: "ds:border-t-primary",
+        secondary: "ds:border-t-secondary",
+        muted: "ds:border-t-border",
+        accent: "ds:border-t-accent",
+        destructive: "ds:border-t-destructive",
+        success: "ds:border-t-success",
+        warning: "ds:border-t-warning"
       },
       left: {
-        primary: "border-r-primary",
-        secondary: "border-r-secondary",
-        muted: "border-r-border",
-        accent: "border-r-accent",
-        destructive: "border-r-destructive",
-        success: "border-r-success",
-        warning: "border-r-warning"
+        primary: "ds:border-r-primary",
+        secondary: "ds:border-r-secondary",
+        muted: "ds:border-r-border",
+        accent: "ds:border-r-accent",
+        destructive: "ds:border-r-destructive",
+        success: "ds:border-r-success",
+        warning: "ds:border-r-warning"
       },
       right: {
-        primary: "border-l-primary",
-        secondary: "border-l-secondary",
-        muted: "border-l-border",
-        accent: "border-l-accent",
-        destructive: "border-l-destructive",
-        success: "border-l-success",
-        warning: "border-l-warning"
+        primary: "ds:border-l-primary",
+        secondary: "ds:border-l-secondary",
+        muted: "ds:border-l-border",
+        accent: "ds:border-l-accent",
+        destructive: "ds:border-l-destructive",
+        success: "ds:border-l-success",
+        warning: "ds:border-l-warning"
       }
     };
-    return `${a[e]} ${d[e][t]}`;
+    return `${d[r]} ${e[r][t]}`;
   }
-  if (r === "enclosed-fill") {
-    const a = {
-      top: "border-b",
-      bottom: "border-t",
-      left: "border-r",
-      right: "border-l"
-    }, d = {
+  if (a === "enclosed-fill") {
+    const d = {
+      top: "ds:border-b",
+      bottom: "ds:border-t",
+      left: "ds:border-r",
+      right: "ds:border-l"
+    }, e = {
       top: {
-        primary: "border-b-primary",
-        secondary: "border-b-secondary",
-        muted: "border-b-border",
-        accent: "border-b-accent",
-        destructive: "border-b-destructive",
-        success: "border-b-success",
-        warning: "border-b-warning"
+        primary: "ds:border-b-primary",
+        secondary: "ds:border-b-secondary",
+        muted: "ds:border-b-border",
+        accent: "ds:border-b-accent",
+        destructive: "ds:border-b-destructive",
+        success: "ds:border-b-success",
+        warning: "ds:border-b-warning"
       },
       bottom: {
-        primary: "border-t-primary",
-        secondary: "border-t-secondary",
-        muted: "border-t-border",
-        accent: "border-t-accent",
-        destructive: "border-t-destructive",
-        success: "border-t-success",
-        warning: "border-t-warning"
+        primary: "ds:border-t-primary",
+        secondary: "ds:border-t-secondary",
+        muted: "ds:border-t-border",
+        accent: "ds:border-t-accent",
+        destructive: "ds:border-t-destructive",
+        success: "ds:border-t-success",
+        warning: "ds:border-t-warning"
       },
       left: {
-        primary: "border-r-primary",
-        secondary: "border-r-secondary",
-        muted: "border-r-border",
-        accent: "border-r-accent",
-        destructive: "border-r-destructive",
-        success: "border-r-success",
-        warning: "border-r-warning"
+        primary: "ds:border-r-primary",
+        secondary: "ds:border-r-secondary",
+        muted: "ds:border-r-border",
+        accent: "ds:border-r-accent",
+        destructive: "ds:border-r-destructive",
+        success: "ds:border-r-success",
+        warning: "ds:border-r-warning"
       },
       right: {
-        primary: "border-l-primary",
-        secondary: "border-l-secondary",
-        muted: "border-l-border",
-        accent: "border-l-accent",
-        destructive: "border-l-destructive",
-        success: "border-l-success",
-        warning: "border-l-warning"
+        primary: "ds:border-l-primary",
+        secondary: "ds:border-l-secondary",
+        muted: "ds:border-l-border",
+        accent: "ds:border-l-accent",
+        destructive: "ds:border-l-destructive",
+        success: "ds:border-l-success",
+        warning: "ds:border-l-warning"
       }
     };
-    return `${a[e]} ${d[e][t]}`;
+    return `${d[r]} ${e[r][t]}`;
   }
   return "";
-}, R = (r) => {
+}, R = (a) => {
   const t = "ds:bg-background ds:dark:bg-background ds:rounded-none ds:border-0 ds:border-transparent ds:data-[state=active]:shadow-none";
   return {
-    top: `${t} border-b-2 h-full`,
-    bottom: `${t} border-t-2 h-full`,
-    left: `${t} border-r-2 w-full`,
-    right: `${t} border-l-2 w-full`
-  }[r];
-}, S = (r) => {
+    top: `${t} ds:border-b-2 ds:h-full`,
+    bottom: `${t} ds:border-t-2 ds:h-full`,
+    left: `${t} ds:border-r-2 ds:w-full`,
+    right: `${t} ds:border-l-2 ds:w-full`
+  }[a];
+}, S = (a) => {
   const t = "ds:bg-background ds:dark:bg-background ds:border ds:border-transparent ds:data-[state=active]:shadow-none ds:rounded-none";
   return {
-    top: `${t} rounded-t-md data-[state=active]:border-t data-[state=active]:border-l data-[state=active]:border-r data-[state=active]:border-b-0 data-[state=active]:border-b-background dark:data-[state=active]:border-b-background h-full data-[state=active]:-mb-0.5 data-[state=active]:translate-y-[0px]`,
-    bottom: `${t} rounded-b-md data-[state=active]:border-b data-[state=active]:border-l data-[state=active]:border-r data-[state=active]:border-t-0 data-[state=active]:border-t-background dark:data-[state=active]:border-t-background h-full data-[state=active]:-mt-0.5 data-[state=active]:translate-y-[0px]`,
-    left: `${t} rounded-l-md data-[state=active]:border-t data-[state=active]:border-l data-[state=active]:border-b data-[state=active]:border-r-0 data-[state=active]:border-r-background dark:data-[state=active]:border-r-background w-full data-[state=active]:-mr-0.5 data-[state=active]:translate-x-[1px]`,
-    right: `${t} rounded-r-md data-[state=active]:border-t data-[state=active]:border-r data-[state=active]:border-b data-[state=active]:border-l-0 data-[state=active]:border-l-background dark:data-[state=active]:border-l-background w-full data-[state=active]:-ml-0.5 data-[state=active]:translate-x-[1px]`
-  }[r];
-}, V = (r) => {
+    top: `${t} ds:rounded-t-md ds:data-[state=active]:border-t ds:data-[state=active]:border-l ds:data-[state=active]:border-r ds:data-[state=active]:border-b-0 ds:data-[state=active]:border-b-background dark:ds:data-[state=active]:border-b-background ds:h-full ds:data-[state=active]:-mb-0.5 ds:data-[state=active]:translate-y-[0px]`,
+    bottom: `${t} ds:rounded-b-md ds:data-[state=active]:border-b ds:data-[state=active]:border-l ds:data-[state=active]:border-r ds:data-[state=active]:border-t-0 ds:data-[state=active]:border-t-background dark:ds:data-[state=active]:border-t-background ds:h-full ds:data-[state=active]:-mt-0.5 ds:data-[state=active]:translate-y-[0px]`,
+    left: `${t} ds:rounded-l-md ds:data-[state=active]:border-t ds:data-[state=active]:border-l ds:data-[state=active]:border-b ds:data-[state=active]:border-r-0 ds:data-[state=active]:border-r-background dark:ds:data-[state=active]:border-r-background ds:w-full ds:data-[state=active]:-mr-0.5 ds:data-[state=active]:translate-x-[1px]`,
+    right: `${t} ds:rounded-r-md ds:data-[state=active]:border-t ds:data-[state=active]:border-r ds:data-[state=active]:border-b ds:data-[state=active]:border-l-0 ds:data-[state=active]:border-l-background dark:ds:data-[state=active]:border-l-background ds:w-full ds:data-[state=active]:-ml-0.5 ds:data-[state=active]:translate-x-[1px]`
+  }[a];
+}, V = (a) => {
   const t = "ds:bg-muted ds:dark:bg-muted ds:border ds:border-transparent ds:data-[state=active]:bg-background ds:dark:data-[state=active]:bg-background ds:data-[state=active]:shadow-none ds:rounded-none";
   return {
-    top: `${t} rounded-t-md data-[state=active]:border-t data-[state=active]:border-l data-[state=active]:border-r data-[state=active]:border-b-0 data-[state=active]:border-b-background dark:data-[state=active]:border-b-background h-full data-[state=active]:-mb-0.5 data-[state=active]:translate-y-[0px]`,
-    bottom: `${t} rounded-b-md data-[state=active]:border-b data-[state=active]:border-l data-[state=active]:border-r data-[state=active]:border-t-0 data-[state=active]:border-t-background dark:data-[state=active]:border-t-background h-full data-[state=active]:-mt-0.5 data-[state=active]:translate-y-[0px]`,
-    left: `${t} rounded-l-md data-[state=active]:border-t data-[state=active]:border-l data-[state=active]:border-b data-[state=active]:border-r-0 data-[state=active]:border-r-background dark:data-[state=active]:border-r-background w-full data-[state=active]:-mr-0.5 data-[state=active]:translate-x-[1px]`,
-    right: `${t} rounded-r-md data-[state=active]:border-t data-[state=active]:border-r data-[state=active]:border-b data-[state=active]:border-l-0 data-[state=active]:border-l-background dark:data-[state=active]:border-l-background w-full data-[state=active]:-ml-0.5 data-[state=active]:translate-x-[1px]`
-  }[r];
+    top: `${t} ds:rounded-t-md ds:data-[state=active]:border-t ds:data-[state=active]:border-l ds:data-[state=active]:border-r ds:data-[state=active]:border-b-0 ds:data-[state=active]:border-b-background dark:ds:data-[state=active]:border-b-background ds:h-full ds:data-[state=active]:-mb-0.5 ds:data-[state=active]:translate-y-[0px]`,
+    bottom: `${t} ds:rounded-b-md ds:data-[state=active]:border-b ds:data-[state=active]:border-l ds:data-[state=active]:border-r ds:data-[state=active]:border-t-0 ds:data-[state=active]:border-t-background dark:ds:data-[state=active]:border-t-background ds:h-full ds:data-[state=active]:-mt-0.5 ds:data-[state=active]:translate-y-[0px]`,
+    left: `${t} ds:rounded-l-md ds:data-[state=active]:border-t ds:data-[state=active]:border-l ds:data-[state=active]:border-b ds:data-[state=active]:border-r-0 ds:data-[state=active]:border-r-background dark:ds:data-[state=active]:border-r-background ds:w-full ds:data-[state=active]:-mr-0.5 ds:data-[state=active]:translate-x-[1px]`,
+    right: `${t} ds:rounded-r-md ds:data-[state=active]:border-t ds:data-[state=active]:border-r ds:data-[state=active]:border-b ds:data-[state=active]:border-l-0 ds:data-[state=active]:border-l-background dark:ds:data-[state=active]:border-l-background ds:w-full ds:data-[state=active]:-ml-0.5 ds:data-[state=active]:translate-x-[1px]`
+  }[a];
 }, W = {
   // Solid: Default style (muted background, active has white background)
   solid: {

package/dist/esm/components/Tabs/classes.js.map

@@ -1 +1 @@
-{"version":3,"file":"classes.js","sources":["../../../../src/components/Tabs/classes.ts"],"sourcesContent":["import { cn } from \"@dsui/ui/index\";\nimport type {\n  TabAlignment,\n  TabColor,\n  TabPosition,\n  TabSize,\n  TabVariant,\n} from \"./types\";\n\nexport const sizeClasses: Record<\n  TabSize,\n  { horizontal: string; vertical: string }\n> = {\n  sm: {\n    horizontal: \"ds:text-xs ds:h-7 ds:[&>button]:px-2\",\n    vertical: \"ds:text-xs ds:[&>button]:py-0.5\",\n  },\n  md: {\n    horizontal: \"ds:text-sm ds:h-9 ds:[&>button]:px-3\",\n    vertical: \"ds:text-sm ds:[&>button]:py-1\",\n  },\n  lg: {\n    horizontal: \"ds:text-base ds:h-11 ds:[&>button]:px-4\",\n    vertical: \"ds:text-base ds:[&>button]:py-1.5\",\n  },\n};\n\nexport const alignmentClasses: Record<\n  TabAlignment,\n  { horizontal: string; vertical: string }\n> = {\n  start: {\n    horizontal: \"ds:justify-start\",\n    vertical: \"ds:items-start\",\n  },\n  center: {\n    horizontal: \"ds:justify-center\",\n    vertical: \"ds:items-center\",\n  },\n  end: {\n    horizontal: \"ds:justify-end\",\n    vertical: \"ds:items-end\",\n  },\n};\n\nexport const positionClasses: Record<\n  TabPosition,\n  { root: string; list: string }\n> = {\n  top: {\n    root: \"ds:flex ds:flex-col\",\n    list: \"ds:flex-row\",\n  },\n  bottom: {\n    root: \"ds:flex ds:flex-col-reverse\",\n    list: \"ds:flex-row\",\n  },\n  left: {\n    root: \"ds:flex ds:flex-row\",\n    list: \"ds:flex-col ds:h-fit\",\n  },\n  right: {\n    root: \"ds:flex ds:flex-row-reverse\",\n    list: \"ds:flex-col ds:h-fit\",\n  },\n};\n\n// Color classes for backgrounds, text, and borders\nexport const getColorClasses = (\n  variant: TabVariant,\n  color: TabColor\n): string => {\n  // Helper to generate color-specific classes based on variant\n  const colorMap: Record<\n    TabColor,\n    { bg: string; text: string; border: string }\n  > = {\n    primary: {\n      bg: \"data-[state=active]:bg-primary dark:data-[state=active]:bg-primary data-[state=active]:text-primary-foreground dark:data-[state=active]:text-primary-foreground\",\n      text: \"data-[state=active]:text-primary dark:data-[state=active]:text-primary\",\n      border:\n        \"data-[state=active]:border-primary dark:data-[state=active]:border-primary\",\n    },\n    secondary: {\n      bg: \"data-[state=active]:bg-secondary dark:data-[state=active]:bg-secondary data-[state=active]:text-secondary-foreground dark:data-[state=active]:text-secondary-foreground\",\n      text: \"data-[state=active]:text-secondary dark:data-[state=active]:text-secondary\",\n      border:\n        \"data-[state=active]:border-secondary dark:data-[state=active]:border-secondary\",\n    },\n    muted: {\n      bg: \"data-[state=active]:bg-muted dark:data-[state=active]:bg-muted data-[state=active]:text-muted-foreground dark:data-[state=active]:text-muted-foreground\",\n      text: \"data-[state=active]:text-muted-foreground dark:data-[state=active]:text-muted-foreground\",\n      border:\n        \"data-[state=active]:border-border dark:data-[state=active]:border-border\",\n    },\n    accent: {\n      bg: \"data-[state=active]:bg-accent dark:data-[state=active]:bg-accent data-[state=active]:text-accent-foreground dark:data-[state=active]:text-accent-foreground\",\n      text: \"data-[state=active]:text-accent-foreground dark:data-[state=active]:text-accent-foreground\",\n      border:\n        \"data-[state=active]:border-accent dark:data-[state=active]:border-accent\",\n    },\n    destructive: {\n      bg: \"data-[state=active]:bg-destructive dark:data-[state=active]:bg-destructive data-[state=active]:text-destructive-foreground dark:data-[state=active]:text-destructive-foreground\",\n      text: \"data-[state=active]:text-destructive dark:data-[state=active]:text-destructive\",\n      border:\n        \"data-[state=active]:border-destructive dark:data-[state=active]:border-destructive\",\n    },\n    success: {\n      bg: \"data-[state=active]:bg-success dark:data-[state=active]:bg-success data-[state=active]:text-success-foreground dark:data-[state=active]:text-success-foreground\",\n      text: \"data-[state=active]:text-success dark:data-[state=active]:text-success\",\n      border:\n        \"data-[state=active]:border-success dark:data-[state=active]:border-success\",\n    },\n    warning: {\n      bg: \"data-[state=active]:bg-warning dark:data-[state=active]:bg-warning data-[state=active]:text-warning-foreground dark:data-[state=active]:text-warning-foreground\",\n      text: \"data-[state=active]:text-warning dark:data-[state=active]:text-warning\",\n      border:\n        \"data-[state=active]:border-warning dark:data-[state=active]:border-warning\",\n    },\n  };\n\n  const colors = colorMap[color];\n\n  switch (variant) {\n    case \"bordered\":\n    case \"pills\":\n      // Background color on active state\n      return `${colors.bg} dark:data-[state=active]:border-transparent`;\n    case \"pill-stroke\":\n      // Border color on active state, no background\n      return `data-[state=active]:bg-transparent dark:data-[state=active]:bg-transparent`;\n    case \"text\":\n      // Text color only on active state\n      return colors.text;\n    case \"outline\":\n      // Border color on active state\n      return colors.border;\n    case \"underlined\":\n      // Bottom/side border color on active state\n      return cn(colors.border, colors.text);\n    case \"enclosed\":\n      // Border color on active state (except bottom/side)\n      return cn(colors.border, colors.text);\n    case \"enclosed-fill\":\n      // Border color on active state (except bottom/side)\n      return cn(colors.border, colors.text);\n    default:\n      return \"\";\n  }\n};\n\n// Get TabsList border classes based on position\nexport const getListBorderClasses = (\n  variant: TabVariant,\n  color: TabColor,\n  tabPosition: TabPosition\n): string => {\n  if (variant === \"underlined\") {\n    // Underlined variant: border on the opposite side from where tabs connect\n    const borderMap: Record<TabPosition, string> = {\n      top: \"border-b\",\n      bottom: \"border-t\",\n      left: \"border-r\",\n      right: \"border-l\",\n    };\n    return borderMap[tabPosition];\n  }\n\n  if (variant === \"enclosed\") {\n    // Enclosed variant: colored border on the opposite side\n    const borderBaseMap: Record<TabPosition, string> = {\n      top: \"border-b\",\n      bottom: \"border-t\",\n      left: \"border-r\",\n      right: \"border-l\",\n    };\n\n    const colorBorderMap: Record<TabPosition, Record<TabColor, string>> = {\n      top: {\n        primary: \"border-b-primary\",\n        secondary: \"border-b-secondary\",\n        muted: \"border-b-border\",\n        accent: \"border-b-accent\",\n        destructive: \"border-b-destructive\",\n        success: \"border-b-success\",\n        warning: \"border-b-warning\",\n      },\n      bottom: {\n        primary: \"border-t-primary\",\n        secondary: \"border-t-secondary\",\n        muted: \"border-t-border\",\n        accent: \"border-t-accent\",\n        destructive: \"border-t-destructive\",\n        success: \"border-t-success\",\n        warning: \"border-t-warning\",\n      },\n      left: {\n        primary: \"border-r-primary\",\n        secondary: \"border-r-secondary\",\n        muted: \"border-r-border\",\n        accent: \"border-r-accent\",\n        destructive: \"border-r-destructive\",\n        success: \"border-r-success\",\n        warning: \"border-r-warning\",\n      },\n      right: {\n        primary: \"border-l-primary\",\n        secondary: \"border-l-secondary\",\n        muted: \"border-l-border\",\n        accent: \"border-l-accent\",\n        destructive: \"border-l-destructive\",\n        success: \"border-l-success\",\n        warning: \"border-l-warning\",\n      },\n    };\n    return `${borderBaseMap[tabPosition]} ${colorBorderMap[tabPosition][color]}`;\n  }\n\n  if (variant === \"enclosed-fill\") {\n    // Enclosed-fill variant: colored border on the opposite side\n    const borderBaseMap: Record<TabPosition, string> = {\n      top: \"border-b\",\n      bottom: \"border-t\",\n      left: \"border-r\",\n      right: \"border-l\",\n    };\n\n    const colorBorderMap: Record<TabPosition, Record<TabColor, string>> = {\n      top: {\n        primary: \"border-b-primary\",\n        secondary: \"border-b-secondary\",\n        muted: \"border-b-border\",\n        accent: \"border-b-accent\",\n        destructive: \"border-b-destructive\",\n        success: \"border-b-success\",\n        warning: \"border-b-warning\",\n      },\n      bottom: {\n        primary: \"border-t-primary\",\n        secondary: \"border-t-secondary\",\n        muted: \"border-t-border\",\n        accent: \"border-t-accent\",\n        destructive: \"border-t-destructive\",\n        success: \"border-t-success\",\n        warning: \"border-t-warning\",\n      },\n      left: {\n        primary: \"border-r-primary\",\n        secondary: \"border-r-secondary\",\n        muted: \"border-r-border\",\n        accent: \"border-r-accent\",\n        destructive: \"border-r-destructive\",\n        success: \"border-r-success\",\n        warning: \"border-r-warning\",\n      },\n      right: {\n        primary: \"border-l-primary\",\n        secondary: \"border-l-secondary\",\n        muted: \"border-l-border\",\n        accent: \"border-l-accent\",\n        destructive: \"border-l-destructive\",\n        success: \"border-l-success\",\n        warning: \"border-l-warning\",\n      },\n    };\n    return `${borderBaseMap[tabPosition]} ${colorBorderMap[tabPosition][color]}`;\n  }\n\n  return \"\";\n};\n\n// Get trigger border classes for underlined variant based on position\nexport const getUnderlinedTriggerClasses = (\n  tabPosition: TabPosition\n): string => {\n  const baseClasses =\n    \"ds:bg-background ds:dark:bg-background ds:rounded-none ds:border-0 ds:border-transparent ds:data-[state=active]:shadow-none\";\n\n  const positionMap: Record<TabPosition, string> = {\n    top: `${baseClasses} border-b-2 h-full`,\n    bottom: `${baseClasses} border-t-2 h-full`,\n    left: `${baseClasses} border-r-2 w-full`,\n    right: `${baseClasses} border-l-2 w-full`,\n  };\n\n  return positionMap[tabPosition];\n};\n\n// Get trigger border classes for enclosed variant based on position\nexport const getEnclosedTriggerClasses = (tabPosition: TabPosition): string => {\n  const baseClasses =\n    \"ds:bg-background ds:dark:bg-background ds:border ds:border-transparent ds:data-[state=active]:shadow-none ds:rounded-none\";\n\n  const positionMap: Record<TabPosition, string> = {\n    top: `${baseClasses} rounded-t-md data-[state=active]:border-t data-[state=active]:border-l data-[state=active]:border-r data-[state=active]:border-b-0 data-[state=active]:border-b-background dark:data-[state=active]:border-b-background h-full data-[state=active]:-mb-0.5 data-[state=active]:translate-y-[0px]`,\n    bottom: `${baseClasses} rounded-b-md data-[state=active]:border-b data-[state=active]:border-l data-[state=active]:border-r data-[state=active]:border-t-0 data-[state=active]:border-t-background dark:data-[state=active]:border-t-background h-full data-[state=active]:-mt-0.5 data-[state=active]:translate-y-[0px]`,\n    left: `${baseClasses} rounded-l-md data-[state=active]:border-t data-[state=active]:border-l data-[state=active]:border-b data-[state=active]:border-r-0 data-[state=active]:border-r-background dark:data-[state=active]:border-r-background w-full data-[state=active]:-mr-0.5 data-[state=active]:translate-x-[1px]`,\n    right: `${baseClasses} rounded-r-md data-[state=active]:border-t data-[state=active]:border-r data-[state=active]:border-b data-[state=active]:border-l-0 data-[state=active]:border-l-background dark:data-[state=active]:border-l-background w-full data-[state=active]:-ml-0.5 data-[state=active]:translate-x-[1px]`,\n  };\n\n  return positionMap[tabPosition];\n};\n\n// Get trigger border classes for enclosed-fill variant based on position\nexport const getEnclosedFillTriggerClasses = (\n  tabPosition: TabPosition\n): string => {\n  const baseClasses =\n    \"ds:bg-muted ds:dark:bg-muted ds:border ds:border-transparent ds:data-[state=active]:bg-background ds:dark:data-[state=active]:bg-background ds:data-[state=active]:shadow-none ds:rounded-none\";\n\n  const positionMap: Record<TabPosition, string> = {\n    top: `${baseClasses} rounded-t-md data-[state=active]:border-t data-[state=active]:border-l data-[state=active]:border-r data-[state=active]:border-b-0 data-[state=active]:border-b-background dark:data-[state=active]:border-b-background h-full data-[state=active]:-mb-0.5 data-[state=active]:translate-y-[0px]`,\n    bottom: `${baseClasses} rounded-b-md data-[state=active]:border-b data-[state=active]:border-l data-[state=active]:border-r data-[state=active]:border-t-0 data-[state=active]:border-t-background dark:data-[state=active]:border-t-background h-full data-[state=active]:-mt-0.5 data-[state=active]:translate-y-[0px]`,\n    left: `${baseClasses} rounded-l-md data-[state=active]:border-t data-[state=active]:border-l data-[state=active]:border-b data-[state=active]:border-r-0 data-[state=active]:border-r-background dark:data-[state=active]:border-r-background w-full data-[state=active]:-mr-0.5 data-[state=active]:translate-x-[1px]`,\n    right: `${baseClasses} rounded-r-md data-[state=active]:border-t data-[state=active]:border-r data-[state=active]:border-b data-[state=active]:border-l-0 data-[state=active]:border-l-background dark:data-[state=active]:border-l-background w-full data-[state=active]:-ml-0.5 data-[state=active]:translate-x-[1px]`,\n  };\n\n  return positionMap[tabPosition];\n};\n\nexport const variantClasses: Record<\n  TabVariant,\n  {\n    list: { horizontal: string; vertical: string };\n    trigger: { horizontal: string; vertical: string };\n  }\n> = {\n  // Solid: Default style (muted background, active has white background)\n  solid: {\n    list: {\n      horizontal: \"ds:bg-muted ds:dark:bg-muted ds:rounded-lg ds:p-[3px]\",\n      vertical: \"ds:bg-muted ds:dark:bg-muted ds:rounded-lg ds:p-[3px]\",\n    },\n    trigger: {\n      horizontal: \"\",\n      vertical: \"\",\n    },\n  },\n\n  // Bordered: With border on group and colored active background\n  bordered: {\n    list: {\n      horizontal:\n        \"ds:bg-background ds:dark:bg-background ds:border ds:p-1 ds:gap-1 ds:rounded-lg\",\n      vertical: \"ds:bg-background ds:dark:bg-background ds:border ds:p-1 ds:gap-1 ds:rounded-lg\",\n    },\n    trigger: {\n      horizontal: \"\",\n      vertical: \"\",\n    },\n  },\n\n  // Pills: No border/background on group, colored background on active button\n  pills: {\n    list: {\n      horizontal: \"ds:bg-transparent ds:p-0 ds:gap-1\",\n      vertical: \"ds:bg-transparent ds:p-0 ds:gap-1\",\n    },\n    trigger: {\n      horizontal: \"\",\n      vertical: \"\",\n    },\n  },\n\n  // Pill-stroke: Pill-style with stroke border, stronger border radius, no background on active\n  \"pill-stroke\": {\n    list: {\n      horizontal: \"ds:bg-transparent ds:p-0 ds:gap-1\",\n      vertical: \"ds:bg-transparent ds:p-0 ds:gap-1\",\n    },\n    trigger: {\n      horizontal: \"ds:border ds:border-border ds:rounded-full ds:bg-transparent\",\n      vertical: \"ds:border ds:border-border ds:rounded-full ds:bg-transparent\",\n    },\n  },\n\n  // Text: No border/background on group, colored text on active button\n  text: {\n    list: {\n      horizontal: \"ds:bg-transparent ds:p-0 ds:gap-1\",\n      vertical: \"ds:bg-transparent ds:p-0 ds:gap-1\",\n    },\n    trigger: {\n      horizontal:\n        \"ds:bg-transparent ds:data-[state=active]:bg-transparent ds:data-[state=active]:shadow-none\",\n      vertical:\n        \"ds:bg-transparent ds:data-[state=active]:bg-transparent ds:data-[state=active]:shadow-none\",\n    },\n  },\n\n  // Outline: No border/background on group, colored border (stroke) on active button\n  outline: {\n    list: {\n      horizontal: \"ds:bg-transparent ds:p-0 ds:gap-1\",\n      vertical: \"ds:bg-transparent ds:p-0 ds:gap-1\",\n    },\n    trigger: {\n      horizontal:\n        \"ds:bg-transparent ds:border ds:border-transparent ds:data-[state=active]:bg-transparent ds:data-[state=active]:shadow-none\",\n      vertical:\n        \"ds:bg-transparent ds:border ds:border-transparent ds:data-[state=active]:bg-transparent ds:data-[state=active]:shadow-none\",\n    },\n  },\n\n  // Underlined: Bottom border on group, bottom border on active tab\n  underlined: {\n    list: {\n      horizontal: \"ds:bg-background ds:dark:bg-background ds:rounded-none ds:p-0\",\n      vertical: \"ds:bg-background ds:dark:bg-background ds:rounded-none ds:p-0\",\n    },\n    trigger: {\n      horizontal: \"\", // Will be set dynamically\n      vertical: \"\", // Will be set dynamically\n    },\n  },\n\n  // Enclosed: Border on active tab except bottom border (tab style)\n  enclosed: {\n    list: {\n      horizontal:\n        \"ds:bg-background ds:dark:bg-background ds:justify-start ds:rounded-none ds:p-0\",\n      vertical: \"ds:bg-background ds:dark:bg-background ds:items-start ds:rounded-none ds:p-0\",\n    },\n    trigger: {\n      horizontal: \"\", // Will be set dynamically\n      vertical: \"\", // Will be set dynamically\n    },\n  },\n\n  // Enclosed-fill: Border on active tab except bottom border with background on inactive tabs\n  \"enclosed-fill\": {\n    list: {\n      horizontal:\n        \"ds:bg-background ds:dark:bg-background ds:justify-start ds:rounded-none ds:p-0 ds:gap-1\",\n      vertical:\n        \"ds:bg-background ds:dark:bg-background ds:items-start ds:rounded-none ds:p-0 ds:gap-1\",\n    },\n    trigger: {\n      horizontal: \"\", // Will be set dynamically\n      vertical: \"\", // Will be set dynamically\n    },\n  },\n};\n"],"names":["sizeClasses","alignmentClasses","positionClasses","getColorClasses","variant","color","colors","cn","getListBorderClasses","tabPosition","borderBaseMap","colorBorderMap","getUnderlinedTriggerClasses","baseClasses","getEnclosedTriggerClasses","getEnclosedFillTriggerClasses","variantClasses"],"mappings":"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"}
+{"version":3,"file":"classes.js","sources":["../../../../src/components/Tabs/classes.ts"],"sourcesContent":["import { cn } from \"@dsui/ui/index\";\nimport type {\n  TabAlignment,\n  TabColor,\n  TabPosition,\n  TabSize,\n  TabVariant,\n} from \"./types\";\n\nexport const sizeClasses: Record<\n  TabSize,\n  { horizontal: string; vertical: string }\n> = {\n  sm: {\n    horizontal: \"ds:text-xs ds:h-7 ds:[&>button]:px-2\",\n    vertical: \"ds:text-xs ds:[&>button]:py-0.5\",\n  },\n  md: {\n    horizontal: \"ds:text-sm ds:h-9 ds:[&>button]:px-3\",\n    vertical: \"ds:text-sm ds:[&>button]:py-1\",\n  },\n  lg: {\n    horizontal: \"ds:text-base ds:h-11 ds:[&>button]:px-4\",\n    vertical: \"ds:text-base ds:[&>button]:py-1.5\",\n  },\n};\n\nexport const alignmentClasses: Record<\n  TabAlignment,\n  { horizontal: string; vertical: string }\n> = {\n  start: {\n    horizontal: \"ds:justify-start\",\n    vertical: \"ds:items-start\",\n  },\n  center: {\n    horizontal: \"ds:justify-center\",\n    vertical: \"ds:items-center\",\n  },\n  end: {\n    horizontal: \"ds:justify-end\",\n    vertical: \"ds:items-end\",\n  },\n};\n\nexport const positionClasses: Record<\n  TabPosition,\n  { root: string; list: string }\n> = {\n  top: {\n    root: \"ds:flex ds:flex-col\",\n    list: \"ds:flex-row\",\n  },\n  bottom: {\n    root: \"ds:flex ds:flex-col-reverse\",\n    list: \"ds:flex-row\",\n  },\n  left: {\n    root: \"ds:flex ds:flex-row\",\n    list: \"ds:flex-col ds:h-fit\",\n  },\n  right: {\n    root: \"ds:flex ds:flex-row-reverse\",\n    list: \"ds:flex-col ds:h-fit\",\n  },\n};\n\n// Color classes for backgrounds, text, and borders\nexport const getColorClasses = (\n  variant: TabVariant,\n  color: TabColor\n): string => {\n  // Helper to generate color-specific classes based on variant\n  const colorMap: Record<\n    TabColor,\n    { bg: string; text: string; border: string }\n  > = {\n    primary: {\n      bg: \"ds:data-[state=active]:bg-primary ds:dark:data-[state=active]:bg-primary ds:data-[state=active]:text-primary-foreground ds:dark:data-[state=active]:text-primary-foreground\",\n      text: \"ds:data-[state=active]:text-primary ds:dark:data-[state=active]:text-primary\",\n      border:\n        \"ds:data-[state=active]:border-primary ds:dark:data-[state=active]:border-primary\",\n    },\n    secondary: {\n      bg: \"ds:data-[state=active]:bg-secondary ds:dark:data-[state=active]:bg-secondary ds:data-[state=active]:text-secondary-foreground ds:dark:data-[state=active]:text-secondary-foreground\",\n      text: \"ds:data-[state=active]:text-secondary ds:dark:data-[state=active]:text-secondary\",\n      border:\n        \"ds:data-[state=active]:border-secondary ds:dark:data-[state=active]:border-secondary\",\n    },\n    muted: {\n      bg: \"ds:data-[state=active]:bg-muted ds:dark:data-[state=active]:bg-muted ds:data-[state=active]:text-muted-foreground ds:dark:data-[state=active]:text-muted-foreground\",\n      text: \"ds:data-[state=active]:text-muted-foreground ds:dark:data-[state=active]:text-muted-foreground\",\n      border:\n        \"ds:data-[state=active]:border-border ds:dark:data-[state=active]:border-border\",\n    },\n    accent: {\n      bg: \"ds:data-[state=active]:bg-accent ds:dark:data-[state=active]:bg-accent ds:data-[state=active]:text-accent-foreground ds:dark:data-[state=active]:text-accent-foreground\",\n      text: \"ds:data-[state=active]:text-accent-foreground ds:dark:data-[state=active]:text-accent-foreground\",\n      border:\n        \"ds:data-[state=active]:border-accent ds:dark:data-[state=active]:border-accent\",\n    },\n    destructive: {\n      bg: \"ds:data-[state=active]:bg-destructive ds:dark:data-[state=active]:bg-destructive ds:data-[state=active]:text-destructive-foreground ds:dark:data-[state=active]:text-destructive-foreground\",\n      text: \"ds:data-[state=active]:text-destructive ds:dark:data-[state=active]:text-destructive\",\n      border:\n        \"ds:data-[state=active]:border-destructive ds:dark:data-[state=active]:border-destructive\",\n    },\n    success: {\n      bg: \"ds:data-[state=active]:bg-success ds:dark:data-[state=active]:bg-success ds:data-[state=active]:text-success-foreground ds:dark:data-[state=active]:text-success-foreground\",\n      text: \"ds:data-[state=active]:text-success ds:dark:data-[state=active]:text-success\",\n      border:\n        \"ds:data-[state=active]:border-success ds:dark:data-[state=active]:border-success\",\n    },\n    warning: {\n      bg: \"ds:data-[state=active]:bg-warning ds:dark:data-[state=active]:bg-warning ds:data-[state=active]:text-warning-foreground ds:dark:data-[state=active]:text-warning-foreground\",\n      text: \"ds:data-[state=active]:text-warning ds:dark:data-[state=active]:text-warning\",\n      border:\n        \"ds:data-[state=active]:border-warning ds:dark:data-[state=active]:border-warning\",\n    },\n  };\n\n  const colors = colorMap[color];\n\n  switch (variant) {\n    case \"bordered\":\n    case \"pills\":\n      // Background color on active state\n      return `${colors.bg} ds:dark:data-[state=active]:border-transparent`;\n    case \"pill-stroke\":\n      // Border color on active state, no background\n      return `ds:data-[state=active]:bg-transparent ds:dark:data-[state=active]:bg-transparent`;\n    case \"text\":\n      // Text color only on active state\n      return colors.text;\n    case \"outline\":\n      // Border color on active state\n      return colors.border;\n    case \"underlined\":\n      // Bottom/side border color on active state\n      return cn(colors.border, colors.text);\n    case \"enclosed\":\n      // Border color on active state (except bottom/side)\n      return cn(colors.border, colors.text);\n    case \"enclosed-fill\":\n      // Border color on active state (except bottom/side)\n      return cn(colors.border, colors.text);\n    default:\n      return \"\";\n  }\n};\n\n// Get TabsList border classes based on position\nexport const getListBorderClasses = (\n  variant: TabVariant,\n  color: TabColor,\n  tabPosition: TabPosition\n): string => {\n  if (variant === \"underlined\") {\n    // Underlined variant: border on the opposite side from where tabs connect\n    const borderMap: Record<TabPosition, string> = {\n      top: \"ds:border-b\",\n      bottom: \"ds:border-t\",\n      left: \"ds:border-r\",\n      right: \"ds:border-l\",\n    };\n    return borderMap[tabPosition];\n  }\n\n  if (variant === \"enclosed\") {\n    // Enclosed variant: colored border on the opposite side\n    const borderBaseMap: Record<TabPosition, string> = {\n      top: \"ds:border-b\",\n      bottom: \"ds:border-t\",\n      left: \"ds:border-r\",\n      right: \"ds:border-l\",\n    };\n\n    const colorBorderMap: Record<TabPosition, Record<TabColor, string>> = {\n      top: {\n        primary: \"ds:border-b-primary\",\n        secondary: \"ds:border-b-secondary\",\n        muted: \"ds:border-b-border\",\n        accent: \"ds:border-b-accent\",\n        destructive: \"ds:border-b-destructive\",\n        success: \"ds:border-b-success\",\n        warning: \"ds:border-b-warning\",\n      },\n      bottom: {\n        primary: \"ds:border-t-primary\",\n        secondary: \"ds:border-t-secondary\",\n        muted: \"ds:border-t-border\",\n        accent: \"ds:border-t-accent\",\n        destructive: \"ds:border-t-destructive\",\n        success: \"ds:border-t-success\",\n        warning: \"ds:border-t-warning\",\n      },\n      left: {\n        primary: \"ds:border-r-primary\",\n        secondary: \"ds:border-r-secondary\",\n        muted: \"ds:border-r-border\",\n        accent: \"ds:border-r-accent\",\n        destructive: \"ds:border-r-destructive\",\n        success: \"ds:border-r-success\",\n        warning: \"ds:border-r-warning\",\n      },\n      right: {\n        primary: \"ds:border-l-primary\",\n        secondary: \"ds:border-l-secondary\",\n        muted: \"ds:border-l-border\",\n        accent: \"ds:border-l-accent\",\n        destructive: \"ds:border-l-destructive\",\n        success: \"ds:border-l-success\",\n        warning: \"ds:border-l-warning\",\n      },\n    };\n    return `${borderBaseMap[tabPosition]} ${colorBorderMap[tabPosition][color]}`;\n  }\n\n  if (variant === \"enclosed-fill\") {\n    // Enclosed-fill variant: colored border on the opposite side\n    const borderBaseMap: Record<TabPosition, string> = {\n      top: \"ds:border-b\",\n      bottom: \"ds:border-t\",\n      left: \"ds:border-r\",\n      right: \"ds:border-l\",\n    };\n\n    const colorBorderMap: Record<TabPosition, Record<TabColor, string>> = {\n      top: {\n        primary: \"ds:border-b-primary\",\n        secondary: \"ds:border-b-secondary\",\n        muted: \"ds:border-b-border\",\n        accent: \"ds:border-b-accent\",\n        destructive: \"ds:border-b-destructive\",\n        success: \"ds:border-b-success\",\n        warning: \"ds:border-b-warning\",\n      },\n      bottom: {\n        primary: \"ds:border-t-primary\",\n        secondary: \"ds:border-t-secondary\",\n        muted: \"ds:border-t-border\",\n        accent: \"ds:border-t-accent\",\n        destructive: \"ds:border-t-destructive\",\n        success: \"ds:border-t-success\",\n        warning: \"ds:border-t-warning\",\n      },\n      left: {\n        primary: \"ds:border-r-primary\",\n        secondary: \"ds:border-r-secondary\",\n        muted: \"ds:border-r-border\",\n        accent: \"ds:border-r-accent\",\n        destructive: \"ds:border-r-destructive\",\n        success: \"ds:border-r-success\",\n        warning: \"ds:border-r-warning\",\n      },\n      right: {\n        primary: \"ds:border-l-primary\",\n        secondary: \"ds:border-l-secondary\",\n        muted: \"ds:border-l-border\",\n        accent: \"ds:border-l-accent\",\n        destructive: \"ds:border-l-destructive\",\n        success: \"ds:border-l-success\",\n        warning: \"ds:border-l-warning\",\n      },\n    };\n    return `${borderBaseMap[tabPosition]} ${colorBorderMap[tabPosition][color]}`;\n  }\n\n  return \"\";\n};\n\n// Get trigger border classes for underlined variant based on position\nexport const getUnderlinedTriggerClasses = (\n  tabPosition: TabPosition\n): string => {\n  const baseClasses =\n    \"ds:bg-background ds:dark:bg-background ds:rounded-none ds:border-0 ds:border-transparent ds:data-[state=active]:shadow-none\";\n\n  const positionMap: Record<TabPosition, string> = {\n    top: `${baseClasses} ds:border-b-2 ds:h-full`,\n    bottom: `${baseClasses} ds:border-t-2 ds:h-full`,\n    left: `${baseClasses} ds:border-r-2 ds:w-full`,\n    right: `${baseClasses} ds:border-l-2 ds:w-full`,\n  };\n\n  return positionMap[tabPosition];\n};\n\n// Get trigger border classes for enclosed variant based on position\nexport const getEnclosedTriggerClasses = (tabPosition: TabPosition): string => {\n  const baseClasses =\n    \"ds:bg-background ds:dark:bg-background ds:border ds:border-transparent ds:data-[state=active]:shadow-none ds:rounded-none\";\n\n  const positionMap: Record<TabPosition, string> = {\n    top: `${baseClasses} ds:rounded-t-md ds:data-[state=active]:border-t ds:data-[state=active]:border-l ds:data-[state=active]:border-r ds:data-[state=active]:border-b-0 ds:data-[state=active]:border-b-background dark:ds:data-[state=active]:border-b-background ds:h-full ds:data-[state=active]:-mb-0.5 ds:data-[state=active]:translate-y-[0px]`,\n    bottom: `${baseClasses} ds:rounded-b-md ds:data-[state=active]:border-b ds:data-[state=active]:border-l ds:data-[state=active]:border-r ds:data-[state=active]:border-t-0 ds:data-[state=active]:border-t-background dark:ds:data-[state=active]:border-t-background ds:h-full ds:data-[state=active]:-mt-0.5 ds:data-[state=active]:translate-y-[0px]`,\n    left: `${baseClasses} ds:rounded-l-md ds:data-[state=active]:border-t ds:data-[state=active]:border-l ds:data-[state=active]:border-b ds:data-[state=active]:border-r-0 ds:data-[state=active]:border-r-background dark:ds:data-[state=active]:border-r-background ds:w-full ds:data-[state=active]:-mr-0.5 ds:data-[state=active]:translate-x-[1px]`,\n    right: `${baseClasses} ds:rounded-r-md ds:data-[state=active]:border-t ds:data-[state=active]:border-r ds:data-[state=active]:border-b ds:data-[state=active]:border-l-0 ds:data-[state=active]:border-l-background dark:ds:data-[state=active]:border-l-background ds:w-full ds:data-[state=active]:-ml-0.5 ds:data-[state=active]:translate-x-[1px]`,\n  };\n\n  return positionMap[tabPosition];\n};\n\n// Get trigger border classes for enclosed-fill variant based on position\nexport const getEnclosedFillTriggerClasses = (\n  tabPosition: TabPosition\n): string => {\n  const baseClasses =\n    \"ds:bg-muted ds:dark:bg-muted ds:border ds:border-transparent ds:data-[state=active]:bg-background ds:dark:data-[state=active]:bg-background ds:data-[state=active]:shadow-none ds:rounded-none\";\n\n  const positionMap: Record<TabPosition, string> = {\n    top: `${baseClasses} ds:rounded-t-md ds:data-[state=active]:border-t ds:data-[state=active]:border-l ds:data-[state=active]:border-r ds:data-[state=active]:border-b-0 ds:data-[state=active]:border-b-background dark:ds:data-[state=active]:border-b-background ds:h-full ds:data-[state=active]:-mb-0.5 ds:data-[state=active]:translate-y-[0px]`,\n    bottom: `${baseClasses} ds:rounded-b-md ds:data-[state=active]:border-b ds:data-[state=active]:border-l ds:data-[state=active]:border-r ds:data-[state=active]:border-t-0 ds:data-[state=active]:border-t-background dark:ds:data-[state=active]:border-t-background ds:h-full ds:data-[state=active]:-mt-0.5 ds:data-[state=active]:translate-y-[0px]`,\n    left: `${baseClasses} ds:rounded-l-md ds:data-[state=active]:border-t ds:data-[state=active]:border-l ds:data-[state=active]:border-b ds:data-[state=active]:border-r-0 ds:data-[state=active]:border-r-background dark:ds:data-[state=active]:border-r-background ds:w-full ds:data-[state=active]:-mr-0.5 ds:data-[state=active]:translate-x-[1px]`,\n    right: `${baseClasses} ds:rounded-r-md ds:data-[state=active]:border-t ds:data-[state=active]:border-r ds:data-[state=active]:border-b ds:data-[state=active]:border-l-0 ds:data-[state=active]:border-l-background dark:ds:data-[state=active]:border-l-background ds:w-full ds:data-[state=active]:-ml-0.5 ds:data-[state=active]:translate-x-[1px]`,\n  };\n\n  return positionMap[tabPosition];\n};\n\nexport const variantClasses: Record<\n  TabVariant,\n  {\n    list: { horizontal: string; vertical: string };\n    trigger: { horizontal: string; vertical: string };\n  }\n> = {\n  // Solid: Default style (muted background, active has white background)\n  solid: {\n    list: {\n      horizontal: \"ds:bg-muted ds:dark:bg-muted ds:rounded-lg ds:p-[3px]\",\n      vertical: \"ds:bg-muted ds:dark:bg-muted ds:rounded-lg ds:p-[3px]\",\n    },\n    trigger: {\n      horizontal: \"\",\n      vertical: \"\",\n    },\n  },\n\n  // Bordered: With border on group and colored active background\n  bordered: {\n    list: {\n      horizontal:\n        \"ds:bg-background ds:dark:bg-background ds:border ds:p-1 ds:gap-1 ds:rounded-lg\",\n      vertical: \"ds:bg-background ds:dark:bg-background ds:border ds:p-1 ds:gap-1 ds:rounded-lg\",\n    },\n    trigger: {\n      horizontal: \"\",\n      vertical: \"\",\n    },\n  },\n\n  // Pills: No border/background on group, colored background on active button\n  pills: {\n    list: {\n      horizontal: \"ds:bg-transparent ds:p-0 ds:gap-1\",\n      vertical: \"ds:bg-transparent ds:p-0 ds:gap-1\",\n    },\n    trigger: {\n      horizontal: \"\",\n      vertical: \"\",\n    },\n  },\n\n  // Pill-stroke: Pill-style with stroke border, stronger border radius, no background on active\n  \"pill-stroke\": {\n    list: {\n      horizontal: \"ds:bg-transparent ds:p-0 ds:gap-1\",\n      vertical: \"ds:bg-transparent ds:p-0 ds:gap-1\",\n    },\n    trigger: {\n      horizontal: \"ds:border ds:border-border ds:rounded-full ds:bg-transparent\",\n      vertical: \"ds:border ds:border-border ds:rounded-full ds:bg-transparent\",\n    },\n  },\n\n  // Text: No border/background on group, colored text on active button\n  text: {\n    list: {\n      horizontal: \"ds:bg-transparent ds:p-0 ds:gap-1\",\n      vertical: \"ds:bg-transparent ds:p-0 ds:gap-1\",\n    },\n    trigger: {\n      horizontal:\n        \"ds:bg-transparent ds:data-[state=active]:bg-transparent ds:data-[state=active]:shadow-none\",\n      vertical:\n        \"ds:bg-transparent ds:data-[state=active]:bg-transparent ds:data-[state=active]:shadow-none\",\n    },\n  },\n\n  // Outline: No border/background on group, colored border (stroke) on active button\n  outline: {\n    list: {\n      horizontal: \"ds:bg-transparent ds:p-0 ds:gap-1\",\n      vertical: \"ds:bg-transparent ds:p-0 ds:gap-1\",\n    },\n    trigger: {\n      horizontal:\n        \"ds:bg-transparent ds:border ds:border-transparent ds:data-[state=active]:bg-transparent ds:data-[state=active]:shadow-none\",\n      vertical:\n        \"ds:bg-transparent ds:border ds:border-transparent ds:data-[state=active]:bg-transparent ds:data-[state=active]:shadow-none\",\n    },\n  },\n\n  // Underlined: Bottom border on group, bottom border on active tab\n  underlined: {\n    list: {\n      horizontal: \"ds:bg-background ds:dark:bg-background ds:rounded-none ds:p-0\",\n      vertical: \"ds:bg-background ds:dark:bg-background ds:rounded-none ds:p-0\",\n    },\n    trigger: {\n      horizontal: \"\", // Will be set dynamically\n      vertical: \"\", // Will be set dynamically\n    },\n  },\n\n  // Enclosed: Border on active tab except bottom border (tab style)\n  enclosed: {\n    list: {\n      horizontal:\n        \"ds:bg-background ds:dark:bg-background ds:justify-start ds:rounded-none ds:p-0\",\n      vertical: \"ds:bg-background ds:dark:bg-background ds:items-start ds:rounded-none ds:p-0\",\n    },\n    trigger: {\n      horizontal: \"\", // Will be set dynamically\n      vertical: \"\", // Will be set dynamically\n    },\n  },\n\n  // Enclosed-fill: Border on active tab except bottom border with background on inactive tabs\n  \"enclosed-fill\": {\n    list: {\n      horizontal:\n        \"ds:bg-background ds:dark:bg-background ds:justify-start ds:rounded-none ds:p-0 ds:gap-1\",\n      vertical:\n        \"ds:bg-background ds:dark:bg-background ds:items-start ds:rounded-none ds:p-0 ds:gap-1\",\n    },\n    trigger: {\n      horizontal: \"\", // Will be set dynamically\n      vertical: \"\", // Will be set dynamically\n    },\n  },\n};\n"],"names":["sizeClasses","alignmentClasses","positionClasses","getColorClasses","variant","color","colors","cn","getListBorderClasses","tabPosition","borderBaseMap","colorBorderMap","getUnderlinedTriggerClasses","baseClasses","getEnclosedTriggerClasses","getEnclosedFillTriggerClasses","variantClasses"],"mappings":"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"}

package/dist/esm/components/TimeGridView.js

@@ -1,4 +1,4 @@
-import { jsx as s } from "react/jsx-runtime";
+import { jsx as i } from "react/jsx-runtime";
 import * as w from "react";
 import { memo as $, useMemo as h } from "react";
 import "@radix-ui/react-slot";
@@ -34,49 +34,49 @@ import "@radix-ui/react-slider";
 import "../packages/ui/src/components/tabs.js";
 import "../packages/ui/src/components/toggle.js";
 import N from "./Button/Button.js";
-const i = (o) => String(o).padStart(2, "0"), V = (o = "primary") => ({
+const s = (o) => String(o).padStart(2, "0"), V = (o = "primary") => ({
   primary: {
-    bg: "bg-primary",
-    text: "text-primary-foreground"
+    bg: "ds:bg-primary",
+    text: "ds:text-primary-foreground"
   },
   secondary: {
-    bg: "bg-secondary",
-    text: "text-secondary-foreground"
+    bg: "ds:bg-secondary",
+    text: "ds:text-secondary-foreground"
   },
   accent: {
-    bg: "bg-accent",
-    text: "text-accent-foreground"
+    bg: "ds:bg-accent",
+    text: "ds:text-accent-foreground"
   },
   destructive: {
-    bg: "bg-destructive",
-    text: "text-destructive-foreground"
+    bg: "ds:bg-destructive",
+    text: "ds:text-destructive-foreground"
   },
   muted: {
-    bg: "bg-muted",
-    text: "text-muted-foreground"
+    bg: "ds:bg-muted",
+    text: "ds:text-muted-foreground"
   },
   success: {
-    bg: "bg-success",
-    text: "text-success-foreground"
+    bg: "ds:bg-success",
+    text: "ds:text-success-foreground"
   },
   error: {
-    bg: "bg-error",
-    text: "text-error-foreground"
+    bg: "ds:bg-error",
+    text: "ds:text-error-foreground"
   },
   warning: {
-    bg: "bg-warning",
-    text: "text-warning-foreground"
+    bg: "ds:bg-warning",
+    text: "ds:text-warning-foreground"
   },
   foreground: {
-    bg: "bg-foreground",
-    text: "text-background"
+    bg: "ds:bg-foreground",
+    text: "ds:text-background"
   }
 })[o], k = $(
   w.forwardRef(
     ({
       HOURS: o,
-      MINUTES: m,
-      hours: d,
+      MINUTES: d,
+      hours: m,
       minutes: n,
       disabled: g,
       isTimeDisabled: p,
@@ -86,24 +86,24 @@ const i = (o) => String(o).padStart(2, "0"), V = (o = "primary") => ({
       const x = h(() => {
         const t = [];
         for (const r of o)
-          for (const e of m)
+          for (const e of d)
             t.push({
               h: r,
               m: e,
-              display: `${i(r)}:${i(e)}`
+              display: `${s(r)}:${s(e)}`
             });
         return t;
-      }, [o, m]), b = d !== void 0 && n !== void 0 ? `${i(d)}:${i(n)}` : "", v = (t, r) => {
+      }, [o, d]), b = m !== void 0 && n !== void 0 ? `${s(m)}:${s(n)}` : "", v = (t, r) => {
         p(t, r, 0) || u(t, r);
       };
-      return /* @__PURE__ */ s("div", { className: "ds:flex ds:flex-col ds:gap-2", children: /* @__PURE__ */ s(
+      return /* @__PURE__ */ i("div", { className: "ds:flex ds:flex-col ds:gap-2", children: /* @__PURE__ */ i(
         "div",
         {
           ref: l,
           className: "ds:flex ds:flex-col ds:gap-1 ds:h-64 ds:overflow-y-auto ds:p-2 ds:rounded-md",
           children: x.map(({ h: t, m: r, display: e }) => {
             const y = p(t, r, 0), c = e === b, a = V(f);
-            return /* @__PURE__ */ s(
+            return /* @__PURE__ */ i(
               N,
               {
                 type: "button",

package/dist/esm/components/TimeGridView.js.map

@@ -1 +1 @@
-{"version":3,"file":"TimeGridView.js","sources":["../../../src/components/TimeGridView.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { memo, useMemo } from \"react\";\nimport { cn } from \"@dsui/ui/index\";\nimport Button from \"./Button/Button\";\nimport type { CalendarColor } from \"./Calendar/Calendar\";\n\nconst pad = (num: number): string => String(num).padStart(2, \"0\");\n\n// Color variants for time grid items\nconst getColorClasses = (color: CalendarColor = \"primary\") => {\n  const colorMap = {\n    primary: {\n      bg: \"bg-primary\",\n      text: \"text-primary-foreground\",\n    },\n    secondary: {\n      bg: \"bg-secondary\",\n      text: \"text-secondary-foreground\",\n    },\n    accent: {\n      bg: \"bg-accent\",\n      text: \"text-accent-foreground\",\n    },\n    destructive: {\n      bg: \"bg-destructive\",\n      text: \"text-destructive-foreground\",\n    },\n    muted: {\n      bg: \"bg-muted\",\n      text: \"text-muted-foreground\",\n    },\n    success: {\n      bg: \"bg-success\",\n      text: \"text-success-foreground\",\n    },\n    error: {\n      bg: \"bg-error\",\n      text: \"text-error-foreground\",\n    },\n    warning: {\n      bg: \"bg-warning\",\n      text: \"text-warning-foreground\",\n    },\n    foreground: {\n      bg: \"bg-foreground\",\n      text: \"text-background\",\n    },\n  };\n  return colorMap[color];\n};\n\ntype TimeGridViewProps = {\n  HOURS: number[];\n  MINUTES: number[];\n  hours: number | undefined;\n  minutes: number | undefined;\n  disabled: boolean;\n  isTimeDisabled: (h: number, m: number, s: number) => boolean;\n  onTimeSelect: (h: number, m: number) => void;\n  color?: CalendarColor;\n};\n\nexport const TimeGridView = memo(\n  React.forwardRef<HTMLDivElement, TimeGridViewProps>(\n    (\n      {\n        HOURS,\n        MINUTES,\n        hours,\n        minutes,\n        disabled,\n        isTimeDisabled,\n        onTimeSelect,\n        color = \"primary\",\n      },\n      ref\n    ) => {\n      // Generate all time combinations based on intervals (always HH:mm, never shows seconds)\n      const timeOptions = useMemo(() => {\n        const options: Array<{ h: number; m: number; display: string }> = [];\n\n        for (const h of HOURS) {\n          for (const m of MINUTES) {\n            options.push({\n              h,\n              m,\n              display: `${pad(h)}:${pad(m)}`,\n            });\n          }\n        }\n\n        return options;\n      }, [HOURS, MINUTES]);\n\n      const currentValue =\n        hours !== undefined && minutes !== undefined\n          ? `${pad(hours)}:${pad(minutes)}`\n          : \"\";\n\n      const handleTimeSelect = (h: number, m: number) => {\n        // Always set seconds to 0 in grid mode\n        if (!isTimeDisabled(h, m, 0)) {\n          onTimeSelect(h, m);\n        }\n      };\n\n      return (\n        <div className=\"ds:flex ds:flex-col ds:gap-2\">\n          <div\n            ref={ref}\n            className=\"ds:flex ds:flex-col ds:gap-1 ds:h-64 ds:overflow-y-auto ds:p-2 ds:rounded-md\"\n          >\n            {timeOptions.map(({ h, m, display }) => {\n              const itemDisabled = isTimeDisabled(h, m, 0);\n              const isSelected = display === currentValue;\n              const colorClasses = getColorClasses(color);\n\n              return (\n                <Button\n                  key={display}\n                  type=\"button\"\n                  variant=\"outline\"\n                  onClick={() => handleTimeSelect(h, m)}\n                  data-selected={isSelected || undefined}\n                  disabled={disabled || itemDisabled}\n                  size=\"sm\"\n                  className={cn(\n                    isSelected\n                      ? `${colorClasses.bg} ${colorClasses.text} ds:font-semibold`\n                      : \"ds:text-foreground\"\n                  )}\n                >\n                  {display}\n                </Button>\n              );\n            })}\n          </div>\n        </div>\n      );\n    }\n  )\n);\n\nTimeGridView.displayName = \"TimeGridView\";\n"],"names":["pad","num","getColorClasses","color","TimeGridView","memo","React","HOURS","MINUTES","hours","minutes","disabled","isTimeDisabled","onTimeSelect","ref","timeOptions","useMemo","options","h","m","currentValue","handleTimeSelect","jsx","display","itemDisabled","isSelected","colorClasses","Button","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA,MAAMA,IAAM,CAACC,MAAwB,OAAOA,CAAG,EAAE,SAAS,GAAG,GAAG,GAG1DC,IAAkB,CAACC,IAAuB,eAC7B;AAAA,EACf,SAAS;AAAA,IACP,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AAAA,EAER,WAAW;AAAA,IACT,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AAAA,EAER,QAAQ;AAAA,IACN,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AAAA,EAER,aAAa;AAAA,IACX,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AAAA,EAER,OAAO;AAAA,IACL,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AAAA,EAER,SAAS;AAAA,IACP,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AAAA,EAER,OAAO;AAAA,IACL,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AAAA,EAER,SAAS;AAAA,IACP,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AAAA,EAER,YAAY;AAAA,IACV,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AACR,GAEcA,CAAK,GAcVC,IAAeC;AAAA,EAC1BC,EAAM;AAAA,IACJ,CACE;AAAA,MACE,OAAAC;AAAA,MACA,SAAAC;AAAA,MACA,OAAAC;AAAA,MACA,SAAAC;AAAA,MACA,UAAAC;AAAA,MACA,gBAAAC;AAAA,MACA,cAAAC;AAAA,MACA,OAAAV,IAAQ;AAAA,IAAA,GAEVW,MACG;AAEH,YAAMC,IAAcC,EAAQ,MAAM;AAChC,cAAMC,IAA4D,CAAA;AAElE,mBAAWC,KAAKX;AACd,qBAAWY,KAAKX;AACd,YAAAS,EAAQ,KAAK;AAAA,cACX,GAAAC;AAAA,cACA,GAAAC;AAAA,cACA,SAAS,GAAGnB,EAAIkB,CAAC,CAAC,IAAIlB,EAAImB,CAAC,CAAC;AAAA,YAAA,CAC7B;AAIL,eAAOF;AAAA,MACT,GAAG,CAACV,GAAOC,CAAO,CAAC,GAEbY,IACJX,MAAU,UAAaC,MAAY,SAC/B,GAAGV,EAAIS,CAAK,CAAC,IAAIT,EAAIU,CAAO,CAAC,KAC7B,IAEAW,IAAmB,CAACH,GAAWC,MAAc;AAEjD,QAAKP,EAAeM,GAAGC,GAAG,CAAC,KACzBN,EAAaK,GAAGC,CAAC;AAAA,MAErB;AAEA,aACE,gBAAAG,EAAC,OAAA,EAAI,WAAU,gCACb,UAAA,gBAAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,KAAAR;AAAA,UACA,WAAU;AAAA,UAET,YAAY,IAAI,CAAC,EAAE,GAAAI,GAAG,GAAAC,GAAG,SAAAI,QAAc;AACtC,kBAAMC,IAAeZ,EAAeM,GAAGC,GAAG,CAAC,GACrCM,IAAaF,MAAYH,GACzBM,IAAexB,EAAgBC,CAAK;AAE1C,mBACE,gBAAAmB;AAAA,cAACK;AAAA,cAAA;AAAA,gBAEC,MAAK;AAAA,gBACL,SAAQ;AAAA,gBACR,SAAS,MAAMN,EAAiBH,GAAGC,CAAC;AAAA,gBACpC,iBAAeM,KAAc;AAAA,gBAC7B,UAAUd,KAAYa;AAAA,gBACtB,MAAK;AAAA,gBACL,WAAWI;AAAA,kBACTH,IACI,GAAGC,EAAa,EAAE,IAAIA,EAAa,IAAI,sBACvC;AAAA,gBAAA;AAAA,gBAGL,UAAAH;AAAA,cAAA;AAAA,cAbIA;AAAA,YAAA;AAAA,UAgBX,CAAC;AAAA,QAAA;AAAA,MAAA,GAEL;AAAA,IAEJ;AAAA,EAAA;AAEJ;AAEAnB,EAAa,cAAc;"}
+{"version":3,"file":"TimeGridView.js","sources":["../../../src/components/TimeGridView.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { memo, useMemo } from \"react\";\nimport { cn } from \"@dsui/ui/index\";\nimport Button from \"./Button/Button\";\nimport type { CalendarColor } from \"./Calendar/Calendar\";\n\nconst pad = (num: number): string => String(num).padStart(2, \"0\");\n\n// Color variants for time grid items\nconst getColorClasses = (color: CalendarColor = \"primary\") => {\n  const colorMap = {\n    primary: {\n      bg: \"ds:bg-primary\",\n      text: \"ds:text-primary-foreground\",\n    },\n    secondary: {\n      bg: \"ds:bg-secondary\",\n      text: \"ds:text-secondary-foreground\",\n    },\n    accent: {\n      bg: \"ds:bg-accent\",\n      text: \"ds:text-accent-foreground\",\n    },\n    destructive: {\n      bg: \"ds:bg-destructive\",\n      text: \"ds:text-destructive-foreground\",\n    },\n    muted: {\n      bg: \"ds:bg-muted\",\n      text: \"ds:text-muted-foreground\",\n    },\n    success: {\n      bg: \"ds:bg-success\",\n      text: \"ds:text-success-foreground\",\n    },\n    error: {\n      bg: \"ds:bg-error\",\n      text: \"ds:text-error-foreground\",\n    },\n    warning: {\n      bg: \"ds:bg-warning\",\n      text: \"ds:text-warning-foreground\",\n    },\n    foreground: {\n      bg: \"ds:bg-foreground\",\n      text: \"ds:text-background\",\n    },\n  };\n  return colorMap[color];\n};\n\ntype TimeGridViewProps = {\n  HOURS: number[];\n  MINUTES: number[];\n  hours: number | undefined;\n  minutes: number | undefined;\n  disabled: boolean;\n  isTimeDisabled: (h: number, m: number, s: number) => boolean;\n  onTimeSelect: (h: number, m: number) => void;\n  color?: CalendarColor;\n};\n\nexport const TimeGridView = memo(\n  React.forwardRef<HTMLDivElement, TimeGridViewProps>(\n    (\n      {\n        HOURS,\n        MINUTES,\n        hours,\n        minutes,\n        disabled,\n        isTimeDisabled,\n        onTimeSelect,\n        color = \"primary\",\n      },\n      ref\n    ) => {\n      // Generate all time combinations based on intervals (always HH:mm, never shows seconds)\n      const timeOptions = useMemo(() => {\n        const options: Array<{ h: number; m: number; display: string }> = [];\n\n        for (const h of HOURS) {\n          for (const m of MINUTES) {\n            options.push({\n              h,\n              m,\n              display: `${pad(h)}:${pad(m)}`,\n            });\n          }\n        }\n\n        return options;\n      }, [HOURS, MINUTES]);\n\n      const currentValue =\n        hours !== undefined && minutes !== undefined\n          ? `${pad(hours)}:${pad(minutes)}`\n          : \"\";\n\n      const handleTimeSelect = (h: number, m: number) => {\n        // Always set seconds to 0 in grid mode\n        if (!isTimeDisabled(h, m, 0)) {\n          onTimeSelect(h, m);\n        }\n      };\n\n      return (\n        <div className=\"ds:flex ds:flex-col ds:gap-2\">\n          <div\n            ref={ref}\n            className=\"ds:flex ds:flex-col ds:gap-1 ds:h-64 ds:overflow-y-auto ds:p-2 ds:rounded-md\"\n          >\n            {timeOptions.map(({ h, m, display }) => {\n              const itemDisabled = isTimeDisabled(h, m, 0);\n              const isSelected = display === currentValue;\n              const colorClasses = getColorClasses(color);\n\n              return (\n                <Button\n                  key={display}\n                  type=\"button\"\n                  variant=\"outline\"\n                  onClick={() => handleTimeSelect(h, m)}\n                  data-selected={isSelected || undefined}\n                  disabled={disabled || itemDisabled}\n                  size=\"sm\"\n                  className={cn(\n                    isSelected\n                      ? `${colorClasses.bg} ${colorClasses.text} ds:font-semibold`\n                      : \"ds:text-foreground\"\n                  )}\n                >\n                  {display}\n                </Button>\n              );\n            })}\n          </div>\n        </div>\n      );\n    }\n  )\n);\n\nTimeGridView.displayName = \"TimeGridView\";\n"],"names":["pad","num","getColorClasses","color","TimeGridView","memo","React","HOURS","MINUTES","hours","minutes","disabled","isTimeDisabled","onTimeSelect","ref","timeOptions","useMemo","options","h","m","currentValue","handleTimeSelect","jsx","display","itemDisabled","isSelected","colorClasses","Button","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA,MAAMA,IAAM,CAACC,MAAwB,OAAOA,CAAG,EAAE,SAAS,GAAG,GAAG,GAG1DC,IAAkB,CAACC,IAAuB,eAC7B;AAAA,EACf,SAAS;AAAA,IACP,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AAAA,EAER,WAAW;AAAA,IACT,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AAAA,EAER,QAAQ;AAAA,IACN,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AAAA,EAER,aAAa;AAAA,IACX,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AAAA,EAER,OAAO;AAAA,IACL,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AAAA,EAER,SAAS;AAAA,IACP,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AAAA,EAER,OAAO;AAAA,IACL,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AAAA,EAER,SAAS;AAAA,IACP,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AAAA,EAER,YAAY;AAAA,IACV,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AACR,GAEcA,CAAK,GAcVC,IAAeC;AAAA,EAC1BC,EAAM;AAAA,IACJ,CACE;AAAA,MACE,OAAAC;AAAA,MACA,SAAAC;AAAA,MACA,OAAAC;AAAA,MACA,SAAAC;AAAA,MACA,UAAAC;AAAA,MACA,gBAAAC;AAAA,MACA,cAAAC;AAAA,MACA,OAAAV,IAAQ;AAAA,IAAA,GAEVW,MACG;AAEH,YAAMC,IAAcC,EAAQ,MAAM;AAChC,cAAMC,IAA4D,CAAA;AAElE,mBAAWC,KAAKX;AACd,qBAAWY,KAAKX;AACd,YAAAS,EAAQ,KAAK;AAAA,cACX,GAAAC;AAAA,cACA,GAAAC;AAAA,cACA,SAAS,GAAGnB,EAAIkB,CAAC,CAAC,IAAIlB,EAAImB,CAAC,CAAC;AAAA,YAAA,CAC7B;AAIL,eAAOF;AAAA,MACT,GAAG,CAACV,GAAOC,CAAO,CAAC,GAEbY,IACJX,MAAU,UAAaC,MAAY,SAC/B,GAAGV,EAAIS,CAAK,CAAC,IAAIT,EAAIU,CAAO,CAAC,KAC7B,IAEAW,IAAmB,CAACH,GAAWC,MAAc;AAEjD,QAAKP,EAAeM,GAAGC,GAAG,CAAC,KACzBN,EAAaK,GAAGC,CAAC;AAAA,MAErB;AAEA,aACE,gBAAAG,EAAC,OAAA,EAAI,WAAU,gCACb,UAAA,gBAAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,KAAAR;AAAA,UACA,WAAU;AAAA,UAET,YAAY,IAAI,CAAC,EAAE,GAAAI,GAAG,GAAAC,GAAG,SAAAI,QAAc;AACtC,kBAAMC,IAAeZ,EAAeM,GAAGC,GAAG,CAAC,GACrCM,IAAaF,MAAYH,GACzBM,IAAexB,EAAgBC,CAAK;AAE1C,mBACE,gBAAAmB;AAAA,cAACK;AAAA,cAAA;AAAA,gBAEC,MAAK;AAAA,gBACL,SAAQ;AAAA,gBACR,SAAS,MAAMN,EAAiBH,GAAGC,CAAC;AAAA,gBACpC,iBAAeM,KAAc;AAAA,gBAC7B,UAAUd,KAAYa;AAAA,gBACtB,MAAK;AAAA,gBACL,WAAWI;AAAA,kBACTH,IACI,GAAGC,EAAa,EAAE,IAAIA,EAAa,IAAI,sBACvC;AAAA,gBAAA;AAAA,gBAGL,UAAAH;AAAA,cAAA;AAAA,cAbIA;AAAA,YAAA;AAAA,UAgBX,CAAC;AAAA,QAAA;AAAA,MAAA,GAEL;AAAA,IAEJ;AAAA,EAAA;AAEJ;AAEAnB,EAAa,cAAc;"}