@bobbykim/mcl-header 0.7.6 → 0.7.8

package/dist/mcl-header.js

@@ -1,7 +1,1455 @@
-(function(){"use strict";try{if(typeof document<"u"){var t=document.createElement("style");t.appendChild(document.createTextNode('.nav__decorator[data-v-1b1467b6]:before{content:"";position:absolute;bottom:0;left:0;height:100%;width:0;transition:width .3s linear}.nav__text:focus+.nav__decorator[data-v-1b1467b6]:before,.nav__text:hover+.nav__decorator[data-v-1b1467b6]:before{width:100%}.nav__decorator[data-v-3cd6e9eb]:before{content:"";position:absolute;bottom:0;left:0;height:100%;width:0;transition:width .3s linear}.nav__text:focus+.nav__decorator[data-v-3cd6e9eb]:before,.nav__text:hover+.nav__decorator[data-v-3cd6e9eb]:before{width:100%}.nav__decorator[data-v-94d8fa7b]:before{content:"";position:absolute;bottom:0;left:0;height:100%;width:0;transition:width .3s linear}.nav__text:focus+.nav__decorator[data-v-94d8fa7b]:before,.nav__text:hover+.nav__decorator[data-v-94d8fa7b]:before{width:100%}')),document.head.appendChild(t)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})();
-import { defineComponent as D, ref as R, computed as E, createElementBlock as c, openBlock as i, createElementVNode as n, createVNode as G, withDirectives as _, createCommentVNode as z, normalizeClass as T, toDisplayString as A, unref as B, withCtx as O, Fragment as S, renderList as X, withKeys as V, useSlots as U, createBlock as x, renderSlot as j } from "vue";
-import o, { vCollapse as q, Collapse as J, DropdownContainer as ee, DropdownContent as le, HeaderHorizontal as te, HeaderVertical as oe } from "@bobbykim/manguito-theme";
-const ne = { class: "flex flex-col w-full" }, ie = { class: "self-center" }, ae = { class: "relative pt-2xs" }, re = { class: "relative flex flex-col" }, se = ["href", "target", "onClick"], ue = /* @__PURE__ */ D({
+(function(){"use strict";try{if(typeof document<"u"){var t=document.createElement("style");t.appendChild(document.createTextNode('.nav__decorator[data-v-21c9812e]:before{content:"";position:absolute;bottom:0;left:0;height:100%;width:0;transition:width .3s linear}.nav__text:focus+.nav__decorator[data-v-21c9812e]:before,.nav__text:hover+.nav__decorator[data-v-21c9812e]:before{width:100%}.nav__decorator[data-v-f1056ea0]:before{content:"";position:absolute;bottom:0;left:0;height:100%;width:0;transition:width .3s linear}.nav__text:focus+.nav__decorator[data-v-f1056ea0]:before,.nav__text:hover+.nav__decorator[data-v-f1056ea0]:before{width:100%}.nav__decorator[data-v-d99c76b1]:before{content:"";position:absolute;bottom:0;left:0;height:100%;width:0;transition:width .3s linear}.nav__text:focus+.nav__decorator[data-v-d99c76b1]:before,.nav__text:hover+.nav__decorator[data-v-d99c76b1]:before{width:100%}')),document.head.appendChild(t)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})();
+import { defineComponent as S, computed as O, h as ae, ref as D, openBlock as n, createElementBlock as u, createElementVNode as o, withDirectives as J, normalizeClass as B, toDisplayString as G, unref as w, createCommentVNode as A, createVNode as M, withCtx as R, Fragment as N, renderList as X, withKeys as Y, useSlots as Q, createBlock as V, renderSlot as $ } from "vue";
+import r, { Collapse as Z, DropdownContainer as se, DropdownContent as ie, HeaderHorizontal as oe, HeaderVertical as ne } from "@bobbykim/manguito-theme";
+class de {
+  // body text class
+  bodyText = {
+    xs: "text-xs",
+    sm: "text-sm",
+    md: "text-md",
+    lg: "text-lg",
+    xl: "text-xl"
+  };
+  // font weight class
+  fontweight = {
+    light: "font-light",
+    normal: "font-normal",
+    bold: "font-bold"
+  };
+  // text alignment
+  textAlign = {
+    left: "text-left",
+    center: "text-center",
+    right: "text-right"
+  };
+}
+class ce {
+  // Border width class
+  borderWidth = {
+    1: "border-[1px]",
+    2: "border-[2px]",
+    3: "border-[3px]",
+    4: "border-[4px]",
+    5: "border-[5px]",
+    6: "border-[6px]",
+    7: "border-[7px]",
+    8: "border-[8px]",
+    9: "border-[9px]",
+    10: "border-[10px]",
+    11: "border-[11px]",
+    12: "border-[12px]"
+  };
+  borderXWidth = {
+    1: "border-x-[1px]",
+    2: "border-x-[2px]",
+    3: "border-x-[3px]",
+    4: "border-x-[4px]",
+    5: "border-x-[5px]",
+    6: "border-x-[6px]",
+    7: "border-x-[7px]",
+    8: "border-x-[8px]",
+    9: "border-x-[9px]",
+    10: "border-x-[10px]",
+    11: "border-x-[11px]",
+    12: "border-x-[12px]"
+  };
+  borderYWidth = {
+    1: "border-y-[1px]",
+    2: "border-y-[2px]",
+    3: "border-y-[3px]",
+    4: "border-y-[4px]",
+    5: "border-y-[5px]",
+    6: "border-y-[6px]",
+    7: "border-y-[7px]",
+    8: "border-y-[8px]",
+    9: "border-y-[9px]",
+    10: "border-y-[10px]",
+    11: "border-y-[11px]",
+    12: "border-y-[12px]"
+  };
+  borderTopWidth = {
+    1: "border-t-[1px]",
+    2: "border-t-[2px]",
+    3: "border-t-[3px]",
+    4: "border-t-[4px]",
+    5: "border-t-[5px]",
+    6: "border-t-[6px]",
+    7: "border-t-[7px]",
+    8: "border-t-[8px]",
+    9: "border-t-[9px]",
+    10: "border-t-[10px]",
+    11: "border-t-[11px]",
+    12: "border-t-[12px]"
+  };
+  borderBottomWidth = {
+    1: "border-b-[1px]",
+    2: "border-b-[2px]",
+    3: "border-b-[3px]",
+    4: "border-b-[4px]",
+    5: "border-b-[5px]",
+    6: "border-b-[6px]",
+    7: "border-b-[7px]",
+    8: "border-b-[8px]",
+    9: "border-b-[9px]",
+    10: "border-b-[10px]",
+    11: "border-b-[11px]",
+    12: "border-b-[12px]"
+  };
+  borderLeftWidth = {
+    1: "border-l-[1px]",
+    2: "border-l-[2px]",
+    3: "border-l-[3px]",
+    4: "border-l-[4px]",
+    5: "border-l-[5px]",
+    6: "border-l-[6px]",
+    7: "border-l-[7px]",
+    8: "border-l-[8px]",
+    9: "border-l-[9px]",
+    10: "border-l-[10px]",
+    11: "border-l-[11px]",
+    12: "border-l-[12px]"
+  };
+  borderRightWidth = {
+    1: "border-r-[1px]",
+    2: "border-r-[2px]",
+    3: "border-r-[3px]",
+    4: "border-r-[4px]",
+    5: "border-r-[5px]",
+    6: "border-r-[6px]",
+    7: "border-r-[7px]",
+    8: "border-r-[8px]",
+    9: "border-r-[9px]",
+    10: "border-r-[10px]",
+    11: "border-r-[11px]",
+    12: "border-r-[12px]"
+  };
+}
+class ge {
+  // bg color class
+  bgColor = {
+    primary: "bg-primary",
+    secondary: "bg-secondary",
+    success: "bg-success",
+    danger: "bg-danger",
+    info: "bg-info",
+    warning: "bg-warning",
+    "light-1": "bg-light-1",
+    "light-2": "bg-light-2",
+    "light-3": "bg-light-3",
+    "light-4": "bg-light-4",
+    "dark-1": "bg-dark-1",
+    "dark-2": "bg-dark-2",
+    "dark-3": "bg-dark-3",
+    "dark-4": "bg-dark-4",
+    black: "bg-black",
+    white: "bg-white",
+    transparent: "bg-transparent"
+  };
+  // hover: bg color class
+  hoverBgColor = {
+    primary: "hover:bg-primary",
+    secondary: "hover:bg-secondary",
+    success: "hover:bg-success",
+    danger: "hover:bg-danger",
+    info: "hover:bg-info",
+    warning: "hover:bg-warning",
+    "light-1": "hover:bg-light-1",
+    "light-2": "hover:bg-light-2",
+    "light-3": "hover:bg-light-3",
+    "light-4": "hover:bg-light-4",
+    "dark-1": "hover:bg-dark-1",
+    "dark-2": "hover:bg-dark-2",
+    "dark-3": "hover:bg-dark-3",
+    "dark-4": "hover:bg-dark-4",
+    black: "hover:bg-black",
+    white: "hover:bg-white",
+    transparent: "hover:bg-transparent"
+  };
+  // focus: bg color class
+  focusBgColor = {
+    primary: "focus:bg-primary",
+    secondary: "focus:bg-secondary",
+    success: "focus:bg-success",
+    danger: "focus:bg-danger",
+    info: "focus:bg-info",
+    warning: "focus:bg-warning",
+    "light-1": "focus:bg-light-1",
+    "light-2": "focus:bg-light-2",
+    "light-3": "focus:bg-light-3",
+    "light-4": "focus:bg-light-4",
+    "dark-1": "focus:bg-dark-1",
+    "dark-2": "focus:bg-dark-2",
+    "dark-3": "focus:bg-dark-3",
+    "dark-4": "focus:bg-dark-4",
+    black: "focus:bg-black",
+    white: "focus:bg-white",
+    transparent: "focus:bg-transparent"
+  };
+  // ::before bg color class
+  beforeBgColor = {
+    primary: "before:bg-primary",
+    secondary: "before:bg-secondary",
+    success: "before:bg-success",
+    danger: "before:bg-danger",
+    info: "before:bg-info",
+    warning: "before:bg-warning",
+    "light-1": "before:bg-light-1",
+    "light-2": "before:bg-light-2",
+    "light-3": "before:bg-light-3",
+    "light-4": "before:bg-light-4",
+    "dark-1": "before:bg-dark-1",
+    "dark-2": "before:bg-dark-2",
+    "dark-3": "before:bg-dark-3",
+    "dark-4": "before:bg-dark-4",
+    black: "before:bg-black",
+    white: "before:bg-white",
+    transparent: "before:bg-transparent"
+  };
+  // ::after bg color class
+  afterBgColor = {
+    primary: "after:bg-primary",
+    secondary: "after:bg-secondary",
+    success: "after:bg-success",
+    danger: "after:bg-danger",
+    info: "after:bg-info",
+    warning: "after:bg-warning",
+    "light-1": "after:bg-light-1",
+    "light-2": "after:bg-light-2",
+    "light-3": "after:bg-light-3",
+    "light-4": "after:bg-light-4",
+    "dark-1": "after:bg-dark-1",
+    "dark-2": "after:bg-dark-2",
+    "dark-3": "after:bg-dark-3",
+    "dark-4": "after:bg-dark-4",
+    black: "after:bg-black",
+    white: "after:bg-white",
+    transparent: "after:bg-transparent"
+  };
+  // active:bg color class
+  bgActiveColor = {
+    primary: "active:bg-primary",
+    secondary: "active:bg-secondary",
+    success: "active:bg-success",
+    danger: "active:bg-danger",
+    info: "active:bg-info",
+    warning: "active:bg-warning",
+    "light-1": "active:bg-light-1",
+    "light-2": "active:bg-light-2",
+    "light-3": "active:bg-light-3",
+    "light-4": "active:bg-light-4",
+    "dark-1": "active:bg-dark-1",
+    "dark-2": "active:bg-dark-2",
+    "dark-3": "active:bg-dark-3",
+    "dark-4": "active:bg-dark-4",
+    black: "active:bg-black",
+    white: "active:bg-white",
+    transparent: "active:bg-transparent"
+  };
+  // text color class
+  textColor = {
+    primary: "text-primary",
+    secondary: "text-secondary",
+    success: "text-success",
+    danger: "text-danger",
+    info: "text-info",
+    warning: "text-warning",
+    "light-1": "text-light-1",
+    "light-2": "text-light-2",
+    "light-3": "text-light-3",
+    "light-4": "text-light-4",
+    "dark-1": "text-dark-1",
+    "dark-2": "text-dark-2",
+    "dark-3": "text-dark-3",
+    "dark-4": "text-dark-4",
+    black: "text-black",
+    white: "text-white",
+    transparent: "text-transparent"
+  };
+  // hover text color class
+  hoverTextColor = {
+    primary: "hover:text-primary",
+    secondary: "hover:text-secondary",
+    success: "hover:text-success",
+    danger: "hover:text-danger",
+    info: "hover:text-info",
+    warning: "hover:text-warning",
+    "light-1": "hover:text-light-1",
+    "light-2": "hover:text-light-2",
+    "light-3": "hover:text-light-3",
+    "light-4": "hover:text-light-4",
+    "dark-1": "hover:text-dark-1",
+    "dark-2": "hover:text-dark-2",
+    "dark-3": "hover:text-dark-3",
+    "dark-4": "hover:text-dark-4",
+    black: "hover:text-black",
+    white: "hover:text-white",
+    transparent: "hover:text-transparent"
+  };
+  // focus text color class
+  focusTextColor = {
+    primary: "focus:text-primary",
+    secondary: "focus:text-secondary",
+    success: "focus:text-success",
+    danger: "focus:text-danger",
+    info: "focus:text-info",
+    warning: "focus:text-warning",
+    "light-1": "focus:text-light-1",
+    "light-2": "focus:text-light-2",
+    "light-3": "focus:text-light-3",
+    "light-4": "focus:text-light-4",
+    "dark-1": "focus:text-dark-1",
+    "dark-2": "focus:text-dark-2",
+    "dark-3": "focus:text-dark-3",
+    "dark-4": "focus:text-dark-4",
+    black: "focus:text-black",
+    white: "focus:text-white",
+    transparent: "focus:text-transparent"
+  };
+  // disabled text color class
+  disabledTextColor = {
+    primary: "disabled:text-primary",
+    secondary: "disabled:text-secondary",
+    success: "disabled:text-success",
+    danger: "disabled:text-danger",
+    info: "disabled:text-info",
+    warning: "disabled:text-warning",
+    "light-1": "disabled:text-light-1",
+    "light-2": "disabled:text-light-2",
+    "light-3": "disabled:text-light-3",
+    "light-4": "disabled:text-light-4",
+    "dark-1": "disabled:text-dark-1",
+    "dark-2": "disabled:text-dark-2",
+    "dark-3": "disabled:text-dark-3",
+    "dark-4": "disabled:text-dark-4",
+    black: "disabled:text-black",
+    white: "disabled:text-white",
+    transparent: "disabled:text-transparent"
+  };
+  // SVG fill color class
+  svgFillColor = {
+    primary: "fill-primary",
+    secondary: "fill-secondary",
+    success: "fill-success",
+    danger: "fill-danger",
+    info: "fill-info",
+    warning: "fill-warning",
+    "light-1": "fill-light-1",
+    "light-2": "fill-light-2",
+    "light-3": "fill-light-3",
+    "light-4": "fill-light-4",
+    "dark-1": "fill-dark-1",
+    "dark-2": "fill-dark-2",
+    "dark-3": "fill-dark-3",
+    "dark-4": "fill-dark-4",
+    black: "fill-black",
+    white: "fill-white",
+    transparent: "fill-transparent"
+  };
+  // ring color class
+  ringColor = {
+    primary: "ring-primary",
+    secondary: "ring-secondary",
+    success: "ring-success",
+    danger: "ring-danger",
+    info: "ring-info",
+    warning: "ring-warning",
+    "light-1": "ring-light-1",
+    "light-2": "ring-light-2",
+    "light-3": "ring-light-3",
+    "light-4": "ring-light-4",
+    "dark-1": "ring-dark-1",
+    "dark-2": "ring-dark-2",
+    "dark-3": "ring-dark-3",
+    "dark-4": "ring-dark-4",
+    black: "ring-black",
+    white: "ring-white",
+    transparent: "ring-transparent"
+  };
+  // focus:ring color class
+  ringFocusColor = {
+    primary: "focus:ring-primary",
+    secondary: "focus:ring-secondary",
+    success: "focus:ring-success",
+    danger: "focus:ring-danger",
+    info: "focus:ring-info",
+    warning: "focus:ring-warning",
+    "light-1": "focus:ring-light-1",
+    "light-2": "focus:ring-light-2",
+    "light-3": "focus:ring-light-3",
+    "light-4": "focus:ring-light-4",
+    "dark-1": "focus:ring-dark-1",
+    "dark-2": "focus:ring-dark-2",
+    "dark-3": "focus:ring-dark-3",
+    "dark-4": "focus:ring-dark-4",
+    black: "focus:ring-black",
+    white: "focus:ring-white",
+    transparent: "focus:ring-transparent"
+  };
+  // active:ring color class
+  ringActiveColor = {
+    primary: "active:ring-primary",
+    secondary: "active:ring-secondary",
+    success: "active:ring-success",
+    danger: "active:ring-danger",
+    info: "active:ring-info",
+    warning: "active:ring-warning",
+    "light-1": "active:ring-light-1",
+    "light-2": "active:ring-light-2",
+    "light-3": "active:ring-light-3",
+    "light-4": "active:ring-light-4",
+    "dark-1": "active:ring-dark-1",
+    "dark-2": "active:ring-dark-2",
+    "dark-3": "active:ring-dark-3",
+    "dark-4": "active:ring-dark-4",
+    black: "active:ring-black",
+    white: "active:ring-white",
+    transparent: "active:ring-transparent"
+  };
+  // ring-offset color class
+  ringOffsetColor = {
+    primary: "ring-offset-primary",
+    secondary: "ring-offset-secondary",
+    success: "ring-offset-success",
+    danger: "ring-offset-danger",
+    info: "ring-offset-info",
+    warning: "ring-offset-warning",
+    "light-1": "ring-offset-light-1",
+    "light-2": "ring-offset-light-2",
+    "light-3": "ring-offset-light-3",
+    "light-4": "ring-offset-light-4",
+    "dark-1": "ring-offset-dark-1",
+    "dark-2": "ring-offset-dark-2",
+    "dark-3": "ring-offset-dark-3",
+    "dark-4": "ring-offset-dark-4",
+    black: "ring-offset-black",
+    white: "ring-offset-white",
+    transparent: "ring-offset-transparent"
+  };
+  // outline class
+  outlineColor = {
+    primary: "outline-primary",
+    secondary: "outline-secondary",
+    success: "outline-success",
+    danger: "outline-danger",
+    info: "outline-info",
+    warning: "outline-warning",
+    "light-1": "outline-light-1",
+    "light-2": "outline-light-2",
+    "light-3": "outline-light-3",
+    "light-4": "outline-light-4",
+    "dark-1": "outline-dark-1",
+    "dark-2": "outline-dark-2",
+    "dark-3": "outline-dark-3",
+    "dark-4": "outline-dark-4",
+    black: "outline-black",
+    white: "outline-white",
+    transparent: "outline-transparent"
+  };
+  // focus:outline class
+  focusOutlineColor = {
+    primary: "focus:outline-primary",
+    secondary: "focus:outline-secondary",
+    success: "focus:outline-success",
+    danger: "focus:outline-danger",
+    info: "focus:outline-info",
+    warning: "focus:outline-warning",
+    "light-1": "focus:outline-light-1",
+    "light-2": "focus:outline-light-2",
+    "light-3": "focus:outline-light-3",
+    "light-4": "focus:outline-light-4",
+    "dark-1": "focus:outline-dark-1",
+    "dark-2": "focus:outline-dark-2",
+    "dark-3": "focus:outline-dark-3",
+    "dark-4": "focus:outline-dark-4",
+    black: "focus:outline-black",
+    white: "focus:outline-white",
+    transparent: "focus:outline-transparent"
+  };
+  // active:outline class
+  activeOutlineColor = {
+    primary: "active:outline-primary",
+    secondary: "active:outline-secondary",
+    success: "active:outline-success",
+    danger: "active:outline-danger",
+    info: "active:outline-info",
+    warning: "active:outline-warning",
+    "light-1": "active:outline-light-1",
+    "light-2": "active:outline-light-2",
+    "light-3": "active:outline-light-3",
+    "light-4": "active:outline-light-4",
+    "dark-1": "active:outline-dark-1",
+    "dark-2": "active:outline-dark-2",
+    "dark-3": "active:outline-dark-3",
+    "dark-4": "active:outline-dark-4",
+    black: "active:outline-black",
+    white: "active:outline-white",
+    transparent: "active:outline-transparent"
+  };
+  // btn color class
+  btnColor = {
+    primary: "btn-primary",
+    secondary: "btn-secondary",
+    success: "btn-success",
+    danger: "btn-danger",
+    info: "btn-info",
+    warning: "btn-warning",
+    "light-1": "btn-light-1",
+    "light-2": "btn-light-2",
+    "light-3": "btn-light-3",
+    "light-4": "btn-light-4",
+    "dark-1": "btn-dark-1",
+    "dark-2": "btn-dark-2",
+    "dark-3": "btn-dark-3",
+    "dark-4": "btn-dark-4",
+    black: "btn-black",
+    white: "btn-white",
+    transparent: "btn-transparent"
+  };
+  // list color class
+  listColor = {
+    primary: "mcl-list-primary",
+    secondary: "mcl-list-secondary",
+    success: "mcl-list-success",
+    danger: "mcl-list-danger",
+    info: "mcl-list-info",
+    warning: "mcl-list-warning",
+    "light-1": "mcl-list-light-1",
+    "light-2": "mcl-list-light-2",
+    "light-3": "mcl-list-light-3",
+    "light-4": "mcl-list-light-4",
+    "dark-1": "mcl-list-dark-1",
+    "dark-2": "mcl-list-dark-2",
+    "dark-3": "mcl-list-dark-3",
+    "dark-4": "mcl-list-dark-4",
+    black: "mcl-list-black",
+    white: "mcl-list-white",
+    transparent: "mcl-list-transparent"
+  };
+  // border color classes
+  borderColor = {
+    primary: "border-primary",
+    secondary: "border-secondary",
+    success: "border-success",
+    danger: "border-danger",
+    info: "border-info",
+    warning: "border-warning",
+    "light-1": "border-light-1",
+    "light-2": "border-light-2",
+    "light-3": "border-light-3",
+    "light-4": "border-light-4",
+    "dark-1": "border-dark-1",
+    "dark-2": "border-dark-2",
+    "dark-3": "border-dark-3",
+    "dark-4": "border-dark-4",
+    black: "border-black",
+    white: "border-white",
+    transparent: "border-transparent"
+  };
+  borderXColor = {
+    primary: "border-x-primary",
+    secondary: "border-x-secondary",
+    success: "border-x-success",
+    danger: "border-x-danger",
+    info: "border-x-info",
+    warning: "border-x-warning",
+    "light-1": "border-x-light-1",
+    "light-2": "border-x-light-2",
+    "light-3": "border-x-light-3",
+    "light-4": "border-x-light-4",
+    "dark-1": "border-x-dark-1",
+    "dark-2": "border-x-dark-2",
+    "dark-3": "border-x-dark-3",
+    "dark-4": "border-x-dark-4",
+    black: "border-x-black",
+    white: "border-x-white",
+    transparent: "border-x-transparent"
+  };
+  borderYColor = {
+    primary: "border-y-primary",
+    secondary: "border-y-secondary",
+    success: "border-y-success",
+    danger: "border-y-danger",
+    info: "border-y-info",
+    warning: "border-y-warning",
+    "light-1": "border-y-light-1",
+    "light-2": "border-y-light-2",
+    "light-3": "border-y-light-3",
+    "light-4": "border-y-light-4",
+    "dark-1": "border-y-dark-1",
+    "dark-2": "border-y-dark-2",
+    "dark-3": "border-y-dark-3",
+    "dark-4": "border-y-dark-4",
+    black: "border-y-black",
+    white: "border-y-white",
+    transparent: "border-y-transparent"
+  };
+  borderTopColor = {
+    primary: "border-t-primary",
+    secondary: "border-t-secondary",
+    success: "border-t-success",
+    danger: "border-t-danger",
+    info: "border-t-info",
+    warning: "border-t-warning",
+    "light-1": "border-t-light-1",
+    "light-2": "border-t-light-2",
+    "light-3": "border-t-light-3",
+    "light-4": "border-t-light-4",
+    "dark-1": "border-t-dark-1",
+    "dark-2": "border-t-dark-2",
+    "dark-3": "border-t-dark-3",
+    "dark-4": "border-t-dark-4",
+    black: "border-t-black",
+    white: "border-t-white",
+    transparent: "border-t-transparent"
+  };
+  borderBottomColor = {
+    primary: "border-b-primary",
+    secondary: "border-b-secondary",
+    success: "border-b-success",
+    danger: "border-b-danger",
+    info: "border-b-info",
+    warning: "border-b-warning",
+    "light-1": "border-b-light-1",
+    "light-2": "border-b-light-2",
+    "light-3": "border-b-light-3",
+    "light-4": "border-b-light-4",
+    "dark-1": "border-b-dark-1",
+    "dark-2": "border-b-dark-2",
+    "dark-3": "border-b-dark-3",
+    "dark-4": "border-b-dark-4",
+    black: "border-b-black",
+    white: "border-b-white",
+    transparent: "border-b-transparent"
+  };
+  borderLeftColor = {
+    primary: "border-l-primary",
+    secondary: "border-l-secondary",
+    success: "border-l-success",
+    danger: "border-l-danger",
+    info: "border-l-info",
+    warning: "border-l-warning",
+    "light-1": "border-l-light-1",
+    "light-2": "border-l-light-2",
+    "light-3": "border-l-light-3",
+    "light-4": "border-l-light-4",
+    "dark-1": "border-l-dark-1",
+    "dark-2": "border-l-dark-2",
+    "dark-3": "border-l-dark-3",
+    "dark-4": "border-l-dark-4",
+    black: "border-l-black",
+    white: "border-l-white",
+    transparent: "border-l-transparent"
+  };
+  borderRightColor = {
+    primary: "border-r-primary",
+    secondary: "border-r-secondary",
+    success: "border-r-success",
+    danger: "border-r-danger",
+    info: "border-r-info",
+    warning: "border-r-warning",
+    "light-1": "border-r-light-1",
+    "light-2": "border-r-light-2",
+    "light-3": "border-r-light-3",
+    "light-4": "border-r-light-4",
+    "dark-1": "border-r-dark-1",
+    "dark-2": "border-r-dark-2",
+    "dark-3": "border-r-dark-3",
+    "dark-4": "border-r-dark-4",
+    black: "border-r-black",
+    white: "border-r-white",
+    transparent: "border-r-transparent"
+  };
+}
+class he {
+  // h1 class
+  heading1 = {
+    sm: "h1-sm",
+    md: "h1-md",
+    lg: "h1-lg",
+    xl: "h1-xl"
+  };
+  // h2 class
+  heading2 = {
+    sm: "h2-sm",
+    md: "h2-md",
+    lg: "h2-lg",
+    xl: "h2-xl"
+  };
+  // h3 class
+  heading3 = {
+    sm: "h3-sm",
+    md: "h3-md",
+    lg: "h3-lg",
+    xl: "h3-xl"
+  };
+  // h4 class
+  heading4 = {
+    sm: "h4-sm",
+    md: "h4-md",
+    lg: "h4-lg",
+    xl: "h4-xl"
+  };
+}
+let ue = class {
+  // opacity
+  backgroundOpacity = {
+    10: "bg-opacity-10",
+    20: "bg-opacity-20",
+    30: "bg-opacity-30",
+    40: "bg-opacity-40",
+    50: "bg-opacity-50",
+    60: "bg-opacity-60",
+    70: "bg-opacity-70",
+    80: "bg-opacity-80",
+    90: "bg-opacity-90",
+    100: "bg-opacity-100"
+  };
+  opacity = {
+    10: "opacity-10",
+    20: "opacity-20",
+    30: "opacity-30",
+    40: "opacity-40",
+    50: "opacity-50",
+    60: "opacity-60",
+    70: "opacity-70",
+    80: "opacity-80",
+    90: "opacity-90",
+    100: "opacity-100"
+  };
+  outlineOpacity = {
+    10: "outline-opacity-10",
+    20: "outline-opacity-20",
+    30: "outline-opacity-30",
+    40: "outline-opacity-40",
+    50: "outline-opacity-50",
+    60: "outline-opacity-60",
+    70: "outline-opacity-70",
+    80: "outline-opacity-80",
+    90: "outline-opacity-90",
+    100: "outline-opacity-100"
+  };
+};
+class be {
+  // spacing: margin
+  margin = {
+    0: "m-0",
+    "3xs": "m-3xs",
+    "2xs": "m-2xs",
+    xs: "m-xs",
+    sm: "m-sm",
+    md: "m-md",
+    lg: "m-lg",
+    xl: "m-xl",
+    "2xl": "m-2xl",
+    "3xl": "m-3xl"
+  };
+  marginX = {
+    0: "mx-0",
+    "3xs": "mx-3xs",
+    "2xs": "mx-2xs",
+    xs: "mx-xs",
+    sm: "mx-sm",
+    md: "mx-md",
+    lg: "mx-lg",
+    xl: "mx-xl",
+    "2xl": "mx-2xl",
+    "3xl": "mx-3xl"
+  };
+  marginY = {
+    0: "my-0",
+    "3xs": "my-3xs",
+    "2xs": "my-2xs",
+    xs: "my-xs",
+    sm: "my-sm",
+    md: "my-md",
+    lg: "my-lg",
+    xl: "my-xl",
+    "2xl": "my-2xl",
+    "3xl": "my-3xl"
+  };
+  marginTop = {
+    0: "mt-0",
+    "3xs": "mt-3xs",
+    "2xs": "mt-2xs",
+    xs: "mt-xs",
+    sm: "mt-sm",
+    md: "mt-md",
+    lg: "mt-lg",
+    xl: "mt-xl",
+    "2xl": "mt-2xl",
+    "3xl": "mt-3xl"
+  };
+  marginBottom = {
+    0: "mb-0",
+    "3xs": "mb-3xs",
+    "2xs": "mb-2xs",
+    xs: "mb-xs",
+    sm: "mb-sm",
+    md: "mb-md",
+    lg: "mb-lg",
+    xl: "mb-xl",
+    "2xl": "mb-2xl",
+    "3xl": "mb-3xl"
+  };
+  marginLeft = {
+    0: "ml-0",
+    "3xs": "ml-3xs",
+    "2xs": "ml-2xs",
+    xs: "ml-xs",
+    sm: "ml-sm",
+    md: "ml-md",
+    lg: "ml-lg",
+    xl: "ml-xl",
+    "2xl": "ml-2xl",
+    "3xl": "ml-3xl"
+  };
+  marginRight = {
+    0: "mr-0",
+    "3xs": "mr-3xs",
+    "2xs": "mr-2xs",
+    xs: "mr-xs",
+    sm: "mr-sm",
+    md: "mr-md",
+    lg: "mr-lg",
+    xl: "mr-xl",
+    "2xl": "mr-2xl",
+    "3xl": "mr-3xl"
+  };
+  // spacing: padding
+  padding = {
+    0: "p-0",
+    "3xs": "p-3xs",
+    "2xs": "p-2xs",
+    xs: "p-xs",
+    sm: "p-sm",
+    md: "p-md",
+    lg: "p-lg",
+    xl: "p-xl",
+    "2xl": "p-2xl",
+    "3xl": "p-3xl"
+  };
+  paddingX = {
+    0: "px-0",
+    "3xs": "px-3xs",
+    "2xs": "px-2xs",
+    xs: "px-xs",
+    sm: "px-sm",
+    md: "px-md",
+    lg: "px-lg",
+    xl: "px-xl",
+    "2xl": "px-2xl",
+    "3xl": "px-3xl"
+  };
+  paddingY = {
+    0: "py-0",
+    "3xs": "py-3xs",
+    "2xs": "py-2xs",
+    xs: "py-xs",
+    sm: "py-sm",
+    md: "py-md",
+    lg: "py-lg",
+    xl: "py-xl",
+    "2xl": "py-2xl",
+    "3xl": "py-3xl"
+  };
+  paddingTop = {
+    0: "pt-0",
+    "3xs": "pt-3xs",
+    "2xs": "pt-2xs",
+    xs: "pt-xs",
+    sm: "pt-sm",
+    md: "pt-md",
+    lg: "pt-lg",
+    xl: "pt-xl",
+    "2xl": "pt-2xl",
+    "3xl": "pt-3xl"
+  };
+  paddingBottom = {
+    0: "pb-0",
+    "3xs": "pb-3xs",
+    "2xs": "pb-2xs",
+    xs: "pb-xs",
+    sm: "pb-sm",
+    md: "pb-md",
+    lg: "pb-lg",
+    xl: "pb-xl",
+    "2xl": "pb-2xl",
+    "3xl": "pb-3xl"
+  };
+  paddingLeft = {
+    0: "pl-0",
+    "3xs": "pl-3xs",
+    "2xs": "pl-2xs",
+    xs: "pl-xs",
+    sm: "pl-sm",
+    md: "pl-md",
+    lg: "pl-lg",
+    xl: "pl-xl",
+    "2xl": "pl-2xl",
+    "3xl": "pl-3xl"
+  };
+  paddingRight = {
+    0: "pr-0",
+    "3xs": "pr-3xs",
+    "2xs": "pr-2xs",
+    xs: "pr-xs",
+    sm: "pr-sm",
+    md: "pr-md",
+    lg: "pr-lg",
+    xl: "pr-xl",
+    "2xl": "pr-2xl",
+    "3xl": "pr-3xl"
+  };
+  // spacing gap class for flex/grid
+  gap = {
+    0: "gap-0",
+    "3xs": "gap-3xs",
+    "2xs": "gap-2xs",
+    xs: "gap-xs",
+    sm: "gap-sm",
+    md: "gap-md",
+    lg: "gap-lg",
+    xl: "gap-xl",
+    "2xl": "gap-2xl",
+    "3xl": "gap-3xl"
+  };
+}
+let xe = class {
+  classType;
+  constructor(t) {
+    this.classType = t;
+  }
+  validateColorType(t) {
+    return typeof t != "string" || !/(primary|secondary|success|info|warning|danger|light-1|light-2|light-3|light-4|dark-1|dark-2|dark-3|dark-4|black|white|transparent)/.test(t) ? !1 : E.colorType.includes(this.classType);
+  }
+  validateSpaceType(t) {
+    return typeof t != "string" || !/(0|3xs|2xs|xs|sm|md|lg|xl|2xl|3xl)/.test(t) ? !1 : E.spacingType.includes(this.classType);
+  }
+  validateHeadingTextSizeType(t) {
+    return typeof t != "string" || !/(sm|md|lg|xl)/.test(t) ? !1 : E.headingSizeType.includes(
+      this.classType
+    );
+  }
+  validateBodyTextSizeType(t) {
+    return typeof t != "string" || !/(xs|sm|md|lg|xl)/.test(t) ? !1 : E.textType.includes(this.classType);
+  }
+  validateFontWeightType(t) {
+    return typeof t != "string" || !/(light|normal|bold)/.test(t) ? !1 : E.fontWeightType.includes(
+      this.classType
+    );
+  }
+  validateOpacityType(t) {
+    return typeof t != "number" || !/\b(0|[1-9]0|100)\b/.test(t.toString()) ? !1 : E.scaleType.includes(this.classType);
+  }
+  validateRangeType(t) {
+    return typeof t != "number" || !/\b([1-9]|1[0-2])\b/.test(t.toString()) ? !1 : E.borderWidthType.includes(
+      this.classType
+    );
+  }
+  validateAlignment(t) {
+    return typeof t != "string" || !/(left|center|right)/.test(t) ? !1 : E.textAlignType.includes(
+      this.classType
+    );
+  }
+};
+const E = {
+  colorType: [
+    "BGCOLOR",
+    "BEFOREBG",
+    "AFTERBG",
+    "HVBGCOLOR",
+    "FCBGCOLOR",
+    "ACTIVEBG",
+    "TEXTCOLOR",
+    "HVTEXTCOLOR",
+    "FCTEXTCOLOR",
+    "DISABLEDTEXTCOLOR",
+    "SVGFILL",
+    "RINGCOLOR",
+    "FOCUSRING",
+    "ACTIVERING",
+    "OUTLINE",
+    "FOCUSOUTLINE",
+    "ACTIVEOUTLINE",
+    "OFFSETRING",
+    "BTNCOLOR",
+    "LISTCOLOR",
+    "BORDER",
+    "BORDERX",
+    "BORDERY",
+    "BORDERT",
+    "BORDERB",
+    "BORDERL",
+    "BORDERR"
+  ],
+  textType: ["BODYTEXT"],
+  fontWeightType: ["FONTWEIGHT"],
+  textAlignType: ["TEXTALIGN"],
+  headingSizeType: ["H1", "H2", "H3", "H4"],
+  borderWidthType: [
+    "BORDERW",
+    "BORDERXW",
+    "BORDERYW",
+    "BORDERTW",
+    "BORDERBW",
+    "BORDERLW",
+    "BORDERRW"
+  ],
+  scaleType: ["BGOPACITY", "OPACITY", "OUTLINEOPACITY"],
+  spacingType: [
+    "MARGIN",
+    "MARGINX",
+    "MARGINY",
+    "MARGINT",
+    "MARGINB",
+    "MARGINL",
+    "MARGINR",
+    "PADDING",
+    "PADDINGX",
+    "PADDINGY",
+    "PADDINGT",
+    "PADDINGB",
+    "PADDINGL",
+    "PADDINGR",
+    "GAP"
+  ]
+};
+class fe {
+  classType;
+  classValue;
+  colorClass;
+  headingSizeClass;
+  borderWidthClass;
+  opacityClass;
+  spacingClass;
+  textClass;
+  validator;
+  constructor(t, a) {
+    this.classType = t, this.classValue = a, this.colorClass = new ge(), this.headingSizeClass = new he(), this.borderWidthClass = new ce(), this.opacityClass = new ue(), this.spacingClass = new be(), this.textClass = new de(), this.validator = new xe(t);
+  }
+  generateClass() {
+    switch (this.classType) {
+      // case: color classes
+      case "BGCOLOR":
+        return this.getBgColorClass();
+      case "HVBGCOLOR":
+        return this.getHoverBgColorClass();
+      case "FCBGCOLOR":
+        return this.getFocusBgColorClass();
+      case "BEFOREBG":
+        return this.getBeforeBgColorClass();
+      case "AFTERBG":
+        return this.getAfterBgColorClass();
+      case "ACTIVEBG":
+        return this.getActiveBgColorClass();
+      case "TEXTCOLOR":
+        return this.getTextColorClass();
+      case "HVTEXTCOLOR":
+        return this.getHoverTextColorClass();
+      case "FCTEXTCOLOR":
+        return this.getFocusTextColorClass();
+      case "DISABLEDTEXTCOLOR":
+        return this.getDisabledTextColorClass();
+      case "SVGFILL":
+        return this.getSvgFillColorClass();
+      case "RINGCOLOR":
+        return this.getRingColorClass();
+      case "FOCUSRING":
+        return this.getFocusRingColorClass();
+      case "ACTIVERING":
+        return this.getActiveRingColorClass();
+      case "OFFSETRING":
+        return this.getRingOffsetColorClass();
+      case "OUTLINE":
+        return this.getOutlineColorClass();
+      case "FOCUSOUTLINE":
+        return this.getFocusOutlineColorClass();
+      case "ACTIVEOUTLINE":
+        return this.getActiveOutlineColorClass();
+      case "BTNCOLOR":
+        return this.getBtnColorClass();
+      case "LISTCOLOR":
+        return this.getListColorClass();
+      case "BORDER":
+        return this.getBorderColorClass();
+      case "BORDERX":
+        return this.getBorderXColorClass();
+      case "BORDERY":
+        return this.getBorderYColorClass();
+      case "BORDERT":
+        return this.getBorderTopColorClass();
+      case "BORDERB":
+        return this.getBorderBottomColorClass();
+      case "BORDERL":
+        return this.getBorderLeftColorClass();
+      case "BORDERR":
+        return this.getBorderRightColorClass();
+      // case: heading classes
+      case "H1":
+        return this.getH1Class();
+      case "H2":
+        return this.getH2Class();
+      case "H3":
+        return this.getH3Class();
+      case "H4":
+        return this.getH4Class();
+      // case: body text class
+      case "BODYTEXT":
+        return this.getBodyTextSizeClass();
+      // case: font weight class
+      case "FONTWEIGHT":
+        return this.getFontWeightClass();
+      // case: text alignment class
+      case "TEXTALIGN":
+        return this.getTextAlignClass();
+      // case: border width classes
+      case "BORDERW":
+        return this.getBorderWidthClass();
+      case "BORDERXW":
+        return this.getBorderXWidthClass();
+      case "BORDERYW":
+        return this.getBorderYWidthClass();
+      case "BORDERTW":
+        return this.getBorderTopWidthClass();
+      case "BORDERBW":
+        return this.getBorderBottomWidthClass();
+      case "BORDERLW":
+        return this.getBorderLeftWidthClass();
+      case "BORDERRW":
+        return this.getBorderRightWidthClass();
+      // case: opacity classes
+      case "OPACITY":
+        return this.getOpacityClass();
+      case "BGOPACITY":
+        return this.getBgOpacityClass();
+      case "OUTLINEOPACITY":
+        return this.getOutlineOpacityClass();
+      // case: margins
+      case "MARGIN":
+        return this.getMarginClass();
+      case "MARGINX":
+        return this.getMarginXClass();
+      case "MARGINY":
+        return this.getMarginYClass();
+      case "MARGINT":
+        return this.getMarginTopClass();
+      case "MARGINB":
+        return this.getMarginBottomClass();
+      case "MARGINL":
+        return this.getMarginLeftClass();
+      case "MARGINR":
+        return this.getMarginRightClass();
+      // case: paddings
+      case "PADDING":
+        return this.getPaddingClass();
+      case "PADDINGX":
+        return this.getPaddingXClass();
+      case "PADDINGY":
+        return this.getPaddingYClass();
+      case "PADDINGT":
+        return this.getPaddingTopClass();
+      case "PADDINGB":
+        return this.getPaddingBottomClass();
+      case "PADDINGL":
+        return this.getPaddingLeftClass();
+      case "PADDINGR":
+        return this.getPaddingRightClass();
+      // case: gap
+      case "GAP":
+        return this.getGapClass();
+      default:
+        return " ";
+    }
+  }
+  // handle color class
+  // bg color
+  getBgColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.bgColor[this.classValue] : " ";
+  }
+  getHoverBgColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.hoverBgColor[this.classValue] : " ";
+  }
+  getFocusBgColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.focusBgColor[this.classValue] : " ";
+  }
+  getBeforeBgColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.beforeBgColor[this.classValue] : " ";
+  }
+  getAfterBgColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.afterBgColor[this.classValue] : " ";
+  }
+  getActiveBgColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.bgActiveColor[this.classValue] : " ";
+  }
+  // text color
+  getTextColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.textColor[this.classValue] : " ";
+  }
+  getHoverTextColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.hoverTextColor[this.classValue] : " ";
+  }
+  getFocusTextColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.focusTextColor[this.classValue] : " ";
+  }
+  getDisabledTextColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.disabledTextColor[this.classValue] : " ";
+  }
+  // svg color
+  getSvgFillColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.svgFillColor[this.classValue] : " ";
+  }
+  // ring color
+  getRingColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.ringColor[this.classValue] : " ";
+  }
+  getFocusRingColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.ringFocusColor[this.classValue] : " ";
+  }
+  getActiveRingColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.ringActiveColor[this.classValue] : " ";
+  }
+  getRingOffsetColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.ringOffsetColor[this.classValue] : " ";
+  }
+  // outline color
+  getOutlineColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.outlineColor[this.classValue] : " ";
+  }
+  getFocusOutlineColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.focusOutlineColor[this.classValue] : " ";
+  }
+  getActiveOutlineColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.activeOutlineColor[this.classValue] : " ";
+  }
+  // btn & list
+  getBtnColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.btnColor[this.classValue] : " ";
+  }
+  getListColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.listColor[this.classValue] : " ";
+  }
+  // border color
+  getBorderColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.borderColor[this.classValue] : " ";
+  }
+  getBorderXColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.borderXColor[this.classValue] : " ";
+  }
+  getBorderYColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.borderYColor[this.classValue] : " ";
+  }
+  getBorderTopColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.borderTopColor[this.classValue] : " ";
+  }
+  getBorderBottomColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.borderBottomColor[this.classValue] : " ";
+  }
+  getBorderLeftColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.borderLeftColor[this.classValue] : " ";
+  }
+  getBorderRightColorClass() {
+    return this.validator.validateColorType(this.classValue) ? this.colorClass.borderRightColor[this.classValue] : " ";
+  }
+  // handle heading classes
+  getH1Class() {
+    return this.validator.validateHeadingTextSizeType(this.classValue) ? this.headingSizeClass.heading1[this.classValue] : " ";
+  }
+  getH2Class() {
+    return this.validator.validateHeadingTextSizeType(this.classValue) ? this.headingSizeClass.heading2[this.classValue] : " ";
+  }
+  getH3Class() {
+    return this.validator.validateHeadingTextSizeType(this.classValue) ? this.headingSizeClass.heading3[this.classValue] : " ";
+  }
+  getH4Class() {
+    return this.validator.validateHeadingTextSizeType(this.classValue) ? this.headingSizeClass.heading4[this.classValue] : " ";
+  }
+  // handle body text size classes
+  getBodyTextSizeClass() {
+    return this.validator.validateBodyTextSizeType(this.classValue) ? this.textClass.bodyText[this.classValue] : " ";
+  }
+  // handle font weight classes
+  getFontWeightClass() {
+    return this.validator.validateFontWeightType(this.classValue) ? this.textClass.fontweight[this.classValue] : " ";
+  }
+  // handle text align classes
+  getTextAlignClass() {
+    return this.validator.validateAlignment(this.classValue) ? this.textClass.textAlign[this.classValue] : " ";
+  }
+  // handle border width class
+  getBorderWidthClass() {
+    return this.validator.validateRangeType(this.classValue) ? this.borderWidthClass.borderWidth[this.classValue] : " ";
+  }
+  getBorderXWidthClass() {
+    return this.validator.validateRangeType(this.classValue) ? this.borderWidthClass.borderXWidth[this.classValue] : " ";
+  }
+  getBorderYWidthClass() {
+    return this.validator.validateRangeType(this.classValue) ? this.borderWidthClass.borderYWidth[this.classValue] : " ";
+  }
+  getBorderTopWidthClass() {
+    return this.validator.validateRangeType(this.classValue) ? this.borderWidthClass.borderTopWidth[this.classValue] : " ";
+  }
+  getBorderBottomWidthClass() {
+    return this.validator.validateRangeType(this.classValue) ? this.borderWidthClass.borderBottomWidth[this.classValue] : " ";
+  }
+  getBorderLeftWidthClass() {
+    return this.validator.validateRangeType(this.classValue) ? this.borderWidthClass.borderLeftWidth[this.classValue] : " ";
+  }
+  getBorderRightWidthClass() {
+    return this.validator.validateRangeType(this.classValue) ? this.borderWidthClass.borderRightWidth[this.classValue] : " ";
+  }
+  // handle opacity classes
+  getOpacityClass() {
+    return this.validator.validateOpacityType(this.classValue) ? this.opacityClass.opacity[this.classValue] : " ";
+  }
+  getBgOpacityClass() {
+    return this.validator.validateOpacityType(this.classValue) ? this.opacityClass.backgroundOpacity[this.classValue] : " ";
+  }
+  getOutlineOpacityClass() {
+    return this.validator.validateOpacityType(this.classValue) ? this.opacityClass.outlineOpacity[this.classValue] : " ";
+  }
+  // spacing classes
+  // margins
+  getMarginClass() {
+    return this.validator.validateSpaceType(this.classValue) ? this.spacingClass.margin[this.classValue] : " ";
+  }
+  getMarginXClass() {
+    return this.validator.validateSpaceType(this.classValue) ? this.spacingClass.marginX[this.classValue] : " ";
+  }
+  getMarginYClass() {
+    return this.validator.validateSpaceType(this.classValue) ? this.spacingClass.marginY[this.classValue] : " ";
+  }
+  getMarginTopClass() {
+    return this.validator.validateSpaceType(this.classValue) ? this.spacingClass.marginTop[this.classValue] : " ";
+  }
+  getMarginBottomClass() {
+    return this.validator.validateSpaceType(this.classValue) ? this.spacingClass.marginBottom[this.classValue] : " ";
+  }
+  getMarginLeftClass() {
+    return this.validator.validateSpaceType(this.classValue) ? this.spacingClass.marginLeft[this.classValue] : " ";
+  }
+  getMarginRightClass() {
+    return this.validator.validateSpaceType(this.classValue) ? this.spacingClass.marginRight[this.classValue] : " ";
+  }
+  // paddings
+  getPaddingClass() {
+    return this.validator.validateSpaceType(this.classValue) ? this.spacingClass.padding[this.classValue] : " ";
+  }
+  getPaddingXClass() {
+    return this.validator.validateSpaceType(this.classValue) ? this.spacingClass.paddingX[this.classValue] : " ";
+  }
+  getPaddingYClass() {
+    return this.validator.validateSpaceType(this.classValue) ? this.spacingClass.paddingY[this.classValue] : " ";
+  }
+  getPaddingTopClass() {
+    return this.validator.validateSpaceType(this.classValue) ? this.spacingClass.paddingTop[this.classValue] : " ";
+  }
+  getPaddingBottomClass() {
+    return this.validator.validateSpaceType(this.classValue) ? this.spacingClass.paddingBottom[this.classValue] : " ";
+  }
+  getPaddingLeftClass() {
+    return this.validator.validateSpaceType(this.classValue) ? this.spacingClass.paddingLeft[this.classValue] : " ";
+  }
+  getPaddingRightClass() {
+    return this.validator.validateSpaceType(this.classValue) ? this.spacingClass.paddingRight[this.classValue] : " ";
+  }
+  // gaps
+  getGapClass() {
+    return this.validator.validateSpaceType(this.classValue) ? this.spacingClass.gap[this.classValue] : " ";
+  }
+}
+const P = (e, t) => new fe(e, t).generateClass(), j = {
+  left: "tooltip-left",
+  top: "tooltip-top",
+  bottom: "tooltip-bottom",
+  right: "tooltip-right"
+};
+S({
+  name: "Tooltip",
+  props: {
+    direction: {
+      type: String,
+      default: "right"
+    },
+    color: {
+      type: String,
+      default: "dark-3"
+    },
+    textColor: {
+      type: String,
+      default: "white"
+    },
+    width: {
+      type: [Number, String],
+      default: 80
+    },
+    customClass: {
+      type: String,
+      default: ""
+    },
+    title: {
+      type: String,
+      required: !0
+    }
+  },
+  setup(e) {
+    const t = "invisible opacity-0 group-hover:visible group-hover:opacity-100 z-[100] tooltip", a = O(() => [
+      P("BGCOLOR", e.color),
+      P("TEXTCOLOR", e.textColor)
+    ].join(" ")), b = O(() => ({ width: `${e.width}px` })), c = O(() => j[e.direction] || j.right), m = O(() => [
+      t,
+      c.value,
+      a.value,
+      e.customClass
+    ]);
+    return () => ae("div", {
+      class: m.value,
+      role: "tooltip",
+      innerHTML: e.title,
+      style: [b.value]
+    });
+  }
+});
+const me = (e, t) => {
+  if (e.tagName === "A") {
+    const a = e.getAttribute("href");
+    return a ? a.charAt(0) === "#" ? a.substring(1) : a : null;
+  }
+  return t || null;
+}, Ce = (e) => e ? document.getElementById(e) : null, ke = (e) => e.hasAttribute("visible"), _ = (e) => {
+  const t = e.getAttribute("visible") === "true" ? "false" : "true";
+  e.setAttribute("visible", t);
+}, pe = (e) => {
+  const t = `div[accordion="${e}"]`;
+  return Array.from(document.querySelectorAll(t));
+}, ve = (e, t) => {
+  pe(t).forEach((a) => {
+    a.id === e.id ? _(a) : a.getAttribute("visible") === "true" && a.setAttribute("visible", "false");
+  });
+}, ye = (e) => {
+  _(e);
+}, Te = (e) => (t) => {
+  t.preventDefault();
+  const a = t.target, b = me(a, e), c = Ce(b);
+  if (!c) {
+    console.warn(`[v-collapse] Target element not found: ${b}`);
+    return;
+  }
+  if (!ke(c)) {
+    console.warn(
+      `[v-collapse] Target element missing 'visible' attribute: ${b}`
+    );
+    return;
+  }
+  const m = c.getAttribute("accordion");
+  m ? ve(c, m) : ye(c);
+}, ee = {
+  mounted(e, t) {
+    e.__HandleToggler = Te(t.arg), e.addEventListener("click", e.__HandleToggler);
+  },
+  unmounted(e) {
+    e.__HandleToggler && (e.removeEventListener("click", e.__HandleToggler), delete e.__HandleToggler);
+  }
+}, Be = { class: "flex w-full flex-col" }, we = { class: "self-center" }, Oe = { class: "pt-2xs relative" }, Re = { class: "relative flex flex-col" }, Le = ["href", "target", "onClick"], Ve = /* @__PURE__ */ S({
   __name: "NavCollapse",
   props: {
     navId: {},
@@ -17,76 +1465,76 @@ const ne = { class: "flex flex-col w-full" }, ie = { class: "self-center" }, ae
     asLink: { type: Boolean, default: !0 }
   },
   emits: ["child-click", "label-click"],
-  setup(L, { emit: w }) {
-    const y = L, p = w, g = R(!1), v = E(() => {
-      const { navId: t } = y;
-      return `nav-${t.toLowerCase().replaceAll(" ", "-")}`;
-    }), a = E(() => {
-      const { navAccordionGroup: t } = y;
-      return `accordion-${t.toLocaleLowerCase().replaceAll(" ", "-")}`;
-    }), h = (t) => {
-      g.value = t;
-    }, k = (t, r) => {
-      p("label-click", t, r, g.value);
-    }, b = (t, r) => {
-      const { asLink: l } = y;
-      !l && t.preventDefault(), p("child-click", t, r);
-    }, s = (t, r, l) => {
+  setup(e, { emit: t }) {
+    const a = e, b = t, c = D(!1), m = O(() => {
+      const { navId: s } = a;
+      return `nav-${s.toLowerCase().replaceAll(" ", "-")}`;
+    }), C = O(() => {
+      const { navAccordionGroup: s } = a;
+      return `accordion-${s.toLocaleLowerCase().replaceAll(" ", "-")}`;
+    }), x = (s) => {
+      c.value = s;
+    }, p = (s, d) => {
+      b("label-click", s, d, c.value);
+    }, y = (s, d) => {
+      const { asLink: i } = a;
+      !i && s.preventDefault(), b("child-click", s, d);
+    }, T = (s, d, i) => {
       const f = [
-        o("BODYTEXT", t),
-        o("TEXTCOLOR", r)
+        r("BODYTEXT", s),
+        r("TEXTCOLOR", d)
       ];
-      return l && f.push("font-bold"), f.join(" ");
+      return i && f.push("font-bold"), f.join(" ");
     };
-    return (t, r) => (i(), c("div", ne, [
-      n("div", ie, [
-        _((i(), c("button", {
-          class: T(["tracking-wider align-middle outline-none nav__text flex items-center gap-3xs", s(t.menuTextSize, t.menuTextColor, t.menuTextBold)]),
-          onClick: r[0] || (r[0] = (l) => k(l, t.navItem.title))
+    return (s, d) => (n(), u("div", Be, [
+      o("div", we, [
+        J((n(), u("button", {
+          class: B(["nav__text gap-3xs flex items-center align-middle tracking-wider outline-none", T(e.menuTextSize, e.menuTextColor, e.menuTextBold)]),
+          onClick: d[0] || (d[0] = (i) => p(i, e.navItem.title))
         }, [
-          n("span", null, A(t.navItem.title), 1),
-          (i(), c("svg", {
+          o("span", null, G(e.navItem.title), 1),
+          (n(), u("svg", {
             xmlns: "http://www.w3.org/2000/svg",
             viewBox: "0 0 448 512",
-            class: T(["h-[0.8rem] fill-current", [
-              g.value ? "rotate-180" : "rotate-0",
+            class: B(["h-[0.8rem] fill-current", [
+              c.value ? "rotate-180" : "rotate-0",
               "transition-transform duration-300 ease-in"
             ]])
-          }, r[1] || (r[1] = [
-            n("path", { d: "M224 416c-8.188 0-16.38-3.125-22.62-9.375l-192-192c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 338.8l169.4-169.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-192 192C240.4 412.9 232.2 416 224 416z" }, null, -1)
-          ]), 2))
+          }, [...d[1] || (d[1] = [
+            o("path", { d: "M224 416c-8.188 0-16.38-3.125-22.62-9.375l-192-192c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 338.8l169.4-169.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-192 192C240.4 412.9 232.2 416 224 416z" }, null, -1)
+          ])], 2))
         ], 2)), [
-          [B(q), void 0, v.value]
+          [w(ee), void 0, m.value]
         ]),
-        t.displayHighlight ? (i(), c("div", {
+        e.displayHighlight ? (n(), u("div", {
           key: 0,
-          class: T(["relative -top-[2px] h-[6px] nav__decorator", B(o)("BEFOREBG", t.highlightColor)])
-        }, null, 2)) : z("", !0)
+          class: B(["nav__decorator relative -top-0.5 h-1.5", w(r)("BEFOREBG", e.highlightColor)])
+        }, null, 2)) : A("", !0)
       ]),
-      G(B(J), {
-        id: v.value,
+      M(w(Z), {
+        id: m.value,
         visible: !1,
-        accordion: a.value,
-        onOpen: h,
-        onClose: h
+        accordion: C.value,
+        onOpen: x,
+        onClose: x
       }, {
-        default: O(() => [
-          n("div", ae, [
-            t.displayHighlight ? (i(), c("div", {
+        default: R(() => [
+          o("div", Oe, [
+            e.displayHighlight ? (n(), u("div", {
               key: 0,
-              class: T(["absolute w-md bg-opacity-25 -left-4 h-full", B(o)("BGCOLOR", t.highlightColor)])
-            }, null, 2)) : z("", !0),
-            n("div", re, [
-              (i(!0), c(S, null, X(t.navItem.children, (l, f) => (i(), c("a", {
-                href: l.url,
-                target: l.target,
-                class: T(["w-full pb-2xs last:pb-0", [
-                  B(o)("TEXTCOLOR", t.menuTextColor),
-                  B(o)("BODYTEXT", t.menuTextSize)
+              class: B(["w-md absolute -left-4 h-full bg-opacity-25", w(r)("BGCOLOR", e.highlightColor)])
+            }, null, 2)) : A("", !0),
+            o("div", Re, [
+              (n(!0), u(N, null, X(e.navItem.children, (i, f) => (n(), u("a", {
+                href: i.url,
+                target: i.target,
+                class: B(["pb-2xs w-full last:pb-0", [
+                  w(r)("TEXTCOLOR", e.menuTextColor),
+                  w(r)("BODYTEXT", e.menuTextSize)
                 ]]),
                 key: f,
-                onClick: (C) => b(C, l)
-              }, A(l.title), 11, se))), 128))
+                onClick: (v) => y(v, i)
+              }, G(i.title), 11, Le))), 128))
             ])
           ])
         ]),
@@ -94,12 +1542,12 @@ const ne = { class: "flex flex-col w-full" }, ie = { class: "self-center" }, ae
       }, 8, ["id", "accordion"])
     ]));
   }
-}), F = (L, w) => {
-  const y = L.__vccOpts || L;
-  for (const [p, g] of w)
-    y[p] = g;
-  return y;
-}, de = /* @__PURE__ */ F(ue, [["__scopeId", "data-v-1b1467b6"]]), ce = ["onClick"], he = ["href", "target", "onClick"], fe = /* @__PURE__ */ D({
+}), F = (e, t) => {
+  const a = e.__vccOpts || e;
+  for (const [b, c] of t)
+    a[b] = c;
+  return a;
+}, Ie = /* @__PURE__ */ F(Ve, [["__scopeId", "data-v-21c9812e"]]), Ae = ["onClick"], Ee = ["href", "target", "onClick"], De = /* @__PURE__ */ S({
   __name: "NavDropdown",
   props: {
     navItem: {},
@@ -112,72 +1560,72 @@ const ne = { class: "flex flex-col w-full" }, ie = { class: "self-center" }, ae
     asLink: { type: Boolean, default: !0 }
   },
   emits: ["label-click", "child-click"],
-  setup(L, { emit: w }) {
-    const y = L, p = w, g = R(-1), v = R(), a = (s, t, r) => {
-      const l = [
-        o("BODYTEXT", s),
-        o("TEXTCOLOR", t)
+  setup(e, { emit: t }) {
+    const a = e, b = t, c = D(-1), m = D(), C = (T, s, d) => {
+      const i = [
+        r("BODYTEXT", T),
+        r("TEXTCOLOR", s)
       ];
-      return r && l.push("font-bold"), l.join(" ");
-    }, h = (s) => {
-      const t = y.navItem.children.length;
-      v.value !== void 0 && (s === "down" && g.value < t - 1 && g.value++, s === "up" && g.value > 0 && g.value--, v.value[g.value].focus());
-    }, k = (s, t, r) => {
-      g.value = -1, p("label-click", s, t, r);
-    }, b = (s, t) => {
-      const { asLink: r } = y;
-      !r && s.preventDefault(), p("child-click", s, t);
+      return d && i.push("font-bold"), i.join(" ");
+    }, x = (T) => {
+      const s = a.navItem.children.length;
+      m.value !== void 0 && (T === "down" && c.value < s - 1 && c.value++, T === "up" && c.value > 0 && c.value--, m.value[c.value].focus());
+    }, p = (T, s, d) => {
+      c.value = -1, b("label-click", T, s, d);
+    }, y = (T, s) => {
+      const { asLink: d } = a;
+      !d && T.preventDefault(), b("child-click", T, s);
     };
-    return (s, t) => (i(), c("div", {
+    return (T, s) => (n(), u("div", {
       onKeyup: [
-        t[0] || (t[0] = V((r) => h("down"), ["down"])),
-        t[1] || (t[1] = V((r) => h("up"), ["up"]))
+        s[0] || (s[0] = Y((d) => x("down"), ["down"])),
+        s[1] || (s[1] = Y((d) => x("up"), ["up"]))
       ]
     }, [
-      G(B(ee), null, {
-        toggler: O(({ toggle: r, dropdownState: l }) => [
-          n("div", null, [
-            n("button", {
-              class: T(["tracking-wider align-middle outline-none nav__text flex items-center gap-3xs", a(s.menuTextSize, s.menuTextColor, s.menuTextBold)]),
-              onClick: (f) => (r(f), k(f, s.navItem.title, l))
+      M(w(se), null, {
+        toggler: R(({ toggle: d, dropdownState: i }) => [
+          o("div", null, [
+            o("button", {
+              class: B(["nav__text gap-3xs flex items-center align-middle tracking-wider outline-none", C(e.menuTextSize, e.menuTextColor, e.menuTextBold)]),
+              onClick: (f) => (d(f), p(f, e.navItem.title, i))
             }, [
-              n("span", null, A(s.navItem.title), 1),
-              (i(), c("svg", {
+              o("span", null, G(e.navItem.title), 1),
+              (n(), u("svg", {
                 xmlns: "http://www.w3.org/2000/svg",
                 viewBox: "0 0 448 512",
-                class: T(["h-[0.8rem] fill-current", [
-                  l ? "rotate-180" : "rotate-0",
+                class: B(["h-[0.8rem] fill-current", [
+                  i ? "rotate-180" : "rotate-0",
                   "transition-transform duration-300 ease-in"
                 ]])
-              }, t[2] || (t[2] = [
-                n("path", { d: "M224 416c-8.188 0-16.38-3.125-22.62-9.375l-192-192c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 338.8l169.4-169.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-192 192C240.4 412.9 232.2 416 224 416z" }, null, -1)
-              ]), 2))
-            ], 10, ce),
-            s.displayHighlight ? (i(), c("div", {
+              }, [...s[2] || (s[2] = [
+                o("path", { d: "M224 416c-8.188 0-16.38-3.125-22.62-9.375l-192-192c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 338.8l169.4-169.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-192 192C240.4 412.9 232.2 416 224 416z" }, null, -1)
+              ])], 2))
+            ], 10, Ae),
+            e.displayHighlight ? (n(), u("div", {
               key: 0,
-              class: T(["relative -top-[2px] h-[6px] nav__decorator", B(o)("BEFOREBG", s.highlightColor)])
-            }, null, 2)) : z("", !0)
+              class: B(["nav__decorator relative -top-0.5 h-1.5", w(r)("BEFOREBG", e.highlightColor)])
+            }, null, 2)) : A("", !0)
           ])
         ]),
-        default: O(() => [
-          G(B(le), { className: "border drop-shadow-sm" }, {
-            default: O(({ itemClick: r }) => [
-              (i(!0), c(S, null, X(s.navItem.children, (l, f) => (i(), c("a", {
-                href: l.url,
-                target: l.target,
+        default: R(() => [
+          M(w(ie), { className: "border drop-shadow-sm" }, {
+            default: R(({ itemClick: d }) => [
+              (n(!0), u(N, null, X(e.navItem.children, (i, f) => (n(), u("a", {
+                href: i.url,
+                target: i.target,
                 key: f,
                 ref_for: !0,
                 ref_key: "navItemRef",
-                ref: v,
-                class: T(["px-xs py-2xs block w-full hover:bg-opacity-50 focus:bg-opacity-50 transition-all duration-200 ease-linear", [
-                  B(o)("BGCOLOR", s.bgColor),
-                  B(o)("HVBGCOLOR", s.highlightColor),
-                  B(o)("FCBGCOLOR", s.highlightColor),
-                  B(o)("TEXTCOLOR", s.menuTextColor),
-                  B(o)("BODYTEXT", s.menuTextSize)
+                ref: m,
+                class: B(["px-xs py-2xs block w-full transition-all duration-200 ease-linear hover:bg-opacity-50 focus:bg-opacity-50", [
+                  w(r)("BGCOLOR", e.bgColor),
+                  w(r)("HVBGCOLOR", e.highlightColor),
+                  w(r)("FCBGCOLOR", e.highlightColor),
+                  w(r)("TEXTCOLOR", e.menuTextColor),
+                  w(r)("BODYTEXT", e.menuTextSize)
                 ]]),
-                onClick: (C) => (r(), b(C, l))
-              }, A(l.title), 11, he))), 128))
+                onClick: (v) => (d(), y(v, i))
+              }, G(i.title), 11, Ee))), 128))
             ]),
             _: 1
           })
@@ -186,7 +1634,7 @@ const ne = { class: "flex flex-col w-full" }, ie = { class: "self-center" }, ae
       })
     ], 32));
   }
-}), me = /* @__PURE__ */ F(fe, [["__scopeId", "data-v-3cd6e9eb"]]), ge = ["href", "target", "innerHTML"], pe = /* @__PURE__ */ D({
+}), Se = /* @__PURE__ */ F(De, [["__scopeId", "data-v-f1056ea0"]]), He = ["href", "target", "innerHTML"], Ge = /* @__PURE__ */ S({
   __name: "NavLink",
   props: {
     navItem: {},
@@ -198,35 +1646,35 @@ const ne = { class: "flex flex-col w-full" }, ie = { class: "self-center" }, ae
     asLink: { type: Boolean, default: !0 }
   },
   emits: ["nav-link"],
-  setup(L, { emit: w }) {
-    const y = L, p = w, g = (a, h, k) => {
-      const b = [
-        o("BODYTEXT", a),
-        o("TEXTCOLOR", h)
+  setup(e, { emit: t }) {
+    const a = e, b = t, c = (C, x, p) => {
+      const y = [
+        r("BODYTEXT", C),
+        r("TEXTCOLOR", x)
       ];
-      return k && b.push("font-bold"), b.join(" ");
-    }, v = (a, h) => {
-      const { asLink: k } = y;
-      !k && a.preventDefault(), p("nav-link", a, h);
+      return p && y.push("font-bold"), y.join(" ");
+    }, m = (C, x) => {
+      const { asLink: p } = a;
+      !p && C.preventDefault(), b("nav-link", C, x);
     };
-    return (a, h) => (i(), c("div", null, [
-      n("a", {
-        href: a.navItem.url,
-        target: a.navItem.target,
-        innerHTML: a.navItem.title,
-        class: T(["tracking-wider outline-none nav__text", g(a.menuTextSize, a.menuTextColor, a.menuTextBold)]),
-        onClick: h[0] || (h[0] = (k) => v(k, a.navItem))
-      }, null, 10, ge),
-      a.displayHighlight ? (i(), c("div", {
+    return (C, x) => (n(), u("div", null, [
+      o("a", {
+        href: e.navItem.url,
+        target: e.navItem.target,
+        innerHTML: e.navItem.title,
+        class: B(["nav__text tracking-wider outline-none", c(e.menuTextSize, e.menuTextColor, e.menuTextBold)]),
+        onClick: x[0] || (x[0] = (p) => m(p, e.navItem))
+      }, null, 10, He),
+      e.displayHighlight ? (n(), u("div", {
         key: 0,
-        class: T(["relative -top-[2px] h-[6px] nav__decorator", B(o)("BEFOREBG", a.highlightColor)])
-      }, null, 2)) : z("", !0)
+        class: B(["nav__decorator relative -top-0.5 h-1.5", w(r)("BEFOREBG", e.highlightColor)])
+      }, null, 2)) : A("", !0)
     ]));
   }
-}), K = /* @__PURE__ */ F(pe, [["__scopeId", "data-v-94d8fa7b"]]), ke = { class: "flex flex-shrink-0 items-center self-center" }, Ce = { class: "h-md md:h-lg lg:h-xl mr-2xs md:mr-sm align-middle" }, ve = ["href", "target"], be = ["src", "alt"], Te = ["src", "alt"], ye = { class: "flex flex-col justify-center ml-2" }, Be = ["href", "target"], Le = ["innerHTML"], we = { class: "hidden lg:flex flex-wrap" }, Oe = {
+}), U = /* @__PURE__ */ F(Ge, [["__scopeId", "data-v-d99c76b1"]]), Ne = { class: "flex flex-shrink-0 items-center self-center" }, Xe = { class: "h-md md:h-lg lg:h-xl mr-2xs md:mr-sm align-middle" }, ze = ["href", "target"], We = ["src", "alt"], $e = ["src", "alt"], Me = { class: "flex flex-col justify-center ml-2" }, Fe = ["href", "target"], Ye = ["innerHTML"], Pe = { class: "hidden lg:flex flex-wrap" }, je = {
   key: 0,
   class: "hidden lg:block"
-}, Ie = { class: "flex flex-col items-center justify-center p-xs" }, xe = { key: 0 }, Pe = /* @__PURE__ */ D({
+}, Ue = { class: "flex flex-col items-center justify-center p-xs" }, Ke = { key: 0 }, kt = /* @__PURE__ */ S({
   __name: "MclHeaderA",
   props: {
     logo: {},
@@ -253,148 +1701,147 @@ const ne = { class: "flex flex-col w-full" }, ie = { class: "self-center" }, ae
     scrollDistance: { default: 50 }
   },
   emits: ["toggle-drawer", "title-click", "menu-click", "collapse-click"],
-  setup(L, { expose: w, emit: y }) {
-    const p = L, g = R(), v = U(), a = y, h = () => {
-      var l;
-      (l = g.value) == null || l.headerClose();
-    }, k = (l) => {
-      const { titleBlockAsLink: f, titleBlockLink: C, titleBlockLinkTarget: e } = p;
-      f || l.preventDefault(), a("title-click", l, C, e), h();
-    }, b = (l, f) => {
-      const { menuItemAsLink: C } = p;
-      C || l.preventDefault(), a("menu-click", l, f), h();
-    }, s = (l, f, C) => {
-      a("collapse-click", l, f, C);
-    }, t = (l, f) => [
-      o("H2", l),
-      o("TEXTCOLOR", f)
-    ].join(" "), r = (l) => {
-      const f = l;
+  setup(e, { expose: t, emit: a }) {
+    const b = e, c = D(), m = Q(), C = a, x = () => {
+      c.value?.headerClose();
+    }, p = (i) => {
+      const { titleBlockAsLink: f, titleBlockLink: v, titleBlockLinkTarget: l } = b;
+      f || i.preventDefault(), C("title-click", i, v, l), x();
+    }, y = (i, f) => {
+      const { menuItemAsLink: v } = b;
+      v || i.preventDefault(), C("menu-click", i, f), x();
+    }, T = (i, f, v) => {
+      C("collapse-click", i, f, v);
+    }, s = (i, f) => [
+      r("H2", i),
+      r("TEXTCOLOR", f)
+    ].join(" "), d = (i) => {
+      const f = i;
       return typeof f.children > "u" ? !1 : f.children.length > 0;
     };
-    return w({
-      headerClose: h
-    }), (l, f) => (i(), x(B(te), {
+    return t({
+      headerClose: x
+    }), (i, f) => (n(), V(w(oe), {
       ref_key: "componentRef",
-      ref: g,
-      "bg-color": l.bgColor,
-      "drawer-btn-border": l.drawerBtnBorder,
-      "drawer-btn-color": l.drawerBtnColor,
-      "fade-in-on-scroll": l.fadeInOnScroll,
-      "mobile-menu-bg-color": l.mobileMenuBgColor
+      ref: c,
+      "bg-color": e.bgColor,
+      "drawer-btn-border": e.drawerBtnBorder,
+      "drawer-btn-color": e.drawerBtnColor,
+      "fade-in-on-scroll": e.fadeInOnScroll,
+      "mobile-menu-bg-color": e.mobileMenuBgColor
     }, {
-      content: O(() => [
-        n("div", ke, [
-          n("div", Ce, [
-            n("a", {
-              href: l.titleBlockLink,
-              target: l.titleBlockLinkTarget,
-              onClick: k
+      content: R(() => [
+        o("div", Ne, [
+          o("div", Xe, [
+            o("a", {
+              href: e.titleBlockLink,
+              target: e.titleBlockLinkTarget,
+              onClick: p
             }, [
-              n("img", {
-                src: l.logo,
-                alt: l.logoAlt,
-                class: T(["h-full", [l.logoSmall ? "hidden lg:inline-block" : "inline-block"]])
-              }, null, 10, be),
-              l.logoSmall ? (i(), c("img", {
+              o("img", {
+                src: e.logo,
+                alt: e.logoAlt,
+                class: B(["h-full", [e.logoSmall ? "hidden lg:inline-block" : "inline-block"]])
+              }, null, 10, We),
+              e.logoSmall ? (n(), u("img", {
                 key: 0,
-                src: l.logoSmall,
-                alt: l.logoAlt,
+                src: e.logoSmall,
+                alt: e.logoAlt,
                 class: "inline-block lg:hidden h-full"
-              }, null, 8, Te)) : z("", !0)
-            ], 8, ve)
+              }, null, 8, $e)) : A("", !0)
+            ], 8, ze)
           ]),
-          n("div", ye, [
-            n("a", {
-              href: l.titleBlockLink,
-              target: l.titleBlockLinkTarget,
-              onClick: k
+          o("div", Me, [
+            o("a", {
+              href: e.titleBlockLink,
+              target: e.titleBlockLinkTarget,
+              onClick: p
             }, [
-              n("h2", {
-                class: T(["inline-block align-middle tracking-wider", t(l.titleSize, l.titleColor)]),
-                innerHTML: l.title
-              }, null, 10, Le)
-            ], 8, Be),
-            n("ul", we, [
-              (i(!0), c(S, null, X(l.menuItems, (C, e) => (i(), c("li", {
+              o("h2", {
+                class: B(["inline-block align-middle tracking-wider", s(e.titleSize, e.titleColor)]),
+                innerHTML: e.title
+              }, null, 10, Ye)
+            ], 8, Fe),
+            o("ul", Pe, [
+              (n(!0), u(N, null, X(e.menuItems, (v, l) => (n(), u("li", {
                 class: "mr-xs last:mr-0",
-                key: `menu-${e}`
+                key: `menu-${l}`
               }, [
-                r(C) ? (i(), x(me, {
+                d(v) ? (n(), V(Se, {
                   key: 1,
-                  "nav-item": C,
-                  "menu-text-color": l.menuTextColor,
-                  "menu-text-size": l.menuTextSize,
-                  "menu-text-bold": l.menuTextBold,
-                  "display-highlight": l.displayHighlight,
-                  "highlight-color": l.highlightColor,
-                  "bg-color": l.bgColor,
-                  "as-link": l.menuItemAsLink,
-                  onChildClick: b,
-                  onLabelClick: s
-                }, null, 8, ["nav-item", "menu-text-color", "menu-text-size", "menu-text-bold", "display-highlight", "highlight-color", "bg-color", "as-link"])) : (i(), x(K, {
+                  "nav-item": v,
+                  "menu-text-color": e.menuTextColor,
+                  "menu-text-size": e.menuTextSize,
+                  "menu-text-bold": e.menuTextBold,
+                  "display-highlight": e.displayHighlight,
+                  "highlight-color": e.highlightColor,
+                  "bg-color": e.bgColor,
+                  "as-link": e.menuItemAsLink,
+                  onChildClick: y,
+                  onLabelClick: T
+                }, null, 8, ["nav-item", "menu-text-color", "menu-text-size", "menu-text-bold", "display-highlight", "highlight-color", "bg-color", "as-link"])) : (n(), V(U, {
                   key: 0,
-                  "nav-item": C,
-                  "menu-text-color": l.menuTextColor,
-                  "menu-text-size": l.menuTextSize,
-                  "menu-text-bold": l.menuTextBold,
-                  "display-highlight": l.displayHighlight,
-                  "highlight-color": l.highlightColor,
-                  "as-link": l.menuItemAsLink,
-                  onNavLink: b
+                  "nav-item": v,
+                  "menu-text-color": e.menuTextColor,
+                  "menu-text-size": e.menuTextSize,
+                  "menu-text-bold": e.menuTextBold,
+                  "display-highlight": e.displayHighlight,
+                  "highlight-color": e.highlightColor,
+                  "as-link": e.menuItemAsLink,
+                  onNavLink: y
                 }, null, 8, ["nav-item", "menu-text-color", "menu-text-size", "menu-text-bold", "display-highlight", "highlight-color", "as-link"]))
               ]))), 128))
             ])
           ])
         ])
       ]),
-      "content-right": O(() => [
-        v["content-right"] ? (i(), c("div", Oe, [
-          j(l.$slots, "content-right")
-        ])) : z("", !0)
+      "content-right": R(() => [
+        m["content-right"] ? (n(), u("div", je, [
+          $(i.$slots, "content-right")
+        ])) : A("", !0)
       ]),
-      "mobile-content": O(() => [
-        n("div", null, [
-          n("ul", Ie, [
-            (i(!0), c(S, null, X(l.menuItems, (C, e) => (i(), c("li", {
+      "mobile-content": R(() => [
+        o("div", null, [
+          o("ul", Ue, [
+            (n(!0), u(N, null, X(e.menuItems, (v, l) => (n(), u("li", {
               class: "mb-2xs last:mb-0",
-              key: `mobile-${e}`
+              key: `mobile-${l}`
             }, [
-              r(C) ? (i(), x(de, {
+              d(v) ? (n(), V(Ie, {
                 key: 1,
-                "nav-id": C.title,
-                "nav-item": C,
-                "menu-text-color": l.menuTextColor,
-                "menu-text-size": l.menuTextSize,
-                "menu-text-bold": l.menuTextBold,
-                "display-highlight": l.displayHighlight,
-                "highlight-color": l.highlightColor,
-                "nav-accordion-group": l.title,
-                "as-link": l.menuItemAsLink,
-                onChildClick: b,
-                onLabelClick: s
-              }, null, 8, ["nav-id", "nav-item", "menu-text-color", "menu-text-size", "menu-text-bold", "display-highlight", "highlight-color", "nav-accordion-group", "as-link"])) : (i(), x(K, {
+                "nav-id": v.title,
+                "nav-item": v,
+                "menu-text-color": e.menuTextColor,
+                "menu-text-size": e.menuTextSize,
+                "menu-text-bold": e.menuTextBold,
+                "display-highlight": e.displayHighlight,
+                "highlight-color": e.highlightColor,
+                "nav-accordion-group": e.title,
+                "as-link": e.menuItemAsLink,
+                onChildClick: y,
+                onLabelClick: T
+              }, null, 8, ["nav-id", "nav-item", "menu-text-color", "menu-text-size", "menu-text-bold", "display-highlight", "highlight-color", "nav-accordion-group", "as-link"])) : (n(), V(U, {
                 key: 0,
-                "nav-item": C,
-                "menu-text-color": l.menuTextColor,
-                "menu-text-size": l.menuTextSize,
-                "menu-text-bold": l.menuTextBold,
-                "display-highlight": l.displayHighlight,
-                "highlight-color": l.highlightColor,
-                "as-link": l.menuItemAsLink,
-                onNavLink: b
+                "nav-item": v,
+                "menu-text-color": e.menuTextColor,
+                "menu-text-size": e.menuTextSize,
+                "menu-text-bold": e.menuTextBold,
+                "display-highlight": e.displayHighlight,
+                "highlight-color": e.highlightColor,
+                "as-link": e.menuItemAsLink,
+                onNavLink: y
               }, null, 8, ["nav-item", "menu-text-color", "menu-text-size", "menu-text-bold", "display-highlight", "highlight-color", "as-link"]))
             ]))), 128))
           ]),
-          v["mobile-bottom"] ? (i(), c("div", xe, [
-            j(l.$slots, "mobile-bottom", { headerClose: h })
-          ])) : z("", !0)
+          m["mobile-bottom"] ? (n(), u("div", Ke, [
+            $(i.$slots, "mobile-bottom", { headerClose: x })
+          ])) : A("", !0)
         ])
       ]),
       _: 3
     }, 8, ["bg-color", "drawer-btn-border", "drawer-btn-color", "fade-in-on-scroll", "mobile-menu-bg-color"]));
   }
-}), He = { class: "relative flex gap-2 items-center justify-center" }, Ee = ["href", "target", "onClick"], ze = { class: "relative" }, Y = /* @__PURE__ */ D({
+}), qe = { class: "relative flex items-center justify-center gap-2" }, Je = ["href", "target", "onClick"], Qe = { class: "relative" }, K = /* @__PURE__ */ S({
   __name: "NavCollapseVertical",
   props: {
     navId: {},
@@ -409,125 +1856,123 @@ const ne = { class: "flex flex-col w-full" }, ie = { class: "self-center" }, ae
     asLink: { type: Boolean, default: !0 }
   },
   emits: ["label-click", "child-click"],
-  setup(L, { expose: w, emit: y }) {
-    const p = L, g = R(!1), v = R(), a = y, h = (e) => {
-      g.value = e;
-    }, k = () => {
-      var e;
-      (e = v.value) == null || e.close();
-    }, b = (e, u) => {
-      a("label-click", e, u, g.value);
-    }, s = (e, u) => {
-      var m;
-      const { asLink: d } = p;
-      d || e.preventDefault(), a("child-click", e, u), (m = v.value) == null || m.close(), k();
-    }, t = E(() => {
-      const { navId: e, navLocation: u } = p, m = e.toLowerCase().replaceAll(" ", "-");
-      return `nav-${u}-${m}`;
-    }), r = E(() => {
-      const { navAccordionGroup: e, navLocation: u } = p, d = e.toLowerCase().replaceAll(" ", "-");
-      return `nav-accordion-group-${u}-${d}`;
-    }), l = E(() => {
-      const { textColor: e, textSize: u, dHl: d, hlColor: m, fontBold: H } = p, I = [o("BODYTEXT", u)];
-      if (!d) {
-        const M = [
-          o("TEXTCOLOR", e),
-          o("HVTEXTCOLOR", m),
-          o("FCTEXTCOLOR", m)
+  setup(e, { expose: t, emit: a }) {
+    const b = e, c = D(!1), m = D(), C = a, x = (l) => {
+      c.value = l;
+    }, p = () => {
+      m.value?.close();
+    }, y = (l, g) => {
+      C("label-click", l, g, c.value);
+    }, T = (l, g) => {
+      const { asLink: h } = b;
+      h || l.preventDefault(), C("child-click", l, g), m.value?.close(), p();
+    }, s = O(() => {
+      const { navId: l, navLocation: g } = b, k = l.toLowerCase().replaceAll(" ", "-");
+      return `nav-${g}-${k}`;
+    }), d = O(() => {
+      const { navAccordionGroup: l, navLocation: g } = b, h = l.toLowerCase().replaceAll(" ", "-");
+      return `nav-accordion-group-${g}-${h}`;
+    }), i = O(() => {
+      const { textColor: l, textSize: g, dHl: h, hlColor: k, fontBold: I } = b, L = [r("BODYTEXT", g)];
+      if (!h) {
+        const z = [
+          r("TEXTCOLOR", l),
+          r("HVTEXTCOLOR", k),
+          r("FCTEXTCOLOR", k)
         ];
-        I.push(M.join(" "));
+        L.push(z.join(" "));
       }
-      if (d) {
-        const M = o("BEFOREBG", m);
-        I.push("before:inset-y-0 before:left-0 before:transition-[width] before:duration-300 before:ease-linear before:w-0 hover:before:w-full focus:before:w-full " + M);
-        const N = [
-          o("TEXTCOLOR", m),
-          o("HVTEXTCOLOR", e),
-          o("FCTEXTCOLOR", e)
+      if (h) {
+        const z = r("BEFOREBG", k);
+        L.push("before:inset-y-0 before:left-0 before:transition-[width] before:duration-300 before:ease-linear before:w-0 hover:before:w-full focus:before:w-full " + z);
+        const W = [
+          r("TEXTCOLOR", k),
+          r("HVTEXTCOLOR", l),
+          r("FCTEXTCOLOR", l)
         ];
-        I.push(N.join(" "));
+        L.push(W.join(" "));
       }
-      return H && I.push("font-bold"), I.join(" ");
-    }), f = E(() => {
-      const { dHl: e, hlColor: u, navLocation: d } = p, m = [];
-      if (!e)
+      return I && L.push("font-bold"), L.join(" ");
+    }), f = O(() => {
+      const { dHl: l, hlColor: g, navLocation: h } = b, k = [];
+      if (!l)
         return "";
-      const H = "before:absolute before:w-xs before:h-full before:bg-primary before:bg-opacity-70 ", I = d === "desktop" ? "before:left-0 " : "before:right-0 ";
-      return m.push(H + I + o("BEFOREBG", u)), m.join(" ");
-    }), C = E(() => {
-      const { textColor: e, textSize: u, dHl: d, hlColor: m, fontBold: H, navLocation: I } = p;
-      let M = u === "xl" ? "lg" : u === "lg" ? "md" : u === "md" ? "sm" : "xs";
-      const $ = [
-        o("TEXTCOLOR", e),
-        o("BODYTEXT", M)
+      const I = "before:absolute before:w-xs before:h-full before:bg-primary before:bg-opacity-70 ", L = h === "desktop" ? "before:left-0 " : "before:right-0 ";
+      return k.push(I + L + r("BEFOREBG", g)), k.join(" ");
+    }), v = O(() => {
+      const { textColor: l, textSize: g, dHl: h, hlColor: k, fontBold: I, navLocation: L } = b;
+      let z = g === "xl" ? "lg" : g === "lg" ? "md" : g === "md" ? "sm" : "xs";
+      const H = [
+        r("TEXTCOLOR", l),
+        r("BODYTEXT", z)
       ];
-      if (I === "mobile" && $.push("text-end"), !d) {
-        const N = [
-          o("TEXTCOLOR", e),
-          o("HVTEXTCOLOR", m),
-          o("FCTEXTCOLOR", m)
+      if (L === "mobile" && H.push("text-end"), !h) {
+        const W = [
+          r("TEXTCOLOR", l),
+          r("HVTEXTCOLOR", k),
+          r("FCTEXTCOLOR", k)
         ];
-        $.push(N.join(" "));
+        H.push(W.join(" "));
       }
-      if (d) {
-        const N = o("BEFOREBG", m), P = "before:inset-y-0 before:duration-300 before:ease-linear before:w-0 hover:before:w-full focus:before:w-full before:bg-opacity-70 ", Q = I === "desktop" ? "before:left-0 before:transition-[width] " : "before:left-full hover:before:left-0 focus:before:left-0 before:transition-[all] ";
-        $.push(P + Q + N);
-        const Z = [
-          o("TEXTCOLOR", m),
-          o("HVTEXTCOLOR", e),
-          o("FCTEXTCOLOR", e)
+      if (h) {
+        const W = r("BEFOREBG", k), te = "before:inset-y-0 before:duration-300 before:ease-linear before:w-0 hover:before:w-full focus:before:w-full before:bg-opacity-70 ", le = L === "desktop" ? "before:left-0 before:transition-[width] " : "before:left-full hover:before:left-0 focus:before:left-0 before:transition-[all] ";
+        H.push(te + le + W);
+        const re = [
+          r("TEXTCOLOR", k),
+          r("HVTEXTCOLOR", l),
+          r("FCTEXTCOLOR", l)
         ];
-        $.push(Z.join(" "));
+        H.push(re.join(" "));
       }
-      return H && $.push("font-bold"), $.join(" ");
+      return I && H.push("font-bold"), H.join(" ");
     });
-    return w({
-      closeCollapse: k
-    }), (e, u) => (i(), c("div", null, [
-      _((i(), c("button", {
-        class: T(["px-xs py-2xs relative text-center block w-full before:absolute transition-colors duration-300 ease-linear", [l.value]]),
-        onClick: u[0] || (u[0] = (d) => b(d, e.menuItem.title))
+    return t({
+      closeCollapse: p
+    }), (l, g) => (n(), u("div", null, [
+      J((n(), u("button", {
+        class: B(["px-xs py-2xs relative block w-full text-center transition-colors duration-300 ease-linear before:absolute", [i.value]]),
+        onClick: g[0] || (g[0] = (h) => y(h, e.menuItem.title))
       }, [
-        n("div", He, [
-          n("span", null, A(e.menuItem.title), 1),
-          (i(), c("svg", {
+        o("div", qe, [
+          o("span", null, G(e.menuItem.title), 1),
+          (n(), u("svg", {
             xmlns: "http://www.w3.org/2000/svg",
             viewBox: "0 0 448 512",
-            class: T(["h-[0.8rem] fill-current", [
-              g.value ? "rotate-180" : "rotate-0",
+            class: B(["h-[0.8rem] fill-current", [
+              c.value ? "rotate-180" : "rotate-0",
               "transition-transform duration-300 ease-in"
             ]])
-          }, u[1] || (u[1] = [
-            n("path", { d: "M224 416c-8.188 0-16.38-3.125-22.62-9.375l-192-192c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 338.8l169.4-169.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-192 192C240.4 412.9 232.2 416 224 416z" }, null, -1)
-          ]), 2))
+          }, [...g[1] || (g[1] = [
+            o("path", { d: "M224 416c-8.188 0-16.38-3.125-22.62-9.375l-192-192c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 338.8l169.4-169.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-192 192C240.4 412.9 232.2 416 224 416z" }, null, -1)
+          ])], 2))
         ])
       ], 2)), [
-        [B(q), void 0, t.value]
+        [w(ee), void 0, s.value]
       ]),
-      G(B(J), {
+      M(w(Z), {
         ref_key: "collapseRef",
-        ref: v,
-        id: t.value,
-        accordion: r.value,
-        onOpen: h,
-        onClose: h
+        ref: m,
+        id: s.value,
+        accordion: d.value,
+        onOpen: x,
+        onClose: x
       }, {
-        default: O(() => [
-          n("ul", {
-            class: T(["relative", [f.value]])
+        default: R(() => [
+          o("ul", {
+            class: B(["relative", [f.value]])
           }, [
-            (i(!0), c(S, null, X(e.menuItem.children, (d, m) => (i(), c("li", {
-              key: m,
-              class: T([e.navLocation === "desktop" ? "ml-xs" : "mr-xs"])
+            (n(!0), u(N, null, X(e.menuItem.children, (h, k) => (n(), u("li", {
+              key: k,
+              class: B([e.navLocation === "desktop" ? "ml-xs" : "mr-xs"])
             }, [
-              n("a", {
-                href: d.url,
-                target: d.target,
-                onClick: (H) => s(H, d),
-                class: T(["relative before:absolute w-full px-2xs py-3xs block overflow-x-hidden transition-colors duration-300 ease-linear", [C.value]])
+              o("a", {
+                href: h.url,
+                target: h.target,
+                onClick: (I) => T(I, h),
+                class: B(["px-2xs py-3xs relative block w-full overflow-x-hidden transition-colors duration-300 ease-linear before:absolute", [v.value]])
               }, [
-                n("span", ze, A(d.title), 1)
-              ], 10, Ee)
+                o("span", Qe, G(h.title), 1)
+              ], 10, Je)
             ], 2))), 128))
           ], 2)
         ]),
@@ -535,7 +1980,7 @@ const ne = { class: "flex flex-col w-full" }, ie = { class: "self-center" }, ae
       }, 8, ["id", "accordion"])
     ]));
   }
-}), Re = ["href", "target"], $e = { class: "relative" }, W = /* @__PURE__ */ D({
+}), Ze = ["href", "target"], _e = { class: "relative" }, q = /* @__PURE__ */ S({
   __name: "NavLinkVertical",
   props: {
     menuItem: {},
@@ -547,42 +1992,42 @@ const ne = { class: "flex flex-col w-full" }, ie = { class: "self-center" }, ae
     asLink: { type: Boolean, default: !0 }
   },
   emits: ["menu-click"],
-  setup(L, { emit: w }) {
-    const y = L, p = w, g = (a, h) => {
-      const { asLink: k } = y;
-      k || a.preventDefault(), p("menu-click", a, h);
-    }, v = E(() => {
-      const { textColor: a, textSize: h, dHl: k, hlColor: b, fontBold: s } = y, t = [o("BODYTEXT", h)];
-      if (!k) {
-        const r = [
-          o("TEXTCOLOR", a),
-          o("HVTEXTCOLOR", b),
-          o("FCTEXTCOLOR", b)
+  setup(e, { emit: t }) {
+    const a = e, b = t, c = (C, x) => {
+      const { asLink: p } = a;
+      p || C.preventDefault(), b("menu-click", C, x);
+    }, m = O(() => {
+      const { textColor: C, textSize: x, dHl: p, hlColor: y, fontBold: T } = a, s = [r("BODYTEXT", x)];
+      if (!p) {
+        const d = [
+          r("TEXTCOLOR", C),
+          r("HVTEXTCOLOR", y),
+          r("FCTEXTCOLOR", y)
         ];
-        t.push(r.join(" "));
+        s.push(d.join(" "));
       }
-      if (k) {
-        const r = o("BEFOREBG", b);
-        t.push("before:inset-y-0 before:left-0 before:transition-[width] before:duration-300 before:ease-linear before:w-0 hover:before:w-full focus:before:w-full " + r);
+      if (p) {
+        const d = r("BEFOREBG", y);
+        s.push("before:inset-y-0 before:left-0 before:transition-[width] before:duration-300 before:ease-linear before:w-0 hover:before:w-full focus:before:w-full " + d);
         const f = [
-          o("TEXTCOLOR", b),
-          o("HVTEXTCOLOR", a),
-          o("FCTEXTCOLOR", a)
+          r("TEXTCOLOR", y),
+          r("HVTEXTCOLOR", C),
+          r("FCTEXTCOLOR", C)
         ];
-        t.push(f.join(" "));
+        s.push(f.join(" "));
       }
-      return s && t.push("font-bold"), t.join(" ");
+      return T && s.push("font-bold"), s.join(" ");
     });
-    return (a, h) => (i(), c("a", {
-      class: T([[v.value], "px-xs py-2xs relative text-center block w-full before:absolute transition-colors duration-300 ease-linear"]),
-      href: a.menuItem.url,
-      target: a.menuItem.target ? a.menuItem.target : "_self",
-      onClick: h[0] || (h[0] = (k) => g(k, a.menuItem))
+    return (C, x) => (n(), u("a", {
+      class: B([[m.value], "px-xs py-2xs relative text-center block w-full before:absolute transition-colors duration-300 ease-linear"]),
+      href: e.menuItem.url,
+      target: e.menuItem.target ? e.menuItem.target : "_self",
+      onClick: x[0] || (x[0] = (p) => c(p, e.menuItem))
     }, [
-      n("span", $e, A(a.menuItem.title), 1)
-    ], 10, Re));
+      o("span", _e, G(e.menuItem.title), 1)
+    ], 10, Ze));
   }
-}), Ae = { class: "p-md text-center" }, Se = ["href", "target"], Xe = ["src", "alt"], De = ["href", "target"], Me = ["innerHTML"], Ne = { class: "flex flex-col" }, je = { key: 0 }, Ge = { class: "flex flex-col justify-between h-full" }, Fe = { class: "p-md text-center" }, Ve = ["href", "target"], Ke = ["src", "alt"], Ye = ["href", "target"], We = ["innerHTML"], _e = { class: "flex flex-col" }, Ue = { key: 0 }, Qe = /* @__PURE__ */ D({
+}), et = { class: "p-md text-center" }, tt = ["href", "target"], lt = ["src", "alt"], rt = ["href", "target"], at = ["innerHTML"], st = { class: "flex flex-col" }, it = { key: 0 }, ot = { class: "flex flex-col justify-between h-full" }, nt = { class: "p-md text-center" }, dt = ["href", "target"], ct = ["src", "alt"], gt = ["href", "target"], ht = ["innerHTML"], ut = { class: "flex flex-col" }, bt = { key: 0 }, pt = /* @__PURE__ */ S({
   __name: "MclHeaderB",
   props: {
     logo: {},
@@ -606,178 +2051,177 @@ const ne = { class: "flex flex-col w-full" }, ie = { class: "self-center" }, ae
     headerWidth: { default: 160 }
   },
   emits: ["toggle-drawer", "title-click", "menu-click", "collapse-click"],
-  setup(L, { expose: w, emit: y }) {
-    const p = L, g = U(), v = y, a = R(), h = R(), k = (e, u) => {
-      v("toggle-drawer", e, u);
-    }, b = () => {
-      var e;
-      (e = a.value) == null || e.headerClose();
-    }, s = () => {
-      for (let e = 0; e < h.value.length; e++)
-        h.value[e].closeCollapse();
-    }, t = (e) => {
-      const { titleBlockAsLink: u, titleBlockLink: d, titleBlockLinkTarget: m } = p;
-      u || e.preventDefault(), v("title-click", e, d, m), b(), s();
-    }, r = (e, u) => {
-      const { menuItemAsLink: d } = p;
-      d || e.preventDefault(), v("menu-click", e, u), b(), s();
-    }, l = (e, u, d) => {
-      v("collapse-click", e, u, d);
-    }, f = E(() => {
-      const { titleSize: e, titleColor: u } = p;
+  setup(e, { expose: t, emit: a }) {
+    const b = e, c = Q(), m = a, C = D(), x = D(), p = (l, g) => {
+      m("toggle-drawer", l, g);
+    }, y = () => {
+      C.value?.headerClose();
+    }, T = () => {
+      for (let l = 0; l < x.value.length; l++)
+        x.value[l].closeCollapse();
+    }, s = (l) => {
+      const { titleBlockAsLink: g, titleBlockLink: h, titleBlockLinkTarget: k } = b;
+      g || l.preventDefault(), m("title-click", l, h, k), y(), T();
+    }, d = (l, g) => {
+      const { menuItemAsLink: h } = b;
+      h || l.preventDefault(), m("menu-click", l, g), y(), T();
+    }, i = (l, g, h) => {
+      m("collapse-click", l, g, h);
+    }, f = O(() => {
+      const { titleSize: l, titleColor: g } = b;
       return [
-        o("H3", e),
-        o("TEXTCOLOR", u)
+        r("H3", l),
+        r("TEXTCOLOR", g)
       ].join(" ");
-    }), C = (e) => {
-      const u = e;
-      return typeof u.children > "u" ? !1 : u.children.length > 0;
+    }), v = (l) => {
+      const g = l;
+      return typeof g.children > "u" ? !1 : g.children.length > 0;
     };
-    return w({
-      headerClose: b
-    }), (e, u) => (i(), x(B(oe), {
+    return t({
+      headerClose: y
+    }), (l, g) => (n(), V(w(ne), {
       "bg-color": e.bgColor,
       "drawer-btn-color": e.drawerBtnColor,
       "drawer-btn-border": e.drawerBtnBorder,
       "header-width": e.headerWidth,
-      onToggleDrawer: k,
+      onToggleDrawer: p,
       ref_key: "componentRef",
-      ref: a
+      ref: C
     }, {
-      default: O(() => [
-        j(e.$slots, "default")
+      default: R(() => [
+        $(l.$slots, "default")
       ]),
-      content: O(() => [
-        n("div", null, [
-          n("div", Ae, [
-            n("a", {
+      content: R(() => [
+        o("div", null, [
+          o("div", et, [
+            o("a", {
               href: e.titleBlockLink,
               target: e.titleBlockLinkTarget,
-              onClick: t
+              onClick: s
             }, [
-              n("img", {
+              o("img", {
                 src: e.logo,
                 alt: e.logoAlt,
                 class: "h-full inline-block max-h-xl"
-              }, null, 8, Xe)
-            ], 8, Se)
+              }, null, 8, lt)
+            ], 8, tt)
           ]),
-          n("div", null, [
-            n("a", {
+          o("div", null, [
+            o("a", {
               href: e.titleBlockLink,
               target: e.titleBlockLinkTarget,
-              onClick: t
+              onClick: s
             }, [
-              n("h3", {
-                class: T([f.value, "text-center mb-md"]),
+              o("h3", {
+                class: B([f.value, "text-center mb-md"]),
                 innerHTML: e.title
-              }, null, 10, Me)
-            ], 8, De)
+              }, null, 10, at)
+            ], 8, rt)
           ]),
-          n("ul", Ne, [
-            (i(!0), c(S, null, X(e.menuItems, (d, m) => (i(), c("li", {
-              key: `menu-${m}`
+          o("ul", st, [
+            (n(!0), u(N, null, X(e.menuItems, (h, k) => (n(), u("li", {
+              key: `menu-${k}`
             }, [
-              C(d) ? (i(), x(Y, {
+              v(h) ? (n(), V(K, {
                 key: 1,
                 ref_for: !0,
                 ref_key: "collapseRef",
-                ref: h,
-                "nav-id": d.title,
+                ref: x,
+                "nav-id": h.title,
                 "nav-location": "desktop",
                 "nav-accordion-group": e.title,
-                "menu-item": d,
+                "menu-item": h,
                 "as-link": e.menuItemAsLink,
                 "text-color": e.menuTextColor,
                 "text-size": e.menuTextSize,
                 "font-bold": e.menuTextBold,
                 "d-hl": e.displayHighlight,
                 "hl-color": e.highlightColor,
-                onChildClick: r,
-                onLabelClick: l
-              }, null, 8, ["nav-id", "nav-accordion-group", "menu-item", "as-link", "text-color", "text-size", "font-bold", "d-hl", "hl-color"])) : (i(), x(W, {
+                onChildClick: d,
+                onLabelClick: i
+              }, null, 8, ["nav-id", "nav-accordion-group", "menu-item", "as-link", "text-color", "text-size", "font-bold", "d-hl", "hl-color"])) : (n(), V(q, {
                 key: 0,
-                "menu-item": d,
+                "menu-item": h,
                 "as-link": e.menuItemAsLink,
                 "text-color": e.menuTextColor,
                 "text-size": e.menuTextSize,
                 "font-bold": e.menuTextBold,
                 "d-hl": e.displayHighlight,
                 "hl-color": e.highlightColor,
-                onMenuClick: r
+                onMenuClick: d
               }, null, 8, ["menu-item", "as-link", "text-color", "text-size", "font-bold", "d-hl", "hl-color"]))
             ]))), 128))
           ])
         ])
       ]),
-      "content-bottom": O(() => [
-        g["content-bottom"] ? (i(), c("div", je, [
-          j(e.$slots, "content-bottom")
-        ])) : z("", !0)
+      "content-bottom": R(() => [
+        c["content-bottom"] ? (n(), u("div", it, [
+          $(l.$slots, "content-bottom")
+        ])) : A("", !0)
       ]),
-      "mobile-content": O(({ headerClose: d }) => [
-        n("div", Ge, [
-          n("div", null, [
-            n("div", Fe, [
-              n("a", {
+      "mobile-content": R(({ headerClose: h }) => [
+        o("div", ot, [
+          o("div", null, [
+            o("div", nt, [
+              o("a", {
                 href: e.titleBlockLink,
                 target: e.titleBlockLinkTarget,
-                onClick: t
+                onClick: s
               }, [
-                n("img", {
+                o("img", {
                   src: e.logo,
                   alt: e.logoAlt,
                   class: "h-full inline-block max-h-xl"
-                }, null, 8, Ke)
-              ], 8, Ve)
+                }, null, 8, ct)
+              ], 8, dt)
             ]),
-            n("div", null, [
-              n("a", {
+            o("div", null, [
+              o("a", {
                 href: e.titleBlockLink,
                 target: e.titleBlockLinkTarget,
-                onClick: t
+                onClick: s
               }, [
-                n("h3", {
-                  class: T([f.value, "text-center mb-md"]),
+                o("h3", {
+                  class: B([f.value, "text-center mb-md"]),
                   innerHTML: e.title
-                }, null, 10, We)
-              ], 8, Ye)
+                }, null, 10, ht)
+              ], 8, gt)
             ]),
-            n("ul", _e, [
-              (i(!0), c(S, null, X(e.menuItems, (m, H) => (i(), c("li", {
-                key: `menu-${H}`
+            o("ul", ut, [
+              (n(!0), u(N, null, X(e.menuItems, (k, I) => (n(), u("li", {
+                key: `menu-${I}`
               }, [
-                C(m) ? (i(), x(Y, {
+                v(k) ? (n(), V(K, {
                   key: 1,
-                  "nav-id": m.title,
+                  "nav-id": k.title,
                   "nav-location": "mobile",
                   "nav-accordion-group": e.title,
-                  "menu-item": m,
+                  "menu-item": k,
                   "as-link": e.menuItemAsLink,
                   "text-color": e.menuTextColor,
                   "text-size": e.menuTextSize,
                   "font-bold": e.menuTextBold,
                   "d-hl": e.displayHighlight,
                   "hl-color": e.highlightColor,
-                  onChildClick: r,
-                  onLabelClick: l
-                }, null, 8, ["nav-id", "nav-accordion-group", "menu-item", "as-link", "text-color", "text-size", "font-bold", "d-hl", "hl-color"])) : (i(), x(W, {
+                  onChildClick: d,
+                  onLabelClick: i
+                }, null, 8, ["nav-id", "nav-accordion-group", "menu-item", "as-link", "text-color", "text-size", "font-bold", "d-hl", "hl-color"])) : (n(), V(q, {
                   key: 0,
-                  "menu-item": m,
+                  "menu-item": k,
                   "as-link": e.menuItemAsLink,
                   "text-color": e.menuTextColor,
                   "text-size": e.menuTextSize,
                   "font-bold": e.menuTextBold,
                   "d-hl": e.displayHighlight,
                   "hl-color": e.highlightColor,
-                  onMenuClick: r
+                  onMenuClick: d
                 }, null, 8, ["menu-item", "as-link", "text-color", "text-size", "font-bold", "d-hl", "hl-color"]))
               ]))), 128))
             ])
           ]),
-          g["mobile-bottom"] ? (i(), c("div", Ue, [
-            j(e.$slots, "mobile-bottom", { headerClose: d })
-          ])) : z("", !0)
+          c["mobile-bottom"] ? (n(), u("div", bt, [
+            $(l.$slots, "mobile-bottom", { headerClose: h })
+          ])) : A("", !0)
         ])
       ]),
       _: 3
@@ -785,6 +2229,6 @@ const ne = { class: "flex flex-col w-full" }, ie = { class: "self-center" }, ae
   }
 });
 export {
-  Pe as MclHeaderA,
-  Qe as MclHeaderB
+  kt as MclHeaderA,
+  pt as MclHeaderB
 };