@tomny-dev/uzi 0.1.6 → 0.1.8

package/dist/index.cjs

@@ -78,26 +78,23 @@ function cx(...values) {
   return values.filter(Boolean).join(" ");
 }
 
-// src/components/button/button.module.css
-var button_default = {};
-
 // src/components/button/Button.tsx
 var import_jsx_runtime = require("react/jsx-runtime");
 var variantClass = {
-  default: button_default["variant-primary"],
-  primary: button_default["variant-primary"],
-  secondary: button_default["variant-secondary"],
-  outline: button_default["variant-outline"],
-  ghost: button_default["variant-ghost"],
-  destructive: button_default["variant-destructive"],
-  link: button_default["variant-link"]
+  default: "variant-primary",
+  primary: "variant-primary",
+  secondary: "variant-secondary",
+  outline: "variant-outline",
+  ghost: "variant-ghost",
+  destructive: "variant-destructive",
+  link: "variant-link"
 };
 var sizeClass = {
-  default: button_default["size-md"],
-  sm: button_default["size-sm"],
-  md: button_default["size-md"],
-  lg: button_default["size-lg"],
-  icon: button_default["size-icon"]
+  default: "size-md",
+  sm: "size-sm",
+  md: "size-md",
+  lg: "size-lg",
+  icon: "size-icon"
 };
 function Button({
   as,
@@ -109,7 +106,7 @@ function Button({
   ...rest
 }) {
   const classes = cx(
-    button_default.button,
+    "button",
     variantClass[variant],
     sizeClass[size],
     className
@@ -140,11 +137,6 @@ function Button({
 
 // src/components/avatar/Avatar.tsx
 var AvatarPrimitive = __toESM(require("@radix-ui/react-avatar"), 1);
-
-// src/components/avatar/avatar.module.css
-var avatar_default = {};
-
-// src/components/avatar/Avatar.tsx
 var import_jsx_runtime2 = require("react/jsx-runtime");
 function Avatar({
   className,
@@ -154,7 +146,7 @@ function Avatar({
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
     AvatarPrimitive.Root,
     {
-      className: cx(avatar_default.avatar, avatar_default[`size-${size}`], className),
+      className: cx("avatar", size === "sm" ? "size-sm" : size === "lg" ? "size-lg" : "size-md", className),
       ...props
     }
   );
@@ -166,7 +158,7 @@ function AvatarImage({
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
     AvatarPrimitive.Image,
     {
-      className: cx(avatar_default.image, className),
+      className: cx("image", className),
       ...props
     }
   );
@@ -178,15 +170,12 @@ function AvatarFallback({
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
     AvatarPrimitive.Fallback,
     {
-      className: cx(avatar_default.fallback, className),
+      className: cx("fallback", className),
       ...props
     }
   );
 }
 
-// src/components/card/card.module.css
-var card_default = {};
-
 // src/components/card/Card.tsx
 var import_jsx_runtime3 = require("react/jsx-runtime");
 function Card({
@@ -199,20 +188,18 @@ function Card({
   ...rest
 }) {
   const Component = as ?? "div";
-  const toneClass = tone !== "default" ? card_default[`tone-${tone}`] : null;
+  const TONE_CLASS2 = { default: null, muted: "tone-muted", contrast: "tone-contrast" };
+  const PADDING_CLASS = { none: "padding-none", sm: "padding-sm", md: "padding-md", lg: "padding-lg" };
   const classes = cx(
-    card_default.card,
-    toneClass,
-    card_default[`padding-${padding}`],
-    interactive && card_default.interactive,
+    "card",
+    TONE_CLASS2[tone],
+    PADDING_CLASS[padding],
+    interactive && "interactive",
     className
   );
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Component, { className: classes, ...rest, children });
 }
 
-// src/components/pill/pill.module.css
-var pill_default = {};
-
 // src/components/pill/Pill.tsx
 var import_jsx_runtime4 = require("react/jsx-runtime");
 function Pill({
@@ -225,20 +212,15 @@ function Pill({
   ...rest
 }) {
   const Component = as ?? "span";
-  const classes = cx(pill_default.pill, pill_default[`tone-${tone}`], pill_default[`size-${size}`], className);
+  const classes = cx("pill", `tone-${tone}`, `size-${size}`, className);
   return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Component, { className: classes, ...rest, children: [
-    icon ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: pill_default.icon, "aria-hidden": "true", children: icon }) : null,
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: pill_default.content, children })
+    icon ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "icon", "aria-hidden": "true", children: icon }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "content", children })
   ] });
 }
 
 // src/components/modal/Modal.tsx
 var import_react = require("react");
-
-// src/components/modal/modal.module.css
-var modal_default = {};
-
-// src/components/modal/Modal.tsx
 var import_jsx_runtime5 = require("react/jsx-runtime");
 function ModalOverlay({ open, onClose, className, children }) {
   const mouseDownOnBackdrop = (0, import_react.useRef)(false);
@@ -257,7 +239,7 @@ function ModalOverlay({ open, onClose, className, children }) {
   return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
     "div",
     {
-      className: cx(modal_default.backdrop, className),
+      className: cx("backdrop", className),
       role: "dialog",
       "aria-modal": "true",
       onMouseDown: (e) => {
@@ -272,38 +254,36 @@ function ModalOverlay({ open, onClose, className, children }) {
   );
 }
 function Modal({ open, onClose, title, subtitle, size = "md", children, footer }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ModalOverlay, { open, onClose, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: cx(modal_default.modal, modal_default[`size-${size}`]), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: modal_default.header, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: modal_default.titles, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: modal_default.title, children: title }),
-        subtitle && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: modal_default.subtitle, children: subtitle })
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ModalOverlay, { open, onClose, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: cx("modal", `size-${size}`), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "header", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "titles", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "title", children: title }),
+        subtitle && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "subtitle", children: subtitle })
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("button", { className: modal_default.closeButton, onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("button", { className: "closeButton", onClick: onClose, "aria-label": "Close", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
         /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
         /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
       ] }) })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: modal_default.body, children }),
-    footer && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: modal_default.footer, children: footer })
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "body", children }),
+    footer && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "footer", children: footer })
   ] }) });
 }
 
-// src/components/alert/alert.module.css
-var alert_default = {};
-
 // src/components/alert/Alert.tsx
 var import_jsx_runtime6 = require("react/jsx-runtime");
+var TONE_CLASS = {
+  success: "success",
+  error: "error",
+  warning: "warning",
+  info: "info"
+};
 function Alert({ tone, children, className }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: cx(alert_default.alert, alert_default[tone], className), role: "alert", children });
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: cx("alert", TONE_CLASS[tone], className), role: "alert", children });
 }
 
 // src/components/toast/ToastContext.tsx
 var import_react2 = require("react");
-
-// src/components/toast/toast.module.css
-var toast_default = {};
-
-// src/components/toast/ToastContext.tsx
 var import_jsx_runtime7 = require("react/jsx-runtime");
 var DEFAULT_CONFIG = {
   position: "top-right",
@@ -405,24 +385,24 @@ function ToastContainer({
   const posClass = (() => {
     switch (position) {
       case "top-left":
-        return toast_default.topLeft;
+        return "topLeft";
       case "top-center":
-        return toast_default.topCenter;
+        return "topCenter";
       case "bottom-right":
-        return toast_default.bottomRight;
+        return "bottomRight";
       case "bottom-left":
-        return toast_default.bottomLeft;
+        return "bottomLeft";
       case "bottom-center":
-        return toast_default.bottomCenter;
+        return "bottomCenter";
       case "top-right":
       default:
-        return toast_default.topRight;
+        return "topRight";
     }
   })();
   return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
     "div",
     {
-      className: cx(toast_default.stack, posClass),
+      className: cx("stack", posClass),
       role: "presentation",
       onMouseEnter: () => pauseOnHover && onPauseChange(true),
       onMouseLeave: () => pauseOnHover && onPauseChange(false),
@@ -488,15 +468,15 @@ function ToastItem({
     }
   }, [isPaused, schedule, toast.duration]);
   const icon = getIcon(toast.type);
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: cx(toast_default.toast, exiting && toast_default.exit), style: styleVars, role: "status", "aria-live": "polite", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: toast_default.icon, "aria-hidden": true, children: icon }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: toast_default.body, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: toast_default.message, children: toast.message }),
-      toast.action && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: toast_default.actions, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: cx("toast", exiting && "exit"), style: styleVars, role: "status", "aria-live": "polite", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "icon", "aria-hidden": true, children: icon }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "body", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "message", children: toast.message }),
+      toast.action && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "actions", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
         "button",
         {
           type: "button",
-          className: toast_default.actionButton,
+          className: "actionButton",
           onClick: () => {
             toast.action?.onClick();
             triggerDismiss();
@@ -509,7 +489,7 @@ function ToastItem({
       "button",
       {
         type: "button",
-        className: toast_default.closeButton,
+        className: "closeButton",
         onClick: triggerDismiss,
         "aria-label": "Dismiss notification",
         children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
@@ -586,11 +566,6 @@ function getIcon(type) {
 
 // src/components/input/Input.tsx
 var React = __toESM(require("react"), 1);
-
-// src/components/input/input.module.css
-var input_default = {};
-
-// src/components/input/Input.tsx
 var import_jsx_runtime8 = require("react/jsx-runtime");
 var Input = React.forwardRef(
   ({ className, type, ...props }, ref) => {
@@ -599,7 +574,7 @@ var Input = React.forwardRef(
       {
         ref,
         type,
-        className: cx(input_default.input, className),
+        className: cx("input", className),
         ...props
       }
     );
@@ -609,24 +584,14 @@ Input.displayName = "Input";
 
 // src/components/label/Label.tsx
 var React2 = __toESM(require("react"), 1);
-
-// src/components/label/label.module.css
-var label_default = {};
-
-// src/components/label/Label.tsx
 var import_jsx_runtime9 = require("react/jsx-runtime");
 var Label = React2.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("label", { ref, className: cx(label_default.label, className), ...props })
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("label", { ref, className: cx("label", className), ...props })
 );
 Label.displayName = "Label";
 
 // src/components/checkbox/Checkbox.tsx
 var React3 = __toESM(require("react"), 1);
-
-// src/components/checkbox/checkbox.module.css
-var checkbox_default = {};
-
-// src/components/checkbox/Checkbox.tsx
 var import_jsx_runtime10 = require("react/jsx-runtime");
 var Checkbox = React3.forwardRef(
   ({ className, ...props }, ref) => {
@@ -635,7 +600,7 @@ var Checkbox = React3.forwardRef(
       {
         ref,
         type: "checkbox",
-        className: cx(checkbox_default.checkbox, className),
+        className: cx("checkbox", className),
         ...props
       }
     );
@@ -645,11 +610,6 @@ Checkbox.displayName = "Checkbox";
 
 // src/components/dropdown/Dropdown.tsx
 var import_react3 = require("react");
-
-// src/components/dropdown/dropdown.module.css
-var dropdown_default = {};
-
-// src/components/dropdown/Dropdown.tsx
 var import_jsx_runtime11 = require("react/jsx-runtime");
 function Dropdown({
   options,
@@ -674,27 +634,27 @@ function Dropdown({
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: cx(dropdown_default.wrapper, className), ref, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: cx("wrapper", className), ref, children: [
     /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
       "button",
       {
         type: "button",
-        className: cx(dropdown_default.trigger, isActive && dropdown_default["trigger-active"]),
+        className: cx("trigger", isActive && "trigger-active"),
         onClick: () => setOpen((o) => !o),
         "aria-labelledby": ariaLabelledBy,
         "aria-label": ariaLabel,
         children: [
           selected ? selected.label : placeholder,
-          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: cx(dropdown_default.chevron, open && dropdown_default["chevron-open"]), children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("svg", { viewBox: "0 0 10 10", fill: "none", xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", { d: "M2 3.5L5 6.5L8 3.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }) })
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: cx("chevron", open && "chevron-open"), children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("svg", { viewBox: "0 0 10 10", fill: "none", xmlns: "http://www.w3.org/2000/svg", width: "10", height: "10", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("path", { d: "M2 3.5L5 6.5L8 3.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }) })
         ]
       }
     ),
-    open && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: dropdown_default.menu, children: [
+    open && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "menu", children: [
       allowClear && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
         "button",
         {
           type: "button",
-          className: cx(dropdown_default.option, value === "" && dropdown_default["option-selected"]),
+          className: cx("option", value === "" && "option-selected"),
           onClick: () => {
             onChange("");
             setOpen(false);
@@ -706,7 +666,7 @@ function Dropdown({
         "button",
         {
           type: "button",
-          className: cx(dropdown_default.option, value === opt.value && dropdown_default["option-selected"]),
+          className: cx("option", value === opt.value && "option-selected"),
           onClick: () => {
             onChange(opt.value);
             setOpen(false);
@@ -721,11 +681,6 @@ function Dropdown({
 
 // src/components/dropdown-menu/DropdownMenu.tsx
 var DropdownMenuPrimitive = __toESM(require("@radix-ui/react-dropdown-menu"), 1);
-
-// src/components/dropdown-menu/dropdown-menu.module.css
-var dropdown_menu_default = {};
-
-// src/components/dropdown-menu/DropdownMenu.tsx
 var import_jsx_runtime12 = require("react/jsx-runtime");
 function DropdownMenu(props) {
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(DropdownMenuPrimitive.Root, { ...props });
@@ -754,7 +709,7 @@ function DropdownMenuContent({
     DropdownMenuPrimitive.Content,
     {
       sideOffset,
-      className: cx(dropdown_menu_default.content, className),
+      className: cx("content", className),
       ...props
     }
   ) });
@@ -770,8 +725,8 @@ function DropdownMenuItem({
     {
       "data-inset": inset ? "true" : void 0,
       className: cx(
-        dropdown_menu_default.item,
-        variant === "destructive" && dropdown_menu_default.destructive,
+        "item",
+        variant === "destructive" && "destructive",
         className
       ),
       ...props
@@ -786,17 +741,17 @@ function DropdownMenuCheckboxItem({
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
     DropdownMenuPrimitive.CheckboxItem,
     {
-      className: cx(dropdown_menu_default.item, dropdown_menu_default.insetItem, className),
+      className: cx("item", "insetItem", className),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: dropdown_menu_default.indicator, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "indicator", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
           "svg",
           {
             viewBox: "0 0 16 16",
             width: "16",
             height: "16",
             "aria-hidden": "true",
-            className: dropdown_menu_default.indicatorIcon,
+            className: "indicatorIcon",
             children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
               "path",
               {
@@ -823,10 +778,10 @@ function DropdownMenuRadioItem({
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
     DropdownMenuPrimitive.RadioItem,
     {
-      className: cx(dropdown_menu_default.item, dropdown_menu_default.insetItem, className),
+      className: cx("item", "insetItem", className),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: dropdown_menu_default.indicator, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: dropdown_menu_default.radioDot }) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "indicator", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "radioDot" }) }) }),
         children
       ]
     }
@@ -841,7 +796,7 @@ function DropdownMenuLabel({
     DropdownMenuPrimitive.Label,
     {
       "data-inset": inset ? "true" : void 0,
-      className: cx(dropdown_menu_default.label, className),
+      className: cx("label", className),
       ...props
     }
   );
@@ -853,7 +808,7 @@ function DropdownMenuSeparator({
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
     DropdownMenuPrimitive.Separator,
     {
-      className: cx(dropdown_menu_default.separator, className),
+      className: cx("separator", className),
       ...props
     }
   );
@@ -868,7 +823,7 @@ function DropdownMenuSubTrigger({
     DropdownMenuPrimitive.SubTrigger,
     {
       "data-inset": inset ? "true" : void 0,
-      className: cx(dropdown_menu_default.item, className),
+      className: cx("item", className),
       ...props,
       children: [
         children,
@@ -879,7 +834,7 @@ function DropdownMenuSubTrigger({
             width: "16",
             height: "16",
             "aria-hidden": "true",
-            className: dropdown_menu_default.chevron,
+            className: "chevron",
             children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
               "path",
               {
@@ -904,7 +859,7 @@ function DropdownMenuSubContent({
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
     DropdownMenuPrimitive.SubContent,
     {
-      className: cx(dropdown_menu_default.content, className),
+      className: cx("content", className),
       ...props
     }
   );
@@ -1026,9 +981,6 @@ function useTheme() {
   return context;
 }
 
-// src/components/theme-toggle-button/theme-toggle-button.module.css
-var theme_toggle_button_default = {};
-
 // src/components/theme-toggle-button/ThemeToggleButton.tsx
 var import_jsx_runtime14 = require("react/jsx-runtime");
 function MoonIcon() {
@@ -1073,7 +1025,7 @@ function ThemeToggleButton({
       type: "button",
       variant: "ghost",
       size: showLabel ? "sm" : "icon",
-      className: cx(showLabel && theme_toggle_button_default.withLabel, className),
+      className: cx(showLabel && "withLabel", className),
       "aria-label": `Switch to ${nextThemeLabel.toLowerCase()}`,
       title: `Switch to ${nextThemeLabel.toLowerCase()}`,
       onClick: (event) => {
@@ -1089,9 +1041,6 @@ function ThemeToggleButton({
   );
 }
 
-// src/components/top-bar/top-bar.module.css
-var top_bar_default = {};
-
 // src/components/top-bar/TopBar.tsx
 var import_jsx_runtime15 = require("react/jsx-runtime");
 function TopBar({
@@ -1112,23 +1061,23 @@ function TopBar({
   ...rest
 }) {
   const shouldStick = isSticky ?? sticky;
-  const brandNode = !brand ? null : brandHref ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("a", { href: brandHref, className: top_bar_default.topBarBrand, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: top_bar_default.topBarBrandContent, children: brand }) }) : /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: top_bar_default.topBarBrand, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: top_bar_default.topBarBrandContent, children: brand }) });
+  const brandNode = !brand ? null : brandHref ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("a", { href: brandHref, className: "topBarBrand", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "topBarBrandContent", children: brand }) }) : /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "topBarBrand", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "topBarBrandContent", children: brand }) });
   return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
     "header",
     {
-      className: cx(top_bar_default.topBar, !shouldStick && top_bar_default.topBarStatic, className),
+      className: cx("topBar", !shouldStick && "topBarStatic", className),
       ...rest,
-      children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: cx(top_bar_default.topBarInner, innerClassName), children: [
-        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: top_bar_default.topBarStart, children: [
+      children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: cx("topBarInner", innerClassName), children: [
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "topBarStart", children: [
           leading,
           brandingLocation === "left" && brandNode,
           start
         ] }),
-        brandNode && brandingLocation === "center" || center || children ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: top_bar_default.topBarCenter, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: top_bar_default.topBarCenterGroup, children: [
+        brandNode && brandingLocation === "center" || center || children ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "topBarCenter", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "topBarCenterGroup", children: [
           brandingLocation === "center" && brandNode,
           center ?? children
         ] }) }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: top_bar_default.topBarActions, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "topBarActions", children: [
           showThemeToggle && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(ThemeToggleButton, { ...themeToggleProps }),
           actions
         ] })
@@ -1137,9 +1086,6 @@ function TopBar({
   );
 }
 
-// src/components/app-shell/app-shell.module.css
-var app_shell_default = {};
-
 // src/components/app-shell/AppShell.tsx
 var import_jsx_runtime16 = require("react/jsx-runtime");
 var DESKTOP_BREAKPOINT = 960;
@@ -1235,12 +1181,12 @@ function AppShell({
   const sidebarWidthValue = sidebarWidth === void 0 ? void 0 : typeof sidebarWidth === "number" ? `${sidebarWidth}px` : sidebarWidth;
   const shellStyle = sidebarWidthValue ? { ["--app-shell-sidebar-width"]: sidebarWidthValue } : void 0;
   const shellClasses = cx(
-    app_shell_default.appShell,
-    transitionsReady && app_shell_default.appShellAnimated,
-    sidebarOpen ? app_shell_default.appShellOpen : app_shell_default.appShellCollapsed,
+    "appShell",
+    transitionsReady && "appShellAnimated",
+    sidebarOpen ? "appShellOpen" : "appShellCollapsed",
     className
   );
-  const sidebarClasses = cx(app_shell_default.appShellSidebar, sidebarOpen && app_shell_default.appShellSidebarOpen, sidebarClassName);
+  const sidebarClasses = cx("appShellSidebar", sidebarOpen && "appShellSidebarOpen", sidebarClassName);
   return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
     "div",
     {
@@ -1253,13 +1199,13 @@ function AppShell({
         /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
           TopBar,
           {
-            className: cx(app_shell_default.appShellTopbar, topbarClassName),
+            className: cx("appShellTopbar", topbarClassName),
             leading: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
               "button",
               {
                 ref: hamburgerRef,
                 type: "button",
-                className: app_shell_default.appShellHamburger,
+                className: "appShellHamburger",
                 onClick: toggleSidebar,
                 "aria-label": hamburgerLabel,
                 "aria-expanded": sidebarOpen,
@@ -1276,17 +1222,14 @@ function AppShell({
             themeToggleProps
           }
         ),
-        !isDesktop && sidebarOpen && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: app_shell_default.appShellBackdrop, onClick: () => setSidebarOpen(false), onTouchStart: () => setSidebarOpen(false), "aria-hidden": "true" }),
+        !isDesktop && sidebarOpen && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "appShellBackdrop", onClick: () => setSidebarOpen(false), onTouchStart: () => setSidebarOpen(false), "aria-hidden": "true" }),
         /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("aside", { ref: sidebarRef, id: sidebarId, className: sidebarClasses, "aria-label": "Sidebar navigation", children: sidebar }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("main", { ref: mainRef, className: cx(app_shell_default.appShellMain, mainClassName), children })
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("main", { ref: mainRef, className: cx("appShellMain", mainClassName), children })
       ]
     }
   );
 }
 
-// src/components/sidebar-nav/sidebar-nav.module.css
-var sidebar_nav_default = {};
-
 // src/components/sidebar-nav/SidebarNav.tsx
 var import_jsx_runtime17 = require("react/jsx-runtime");
 var defaultIsActive = (item, path) => {
@@ -1318,18 +1261,18 @@ function SidebarNav({
   return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
     "nav",
     {
-      className: cx(sidebar_nav_default.uziSidebarNav, collapsed && sidebar_nav_default.uziSidebarNavCollapsed, className),
+      className: cx("uziSidebarNav", collapsed && "uziSidebarNavCollapsed", className),
       "aria-label": ariaLabel,
       style,
       children: [
-        header ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: sidebar_nav_default.uziSidebarNavHeader, children: header }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: sidebar_nav_default.uziSidebarNavSections, children: resolvedSections.map((section, sectionIndex) => /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
+        header ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "uziSidebarNavHeader", children: header }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "uziSidebarNavSections", children: resolvedSections.map((section, sectionIndex) => /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
           "div",
           {
-            className: cx(sidebar_nav_default.uziSidebarNavSection, sectionClassName),
+            className: cx("uziSidebarNavSection", sectionClassName),
             children: [
-              section.label && !collapsed ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: sidebar_nav_default.uziSidebarNavSectionLabel, children: section.label }) : null,
-              /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: sidebar_nav_default.uziSidebarNavSectionItems, children: section.items.map((item, itemIndex) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+              section.label && !collapsed ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "uziSidebarNavSectionLabel", children: section.label }) : null,
+              /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "uziSidebarNavSectionItems", children: section.items.map((item, itemIndex) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
                 SidebarNavEntry,
                 {
                   item,
@@ -1344,7 +1287,7 @@ function SidebarNav({
           },
           section.id ?? `section-${sectionIndex}`
         )) }),
-        footer ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: sidebar_nav_default.uziSidebarNavFooter, children: footer }) : null
+        footer ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "uziSidebarNavFooter", children: footer }) : null
       ]
     }
   );
@@ -1359,20 +1302,20 @@ function SidebarNavEntry({
   const rel = item.rel ?? (item.target === "_blank" ? "noreferrer" : void 0);
   const title = item.title ?? (typeof item.label === "string" ? item.label : void 0);
   const classes = cx(
-    sidebar_nav_default.uziSidebarNavItem,
-    active && sidebar_nav_default.uziSidebarNavItemActive,
-    collapsed && sidebar_nav_default.uziSidebarNavItemCollapsed,
-    item.disabled && sidebar_nav_default.uziSidebarNavItemDisabled,
+    "uziSidebarNavItem",
+    active && "uziSidebarNavItemActive",
+    collapsed && "uziSidebarNavItemCollapsed",
+    item.disabled && "uziSidebarNavItemDisabled",
     itemClassName
   );
   const content = /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
-    item.icon && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: sidebar_nav_default.uziSidebarNavIcon, children: item.icon }),
-    !collapsed ? /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("span", { className: sidebar_nav_default.uziSidebarNavItemBody, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("span", { className: sidebar_nav_default.uziSidebarNavLabelRow, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: sidebar_nav_default.uziSidebarNavLabel, children: item.label }),
-        item.badge && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: sidebar_nav_default.uziSidebarNavBadge, children: item.badge })
+    item.icon && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "uziSidebarNavIcon", children: item.icon }),
+    !collapsed ? /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("span", { className: "uziSidebarNavItemBody", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("span", { className: "uziSidebarNavLabelRow", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "uziSidebarNavLabel", children: item.label }),
+        item.badge && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "uziSidebarNavBadge", children: item.badge })
       ] }),
-      item.description ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: sidebar_nav_default.uziSidebarNavDescription, children: item.description }) : null
+      item.description ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "uziSidebarNavDescription", children: item.description }) : null
     ] }) : null
   ] });
   const handleClick = () => {