npm - @beeq/core - Versions diffs - 1.8.4 → 1.9.0 - Mend

@beeq/core 1.8.4 → 1.9.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (910) hide show

package/dist/collection/components/dialog/scss/bq-dialog.css CHANGED Viewed

	@@ -1 +1 @@
1	- .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))}.bq-dialog,.shadow-\[shadow\:--bq-dialog--box-shadow\]{--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000}::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{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);font-family:var(--bq-font-family);line-height:var(--bq-font-line-height--regular);min-height:100vh;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}}: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.light,.light,:root,[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-200);--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}.beeq.dark,.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-800);--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}.endava,[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,[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-200);--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-800);--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}.visible{visibility:visible}.invisible{visibility:hidden}.absolute{position:absolute}.sticky{position:sticky}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-end{justify-content:flex-end}.gap-\[--bq-dialog--content-footer-gap\]{gap:var(--bq-dialog--content-footer-gap)}.gap-m{gap:var(--bq-spacing-m)}.gap-xs{gap:var(--bq-spacing-xs)}.rounded-\[--bq-dialog--border-radius\]{border-radius:var(--bq-dialog--border-radius)}.border-\[length\:--bq-dialog--border-width\]{border-width:var(--bq-dialog--border-width)}.border-none{border-style:none}.border-\[color\:--bq-dialog--border-color\]{border-color:var(--bq-dialog--border-color)}.bg-\[--bq-dialog--background-backdrop\]{background-color:var(--bq-dialog--background-backdrop)}.bg-\[--bq-dialog--background\]{background-color:var(--bq-dialog--background)}.text-\[--bq-dialog--text-color\]{color:var(--bq-dialog--text-color)}.opacity-0{opacity:0}.opacity-60{opacity:.6}.shadow-\[shadow\:--bq-dialog--box-shadow\]{--tw-shadow:var(--bq-dialog--box-shadow);--tw-shadow-colored:var(--bq-dialog--box-shadow);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.transition-\[opacity\]{transition-duration:.15s;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.is-\[90vw\]{inline-size:90vw}.is-full{inline-size:100%}.p-b-0{padding-block:0}.p-b-\[--bq-dialog--padding\]{padding-block:var(--bq-dialog--padding)}.p-be-0{padding-block-end:0}.p-bs-0{padding-block-start:0}.p-i-\[--bq-dialog--padding\]{padding-inline:var(--bq-dialog--padding)}.inset-bs-0{inset-block-start:0}.inset-bs-\[100\%\]{inset-block-start:100%}@-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)}}::-ms-backdrop{--bq-dialog--background:var(--bq-ui--primary);--bq-dialog--background-backdrop:var(--bq-background--overlay);--bq-dialog--text-color:var(--bq-text--primary);--bq-dialog--box-shadow:var(--bq-box-shadow--l);--bq-dialog--border-color:transparent;--bq-dialog--border-radius:var(--bq-radius--m);--bq-dialog--border-style:none;--bq-dialog--border-width:unset;--bq-dialog--padding:var(--bq-spacing-l);--bq-dialog--content-footer-gap:var(--bq-spacing-l);--bq-dialog--title-body-gap:var(--bq-spacing-s);--bq-dialog--width-small:320px;--bq-dialog--width-medium:480px;--bq-dialog--width-large:640px;--bq-dialog-z-index:10}::backdrop,:host{--bq-dialog--background:var(--bq-ui--primary);--bq-dialog--background-backdrop:var(--bq-background--overlay);--bq-dialog--text-color:var(--bq-text--primary);--bq-dialog--box-shadow:var(--bq-box-shadow--l);--bq-dialog--border-color:transparent;--bq-dialog--border-radius:var(--bq-radius--m);--bq-dialog--border-style:none;--bq-dialog--border-width:unset;--bq-dialog--padding:var(--bq-spacing-l);--bq-dialog--content-footer-gap:var(--bq-spacing-l);--bq-dialog--title-body-gap:var(--bq-spacing-s);--bq-dialog--width-small:320px;--bq-dialog--width-medium:480px;--bq-dialog--width-large:640px;--bq-dialog-z-index:10}:host{visibility:hidden!important}:host(.bq-dialog--open){visibility:visible!important}.bq-dialog{--tw-shadow:var(--bq-dialog--box-shadow);--tw-shadow-colored:var(--bq-dialog--box-shadow);background-color:var(--bq-dialog--background);border-color:var(--bq-dialog--border-color);border-radius:var(--bq-dialog--border-radius);border-style:var(--bq-dialog--border-style);border-width:var(--bq-dialog--border-width);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);color:var(--bq-dialog--text-color);display:flex;flex-direction:column;gap:var(--bq-dialog--content-footer-gap);inline-size:90vw;padding-block:0;padding-inline:0;position:absolute}@media (min-width:640px){.bq-dialog.small{inline-size:var(--bq-dialog--width-small)}.bq-dialog.medium{inline-size:var(--bq-dialog--width-medium)}.bq-dialog.large{inline-size:var(--bq-dialog--width-large)}}.bq-dialog::-ms-backdrop{background-color:var(--bq-dialog--background-backdrop);opacity:0;transition-duration:.3s;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1)}.bq-dialog::backdrop{background-color:var(--bq-dialog--background-backdrop);opacity:0;transition-duration:.3s;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1)}.bq-dialog[open]::-ms-backdrop{opacity:.6}.bq-dialog[open]::backdrop{opacity:.6}.bq-dialog--header{gap:var(--bq-spacing-m);inset-block-start:0;padding-block:var(--bq-dialog--padding);padding-block-end:0;padding-inline:var(--bq-dialog--padding)}.bq-dialog--footer,.bq-dialog--header{align-items:center;display:flex;position:sticky}.bq-dialog--footer{gap:var(--bq-spacing-xs);inline-size:100%;inset-block-start:100%;justify-content:flex-end;padding-block:var(--bq-dialog--padding);padding-block-start:0;padding-inline:var(--bq-dialog--padding)}.bq-dialog--close{--bq-radius--m:var(--bq-radius--s);--bq-button--small-paddingX:var(--bq-spacing-xs2);--bq-button--small-paddingY:var(--bq-spacing-xs2)}.bq-dialog--close::part(button){border-style:none}@media (min-width:640px){.sm\:is-\[--bq-dialog--width-large\]{inline-size:var(--bq-dialog--width-large)}.sm\:is-\[--bq-dialog--width-medium\]{inline-size:var(--bq-dialog--width-medium)}.sm\:is-\[--bq-dialog--width-small\]{inline-size:var(--bq-dialog--width-small)}}.scale-100,.scale-90{--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))}.static{position:static}.m-auto{margin:auto}.\!hidden{display:none!important}.hidden{display:none}.flex-1{flex:1 1 0%}.scale-100{--tw-scale-x:1;--tw-scale-y:1}.scale-90{--tw-scale-x:.9;--tw-scale-y:.9}.cursor-pointer{cursor:pointer}.justify-between{justify-content:space-between}.gap-\[--bq-dialog--title-body-gap\]{gap:var(--bq-dialog--title-body-gap)}.gap-s{gap:var(--bq-spacing-s)}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.bg-ui-alt{background-color:var(--bq-ui--alt)}.opacity-100{opacity:1}.transition{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1)}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.\!p-b-s{padding-block:var(--bq-spacing-s)!important}.\!p-be-\[--bq-dialog--padding\]{padding-block-end:var(--bq-dialog--padding)!important}.inset-be-\[50\%\]{inset-block-end:50%}.inset-bs-\[50\%\]{inset-block-start:50%}.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}}.focus-visible\:outline-none:focus-visible{outline:2px solid transparent;outline-offset:2px}.text-\[color\:--bq-icon--color\]{color:var(--bq-icon--color)}.bs-\[--bq-icon--size\]{block-size:var(--bq-icon--size)}.is-\[--bq-icon--size\]{inline-size:var(--bq-icon--size)}.block{display:block}.inline{display:inline}.focus{outline:var(--bq-ring-width,2px) solid var(--bq-ring-color-focus,var(--bq-focus));outline-offset:var(--bq-ring-offset-width,1px)}
1	+ .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))}.bq-dialog,.shadow-\[shadow\:--bq-dialog--box-shadow\]{--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000}::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{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);font-family:var(--bq-font-family);line-height:var(--bq-font-line-height--regular);min-height:100vh;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}}: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.light,.light,:root,[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-200);--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}.beeq.dark,.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-800);--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}.endava,[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,[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-200);--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-800);--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}.visible{visibility:visible}.invisible{visibility:hidden}.fixed{position:fixed}.sticky{position:sticky}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-end{justify-content:flex-end}.gap-\[--bq-dialog--content-footer-gap\]{gap:var(--bq-dialog--content-footer-gap)}.gap-m{gap:var(--bq-spacing-m)}.gap-xs{gap:var(--bq-spacing-xs)}.rounded-\[--bq-dialog--border-radius\]{border-radius:var(--bq-dialog--border-radius)}.border-\[length\:--bq-dialog--border-width\]{border-width:var(--bq-dialog--border-width)}.border-none{border-style:none}.border-\[color\:--bq-dialog--border-color\]{border-color:var(--bq-dialog--border-color)}.bg-\[--bq-dialog--background-backdrop\]{background-color:var(--bq-dialog--background-backdrop)}.bg-\[--bq-dialog--background\]{background-color:var(--bq-dialog--background)}.text-\[--bq-dialog--text-color\]{color:var(--bq-dialog--text-color)}.opacity-0{opacity:0}.opacity-60{opacity:.6}.shadow-\[shadow\:--bq-dialog--box-shadow\]{--tw-shadow:var(--bq-dialog--box-shadow);--tw-shadow-colored:var(--bq-dialog--box-shadow);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.transition-\[opacity\]{transition-duration:.15s;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.is-\[90vw\]{inline-size:90vw}.is-full{inline-size:100%}.p-b-0{padding-block:0}.p-b-\[--bq-dialog--padding\]{padding-block:var(--bq-dialog--padding)}.p-be-0{padding-block-end:0}.p-bs-0{padding-block-start:0}.p-i-\[--bq-dialog--padding\]{padding-inline:var(--bq-dialog--padding)}.inset-bs-0{inset-block-start:0}.inset-bs-\[100\%\]{inset-block-start:100%}@-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)}}::-ms-backdrop{--bq-dialog--background:var(--bq-ui--primary);--bq-dialog--background-backdrop:var(--bq-background--overlay);--bq-dialog--text-color:var(--bq-text--primary);--bq-dialog--box-shadow:var(--bq-box-shadow--l);--bq-dialog--border-color:transparent;--bq-dialog--border-radius:var(--bq-radius--m);--bq-dialog--border-style:none;--bq-dialog--border-width:unset;--bq-dialog--padding:var(--bq-spacing-l);--bq-dialog--content-footer-gap:var(--bq-spacing-l);--bq-dialog--title-body-gap:var(--bq-spacing-s);--bq-dialog--width-small:320px;--bq-dialog--width-medium:480px;--bq-dialog--width-large:640px;--bq-dialog-z-index:10}::backdrop,:host{--bq-dialog--background:var(--bq-ui--primary);--bq-dialog--background-backdrop:var(--bq-background--overlay);--bq-dialog--text-color:var(--bq-text--primary);--bq-dialog--box-shadow:var(--bq-box-shadow--l);--bq-dialog--border-color:transparent;--bq-dialog--border-radius:var(--bq-radius--m);--bq-dialog--border-style:none;--bq-dialog--border-width:unset;--bq-dialog--padding:var(--bq-spacing-l);--bq-dialog--content-footer-gap:var(--bq-spacing-l);--bq-dialog--title-body-gap:var(--bq-spacing-s);--bq-dialog--width-small:320px;--bq-dialog--width-medium:480px;--bq-dialog--width-large:640px;--bq-dialog-z-index:10}:host{visibility:hidden!important}:host(.bq-dialog--open){visibility:visible!important}.bq-dialog{--tw-shadow:var(--bq-dialog--box-shadow);--tw-shadow-colored:var(--bq-dialog--box-shadow);background-color:var(--bq-dialog--background);border-color:var(--bq-dialog--border-color);border-radius:var(--bq-dialog--border-radius);border-style:var(--bq-dialog--border-style);border-width:var(--bq-dialog--border-width);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);color:var(--bq-dialog--text-color);display:flex;flex-direction:column;gap:var(--bq-dialog--content-footer-gap);inline-size:90vw;padding-block:0;padding-inline:0;position:fixed}@media (min-width:640px){.bq-dialog.small{inline-size:var(--bq-dialog--width-small)}.bq-dialog.medium{inline-size:var(--bq-dialog--width-medium)}.bq-dialog.large{inline-size:var(--bq-dialog--width-large)}}.bq-dialog::-ms-backdrop{background-color:var(--bq-dialog--background-backdrop);opacity:0;transition-duration:.3s;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1)}.bq-dialog::backdrop{background-color:var(--bq-dialog--background-backdrop);opacity:0;transition-duration:.3s;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1)}.bq-dialog[open]::-ms-backdrop{opacity:.6}.bq-dialog[open]::backdrop{opacity:.6}.bq-dialog--header{gap:var(--bq-spacing-m);inset-block-start:0;padding-block:var(--bq-dialog--padding);padding-block-end:0;padding-inline:var(--bq-dialog--padding)}.bq-dialog--footer,.bq-dialog--header{align-items:center;display:flex;position:sticky}.bq-dialog--footer{gap:var(--bq-spacing-xs);inline-size:100%;inset-block-start:100%;justify-content:flex-end;padding-block:var(--bq-dialog--padding);padding-block-start:0;padding-inline:var(--bq-dialog--padding)}.bq-dialog--close{--bq-radius--m:var(--bq-radius--s);--bq-button--small-paddingX:var(--bq-spacing-xs2);--bq-button--small-paddingY:var(--bq-spacing-xs2)}.bq-dialog--close::part(button){border-style:none}@media (min-width:640px){.sm\:is-\[--bq-dialog--width-large\]{inline-size:var(--bq-dialog--width-large)}.sm\:is-\[--bq-dialog--width-medium\]{inline-size:var(--bq-dialog--width-medium)}.sm\:is-\[--bq-dialog--width-small\]{inline-size:var(--bq-dialog--width-small)}}.scale-100,.scale-90{--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))}.static{position:static}.m-auto{margin:auto}.\!hidden{display:none!important}.hidden{display:none}.flex-1{flex:1 1 0%}.scale-100{--tw-scale-x:1;--tw-scale-y:1}.scale-90{--tw-scale-x:.9;--tw-scale-y:.9}.cursor-pointer{cursor:pointer}.justify-between{justify-content:space-between}.gap-\[--bq-dialog--title-body-gap\]{gap:var(--bq-dialog--title-body-gap)}.gap-s{gap:var(--bq-spacing-s)}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.bg-ui-alt{background-color:var(--bq-ui--alt)}.opacity-100{opacity:1}.transition{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1)}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.\!p-b-s{padding-block:var(--bq-spacing-s)!important}.\!p-be-\[--bq-dialog--padding\]{padding-block-end:var(--bq-dialog--padding)!important}.inset-be-\[50\%\]{inset-block-end:50%}.inset-bs-\[50\%\]{inset-block-start:50%}.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}}.focus-visible\:outline-none:focus-visible{outline:2px solid transparent;outline-offset:2px}.text-\[color\:--bq-icon--color\]{color:var(--bq-icon--color)}.bs-\[--bq-icon--size\]{block-size:var(--bq-icon--size)}.is-\[--bq-icon--size\]{inline-size:var(--bq-icon--size)}.block{display:block}.inline{display:inline}.focus{outline:var(--bq-ring-width,2px) solid var(--bq-ring-color-focus,var(--bq-focus));outline-offset:var(--bq-ring-offset-width,1px)}

package/dist/collection/components/divider/bq-divider.js CHANGED Viewed

@@ -136,18 +136,18 @@ export class BqDivider {
             ...(this.strokeThickness && { '--bq-divider--stroke-thickness': `${this.strokeThickness}px` }),
             ...(!isNil(this.strokeBasis) && { '--bq-divider--stroke-basis': `${this.strokeBasis}px` }),
         };
-        return (h(Host, { key: '7d48b6bbb67f4551caaed553e60552540c97eafc', style: styles }, h("div", { key: 'db57fe7c588927d15ba30d792dd0170a7c55d6da', class: {
+        return (h(Host, { key: '4103d484b5ccb459e9c6cbbb2bdfa2e2f6b4828c', style: styles }, h("div", { key: 'e6a16846974474593ef290f77ad624d2ee88baa5', class: {
                 'bq-divider': true,
                 [`bq-divider--${this.orientation}`]: true,
                 [`bq-divider--title__${this.titleAlignment}`]: true,
                 'gap-0': !this.hasTitle,
-            }, part: "base", ref: (div) => (this.titleElem = div), role: "separator", "aria-orientation": this.orientation }, h("svg", { key: '55b09d7c27ee4546ad43e5587fe915f8a8c0473d', class: {
+            }, part: "base", ref: (div) => (this.titleElem = div), role: "separator", "aria-orientation": this.orientation }, h("svg", { key: '3a992a344d4c4d55f3b4d3a3af808b6e670803fe', class: {
                 'bq-divider--stroke start': true,
                 '!hidden': this.strokeBasis === 0 && this.titleAlignment === 'start',
-            }, part: "dash-start" }, h("line", { key: '198dd4af0b52c2d1f055b7bf24603afa3a36dc4f', ...this.strokeAttributes, part: "dash-start-line" })), h("slot", { key: '4a8c919cf906bee4c5d1222bc3db38cdd1501425', onSlotchange: this.handleSlotChange }), h("svg", { key: '3c2d044d2b03b6a6ac49870dfe6208190025b31c', class: {
+            }, part: "dash-start" }, h("line", { key: 'c9e9aa87681fdc83f85a56f6a7b9a34386edc0b8', ...this.strokeAttributes, part: "dash-start-line" })), h("slot", { key: '62a6a210165fdc3354f15a7e6acc7c8914b7258a', onSlotchange: this.handleSlotChange }), h("svg", { key: 'c9e2a0f3b0b4421f19dc124036297f549e3a9623', class: {
                 'bq-divider--stroke end': true,
                 '!hidden': !this.hasTitle || (this.strokeBasis === 0 && this.titleAlignment === 'end'),
-            }, part: "dash-end" }, h("line", { key: '1d87b657a63adfe32b103f3c69ec6486950e5d9b', ...this.strokeAttributes, part: "dash-end-line" })))));
+            }, part: "dash-end" }, h("line", { key: 'af46637eda909675b0363d37f699bbfd78ef3e1c', ...this.strokeAttributes, part: "dash-end-line" })))));
     }
     static get is() { return "bq-divider"; }
     static get encapsulation() { return "shadow"; }
@@ -165,6 +165,7 @@ export class BqDivider {
         return {
             "dashed": {
                 "type": "boolean",
+                "attribute": "dashed",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -179,12 +180,12 @@ export class BqDivider {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "dashed",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "orientation": {
                 "type": "string",
+                "attribute": "orientation",
                 "mutable": false,
                 "complexType": {
                     "original": "TDividerOrientation",
@@ -205,12 +206,12 @@ export class BqDivider {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "orientation",
                 "reflect": true,
                 "defaultValue": "'horizontal'"
             },
             "strokeColor": {
                 "type": "string",
+                "attribute": "stroke-color",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -225,12 +226,12 @@ export class BqDivider {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "stroke-color",
                 "reflect": true,
                 "defaultValue": "'stroke--primary'"
             },
             "titleAlignment": {
                 "type": "string",
+                "attribute": "title-alignment",
                 "mutable": false,
                 "complexType": {
                     "original": "TDividerTitleAlignment",
@@ -251,12 +252,12 @@ export class BqDivider {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "title-alignment",
                 "reflect": true,
                 "defaultValue": "'middle'"
             },
             "strokeDashWidth": {
                 "type": "number",
+                "attribute": "stroke-dash-width",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -271,12 +272,12 @@ export class BqDivider {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "stroke-dash-width",
                 "reflect": true,
                 "defaultValue": "12"
             },
             "strokeDashGap": {
                 "type": "number",
+                "attribute": "stroke-dash-gap",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -291,12 +292,12 @@ export class BqDivider {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "stroke-dash-gap",
                 "reflect": true,
                 "defaultValue": "7"
             },
             "strokeThickness": {
                 "type": "number",
+                "attribute": "stroke-thickness",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -311,12 +312,12 @@ export class BqDivider {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "stroke-thickness",
                 "reflect": true,
                 "defaultValue": "1"
             },
             "strokeBasis": {
                 "type": "number",
+                "attribute": "stroke-basis",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -331,12 +332,12 @@ export class BqDivider {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "stroke-basis",
                 "reflect": true,
                 "defaultValue": "0"
             },
             "strokeLinecap": {
                 "type": "string",
+                "attribute": "stroke-linecap",
                 "mutable": false,
                 "complexType": {
                     "original": "TDividerStrokeLinecap",
@@ -357,7 +358,6 @@ export class BqDivider {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "stroke-linecap",
                 "reflect": true,
                 "defaultValue": "'butt'"
             }

package/dist/collection/components/divider/bq-divider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"bq-divider.js","sourceRoot":"","sources":["../../../../../../src/components/divider/bq-divider.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';\n\nimport {\n DIVIDER_ORIENTATION,\n DIVIDER_ORIENTATION_ENUM,\n DIVIDER_STROKE_LINECAP,\n DIVIDER_TITLE_ALIGNMENT,\n TDividerOrientation,\n TDividerStrokeLinecap,\n TDividerTitleAlignment,\n} from './bq-divider.types';\nimport { getColorCSSVariable, getTextContent, hasSlotContent, isNil, validatePropValue } from '../../shared/utils';\n\n/*\n The Divider component is used to visually separate content in a layout.\n \n @example How to use it\n * ```html\n * <bq-divider orientation=\"horizontal\" stroke-color=\"stroke--primary\" title-alignment=\"middle\">\n * <span slot=\"title\">Divider Title</span>\n * </bq-divider>\n * ```\n \n @documentation https://www.beeq.design/3d466e231/p/53dfe6-divider\n * @status stable\n \n @attr {boolean} dashed - If true, the divider has a dashed pattern.\n * @attr {\"horizontal\" \| \"vertical\"} orientation - The default orientation of the divider.\n * @attr {string} stroke-color - Set the stroke color of the divider. The value should be a valid value of the palette color.\n * @attr {\"start\" \| \"middle\" \| \"end\"} title-alignment - Set the alignment of the title on the main axis of the divider (horizontal / vertical).\n * @attr {number} stroke-dash-width - Set the width of each dash of the divider's stroke. This is applicable when the stroke is dashed.\n * @attr {number} stroke-dash-gap - Set the gap of the divider's stroke. This is applicable when the stroke is dashed.\n * @attr {number} stroke-thickness - Set the thickness of the divider's stroke. Value expressed in px.\n * @attr {number} stroke-basis - Set the min width of the divider's stroke when text is not centered. Value expressed in px.\n * @attr {\"square\" \| \"round\" \| \"butt\"} stroke-linecap - Set the line of the divider's stroke. This is applicable when the stroke is dashed.\n \n @slot - The title content of the divider.\n \n @part base - The component's internal wrapper.\n * @part dash-start - The component's internal svg wrapper for the start line of the divider's stroke.\n * @part dash-end - The component's internal svg wrapper for the end line of the divider's stroke.\n * @part dash-start-line - The component's internal line component of the divider's stroke.\n * @part dash-end-line - The component's internal line component of the divider's stroke.\n \n @cssprop --bq-divider--color - Divider color\n * @cssprop --bq-divider--title-marginX - Divider space between title and delimiters\n /\n@Component({\n tag: 'bq-divider',\n styleUrl: './scss/bq-divider.scss',\n shadow: true,\n})\nexport class BqDivider {\n // Own Properties\n // ====================\n\n private titleElem: HTMLDivElement;\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el!: HTMLBqDividerElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n @State() private hasTitle: boolean;\n\n // Public Property API\n // ========================\n\n /* If true, the divider has a dashed pattern /\n @Prop() dashed = false;\n\n /* The default orientation of the divider /\n @Prop({ reflect: true }) orientation: TDividerOrientation = 'horizontal';\n\n /* Set the stroke color of the divider. The value should be a valid value of the palette color /\n @Prop({ reflect: true }) strokeColor?: string = 'stroke--primary';\n\n /* Set the alignment of the title on the main axis of the divider (horizontal / vertical) /\n @Prop({ reflect: true }) titleAlignment?: TDividerTitleAlignment = 'middle';\n\n /* Set the width of each dash of the divider's stroke. This is applicable when the stroke is dashed /\n @Prop({ reflect: true }) strokeDashWidth?: number = 12;\n\n /* Set the gap of the divider's stroke. This is applicable when the stroke is dashed /\n @Prop({ reflect: true }) strokeDashGap?: number = 7;\n\n /* Set the thickness of the divider's stroke. Value expressed in px/\n @Prop({ reflect: true }) strokeThickness?: number = 1;\n\n /* Set the min width of the divider's stroke when text is not centered. Value expressed in px /\n @Prop({ reflect: true }) strokeBasis?: number = 0;\n\n /* Set the line of the divider's stroke. This is applicable when the stroke is dashed */\n @Prop({ reflect: true }) strokeLinecap?: TDividerStrokeLinecap = 'butt';\n\n // Prop lifecycle events\n // =======================\n\n @Watch('orientation')\n @Watch('titleAlignment')\n @Watch('strokeLinecap')\n checkPropValues() {\n validatePropValue(DIVIDER_ORIENTATION, 'horizontal', this.el, 'orientation');\n validatePropValue(DIVIDER_TITLE_ALIGNMENT, 'middle', this.el, 'titleAlignment');\n validatePropValue(DIVIDER_STROKE_LINECAP, 'butt', this.el, 'strokeLinecap');\n }\n\n // Events section\n // Requires JSDocs for public API documentation\n // ==============================================\n\n // Component lifecycle events\n // Ordered by their natural call order\n // =====================================\n\n connectedCallback() {\n this.checkPropValues();\n }\n\n componentWillLoad() {\n this.checkPropValues();\n }\n\n componentDidLoad() {\n this.handleSlotChange();\n }\n\n // Listeners\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 // Local methods\n // Internal business logic.\n // These methods cannot be called from the host element.\n // =======================================================\n\n private handleSlotChange = () => {\n this.hasTitle = hasSlotContent(this.titleElem) \|\| !!getTextContent(this.titleElem.querySelector('slot'));\n };\n\n private get strokeAttributes() {\n return {\n ...this.strokeDrawPositions,\n ...(this.dashed && { 'stroke-dasharray': this.strokeDasharray }),\n 'stroke-linecap': this.strokeLinecap,\n 'stroke-width': this.strokeThickness,\n };\n }\n\n private get strokeDrawPositions() {\n const drawOffset = this.strokeThickness / 2;\n const strokeDrawPositions = {\n [DIVIDER_ORIENTATION_ENUM.HORIZONTAL]: { x1: drawOffset, x2: '100%', y1: drawOffset, y2: drawOffset },\n [DIVIDER_ORIENTATION_ENUM.VERTICAL]: { x1: drawOffset, x2: drawOffset, y1: drawOffset, y2: '100%' },\n };\n const orientationMap = new Map(Object.entries(strokeDrawPositions));\n\n return orientationMap.get(this.orientation);\n }\n\n private get strokeDasharray() {\n return `${this.strokeDashWidth}, ${this.strokeDashGap}`;\n }\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n const styles = {\n ...(this.strokeColor && { '--bq-divider--stroke-color': getColorCSSVariable(this.strokeColor) }),\n ...(this.strokeThickness && { '--bq-divider--stroke-thickness': `${this.strokeThickness}px` }),\n ...(!isNil(this.strokeBasis) && { '--bq-divider--stroke-basis': `${this.strokeBasis}px` }),\n };\n\n return (\n <Host style={styles}>\n <div\n class={{\n 'bq-divider': true,\n [`bq-divider--${this.orientation}`]: true,\n [`bq-divider--title__${this.titleAlignment}`]: true,\n 'gap-0': !this.hasTitle,\n }}\n part=\"base\"\n ref={(div) => (this.titleElem = div)}\n role=\"separator\"\n aria-orientation={this.orientation}\n >\n <svg\n class={{\n 'bq-divider--stroke start': true,\n '!hidden': this.strokeBasis === 0 && this.titleAlignment === 'start',\n }}\n part=\"dash-start\"\n >\n <line {...this.strokeAttributes} part=\"dash-start-line\" />\n </svg>\n <slot onSlotchange={this.handleSlotChange} />\n <svg\n class={{\n 'bq-divider--stroke end': true,\n '!hidden': !this.hasTitle \|\| (this.strokeBasis === 0 && this.titleAlignment === 'end'),\n }}\n part=\"dash-end\"\n >\n <line {...this.strokeAttributes} part=\"dash-end-line\" />\n </svg>\n </div>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"bq-divider.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/components/divider/bq-divider.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';\n\nimport {\n DIVIDER_ORIENTATION,\n DIVIDER_ORIENTATION_ENUM,\n DIVIDER_STROKE_LINECAP,\n DIVIDER_TITLE_ALIGNMENT,\n} from './bq-divider.types';\nimport type { TDividerOrientation, TDividerStrokeLinecap, TDividerTitleAlignment } from './bq-divider.types';\nimport { getColorCSSVariable, getTextContent, hasSlotContent, isNil, validatePropValue } from '../../shared/utils';\n\n/*\n The Divider component is used to visually separate content in a layout.\n \n @example How to use it\n * ```html\n * <bq-divider orientation=\"horizontal\" stroke-color=\"stroke--primary\" title-alignment=\"middle\">\n * <span slot=\"title\">Divider Title</span>\n * </bq-divider>\n * ```\n \n @documentation https://www.beeq.design/3d466e231/p/53dfe6-divider\n * @status stable\n \n @attr {boolean} dashed - If true, the divider has a dashed pattern.\n * @attr {\"horizontal\" \| \"vertical\"} orientation - The default orientation of the divider.\n * @attr {string} stroke-color - Set the stroke color of the divider. The value should be a valid value of the palette color.\n * @attr {\"start\" \| \"middle\" \| \"end\"} title-alignment - Set the alignment of the title on the main axis of the divider (horizontal / vertical).\n * @attr {number} stroke-dash-width - Set the width of each dash of the divider's stroke. This is applicable when the stroke is dashed.\n * @attr {number} stroke-dash-gap - Set the gap of the divider's stroke. This is applicable when the stroke is dashed.\n * @attr {number} stroke-thickness - Set the thickness of the divider's stroke. Value expressed in px.\n * @attr {number} stroke-basis - Set the min width of the divider's stroke when text is not centered. Value expressed in px.\n * @attr {\"square\" \| \"round\" \| \"butt\"} stroke-linecap - Set the line of the divider's stroke. This is applicable when the stroke is dashed.\n \n @slot - The title content of the divider.\n \n @part base - The component's internal wrapper.\n * @part dash-start - The component's internal svg wrapper for the start line of the divider's stroke.\n * @part dash-end - The component's internal svg wrapper for the end line of the divider's stroke.\n * @part dash-start-line - The component's internal line component of the divider's stroke.\n * @part dash-end-line - The component's internal line component of the divider's stroke.\n \n @cssprop --bq-divider--color - Divider color\n * @cssprop --bq-divider--title-marginX - Divider space between title and delimiters\n /\n@Component({\n tag: 'bq-divider',\n styleUrl: './scss/bq-divider.scss',\n shadow: true,\n})\nexport class BqDivider {\n // Own Properties\n // ====================\n\n private titleElem: HTMLDivElement;\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el!: HTMLBqDividerElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n @State() private hasTitle: boolean;\n\n // Public Property API\n // ========================\n\n /* If true, the divider has a dashed pattern /\n @Prop() dashed = false;\n\n /* The default orientation of the divider /\n @Prop({ reflect: true }) orientation: TDividerOrientation = 'horizontal';\n\n /* Set the stroke color of the divider. The value should be a valid value of the palette color /\n @Prop({ reflect: true }) strokeColor?: string = 'stroke--primary';\n\n /* Set the alignment of the title on the main axis of the divider (horizontal / vertical) /\n @Prop({ reflect: true }) titleAlignment?: TDividerTitleAlignment = 'middle';\n\n /* Set the width of each dash of the divider's stroke. This is applicable when the stroke is dashed /\n @Prop({ reflect: true }) strokeDashWidth?: number = 12;\n\n /* Set the gap of the divider's stroke. This is applicable when the stroke is dashed /\n @Prop({ reflect: true }) strokeDashGap?: number = 7;\n\n /* Set the thickness of the divider's stroke. Value expressed in px/\n @Prop({ reflect: true }) strokeThickness?: number = 1;\n\n /* Set the min width of the divider's stroke when text is not centered. Value expressed in px /\n @Prop({ reflect: true }) strokeBasis?: number = 0;\n\n /* Set the line of the divider's stroke. This is applicable when the stroke is dashed */\n @Prop({ reflect: true }) strokeLinecap?: TDividerStrokeLinecap = 'butt';\n\n // Prop lifecycle events\n // =======================\n\n @Watch('orientation')\n @Watch('titleAlignment')\n @Watch('strokeLinecap')\n checkPropValues() {\n validatePropValue(DIVIDER_ORIENTATION, 'horizontal', this.el, 'orientation');\n validatePropValue(DIVIDER_TITLE_ALIGNMENT, 'middle', this.el, 'titleAlignment');\n validatePropValue(DIVIDER_STROKE_LINECAP, 'butt', this.el, 'strokeLinecap');\n }\n\n // Events section\n // Requires JSDocs for public API documentation\n // ==============================================\n\n // Component lifecycle events\n // Ordered by their natural call order\n // =====================================\n\n connectedCallback() {\n this.checkPropValues();\n }\n\n componentWillLoad() {\n this.checkPropValues();\n }\n\n componentDidLoad() {\n this.handleSlotChange();\n }\n\n // Listeners\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 // Local methods\n // Internal business logic.\n // These methods cannot be called from the host element.\n // =======================================================\n\n private handleSlotChange = () => {\n this.hasTitle = hasSlotContent(this.titleElem) \|\| !!getTextContent(this.titleElem.querySelector('slot'));\n };\n\n private get strokeAttributes() {\n return {\n ...this.strokeDrawPositions,\n ...(this.dashed && { 'stroke-dasharray': this.strokeDasharray }),\n 'stroke-linecap': this.strokeLinecap,\n 'stroke-width': this.strokeThickness,\n };\n }\n\n private get strokeDrawPositions() {\n const drawOffset = this.strokeThickness / 2;\n const strokeDrawPositions = {\n [DIVIDER_ORIENTATION_ENUM.HORIZONTAL]: { x1: drawOffset, x2: '100%', y1: drawOffset, y2: drawOffset },\n [DIVIDER_ORIENTATION_ENUM.VERTICAL]: { x1: drawOffset, x2: drawOffset, y1: drawOffset, y2: '100%' },\n };\n const orientationMap = new Map(Object.entries(strokeDrawPositions));\n\n return orientationMap.get(this.orientation);\n }\n\n private get strokeDasharray() {\n return `${this.strokeDashWidth}, ${this.strokeDashGap}`;\n }\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n const styles = {\n ...(this.strokeColor && { '--bq-divider--stroke-color': getColorCSSVariable(this.strokeColor) }),\n ...(this.strokeThickness && { '--bq-divider--stroke-thickness': `${this.strokeThickness}px` }),\n ...(!isNil(this.strokeBasis) && { '--bq-divider--stroke-basis': `${this.strokeBasis}px` }),\n };\n\n return (\n <Host style={styles}>\n <div\n class={{\n 'bq-divider': true,\n [`bq-divider--${this.orientation}`]: true,\n [`bq-divider--title__${this.titleAlignment}`]: true,\n 'gap-0': !this.hasTitle,\n }}\n part=\"base\"\n ref={(div) => (this.titleElem = div)}\n role=\"separator\"\n aria-orientation={this.orientation}\n >\n <svg\n class={{\n 'bq-divider--stroke start': true,\n '!hidden': this.strokeBasis === 0 && this.titleAlignment === 'start',\n }}\n part=\"dash-start\"\n >\n <line {...this.strokeAttributes} part=\"dash-start-line\" />\n </svg>\n <slot onSlotchange={this.handleSlotChange} />\n <svg\n class={{\n 'bq-divider--stroke end': true,\n '!hidden': !this.hasTitle \|\| (this.strokeBasis === 0 && this.titleAlignment === 'end'),\n }}\n part=\"dash-end\"\n >\n <line {...this.strokeAttributes} part=\"dash-end-line\" />\n </svg>\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/divider/bq-divider.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"bq-divider.types.js","sourceRoot":"","sources":["../../../../../../src/components/divider/bq-divider.types.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,YAAY,EAAE,UAAU,CAAU,CAAC;AAGvE,MAAM,CAAC,MAAM,wBAAwB,GAAG;IACtC,UAAU,EAAE,YAAY;IACxB,QAAQ,EAAE,UAAU;CACZ,CAAC;AAEX,MAAM,CAAC,MAAM,uBAAuB,GAAG,CAAC,OAAO,EAAE,QAAQ,EAAE,KAAK,CAAU,CAAC;AAG3E,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,QAAQ,EAAE,OAAO,EAAE,MAAM,CAAU,CAAC","sourcesContent":["export const DIVIDER_ORIENTATION = ['horizontal', 'vertical'] as const;\nexport type TDividerOrientation = (typeof DIVIDER_ORIENTATION)[number];\n\nexport const DIVIDER_ORIENTATION_ENUM = {\n HORIZONTAL: 'horizontal',\n VERTICAL: 'vertical',\n} as const;\n\nexport const DIVIDER_TITLE_ALIGNMENT = ['start', 'middle', 'end'] as const;\nexport type TDividerTitleAlignment = (typeof DIVIDER_TITLE_ALIGNMENT)[number];\n\nexport const DIVIDER_STROKE_LINECAP = ['square', 'round', 'butt'] as const;\nexport type TDividerStrokeLinecap = (typeof DIVIDER_STROKE_LINECAP)[number];\n"]}
1	+ {"version":3,"file":"bq-divider.types.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/components/divider/bq-divider.types.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,YAAY,EAAE,UAAU,CAAU,CAAC;AAGvE,MAAM,CAAC,MAAM,wBAAwB,GAAG;IACtC,UAAU,EAAE,YAAY;IACxB,QAAQ,EAAE,UAAU;CACZ,CAAC;AAEX,MAAM,CAAC,MAAM,uBAAuB,GAAG,CAAC,OAAO,EAAE,QAAQ,EAAE,KAAK,CAAU,CAAC;AAG3E,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,QAAQ,EAAE,OAAO,EAAE,MAAM,CAAU,CAAC","sourcesContent":["export const DIVIDER_ORIENTATION = ['horizontal', 'vertical'] as const;\nexport type TDividerOrientation = (typeof DIVIDER_ORIENTATION)[number];\n\nexport const DIVIDER_ORIENTATION_ENUM = {\n HORIZONTAL: 'horizontal',\n VERTICAL: 'vertical',\n} as const;\n\nexport const DIVIDER_TITLE_ALIGNMENT = ['start', 'middle', 'end'] as const;\nexport type TDividerTitleAlignment = (typeof DIVIDER_TITLE_ALIGNMENT)[number];\n\nexport const DIVIDER_STROKE_LINECAP = ['square', 'round', 'butt'] as const;\nexport type TDividerStrokeLinecap = (typeof DIVIDER_STROKE_LINECAP)[number];\n"]}

package/dist/collection/components/drawer/bq-drawer.js CHANGED Viewed

@@ -235,20 +235,20 @@ export class BqDrawer {
     // Always the last one in the class.
     // ===================================
     render() {
-        return (h(Host, { key: '83f55f61d6f3dff26d4b9f8f987734839de4135e' }, this.enableBackdrop && (h("div", { key: '89a05f0693053eda89e5d11c420113d33fb95cc8', class: {
+        return (h(Host, { key: 'efb946ee8385eb53479a2775b0374a0545d19e2d' }, this.enableBackdrop && (h("div", { key: '4a1b52cfffcf15701f201c1e475f30a21a773c18', class: {
                 'fixed inset-0 block bg-[--bq-drawer--backgroundBackdrop] opacity-0 transition-opacity duration-300': true,
                 'pointer-events-none': !this.open,
                 'opacity-60': this.open,
-            }, tabIndex: -1, part: "backdrop" })), h("div", { key: '200019ad3a62c5bd13566773a5313cfb537b9e82', class: {
+            }, tabIndex: -1, part: "backdrop" })), h("div", { key: 'e3c152079a6ab2edd1a1e9dad5e25864bfa23903', class: {
                 [`bq-drawer transition-all duration-300 ease-in-out ${this.position || this.placement}`]: true,
                 '-start-[--bq-drawer--width]': this.isPositionStart,
                 '-end-[--bq-drawer--width]': this.isPositionEnd,
                 'start-0': this.open && this.isPositionStart,
                 'end-0': this.open && this.isPositionEnd,
-            }, ref: (div) => (this.drawerElem = div), "aria-hidden": !this.open ? 'true' : 'false', "aria-labelledby": "bq-drawer__title", "aria-modal": "true", hidden: !this.open, part: "panel", role: "dialog" }, h("header", { key: '96652eb3fa91d9a2caf5604c0aa1eeaa17cc81b8', class: "flex items-center", part: "header" }, h("h2", { key: 'eec5cb333c9c58b2c4609e512109bef8eb605bab', class: "flex-1 items-center justify-between font-bold leading-regular text-primary", id: "bq-drawer__title", part: "title" }, h("slot", { key: 'cd3aefa705728a68f9a3ac0ce58277db770cd78d', name: "title" })), h("div", { key: 'cc790b9b739a73fae4cbefb378292149f3a79ecf', class: "flex", part: "button-close" }, h("bq-button", { key: 'ccbc79f015a5bc9ffd3aa39a4cabbf1277004631', class: "[&::part(button)]:rounded-s [&::part(button)]:border-0 [&::part(button)]:bs-fit [&::part(button)]:p-b-0 [&::part(button)]:p-i-0 [&::part(label)]:inline-flex", appearance: "text", size: "small", slot: "button-close", exportparts: "button:button-close__btn,label:button-close__label", onClick: this.hide.bind(this) }, h("slot", { key: '3d90fc7cdd1f8b91193ef5bd1021b2c6985c6779', name: "button-close" }, h("bq-icon", { key: '4c0ece9db83f3c2195978e32210470415cca3e5b', name: "x-bold", role: "img", title: "Close" }))))), h("main", { key: '090963d8e845305fa269fdd81c9c102182c32ba6', class: "block flex-auto overflow-auto", part: "body" }, h("slot", { key: 'bc60fa850c87710ca6e6b2a14adcf2039f7362d2' })), h("footer", { key: '9c7ed47e5c88b4e3307766974d062c9ed8813b56', class: {
+            }, ref: (div) => (this.drawerElem = div), "aria-hidden": !this.open ? 'true' : 'false', "aria-labelledby": "bq-drawer__title", "aria-modal": "true", hidden: !this.open, part: "panel", role: "dialog" }, h("header", { key: 'dc13f0b0d17124957265572457295926e7806dc4', class: "flex items-center", part: "header" }, h("h2", { key: '4f278a51f0e7859c95311968ad5433e642ce07cc', class: "flex-1 items-center justify-between font-bold leading-regular text-primary", id: "bq-drawer__title", part: "title" }, h("slot", { key: 'a9f51afc1337c53822cfe6055cee6972d3823934', name: "title" })), h("div", { key: 'd4b8749bfb1db888f1d77ac19b8ae66523d2e658', class: "flex", part: "button-close" }, h("bq-button", { key: '36ee6558c58a6ff3b0e65a0430f7d2128a0448b2', class: "[&::part(button)]:rounded-s [&::part(button)]:border-0 [&::part(button)]:bs-fit [&::part(button)]:p-b-0 [&::part(button)]:p-i-0 [&::part(label)]:inline-flex", appearance: "text", size: "small", slot: "button-close", exportparts: "button:button-close__btn,label:button-close__label", onClick: this.hide.bind(this) }, h("slot", { key: '1a4d806f4ea0f8573845701ca347be112c9e9f5d', name: "button-close" }, h("bq-icon", { key: '163f48b27c6de849141d4f8d10b2e3e6b3a434de', name: "x-bold", role: "img", title: "Close" }))))), h("main", { key: 'f444bd27226b103dc40a58d9fb92461b1319c53b', class: "block flex-auto overflow-auto", part: "body" }, h("slot", { key: '856e2fec2b00d00d8fa81f00890639d9a69edef3' })), h("footer", { key: 'd8be074e197d8af5eb73b02ce466632f86f7a207', class: {
                 block: true,
                 '!hidden': !this.hasFooter,
-            }, ref: (footerElem) => (this.footerElem = footerElem), part: "footer" }, h("slot", { key: 'f9daf2a58ff77d1b71210a5157fad68578c7d8ae', name: "footer-divider" }, h("bq-divider", { key: '8869f1229d7f979d80089d1556b3739a96d3f55d', class: "mb-m block", dashed: true })), h("slot", { key: '4253a7b31cdeceafbf3cc60d9459271a5831cc7d', name: "footer", onSlotchange: this.handleFooterSlotChange })))));
+            }, ref: (footerElem) => (this.footerElem = footerElem), part: "footer" }, h("slot", { key: '69140c3edbb5b167df0e30ad62de6bdaacf0d689', name: "footer-divider" }, h("bq-divider", { key: '2f004d9607c605695dca7681e91ae7da89b00825', class: "mb-m block", dashed: true })), h("slot", { key: 'e85d49091588bbdfa8bdf6b320919c0bb9df5d1e', name: "footer", onSlotchange: this.handleFooterSlotChange })))));
     }
     static get is() { return "bq-drawer"; }
     static get encapsulation() { return "shadow"; }
@@ -266,6 +266,7 @@ export class BqDrawer {
         return {
             "enableBackdrop": {
                 "type": "boolean",
+                "attribute": "enable-backdrop",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -280,12 +281,12 @@ export class BqDrawer {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "enable-backdrop",
                 "reflect": true,
                 "defaultValue": "false"
             },
             "closeOnClickOutside": {
                 "type": "boolean",
+                "attribute": "close-on-click-outside",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -300,12 +301,12 @@ export class BqDrawer {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "close-on-click-outside",
                 "reflect": true,
                 "defaultValue": "false"
             },
             "closeOnEsc": {
                 "type": "boolean",
+                "attribute": "close-on-esc",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -320,12 +321,12 @@ export class BqDrawer {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "close-on-esc",
                 "reflect": true,
                 "defaultValue": "false"
             },
             "open": {
                 "type": "boolean",
+                "attribute": "open",
                 "mutable": true,
                 "complexType": {
                     "original": "boolean",
@@ -340,11 +341,11 @@ export class BqDrawer {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "open",
                 "reflect": true
             },
             "placement": {
                 "type": "string",
+                "attribute": "placement",
                 "mutable": true,
                 "complexType": {
                     "original": "TDrawerPlacement",
@@ -368,12 +369,12 @@ export class BqDrawer {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "placement",
                 "reflect": true,
                 "defaultValue": "'right'"
             },
             "position": {
                 "type": "string",
+                "attribute": "position",
                 "mutable": true,
                 "complexType": {
                     "original": "TDrawerPosition",
@@ -394,7 +395,6 @@ export class BqDrawer {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "position",
                 "reflect": true,
                 "defaultValue": "'end'"
             }

package/dist/collection/components/drawer/bq-drawer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"bq-drawer.js","sourceRoot":"","sources":["../../../../../../src/components/drawer/bq-drawer.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Host, Listen, Method, Prop, State, Watch } from '@stencil/core';\n\nimport { DRAWER_PLACEMENT, DRAWER_POSITIONS, TDrawerPlacement, TDrawerPosition } from './bq-drawer.types';\nimport { enter, hasSlotContent, isNil, leave, validatePropValue } from '../../shared/utils';\n\n/*\n The Drawer component provides a sliding panel interface commonly used for navigation or presenting additional content without taking up significant screen space.\n \n @example How to use it\n * ```html\n * <bq-drawer position=\"end\">\n * <div class=\"flex gap-xs\" slot=\"title\">Title</div>\n * <div class=\"...\">\n * Content\n * </div>\n * <div class=\"flex flex-1 justify-center gap-xs\" slot=\"footer\">\n * <bq-button appearance=\"primary\" block=\"\" size=\"small\">Button</bq-button>\n * <bq-button appearance=\"link\" block=\"\" size=\"small\">Button</bq-button>\n * </div>\n * </bq-drawer>\n * ```\n \n @documentation https://www.beeq.design/3d466e231/p/871139-drawer\n * @status stable\n \n @dependency bq-button\n * @dependency bq-icon\n * @dependency bq-divider\n \n @attr {boolean} enable-backdrop - If true, the backdrop overlay will be shown when the drawer opens.\n * @attr {boolean} close-on-click-outside - If true, the drawer will not close when clicking outside the panel.\n * @attr {boolean} close-on-esc - If true, the drawer will not close when the [Esc] key is pressed.\n * @attr {boolean} open - If true, the drawer component will be shown.\n * @attr {\"start\" \| \"end\"} position - Defines the position of the drawer.\n \n @method show - Method to be called to show the drawer component.\n * @method hide - Method to be called to hide the drawer component.\n \n @event bqClose - Callback handler to be called when the drawer is closed.\n * @event bqOpen - Callback handler to be called when the drawer is opened.\n * @event bqAfterOpen - Callback handler to be called after the drawer has been opened.\n * @event bqAfterClose - Callback handler to be called after the drawer has been closed.\n \n @slot title - The title content of the drawer.\n * @slot - The body content of the drawer.\n * @slot footer - The footer content of the drawer.\n * @slot button-close - The close button content of the drawer.\n * @slot footer-divider - The footer divider content of the drawer.\n \n @part backdrop - The `<div>` that holds the backdrop overlay.\n * @part button-close - The BqButton that closes the drawer.\n * @part button-close__btn - The native button used under the hood that closes the drawer.\n * @part button-close__label - The text inside the native button that closes the drawer.\n * @part panel - The `<div>` that holds the drawer entire content.\n * @part header - The `<header>` that holds the icon, title, and close button.\n * @part title - The `<div>` that holds the title content.\n * @part body - The `<main>` that holds the drawer body content.\n * @part footer - The `<footer>` that holds footer content.\n \n @cssprop --bq-drawer--backgroundBackdrop - Background color of the backdrop\n * @cssprop --bq-drawer--gap - Gap between the drawer and the viewport\n * @cssprop --bq-drawer--width - Width of the drawer\n * @cssprop --bq-drawer--paddingX - Padding left and right of the drawer\n * @cssprop --bq-drawer--paddingY - Padding top and bottom of the drawer\n * @cssprop --bq-drawer--zIndex - Z-index of the drawer component\n /\n@Component({\n tag: 'bq-drawer',\n styleUrl: './scss/bq-drawer.scss',\n shadow: true,\n})\nexport class BqDrawer {\n // Own Properties\n // ====================\n\n private footerElem: HTMLElement;\n private drawerElem: HTMLDivElement;\n private OPEN_CSS_CLASS = 'bq-drawer--open';\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el!: HTMLBqDrawerElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n @State() private hasFooter = false;\n @State() hasIcon: boolean = false;\n\n // Public Property API\n // ========================\n\n /* If true, the backdrop overlay will be shown when the drawer opens /\n @Prop({ reflect: true }) enableBackdrop = false;\n\n /* If true, the drawer will not close when clicking outside the panel /\n @Prop({ reflect: true }) closeOnClickOutside = false;\n\n /* If true, the dialog will not close when the [Esc] key is pressed /\n @Prop({ reflect: true }) closeOnEsc = false;\n\n /* If true, the drawer component will be shown /\n @Prop({ reflect: true, mutable: true }) open: boolean;\n\n /* @deprecated Defines the position of the drawer /\n @Prop({ reflect: true, mutable: true }) placement: TDrawerPlacement = 'right';\n\n /* Defines the position of the drawer /\n @Prop({ reflect: true, mutable: true }) position: TDrawerPosition = 'end';\n\n // Prop lifecycle events\n // =======================\n\n @Watch('open')\n async handleOpenChange() {\n if (!this.open) {\n await this.handleAfterHide();\n return;\n }\n\n await this.handleAfterShow();\n }\n\n /\n !TO BE REMOVED: Delete this `@Watch()` once the deprecated `placement` property is removed\n * We need to maintain retro-compatibility with the deprecated `placement` property\n /\n @Watch('placement')\n handlePlacementChange() {\n if (!isNil(this.placement)) {\n console.warn(\n `❗️ [bq-drawer]: the 'placement' prop is deprecated and it will be removed in the future. Please use 'position' instead.`,\n );\n }\n validatePropValue(DRAWER_PLACEMENT, 'right', this.el, 'placement');\n // Sync 'position' property\n const synPositionMap = {\n right: 'end',\n left: 'start',\n };\n this.position = (synPositionMap[this.placement] as TDrawerPosition) \|\| this.position;\n }\n\n @Watch('position')\n handlePositionChange() {\n validatePropValue(DRAWER_POSITIONS, 'start', this.el, 'position');\n /\n Sync 'placement' property\n * !TO BE REMOVED: Delete the code below once the deprecated `placement` property is removed\n /\n const syncPlacementMap = {\n end: 'right',\n start: 'left',\n };\n this.placement = (syncPlacementMap[this.position] as TDrawerPlacement) \|\| this.placement;\n }\n\n // Events section\n // Requires JSDocs for public API documentation\n // ==============================================\n\n /* Callback handler to be called when the drawer is closed /\n @Event() bqClose!: EventEmitter;\n\n /* Callback handler to be called when the drawer is opened /\n @Event() bqOpen!: EventEmitter;\n\n /* Callback handler to be called after the drawer has been opened /\n @Event() bqAfterOpen!: EventEmitter;\n\n /* Callback handler to be called after the drawer has been closed /\n @Event() bqAfterClose!: EventEmitter;\n\n // Component lifecycle events\n // Ordered by their natural call order\n // =====================================\n\n componentWillLoad() {\n this.handlePositionChange();\n // !TO BE REMOVED: Delete this once the deprecated `placement` property is removed\n this.handlePlacementChange();\n }\n\n componentDidLoad() {\n this.handleFooterSlotChange();\n }\n\n // Listeners\n // ==============\n\n @Listen('mousedown', { target: 'window', capture: true })\n async handleMouseClick(event: MouseEvent) {\n if (!this.open) return;\n if (!this.drawerElem \|\| this.closeOnClickOutside) return;\n // Skip if the mouse button is not the main button\n if (event.button !== 0) return;\n\n const rect = this.drawerElem.getBoundingClientRect();\n if (event.clientX < rect.left \|\| event.clientX > rect.right) {\n await this.hide();\n }\n }\n\n @Listen('keydown', { target: 'window', capture: true })\n async handleKeyDown(event: KeyboardEvent) {\n if (!this.open) return;\n if (!this.drawerElem \|\| this.closeOnEsc \|\| !(event.key === 'Escape' \|\| event.key === 'Esc')) return;\n\n await this.hide();\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 /* Method to be called to hide the drawer component /\n @Method()\n async hide(): Promise<void> {\n const ev = this.bqClose.emit();\n if (ev.defaultPrevented) return;\n\n this.open = false;\n }\n\n /* Method to be called to show the drawer component /\n @Method()\n async show(): Promise<void> {\n const ev = this.bqOpen.emit();\n if (ev.defaultPrevented) return;\n\n this.open = true;\n }\n\n // Local methods\n // Internal business logic.\n // These methods cannot be called from the host element.\n // =======================================================\n\n private handleFooterSlotChange = () => {\n this.hasFooter = hasSlotContent(this.footerElem, 'footer');\n };\n\n private handleAfterHide = async () => {\n if (!this.drawerElem) return;\n\n await leave(this.drawerElem);\n this.handleTransitionEnd();\n };\n\n private handleAfterShow = async () => {\n if (!this.drawerElem) return;\n\n this.el.classList.add(this.OPEN_CSS_CLASS);\n await enter(this.drawerElem);\n this.handleTransitionEnd();\n };\n\n private handleTransitionEnd = () => {\n if (this.open) {\n this.bqAfterOpen.emit();\n return;\n }\n\n this.bqAfterClose.emit();\n this.el.classList.remove(this.OPEN_CSS_CLASS);\n };\n\n private get isPositionStart() {\n // !TO BE REMOVED: `placement` is deprecated and will be removed in the future\n return this.position === 'start' \|\| this.placement === 'left';\n }\n\n private get isPositionEnd() {\n // !TO BE REMOVED: `placement` is deprecated and will be removed in the future\n return this.position === 'end' \|\| this.placement === 'right';\n }\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n return (\n <Host>\n {/ BACKDROP /}\n {this.enableBackdrop && (\n <div\n class={{\n 'fixed inset-0 block bg-[--bq-drawer--backgroundBackdrop] opacity-0 transition-opacity duration-300':\n true,\n 'pointer-events-none': !this.open,\n 'opacity-60': this.open,\n }}\n tabIndex={-1}\n part=\"backdrop\"\n />\n )}\n {/ DRAWER PANEL */}\n <div\n class={{\n [`bq-drawer transition-all duration-300 ease-in-out ${this.position \|\| this.placement}`]: true,\n '-start-[--bq-drawer--width]': this.isPositionStart,\n '-end-[--bq-drawer--width]': this.isPositionEnd,\n 'start-0': this.open && this.isPositionStart,\n 'end-0': this.open && this.isPositionEnd,\n }}\n ref={(div) => (this.drawerElem = div)}\n aria-hidden={!this.open ? 'true' : 'false'}\n aria-labelledby=\"bq-drawer__title\"\n aria-modal=\"true\"\n hidden={!this.open}\n part=\"panel\"\n role=\"dialog\"\n >\n <header class=\"flex items-center\" part=\"header\">\n <h2\n class=\"flex-1 items-center justify-between font-bold leading-regular text-primary\"\n id=\"bq-drawer__title\"\n part=\"title\"\n >\n <slot name=\"title\" />\n </h2>\n <div class=\"flex\" part=\"button-close\">\n <bq-button\n class=\"[&::part(button)]:rounded-s [&::part(button)]:border-0 [&::part(button)]:bs-fit [&::part(button)]:p-b-0 [&::part(button)]:p-i-0 [&::part(label)]:inline-flex\"\n appearance=\"text\"\n size=\"small\"\n slot=\"button-close\"\n exportparts=\"button:button-close__btn,label:button-close__label\"\n onClick={this.hide.bind(this)}\n >\n <slot name=\"button-close\">\n <bq-icon name=\"x-bold\" role=\"img\" title=\"Close\" />\n </slot>\n </bq-button>\n </div>\n </header>\n <main class=\"block flex-auto overflow-auto\" part=\"body\">\n <slot />\n </main>\n <footer\n class={{\n block: true,\n '!hidden': !this.hasFooter,\n }}\n ref={(footerElem) => (this.footerElem = footerElem)}\n part=\"footer\"\n >\n <slot name=\"footer-divider\">\n <bq-divider class=\"mb-m block\" dashed />\n </slot>\n <slot name=\"footer\" onSlotchange={this.handleFooterSlotChange} />\n </footer>\n </div>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"bq-drawer.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/components/drawer/bq-drawer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAGvG,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAEvE,OAAO,EAAE,KAAK,EAAE,cAAc,EAAE,KAAK,EAAE,KAAK,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAE5F;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4DG;AAMH,MAAM,OAAO,QAAQ;IACnB,iBAAiB;IACjB,uBAAuB;IAEf,UAAU,CAAc;IACxB,UAAU,CAAiB;IAC3B,cAAc,GAAG,iBAAiB,CAAC;IAE3C,iCAAiC;IACjC,sCAAsC;IAE3B,EAAE,CAAuB;IAEpC,oBAAoB;IACpB,wCAAwC;IACxC,0CAA0C;IAEzB,SAAS,GAAG,KAAK,CAAC;IAC1B,OAAO,GAAY,KAAK,CAAC;IAElC,sBAAsB;IACtB,2BAA2B;IAE3B,wEAAwE;IAC/C,cAAc,GAAG,KAAK,CAAC;IAEhD,yEAAyE;IAChD,mBAAmB,GAAG,KAAK,CAAC;IAErD,uEAAuE;IAC9C,UAAU,GAAG,KAAK,CAAC;IAE5C,kDAAkD;IACV,IAAI,CAAU;IAEtD,qDAAqD;IACb,SAAS,GAAqB,OAAO,CAAC;IAE9E,yCAAyC;IACD,QAAQ,GAAoB,KAAK,CAAC;IAE1E,wBAAwB;IACxB,0BAA0B;IAG1B,KAAK,CAAC,gBAAgB;QACpB,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YACf,MAAM,IAAI,CAAC,eAAe,EAAE,CAAC;YAC7B,OAAO;QACT,CAAC;QAED,MAAM,IAAI,CAAC,eAAe,EAAE,CAAC;IAC/B,CAAC;IAED;;;OAGG;IAEH,qBAAqB;QACnB,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,EAAE,CAAC;YAC3B,OAAO,CAAC,IAAI,CACV,yHAAyH,CAC1H,CAAC;QACJ,CAAC;QACD,iBAAiB,CAAC,gBAAgB,EAAE,OAAO,EAAE,IAAI,CAAC,EAAE,EAAE,WAAW,CAAC,CAAC;QACnE,2BAA2B;QAC3B,MAAM,cAAc,GAAG;YACrB,KAAK,EAAE,KAAK;YACZ,IAAI,EAAE,OAAO;SACd,CAAC;QACF,IAAI,CAAC,QAAQ,GAAI,cAAc,CAAC,IAAI,CAAC,SAAS,CAAqB,IAAI,IAAI,CAAC,QAAQ,CAAC;IACvF,CAAC;IAGD,oBAAoB;QAClB,iBAAiB,CAAC,gBAAgB,EAAE,OAAO,EAAE,IAAI,CAAC,EAAE,EAAE,UAAU,CAAC,CAAC;QAClE;;;WAGG;QACH,MAAM,gBAAgB,GAAG;YACvB,GAAG,EAAE,OAAO;YACZ,KAAK,EAAE,MAAM;SACd,CAAC;QACF,IAAI,CAAC,SAAS,GAAI,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAsB,IAAI,IAAI,CAAC,SAAS,CAAC;IAC3F,CAAC;IAED,iBAAiB;IACjB,+CAA+C;IAC/C,iDAAiD;IAEjD,8DAA8D;IACrD,OAAO,CAAgB;IAEhC,8DAA8D;IACrD,MAAM,CAAgB;IAE/B,qEAAqE;IAC5D,WAAW,CAAgB;IAEpC,qEAAqE;IAC5D,YAAY,CAAgB;IAErC,6BAA6B;IAC7B,sCAAsC;IACtC,wCAAwC;IAExC,iBAAiB;QACf,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAC5B,kFAAkF;QAClF,IAAI,CAAC,qBAAqB,EAAE,CAAC;IAC/B,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,sBAAsB,EAAE,CAAC;IAChC,CAAC;IAED,YAAY;IACZ,iBAAiB;IAGjB,KAAK,CAAC,gBAAgB,CAAC,KAAiB;QACtC,IAAI,CAAC,IAAI,CAAC,IAAI;YAAE,OAAO;QACvB,IAAI,CAAC,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,mBAAmB;YAAE,OAAO;QACzD,kDAAkD;QAClD,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC;YAAE,OAAO;QAE/B,MAAM,IAAI,GAAG,IAAI,CAAC,UAAU,CAAC,qBAAqB,EAAE,CAAC;QACrD,IAAI,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,IAAI,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC;YAC5D,MAAM,IAAI,CAAC,IAAI,EAAE,CAAC;QACpB,CAAC;IACH,CAAC;IAGD,KAAK,CAAC,aAAa,CAAC,KAAoB;QACtC,IAAI,CAAC,IAAI,CAAC,IAAI;YAAE,OAAO;QACvB,IAAI,CAAC,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,UAAU,IAAI,CAAC,CAAC,KAAK,CAAC,GAAG,KAAK,QAAQ,IAAI,KAAK,CAAC,GAAG,KAAK,KAAK,CAAC;YAAE,OAAO;QAEpG,MAAM,IAAI,CAAC,IAAI,EAAE,CAAC;IACpB,CAAC;IAED,qBAAqB;IACrB,iDAAiD;IACjD,wBAAwB;IACxB,gCAAgC;IAChC,gDAAgD;IAChD,kDAAkD;IAElD,uDAAuD;IAEvD,KAAK,CAAC,IAAI;QACR,MAAM,EAAE,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;QAC/B,IAAI,EAAE,CAAC,gBAAgB;YAAE,OAAO;QAEhC,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;IACpB,CAAC;IAED,uDAAuD;IAEvD,KAAK,CAAC,IAAI;QACR,MAAM,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,CAAC;QAC9B,IAAI,EAAE,CAAC,gBAAgB;YAAE,OAAO;QAEhC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;IACnB,CAAC;IAED,gBAAgB;IAChB,2BAA2B;IAC3B,wDAAwD;IACxD,0DAA0D;IAElD,sBAAsB,GAAG,GAAG,EAAE;QACpC,IAAI,CAAC,SAAS,GAAG,cAAc,CAAC,IAAI,CAAC,UAAU,EAAE,QAAQ,CAAC,CAAC;IAC7D,CAAC,CAAC;IAEM,eAAe,GAAG,KAAK,IAAI,EAAE;QACnC,IAAI,CAAC,IAAI,CAAC,UAAU;YAAE,OAAO;QAE7B,MAAM,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAC7B,IAAI,CAAC,mBAAmB,EAAE,CAAC;IAC7B,CAAC,CAAC;IAEM,eAAe,GAAG,KAAK,IAAI,EAAE;QACnC,IAAI,CAAC,IAAI,CAAC,UAAU;YAAE,OAAO;QAE7B,IAAI,CAAC,EAAE,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QAC3C,MAAM,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAC7B,IAAI,CAAC,mBAAmB,EAAE,CAAC;IAC7B,CAAC,CAAC;IAEM,mBAAmB,GAAG,GAAG,EAAE;QACjC,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACd,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC;YACxB,OAAO;QACT,CAAC;QAED,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAC;QACzB,IAAI,CAAC,EAAE,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;IAChD,CAAC,CAAC;IAEF,IAAY,eAAe;QACzB,8EAA8E;QAC9E,OAAO,IAAI,CAAC,QAAQ,KAAK,OAAO,IAAI,IAAI,CAAC,SAAS,KAAK,MAAM,CAAC;IAChE,CAAC;IAED,IAAY,aAAa;QACvB,8EAA8E;QAC9E,OAAO,IAAI,CAAC,QAAQ,KAAK,KAAK,IAAI,IAAI,CAAC,SAAS,KAAK,OAAO,CAAC;IAC/D,CAAC;IAED,oBAAoB;IACpB,oCAAoC;IACpC,sCAAsC;IAEtC,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YAEF,IAAI,CAAC,cAAc,IAAI,CACtB,4DACE,KAAK,EAAE;oBACL,oGAAoG,EAClG,IAAI;oBACN,qBAAqB,EAAE,CAAC,IAAI,CAAC,IAAI;oBACjC,YAAY,EAAE,IAAI,CAAC,IAAI;iBACxB,EACD,QAAQ,EAAE,CAAC,CAAC,EACZ,IAAI,EAAC,UAAU,GACf,CACH;YAED,4DACE,KAAK,EAAE;oBACL,CAAC,qDAAqD,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC,EAAE,IAAI;oBAC9F,6BAA6B,EAAE,IAAI,CAAC,eAAe;oBACnD,2BAA2B,EAAE,IAAI,CAAC,aAAa;oBAC/C,SAAS,EAAE,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,eAAe;oBAC5C,OAAO,EAAE,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,aAAa;iBACzC,EACD,GAAG,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,GAAG,CAAC,iBACxB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,qBAC1B,kBAAkB,gBACvB,MAAM,EACjB,MAAM,EAAE,CAAC,IAAI,CAAC,IAAI,EAClB,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,QAAQ;gBAEb,+DAAQ,KAAK,EAAC,mBAAmB,EAAC,IAAI,EAAC,QAAQ;oBAC7C,2DACE,KAAK,EAAC,4EAA4E,EAClF,EAAE,EAAC,kBAAkB,EACrB,IAAI,EAAC,OAAO;wBAEZ,6DAAM,IAAI,EAAC,OAAO,GAAG,CAClB;oBACL,4DAAK,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,cAAc;wBACnC,kEACE,KAAK,EAAC,8JAA8J,EACpK,UAAU,EAAC,MAAM,EACjB,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,cAAc,EACnB,WAAW,EAAC,oDAAoD,EAChE,OAAO,EAAE,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;4BAE7B,6DAAM,IAAI,EAAC,cAAc;gCACvB,gEAAS,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,KAAK,EAAC,KAAK,EAAC,OAAO,GAAG,CAC7C,CACG,CACR,CACC;gBACT,6DAAM,KAAK,EAAC,+BAA+B,EAAC,IAAI,EAAC,MAAM;oBACrD,8DAAQ,CACH;gBACP,+DACE,KAAK,EAAE;wBACL,KAAK,EAAE,IAAI;wBACX,SAAS,EAAE,CAAC,IAAI,CAAC,SAAS;qBAC3B,EACD,GAAG,EAAE,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,UAAU,CAAC,EACnD,IAAI,EAAC,QAAQ;oBAEb,6DAAM,IAAI,EAAC,gBAAgB;wBACzB,mEAAY,KAAK,EAAC,YAAY,EAAC,MAAM,SAAG,CACnC;oBACP,6DAAM,IAAI,EAAC,QAAQ,EAAC,YAAY,EAAE,IAAI,CAAC,sBAAsB,GAAI,CAC1D,CACL,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, Event, h, Host, Listen, Method, Prop, State, Watch } from '@stencil/core';\nimport type { EventEmitter } from '@stencil/core';\n\nimport { DRAWER_PLACEMENT, DRAWER_POSITIONS } from './bq-drawer.types';\nimport type { TDrawerPlacement, TDrawerPosition } from './bq-drawer.types';\nimport { enter, hasSlotContent, isNil, leave, validatePropValue } from '../../shared/utils';\n\n/*\n The Drawer component provides a sliding panel interface commonly used for navigation or presenting additional content without taking up significant screen space.\n \n @example How to use it\n * ```html\n * <bq-drawer position=\"end\">\n * <div class=\"flex gap-xs\" slot=\"title\">Title</div>\n * <div class=\"...\">\n * Content\n * </div>\n * <div class=\"flex flex-1 justify-center gap-xs\" slot=\"footer\">\n * <bq-button appearance=\"primary\" block=\"\" size=\"small\">Button</bq-button>\n * <bq-button appearance=\"link\" block=\"\" size=\"small\">Button</bq-button>\n * </div>\n * </bq-drawer>\n * ```\n \n @documentation https://www.beeq.design/3d466e231/p/871139-drawer\n * @status stable\n \n @dependency bq-button\n * @dependency bq-icon\n * @dependency bq-divider\n \n @attr {boolean} enable-backdrop - If true, the backdrop overlay will be shown when the drawer opens.\n * @attr {boolean} close-on-click-outside - If true, the drawer will not close when clicking outside the panel.\n * @attr {boolean} close-on-esc - If true, the drawer will not close when the [Esc] key is pressed.\n * @attr {boolean} open - If true, the drawer component will be shown.\n * @attr {\"start\" \| \"end\"} position - Defines the position of the drawer.\n \n @method show - Method to be called to show the drawer component.\n * @method hide - Method to be called to hide the drawer component.\n \n @event bqClose - Callback handler to be called when the drawer is closed.\n * @event bqOpen - Callback handler to be called when the drawer is opened.\n * @event bqAfterOpen - Callback handler to be called after the drawer has been opened.\n * @event bqAfterClose - Callback handler to be called after the drawer has been closed.\n \n @slot title - The title content of the drawer.\n * @slot - The body content of the drawer.\n * @slot footer - The footer content of the drawer.\n * @slot button-close - The close button content of the drawer.\n * @slot footer-divider - The footer divider content of the drawer.\n \n @part backdrop - The `<div>` that holds the backdrop overlay.\n * @part button-close - The BqButton that closes the drawer.\n * @part button-close__btn - The native button used under the hood that closes the drawer.\n * @part button-close__label - The text inside the native button that closes the drawer.\n * @part panel - The `<div>` that holds the drawer entire content.\n * @part header - The `<header>` that holds the icon, title, and close button.\n * @part title - The `<div>` that holds the title content.\n * @part body - The `<main>` that holds the drawer body content.\n * @part footer - The `<footer>` that holds footer content.\n \n @cssprop --bq-drawer--backgroundBackdrop - Background color of the backdrop\n * @cssprop --bq-drawer--gap - Gap between the drawer and the viewport\n * @cssprop --bq-drawer--width - Width of the drawer\n * @cssprop --bq-drawer--paddingX - Padding left and right of the drawer\n * @cssprop --bq-drawer--paddingY - Padding top and bottom of the drawer\n * @cssprop --bq-drawer--zIndex - Z-index of the drawer component\n /\n@Component({\n tag: 'bq-drawer',\n styleUrl: './scss/bq-drawer.scss',\n shadow: true,\n})\nexport class BqDrawer {\n // Own Properties\n // ====================\n\n private footerElem: HTMLElement;\n private drawerElem: HTMLDivElement;\n private OPEN_CSS_CLASS = 'bq-drawer--open';\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el!: HTMLBqDrawerElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n @State() private hasFooter = false;\n @State() hasIcon: boolean = false;\n\n // Public Property API\n // ========================\n\n /* If true, the backdrop overlay will be shown when the drawer opens /\n @Prop({ reflect: true }) enableBackdrop = false;\n\n /* If true, the drawer will not close when clicking outside the panel /\n @Prop({ reflect: true }) closeOnClickOutside = false;\n\n /* If true, the dialog will not close when the [Esc] key is pressed /\n @Prop({ reflect: true }) closeOnEsc = false;\n\n /* If true, the drawer component will be shown /\n @Prop({ reflect: true, mutable: true }) open: boolean;\n\n /* @deprecated Defines the position of the drawer /\n @Prop({ reflect: true, mutable: true }) placement: TDrawerPlacement = 'right';\n\n /* Defines the position of the drawer /\n @Prop({ reflect: true, mutable: true }) position: TDrawerPosition = 'end';\n\n // Prop lifecycle events\n // =======================\n\n @Watch('open')\n async handleOpenChange() {\n if (!this.open) {\n await this.handleAfterHide();\n return;\n }\n\n await this.handleAfterShow();\n }\n\n /\n !TO BE REMOVED: Delete this `@Watch()` once the deprecated `placement` property is removed\n * We need to maintain retro-compatibility with the deprecated `placement` property\n /\n @Watch('placement')\n handlePlacementChange() {\n if (!isNil(this.placement)) {\n console.warn(\n `❗️ [bq-drawer]: the 'placement' prop is deprecated and it will be removed in the future. Please use 'position' instead.`,\n );\n }\n validatePropValue(DRAWER_PLACEMENT, 'right', this.el, 'placement');\n // Sync 'position' property\n const synPositionMap = {\n right: 'end',\n left: 'start',\n };\n this.position = (synPositionMap[this.placement] as TDrawerPosition) \|\| this.position;\n }\n\n @Watch('position')\n handlePositionChange() {\n validatePropValue(DRAWER_POSITIONS, 'start', this.el, 'position');\n /\n Sync 'placement' property\n * !TO BE REMOVED: Delete the code below once the deprecated `placement` property is removed\n /\n const syncPlacementMap = {\n end: 'right',\n start: 'left',\n };\n this.placement = (syncPlacementMap[this.position] as TDrawerPlacement) \|\| this.placement;\n }\n\n // Events section\n // Requires JSDocs for public API documentation\n // ==============================================\n\n /* Callback handler to be called when the drawer is closed /\n @Event() bqClose!: EventEmitter;\n\n /* Callback handler to be called when the drawer is opened /\n @Event() bqOpen!: EventEmitter;\n\n /* Callback handler to be called after the drawer has been opened /\n @Event() bqAfterOpen!: EventEmitter;\n\n /* Callback handler to be called after the drawer has been closed /\n @Event() bqAfterClose!: EventEmitter;\n\n // Component lifecycle events\n // Ordered by their natural call order\n // =====================================\n\n componentWillLoad() {\n this.handlePositionChange();\n // !TO BE REMOVED: Delete this once the deprecated `placement` property is removed\n this.handlePlacementChange();\n }\n\n componentDidLoad() {\n this.handleFooterSlotChange();\n }\n\n // Listeners\n // ==============\n\n @Listen('mousedown', { target: 'window', capture: true })\n async handleMouseClick(event: MouseEvent) {\n if (!this.open) return;\n if (!this.drawerElem \|\| this.closeOnClickOutside) return;\n // Skip if the mouse button is not the main button\n if (event.button !== 0) return;\n\n const rect = this.drawerElem.getBoundingClientRect();\n if (event.clientX < rect.left \|\| event.clientX > rect.right) {\n await this.hide();\n }\n }\n\n @Listen('keydown', { target: 'window', capture: true })\n async handleKeyDown(event: KeyboardEvent) {\n if (!this.open) return;\n if (!this.drawerElem \|\| this.closeOnEsc \|\| !(event.key === 'Escape' \|\| event.key === 'Esc')) return;\n\n await this.hide();\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 /* Method to be called to hide the drawer component /\n @Method()\n async hide(): Promise<void> {\n const ev = this.bqClose.emit();\n if (ev.defaultPrevented) return;\n\n this.open = false;\n }\n\n /* Method to be called to show the drawer component /\n @Method()\n async show(): Promise<void> {\n const ev = this.bqOpen.emit();\n if (ev.defaultPrevented) return;\n\n this.open = true;\n }\n\n // Local methods\n // Internal business logic.\n // These methods cannot be called from the host element.\n // =======================================================\n\n private handleFooterSlotChange = () => {\n this.hasFooter = hasSlotContent(this.footerElem, 'footer');\n };\n\n private handleAfterHide = async () => {\n if (!this.drawerElem) return;\n\n await leave(this.drawerElem);\n this.handleTransitionEnd();\n };\n\n private handleAfterShow = async () => {\n if (!this.drawerElem) return;\n\n this.el.classList.add(this.OPEN_CSS_CLASS);\n await enter(this.drawerElem);\n this.handleTransitionEnd();\n };\n\n private handleTransitionEnd = () => {\n if (this.open) {\n this.bqAfterOpen.emit();\n return;\n }\n\n this.bqAfterClose.emit();\n this.el.classList.remove(this.OPEN_CSS_CLASS);\n };\n\n private get isPositionStart() {\n // !TO BE REMOVED: `placement` is deprecated and will be removed in the future\n return this.position === 'start' \|\| this.placement === 'left';\n }\n\n private get isPositionEnd() {\n // !TO BE REMOVED: `placement` is deprecated and will be removed in the future\n return this.position === 'end' \|\| this.placement === 'right';\n }\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n return (\n <Host>\n {/ BACKDROP /}\n {this.enableBackdrop && (\n <div\n class={{\n 'fixed inset-0 block bg-[--bq-drawer--backgroundBackdrop] opacity-0 transition-opacity duration-300':\n true,\n 'pointer-events-none': !this.open,\n 'opacity-60': this.open,\n }}\n tabIndex={-1}\n part=\"backdrop\"\n />\n )}\n {/ DRAWER PANEL */}\n <div\n class={{\n [`bq-drawer transition-all duration-300 ease-in-out ${this.position \|\| this.placement}`]: true,\n '-start-[--bq-drawer--width]': this.isPositionStart,\n '-end-[--bq-drawer--width]': this.isPositionEnd,\n 'start-0': this.open && this.isPositionStart,\n 'end-0': this.open && this.isPositionEnd,\n }}\n ref={(div) => (this.drawerElem = div)}\n aria-hidden={!this.open ? 'true' : 'false'}\n aria-labelledby=\"bq-drawer__title\"\n aria-modal=\"true\"\n hidden={!this.open}\n part=\"panel\"\n role=\"dialog\"\n >\n <header class=\"flex items-center\" part=\"header\">\n <h2\n class=\"flex-1 items-center justify-between font-bold leading-regular text-primary\"\n id=\"bq-drawer__title\"\n part=\"title\"\n >\n <slot name=\"title\" />\n </h2>\n <div class=\"flex\" part=\"button-close\">\n <bq-button\n class=\"[&::part(button)]:rounded-s [&::part(button)]:border-0 [&::part(button)]:bs-fit [&::part(button)]:p-b-0 [&::part(button)]:p-i-0 [&::part(label)]:inline-flex\"\n appearance=\"text\"\n size=\"small\"\n slot=\"button-close\"\n exportparts=\"button:button-close__btn,label:button-close__label\"\n onClick={this.hide.bind(this)}\n >\n <slot name=\"button-close\">\n <bq-icon name=\"x-bold\" role=\"img\" title=\"Close\" />\n </slot>\n </bq-button>\n </div>\n </header>\n <main class=\"block flex-auto overflow-auto\" part=\"body\">\n <slot />\n </main>\n <footer\n class={{\n block: true,\n '!hidden': !this.hasFooter,\n }}\n ref={(footerElem) => (this.footerElem = footerElem)}\n part=\"footer\"\n >\n <slot name=\"footer-divider\">\n <bq-divider class=\"mb-m block\" dashed />\n </slot>\n <slot name=\"footer\" onSlotchange={this.handleFooterSlotChange} />\n </footer>\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/drawer/bq-drawer.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"bq-drawer.types.js","sourceRoot":"","sources":["../../../../../../src/components/drawer/bq-drawer.types.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,OAAO,EAAE,KAAK,CAAU,CAAC;AAE1D,iFAAiF;AACjF,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,MAAM,EAAE,OAAO,CAAU,CAAC","sourcesContent":["export const DRAWER_POSITIONS = ['start', 'end'] as const;\nexport type TDrawerPosition = (typeof DRAWER_POSITIONS)[number];\n// !TO BE REMOVED: `placement` is deprecated and it will be removed in the future\nexport const DRAWER_PLACEMENT = ['left', 'right'] as const;\nexport type TDrawerPlacement = (typeof DRAWER_PLACEMENT)[number];\n"]}
1	+ {"version":3,"file":"bq-drawer.types.js","sourceRoot":"","sources":["../../../../../../packages/beeq/src/components/drawer/bq-drawer.types.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,OAAO,EAAE,KAAK,CAAU,CAAC;AAE1D,iFAAiF;AACjF,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,MAAM,EAAE,OAAO,CAAU,CAAC","sourcesContent":["export const DRAWER_POSITIONS = ['start', 'end'] as const;\nexport type TDrawerPosition = (typeof DRAWER_POSITIONS)[number];\n// !TO BE REMOVED: `placement` is deprecated and it will be removed in the future\nexport const DRAWER_PLACEMENT = ['left', 'right'] as const;\nexport type TDrawerPlacement = (typeof DRAWER_PLACEMENT)[number];\n"]}