@bubo-squared/ui-framework 0.1.3 → 0.1.4

package/dist/index.js

@@ -14,7 +14,7 @@ function cn(...inputs) {
 // src/components/Buttons/Button.tsx
 import { jsx as jsx2, jsxs } from "react/jsx-runtime";
 var buttonVariants = cva(
-  "inline-flex items-center justify-center whitespace-nowrap rounded transition-colors disabled:pointer-events-none overflow-hidden cursor-pointer",
+  "inline-flex items-center justify-center whitespace-nowrap rounded-4 transition-colors disabled:pointer-events-none overflow-hidden cursor-pointer",
   {
     variants: {
       variant: {
@@ -51,10 +51,10 @@ var buttonVariants = cva(
 var buttonIconVariants = cva("relative", {
   variants: {
     size: {
-      sm: ["w-5", "h-5", "*:w-5", "*:h-5"],
-      md: ["w-6", "h-6", "*:w-6", "*:h-6"],
-      lg: ["w-6", "h-6", "*:w-6", "*:h-6"],
-      xl: ["w-8", "h-8", "*:w-8", "*:h-8"]
+      sm: ["size-5", "*:size-5"],
+      md: ["size-6", "*:size-6"],
+      lg: ["size-6", "*:size-6"],
+      xl: ["size-8", "*:size-8"]
     }
   }
 });
@@ -126,7 +126,7 @@ import { Slot as Slot2 } from "@radix-ui/react-slot";
 import { cva as cva3 } from "class-variance-authority";
 import { jsx as jsx4 } from "react/jsx-runtime";
 var iconButtonVariants = cva3(
-  "inline-flex items-center justify-center whitespace-nowrap rounded transition-colors disabled:pointer-events-none overflow-hidden p-1.5 cursor-pointer",
+  "inline-flex items-center justify-center whitespace-nowrap rounded-4 transition-colors disabled:pointer-events-none overflow-hidden p-1.5 cursor-pointer",
   {
     variants: {
       variant: {
@@ -148,10 +148,10 @@ var iconButtonVariants = cva3(
         ]
       },
       size: {
-        sm: ["[&>.buttonIcon>svg]:w-5", "[&>.buttonIcon>svg]:h-5"],
-        md: ["[&>.buttonIcon>svg]:w-6", "[&>.buttonIcon>svg]:h-6"],
-        lg: ["[&>.buttonIcon>svg]:w-8", "[&>.buttonIcon>svg]:h-8"],
-        xl: ["[&>.buttonIcon>svg]:w-9", "[&>.buttonIcon>svg]:h-9"]
+        sm: ["[&>.buttonIcon>svg]:size-5"],
+        md: ["[&>.buttonIcon>svg]:size-6"],
+        lg: ["[&>.buttonIcon>svg]:size-8"],
+        xl: ["[&>.buttonIcon>svg]:size-9"]
       }
     },
     defaultVariants: {
@@ -188,7 +188,7 @@ IconButton.displayName = "IconButton";
 import "react";
 import { cva as cva4 } from "class-variance-authority";
 import { jsx as jsx5 } from "react/jsx-runtime";
-var IconGroupLinesClass = "inline-flex items-center justify-center gap-0 [&>button]:outline-none! [&>button]:rounded-none [&>button:focus]:shadow-none [&>button:focus]:bg-(--border-secondary) [&>button:first-child]:rounded-l [&>button:last-child]:rounded-r";
+var IconGroupLinesClass = "inline-flex items-center justify-center gap-0 [&>button]:outline-none! [&>button]:rounded-none [&>button:focus]:shadow-none [&>button:focus]:bg-(--border-secondary) [&>button:first-child]:rounded-l-4 [&>button:last-child]:rounded-r-4";
 var IconGroupSizeVariants = cva4("", {
   variants: {
     size: {
@@ -226,8 +226,8 @@ var IconButtonGroup = (props) => {
           disabled: item.disabled,
           className: cn(
             "rounded-none border-1 border-(--border-secondary) text-(--text-primary) ",
-            index === 0 && "rounded-l-[6px]",
-            index === items.length - 1 && "rounded-r-[6px]",
+            index === 0 && "rounded-l-6",
+            index === items.length - 1 && "rounded-r-6",
             index > 0 && "-ml-px"
           ),
           onClick: item.onClick
@@ -245,7 +245,7 @@ import { Slot as Slot3 } from "@radix-ui/react-slot";
 import { cva as cva5 } from "class-variance-authority";
 import { jsx as jsx6, jsxs as jsxs2 } from "react/jsx-runtime";
 var linkButtonVariants = cva5(
-  "inline-flex items-center justify-center whitespace-nowrap rounded transition-colors disabled:pointer-events-none overflow-hidden gap-2 cursor-pointer",
+  "inline-flex items-center justify-center whitespace-nowrap rounded-4 transition-colors disabled:pointer-events-none overflow-hidden gap-2 cursor-pointer",
   {
     variants: {
       variant: {
@@ -269,10 +269,10 @@ var linkButtonVariants = cva5(
 var linkButtonIconVariants = cva5("relative", {
   variants: {
     size: {
-      sm: ["w-5", "h-5", "*:w-5", "*:h-5"],
-      md: ["w-5", "h-5", "*:w-5", "*:h-5"],
-      lg: ["w-6", "h-6", "*:w-6", "*:h-6"],
-      xl: ["w-6", "h-6", "*:w-6", "*:h-6"]
+      sm: ["size-5", "*:size-5"],
+      md: ["size-5", "*:size-5"],
+      lg: ["size-6", "*:size-6"],
+      xl: ["size-6", "*:size-6"]
     }
   }
 });
@@ -354,9 +354,9 @@ var MessageButton = (props) => {
       type: "button",
       ...buttonProps,
       onClick: handleClick,
-      className: `inline-flex items-center justify-center rounded px-1.5 py-1 gap-1 text-sm transition-colors cursor-pointer ${statusClasses} ${className}`,
+      className: `inline-flex items-center justify-center rounded-4 px-1.5 py-1 gap-1 text-sm transition-colors cursor-pointer ${statusClasses} ${className}`,
       children: [
-        props.icon && /* @__PURE__ */ jsx7("div", { className: "w-5 *:w-5 h-5 *:h-5 relative", children: props.icon }),
+        props.icon && /* @__PURE__ */ jsx7("div", { className: "size-5 *:size-5 relative", children: props.icon }),
         /* @__PURE__ */ jsx7("div", { className: "text-center text-xl font-normal leading-7", children: label })
       ]
     }
@@ -413,13 +413,13 @@ var avatarIconVariants = cva6(
   {
     variants: {
       size: {
-        "20": "w-3 h-3 [&>svg]:w-3 [&>svg]:h-3",
-        "24": "w-3.5 h-3.5 [&>svg]:w-3.5 [&>svg]:h-3.5",
-        "32": "w-4 h-4 [&>svg]:w-4 [&>svg]:h-4",
-        "40": "w-5 h-5 [&>svg]:w-5 [&>svg]:h-5",
-        "48": "w-6 h-6 [&>svg]:w-6 [&>svg]:h-6",
-        "56": "w-7 h-7 [&>svg]:w-7 [&>svg]:h-7",
-        "64": "w-8 h-8 [&>svg]:w-8 [&>svg]:h-8"
+        "20": "size-3 [&>svg]:size-3",
+        "24": "size-3.5 [&>svg]:size-3.5",
+        "32": "size-4 [&>svg]:size-4",
+        "40": "size-5 [&>svg]:size-5",
+        "48": "size-6 [&>svg]:size-6",
+        "56": "size-7 [&>svg]:size-7",
+        "64": "size-8 [&>svg]:size-8"
       }
     },
     defaultVariants: {
@@ -471,7 +471,7 @@ import { Slot as Slot5 } from "@radix-ui/react-slot";
 import { cva as cva7 } from "class-variance-authority";
 import { Fragment, jsx as jsx9, jsxs as jsxs5 } from "react/jsx-runtime";
 var badgeVariants = cva7(
-  "inline-flex items-center justify-center rounded-[4px] leading-none whitespace-nowrap gap-1 px-1 py-0",
+  "inline-flex items-center justify-center rounded-4 leading-none whitespace-nowrap gap-1 px-1 py-0",
   {
     variants: {
       size: {
@@ -538,8 +538,8 @@ var badgeDigitVariants = cva8(
   {
     variants: {
       size: {
-        sm: "px-[6px] rounded-[2px] caption-medium",
-        md: "px-2 py-[2px] rounded-[4px] paragraph-s-medium"
+        sm: "px-[6px] rounded-2 caption-medium",
+        md: "px-2 py-[2px] rounded-4 paragraph-s-medium"
       },
       variant: {
         primary: "bg-(--background-brand)",
@@ -584,7 +584,7 @@ BadgeDigit.displayName = "BadgeDigit";
 import "react";
 import { cva as cva9 } from "class-variance-authority";
 import { jsx as jsx11 } from "react/jsx-runtime";
-var badgeDotVariants = cva9("rounded-xl w-3 h-3", {
+var badgeDotVariants = cva9("rounded-12 size-3", {
   variants: {
     status: {
       disabled: "bg-(--text-primary)",
@@ -628,7 +628,7 @@ var BadgeStatus = React10.forwardRef(
             "span",
             {
               className: cn(
-                "shrink-0 w-3 h-3 rounded-full",
+                "shrink-0 size-3 rounded-full",
                 dotClasses,
                 dotClassName
               )
@@ -707,9 +707,9 @@ Divider.displayName = "Divider";
 import * as React12 from "react";
 import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
 var sizeToBarClasses = {
-  lg: "h-4 rounded-[16px]",
-  md: "h-2 rounded-[8px]",
-  sm: "h-1 rounded-[4px]"
+  lg: "h-4 rounded-16",
+  md: "h-2 rounded-8",
+  sm: "h-1 rounded-4"
 };
 var Progress = React12.forwardRef(
   (props, ref) => {
@@ -747,7 +747,7 @@ var Progress = React12.forwardRef(
             {
               className: cn(
                 "bg-(--chart-brand) h-full",
-                size === "lg" ? "rounded-4" : size === "md" ? "rounded-2" : "rounded-1"
+                size === "lg" ? "rounded-4" : size === "md" ? "rounded-2" : "rounded-[1px]"
               ),
               style: { width: `${clamped}%` }
             }
@@ -772,7 +772,7 @@ import {
 } from "@bubo-squared/icons";
 import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
 var iconStatusVariants = cva10(
-  "inline-flex h-5 w-5 items-center justify-center rounded-full border-1 border-(--text-primary-inverse) p-1",
+  "inline-flex size-5 items-center justify-center rounded-full border-1 border-(--text-primary-inverse) p-1",
   {
     variants: {
       variant: {
@@ -808,7 +808,7 @@ var StatusAvatar = React13.forwardRef((props, ref) => {
           className
         ),
         ...rest,
-        children: /* @__PURE__ */ jsx15("div", { className: cn(dotClasses, "h-3.5 w-3.5 rounded-full") })
+        children: /* @__PURE__ */ jsx15("div", { className: cn(dotClasses, "size-3.5 rounded-full") })
       }
     );
   }
@@ -820,11 +820,11 @@ var StatusAvatar = React13.forwardRef((props, ref) => {
       className: cn(iconStatusVariants({ variant: iconVariant }), className),
       ...rest,
       children: [
-        iconVariant === "verified" && /* @__PURE__ */ jsx15(CheckIcon, { className: "h-3 w-3 text-(--text-button-white)" }),
-        iconVariant === "bookmark" && /* @__PURE__ */ jsx15(BookmarkCheckIcon, { className: "h-3 w-3 text-(--text-button-white)" }),
-        iconVariant === "favorite" && /* @__PURE__ */ jsx15(StarIcon, { className: "h-3 w-3 text-(--text-button-white)" }),
-        iconVariant === "add" && /* @__PURE__ */ jsx15(PlusIcon, { className: "h-3 w-3 text-(--text-button-white)" }),
-        iconVariant === "remove" && /* @__PURE__ */ jsx15(CrossIcon, { className: "h-3 w-3 text-(--text-button-white)" })
+        iconVariant === "verified" && /* @__PURE__ */ jsx15(CheckIcon, { className: "size-3 text-(--text-button-white)" }),
+        iconVariant === "bookmark" && /* @__PURE__ */ jsx15(BookmarkCheckIcon, { className: "size-3 text-(--text-button-white)" }),
+        iconVariant === "favorite" && /* @__PURE__ */ jsx15(StarIcon, { className: "size-3 text-(--text-button-white)" }),
+        iconVariant === "add" && /* @__PURE__ */ jsx15(PlusIcon, { className: "size-3 text-(--text-button-white)" }),
+        iconVariant === "remove" && /* @__PURE__ */ jsx15(CrossIcon, { className: "size-3 text-(--text-button-white)" })
       ]
     }
   );
@@ -837,7 +837,7 @@ import { Slot as Slot6 } from "@radix-ui/react-slot";
 import { cva as cva11 } from "class-variance-authority";
 import { jsx as jsx16, jsxs as jsxs10 } from "react/jsx-runtime";
 var tagVariants = cva11(
-  "inline-flex flex-row items-center justify-center rounded-[6px] gap-2 px-3 overflow-hidden border-1 border-(--border-secondary) bg-(--background-neutral) hover:border-(--border-secondary-hover) focus:border-(--border-brand) focus-ring-primary ",
+  "inline-flex flex-row items-center justify-center rounded-6 gap-2 px-3 overflow-hidden border-1 border-(--border-secondary) bg-(--background-neutral) hover:border-(--border-secondary-hover) focus:border-(--border-brand) focus-ring-primary ",
   {
     variants: {
       size: {
@@ -898,7 +898,7 @@ function Checkbox({ label, className, ...props }) {
       CheckboxPrimitive.Root,
       {
         className: cn(
-          "group flex h-5 w-5 items-center justify-center rounded-xs border border-(--border-secondary) bg-(--background-neutral) text-(--text-primary)",
+          "group flex h-5 w-5 items-center justify-center rounded-2 border border-(--border-secondary) bg-(--background-neutral) text-(--text-primary)",
           "data-[state=checked]:bg-(--background-brand) data-[state=checked]:text-(--text-button-white) data-[state=checked]:border-none",
           "data-[state=indeterminate]:bg-(--background-brand) data-[state=indeterminate]:text-(--text-button-white) data-[state=indeterminate]:border-none",
           "data-[state=checked]:hover:bg-(--background-brand-hover) data-[state=indeterminate]:hover:bg-(--background-brand-hover)",
@@ -927,7 +927,7 @@ import { ChevronDownIcon } from "@bubo-squared/icons";
 import { jsx as jsx18, jsxs as jsxs12 } from "react/jsx-runtime";
 var dropdownWrapperBase = "flex flex-col gap-2 items-start min-w-[343px]";
 var dropdownTriggerVariants = cva12(
-  "group flex w-full items-center justify-between rounded border bg-(--background-primary) px-3 py-2 text-left transition-colors cursor-pointer focus-ring-primary focus:border-(--border-brand) hover:bg-(--background-primary-hover) disabled:bg-(--background-primary) disabled:border-(--border-secondary-disabled) disabled:text-(--text-primary-disabled) disabled:cursor-default",
+  "group flex w-full items-center justify-between rounded-4 border bg-(--background-primary) px-3 py-2 text-left transition-colors cursor-pointer focus-ring-primary focus:border-(--border-brand) hover:bg-(--background-primary-hover) disabled:bg-(--background-primary) disabled:border-(--border-secondary-disabled) disabled:text-(--text-primary-disabled) disabled:cursor-default",
   {
     variants: {
       size: {
@@ -1099,7 +1099,7 @@ var Dropdown = (props) => {
           ]
         }
       ),
-      isOpen && options.length > 0 && /* @__PURE__ */ jsx18("div", { className: "absolute z-10 mt-1 w-full min-w-343 rounded-(--border-radius-4) border border-(--border-primary-hover) bg-(--background-neutral) shadow-card-md flex overflow-y-scroll dropdown-scrollbar max-h-[316px]", children: /* @__PURE__ */ jsx18("ul", { role: "listbox", className: "flex flex-1 flex-col", children: options.map((opt) => {
+      isOpen && options.length > 0 && /* @__PURE__ */ jsx18("div", { className: "absolute z-10 mt-1 w-full min-w-343 rounded-4 border border-(--border-primary-hover) bg-(--background-neutral) shadow-card-md flex overflow-y-scroll dropdown-scrollbar max-h-[316px]", children: /* @__PURE__ */ jsx18("ul", { role: "listbox", className: "flex flex-1 flex-col", children: options.map((opt) => {
         const selected = opt.value === currentValue;
         return /* @__PURE__ */ jsx18(
           "li",
@@ -1218,7 +1218,7 @@ import * as React19 from "react";
 import { cva as cva13 } from "class-variance-authority";
 import { jsx as jsx21 } from "react/jsx-runtime";
 var inputShellVariants = cva13(
-  "group flex w-full items-center rounded border bg-(--background-primary) text-left cursor-text border-(--border-secondary)",
+  "group flex w-full items-center rounded-4 border bg-(--background-primary) text-left cursor-text border-(--border-secondary)",
   {
     variants: {
       size: {
@@ -1281,8 +1281,8 @@ var iconWrapperVariants = cva14(
   {
     variants: {
       size: {
-        large: "w-5 h-5 [&>svg]:w-5 [&>svg]:h-5",
-        "extra-large": "w-6 h-6 [&>svg]:w-6 [&>svg]:h-6"
+        large: "size-5 [&>svg]:size-5",
+        "extra-large": "size-6 [&>svg]:size-6"
       },
       disabled: {
         true: "text-(--icon-primary-disabled)"
@@ -1578,8 +1578,8 @@ var searchTextVariants = cva15("truncate", {
 var iconWrapperVariants2 = cva15("flex items-center justify-center shrink-0 text-(--icon-primary)", {
   variants: {
     size: {
-      large: "w-5 h-5 [&>svg]:w-5 [&>svg]:h-5",
-      "extra-large": "w-6 h-6 [&>svg]:w-6 [&>svg]:h-6"
+      large: "size-5 [&>svg]:size-5",
+      "extra-large": "size-6 [&>svg]:size-6"
     },
     disabled: {
       true: "text-(--icon-primary-disabled)"
@@ -1891,7 +1891,7 @@ var Slider = (props) => {
         "div",
         {
           className: cn(
-            "relative rounded-(--border-radius-4) shadow-card-md px-(--space-8) py-(--space-4)",
+            "relative rounded-4 shadow-card-md px-(--space-8) py-(--space-4)",
             disabled ? "bg-(--background-primary-disabled)" : "bg-(--background-neutral)"
           ),
           style: { marginBottom: 0 },
@@ -1938,7 +1938,7 @@ var Slider = (props) => {
         tabIndex: disabled ? -1 : 0,
         className: cn(
           "absolute -translate-x-1/2 flex items-center justify-center",
-          "h-8 w-[18px] rounded-(--border-radius-4)",
+          "h-8 w-[18px] rounded-4",
           disabled ? "bg-(--icon-primary-disabled) cursor-default" : "bg-(--icon-primary-hover) outline-none focus-visible:shadow-[0_0_0_var(--focus-ring-spread)_var(--focus-primary)] cursor-pointer"
         ),
         style: {
@@ -1964,7 +1964,7 @@ var Slider = (props) => {
         "div",
         {
           className: cn(
-            "relative w-full flex items-center rounded-(--border-radius-4)",
+            "relative w-full flex items-center rounded-4",
             disabled ? "bg-(--background-primary-disabled) cursor-default" : "bg-(--background-secondary) cursor-pointer"
           ),
           style: { height: `${trackHeight}px` },
@@ -1975,13 +1975,12 @@ var Slider = (props) => {
               "div",
               {
                 className: cn(
-                  "absolute h-full",
+                  "absolute h-full rounded-4",
                   disabled ? "bg-(--background-primary-disabled)" : "bg-(--background-secondary)"
                 ),
                 style: {
                   width: `calc(100% + ${thumbWidth}px)`,
-                  left: `-${thumbRadius}px`,
-                  borderRadius: "var(--border-radius-4)"
+                  left: `-${thumbRadius}px`
                 }
               }
             ),
@@ -2108,7 +2107,7 @@ var TextArea = (props) => {
       "div",
       {
         className: cn(
-          "relative flex w-full rounded border bg-(--background-primary) cursor-text transition-colors",
+          "relative flex w-full rounded-4 border bg-(--background-primary) cursor-text transition-colors",
           "border-(--border-secondary) hover:border-(--border-secondary-hover) hover:bg-(--background-primary-hover)",
           disabled && "bg-(--background-primary-disabled) border-(--border-secondary-disabled) cursor-default",
           statusBorderClass[status],
@@ -2212,8 +2211,8 @@ var iconWrapperVariants3 = cva16(
   {
     variants: {
       size: {
-        large: "w-5 h-5 [&>svg]:w-5 [&>svg]:h-5",
-        "extra-large": "w-6 h-6 [&>svg]:w-6 [&>svg]:h-6"
+        large: "size-5 [&>svg]:size-5",
+        "extra-large": "size-6 [&>svg]:size-6"
       },
       disabled: {
         true: "text-(--icon-primary-disabled)"
@@ -2347,7 +2346,7 @@ var Toggle = (props) => {
             {
               className: cn(
                 // Base track
-                "flex items-center w-9 h-5 rounded-3xl border bg-(--background-primary) p-(--space-2) transition-all",
+                "flex items-center w-9 h-5 rounded-24 border bg-(--background-primary) p-(--space-2) transition-all",
                 // Knob position
                 "justify-start peer-checked:justify-end",
                 // 1: enabled, unchecked, unhovered, unfocused
@@ -2475,7 +2474,7 @@ WebsiteInput.displayName = "WebsiteInput";
 import { LogoIconLIcon } from "@bubo-squared/icons";
 import { jsx as jsx30 } from "react/jsx-runtime";
 var LogoIconExtraLarge = () => {
-  return /* @__PURE__ */ jsx30("div", { className: "w-lg h-[512px] relative bg-linear-to-t from-gray-800 to-gray-950 rounded-[80px] overflow-hidden flex justify-center items-center", children: /* @__PURE__ */ jsx30(LogoIconLIcon, { className: "w-96 h-96" }) });
+  return /* @__PURE__ */ jsx30("div", { className: "w-lg h-[512px] relative bg-linear-to-t from-gray-800 to-gray-950 rounded-80 overflow-hidden flex justify-center items-center", children: /* @__PURE__ */ jsx30(LogoIconLIcon, { className: "size-96" }) });
 };
 var LogoIconExtraLarge_default = LogoIconExtraLarge;
 
@@ -2483,7 +2482,7 @@ var LogoIconExtraLarge_default = LogoIconExtraLarge;
 import { LogoIconMIcon } from "@bubo-squared/icons";
 import { jsx as jsx31 } from "react/jsx-runtime";
 var LogoIconExtraSmall = () => {
-  return /* @__PURE__ */ jsx31("div", { className: "w-8 h-8 relative bg-linear-to-t from-gray-800 to-gray-950 rounded-[5px] overflow-hidden flex justify-center items-center", children: /* @__PURE__ */ jsx31(LogoIconMIcon, { className: "w-6 h-6" }) });
+  return /* @__PURE__ */ jsx31("div", { className: "size-8 relative bg-linear-to-t from-gray-800 to-gray-950 rounded-[5px] overflow-hidden flex justify-center items-center", children: /* @__PURE__ */ jsx31(LogoIconMIcon, { className: "size-6" }) });
 };
 var LogoIconExtraSmall_default = LogoIconExtraSmall;
 
@@ -2491,7 +2490,7 @@ var LogoIconExtraSmall_default = LogoIconExtraSmall;
 import { LogoIconMIcon as LogoIconMIcon2 } from "@bubo-squared/icons";
 import { jsx as jsx32 } from "react/jsx-runtime";
 var LogoIconLarge = () => {
-  return /* @__PURE__ */ jsx32("div", { className: "w-64 h-64 relative bg-linear-to-t from-gray-800 to-gray-950 rounded-[40px] overflow-hidden flex justify-center items-center", children: /* @__PURE__ */ jsx32(LogoIconMIcon2, { className: "w-44 h-44" }) });
+  return /* @__PURE__ */ jsx32("div", { className: "size-64 relative bg-linear-to-t from-gray-800 to-gray-950 rounded-40 overflow-hidden flex justify-center items-center", children: /* @__PURE__ */ jsx32(LogoIconMIcon2, { className: "size-44" }) });
 };
 var LogoIconLarge_default = LogoIconLarge;
 
@@ -2499,7 +2498,7 @@ var LogoIconLarge_default = LogoIconLarge;
 import { LogoIconMIcon as LogoIconMIcon3 } from "@bubo-squared/icons";
 import { jsx as jsx33 } from "react/jsx-runtime";
 var LogoIconMedium = () => {
-  return /* @__PURE__ */ jsx33("div", { className: "w-32 h-32 relative bg-linear-to-t from-gray-800 to-gray-950 rounded-[20px] overflow-hidden flex justify-center items-center", children: /* @__PURE__ */ jsx33(LogoIconMIcon3, { className: "w-24 h-24" }) });
+  return /* @__PURE__ */ jsx33("div", { className: "size-32 relative bg-linear-to-t from-gray-800 to-gray-950 rounded-20 overflow-hidden flex justify-center items-center", children: /* @__PURE__ */ jsx33(LogoIconMIcon3, { className: "size-24" }) });
 };
 var LogoIconMedium_default = LogoIconMedium;
 
@@ -2507,7 +2506,7 @@ var LogoIconMedium_default = LogoIconMedium;
 import { LogoIconMIcon as LogoIconMIcon4 } from "@bubo-squared/icons";
 import { jsx as jsx34 } from "react/jsx-runtime";
 var LogoIconSmall = () => {
-  return /* @__PURE__ */ jsx34("div", { className: "w-14 h-14 relative bg-linear-to-t from-gray-800 to-gray-950 rounded-lg overflow-hidden flex justify-center items-center", children: /* @__PURE__ */ jsx34(LogoIconMIcon4, { className: "w-10 h-10" }) });
+  return /* @__PURE__ */ jsx34("div", { className: "size-14 relative bg-linear-to-t from-gray-800 to-gray-950 rounded-8 overflow-hidden flex justify-center items-center", children: /* @__PURE__ */ jsx34(LogoIconMIcon4, { className: "size-10" }) });
 };
 var LogoIconSmall_default = LogoIconSmall;
 
@@ -2516,7 +2515,7 @@ import { LogoIconMIcon as LogoIconMIcon5, LogoTextMIcon } from "@bubo-squared/ic
 import { jsx as jsx35, jsxs as jsxs22 } from "react/jsx-runtime";
 var LogoInline = () => {
   return /* @__PURE__ */ jsxs22("div", { className: "w-44 h-12 inline-flex justify-start items-center gap-4", children: [
-    /* @__PURE__ */ jsx35(LogoIconMIcon5, { className: "w-12 h-12" }),
+    /* @__PURE__ */ jsx35(LogoIconMIcon5, { className: "size-12" }),
     /* @__PURE__ */ jsx35(LogoTextMIcon, { className: "h-8 w-[110px] text-(--text-primary)" })
   ] });
 };
@@ -2527,7 +2526,7 @@ import { LogoIconMIcon as LogoIconMIcon6, LogoTextMIcon as LogoTextMIcon2 } from
 import { jsx as jsx36, jsxs as jsxs23 } from "react/jsx-runtime";
 var LogoInline2 = () => {
   return /* @__PURE__ */ jsxs23("div", { className: "w-32 h-9 inline-flex justify-start items-center gap-3", children: [
-    /* @__PURE__ */ jsx36(LogoIconMIcon6, { className: "w-9 h-9" }),
+    /* @__PURE__ */ jsx36(LogoIconMIcon6, { className: "size-9" }),
     /* @__PURE__ */ jsx36(LogoTextMIcon2, { className: "h-6 w-[83px] text-(--text-primary)" })
   ] });
 };
@@ -2538,7 +2537,7 @@ import { LogoIconMIcon as LogoIconMIcon7, LogoTextMIcon as LogoTextMIcon3 } from
 import { jsx as jsx37, jsxs as jsxs24 } from "react/jsx-runtime";
 var LogoMultiline = () => {
   return /* @__PURE__ */ jsxs24("div", { className: "w-36 inline-flex flex-col justify-start items-start gap-2", children: [
-    /* @__PURE__ */ jsx37(LogoIconMIcon7, { className: "w-12 h-12" }),
+    /* @__PURE__ */ jsx37(LogoIconMIcon7, { className: "size-12" }),
     /* @__PURE__ */ jsx37(LogoTextMIcon3, { className: "h-8 w-[111px] text-(--text-primary)" })
   ] });
 };