maz-ui 4.0.0-alpha.5 → 4.0.0-beta.0

package/dist/chunks/MazDropdown.vue_vue_type_script_setup_true_lang.B5kO0VJW.mjs

@@ -1,241 +0,0 @@
-import { defineComponent as _, defineAsyncComponent as m, ref as $, computed as x, watch as A, withDirectives as B, openBlock as a, createElementBlock as v, unref as s, normalizeClass as p, normalizeStyle as M, createElementVNode as E, withModifiers as h, renderSlot as d, createTextVNode as g, toDisplayString as z, createCommentVNode as O, createVNode as S, mergeProps as C, createSlots as ee, withCtx as b, createBlock as w, resolveDynamicComponent as oe, Transition as ne, Fragment as te, renderList as le, vShow as re } from "vue";
-import { useInstanceUniqId as se } from "../composables/useInstanceUniqId.mjs";
-import { vClickOutside as ie } from "../directives/vClickOutside.mjs";
-import { debounce as ae } from "../helpers/debounce.mjs";
-const de = ["id"], ue = ["aria-expanded"], ce = ["id"], pe = ["onClick"], we = /* @__PURE__ */ _({
-  inheritAttrs: !1,
-  __name: "MazDropdown",
-  props: {
-    style: { default: void 0 },
-    class: { default: void 0 },
-    items: { default: () => [] },
-    open: { type: Boolean },
-    id: { default: void 0 },
-    trigger: { default: "both" },
-    color: { default: "transparent" },
-    position: { default: "bottom left" },
-    noCloseOnClick: { type: Boolean },
-    disabled: { type: Boolean },
-    noChevron: { type: Boolean },
-    screenReaderDescription: { default: "Open menu dropdown" },
-    menuPanelClass: {},
-    menuPanelStyle: {},
-    block: { type: Boolean },
-    dropdownIcon: {},
-    dropdownIconAnimation: { type: Boolean, default: !0 },
-    size: { default: "md" }
-  },
-  emits: ["menuitem-clicked", "update:open"],
-  setup(L, { emit: N }) {
-    const n = L, D = N, P = m(() => import("../components/MazBtn.mjs")), F = m(() => import("../components/MazIcon.mjs")), U = m(() => import("../components/MazLink.mjs")), f = se({
-      componentName: "MazDropdown",
-      providedId: n.id
-    }), V = m(() => import("./chevron-down.CWWH3GZ1.mjs")), l = $(n.open), r = $(), y = x(() => n.size === "xl" ? "maz-text-lg" : n.size === "lg" || n.size === "md" || n.size === "sm" ? "maz-text-base" : n.size === "xs" || n.size === "mini" ? "maz-text-sm" : "maz-text-lg"), u = ae((e) => {
-      i(e);
-    }, 200);
-    function H() {
-      l.value && i(!1);
-    }
-    function R() {
-      i(!l.value);
-    }
-    function q() {
-      ["click"].includes(n.trigger) && R();
-    }
-    function T() {
-      ["hover", "both"].includes(n.trigger) && i(!0);
-    }
-    function K() {
-      ["hover", "both"].includes(n.trigger) && (l.value === !1 ? i(!0) : u(!0));
-    }
-    function j() {
-      ["hover", "both"].includes(n.trigger) && u(!1);
-    }
-    function G() {
-      u(!1);
-    }
-    function i(e) {
-      n.disabled || (l.value = e, D("update:open", e));
-    }
-    function J(e) {
-      return "action" in e;
-    }
-    function Q(e) {
-      return "href" in e || "to" in e;
-    }
-    async function W(e, t) {
-      var o;
-      D("menuitem-clicked", t), await ((o = e.action) == null ? void 0 : o.call(e)), n.noCloseOnClick || k();
-    }
-    function k() {
-      n.noCloseOnClick === !1 && i(!1);
-    }
-    function I(e) {
-      e.key === "Escape" ? (e.preventDefault(), i(!1)) : ["ArrowDown", "ArrowUp"].includes(e.key) ? Y(e) : e.key === "Enter" && typeof r.value == "number" && (e.preventDefault(), document.querySelectorAll(`#${f.value} .menuitem`)[r.value].click(), k());
-    }
-    function X(e) {
-      ["ArrowDown", "ArrowUp", "Enter"].includes(e.key) && l.value === !1 && (e.preventDefault(), i(!0));
-    }
-    function Y(e) {
-      var c;
-      e.preventDefault();
-      const t = e.key;
-      l.value || i(!0);
-      const o = (c = n.items) == null ? void 0 : c.length;
-      o && (typeof r.value == "number" ? r.value === o - 1 && t === "ArrowDown" ? r.value = 0 : r.value === 0 && t === "ArrowUp" ? r.value = o - 1 : r.value = t === "ArrowDown" ? r.value + 1 : r.value - 1 : r.value = t === "ArrowDown" ? 0 : o - 1);
-    }
-    return A(
-      () => l.value,
-      (e) => {
-        e ? document.addEventListener("keydown", I) : document.removeEventListener("keydown", I), r.value = void 0;
-      }
-    ), A(
-      () => n.open,
-      (e) => i(e)
-    ), (e, t) => B((a(), v("div", {
-      id: s(f),
-      class: p(["m-dropdown m-reset-css", [n.class, { "--block": e.block }]]),
-      style: M(e.style)
-    }, [
-      E("div", {
-        role: "button",
-        tabindex: "0",
-        class: "m-dropdown__wrapper",
-        "aria-expanded": l.value,
-        "aria-haspopup": "menu",
-        onClick: h(q, ["stop"]),
-        onFocus: T,
-        onBlur: G,
-        onKeydown: X,
-        onMouseenter: K,
-        onMouseleave: j
-      }, [
-        e.screenReaderDescription || e.$slots["screen-reader-description"] ? (a(), v("span", {
-          key: 0,
-          id: `${s(f)}-labelspan`,
-          class: "maz-sr-only"
-        }, [
-          d(e.$slots, "screen-reader-description", {}, () => [
-            g(z(e.screenReaderDescription), 1)
-          ])
-        ], 8, ce)) : O("", !0),
-        d(e.$slots, "element", { isOpen: l.value }, () => [
-          S(s(P), C({
-            "aria-labelledby": `${s(f)}-labelspan`,
-            color: e.color,
-            disabled: e.disabled
-          }, e.$attrs, {
-            tabindex: "-1",
-            block: e.block,
-            size: e.size
-          }), ee({
-            default: b(() => [
-              d(e.$slots, "default")
-            ]),
-            _: 2
-          }, [
-            e.noChevron ? void 0 : {
-              name: "right-icon",
-              fn: b(() => [
-                d(e.$slots, "dropdown-icon", { isOpen: l.value }, () => [
-                  typeof e.dropdownIcon == "string" ? (a(), w(s(F), {
-                    key: 0,
-                    name: e.dropdownIcon,
-                    class: p([{ "--open": l.value && e.dropdownIconAnimation }, y.value])
-                  }, null, 8, ["name", "class"])) : e.dropdownIcon ? (a(), w(oe(e.dropdownIcon), {
-                    key: 1,
-                    class: p([[{ "--open": l.value && e.dropdownIconAnimation }, y.value], "m-dropdown__icon"])
-                  }, null, 8, ["class"])) : (a(), w(s(V), {
-                    key: 2,
-                    class: p([[{ "--open": l.value && e.dropdownIconAnimation }, y.value], "m-dropdown__icon"])
-                  }, null, 8, ["class"]))
-                ])
-              ]),
-              key: "0"
-            }
-          ]), 1040, ["aria-labelledby", "color", "disabled", "block", "size"])
-        ])
-      ], 40, ue),
-      S(ne, { name: "maz-scale-fade" }, {
-        default: b(() => [
-          B(E("div", {
-            role: "menu",
-            "aria-label": "Menu",
-            class: p(["menu", [{
-              "--top": e.position.includes("top"),
-              "--left": e.position.includes("left"),
-              "--right": e.position.includes("right"),
-              "--bottom": e.position.includes("bottom")
-            }, e.menuPanelClass]]),
-            tabindex: "-1",
-            style: M(e.menuPanelStyle),
-            onFocus: t[0] || (t[0] = (o) => s(u)(!0)),
-            onBlur: t[1] || (t[1] = (o) => s(u)(!1)),
-            onMouseenter: t[2] || (t[2] = (o) => ["hover", "both"].includes(e.trigger) ? s(u)(!0) : void 0),
-            onMouseleave: t[3] || (t[3] = (o) => ["hover", "both"].includes(e.trigger) ? s(u)(!1) : void 0)
-          }, [
-            d(e.$slots, "dropdown", { items: e.items }, () => [
-              (a(!0), v(te, null, le(e.items, (o, c) => d(e.$slots, "menuitem", {
-                key: c,
-                item: o
-              }, () => [
-                Q(o) ? (a(), w(s(U), C({
-                  key: 0,
-                  target: o.href ? o.target ?? "_self" : void 0,
-                  to: o.to,
-                  href: o.href,
-                  color: o.color ?? "theme",
-                  ref_for: !0
-                }, o, {
-                  "underline-only-hover": o.underlineOnlyHover ?? !1,
-                  class: ["menuitem", [
-                    {
-                      "--is-keyboard-selected": r.value === c
-                    },
-                    o.class
-                  ]],
-                  tabindex: "-1",
-                  onClick: h(k, ["stop"])
-                }), {
-                  default: b(() => [
-                    d(e.$slots, "menuitem-label", { item: o }, () => [
-                      g(z(o.label), 1)
-                    ])
-                  ]),
-                  _: 2
-                }, 1040, ["target", "to", "href", "color", "underline-only-hover", "class"])) : J(o) ? (a(), v("button", C({
-                  key: 1,
-                  tabindex: "-1",
-                  type: "button",
-                  ref_for: !0
-                }, o, {
-                  class: ["menuitem menuitem__button", [
-                    {
-                      "--is-keyboard-selected": r.value === c
-                    },
-                    o.class,
-                    `--${o.color ?? "theme"}`
-                  ]],
-                  onClick: h((Z) => W(o, Z), ["stop"])
-                }), [
-                  d(e.$slots, "menuitem-label", { item: o }, () => [
-                    g(z(o.label), 1)
-                  ])
-                ], 16, pe)) : O("", !0)
-              ])), 128))
-            ])
-          ], 38), [
-            [re, l.value]
-          ])
-        ]),
-        _: 3
-      })
-    ], 14, de)), [
-      [s(ie), H]
-    ]);
-  }
-});
-export {
-  we as _
-};
-//# sourceMappingURL=MazDropdown.vue_vue_type_script_setup_true_lang.B5kO0VJW.mjs.map

package/dist/chunks/MazDropdown.vue_vue_type_script_setup_true_lang.B5kO0VJW.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"MazDropdown.vue_vue_type_script_setup_true_lang.B5kO0VJW.mjs","sources":["../../src/components/MazDropdown.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { RouteLocationRaw } from 'vue-router'\nimport type { MazLinkProps } from './MazLink.vue'\nimport type { Color, Icon, Position, Size } from './types'\nimport { computed, defineAsyncComponent, type HTMLAttributes, ref, watch } from 'vue'\nimport { useInstanceUniqId } from '../composables/useInstanceUniqId'\nimport { vClickOutside } from '../directives/vClickOutside'\nimport { debounce } from '../helpers/debounce'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<MazDropdownProps>(), {\n  class: undefined,\n  style: undefined,\n  id: undefined,\n  items: () => [],\n  trigger: 'both',\n  color: 'transparent',\n  position: 'bottom left',\n  screenReaderDescription: 'Open menu dropdown',\n  dropdownIconAnimation: true,\n  size: 'md',\n})\nconst emits = defineEmits<{\n  /**\n   * emitted when a menu item is clicked\n   * @property {Event} event - the click event\n   */\n  'menuitem-clicked': [event: Event]\n  /**\n   * Triggers when the number changes\n   * @property {boolean} open new value\n   */\n  'update:open': [value: boolean]\n}>()\n\nconst MazBtn = defineAsyncComponent(() => import('./MazBtn.vue'))\nconst MazIcon = defineAsyncComponent(() => import('./MazIcon.vue'))\nconst MazLink = defineAsyncComponent(() => import('./MazLink.vue'))\n\nconst instanceId = useInstanceUniqId({\n  componentName: 'MazDropdown',\n  providedId: props.id,\n})\n\ntype ItemBase = Record<string, unknown> & {\n  label: string\n  class?: unknown\n  color?: Color\n}\n\ntype LinkItem = ItemBase & MazLinkProps & {\n  target?: string\n  href?: string\n  to?: RouteLocationRaw\n}\n\ntype ActionItem = ItemBase & {\n  action?: () => unknown\n}\n\nexport type MenuItem =\n  | (LinkItem & { action?: never })\n  | (ActionItem & { href?: never, to?: never, target?: never })\n\nexport interface MazDropdownProps {\n  /** Style object */\n  style?: HTMLAttributes['style']\n  /** Class name */\n  class?: HTMLAttributes['class']\n  /**\n   * Menu items\n   * @default '[]'\n   */\n  items?: MenuItem[]\n  /** Menu should be open? */\n  open?: boolean\n  /** id of the menu */\n  id?: string\n  /**\n   * Should open the dropdown on click, hover or both\n   * @default 'both'\n   */\n  trigger?: 'click' | 'hover' | 'both'\n  /**\n   * Button color\n   * @default 'transparent'\n   */\n  color?: Color\n  /**\n   * Position of the dropdown\n   * @default 'bottom left'\n   */\n  position?: Position\n  /** Disable close menu on menuitem clicked */\n  noCloseOnClick?: boolean\n  /** Disable menu */\n  disabled?: boolean\n  /** Remove chevron icon in main button */\n  noChevron?: boolean\n  /**\n   * Description read by screen reader (accessibility)\n   * @default 'Open menu dropdown'\n   */\n  screenReaderDescription?: string\n  /**\n   * Class for the menu panel - useful for custom dropdown panel (background, border, etc.)\n   */\n  menuPanelClass?: HTMLAttributes['class']\n  /**\n   * Style for the menu panel - useful for custom dropdown panel (background, border, etc.)\n   * You may use `!important` to override the default style\n   */\n  menuPanelStyle?: HTMLAttributes['style']\n  /**\n   * If true, the button will have a full width\n   */\n  block?: boolean\n  /**\n   * Custom dropdown icon\n   * You can use a string to define the icon name or a Vue component\n   * @default undefined\n   */\n  dropdownIcon?: string | Icon\n  /**\n   * If true, the dropdown icon will rotate when the dropdown is open\n   * @default true\n   */\n  dropdownIconAnimation?: boolean\n  /**\n   * Size of the button\n   * @default 'md'\n   */\n  size?: Size\n}\n\nconst ChevronDownIcon = defineAsyncComponent(() => import('../../icons/chevron-down.svg'))\n\nconst dropdownOpen = ref(props.open)\nconst keyboardSelectedIndex = ref<number>()\n\nconst iconClassSize = computed(() => {\n  if (props.size === 'xl')\n    return 'maz-text-lg'\n  if (props.size === 'lg')\n    return 'maz-text-base'\n  if (props.size === 'md')\n    return 'maz-text-base'\n  if (props.size === 'sm')\n    return 'maz-text-base'\n  if (props.size === 'xs')\n    return 'maz-text-sm'\n  if (props.size === 'mini')\n    return 'maz-text-sm'\n  return 'maz-text-lg'\n})\n\nconst setDropdownDebounced = debounce((value: boolean) => {\n  setDropdown(value)\n}, 200)\n\nfunction onClickOutside() {\n  if (dropdownOpen.value) {\n    setDropdown(false)\n  }\n}\n\nfunction toggleDropdown() {\n  setDropdown(!dropdownOpen.value)\n}\n\nfunction onElementClick() {\n  if (['click'].includes(props.trigger))\n    toggleDropdown()\n}\nfunction onElementFocus() {\n  if (['hover', 'both'].includes(props.trigger))\n    setDropdown(true)\n}\nfunction onElementMouseenter() {\n  if (['hover', 'both'].includes(props.trigger)) {\n    if (dropdownOpen.value === false) {\n      setDropdown(true)\n    }\n    else {\n      setDropdownDebounced(true)\n    }\n  }\n}\nfunction onElementMouseleave() {\n  if (['hover', 'both'].includes(props.trigger)) {\n    setDropdownDebounced(false)\n  }\n}\nfunction onElementBlur() {\n  setDropdownDebounced(false)\n}\n\nfunction setDropdown(value: boolean) {\n  if (props.disabled)\n    return\n\n  dropdownOpen.value = value\n  emits('update:open', value)\n}\n\nfunction isActionItem(item: MenuItem): item is ActionItem {\n  return 'action' in item\n}\n\nfunction isLinkItem(item: MenuItem): item is LinkItem {\n  return 'href' in item || 'to' in item\n}\n\nasync function runAction(item: ActionItem, event: Event) {\n  emits('menuitem-clicked', event)\n\n  await item.action?.()\n\n  if (!props.noCloseOnClick) {\n    closeOnClick()\n  }\n}\n\nfunction closeOnClick() {\n  if (props.noCloseOnClick === false)\n    setDropdown(false)\n}\n\nfunction keydownHandler(event: KeyboardEvent) {\n  if (event.key === 'Escape') {\n    event.preventDefault()\n    setDropdown(false)\n  }\n  else if (['ArrowDown', 'ArrowUp'].includes(event.key)) {\n    arrowHandler(event)\n  }\n  else if (event.key === 'Enter' && typeof keyboardSelectedIndex.value === 'number') {\n    event.preventDefault()\n    const item = document.querySelectorAll(`#${instanceId.value} .menuitem`)[\n      keyboardSelectedIndex.value\n    ] as HTMLElement\n\n    item.click()\n\n    closeOnClick()\n  }\n}\n\nfunction keyboardOpenDropdown(event: KeyboardEvent) {\n  if (['ArrowDown', 'ArrowUp', 'Enter'].includes(event.key) && dropdownOpen.value === false) {\n    event.preventDefault()\n    setDropdown(true)\n  }\n}\n\nfunction arrowHandler(event: KeyboardEvent) {\n  event.preventDefault()\n  const code = event.key\n\n  if (!dropdownOpen.value)\n    setDropdown(true)\n\n  const itemLength = props.items?.length\n\n  if (!itemLength)\n    return\n\n  if (typeof keyboardSelectedIndex.value === 'number') {\n    if (keyboardSelectedIndex.value === itemLength - 1 && code === 'ArrowDown') {\n      keyboardSelectedIndex.value = 0\n    }\n    else if (keyboardSelectedIndex.value === 0 && code === 'ArrowUp') {\n      keyboardSelectedIndex.value = itemLength - 1\n    }\n    else {\n      keyboardSelectedIndex.value\n          = code === 'ArrowDown' ? keyboardSelectedIndex.value + 1 : keyboardSelectedIndex.value - 1\n    }\n  }\n  else {\n    keyboardSelectedIndex.value = code === 'ArrowDown' ? 0 : itemLength - 1\n  }\n}\n\nwatch(\n  () => dropdownOpen.value,\n  (value) => {\n    if (value) {\n      document.addEventListener('keydown', keydownHandler)\n    }\n    else {\n      document.removeEventListener('keydown', keydownHandler)\n    }\n\n    keyboardSelectedIndex.value = undefined\n  },\n)\nwatch(\n  () => props.open,\n  value => setDropdown(value),\n)\n</script>\n\n<template>\n  <div\n    :id=\"instanceId\"\n    v-click-outside=\"onClickOutside\"\n    class=\"m-dropdown m-reset-css\"\n    :style\n    :class=\"[props.class, { '--block': block }]\"\n  >\n    <div\n      role=\"button\"\n      tabindex=\"0\"\n      class=\"m-dropdown__wrapper\"\n      :aria-expanded=\"dropdownOpen\"\n      aria-haspopup=\"menu\"\n      @click.stop=\"onElementClick\"\n      @focus=\"onElementFocus\"\n      @blur=\"onElementBlur\"\n      @keydown=\"keyboardOpenDropdown\"\n      @mouseenter=\"onElementMouseenter\"\n      @mouseleave=\"onElementMouseleave\"\n    >\n      <span v-if=\"screenReaderDescription || $slots['screen-reader-description']\" :id=\"`${instanceId}-labelspan`\" class=\"maz-sr-only\">\n        <!-- @slot Description for screen reader (hidden) -->\n        <slot name=\"screen-reader-description\">\n          {{ screenReaderDescription }}\n        </slot>\n      </span>\n      <!--\n        @slot Custom Element\n          @binding {Boolen} is-open - dropdown open state\n          @default `<MazBtn />`\n      -->\n      <slot name=\"element\" :is-open=\"dropdownOpen\">\n        <MazBtn\n          :aria-labelledby=\"`${instanceId}-labelspan`\"\n          :color\n          :disabled\n          v-bind=\"$attrs\"\n          tabindex=\"-1\"\n          :block\n          :size\n        >\n          <slot />\n\n          <template v-if=\"!noChevron\" #right-icon>\n            <!--\n              @slot Custom dropdown icon\n                @binding {Boolean} is-open - dropdown open state\n                @default `<ChevronDownIcon />`\n            -->\n            <slot name=\"dropdown-icon\" :is-open=\"dropdownOpen\">\n              <MazIcon v-if=\"typeof dropdownIcon === 'string'\" :name=\"dropdownIcon\" :class=\"[{ '--open': dropdownOpen && dropdownIconAnimation }, iconClassSize]\" />\n              <Component\n                :is=\"dropdownIcon\" v-else-if=\"dropdownIcon\" :class=\"[{ '--open': dropdownOpen && dropdownIconAnimation }, iconClassSize]\"\n                class=\"m-dropdown__icon\"\n              />\n              <ChevronDownIcon\n                v-else\n                :class=\"[{ '--open': dropdownOpen && dropdownIconAnimation }, iconClassSize]\"\n                class=\"m-dropdown__icon\"\n              />\n            </slot>\n          </template>\n        </MazBtn>\n      </slot>\n    </div>\n\n    <Transition name=\"maz-scale-fade\">\n      <div\n        v-show=\"dropdownOpen\"\n        role=\"menu\"\n        aria-label=\"Menu\"\n        class=\"menu\"\n        tabindex=\"-1\"\n        :class=\"[{\n          '--top': position.includes('top'),\n          '--left': position.includes('left'),\n          '--right': position.includes('right'),\n          '--bottom': position.includes('bottom'),\n        }, menuPanelClass]\"\n        :style=\"menuPanelStyle\"\n        @focus=\"setDropdownDebounced(true)\"\n        @blur=\"setDropdownDebounced(false)\"\n        @mouseenter=\"['hover', 'both'].includes(trigger) ? setDropdownDebounced(true) : undefined\"\n        @mouseleave=\"['hover', 'both'].includes(trigger) ? setDropdownDebounced(false) : undefined\"\n      >\n        <!--\n          @slot Custom dropdown panel\n            @binding {Array} items - items prop data\n        -->\n        <slot name=\"dropdown\" :items=\"items\">\n          <template v-for=\"(item, index) in items\" :key=\"index\">\n            <!--\n              @slot Custom menu item\n                @binding {MenuItem} item - menu item\n            -->\n            <slot name=\"menuitem\" :item=\"item\">\n              <template v-if=\"isLinkItem(item)\">\n                <MazLink\n                  :target=\"item.href ? item.target ?? '_self' : undefined\"\n                  :to=\"item.to\"\n                  :href=\"item.href\"\n                  :color=\"item.color ?? 'theme'\"\n                  v-bind=\"item\"\n                  :underline-only-hover=\"item.underlineOnlyHover ?? false\"\n                  class=\"menuitem\"\n                  tabindex=\"-1\"\n                  :class=\"[\n                    {\n                      '--is-keyboard-selected': keyboardSelectedIndex === index,\n                    },\n                    item.class,\n                  ]\"\n                  @click.stop=\"closeOnClick\"\n                >\n                  <!--\n                    @slot Custom label for menu item\n                      @binding {MenuItem} - item menu item\n                  -->\n                  <slot name=\"menuitem-label\" :item=\"item\">\n                    {{ item.label }}\n                  </slot>\n                </MazLink>\n              </template>\n              <template v-else-if=\"isActionItem(item)\">\n                <button\n                  tabindex=\"-1\"\n                  type=\"button\"\n                  v-bind=\"item\"\n                  class=\"menuitem menuitem__button\"\n                  :class=\"[\n                    {\n                      '--is-keyboard-selected': keyboardSelectedIndex === index,\n                    },\n                    item.class,\n                    `--${item.color ?? 'theme'}`,\n                  ]\"\n                  @click.stop=\"runAction(item, $event)\"\n                >\n                  <slot name=\"menuitem-label\" :item=\"item\">\n                    {{ item.label }}\n                  </slot>\n                </button>\n              </template>\n            </slot>\n          </template>\n        </slot>\n      </div>\n    </Transition>\n  </div>\n</template>\n\n<style lang=\"postcss\">\n  .m-dropdown {\n  @apply maz-relative maz-inline-flex maz-flex-col maz-items-start maz-align-top;\n\n  &.--block {\n    @apply maz-w-full;\n  }\n\n  & [aria-expanded='true'].m-btn {\n    @apply maz-bg-color-light;\n  }\n\n  &__wrapper {\n    @apply maz-h-full maz-w-full maz-outline-none;\n  }\n\n  &__icon {\n    @apply maz-transition-transform maz-duration-200 maz-ease-in-out;\n\n    &.--open {\n      @apply maz-rotate-180;\n    }\n  }\n\n  .menu {\n    @apply maz-absolute maz-z-default-backdrop maz-flex maz-min-h-max maz-min-w-max maz-flex-col maz-gap-0.5 maz-overflow-auto maz-rounded maz-bg-color maz-p-2 maz-elevation dark:maz-border dark:maz-border-color-light;\n\n    &.--top:not(.--right, .--left) {\n      @apply maz-bottom-full maz-mb-1 maz-origin-bottom;\n    }\n\n    &.--bottom:not(.--right, .--left) {\n      @apply maz-top-full maz-mt-1 maz-origin-top;\n    }\n\n    &.--left:not(.--top, .--bottom) {\n      @apply maz-right-full maz-mr-1 maz-origin-top-right;\n    }\n\n    &.--right:not(.--top, .--bottom) {\n      @apply maz-left-full maz-ml-1 maz-origin-top-left;\n    }\n\n    &.--top.--right {\n      @apply maz-bottom-full maz-right-0 maz-mb-1 maz-origin-bottom-right;\n    }\n\n    &.--top.--left {\n      @apply maz-bottom-full maz-left-0 maz-mb-1 maz-origin-bottom-left;\n    }\n\n    &.--bottom.--left {\n      @apply maz-left-0 maz-top-full maz-mt-1 maz-origin-top-left;\n    }\n\n    &.--bottom.--right {\n      @apply maz-right-0 maz-top-full maz-mt-1 maz-origin-top-right;\n    }\n\n    .menuitem {\n      @apply maz-cursor-pointer maz-whitespace-nowrap maz-rounded maz-px-4 maz-py-2 maz-text-start maz-outline-none maz-transition-colors maz-duration-300 maz-ease-in-out focus-within:maz-bg-color-light hover:maz-bg-color-light;\n\n      &.--is-keyboard-selected {\n        @apply maz-bg-color-light;\n      }\n\n      &.menuitem__button {\n        &:disabled {\n          @apply maz-cursor-not-allowed maz-opacity-50;\n        }\n\n        &.--primary {\n          @apply maz-text-primary hover:maz-text-primary-600;\n        }\n\n        &.--secondary {\n          @apply maz-text-secondary hover:maz-text-secondary-600;\n        }\n\n        &.--info {\n          @apply maz-text-info hover:maz-text-info-600;\n        }\n\n        &.--warning {\n          @apply maz-text-warning-600 hover:maz-text-warning-800;\n        }\n\n        &.--danger {\n          @apply maz-text-danger-600 hover:maz-text-danger-800;\n        }\n\n        &.--success {\n          @apply maz-text-success-600 hover:maz-text-success-800;\n        }\n\n        &.--white {\n          @apply maz-text-white hover:maz-text-gray-300;\n        }\n\n        &.--black {\n          @apply maz-text-black hover:maz-text-gray-800;\n        }\n\n        &.--theme {\n          @apply maz-text-normal hover:maz-text-black dark:hover:maz-text-white;\n        }\n      }\n    }\n  }\n}\n</style>\n"],"names":["props","__props","emits","__emit","MazBtn","defineAsyncComponent","MazIcon","MazLink","instanceId","useInstanceUniqId","ChevronDownIcon","dropdownOpen","ref","keyboardSelectedIndex","iconClassSize","computed","setDropdownDebounced","debounce","value","setDropdown","onClickOutside","toggleDropdown","onElementClick","onElementFocus","onElementMouseenter","onElementMouseleave","onElementBlur","isActionItem","item","isLinkItem","runAction","event","_a","closeOnClick","keydownHandler","arrowHandler","keyboardOpenDropdown","code","itemLength","watch"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,UAAMA,IAAQC,GAYRC,IAAQC,GAaRC,IAASC,EAAqB,MAAM,OAAO,0BAAc,CAAC,GAC1DC,IAAUD,EAAqB,MAAM,OAAO,2BAAe,CAAC,GAC5DE,IAAUF,EAAqB,MAAM,OAAO,2BAAe,CAAC,GAE5DG,IAAaC,GAAkB;AAAA,MACnC,eAAe;AAAA,MACf,YAAYT,EAAM;AAAA,IAAA,CACnB,GA6FKU,IAAkBL,EAAqB,MAAM,OAAO,6BAA8B,CAAC,GAEnFM,IAAeC,EAAIZ,EAAM,IAAI,GAC7Ba,IAAwBD,EAAY,GAEpCE,IAAgBC,EAAS,MACzBf,EAAM,SAAS,OACV,gBACLA,EAAM,SAAS,QAEfA,EAAM,SAAS,QAEfA,EAAM,SAAS,OACV,kBACLA,EAAM,SAAS,QAEfA,EAAM,SAAS,SACV,gBACF,aACR,GAEKgB,IAAuBC,GAAS,CAACC,MAAmB;AACxD,MAAAC,EAAYD,CAAK;AAAA,OAChB,GAAG;AAEN,aAASE,IAAiB;AACxB,MAAIT,EAAa,SACfQ,EAAY,EAAK;AAAA,IACnB;AAGF,aAASE,IAAiB;AACZ,MAAAF,EAAA,CAACR,EAAa,KAAK;AAAA,IAAA;AAGjC,aAASW,IAAiB;AACxB,MAAI,CAAC,OAAO,EAAE,SAAStB,EAAM,OAAO,KACnBqB,EAAA;AAAA,IAAA;AAEnB,aAASE,IAAiB;AACxB,MAAI,CAAC,SAAS,MAAM,EAAE,SAASvB,EAAM,OAAO,KAC1CmB,EAAY,EAAI;AAAA,IAAA;AAEpB,aAASK,IAAsB;AAC7B,MAAI,CAAC,SAAS,MAAM,EAAE,SAASxB,EAAM,OAAO,MACtCW,EAAa,UAAU,KACzBQ,EAAY,EAAI,IAGhBH,EAAqB,EAAI;AAAA,IAE7B;AAEF,aAASS,IAAsB;AAC7B,MAAI,CAAC,SAAS,MAAM,EAAE,SAASzB,EAAM,OAAO,KAC1CgB,EAAqB,EAAK;AAAA,IAC5B;AAEF,aAASU,IAAgB;AACvB,MAAAV,EAAqB,EAAK;AAAA,IAAA;AAG5B,aAASG,EAAYD,GAAgB;AACnC,MAAIlB,EAAM,aAGVW,EAAa,QAAQO,GACrBhB,EAAM,eAAegB,CAAK;AAAA,IAAA;AAG5B,aAASS,EAAaC,GAAoC;AACxD,aAAO,YAAYA;AAAA,IAAA;AAGrB,aAASC,EAAWD,GAAkC;AAC7C,aAAA,UAAUA,KAAQ,QAAQA;AAAA,IAAA;AAGpB,mBAAAE,EAAUF,GAAkBG,GAAc;;AACvD,MAAA7B,EAAM,oBAAoB6B,CAAK,GAE/B,QAAMC,IAAAJ,EAAK,WAAL,gBAAAI,EAAA,KAAAJ,KAED5B,EAAM,kBACIiC,EAAA;AAAA,IACf;AAGF,aAASA,IAAe;AACtB,MAAIjC,EAAM,mBAAmB,MAC3BmB,EAAY,EAAK;AAAA,IAAA;AAGrB,aAASe,EAAeH,GAAsB;AACxC,MAAAA,EAAM,QAAQ,YAChBA,EAAM,eAAe,GACrBZ,EAAY,EAAK,KAEV,CAAC,aAAa,SAAS,EAAE,SAASY,EAAM,GAAG,IAClDI,EAAaJ,CAAK,IAEXA,EAAM,QAAQ,WAAW,OAAOlB,EAAsB,SAAU,aACvEkB,EAAM,eAAe,GACR,SAAS,iBAAiB,IAAIvB,EAAW,KAAK,YAAY,EACrEK,EAAsB,KACxB,EAEK,MAAM,GAEEoB,EAAA;AAAA,IACf;AAGF,aAASG,EAAqBL,GAAsB;AAC9C,MAAA,CAAC,aAAa,WAAW,OAAO,EAAE,SAASA,EAAM,GAAG,KAAKpB,EAAa,UAAU,OAClFoB,EAAM,eAAe,GACrBZ,EAAY,EAAI;AAAA,IAClB;AAGF,aAASgB,EAAaJ,GAAsB;;AAC1C,MAAAA,EAAM,eAAe;AACrB,YAAMM,IAAON,EAAM;AAEnB,MAAKpB,EAAa,SAChBQ,EAAY,EAAI;AAEZ,YAAAmB,KAAaN,IAAAhC,EAAM,UAAN,gBAAAgC,EAAa;AAEhC,MAAKM,MAGD,OAAOzB,EAAsB,SAAU,WACrCA,EAAsB,UAAUyB,IAAa,KAAKD,MAAS,cAC7DxB,EAAsB,QAAQ,IAEvBA,EAAsB,UAAU,KAAKwB,MAAS,YACrDxB,EAAsB,QAAQyB,IAAa,IAG3CzB,EAAsB,QAChBwB,MAAS,cAAcxB,EAAsB,QAAQ,IAAIA,EAAsB,QAAQ,IAI/FA,EAAsB,QAAQwB,MAAS,cAAc,IAAIC,IAAa;AAAA,IACxE;AAGF,WAAAC;AAAA,MACE,MAAM5B,EAAa;AAAA,MACnB,CAACO,MAAU;AACT,QAAIA,IACO,SAAA,iBAAiB,WAAWgB,CAAc,IAG1C,SAAA,oBAAoB,WAAWA,CAAc,GAGxDrB,EAAsB,QAAQ;AAAA,MAAA;AAAA,IAElC,GACA0B;AAAA,MACE,MAAMvC,EAAM;AAAA,MACZ,CAAAkB,MAASC,EAAYD,CAAK;AAAA,IAC5B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/chunks/MazDropdown.vue_vue_type_script_setup_true_lang.DLWmXVjB.cjs

@@ -1,2 +0,0 @@
-"use strict";const e=require("vue"),P=require("../composables/useInstanceUniqId.cjs"),N=require("../directives/vClickOutside.cjs"),V=require("../helpers/debounce.cjs"),L=["id"],U=["aria-expanded"],F=["id"],T=["onClick"],H=e.defineComponent({inheritAttrs:!1,__name:"MazDropdown",props:{style:{default:void 0},class:{default:void 0},items:{default:()=>[]},open:{type:Boolean},id:{default:void 0},trigger:{default:"both"},color:{default:"transparent"},position:{default:"bottom left"},noCloseOnClick:{type:Boolean},disabled:{type:Boolean},noChevron:{type:Boolean},screenReaderDescription:{default:"Open menu dropdown"},menuPanelClass:{},menuPanelStyle:{},block:{type:Boolean},dropdownIcon:{},dropdownIconAnimation:{type:Boolean,default:!0},size:{default:"md"}},emits:["menuitem-clicked","update:open"],setup(v,{emit:k}){const r=v,p=k,w=e.defineAsyncComponent(()=>Promise.resolve().then(()=>require("../components/MazBtn.cjs"))),y=e.defineAsyncComponent(()=>Promise.resolve().then(()=>require("../components/MazIcon.cjs"))),b=e.defineAsyncComponent(()=>Promise.resolve().then(()=>require("../components/MazLink.cjs"))),d=P.useInstanceUniqId({componentName:"MazDropdown",providedId:r.id}),h=e.defineAsyncComponent(()=>Promise.resolve().then(()=>require("./chevron-down.DdnENkzR.cjs"))),l=e.ref(r.open),s=e.ref(),c=e.computed(()=>r.size==="xl"?"maz-text-lg":r.size==="lg"||r.size==="md"||r.size==="sm"?"maz-text-base":r.size==="xs"||r.size==="mini"?"maz-text-sm":"maz-text-lg"),a=V.debounce(o=>{i(o)},200);function C(){l.value&&i(!1)}function g(){i(!l.value)}function z(){["click"].includes(r.trigger)&&g()}function B(){["hover","both"].includes(r.trigger)&&i(!0)}function D(){["hover","both"].includes(r.trigger)&&(l.value===!1?i(!0):a(!0))}function A(){["hover","both"].includes(r.trigger)&&a(!1)}function I(){a(!1)}function i(o){r.disabled||(l.value=o,p("update:open",o))}function S(o){return"action"in o}function $(o){return"href"in o||"to"in o}async function E(o,t){var n;p("menuitem-clicked",t),await((n=o.action)==null?void 0:n.call(o)),r.noCloseOnClick||f()}function f(){r.noCloseOnClick===!1&&i(!1)}function m(o){o.key==="Escape"?(o.preventDefault(),i(!1)):["ArrowDown","ArrowUp"].includes(o.key)?O(o):o.key==="Enter"&&typeof s.value=="number"&&(o.preventDefault(),document.querySelectorAll(`#${d.value} .menuitem`)[s.value].click(),f())}function M(o){["ArrowDown","ArrowUp","Enter"].includes(o.key)&&l.value===!1&&(o.preventDefault(),i(!0))}function O(o){var u;o.preventDefault();const t=o.key;l.value||i(!0);const n=(u=r.items)==null?void 0:u.length;n&&(typeof s.value=="number"?s.value===n-1&&t==="ArrowDown"?s.value=0:s.value===0&&t==="ArrowUp"?s.value=n-1:s.value=t==="ArrowDown"?s.value+1:s.value-1:s.value=t==="ArrowDown"?0:n-1)}return e.watch(()=>l.value,o=>{o?document.addEventListener("keydown",m):document.removeEventListener("keydown",m),s.value=void 0}),e.watch(()=>r.open,o=>i(o)),(o,t)=>e.withDirectives((e.openBlock(),e.createElementBlock("div",{id:e.unref(d),class:e.normalizeClass(["m-dropdown m-reset-css",[r.class,{"--block":o.block}]]),style:e.normalizeStyle(o.style)},[e.createElementVNode("div",{role:"button",tabindex:"0",class:"m-dropdown__wrapper","aria-expanded":l.value,"aria-haspopup":"menu",onClick:e.withModifiers(z,["stop"]),onFocus:B,onBlur:I,onKeydown:M,onMouseenter:D,onMouseleave:A},[o.screenReaderDescription||o.$slots["screen-reader-description"]?(e.openBlock(),e.createElementBlock("span",{key:0,id:`${e.unref(d)}-labelspan`,class:"maz-sr-only"},[e.renderSlot(o.$slots,"screen-reader-description",{},()=>[e.createTextVNode(e.toDisplayString(o.screenReaderDescription),1)])],8,F)):e.createCommentVNode("",!0),e.renderSlot(o.$slots,"element",{isOpen:l.value},()=>[e.createVNode(e.unref(w),e.mergeProps({"aria-labelledby":`${e.unref(d)}-labelspan`,color:o.color,disabled:o.disabled},o.$attrs,{tabindex:"-1",block:o.block,size:o.size}),e.createSlots({default:e.withCtx(()=>[e.renderSlot(o.$slots,"default")]),_:2},[o.noChevron?void 0:{name:"right-icon",fn:e.withCtx(()=>[e.renderSlot(o.$slots,"dropdown-icon",{isOpen:l.value},()=>[typeof o.dropdownIcon=="string"?(e.openBlock(),e.createBlock(e.unref(y),{key:0,name:o.dropdownIcon,class:e.normalizeClass([{"--open":l.value&&o.dropdownIconAnimation},c.value])},null,8,["name","class"])):o.dropdownIcon?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(o.dropdownIcon),{key:1,class:e.normalizeClass([[{"--open":l.value&&o.dropdownIconAnimation},c.value],"m-dropdown__icon"])},null,8,["class"])):(e.openBlock(),e.createBlock(e.unref(h),{key:2,class:e.normalizeClass([[{"--open":l.value&&o.dropdownIconAnimation},c.value],"m-dropdown__icon"])},null,8,["class"]))])]),key:"0"}]),1040,["aria-labelledby","color","disabled","block","size"])])],40,U),e.createVNode(e.Transition,{name:"maz-scale-fade"},{default:e.withCtx(()=>[e.withDirectives(e.createElementVNode("div",{role:"menu","aria-label":"Menu",class:e.normalizeClass(["menu",[{"--top":o.position.includes("top"),"--left":o.position.includes("left"),"--right":o.position.includes("right"),"--bottom":o.position.includes("bottom")},o.menuPanelClass]]),tabindex:"-1",style:e.normalizeStyle(o.menuPanelStyle),onFocus:t[0]||(t[0]=n=>e.unref(a)(!0)),onBlur:t[1]||(t[1]=n=>e.unref(a)(!1)),onMouseenter:t[2]||(t[2]=n=>["hover","both"].includes(o.trigger)?e.unref(a)(!0):void 0),onMouseleave:t[3]||(t[3]=n=>["hover","both"].includes(o.trigger)?e.unref(a)(!1):void 0)},[e.renderSlot(o.$slots,"dropdown",{items:o.items},()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.items,(n,u)=>e.renderSlot(o.$slots,"menuitem",{key:u,item:n},()=>[$(n)?(e.openBlock(),e.createBlock(e.unref(b),e.mergeProps({key:0,target:n.href?n.target??"_self":void 0,to:n.to,href:n.href,color:n.color??"theme",ref_for:!0},n,{"underline-only-hover":n.underlineOnlyHover??!1,class:["menuitem",[{"--is-keyboard-selected":s.value===u},n.class]],tabindex:"-1",onClick:e.withModifiers(f,["stop"])}),{default:e.withCtx(()=>[e.renderSlot(o.$slots,"menuitem-label",{item:n},()=>[e.createTextVNode(e.toDisplayString(n.label),1)])]),_:2},1040,["target","to","href","color","underline-only-hover","class"])):S(n)?(e.openBlock(),e.createElementBlock("button",e.mergeProps({key:1,tabindex:"-1",type:"button",ref_for:!0},n,{class:["menuitem menuitem__button",[{"--is-keyboard-selected":s.value===u},n.class,`--${n.color??"theme"}`]],onClick:e.withModifiers(q=>E(n,q),["stop"])}),[e.renderSlot(o.$slots,"menuitem-label",{item:n},()=>[e.createTextVNode(e.toDisplayString(n.label),1)])],16,T)):e.createCommentVNode("",!0)])),128))])],38),[[e.vShow,l.value]])]),_:3})],14,L)),[[e.unref(N.vClickOutside),C]])}});exports._sfc_main=H;
-//# sourceMappingURL=MazDropdown.vue_vue_type_script_setup_true_lang.DLWmXVjB.cjs.map

package/dist/chunks/MazDropdown.vue_vue_type_script_setup_true_lang.DLWmXVjB.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"MazDropdown.vue_vue_type_script_setup_true_lang.DLWmXVjB.cjs","sources":["../../src/components/MazDropdown.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { RouteLocationRaw } from 'vue-router'\nimport type { MazLinkProps } from './MazLink.vue'\nimport type { Color, Icon, Position, Size } from './types'\nimport { computed, defineAsyncComponent, type HTMLAttributes, ref, watch } from 'vue'\nimport { useInstanceUniqId } from '../composables/useInstanceUniqId'\nimport { vClickOutside } from '../directives/vClickOutside'\nimport { debounce } from '../helpers/debounce'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<MazDropdownProps>(), {\n  class: undefined,\n  style: undefined,\n  id: undefined,\n  items: () => [],\n  trigger: 'both',\n  color: 'transparent',\n  position: 'bottom left',\n  screenReaderDescription: 'Open menu dropdown',\n  dropdownIconAnimation: true,\n  size: 'md',\n})\nconst emits = defineEmits<{\n  /**\n   * emitted when a menu item is clicked\n   * @property {Event} event - the click event\n   */\n  'menuitem-clicked': [event: Event]\n  /**\n   * Triggers when the number changes\n   * @property {boolean} open new value\n   */\n  'update:open': [value: boolean]\n}>()\n\nconst MazBtn = defineAsyncComponent(() => import('./MazBtn.vue'))\nconst MazIcon = defineAsyncComponent(() => import('./MazIcon.vue'))\nconst MazLink = defineAsyncComponent(() => import('./MazLink.vue'))\n\nconst instanceId = useInstanceUniqId({\n  componentName: 'MazDropdown',\n  providedId: props.id,\n})\n\ntype ItemBase = Record<string, unknown> & {\n  label: string\n  class?: unknown\n  color?: Color\n}\n\ntype LinkItem = ItemBase & MazLinkProps & {\n  target?: string\n  href?: string\n  to?: RouteLocationRaw\n}\n\ntype ActionItem = ItemBase & {\n  action?: () => unknown\n}\n\nexport type MenuItem =\n  | (LinkItem & { action?: never })\n  | (ActionItem & { href?: never, to?: never, target?: never })\n\nexport interface MazDropdownProps {\n  /** Style object */\n  style?: HTMLAttributes['style']\n  /** Class name */\n  class?: HTMLAttributes['class']\n  /**\n   * Menu items\n   * @default '[]'\n   */\n  items?: MenuItem[]\n  /** Menu should be open? */\n  open?: boolean\n  /** id of the menu */\n  id?: string\n  /**\n   * Should open the dropdown on click, hover or both\n   * @default 'both'\n   */\n  trigger?: 'click' | 'hover' | 'both'\n  /**\n   * Button color\n   * @default 'transparent'\n   */\n  color?: Color\n  /**\n   * Position of the dropdown\n   * @default 'bottom left'\n   */\n  position?: Position\n  /** Disable close menu on menuitem clicked */\n  noCloseOnClick?: boolean\n  /** Disable menu */\n  disabled?: boolean\n  /** Remove chevron icon in main button */\n  noChevron?: boolean\n  /**\n   * Description read by screen reader (accessibility)\n   * @default 'Open menu dropdown'\n   */\n  screenReaderDescription?: string\n  /**\n   * Class for the menu panel - useful for custom dropdown panel (background, border, etc.)\n   */\n  menuPanelClass?: HTMLAttributes['class']\n  /**\n   * Style for the menu panel - useful for custom dropdown panel (background, border, etc.)\n   * You may use `!important` to override the default style\n   */\n  menuPanelStyle?: HTMLAttributes['style']\n  /**\n   * If true, the button will have a full width\n   */\n  block?: boolean\n  /**\n   * Custom dropdown icon\n   * You can use a string to define the icon name or a Vue component\n   * @default undefined\n   */\n  dropdownIcon?: string | Icon\n  /**\n   * If true, the dropdown icon will rotate when the dropdown is open\n   * @default true\n   */\n  dropdownIconAnimation?: boolean\n  /**\n   * Size of the button\n   * @default 'md'\n   */\n  size?: Size\n}\n\nconst ChevronDownIcon = defineAsyncComponent(() => import('../../icons/chevron-down.svg'))\n\nconst dropdownOpen = ref(props.open)\nconst keyboardSelectedIndex = ref<number>()\n\nconst iconClassSize = computed(() => {\n  if (props.size === 'xl')\n    return 'maz-text-lg'\n  if (props.size === 'lg')\n    return 'maz-text-base'\n  if (props.size === 'md')\n    return 'maz-text-base'\n  if (props.size === 'sm')\n    return 'maz-text-base'\n  if (props.size === 'xs')\n    return 'maz-text-sm'\n  if (props.size === 'mini')\n    return 'maz-text-sm'\n  return 'maz-text-lg'\n})\n\nconst setDropdownDebounced = debounce((value: boolean) => {\n  setDropdown(value)\n}, 200)\n\nfunction onClickOutside() {\n  if (dropdownOpen.value) {\n    setDropdown(false)\n  }\n}\n\nfunction toggleDropdown() {\n  setDropdown(!dropdownOpen.value)\n}\n\nfunction onElementClick() {\n  if (['click'].includes(props.trigger))\n    toggleDropdown()\n}\nfunction onElementFocus() {\n  if (['hover', 'both'].includes(props.trigger))\n    setDropdown(true)\n}\nfunction onElementMouseenter() {\n  if (['hover', 'both'].includes(props.trigger)) {\n    if (dropdownOpen.value === false) {\n      setDropdown(true)\n    }\n    else {\n      setDropdownDebounced(true)\n    }\n  }\n}\nfunction onElementMouseleave() {\n  if (['hover', 'both'].includes(props.trigger)) {\n    setDropdownDebounced(false)\n  }\n}\nfunction onElementBlur() {\n  setDropdownDebounced(false)\n}\n\nfunction setDropdown(value: boolean) {\n  if (props.disabled)\n    return\n\n  dropdownOpen.value = value\n  emits('update:open', value)\n}\n\nfunction isActionItem(item: MenuItem): item is ActionItem {\n  return 'action' in item\n}\n\nfunction isLinkItem(item: MenuItem): item is LinkItem {\n  return 'href' in item || 'to' in item\n}\n\nasync function runAction(item: ActionItem, event: Event) {\n  emits('menuitem-clicked', event)\n\n  await item.action?.()\n\n  if (!props.noCloseOnClick) {\n    closeOnClick()\n  }\n}\n\nfunction closeOnClick() {\n  if (props.noCloseOnClick === false)\n    setDropdown(false)\n}\n\nfunction keydownHandler(event: KeyboardEvent) {\n  if (event.key === 'Escape') {\n    event.preventDefault()\n    setDropdown(false)\n  }\n  else if (['ArrowDown', 'ArrowUp'].includes(event.key)) {\n    arrowHandler(event)\n  }\n  else if (event.key === 'Enter' && typeof keyboardSelectedIndex.value === 'number') {\n    event.preventDefault()\n    const item = document.querySelectorAll(`#${instanceId.value} .menuitem`)[\n      keyboardSelectedIndex.value\n    ] as HTMLElement\n\n    item.click()\n\n    closeOnClick()\n  }\n}\n\nfunction keyboardOpenDropdown(event: KeyboardEvent) {\n  if (['ArrowDown', 'ArrowUp', 'Enter'].includes(event.key) && dropdownOpen.value === false) {\n    event.preventDefault()\n    setDropdown(true)\n  }\n}\n\nfunction arrowHandler(event: KeyboardEvent) {\n  event.preventDefault()\n  const code = event.key\n\n  if (!dropdownOpen.value)\n    setDropdown(true)\n\n  const itemLength = props.items?.length\n\n  if (!itemLength)\n    return\n\n  if (typeof keyboardSelectedIndex.value === 'number') {\n    if (keyboardSelectedIndex.value === itemLength - 1 && code === 'ArrowDown') {\n      keyboardSelectedIndex.value = 0\n    }\n    else if (keyboardSelectedIndex.value === 0 && code === 'ArrowUp') {\n      keyboardSelectedIndex.value = itemLength - 1\n    }\n    else {\n      keyboardSelectedIndex.value\n          = code === 'ArrowDown' ? keyboardSelectedIndex.value + 1 : keyboardSelectedIndex.value - 1\n    }\n  }\n  else {\n    keyboardSelectedIndex.value = code === 'ArrowDown' ? 0 : itemLength - 1\n  }\n}\n\nwatch(\n  () => dropdownOpen.value,\n  (value) => {\n    if (value) {\n      document.addEventListener('keydown', keydownHandler)\n    }\n    else {\n      document.removeEventListener('keydown', keydownHandler)\n    }\n\n    keyboardSelectedIndex.value = undefined\n  },\n)\nwatch(\n  () => props.open,\n  value => setDropdown(value),\n)\n</script>\n\n<template>\n  <div\n    :id=\"instanceId\"\n    v-click-outside=\"onClickOutside\"\n    class=\"m-dropdown m-reset-css\"\n    :style\n    :class=\"[props.class, { '--block': block }]\"\n  >\n    <div\n      role=\"button\"\n      tabindex=\"0\"\n      class=\"m-dropdown__wrapper\"\n      :aria-expanded=\"dropdownOpen\"\n      aria-haspopup=\"menu\"\n      @click.stop=\"onElementClick\"\n      @focus=\"onElementFocus\"\n      @blur=\"onElementBlur\"\n      @keydown=\"keyboardOpenDropdown\"\n      @mouseenter=\"onElementMouseenter\"\n      @mouseleave=\"onElementMouseleave\"\n    >\n      <span v-if=\"screenReaderDescription || $slots['screen-reader-description']\" :id=\"`${instanceId}-labelspan`\" class=\"maz-sr-only\">\n        <!-- @slot Description for screen reader (hidden) -->\n        <slot name=\"screen-reader-description\">\n          {{ screenReaderDescription }}\n        </slot>\n      </span>\n      <!--\n        @slot Custom Element\n          @binding {Boolen} is-open - dropdown open state\n          @default `<MazBtn />`\n      -->\n      <slot name=\"element\" :is-open=\"dropdownOpen\">\n        <MazBtn\n          :aria-labelledby=\"`${instanceId}-labelspan`\"\n          :color\n          :disabled\n          v-bind=\"$attrs\"\n          tabindex=\"-1\"\n          :block\n          :size\n        >\n          <slot />\n\n          <template v-if=\"!noChevron\" #right-icon>\n            <!--\n              @slot Custom dropdown icon\n                @binding {Boolean} is-open - dropdown open state\n                @default `<ChevronDownIcon />`\n            -->\n            <slot name=\"dropdown-icon\" :is-open=\"dropdownOpen\">\n              <MazIcon v-if=\"typeof dropdownIcon === 'string'\" :name=\"dropdownIcon\" :class=\"[{ '--open': dropdownOpen && dropdownIconAnimation }, iconClassSize]\" />\n              <Component\n                :is=\"dropdownIcon\" v-else-if=\"dropdownIcon\" :class=\"[{ '--open': dropdownOpen && dropdownIconAnimation }, iconClassSize]\"\n                class=\"m-dropdown__icon\"\n              />\n              <ChevronDownIcon\n                v-else\n                :class=\"[{ '--open': dropdownOpen && dropdownIconAnimation }, iconClassSize]\"\n                class=\"m-dropdown__icon\"\n              />\n            </slot>\n          </template>\n        </MazBtn>\n      </slot>\n    </div>\n\n    <Transition name=\"maz-scale-fade\">\n      <div\n        v-show=\"dropdownOpen\"\n        role=\"menu\"\n        aria-label=\"Menu\"\n        class=\"menu\"\n        tabindex=\"-1\"\n        :class=\"[{\n          '--top': position.includes('top'),\n          '--left': position.includes('left'),\n          '--right': position.includes('right'),\n          '--bottom': position.includes('bottom'),\n        }, menuPanelClass]\"\n        :style=\"menuPanelStyle\"\n        @focus=\"setDropdownDebounced(true)\"\n        @blur=\"setDropdownDebounced(false)\"\n        @mouseenter=\"['hover', 'both'].includes(trigger) ? setDropdownDebounced(true) : undefined\"\n        @mouseleave=\"['hover', 'both'].includes(trigger) ? setDropdownDebounced(false) : undefined\"\n      >\n        <!--\n          @slot Custom dropdown panel\n            @binding {Array} items - items prop data\n        -->\n        <slot name=\"dropdown\" :items=\"items\">\n          <template v-for=\"(item, index) in items\" :key=\"index\">\n            <!--\n              @slot Custom menu item\n                @binding {MenuItem} item - menu item\n            -->\n            <slot name=\"menuitem\" :item=\"item\">\n              <template v-if=\"isLinkItem(item)\">\n                <MazLink\n                  :target=\"item.href ? item.target ?? '_self' : undefined\"\n                  :to=\"item.to\"\n                  :href=\"item.href\"\n                  :color=\"item.color ?? 'theme'\"\n                  v-bind=\"item\"\n                  :underline-only-hover=\"item.underlineOnlyHover ?? false\"\n                  class=\"menuitem\"\n                  tabindex=\"-1\"\n                  :class=\"[\n                    {\n                      '--is-keyboard-selected': keyboardSelectedIndex === index,\n                    },\n                    item.class,\n                  ]\"\n                  @click.stop=\"closeOnClick\"\n                >\n                  <!--\n                    @slot Custom label for menu item\n                      @binding {MenuItem} - item menu item\n                  -->\n                  <slot name=\"menuitem-label\" :item=\"item\">\n                    {{ item.label }}\n                  </slot>\n                </MazLink>\n              </template>\n              <template v-else-if=\"isActionItem(item)\">\n                <button\n                  tabindex=\"-1\"\n                  type=\"button\"\n                  v-bind=\"item\"\n                  class=\"menuitem menuitem__button\"\n                  :class=\"[\n                    {\n                      '--is-keyboard-selected': keyboardSelectedIndex === index,\n                    },\n                    item.class,\n                    `--${item.color ?? 'theme'}`,\n                  ]\"\n                  @click.stop=\"runAction(item, $event)\"\n                >\n                  <slot name=\"menuitem-label\" :item=\"item\">\n                    {{ item.label }}\n                  </slot>\n                </button>\n              </template>\n            </slot>\n          </template>\n        </slot>\n      </div>\n    </Transition>\n  </div>\n</template>\n\n<style lang=\"postcss\">\n  .m-dropdown {\n  @apply maz-relative maz-inline-flex maz-flex-col maz-items-start maz-align-top;\n\n  &.--block {\n    @apply maz-w-full;\n  }\n\n  & [aria-expanded='true'].m-btn {\n    @apply maz-bg-color-light;\n  }\n\n  &__wrapper {\n    @apply maz-h-full maz-w-full maz-outline-none;\n  }\n\n  &__icon {\n    @apply maz-transition-transform maz-duration-200 maz-ease-in-out;\n\n    &.--open {\n      @apply maz-rotate-180;\n    }\n  }\n\n  .menu {\n    @apply maz-absolute maz-z-default-backdrop maz-flex maz-min-h-max maz-min-w-max maz-flex-col maz-gap-0.5 maz-overflow-auto maz-rounded maz-bg-color maz-p-2 maz-elevation dark:maz-border dark:maz-border-color-light;\n\n    &.--top:not(.--right, .--left) {\n      @apply maz-bottom-full maz-mb-1 maz-origin-bottom;\n    }\n\n    &.--bottom:not(.--right, .--left) {\n      @apply maz-top-full maz-mt-1 maz-origin-top;\n    }\n\n    &.--left:not(.--top, .--bottom) {\n      @apply maz-right-full maz-mr-1 maz-origin-top-right;\n    }\n\n    &.--right:not(.--top, .--bottom) {\n      @apply maz-left-full maz-ml-1 maz-origin-top-left;\n    }\n\n    &.--top.--right {\n      @apply maz-bottom-full maz-right-0 maz-mb-1 maz-origin-bottom-right;\n    }\n\n    &.--top.--left {\n      @apply maz-bottom-full maz-left-0 maz-mb-1 maz-origin-bottom-left;\n    }\n\n    &.--bottom.--left {\n      @apply maz-left-0 maz-top-full maz-mt-1 maz-origin-top-left;\n    }\n\n    &.--bottom.--right {\n      @apply maz-right-0 maz-top-full maz-mt-1 maz-origin-top-right;\n    }\n\n    .menuitem {\n      @apply maz-cursor-pointer maz-whitespace-nowrap maz-rounded maz-px-4 maz-py-2 maz-text-start maz-outline-none maz-transition-colors maz-duration-300 maz-ease-in-out focus-within:maz-bg-color-light hover:maz-bg-color-light;\n\n      &.--is-keyboard-selected {\n        @apply maz-bg-color-light;\n      }\n\n      &.menuitem__button {\n        &:disabled {\n          @apply maz-cursor-not-allowed maz-opacity-50;\n        }\n\n        &.--primary {\n          @apply maz-text-primary hover:maz-text-primary-600;\n        }\n\n        &.--secondary {\n          @apply maz-text-secondary hover:maz-text-secondary-600;\n        }\n\n        &.--info {\n          @apply maz-text-info hover:maz-text-info-600;\n        }\n\n        &.--warning {\n          @apply maz-text-warning-600 hover:maz-text-warning-800;\n        }\n\n        &.--danger {\n          @apply maz-text-danger-600 hover:maz-text-danger-800;\n        }\n\n        &.--success {\n          @apply maz-text-success-600 hover:maz-text-success-800;\n        }\n\n        &.--white {\n          @apply maz-text-white hover:maz-text-gray-300;\n        }\n\n        &.--black {\n          @apply maz-text-black hover:maz-text-gray-800;\n        }\n\n        &.--theme {\n          @apply maz-text-normal hover:maz-text-black dark:hover:maz-text-white;\n        }\n      }\n    }\n  }\n}\n</style>\n"],"names":["props","__props","emits","__emit","MazBtn","defineAsyncComponent","MazIcon","MazLink","instanceId","useInstanceUniqId","ChevronDownIcon","dropdownOpen","ref","keyboardSelectedIndex","iconClassSize","computed","setDropdownDebounced","debounce","value","setDropdown","onClickOutside","toggleDropdown","onElementClick","onElementFocus","onElementMouseenter","onElementMouseleave","onElementBlur","isActionItem","item","isLinkItem","runAction","event","_a","closeOnClick","keydownHandler","arrowHandler","keyboardOpenDropdown","code","itemLength","watch"],"mappings":"izBAaA,MAAMA,EAAQC,EAYRC,EAAQC,EAaRC,EAASC,EAAAA,qBAAqB,IAAM,QAAA,QAAA,EAAA,KAAA,IAAA,QAAO,0BAAc,CAAA,CAAC,EAC1DC,EAAUD,EAAAA,qBAAqB,IAAM,QAAA,QAAA,EAAA,KAAA,IAAA,QAAO,2BAAe,CAAA,CAAC,EAC5DE,EAAUF,EAAAA,qBAAqB,IAAM,QAAA,QAAA,EAAA,KAAA,IAAA,QAAO,2BAAe,CAAA,CAAC,EAE5DG,EAAaC,EAAAA,kBAAkB,CACnC,cAAe,cACf,WAAYT,EAAM,EAAA,CACnB,EA6FKU,EAAkBL,EAAAA,qBAAqB,IAAM,QAAA,QAAA,EAAA,KAAA,IAAA,QAAO,6BAA8B,CAAA,CAAC,EAEnFM,EAAeC,EAAAA,IAAIZ,EAAM,IAAI,EAC7Ba,EAAwBD,EAAAA,IAAY,EAEpCE,EAAgBC,EAAAA,SAAS,IACzBf,EAAM,OAAS,KACV,cACLA,EAAM,OAAS,MAEfA,EAAM,OAAS,MAEfA,EAAM,OAAS,KACV,gBACLA,EAAM,OAAS,MAEfA,EAAM,OAAS,OACV,cACF,aACR,EAEKgB,EAAuBC,WAAUC,GAAmB,CACxDC,EAAYD,CAAK,GAChB,GAAG,EAEN,SAASE,GAAiB,CACpBT,EAAa,OACfQ,EAAY,EAAK,CACnB,CAGF,SAASE,GAAiB,CACZF,EAAA,CAACR,EAAa,KAAK,CAAA,CAGjC,SAASW,GAAiB,CACpB,CAAC,OAAO,EAAE,SAAStB,EAAM,OAAO,GACnBqB,EAAA,CAAA,CAEnB,SAASE,GAAiB,CACpB,CAAC,QAAS,MAAM,EAAE,SAASvB,EAAM,OAAO,GAC1CmB,EAAY,EAAI,CAAA,CAEpB,SAASK,GAAsB,CACzB,CAAC,QAAS,MAAM,EAAE,SAASxB,EAAM,OAAO,IACtCW,EAAa,QAAU,GACzBQ,EAAY,EAAI,EAGhBH,EAAqB,EAAI,EAE7B,CAEF,SAASS,GAAsB,CACzB,CAAC,QAAS,MAAM,EAAE,SAASzB,EAAM,OAAO,GAC1CgB,EAAqB,EAAK,CAC5B,CAEF,SAASU,GAAgB,CACvBV,EAAqB,EAAK,CAAA,CAG5B,SAASG,EAAYD,EAAgB,CAC/BlB,EAAM,WAGVW,EAAa,MAAQO,EACrBhB,EAAM,cAAegB,CAAK,EAAA,CAG5B,SAASS,EAAaC,EAAoC,CACxD,MAAO,WAAYA,CAAA,CAGrB,SAASC,EAAWD,EAAkC,CAC7C,MAAA,SAAUA,GAAQ,OAAQA,CAAA,CAGpB,eAAAE,EAAUF,EAAkBG,EAAc,OACvD7B,EAAM,mBAAoB6B,CAAK,EAE/B,OAAMC,EAAAJ,EAAK,SAAL,YAAAI,EAAA,KAAAJ,IAED5B,EAAM,gBACIiC,EAAA,CACf,CAGF,SAASA,GAAe,CAClBjC,EAAM,iBAAmB,IAC3BmB,EAAY,EAAK,CAAA,CAGrB,SAASe,EAAeH,EAAsB,CACxCA,EAAM,MAAQ,UAChBA,EAAM,eAAe,EACrBZ,EAAY,EAAK,GAEV,CAAC,YAAa,SAAS,EAAE,SAASY,EAAM,GAAG,EAClDI,EAAaJ,CAAK,EAEXA,EAAM,MAAQ,SAAW,OAAOlB,EAAsB,OAAU,WACvEkB,EAAM,eAAe,EACR,SAAS,iBAAiB,IAAIvB,EAAW,KAAK,YAAY,EACrEK,EAAsB,KACxB,EAEK,MAAM,EAEEoB,EAAA,EACf,CAGF,SAASG,EAAqBL,EAAsB,CAC9C,CAAC,YAAa,UAAW,OAAO,EAAE,SAASA,EAAM,GAAG,GAAKpB,EAAa,QAAU,KAClFoB,EAAM,eAAe,EACrBZ,EAAY,EAAI,EAClB,CAGF,SAASgB,EAAaJ,EAAsB,OAC1CA,EAAM,eAAe,EACrB,MAAMM,EAAON,EAAM,IAEdpB,EAAa,OAChBQ,EAAY,EAAI,EAEZ,MAAAmB,GAAaN,EAAAhC,EAAM,QAAN,YAAAgC,EAAa,OAE3BM,IAGD,OAAOzB,EAAsB,OAAU,SACrCA,EAAsB,QAAUyB,EAAa,GAAKD,IAAS,YAC7DxB,EAAsB,MAAQ,EAEvBA,EAAsB,QAAU,GAAKwB,IAAS,UACrDxB,EAAsB,MAAQyB,EAAa,EAG3CzB,EAAsB,MAChBwB,IAAS,YAAcxB,EAAsB,MAAQ,EAAIA,EAAsB,MAAQ,EAI/FA,EAAsB,MAAQwB,IAAS,YAAc,EAAIC,EAAa,EACxE,CAGFC,OAAAA,EAAA,MACE,IAAM5B,EAAa,MAClBO,GAAU,CACLA,EACO,SAAA,iBAAiB,UAAWgB,CAAc,EAG1C,SAAA,oBAAoB,UAAWA,CAAc,EAGxDrB,EAAsB,MAAQ,MAAA,CAElC,EACA0B,EAAA,MACE,IAAMvC,EAAM,KACZkB,GAASC,EAAYD,CAAK,CAC5B"}

package/dist/chunks/MazIcon.vue_vue_type_script_setup_true_lang.C5NwBerh.cjs

@@ -1,2 +0,0 @@
-"use strict";const o=require("vue"),_=require("../helpers/injectStrict.cjs"),z=["innerHTML"],T=o.defineComponent({__name:"MazIcon",props:{src:{type:String,default:void 0},path:{type:String,default:void 0},name:{type:String,default:void 0},size:{type:String,default:void 0},title:{type:String,default:void 0},transformSource:{type:Function,default:a=>a}},emits:["loaded","unloaded","error"],setup(a,{emit:v}){const s=a,d=v,c={},i=o.ref(),f=o.ref();function p(){try{return _.injectStrict("mazIconPath")}catch{return}}const m=o.computed(()=>s.path??p()),g=o.computed(()=>s.src?s.src:m.value?`${m.value}/${s.name}.svg`:`/${s.name}.svg`);o.onMounted(()=>{!s.name&&!s.src&&console.error('[maz-ui](MazIcon) you should provide "name" or "src" as prop')});function S(e,r){const t=e.querySelectorAll("title");if(t.length>0)t[0].textContent=r;else{const n=document.createElementNS("http://www.w3.org/2000/svg","title");n.textContent=r,e.append(n)}}function h(e){return Object.keys(e).reduce((r,t)=>(e[t]!==!1&&e[t]!==null&&e[t]!==void 0&&(r[t]=e[t]),r),{})}function w(e){const r={},t=e.attributes;if(!t)return r;for(let n=t.length-1;n>=0;n--)r[t[n].name]=t[n].value;return r}function y(e){e.cloneNode(!0);const r=s.transformSource(e);return s.title&&S(r,s.title),e.innerHTML}async function E(e){c[e]||(c[e]=M(e));try{i.value=await c[e],await o.nextTick(),d("loaded",f.value)}catch(r){i.value&&(i.value=void 0,d("unloaded")),delete c[e],d("error",r)}}function M(e){return new Promise((r,t)=>{const n=new XMLHttpRequest;n.open("GET",e,!0),n.addEventListener("load",()=>{if(n.status>=200&&n.status<400)try{let u=new DOMParser().parseFromString(n.responseText,"text/xml").querySelectorAll("svg")[0];u?(u=s.transformSource(u),r(u)):t(new Error('Loaded file is not valid SVG"'))}catch(l){t(l)}else t(new Error("Error loading SVG"))}),n.addEventListener("error",l=>t(l)),n.send()})}return o.watchEffect(()=>E(g.value)),(e,r)=>i.value?(o.openBlock(),o.createElementBlock("svg",o.mergeProps({key:0,ref_key:"svgElem",ref:f,class:"m-icon m-reset-css",width:"1em",height:"1em"},{...w(i.value),...h(e.$attrs)},{style:`font-size: ${a.size}`,innerHTML:y(i.value)}),null,16,z)):o.createCommentVNode("",!0)}});exports._sfc_main=T;
-//# sourceMappingURL=MazIcon.vue_vue_type_script_setup_true_lang.C5NwBerh.cjs.map

package/dist/chunks/MazIcon.vue_vue_type_script_setup_true_lang.C5NwBerh.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"MazIcon.vue_vue_type_script_setup_true_lang.C5NwBerh.cjs","sources":["../../src/components/MazIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed, nextTick, onMounted, type PropType, ref, watchEffect } from 'vue'\n\nimport { injectStrict } from '../helpers/injectStrict'\n\nconst props = defineProps({\n  /** The source path of the SVG file - e.g: `/icons/home.svg` */\n  src: { type: String, default: undefined },\n  /** The path of the folder where the SVG files are stored - e.g: `/icons` */\n  path: { type: String, default: undefined },\n  /** The name of the SVG file - e.g: `home` */\n  name: { type: String, default: undefined },\n  /** The size of the SVG file - e.g: `1em` */\n  size: { type: String, default: undefined },\n  /** The title of the SVG file - e.g: `Home` */\n  title: { type: String, default: undefined },\n  /** The function to transform the source of the SVG file - e.g: `(svg) => svg` */\n  transformSource: {\n    type: Function as PropType<(param: SVGElement) => typeof param>,\n    default: (svg: SVGElement) => svg,\n  },\n})\nconst emits = defineEmits<{\n  /**\n   * emitted when SVG file is loaded\n   * @property {SVGElement | undefined} svg the svg element loaded\n   */\n  (event: 'loaded', svg: SVGElement | undefined): void\n  /**\n   * emitted when SVG file is not loaded\n   */\n  (event: 'unloaded'): void\n  /**\n   * emitted when SVG file is not loaded\n   * @property {Error} error the error\n   */\n  (event: 'error', error: Error): void\n}>()\nconst cache: Record<string, Promise<SVGElement>> = {}\nconst svgElSource = ref<SVGElement>()\nconst svgElem = ref<SVGElement>()\n\nfunction getMazIconPath() {\n  try {\n    return injectStrict<string>('mazIconPath')\n  }\n  catch {\n    return undefined\n  }\n}\n\nconst iconPath = computed(() => props.path ?? getMazIconPath())\nconst fullSrc = computed(() => {\n  if (props.src) {\n    return props.src\n  }\n  else if (iconPath.value) {\n    return `${iconPath.value}/${props.name}.svg`\n  }\n  else {\n    return `/${props.name}.svg`\n  }\n})\n\nonMounted(() => {\n  if (!props.name && !props.src) {\n    console.error('[maz-ui](MazIcon) you should provide \"name\" or \"src\" as prop')\n  }\n})\n\nfunction setTitle(svg: SVGElement, title: string) {\n  const titleTags = svg.querySelectorAll('title')\n  if (titleTags.length > 0) {\n    // overwrite existing title\n    titleTags[0].textContent = title\n  }\n  else {\n    // create a title element if one doesn't already exist\n    const titleEl = document.createElementNS('http://www.w3.org/2000/svg', 'title')\n    titleEl.textContent = title\n    svg.append(titleEl)\n  }\n}\n\nfunction filterAttrs(attrs: Record<string, unknown>) {\n  return Object.keys(attrs).reduce((result, key) => {\n    if (attrs[key] !== false && attrs[key] !== null && attrs[key] !== undefined) {\n      result[key] = attrs[key]\n    }\n    return result\n  }, {})\n}\n\nfunction getSvgAttrs(svgEl: SVGElement) {\n  // copy attrs\n  const svgAttrs = {}\n  const attrs = svgEl.attributes\n  if (!attrs) {\n    return svgAttrs\n  }\n  for (let i = attrs.length - 1; i >= 0; i--) {\n    svgAttrs[attrs[i].name] = attrs[i].value\n  }\n  return svgAttrs\n}\n\nfunction getSvgContent(svgEl: SVGElement) {\n  svgEl.cloneNode(true)\n  const svgElNode = props.transformSource(svgEl)\n\n  if (props.title) {\n    setTitle(svgElNode as SVGElement, props.title)\n  }\n\n  // copy inner html\n  return svgEl.innerHTML\n}\n\nasync function getSource(src: string) {\n  // fill cache by src with promise\n  if (!cache[src]) {\n    // download\n    cache[src] = download(src)\n  }\n\n  // inline svg when cached promise resolves\n  try {\n    svgElSource.value = await cache[src]\n    // wait to render\n    await nextTick()\n    emits('loaded', svgElem.value)\n  }\n  catch (error) {\n    if (svgElSource.value) {\n      svgElSource.value = undefined\n      emits('unloaded')\n    }\n    // remove cached rejected promise so next image can try load again\n    delete cache[src]\n    emits('error', error as Error)\n  }\n}\n\nfunction download(url: string): Promise<SVGElement> {\n  return new Promise((resolve, reject) => {\n    const request = new XMLHttpRequest()\n    request.open('GET', url, true)\n\n    request.addEventListener('load', () => {\n      if (request.status >= 200 && request.status < 400) {\n        try {\n          // Setup a parser to convert the response to text/xml in order for it to be manipulated and changed\n          const parser = new DOMParser()\n          const result = parser.parseFromString(request.responseText, 'text/xml')\n          let svgEl = result.querySelectorAll('svg')[0] as SVGElement\n          if (svgEl) {\n            svgEl = props.transformSource(svgEl)\n            resolve(svgEl)\n          }\n          else {\n            reject(new Error('Loaded file is not valid SVG\"'))\n          }\n        }\n        catch (error) {\n          reject(error)\n        }\n      }\n      else {\n        reject(new Error('Error loading SVG'))\n      }\n    })\n\n    request.addEventListener('error', error => reject(error))\n    request.send()\n  })\n}\n\nwatchEffect(() => getSource(fullSrc.value))\n</script>\n\n<template>\n  <svg\n    v-if=\"svgElSource\"\n    ref=\"svgElem\"\n    class=\"m-icon m-reset-css\"\n    width=\"1em\"\n    height=\"1em\"\n    v-bind=\"{\n      ...getSvgAttrs(svgElSource),\n      ...filterAttrs($attrs),\n    }\"\n    :style=\"`font-size: ${size}`\"\n    v-html=\"getSvgContent(svgElSource)\"\n  />\n</template>\n"],"names":["props","__props","emits","__emit","cache","svgElSource","ref","svgElem","getMazIconPath","injectStrict","iconPath","computed","fullSrc","onMounted","setTitle","svg","title","titleTags","titleEl","filterAttrs","attrs","result","key","getSvgAttrs","svgEl","svgAttrs","i","getSvgContent","svgElNode","getSource","src","download","nextTick","error","url","resolve","reject","request","watchEffect"],"mappings":"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"}

package/dist/chunks/MazIcon.vue_vue_type_script_setup_true_lang.CLoEj0Zf.mjs

@@ -1,104 +0,0 @@
-import { defineComponent as T, ref as m, computed as v, onMounted as x, watchEffect as L, openBlock as _, createElementBlock as P, mergeProps as A, createCommentVNode as C, nextTick as $ } from "vue";
-import { injectStrict as q } from "../helpers/injectStrict.mjs";
-const H = ["innerHTML"], V = /* @__PURE__ */ T({
-  __name: "MazIcon",
-  props: {
-    /** The source path of the SVG file - e.g: `/icons/home.svg` */
-    src: { type: String, default: void 0 },
-    /** The path of the folder where the SVG files are stored - e.g: `/icons` */
-    path: { type: String, default: void 0 },
-    /** The name of the SVG file - e.g: `home` */
-    name: { type: String, default: void 0 },
-    /** The size of the SVG file - e.g: `1em` */
-    size: { type: String, default: void 0 },
-    /** The title of the SVG file - e.g: `Home` */
-    title: { type: String, default: void 0 },
-    /** The function to transform the source of the SVG file - e.g: `(svg) => svg` */
-    transformSource: {
-      type: Function,
-      default: (i) => i
-    }
-  },
-  emits: ["loaded", "unloaded", "error"],
-  setup(i, { emit: p }) {
-    const o = i, u = p, a = {}, s = m(), d = m();
-    function g() {
-      try {
-        return q("mazIconPath");
-      } catch {
-        return;
-      }
-    }
-    const f = v(() => o.path ?? g()), S = v(() => o.src ? o.src : f.value ? `${f.value}/${o.name}.svg` : `/${o.name}.svg`);
-    x(() => {
-      !o.name && !o.src && console.error('[maz-ui](MazIcon) you should provide "name" or "src" as prop');
-    });
-    function h(e, r) {
-      const t = e.querySelectorAll("title");
-      if (t.length > 0)
-        t[0].textContent = r;
-      else {
-        const n = document.createElementNS("http://www.w3.org/2000/svg", "title");
-        n.textContent = r, e.append(n);
-      }
-    }
-    function w(e) {
-      return Object.keys(e).reduce((r, t) => (e[t] !== !1 && e[t] !== null && e[t] !== void 0 && (r[t] = e[t]), r), {});
-    }
-    function y(e) {
-      const r = {}, t = e.attributes;
-      if (!t)
-        return r;
-      for (let n = t.length - 1; n >= 0; n--)
-        r[t[n].name] = t[n].value;
-      return r;
-    }
-    function E(e) {
-      e.cloneNode(!0);
-      const r = o.transformSource(e);
-      return o.title && h(r, o.title), e.innerHTML;
-    }
-    async function M(e) {
-      a[e] || (a[e] = z(e));
-      try {
-        s.value = await a[e], await $(), u("loaded", d.value);
-      } catch (r) {
-        s.value && (s.value = void 0, u("unloaded")), delete a[e], u("error", r);
-      }
-    }
-    function z(e) {
-      return new Promise((r, t) => {
-        const n = new XMLHttpRequest();
-        n.open("GET", e, !0), n.addEventListener("load", () => {
-          if (n.status >= 200 && n.status < 400)
-            try {
-              let c = new DOMParser().parseFromString(n.responseText, "text/xml").querySelectorAll("svg")[0];
-              c ? (c = o.transformSource(c), r(c)) : t(new Error('Loaded file is not valid SVG"'));
-            } catch (l) {
-              t(l);
-            }
-          else
-            t(new Error("Error loading SVG"));
-        }), n.addEventListener("error", (l) => t(l)), n.send();
-      });
-    }
-    return L(() => M(S.value)), (e, r) => s.value ? (_(), P("svg", A({
-      key: 0,
-      ref_key: "svgElem",
-      ref: d,
-      class: "m-icon m-reset-css",
-      width: "1em",
-      height: "1em"
-    }, {
-      ...y(s.value),
-      ...w(e.$attrs)
-    }, {
-      style: `font-size: ${i.size}`,
-      innerHTML: E(s.value)
-    }), null, 16, H)) : C("", !0);
-  }
-});
-export {
-  V as _
-};
-//# sourceMappingURL=MazIcon.vue_vue_type_script_setup_true_lang.CLoEj0Zf.mjs.map

package/dist/chunks/MazIcon.vue_vue_type_script_setup_true_lang.CLoEj0Zf.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"MazIcon.vue_vue_type_script_setup_true_lang.CLoEj0Zf.mjs","sources":["../../src/components/MazIcon.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed, nextTick, onMounted, type PropType, ref, watchEffect } from 'vue'\n\nimport { injectStrict } from '../helpers/injectStrict'\n\nconst props = defineProps({\n  /** The source path of the SVG file - e.g: `/icons/home.svg` */\n  src: { type: String, default: undefined },\n  /** The path of the folder where the SVG files are stored - e.g: `/icons` */\n  path: { type: String, default: undefined },\n  /** The name of the SVG file - e.g: `home` */\n  name: { type: String, default: undefined },\n  /** The size of the SVG file - e.g: `1em` */\n  size: { type: String, default: undefined },\n  /** The title of the SVG file - e.g: `Home` */\n  title: { type: String, default: undefined },\n  /** The function to transform the source of the SVG file - e.g: `(svg) => svg` */\n  transformSource: {\n    type: Function as PropType<(param: SVGElement) => typeof param>,\n    default: (svg: SVGElement) => svg,\n  },\n})\nconst emits = defineEmits<{\n  /**\n   * emitted when SVG file is loaded\n   * @property {SVGElement | undefined} svg the svg element loaded\n   */\n  (event: 'loaded', svg: SVGElement | undefined): void\n  /**\n   * emitted when SVG file is not loaded\n   */\n  (event: 'unloaded'): void\n  /**\n   * emitted when SVG file is not loaded\n   * @property {Error} error the error\n   */\n  (event: 'error', error: Error): void\n}>()\nconst cache: Record<string, Promise<SVGElement>> = {}\nconst svgElSource = ref<SVGElement>()\nconst svgElem = ref<SVGElement>()\n\nfunction getMazIconPath() {\n  try {\n    return injectStrict<string>('mazIconPath')\n  }\n  catch {\n    return undefined\n  }\n}\n\nconst iconPath = computed(() => props.path ?? getMazIconPath())\nconst fullSrc = computed(() => {\n  if (props.src) {\n    return props.src\n  }\n  else if (iconPath.value) {\n    return `${iconPath.value}/${props.name}.svg`\n  }\n  else {\n    return `/${props.name}.svg`\n  }\n})\n\nonMounted(() => {\n  if (!props.name && !props.src) {\n    console.error('[maz-ui](MazIcon) you should provide \"name\" or \"src\" as prop')\n  }\n})\n\nfunction setTitle(svg: SVGElement, title: string) {\n  const titleTags = svg.querySelectorAll('title')\n  if (titleTags.length > 0) {\n    // overwrite existing title\n    titleTags[0].textContent = title\n  }\n  else {\n    // create a title element if one doesn't already exist\n    const titleEl = document.createElementNS('http://www.w3.org/2000/svg', 'title')\n    titleEl.textContent = title\n    svg.append(titleEl)\n  }\n}\n\nfunction filterAttrs(attrs: Record<string, unknown>) {\n  return Object.keys(attrs).reduce((result, key) => {\n    if (attrs[key] !== false && attrs[key] !== null && attrs[key] !== undefined) {\n      result[key] = attrs[key]\n    }\n    return result\n  }, {})\n}\n\nfunction getSvgAttrs(svgEl: SVGElement) {\n  // copy attrs\n  const svgAttrs = {}\n  const attrs = svgEl.attributes\n  if (!attrs) {\n    return svgAttrs\n  }\n  for (let i = attrs.length - 1; i >= 0; i--) {\n    svgAttrs[attrs[i].name] = attrs[i].value\n  }\n  return svgAttrs\n}\n\nfunction getSvgContent(svgEl: SVGElement) {\n  svgEl.cloneNode(true)\n  const svgElNode = props.transformSource(svgEl)\n\n  if (props.title) {\n    setTitle(svgElNode as SVGElement, props.title)\n  }\n\n  // copy inner html\n  return svgEl.innerHTML\n}\n\nasync function getSource(src: string) {\n  // fill cache by src with promise\n  if (!cache[src]) {\n    // download\n    cache[src] = download(src)\n  }\n\n  // inline svg when cached promise resolves\n  try {\n    svgElSource.value = await cache[src]\n    // wait to render\n    await nextTick()\n    emits('loaded', svgElem.value)\n  }\n  catch (error) {\n    if (svgElSource.value) {\n      svgElSource.value = undefined\n      emits('unloaded')\n    }\n    // remove cached rejected promise so next image can try load again\n    delete cache[src]\n    emits('error', error as Error)\n  }\n}\n\nfunction download(url: string): Promise<SVGElement> {\n  return new Promise((resolve, reject) => {\n    const request = new XMLHttpRequest()\n    request.open('GET', url, true)\n\n    request.addEventListener('load', () => {\n      if (request.status >= 200 && request.status < 400) {\n        try {\n          // Setup a parser to convert the response to text/xml in order for it to be manipulated and changed\n          const parser = new DOMParser()\n          const result = parser.parseFromString(request.responseText, 'text/xml')\n          let svgEl = result.querySelectorAll('svg')[0] as SVGElement\n          if (svgEl) {\n            svgEl = props.transformSource(svgEl)\n            resolve(svgEl)\n          }\n          else {\n            reject(new Error('Loaded file is not valid SVG\"'))\n          }\n        }\n        catch (error) {\n          reject(error)\n        }\n      }\n      else {\n        reject(new Error('Error loading SVG'))\n      }\n    })\n\n    request.addEventListener('error', error => reject(error))\n    request.send()\n  })\n}\n\nwatchEffect(() => getSource(fullSrc.value))\n</script>\n\n<template>\n  <svg\n    v-if=\"svgElSource\"\n    ref=\"svgElem\"\n    class=\"m-icon m-reset-css\"\n    width=\"1em\"\n    height=\"1em\"\n    v-bind=\"{\n      ...getSvgAttrs(svgElSource),\n      ...filterAttrs($attrs),\n    }\"\n    :style=\"`font-size: ${size}`\"\n    v-html=\"getSvgContent(svgElSource)\"\n  />\n</template>\n"],"names":["props","__props","emits","__emit","cache","svgElSource","ref","svgElem","getMazIconPath","injectStrict","iconPath","computed","fullSrc","onMounted","setTitle","svg","title","titleTags","titleEl","filterAttrs","attrs","result","key","getSvgAttrs","svgEl","svgAttrs","i","getSvgContent","svgElNode","getSource","src","download","nextTick","error","url","resolve","reject","request","watchEffect"],"mappings":"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"}

package/dist/chunks/MazInputNumber.vue_vue_type_script_setup_true_lang.BM2uHjda.cjs

@@ -1,2 +0,0 @@
-"use strict";const n=require("vue"),z=require("../helpers/debounce.cjs"),C=require("../components/MazInput.cjs"),N=n.defineComponent({inheritAttrs:!1,__name:"MazInputNumber",props:{style:{default:void 0},class:{default:void 0},modelValue:{default:void 0},disabled:{type:Boolean,default:!1},max:{default:Number.POSITIVE_INFINITY},min:{default:Number.NEGATIVE_INFINITY},step:{default:1},size:{default:"md"},noButtons:{type:Boolean,default:!1},textCenter:{type:Boolean,default:!0},inputmode:{default:"numeric"},block:{type:Boolean},error:{type:Boolean},hint:{},success:{type:Boolean},warning:{type:Boolean}},emits:["update:model-value","focus","blur","click","change"],setup(p,{emit:c}){const t=p,b=c,r=n.defineAsyncComponent(()=>Promise.resolve().then(()=>require("../components/MazBtn.cjs"))),f=n.defineAsyncComponent(()=>Promise.resolve().then(()=>require("./minus.B8s20I4l.cjs"))),v=n.defineAsyncComponent(()=>Promise.resolve().then(()=>require("./plus.CbUgaWqj.cjs"))),o=n.computed({get:()=>t.modelValue,set:e=>s(e)});function y(e){return Math.round(e/t.step)*t.step}function B(e){if(typeof e=="number")return e<=t.min?t.min:e>=t.max?t.max:y(e)}const k=z.debounce(e=>s(e),300);function s(e){e=B(e),o.value!==e&&b("update:model-value",e)}s(o.value);const l=n.computed(()=>t.modelValue&&t.modelValue>=t.max),a=n.computed(()=>t.modelValue&&t.modelValue<=t.min);function m(){if(!(t.disabled||l.value)){if((o.value===void 0||o.value===null)&&Number.isFinite(t.min)){o.value=t.min;return}o.value=(o.value??0)+1*t.step}}function d(){if(!(t.disabled||a.value)){if((o.value===void 0||o.value===null)&&Number.isFinite(t.min)){o.value=t.min;return}o.value=(o.value??0)-1*t.step}}return(e,u)=>(n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(["m-input-number m-reset-css",[`m-input-number--${e.size}`,t.class,{"--block":e.block}]]),style:n.normalizeStyle(e.style)},[e.noButtons?n.createCommentVNode("",!0):(n.openBlock(),n.createBlock(n.unref(r),{key:0,color:"transparent",size:e.size,tabindex:"-1",class:"m-input-number__button m-input-number__decrement-button",disabled:a.value||e.disabled,onClick:d},{default:n.withCtx(()=>[n.createVNode(n.unref(f),{class:"m-input-number__button__icon"})]),_:1},8,["size","disabled"])),n.createVNode(C.default,n.mergeProps({"model-value":o.value,type:"number",class:["m-input-number__input",{"--no-buttons":e.noButtons,"--text-center":e.textCenter}],disabled:e.disabled,min:e.min,max:e.max,step:e.step,error:e.error,success:e.success,warning:e.warning,hint:e.hint},e.$attrs,{inputmode:e.inputmode,size:e.size,block:"",onKeydown:[n.withKeys(n.withModifiers(m,["prevent"]),["up"]),n.withKeys(n.withModifiers(d,["prevent"]),["down"])],onFocus:u[0]||(u[0]=i=>e.$emit("focus",i)),onChange:u[1]||(u[1]=i=>e.$emit("change",i)),onBlur:u[2]||(u[2]=i=>e.$emit("blur",i)),onClick:u[3]||(u[3]=i=>e.$emit("click",i)),"onUpdate:modelValue":u[4]||(u[4]=i=>n.unref(k)(i))}),null,16,["model-value","class","disabled","min","max","step","error","success","warning","hint","inputmode","size","onKeydown"]),e.noButtons?n.createCommentVNode("",!0):(n.openBlock(),n.createBlock(n.unref(r),{key:1,color:"transparent","no-shadow":"",tabindex:"-1",size:e.size,class:"m-input-number__button m-input-number__increment-button",disabled:l.value||e.disabled,onClick:m},{default:n.withCtx(()=>[n.createVNode(n.unref(v),{class:"m-input-number__button__icon"})]),_:1},8,["size","disabled"]))],6))}});exports._sfc_main=N;
-//# sourceMappingURL=MazInputNumber.vue_vue_type_script_setup_true_lang.BM2uHjda.cjs.map

package/dist/chunks/MazInputNumber.vue_vue_type_script_setup_true_lang.BM2uHjda.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"MazInputNumber.vue_vue_type_script_setup_true_lang.BM2uHjda.cjs","sources":["../../src/components/MazInputNumber.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { Size } from './types'\nimport { computed, defineAsyncComponent, type HTMLAttributes } from 'vue'\nimport { debounce } from '../helpers/debounce'\nimport MazInput from './MazInput.vue'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<MazInputNumberProps>(), {\n  style: undefined,\n  class: undefined,\n  modelValue: undefined,\n  disabled: false,\n  max: Number.POSITIVE_INFINITY,\n  min: Number.NEGATIVE_INFINITY,\n  step: 1,\n  size: 'md',\n  noButtons: false,\n  textCenter: true,\n  inputmode: 'numeric',\n})\n\nconst emits = defineEmits<{\n  /**\n   * Emitted when the input value change\n   * @property {number | undefined} value - value of the input\n   */\n  'update:model-value': [value?: number]\n  /**\n   * Emitted when the input is focused\n   * @property {Event} value - event object\n   */\n  'focus': [value: Event]\n  /**\n   * Emitted when the input is blurred\n   * @property {Event} value - event object\n   */\n  'blur': [value: Event]\n  /**\n   * Emitted input is clicked\n   * @property {Event} value - event object\n   */\n  'click': [value: Event]\n  /**\n   * Emitted when the value change\n   * @property {Event} value - event object\n   */\n  'change': [value: Event]\n}>()\n\nexport interface MazInputNumberProps {\n  /** The inline style object for the component. */\n  style?: HTMLAttributes['style']\n  /** The CSS class name for the component. */\n  class?: HTMLAttributes['class']\n  /** The value of the component (v-model). */\n  modelValue?: number\n  /** Whether the input number is disabled or not. */\n  disabled?: boolean\n  /** The maximum value allowed for the input number. */\n  max?: number\n  /** The minimum value allowed for the input number. */\n  min?: number\n  /** The step value for incrementing or decrementing the input number. */\n  step?: number\n  /** The size of the input number component. */\n  size?: Size\n  /** Whether to hide the increment and decrement buttons or not. */\n  noButtons?: boolean\n  /** Whether to center the text inside the input or not. */\n  textCenter?: boolean\n  /** The inputmode attribute for the input. */\n  inputmode?: HTMLAttributes['inputmode']\n  /** The input will be displayed in full width */\n  block?: boolean\n  /** Will display the input in error state. */\n  error?: boolean\n  /** The hint text to display below the input. */\n  hint?: string\n  /** Will display the input in success state. */\n  success?: boolean\n  /** Will display the input in warning state. */\n  warning?: boolean\n}\n\nconst MazBtn = defineAsyncComponent(() => import('./MazBtn.vue'))\nconst MinusIcon = defineAsyncComponent(() => import('../../icons/minus.svg'))\nconst PlusIcon = defineAsyncComponent(() => import('../../icons/plus.svg'))\n\nconst currentValue = computed({\n  get: () => props.modelValue,\n  set: value => emitValue(value),\n})\n\nfunction findClosestStep(number: number) {\n  return Math.round(number / props.step) * props.step\n}\n\nfunction checkValue(value?: number) {\n  if (typeof value !== 'number')\n    return\n  if (value <= props.min)\n    return props.min\n  return value >= props.max ? props.max : findClosestStep(value)\n}\n\nconst emitDebounced = debounce((value?: number) => emitValue(value), 300)\n\nfunction emitValue(newValue?: number) {\n  newValue = checkValue(newValue)\n  if (currentValue.value === newValue)\n    return\n  emits('update:model-value', newValue)\n}\n\nemitValue(currentValue.value)\n\nconst incrementDisabled = computed(() => props.modelValue && props.modelValue >= props.max)\nconst decrementDisabled = computed(() => props.modelValue && props.modelValue <= props.min)\n\nfunction increment() {\n  if (props.disabled || incrementDisabled.value)\n    return\n\n  if (\n    (currentValue.value === undefined || currentValue.value === null)\n    && Number.isFinite(props.min)\n  ) {\n    currentValue.value = props.min\n    return\n  }\n\n  currentValue.value = (currentValue.value ?? 0) + 1 * props.step\n}\nfunction decrement() {\n  if (props.disabled || decrementDisabled.value)\n    return\n\n  if (\n    (currentValue.value === undefined || currentValue.value === null)\n    && Number.isFinite(props.min)\n  ) {\n    currentValue.value = props.min\n    return\n  }\n\n  currentValue.value = (currentValue.value ?? 0) - 1 * props.step\n}\n</script>\n\n<template>\n  <div\n    class=\"m-input-number m-reset-css\"\n    :class=\"[`m-input-number--${size}`, props.class, { '--block': block }]\"\n    :style=\"style\"\n  >\n    <MazBtn\n      v-if=\"!noButtons\"\n      color=\"transparent\"\n      :size\n      tabindex=\"-1\"\n      class=\"m-input-number__button m-input-number__decrement-button\"\n      :disabled=\"decrementDisabled || disabled\"\n      @click=\"decrement\"\n    >\n      <MinusIcon class=\"m-input-number__button__icon\" />\n    </MazBtn>\n    <MazInput\n      :model-value=\"currentValue\"\n      type=\"number\"\n      class=\"m-input-number__input\"\n      :class=\"{ '--no-buttons': noButtons, '--text-center': textCenter }\"\n      :disabled\n      :min\n      :max\n      :step\n      :error\n      :success\n      :warning\n      :hint\n      v-bind=\"$attrs\"\n      :inputmode\n      :size\n      block\n      @keydown.up.prevent=\"increment\"\n      @keydown.down.prevent=\"decrement\"\n      @focus=\"$emit('focus', $event)\"\n      @change=\"$emit('change', $event)\"\n      @blur=\"$emit('blur', $event)\"\n      @click=\"$emit('click', $event)\"\n      @update:model-value=\"emitDebounced($event as number | undefined)\"\n    />\n    <MazBtn\n      v-if=\"!noButtons\"\n      color=\"transparent\"\n      no-shadow\n      tabindex=\"-1\"\n      :size\n      class=\"m-input-number__button m-input-number__increment-button\"\n      :disabled=\"incrementDisabled || disabled\"\n      @click=\"increment\"\n    >\n      <PlusIcon class=\"m-input-number__button__icon\" />\n    </MazBtn>\n  </div>\n</template>\n\n<style lang=\"postcss\">\n  .m-input-number {\n  @apply maz-inline-flex maz-align-top;\n\n  &.--block {\n    @apply maz-w-full;\n  }\n\n  &__button {\n    &.m-btn.--is-button {\n      &::before {\n        content: none !important;\n      }\n\n      &:first-child,\n      &:last-child {\n        @apply maz-border maz-border-border;\n        @apply maz-px-3 maz-py-0;\n        @apply dark:maz-border-color-lighter;\n      }\n\n      &:first-child {\n        @apply !maz-rounded-r-none;\n\n        margin-right: calc(-1 * 2px);\n      }\n\n      &:last-child {\n        @apply !maz-rounded-l-none;\n\n        margin-left: calc(-1 * 2px);\n      }\n    }\n\n    &__icon {\n      @apply maz-text-base;\n    }\n  }\n\n  &__input {\n    &:not(.--no-buttons) .m-input-wrapper {\n      @apply maz-z-1 maz-rounded-none;\n    }\n\n    &.--text-center input {\n      @apply maz-p-0 maz-text-center;\n    }\n\n    /* Chrome, Safari, Edge, Opera */\n    & input::-webkit-outer-spin-button,\n    & input::-webkit-inner-spin-button {\n      appearance: none;\n      margin: 0;\n    }\n\n    /* Firefox */\n    & input[type='number'] {\n      appearance: textfield;\n    }\n  }\n}\n</style>\n"],"names":["props","__props","emits","__emit","MazBtn","defineAsyncComponent","MinusIcon","PlusIcon","currentValue","computed","value","emitValue","findClosestStep","number","checkValue","emitDebounced","debounce","newValue","incrementDisabled","decrementDisabled","increment","decrement"],"mappings":"4qBAUA,MAAMA,EAAQC,EAcRC,EAAQC,EA+DRC,EAASC,EAAAA,qBAAqB,IAAM,QAAA,QAAA,EAAA,KAAA,IAAA,QAAO,0BAAc,CAAA,CAAC,EAC1DC,EAAYD,EAAAA,qBAAqB,IAAM,QAAA,QAAA,EAAA,KAAA,IAAA,QAAO,sBAAuB,CAAA,CAAC,EACtEE,EAAWF,EAAAA,qBAAqB,IAAM,QAAA,QAAA,EAAA,KAAA,IAAA,QAAO,qBAAsB,CAAA,CAAC,EAEpEG,EAAeC,EAAAA,SAAS,CAC5B,IAAK,IAAMT,EAAM,WACjB,IAAcU,GAAAC,EAAUD,CAAK,CAAA,CAC9B,EAED,SAASE,EAAgBC,EAAgB,CACvC,OAAO,KAAK,MAAMA,EAASb,EAAM,IAAI,EAAIA,EAAM,IAAA,CAGjD,SAASc,EAAWJ,EAAgB,CAClC,GAAI,OAAOA,GAAU,SAErB,OAAIA,GAASV,EAAM,IACVA,EAAM,IACRU,GAASV,EAAM,IAAMA,EAAM,IAAMY,EAAgBF,CAAK,CAAA,CAG/D,MAAMK,EAAgBC,EAAAA,SAAUN,GAAmBC,EAAUD,CAAK,EAAG,GAAG,EAExE,SAASC,EAAUM,EAAmB,CACpCA,EAAWH,EAAWG,CAAQ,EAC1BT,EAAa,QAAUS,GAE3Bf,EAAM,qBAAsBe,CAAQ,CAAA,CAGtCN,EAAUH,EAAa,KAAK,EAEtB,MAAAU,EAAoBT,WAAS,IAAMT,EAAM,YAAcA,EAAM,YAAcA,EAAM,GAAG,EACpFmB,EAAoBV,WAAS,IAAMT,EAAM,YAAcA,EAAM,YAAcA,EAAM,GAAG,EAE1F,SAASoB,GAAY,CACf,GAAA,EAAApB,EAAM,UAAYkB,EAAkB,OAIrC,KAAAV,EAAa,QAAU,QAAaA,EAAa,QAAU,OACzD,OAAO,SAASR,EAAM,GAAG,EAC5B,CACAQ,EAAa,MAAQR,EAAM,IAC3B,MAAA,CAGFQ,EAAa,OAASA,EAAa,OAAS,GAAK,EAAIR,EAAM,KAAA,CAE7D,SAASqB,GAAY,CACf,GAAA,EAAArB,EAAM,UAAYmB,EAAkB,OAIrC,KAAAX,EAAa,QAAU,QAAaA,EAAa,QAAU,OACzD,OAAO,SAASR,EAAM,GAAG,EAC5B,CACAQ,EAAa,MAAQR,EAAM,IAC3B,MAAA,CAGFQ,EAAa,OAASA,EAAa,OAAS,GAAK,EAAIR,EAAM,KAAA"}