@nipsys/shadcn-lsd 0.2.2 → 0.2.3

package/dist/components/ui/tabs/__tests__/tabs-list.test.js

@@ -1,18 +1,18 @@
 import { jsxs as a, jsx as t } from "react/jsx-runtime";
-import { d as c, i, r as d, g as l } from "../../../../vi.2VT5v0um-D9hIOtVQ.js";
+import { d as o, i, r as d, g as l } from "../../../../vi.2VT5v0um-D9hIOtVQ.js";
 import { Tabs as r } from "../Tabs.js";
-import { TabsContent as o } from "../TabsContent.js";
-import { TabsList as n } from "../TabsList.js";
+import { TabsContent as n } from "../TabsContent.js";
+import { TabsList as c } from "../TabsList.js";
 import { TabsTrigger as s } from "../TabsTrigger.js";
-c("TabsList", () => {
+o("TabsList", () => {
   i("renders without crashing", () => {
     d(
       /* @__PURE__ */ a(r, { defaultValue: "tab-1", children: [
-        /* @__PURE__ */ a(n, { children: [
+        /* @__PURE__ */ a(c, { children: [
           /* @__PURE__ */ t(s, { value: "tab-1", children: "Tab 1" }),
           /* @__PURE__ */ t(s, { value: "tab-2", children: "Tab 2" })
         ] }),
-        /* @__PURE__ */ t(o, { value: "tab-1", children: "Content 1" })
+        /* @__PURE__ */ t(n, { value: "tab-1", children: "Content 1" })
       ] })
     ), l(
       document.querySelector('[data-slot="tabs-list"]')
@@ -20,8 +20,8 @@ c("TabsList", () => {
   }), i("applies data-slot attribute", () => {
     d(
       /* @__PURE__ */ a(r, { defaultValue: "tab-1", children: [
-        /* @__PURE__ */ t(n, { children: /* @__PURE__ */ t(s, { value: "tab-1", children: "Tab 1" }) }),
-        /* @__PURE__ */ t(o, { value: "tab-1", children: "Content 1" })
+        /* @__PURE__ */ t(c, { children: /* @__PURE__ */ t(s, { value: "tab-1", children: "Tab 1" }) }),
+        /* @__PURE__ */ t(n, { value: "tab-1", children: "Content 1" })
       ] })
     );
     const e = document.querySelector('[data-slot="tabs-list"]');
@@ -29,17 +29,17 @@ c("TabsList", () => {
   }), i("applies base classes correctly", () => {
     d(
       /* @__PURE__ */ a(r, { defaultValue: "tab-1", children: [
-        /* @__PURE__ */ t(n, { children: /* @__PURE__ */ t(s, { value: "tab-1", children: "Tab 1" }) }),
-        /* @__PURE__ */ t(o, { value: "tab-1", children: "Content 1" })
+        /* @__PURE__ */ t(c, { children: /* @__PURE__ */ t(s, { value: "tab-1", children: "Tab 1" }) }),
+        /* @__PURE__ */ t(n, { value: "tab-1", children: "Content 1" })
       ] })
     );
     const e = document.querySelector('[data-slot="tabs-list"]');
-    l(e).toHaveClass("lsd:bg-lsd-surface"), l(e).toHaveClass("lsd:border-b"), l(e).toHaveClass("lsd:border-lsd-border"), l(e).toHaveClass("lsd:flex"), l(e).toHaveClass("lsd:flex-row");
+    l(e).toHaveClass("lsd:bg-lsd-surface"), l(e).toHaveClass("lsd:border-b"), l(e).toHaveClass("lsd:flex"), l(e).toHaveClass("lsd:flex-row");
   }), i("applies default size classes (lg)", () => {
     d(
       /* @__PURE__ */ a(r, { defaultValue: "tab-1", children: [
-        /* @__PURE__ */ t(n, { children: /* @__PURE__ */ t(s, { value: "tab-1", children: "Tab 1" }) }),
-        /* @__PURE__ */ t(o, { value: "tab-1", children: "Content 1" })
+        /* @__PURE__ */ t(c, { children: /* @__PURE__ */ t(s, { value: "tab-1", children: "Tab 1" }) }),
+        /* @__PURE__ */ t(n, { value: "tab-1", children: "Content 1" })
       ] })
     );
     const e = document.querySelector('[data-slot="tabs-list"]');
@@ -47,8 +47,8 @@ c("TabsList", () => {
   }), i('applies small size classes when size="sm"', () => {
     d(
       /* @__PURE__ */ a(r, { defaultValue: "tab-1", children: [
-        /* @__PURE__ */ t(n, { size: "sm", children: /* @__PURE__ */ t(s, { value: "tab-1", children: "Tab 1" }) }),
-        /* @__PURE__ */ t(o, { value: "tab-1", children: "Content 1" })
+        /* @__PURE__ */ t(c, { size: "sm", children: /* @__PURE__ */ t(s, { value: "tab-1", children: "Tab 1" }) }),
+        /* @__PURE__ */ t(n, { value: "tab-1", children: "Content 1" })
       ] })
     );
     const e = document.querySelector('[data-slot="tabs-list"]');
@@ -56,8 +56,8 @@ c("TabsList", () => {
   }), i('applies medium size classes when size="md"', () => {
     d(
       /* @__PURE__ */ a(r, { defaultValue: "tab-1", children: [
-        /* @__PURE__ */ t(n, { size: "md", children: /* @__PURE__ */ t(s, { value: "tab-1", children: "Tab 1" }) }),
-        /* @__PURE__ */ t(o, { value: "tab-1", children: "Content 1" })
+        /* @__PURE__ */ t(c, { size: "md", children: /* @__PURE__ */ t(s, { value: "tab-1", children: "Tab 1" }) }),
+        /* @__PURE__ */ t(n, { value: "tab-1", children: "Content 1" })
       ] })
     );
     const e = document.querySelector('[data-slot="tabs-list"]');
@@ -65,8 +65,8 @@ c("TabsList", () => {
   }), i("applies default fullWidth classes (false)", () => {
     d(
       /* @__PURE__ */ a(r, { defaultValue: "tab-1", children: [
-        /* @__PURE__ */ t(n, { children: /* @__PURE__ */ t(s, { value: "tab-1", children: "Tab 1" }) }),
-        /* @__PURE__ */ t(o, { value: "tab-1", children: "Content 1" })
+        /* @__PURE__ */ t(c, { children: /* @__PURE__ */ t(s, { value: "tab-1", children: "Tab 1" }) }),
+        /* @__PURE__ */ t(n, { value: "tab-1", children: "Content 1" })
       ] })
     );
     const e = document.querySelector('[data-slot="tabs-list"]');
@@ -74,8 +74,8 @@ c("TabsList", () => {
   }), i("applies fullWidth classes when fullWidth={true}", () => {
     d(
       /* @__PURE__ */ a(r, { defaultValue: "tab-1", children: [
-        /* @__PURE__ */ t(n, { fullWidth: !0, children: /* @__PURE__ */ t(s, { value: "tab-1", children: "Tab 1" }) }),
-        /* @__PURE__ */ t(o, { value: "tab-1", children: "Content 1" })
+        /* @__PURE__ */ t(c, { fullWidth: !0, children: /* @__PURE__ */ t(s, { value: "tab-1", children: "Tab 1" }) }),
+        /* @__PURE__ */ t(n, { value: "tab-1", children: "Content 1" })
       ] })
     );
     const e = document.querySelector('[data-slot="tabs-list"]');
@@ -83,8 +83,8 @@ c("TabsList", () => {
   }), i("merges custom className with component classes", () => {
     d(
       /* @__PURE__ */ a(r, { defaultValue: "tab-1", children: [
-        /* @__PURE__ */ t(n, { className: "custom-list-class", children: /* @__PURE__ */ t(s, { value: "tab-1", children: "Tab 1" }) }),
-        /* @__PURE__ */ t(o, { value: "tab-1", children: "Content 1" })
+        /* @__PURE__ */ t(c, { className: "custom-list-class", children: /* @__PURE__ */ t(s, { value: "tab-1", children: "Tab 1" }) }),
+        /* @__PURE__ */ t(n, { value: "tab-1", children: "Content 1" })
       ] })
     );
     const e = document.querySelector('[data-slot="tabs-list"]');
@@ -92,8 +92,8 @@ c("TabsList", () => {
   }), i("passes through additional props", () => {
     d(
       /* @__PURE__ */ a(r, { defaultValue: "tab-1", children: [
-        /* @__PURE__ */ t(n, { "data-testid": "test-list", id: "list-1", children: /* @__PURE__ */ t(s, { value: "tab-1", children: "Tab 1" }) }),
-        /* @__PURE__ */ t(o, { value: "tab-1", children: "Content 1" })
+        /* @__PURE__ */ t(c, { "data-testid": "test-list", id: "list-1", children: /* @__PURE__ */ t(s, { value: "tab-1", children: "Tab 1" }) }),
+        /* @__PURE__ */ t(n, { value: "tab-1", children: "Content 1" })
       ] })
     );
     const e = document.querySelector('[data-slot="tabs-list"]');

package/dist/components/ui/tabs/__tests__/tabs-trigger.test.js

@@ -45,9 +45,7 @@ b("TabsTrigger", () => {
       ] })
     );
     const e = c.getByRole("tab", { name: "Tab 1" });
-    a(e).toHaveAttribute("data-state", "active"), a(e).toHaveClass(
-      "lsd:data-[state=active]:border-lsd-text-primary"
-    ), a(e).toHaveClass("lsd:data-[state=active]:bg-lsd-surface"), a(e).toHaveClass("lsd:data-[state=active]:font-medium");
+    a(e).toHaveAttribute("data-state", "active"), a(e).toHaveClass("lsd:data-[state=active]:border-lsd-border"), a(e).toHaveClass("lsd:data-[state=active]:bg-lsd-surface"), a(e).toHaveClass("lsd:data-[state=active]:font-medium");
   }), d("applies default size classes (lg)", () => {
     i(
       /* @__PURE__ */ l(n, { defaultValue: "tab-1", children: [

package/dist/components/ui/tabs/__tests__/tabs.test.js

@@ -1,10 +1,10 @@
 import { jsxs as i, jsx as a } from "react/jsx-runtime";
 import { d as C, i as s, r as b, g as t, s as f } from "../../../../vi.2VT5v0um-D9hIOtVQ.js";
 import { Tabs as h } from "../Tabs.js";
-import { TabsContent as n } from "../TabsContent.js";
+import { TabsContent as o } from "../TabsContent.js";
 import { TabsList as m } from "../TabsList.js";
 import { TabsTrigger as l } from "../TabsTrigger.js";
-import { t as d, a as c, b as u } from "../../../../types-B0wccExf.js";
+import { t as d, a as c, b as u } from "../../../../types-ClTXXuXM.js";
 C("Tabs", () => {
   s("renders without crashing", () => {
     b(
@@ -13,15 +13,15 @@ C("Tabs", () => {
           /* @__PURE__ */ a(l, { value: "tab-1", children: "Tab 1" }),
           /* @__PURE__ */ a(l, { value: "tab-2", children: "Tab 2" })
         ] }),
-        /* @__PURE__ */ a(n, { value: "tab-1", children: "Content 1" }),
-        /* @__PURE__ */ a(n, { value: "tab-2", children: "Content 2" })
+        /* @__PURE__ */ a(o, { value: "tab-1", children: "Content 1" }),
+        /* @__PURE__ */ a(o, { value: "tab-2", children: "Content 2" })
       ] })
     ), t(document.querySelector('[data-slot="tabs"]')).toBeInTheDocument();
   }), s("applies data-slot attribute", () => {
     b(
       /* @__PURE__ */ i(h, { defaultValue: "tab-1", children: [
         /* @__PURE__ */ a(m, { children: /* @__PURE__ */ a(l, { value: "tab-1", children: "Tab 1" }) }),
-        /* @__PURE__ */ a(n, { value: "tab-1", children: "Content 1" })
+        /* @__PURE__ */ a(o, { value: "tab-1", children: "Content 1" })
       ] })
     );
     const e = document.querySelector('[data-slot="tabs"]');
@@ -30,7 +30,7 @@ C("Tabs", () => {
     b(
       /* @__PURE__ */ i(h, { defaultValue: "tab-1", "data-testid": "test-tabs", id: "tabs-1", children: [
         /* @__PURE__ */ a(m, { children: /* @__PURE__ */ a(l, { value: "tab-1", children: "Tab 1" }) }),
-        /* @__PURE__ */ a(n, { value: "tab-1", children: "Content 1" })
+        /* @__PURE__ */ a(o, { value: "tab-1", children: "Content 1" })
       ] })
     );
     const e = document.querySelector('[data-slot="tabs"]');
@@ -39,7 +39,7 @@ C("Tabs", () => {
     b(
       /* @__PURE__ */ i(h, { defaultValue: "tab-1", className: "custom-tabs-class", children: [
         /* @__PURE__ */ a(m, { children: /* @__PURE__ */ a(l, { value: "tab-1", children: "Tab 1" }) }),
-        /* @__PURE__ */ a(n, { value: "tab-1", children: "Content 1" })
+        /* @__PURE__ */ a(o, { value: "tab-1", children: "Content 1" })
       ] })
     );
     const e = document.querySelector('[data-slot="tabs"]');
@@ -52,9 +52,9 @@ C("Tabs", () => {
           /* @__PURE__ */ a(l, { value: "tab-2", children: "Tab 2" }),
           /* @__PURE__ */ a(l, { value: "tab-3", children: "Tab 3" })
         ] }),
-        /* @__PURE__ */ a(n, { value: "tab-1", children: "Content 1" }),
-        /* @__PURE__ */ a(n, { value: "tab-2", children: "Content 2" }),
-        /* @__PURE__ */ a(n, { value: "tab-3", children: "Content 3" })
+        /* @__PURE__ */ a(o, { value: "tab-1", children: "Content 1" }),
+        /* @__PURE__ */ a(o, { value: "tab-2", children: "Content 2" }),
+        /* @__PURE__ */ a(o, { value: "tab-3", children: "Content 3" })
       ] })
     ), t(document.querySelector('[data-slot="tabs"]')).toBeInTheDocument(), t(
       document.querySelector('[data-slot="tabs-list"]')
@@ -68,23 +68,23 @@ C("tabsVariants", () => {
     const e = d();
     t(e).toBe("");
   }), s("returns correct classes for size variants", () => {
-    const e = d({ size: "sm" }), o = d({ size: "md" }), r = d({ size: "lg" });
-    t(e).toBe(""), t(o).toBe(""), t(r).toBe("");
+    const e = d({ size: "sm" }), n = d({ size: "md" }), r = d({ size: "lg" });
+    t(e).toBe(""), t(n).toBe(""), t(r).toBe("");
   }), s("returns correct classes for fullWidth variants", () => {
-    const e = d({ fullWidth: !0 }), o = d({ fullWidth: !1 });
-    t(e).toBe(""), t(o).toBe("");
+    const e = d({ fullWidth: !0 }), n = d({ fullWidth: !1 });
+    t(e).toBe(""), t(n).toBe("");
   });
 });
 C("tabsListVariants", () => {
   s("returns correct classes for default variants", () => {
     const e = c();
-    t(e).toContain("lsd:bg-lsd-surface"), t(e).toContain("lsd:border-b"), t(e).toContain("lsd:border-lsd-border"), t(e).toContain("lsd:flex"), t(e).toContain("lsd:flex-row"), t(e).toContain("lsd:h-12"), t(e).toContain("lsd:w-fit");
+    t(e).toContain("lsd:bg-lsd-surface"), t(e).toContain("lsd:border-b"), t(e).toContain("lsd:flex"), t(e).toContain("lsd:flex-row"), t(e).toContain("lsd:h-12"), t(e).toContain("lsd:w-fit");
   }), s("returns correct classes for size variants", () => {
-    const e = c({ size: "sm" }), o = c({ size: "md" }), r = c({ size: "lg" });
-    t(e).toContain("lsd:h-8"), t(o).toContain("lsd:h-10"), t(r).toContain("lsd:h-12");
+    const e = c({ size: "sm" }), n = c({ size: "md" }), r = c({ size: "lg" });
+    t(e).toContain("lsd:h-8"), t(n).toContain("lsd:h-10"), t(r).toContain("lsd:h-12");
   }), s("returns correct classes for fullWidth variants", () => {
-    const e = c({ fullWidth: !0 }), o = c({ fullWidth: !1 });
-    t(e).toContain("lsd:w-full"), t(o).toContain("lsd:w-fit");
+    const e = c({ fullWidth: !0 }), n = c({ fullWidth: !1 });
+    t(e).toContain("lsd:w-full"), t(n).toContain("lsd:w-fit");
   });
 });
 C("tabsTriggerVariants", () => {
@@ -92,10 +92,10 @@ C("tabsTriggerVariants", () => {
     const e = u();
     t(e).toContain("lsd:text-lsd-text"), t(e).toContain("lsd:border"), t(e).toContain("lsd:border-transparent"), t(e).toContain("lsd:border-b-0"), t(e).toContain("lsd:flex"), t(e).toContain("lsd:items-center"), t(e).toContain("lsd:justify-center"), t(e).toContain("lsd:px-5"), t(e).toContain("lsd:py-2.5"), t(e).toContain("lsd:text-lg");
   }), s("returns correct classes for size variants", () => {
-    const e = u({ size: "sm" }), o = u({ size: "md" }), r = u({ size: "lg" });
-    t(e).toContain("lsd:px-3"), t(e).toContain("lsd:py-1.5"), t(e).toContain("lsd:text-sm"), t(o).toContain("lsd:px-4"), t(o).toContain("lsd:py-2"), t(o).toContain("lsd:text-base"), t(r).toContain("lsd:px-5"), t(r).toContain("lsd:py-2.5"), t(r).toContain("lsd:text-lg");
+    const e = u({ size: "sm" }), n = u({ size: "md" }), r = u({ size: "lg" });
+    t(e).toContain("lsd:px-3"), t(e).toContain("lsd:py-1.5"), t(e).toContain("lsd:text-sm"), t(n).toContain("lsd:px-4"), t(n).toContain("lsd:py-2"), t(n).toContain("lsd:text-base"), t(r).toContain("lsd:px-5"), t(r).toContain("lsd:py-2.5"), t(r).toContain("lsd:text-lg");
   }), s("returns correct classes for fullWidth variants", () => {
-    const e = u({ fullWidth: !0 }), o = u({ fullWidth: !1 });
-    t(e).toContain("lsd:flex-1"), t(o).not.toContain("lsd:flex-1");
+    const e = u({ fullWidth: !0 }), n = u({ fullWidth: !1 });
+    t(e).toContain("lsd:flex-1"), t(n).not.toContain("lsd:flex-1");
   });
 });

package/dist/components/ui/typography/Typography.js

@@ -1,7 +1,7 @@
 import "react/jsx-runtime";
 import "react";
 import "../../../utils-DtaLkIY8.js";
-import { T as i } from "../../../Typography-D8OaaVSH.js";
+import { T as i } from "../../../Typography-BW4Kc9SY.js";
 export {
   i as Typography
 };

package/dist/components/ui/typography/types.d.ts

@@ -2,7 +2,7 @@ import { VariantProps } from 'class-variance-authority';
 export type TypographyVariant = 'display1' | 'display2' | 'display3' | 'display4' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'subtitle1' | 'subtitle2' | 'subtitle3' | 'subtitle4' | 'body1' | 'body2' | 'body3' | 'label1' | 'label2';
 export declare const typographyVariants: (props?: ({
     variant?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "display1" | "display2" | "display3" | "display4" | "subtitle1" | "subtitle2" | "subtitle3" | "subtitle4" | "body1" | "body2" | "body3" | "label1" | "label2" | null | undefined;
-    color?: "secondary" | "primary" | null | undefined;
+    color?: "destructive" | "success" | "warning" | "info" | "secondary" | "primary" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type TypographyVariants = VariantProps<typeof typographyVariants>;
 export interface TypographyProps extends Omit<React.HTMLAttributes<HTMLHeadingElement>, 'color'>, TypographyVariants {

package/dist/components/ui/typography/typography.test.js

@@ -1,157 +1,189 @@
-import { jsx as s } from "react/jsx-runtime";
-import { d as o, i as a, r as l, g as t, s as n, v as d } from "../../../vi.2VT5v0um-D9hIOtVQ.js";
-import { t as i, T as r } from "../../../Typography-D8OaaVSH.js";
-o("Typography", () => {
-  a("renders without crashing", () => {
-    l(/* @__PURE__ */ s(r, { children: "Text" })), t(n.getByText("Text")).toBeInTheDocument();
-  }), a("renders children correctly", () => {
-    l(/* @__PURE__ */ s(r, { children: "Test Text" })), t(n.getByText("Test Text")).toBeInTheDocument();
-  }), a("uses default variant (body1) when not specified", () => {
-    l(/* @__PURE__ */ s(r, { children: "Text" }));
-    const e = n.getByText("Text");
+import { jsx as a } from "react/jsx-runtime";
+import { d as i, i as s, r as l, g as t, s as o, v as c } from "../../../vi.2VT5v0um-D9hIOtVQ.js";
+import { t as n, T as r } from "../../../Typography-BW4Kc9SY.js";
+i("Typography", () => {
+  s("renders without crashing", () => {
+    l(/* @__PURE__ */ a(r, { children: "Text" })), t(o.getByText("Text")).toBeInTheDocument();
+  }), s("renders children correctly", () => {
+    l(/* @__PURE__ */ a(r, { children: "Test Text" })), t(o.getByText("Test Text")).toBeInTheDocument();
+  }), s("uses default variant (body1) when not specified", () => {
+    l(/* @__PURE__ */ a(r, { children: "Text" }));
+    const e = o.getByText("Text");
     t(e).toHaveClass("lsd:text-[1rem]"), t(e).toHaveClass("lsd:leading-[1.5rem]");
-  }), a("uses default color (primary) when not specified", () => {
-    l(/* @__PURE__ */ s(r, { children: "Text" }));
-    const e = n.getByText("Text");
+  }), s("uses default color (primary) when not specified", () => {
+    l(/* @__PURE__ */ a(r, { children: "Text" }));
+    const e = o.getByText("Text");
     t(e).toHaveClass("lsd:text-lsd-text-primary");
-  }), a("applies display1 variant classes correctly", () => {
-    l(/* @__PURE__ */ s(r, { variant: "display1", children: "Display 1" }));
-    const e = n.getByText("Display 1");
+  }), s("applies display1 variant classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { variant: "display1", children: "Display 1" }));
+    const e = o.getByText("Display 1");
     t(e).toHaveClass("lsd:text-[5.5rem]"), t(e).toHaveClass("lsd:font-normal"), t(e).toHaveClass("lsd:leading-[6rem]");
-  }), a("applies display2 variant classes correctly", () => {
-    l(/* @__PURE__ */ s(r, { variant: "display2", children: "Display 2" }));
-    const e = n.getByText("Display 2");
+  }), s("applies display2 variant classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { variant: "display2", children: "Display 2" }));
+    const e = o.getByText("Display 2");
     t(e).toHaveClass("lsd:text-[4rem]"), t(e).toHaveClass("lsd:leading-[4.5rem]");
-  }), a("applies display3 variant classes correctly", () => {
-    l(/* @__PURE__ */ s(r, { variant: "display3", children: "Display 3" }));
-    const e = n.getByText("Display 3");
+  }), s("applies display3 variant classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { variant: "display3", children: "Display 3" }));
+    const e = o.getByText("Display 3");
     t(e).toHaveClass("lsd:text-[3.5rem]"), t(e).toHaveClass("lsd:leading-[4rem]");
-  }), a("applies display4 variant classes correctly", () => {
-    l(/* @__PURE__ */ s(r, { variant: "display4", children: "Display 4" }));
-    const e = n.getByText("Display 4");
+  }), s("applies display4 variant classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { variant: "display4", children: "Display 4" }));
+    const e = o.getByText("Display 4");
     t(e).toHaveClass("lsd:text-[3rem]"), t(e).toHaveClass("lsd:leading-[3.5rem]");
-  }), a("applies h1 variant classes correctly", () => {
-    l(/* @__PURE__ */ s(r, { variant: "h1", children: "Heading 1" }));
-    const e = n.getByText("Heading 1");
+  }), s("applies h1 variant classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { variant: "h1", children: "Heading 1" }));
+    const e = o.getByText("Heading 1");
     t(e).toHaveClass("lsd:text-[2.5rem]"), t(e).toHaveClass("lsd:leading-[3rem]"), t(e.tagName).toBe("H1");
-  }), a("applies h2 variant classes correctly", () => {
-    l(/* @__PURE__ */ s(r, { variant: "h2", children: "Heading 2" }));
-    const e = n.getByText("Heading 2");
+  }), s("applies h2 variant classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { variant: "h2", children: "Heading 2" }));
+    const e = o.getByText("Heading 2");
     t(e).toHaveClass("lsd:text-[2rem]"), t(e).toHaveClass("lsd:leading-[2.5rem]"), t(e.tagName).toBe("H2");
-  }), a("applies h3 variant classes correctly", () => {
-    l(/* @__PURE__ */ s(r, { variant: "h3", children: "Heading 3" }));
-    const e = n.getByText("Heading 3");
+  }), s("applies h3 variant classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { variant: "h3", children: "Heading 3" }));
+    const e = o.getByText("Heading 3");
     t(e).toHaveClass("lsd:text-[1.75rem]"), t(e).toHaveClass("lsd:leading-[2.25rem]"), t(e.tagName).toBe("H3");
-  }), a("applies h4 variant classes correctly", () => {
-    l(/* @__PURE__ */ s(r, { variant: "h4", children: "Heading 4" }));
-    const e = n.getByText("Heading 4");
+  }), s("applies h4 variant classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { variant: "h4", children: "Heading 4" }));
+    const e = o.getByText("Heading 4");
     t(e).toHaveClass("lsd:text-[1.5rem]"), t(e).toHaveClass("lsd:leading-[2rem]"), t(e.tagName).toBe("H4");
-  }), a("applies h5 variant classes correctly", () => {
-    l(/* @__PURE__ */ s(r, { variant: "h5", children: "Heading 5" }));
-    const e = n.getByText("Heading 5");
+  }), s("applies h5 variant classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { variant: "h5", children: "Heading 5" }));
+    const e = o.getByText("Heading 5");
     t(e).toHaveClass("lsd:text-[1.25rem]"), t(e).toHaveClass("lsd:leading-[1.75rem]"), t(e.tagName).toBe("H5");
-  }), a("applies h6 variant classes correctly", () => {
-    l(/* @__PURE__ */ s(r, { variant: "h6", children: "Heading 6" }));
-    const e = n.getByText("Heading 6");
+  }), s("applies h6 variant classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { variant: "h6", children: "Heading 6" }));
+    const e = o.getByText("Heading 6");
     t(e).toHaveClass("lsd:text-[1rem]"), t(e).toHaveClass("lsd:leading-[1.5rem]"), t(e.tagName).toBe("H6");
-  }), a("applies subtitle1 variant classes correctly", () => {
-    l(/* @__PURE__ */ s(r, { variant: "subtitle1", children: "Subtitle 1" }));
-    const e = n.getByText("Subtitle 1");
+  }), s("applies subtitle1 variant classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { variant: "subtitle1", children: "Subtitle 1" }));
+    const e = o.getByText("Subtitle 1");
     t(e).toHaveClass("lsd:text-[1.125rem]"), t(e).toHaveClass("lsd:leading-[1.5rem]");
-  }), a("applies subtitle2 variant classes correctly", () => {
-    l(/* @__PURE__ */ s(r, { variant: "subtitle2", children: "Subtitle 2" }));
-    const e = n.getByText("Subtitle 2");
+  }), s("applies subtitle2 variant classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { variant: "subtitle2", children: "Subtitle 2" }));
+    const e = o.getByText("Subtitle 2");
     t(e).toHaveClass("lsd:text-[1rem]"), t(e).toHaveClass("lsd:leading-[1.5rem]");
-  }), a("applies subtitle3 variant classes correctly", () => {
-    l(/* @__PURE__ */ s(r, { variant: "subtitle3", children: "Subtitle 3" }));
-    const e = n.getByText("Subtitle 3");
+  }), s("applies subtitle3 variant classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { variant: "subtitle3", children: "Subtitle 3" }));
+    const e = o.getByText("Subtitle 3");
     t(e).toHaveClass("lsd:text-[0.875rem]"), t(e).toHaveClass("lsd:leading-[1.25rem]");
-  }), a("applies subtitle4 variant classes correctly", () => {
-    l(/* @__PURE__ */ s(r, { variant: "subtitle4", children: "Subtitle 4" }));
-    const e = n.getByText("Subtitle 4");
+  }), s("applies subtitle4 variant classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { variant: "subtitle4", children: "Subtitle 4" }));
+    const e = o.getByText("Subtitle 4");
     t(e).toHaveClass("lsd:text-[0.75rem]"), t(e).toHaveClass("lsd:leading-[1rem]");
-  }), a("applies body1 variant classes correctly", () => {
-    l(/* @__PURE__ */ s(r, { variant: "body1", children: "Body 1" }));
-    const e = n.getByText("Body 1");
+  }), s("applies body1 variant classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { variant: "body1", children: "Body 1" }));
+    const e = o.getByText("Body 1");
     t(e).toHaveClass("lsd:text-[1rem]"), t(e).toHaveClass("lsd:leading-[1.5rem]");
-  }), a("applies body2 variant classes correctly", () => {
-    l(/* @__PURE__ */ s(r, { variant: "body2", children: "Body 2" }));
-    const e = n.getByText("Body 2");
+  }), s("applies body2 variant classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { variant: "body2", children: "Body 2" }));
+    const e = o.getByText("Body 2");
     t(e).toHaveClass("lsd:text-[0.875rem]"), t(e).toHaveClass("lsd:leading-[1.25rem]");
-  }), a("applies body3 variant classes correctly", () => {
-    l(/* @__PURE__ */ s(r, { variant: "body3", children: "Body 3" }));
-    const e = n.getByText("Body 3");
+  }), s("applies body3 variant classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { variant: "body3", children: "Body 3" }));
+    const e = o.getByText("Body 3");
     t(e).toHaveClass("lsd:text-[0.75rem]"), t(e).toHaveClass("lsd:leading-[1rem]");
-  }), a("applies label1 variant classes correctly", () => {
-    l(/* @__PURE__ */ s(r, { variant: "label1", children: "Label 1" }));
-    const e = n.getByText("Label 1");
+  }), s("applies label1 variant classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { variant: "label1", children: "Label 1" }));
+    const e = o.getByText("Label 1");
     t(e).toHaveClass("lsd:text-[0.875rem]"), t(e).toHaveClass("lsd:leading-[1.25rem]"), t(e.tagName).toBe("LABEL");
-  }), a("applies label2 variant classes correctly", () => {
-    l(/* @__PURE__ */ s(r, { variant: "label2", children: "Label 2" }));
-    const e = n.getByText("Label 2");
+  }), s("applies label2 variant classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { variant: "label2", children: "Label 2" }));
+    const e = o.getByText("Label 2");
     t(e).toHaveClass("lsd:text-[0.75rem]"), t(e).toHaveClass("lsd:leading-[1rem]"), t(e.tagName).toBe("LABEL");
-  }), a("applies primary color classes correctly", () => {
-    l(/* @__PURE__ */ s(r, { color: "primary", children: "Primary" }));
-    const e = n.getByText("Primary");
+  }), s("applies primary color classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { color: "primary", children: "Primary" }));
+    const e = o.getByText("Primary");
     t(e).toHaveClass("lsd:text-lsd-text-primary");
-  }), a("applies secondary color classes correctly", () => {
-    l(/* @__PURE__ */ s(r, { color: "secondary", children: "Secondary" }));
-    const e = n.getByText("Secondary");
+  }), s("applies secondary color classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { color: "secondary", children: "Secondary" }));
+    const e = o.getByText("Secondary");
     t(e).toHaveClass("lsd:text-lsd-text-secondary");
-  }), a("merges custom className with component classes", () => {
-    l(/* @__PURE__ */ s(r, { className: "custom-class", children: "Custom" }));
-    const e = n.getByText("Custom");
+  }), s("applies destructive color classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { color: "destructive", children: "Destructive" }));
+    const e = o.getByText("Destructive");
+    t(e).toHaveClass("lsd:text-lsd-destructive-text");
+  }), s("applies success color classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { color: "success", children: "Success" }));
+    const e = o.getByText("Success");
+    t(e).toHaveClass("lsd:text-lsd-success-text");
+  }), s("applies warning color classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { color: "warning", children: "Warning" }));
+    const e = o.getByText("Warning");
+    t(e).toHaveClass("lsd:text-lsd-warning-text");
+  }), s("applies info color classes correctly", () => {
+    l(/* @__PURE__ */ a(r, { color: "info", children: "Info" }));
+    const e = o.getByText("Info");
+    t(e).toHaveClass("lsd:text-lsd-info-text");
+  }), s("merges custom className with component classes", () => {
+    l(/* @__PURE__ */ a(r, { className: "custom-class", children: "Custom" }));
+    const e = o.getByText("Custom");
     t(e).toHaveClass("custom-class");
-  }), a("allows overriding the as prop", () => {
-    l(/* @__PURE__ */ s(r, { as: "p", children: "Paragraph" }));
-    const e = n.getByText("Paragraph");
+  }), s("allows overriding the as prop", () => {
+    l(/* @__PURE__ */ a(r, { as: "p", children: "Paragraph" }));
+    const e = o.getByText("Paragraph");
     t(e.tagName).toBe("P");
-  }), a("forwards ref to underlying element", () => {
-    const e = d.fn();
-    l(/* @__PURE__ */ s(r, { ref: e, children: "Ref Test" })), t(e).toHaveBeenCalled();
-  }), a("passes through additional props", () => {
+  }), s("forwards ref to underlying element", () => {
+    const e = c.fn();
+    l(/* @__PURE__ */ a(r, { ref: e, children: "Ref Test" })), t(e).toHaveBeenCalled();
+  }), s("passes through additional props", () => {
     l(
-      /* @__PURE__ */ s(r, { "data-testid": "test-typography", id: "text-1", children: "Text" })
+      /* @__PURE__ */ a(r, { "data-testid": "test-typography", id: "text-1", children: "Text" })
     );
-    const e = n.getByText("Text");
+    const e = o.getByText("Text");
     t(e).toHaveAttribute("data-testid", "test-typography"), t(e).toHaveAttribute("id", "text-1");
-  }), a("display variants default to div element", () => {
-    l(/* @__PURE__ */ s(r, { variant: "display1", children: "Display" })), t(n.getByText("Display").tagName).toBe("DIV");
+  }), s("display variants default to div element", () => {
+    l(/* @__PURE__ */ a(r, { variant: "display1", children: "Display" })), t(o.getByText("Display").tagName).toBe("DIV");
   });
 });
-o("typographyVariants", () => {
-  a("returns correct classes for display1 variant", () => {
-    t(i({ variant: "display1" })).toContain(
+i("typographyVariants", () => {
+  s("returns correct classes for display1 variant", () => {
+    t(n({ variant: "display1" })).toContain(
       "lsd:text-[5.5rem]"
-    ), t(i({ variant: "display1" })).toContain(
+    ), t(n({ variant: "display1" })).toContain(
       "lsd:leading-[6rem]"
     );
-  }), a("returns correct classes for h1 variant", () => {
-    t(i({ variant: "h1" })).toContain(
+  }), s("returns correct classes for h1 variant", () => {
+    t(n({ variant: "h1" })).toContain(
       "lsd:text-[2.5rem]"
-    ), t(i({ variant: "h1" })).toContain(
+    ), t(n({ variant: "h1" })).toContain(
       "lsd:leading-[3rem]"
     );
-  }), a("returns correct classes for body1 variant", () => {
-    t(i({ variant: "body1" })).toContain(
+  }), s("returns correct classes for body1 variant", () => {
+    t(n({ variant: "body1" })).toContain(
       "lsd:text-[1rem]"
-    ), t(i({ variant: "body1" })).toContain(
+    ), t(n({ variant: "body1" })).toContain(
       "lsd:leading-[1.5rem]"
     );
-  }), a("returns correct classes for primary color", () => {
-    t(i({ color: "primary" })).toContain(
+  }), s("returns correct classes for primary color", () => {
+    t(n({ color: "primary" })).toContain(
       "lsd:text-lsd-text-primary"
     );
-  }), a("returns correct classes for secondary color", () => {
-    t(i({ color: "secondary" })).toContain(
+  }), s("returns correct classes for secondary color", () => {
+    t(n({ color: "secondary" })).toContain(
       "lsd:text-lsd-text-secondary"
     );
-  }), a("uses default variant when not specified", () => {
-    t(i({})).toContain("lsd:text-[1rem]");
-  }), a("uses default color when not specified", () => {
-    t(i({})).toContain("lsd:text-lsd-text-primary");
-  }), a("combines variant and color correctly", () => {
-    const e = i({ variant: "h2", color: "secondary" });
+  }), s("returns correct classes for destructive color", () => {
+    t(n({ color: "destructive" })).toContain(
+      "lsd:text-lsd-destructive-text"
+    );
+  }), s("returns correct classes for success color", () => {
+    t(n({ color: "success" })).toContain(
+      "lsd:text-lsd-success-text"
+    );
+  }), s("returns correct classes for warning color", () => {
+    t(n({ color: "warning" })).toContain(
+      "lsd:text-lsd-warning-text"
+    );
+  }), s("returns correct classes for info color", () => {
+    t(n({ color: "info" })).toContain(
+      "lsd:text-lsd-info-text"
+    );
+  }), s("uses default variant when not specified", () => {
+    t(n({})).toContain("lsd:text-[1rem]");
+  }), s("uses default color when not specified", () => {
+    t(n({})).toContain("lsd:text-lsd-text-primary");
+  }), s("combines variant and color correctly", () => {
+    const e = n({ variant: "h2", color: "secondary" });
     t(e).toContain("lsd:text-[2rem]"), t(e).toContain("lsd:text-lsd-text-secondary");
   });
 });

package/dist/lib/types.d.ts

@@ -1,3 +1,3 @@
 export type SizeVariant = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
-export type IconSize = 'icon-sm' | 'icon-md' | 'icon-lg' | 'icon-xl';
+export type IconSize = 'icon-xs' | 'icon-sm' | 'icon-md' | 'icon-lg' | 'icon-xl';
 export type BorderVariant = 'outlined' | 'underlined';

package/dist/main.d.ts

@@ -13,6 +13,7 @@ export * from './components/ui/label';
 export * from './components/ui/menubar';
 export * from './components/ui/popover';
 export * from './components/ui/progress';
+export * from './components/ui/scroll-area';
 export * from './components/ui/select';
 export * from './components/ui/separator';
 export * from './components/ui/sheet';