@beeq/core 1.12.0 → 1.12.2-beta.0

package/dist/beeq/p-D1A0LpG_.js

@@ -2,5 +2,14 @@
  * Built by Endavans
  * © https://beeq.design - Apache 2 License.
  */
-const o=(o,e)=>o instanceof Node&&o.nodeName.toLowerCase()===e.toLowerCase();export{o as i};
+/**
+ * Check if value is the HTMLElement defined by tag
+ * @param target the value to be check
+ * @param tag valid HTMLElement
+ * @returns {boolean} true if the target nodeName is the tag
+ */
+const isHTMLElement = (o, e) => o instanceof Node && o.nodeName.toLowerCase() === e.toLowerCase();
+
+export { isHTMLElement as i };
+//# sourceMappingURL=p-D1A0LpG_.js.map
 //# sourceMappingURL=p-D1A0LpG_.js.map

package/dist/beeq/p-DdvbF5yL.js

@@ -2,5 +2,123 @@
  * Built by Endavans
  * © https://beeq.design - Apache 2 License.
  */
-const t=async(t,n=null)=>{t.classList.remove("hidden");await a("enter",t,n)};const n=async(t,n=null)=>{await a("leave",t,n);t.classList.add("hidden")};const s=async(s,a=null)=>{if(s.classList.contains("hidden")){await t(s,a)}else{await n(s,a)}};const a=async(t,n,s)=>{const{dataset:a}=n;const d=s?`${s}-${t}`:t;const l=`transition${t.charAt(0).toUpperCase()+t.slice(1)}`;const w=e(a,l,d);const $=e(a,`${l}Start`,`${d}-start`);const m=e(a,`${l}End`,`${d}-end`);o(n,w);o(n,$);await i();c(n,$);o(n,m);await r(n);c(n,m);c(n,w)};const e=(t,n,s)=>t[n]?t[n].split(" "):[s];const o=(t,n)=>{t.classList.add(...n)};const c=(t,n)=>{t.classList.remove(...n)};const i=()=>new Promise((t=>{requestAnimationFrame((()=>{requestAnimationFrame((()=>t()))}))}));const r=t=>Promise.all(t.getAnimations().map((t=>t.finished)));export{t as e,n as l,s as t};
+/* -------------------------------------------------------------------------- */
+/*            Credits to MikeMcCall for the original implementation           */
+/*            Github: https://github.com/mmccall10/el-transition              */
+/* -------------------------------------------------------------------------- */
+/**
+ * Transition an element entry
+ *
+ * @param element The element to enter
+ * @param transitionName The name of the transition
+ * @returns A promise that resolves when the transition is complete
+ */
+const enter = async (t, n = null) => {
+  t.classList.remove("hidden");
+  await transition("enter", t, n);
+};
+
+/**
+ * Transition an element exit
+ *
+ * @param element The element to leave
+ * @param transitionName The name of the transition
+ * @returns A promise that resolves when the transition is complete
+ */ const leave = async (t, n = null) => {
+  await transition("leave", t, n);
+  t.classList.add("hidden");
+};
+
+/**
+ * Toggle an element entry/exit
+ *
+ * @param element The element to toggle
+ * @param transitionName The name of the transition
+ * @returns A promise that resolves when the transition is complete
+ */ const toggle = async (t, n = null) => {
+  if (t.classList.contains("hidden")) {
+    await enter(t, n);
+  } else {
+    await leave(t, n);
+  }
+};
+
+/**
+ * Perform a transition on an element
+ *
+ * @param direction The direction of the transition
+ * @param element The element to transition
+ * @param animation The animation to use
+ * @returns A promise that resolves when the transition is complete
+ * @internal
+ */ const transition = async (t, n, s) => {
+  const {dataset: a} = n;
+  const e = s ? `${s}-${t}` : t;
+  const o = `transition${t.charAt(0).toUpperCase() + t.slice(1)}`;
+  // Get the genesis, start, and end classes
+    const c = getDatasetValueOrDefault(a, o, e);
+  const i = getDatasetValueOrDefault(a, `${o}Start`, `${e}-start`);
+  const r = getDatasetValueOrDefault(a, `${o}End`, `${e}-end`);
+  // Add genesis and start classes, then wait for the next frame
+    addClasses(n, c);
+  addClasses(n, i);
+  await nextFrame();
+  // Replace start classes with end classes, then wait for the transition to finish
+    removeClasses(n, i);
+  addClasses(n, r);
+  await afterTransition(n);
+  // Remove end and genesis classes
+    removeClasses(n, r);
+  removeClasses(n, c);
+};
+
+/**
+ * Get the value of a dataset key or a default value
+ *
+ * @param dataset The dataset to get the value from
+ * @param key The key to get the value for
+ * @param defaultValue The default value to return if the key is not found
+ * @returns The value of the dataset key or the default value
+ * @internal
+ */ const getDatasetValueOrDefault = (t, n, s) => t[n] ? t[n].split(" ") : [ s ];
+
+/**
+ * Add classes to an element
+ *
+ * @param element The element to add the CSS classes to
+ * @param classes The classes to add
+ * @internal
+ */ const addClasses = (t, n) => {
+  t.classList.add(...n);
+};
+
+/**
+ * Remove classes from an element
+ *
+ * @param element The element to remove the CSS classes from
+ * @param classes The classes to remove
+ * @internal
+ */ const removeClasses = (t, n) => {
+  t.classList.remove(...n);
+};
+
+/**
+ * Wait for the next frame
+ * @returns A promise that resolves when the next frame is available
+ * @internal
+ */ const nextFrame = () => new Promise((t => {
+  requestAnimationFrame((() => {
+    requestAnimationFrame((() => t()));
+  }));
+}));
+
+/**
+ * Wait for all animations to finish
+ * @param element The element to wait for
+ * @returns A promise that resolves when all animations are finished
+ * @internal
+ */ const afterTransition = t => Promise.all(t.getAnimations().map((t => t.finished)));
+
+export { enter as e, leave as l, toggle as t };
+//# sourceMappingURL=p-DdvbF5yL.js.map
 //# sourceMappingURL=p-DdvbF5yL.js.map

package/dist/beeq/p-DnkZCdMA.js

@@ -2,5 +2,12 @@
  * Built by Endavans
  * © https://beeq.design - Apache 2 License.
  */
-const a=["small","medium","large"];const s=["horizontal","vertical"];const t=["start","end"];export{a as T,s as a,t as b};
+const a = [ "small", "medium", "large" ];
+
+const s = [ "horizontal", "vertical" ];
+
+const t = [ "start", "end" ];
+
+export { a as T, s as a, t as b };
+//# sourceMappingURL=p-DnkZCdMA.js.map
 //# sourceMappingURL=p-DnkZCdMA.js.map

package/dist/beeq/p-Ds7rcaFH.js

@@ -2,5 +2,69 @@
  * Built by Endavans
  * © https://beeq.design - Apache 2 License.
  */
-import{i as t}from"./p-B4sM1t6Z.js";let n;const s="data-beeq";const r="svg";const c=t=>{n=t};const o=(t="")=>{if(!n){const t=e();const n=t?.getAttribute(s);const o=u();const a=o?`${i(o)}/${r}`:"";c(n||a)}const o=t?`/${t.replace(/^\//,"")}`:"";return n.replace(/\/$/,"")+o};const e=()=>{if(!t())return null;return document.querySelector(`script[${s}]`)};const u=()=>{if(!t())return null;return document.querySelector(`script[src*="beeq"]`)};const i=n=>{if(!t())return"";const s=n.getAttribute("src");return s?s.substring(0,s.lastIndexOf("/")):""};export{o as g,c as s};
+import { i as t } from "./p-B4sM1t6Z.js";
+
+/**
+ * Inspired by Shoelace's `getBasePath` and `setBasePath` functions.
+ * https://github.com/shoelace-style/shoelace/blob/next/src/utilities/base-path.ts
+ */ let n;
+
+const s = "data-beeq";
+
+const r = "svg";
+
+/**
+ * Sets the base path for the assets.
+ * @param {string} path - The base path to set.
+ */ const setBasePath = t => {
+  n = t;
+};
+
+/**
+ * Gets the base path for the assets.
+ * @param {string} subpath - An optional subpath to append to the base path.
+ * @returns {string} The base path of the assets.
+ */ const getBasePath = (t = "") => {
+  if (!n) {
+    const t = findConfigScript();
+    // Get the path from the config script that uses the data-beeq attribute
+        const n = t?.getAttribute(s);
+    const c = findFallbackScript();
+    // If no data-beeq attribute is found, use the script path
+        const o = c ? `${getScriptPath(c)}/${r}` : "";
+    setBasePath(n || o);
+  }
+  // Return the base path without a trailing slash. If one exists, append the subpath separated by a slash.
+    const c = t ? `/${t.replace(/^\//, "")}` : "";
+  return n.replace(/\/$/, "") + c;
+};
+
+/**
+ * Finds the configuration script element.
+ * @returns The configuration script element or null if not found.
+ */ const findConfigScript = () => {
+  if (!t()) return null;
+  return document.querySelector(`script[${s}]`);
+};
+
+/**
+ * Finds the fallback script element.
+ * @returns The fallback script element or null if not found.
+ */ const findFallbackScript = () => {
+  if (!t()) return null;
+  return document.querySelector(`script[src*="beeq"]`);
+};
+
+/**
+ * Gets the path of a script element.
+ * @param {HTMLScriptElement} script - The script element.
+ * @returns The path of the script element.
+ */ const getScriptPath = n => {
+  if (!t()) return "";
+  const s = n.getAttribute("src");
+  return s ? s.substring(0, s.lastIndexOf("/")) : "";
+};
+
+export { getBasePath as g, setBasePath as s };
+//# sourceMappingURL=p-Ds7rcaFH.js.map
 //# sourceMappingURL=p-Ds7rcaFH.js.map

package/dist/beeq/p-Dx-CEPSQ.js

@@ -2,5 +2,17 @@
  * Built by Endavans
  * © https://beeq.design - Apache 2 License.
  */
-const t=(t,n)=>{const o=t.composedPath();return o.includes(n)};export{t as i};
+/**
+ * Check if the event target is a child of the host element
+ * @param event - The event to check
+ * @param hostElement - The host element to check against
+ * @returns True if the event target is a child of the host element
+ */
+const isEventTargetChildOfElement = (t, n) => {
+  const o = t.composedPath();
+  return o.includes(n);
+};
+
+export { isEventTargetChildOfElement as i };
+//# sourceMappingURL=p-Dx-CEPSQ.js.map
 //# sourceMappingURL=p-Dx-CEPSQ.js.map

package/dist/beeq/p-_RvVpeh2.js

@@ -2,5 +2,33 @@
  * Built by Endavans
  * © https://beeq.design - Apache 2 License.
  */
-import{i as t}from"./p-B4sM1t6Z.js";const n="--bq-";function e(e){if(!t)return undefined;const r=`${n}${e}`;const o=getComputedStyle(document.documentElement).getPropertyValue(r);if(!o)return undefined;return`var(${r})`}function r(t,n){const e=getComputedStyle(n);return String(e.getPropertyValue(`--${t}`)).trim()}export{r as a,e as g};
+import { i as e } from "./p-B4sM1t6Z.js";
+
+const t = "--bq-";
+
+/**
+ * Get CSS custom property variable of a given color string value
+ *
+ * @param {string} colorName - Valid string value.
+ * @return {string} The corresponding CSS custom property variable
+ */ function getColorCSSVariable(r) {
+  if (!e) return undefined;
+  const n = `${t}${r}`;
+  const o = getComputedStyle(document.documentElement).getPropertyValue(n);
+  if (!o) return undefined;
+  return `var(${n})`;
+}
+
+/**
+ * Get compiled CSS custom property value
+ *
+ * @param {string} variable - The variable name for which to get its value
+ * @return {string} The corresponding value for the given CSS custom property
+ */ function getCSSVariableValue(e, t) {
+  const r = getComputedStyle(t);
+  return String(r.getPropertyValue(`--${e}`)).trim();
+}
+
+export { getCSSVariableValue as a, getColorCSSVariable as g };
+//# sourceMappingURL=p-_RvVpeh2.js.map
 //# sourceMappingURL=p-_RvVpeh2.js.map

package/dist/beeq/p-ac7cd72b.entry.js

@@ -0,0 +1,322 @@
+/*!
+ * Built by Endavans
+ * © https://beeq.design - Apache 2 License.
+ */
+import { r as a, c as r, g as e, a as t } from "./p-D0hQxkOP.js";
+
+import { a as n, j as b } from "./p-C33fRBEf.js";
+
+import { i } from "./p-B4sM1t6Z.js";
+
+import { d as o } from "./p-CVw85-WU.js";
+
+import { v as q } from "./p-zh4P02Kn.js";
+
+import { b as s } from "./p-uqkxeAeG.js";
+
+import { l as c, e as l } from "./p-DdvbF5yL.js";
+
+import "./p-BcPwGxIn.js";
+
+const d = [ "error", "info", "neutral", "success", "warning" ];
+
+const bqNotificationCss = () => `.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-notification,.shadow-\\[shadow\\:--bq-notification--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{text-size-adjust:none;font-family:var(--bq-font-family);font-size:var(--bq-font-size--m)}html:focus-within{scroll-behavior:smooth}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bq-background--primary);color:var(--bq-text--primary);line-height:var(--bq-font-line-height--regular);min-height:100vb;text-rendering:optimizeSpeed}a:not([class]){text-decoration-skip-ink:auto}canvas,img,picture,svg,video{display:block;max-width:100%}button,input,select,textarea{font:inherit}h1,h2,h3,h4,h5,h6,p{overflow-wrap:break-word}@media (prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto;transition-duration:.01ms!important}}:where(:root){--bq-white:#fff;--bq-black:#060708;--bq-neutral-50:var(--bq-grey-50);--bq-neutral-100:var(--bq-grey-100);--bq-neutral-200:var(--bq-grey-200);--bq-neutral-300:var(--bq-grey-300);--bq-neutral-400:var(--bq-grey-400);--bq-neutral-500:var(--bq-grey-500);--bq-neutral-600:var(--bq-grey-600);--bq-neutral-700:var(--bq-grey-700);--bq-neutral-800:var(--bq-grey-800);--bq-neutral-900:var(--bq-grey-900);--bq-neutral-950:var(--bq-grey-950);--bq-neutral-1000:var(--bq-grey-1000);--bq-brand-light:var(--bq-iris-100);--bq-brand:var(--bq-iris-600);--bq-brand-dark:var(--bq-iris-1000);--bq-accent-light:var(--bq-purple-100);--bq-accent:var(--bq-purple-600);--bq-accent-dark:var(--bq-purple-1000);--bq-success-light:var(--bq-teal-100);--bq-success:var(--bq-teal-600);--bq-success-dark:var(--bq-teal-1000);--bq-danger-light:var(--bq-red-100);--bq-danger:var(--bq-red-600);--bq-danger-dark:var(--bq-red-1000);--bq-warning-light:var(--bq-gold-100);--bq-warning:var(--bq-gold-600);--bq-warning-dark:var(--bq-gold-1000);--bq-info-light:var(--bq-iris-100);--bq-info:var(--bq-iris-600);--bq-info-dark:var(--bq-iris-1000);--bq-focus:var(--bq-iris-600);--bq-data-01:var(--bq-brand);--bq-data-02:var(--bq-purple-600);--bq-data-03:var(--bq-magenta-600);--bq-data-04:var(--bq-cyan-600);--bq-data-05:var(--bq-teal-600);--bq-data-06:var(--bq-orange-600);--bq-data-07:var(--bq-yellow-600);--bq-data-08:var(--bq-red-600);--bq-data-09:var(--bq-blue-600);--bq-data-10:var(--bq-grey-600);--bq-data-11:var(--bq-black);--bq-data-12:var(--bq-white);--bq-radius--none:0;--bq-radius--xs2:0.125rem;--bq-radius--xs:0.25rem;--bq-radius--s:0.5rem;--bq-radius--m:0.75rem;--bq-radius--l:1.5rem;--bq-radius--full:9999px;--bq-box-shadow--xs:0 2px 0 rgba(0,0,0,.016);--bq-box-shadow--s:0 8px 24px rgba(0,0,0,.04);--bq-box-shadow--m:0 10px 48px -16px rgba(0,0,0,.12);--bq-box-shadow--l:0 20px 58px -16px rgba(0,0,0,.16);--bq-font-family:"Outfit",sans-serif;--bq-font-size--xs:0.75rem;--bq-font-size--s:0.875rem;--bq-font-size--m:1rem;--bq-font-size--l:1.125rem;--bq-font-size--xl:1.5rem;--bq-font-size--xxl:2rem;--bq-font-size--xxl2:2.5rem;--bq-font-size--xxl3:3rem;--bq-font-size--xxl4:3.5rem;--bq-font-size--xxl5:4rem;--bq-font-weight--thin:100;--bq-font-weight--light:300;--bq-font-weight--regular:400;--bq-font-weight--medium:500;--bq-font-weight--semibold:600;--bq-font-weight--bold:700;--bq-font-line-height--small:1.2;--bq-font-line-height--regular:1.5;--bq-font-line-height--large:1.5;--bq-spacing-xs3:0.125rem;--bq-spacing-xs2:0.25rem;--bq-spacing-xs:0.5rem;--bq-spacing-s:0.75rem;--bq-spacing-m:1rem;--bq-spacing-l:1.5rem;--bq-spacing-xl:2rem;--bq-spacing-xxl:2.5rem;--bq-spacing-xxl2:3.5rem;--bq-spacing-xxl3:4rem;--bq-spacing-xxl4:4.5rem;--bq-stroke-s:1px;--bq-stroke-m:2px;--bq-stroke-l:3px}.beeq:not([bq-mode]),.light,:root:not([bq-theme]):not([bq-mode]),:root[bq-theme=beeq]:not([bq-mode]),[bq-mode=light]{--bq-background--primary:var(--bq-white);--bq-background--secondary:var(--bq-neutral-100);--bq-background--tertiary:var(--bq-neutral-200);--bq-background--alt:var(--bq-neutral-300);--bq-background--inverse:var(--bq-neutral-900);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-800);--bq-icon--alt:var(--bq-white);--bq-icon--secondary:var(--bq-neutral-600);--bq-icon--inverse:var(--bq-neutral-50);--bq-icon--brand:var(--bq-brand);--bq-icon--info:var(--bq-brand);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-200);--bq-stroke--secondary:var(--bq-neutral-600);--bq-stroke--tertiary:var(--bq-neutral-900);--bq-stroke--inverse:var(--bq-white);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-50);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-brand);--bq-text--primary:var(--bq-neutral-800);--bq-text--secondary:var(--bq-neutral-600);--bq-text--inverse:var(--bq-neutral-50);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-brand);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-white);--bq-ui--secondary:var(--bq-neutral-100);--bq-ui--tertiary:var(--bq-neutral-500);--bq-ui--inverse:var(--bq-neutral-900);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-light);--bq-ui--alt:var(--bq-neutral-50);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-light);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-light);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-light);--bq-ui--info:var(--bq-brand);--bq-ui--info-alt:var(--bq-brand-light);--bq-hover:#bcbfc5;--bq-active:#444546}.dark,[bq-mode=dark]{--bq-background--primary:var(--bq-neutral-1000);--bq-background--secondary:var(--bq-neutral-950);--bq-background--tertiary:var(--bq-neutral-800);--bq-background--alt:var(--bq-neutral-700);--bq-background--inverse:var(--bq-neutral-600);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-100);--bq-icon--secondary:var(--bq-neutral-400);--bq-icon--inverse:var(--bq-neutral-800);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-brand);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-900);--bq-stroke--secondary:var(--bq-neutral-700);--bq-stroke--tertiary:var(--bq-neutral-400);--bq-stroke--inverse:var(--bq-neutral-950);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-1000);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-brand);--bq-text--primary:var(--bq-neutral-100);--bq-text--secondary:var(--bq-neutral-400);--bq-text--inverse:var(--bq-neutral-800);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-brand);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-neutral-900);--bq-ui--secondary:var(--bq-neutral-950);--bq-ui--tertiary:var(--bq-neutral-700);--bq-ui--inverse:var(--bq-neutral-100);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-dark);--bq-ui--alt:var(--bq-neutral-950);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-dark);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-dark);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-dark);--bq-ui--info:var(--bq-brand);--bq-ui--info-alt:var(--bq-brand-dark);--bq-hover:#444546;--bq-active:#1f2026}:where(.endava),:where([bq-theme=endava]){--bq-font-family:"Poppins",sans-serif;--bq-white:#fafbfb;--bq-black:#030406;--bq-neutral-50:var(--bq-endava-grey-50);--bq-neutral-100:var(--bq-endava-grey-100);--bq-neutral-200:var(--bq-endava-grey-200);--bq-neutral-300:var(--bq-endava-grey-300);--bq-neutral-400:var(--bq-endava-grey-400);--bq-neutral-500:var(--bq-endava-grey-500);--bq-neutral-600:var(--bq-endava-grey-600);--bq-neutral-700:var(--bq-endava-grey-700);--bq-neutral-800:var(--bq-endava-grey-800);--bq-neutral-900:var(--bq-endava-grey-900);--bq-neutral-950:var(--bq-endava-grey-950);--bq-neutral-1000:var(--bq-endava-grey-1000);--bq-brand-light:var(--bq-endava-orange-100);--bq-brand:var(--bq-endava-orange-600);--bq-brand-dark:var(--bq-endava-orange-1000);--bq-accent-light:var(--bq-endava-orange-100);--bq-accent:var(--bq-endava-orange-600);--bq-accent-dark:var(--bq-endava-orange-1000);--bq-success-light:var(--bq-green-100);--bq-success:var(--bq-green-600);--bq-success-dark:var(--bq-green-1000);--bq-danger-light:var(--bq-corai-100);--bq-danger:var(--bq-corai-600);--bq-danger-dark:var(--bq-corai-1000);--bq-warning-light:var(--bq-yellow-100);--bq-warning:var(--bq-yellow-600);--bq-warning-dark:var(--bq-yellow-1000);--bq-info-light:var(--bq-blue-100);--bq-info:var(--bq-blue-600);--bq-info-dark:var(--bq-blue-1000);--bq-focus:var(--bq-endava-orange-600);--bq-data-01:var(--bq-brand);--bq-data-02:#af0cd8;--bq-data-03:#0ca8d8;--bq-data-04:var(--bq-teal-600);--bq-data-05:var(--bq-yellow-600);--bq-data-06:var(--bq-orange-600);--bq-data-07:var(--bq-blue-600);--bq-data-08:var(--bq-red-600);--bq-data-09:var(--bq-purple-600);--bq-data-10:#394b56;--bq-data-11:var(--bq-black);--bq-data-12:var(--bq-white)}.endava.light,.endava:not([bq-mode]),[bq-theme=endava]:not([bq-mode]),[bq-theme=endava][bq-mode=light]{--bq-background--primary:var(--bq-white);--bq-background--secondary:var(--bq-neutral-100);--bq-background--tertiary:var(--bq-neutral-200);--bq-background--alt:var(--bq-neutral-300);--bq-background--inverse:var(--bq-neutral-900);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-800);--bq-icon--secondary:var(--bq-neutral-600);--bq-icon--inverse:var(--bq-neutral-50);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-info);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-200);--bq-stroke--secondary:var(--bq-neutral-600);--bq-stroke--tertiary:var(--bq-neutral-900);--bq-stroke--inverse:var(--bq-white);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-50);--bq-stroke--brand-alt:var(--bq-brand-light);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-info);--bq-text--primary:var(--bq-neutral-800);--bq-text--secondary:var(--bq-neutral-600);--bq-text--inverse:var(--bq-neutral-50);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-info);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-white);--bq-ui--secondary:var(--bq-neutral-100);--bq-ui--tertiary:var(--bq-neutral-500);--bq-ui--inverse:var(--bq-neutral-900);--bq-ui--alt:var(--bq-neutral-50);--bq-ui--brand-alt:var(--bq-brand-light);--bq-ui--brand:var(--bq-brand);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-light);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-light);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-light);--bq-ui--info:var(--bq-info);--bq-ui--info-alt:var(--bq-info-light);--bq-hover:#444546;--bq-active:#1f2026}.endava.dark,[bq-theme=endava][bq-mode=dark]{--bq-background--primary:var(--bq-neutral-1000);--bq-background--secondary:var(--bq-neutral-900);--bq-background--tertiary:var(--bq-neutral-800);--bq-background--alt:var(--bq-neutral-700);--bq-background--inverse:var(--bq-neutral-600);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-100);--bq-icon--secondary:var(--bq-neutral-400);--bq-icon--inverse:var(--bq-neutral-800);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-info);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-900);--bq-stroke--secondary:var(--bq-neutral-700);--bq-stroke--tertiary:var(--bq-neutral-400);--bq-stroke--inverse:var(--bq-neutral-950);--bq-stroke--brand:var(--bq-brand);--bq-stroke--brand-alt:var(--bq-brand-dark);--bq-stroke--alt:var(--bq-neutral-1000);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-info);--bq-text--primary:var(--bq-neutral-100);--bq-text--secondary:var(--bq-neutral-400);--bq-text--inverse:var(--bq-neutral-800);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-neutral-white);--bq-text--info:var(--bq-info);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-neutral-900);--bq-ui--secondary:var(--bq-neutral-950);--bq-ui--tertiary:var(--bq-neutral-700);--bq-ui--inverse:var(--bq-neutral-100);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-dark);--bq-ui--alt:var(--bq-neutral-950);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-dark);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-dark);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-dark);--bq-ui--info:var(--bq-info);--bq-ui--info-alt:var(--bq-info-dark);--bq-hover:#444546;--bq-active:#1f2026}.relative{position:relative}.block{display:block}.flex{display:flex}.hidden{display:none}.items-start{align-items:flex-start}.gap-xs{gap:var(--bq-spacing-xs)}.rounded-\\[--bq-notification--border-radius\\]{border-radius:var(--bq-notification--border-radius)}.bg-\\[--bq-notification--background\\]{background-color:var(--bq-notification--background)}.text-\\[color\\:--bq-notification--icon-color-error\\]{color:var(--bq-notification--icon-color-error)}.text-\\[color\\:--bq-notification--icon-color-info\\]{color:var(--bq-notification--icon-color-info)}.text-\\[color\\:--bq-notification--icon-color-neutral\\]{color:var(--bq-notification--icon-color-neutral)}.text-\\[color\\:--bq-notification--icon-color-success\\]{color:var(--bq-notification--icon-color-success)}.text-\\[color\\:--bq-notification--icon-color-warning\\]{color:var(--bq-notification--icon-color-warning)}.shadow-\\[shadow\\:--bq-notification--box-shadow\\]{--tw-shadow:var(--bq-notification--box-shadow);--tw-shadow-colored:var(--bq-notification--box-shadow);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.min-is-\\[--bq-notification--min-width\\]{min-inline-size:var(--bq-notification--min-width)}.p-b-\\[--bq-notification--padding\\]{padding-block:var(--bq-notification--padding)}.p-i-\\[--bq-notification--padding\\]{padding-inline:var(--bq-notification--padding)}.m-bs-m{margin-block-start:var(--bq-spacing-m)}@-webkit-keyframes fade-in{0%{opacity:0}}@keyframes fade-in{0%{opacity:0}}@-webkit-keyframes slide-in{0%{-webkit-transform:translateY(10px);transform:translateY(10px)}}@keyframes slide-in{0%{-webkit-transform:translateY(10px);transform:translateY(10px)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}:host{--bq-notification--background:var(--bq-ui--primary);--bq-notification--box-shadow:var(--bq-box-shadow--l);--bq-notification--border-color:transparent;--bq-notification--border-radius:var(--bq-radius--s);--bq-notification--border-style:none;--bq-notification--border-width:unset;--bq-notification--content-footer-gap:var(--bq-spacing-m);--bq-notification--title-body-gap:var(--bq-spacing-s);--bq-notification--icon-color-error:var(--bq-icon--danger);--bq-notification--icon-color-info:var(--bq-icon--brand);--bq-notification--icon-color-neutral:var(--bq-icon--primary);--bq-notification--icon-color-success:var(--bq-icon--success);--bq-notification--icon-color-warning:var(--bq-icon--warning);--bq-notification--padding:var(--bq-spacing-m);--bq-notification--min-width:320px;display:block}:host(.is-hidden){display:none}.bq-notification{--tw-shadow:var(--bq-notification--box-shadow);--tw-shadow-colored:var(--bq-notification--box-shadow);background-color:var(--bq-notification--background);border-radius:var(--bq-notification--border-radius);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);display:flex;min-inline-size:var(--bq-notification--min-width);padding-block:var(--bq-notification--padding);padding-inline:var(--bq-notification--padding);position:relative;transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.notification--icon.color-error{color:var(--bq-notification--icon-color-error)}.notification--icon.color-info{color:var(--bq-notification--icon-color-info)}.notification--icon.color-neutral{color:var(--bq-notification--icon-color-neutral)}.notification--icon.color-success{color:var(--bq-notification--icon-color-success)}.notification--icon.color-warning{color:var(--bq-notification--icon-color-warning)}[part=footer] ::slotted(*){align-items:flex-start;display:flex;gap:var(--bq-spacing-xs)}[part=body] ::slotted(*),[part=footer] ::slotted(*){display:block;margin-block-start:var(--bq-spacing-m)}.-translate-y-xs,.sm\\:translate-x-0,.sm\\:translate-x-s,.sm\\:translate-y-0,.transform,.translate-y-0,.translate-y-xs{--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}.static{position:static}.absolute{position:absolute}.me-xs{margin-inline-end:var(--bq-spacing-xs)}.\\!hidden{display:none!important}.-translate-y-xs{--tw-translate-y:calc(var(--bq-spacing-xs)*-1)}.-translate-y-xs,.translate-y-0{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))}.translate-y-0{--tw-translate-y:0px}.translate-y-xs{--tw-translate-y:var(--bq-spacing-xs)}.transform,.translate-y-xs{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))}.flex-col{flex-direction:column}.gap-\\[--bq-notification--content-footer-gap\\]{gap:var(--bq-notification--content-footer-gap)}.gap-\\[--bq-notification--title-body-gap\\]{gap:var(--bq-notification--title-body-gap)}.text-left{text-align:left}.align-top{vertical-align:top}.text-s{font-size:var(--bq-font-size--s)}.font-semibold{font-weight:var(--bq-font-weight--semibold)}.leading-regular{line-height:var(--bq-font-line-height--regular)}.opacity-0{opacity:0}.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)}.duration-100{transition-duration:.1s}.duration-300{transition-duration:.3s}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.inset-ie-m{inset-inline-end:var(--bq-spacing-m)}@media (min-width:640px){.sm\\:translate-x-0{--tw-translate-x:0px}.sm\\:translate-x-0,.sm\\:translate-x-s{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))}.sm\\:translate-x-s{--tw-translate-x:var(--bq-spacing-s)}.sm\\:translate-y-0{--tw-translate-y:0px;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))}}.\\[\\&\\:\\:part\\(button\\)\\]\\:p-0::part(button){padding:0}.focus{outline:var(--bq-ring-width,2px) solid var(--bq-ring-color-focus,var(--bq-focus));outline-offset:var(--bq-ring-offset-width,1px)}.text-\\[--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)}`;
+
+const v = "bq-notification-portal";
+
+const f = class {
+  constructor(e) {
+    a(this, e);
+    this.bqHide = r(this, "bqHide");
+    this.bqShow = r(this, "bqShow");
+    this.bqAfterOpen = r(this, "bqAfterOpen");
+    this.bqAfterClose = r(this, "bqAfterClose");
+  }
+  // Own Properties
+  // ====================
+  autoDismissDebounce;
+  bodyElem;
+  footerElem;
+  notificationElem;
+  get el() {
+    return e(this);
+  }
+  // State() variables
+  // Inlined decorator, alphabetical order
+  // =======================================
+  hasContent=false;
+  hasFooter=false;
+  notificationPortal=i() ? document.querySelector(`.${v}`) : null;
+  // Public Property API
+  // ========================
+  /** If true, the notification will automatically hide after the specified amount of time */
+  autoDismiss;
+  /** The corder radius of the notification component */
+  border="s";
+  /** If true, the close button at the top right of the notification won't be shown */
+  disableClose;
+  /** If true, the notification icon won't be shown */
+  hideIcon;
+  /** If true, the notification will be shown */
+  open;
+  /** The length of time, in milliseconds, after which the notification will close itself. Only valid if `autoDismiss="true"` */
+  time=3e3;
+  /** Type of Notification */
+  type="info";
+  // Prop lifecycle events
+  // =======================
+  handleTimeout() {
+    this.autoDismissDebounce?.cancel();
+    if (!this.autoDismiss) return;
+    this.autoDismissDebounce = o((() => {
+      this.hide();
+    }), this.time);
+    // Make sure to autodismiss the notification if the `auto-dismiss` value changed while open
+        if (this.open) this.autoDismissDebounce();
+  }
+  handleOpenChange() {
+    this.autoDismissDebounce?.cancel();
+    if (!(this.autoDismiss && this.open)) return;
+    this.autoDismissDebounce();
+  }
+  checkPropValues() {
+    q(d, "info", this.el, "type");
+  }
+  // Events section
+  // Requires JSDocs for public API documentation
+  // ==============================================
+  /** Callback handler to be called when the notification is hidden */
+  bqHide;
+  /** Callback handler to be called when the notification is shown */
+  bqShow;
+  /** Callback handler to be called after the notification has been opened */
+  bqAfterOpen;
+  /** Callback handler to be called after the notification has been closed */
+  bqAfterClose;
+  // Component lifecycle events
+  // Ordered by their natural call order
+  // =====================================
+  connectedCallback() {
+    if (!i()) return;
+    const {notificationPortal: a} = this;
+    if (!a) {
+      this.notificationPortal = Object.assign(document.createElement("div"), {
+        className: v
+      });
+    }
+  }
+  componentWillLoad() {
+    this.checkPropValues();
+    this.handleTimeout();
+  }
+  componentDidLoad() {
+    this.handleSlotChange();
+  }
+  // Listeners
+  // ==============
+  afterNotificationClose() {
+    try {
+      const {notificationPortal: a} = this;
+      a.removeChild(this.el);
+      // Remove the notification portal from the DOM when there are no more notifications
+            if (a.querySelector(this.el.tagName.toLowerCase()) === null) {
+        a.remove();
+      }
+    } catch (a) {
+      /**
+             * Skip DOMException error since it could be possible that
+             * in some situations the notification portal is missing
+             */
+      if (a instanceof DOMException) return;
+      throw a;
+    }
+  }
+  // Public methods API
+  // These methods are exposed on the host element.
+  // Always use two lines.
+  // Public Methods must be async.
+  // Requires JSDocs for public API documentation.
+  // ===============================================
+  /** Method to be called to hide the notification component */
+  async hide() {
+    await this.handleHide();
+  }
+  /** Method to be called to show the notification component */  async show() {
+    await this.handleShow();
+  }
+  /** This method can be used to display notifications in a fixed-position element that allows for stacking multiple notifications vertically */  async toast() {
+    if (!i()) return;
+    const {notificationPortal: a} = this;
+    if (a?.parentElement === null) {
+      document.body.append(a);
+    }
+    a?.appendChild(this.el);
+    requestAnimationFrame((() => {
+      this.show();
+    }));
+  }
+  // Local methods
+  // Internal business logic.
+  // These methods cannot be called from the host element.
+  // =======================================================
+  handleHide=async () => {
+    const a = this.bqHide.emit(this.el);
+    if (!a.defaultPrevented) {
+      await c(this.notificationElem);
+      this.open = false;
+      this.handleTransitionEnd();
+    }
+  };
+  handleShow=async () => {
+    const a = this.bqShow.emit(this.el);
+    if (!a.defaultPrevented) {
+      this.open = true;
+      await l(this.notificationElem);
+      this.handleTransitionEnd();
+    }
+  };
+  handleTransitionEnd=() => {
+    if (this.open) {
+      this.bqAfterOpen.emit();
+      return;
+    }
+    this.bqAfterClose.emit();
+  };
+  handleSlotChange=() => {
+    this.hasContent = s(this.bodyElem);
+    this.hasFooter = s(this.footerElem, "footer");
+  };
+  get iconName() {
+    const a = {
+      error: "x-circle",
+      success: "check-circle",
+      warning: "warning-circle"
+    };
+    return a[this.type] || "info";
+  }
+  // render() function
+  // Always the last one in the class.
+  // ===================================
+  render() {
+    const a = {
+      ...this.border && {
+        "--bq-notification--border-radius": `var(--bq-radius--${this.border})`
+      }
+    };
+    return n(t, {
+      "aria-hidden": !this.open ? "true" : "false",
+      class: {
+        "is-hidden": !this.open
+      },
+      hidden: !this.open ? "true" : "false",
+      role: "alert",
+      style: a,
+      children: b("div", {
+        class: "bq-notification",
+        "data-transition-enter": "transform transition ease-out duration-300",
+        "data-transition-enter-end": "translate-y-0 opacity-100 sm:translate-x-0",
+        "data-transition-enter-start": "translate-y-xs opacity-0 sm:translate-y-0 sm:translate-x-s",
+        "data-transition-leave": "transform transition ease-in duration-100",
+        "data-transition-leave-end": "-translate-y-xs opacity-0 sm:translate-y-0 sm:translate-x-s",
+        "data-transition-leave-start": "translate-y-0 opacity-100 sm:translate-x-0",
+        part: "wrapper",
+        ref: a => {
+          this.notificationElem = a;
+        },
+        children: [ !this.disableClose && n("bq-button", {
+          appearance: "text",
+          border: "s",
+          class: "absolute inset-ie-m [&::part(button)]:p-0",
+          label: "Close",
+          onBqClick: () => this.hide(),
+          onlyIcon: true,
+          part: "btn-close",
+          size: "small",
+          children: n("slot", {
+            name: "btn-close",
+            children: n("bq-icon", {
+              "aria-hidden": "true",
+              name: "x"
+            }, "e9f9e6dcf98416f7c08fc27148f9e29a8172d639")
+          }, "d48c04b8312c5e8406e99932b4fbcd2d2318281b")
+        }, "26d4491711c093d73a1111f9f242067beba2216e"), n("div", {
+          class: {
+            "!hidden": this.hideIcon,
+            [`color-${this.type}`]: true,
+            // The icon color will be based on the type (info, success, warning, error)
+            "notification--icon me-xs flex text-left align-top": true
+          },
+          part: "icon-outline",
+          children: n("slot", {
+            name: "icon",
+            children: n("bq-icon", {
+              exportparts: "base,svg",
+              name: this.iconName,
+              part: "icon"
+            }, "84c6851efd1a00ea2bc09163f19d99745132663e")
+          }, "087d0c9075c4d3a008928f1bac7b4ed25320149e")
+        }, "27ea3035eaf10a85ee9799e528458a4bb5b85eaf"), b("div", {
+          class: "flex flex-col items-start gap-[--bq-notification--content-footer-gap]",
+          part: "main",
+          children: [ b("div", {
+            class: "flex flex-col gap-[--bq-notification--title-body-gap]",
+            part: "content",
+            children: [ n("div", {
+              class: "title-font font-semibold leading-regular",
+              part: "title",
+              children: n("slot", {}, "28ea69a36d437bb362d07dad07944b2911bc1544")
+            }, "b76d5fd5299960bc10817edaad33973df601c6cf"), n("div", {
+              class: {
+                "text-s leading-regular": true,
+                "!hidden": !this.hasContent
+              },
+              part: "body",
+              ref: a => {
+                this.bodyElem = a;
+              },
+              children: n("slot", {
+                name: "body",
+                onSlotchange: this.handleSlotChange
+              }, "9579c2de900af09753e11bf815844519a5ed32c2")
+            }, "6df2fee156ee13a64b4b09958eebbaf070e8e89a") ]
+          }, "c8c111de95602acf9c7078ec4202ee2c03f36dc8"), n("div", {
+            class: {
+              "flex items-start gap-xs": true,
+              "!hidden": !this.hasFooter
+            },
+            part: "footer",
+            ref: a => {
+              this.footerElem = a;
+            },
+            children: n("slot", {
+              name: "footer",
+              onSlotchange: this.handleSlotChange
+            }, "168a55c7e0aeb56001cb5b56aa5210588a7620d8")
+          }, "5cac890b2d5eb8d9d9e04b863d78c84ecf69c67d") ]
+        }, "6db46730f5002c3e94f6e33e366af831eb3a40b9") ]
+      }, "e1b74480a2526c2739c08760ad0324fc85d7d536")
+    }, "3a16720348de3bd1c0642f15c8821c7300b0867c");
+  }
+  static get watchers() {
+    return {
+      autoDismiss: [ {
+        handleTimeout: 0
+      } ],
+      time: [ {
+        handleTimeout: 0
+      } ],
+      open: [ {
+        handleOpenChange: 0
+      } ],
+      type: [ {
+        checkPropValues: 0
+      } ]
+    };
+  }
+};
+
+f.style = bqNotificationCss();
+
+export { f as bq_notification };
+//# sourceMappingURL=bq-notification.entry.esm.js.map
+//# sourceMappingURL=p-ac7cd72b.entry.js.map