npm - @nanoporetech-digital/components - Versions diffs - 1.15.6 → 2.0.0 - Mend

@nanoporetech-digital/components 1.15.6 → 2.0.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 (981) hide show

package/dist/esm/form-control-67eeb108.js ADDED Viewed

@@ -0,0 +1,77 @@
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */
+import { h } from './index-5f8d16e7.js';
+const renderLabel = ({ label, hasLabelSlot, controlId, labelId, floatLabel, placeholder, hideLabel, hasValue, rtl, showCharCount, maxlength, charCount, }) => {
+  if (!label && !hasLabelSlot)
+    return;
+  if (floatLabel) {
+    return (h("label", { class: "placeholder-as-label", htmlFor: controlId, id: labelId },
+      label && label,
+      !label && hasLabelSlot && h("slot", { name: "label" })));
+  }
+  else {
+    return (h("label", { class: { label: true, 'visually-hide': hideLabel }, htmlFor: controlId, id: labelId },
+      h("div", { class: "label-placeholder" },
+        placeholder && hasValue && rtl && (h("span", { class: "placeholder" },
+          placeholder,
+          " / ")),
+        h("span", { class: "labeltext" },
+          label && label,
+          !label && hasLabelSlot && h("slot", { name: "label" })),
+        placeholder && hasValue && !rtl && (h("span", { class: "placeholder" },
+          " / ",
+          placeholder))),
+      showCharCount && (h("span", { class: "charcount" }, maxlength
+        ? maxlength - charCount + ' left'
+        : charCount + ' characters'))));
+  }
+};
+const FormControlWrap = (props, children) => {
+  const { rtl, floatLabel, label, moreId, type, hasHelperSlot, showInlineError, errorMessage, } = props;
+  const isLegacy = !document.head.attachShadow;
+  return [
+    !floatLabel ? renderLabel(Object.assign({}, props)) : '',
+    h("div", { class: {
+        'has-label': label !== null && !floatLabel,
+        'has-float-label': label !== null && floatLabel,
+        rtl,
+        legacy: isLegacy,
+        input: true,
+        textarea: type === 'textarea',
+      } },
+      floatLabel && renderLabel(Object.assign(Object.assign({}, props), { rtl })),
+      children),
+    showInlineError || hasHelperSlot ? (h("div", { class: "more", id: moreId },
+      !!showInlineError ? h("div", { class: "error" }, errorMessage) : '',
+      h("div", { class: "helper" },
+        h("slot", { name: "helper" })))) : (''),
+  ];
+};
+const FormControl = (props, children) => {
+  const { clearControl, onClearText, readonly, disabled, control, ref, endSlot, endValueSlot, startSlot, } = props;
+  const clickThrough = () => {
+    control.setFocus();
+  };
+  return (h("div", { class: "native-input-wrap", ref: (el) => {
+      if (ref)
+        ref(el);
+    } },
+    h("span", { class: "start" },
+      h("slot", { name: "start" }),
+      startSlot),
+    children,
+    clearControl && !readonly && !disabled && (h("button", { type: "button", class: "icon input-clear-icon", tabindex: "-1", onTouchStart: onClearText, onMouseDown: onClearText },
+      h("nano-icon", { name: "light/times" }))),
+    h("span", { class: "value-end", onClick: clickThrough },
+      h("slot", { name: "value-end" }),
+      endValueSlot),
+    h("span", { class: "end" },
+      h("slot", { name: "end" }),
+      endSlot)));
+};
+export { FormControlWrap as F, FormControl as a };
+//# sourceMappingURL=form-control-67eeb108.js.map

package/dist/esm/form-control-67eeb108.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"file":"form-control-67eeb108.js","mappings":"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","names":[],"sources":["./src/components/form-control/form-control.tsx"],"sourcesContent":["import { FunctionalComponent, h, VNode } from '@stencil/core';\nimport { TextFieldTypes } from '../../interface';\n\ninterface FormControlWrapProps {\n rtl: boolean;\n floatLabel: boolean;\n labelId: string;\n label: string;\n moreId: string;\n type?: TextFieldTypes;\n showInlineError: boolean;\n hasHelperSlot: boolean;\n errorMessage: string;\n controlId: string;\n hasLabelSlot: boolean;\n hideLabel: boolean;\n placeholder: string;\n hasValue: boolean;\n showCharCount?: boolean;\n maxlength?: number;\n charCount?: number;\n}\n\ninterface FormControlProps {\n clearControl: boolean;\n onClearText?: () => void;\n readonly: boolean;\n disabled: boolean;\n control: HTMLNanoInputElement | HTMLNanoSelectElement;\n ref?: (elm?: HTMLElement) => void;\n endSlot?: VNode;\n endValueSlot?: VNode;\n startSlot?: VNode;\n}\n\ninterface LabelProps extends FormControlWrapProps {\n rtl: boolean;\n}\n\nconst renderLabel = ({\n label,\n hasLabelSlot,\n controlId,\n labelId,\n floatLabel,\n placeholder,\n hideLabel,\n hasValue,\n rtl,\n showCharCount,\n maxlength,\n charCount,\n}: LabelProps) => {\n if (!label && !hasLabelSlot) return;\n if (floatLabel) {\n return (\n <label class=\"placeholder-as-label\" htmlFor={controlId} id={labelId}>\n {label && label}\n {!label && hasLabelSlot && <slot name=\"label\" />}\n </label>\n );\n } else {\n return (\n <label\n class={{ label: true, 'visually-hide': hideLabel }}\n htmlFor={controlId}\n id={labelId}\n >\n <div class=\"label-placeholder\">\n {placeholder && hasValue && rtl && (\n <span class=\"placeholder\">{placeholder} / </span>\n )}\n <span class=\"labeltext\">\n {label && label}\n {!label && hasLabelSlot && <slot name=\"label\" />}\n </span>\n {placeholder && hasValue && !rtl && (\n <span class=\"placeholder\"> / {placeholder}</span>\n )}\n </div>\n {showCharCount && (\n <span class=\"charcount\">\n {maxlength\n ? maxlength - charCount + ' left'\n : charCount + ' characters'}\n </span>\n )}\n </label>\n );\n }\n};\n\nexport const FormControlWrap: FunctionalComponent<FormControlWrapProps> = (\n props: FormControlWrapProps,\n children\n) => {\n const {\n rtl,\n floatLabel,\n label,\n moreId,\n type,\n hasHelperSlot,\n showInlineError,\n errorMessage,\n } = props;\n const isLegacy = !document.head.attachShadow;\n\n return [\n !floatLabel ? renderLabel({ ...props }) : '',\n <div\n class={{\n 'has-label': label !== null && !floatLabel,\n 'has-float-label': label !== null && floatLabel,\n rtl,\n legacy: isLegacy,\n input: true,\n textarea: type === 'textarea',\n }}\n >\n {floatLabel && renderLabel({ ...props, rtl })}\n {children}\n </div>,\n showInlineError || hasHelperSlot ? (\n <div class=\"more\" id={moreId}>\n {!!showInlineError ? <div class=\"error\">{errorMessage}</div> : ''}\n <div class=\"helper\">\n <slot name=\"helper\" />\n </div>\n </div>\n ) : (\n ''\n ),\n ];\n};\n\nexport const FormControl: FunctionalComponent<FormControlProps> = (\n props: FormControlProps,\n children\n) => {\n const {\n clearControl,\n onClearText,\n readonly,\n disabled,\n control,\n ref,\n endSlot,\n endValueSlot,\n startSlot,\n } = props;\n const clickThrough = () => {\n control.setFocus();\n };\n\n return (\n <div\n class=\"native-input-wrap\"\n ref={(el) => {\n if (ref) ref(el);\n }}\n >\n <span class=\"start\">\n <slot name=\"start\" />\n {startSlot}\n </span>\n {children}\n {clearControl && !readonly && !disabled && (\n <button\n type=\"button\"\n class=\"icon input-clear-icon\"\n tabindex=\"-1\"\n onTouchStart={onClearText}\n onMouseDown={onClearText}\n >\n <nano-icon name=\"light/times\"></nano-icon>\n </button>\n )}\n <span class=\"value-end\" onClick={clickThrough}>\n <slot name=\"value-end\" />\n {endValueSlot}\n </span>\n <span class=\"end\">\n <slot name=\"end\" />\n {endSlot}\n </span>\n </div>\n );\n};\n"],"version":3}

package/dist/esm/index-5f8d16e7.js CHANGED Viewed

@@ -2409,11 +2409,6 @@ const loadModule = (cmpMeta, hostRef, hmrVersionId) => {
       /* webpackMode: "lazy" */
       './nano-hero.entry.js').then(processMod, consoleError);
-    case 'nano-menu':
-    return import(
-      /* webpackMode: "lazy" */
-      './nano-menu.entry.js').then(processMod, consoleError);
     case 'nano-menu-drawer':
     return import(
       /* webpackMode: "lazy" */
@@ -2429,11 +2424,6 @@ const loadModule = (cmpMeta, hostRef, hmrVersionId) => {
       /* webpackMode: "lazy" */
       './nano-rating.entry.js').then(processMod, consoleError);
-    case 'nano-select-option':
-    return import(
-      /* webpackMode: "lazy" */
-      './nano-select-option.entry.js').then(processMod, consoleError);
     case 'nano-slide':
     return import(
       /* webpackMode: "lazy" */
@@ -2464,10 +2454,10 @@ const loadModule = (cmpMeta, hostRef, hmrVersionId) => {
       /* webpackMode: "lazy" */
       './nano-algolia.entry.js').then(processMod, consoleError);
-    case 'nano-date-picker_2':
+    case 'nano-date-picker':
     return import(
       /* webpackMode: "lazy" */
-      './nano-date-picker_2.entry.js').then(processMod, consoleError);
+      './nano-date-picker.entry.js').then(processMod, consoleError);
     case 'nano-grid_3':
     return import(
@@ -2484,6 +2474,11 @@ const loadModule = (cmpMeta, hostRef, hmrVersionId) => {
       /* webpackMode: "lazy" */
       './nano-tooltip.entry.js').then(processMod, consoleError);
+    case 'nano-datalist_3':
+    return import(
+      /* webpackMode: "lazy" */
+      './nano-datalist_3.entry.js').then(processMod, consoleError);
     case 'nano-input':
     return import(
       /* webpackMode: "lazy" */
@@ -2504,6 +2499,11 @@ const loadModule = (cmpMeta, hostRef, hmrVersionId) => {
       /* webpackMode: "lazy" */
       './nano-sticker.entry.js').then(processMod, consoleError);
+    case 'nano-dropdown':
+    return import(
+      /* webpackMode: "lazy" */
+      './nano-dropdown.entry.js').then(processMod, consoleError);
     case 'nano-icon-button':
     return import(
       /* webpackMode: "lazy" */

package/dist/esm/index-bf53664b.js ADDED Viewed

@@ -0,0 +1,74 @@
+/*!
+ * Web Components for Nanopore digital Web Apps
+ */
+/**
+ * Patched Request Animation Frame method.
+ * Perform a function between browser paints for less page jank
+ * @param callback
+ * @returns wrapped function
+ */
+const raf = (callback) => {
+  if (typeof __zone_symbol__requestAnimationFrame === 'function') {
+    return __zone_symbol__requestAnimationFrame(callback);
+  }
+  if (typeof requestAnimationFrame === 'function') {
+    return requestAnimationFrame(callback);
+  }
+  return setTimeout(callback);
+};
+const hasShadowDom = (el) => {
+  return !!el.shadowRoot && !!el.attachShadow;
+};
+const browserCanUseCssVariables = () => {
+  return window.CSS && CSS.supports('color', 'var(--fake-var)');
+};
+const renderHiddenInput = (always, container, name, value, disabled) => {
+  if (always || hasShadowDom(container)) {
+    let input = container.querySelector('input.aux-input');
+    if (!input) {
+      input = container.ownerDocument.createElement('input');
+      input.type = 'hidden';
+      input.classList.add('aux-input');
+      container.appendChild(input);
+    }
+    input.disabled = disabled;
+    input.name = name;
+    input.value = value || '';
+  }
+};
+const clamp = (min, n, max) => {
+  return Math.max(min, Math.min(n, max));
+};
+/**
+ * handles hiding and showing elements properly (with display),
+ * along with transitions, so they are no longer viewable in the dom.
+ * - OnHide remove show class, listen for transition end, then display: none on finish
+ * - OnShow, display block on start then add a show class
+ */
+const displayTransition = (el, className, show = true) => {
+  return new Promise((resolve) => {
+    if (show) {
+      el.addEventListener('transitionend', (e) => {
+        if (e.target !== el)
+          return;
+        resolve('shown');
+      }, { once: true });
+      el.style.display = 'block';
+      el.dataset.displayTransition = 'true';
+      setTimeout(() => el.classList.add(className), 20);
+    }
+    else {
+      el.addEventListener('transitionend', (e) => {
+        if (e.target !== el)
+          return;
+        el.style.display = 'none';
+        resolve('hidden');
+      }, { once: true });
+      el.classList.remove(className);
+    }
+  });
+};
+export { renderHiddenInput as a, browserCanUseCssVariables as b, clamp as c, displayTransition as d, hasShadowDom as h, raf as r };
+//# sourceMappingURL=index-bf53664b.js.map

package/dist/esm/{index-f41ae118.js.map → index-bf53664b.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"index-~~f41ae118~~.js","mappings":";;;~~AAYA~~;;;;;;MAMa,GAAG,GAAG,CAAC,QAAa;EAC/B,IAAI,OAAO,oCAAoC,KAAK,UAAU,EAAE;IAC9D,OAAO,oCAAoC,CAAC,QAAQ,CAAC,CAAC;GACvD;EACD,IAAI,OAAO,qBAAqB,KAAK,UAAU,EAAE;IAC/C,OAAO,qBAAqB,CAAC,QAAQ,CAAC,CAAC;GACxC;EACD,OAAO,UAAU,CAAC,QAAQ,CAAC,CAAC;AAC9B,EAAE;MAEW,YAAY,GAAG,CAAC,EAAe;EAC1C,OAAO,CAAC,CAAC,EAAE,CAAC,UAAU,IAAI,CAAC,CAAE,EAAU,CAAC,YAAY,CAAC;AACvD,EAAE;MAEW,yBAAyB,GAAG;EACvC,OAAO,MAAM,CAAC,GAAG,IAAI,GAAG,CAAC,QAAQ,CAAC,OAAO,EAAE,iBAAiB,CAAC,CAAC;AAChE,EAAE;MAEW,iBAAiB,GAAG,CAC/B,MAAe,EACf,SAAsB,EACtB,IAAY,EACZ,KAAgC,EAChC,QAAiB;EAEjB,IAAI,MAAM,IAAI,YAAY,CAAC,SAAS,CAAC,EAAE;IACrC,IAAI,KAAK,GAAG,SAAS,CAAC,aAAa,CACjC,iBAAiB,CACS,CAAC;IAC7B,IAAI,CAAC,KAAK,EAAE;MACV,KAAK,GAAG,SAAS,CAAC,aAAc,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;MACxD,KAAK,CAAC,IAAI,GAAG,QAAQ,CAAC;MACtB,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;MACjC,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;KAC9B;IACD,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAC;IAC1B,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC;IAClB,KAAK,CAAC,KAAK,GAAG,KAAK,IAAI,EAAE,CAAC;GAC3B;AACH,EAAE;MAEW,KAAK,GAAG,CAAC,GAAW,EAAE,CAAS,EAAE,GAAW;EACvD,OAAO,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC;AACzC,EAAE;AAoDF;;;;MAIa,cAAc,GAAG,CAC5B,EAAe;EAEf,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO;IACzB,MAAM,QAAQ,GAAG;MACf,EAAE,CAAC,mBAAmB,CAAC,eAAe,EAAE,QAAQ,CAAC,CAAC;KAEnD,CAAC;IACF,EAAE,CAAC,gBAAgB,CAAC,eAAe,EAAE,QAAQ,CAAC,CAAC;;GAEhD,CAAC,CAAC;AACL,EAAE;AAEF;;;;;;MAMa,iBAAiB,GAAG,CAC/B,EAAe,EACf,SAAiB,EACjB,OAAgB,IAAI;EAEpB,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO;IACzB,~~MAAM~~,~~YAAY~~,~~GAAG~~;~~MACnB~~,EAAE,CAAC,~~mBAAmB~~,~~CAAC~~,eAAe,~~EAAE~~,~~YAAY,~~CAAC,~~CAAC~~;~~MACtD~~,~~OAAO~~,CAAC,~~OAAO,~~CAAC,~~CAAC;KAClB,CAAC;IAEF,~~MAAM,~~cAAc~~,~~GAAG;MACrB,~~EAAE~~,CAAC,mBAAmB,CAAC,eAAe,EAAE,cAAc,CAAC,CAAC~~;~~MACxD~~,~~EAAE,CAAC,KAAK,CAAC,~~OAAO~~,GAAG,MAAM,CAAC~~;~~MAC1B~~,OAAO,CAAC,~~QAAQ~~,CAAC,CAAC;~~KACnB~~,~~CAAC;IAEF~~,~~IAAI~~,IAAI,EAAE~~;MACR~~,~~EAAE~~,~~CAAC,gBAAgB,CAAC,eAAe,~~EAAE,~~YAAY~~,CAAC~~,CAAC~~;~~MACnD~~,EAAE,CAAC,KAAK,CAAC,OAAO,GAAG,OAAO,CAAC;MAC3B,EAAE,CAAC,OAAO,CAAC,iBAAiB,GAAG,MAAM,CAAC;MACtC,UAAU,CAAC,MAAM,EAAE,CAAC,SAAS,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,EAAE,CAAC,CAAC~~;;KAEnD~~;SAAM;MACL,EAAE,CAAC,gBAAgB,~~CAAC~~,eAAe,EAAE,~~cAAc~~,CAAC,CAAC;~~MACrD~~,EAAE,CAAC,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC;KAChC;GACF,CAAC,CAAC;AACL;;;;","names":[],"sources":["./src/utils/index.ts"],"sourcesContent":["import { Side } from '../interface';\n\nexport * from './dom';\nexport * from './throttle';\nexport * from './~~legacy~~';\nexport * from './~~scroll~~';\nexport * from './~~slot~~';\nexport * from './~~theme~~';\n\ndeclare const __zone_symbol__requestAnimationFrame: any;\ndeclare const requestAnimationFrame: any;\n\n/*\n Patched Request Animation Frame method.\n * Perform a function between browser paints for less page jank\n * @param callback\n * @returns wrapped function\n /\nexport const raf = (callback: any) => {\n if (typeof __zone_symbol__requestAnimationFrame === 'function') {\n return __zone_symbol__requestAnimationFrame(callback);\n }\n if (typeof requestAnimationFrame === 'function') {\n return requestAnimationFrame(callback);\n }\n return setTimeout(callback);\n};\n\nexport const hasShadowDom = (el: HTMLElement) => {\n return !!el.shadowRoot && !!(el as any).attachShadow;\n};\n\nexport const browserCanUseCssVariables = () => {\n return window.CSS && CSS.supports('color', 'var(--fake-var)');\n};\n\nexport const renderHiddenInput = (\n always: boolean,\n container: HTMLElement,\n name: string,\n value: string \| undefined \| null,\n disabled: boolean\n) => {\n if (always \|\| hasShadowDom(container)) {\n let input = container.querySelector(\n 'input.aux-input'\n ) as HTMLInputElement \| null;\n if (!input) {\n input = container.ownerDocument!.createElement('input');\n input.type = 'hidden';\n input.classList.add('aux-input');\n container.appendChild(input);\n }\n input.disabled = disabled;\n input.name = name;\n input.value = value \|\| '';\n }\n};\n\nexport const clamp = (min: number, n: number, max: number) => {\n return Math.max(min, Math.min(n, max));\n};\n\nexport const assert = (actual: any, reason: string) => {\n if (!actual) {\n const message = 'ASSERT: ' + reason;\n console.error(message);\n debugger; // tslint:disable-line\n throw new Error(message);\n }\n};\n\nexport const now = (ev: UIEvent) => {\n return ev.timeStamp \|\| Date.now();\n};\n\nexport const pointerCoord = (ev: any): { x: number; y: number } => {\n // get X coordinates for either a mouse click\n // or a touch depending on the given event\n if (ev) {\n const changedTouches = ev.changedTouches;\n if (changedTouches && changedTouches.length > 0) {\n const touch = changedTouches[0];\n return { x: touch.clientX, y: touch.clientY };\n }\n if (ev.pageX !== undefined) {\n return { x: ev.pageX, y: ev.pageY };\n }\n }\n return { x: 0, y: 0 };\n};\n\n/\n @hidden\n * Given a side, return if it should be on the end\n * based on the value of dir\n * @param side the side\n * @param isRTL whether the application dir is rtl\n /\nexport const isEndSide = (side: Side): boolean => {\n const isRTL = document.dir === 'rtl';\n switch (side) {\n case 'start':\n return isRTL;\n case 'end':\n return !isRTL;\n default:\n throw new Error(\n `\"${side}\" is not a valid value for [side]. Use \"start\" or \"end\" instead.`\n );\n }\n};\n\n/\n Quality of life for transition handling.\n * Adds / removes transitionend events. Resolves on complete\n /\nexport const transitionDone = (\n el: HTMLElement\n): Promise<'shown' \| 'hidden'> => {\n return new Promise((resolve) => {\n const callback = () => {\n el.removeEventListener('transitionend', callback);\n resolve;\n };\n el.addEventListener('transitionend', callback);\n // ??\n });\n};\n\n/\n handles hiding and showing elements properly (with display),\n * along with transitions, so they are no longer viewable in the dom.\n * - OnHide remove show class, listen for transition end, then display: none on finish\n * - OnShow, display block on start then add a show class\n */\nexport const displayTransition = (\n el: HTMLElement,\n className: string,\n show: boolean = true\n): Promise<'shown' \| 'hidden'> => {\n return new Promise((resolve) => {\n ~~const~~ ~~callbackOpen =~~ () => {\n el.~~removeEventListener~~('transitionend'~~, callbackOpen);\~~n ~~resolve~~(~~'shown');\n };\n\n const~~ ~~callbackClosed = (~~) => {\n el.~~removeEventListener('transitionend',~~ ~~callbackClosed~~)~~;\n el.style.display~~ ~~= 'none'~~;\n resolve('~~hidden~~');\n };\n~~\n if~~ ~~(show)~~ {\n ~~el.addEventListener('transitionend', callbackOpen~~);\n el.style.display = 'block';\n el.dataset.displayTransition = 'true';\n setTimeout(() => el.classList.add(className), 20);\n ~~// el.classList.add(className)\n~~ } else {\n el.addEventListener('transitionend', ~~callbackClosed~~);\n el.classList.remove(className);\n }\n });\n};\n"],"version":3}
1	+ {"file":"index-bf53664b.js","mappings":";;;AAaA;;;;;;MAMa,GAAG,GAAG,CAAC,QAAa;EAC/B,IAAI,OAAO,oCAAoC,KAAK,UAAU,EAAE;IAC9D,OAAO,oCAAoC,CAAC,QAAQ,CAAC,CAAC;GACvD;EACD,IAAI,OAAO,qBAAqB,KAAK,UAAU,EAAE;IAC/C,OAAO,qBAAqB,CAAC,QAAQ,CAAC,CAAC;GACxC;EACD,OAAO,UAAU,CAAC,QAAQ,CAAC,CAAC;AAC9B,EAAE;MAEW,YAAY,GAAG,CAAC,EAAe;EAC1C,OAAO,CAAC,CAAC,EAAE,CAAC,UAAU,IAAI,CAAC,CAAE,EAAU,CAAC,YAAY,CAAC;AACvD,EAAE;MAEW,yBAAyB,GAAG;EACvC,OAAO,MAAM,CAAC,GAAG,IAAI,GAAG,CAAC,QAAQ,CAAC,OAAO,EAAE,iBAAiB,CAAC,CAAC;AAChE,EAAE;MAEW,iBAAiB,GAAG,CAC/B,MAAe,EACf,SAAsB,EACtB,IAAY,EACZ,KAAgC,EAChC,QAAiB;EAEjB,IAAI,MAAM,IAAI,YAAY,CAAC,SAAS,CAAC,EAAE;IACrC,IAAI,KAAK,GAAG,SAAS,CAAC,aAAa,CACjC,iBAAiB,CACS,CAAC;IAC7B,IAAI,CAAC,KAAK,EAAE;MACV,KAAK,GAAG,SAAS,CAAC,aAAc,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;MACxD,KAAK,CAAC,IAAI,GAAG,QAAQ,CAAC;MACtB,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;MACjC,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;KAC9B;IACD,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAC;IAC1B,KAAK,CAAC,IAAI,GAAG,IAAI,CAAC;IAClB,KAAK,CAAC,KAAK,GAAG,KAAK,IAAI,EAAE,CAAC;GAC3B;AACH,EAAE;MAEW,KAAK,GAAG,CAAC,GAAW,EAAE,CAAS,EAAE,GAAW;EACvD,OAAO,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC;AACzC,EAAE;AAqEF;;;;;;MAMa,iBAAiB,GAAG,CAC/B,EAAe,EACf,SAAiB,EACjB,OAAgB,IAAI;EAEpB,OAAO,IAAI,OAAO,CAAC,CAAC,OAAO;IACzB,IAAI,IAAI,EAAE;MACR,EAAE,CAAC,gBAAgB,CACjB,eAAe,EACf,CAAC,CAAQ;QACP,IAAI,CAAC,CAAC,MAAM,KAAK,EAAE;UAAE,OAAO;QAC5B,OAAO,CAAC,OAAO,CAAC,CAAC;OAClB,EACD,EAAE,IAAI,EAAE,IAAI,EAAE,CACf,CAAC;MACF,EAAE,CAAC,KAAK,CAAC,OAAO,GAAG,OAAO,CAAC;MAC3B,EAAE,CAAC,OAAO,CAAC,iBAAiB,GAAG,MAAM,CAAC;MACtC,UAAU,CAAC,MAAM,EAAE,CAAC,SAAS,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,EAAE,CAAC,CAAC;KACnD;SAAM;MACL,EAAE,CAAC,gBAAgB,CACjB,eAAe,EACf,CAAC,CAAQ;QACP,IAAI,CAAC,CAAC,MAAM,KAAK,EAAE;UAAE,OAAO;QAC5B,EAAE,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAC;QAC1B,OAAO,CAAC,QAAQ,CAAC,CAAC;OACnB,EACD,EAAE,IAAI,EAAE,IAAI,EAAE,CACf,CAAC;MACF,EAAE,CAAC,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC;KAChC;GACF,CAAC,CAAC;AACL;;;;","names":[],"sources":["./src/utils/index.ts"],"sourcesContent":["import { Side } from '../interface';\n\nexport * from './dom';\nexport * from './throttle';\nexport * from './scroll';\nexport * from './slot';\nexport * from './theme';\nexport * from './active-element';\nexport * from './tabbable';\n\ndeclare const __zone_symbol__requestAnimationFrame: any;\ndeclare const requestAnimationFrame: any;\n\n/*\n Patched Request Animation Frame method.\n * Perform a function between browser paints for less page jank\n * @param callback\n * @returns wrapped function\n /\nexport const raf = (callback: any) => {\n if (typeof __zone_symbol__requestAnimationFrame === 'function') {\n return __zone_symbol__requestAnimationFrame(callback);\n }\n if (typeof requestAnimationFrame === 'function') {\n return requestAnimationFrame(callback);\n }\n return setTimeout(callback);\n};\n\nexport const hasShadowDom = (el: HTMLElement) => {\n return !!el.shadowRoot && !!(el as any).attachShadow;\n};\n\nexport const browserCanUseCssVariables = () => {\n return window.CSS && CSS.supports('color', 'var(--fake-var)');\n};\n\nexport const renderHiddenInput = (\n always: boolean,\n container: HTMLElement,\n name: string,\n value: string \| undefined \| null,\n disabled: boolean\n) => {\n if (always \|\| hasShadowDom(container)) {\n let input = container.querySelector(\n 'input.aux-input'\n ) as HTMLInputElement \| null;\n if (!input) {\n input = container.ownerDocument!.createElement('input');\n input.type = 'hidden';\n input.classList.add('aux-input');\n container.appendChild(input);\n }\n input.disabled = disabled;\n input.name = name;\n input.value = value \|\| '';\n }\n};\n\nexport const clamp = (min: number, n: number, max: number) => {\n return Math.max(min, Math.min(n, max));\n};\n\nexport const assert = (actual: any, reason: string) => {\n if (!actual) {\n const message = 'ASSERT: ' + reason;\n console.error(message);\n debugger; // tslint:disable-line\n throw new Error(message);\n }\n};\n\nexport const now = (ev: UIEvent) => {\n return ev.timeStamp \|\| Date.now();\n};\n\nexport const pointerCoord = (ev: any): { x: number; y: number } => {\n // get X coordinates for either a mouse click\n // or a touch depending on the given event\n if (ev) {\n const changedTouches = ev.changedTouches;\n if (changedTouches && changedTouches.length > 0) {\n const touch = changedTouches[0];\n return { x: touch.clientX, y: touch.clientY };\n }\n if (ev.pageX !== undefined) {\n return { x: ev.pageX, y: ev.pageY };\n }\n }\n return { x: 0, y: 0 };\n};\n\n/\n @hidden\n * Given a side, return if it should be on the end\n * based on the value of dir\n * @param side the side\n * @param isRTL whether the application dir is rtl\n /\nexport const isEndSide = (side: Side): boolean => {\n const isRTL = document.dir === 'rtl';\n switch (side) {\n case 'start':\n return isRTL;\n case 'end':\n return !isRTL;\n default:\n throw new Error(\n `\"${side}\" is not a valid value for [side]. Use \"start\" or \"end\" instead.`\n );\n }\n};\n\n/\n Quality of life for transition handling.\n * Adds / removes transitionend events. Resolves on complete\n /\nexport const transitionDone = (\n el: HTMLElement\n): Promise<'shown' \| 'hidden'> => {\n return new Promise((resolve) => {\n const callback = () => {\n el.removeEventListener('transitionend', callback);\n resolve;\n };\n el.addEventListener('transitionend', callback);\n // ??\n });\n};\n\n/\n handles hiding and showing elements properly (with display),\n * along with transitions, so they are no longer viewable in the dom.\n * - OnHide remove show class, listen for transition end, then display: none on finish\n * - OnShow, display block on start then add a show class\n */\nexport const displayTransition = (\n el: HTMLElement,\n className: string,\n show: boolean = true\n): Promise<'shown' \| 'hidden'> => {\n return new Promise((resolve) => {\n if (show) {\n el.addEventListener(\n 'transitionend',\n (e: Event) => {\n if (e.target !== el) return;\n resolve('shown');\n },\n { once: true }\n );\n el.style.display = 'block';\n el.dataset.displayTransition = 'true';\n setTimeout(() => el.classList.add(className), 20);\n } else {\n el.addEventListener(\n 'transitionend',\n (e: Event) => {\n if (e.target !== el) return;\n el.style.display = 'none';\n resolve('hidden');\n },\n { once: true }\n );\n el.classList.remove(className);\n }\n });\n};\n"],"version":3}

package/dist/esm/index.js CHANGED Viewed

@@ -1,8 +1,8 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import { r as raf } from './index-f41ae118.js';
-export { r as nanoRaf } from './index-f41ae118.js';
+import { r as raf } from './index-bf53664b.js';
+export { r as nanoRaf } from './index-bf53664b.js';
 export { d as nanoDebounce, t as nanoThrottle } from './throttle-d3d933cd.js';
 const alertContent = (message, buttons = []) => {
@@ -66,10 +66,10 @@ function nanoShowAlert(message, buttons = [], label, icon = 'light/info-circle',
   addBtnHandlers(alert, buttons);
   document.body.appendChild(alert);
   return new Promise((resolve) => {
-    raf(async (_) => {
+    setTimeout(async (_) => {
       await alert.alert(label);
       resolve(alert);
-    });
+    }, 100);
   });
 }

package/dist/esm/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"index.js","mappings":";;;;;;;AAeA,MAAM,YAAY,GAAG,CACnB,OAAe,EACf,UAAmC,EAAE;EAErC,OAAO,GAAG,OAAO;MAEb,OAAO,CAAC,MAAM;MACV,OAAO;OACJ,GAAG,CACF,CAAC,GAAG,EAAE,CAAC,KACL,qBAAqB,CAAC,mBAAmB,GAAG,CAAC,OAAO,mBAAmB,GAAG,CAAC,OAAO,WAAW,CAChG;OACA,IAAI,CAAC,EAAE,CAAC;MACX,EACN,EAAE,CAAC;AACP,CAAC,CAAC;AAEF,MAAM,cAAc,GAAG,CACrB,KAA2B,EAC3B,UAAmC,EAAE;EAErC,IAAI,OAAO,CAAC,MAAM,EAAE;IAClB,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC,uBAAuB,CAAC,CAAC,CAAC,GAAG,CAC7D,CAAC,GAAgB;MACf,MAAM,QAAQ,GAAG,OAAO,CAAC,IAAI,CAC3B,CAAC,GAAG,EAAE,CAAC,KAAK,GAAG,CAAC,OAAO,CAAC,GAAG,KAAK,CAAC,CAAC,QAAQ,EAAE,CAC7C,CAAC;MACF,IAAI,QAAQ,IAAI,QAAQ,CAAC,OAAO,EAAE;QAChC,GAAG,CAAC,gBAAgB,CAAC,OAAO,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;OACjD;KACF,CACF,CAAC;GACH;AACH,CAAC,CAAC;AAEF;;;;;;;;AAQO,eAAe,aAAa,CACjC,OAAe,EACf,WAA+B,IAAI,EACnC,IAAyB,EACzB,YAAqC,EACrC,UAAmC,EAAE;EAErC,MAAM,IAAI,mBACR,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,IAAI,EACd,QAAQ,EAAE,IAAI,IACX,YAAY,CAChB,CAAC;EACF,IAAI,GAAG,IAAI,IAAI,mBAAmB,CAAC;EACnC,MAAM,KAAK,GAAyB,MAAM,CAAC,MAAM,CAC/C,QAAQ,CAAC,aAAa,CAAC,YAAY,CAAC,kCAE/B,IAAI,KACP,IAAI,EAAE,KAAK,EACX,SAAS,EAAE;2BACU,IAAI;UACrB,YAAY,CAAC,OAAO,EAAE,OAAO,CAAC;OACjC,IAEJ,CAAC;EACF,cAAc,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;EAE/B,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;EACjC,OAAO,IAAI,OAAO,CAAuB,CAAC,OAAO;IAC/C,GAAG,CAAC,OAAO,CAAC;MACV,MAAM,KAAK,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;MAC5B,OAAO,CAAC,KAAK,CAAC,CAAC;KAChB,CAAC,CAAC;GACJ,CAAC,CAAC;AACL,CAAC;AAED;;;;;;;;;SASgB,aAAa,CAC3B,OAAe,EACf,UAAmC,EAAE,EACrC,KAAa,EACb,OAA2B,mBAAmB,EAC9C,eAAuC,EAAE;EAEzC,MAAM,IAAI,mBACR,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,KAAK,IACZ,YAAY,CAChB,CAAC;EACF,IAAI,GAAG,IAAI,IAAI,mBAAmB,CAAC;EACnC,MAAM,KAAK,GAAyB,MAAM,CAAC,MAAM,CAC/C,QAAQ,CAAC,aAAa,CAAC,YAAY,CAAC,kCAE/B,IAAI,KACP,IAAI,EAAE,KAAK,EACX,SAAS,EAAE;UACP,IAAI,GAAG,oBAAoB,IAAI,4BAA4B,GAAG,EAAE;UAChE,YAAY,CAAC,OAAO,EAAE,OAAO,CAAC;OACjC,IAEJ,CAAC;EACF,cAAc,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;EAE/B,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;EACjC,OAAO,IAAI,OAAO,CAAuB,CAAC,OAAO;IAC/C,~~GAAG~~,CAAC,OAAO,CAAC;~~MACV~~,MAAM,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;MACzB,OAAO,CAAC,KAAK,CAAC,CAAC;KAChB,CAAC,CAAC;~~GACJ~~,CAAC,CAAC;AACL;;ACnIA;;;;;;;SAOgB,gBAAgB,CAC9B,IAAY,EACZ,UAAqE,EAAE,EACvE,~~aAAsC~~;~~EAEtC~~,MAAM,IAAI,mBACR,aAAa,EAAE,KAAK,EACpB,KAAK,EAAE,QAAQ,IACZ,aAAa,CACjB,CAAC;EACF,MAAM,MAAM,GAA0B,MAAM,CAAC,MAAM,CACjD,QAAQ,CAAC,aAAa,CAAC,aAAa,CAAC,kCAEhC,IAAI,KACP,IAAI,EAAE,KAAK,EACX,SAAS,EAAE;QACT,IAAI;QAEJ,OAAO,CAAC,MAAM;QACV,OAAO;SACJ,GAAG,CACF,CAAC,GAAG,EAAE,CAAC,KACL,qBAAqB,CAAC,mBAAmB,GAAG,CAAC,OAAO,mBAAmB,GAAG,CAAC,OAAO,WAAW,CAChG;SACA,IAAI,CAAC,EAAE,CAAC;QACX,EACN,EAAE,IAEL,CAAC;EAEF,IAAI,OAAO,CAAC,MAAM,EAAE;IAClB,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,uBAAuB,CAAC,CAAC,CAAC,GAAG,CAC9D,CAAC,GAAgB;MACf,MAAM,QAAQ,GAAG,OAAO,CAAC,IAAI,CAC3B,CAAC,GAAG,EAAE,CAAC,KAAK,GAAG,CAAC,OAAO,CAAC,GAAG,KAAK,CAAC,CAAC,QAAQ,EAAE,CAC7C,CAAC;MACF,IAAI,QAAQ,IAAI,QAAQ,CAAC,OAAO,EAAE;QAChC,GAAG,CAAC,gBAAgB,CAAC,OAAO,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;OACjD;KACF,CACF,CAAC;GACH;EAED,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;EAClC,OAAO,MAAM,CAAC;AAChB;;;;","names":[],"sources":["./src/components/alert/alert.helpers.ts","./src/components/dialog/dialog.helpers.ts"],"sourcesContent":["import { Color, AlertToastPosition } from '../../interface';\nimport { raf } from '../../utils';\n\ninterface ImperativeAlertOptions {\n color?: Color;\n duration?: number;\n closable?: boolean;\n}\n\ninterface ImperativeAlertButton {\n classes: string;\n content: string;\n handler?: (e: MouseEvent) => void;\n}\n\nconst alertContent = (\n message: string,\n buttons: ImperativeAlertButton[] = []\n) => {\n return `${message}\n ${\n buttons.length\n ? buttons\n .map(\n (btn, i) =>\n `<button data-btn=\"${i}\" class=\"button ${btn.classes}\" slot=\"footer\">${btn.content}</button>`\n )\n .join('')\n : ''\n }`;\n};\n\nconst addBtnHandlers = (\n alert: HTMLNanoAlertElement,\n buttons: ImperativeAlertButton[] = []\n) => {\n if (buttons.length) {\n Array.from(alert.querySelectorAll('button[slot=\"footer\"]')).map(\n (btn: HTMLElement) => {\n const foundBtn = buttons.find(\n (_fb, i) => btn.dataset.btn === i.toString()\n );\n if (foundBtn && foundBtn.handler) {\n btn.addEventListener('click', foundBtn.handler);\n }\n }\n );\n }\n};\n\n/*\n `nano-alert` helper to create toast notifications imperatively.\n * @param message - a JS template string e.g. `<h4>Hello</h4> ${aVariable}`\n * @param position - the position of the toast. Options are 'tr', 'tl', 'bl' & 'br'\n * @param icon - name for the `nano-icon`\n * @param alertOptions - { color: Color, duration: number, closable: boolean }\n * @returns `Promise<void>`\n /\nexport async function nanoShowToast(\n message: string,\n position: AlertToastPosition = 'tr',\n icon?: string \| undefined,\n alertOptions?: ImperativeAlertOptions,\n buttons: ImperativeAlertButton[] = []\n) {\n const opts: ImperativeAlertOptions = {\n color: 'primary',\n duration: 3000,\n closable: true,\n ...alertOptions,\n };\n icon = icon \|\| 'light/info-circle';\n const alert: HTMLNanoAlertElement = Object.assign(\n document.createElement('nano-alert'),\n {\n ...opts,\n open: false,\n innerHTML: `\n <nano-icon name=\"${icon}\" slot=\"icon\"></nano-icon>\n ${alertContent(message, buttons)}\n `,\n }\n );\n addBtnHandlers(alert, buttons);\n\n document.body.appendChild(alert);\n return new Promise<HTMLNanoAlertElement>((resolve) => {\n raf(async (_) => {\n await alert.toast(position);\n resolve(alert);\n });\n });\n}\n\n/\n `nano-alert` helper to create alert notifications imperatively.\n * @param message - a JS template string e.g. `<h4>Hello</h4> ${aVariable}`\n * @param buttons - { classes: string; content: string; handler: () => {} }[]\n * @param icon - name for the `nano-icon`\n * @param label - descriptive label for assitive technology\n * @param alertOptions - { color: Color, duration: number, closable: boolean }\n * @returns `Promise<void>`\n /\nexport function nanoShowAlert(\n message: string,\n buttons: ImperativeAlertButton[] = [],\n label: string,\n icon: string \| undefined = 'light/info-circle',\n alertOptions: ImperativeAlertOptions = {}\n) {\n const opts: ImperativeAlertOptions = {\n color: 'primary',\n duration: Infinity,\n closable: false,\n ...alertOptions,\n };\n icon = icon \|\| 'light/info-circle';\n const alert: HTMLNanoAlertElement = Object.assign(\n document.createElement('nano-alert'),\n {\n ...opts,\n open: false,\n innerHTML: `\n ${icon ? `<nano-icon name=\"${icon}\" slot=\"icon\"></nano-icon>` : ''}\n ${alertContent(message, buttons)}\n `,\n }\n );\n addBtnHandlers(alert, buttons);\n\n document.body.appendChild(alert);\n return new Promise<HTMLNanoAlertElement>((resolve) => {\n ~~raf~~(async (_) => {\n await alert.alert(label);\n resolve(alert);\n });\n });\n}\n","interface ImperativeDialogOptions {\n noUserDismiss: boolean;\n noHeader?: boolean;\n noFooter?: boolean;\n label: string;\n}\n/\n `nano-dialog` helper to create dialog modals imperatively.\n * @param body - a JS template string e.g. `<h4>Hello</h4> ${aVariable}`\n * @param buttons - { classes: string; content: string; handler: () => {} }[]\n * @param dialogOptions - { noUserDismiss: boolean, noHeader?: boolean, noFooter?: boolean, label: string }\n * @returns `Promise<void>`\n */\nexport function nanoCreateDialog(\n body: string,\n buttons: { classes: string; content: string; handler: () => {} }[] = [],\n dialogOptions: ImperativeDialogOptions\n) {\n const opts: ImperativeDialogOptions = {\n noUserDismiss: false,\n label: 'Dialog',\n ...dialogOptions,\n };\n const dialog: HTMLNanoDialogElement = Object.assign(\n document.createElement('nano-dialog'),\n {\n ...opts,\n open: false,\n innerHTML: `\n ${body}\n ${\n buttons.length\n ? buttons\n .map(\n (btn, i) =>\n `<button data-btn=\"${i}\" class=\"button ${btn.classes}\" slot=\"footer\">${btn.content}</button>`\n )\n .join('')\n : ''\n }`,\n }\n );\n\n if (buttons.length) {\n Array.from(dialog.querySelectorAll('button[slot=\"footer\"]')).map(\n (btn: HTMLElement) => {\n const foundBtn = buttons.find(\n (_fb, i) => btn.dataset.btn === i.toString()\n );\n if (foundBtn && foundBtn.handler) {\n btn.addEventListener('click', foundBtn.handler);\n }\n }\n );\n }\n\n document.body.appendChild(dialog);\n return dialog;\n}\n"],"version":3}
1	+ {"file":"index.js","mappings":"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","names":[],"sources":["./src/components/alert/alert.helpers.ts","./src/components/dialog/dialog.helpers.ts"],"sourcesContent":["import { Color, AlertToastPosition } from '../../interface';\nimport { raf } from '../../utils';\n\ninterface ImperativeAlertOptions {\n color?: Color;\n duration?: number;\n closable?: boolean;\n}\n\ninterface ImperativeAlertButton {\n classes: string;\n content: string;\n handler?: (e: MouseEvent) => void;\n}\n\nconst alertContent = (\n message: string,\n buttons: ImperativeAlertButton[] = []\n) => {\n return `${message}\n ${\n buttons.length\n ? buttons\n .map(\n (btn, i) =>\n `<button data-btn=\"${i}\" class=\"button ${btn.classes}\" slot=\"footer\">${btn.content}</button>`\n )\n .join('')\n : ''\n }`;\n};\n\nconst addBtnHandlers = (\n alert: HTMLNanoAlertElement,\n buttons: ImperativeAlertButton[] = []\n) => {\n if (buttons.length) {\n Array.from(alert.querySelectorAll('button[slot=\"footer\"]')).map(\n (btn: HTMLElement) => {\n const foundBtn = buttons.find(\n (_fb, i) => btn.dataset.btn === i.toString()\n );\n if (foundBtn && foundBtn.handler) {\n btn.addEventListener('click', foundBtn.handler);\n }\n }\n );\n }\n};\n\n/*\n `nano-alert` helper to create toast notifications imperatively.\n * @param message - a JS template string e.g. `<h4>Hello</h4> ${aVariable}`\n * @param position - the position of the toast. Options are 'tr', 'tl', 'bl' & 'br'\n * @param icon - name for the `nano-icon`\n * @param alertOptions - { color: Color, duration: number, closable: boolean }\n * @returns `Promise<void>`\n /\nexport async function nanoShowToast(\n message: string,\n position: AlertToastPosition = 'tr',\n icon?: string \| undefined,\n alertOptions?: ImperativeAlertOptions,\n buttons: ImperativeAlertButton[] = []\n) {\n const opts: ImperativeAlertOptions = {\n color: 'primary',\n duration: 3000,\n closable: true,\n ...alertOptions,\n };\n icon = icon \|\| 'light/info-circle';\n const alert: HTMLNanoAlertElement = Object.assign(\n document.createElement('nano-alert'),\n {\n ...opts,\n open: false,\n innerHTML: `\n <nano-icon name=\"${icon}\" slot=\"icon\"></nano-icon>\n ${alertContent(message, buttons)}\n `,\n }\n );\n addBtnHandlers(alert, buttons);\n\n document.body.appendChild(alert);\n return new Promise<HTMLNanoAlertElement>((resolve) => {\n raf(async (_) => {\n await alert.toast(position);\n resolve(alert);\n });\n });\n}\n\n/\n `nano-alert` helper to create alert notifications imperatively.\n * @param message - a JS template string e.g. `<h4>Hello</h4> ${aVariable}`\n * @param buttons - { classes: string; content: string; handler: () => {} }[]\n * @param icon - name for the `nano-icon`\n * @param label - descriptive label for assitive technology\n * @param alertOptions - { color: Color, duration: number, closable: boolean }\n * @returns `Promise<void>`\n /\nexport function nanoShowAlert(\n message: string,\n buttons: ImperativeAlertButton[] = [],\n label: string,\n icon: string \| undefined = 'light/info-circle',\n alertOptions: ImperativeAlertOptions = {}\n) {\n const opts: ImperativeAlertOptions = {\n color: 'primary',\n duration: Infinity,\n closable: false,\n ...alertOptions,\n };\n icon = icon \|\| 'light/info-circle';\n const alert: HTMLNanoAlertElement = Object.assign(\n document.createElement('nano-alert'),\n {\n ...opts,\n open: false,\n innerHTML: `\n ${icon ? `<nano-icon name=\"${icon}\" slot=\"icon\"></nano-icon>` : ''}\n ${alertContent(message, buttons)}\n `,\n }\n );\n addBtnHandlers(alert, buttons);\n\n document.body.appendChild(alert);\n return new Promise<HTMLNanoAlertElement>((resolve) => {\n setTimeout(async (_) => {\n await alert.alert(label);\n resolve(alert);\n }, 100);\n });\n}\n","interface ImperativeDialogOptions {\n noUserDismiss: boolean;\n noHeader?: boolean;\n noFooter?: boolean;\n label: string;\n}\n/\n `nano-dialog` helper to create dialog modals imperatively.\n * @param body - a JS template string e.g. `<h4>Hello</h4> ${aVariable}`\n * @param buttons - { classes: string; content: string; handler: () => {} }[]\n * @param dialogOptions - { noUserDismiss: boolean, noHeader?: boolean, noFooter?: boolean, label: string }\n * @returns `Promise<void>`\n */\nexport function nanoCreateDialog(\n body: string,\n buttons: { classes: string; content: string; handler: () => {} }[] = [],\n dialogOptions?: ImperativeDialogOptions\n) {\n const opts: ImperativeDialogOptions = {\n noUserDismiss: false,\n label: 'Dialog',\n ...dialogOptions,\n };\n const dialog: HTMLNanoDialogElement = Object.assign(\n document.createElement('nano-dialog'),\n {\n ...opts,\n open: false,\n innerHTML: `\n ${body}\n ${\n buttons.length\n ? buttons\n .map(\n (btn, i) =>\n `<button data-btn=\"${i}\" class=\"button ${btn.classes}\" slot=\"footer\">${btn.content}</button>`\n )\n .join('')\n : ''\n }`,\n }\n );\n\n if (buttons.length) {\n Array.from(dialog.querySelectorAll('button[slot=\"footer\"]')).map(\n (btn: HTMLElement) => {\n const foundBtn = buttons.find(\n (_fb, i) => btn.dataset.btn === i.toString()\n );\n if (foundBtn && foundBtn.handler) {\n btn.addEventListener('click', foundBtn.handler);\n }\n }\n );\n }\n\n document.body.appendChild(dialog);\n return dialog;\n}\n"],"version":3}

package/dist/esm/loader.js CHANGED Viewed

@@ -28,7 +28,7 @@ const patchEsm = () => {
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
-  return bootstrapLazy(JSON.parse("[[\"nano-global-nav\",[[1,\"nano-global-nav\",{\"env\":[1],\"ssoRedirect\":[1,\"sso-redirect\"],\"getMyAccountData\":[4,\"get-my-account-data\"],\"activeMyAccountSections\":[16],\"showSearch\":[4,\"show-search\"],\"showLogo\":[4,\"show-logo\"],\"logoUrl\":[1,\"logo-url\"],\"searchIndeces\":[16],\"myAccountUser\":[1040],\"searchAppId\":[1025,\"search-app-id\"],\"searchApiKey\":[1025,\"search-api-key\"],\"searchValue\":[1025,\"search-value\"],\"searchIndex\":[1025,\"search-index\"],\"cartCount\":[1026,\"cart-count\"],\"msgCount\":[1026,\"msg-count\"],\"cartUrl\":[1025,\"cart-url\"],\"msgUrl\":[1025,\"msg-url\"],\"hasLoggedinSlot\":[32],\"hasSiteSlot\":[32],\"hasPromotionSlot\":[32],\"aboutSlotLen\":[32],\"iconSlotLen\":[32],\"mainSlotLen\":[32],\"overflowSlotLen\":[32],\"searchSlotLen\":[32],\"internalSearchIndeces\":[32],\"thresholdReady\":[32],\"remoteDataReady\":[32],\"ready\":[32],\"isResizing\":[32],\"intersectRatio\":[32],\"threshold\":[32],\"modalOpen\":[32],\"modalIsOpen\":[32],\"searchBarShown\":[32],\"scrollingUp\":[32],\"searchLoading\":[32],\"showAutocomplete\":[32],\"secondaryMenuOpen\":[32],\"userMenuOpen\":[32],\"menuFullScreen\":[32],\"searchValInternal\":[32],\"submitSearch\":[64]},[[0,\"nanoOpen\",\"secondaryOpen\"],[0,\"nanoClose\",\"secondaryClose\"]]]]],[\"nano-hero\",[[1,\"nano-hero\",{\"imgSrc\":[1,\"img-src\"],\"imgSrcSet\":[1,\"img-src-set\"],\"largeScreenBP\":[2,\"large-screen-b-p\"],\"theme\":[1],\"level\":[1],\"hasIconBox\":[32],\"hasScrim\":[32],\"hasSecondaryContent\":[32],\"hasQuote\":[32],\"hasBg\":[32],\"hasBackBtn\":[32],\"hasCtas\":[32],\"breadCrumbs\":[32],\"iconBoxItems\":[32]}]]],[\"nano-date-input\",[[6,\"nano-date-input\",{\"invalid\":[2564],\"helperText\":[4,\"helper-text\"],\"helperTextFormat\":[16],\"floatLabel\":[4,\"float-label\"],\"name\":[1],\"readonly\":[4],\"size\":[2],\"form\":[1],\"firstDayOfWeek\":[2,\"first-day-of-week\"],\"localization\":[16],\"disabled\":[4],\"color\":[1],\"autofocus\":[4],\"clearInput\":[4,\"clear-input\"],\"label\":[1],\"placeholder\":[1025],\"value\":[1537],\"validateOn\":[1,\"validate-on\"],\"showInlineError\":[516,\"show-inline-error\"],\"dateOrder\":[1,\"date-order\"],\"required\":[4],\"min\":[1],\"max\":[1],\"hideLabel\":[4,\"hide-label\"],\"picker\":[4],\"initialPickerDate\":[1,\"initial-picker-date\"],\"pickerOpen\":[1540,\"picker-open\"],\"closeAfterPicked\":[4,\"close-after-picked\"],\"pattern\":[32],\"inputValue\":[32],\"_invalid\":[32],\"reportValidity\":[64],\"setFocus\":[64],\"getInputElement\":[64],\"showError\":[64]}]]],[\"nano-dialog\",[[1,\"nano-dialog\",{\"showRibbon\":[4,\"show-ribbon\"],\"open\":[1540],\"label\":[1],\"noHeader\":[4,\"no-header\"],\"noFooter\":[4,\"no-footer\"],\"noUserDismiss\":[4,\"no-user-dismiss\"],\"storeId\":[1,\"store-id\"],\"storeMethod\":[1,\"store-method\"],\"isVisible\":[32],\"noDismiss\":[32],\"hasFooter\":[32],\"show\":[64],\"hide\":[64]}]]],[\"nano-file-upload\",[[6,\"nano-file-upload\",{\"name\":[1],\"accept\":[1],\"capture\":[1],\"maxFileSize\":[2,\"max-file-size\"],\"maxFiles\":[2,\"max-files\"],\"label\":[1],\"placeholder\":[1],\"hideLabel\":[4,\"hide-label\"],\"required\":[4],\"disabled\":[516],\"clearInput\":[4,\"clear-input\"],\"showInlineError\":[516,\"show-inline-error\"],\"validateOn\":[1025,\"validate-on\"],\"invalid\":[2564],\"files\":[2064],\"value\":[6145],\"hasHelperSlot\":[32],\"hasLabelSlot\":[32],\"errorMessage\":[32],\"isDragging\":[32],\"fileList\":[32],\"hasFocus\":[32],\"_invalid\":[32],\"reportValidity\":[64],\"setFocus\":[64],\"getInputElement\":[64],\"showError\":[64]},[[8,\"click\",\"globalClickHandler\"],[8,\"keydown\",\"globalKeydownHandler\"]]]]],[\"nano-alert\",[[1,\"nano-alert\",{\"open\":[1540],\"closable\":[516],\"color\":[513],\"duration\":[2],\"isModal\":[32],\"isToast\":[32],\"isShowing\":[32],\"label\":[32],\"show\":[64],\"hide\":[64],\"toast\":[64],\"alert\":[64]}]]],[\"nano-global-search-results\",[[1,\"nano-global-search-results\",{\"algoliaEle\":[32],\"currentWidth\":[32],\"apiKey\":[32],\"appId\":[32],\"index\":[32]},[[16,\"nanoSearchReset\",\"handleGlobalNavReset\"],[16,\"nanoSearchResult\",\"handleGlobalNavSearch\"],[0,\"nanoChange\",\"handleReorder\"],[0,\"nanoResultsShown\",\"attachListeners\"],[16,\"nanoNewResults\",\"attachResultListeners\"]]]]],[\"nano-menu-drawer\",[[1,\"nano-menu-drawer\",{\"open\":[4],\"saveState\":[4,\"save-state\"],\"hideWidth\":[2,\"hide-width\"],\"hideHeight\":[4,\"hide-height\"],\"reset\":[32],\"widthOk\":[32],\"heightOk\":[32],\"isLoading\":[32],\"hide\":[32]},[[0,\"nanoOpen\",\"cancelNavItemEvents\"],[0,\"nanoClose\",\"cancelNavItemEvents\"],[16,\"nanoIsReady\",\"handleGlobalNavReady\"]]]]],[\"nano-tab-group\",[[1,\"nano-tab-group\",{\"placement\":[1],\"noScrollControls\":[4,\"no-scroll-controls\"],\"color\":[1],\"storeId\":[1,\"store-id\"],\"storeMethod\":[1,\"store-method\"],\"hasScrollControls\":[32],\"hideControlRight\":[32],\"hideControlLeft\":[32],\"isLegacy\":[32],\"tab\":[32],\"show\":[64]}]]],[\"nano-accordion\",[[1,\"nano-accordion\",{\"color\":[1],\"itemOpened\":[32]},[[0,\"nanoOpened\",\"onToggleHandler\"],[0,\"nanoClosed\",\"onClosedHandler\"]]]]],[\"nano-algolia-filter\",[[1,\"nano-algolia-filter\",{\"filterName\":[1,\"filter-name\"],\"value\":[1025],\"operator\":[1],\"storeId\":[1,\"store-id\"],\"storeMethod\":[1,\"store-method\"],\"changeEvent\":[32],\"internalValue\":[32],\"showFilter\":[32],\"indexResults\":[32],\"filterChanged\":[32],\"facets\":[32],\"tplRenderFn\":[32],\"globalStoreMethod\":[32]},[[0,\"nanoChange\",\"handleChangeEvent\"],[0,\"change\",\"handleChangeEvent\"]]]]],[\"nano-algolia-input\",[[1,\"nano-algolia-input\",{\"appId\":[1,\"app-id\"],\"apiKey\":[1,\"api-key\"],\"searchIndex\":[1040],\"searchIndexName\":[1,\"search-index-name\"],\"minChars\":[2,\"min-chars\"],\"autoEmit\":[4,\"auto-emit\"],\"browseIndex\":[1028,\"browse-index\"],\"storeId\":[1,\"store-id\"],\"storeMethod\":[1,\"store-method\"],\"searchStr\":[32],\"algoliaIndex\":[32],\"currentResults\":[32],\"search\":[64]},[[0,\"nanoChange\",\"searchSubmit\"]]]]],[\"nano-algolia-pagination\",[[1,\"nano-algolia-pagination\",{\"maxToShow\":[2,\"max-to-show\"],\"currentPage\":[32],\"canGoPrev\":[32],\"canGoNext\":[32],\"show\":[32],\"tplRenderFn\":[32],\"indexResults\":[32],\"infiniteScroll\":[32],\"nextPage\":[64],\"prevPage\":[64],\"goToPage\":[64]}]]],[\"nano-algolia-results\",[[1,\"nano-algolia-results\",{\"infiniteScroll\":[4,\"infinite-scroll\"],\"appendPages\":[4,\"append-pages\"],\"showResults\":[32],\"tplRenderFn\":[32],\"results\":[32],\"indexResults\":[32],\"resultsPage\":[32],\"changeEvent\":[32],\"facets\":[32],\"isLoading\":[32]}]]],[\"nano-aspect-ratio\",[[1,\"nano-aspect-ratio\",{\"aspectRatio\":[1,\"aspect-ratio\"],\"fit\":[1]}]]],[\"nano-checkbox\",[[6,\"nano-checkbox\",{\"hasFocus\":[1540,\"has-focus\"],\"checked\":[1540],\"disabled\":[516],\"value\":[1],\"name\":[1],\"required\":[4],\"type\":[513],\"label\":[1],\"indeterminate\":[1540],\"invalid\":[2564],\"color\":[1],\"_invalid\":[32],\"inputType\":[32],\"getInputElement\":[64],\"reportValidity\":[64],\"setError\":[64],\"setFocus\":[64],\"removeFocus\":[64]}]]],[\"nano-checkbox-group\",[[6,\"nano-checkbox-group\",{\"validateOn\":[1025,\"validate-on\"],\"showInlineError\":[4,\"show-inline-error\"],\"min\":[2],\"max\":[2],\"disabled\":[516],\"legend\":[1],\"invalid\":[2564],\"checkboxes\":[32],\"nativeCbs\":[32],\"errorMessage\":[32],\"showErrorMsg\":[32],\"hasHelperSlot\":[32],\"reportValidity\":[64]},[[0,\"nanoChange\",\"handleCbChange\"]]]]],[\"nano-details\",[[1,\"nano-details\",{\"label\":[1],\"open\":[1540],\"noHandle\":[4,\"no-handle\"],\"iconRotation\":[2,\"icon-rotation\"],\"color\":[1],\"isLoading\":[32]}]]],[\"nano-drawer\",[[1,\"nano-drawer\",{\"open\":[1540],\"label\":[1],\"placement\":[1],\"contained\":[4],\"noHeader\":[4,\"no-header\"],\"type\":[1],\"contentSelector\":[1,\"content-selector\"],\"hasFooter\":[32],\"isVisible\":[32],\"show\":[64],\"hide\":[64]}]]],[\"nano-menu\",[[6,\"nano-menu\",{\"setFocus\":[64],\"removeFocus\":[64]}]]],[\"nano-range\",[[6,\"nano-range\",{\"color\":[1],\"debounce\":[2],\"name\":[1],\"dualKnobs\":[4,\"dual-knobs\"],\"min\":[2],\"max\":[2],\"pin\":[4],\"snaps\":[4],\"step\":[2],\"ticks\":[4],\"disabled\":[4],\"value\":[1026],\"ratioA\":[32],\"ratioB\":[32],\"pressedKnob\":[32]}]]],[\"nano-rating\",[[2,\"nano-rating\",{\"value\":[1538],\"max\":[2],\"precision\":[2],\"readonly\":[4],\"disabled\":[4],\"name\":[1],\"symbolName\":[1,\"symbol-name\"],\"symbol\":[16],\"hoverValue\":[32],\"isHovering\":[32],\"setFocus\":[64],\"removeFocus\":[64]}]]],[\"nano-select-option\",[[1,\"nano-select-option\",{\"label\":[1],\"value\":[1],\"selected\":[4],\"disabled\":[4]}]]],[\"nano-slide\",[[1,\"nano-slide\",{\"ready\":[1540]}]]],[\"nano-slides\",[[1,\"nano-slides\",{\"options\":[1040],\"navbtns\":[4],\"pager\":[4],\"fullscreenbtn\":[4],\"fullscreen\":[1540],\"animation\":[513],\"currentSlide\":[1538,\"current-slide\"],\"autoplay\":[8],\"ready\":[1540],\"iCurrentSlide\":[32],\"slidesReady\":[32],\"didInit\":[32],\"update\":[64],\"updateAutoHeight\":[64],\"slideTo\":[64],\"slideNext\":[64],\"slidePrev\":[64],\"getActiveIndex\":[64],\"length\":[64],\"isEnd\":[64],\"isBeginning\":[64],\"startAutoplay\":[64],\"stopAutoplay\":[64],\"lockSwipes\":[64],\"getflickity\":[64],\"reload\":[64]}]]],[\"nano-tab\",[[1,\"nano-tab\",{\"panel\":[513],\"active\":[516],\"disabled\":[516],\"setFocus\":[64],\"removeFocus\":[64]}]]],[\"nano-tab-content\",[[1,\"nano-tab-content\",{\"name\":[1],\"active\":[4]}]]],[\"nano-algolia\",[[1,\"nano-algolia\",{\"showResults\":[1028,\"show-results\"],\"resultsPage\":[1026,\"results-page\"],\"appId\":[1025,\"app-id\"],\"apiKey\":[1025,\"api-key\"],\"searchIndex\":[1040],\"searchIndexName\":[1025,\"search-index-name\"],\"listenTo\":[1,\"listen-to\"],\"query\":[1025],\"operator\":[1],\"filters\":[16],\"tplEngine\":[16],\"tplRenderFn\":[16],\"replicaIndex\":[1025,\"replica-index\"],\"browseIndex\":[1028,\"browse-index\"],\"minChars\":[2,\"min-chars\"],\"storeId\":[1,\"store-id\"],\"storeMethod\":[1,\"store-method\"],\"_dynFacetFilters\":[32],\"inputField\":[32],\"algoliaIndex\":[32],\"indeces\":[32],\"resultsEmitterEle\":[32],\"indexResults\":[32],\"filterChanged\":[32],\"currentHits\":[32],\"changeEvent\":[32],\"isLoading\":[32],\"wormholeState\":[32],\"removeFilters\":[64]},[[0,\"nanoTplUpdated\",\"onAllTplUpdate\"],[0,\"nanoPageChanged\",\"onPageChange\"],[0,\"nanoFilterChanged\",\"onFilterChange\"],[16,\"nanoChange\",\"handleInputChange\"],[16,\"change\",\"handleInputChange\"]]]]],[\"nano-tooltip\",[[1,\"nano-tooltip\",{\"content\":[1],\"placement\":[1],\"disabled\":[4],\"distance\":[2],\"open\":[1540],\"skidding\":[2],\"trigger\":[1],\"show\":[64],\"hide\":[64]}]]],[\"nano-date-picker_2\",[[1,\"nano-date-picker\",{\"selectedDate\":[1025,\"selected-date\"],\"min\":[1],\"max\":[1],\"firstDayOfWeek\":[2,\"first-day-of-week\"],\"localization\":[16],\"color\":[1],\"isDateDisabled\":[16],\"isModal\":[4,\"is-modal\"],\"firstFocusEle\":[16],\"activeFocus\":[32],\"focusedDay\":[32],\"setFocus\":[64]}],[1,\"nano-dropdown\",{\"autoOpen\":[4,\"auto-open\"],\"open\":[1540],\"closeOnSelect\":[4,\"close-on-select\"],\"containingElement\":[1040],\"tetherTo\":[16],\"placement\":[1],\"distance\":[2],\"skidding\":[2],\"hoist\":[4],\"dialogTitle\":[1,\"dialog-title\"],\"show\":[64],\"hide\":[64]},[[0,\"nanoFocus\",\"menuFocus\"],[0,\"nanoOpen\",\"secondaryOpen\"],[0,\"nanoClose\",\"secondaryClose\"],[0,\"nanoSelect\",\"handlePanelSelect\"]]]]],[\"nano-nav-item_2\",[[6,\"nano-select\",{\"invalid\":[1540],\"color\":[1],\"autofocus\":[4],\"disabled\":[516],\"validateOn\":[1025,\"validate-on\"],\"showInlineError\":[516,\"show-inline-error\"],\"label\":[1],\"hideLabel\":[4,\"hide-label\"],\"floatLabel\":[4,\"float-label\"],\"multiple\":[4],\"name\":[1],\"placeholder\":[1],\"readonly\":[4],\"required\":[4],\"size\":[2],\"max\":[2],\"min\":[2],\"form\":[1],\"allowCustomValues\":[4,\"allow-custom-values\"],\"value\":[1025],\"options\":[1040],\"clearSelect\":[4,\"clear-select\"],\"mask\":[4],\"debounce\":[2],\"native\":[4],\"currInsertIndex\":[32],\"availOpts\":[32],\"showErrorMsg\":[32],\"errorMessage\":[32],\"hasFocus\":[32],\"listOpen\":[32],\"isLegacy\":[32],\"hasLabelSlot\":[32],\"hasHelperSlot\":[32],\"hasIconSlot\":[32],\"reportValidity\":[64],\"setFocus\":[64],\"getSelectElement\":[64],\"showError\":[64]}],[1,\"nano-nav-item\",{\"href\":[1025],\"target\":[1],\"disabled\":[4],\"open\":[1540],\"selected\":[516],\"secondaryActiveWidth\":[2,\"secondary-active-width\"],\"secondaryFallback\":[16],\"closeOnBlur\":[4,\"close-on-blur\"],\"didOpen\":[32],\"isInGlobalNav\":[32],\"isInMenuDrawer\":[32],\"isInMenu\":[32],\"isLegacy\":[32],\"hasFocus\":[32],\"setFocus\":[64]}]]],[\"nano-input\",[[6,\"nano-input\",{\"invalid\":[2564],\"color\":[1],\"accept\":[1],\"autocapitalise\":[1],\"autocomplete\":[1],\"autocorrect\":[1],\"autofocus\":[4],\"clearInput\":[4,\"clear-input\"],\"clearOnEdit\":[4,\"clear-on-edit\"],\"debounce\":[2],\"disabled\":[516],\"inputmode\":[1],\"validateOn\":[1025,\"validate-on\"],\"showInlineError\":[516,\"show-inline-error\"],\"label\":[1],\"hideLabel\":[4,\"hide-label\"],\"floatLabel\":[4,\"float-label\"],\"max\":[1],\"maxlength\":[2],\"min\":[1],\"minlength\":[2],\"multiple\":[4],\"name\":[1],\"pattern\":[1],\"placeholder\":[1],\"readonly\":[4],\"required\":[4],\"spellcheck\":[4],\"step\":[1],\"size\":[2],\"type\":[1],\"form\":[1],\"value\":[1025],\"resize\":[1],\"rows\":[2],\"showCharCount\":[4,\"show-char-count\"],\"hasFocus\":[32],\"isLegacy\":[32],\"hasLabelSlot\":[32],\"hasButtonSlot\":[32],\"hasHelperSlot\":[32],\"_invalid\":[32],\"reportValidity\":[64],\"setFocus\":[64],\"getInputElement\":[64],\"showError\":[64]},[[16,\"reset\",\"onReset\"]]]]],[\"nano-spinner\",[[1,\"nano-spinner\",{\"type\":[1],\"overlay\":[516],\"hasText\":[32]}]]],[\"nano-sticker\",[[1,\"nano-sticker\",{\"autoResize\":[4,\"auto-resize\"],\"isSticky\":[1028,\"is-sticky\"],\"offset\":[1026],\"position\":[1],\"quietMode\":[1,\"quiet-mode\"],\"hideOnNewStickers\":[4,\"hide-on-new-stickers\"],\"breakPointMax\":[2,\"break-point-max\"],\"breakPointMin\":[2,\"break-point-min\"],\"scrollParent\":[1040],\"stickTo\":[1,\"stick-to\"],\"isStuck\":[32],\"isRootSticker\":[32],\"hide\":[32],\"scrollHide\":[32],\"multiStickerHide\":[32],\"scrollingTo\":[32],\"quietModeIsOn\":[32],\"stuckCounter\":[32],\"stickerIndex\":[32],\"stickToEle\":[32],\"triggerPos\":[32],\"trigger\":[32],\"_offset\":[32],\"isHiding\":[64],\"isSticking\":[64],\"setTriggerPos\":[64],\"getTriggerPos\":[64],\"pauseHiding\":[64]}]]],[\"nano-icon-button\",[[2,\"nano-icon-button\",{\"iconName\":[1,\"icon-name\"],\"iconSrc\":[1,\"icon-src\"],\"type\":[513],\"name\":[513],\"value\":[513],\"label\":[1],\"disabled\":[516],\"href\":[1],\"target\":[1]}]]],[\"nano-resize-observe_2\",[[1,\"nano-resize-observe\",{\"states\":[1],\"currentWidth\":[32],\"currentHeight\":[32],\"classNames\":[32]}],[1,\"nano-skeleton\",{\"animated\":[4]}]]],[\"nano-grid_3\",[[1,\"nano-img\",{\"alt\":[1],\"src\":[1],\"srcSet\":[1,\"src-set\"],\"lazy\":[4],\"background\":[4],\"autoHeight\":[1,\"auto-height\"],\"loadSrc\":[32],\"loadError\":[32],\"hasLoaded\":[32],\"imgStates\":[32],\"_src\":[32]}],[1,\"nano-grid\",{\"sSize\":[2,\"s-size\"],\"mSize\":[2,\"m-size\"],\"lSize\":[2,\"l-size\"],\"xlSize\":[2,\"xl-size\"],\"sCols\":[2,\"s-cols\"],\"mCols\":[2,\"m-cols\"],\"lCols\":[2,\"l-cols\"],\"xlCols\":[2,\"xl-cols\"],\"xxlCols\":[2,\"xxl-cols\"],\"showHelper\":[516,\"show-helper\"],\"contentPanel\":[516,\"content-panel\"],\"fullHeight\":[516,\"full-height\"],\"ready\":[32],\"isSmall\":[32],\"isMedium\":[32],\"isLarge\":[32],\"isXL\":[32],\"isXXL\":[32]}],[1,\"nano-grid-item\",{\"gridStates\":[1,\"grid-states\"],\"changeBP\":[64]}]]],[\"nano-icon\",[[1,\"nano-icon\",{\"color\":[1],\"ariaLabel\":[1537,\"aria-label\"],\"flipRtl\":[4,\"flip-rtl\"],\"name\":[1],\"src\":[1],\"icon\":[8],\"size\":[1],\"lazy\":[4],\"svgContent\":[32],\"isVisible\":[32],\"isLoading\":[32]}]]]]"), options);
+  return bootstrapLazy(JSON.parse("[[\"nano-global-nav\",[[1,\"nano-global-nav\",{\"env\":[1],\"ssoRedirect\":[1,\"sso-redirect\"],\"getMyAccountData\":[4,\"get-my-account-data\"],\"activeMyAccountSections\":[16],\"showSearch\":[4,\"show-search\"],\"showLogo\":[4,\"show-logo\"],\"logoUrl\":[1,\"logo-url\"],\"searchIndeces\":[16],\"myAccountUser\":[1040],\"searchAppId\":[1025,\"search-app-id\"],\"searchApiKey\":[1025,\"search-api-key\"],\"searchValue\":[1025,\"search-value\"],\"searchIndex\":[1025,\"search-index\"],\"cartCount\":[1026,\"cart-count\"],\"msgCount\":[1026,\"msg-count\"],\"cartUrl\":[1025,\"cart-url\"],\"msgUrl\":[1025,\"msg-url\"],\"hasLoggedinSlot\":[32],\"hasSiteSlot\":[32],\"hasPromotionSlot\":[32],\"aboutSlotLen\":[32],\"iconSlotLen\":[32],\"mainSlotLen\":[32],\"overflowSlotLen\":[32],\"searchSlotLen\":[32],\"internalSearchIndeces\":[32],\"thresholdReady\":[32],\"remoteDataReady\":[32],\"ready\":[32],\"isResizing\":[32],\"intersectRatio\":[32],\"threshold\":[32],\"modalOpen\":[32],\"modalIsOpen\":[32],\"searchBarShown\":[32],\"scrollingUp\":[32],\"searchLoading\":[32],\"showAutocomplete\":[32],\"secondaryMenuOpen\":[32],\"userMenuOpen\":[32],\"menuFullScreen\":[32],\"searchValInternal\":[32],\"submitSearch\":[64]},[[0,\"nanoOpen\",\"secondaryOpen\"],[0,\"nanoClose\",\"secondaryClose\"]]]]],[\"nano-hero\",[[1,\"nano-hero\",{\"imgSrc\":[1,\"img-src\"],\"imgSrcSet\":[1,\"img-src-set\"],\"largeScreenBP\":[2,\"large-screen-b-p\"],\"theme\":[1],\"level\":[1],\"gridSizes\":[32],\"hasIconBox\":[32],\"hasScrim\":[32],\"hasSecondaryContent\":[32],\"hasQuote\":[32],\"hasBg\":[32],\"hasBackBtn\":[32],\"hasCtas\":[32],\"breadCrumbs\":[32],\"iconBoxItems\":[32]}]]],[\"nano-date-input\",[[6,\"nano-date-input\",{\"invalid\":[2564],\"helperText\":[4,\"helper-text\"],\"helperTextFormat\":[16],\"floatLabel\":[4,\"float-label\"],\"name\":[1],\"readonly\":[4],\"size\":[2],\"form\":[1],\"firstDayOfWeek\":[2,\"first-day-of-week\"],\"localization\":[16],\"disabled\":[4],\"color\":[1],\"autofocus\":[4],\"clearInput\":[4,\"clear-input\"],\"label\":[1],\"placeholder\":[1025],\"value\":[1537],\"validateOn\":[1,\"validate-on\"],\"showInlineError\":[516,\"show-inline-error\"],\"dateOrder\":[1,\"date-order\"],\"required\":[4],\"min\":[1],\"max\":[1],\"hideLabel\":[4,\"hide-label\"],\"picker\":[4],\"initialPickerDate\":[1,\"initial-picker-date\"],\"pickerOpen\":[1540,\"picker-open\"],\"closeAfterPicked\":[4,\"close-after-picked\"],\"pattern\":[32],\"inputValue\":[32],\"_invalid\":[32],\"reportValidity\":[64],\"setFocus\":[64],\"getInputElement\":[64],\"showError\":[64]}]]],[\"nano-dialog\",[[1,\"nano-dialog\",{\"showRibbon\":[4,\"show-ribbon\"],\"open\":[1540],\"label\":[1],\"noHeader\":[4,\"no-header\"],\"noFooter\":[4,\"no-footer\"],\"noUserDismiss\":[4,\"no-user-dismiss\"],\"storeId\":[1,\"store-id\"],\"storeMethod\":[1,\"store-method\"],\"isVisible\":[32],\"noDismiss\":[32],\"hasFooter\":[32],\"show\":[64],\"hide\":[64]}]]],[\"nano-file-upload\",[[6,\"nano-file-upload\",{\"name\":[1],\"accept\":[1],\"capture\":[1],\"maxFileSize\":[2,\"max-file-size\"],\"maxFiles\":[2,\"max-files\"],\"label\":[1],\"placeholder\":[1],\"hideLabel\":[4,\"hide-label\"],\"required\":[4],\"disabled\":[516],\"clearInput\":[4,\"clear-input\"],\"showInlineError\":[516,\"show-inline-error\"],\"validateOn\":[1025,\"validate-on\"],\"invalid\":[2564],\"files\":[2064],\"value\":[6145],\"hasHelperSlot\":[32],\"hasLabelSlot\":[32],\"errorMessage\":[32],\"isDragging\":[32],\"fileList\":[32],\"hasFocus\":[32],\"_invalid\":[32],\"reportValidity\":[64],\"setFocus\":[64],\"getInputElement\":[64],\"showError\":[64]},[[8,\"click\",\"globalClickHandler\"],[8,\"keydown\",\"globalKeydownHandler\"]]]]],[\"nano-alert\",[[1,\"nano-alert\",{\"open\":[1540],\"closable\":[516],\"color\":[513],\"duration\":[2],\"isModal\":[32],\"isToast\":[32],\"isShowing\":[32],\"label\":[32],\"show\":[64],\"hide\":[64],\"toast\":[64],\"alert\":[64]}]]],[\"nano-global-search-results\",[[1,\"nano-global-search-results\",{\"algoliaEle\":[32],\"currentWidth\":[32],\"apiKey\":[32],\"appId\":[32],\"index\":[32]},[[16,\"nanoSearchReset\",\"handleGlobalNavReset\"],[16,\"nanoSearchResult\",\"handleGlobalNavSearch\"],[0,\"nanoChange\",\"handleReorder\"],[0,\"nanoResultsShown\",\"attachListeners\"],[16,\"nanoNewResults\",\"attachResultListeners\"]]]]],[\"nano-tab\",[[1,\"nano-tab\",{\"panel\":[513],\"active\":[516],\"disabled\":[516],\"closable\":[4],\"setFocus\":[64],\"removeFocus\":[64]}]]],[\"nano-menu-drawer\",[[1,\"nano-menu-drawer\",{\"open\":[4],\"saveState\":[4,\"save-state\"],\"hideWidth\":[2,\"hide-width\"],\"hideHeight\":[4,\"hide-height\"],\"reset\":[32],\"widthOk\":[32],\"heightOk\":[32],\"isLoading\":[32],\"hide\":[32]},[[0,\"nanoOpen\",\"cancelNavItemEvents\"],[0,\"nanoClose\",\"cancelNavItemEvents\"],[16,\"nanoIsReady\",\"handleGlobalNavReady\"]]]]],[\"nano-tab-group\",[[1,\"nano-tab-group\",{\"placement\":[1],\"noScrollControls\":[4,\"no-scroll-controls\"],\"color\":[1],\"storeId\":[1,\"store-id\"],\"storeMethod\":[1,\"store-method\"],\"disableSwipe\":[4,\"disable-swipe\"],\"hasScrollControls\":[32],\"hideControlRight\":[32],\"hideControlLeft\":[32],\"isLegacy\":[32],\"tab\":[32],\"show\":[64]},[[0,\"nanoTabClose\",\"handleTabClose\"]]]]],[\"nano-accordion\",[[1,\"nano-accordion\",{\"color\":[1],\"itemOpened\":[32]},[[0,\"nanoOpened\",\"onToggleHandler\"],[0,\"nanoClosed\",\"onClosedHandler\"]]]]],[\"nano-algolia-filter\",[[1,\"nano-algolia-filter\",{\"filterName\":[1,\"filter-name\"],\"value\":[1025],\"operator\":[1],\"storeId\":[1,\"store-id\"],\"storeMethod\":[1,\"store-method\"],\"changeEvent\":[32],\"internalValue\":[32],\"showFilter\":[32],\"indexResults\":[32],\"filterChanged\":[32],\"facets\":[32],\"tplRenderFn\":[32],\"globalStoreMethod\":[32]},[[0,\"nanoChange\",\"handleChangeEvent\"],[0,\"change\",\"handleChangeEvent\"]]]]],[\"nano-algolia-input\",[[1,\"nano-algolia-input\",{\"appId\":[1,\"app-id\"],\"apiKey\":[1,\"api-key\"],\"searchIndex\":[1040],\"searchIndexName\":[1,\"search-index-name\"],\"minChars\":[2,\"min-chars\"],\"autoEmit\":[4,\"auto-emit\"],\"browseIndex\":[1028,\"browse-index\"],\"storeId\":[1,\"store-id\"],\"storeMethod\":[1,\"store-method\"],\"searchStr\":[32],\"algoliaIndex\":[32],\"currentResults\":[32],\"search\":[64]},[[0,\"nanoChange\",\"searchSubmit\"]]]]],[\"nano-algolia-pagination\",[[1,\"nano-algolia-pagination\",{\"maxToShow\":[2,\"max-to-show\"],\"currentPage\":[32],\"canGoPrev\":[32],\"canGoNext\":[32],\"show\":[32],\"tplRenderFn\":[32],\"indexResults\":[32],\"infiniteScroll\":[32],\"nextPage\":[64],\"prevPage\":[64],\"goToPage\":[64]}]]],[\"nano-algolia-results\",[[1,\"nano-algolia-results\",{\"infiniteScroll\":[4,\"infinite-scroll\"],\"appendPages\":[4,\"append-pages\"],\"showResults\":[32],\"tplRenderFn\":[32],\"results\":[32],\"indexResults\":[32],\"resultsPage\":[32],\"changeEvent\":[32],\"facets\":[32],\"isLoading\":[32]}]]],[\"nano-aspect-ratio\",[[1,\"nano-aspect-ratio\",{\"aspectRatio\":[1,\"aspect-ratio\"],\"fit\":[1]}]]],[\"nano-checkbox\",[[6,\"nano-checkbox\",{\"hasFocus\":[1540,\"has-focus\"],\"checked\":[1540],\"disabled\":[516],\"value\":[1],\"name\":[1],\"required\":[4],\"type\":[513],\"label\":[1],\"indeterminate\":[1540],\"invalid\":[2564],\"color\":[1],\"_invalid\":[32],\"inputType\":[32],\"getInputElement\":[64],\"reportValidity\":[64],\"setError\":[64],\"setFocus\":[64],\"removeFocus\":[64]}]]],[\"nano-checkbox-group\",[[6,\"nano-checkbox-group\",{\"validateOn\":[1025,\"validate-on\"],\"showInlineError\":[4,\"show-inline-error\"],\"min\":[2],\"max\":[2],\"disabled\":[516],\"legend\":[1],\"invalid\":[2564],\"checkboxes\":[32],\"nativeCbs\":[32],\"errorMessage\":[32],\"showErrorMsg\":[32],\"hasHelperSlot\":[32],\"reportValidity\":[64]},[[0,\"nanoChange\",\"handleCbChange\"]]]]],[\"nano-details\",[[1,\"nano-details\",{\"label\":[1],\"open\":[1540],\"noHandle\":[4,\"no-handle\"],\"iconRotation\":[2,\"icon-rotation\"],\"color\":[1],\"isLoading\":[32]}]]],[\"nano-drawer\",[[1,\"nano-drawer\",{\"open\":[1540],\"label\":[1],\"placement\":[1],\"contained\":[4],\"noHeader\":[4,\"no-header\"],\"type\":[1],\"contentSelector\":[1,\"content-selector\"],\"hasFooter\":[32],\"isVisible\":[32],\"show\":[64],\"hide\":[64]}]]],[\"nano-range\",[[6,\"nano-range\",{\"color\":[1],\"debounce\":[2],\"name\":[1],\"dualKnobs\":[4,\"dual-knobs\"],\"min\":[2],\"max\":[2],\"pin\":[4],\"snaps\":[4],\"step\":[2],\"ticks\":[4],\"disabled\":[4],\"value\":[1026],\"ratioA\":[32],\"ratioB\":[32],\"pressedKnob\":[32]}]]],[\"nano-rating\",[[2,\"nano-rating\",{\"value\":[1538],\"max\":[2],\"precision\":[2],\"readonly\":[4],\"disabled\":[4],\"name\":[1],\"symbolName\":[1,\"symbol-name\"],\"symbol\":[16],\"hoverValue\":[32],\"isHovering\":[32],\"setFocus\":[64],\"removeFocus\":[64]}]]],[\"nano-slide\",[[1,\"nano-slide\",{\"ready\":[1540]}]]],[\"nano-slides\",[[1,\"nano-slides\",{\"options\":[1040],\"navbtns\":[4],\"pager\":[4],\"fullscreenbtn\":[4],\"fullscreen\":[1540],\"animation\":[513],\"currentSlide\":[1538,\"current-slide\"],\"autoplay\":[8],\"ready\":[1540],\"iCurrentSlide\":[32],\"slidesReady\":[32],\"didInit\":[32],\"update\":[64],\"updateAutoHeight\":[64],\"slideTo\":[64],\"slideNext\":[64],\"slidePrev\":[64],\"getActiveIndex\":[64],\"length\":[64],\"isEnd\":[64],\"isBeginning\":[64],\"startAutoplay\":[64],\"stopAutoplay\":[64],\"lockSwipes\":[64],\"getflickity\":[64],\"reload\":[64]}]]],[\"nano-tab-content\",[[1,\"nano-tab-content\",{\"name\":[513],\"active\":[516]}]]],[\"nano-spinner\",[[1,\"nano-spinner\",{\"type\":[1],\"overlay\":[516],\"hasText\":[32]}]]],[\"nano-algolia\",[[1,\"nano-algolia\",{\"showResults\":[1028,\"show-results\"],\"resultsPage\":[1026,\"results-page\"],\"appId\":[1025,\"app-id\"],\"apiKey\":[1025,\"api-key\"],\"searchIndex\":[1040],\"searchIndexName\":[1025,\"search-index-name\"],\"listenTo\":[1,\"listen-to\"],\"query\":[1025],\"operator\":[1],\"filters\":[16],\"tplEngine\":[16],\"tplRenderFn\":[16],\"replicaIndex\":[1025,\"replica-index\"],\"browseIndex\":[1028,\"browse-index\"],\"minChars\":[2,\"min-chars\"],\"storeId\":[1,\"store-id\"],\"storeMethod\":[1,\"store-method\"],\"_dynFacetFilters\":[32],\"inputField\":[32],\"algoliaIndex\":[32],\"indeces\":[32],\"resultsEmitterEle\":[32],\"indexResults\":[32],\"filterChanged\":[32],\"currentHits\":[32],\"changeEvent\":[32],\"isLoading\":[32],\"wormholeState\":[32],\"removeFilters\":[64]},[[0,\"nanoTplUpdated\",\"onAllTplUpdate\"],[0,\"nanoPageChanged\",\"onPageChange\"],[0,\"nanoFilterChanged\",\"onFilterChange\"],[16,\"nanoChange\",\"handleInputChange\"],[16,\"change\",\"handleInputChange\"]]]]],[\"nano-date-picker\",[[1,\"nano-date-picker\",{\"selectedDate\":[1025,\"selected-date\"],\"min\":[1],\"max\":[1],\"firstDayOfWeek\":[2,\"first-day-of-week\"],\"localization\":[16],\"color\":[1],\"isDateDisabled\":[16],\"isModal\":[4,\"is-modal\"],\"firstFocusEle\":[16],\"activeFocus\":[32],\"focusedDay\":[32],\"setFocus\":[64]}]]],[\"nano-tooltip\",[[1,\"nano-tooltip\",{\"content\":[1],\"placement\":[1],\"disabled\":[4],\"distance\":[2],\"open\":[1540],\"skidding\":[2],\"trigger\":[1],\"show\":[64],\"hide\":[64]}]]],[\"nano-nav-item_2\",[[6,\"nano-select\",{\"invalid\":[2564],\"color\":[1],\"autofocus\":[4],\"disabled\":[516],\"validateOn\":[1025,\"validate-on\"],\"showInlineError\":[516,\"show-inline-error\"],\"label\":[1],\"hideLabel\":[4,\"hide-label\"],\"floatLabel\":[4,\"float-label\"],\"multiple\":[4],\"name\":[1],\"placeholder\":[1],\"readonly\":[516],\"required\":[4],\"size\":[2],\"max\":[2],\"min\":[2],\"form\":[1],\"allowCustomValues\":[4,\"allow-custom-values\"],\"value\":[6145],\"options\":[6160],\"clearSelect\":[4,\"clear-select\"],\"mask\":[4],\"debounce\":[2],\"dropDownConfig\":[1040],\"currInsertIndex\":[32],\"showErrorMsg\":[32],\"errorMessage\":[32],\"hasFocus\":[32],\"hasLabelSlot\":[32],\"hasHelperSlot\":[32],\"inputSearchVal\":[32],\"_eOptions\":[32],\"reportValidity\":[64],\"setFocus\":[64],\"getSelectElement\":[64],\"showError\":[64]},[[17,\"mousedown\",\"handleBlur\"],[0,\"keydown\",\"handleBlur\"]]],[1,\"nano-nav-item\",{\"href\":[1025],\"target\":[1],\"disabled\":[4],\"open\":[1540],\"selected\":[516],\"secondaryActiveWidth\":[2,\"secondary-active-width\"],\"secondaryFallback\":[16],\"closeOnBlur\":[4,\"close-on-blur\"],\"didOpen\":[32],\"isInGlobalNav\":[32],\"isInMenuDrawer\":[32],\"isInMenu\":[32],\"isLegacy\":[32],\"hasFocus\":[32],\"setFocus\":[64]}]]],[\"nano-input\",[[6,\"nano-input\",{\"invalid\":[2564],\"color\":[1],\"accept\":[1],\"autocapitalise\":[1],\"autocomplete\":[1],\"autocorrect\":[1],\"autofocus\":[4],\"clearInput\":[4,\"clear-input\"],\"clearOnEdit\":[4,\"clear-on-edit\"],\"debounce\":[2],\"disabled\":[516],\"inputmode\":[1],\"validateOn\":[1025,\"validate-on\"],\"showInlineError\":[516,\"show-inline-error\"],\"label\":[1],\"hideLabel\":[4,\"hide-label\"],\"floatLabel\":[4,\"float-label\"],\"max\":[1],\"maxlength\":[2],\"min\":[1],\"minlength\":[2],\"multiple\":[4],\"name\":[1],\"pattern\":[1],\"placeholder\":[1],\"readonly\":[516],\"required\":[4],\"spellcheck\":[4],\"step\":[1],\"size\":[2],\"type\":[1],\"form\":[1],\"value\":[1025],\"resize\":[1],\"rows\":[2],\"showCharCount\":[4,\"show-char-count\"],\"hasFocus\":[32],\"hasLabelSlot\":[32],\"hasHelperSlot\":[32],\"errorMessage\":[32],\"datalist\":[32],\"_invalid\":[32],\"reportValidity\":[64],\"setFocus\":[64],\"getInputElement\":[64],\"showError\":[64]},[[16,\"reset\",\"onReset\"],[17,\"mousedown\",\"handleBlur\"],[0,\"keydown\",\"handleBlur\"]]]]],[\"nano-sticker\",[[1,\"nano-sticker\",{\"autoResize\":[4,\"auto-resize\"],\"isSticky\":[1028,\"is-sticky\"],\"offset\":[1026],\"position\":[1],\"quietMode\":[1,\"quiet-mode\"],\"hideOnNewStickers\":[4,\"hide-on-new-stickers\"],\"breakPointMax\":[2,\"break-point-max\"],\"breakPointMin\":[2,\"break-point-min\"],\"scrollParent\":[1040],\"stickTo\":[1,\"stick-to\"],\"isStuck\":[32],\"isRootSticker\":[32],\"hide\":[32],\"scrollHide\":[32],\"multiStickerHide\":[32],\"scrollingTo\":[32],\"quietModeIsOn\":[32],\"stuckCounter\":[32],\"stickerIndex\":[32],\"stickToEle\":[32],\"triggerPos\":[32],\"trigger\":[32],\"_offset\":[32],\"isHiding\":[64],\"isSticking\":[64],\"setTriggerPos\":[64],\"getTriggerPos\":[64],\"pauseHiding\":[64]}]]],[\"nano-icon-button\",[[2,\"nano-icon-button\",{\"iconName\":[1,\"icon-name\"],\"iconSrc\":[1,\"icon-src\"],\"type\":[513],\"name\":[513],\"value\":[513],\"label\":[1],\"disabled\":[516],\"href\":[1],\"target\":[1]}]]],[\"nano-resize-observe_2\",[[1,\"nano-resize-observe\",{\"states\":[1],\"currentWidth\":[32],\"currentHeight\":[32],\"classNames\":[32]}],[1,\"nano-skeleton\",{\"animated\":[4]}]]],[\"nano-grid_3\",[[1,\"nano-img\",{\"alt\":[1],\"src\":[1],\"srcSet\":[1,\"src-set\"],\"lazy\":[4],\"background\":[4],\"autoHeight\":[1,\"auto-height\"],\"loadSrc\":[32],\"loadError\":[32],\"hasLoaded\":[32],\"imgStates\":[32],\"_src\":[32]}],[1,\"nano-grid\",{\"sSize\":[2,\"s-size\"],\"mSize\":[2,\"m-size\"],\"lSize\":[2,\"l-size\"],\"xlSize\":[2,\"xl-size\"],\"sCols\":[2,\"s-cols\"],\"mCols\":[2,\"m-cols\"],\"lCols\":[2,\"l-cols\"],\"xlCols\":[2,\"xl-cols\"],\"xxlCols\":[2,\"xxl-cols\"],\"showHelper\":[516,\"show-helper\"],\"contentPanel\":[516,\"content-panel\"],\"fullHeight\":[516,\"full-height\"],\"ready\":[32],\"isSmall\":[32],\"isMedium\":[32],\"isLarge\":[32],\"isXL\":[32],\"isXXL\":[32]}],[1,\"nano-grid-item\",{\"gridStates\":[1,\"grid-states\"],\"changeBP\":[64]}]]],[\"nano-dropdown\",[[1,\"nano-dropdown\",{\"autoOpen\":[4,\"auto-open\"],\"open\":[1540],\"closeOnSelect\":[4,\"close-on-select\"],\"containingElement\":[1040],\"tetherTo\":[16],\"placement\":[1],\"distance\":[2],\"skidding\":[2],\"hoist\":[4],\"dialogTitle\":[1,\"dialog-title\"],\"show\":[64],\"hide\":[64]},[[0,\"nanoOpen\",\"secondaryOpen\"],[0,\"nanoClose\",\"secondaryClose\"],[0,\"nanoSelect\",\"handlePanelSelect\"]]]]],[\"nano-icon\",[[1,\"nano-icon\",{\"color\":[1],\"ariaLabel\":[1537,\"aria-label\"],\"flipRtl\":[4,\"flip-rtl\"],\"name\":[1],\"src\":[1],\"icon\":[8],\"size\":[1],\"lazy\":[4],\"svgContent\":[32],\"isVisible\":[32],\"isLoading\":[32]}]]],[\"nano-datalist_3\",[[1,\"nano-datalist\",{\"selected\":[1040],\"dropDownConfig\":[6160],\"options\":[16],\"input\":[1],\"type\":[1],\"activeOptions\":[2064],\"open\":[1028],\"disableFilter\":[4,\"disable-filter\"],\"disabled\":[4],\"actvOptEles\":[32],\"connectedInput\":[32],\"inputLabel\":[32],\"hasNoResult\":[32],\"shouldOpen\":[32],\"canOpen\":[32],\"optionIds\":[32]}],[1,\"nano-option\",{\"value\":[1537],\"label\":[1537],\"selected\":[516],\"disabled\":[516],\"filterMeta\":[1,\"filter-meta\"],\"hasFocus\":[32]},[[0,\"keydown\",\"handleKeyDown\"]]],[1,\"nano-menu\",{\"hasFocus\":[2052,\"has-focus\"],\"type\":[1],\"label\":[1],\"setFocus\":[64],\"removeFocus\":[64],\"showActiveElement\":[64],\"resetActiveItem\":[64]},[[17,\"mousedown\",\"handleBlur\"],[0,\"keydown\",\"handleBlur\"]]]]]]"), options);
   });
 };

package/dist/esm/{modal-eb0a9bb3.js → modal-215df46b.js} RENAMED Viewed

@@ -1,7 +1,7 @@
 /*!
  * Web Components for Nanopore digital Web Apps
  */
-import { g as getTabbableElements } from './tabbable-e21f860a.js';
+import { g as getTabbableElements } from './tabbable-614f515e.js';
 let activeModals = [];
 class Modal {
@@ -45,4 +45,4 @@ class Modal {
 export { Modal as M };
-//# sourceMappingURL=modal-eb0a9bb3.js.map
+//# sourceMappingURL=modal-215df46b.js.map

package/dist/esm/{modal-eb0a9bb3.js.map → modal-215df46b.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"modal-~~eb0a9bb3~~.js","mappings":";;;;;AAEA,IAAI,YAAY,GAAkB,EAAE,CAAC;MAEhB,KAAK;EAIxB,YAAY,OAAoB;IAFhC,iBAAY,GAA2B,SAAS,CAAC;IAG/C,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;IACvB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACnD,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;GACpD;EAED,QAAQ;IACN,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAChC,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;IACzD,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;GAC1D;EAED,UAAU;IACR,YAAY,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC,KAAK,KAAK,KAAK,KAAK,IAAI,CAAC,OAAO,CAAC,CAAC;IACtE,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;IAC5D,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;GAC7D;EAED,QAAQ;;IAEN,OAAO,YAAY,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC,KAAK,IAAI,CAAC,OAAO,CAAC;GAC/D;EAED,aAAa,CAAC,KAAY;IACxB,MAAM,IAAI,GAAG,KAAK,CAAC,YAAY,EAAE,CAAC;;IAGlC,IAAI,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE;MACnD,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;MAC3D,MAAM,KAAK,GACT,IAAI,CAAC,YAAY,KAAK,UAAU,GAAG,gBAAgB,CAAC,MAAM,GAAG,CAAC,GAAG,CAAC,CAAC;MACrE,gBAAgB,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC,CAAC;KACxD;GACF;EAED,aAAa,CAAC,KAAoB;;IAEhC,IAAI,KAAK,CAAC,GAAG,KAAK,KAAK,IAAI,KAAK,CAAC,QAAQ,EAAE;MACzC,IAAI,CAAC,YAAY,GAAG,UAAU,CAAC;MAC/B,UAAU,CAAC,OAAO,IAAI,CAAC,YAAY,GAAG,SAAS,CAAC,CAAC,CAAC;KACnD;GACF;;;;;","names":[],"sources":["./src/utils/modal.ts"],"sourcesContent":["import { getTabbableElements } from './tabbable';\n\nlet activeModals: HTMLElement[] = [];\n\nexport default class Modal {\n element: HTMLElement;\n tabDirection: 'forward' \| 'backward' = 'forward';\n\n constructor(element: HTMLElement) {\n this.element = element;\n this.handleFocusIn = this.handleFocusIn.bind(this);\n this.handleKeyDown = this.handleKeyDown.bind(this);\n }\n\n activate() {\n activeModals.push(this.element);\n document.addEventListener('focusin', this.handleFocusIn);\n document.addEventListener('keydown', this.handleKeyDown);\n }\n\n deactivate() {\n activeModals = activeModals.filter((modal) => modal !== this.element);\n document.removeEventListener('focusin', this.handleFocusIn);\n document.removeEventListener('keydown', this.handleKeyDown);\n }\n\n isActive() {\n // The \"active\" modal is always the most recent one shown\n return activeModals[activeModals.length - 1] === this.element;\n }\n\n handleFocusIn(event: Event) {\n const path = event.composedPath();\n\n // Trap focus so it doesn't go out of the modal's boundary\n if (this.isActive() && !path.includes(this.element)) {\n const tabbableElements = getTabbableElements(this.element);\n const index =\n this.tabDirection === 'backward' ? tabbableElements.length - 1 : 0;\n tabbableElements[index].focus({ preventScroll: true });\n }\n }\n\n handleKeyDown(event: KeyboardEvent) {\n // Quick hack to determine tab direction\n if (event.key === 'Tab' && event.shiftKey) {\n this.tabDirection = 'backward';\n setTimeout(() => (this.tabDirection = 'forward'));\n }\n }\n}\n"],"version":3}
1	+ {"file":"modal-215df46b.js","mappings":";;;;;AAEA,IAAI,YAAY,GAAkB,EAAE,CAAC;MAEhB,KAAK;EAIxB,YAAY,OAAoB;IAFhC,iBAAY,GAA2B,SAAS,CAAC;IAG/C,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;IACvB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACnD,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;GACpD;EAED,QAAQ;IACN,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAChC,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;IACzD,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;GAC1D;EAED,UAAU;IACR,YAAY,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC,KAAK,KAAK,KAAK,KAAK,IAAI,CAAC,OAAO,CAAC,CAAC;IACtE,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;IAC5D,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;GAC7D;EAED,QAAQ;;IAEN,OAAO,YAAY,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC,KAAK,IAAI,CAAC,OAAO,CAAC;GAC/D;EAED,aAAa,CAAC,KAAY;IACxB,MAAM,IAAI,GAAG,KAAK,CAAC,YAAY,EAAE,CAAC;;IAGlC,IAAI,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE;MACnD,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;MAC3D,MAAM,KAAK,GACT,IAAI,CAAC,YAAY,KAAK,UAAU,GAAG,gBAAgB,CAAC,MAAM,GAAG,CAAC,GAAG,CAAC,CAAC;MACrE,gBAAgB,CAAC,KAAK,CAAC,CAAC,KAAK,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC,CAAC;KACxD;GACF;EAED,aAAa,CAAC,KAAoB;;IAEhC,IAAI,KAAK,CAAC,GAAG,KAAK,KAAK,IAAI,KAAK,CAAC,QAAQ,EAAE;MACzC,IAAI,CAAC,YAAY,GAAG,UAAU,CAAC;MAC/B,UAAU,CAAC,OAAO,IAAI,CAAC,YAAY,GAAG,SAAS,CAAC,CAAC,CAAC;KACnD;GACF;;;;;","names":[],"sources":["./src/utils/modal.ts"],"sourcesContent":["import { getTabbableElements } from './tabbable';\n\nlet activeModals: HTMLElement[] = [];\n\nexport default class Modal {\n element: HTMLElement;\n tabDirection: 'forward' \| 'backward' = 'forward';\n\n constructor(element: HTMLElement) {\n this.element = element;\n this.handleFocusIn = this.handleFocusIn.bind(this);\n this.handleKeyDown = this.handleKeyDown.bind(this);\n }\n\n activate() {\n activeModals.push(this.element);\n document.addEventListener('focusin', this.handleFocusIn);\n document.addEventListener('keydown', this.handleKeyDown);\n }\n\n deactivate() {\n activeModals = activeModals.filter((modal) => modal !== this.element);\n document.removeEventListener('focusin', this.handleFocusIn);\n document.removeEventListener('keydown', this.handleKeyDown);\n }\n\n isActive() {\n // The \"active\" modal is always the most recent one shown\n return activeModals[activeModals.length - 1] === this.element;\n }\n\n handleFocusIn(event: Event) {\n const path = event.composedPath();\n\n // Trap focus so it doesn't go out of the modal's boundary\n if (this.isActive() && !path.includes(this.element)) {\n const tabbableElements = getTabbableElements(this.element);\n const index =\n this.tabDirection === 'backward' ? tabbableElements.length - 1 : 0;\n tabbableElements[index].focus({ preventScroll: true });\n }\n }\n\n handleKeyDown(event: KeyboardEvent) {\n // Quick hack to determine tab direction\n if (event.key === 'Tab' && event.shiftKey) {\n this.tabDirection = 'backward';\n setTimeout(() => (this.tabDirection = 'forward'));\n }\n }\n}\n"],"version":3}

package/dist/esm/nano-accordion.entry.js CHANGED Viewed

@@ -3,9 +3,9 @@
  */
 import { r as registerInstance, c as createEvent, h, e as Host, g as getElement } from './index-5f8d16e7.js';
 import { c as createColorClasses } from './theme-1d4c8719.js';
-import { g as getDirectChildren } from './dom-a791b223.js';
+import { g as getDirectChildren } from './dom-faa69d29.js';
-const accordionCss = ":host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host{display:block}";
+const accordionCss = ":host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{display:block}";
 let Accordion = class {
   constructor(hostRef) {
@@ -32,8 +32,6 @@ let Accordion = class {
   render() {
     return (h(Host, { class: Object.assign(Object.assign({}, createColorClasses(this.color)), { [`nano-color-${this.itemOpened}`]: typeof this.itemOpened === 'number' }) }, h("slot", null)));
   }
-  connectedCallback() {
-  }
   get el() { return getElement(this); }
 };
 Accordion.style = accordionCss;

package/dist/esm/nano-accordion.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"nano-accordion.entry.js","mappings":";;;;;;;AAAA,MAAM,YAAY,GAAG,~~yJAAyJ~~;;~~ICwBjK~~,SAAS;;;;;EAgBpB,eAAe,CAAC,KAAkB;IAChC,KAAK,CAAC,eAAe,EAAE,CAAC;IAExB,IAAI,KAAK,GACP,iBAAiB,CAAC,IAAI,CAAC,EAAE,EAAE,cAAc,CAAC;MAC1C,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC;IAC3C,KAAK,CAAC,OAAO,CAAC,CAAC,IAA4B,EAAE,CAAC;MAC5C,IAAI,IAAI,KAAK,KAAK,CAAC,MAAM;QAAE,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;;QACxC,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC;KAC1B,CAAC,CAAC;IACH,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;GACxB;EAGD,eAAe,CAAC,KAAkB;IAChC,KAAK,CAAC,eAAe,EAAE,CAAC;IACxB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;IACvB,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;GACxB;EAED,MAAM;IACJ,QACE,EAAC,IAAI,IACH,KAAK,kCACA,kBAAkB,CAAC,IAAI,CAAC,KAAK,CAAC,KACjC,CAAC,cAAc,IAAI,CAAC,UAAU,EAAE,GAC9B,OAAO,IAAI,CAAC,UAAU,KAAK,QAAQ,OAGvC,eAAQ,CACH,EACP;GACH~~;EAED,iBAAiB;GAEhB~~;;;;;;;","names":[],"sources":["./src/components/accordion/accordion.scss?tag=nano-accordion&encapsulation=shadow","./src/components/accordion/accordion.tsx"],"sourcesContent":[":host {\n display: block;\n}\n","import {\n Component,\n h,\n Listen,\n Element,\n Host,\n Prop,\n EventEmitter,\n Event,\n State,\n} from '@stencil/core';\n\nimport { Color } from '../../interface';\nimport { createColorClasses } from '../../utils/theme';\nimport { ~~testLegacyStyle,~~ getDirectChildren } from '../../utils';\n\n/*\n Simple accordion - only one item open at a time - must be used with [details](story/components-accordion--details) elements.\n /\n@Component({\n tag: 'nano-accordion',\n styleUrl: 'accordion.scss',\n shadow: true,\n})\nexport class Accordion {\n @State() itemOpened?: number;\n\n @Element() el: HTMLNanoAccordionElement;\n\n /\n Fires when accordion elements toggle\n /\n @Event() nanoToggle: EventEmitter;\n\n /\n Color to use from the color palette.\n */\n @Prop() color?: Color;\n\n @Listen('nanoOpened')\n onToggleHandler(event: CustomEvent) {\n event.stopPropagation();\n\n let items =\n getDirectChildren(this.el, 'nano-details') \|\|\n this.el.querySelectorAll('nano-details');\n items.forEach((item: HTMLNanoDetailsElement, i) => {\n if (item !== event.target) item.open = false;\n else this.itemOpened = i;\n });\n this.nanoToggle.emit();\n }\n\n @Listen('nanoClosed')\n onClosedHandler(event: CustomEvent) {\n event.stopPropagation();\n this.itemOpened = null;\n this.nanoToggle.emit();\n }\n\n render() {\n return (\n <Host\n class={{\n ...createColorClasses(this.color),\n [`nano-color-${this.itemOpened}`]:\n typeof this.itemOpened === 'number',\n }}\n >\n <slot />\n </Host>\n );\n }\n~~\n connectedCallback() {\n testLegacyStyle(this.el);\n~~ }\n~~}\n~~"],"version":3}
1	+ {"file":"nano-accordion.entry.js","mappings":";;;;;;;AAAA,MAAM,YAAY,GAAG,0LAA0L;;ICwBlM,SAAS;;;;;EAgBpB,eAAe,CAAC,KAAkB;IAChC,KAAK,CAAC,eAAe,EAAE,CAAC;IAExB,IAAI,KAAK,GACP,iBAAiB,CAAC,IAAI,CAAC,EAAE,EAAE,cAAc,CAAC;MAC1C,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC;IAC3C,KAAK,CAAC,OAAO,CAAC,CAAC,IAA4B,EAAE,CAAC;MAC5C,IAAI,IAAI,KAAK,KAAK,CAAC,MAAM;QAAE,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;;QACxC,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC;KAC1B,CAAC,CAAC;IACH,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;GACxB;EAGD,eAAe,CAAC,KAAkB;IAChC,KAAK,CAAC,eAAe,EAAE,CAAC;IACxB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;IACvB,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;GACxB;EAED,MAAM;IACJ,QACE,EAAC,IAAI,IACH,KAAK,kCACA,kBAAkB,CAAC,IAAI,CAAC,KAAK,CAAC,KACjC,CAAC,cAAc,IAAI,CAAC,UAAU,EAAE,GAC9B,OAAO,IAAI,CAAC,UAAU,KAAK,QAAQ,OAGvC,eAAQ,CACH,EACP;GACH;;;;;;;","names":[],"sources":["./src/components/accordion/accordion.scss?tag=nano-accordion&encapsulation=shadow","./src/components/accordion/accordion.tsx"],"sourcesContent":[":host {\n display: block;\n}\n","import {\n Component,\n h,\n Listen,\n Element,\n Host,\n Prop,\n EventEmitter,\n Event,\n State,\n} from '@stencil/core';\n\nimport { Color } from '../../interface';\nimport { createColorClasses } from '../../utils/theme';\nimport { getDirectChildren } from '../../utils';\n\n/*\n Simple accordion - only one item open at a time - must be used with [details](story/components-accordion--details) elements.\n /\n@Component({\n tag: 'nano-accordion',\n styleUrl: 'accordion.scss',\n shadow: true,\n})\nexport class Accordion {\n @State() itemOpened?: number;\n\n @Element() el: HTMLNanoAccordionElement;\n\n /\n Fires when accordion elements toggle\n /\n @Event() nanoToggle: EventEmitter;\n\n /\n Color to use from the color palette.\n */\n @Prop() color?: Color;\n\n @Listen('nanoOpened')\n onToggleHandler(event: CustomEvent) {\n event.stopPropagation();\n\n let items =\n getDirectChildren(this.el, 'nano-details') \|\|\n this.el.querySelectorAll('nano-details');\n items.forEach((item: HTMLNanoDetailsElement, i) => {\n if (item !== event.target) item.open = false;\n else this.itemOpened = i;\n });\n this.nanoToggle.emit();\n }\n\n @Listen('nanoClosed')\n onClosedHandler(event: CustomEvent) {\n event.stopPropagation();\n this.itemOpened = null;\n this.nanoToggle.emit();\n }\n\n render() {\n return (\n <Host\n class={{\n ...createColorClasses(this.color),\n [`nano-color-${this.itemOpened}`]:\n typeof this.itemOpened === 'number',\n }}\n >\n <slot />\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/esm/nano-alert.entry.js CHANGED Viewed

@@ -2,14 +2,14 @@
  * Web Components for Nanopore digital Web Apps
  */
 import { r as registerInstance, c as createEvent, h, e as Host, g as getElement } from './index-5f8d16e7.js';
-import { M as Modal } from './modal-eb0a9bb3.js';
-import { r as raf } from './index-f41ae118.js';
-import { l as lockBodyScrolling, u as unlockBodyScrolling } from './scroll-5cd0ab13.js';
+import { M as Modal } from './modal-215df46b.js';
+import { r as raf } from './index-bf53664b.js';
+import { l as lockBodyScrolling, u as unlockBodyScrolling } from './scroll-881feb46.js';
 import { c as createColorClasses } from './theme-1d4c8719.js';
-import './tabbable-e21f860a.js';
-import './dom-a791b223.js';
+import './tabbable-614f515e.js';
+import './dom-faa69d29.js';
-const alertCss = ":host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}:host{--border-radius:var(--nano-layer-border-radius, var(--nano-border-radius-medium, 4px));--border-color:var(--nano-layer-border-color, rgba(0, 0, 0, 0.1));--border-width:var(--nano-layer-border-width, 1px);--background:var(--nano-layer-bg, #fff);--tint-color:var(--nano-color-base, var(--nano-color-primary, #007495));--icon-size:2rem;--scrim-color:var(--nano-layer-overlay-dark, rgba(74, 74, 74, .5));--close-button-color:#b5aea7;display:block}:host(.nano-color){--tint-color:var(--nano-color-base, var(--nano-color-primary, #007495))}.alert{position:relative;background-color:var(--background);border:solid var(--border-width) var(--border-color);border-top-width:4px;border-top-color:var(--tint-color);border-radius:var(--border-radius);opacity:0;-webkit-transform:scale(0.9);transform:scale(0.9);-webkit-transition:var(--nano-transition-medium, 0.5s) opacity ease, var(--nano-transition-fast, 0.3s) transform ease;transition:var(--nano-transition-medium, 0.5s) opacity ease, var(--nano-transition-fast, 0.3s) transform ease}.alert:focus{outline:none}.alert:not(.alert--showing){position:absolute;width:1px;height:1px;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);overflow:hidden;pointer-events:none;visibility:hidden}.alert--open{opacity:1;-webkit-transform:none;transform:none}.alert--toasty,.alert--modal{-webkit-box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.3));box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.3));margin:var(--nano-spacing-medium, 16px)}.alert__content{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch}.alert__modal-wrap{position:fixed;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;top:0;right:0;bottom:0;left:0;z-index:var(--nano-layer-index-alert, 800)}.alert__message{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;padding:var(--nano-spacing-medium, 16px);overflow:hidden;line-height:1.6}.alert__close{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:1.1em;padding-left:0;padding-right:var(--nano-spacing-medium, 16px);padding-top:0;padding-bottom:0;--color:var(--close-button-color)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert__close{padding-left:unset;padding-right:unset;-webkit-padding-start:0;padding-inline-start:0;-webkit-padding-end:var(--nano-spacing-medium, 16px);padding-inline-end:var(--nano-spacing-medium, 16px)}}.alert__footer{padding:0 var(--nano-spacing-small, 8px) 0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:distribute;justify-content:space-around;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.alert__footer ::slotted(*),.alert__footer::slotted(*){-webkit-box-flex:1;-ms-flex:1;flex:1;margin:0 var(--nano-spacing-small, 8px) var(--nano-spacing-medium, 16px) !important}.alert__overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--scrim-color);opacity:0;-webkit-transition:var(--nano-transition-fast, 0.3s) opacity;transition:var(--nano-transition-fast, 0.3s) opacity;z-index:var(--nano-layer-index-alert, 800);-webkit-backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px));backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px))}.alert__overlay--open{opacity:1}.alert__icon{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:var(--icon-size)}.alert__icon::slotted(*){color:var(--tint-color);margin-left:var(--nano-spacing-medium, 16px)}.alert__icon ::slotted(*){color:var(--tint-color);margin-left:var(--nano-spacing-medium, 16px);margin-right:0;margin-top:0;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert__icon ::slotted(*){margin-left:unset;margin-right:unset;-webkit-margin-start:var(--nano-spacing-medium, 16px);margin-inline-start:var(--nano-spacing-medium, 16px);-webkit-margin-end:0;margin-inline-end:0}}.something{color:black}";
+const alertCss = ":host{-webkit-box-sizing:border-box;box-sizing:border-box}*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{--border-radius:var(--nano-layer-border-radius, var(--nano-border-radius-medium, 4px));--border-color:var(--nano-layer-border-color, rgba(0, 0, 0, 0.1));--border-width:var(--nano-layer-border-width, 1px);--background:var(--nano-layer-bg, #fff);--tint-color:var(--nano-color-base, var(--nano-color-primary, #007495));--icon-size:2rem;--scrim-color:var(--nano-layer-overlay-dark, rgba(74, 74, 74, .5));--close-button-color:#b5aea7;display:block}:host(.nano-color){--tint-color:var(--nano-color-base, var(--nano-color-primary, #007495))}.alert{position:relative;background-color:var(--background);border:solid var(--border-width) var(--border-color);border-top-width:4px;border-top-color:var(--tint-color);border-radius:var(--border-radius);opacity:0;-webkit-transform:scale(0.9);transform:scale(0.9);-webkit-transition:var(--nano-transition-medium, 0.5s) opacity ease, var(--nano-transition-fast, 0.3s) transform ease;transition:var(--nano-transition-medium, 0.5s) opacity ease, var(--nano-transition-fast, 0.3s) transform ease}.alert:focus{outline:none}.alert:not(.alert--showing){position:absolute;width:1px;height:1px;clip:rect(0 0 0 0);-webkit-clip-path:inset(50%);clip-path:inset(50%);overflow:hidden;pointer-events:none;visibility:hidden}.alert--open{opacity:1;-webkit-transform:none;transform:none}.alert--toasty,.alert--modal{-webkit-box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2));box-shadow:var(--nano-layer-shadow-large, 0 2px 8px rgba(0, 0, 0, 0.2));margin:var(--nano-spacing-medium, 16px)}.alert__content{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch}.alert__modal-wrap{position:fixed;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;top:0;right:0;bottom:0;left:0;z-index:var(--nano-layer-index-alert, 800)}.alert__message{-webkit-box-flex:1;-ms-flex:1 1 auto;flex:1 1 auto;padding:var(--nano-spacing-medium, 16px);overflow:hidden;line-height:1.6}.alert__close{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:1.1em;padding-left:0;padding-right:var(--nano-spacing-medium, 16px);padding-top:0;padding-bottom:0;--color:var(--close-button-color)}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert__close{padding-left:unset;padding-right:unset;-webkit-padding-start:0;padding-inline-start:0;-webkit-padding-end:var(--nano-spacing-medium, 16px);padding-inline-end:var(--nano-spacing-medium, 16px)}}.alert__footer{padding:0 var(--nano-spacing-small, 8px) 0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:distribute;justify-content:space-around;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.alert__footer ::slotted(*),.alert__footer::slotted(*){-webkit-box-flex:1;-ms-flex:1;flex:1;margin:0 var(--nano-spacing-small, 8px) var(--nano-spacing-medium, 16px) !important}.alert__overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--scrim-color);opacity:0;-webkit-transition:var(--nano-transition-fast, 0.3s) opacity;transition:var(--nano-transition-fast, 0.3s) opacity;z-index:var(--nano-layer-index-alert, 800);-webkit-backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px));backdrop-filter:blur(var(--nano-layer-overlay-blur, 3px))}.alert__overlay--open{opacity:1}.alert__icon{-webkit-box-flex:0;-ms-flex:0 0 auto;flex:0 0 auto;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:var(--icon-size)}.alert__icon::slotted(*){color:var(--tint-color);margin-left:var(--nano-spacing-medium, 16px)}.alert__icon ::slotted(*){color:var(--tint-color);margin-left:var(--nano-spacing-medium, 16px);margin-right:0;margin-top:0;margin-bottom:0}@supports ((-webkit-margin-start: 0) or (margin-inline-start: 0)) or (-webkit-margin-start: 0){.alert__icon ::slotted(*){margin-left:unset;margin-right:unset;-webkit-margin-start:var(--nano-spacing-medium, 16px);margin-inline-start:var(--nano-spacing-medium, 16px);-webkit-margin-end:0;margin-inline-end:0}}";
 const toastStackTr = Object.assign(document.createElement('div'), {
   className: 'nano-toast-stack nano-toast-stack--tr',