@brumaombra/ui-vintage 0.6.2 → 0.6.4

package/dist/select.js

@@ -1797,14 +1797,14 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
     position: { default: "popper" },
     bodyLock: { type: Boolean },
     side: {},
-    sideOffset: {},
+    sideOffset: { default: 4 },
     sideFlip: { type: Boolean },
-    align: {},
+    align: { default: "start" },
     alignOffset: {},
     alignFlip: { type: Boolean },
     avoidCollisions: { type: Boolean },
     collisionBoundary: {},
-    collisionPadding: {},
+    collisionPadding: { default: 8 },
     arrowPadding: {},
     hideShiftedArrow: { type: Boolean },
     sticky: {},
@@ -1830,7 +1830,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
         default: withCtx(() => [
           createVNode(unref(SelectContent_default), mergeProps({ "data-slot": "select-content" }, { ..._ctx.$attrs, ...unref(forwarded) }, {
             class: unref(cn)(
-              "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--reka-select-content-available-height) min-w-[8rem] overflow-x-hidden overflow-y-auto rounded border border-border transition-colors duration-300 ease-in-out",
+              "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--reka-select-content-available-height) min-w-[8rem] overflow-x-hidden overflow-y-auto rounded border border-border transition-colors duration-300 ease-in-out sm:max-w-[30rem] max-sm:w-[calc(100vw-1rem)] max-sm:max-w-[calc(100vw-1rem)] max-sm:min-w-0",
               _ctx.position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
               props.class
             )
@@ -1933,7 +1933,7 @@ const _sfc_main$9 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1$1 = { class: "flex min-w-0 flex-1 flex-col" };
+const _hoisted_1$1 = { class: "flex min-w-0 flex-1 flex-col gap-0.5" };
 const _sfc_main$8 = /* @__PURE__ */ defineComponent({
   __name: "SelectItemContent",
   props: {
@@ -1950,27 +1950,27 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
         "data-slot": "select-item-content",
-        class: normalizeClass(unref(cn)("flex min-w-0 flex-1 items-start gap-2", props.class))
+        class: normalizeClass(unref(cn)("flex min-w-0 flex-1 items-center gap-2", props.class))
       }, [
         props.icon ? (openBlock(), createElementBlock("div", {
           key: 0,
           "data-slot": "select-item-content-icon",
-          class: normalizeClass(unref(cn)("mt-0.5 shrink-0", props.iconClass))
+          class: normalizeClass(unref(cn)("shrink-0 self-center", props.iconClass))
         }, [
           createVNode(unref(HugeiconsIcon), {
             icon: props.icon,
-            "stroke-width": 1.8
+            class: "block size-3 sm:size-4"
           }, null, 8, ["icon"])
         ], 2)) : createCommentVNode("", true),
         createElementVNode("div", _hoisted_1$1, [
           createElementVNode("span", {
             "data-slot": "select-item-content-text",
-            class: normalizeClass(unref(cn)("min-w-0 truncate", props.textClass))
+            class: normalizeClass(unref(cn)("min-w-0 truncate font-semibold text-xs sm:text-sm leading-5", props.textClass))
           }, toDisplayString(props.label), 3),
           props.description ? (openBlock(), createElementBlock("span", {
             key: 0,
             "data-slot": "select-item-content-description",
-            class: normalizeClass(unref(cn)("text-xs text-(--text-secondary-light) dark:text-(--text-secondary-dark)", props.descriptionClass))
+            class: normalizeClass(unref(cn)("font-regular text-[11px] sm:text-xs leading-4 sm:leading-5 text-(--text-secondary-light) dark:text-(--text-secondary-dark)", props.descriptionClass))
           }, toDisplayString(props.description), 3)) : createCommentVNode("", true)
         ])
       ], 2);
@@ -2111,7 +2111,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
         "data-size": _ctx.size
       }, unref(forwardedProps), {
         class: unref(cn)(
-          "data-[placeholder]:text-(--text-secondary-light) [&_svg:not([class*='text-'])]:text-(--text-secondary-light) flex w-fit cursor-pointer items-center justify-between gap-2 rounded border border-(--border-light) bg-(--button-secondary-light) px-4 py-3 text-xs font-medium whitespace-nowrap text-(--text-primary-light) transition-all duration-300 ease-in-out outline-none disabled:cursor-not-allowed disabled:opacity-60 data-[size=default]:h-[52px] data-[size=sm]:h-10 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 dark:border-(--border-dark) dark:bg-(--button-secondary-dark) dark:text-(--text-primary-dark) dark:data-[placeholder]:text-(--text-secondary-dark) dark:[&_svg:not([class*='text-'])]:text-(--text-secondary-dark) sm:text-sm",
+          "data-[placeholder]:text-(--text-secondary-light) [&_svg:not([class*='text-'])]:text-(--text-secondary-light) flex w-fit cursor-pointer items-center justify-between gap-2 rounded border border-(--border-light) bg-(--button-secondary-light) px-4 py-3 text-xs font-semibold whitespace-nowrap text-(--text-primary-light) transition-all duration-300 ease-in-out outline-none disabled:cursor-not-allowed disabled:opacity-60 data-[size=default]:h-[52px] data-[size=sm]:h-10 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 dark:border-(--border-dark) dark:bg-(--button-secondary-dark) dark:text-(--text-primary-dark) dark:data-[placeholder]:text-(--text-secondary-dark) dark:[&_svg:not([class*='text-'])]:text-(--text-secondary-dark) sm:text-sm",
           "focus-visible:border-(--border-hover-light) focus-visible:ring-0 dark:focus-visible:border-(--border-hover-dark)",
           "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
           props.class
@@ -2153,7 +2153,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _hoisted_1 = { class: "flex min-w-0 flex-1 flex-col" };
+const _hoisted_1 = { class: "flex min-w-0 flex-1 flex-col gap-0.5" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "SelectValueContent",
   props: {
@@ -2174,30 +2174,31 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return openBlock(), createBlock(unref(SelectValue_default), {
         "data-slot": "select-value-content",
         placeholder: props.placeholder,
-        class: normalizeClass(unref(cn)("flex min-w-0 flex-1 gap-2 text-left", props.description ? "items-start" : "items-center", props.class))
+        class: normalizeClass(unref(cn)("flex min-w-0 flex-1 gap-1.5 text-left sm:gap-2", props.description ? "items-start" : "items-center", props.class))
       }, {
         default: withCtx(() => [
-          props.icon ? (openBlock(), createElementBlock("div", {
-            key: 0,
-            "data-slot": "select-value-content-icon",
-            class: normalizeClass(unref(cn)("shrink-0", props.iconClass))
-          }, [
-            createVNode(unref(HugeiconsIcon), {
-              icon: props.icon,
-              "stroke-width": 1.8
-            }, null, 8, ["icon"])
-          ], 2)) : createCommentVNode("", true),
-          createElementVNode("div", _hoisted_1, [
-            createElementVNode("span", {
-              "data-slot": "select-value-content-text",
-              class: normalizeClass(unref(cn)("min-w-0 truncate", props.textClass))
-            }, toDisplayString(props.label), 3),
-            props.description ? (openBlock(), createElementBlock("span", {
+          props.label != null || props.description != null ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+            props.icon ? (openBlock(), createElementBlock("div", {
               key: 0,
-              "data-slot": "select-value-content-description",
-              class: normalizeClass(unref(cn)("text-xs text-(--text-secondary-light) dark:text-(--text-secondary-dark)", props.descriptionClass))
-            }, toDisplayString(props.description), 3)) : createCommentVNode("", true)
-          ])
+              "data-slot": "select-value-content-icon",
+              class: normalizeClass(unref(cn)("shrink-0", props.iconClass))
+            }, [
+              createVNode(unref(HugeiconsIcon), {
+                icon: props.icon
+              }, null, 8, ["icon"])
+            ], 2)) : createCommentVNode("", true),
+            createElementVNode("div", _hoisted_1, [
+              createElementVNode("span", {
+                "data-slot": "select-value-content-text",
+                class: normalizeClass(unref(cn)("min-w-0 whitespace-normal break-words text-xs leading-5 sm:truncate sm:text-sm max-sm:[display:-webkit-box] max-sm:[overflow:hidden] max-sm:[-webkit-box-orient:vertical] max-sm:[-webkit-line-clamp:2]", props.textClass))
+              }, toDisplayString(props.label), 3),
+              props.description ? (openBlock(), createElementBlock("span", {
+                key: 0,
+                "data-slot": "select-value-content-description",
+                class: normalizeClass(unref(cn)("min-w-0 whitespace-normal break-words text-[11px] leading-4 text-(--text-secondary-light) dark:text-(--text-secondary-dark) sm:text-xs sm:leading-5 max-sm:[display:-webkit-box] max-sm:[overflow:hidden] max-sm:[-webkit-box-orient:vertical] max-sm:[-webkit-line-clamp:3]", props.descriptionClass))
+              }, toDisplayString(props.description), 3)) : createCommentVNode("", true)
+            ])
+          ], 64)) : createCommentVNode("", true)
         ]),
         _: 1
       }, 8, ["placeholder", "class"]);

package/dist/sidebar.js

@@ -1,11 +1,11 @@
 var _a;
 import { c as cva } from "./index-FpH8cK6B.js";
-import { defineComponent, openBlock, createElementBlock, mergeProps, unref, renderSlot, createBlock, withCtx, createVNode, normalizeStyle, createTextVNode, createElementVNode, normalizeClass, normalizeProps, guardReactiveProps, Fragment, toDisplayString, resolveDynamicComponent, computed, createCommentVNode, ref } from "vue";
+import { defineComponent, openBlock, createElementBlock, mergeProps, unref, renderSlot, createBlock, withCtx, createVNode, normalizeStyle, createTextVNode, createElementVNode, normalizeClass, normalizeProps, guardReactiveProps, Fragment, toDisplayString, resolveDynamicComponent, createCommentVNode, ref, computed } from "vue";
 import { c as cn } from "./utils-Bz4m9VPB.js";
 import { _ as _sfc_main$o, a as _sfc_main$p, c as _sfc_main$q, d as _sfc_main$r, b as _sfc_main$s } from "./SheetTitle.vue_vue_type_script_setup_true_lang-Ja7-gmXd.js";
 import { c as createContext } from "./createContext-BabAT1K8.js";
 import { P as Primitive } from "./Primitive-D3IcFg81.js";
-import { _ as _sfc_main$t } from "./Input.vue_vue_type_script_setup_true_lang-BdjbS5s7.js";
+import { _ as _sfc_main$t } from "./Input.vue_vue_type_script_setup_true_lang-KQETSF2I.js";
 import { _ as _sfc_main$u, b as _sfc_main$v, a as _sfc_main$w, T as TooltipProvider_default } from "./TooltipTrigger.vue_vue_type_script_setup_true_lang-BMdZRPa3.js";
 import { _ as _sfc_main$x } from "./Skeleton.vue_vue_type_script_setup_true_lang-BSbVyZz7.js";
 import { g as useMediaQuery, a as useVModel, c as useEventListener, h as defaultDocument } from "./index-Dw56kNV0.js";
@@ -35,6 +35,7 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
     side: { default: "left" },
     variant: { default: "sidebar" },
     collapsible: { default: "offcanvas" },
+    compact: { type: Boolean, default: false },
     class: {}
   },
   setup(__props) {
@@ -50,7 +51,7 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
       return _ctx.collapsible === "none" ? (openBlock(), createElementBlock("div", mergeProps({
         key: 0,
         "data-slot": "sidebar",
-        class: unref(cn)("bg-sidebar text-sidebar-foreground flex h-full w-(--sidebar-width) flex-col", props.class)
+        class: unref(cn)("group/sidebar-wrapper bg-sidebar text-sidebar-foreground flex h-full w-(--sidebar-width) flex-col", props.class)
       }, _ctx.$attrs), [
         renderSlot(_ctx.$slots, "default")
       ], 16)) : unref(isMobile) ? (openBlock(), createBlock(unref(_sfc_main$o), mergeProps({
@@ -62,8 +63,9 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
             "data-sidebar": "sidebar",
             "data-slot": "sidebar",
             "data-mobile": "true",
+            "data-compact": props.compact ? "true" : "false",
             side: _ctx.side,
-            class: "border-sidebar-border bg-sidebar text-sidebar-foreground w-(--sidebar-width) p-0 [&>button]:hidden",
+            class: "group/sidebar-wrapper border-sidebar-border bg-sidebar text-sidebar-foreground w-(--sidebar-width) p-0 [&>button]:hidden",
             style: normalizeStyle({
               "--sidebar-width": unref(SIDEBAR_WIDTH_MOBILE)
             })
@@ -94,12 +96,12 @@ const _sfc_main$n = /* @__PURE__ */ defineComponent({
               ])
             ]),
             _: 3
-          }, 8, ["side", "style"])
+          }, 8, ["data-compact", "side", "style"])
         ]),
         _: 3
       }, 16, ["open", "onUpdate:open"])) : (openBlock(), createElementBlock("div", {
         key: 2,
-        class: "group peer text-sidebar-foreground hidden md:block",
+        class: "group/sidebar-wrapper group peer text-sidebar-foreground hidden md:block",
         "data-slot": "sidebar",
         "data-state": unref(state),
         "data-collapsible": unref(state) === "collapsed" ? _ctx.collapsible : "",
@@ -142,7 +144,7 @@ const _sfc_main$m = /* @__PURE__ */ defineComponent({
       return openBlock(), createElementBlock("div", {
         "data-slot": "sidebar-content",
         "data-sidebar": "content",
-        class: normalizeClass(unref(cn)("flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden", props.class))
+        class: normalizeClass(unref(cn)("flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[compact=true]/sidebar-wrapper:gap-1.5 group-data-[collapsible=icon]:overflow-hidden", props.class))
       }, [
         renderSlot(_ctx.$slots, "default")
       ], 2);
@@ -160,7 +162,7 @@ const _sfc_main$l = /* @__PURE__ */ defineComponent({
       return openBlock(), createElementBlock("div", {
         "data-slot": "sidebar-footer",
         "data-sidebar": "footer",
-        class: normalizeClass(unref(cn)("flex flex-col gap-2 p-2", props.class))
+        class: normalizeClass(unref(cn)("flex flex-col gap-2 p-2 group-data-[compact=true]/sidebar-wrapper:gap-1.5 group-data-[compact=true]/sidebar-wrapper:p-2.5", props.class))
       }, [
         renderSlot(_ctx.$slots, "default")
       ], 2);
@@ -178,7 +180,7 @@ const _sfc_main$k = /* @__PURE__ */ defineComponent({
       return openBlock(), createElementBlock("div", {
         "data-slot": "sidebar-group",
         "data-sidebar": "group",
-        class: normalizeClass(unref(cn)("relative flex w-full min-w-0 flex-col p-2", props.class))
+        class: normalizeClass(unref(cn)("relative flex w-full min-w-0 flex-col p-2 group-data-[compact=true]/sidebar-wrapper:p-2.5", props.class))
       }, [
         renderSlot(_ctx.$slots, "default")
       ], 2);
@@ -249,7 +251,7 @@ const _sfc_main$h = /* @__PURE__ */ defineComponent({
         as: _ctx.as,
         "as-child": _ctx.asChild,
         class: normalizeClass(unref(cn)(
-          "text-sidebar-foreground/70 ring-sidebar-ring flex h-8 shrink-0 items-center rounded-md px-2 text-xs font-medium outline-hidden transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
+          "text-sidebar-foreground/70 ring-sidebar-ring flex h-8 shrink-0 items-center rounded-md px-2 text-xs font-semibold outline-hidden transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 group-data-[compact=true]/sidebar-wrapper:h-7 group-data-[compact=true]/sidebar-wrapper:px-1.5 [&>svg]:size-4 [&>svg]:shrink-0",
           "group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0",
           props.class
         ))
@@ -273,7 +275,7 @@ const _sfc_main$g = /* @__PURE__ */ defineComponent({
       return openBlock(), createElementBlock("div", {
         "data-slot": "sidebar-header",
         "data-sidebar": "header",
-        class: normalizeClass(unref(cn)("flex flex-col gap-2 p-2", props.class))
+        class: normalizeClass(unref(cn)("flex flex-col gap-2 p-2 group-data-[compact=true]/sidebar-wrapper:gap-1.5 group-data-[compact=true]/sidebar-wrapper:p-2.5", props.class))
       }, [
         renderSlot(_ctx.$slots, "default")
       ], 2);
@@ -292,7 +294,7 @@ const _sfc_main$f = /* @__PURE__ */ defineComponent({
         "data-slot": "sidebar-input",
         "data-sidebar": "input",
         class: normalizeClass(unref(cn)(
-          "bg-background h-8 w-full shadow-none",
+          "bg-background h-8 w-full shadow-none group-data-[compact=true]/sidebar-wrapper:h-7 group-data-[compact=true]/sidebar-wrapper:text-xs",
           props.class
         ))
       }, {
@@ -363,6 +365,7 @@ const _sfc_main$c = /* @__PURE__ */ defineComponent({
           "peer-data-[size=sm]/menu-button:top-1",
           "peer-data-[size=default]/menu-button:top-1.5",
           "peer-data-[size=lg]/menu-button:top-2.5",
+          "group-data-[compact=true]/sidebar-wrapper:top-1",
           "group-data-[collapsible=icon]:hidden",
           _ctx.showOnHover && "peer-data-[active=true]/menu-button:text-sidebar-accent-foreground group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-[state=open]:opacity-100 md:opacity-0",
           props.class
@@ -390,11 +393,12 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
         "data-slot": "sidebar-menu-badge",
         "data-sidebar": "menu-badge",
         class: normalizeClass(unref(cn)(
-          "text-sidebar-foreground pointer-events-none absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-md px-1 text-xs font-medium tabular-nums select-none",
+          "text-sidebar-foreground pointer-events-none absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-md px-1 text-xs font-semibold tabular-nums select-none",
           "peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground",
           "peer-data-[size=sm]/menu-button:top-1",
           "peer-data-[size=default]/menu-button:top-1.5",
           "peer-data-[size=lg]/menu-button:top-2.5",
+          "group-data-[compact=true]/sidebar-wrapper:top-1",
           "group-data-[collapsible=icon]:hidden",
           props.class
         ))
@@ -507,6 +511,7 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
     };
   }
 });
+const width = "72%";
 const _sfc_main$7 = /* @__PURE__ */ defineComponent({
   __name: "SidebarMenuSkeleton",
   props: {
@@ -515,24 +520,21 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     const props = __props;
-    const width = computed(() => {
-      return `${Math.floor(Math.random() * 40) + 50}%`;
-    });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
         "data-slot": "sidebar-menu-skeleton",
         "data-sidebar": "menu-skeleton",
-        class: normalizeClass(unref(cn)("flex h-8 items-center gap-2 rounded-md px-2", props.class))
+        class: normalizeClass(unref(cn)("flex h-8 items-center gap-2 rounded-md px-2 group-data-[compact=true]/sidebar-wrapper:h-7 group-data-[compact=true]/sidebar-wrapper:gap-1.5 group-data-[compact=true]/sidebar-wrapper:px-1.5", props.class))
       }, [
         _ctx.showIcon ? (openBlock(), createBlock(unref(_sfc_main$x), {
           key: 0,
-          class: "size-4 rounded-md",
+          class: "size-4 rounded-md group-data-[compact=true]/sidebar-wrapper:size-3.5",
           "data-sidebar": "menu-skeleton-icon"
         })) : createCommentVNode("", true),
         createVNode(unref(_sfc_main$x), {
           class: "h-4 max-w-(--skeleton-width) flex-1",
           "data-sidebar": "menu-skeleton-text",
-          style: normalizeStyle({ "--skeleton-width": width.value })
+          style: normalizeStyle({ "--skeleton-width": width })
         }, null, 8, ["style"])
       ], 2);
     };
@@ -580,10 +582,10 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
         "data-size": _ctx.size,
         "data-active": _ctx.isActive,
         class: normalizeClass(unref(cn)(
-          "text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground [&>svg]:text-sidebar-accent-foreground flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 outline-hidden focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0",
+          "text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground [&>svg]:text-sidebar-accent-foreground flex min-h-7 min-w-0 -translate-x-px items-center gap-2 rounded-md px-2 outline-hidden focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 group-data-[compact=true]/sidebar-wrapper:min-h-6 group-data-[compact=true]/sidebar-wrapper:gap-1.5 group-data-[compact=true]/sidebar-wrapper:px-1.5 group-data-[compact=true]/sidebar-wrapper:[&>svg]:size-3.5 [&>svg]:size-4 [&>svg]:shrink-0",
           "data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground",
           _ctx.size === "sm" && "text-xs",
-          _ctx.size === "md" && "text-sm",
+          _ctx.size === "md" && "text-sm group-data-[compact=true]/sidebar-wrapper:text-xs",
           "group-data-[collapsible=icon]:hidden",
           props.class
         ))
@@ -619,6 +621,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
   props: {
     defaultOpen: { type: Boolean, default: !((_a = defaultDocument) == null ? void 0 : _a.cookie.includes(`${SIDEBAR_COOKIE_NAME}=false`)) },
     open: { type: Boolean, default: void 0 },
+    compact: { type: Boolean, default: false },
     class: {}
   },
   emits: ["update:open"],
@@ -756,7 +759,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   }
 });
 const sidebarMenuButtonVariants = cva(
-  "peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm outline-hidden ring-sidebar-ring transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 group-has-data-[sidebar=menu-action]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0",
+  "peer/menu-button flex w-full items-center gap-2 rounded-md p-2 text-left text-sm outline-hidden ring-sidebar-ring transition-[width,min-height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 group-has-data-[sidebar=menu-action]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-semibold data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! group-data-[compact=true]/sidebar-wrapper:gap-1.5 group-data-[compact=true]/sidebar-wrapper:p-2.5 group-data-[compact=true]/sidebar-wrapper:[&>svg]:size-3.5 [&>svg]:size-4 [&>svg]:shrink-0",
   {
     variants: {
       variant: {
@@ -764,9 +767,9 @@ const sidebarMenuButtonVariants = cva(
         outline: "bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]"
       },
       size: {
-        default: "h-8 text-sm",
-        sm: "h-7 text-xs",
-        lg: "h-12 text-sm group-data-[collapsible=icon]:p-0!"
+        default: "min-h-8 text-sm group-data-[compact=true]/sidebar-wrapper:min-h-7 group-data-[compact=true]/sidebar-wrapper:text-xs",
+        sm: "min-h-7 text-xs group-data-[compact=true]/sidebar-wrapper:min-h-6",
+        lg: "min-h-12 text-sm group-data-[compact=true]/sidebar-wrapper:min-h-10 group-data-[collapsible=icon]:p-0!"
       }
     },
     defaultVariants: {

package/dist/single-value-card.js

@@ -3,7 +3,7 @@ import { H as HugeiconsIcon } from "./HugeiconsIcon.vue-By2RXWWz.js";
 import { _ as _sfc_main$1 } from "./Card.vue_vue_type_script_setup_true_lang-DwBhZuSq.js";
 import { _ as _sfc_main$2 } from "./CardContent.vue_vue_type_script_setup_true_lang-dBzO0q1t.js";
 const _hoisted_1 = { class: "flex flex-col" };
-const _hoisted_2 = { class: "mb-1 text-xs font-medium text-[var(--text-secondary-light)] dark:text-[var(--text-secondary-dark)]" };
+const _hoisted_2 = { class: "mb-1 text-xs font-semibold text-[var(--text-secondary-light)] dark:text-[var(--text-secondary-dark)]" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "SingleValueCard",
   props: {

package/dist/slider-form-component.js

@@ -3,12 +3,12 @@ import { _ as _sfc_main$1 } from "./Card.vue_vue_type_script_setup_true_lang-DwB
 import { _ as _sfc_main$2 } from "./Slider.vue_vue_type_script_setup_true_lang-CSOSwGGr.js";
 const _hoisted_1 = { class: "flex items-center justify-between gap-3" };
 const _hoisted_2 = { class: "space-y-2" };
-const _hoisted_3 = { class: "text-sm font-medium" };
+const _hoisted_3 = { class: "text-sm font-semibold" };
 const _hoisted_4 = {
   key: 0,
   class: "text-xs text-muted-foreground"
 };
-const _hoisted_5 = { class: "rounded border border-border bg-background px-2 py-1 text-xs font-medium" };
+const _hoisted_5 = { class: "rounded border border-border bg-background px-2 py-1 text-xs font-semibold" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "SliderFormComponent",
   props: {