@tomny-dev/uzi 0.1.9-pr.2.5.1.9b8d3dd → 0.1.9-pr.2.6.1.ba85af4

package/dist/index.cjs

@@ -85,20 +85,20 @@ function cx(...values) {
 // src/components/button/Button.tsx
 var import_jsx_runtime = require("react/jsx-runtime");
 var variantClass = {
-  default: "variant-primary",
-  primary: "variant-primary",
-  secondary: "variant-secondary",
-  outline: "variant-outline",
-  ghost: "variant-ghost",
-  destructive: "variant-destructive",
-  link: "variant-link"
+  default: "uziButtonVariantPrimary",
+  primary: "uziButtonVariantPrimary",
+  secondary: "uziButtonVariantSecondary",
+  outline: "uziButtonVariantOutline",
+  ghost: "uziButtonVariantGhost",
+  destructive: "uziButtonVariantDestructive",
+  link: "uziButtonVariantLink"
 };
 var sizeClass = {
-  default: "size-md",
-  sm: "size-sm",
-  md: "size-md",
-  lg: "size-lg",
-  icon: "size-icon"
+  default: "uziButtonSizeMd",
+  sm: "uziButtonSizeSm",
+  md: "uziButtonSizeMd",
+  lg: "uziButtonSizeLg",
+  icon: "uziButtonSizeIcon"
 };
 function Button({
   as,
@@ -110,7 +110,7 @@ function Button({
   ...rest
 }) {
   const classes = cx(
-    "button",
+    "uziButton",
     variantClass[variant],
     sizeClass[size],
     className
@@ -141,16 +141,22 @@ 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,
   size = "md",
   ...props
 }) {
+  const sizeClass2 = size === "sm" ? avatar_default["size-sm"] : size === "lg" ? avatar_default["size-lg"] : avatar_default["size-md"];
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
     AvatarPrimitive.Root,
     {
-      className: cx("avatar", size === "sm" ? "size-sm" : size === "lg" ? "size-lg" : "size-md", className),
+      className: cx(avatar_default.avatar, sizeClass2, className),
       ...props
     }
   );
@@ -162,7 +168,7 @@ function AvatarImage({
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
     AvatarPrimitive.Image,
     {
-      className: cx("image", className),
+      className: cx(avatar_default.image, className),
       ...props
     }
   );
@@ -174,12 +180,15 @@ function AvatarFallback({
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
     AvatarPrimitive.Fallback,
     {
-      className: cx("fallback", className),
+      className: cx(avatar_default.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({
@@ -192,18 +201,21 @@ function Card({
   ...rest
 }) {
   const Component = as ?? "div";
-  const TONE_CLASS2 = { default: null, muted: "tone-muted", contrast: "tone-contrast" };
+  const TONE_CLASS = { 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",
-    TONE_CLASS2[tone],
-    PADDING_CLASS[padding],
-    interactive && "interactive",
+    card_default.card,
+    TONE_CLASS[tone] ? card_default[TONE_CLASS[tone]] : null,
+    card_default[PADDING_CLASS[padding]],
+    interactive && card_default.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({
@@ -216,15 +228,20 @@ function Pill({
   ...rest
 }) {
   const Component = as ?? "span";
-  const classes = cx("pill", `tone-${tone}`, `size-${size}`, className);
+  const classes = cx(pill_default.pill, pill_default[`tone-${tone}`], pill_default[`size-${size}`], className);
   return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Component, { className: classes, ...rest, 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 })
+    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 })
   ] });
 }
 
 // src/components/modal/Modal.tsx
 var DialogPrimitive = __toESM(require("@radix-ui/react-dialog"), 1);
+
+// 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 }) {
   return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
@@ -234,45 +251,47 @@ function ModalOverlay({ open, onClose, className, children }) {
       onOpenChange: (nextOpen) => {
         if (!nextOpen) onClose();
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(DialogPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "portalLayer", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(DialogPrimitive.Overlay, { className: cx("backdrop", className) }),
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(DialogPrimitive.Content, { className: "overlayContent", children })
+      children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(DialogPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: modal_default.portalLayer, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(DialogPrimitive.Overlay, { className: cx(modal_default.backdrop, className) }),
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(DialogPrimitive.Content, { className: modal_default.overlayContent, 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", `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)(DialogPrimitive.Title, { className: "title", children: title }),
-        subtitle ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(DialogPrimitive.Description, { className: "subtitle", children: subtitle }) : null
+  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)(DialogPrimitive.Title, { className: modal_default.title, children: title }),
+        subtitle ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(DialogPrimitive.Description, { className: modal_default.subtitle, children: subtitle }) : null
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(DialogPrimitive.Close, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("button", { className: "closeButton", "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)(DialogPrimitive.Close, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("button", { className: modal_default.closeButton, "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: "body", children }),
-    footer && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "footer", children: footer })
+    /* @__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 })
   ] }) });
 }
 
+// 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", TONE_CLASS[tone], className), role: "alert", children });
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: cx(alert_default.alert, alert_default[tone], className), role: "alert", children });
 }
 
 // src/components/toast/ToastContext.tsx
 var import_react = require("react");
 var ToastPrimitive = __toESM(require("@radix-ui/react-toast"), 1);
+
+// 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",
@@ -393,7 +412,7 @@ function ToastContainer({
     /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
       ToastPrimitive.Viewport,
       {
-        className: cx("stack", posClass),
+        className: cx(toast_default.stack, toast_default[posClass]),
         label: "Notifications",
         onMouseEnter: () => pauseOnHover && onPauseChange(true),
         onMouseLeave: () => pauseOnHover && onPauseChange(false)
@@ -470,13 +489,13 @@ function ToastItem({
         if (!nextOpen) triggerDismiss();
       },
       duration: 2147483647,
-      className: "toast",
+      className: toast_default.toast,
       style: styleVars,
       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)(ToastPrimitive.Description, { className: "message", children: toast.message }),
-          toast.action && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "actions", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+        /* @__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)(ToastPrimitive.Description, { 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)(
             ToastPrimitive.Action,
             {
               asChild: true,
@@ -485,7 +504,7 @@ function ToastItem({
                 "button",
                 {
                   type: "button",
-                  className: "actionButton",
+                  className: toast_default.actionButton,
                   onClick: () => {
                     toast.action?.onClick();
                     triggerDismiss();
@@ -500,7 +519,7 @@ function ToastItem({
           "button",
           {
             type: "button",
-            className: "closeButton",
+            className: toast_default.closeButton,
             "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)(
               "path",
@@ -578,6 +597,11 @@ 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) => {
@@ -586,7 +610,7 @@ var Input = React.forwardRef(
       {
         ref,
         type,
-        className: cx("input", className),
+        className: cx(input_default.input, className),
         ...props
       }
     );
@@ -596,14 +620,24 @@ 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", className), ...props })
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("label", { ref, className: cx(label_default.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) => {
@@ -612,7 +646,7 @@ var Checkbox = React3.forwardRef(
       {
         ref,
         type: "checkbox",
-        className: cx("checkbox", className),
+        className: cx(checkbox_default.checkbox, className),
         ...props
       }
     );
@@ -662,29 +696,39 @@ var MultiSelect = React4.forwardRef(
     return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(DropdownMenuPrimitive.Root, { modal: false, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
       "div",
       {
-        className: cx("wrapper", fullWidth && "wrapper-fullWidth", className),
+        className: cx(
+          "uziMultiSelectWrapper",
+          fullWidth && "uziMultiSelectWrapperFullWidth",
+          className
+        ),
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(DropdownMenuPrimitive.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
             "button",
             {
               ref,
               type: "button",
-              className: cx(
-                "trigger",
-                selectedOptions.length > 0 && "trigger-hasValue"
-              ),
+              className: "uziMultiSelectTrigger",
               "aria-label": ariaLabel,
               "aria-labelledby": ariaLabelledBy,
               disabled,
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "value", children: selectedOptions.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "placeholder", children: placeholder }) : /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_jsx_runtime11.Fragment, { children: [
-                  visibleOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "chip", children: option.label }, option.value)),
-                  overflowCount > 0 ? /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("span", { className: "chip chip-summary", children: [
-                    "+",
-                    overflowCount
-                  ] }) : null
+                /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "uziMultiSelectValue", children: selectedOptions.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "uziMultiSelectPlaceholder", children: placeholder }) : /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_jsx_runtime11.Fragment, { children: [
+                  visibleOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "uziMultiSelectChip", children: option.label }, option.value)),
+                  overflowCount > 0 ? /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+                    "span",
+                    {
+                      className: cx(
+                        "uziMultiSelectChip",
+                        "uziMultiSelectChipSummary"
+                      ),
+                      children: [
+                        "+",
+                        overflowCount
+                      ]
+                    }
+                  ) : null
                 ] }) }),
-                /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "chevron", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "uziMultiSelectChevron", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
                   "svg",
                   {
                     viewBox: "0 0 10 10",
@@ -711,7 +755,7 @@ var MultiSelect = React4.forwardRef(
           /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
             DropdownMenuPrimitive.Content,
             {
-              className: "menu",
+              className: "uziMultiSelectMenu",
               sideOffset: 4,
               align: "start",
               children: options.map((option) => {
@@ -720,9 +764,9 @@ var MultiSelect = React4.forwardRef(
                   DropdownMenuPrimitive.CheckboxItem,
                   {
                     className: cx(
-                      "option",
-                      selected && "option-selected",
-                      option.disabled && "option-disabled"
+                      "uziMultiSelectOption",
+                      selected && "uziMultiSelectOptionSelected",
+                      option.disabled && "uziMultiSelectOptionDisabled"
                     ),
                     checked: selected,
                     disabled: option.disabled,
@@ -733,9 +777,9 @@ var MultiSelect = React4.forwardRef(
                         "span",
                         {
                           className: cx(
-                            "indicator",
-                            selected && "indicator-selected",
-                            option.disabled && "indicator-disabled"
+                            "uziMultiSelectIndicator",
+                            selected && "uziMultiSelectIndicatorSelected",
+                            option.disabled && "uziMultiSelectIndicatorDisabled"
                           ),
                           "aria-hidden": "true",
                           children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(DropdownMenuPrimitive.ItemIndicator, { forceMount: true, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
@@ -760,7 +804,7 @@ var MultiSelect = React4.forwardRef(
                           ) })
                         }
                       ),
-                      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "option-label", children: option.label })
+                      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "uziMultiSelectOptionLabel", children: option.label })
                     ]
                   },
                   option.value
@@ -805,131 +849,154 @@ var Select = React5.forwardRef(
     onFocus
   }, ref) => {
     const internalValue = value === "" && allowEmptyOption ? EMPTY_OPTION_VALUE : value;
-    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: cx("wrapper", fullWidth && "wrapper-fullWidth", className), children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
-      SelectPrimitive.Root,
+    return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      "div",
       {
-        value: internalValue,
-        onValueChange: (nextValue) => onChange(nextValue === EMPTY_OPTION_VALUE ? "" : nextValue),
-        name,
-        disabled,
-        required,
-        autoComplete,
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
-            SelectPrimitive.Trigger,
-            {
-              ref,
-              id,
-              className: "select",
-              form,
-              title,
-              "aria-label": ariaLabel,
-              "aria-labelledby": ariaLabelledBy,
-              onBlur,
-              onFocus,
-              children: [
-                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SelectPrimitive.Value, { className: "value", placeholder }),
-                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SelectPrimitive.Icon, { className: "chevron", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime12.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_runtime12.jsx)(
-                      "path",
+        className: cx(
+          "uziSelectWrapper",
+          fullWidth && "uziSelectWrapperFullWidth",
+          className
+        ),
+        children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+          SelectPrimitive.Root,
+          {
+            value: internalValue,
+            onValueChange: (nextValue) => onChange(nextValue === EMPTY_OPTION_VALUE ? "" : nextValue),
+            name,
+            disabled,
+            required,
+            autoComplete,
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+                SelectPrimitive.Trigger,
+                {
+                  ref,
+                  id,
+                  className: "uziSelectTrigger",
+                  form,
+                  title,
+                  "aria-label": ariaLabel,
+                  "aria-labelledby": ariaLabelledBy,
+                  onBlur,
+                  onFocus,
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+                      SelectPrimitive.Value,
                       {
-                        d: "M2 3.5L5 6.5L8 3.5",
-                        stroke: "currentColor",
-                        strokeWidth: "1.5",
-                        strokeLinecap: "round",
-                        strokeLinejoin: "round"
+                        className: "uziSelectValue",
+                        placeholder
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+                      SelectPrimitive.Icon,
+                      {
+                        className: "uziSelectChevron",
+                        "aria-hidden": "true",
+                        children: /* @__PURE__ */ (0, import_jsx_runtime12.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_runtime12.jsx)(
+                              "path",
+                              {
+                                d: "M2 3.5L5 6.5L8 3.5",
+                                stroke: "currentColor",
+                                strokeWidth: "1.5",
+                                strokeLinecap: "round",
+                                strokeLinejoin: "round"
+                              }
+                            )
+                          }
+                        )
                       }
                     )
-                  }
-                ) })
-              ]
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SelectPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-            SelectPrimitive.Content,
-            {
-              className: "content",
-              position: "popper",
-              sideOffset: 4,
-              align: "start",
-              children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(SelectPrimitive.Viewport, { className: "viewport", children: [
-                placeholder && allowEmptyOption ? /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
-                  SelectPrimitive.Item,
-                  {
-                    value: EMPTY_OPTION_VALUE,
-                    className: "item",
-                    children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "indicator", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-                        "svg",
-                        {
-                          viewBox: "0 0 16 16",
-                          width: "16",
-                          height: "16",
-                          "aria-hidden": "true",
-                          className: "indicatorIcon",
-                          children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-                            "path",
+                  ]
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SelectPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+                SelectPrimitive.Content,
+                {
+                  className: "uziSelectContent",
+                  position: "popper",
+                  sideOffset: 4,
+                  align: "start",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(SelectPrimitive.Viewport, { className: "uziSelectViewport", children: [
+                    placeholder && allowEmptyOption ? /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+                      SelectPrimitive.Item,
+                      {
+                        value: EMPTY_OPTION_VALUE,
+                        className: "uziSelectItem",
+                        children: [
+                          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "uziSelectIndicator", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+                            "svg",
                             {
-                              d: "M3.5 8.5 6.5 11.5 12.5 4.5",
-                              fill: "none",
-                              stroke: "currentColor",
-                              strokeWidth: "1.8",
-                              strokeLinecap: "round",
-                              strokeLinejoin: "round"
+                              viewBox: "0 0 16 16",
+                              width: "16",
+                              height: "16",
+                              "aria-hidden": "true",
+                              className: "uziSelectIndicatorIcon",
+                              children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+                                "path",
+                                {
+                                  d: "M3.5 8.5 6.5 11.5 12.5 4.5",
+                                  fill: "none",
+                                  stroke: "currentColor",
+                                  strokeWidth: "1.8",
+                                  strokeLinecap: "round",
+                                  strokeLinejoin: "round"
+                                }
+                              )
                             }
-                          )
-                        }
-                      ) }) }),
-                      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SelectPrimitive.ItemText, { children: placeholder })
-                    ]
-                  }
-                ) : null,
-                options.map((opt) => /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
-                  SelectPrimitive.Item,
-                  {
-                    value: opt.value,
-                    disabled: opt.disabled,
-                    className: "item",
-                    children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "indicator", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-                        "svg",
-                        {
-                          viewBox: "0 0 16 16",
-                          width: "16",
-                          height: "16",
-                          "aria-hidden": "true",
-                          className: "indicatorIcon",
-                          children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-                            "path",
+                          ) }) }),
+                          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SelectPrimitive.ItemText, { children: placeholder })
+                        ]
+                      }
+                    ) : null,
+                    options.map((opt) => /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+                      SelectPrimitive.Item,
+                      {
+                        value: opt.value,
+                        disabled: opt.disabled,
+                        className: "uziSelectItem",
+                        children: [
+                          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "uziSelectIndicator", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+                            "svg",
                             {
-                              d: "M3.5 8.5 6.5 11.5 12.5 4.5",
-                              fill: "none",
-                              stroke: "currentColor",
-                              strokeWidth: "1.8",
-                              strokeLinecap: "round",
-                              strokeLinejoin: "round"
+                              viewBox: "0 0 16 16",
+                              width: "16",
+                              height: "16",
+                              "aria-hidden": "true",
+                              className: "uziSelectIndicatorIcon",
+                              children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+                                "path",
+                                {
+                                  d: "M3.5 8.5 6.5 11.5 12.5 4.5",
+                                  fill: "none",
+                                  stroke: "currentColor",
+                                  strokeWidth: "1.8",
+                                  strokeLinecap: "round",
+                                  strokeLinejoin: "round"
+                                }
+                              )
                             }
-                          )
-                        }
-                      ) }) }),
-                      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SelectPrimitive.ItemText, { children: opt.label })
-                    ]
-                  },
-                  opt.value
-                ))
-              ] })
-            }
-          ) })
-        ]
+                          ) }) }),
+                          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SelectPrimitive.ItemText, { children: opt.label })
+                        ]
+                      },
+                      opt.value
+                    ))
+                  ] })
+                }
+              ) })
+            ]
+          }
+        )
       }
-    ) });
+    );
   }
 );
 Select.displayName = "Select";
@@ -992,7 +1059,7 @@ function DropdownMenuContent({
     DropdownMenuPrimitive2.Content,
     {
       sideOffset,
-      className: cx("content", className),
+      className: cx("uziDropdownMenuContent", className),
       ...props
     }
   ) });
@@ -1008,8 +1075,8 @@ function DropdownMenuItem({
     {
       "data-inset": inset ? "true" : void 0,
       className: cx(
-        "item",
-        variant === "destructive" && "destructive",
+        "uziDropdownMenuItem",
+        variant === "destructive" && "uziDropdownMenuItemDestructive",
         className
       ),
       ...props
@@ -1024,17 +1091,21 @@ function DropdownMenuCheckboxItem({
   return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
     DropdownMenuPrimitive2.CheckboxItem,
     {
-      className: cx("item", "insetItem", className),
+      className: cx(
+        "uziDropdownMenuItem",
+        "uziDropdownMenuInsetItem",
+        className
+      ),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "indicator", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DropdownMenuPrimitive2.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "uziDropdownMenuIndicator", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DropdownMenuPrimitive2.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
           "svg",
           {
             viewBox: "0 0 16 16",
             width: "16",
             height: "16",
             "aria-hidden": "true",
-            className: "indicatorIcon",
+            className: "uziDropdownMenuIndicatorIcon",
             children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
               "path",
               {
@@ -1061,10 +1132,14 @@ function DropdownMenuRadioItem({
   return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
     DropdownMenuPrimitive2.RadioItem,
     {
-      className: cx("item", "insetItem", className),
+      className: cx(
+        "uziDropdownMenuItem",
+        "uziDropdownMenuInsetItem",
+        className
+      ),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "indicator", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DropdownMenuPrimitive2.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "radioDot" }) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "uziDropdownMenuIndicator", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(DropdownMenuPrimitive2.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "uziDropdownMenuRadioDot" }) }) }),
         children
       ]
     }
@@ -1079,7 +1154,7 @@ function DropdownMenuLabel({
     DropdownMenuPrimitive2.Label,
     {
       "data-inset": inset ? "true" : void 0,
-      className: cx("label", className),
+      className: cx("uziDropdownMenuLabel", className),
       ...props
     }
   );
@@ -1091,7 +1166,7 @@ function DropdownMenuSeparator({
   return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
     DropdownMenuPrimitive2.Separator,
     {
-      className: cx("separator", className),
+      className: cx("uziDropdownMenuSeparator", className),
       ...props
     }
   );
@@ -1106,7 +1181,7 @@ function DropdownMenuSubTrigger({
     DropdownMenuPrimitive2.SubTrigger,
     {
       "data-inset": inset ? "true" : void 0,
-      className: cx("item", className),
+      className: cx("uziDropdownMenuItem", className),
       ...props,
       children: [
         children,
@@ -1117,7 +1192,7 @@ function DropdownMenuSubTrigger({
             width: "16",
             height: "16",
             "aria-hidden": "true",
-            className: "chevron",
+            className: "uziDropdownMenuChevron",
             children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
               "path",
               {
@@ -1142,7 +1217,7 @@ function DropdownMenuSubContent({
   return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
     DropdownMenuPrimitive2.SubContent,
     {
-      className: cx("content", className),
+      className: cx("uziDropdownMenuContent", className),
       ...props
     }
   );
@@ -1264,6 +1339,9 @@ 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_runtime16 = require("react/jsx-runtime");
 function MoonIcon() {
@@ -1308,7 +1386,7 @@ function ThemeToggleButton({
       type: "button",
       variant: "ghost",
       size: showLabel ? "sm" : "icon",
-      className: cx(showLabel && "withLabel", className),
+      className: cx(showLabel && theme_toggle_button_default.withLabel, className),
       "aria-label": `Switch to ${nextThemeLabel.toLowerCase()}`,
       title: `Switch to ${nextThemeLabel.toLowerCase()}`,
       onClick: (event) => {
@@ -1469,7 +1547,11 @@ function AppShell({
     sidebarOpen ? "appShellOpen" : "appShellCollapsed",
     className
   );
-  const sidebarClasses = cx("appShellSidebar", sidebarOpen && "appShellSidebarOpen", sidebarClassName);
+  const sidebarClasses = cx(
+    "appShellSidebar",
+    sidebarOpen && "appShellSidebarOpen",
+    sidebarClassName
+  );
   return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
     "div",
     {
@@ -1505,7 +1587,15 @@ function AppShell({
             themeToggleProps
           }
         ),
-        !isDesktop && sidebarOpen && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "appShellBackdrop", onClick: () => setSidebarOpen(false), onTouchStart: () => setSidebarOpen(false), "aria-hidden": "true" }),
+        !isDesktop && sidebarOpen && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+          "div",
+          {
+            className: "appShellBackdrop",
+            onClick: () => setSidebarOpen(false),
+            onTouchStart: () => setSidebarOpen(false),
+            "aria-hidden": "true"
+          }
+        ),
         /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("aside", { ref: sidebarRef, id: sidebarId, className: sidebarClasses, "aria-label": "Sidebar navigation", children: sidebar }),
         /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("main", { ref: mainRef, className: cx("appShellMain", mainClassName), children })
       ]
@@ -1544,18 +1634,22 @@ function SidebarNav({
   return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
     "nav",
     {
-      className: cx("uziSidebarNav", collapsed && "uziSidebarNavCollapsed", className),
+      className: cx(
+        "sidebarNav",
+        collapsed && "sidebarNavCollapsed",
+        className
+      ),
       "aria-label": ariaLabel,
       style,
       children: [
-        header ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "uziSidebarNavHeader", children: header }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "uziSidebarNavSections", children: resolvedSections.map((section, sectionIndex) => /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
+        header ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "header", children: header }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "sections", children: resolvedSections.map((section, sectionIndex) => /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
           "div",
           {
-            className: cx("uziSidebarNavSection", sectionClassName),
+            className: cx("section", sectionClassName),
             children: [
-              section.label && !collapsed ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "uziSidebarNavSectionLabel", children: section.label }) : null,
-              /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "uziSidebarNavSectionItems", children: section.items.map((item, itemIndex) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+              section.label && !collapsed ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "sectionLabel", children: section.label }) : null,
+              /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "sectionItems", children: section.items.map((item, itemIndex) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
                 SidebarNavEntry,
                 {
                   item,
@@ -1570,7 +1664,7 @@ function SidebarNav({
           },
           section.id ?? `section-${sectionIndex}`
         )) }),
-        footer ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "uziSidebarNavFooter", children: footer }) : null
+        footer ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "footer", children: footer }) : null
       ]
     }
   );
@@ -1585,20 +1679,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(
-    "uziSidebarNavItem",
-    active && "uziSidebarNavItemActive",
-    collapsed && "uziSidebarNavItemCollapsed",
-    item.disabled && "uziSidebarNavItemDisabled",
+    "item",
+    active && "itemActive",
+    collapsed && "itemCollapsed",
+    item.disabled && "itemDisabled",
     itemClassName
   );
   const content = /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
-    item.icon && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "uziSidebarNavIcon", children: item.icon }),
-    !collapsed ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("span", { className: "uziSidebarNavItemBody", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("span", { className: "uziSidebarNavLabelRow", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "uziSidebarNavLabel", children: item.label }),
-        item.badge && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "uziSidebarNavBadge", children: item.badge })
+    item.icon && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "icon", children: item.icon }),
+    !collapsed ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("span", { className: "itemBody", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("span", { className: "labelRow", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "label", children: item.label }),
+        item.badge && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "badge", children: item.badge })
       ] }),
-      item.description ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "uziSidebarNavDescription", children: item.description }) : null
+      item.description ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "description", children: item.description }) : null
     ] }) : null
   ] });
   const handleClick = () => {
@@ -1648,6 +1742,9 @@ function SidebarNavEntry({
   );
 }
 
+// src/components/skeleton/skeleton.module.css
+var skeleton_default = {};
+
 // src/components/skeleton/Skeleton.tsx
 var import_jsx_runtime20 = require("react/jsx-runtime");
 function Skeleton({
@@ -1661,7 +1758,7 @@ function Skeleton({
   return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
     "div",
     {
-      className: cx("skeleton", `radius-${radius}`, className),
+      className: cx(skeleton_default.skeleton, skeleton_default[`radius-${radius}`], className),
       style: { width, height, ...style },
       "aria-hidden": "true",
       ...rest
@@ -1669,6 +1766,9 @@ function Skeleton({
   );
 }
 
+// src/components/progress/progress.module.css
+var progress_default = {};
+
 // src/components/progress/Progress.tsx
 var import_jsx_runtime21 = require("react/jsx-runtime");
 function Progress({
@@ -1682,7 +1782,7 @@ function Progress({
   return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
     "div",
     {
-      className: cx("track", className),
+      className: cx(progress_default.track, className),
       role: "progressbar",
       "aria-valuenow": clamped,
       "aria-valuemin": 0,
@@ -1692,7 +1792,7 @@ function Progress({
       children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
         "div",
         {
-          className: cx("fill", `tone-${tone}`),
+          className: cx(progress_default.fill, progress_default[`tone-${tone}`]),
           style: { width: `${clamped}%` }
         }
       )