@beeq/core 1.12.2-beta.0 → 1.12.3-beta.0

package/dist/components/bq-side-menu.js

@@ -2,204 +2,5 @@
  * Built by Endavans
  * © https://beeq.design - Apache 2 License.
  */
-import { p as a, H as e, c as r, j as b, d as n, t } from "./p-DDCN9O42.js";
-
-import { i as q } from "./p-B4sM1t6Z.js";
-
-import { i } from "./p-D1A0LpG_.js";
-
-const bqSideMenuCss = () => `.transform{--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}::backdrop,:root{--bq-blue-100:#e7f0fd;--bq-blue-200:#d0e2fb;--bq-blue-300:#a1c5f7;--bq-blue-400:#73a8f3;--bq-blue-500:#448bef;--bq-blue-600:#156eeb;--bq-blue-700:#1158bc;--bq-blue-800:#0d428d;--bq-blue-900:#082c5e;--bq-blue-1000:#04162f;--bq-corai-100:#fff2f2;--bq-corai-200:#ffe6e6;--bq-corai-300:#ffccce;--bq-corai-400:#ffb3b5;--bq-corai-500:#ff999d;--bq-corai-600:#ff8084;--bq-corai-700:#cc666a;--bq-corai-800:#994d4f;--bq-corai-900:#663335;--bq-corai-1000:#331a1a;--bq-cyan-100:#e8f7fb;--bq-cyan-200:#d2f0f8;--bq-cyan-300:#a5e1f1;--bq-cyan-400:#78d1e9;--bq-cyan-500:#4bc2e2;--bq-cyan-600:#1eb3db;--bq-cyan-700:#188faf;--bq-cyan-800:#126b83;--bq-cyan-900:#0c4858;--bq-cyan-1000:#06242c;--bq-gold-100:#fbf4ec;--bq-gold-200:#f7e9da;--bq-gold-300:#f0d3b6;--bq-gold-400:#e8bc91;--bq-gold-500:#e1a66d;--bq-gold-600:#d99048;--bq-gold-700:#ae733a;--bq-gold-800:#82562b;--bq-gold-900:#573a1d;--bq-gold-1000:#2b1d0e;--bq-green-100:#e8f8ef;--bq-green-200:#d2f1e0;--bq-green-300:#a5e3c1;--bq-green-400:#78d5a1;--bq-green-500:#4bc782;--bq-green-600:#1eb963;--bq-green-700:#18944f;--bq-green-800:#126f3b;--bq-green-900:#0c4a28;--bq-green-1000:#062514;--bq-grey-100:#f1f2f4;--bq-grey-200:#e7e8eb;--bq-grey-300:#caccd2;--bq-grey-400:#a6aab3;--bq-grey-50:#f6f6f8;--bq-grey-500:#898e99;--bq-grey-600:#646a77;--bq-grey-700:#3f4350;--bq-grey-800:#2a2c35;--bq-grey-900:#1c1d23;--bq-grey-950:#15161a;--bq-grey-1000:#0d0e11;--bq-indigo-100:#edecfc;--bq-indigo-200:#dcdafa;--bq-indigo-300:#b9b5f5;--bq-indigo-400:#9590ef;--bq-indigo-500:#726bea;--bq-indigo-600:#4f46e5;--bq-indigo-700:#3f38b7;--bq-indigo-800:#2f2a89;--bq-indigo-900:#201c5c;--bq-indigo-1000:#100e2e;--bq-iris-100:#e9f0ff;--bq-iris-200:#d6e0ff;--bq-iris-300:#b2c0fe;--bq-iris-400:#8691f8;--bq-iris-500:#6061ee;--bq-iris-600:#4f46e5;--bq-iris-700:#413abd;--bq-iris-800:#332e95;--bq-iris-900:#26216d;--bq-iris-1000:#181545;--bq-lime-100:#f5fae8;--bq-lime-200:#ecf6d2;--bq-lime-300:#d9eda5;--bq-lime-400:#c5e379;--bq-lime-500:#b2da4c;--bq-lime-600:#9fd11f;--bq-lime-700:#7fa719;--bq-lime-800:#5f7d13;--bq-lime-900:#40540c;--bq-lime-1000:#202a06;--bq-magenta-100:#fce7f4;--bq-magenta-200:#f9cfea;--bq-magenta-300:#f39fd6;--bq-magenta-400:#ee6fbf;--bq-magenta-500:#e83fab;--bq-magenta-600:#de1395;--bq-magenta-700:#b20f77;--bq-magenta-800:#850c59;--bq-magenta-900:#58083c;--bq-magenta-1000:#2c041e;--bq-neutral-white:#fbfbfc;--bq-neutral-black:#060708;--bq-orange-100:#fbf0e9;--bq-orange-200:#f8e1d4;--bq-orange-300:#f1c2a8;--bq-orange-400:#eaa47d;--bq-orange-500:#e38551;--bq-orange-600:#dc6726;--bq-orange-700:#b0521e;--bq-orange-800:#843e17;--bq-orange-900:#58290f;--bq-orange-1000:#2c1508;--bq-purple-100:#efebf8;--bq-purple-200:#e0d7f2;--bq-purple-300:#c1afe5;--bq-purple-400:#a388d8;--bq-purple-500:#8460cb;--bq-purple-600:#6538be;--bq-purple-700:#512d98;--bq-purple-800:#3d2272;--bq-purple-900:#28164c;--bq-purple-1000:#140b26;--bq-red-100:#fce7ea;--bq-red-200:#f9d1d5;--bq-red-300:#f3a2ac;--bq-red-400:#ed7482;--bq-red-500:#e74559;--bq-red-600:#e1172f;--bq-red-700:#b41226;--bq-red-800:#870e1c;--bq-red-900:#5a0913;--bq-red-1000:#2d0509;--bq-sky-100:#eff4fb;--bq-sky-200:#dfeaf8;--bq-sky-300:#bfd5f1;--bq-sky-400:#9ec1e9;--bq-sky-500:#7eace2;--bq-sky-600:#5e97db;--bq-sky-700:#4b79af;--bq-sky-800:#385b83;--bq-sky-900:#263c58;--bq-sky-1000:#131e2c;--bq-teal-100:#e5f7f5;--bq-teal-200:#ccf0eb;--bq-teal-300:#99e1d8;--bq-teal-400:#66d2c4;--bq-teal-500:#33c3b1;--bq-teal-600:#00b49d;--bq-teal-700:#00907e;--bq-teal-800:#006c5e;--bq-teal-900:#00483f;--bq-teal-1000:#00241f;--bq-volcano-100:#feede7;--bq-volcano-200:#fddbd1;--bq-volcano-300:#fbb8a3;--bq-volcano-400:#fa9474;--bq-volcano-500:#f87146;--bq-volcano-600:#f64d18;--bq-volcano-700:#c53e13;--bq-volcano-800:#942e0e;--bq-volcano-900:#621f0a;--bq-volcano-1000:#310f05;--bq-yellow-100:#fefbe7;--bq-yellow-200:#fcf6d0;--bq-yellow-300:#faeea0;--bq-yellow-400:#f7e571;--bq-yellow-500:#f5dd41;--bq-yellow-600:#f2d412;--bq-yellow-700:#c2aa0e;--bq-yellow-800:#917f0b;--bq-yellow-900:#615507;--bq-yellow-1000:#302a04;--bq-endava-grey-50:#f7f7f8;--bq-endava-grey-100:#e4e6e7;--bq-endava-grey-200:#b5babe;--bq-endava-grey-300:#949ca1;--bq-endava-grey-400:#737d84;--bq-endava-grey-500:#525f67;--bq-endava-grey-600:#30404b;--bq-endava-grey-700:#2b3942;--bq-endava-grey-800:#263139;--bq-endava-grey-900:#192b37;--bq-endava-grey-950:#151b1e;--bq-endava-grey-1000:#0f1316;--bq-endava-neutral-white:#fafbfb;--bq-endava-neutral-black:#060708;--bq-endava-orange-100:#fef3f1;--bq-endava-orange-200:#fbd6d1;--bq-endava-orange-300:#fab7af;--bq-endava-orange-400:#fa988b;--bq-endava-orange-500:#fc7866;--bq-endava-orange-600:#ff5640;--bq-endava-orange-700:#ce4a39;--bq-endava-orange-800:#a03d30;--bq-endava-orange-900:#722e25;--bq-endava-orange-1000:#471e19}*,:after,:before{box-sizing:border-box}*{font:inherit;margin:0}ol[role=list],ul[role=list]{list-style-type:none}html{text-size-adjust:none;font-family:var(--bq-font-family);font-size:var(--bq-font-size--m)}html:focus-within{scroll-behavior:smooth}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bq-background--primary);color:var(--bq-text--primary);line-height:var(--bq-font-line-height--regular);min-height:100vb;text-rendering:optimizeSpeed}a:not([class]){text-decoration-skip-ink:auto}canvas,img,picture,svg,video{display:block;max-width:100%}button,input,select,textarea{font:inherit}h1,h2,h3,h4,h5,h6,p{overflow-wrap:break-word}@media (prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto;transition-duration:.01ms!important}}:where(:root){--bq-white:#fff;--bq-black:#060708;--bq-neutral-50:var(--bq-grey-50);--bq-neutral-100:var(--bq-grey-100);--bq-neutral-200:var(--bq-grey-200);--bq-neutral-300:var(--bq-grey-300);--bq-neutral-400:var(--bq-grey-400);--bq-neutral-500:var(--bq-grey-500);--bq-neutral-600:var(--bq-grey-600);--bq-neutral-700:var(--bq-grey-700);--bq-neutral-800:var(--bq-grey-800);--bq-neutral-900:var(--bq-grey-900);--bq-neutral-950:var(--bq-grey-950);--bq-neutral-1000:var(--bq-grey-1000);--bq-brand-light:var(--bq-iris-100);--bq-brand:var(--bq-iris-600);--bq-brand-dark:var(--bq-iris-1000);--bq-accent-light:var(--bq-purple-100);--bq-accent:var(--bq-purple-600);--bq-accent-dark:var(--bq-purple-1000);--bq-success-light:var(--bq-teal-100);--bq-success:var(--bq-teal-600);--bq-success-dark:var(--bq-teal-1000);--bq-danger-light:var(--bq-red-100);--bq-danger:var(--bq-red-600);--bq-danger-dark:var(--bq-red-1000);--bq-warning-light:var(--bq-gold-100);--bq-warning:var(--bq-gold-600);--bq-warning-dark:var(--bq-gold-1000);--bq-info-light:var(--bq-iris-100);--bq-info:var(--bq-iris-600);--bq-info-dark:var(--bq-iris-1000);--bq-focus:var(--bq-iris-600);--bq-data-01:var(--bq-brand);--bq-data-02:var(--bq-purple-600);--bq-data-03:var(--bq-magenta-600);--bq-data-04:var(--bq-cyan-600);--bq-data-05:var(--bq-teal-600);--bq-data-06:var(--bq-orange-600);--bq-data-07:var(--bq-yellow-600);--bq-data-08:var(--bq-red-600);--bq-data-09:var(--bq-blue-600);--bq-data-10:var(--bq-grey-600);--bq-data-11:var(--bq-black);--bq-data-12:var(--bq-white);--bq-radius--none:0;--bq-radius--xs2:0.125rem;--bq-radius--xs:0.25rem;--bq-radius--s:0.5rem;--bq-radius--m:0.75rem;--bq-radius--l:1.5rem;--bq-radius--full:9999px;--bq-box-shadow--xs:0 2px 0 rgba(0,0,0,.016);--bq-box-shadow--s:0 8px 24px rgba(0,0,0,.04);--bq-box-shadow--m:0 10px 48px -16px rgba(0,0,0,.12);--bq-box-shadow--l:0 20px 58px -16px rgba(0,0,0,.16);--bq-font-family:"Outfit",sans-serif;--bq-font-size--xs:0.75rem;--bq-font-size--s:0.875rem;--bq-font-size--m:1rem;--bq-font-size--l:1.125rem;--bq-font-size--xl:1.5rem;--bq-font-size--xxl:2rem;--bq-font-size--xxl2:2.5rem;--bq-font-size--xxl3:3rem;--bq-font-size--xxl4:3.5rem;--bq-font-size--xxl5:4rem;--bq-font-weight--thin:100;--bq-font-weight--light:300;--bq-font-weight--regular:400;--bq-font-weight--medium:500;--bq-font-weight--semibold:600;--bq-font-weight--bold:700;--bq-font-line-height--small:1.2;--bq-font-line-height--regular:1.5;--bq-font-line-height--large:1.5;--bq-spacing-xs3:0.125rem;--bq-spacing-xs2:0.25rem;--bq-spacing-xs:0.5rem;--bq-spacing-s:0.75rem;--bq-spacing-m:1rem;--bq-spacing-l:1.5rem;--bq-spacing-xl:2rem;--bq-spacing-xxl:2.5rem;--bq-spacing-xxl2:3.5rem;--bq-spacing-xxl3:4rem;--bq-spacing-xxl4:4.5rem;--bq-stroke-s:1px;--bq-stroke-m:2px;--bq-stroke-l:3px}.beeq:not([bq-mode]),.light,:root:not([bq-theme]):not([bq-mode]),:root[bq-theme=beeq]:not([bq-mode]),[bq-mode=light]{--bq-background--primary:var(--bq-white);--bq-background--secondary:var(--bq-neutral-100);--bq-background--tertiary:var(--bq-neutral-200);--bq-background--alt:var(--bq-neutral-300);--bq-background--inverse:var(--bq-neutral-900);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-800);--bq-icon--alt:var(--bq-white);--bq-icon--secondary:var(--bq-neutral-600);--bq-icon--inverse:var(--bq-neutral-50);--bq-icon--brand:var(--bq-brand);--bq-icon--info:var(--bq-brand);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-200);--bq-stroke--secondary:var(--bq-neutral-600);--bq-stroke--tertiary:var(--bq-neutral-900);--bq-stroke--inverse:var(--bq-white);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-50);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-brand);--bq-text--primary:var(--bq-neutral-800);--bq-text--secondary:var(--bq-neutral-600);--bq-text--inverse:var(--bq-neutral-50);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-brand);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-white);--bq-ui--secondary:var(--bq-neutral-100);--bq-ui--tertiary:var(--bq-neutral-500);--bq-ui--inverse:var(--bq-neutral-900);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-light);--bq-ui--alt:var(--bq-neutral-50);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-light);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-light);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-light);--bq-ui--info:var(--bq-brand);--bq-ui--info-alt:var(--bq-brand-light);--bq-hover:#bcbfc5;--bq-active:#444546}.dark,[bq-mode=dark]{--bq-background--primary:var(--bq-neutral-1000);--bq-background--secondary:var(--bq-neutral-950);--bq-background--tertiary:var(--bq-neutral-800);--bq-background--alt:var(--bq-neutral-700);--bq-background--inverse:var(--bq-neutral-600);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-100);--bq-icon--secondary:var(--bq-neutral-400);--bq-icon--inverse:var(--bq-neutral-800);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-brand);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-900);--bq-stroke--secondary:var(--bq-neutral-700);--bq-stroke--tertiary:var(--bq-neutral-400);--bq-stroke--inverse:var(--bq-neutral-950);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-1000);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-brand);--bq-text--primary:var(--bq-neutral-100);--bq-text--secondary:var(--bq-neutral-400);--bq-text--inverse:var(--bq-neutral-800);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-brand);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-neutral-900);--bq-ui--secondary:var(--bq-neutral-950);--bq-ui--tertiary:var(--bq-neutral-700);--bq-ui--inverse:var(--bq-neutral-100);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-dark);--bq-ui--alt:var(--bq-neutral-950);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-dark);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-dark);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-dark);--bq-ui--info:var(--bq-brand);--bq-ui--info-alt:var(--bq-brand-dark);--bq-hover:#444546;--bq-active:#1f2026}:where(.endava),:where([bq-theme=endava]){--bq-font-family:"Poppins",sans-serif;--bq-white:#fafbfb;--bq-black:#030406;--bq-neutral-50:var(--bq-endava-grey-50);--bq-neutral-100:var(--bq-endava-grey-100);--bq-neutral-200:var(--bq-endava-grey-200);--bq-neutral-300:var(--bq-endava-grey-300);--bq-neutral-400:var(--bq-endava-grey-400);--bq-neutral-500:var(--bq-endava-grey-500);--bq-neutral-600:var(--bq-endava-grey-600);--bq-neutral-700:var(--bq-endava-grey-700);--bq-neutral-800:var(--bq-endava-grey-800);--bq-neutral-900:var(--bq-endava-grey-900);--bq-neutral-950:var(--bq-endava-grey-950);--bq-neutral-1000:var(--bq-endava-grey-1000);--bq-brand-light:var(--bq-endava-orange-100);--bq-brand:var(--bq-endava-orange-600);--bq-brand-dark:var(--bq-endava-orange-1000);--bq-accent-light:var(--bq-endava-orange-100);--bq-accent:var(--bq-endava-orange-600);--bq-accent-dark:var(--bq-endava-orange-1000);--bq-success-light:var(--bq-green-100);--bq-success:var(--bq-green-600);--bq-success-dark:var(--bq-green-1000);--bq-danger-light:var(--bq-corai-100);--bq-danger:var(--bq-corai-600);--bq-danger-dark:var(--bq-corai-1000);--bq-warning-light:var(--bq-yellow-100);--bq-warning:var(--bq-yellow-600);--bq-warning-dark:var(--bq-yellow-1000);--bq-info-light:var(--bq-blue-100);--bq-info:var(--bq-blue-600);--bq-info-dark:var(--bq-blue-1000);--bq-focus:var(--bq-endava-orange-600);--bq-data-01:var(--bq-brand);--bq-data-02:#af0cd8;--bq-data-03:#0ca8d8;--bq-data-04:var(--bq-teal-600);--bq-data-05:var(--bq-yellow-600);--bq-data-06:var(--bq-orange-600);--bq-data-07:var(--bq-blue-600);--bq-data-08:var(--bq-red-600);--bq-data-09:var(--bq-purple-600);--bq-data-10:#394b56;--bq-data-11:var(--bq-black);--bq-data-12:var(--bq-white)}.endava.light,.endava:not([bq-mode]),[bq-theme=endava]:not([bq-mode]),[bq-theme=endava][bq-mode=light]{--bq-background--primary:var(--bq-white);--bq-background--secondary:var(--bq-neutral-100);--bq-background--tertiary:var(--bq-neutral-200);--bq-background--alt:var(--bq-neutral-300);--bq-background--inverse:var(--bq-neutral-900);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-800);--bq-icon--secondary:var(--bq-neutral-600);--bq-icon--inverse:var(--bq-neutral-50);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-info);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-200);--bq-stroke--secondary:var(--bq-neutral-600);--bq-stroke--tertiary:var(--bq-neutral-900);--bq-stroke--inverse:var(--bq-white);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-50);--bq-stroke--brand-alt:var(--bq-brand-light);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-info);--bq-text--primary:var(--bq-neutral-800);--bq-text--secondary:var(--bq-neutral-600);--bq-text--inverse:var(--bq-neutral-50);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-info);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-white);--bq-ui--secondary:var(--bq-neutral-100);--bq-ui--tertiary:var(--bq-neutral-500);--bq-ui--inverse:var(--bq-neutral-900);--bq-ui--alt:var(--bq-neutral-50);--bq-ui--brand-alt:var(--bq-brand-light);--bq-ui--brand:var(--bq-brand);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-light);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-light);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-light);--bq-ui--info:var(--bq-info);--bq-ui--info-alt:var(--bq-info-light);--bq-hover:#444546;--bq-active:#1f2026}.endava.dark,[bq-theme=endava][bq-mode=dark]{--bq-background--primary:var(--bq-neutral-1000);--bq-background--secondary:var(--bq-neutral-900);--bq-background--tertiary:var(--bq-neutral-800);--bq-background--alt:var(--bq-neutral-700);--bq-background--inverse:var(--bq-neutral-600);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-100);--bq-icon--secondary:var(--bq-neutral-400);--bq-icon--inverse:var(--bq-neutral-800);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-info);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-900);--bq-stroke--secondary:var(--bq-neutral-700);--bq-stroke--tertiary:var(--bq-neutral-400);--bq-stroke--inverse:var(--bq-neutral-950);--bq-stroke--brand:var(--bq-brand);--bq-stroke--brand-alt:var(--bq-brand-dark);--bq-stroke--alt:var(--bq-neutral-1000);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-info);--bq-text--primary:var(--bq-neutral-100);--bq-text--secondary:var(--bq-neutral-400);--bq-text--inverse:var(--bq-neutral-800);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-neutral-white);--bq-text--info:var(--bq-info);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-neutral-900);--bq-ui--secondary:var(--bq-neutral-950);--bq-ui--tertiary:var(--bq-neutral-700);--bq-ui--inverse:var(--bq-neutral-100);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-dark);--bq-ui--alt:var(--bq-neutral-950);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-dark);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-dark);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-dark);--bq-ui--info:var(--bq-info);--bq-ui--info-alt:var(--bq-info-dark);--bq-hover:#444546;--bq-active:#1f2026}.fixed{position:fixed}.sticky{position:sticky}.top-0{top:0}.z-\\[1\\]{z-index:1}.box-content{box-sizing:content-box}.flex{display:flex}.hidden{display:none}.h-dynamic-vh{height:100dvh}.grow{flex-grow:1}.flex-col{flex-direction:column}.items-center{align-items:center}.overflow-hidden{overflow:hidden}.border-0{border-width:0}.border-e-s{border-inline-end-width:var(--bq-stroke-s)}.border-solid{border-style:solid}.border-\\[color\\:--bq-side-menu--border-color\\]{border-color:var(--bq-side-menu--border-color)}.bg-\\[--bq-side-menu--bg-color\\]{background-color:var(--bq-side-menu--bg-color)}.text-\\[color\\:--bq-side-menu--brand-color\\]{color:var(--bq-side-menu--brand-color)}.transition-\\[background-color\\2c width\\]{transition-duration:.15s;transition-property:background-color,width;transition-timing-function:cubic-bezier(.4,0,.2,1)}.is-\\[--bq-side-menu--width-collapse\\]{inline-size:var(--bq-side-menu--width-collapse)}.is-\\[--bq-side-menu--width\\]{inline-size:var(--bq-side-menu--width)}.inset-bs-0{inset-block-start:0}@-webkit-keyframes fade-in{0%{opacity:0}}@keyframes fade-in{0%{opacity:0}}@-webkit-keyframes slide-in{0%{-webkit-transform:translateY(10px);transform:translateY(10px)}}@keyframes slide-in{0%{-webkit-transform:translateY(10px);transform:translateY(10px)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}:host{--bq-side-menu--bg-color:var(--bq-ui--primary);--bq-side-menu--brand-color:var(--bq-ui--brand);--bq-side-menu--border-color:var(--bq-stroke--primary);display:flex;overflow:hidden}.bq-side-menu{-ms-overflow-style:none;background-color:var(--bq-side-menu--bg-color);border-color:var(--bq-side-menu--border-color);border-width:0;border-inline-end-width:var(--bq-stroke-s);border-style:solid;display:flex;flex-direction:column;flex-grow:1;height:100dvh;inline-size:var(--bq-side-menu--width);inset-block-start:0;inset-inline-start:0;position:fixed;scrollbar-width:none;transition-duration:.15s;transition-property:background-color,width;transition-timing-function:cubic-bezier(.4,0,.2,1)}.bq-side-menu::-webkit-scrollbar{display:none}.bq-side-menu.is-collapsed{inline-size:var(--bq-side-menu--width-collapse)}.bq-side-menu--logo{align-items:center;background-color:var(--bq-side-menu--bg-color);box-sizing:content-box;color:var(--bq-side-menu--brand-color);display:flex;padding:var(--bq-spacing-xs);position:sticky;top:0;z-index:1}:host([size=small]) ::slotted(bq-side-menu-item){--bq-side-menu-item--paddingY:var(--bq-spacing-s)}:host([appearance=brand]){--bq-focus:var(--bq-stroke--alt);--bq-side-menu--bg-color:var(--bq-ui--brand);--bq-side-menu--brand-color:var(--bq-stroke--inverse);--bq-side-menu--border-color:var(--bq-stroke--brand)}:host([appearance=brand]) ::slotted(bq-side-menu-item){--bq-side-menu-item--bg-hover:color-mix(in srgb,var(--bq-ui--brand),var(--bq-hover) 20%);--bq-side-menu-item--text-default:var(--bq-text--alt);--bq-side-menu-item--text-hover:var(--bq-text--alt)}:host([appearance=brand]) .bq-side-menu--footer ::slotted([slot=footer]){--bq-ui--secondary:transparent;--bq-button--icon-color:var(--bq-text--alt);--bq-button-hover--icon-color:var(--bq-text--primary)}:host([appearance=inverse]){--bq-side-menu--bg-color:var(--bq-ui--inverse);--bq-side-menu--brand-color:var(--bq-stroke--inverse);--bq-side-menu--border-color:var(--bq-ui--inverse)}:host([appearance=inverse]) ::slotted(bq-side-menu-item){--bq-side-menu-item--bg-hover:color-mix(in srgb,var(--bq-ui--inverse),var(--bq-hover) 20%);--bq-side-menu-item--bg-active:color-mix(in srgb,var(--bq-ui--alt),var(--bq-active) 20%);--bq-side-menu-item--text-default:var(--bq-text--inverse);--bq-side-menu-item--text-hover:var(--bq-text--inverse);--bq-side-menu-item--text-active:var(--bq-text--primary)}:host([appearance=inverse]) .bq-side-menu--footer ::slotted([slot=footer]){--bq-ui--secondary:transparent;--bq-button--icon-color:var(--bq-text--inverse);--bq-button-hover--icon-color:var(--bq-text--primary)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.collapse{visibility:collapse}.static{position:static}.justify-center{justify-content:center}.gap-y-xs{row-gap:var(--bq-spacing-xs)}.overflow-y-auto{overflow-y:auto}.bg-\\[var\\(--bq-side-menu--bg-color\\)\\]{background-color:var(--bq-side-menu--bg-color)}.p-xs{padding:var(--bq-spacing-xs)}.px-xs{padding-left:var(--bq-spacing-xs);padding-right:var(--bq-spacing-xs)}.pt-xs2{padding-top:var(--bq-spacing-xs2)}.inset-be-0{inset-block-end:0}.m-bs-\\[auto\\]{margin-block-start:auto}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}`;
-
-const o =  a(class a extends e {
-  constructor(a) {
-    super();
-    if (a !== false) {
-      this.__registerHost();
-    }
-    this.__attachShadow();
-    this.bqCollapse = r(this, "bqCollapse");
-    this.bqSelect = r(this, "bqSelect");
-  }
-  // Own Properties
-  // ====================
-  menuItemCssSelector="bq-side-menu-item";
-  bodyCss="bq-body--side-menu";
-  bodyCssExpand="bq-body--side-menu__expand";
-  bodyCssCollapse="bq-body--side-menu__collapse";
-  menuElem;
-  // Reference to host HTML element
-  // ===================================
-  // State() variables
-  // Inlined decorator, alphabetical order
-  // =======================================
-  documentBody;
-  // Public Property API
-  // ========================
-  /** It sets a predefined appearance of the side menu */
-  appearance="default";
-  /** If true, the container will reduce its width */
-  collapse=false;
-  /** It sets the size of the navigation menu items */
-  size="medium";
-  // Prop lifecycle events
-  // =======================
-  onCollapsePropChange() {
-    this.handleCollapse();
-    this.bqCollapse.emit({
-      collapse: this.collapse
-    });
-  }
-  // Events section
-  // Requires JSDocs for public API documentation
-  // ==============================================
-  /** Callback handler to be called when the Side menu changes its width from expanded to collapse and vice versa */
-  bqCollapse;
-  /** Callback handler to be called when the active/selected menu item changes */
-  bqSelect;
-  // Component lifecycle events
-  // Ordered by their natural call order
-  // =====================================
-  componentDidLoad() {
-    if (!q()) return;
-    this.documentBody = document.querySelector("body");
-    this.documentBody.classList.add(this.bodyCss);
-    this.handleCollapse();
-  }
-  disconnectedCallback() {
-    this.cleanDocumentBodyClass();
-  }
-  // Listeners
-  // ==============
-  onMenuItemClick(a) {
-    const {target: e} = a;
-    if (!i(e, "bq-side-menu-item")) return;
-    this.menuItems.forEach((a => {
-      a.active = !a.disabled && a === e;
-    }));
-    this.bqSelect.emit(e);
-  }
-  // Public methods API
-  // These methods are exposed on the host element.
-  // Always use two lines.
-  // Public Methods must be async.
-  // Requires JSDocs for public API documentation.
-  // ===============================================
-  /** Toggle the collapse state of the side menu */
-  async toggleCollapse() {
-    this.collapse = !this.collapse;
-  }
-  // Local methods
-  // Internal business logic.
-  // These methods cannot be called from the host element.
-  // =======================================================
-  get menuItems() {
-    if (!this.menuElem) return [];
-    const a = this.menuElem.querySelector("slot");
-    return [ ...a.assignedElements({
-      flatten: true
-    }) ].filter((a => a.tagName.toLowerCase() === this.menuItemCssSelector));
-  }
-  handleCollapse=() => {
-    if (!this.menuItems.length) return;
-    this.menuItems.forEach((a => {
-      a.collapse = this.collapse;
-    }));
-    if (this.collapse) {
-      this.collapseDocumentBody();
-    } else {
-      this.expandDocumentBody();
-    }
-  };
-  collapseDocumentBody=() => {
-    if (!this.collapse) return;
-    this.documentBody.classList.remove(this.bodyCssExpand);
-    this.documentBody.classList.add(this.bodyCssCollapse);
-  };
-  expandDocumentBody=() => {
-    if (this.collapse) return;
-    this.documentBody.classList.remove(this.bodyCssCollapse);
-    this.documentBody.classList.add(this.bodyCssExpand);
-  };
-  cleanDocumentBodyClass=() => {
-    this.documentBody.classList.remove(this.bodyCss, this.bodyCssCollapse, this.bodyCssExpand);
-  };
-  // render() function
-  // Always the last one in the class.
-  // ===================================
-  render() {
-    return b("aside", {
-      class: {
-        "bq-side-menu overflow-y-auto": true,
-        "is-collapsed": this.collapse
-      },
-      part: "base",
-      children: [ n("div", {
-        class: {
-          "bq-side-menu--logo": true,
-          "is-collapsed": this.collapse
-        },
-        part: "logo",
-        children: n("slot", {
-          name: "logo"
-        }, "5dc1a479de60469eea251b6883ac37e12e92b1f0")
-      }, "2e867fbe5d0a30d6c7d694df40a0685acda64b14"), n("nav", {
-        class: "bq-side-menu--nav flex flex-col gap-y-xs px-xs pt-xs2",
-        part: "nav",
-        ref: a => {
-          this.menuElem = a;
-        },
-        children: n("slot", {}, "ffddfe410753e0a00053ed9f818f5da596bd72ed")
-      }, "2810d72d9a1a1194cf1d0baf7f5673ad340395ea"), n("div", {
-        class: "bq-side-menu--footer sticky inset-be-0 m-bs-[auto] flex justify-center bg-[var(--bq-side-menu--bg-color)] p-xs",
-        part: "footer",
-        children: n("slot", {
-          name: "footer"
-        }, "319d0b8527d601feb18f8524d54b77c9b0090d1e")
-      }, "0e4e456b83e78ca6fed069ec42d22fb6edbf6700") ]
-    }, "16b2e69072f0cfdcee4db1ee09e91ec552c406d6");
-  }
-  static get watchers() {
-    return {
-      collapse: [ {
-        onCollapsePropChange: 0
-      } ]
-    };
-  }
-  static get style() {
-    return bqSideMenuCss();
-  }
-}, [ 769, "bq-side-menu", {
-  appearance: [ 513 ],
-  collapse: [ 516 ],
-  size: [ 513 ],
-  documentBody: [ 32 ],
-  toggleCollapse: [ 64 ]
-}, [ [ 1, "bqClick", "onMenuItemClick" ] ], {
-  collapse: [ {
-    onCollapsePropChange: 0
-  } ]
-} ]);
-
-function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const a = [ "bq-side-menu" ];
-  a.forEach((a => {
-    switch (a) {
-     case "bq-side-menu":
-      if (!customElements.get(t(a))) {
-        customElements.define(t(a), o);
-      }
-      break;
-    }
-  }));
-}
-
-const s = o;
-
-const d = defineCustomElement$1;
-
-export { s as BqSideMenu, d as defineCustomElement };
-//# sourceMappingURL=bq-side-menu.js.map
+import{p as a,H as e,c as r,h as b,t as n}from"./p-DDVIIUm1.js";import{i as t}from"./p-B4sM1t6Z.js";import{i as q}from"./p-D1A0LpG_.js";const i=()=>`.transform{--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}::backdrop,:root{--bq-blue-100:#e7f0fd;--bq-blue-200:#d0e2fb;--bq-blue-300:#a1c5f7;--bq-blue-400:#73a8f3;--bq-blue-500:#448bef;--bq-blue-600:#156eeb;--bq-blue-700:#1158bc;--bq-blue-800:#0d428d;--bq-blue-900:#082c5e;--bq-blue-1000:#04162f;--bq-corai-100:#fff2f2;--bq-corai-200:#ffe6e6;--bq-corai-300:#ffccce;--bq-corai-400:#ffb3b5;--bq-corai-500:#ff999d;--bq-corai-600:#ff8084;--bq-corai-700:#cc666a;--bq-corai-800:#994d4f;--bq-corai-900:#663335;--bq-corai-1000:#331a1a;--bq-cyan-100:#e8f7fb;--bq-cyan-200:#d2f0f8;--bq-cyan-300:#a5e1f1;--bq-cyan-400:#78d1e9;--bq-cyan-500:#4bc2e2;--bq-cyan-600:#1eb3db;--bq-cyan-700:#188faf;--bq-cyan-800:#126b83;--bq-cyan-900:#0c4858;--bq-cyan-1000:#06242c;--bq-gold-100:#fbf4ec;--bq-gold-200:#f7e9da;--bq-gold-300:#f0d3b6;--bq-gold-400:#e8bc91;--bq-gold-500:#e1a66d;--bq-gold-600:#d99048;--bq-gold-700:#ae733a;--bq-gold-800:#82562b;--bq-gold-900:#573a1d;--bq-gold-1000:#2b1d0e;--bq-green-100:#e8f8ef;--bq-green-200:#d2f1e0;--bq-green-300:#a5e3c1;--bq-green-400:#78d5a1;--bq-green-500:#4bc782;--bq-green-600:#1eb963;--bq-green-700:#18944f;--bq-green-800:#126f3b;--bq-green-900:#0c4a28;--bq-green-1000:#062514;--bq-grey-100:#f1f2f4;--bq-grey-200:#e7e8eb;--bq-grey-300:#caccd2;--bq-grey-400:#a6aab3;--bq-grey-50:#f6f6f8;--bq-grey-500:#898e99;--bq-grey-600:#646a77;--bq-grey-700:#3f4350;--bq-grey-800:#2a2c35;--bq-grey-900:#1c1d23;--bq-grey-950:#15161a;--bq-grey-1000:#0d0e11;--bq-indigo-100:#edecfc;--bq-indigo-200:#dcdafa;--bq-indigo-300:#b9b5f5;--bq-indigo-400:#9590ef;--bq-indigo-500:#726bea;--bq-indigo-600:#4f46e5;--bq-indigo-700:#3f38b7;--bq-indigo-800:#2f2a89;--bq-indigo-900:#201c5c;--bq-indigo-1000:#100e2e;--bq-iris-100:#e9f0ff;--bq-iris-200:#d6e0ff;--bq-iris-300:#b2c0fe;--bq-iris-400:#8691f8;--bq-iris-500:#6061ee;--bq-iris-600:#4f46e5;--bq-iris-700:#413abd;--bq-iris-800:#332e95;--bq-iris-900:#26216d;--bq-iris-1000:#181545;--bq-lime-100:#f5fae8;--bq-lime-200:#ecf6d2;--bq-lime-300:#d9eda5;--bq-lime-400:#c5e379;--bq-lime-500:#b2da4c;--bq-lime-600:#9fd11f;--bq-lime-700:#7fa719;--bq-lime-800:#5f7d13;--bq-lime-900:#40540c;--bq-lime-1000:#202a06;--bq-magenta-100:#fce7f4;--bq-magenta-200:#f9cfea;--bq-magenta-300:#f39fd6;--bq-magenta-400:#ee6fbf;--bq-magenta-500:#e83fab;--bq-magenta-600:#de1395;--bq-magenta-700:#b20f77;--bq-magenta-800:#850c59;--bq-magenta-900:#58083c;--bq-magenta-1000:#2c041e;--bq-neutral-white:#fbfbfc;--bq-neutral-black:#060708;--bq-orange-100:#fbf0e9;--bq-orange-200:#f8e1d4;--bq-orange-300:#f1c2a8;--bq-orange-400:#eaa47d;--bq-orange-500:#e38551;--bq-orange-600:#dc6726;--bq-orange-700:#b0521e;--bq-orange-800:#843e17;--bq-orange-900:#58290f;--bq-orange-1000:#2c1508;--bq-purple-100:#efebf8;--bq-purple-200:#e0d7f2;--bq-purple-300:#c1afe5;--bq-purple-400:#a388d8;--bq-purple-500:#8460cb;--bq-purple-600:#6538be;--bq-purple-700:#512d98;--bq-purple-800:#3d2272;--bq-purple-900:#28164c;--bq-purple-1000:#140b26;--bq-red-100:#fce7ea;--bq-red-200:#f9d1d5;--bq-red-300:#f3a2ac;--bq-red-400:#ed7482;--bq-red-500:#e74559;--bq-red-600:#e1172f;--bq-red-700:#b41226;--bq-red-800:#870e1c;--bq-red-900:#5a0913;--bq-red-1000:#2d0509;--bq-sky-100:#eff4fb;--bq-sky-200:#dfeaf8;--bq-sky-300:#bfd5f1;--bq-sky-400:#9ec1e9;--bq-sky-500:#7eace2;--bq-sky-600:#5e97db;--bq-sky-700:#4b79af;--bq-sky-800:#385b83;--bq-sky-900:#263c58;--bq-sky-1000:#131e2c;--bq-teal-100:#e5f7f5;--bq-teal-200:#ccf0eb;--bq-teal-300:#99e1d8;--bq-teal-400:#66d2c4;--bq-teal-500:#33c3b1;--bq-teal-600:#00b49d;--bq-teal-700:#00907e;--bq-teal-800:#006c5e;--bq-teal-900:#00483f;--bq-teal-1000:#00241f;--bq-volcano-100:#feede7;--bq-volcano-200:#fddbd1;--bq-volcano-300:#fbb8a3;--bq-volcano-400:#fa9474;--bq-volcano-500:#f87146;--bq-volcano-600:#f64d18;--bq-volcano-700:#c53e13;--bq-volcano-800:#942e0e;--bq-volcano-900:#621f0a;--bq-volcano-1000:#310f05;--bq-yellow-100:#fefbe7;--bq-yellow-200:#fcf6d0;--bq-yellow-300:#faeea0;--bq-yellow-400:#f7e571;--bq-yellow-500:#f5dd41;--bq-yellow-600:#f2d412;--bq-yellow-700:#c2aa0e;--bq-yellow-800:#917f0b;--bq-yellow-900:#615507;--bq-yellow-1000:#302a04;--bq-endava-grey-50:#f7f7f8;--bq-endava-grey-100:#e4e6e7;--bq-endava-grey-200:#b5babe;--bq-endava-grey-300:#949ca1;--bq-endava-grey-400:#737d84;--bq-endava-grey-500:#525f67;--bq-endava-grey-600:#30404b;--bq-endava-grey-700:#2b3942;--bq-endava-grey-800:#263139;--bq-endava-grey-900:#192b37;--bq-endava-grey-950:#151b1e;--bq-endava-grey-1000:#0f1316;--bq-endava-neutral-white:#fafbfb;--bq-endava-neutral-black:#060708;--bq-endava-orange-100:#fef3f1;--bq-endava-orange-200:#fbd6d1;--bq-endava-orange-300:#fab7af;--bq-endava-orange-400:#fa988b;--bq-endava-orange-500:#fc7866;--bq-endava-orange-600:#ff5640;--bq-endava-orange-700:#ce4a39;--bq-endava-orange-800:#a03d30;--bq-endava-orange-900:#722e25;--bq-endava-orange-1000:#471e19}*,:after,:before{box-sizing:border-box}*{font:inherit;margin:0}ol[role=list],ul[role=list]{list-style-type:none}html{text-size-adjust:none;font-family:var(--bq-font-family);font-size:var(--bq-font-size--m)}html:focus-within{scroll-behavior:smooth}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bq-background--primary);color:var(--bq-text--primary);line-height:var(--bq-font-line-height--regular);min-height:100vb;text-rendering:optimizeSpeed}a:not([class]){text-decoration-skip-ink:auto}canvas,img,picture,svg,video{display:block;max-width:100%}button,input,select,textarea{font:inherit}h1,h2,h3,h4,h5,h6,p{overflow-wrap:break-word}@media (prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto;transition-duration:.01ms!important}}:where(:root){--bq-white:#fff;--bq-black:#060708;--bq-neutral-50:var(--bq-grey-50);--bq-neutral-100:var(--bq-grey-100);--bq-neutral-200:var(--bq-grey-200);--bq-neutral-300:var(--bq-grey-300);--bq-neutral-400:var(--bq-grey-400);--bq-neutral-500:var(--bq-grey-500);--bq-neutral-600:var(--bq-grey-600);--bq-neutral-700:var(--bq-grey-700);--bq-neutral-800:var(--bq-grey-800);--bq-neutral-900:var(--bq-grey-900);--bq-neutral-950:var(--bq-grey-950);--bq-neutral-1000:var(--bq-grey-1000);--bq-brand-light:var(--bq-iris-100);--bq-brand:var(--bq-iris-600);--bq-brand-dark:var(--bq-iris-1000);--bq-accent-light:var(--bq-purple-100);--bq-accent:var(--bq-purple-600);--bq-accent-dark:var(--bq-purple-1000);--bq-success-light:var(--bq-teal-100);--bq-success:var(--bq-teal-600);--bq-success-dark:var(--bq-teal-1000);--bq-danger-light:var(--bq-red-100);--bq-danger:var(--bq-red-600);--bq-danger-dark:var(--bq-red-1000);--bq-warning-light:var(--bq-gold-100);--bq-warning:var(--bq-gold-600);--bq-warning-dark:var(--bq-gold-1000);--bq-info-light:var(--bq-iris-100);--bq-info:var(--bq-iris-600);--bq-info-dark:var(--bq-iris-1000);--bq-focus:var(--bq-iris-600);--bq-data-01:var(--bq-brand);--bq-data-02:var(--bq-purple-600);--bq-data-03:var(--bq-magenta-600);--bq-data-04:var(--bq-cyan-600);--bq-data-05:var(--bq-teal-600);--bq-data-06:var(--bq-orange-600);--bq-data-07:var(--bq-yellow-600);--bq-data-08:var(--bq-red-600);--bq-data-09:var(--bq-blue-600);--bq-data-10:var(--bq-grey-600);--bq-data-11:var(--bq-black);--bq-data-12:var(--bq-white);--bq-radius--none:0;--bq-radius--xs2:0.125rem;--bq-radius--xs:0.25rem;--bq-radius--s:0.5rem;--bq-radius--m:0.75rem;--bq-radius--l:1.5rem;--bq-radius--full:9999px;--bq-box-shadow--xs:0 2px 0 rgba(0,0,0,.016);--bq-box-shadow--s:0 8px 24px rgba(0,0,0,.04);--bq-box-shadow--m:0 10px 48px -16px rgba(0,0,0,.12);--bq-box-shadow--l:0 20px 58px -16px rgba(0,0,0,.16);--bq-font-family:"Outfit",sans-serif;--bq-font-size--xs:0.75rem;--bq-font-size--s:0.875rem;--bq-font-size--m:1rem;--bq-font-size--l:1.125rem;--bq-font-size--xl:1.5rem;--bq-font-size--xxl:2rem;--bq-font-size--xxl2:2.5rem;--bq-font-size--xxl3:3rem;--bq-font-size--xxl4:3.5rem;--bq-font-size--xxl5:4rem;--bq-font-weight--thin:100;--bq-font-weight--light:300;--bq-font-weight--regular:400;--bq-font-weight--medium:500;--bq-font-weight--semibold:600;--bq-font-weight--bold:700;--bq-font-line-height--small:1.2;--bq-font-line-height--regular:1.5;--bq-font-line-height--large:1.5;--bq-spacing-xs3:0.125rem;--bq-spacing-xs2:0.25rem;--bq-spacing-xs:0.5rem;--bq-spacing-s:0.75rem;--bq-spacing-m:1rem;--bq-spacing-l:1.5rem;--bq-spacing-xl:2rem;--bq-spacing-xxl:2.5rem;--bq-spacing-xxl2:3.5rem;--bq-spacing-xxl3:4rem;--bq-spacing-xxl4:4.5rem;--bq-stroke-s:1px;--bq-stroke-m:2px;--bq-stroke-l:3px}.beeq:not([bq-mode]),.light,:root:not([bq-theme]):not([bq-mode]),:root[bq-theme=beeq]:not([bq-mode]),[bq-mode=light]{--bq-background--primary:var(--bq-white);--bq-background--secondary:var(--bq-neutral-100);--bq-background--tertiary:var(--bq-neutral-200);--bq-background--alt:var(--bq-neutral-300);--bq-background--inverse:var(--bq-neutral-900);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-800);--bq-icon--alt:var(--bq-white);--bq-icon--secondary:var(--bq-neutral-600);--bq-icon--inverse:var(--bq-neutral-50);--bq-icon--brand:var(--bq-brand);--bq-icon--info:var(--bq-brand);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-200);--bq-stroke--secondary:var(--bq-neutral-600);--bq-stroke--tertiary:var(--bq-neutral-900);--bq-stroke--inverse:var(--bq-white);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-50);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-brand);--bq-text--primary:var(--bq-neutral-800);--bq-text--secondary:var(--bq-neutral-600);--bq-text--inverse:var(--bq-neutral-50);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-brand);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-white);--bq-ui--secondary:var(--bq-neutral-100);--bq-ui--tertiary:var(--bq-neutral-500);--bq-ui--inverse:var(--bq-neutral-900);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-light);--bq-ui--alt:var(--bq-neutral-50);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-light);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-light);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-light);--bq-ui--info:var(--bq-brand);--bq-ui--info-alt:var(--bq-brand-light);--bq-hover:#bcbfc5;--bq-active:#444546}.dark,[bq-mode=dark]{--bq-background--primary:var(--bq-neutral-1000);--bq-background--secondary:var(--bq-neutral-950);--bq-background--tertiary:var(--bq-neutral-800);--bq-background--alt:var(--bq-neutral-700);--bq-background--inverse:var(--bq-neutral-600);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-100);--bq-icon--secondary:var(--bq-neutral-400);--bq-icon--inverse:var(--bq-neutral-800);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-brand);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-900);--bq-stroke--secondary:var(--bq-neutral-700);--bq-stroke--tertiary:var(--bq-neutral-400);--bq-stroke--inverse:var(--bq-neutral-950);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-1000);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-brand);--bq-text--primary:var(--bq-neutral-100);--bq-text--secondary:var(--bq-neutral-400);--bq-text--inverse:var(--bq-neutral-800);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-brand);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-neutral-900);--bq-ui--secondary:var(--bq-neutral-950);--bq-ui--tertiary:var(--bq-neutral-700);--bq-ui--inverse:var(--bq-neutral-100);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-dark);--bq-ui--alt:var(--bq-neutral-950);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-dark);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-dark);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-dark);--bq-ui--info:var(--bq-brand);--bq-ui--info-alt:var(--bq-brand-dark);--bq-hover:#444546;--bq-active:#1f2026}:where(.endava),:where([bq-theme=endava]){--bq-font-family:"Poppins",sans-serif;--bq-white:#fafbfb;--bq-black:#030406;--bq-neutral-50:var(--bq-endava-grey-50);--bq-neutral-100:var(--bq-endava-grey-100);--bq-neutral-200:var(--bq-endava-grey-200);--bq-neutral-300:var(--bq-endava-grey-300);--bq-neutral-400:var(--bq-endava-grey-400);--bq-neutral-500:var(--bq-endava-grey-500);--bq-neutral-600:var(--bq-endava-grey-600);--bq-neutral-700:var(--bq-endava-grey-700);--bq-neutral-800:var(--bq-endava-grey-800);--bq-neutral-900:var(--bq-endava-grey-900);--bq-neutral-950:var(--bq-endava-grey-950);--bq-neutral-1000:var(--bq-endava-grey-1000);--bq-brand-light:var(--bq-endava-orange-100);--bq-brand:var(--bq-endava-orange-600);--bq-brand-dark:var(--bq-endava-orange-1000);--bq-accent-light:var(--bq-endava-orange-100);--bq-accent:var(--bq-endava-orange-600);--bq-accent-dark:var(--bq-endava-orange-1000);--bq-success-light:var(--bq-green-100);--bq-success:var(--bq-green-600);--bq-success-dark:var(--bq-green-1000);--bq-danger-light:var(--bq-corai-100);--bq-danger:var(--bq-corai-600);--bq-danger-dark:var(--bq-corai-1000);--bq-warning-light:var(--bq-yellow-100);--bq-warning:var(--bq-yellow-600);--bq-warning-dark:var(--bq-yellow-1000);--bq-info-light:var(--bq-blue-100);--bq-info:var(--bq-blue-600);--bq-info-dark:var(--bq-blue-1000);--bq-focus:var(--bq-endava-orange-600);--bq-data-01:var(--bq-brand);--bq-data-02:#af0cd8;--bq-data-03:#0ca8d8;--bq-data-04:var(--bq-teal-600);--bq-data-05:var(--bq-yellow-600);--bq-data-06:var(--bq-orange-600);--bq-data-07:var(--bq-blue-600);--bq-data-08:var(--bq-red-600);--bq-data-09:var(--bq-purple-600);--bq-data-10:#394b56;--bq-data-11:var(--bq-black);--bq-data-12:var(--bq-white)}.endava.light,.endava:not([bq-mode]),[bq-theme=endava]:not([bq-mode]),[bq-theme=endava][bq-mode=light]{--bq-background--primary:var(--bq-white);--bq-background--secondary:var(--bq-neutral-100);--bq-background--tertiary:var(--bq-neutral-200);--bq-background--alt:var(--bq-neutral-300);--bq-background--inverse:var(--bq-neutral-900);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-800);--bq-icon--secondary:var(--bq-neutral-600);--bq-icon--inverse:var(--bq-neutral-50);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-info);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-200);--bq-stroke--secondary:var(--bq-neutral-600);--bq-stroke--tertiary:var(--bq-neutral-900);--bq-stroke--inverse:var(--bq-white);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-50);--bq-stroke--brand-alt:var(--bq-brand-light);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-info);--bq-text--primary:var(--bq-neutral-800);--bq-text--secondary:var(--bq-neutral-600);--bq-text--inverse:var(--bq-neutral-50);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-info);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-white);--bq-ui--secondary:var(--bq-neutral-100);--bq-ui--tertiary:var(--bq-neutral-500);--bq-ui--inverse:var(--bq-neutral-900);--bq-ui--alt:var(--bq-neutral-50);--bq-ui--brand-alt:var(--bq-brand-light);--bq-ui--brand:var(--bq-brand);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-light);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-light);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-light);--bq-ui--info:var(--bq-info);--bq-ui--info-alt:var(--bq-info-light);--bq-hover:#444546;--bq-active:#1f2026}.endava.dark,[bq-theme=endava][bq-mode=dark]{--bq-background--primary:var(--bq-neutral-1000);--bq-background--secondary:var(--bq-neutral-900);--bq-background--tertiary:var(--bq-neutral-800);--bq-background--alt:var(--bq-neutral-700);--bq-background--inverse:var(--bq-neutral-600);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-100);--bq-icon--secondary:var(--bq-neutral-400);--bq-icon--inverse:var(--bq-neutral-800);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-info);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-900);--bq-stroke--secondary:var(--bq-neutral-700);--bq-stroke--tertiary:var(--bq-neutral-400);--bq-stroke--inverse:var(--bq-neutral-950);--bq-stroke--brand:var(--bq-brand);--bq-stroke--brand-alt:var(--bq-brand-dark);--bq-stroke--alt:var(--bq-neutral-1000);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-info);--bq-text--primary:var(--bq-neutral-100);--bq-text--secondary:var(--bq-neutral-400);--bq-text--inverse:var(--bq-neutral-800);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-neutral-white);--bq-text--info:var(--bq-info);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-neutral-900);--bq-ui--secondary:var(--bq-neutral-950);--bq-ui--tertiary:var(--bq-neutral-700);--bq-ui--inverse:var(--bq-neutral-100);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-dark);--bq-ui--alt:var(--bq-neutral-950);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-dark);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-dark);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-dark);--bq-ui--info:var(--bq-info);--bq-ui--info-alt:var(--bq-info-dark);--bq-hover:#444546;--bq-active:#1f2026}.fixed{position:fixed}.sticky{position:sticky}.top-0{top:0}.z-\\[1\\]{z-index:1}.box-content{box-sizing:content-box}.flex{display:flex}.hidden{display:none}.h-dynamic-vh{height:100dvh}.grow{flex-grow:1}.flex-col{flex-direction:column}.items-center{align-items:center}.overflow-hidden{overflow:hidden}.border-0{border-width:0}.border-e-s{border-inline-end-width:var(--bq-stroke-s)}.border-solid{border-style:solid}.border-\\[color\\:--bq-side-menu--border-color\\]{border-color:var(--bq-side-menu--border-color)}.bg-\\[--bq-side-menu--bg-color\\]{background-color:var(--bq-side-menu--bg-color)}.text-\\[color\\:--bq-side-menu--brand-color\\]{color:var(--bq-side-menu--brand-color)}.transition-\\[background-color\\2c width\\]{transition-duration:.15s;transition-property:background-color,width;transition-timing-function:cubic-bezier(.4,0,.2,1)}.is-\\[--bq-side-menu--width-collapse\\]{inline-size:var(--bq-side-menu--width-collapse)}.is-\\[--bq-side-menu--width\\]{inline-size:var(--bq-side-menu--width)}.inset-bs-0{inset-block-start:0}@-webkit-keyframes fade-in{0%{opacity:0}}@keyframes fade-in{0%{opacity:0}}@-webkit-keyframes slide-in{0%{-webkit-transform:translateY(10px);transform:translateY(10px)}}@keyframes slide-in{0%{-webkit-transform:translateY(10px);transform:translateY(10px)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}:host{--bq-side-menu--bg-color:var(--bq-ui--primary);--bq-side-menu--brand-color:var(--bq-ui--brand);--bq-side-menu--border-color:var(--bq-stroke--primary);display:flex;overflow:hidden}.bq-side-menu{-ms-overflow-style:none;background-color:var(--bq-side-menu--bg-color);border-color:var(--bq-side-menu--border-color);border-width:0;border-inline-end-width:var(--bq-stroke-s);border-style:solid;display:flex;flex-direction:column;flex-grow:1;height:100dvh;inline-size:var(--bq-side-menu--width);inset-block-start:0;inset-inline-start:0;position:fixed;scrollbar-width:none;transition-duration:.15s;transition-property:background-color,width;transition-timing-function:cubic-bezier(.4,0,.2,1)}.bq-side-menu::-webkit-scrollbar{display:none}.bq-side-menu.is-collapsed{inline-size:var(--bq-side-menu--width-collapse)}.bq-side-menu--logo{align-items:center;background-color:var(--bq-side-menu--bg-color);box-sizing:content-box;color:var(--bq-side-menu--brand-color);display:flex;padding:var(--bq-spacing-xs);position:sticky;top:0;z-index:1}:host([size=small]) ::slotted(bq-side-menu-item){--bq-side-menu-item--paddingY:var(--bq-spacing-s)}:host([appearance=brand]){--bq-focus:var(--bq-stroke--alt);--bq-side-menu--bg-color:var(--bq-ui--brand);--bq-side-menu--brand-color:var(--bq-stroke--inverse);--bq-side-menu--border-color:var(--bq-stroke--brand)}:host([appearance=brand]) ::slotted(bq-side-menu-item){--bq-side-menu-item--bg-hover:color-mix(in srgb,var(--bq-ui--brand),var(--bq-hover) 20%);--bq-side-menu-item--text-default:var(--bq-text--alt);--bq-side-menu-item--text-hover:var(--bq-text--alt)}:host([appearance=brand]) .bq-side-menu--footer ::slotted([slot=footer]){--bq-ui--secondary:transparent;--bq-button--icon-color:var(--bq-text--alt);--bq-button-hover--icon-color:var(--bq-text--primary)}:host([appearance=inverse]){--bq-side-menu--bg-color:var(--bq-ui--inverse);--bq-side-menu--brand-color:var(--bq-stroke--inverse);--bq-side-menu--border-color:var(--bq-ui--inverse)}:host([appearance=inverse]) ::slotted(bq-side-menu-item){--bq-side-menu-item--bg-hover:color-mix(in srgb,var(--bq-ui--inverse),var(--bq-hover) 20%);--bq-side-menu-item--bg-active:color-mix(in srgb,var(--bq-ui--alt),var(--bq-active) 20%);--bq-side-menu-item--text-default:var(--bq-text--inverse);--bq-side-menu-item--text-hover:var(--bq-text--inverse);--bq-side-menu-item--text-active:var(--bq-text--primary)}:host([appearance=inverse]) .bq-side-menu--footer ::slotted([slot=footer]){--bq-ui--secondary:transparent;--bq-button--icon-color:var(--bq-text--inverse);--bq-button-hover--icon-color:var(--bq-text--primary)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.collapse{visibility:collapse}.static{position:static}.justify-center{justify-content:center}.gap-y-xs{row-gap:var(--bq-spacing-xs)}.overflow-y-auto{overflow-y:auto}.bg-\\[var\\(--bq-side-menu--bg-color\\)\\]{background-color:var(--bq-side-menu--bg-color)}.p-xs{padding:var(--bq-spacing-xs)}.px-xs{padding-left:var(--bq-spacing-xs);padding-right:var(--bq-spacing-xs)}.pt-xs2{padding-top:var(--bq-spacing-xs2)}.inset-be-0{inset-block-end:0}.m-bs-\\[auto\\]{margin-block-start:auto}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}`;const o=a(class a extends e{constructor(a){super();if(a!==false){this.__registerHost()}this.__attachShadow();this.bqCollapse=r(this,"bqCollapse");this.bqSelect=r(this,"bqSelect")}menuItemCssSelector="bq-side-menu-item";bodyCss="bq-body--side-menu";bodyCssExpand="bq-body--side-menu__expand";bodyCssCollapse="bq-body--side-menu__collapse";menuElem;documentBody;appearance="default";collapse=false;size="medium";onCollapsePropChange(){this.handleCollapse();this.bqCollapse.emit({collapse:this.collapse})}bqCollapse;bqSelect;componentDidLoad(){if(!t())return;this.documentBody=document.querySelector("body");this.documentBody.classList.add(this.bodyCss);this.handleCollapse()}disconnectedCallback(){this.cleanDocumentBodyClass()}onMenuItemClick(a){const{target:e}=a;if(!q(e,"bq-side-menu-item"))return;this.menuItems.forEach((a=>{a.active=!a.disabled&&a===e}));this.bqSelect.emit(e)}async toggleCollapse(){this.collapse=!this.collapse}get menuItems(){if(!this.menuElem)return[];const a=this.menuElem.querySelector("slot");return[...a.assignedElements({flatten:true})].filter((a=>a.tagName.toLowerCase()===this.menuItemCssSelector))}handleCollapse=()=>{if(!this.menuItems.length)return;this.menuItems.forEach((a=>{a.collapse=this.collapse}));if(this.collapse){this.collapseDocumentBody()}else{this.expandDocumentBody()}};collapseDocumentBody=()=>{if(!this.collapse)return;this.documentBody.classList.remove(this.bodyCssExpand);this.documentBody.classList.add(this.bodyCssCollapse)};expandDocumentBody=()=>{if(this.collapse)return;this.documentBody.classList.remove(this.bodyCssCollapse);this.documentBody.classList.add(this.bodyCssExpand)};cleanDocumentBodyClass=()=>{this.documentBody.classList.remove(this.bodyCss,this.bodyCssCollapse,this.bodyCssExpand)};render(){return b("aside",{key:"88b9e71de693a1c299b5ea29923ff099e20094ff",class:{"bq-side-menu overflow-y-auto":true,"is-collapsed":this.collapse},part:"base"},b("div",{key:"4e168d1422648ce7bec6b41235a69a0a60a8d126",class:{"bq-side-menu--logo":true,"is-collapsed":this.collapse},part:"logo"},b("slot",{key:"c167aa13ecd26be964c23d792eb8b4d072f336cd",name:"logo"})),b("nav",{key:"51f93fa369d831d4b37640f8504080def6705b79",class:"bq-side-menu--nav flex flex-col gap-y-xs px-xs pt-xs2",part:"nav",ref:a=>{this.menuElem=a}},b("slot",{key:"f9b247934bde68008eb4374cdd56bee21162e4b7"})),b("div",{key:"bce10f4d001687d85da96944003310444ea61a7a",class:"bq-side-menu--footer sticky inset-be-0 m-bs-[auto] flex justify-center bg-[var(--bq-side-menu--bg-color)] p-xs",part:"footer"},b("slot",{key:"b5052f3e97f90a114df7f82a58e35d809dbdad31",name:"footer"})))}static get watchers(){return{collapse:[{onCollapsePropChange:0}]}}static get style(){return i()}},[769,"bq-side-menu",{appearance:[513],collapse:[516],size:[513],documentBody:[32],toggleCollapse:[64]},[[1,"bqClick","onMenuItemClick"]],{collapse:[{onCollapsePropChange:0}]}]);function s(){if(typeof customElements==="undefined"){return}const a=["bq-side-menu"];a.forEach((a=>{switch(a){case"bq-side-menu":if(!customElements.get(n(a))){customElements.define(n(a),o)}break}}))}const d=o;const l=s;export{d as BqSideMenu,l as defineCustomElement};
 //# sourceMappingURL=bq-side-menu.js.map

package/dist/components/bq-side-menu.js.map

@@ -1 +1 @@
-{"version":3,"names":["bqSideMenuCss","BqSideMenu","__stencil_proxyCustomElement","HTMLElement","menuItemCssSelector","bodyCss","bodyCssExpand","bodyCssCollapse","menuElem","documentBody","appearance","collapse","size","onCollapsePropChange","this","handleCollapse","bqCollapse","emit","bqSelect","componentDidLoad","isClient","document","querySelector","classList","add","disconnectedCallback","cleanDocumentBodyClass","onMenuItemClick","event","target","item","isHTMLElement","menuItems","forEach","menuItem","active","disabled","toggleCollapse","slot","assignedElements","flatten","filter","el","tagName","toLowerCase","length","collapseDocumentBody","expandDocumentBody","remove","render","_jsxs","class","part","children","_jsx","name","ref","navElem"],"sources":["../../packages/beeq/src/components/side-menu/scss/bq-side-menu.scss?tag=bq-side-menu&encapsulation=shadow","../../packages/beeq/src/components/side-menu/bq-side-menu.tsx"],"sourcesContent":["/* -------------------------------------------------------------------------- */\n/*                                Side menu styles                */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-side-menu.variables';\n\n:host {\n  @apply flex overflow-hidden;\n}\n\n/* -------------------------------------------------------------------------- */\n/*                               Aside container                              */\n/* -------------------------------------------------------------------------- */\n\n.bq-side-menu {\n  @apply fixed flex h-dynamic-vh grow flex-col bg-[--bq-side-menu--bg-color] is-[--bq-side-menu--width] inset-bs-0 inset-is-0;\n  @apply border-0 border-e-s border-solid border-[color:--bq-side-menu--border-color];\n  @apply transition-[background-color,width] duration-150;\n  @include hide-scrollbar;\n}\n\n.bq-side-menu.is-collapsed {\n  @apply is-[--bq-side-menu--width-collapse];\n}\n\n/* -------------------------------------------------------------------------- */\n/*                               Logo container                               */\n/* -------------------------------------------------------------------------- */\n\n.bq-side-menu--logo {\n  @apply sticky top-0 z-[1] p-xs;\n  @apply box-content flex items-center bg-[--bq-side-menu--bg-color] text-[color:--bq-side-menu--brand-color];\n}\n\n/* -------------------------------------------------------------------------- */\n/*                                 APPEARANCE                                 */\n/* -------------------------------------------------------------------------- */\n\n/**\n * The following change the default values of some CSS custom properties\n * to make it complain with the side menu appearance selected\n */\n\n:host([size='small']) {\n  ::slotted(bq-side-menu-item) {\n    --bq-side-menu-item--paddingY: theme(space.s);\n  }\n}\n\n:host([appearance='brand']) {\n  --bq-focus: theme(stroke.alt);\n  --bq-side-menu--bg-color: theme(backgroundColor.ui.brand);\n  --bq-side-menu--brand-color: theme(stroke.inverse);\n  --bq-side-menu--border-color: theme(stroke.brand);\n\n  ::slotted(bq-side-menu-item) {\n    --bq-side-menu-item--bg-hover: color-mix(in srgb, var(--bq-ui--brand), var(--bq-hover) 20%);\n\n    --bq-side-menu-item--text-default: theme(textColor.alt);\n    --bq-side-menu-item--text-hover: theme(textColor.alt);\n  }\n\n  .bq-side-menu--footer ::slotted([slot='footer']) {\n    --bq-ui--secondary: theme(colors.transparent);\n    --bq-button--icon-color: theme(textColor.alt);\n    --bq-button-hover--icon-color: theme(textColor.primary);\n  }\n}\n\n:host([appearance='inverse']) {\n  --bq-side-menu--bg-color: theme(backgroundColor.ui.inverse);\n  --bq-side-menu--brand-color: theme(stroke.inverse);\n  --bq-side-menu--border-color: theme(backgroundColor.ui.inverse);\n\n  ::slotted(bq-side-menu-item) {\n    --bq-side-menu-item--bg-hover: color-mix(in srgb, var(--bq-ui--inverse), var(--bq-hover) 20%);\n    --bq-side-menu-item--bg-active: color-mix(in srgb, var(--bq-ui--alt), var(--bq-active) 20%);\n\n    --bq-side-menu-item--text-default: theme(textColor.inverse);\n    --bq-side-menu-item--text-hover: theme(textColor.inverse);\n    --bq-side-menu-item--text-active: theme(textColor.primary);\n  }\n\n  .bq-side-menu--footer ::slotted([slot='footer']) {\n    --bq-ui--secondary: theme(colors.transparent);\n    --bq-button--icon-color: theme(textColor.inverse);\n    --bq-button-hover--icon-color: theme(textColor.primary);\n  }\n}\n","import type { EventEmitter } from '@stencil/core';\nimport { Component, Event, Listen, Method, Prop, State, Watch } from '@stencil/core';\n\nimport { isClient, isHTMLElement } from '../../shared/utils';\nimport type { TSideMenuAppearance, TSideMenuSize } from './bq-side-menu.types';\n\n/**\n *The default side menu serves as a versatile container for organizing and displaying navigation elements,\n * with default side menu items providing a clean and straightforward way to represent individual menu options.\n * Together, they form the foundation for building structured and intuitive side menu layouts.\n *\n * @example How to use it\n * ```html\n * <bq-side-menu>\n *   <div slot=\"logo\">\n *     <h1>Your Logo</h1>\n *   </div>\n *   <bq-side-menu-item active>\n *     <bq-icon name=\"home\" slot=\"prefix\"></bq-icon>\n *     Home\n *   </bq-side-menu-item>\n *   <bq-side-menu-item>\n *     <bq-icon name=\"settings\" slot=\"prefix\"></bq-icon>\n *     Settings\n *   </bq-side-menu-item>\n *   <bq-side-menu-item disabled>\n *     <bq-icon name=\"help\" slot=\"prefix\"></bq-icon>\n *     Help\n *   </bq-side-menu-item>\n * </bq-side-menu>\n * ```\n *\n * @documentation https://www.beeq.design/3d466e231/p/99822d-side-menu/b/09d7b1\n * @status stable\n *\n * @attr {\"brand\" | \"default\" | \"inverse\"} appearance - It sets a predefined appearance of the side menu.\n * @attr {boolean} collapse - If `true`, the container will reduce its width.\n * @attr {\"medium\" | \"small\"} - size - It sets the size of the navigation menu items.\n *\n * @method toggleCollapse - Method to be called to toggle the collapse state of the side menu.\n *\n * @event bqCollapse - Callback handler to be called when the Side menu changes its width from expanded to collapse and vice versa.\n * @event bqSelect - Callback handler to be called when the active/selected menu item changes.\n *\n * @slot logo - The section for displaying the logo or brand in the side menu.\n * @slot The main section that holds all menu items.\n * @slot footer - The section for adding footer content to the side menu.\n *\n * @part base - HTML `<aside>` root container\n * @part footer - HTML `<div>` element that holds the footer\n * @part logo - HTML `<div>` element that holds the logo\n * @part nav - HTML `<nav>` element that holds the navigation items\n *\n * @cssprop --bq-side-menu--bg-color - Side menu background color\n * @cssprop --bq-side-menu--brand-color - Side menu logo color\n * @cssprop --bq-side-menu--border-color - Side menu border color\n */\n@Component({\n  tag: 'bq-side-menu',\n  styleUrl: './scss/bq-side-menu.scss',\n  shadow: true,\n})\nexport class BqSideMenu {\n  // Own Properties\n  // ====================\n\n  private menuItemCssSelector = 'bq-side-menu-item';\n\n  private bodyCss = 'bq-body--side-menu';\n  private bodyCssExpand = 'bq-body--side-menu__expand';\n  private bodyCssCollapse = 'bq-body--side-menu__collapse';\n\n  private menuElem: HTMLElement;\n\n  // Reference to host HTML element\n  // ===================================\n\n  // State() variables\n  // Inlined decorator, alphabetical order\n  // =======================================\n\n  @State() private documentBody: HTMLBodyElement;\n\n  // Public Property API\n  // ========================\n\n  /** It sets a predefined appearance of the side menu */\n  @Prop({ reflect: true }) appearance: TSideMenuAppearance = 'default';\n\n  /** If true, the container will reduce its width */\n  @Prop({ reflect: true }) collapse: boolean = false;\n\n  /** It sets the size of the navigation menu items */\n  @Prop({ reflect: true }) size: TSideMenuSize = 'medium';\n\n  // Prop lifecycle events\n  // =======================\n\n  @Watch('collapse')\n  onCollapsePropChange() {\n    this.handleCollapse();\n    this.bqCollapse.emit({ collapse: this.collapse });\n  }\n\n  // Events section\n  // Requires JSDocs for public API documentation\n  // ==============================================\n\n  /** Callback handler to be called when the Side menu changes its width from expanded to collapse and vice versa */\n  @Event() bqCollapse: EventEmitter<{ collapse: boolean }>;\n\n  /** Callback handler to be called when the active/selected menu item changes */\n  @Event() bqSelect: EventEmitter<HTMLBqSideMenuItemElement>;\n\n  // Component lifecycle events\n  // Ordered by their natural call order\n  // =====================================\n\n  componentDidLoad() {\n    if (!isClient()) return;\n\n    this.documentBody = document.querySelector('body');\n    this.documentBody.classList.add(this.bodyCss);\n    this.handleCollapse();\n  }\n\n  disconnectedCallback() {\n    this.cleanDocumentBodyClass();\n  }\n\n  // Listeners\n  // ==============\n\n  @Listen('bqClick', { passive: true })\n  onMenuItemClick(event: Event) {\n    const { target: item } = event;\n    if (!isHTMLElement(item, 'bq-side-menu-item')) return;\n\n    this.menuItems.forEach((menuItem: HTMLBqSideMenuItemElement) => {\n      menuItem.active = !menuItem.disabled && menuItem === item;\n    });\n    this.bqSelect.emit(item);\n  }\n\n  // Public methods API\n  // These methods are exposed on the host element.\n  // Always use two lines.\n  // Public Methods must be async.\n  // Requires JSDocs for public API documentation.\n  // ===============================================\n\n  /** Toggle the collapse state of the side menu */\n  @Method()\n  async toggleCollapse() {\n    this.collapse = !this.collapse;\n  }\n\n  // Local methods\n  // Internal business logic.\n  // These methods cannot be called from the host element.\n  // =======================================================\n\n  private get menuItems() {\n    if (!this.menuElem) return [];\n\n    const slot = this.menuElem.querySelector('slot');\n    return [...slot.assignedElements({ flatten: true })].filter(\n      (el: HTMLBqSideMenuItemElement) => el.tagName.toLowerCase() === this.menuItemCssSelector,\n    ) as [HTMLBqSideMenuItemElement];\n  }\n\n  private handleCollapse = () => {\n    if (!this.menuItems.length) return;\n\n    this.menuItems.forEach((menuItem: HTMLBqSideMenuItemElement) => {\n      menuItem.collapse = this.collapse;\n    });\n    if (this.collapse) {\n      this.collapseDocumentBody();\n    } else {\n      this.expandDocumentBody();\n    }\n  };\n\n  private collapseDocumentBody = () => {\n    if (!this.collapse) return;\n\n    this.documentBody.classList.remove(this.bodyCssExpand);\n    this.documentBody.classList.add(this.bodyCssCollapse);\n  };\n\n  private expandDocumentBody = () => {\n    if (this.collapse) return;\n\n    this.documentBody.classList.remove(this.bodyCssCollapse);\n    this.documentBody.classList.add(this.bodyCssExpand);\n  };\n\n  private cleanDocumentBodyClass = () => {\n    this.documentBody.classList.remove(this.bodyCss, this.bodyCssCollapse, this.bodyCssExpand);\n  };\n\n  // render() function\n  // Always the last one in the class.\n  // ===================================\n\n  render() {\n    return (\n      <aside class={{ 'bq-side-menu overflow-y-auto': true, 'is-collapsed': this.collapse }} part=\"base\">\n        {/* Company logo and name */}\n        <div class={{ 'bq-side-menu--logo': true, 'is-collapsed': this.collapse }} part=\"logo\">\n          <slot name=\"logo\" />\n        </div>\n        {/* Navigation content */}\n        <nav\n          class=\"bq-side-menu--nav flex flex-col gap-y-xs px-xs pt-xs2\"\n          part=\"nav\"\n          ref={(navElem) => {\n            this.menuElem = navElem;\n          }}\n        >\n          <slot />\n        </nav>\n        {/* Footer */}\n        <div\n          class=\"bq-side-menu--footer sticky inset-be-0 m-bs-[auto] flex justify-center bg-[var(--bq-side-menu--bg-color)] p-xs\"\n          part=\"footer\"\n        >\n          <slot name=\"footer\"></slot>\n        </div>\n      </aside>\n    );\n  }\n}\n"],"mappings":";;;;;;;;;;AAAA,MAAMA,gBAAgB,MAAM;;MC8DfC,KAAUC,EAAA,MAAAD,UAAAE;;;;;;;;;;;;EAIbC,oBAAsB;EAEtBC,QAAU;EACVC,cAAgB;EAChBC,gBAAkB;EAElBC;;;;;;EASSC;;;;EAMQC,WAAkC;;EAGlCC,SAAoB;;EAGpBC,KAAsB;;;EAM/C,oBAAAC;IACEC,KAAKC;IACLD,KAAKE,WAAWC,KAAK;MAAEN,UAAUG,KAAKH;;;;;;;EAQ/BK;;EAGAE;;;;EAMT,gBAAAC;IACE,KAAKC,KAAY;IAEjBN,KAAKL,eAAeY,SAASC,cAAc;IAC3CR,KAAKL,aAAac,UAAUC,IAAIV,KAAKT;IACrCS,KAAKC;;EAGP,oBAAAU;IACEX,KAAKY;;;;EAOP,eAAAC,CAAgBC;IACd,OAAQC,QAAQC,KAASF;IACzB,KAAKG,EAAcD,GAAM,sBAAsB;IAE/ChB,KAAKkB,UAAUC,SAASC;MACtBA,EAASC,UAAUD,EAASE,YAAYF,MAAaJ;AAAI;IAE3DhB,KAAKI,SAASD,KAAKa;;;;;;;;;EAYrB,oBAAMO;IACJvB,KAAKH,YAAYG,KAAKH;;;;;;EAQxB,aAAYqB;IACV,KAAKlB,KAAKN,UAAU,OAAO;IAE3B,MAAM8B,IAAOxB,KAAKN,SAASc,cAAc;IACzC,OAAO,KAAIgB,EAAKC,iBAAiB;MAAEC,SAAS;SAASC,QAClDC,KAAkCA,EAAGC,QAAQC,kBAAkB9B,KAAKV;;EAIjEW,eAAiB;IACvB,KAAKD,KAAKkB,UAAUa,QAAQ;IAE5B/B,KAAKkB,UAAUC,SAASC;MACtBA,EAASvB,WAAWG,KAAKH;AAAQ;IAEnC,IAAIG,KAAKH,UAAU;MACjBG,KAAKgC;WACA;MACLhC,KAAKiC;;;EAIDD,qBAAuB;IAC7B,KAAKhC,KAAKH,UAAU;IAEpBG,KAAKL,aAAac,UAAUyB,OAAOlC,KAAKR;IACxCQ,KAAKL,aAAac,UAAUC,IAAIV,KAAKP;AAAgB;EAG/CwC,mBAAqB;IAC3B,IAAIjC,KAAKH,UAAU;IAEnBG,KAAKL,aAAac,UAAUyB,OAAOlC,KAAKP;IACxCO,KAAKL,aAAac,UAAUC,IAAIV,KAAKR;AAAc;EAG7CoB,uBAAyB;IAC/BZ,KAAKL,aAAac,UAAUyB,OAAOlC,KAAKT,SAASS,KAAKP,iBAAiBO,KAAKR;AAAc;;;;EAO5F,MAAA2C;IACE,OACEC,EAAA;MAAOC,OAAO;QAAE,gCAAgC;QAAM,gBAAgBrC,KAAKH;;MAAYyC,MAAK;MAAMC,UAAA,EAEhGC,EAAK;QAAAH,OAAO;UAAE,sBAAsB;UAAM,gBAAgBrC,KAAKH;;QAAYyC,MAAK;QAC9EC,UAAAC,EAAA;UAAMC,MAAK;WAAM;SACb,6CAEND,EACE;QAAAH,OAAM;QACNC,MAAK;QACLI,KAAMC;UACJ3C,KAAKN,WAAWiD;AAAO;QACxBJ,UAEDC;SACI,6CAENA;QACEH,OAAM;QACNC,MAAK;QAAQC,UAEbC;UAAMC,MAAK;WAAgB;SAAA;OAEvB","ignoreList":[]}
+{"version":3,"names":["bqSideMenuCss","BqSideMenu","__stencil_proxyCustomElement","HTMLElement","menuItemCssSelector","bodyCss","bodyCssExpand","bodyCssCollapse","menuElem","documentBody","appearance","collapse","size","onCollapsePropChange","this","handleCollapse","bqCollapse","emit","bqSelect","componentDidLoad","isClient","document","querySelector","classList","add","disconnectedCallback","cleanDocumentBodyClass","onMenuItemClick","event","target","item","isHTMLElement","menuItems","forEach","menuItem","active","disabled","toggleCollapse","slot","assignedElements","flatten","filter","el","tagName","toLowerCase","length","collapseDocumentBody","expandDocumentBody","remove","render","h","key","class","part","name","ref","navElem"],"sources":["../../packages/beeq/src/components/side-menu/scss/bq-side-menu.scss?tag=bq-side-menu&encapsulation=shadow","../../packages/beeq/src/components/side-menu/bq-side-menu.tsx"],"sourcesContent":["/* -------------------------------------------------------------------------- */\n/*                                Side menu styles                */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-side-menu.variables';\n\n:host {\n  @apply flex overflow-hidden;\n}\n\n/* -------------------------------------------------------------------------- */\n/*                               Aside container                              */\n/* -------------------------------------------------------------------------- */\n\n.bq-side-menu {\n  @apply fixed flex h-dynamic-vh grow flex-col bg-[--bq-side-menu--bg-color] is-[--bq-side-menu--width] inset-bs-0 inset-is-0;\n  @apply border-0 border-e-s border-solid border-[color:--bq-side-menu--border-color];\n  @apply transition-[background-color,width] duration-150;\n  @include hide-scrollbar;\n}\n\n.bq-side-menu.is-collapsed {\n  @apply is-[--bq-side-menu--width-collapse];\n}\n\n/* -------------------------------------------------------------------------- */\n/*                               Logo container                               */\n/* -------------------------------------------------------------------------- */\n\n.bq-side-menu--logo {\n  @apply sticky top-0 z-[1] p-xs;\n  @apply box-content flex items-center bg-[--bq-side-menu--bg-color] text-[color:--bq-side-menu--brand-color];\n}\n\n/* -------------------------------------------------------------------------- */\n/*                                 APPEARANCE                                 */\n/* -------------------------------------------------------------------------- */\n\n/**\n * The following change the default values of some CSS custom properties\n * to make it complain with the side menu appearance selected\n */\n\n:host([size='small']) {\n  ::slotted(bq-side-menu-item) {\n    --bq-side-menu-item--paddingY: theme(space.s);\n  }\n}\n\n:host([appearance='brand']) {\n  --bq-focus: theme(stroke.alt);\n  --bq-side-menu--bg-color: theme(backgroundColor.ui.brand);\n  --bq-side-menu--brand-color: theme(stroke.inverse);\n  --bq-side-menu--border-color: theme(stroke.brand);\n\n  ::slotted(bq-side-menu-item) {\n    --bq-side-menu-item--bg-hover: color-mix(in srgb, var(--bq-ui--brand), var(--bq-hover) 20%);\n\n    --bq-side-menu-item--text-default: theme(textColor.alt);\n    --bq-side-menu-item--text-hover: theme(textColor.alt);\n  }\n\n  .bq-side-menu--footer ::slotted([slot='footer']) {\n    --bq-ui--secondary: theme(colors.transparent);\n    --bq-button--icon-color: theme(textColor.alt);\n    --bq-button-hover--icon-color: theme(textColor.primary);\n  }\n}\n\n:host([appearance='inverse']) {\n  --bq-side-menu--bg-color: theme(backgroundColor.ui.inverse);\n  --bq-side-menu--brand-color: theme(stroke.inverse);\n  --bq-side-menu--border-color: theme(backgroundColor.ui.inverse);\n\n  ::slotted(bq-side-menu-item) {\n    --bq-side-menu-item--bg-hover: color-mix(in srgb, var(--bq-ui--inverse), var(--bq-hover) 20%);\n    --bq-side-menu-item--bg-active: color-mix(in srgb, var(--bq-ui--alt), var(--bq-active) 20%);\n\n    --bq-side-menu-item--text-default: theme(textColor.inverse);\n    --bq-side-menu-item--text-hover: theme(textColor.inverse);\n    --bq-side-menu-item--text-active: theme(textColor.primary);\n  }\n\n  .bq-side-menu--footer ::slotted([slot='footer']) {\n    --bq-ui--secondary: theme(colors.transparent);\n    --bq-button--icon-color: theme(textColor.inverse);\n    --bq-button-hover--icon-color: theme(textColor.primary);\n  }\n}\n","import type { EventEmitter } from '@stencil/core';\nimport { Component, Event, h, Listen, Method, Prop, State, Watch } from '@stencil/core';\n\nimport { isClient, isHTMLElement } from '../../shared/utils';\nimport type { TSideMenuAppearance, TSideMenuSize } from './bq-side-menu.types';\n\n/**\n *The default side menu serves as a versatile container for organizing and displaying navigation elements,\n * with default side menu items providing a clean and straightforward way to represent individual menu options.\n * Together, they form the foundation for building structured and intuitive side menu layouts.\n *\n * @example How to use it\n * ```html\n * <bq-side-menu>\n *   <div slot=\"logo\">\n *     <h1>Your Logo</h1>\n *   </div>\n *   <bq-side-menu-item active>\n *     <bq-icon name=\"home\" slot=\"prefix\"></bq-icon>\n *     Home\n *   </bq-side-menu-item>\n *   <bq-side-menu-item>\n *     <bq-icon name=\"settings\" slot=\"prefix\"></bq-icon>\n *     Settings\n *   </bq-side-menu-item>\n *   <bq-side-menu-item disabled>\n *     <bq-icon name=\"help\" slot=\"prefix\"></bq-icon>\n *     Help\n *   </bq-side-menu-item>\n * </bq-side-menu>\n * ```\n *\n * @documentation https://www.beeq.design/3d466e231/p/99822d-side-menu/b/09d7b1\n * @status stable\n *\n * @attr {\"brand\" | \"default\" | \"inverse\"} appearance - It sets a predefined appearance of the side menu.\n * @attr {boolean} collapse - If `true`, the container will reduce its width.\n * @attr {\"medium\" | \"small\"} - size - It sets the size of the navigation menu items.\n *\n * @method toggleCollapse - Method to be called to toggle the collapse state of the side menu.\n *\n * @event bqCollapse - Callback handler to be called when the Side menu changes its width from expanded to collapse and vice versa.\n * @event bqSelect - Callback handler to be called when the active/selected menu item changes.\n *\n * @slot logo - The section for displaying the logo or brand in the side menu.\n * @slot The main section that holds all menu items.\n * @slot footer - The section for adding footer content to the side menu.\n *\n * @part base - HTML `<aside>` root container\n * @part footer - HTML `<div>` element that holds the footer\n * @part logo - HTML `<div>` element that holds the logo\n * @part nav - HTML `<nav>` element that holds the navigation items\n *\n * @cssprop --bq-side-menu--bg-color - Side menu background color\n * @cssprop --bq-side-menu--brand-color - Side menu logo color\n * @cssprop --bq-side-menu--border-color - Side menu border color\n */\n@Component({\n  tag: 'bq-side-menu',\n  styleUrl: './scss/bq-side-menu.scss',\n  shadow: true,\n})\nexport class BqSideMenu {\n  // Own Properties\n  // ====================\n\n  private menuItemCssSelector = 'bq-side-menu-item';\n\n  private bodyCss = 'bq-body--side-menu';\n  private bodyCssExpand = 'bq-body--side-menu__expand';\n  private bodyCssCollapse = 'bq-body--side-menu__collapse';\n\n  private menuElem: HTMLElement;\n\n  // Reference to host HTML element\n  // ===================================\n\n  // State() variables\n  // Inlined decorator, alphabetical order\n  // =======================================\n\n  @State() private documentBody: HTMLBodyElement;\n\n  // Public Property API\n  // ========================\n\n  /** It sets a predefined appearance of the side menu */\n  @Prop({ reflect: true }) appearance: TSideMenuAppearance = 'default';\n\n  /** If true, the container will reduce its width */\n  @Prop({ reflect: true }) collapse: boolean = false;\n\n  /** It sets the size of the navigation menu items */\n  @Prop({ reflect: true }) size: TSideMenuSize = 'medium';\n\n  // Prop lifecycle events\n  // =======================\n\n  @Watch('collapse')\n  onCollapsePropChange() {\n    this.handleCollapse();\n    this.bqCollapse.emit({ collapse: this.collapse });\n  }\n\n  // Events section\n  // Requires JSDocs for public API documentation\n  // ==============================================\n\n  /** Callback handler to be called when the Side menu changes its width from expanded to collapse and vice versa */\n  @Event() bqCollapse: EventEmitter<{ collapse: boolean }>;\n\n  /** Callback handler to be called when the active/selected menu item changes */\n  @Event() bqSelect: EventEmitter<HTMLBqSideMenuItemElement>;\n\n  // Component lifecycle events\n  // Ordered by their natural call order\n  // =====================================\n\n  componentDidLoad() {\n    if (!isClient()) return;\n\n    this.documentBody = document.querySelector('body');\n    this.documentBody.classList.add(this.bodyCss);\n    this.handleCollapse();\n  }\n\n  disconnectedCallback() {\n    this.cleanDocumentBodyClass();\n  }\n\n  // Listeners\n  // ==============\n\n  @Listen('bqClick', { passive: true })\n  onMenuItemClick(event: Event) {\n    const { target: item } = event;\n    if (!isHTMLElement(item, 'bq-side-menu-item')) return;\n\n    this.menuItems.forEach((menuItem: HTMLBqSideMenuItemElement) => {\n      menuItem.active = !menuItem.disabled && menuItem === item;\n    });\n    this.bqSelect.emit(item);\n  }\n\n  // Public methods API\n  // These methods are exposed on the host element.\n  // Always use two lines.\n  // Public Methods must be async.\n  // Requires JSDocs for public API documentation.\n  // ===============================================\n\n  /** Toggle the collapse state of the side menu */\n  @Method()\n  async toggleCollapse() {\n    this.collapse = !this.collapse;\n  }\n\n  // Local methods\n  // Internal business logic.\n  // These methods cannot be called from the host element.\n  // =======================================================\n\n  private get menuItems() {\n    if (!this.menuElem) return [];\n\n    const slot = this.menuElem.querySelector('slot');\n    return [...slot.assignedElements({ flatten: true })].filter(\n      (el: HTMLBqSideMenuItemElement) => el.tagName.toLowerCase() === this.menuItemCssSelector,\n    ) as [HTMLBqSideMenuItemElement];\n  }\n\n  private handleCollapse = () => {\n    if (!this.menuItems.length) return;\n\n    this.menuItems.forEach((menuItem: HTMLBqSideMenuItemElement) => {\n      menuItem.collapse = this.collapse;\n    });\n    if (this.collapse) {\n      this.collapseDocumentBody();\n    } else {\n      this.expandDocumentBody();\n    }\n  };\n\n  private collapseDocumentBody = () => {\n    if (!this.collapse) return;\n\n    this.documentBody.classList.remove(this.bodyCssExpand);\n    this.documentBody.classList.add(this.bodyCssCollapse);\n  };\n\n  private expandDocumentBody = () => {\n    if (this.collapse) return;\n\n    this.documentBody.classList.remove(this.bodyCssCollapse);\n    this.documentBody.classList.add(this.bodyCssExpand);\n  };\n\n  private cleanDocumentBodyClass = () => {\n    this.documentBody.classList.remove(this.bodyCss, this.bodyCssCollapse, this.bodyCssExpand);\n  };\n\n  // render() function\n  // Always the last one in the class.\n  // ===================================\n\n  render() {\n    return (\n      <aside class={{ 'bq-side-menu overflow-y-auto': true, 'is-collapsed': this.collapse }} part=\"base\">\n        {/* Company logo and name */}\n        <div class={{ 'bq-side-menu--logo': true, 'is-collapsed': this.collapse }} part=\"logo\">\n          <slot name=\"logo\" />\n        </div>\n        {/* Navigation content */}\n        <nav\n          class=\"bq-side-menu--nav flex flex-col gap-y-xs px-xs pt-xs2\"\n          part=\"nav\"\n          ref={(navElem) => {\n            this.menuElem = navElem;\n          }}\n        >\n          <slot />\n        </nav>\n        {/* Footer */}\n        <div\n          class=\"bq-side-menu--footer sticky inset-be-0 m-bs-[auto] flex justify-center bg-[var(--bq-side-menu--bg-color)] p-xs\"\n          part=\"footer\"\n        >\n          <slot name=\"footer\"></slot>\n        </div>\n      </aside>\n    );\n  }\n}\n"],"mappings":";;;;wIAAA,MAAMA,EAAgB,IAAM,wxuB,MC8DfC,EAAUC,EAAA,MAAAD,UAAAE,E,uJAIbC,oBAAsB,oBAEtBC,QAAU,qBACVC,cAAgB,6BAChBC,gBAAkB,+BAElBC,SASSC,aAMQC,WAAkC,UAGlCC,SAAoB,MAGpBC,KAAsB,SAM/C,oBAAAC,GACEC,KAAKC,iBACLD,KAAKE,WAAWC,KAAK,CAAEN,SAAUG,KAAKH,U,CAQ/BK,WAGAE,SAMT,gBAAAC,GACE,IAAKC,IAAY,OAEjBN,KAAKL,aAAeY,SAASC,cAAc,QAC3CR,KAAKL,aAAac,UAAUC,IAAIV,KAAKT,SACrCS,KAAKC,gB,CAGP,oBAAAU,GACEX,KAAKY,wB,CAOP,eAAAC,CAAgBC,GACd,MAAQC,OAAQC,GAASF,EACzB,IAAKG,EAAcD,EAAM,qBAAsB,OAE/ChB,KAAKkB,UAAUC,SAASC,IACtBA,EAASC,QAAUD,EAASE,UAAYF,IAAaJ,CAAI,IAE3DhB,KAAKI,SAASD,KAAKa,E,CAYrB,oBAAMO,GACJvB,KAAKH,UAAYG,KAAKH,Q,CAQxB,aAAYqB,GACV,IAAKlB,KAAKN,SAAU,MAAO,GAE3B,MAAM8B,EAAOxB,KAAKN,SAASc,cAAc,QACzC,MAAO,IAAIgB,EAAKC,iBAAiB,CAAEC,QAAS,QAASC,QAClDC,GAAkCA,EAAGC,QAAQC,gBAAkB9B,KAAKV,qB,CAIjEW,eAAiB,KACvB,IAAKD,KAAKkB,UAAUa,OAAQ,OAE5B/B,KAAKkB,UAAUC,SAASC,IACtBA,EAASvB,SAAWG,KAAKH,QAAQ,IAEnC,GAAIG,KAAKH,SAAU,CACjBG,KAAKgC,sB,KACA,CACLhC,KAAKiC,oB,GAIDD,qBAAuB,KAC7B,IAAKhC,KAAKH,SAAU,OAEpBG,KAAKL,aAAac,UAAUyB,OAAOlC,KAAKR,eACxCQ,KAAKL,aAAac,UAAUC,IAAIV,KAAKP,gBAAgB,EAG/CwC,mBAAqB,KAC3B,GAAIjC,KAAKH,SAAU,OAEnBG,KAAKL,aAAac,UAAUyB,OAAOlC,KAAKP,iBACxCO,KAAKL,aAAac,UAAUC,IAAIV,KAAKR,cAAc,EAG7CoB,uBAAyB,KAC/BZ,KAAKL,aAAac,UAAUyB,OAAOlC,KAAKT,QAASS,KAAKP,gBAAiBO,KAAKR,cAAc,EAO5F,MAAA2C,GACE,OACEC,EAAO,SAAAC,IAAA,2CAAAC,MAAO,CAAE,+BAAgC,KAAM,eAAgBtC,KAAKH,UAAY0C,KAAK,QAE1FH,EAAA,OAAAC,IAAA,2CAAKC,MAAO,CAAE,qBAAsB,KAAM,eAAgBtC,KAAKH,UAAY0C,KAAK,QAC9EH,EAAA,QAAAC,IAAA,2CAAMG,KAAK,UAGbJ,EAAA,OAAAC,IAAA,2CACEC,MAAM,wDACNC,KAAK,MACLE,IAAMC,IACJ1C,KAAKN,SAAWgD,CAAO,GAGzBN,EAAA,QAAAC,IAAA,8CAGFD,EAAA,OAAAC,IAAA,2CACEC,MAAM,iHACNC,KAAK,UAELH,EAAA,QAAAC,IAAA,2CAAMG,KAAK,Y","ignoreList":[]}