@indielayer/ui 1.5.1 → 1.6.0

package/lib/components/index.js

@@ -1,112 +1,117 @@
 import { default as a } from "./accordion/Accordion.vue.js";
-import { default as t } from "./accordion/AccordionItem.vue.js";
-import { default as l } from "./badge/Badge.vue.js";
-import { default as p } from "./breadcrumbs/Breadcrumbs.vue.js";
-import { default as m } from "./card/Card.vue.js";
-import { default as x } from "./carousel/Carousel.vue.js";
+import { default as f } from "./accordion/AccordionItem.vue.js";
+import { default as d } from "./badge/Badge.vue.js";
+import { default as u } from "./breadcrumbs/Breadcrumbs.vue.js";
+import { default as s } from "./card/Card.vue.js";
+import { default as X } from "./carousel/Carousel.vue.js";
 import { default as n } from "./container/Container.vue.js";
-import { default as T } from "./divider/Divider.vue.js";
-import { default as c } from "./drawer/Drawer.vue.js";
-import { default as S } from "./form/Form.vue.js";
-import { default as I } from "./formGroup/FormGroup.vue.js";
-import { default as v } from "./image/Image.vue.js";
-import { default as A } from "./input/Input.vue.js";
+import { default as c } from "./datepicker/Datepicker.vue.js";
+import "./datepicker/Datepicker.vue2.js";
+import { default as g } from "./divider/Divider.vue.js";
+import { default as S } from "./drawer/Drawer.vue.js";
+import { default as P } from "./form/Form.vue.js";
+import { default as B } from "./formGroup/FormGroup.vue.js";
+import { default as A } from "./image/Image.vue.js";
 import { default as F } from "./menu/Menu.vue.js";
 import { default as L } from "./modal/Modal.vue.js";
 import { default as h } from "./notifications/Notifications.vue.js";
-import { default as D } from "./pagination/Pagination.vue.js";
-import { default as R } from "./progress/Progress.vue.js";
-import { default as N } from "./select/Select.vue.js";
-import { default as q } from "./skeleton/Skeleton.vue.js";
-import { default as E } from "./slider/Slider.vue.js";
+import { default as H } from "./pagination/Pagination.vue.js";
+import { default as y } from "./progress/Progress.vue.js";
+import { default as Q } from "./qrCode/QrCode.vue.js";
+import { default as q } from "./select/Select.vue.js";
+import { default as E } from "./skeleton/Skeleton.vue.js";
 import { default as K } from "./stepper/Stepper.vue.js";
-import { default as Q } from "./tab/Tab.vue.js";
-import { default as V } from "./tab/TabGroup.vue.js";
-import { default as Y } from "./table/Table.vue.js";
-import { default as _ } from "./textarea/Textarea.vue.js";
-import { default as ee } from "./themeProvider/ThemeProvider.vue.js";
+import { default as U } from "./tab/Tab.vue.js";
+import { default as W } from "./tab/TabGroup.vue.js";
+import { default as Z } from "./table/Table.vue.js";
+import { default as $ } from "./textarea/Textarea.vue.js";
+import { default as oe } from "./themeProvider/ThemeProvider.vue.js";
 import { default as ae } from "./toggle/Toggle.vue.js";
-import { default as te } from "./alert/Alert.vue.js";
-import { default as le } from "./avatar/Avatar.vue.js";
-import { default as pe } from "./button/Button.vue.js";
-import { default as me } from "./button/ButtonGroup.vue.js";
-import { default as xe } from "./carousel/CarouselSlide.vue.js";
+import { default as fe } from "./alert/Alert.vue.js";
+import { default as de } from "./avatar/Avatar.vue.js";
+import { default as ue } from "./button/Button.vue.js";
+import { default as se } from "./button/ButtonGroup.vue.js";
+import { default as Xe } from "./carousel/CarouselSlide.vue.js";
 import { default as ne } from "./checkbox/Checkbox.vue.js";
-import { default as Te } from "./icon/Icon.vue.js";
-import { default as ce } from "./inputFooter/InputFooter.vue.js";
-import { default as Se } from "./label/Label.vue.js";
-import { default as Ie } from "./link/Link.vue.js";
-import { default as ve } from "./loader/Loader.vue.js";
-import { default as Ae } from "./menu/MenuItem.vue.js";
-import { default as Fe } from "./pagination/PaginationItem.vue.js";
-import { default as Le } from "./popover/Popover.vue.js";
-import { default as he } from "./popover/PopoverContainer.vue.js";
-import { default as De } from "./radio/Radio.vue.js";
-import { default as Re } from "./scroll/Scroll.vue.js";
-import { default as Ne } from "./spacer/Spacer.js";
-import { default as qe } from "./spinner/Spinner.vue.js";
-import { default as Ee } from "./table/TableBody.js";
-import { default as Ke } from "./table/TableCell.vue.js";
-import { default as Qe } from "./table/TableHead.vue.js";
-import { default as Ve } from "./table/TableHeader.vue.js";
-import { default as Ye } from "./table/TableRow.vue.js";
-import { default as _e } from "./tag/Tag.vue.js";
-import { default as eo } from "./tooltip/Tooltip.vue.js";
-import { default as ao } from "./tooltip/ToggleTip.vue.js";
+import { default as ce } from "./icon/Icon.vue.js";
+import { default as ge } from "./input/Input.vue.js";
+import { default as Se } from "./inputFooter/InputFooter.vue.js";
+import { default as Pe } from "./label/Label.vue.js";
+import { default as Be } from "./link/Link.vue.js";
+import { default as Ae } from "./loader/Loader.vue.js";
+import { default as Fe } from "./menu/MenuItem.vue.js";
+import { default as Le } from "./pagination/PaginationItem.vue.js";
+import { default as he } from "./popover/Popover.vue.js";
+import { default as He } from "./popover/PopoverContainer.vue.js";
+import { default as ye } from "./radio/Radio.vue.js";
+import { default as Qe } from "./scroll/Scroll.vue.js";
+import { default as qe } from "./slider/Slider.vue.js";
+import { default as Ee } from "./spacer/Spacer.js";
+import { default as Ke } from "./spinner/Spinner.vue.js";
+import { default as Ue } from "./table/TableBody.js";
+import { default as We } from "./table/TableCell.vue.js";
+import { default as Ze } from "./table/TableHead.vue.js";
+import { default as $e } from "./table/TableHeader.vue.js";
+import { default as oo } from "./table/TableRow.vue.js";
+import { default as ao } from "./tag/Tag.vue.js";
+import { default as fo } from "./tooltip/Tooltip.vue.js";
+import { default as po } from "./tooltip/ToggleTip.vue.js";
 export {
   a as XAccordion,
-  t as XAccordionItem,
-  te as XAlert,
-  le as XAvatar,
-  l as XBadge,
-  p as XBreadcrumbs,
-  pe as XButton,
-  me as XButtonGroup,
-  m as XCard,
-  x as XCarousel,
-  xe as XCarouselSlide,
+  f as XAccordionItem,
+  fe as XAlert,
+  de as XAvatar,
+  d as XBadge,
+  u as XBreadcrumbs,
+  ue as XButton,
+  se as XButtonGroup,
+  s as XCard,
+  X as XCarousel,
+  Xe as XCarouselSlide,
   ne as XCheckbox,
   n as XContainer,
-  T as XDivider,
-  c as XDrawer,
-  S as XForm,
-  I as XFormGroup,
-  Te as XIcon,
-  v as XImage,
-  A as XInput,
-  ce as XInputFooter,
-  Se as XLabel,
-  Ie as XLink,
-  ve as XLoader,
+  c as XDatepicker,
+  g as XDivider,
+  S as XDrawer,
+  P as XForm,
+  B as XFormGroup,
+  ce as XIcon,
+  A as XImage,
+  ge as XInput,
+  Se as XInputFooter,
+  Pe as XLabel,
+  Be as XLink,
+  Ae as XLoader,
   F as XMenu,
-  Ae as XMenuItem,
+  Fe as XMenuItem,
   L as XModal,
   h as XNotifications,
-  D as XPagination,
-  Fe as XPaginationItem,
-  Le as XPopover,
-  he as XPopoverContainer,
-  R as XProgress,
-  De as XRadio,
-  Re as XScroll,
-  N as XSelect,
-  q as XSkeleton,
-  E as XSlider,
-  Ne as XSpacer,
-  qe as XSpinner,
+  H as XPagination,
+  Le as XPaginationItem,
+  he as XPopover,
+  He as XPopoverContainer,
+  y as XProgress,
+  Q as XQrCode,
+  ye as XRadio,
+  Qe as XScroll,
+  q as XSelect,
+  E as XSkeleton,
+  qe as XSlider,
+  Ee as XSpacer,
+  Ke as XSpinner,
   K as XStepper,
-  Q as XTab,
-  V as XTabGroup,
-  Y as XTable,
-  Ee as XTableBody,
-  Ke as XTableCell,
-  Qe as XTableHead,
-  Ve as XTableHeader,
-  Ye as XTableRow,
-  _e as XTag,
-  _ as XTextarea,
-  ee as XThemeProvider,
+  U as XTab,
+  W as XTabGroup,
+  Z as XTable,
+  Ue as XTableBody,
+  We as XTableCell,
+  Ze as XTableHead,
+  $e as XTableHeader,
+  oo as XTableRow,
+  ao as XTag,
+  $ as XTextarea,
+  oe as XThemeProvider,
   ae as XToggle,
-  ao as XToggleTip,
-  eo as XTooltip
+  po as XToggleTip,
+  fo as XTooltip
 };

package/lib/components/inputFooter/theme/InputFooter.base.theme.js

@@ -1,6 +1,6 @@
 const e = {
   classes: {
-    wrapper: "min-h-[1.3rem] text-xs mt-1",
+    wrapper: "text-xs mt-1",
     helperText: "text-secondary-500 dark:text-secondary-400",
     errorText: "text-error-500 dark:text-error-400"
   }

package/lib/components/label/theme/Label.base.theme.js

@@ -2,7 +2,7 @@ const s = {
   classes: {
     wrapper: ({ props: t }) => {
       const e = ["block relative align-bottom focus:outline-none"];
-      return t.isInsideForm && e.push("mb-3"), t.block && e.push("w-full"), e;
+      return t.isInsideForm && e.push("mb-5"), t.block && e.push("w-full"), e;
     },
     label: ({ props: t }) => {
       const e = "flex items-center gap-2 font-medium text-secondary-800 dark:text-secondary-200 mb-1";

package/lib/components/menu/Menu.vue.d.ts

@@ -18,6 +18,7 @@ declare const menuProps: {
         type: BooleanConstructor;
         default: boolean;
     };
+    minimal: BooleanConstructor;
     color: {
         readonly type: StringConstructor;
         readonly default: string | undefined;
@@ -73,6 +74,7 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    minimal: BooleanConstructor;
     color: {
         readonly type: StringConstructor;
         readonly default: string | undefined;
@@ -99,6 +101,7 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    minimal: BooleanConstructor;
     color: {
         readonly type: StringConstructor;
         readonly default: string | undefined;
@@ -119,5 +122,6 @@ declare const _default: import("vue").DefineComponent<{
     size: Size;
     filled: boolean;
     collapsible: boolean;
+    minimal: boolean;
 }, {}>;
 export default _default;

package/lib/components/menu/Menu.vue.js

@@ -1,12 +1,12 @@
-import { defineComponent as C, resolveComponent as B, openBlock as d, createElementBlock as n, normalizeStyle as E, unref as p, normalizeClass as i, Fragment as a, renderList as w, createBlock as u, withCtx as b, createVNode as r, createCommentVNode as M } from "vue";
-import { useCommon as m } from "../../composables/useCommon.js";
+import { defineComponent as B, resolveComponent as t, openBlock as d, createElementBlock as s, normalizeStyle as E, unref as p, normalizeClass as a, Fragment as i, renderList as w, createBlock as m, withCtx as b, createVNode as r, createCommentVNode as M } from "vue";
+import { useCommon as c } from "../../composables/useCommon.js";
 import { useColors as N } from "../../composables/useColors.js";
 import { useTheme as g } from "../../composables/useTheme.js";
-import c from "./MenuItem.vue.js";
+import u from "./MenuItem.vue.js";
 import A from "../accordion/AccordionItem.vue.js";
 import S from "../divider/Divider.vue.js";
 const V = {
-  ...m.props(),
+  ...c.props(),
   ...N.props("secondary"),
   items: Array,
   collapsible: {
@@ -23,54 +23,56 @@ const V = {
   filled: {
     type: Boolean,
     default: !0
-  }
+  },
+  minimal: Boolean
 }, X = {
   name: "XMenu",
   validators: {
-    ...m.validators()
+    ...c.validators()
   }
-}, G = /* @__PURE__ */ C({
+}, G = /* @__PURE__ */ B({
   ...X,
   props: V,
   emits: ["expand", "item-click"],
   setup(y) {
     const z = y, { styles: k, classes: v, className: $ } = g("Menu", {}, z);
     return (e, o) => {
-      const f = B("x-menu");
-      return e.items ? (d(), n("div", {
+      const f = t("x-menu");
+      return e.items ? (d(), s("div", {
         key: 0,
         style: E(p(k)),
-        class: i([
+        class: a([
           "space-y-1",
           p($),
           p(v).wrapper
         ])
       }, [
-        (d(!0), n(a, null, w(e.items, (l, t) => (d(), n(a, { key: t }, [
-          l.items ? (d(), n(a, { key: 0 }, [
-            l.collapsible !== !1 ? (d(), u(A, {
+        (d(!0), s(i, null, w(e.items, (l, I) => (d(), s(i, { key: I }, [
+          l.items ? (d(), s(i, { key: 0 }, [
+            l.collapsible !== !1 ? (d(), m(A, {
               key: 0,
               icon: l.collapseIcon || e.collapseIcon,
               expanded: l.expanded || e.expanded,
               disabled: e.disabled || l.disabled,
               "show-icon": !!(l.collapseIcon || e.collapseIcon),
               class: "x-menu-inner space-y-1",
-              onExpand: o[1] || (o[1] = (s) => e.$emit("expand"))
+              onExpand: o[1] || (o[1] = (n) => e.$emit("expand"))
             }, {
               default: b(({}) => [
-                r(c, {
+                r(u, {
                   item: l,
                   rounded: e.rounded,
                   color: l.color || e.color,
                   filled: l.filled || e.filled,
                   size: l.size || e.size,
                   disabled: e.disabled || l.disabled,
+                  minimal: e.minimal,
                   class: "font-medium"
-                }, null, 8, ["item", "rounded", "color", "filled", "size", "disabled"])
+                }, null, 8, ["item", "rounded", "color", "filled", "size", "disabled", "minimal"])
               ]),
-              content: b(({ expand: s }) => [
+              content: b(({ expand: n }) => [
                 r(f, {
-                  class: i(["border-l ml-4 border-secondary-100 dark:border-secondary-700", { "pl-1": e.filled }]),
+                  class: a(["border-l ml-4 border-secondary-100 dark:border-secondary-700", { "pl-1": e.filled }]),
                   items: l.items,
                   color: l.color || e.color,
                   size: l.size || e.size,
@@ -80,25 +82,27 @@ const V = {
                   disabled: e.disabled || l.disabled,
                   rounded: e.rounded,
                   filled: e.filled,
-                  onExpand: (I) => s(!1),
-                  onItemClick: o[0] || (o[0] = (I) => e.$emit("item-click"))
-                }, null, 8, ["class", "items", "color", "size", "collapsible", "collapse-icon", "expanded", "disabled", "rounded", "filled", "onExpand"])
+                  minimal: e.minimal,
+                  onExpand: (C) => n(!1),
+                  onItemClick: o[0] || (o[0] = (C) => e.$emit("item-click"))
+                }, null, 8, ["class", "items", "color", "size", "collapsible", "collapse-icon", "expanded", "disabled", "rounded", "filled", "minimal", "onExpand"])
               ]),
               _: 2
-            }, 1032, ["icon", "expanded", "disabled", "show-icon"])) : (d(), n(a, { key: 1 }, [
-              r(c, {
+            }, 1032, ["icon", "expanded", "disabled", "show-icon"])) : (d(), s(i, { key: 1 }, [
+              r(u, {
                 item: l,
                 rounded: e.rounded,
                 color: l.color || e.color,
                 filled: l.filled || e.filled,
                 size: l.size || e.size,
                 disabled: e.disabled || l.disabled,
+                minimal: e.minimal,
                 class: "font-medium",
                 inactive: "",
-                onClick: o[2] || (o[2] = (s) => e.$emit("item-click"))
-              }, null, 8, ["item", "rounded", "color", "filled", "size", "disabled"]),
+                onClick: o[2] || (o[2] = (n) => e.$emit("item-click"))
+              }, null, 8, ["item", "rounded", "color", "filled", "size", "disabled", "minimal"]),
               r(f, {
-                class: i(["x-menu-inner space-y-1 ml-4 border-l border-secondary-100 dark:border-secondary-700", { "pl-1": e.filled }]),
+                class: a(["x-menu-inner space-y-1 ml-4 border-l border-secondary-100 dark:border-secondary-700", { "pl-1": e.filled }]),
                 items: l.items,
                 color: l.color || e.color,
                 size: l.size || e.size,
@@ -106,13 +110,14 @@ const V = {
                 "collapse-icon": l.collapseIcon || e.collapseIcon,
                 expanded: l.expanded || e.expanded,
                 disabled: e.disabled || l.disabled,
+                minimal: e.minimal,
                 rounded: e.rounded,
                 filled: e.filled,
-                onExpand: o[3] || (o[3] = (s) => e.$emit("expand"))
-              }, null, 8, ["class", "items", "color", "size", "collapsible", "collapse-icon", "expanded", "disabled", "rounded", "filled"])
+                onExpand: o[3] || (o[3] = (n) => e.$emit("expand"))
+              }, null, 8, ["class", "items", "color", "size", "collapsible", "collapse-icon", "expanded", "disabled", "minimal", "rounded", "filled"])
             ], 64))
-          ], 64)) : (d(), n(a, { key: 1 }, [
-            l.divider ? (d(), u(S, { key: 0 })) : (d(), u(c, {
+          ], 64)) : (d(), s(i, { key: 1 }, [
+            l.divider ? (d(), m(S, { key: 0 })) : (d(), m(u, {
               key: 1,
               item: l,
               rounded: e.rounded,
@@ -120,10 +125,11 @@ const V = {
               filled: l.filled || e.filled,
               size: l.size || e.size,
               disabled: e.disabled || l.disabled,
-              class: i({ "my-2": l.divider }),
-              onClick: o[4] || (o[4] = (s) => e.$emit("item-click")),
-              onActive: o[5] || (o[5] = (s) => e.$emit("expand"))
-            }, null, 8, ["item", "rounded", "color", "filled", "size", "disabled", "class"]))
+              minimal: e.minimal,
+              class: a({ "my-2": l.divider }),
+              onClick: o[4] || (o[4] = (n) => e.$emit("item-click")),
+              onActive: o[5] || (o[5] = (n) => e.$emit("expand"))
+            }, null, 8, ["item", "rounded", "color", "filled", "size", "disabled", "minimal", "class"]))
           ], 64))
         ], 64))), 128))
       ], 6)) : M("", !0);

package/lib/components/menu/MenuItem.vue.d.ts

@@ -31,6 +31,7 @@ declare const menuItemProps: {
     };
     selected: BooleanConstructor;
     disabled: BooleanConstructor;
+    minimal: BooleanConstructor;
     color: {
         readonly type: StringConstructor;
         readonly default: string | undefined;
@@ -78,6 +79,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     };
     selected: BooleanConstructor;
     disabled: BooleanConstructor;
+    minimal: BooleanConstructor;
     color: {
         readonly type: StringConstructor;
         readonly default: string | undefined;
@@ -117,6 +119,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     };
     selected: BooleanConstructor;
     disabled: BooleanConstructor;
+    minimal: BooleanConstructor;
     color: {
         readonly type: StringConstructor;
         readonly default: string | undefined;
@@ -138,6 +141,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     active: boolean;
     loading: boolean;
     filled: boolean;
+    minimal: boolean;
     attrs: Record<string, any>;
     exact: boolean;
     selected: boolean;

package/lib/components/menu/MenuItem.vue.js

@@ -3,7 +3,7 @@ import o from "./MenuItem.vue3.js";
 import t from "../../_virtual/_plugin-vue_export-helper.js";
 const e = {
   $style: o
-}, _ = /* @__PURE__ */ t(s, [["__cssModules", e], ["__scopeId", "data-v-8614aac7"]]);
+}, _ = /* @__PURE__ */ t(s, [["__cssModules", e], ["__scopeId", "data-v-1eb4b3ca"]]);
 export {
   _ as default
 };

package/lib/components/menu/MenuItem.vue2.js

@@ -1,15 +1,18 @@
-import { defineComponent as S, ref as m, computed as p, onMounted as x, watch as d, openBlock as l, createBlock as i, resolveDynamicComponent as N, mergeProps as R, unref as s, withCtx as I, createElementBlock as r, renderSlot as n, createCommentVNode as k, createElementVNode as g, createTextVNode as M, toDisplayString as P, Fragment as w } from "vue";
+import { defineComponent as z, ref as p, computed as d, onMounted as S, watch as k, openBlock as l, createBlock as i, resolveDynamicComponent as x, mergeProps as N, unref as s, withCtx as R, createElementBlock as r, renderSlot as n, createCommentVNode as u, createTextVNode as I, toDisplayString as M, createElementVNode as P, Fragment as w } from "vue";
 import { useMutationObserver as D } from "../../node_modules/.pnpm/@vueuse_core@10.2.0_vue@3.3.9/node_modules/@vueuse/core/index.js";
 import { useColors as F } from "../../composables/useColors.js";
-import { useCommon as y } from "../../composables/useCommon.js";
+import { useCommon as h } from "../../composables/useCommon.js";
 import { useTheme as O } from "../../composables/useTheme.js";
-import h from "../icon/Icon.vue.js";
+import g from "../icon/Icon.vue.js";
 import T from "../spinner/Spinner.vue.js";
 const V = {
   key: 0,
   class: "mr-2 shrink-0"
-}, j = { class: "flex-1 truncate" }, E = { class: "ml-1 shrink-0" }, A = { key: 0 }, L = {
-  ...y.props(),
+}, j = {
+  key: 2,
+  class: "flex-1 truncate"
+}, E = { class: "ml-1 shrink-0" }, A = { key: 0 }, L = {
+  ...h.props(),
   ...F.props("primary"),
   item: {
     type: Object,
@@ -41,23 +44,24 @@ const V = {
     default: !0
   },
   selected: Boolean,
-  disabled: Boolean
+  disabled: Boolean,
+  minimal: Boolean
 }, X = {
   name: "XMenuItem",
   validators: {
-    ...y.validators()
+    ...h.validators()
   }
-}, Y = /* @__PURE__ */ S({
+}, Y = /* @__PURE__ */ z({
   ...X,
   props: L,
   emits: ["active", "click"],
-  setup($, { emit: _ }) {
-    const u = $, c = _, o = m(), a = m(!1), e = p(() => ({
-      ...u,
-      ...u.item
-    })), v = p(() => e.value.to ? "router-link" : e.value.href ? "a" : "div");
-    x(() => {
-      o.value && (f(), v.value === "router-link" && D(o.value.$el, f, {
+  setup(y, { emit: $ }) {
+    const c = y, m = $, a = p(), o = p(!1), e = d(() => ({
+      ...c,
+      ...c.item
+    })), v = d(() => e.value.to ? "router-link" : e.value.href ? "a" : "div");
+    S(() => {
+      a.value && (f(), v.value === "router-link" && D(a.value.$el, f, {
         attributes: !0,
         attributeFilter: ["class"]
       }));
@@ -67,34 +71,34 @@ const V = {
         t.stopPropagation(), t.preventDefault();
         return;
       }
-      e.value.onClick && e.value.onClick(t), c("click", t);
+      e.value.onClick && e.value.onClick(t), m("click", t);
     }
     function f() {
-      if (o.value && o.value.$el && (e.value.href || e.value.to)) {
-        const t = o.value.$el.classList.contains(e.value.exact ? "router-link-exact-active" : "router-link-active") || !1;
-        a.value = t;
+      if (a.value && a.value.$el && (e.value.href || e.value.to)) {
+        const t = a.value.$el.classList.contains(e.value.exact ? "router-link-exact-active" : "router-link-active") || !1;
+        o.value = t;
       } else
-        a.value = !!e.value.active;
+        o.value = !!e.value.active;
     }
-    d(() => a.value, (t) => {
-      t && c("active");
-    }), d(() => e.value.active, (t) => {
-      a.value = !!t;
+    k(() => o.value, (t) => {
+      t && m("active");
+    }), k(() => e.value.active, (t) => {
+      o.value = !!t;
     });
-    const { styles: C, classes: B, className: z } = O("MenuItem", {}, e, { isActive: a });
-    return (t, q) => (l(), i(N(v.value), R({
+    const { styles: _, classes: B, className: C } = O("MenuItem", {}, e, { isActive: o });
+    return (t, q) => (l(), i(x(v.value), N({
       ref_key: "elRef",
-      ref: o
+      ref: a
     }, e.value.attrs, {
       to: e.value.to,
       href: e.value.href || e.value.to || "",
       target: e.value.target,
       color: e.value.color,
-      style: s(C),
+      style: s(_),
       class: [
-        s(z),
+        s(C),
         t.$style["menu-item"],
-        [a.value ? t.$style["menu-item--active"] : ""],
+        [o.value ? t.$style["menu-item--active"] : ""],
         s(B).wrapper,
         {
           "flex items-center": t.$slots.prefix || t.$slots.suffix
@@ -104,32 +108,32 @@ const V = {
       alt: e.value.label,
       onClick: b
     }), {
-      default: I(() => [
+      default: R(() => [
         t.$slots.prefix ? (l(), r("span", V, [
           n(t.$slots, "prefix", {}, void 0, !0)
-        ])) : e.value.icon ? (l(), i(h, {
+        ])) : e.value.icon ? (l(), i(g, {
           key: 1,
           size: e.value.size,
           icon: e.value.icon,
           class: "mr-2"
-        }, null, 8, ["size", "icon"])) : k("", !0),
-        g("span", j, [
+        }, null, 8, ["size", "icon"])) : u("", !0),
+        t.minimal ? u("", !0) : (l(), r("span", j, [
           n(t.$slots, "default", {}, () => [
-            M(P(e.value.label), 1)
+            I(M(e.value.label), 1)
           ], !0)
-        ]),
-        g("span", E, [
+        ])),
+        P("span", E, [
           e.value.loading ? (l(), i(T, {
             key: 0,
             size: e.value.size
           }, null, 8, ["size"])) : (l(), r(w, { key: 1 }, [
             t.$slots.suffix ? (l(), r("span", A, [
               n(t.$slots, "suffix", {}, void 0, !0)
-            ])) : e.value.iconRight ? (l(), i(h, {
+            ])) : e.value.iconRight ? (l(), i(g, {
               key: 1,
               size: e.value.size,
               icon: e.value.iconRight
-            }, null, 8, ["size", "icon"])) : k("", !0)
+            }, null, 8, ["size", "icon"])) : u("", !0)
           ], 64))
         ])
       ]),

package/lib/components/menu/theme/MenuItem.base.theme.js

@@ -1,7 +1,7 @@
 const l = {
   classes: {
     wrapper: ({ props: i, data: s }) => {
-      const r = ["relative !flex items-center whitespace-nowrap px-3"];
+      const r = ["relative !flex items-center whitespace-nowrap px-3 min-h-[2rem]"];
       return i.disabled || r.push("cursor-pointer"), s.isActive && r.push("font-medium"), i.rounded && r.push("rounded"), i.size === "xs" ? r.push("py-1 text-xs") : i.size === "sm" ? r.push("py-1.5 text-sm") : i.size === "lg" ? r.push("py-3") : i.size === "xl" ? r.push("py-4 text-lg") : r.push("py-1.5"), r;
     }
   },

package/lib/components/notifications/Notifications.vue.js

@@ -208,6 +208,7 @@ const se = { class: "flex items-center flex-wrap" }, re = {
                 D(l(te)),
                 e.action ? (a(), m("button", {
                   key: 1,
+                  type: "button",
                   class: "ml-3 font-medium cursor-pointer text-[color:var(--x-notification-action)] hover:text-[color:var(--x-notification-action-hover)] dark:text-[color:var(--x-notification-dark-action)] dark:hover:text-[color:var(--x-notification-dark-action-hover)]",
                   onClick: () => {
                     var u;