@nanoporetech-digital/components 7.9.1 → 8.0.0-alpha.0

package/dist/cjs/local-my-account-53c19159.js

@@ -1,472 +0,0 @@
-/*!
- * Web Components for Nanopore digital Web Apps
- */
-'use strict';
-
-const user = {
-	id: "john.jenkins",
-	uuid: "2589690E-A907-50BB-9551-55E18ABB1273",
-	name: "John Jenkins",
-	first_name: "John",
-	last_name: "Jenkins",
-	email: "john.jenkins@nanoporetech.com",
-	company: "Oxford Nanopore Technologies",
-	lifecycle_stage: "Other",
-	indirect_customer: false,
-	registration: {
-		next_url: null
-	},
-	covid19_store_access: false,
-	ncm20_user_group: false,
-	job_title: "Tester",
-	small_avatar_url: null,
-	country_code: "GB"
-};
-const domains = [
-	{
-		origin: "cws",
-		domain: "nanoporetech.com"
-	},
-	{
-		origin: "store",
-		domain: "store.nanoporetech.com"
-	},
-	{
-		origin: "community",
-		domain: "community.nanoporetech.com"
-	}
-];
-const cart = {
-	count: 0,
-	url: "https://shop-test.nanoporetech.com/checkout/cart"
-};
-const notifications = {
-	count: 0
-};
-const links = [
-	{
-		id: 1,
-		area: "main",
-		address: "#",
-		title: "Trousers",
-		order: 1,
-		target: null
-	},
-	{
-		id: 2,
-		area: "logged-out",
-		address: "#",
-		title: "Mouse",
-		order: 1,
-		target: null
-	},
-	{
-		id: 20,
-		area: "profile-panel-block",
-		address: "https://nanoporetech.com/about-us/news",
-		title: "News",
-		order: 3,
-		target: ""
-	},
-	{
-		id: 21,
-		area: "profile-panel-block",
-		address: "https://nanoporetech.com/about-us",
-		title: "About",
-		order: 3,
-		target: ""
-	},
-	{
-		id: 22,
-		area: "profile-panel-block",
-		address: "https://nanoporetech.com/contact",
-		title: "Contact",
-		order: 3,
-		target: ""
-	},
-	{
-		id: 28,
-		area: "right-side-logged-out",
-		address: "https://nanoporetech.com/contact",
-		title: "Contact",
-		order: 3,
-		target: ""
-	},
-	{
-		id: 29,
-		area: "right-side-logged-out",
-		address: "https://nanoporetech.com/about-us/news",
-		title: "News",
-		order: 3,
-		target: ""
-	},
-	{
-		id: 30,
-		area: "right-side-logged-out",
-		address: "https://nanoporetech.com/about-us",
-		title: "About",
-		order: 3,
-		target: ""
-	},
-	{
-		id: 9,
-		area: "right-side-logged-in",
-		address: "https://nanoporetech.com/contact",
-		title: "Contact",
-		order: 4,
-		target: ""
-	},
-	{
-		id: 10,
-		area: "right-side-logged-in",
-		address: "https://nanoporetech.com/about-us/news",
-		title: "News",
-		order: 4,
-		target: ""
-	},
-	{
-		id: 11,
-		area: "right-side-logged-in",
-		address: "https://nanoporetech.com/about-us",
-		title: "About",
-		order: 4,
-		target: ""
-	},
-	{
-		id: 12,
-		area: "right-side-logged-in",
-		address: "https://nanoporetech.com/events",
-		title: "Events",
-		order: 4,
-		target: ""
-	},
-	{
-		id: 23,
-		area: "left-side-logged-out",
-		address: "https://nanoporetech.com/",
-		title: "Nanoporetech",
-		order: 5,
-		target: ""
-	},
-	{
-		id: 24,
-		area: "left-side-logged-out",
-		address: "https://metrichor.com/",
-		title: "Metrichor",
-		order: 5,
-		target: ""
-	},
-	{
-		id: 25,
-		area: "left-side-logged-out",
-		address: "https://community.nanoporetech.com/",
-		title: "Community",
-		order: 5,
-		target: ""
-	},
-	{
-		id: 26,
-		area: "left-side-logged-out",
-		address: "https://nanoporetech.com/events",
-		title: "Events",
-		order: 5,
-		target: ""
-	},
-	{
-		id: 27,
-		area: "left-side-logged-out",
-		address: "https://store.nanoporetech.com",
-		title: "Store",
-		order: 5,
-		target: ""
-	},
-	{
-		id: 3,
-		area: "left-side-logged-in",
-		address: "https://nanoporetech.com/",
-		title: "Nanoporetech",
-		order: 6,
-		target: ""
-	},
-	{
-		id: 4,
-		area: "left-side-logged-in",
-		address: "https://metrichor.com/",
-		title: "Metrichor",
-		order: 6,
-		target: ""
-	},
-	{
-		id: 5,
-		area: "left-side-logged-in",
-		address: "https://community.nanoporetech.com/",
-		title: "Community",
-		order: 6,
-		target: ""
-	},
-	{
-		id: 6,
-		area: "left-side-logged-in",
-		address: "https://nanoporetech.com/events",
-		title: "Events",
-		order: 6,
-		target: ""
-	},
-	{
-		id: 7,
-		area: "left-side-logged-in",
-		address: "https://store.nanoporetech.com",
-		title: "Store",
-		order: 6,
-		target: ""
-	},
-	{
-		id: 8,
-		area: "left-side-logged-in",
-		address: "https://epi2me.nanoporetech.com",
-		title: "EPI2ME",
-		order: 6,
-		target: "_blank"
-	},
-	{
-		id: 13,
-		area: "profile-panel-list",
-		address: "https://community.nanoporetech.com/",
-		title: "Community Dashboard",
-		order: 7,
-		target: ""
-	},
-	{
-		id: 14,
-		area: "profile-panel-list",
-		address: "https://myaccount.nanoporetech.com/message_centre",
-		title: "Messages",
-		order: 7,
-		target: ""
-	},
-	{
-		id: 15,
-		area: "profile-panel-list",
-		address: "https://community.nanoporetech.com/my-activity",
-		title: "My Activity",
-		order: 7,
-		target: ""
-	},
-	{
-		id: 16,
-		area: "profile-panel-list",
-		address: "https://myaccount.nanoporetech.com/home",
-		title: "My Account",
-		order: 7,
-		target: ""
-	},
-	{
-		id: 17,
-		area: "profile-panel-list",
-		address: "https://myaccount.nanoporetech.com/account/teams",
-		title: "Team Management ",
-		order: 7,
-		target: ""
-	},
-	{
-		id: 18,
-		area: "profile-panel-list",
-		address: "https://nanoporetech.com/resource-centre/publications",
-		title: "Publications",
-		order: 7,
-		target: ""
-	},
-	{
-		id: 19,
-		area: "profile-panel-list",
-		address: "https://myaccount.nanoporetech.com/profile/status",
-		title: "Preferences",
-		order: 7,
-		target: ""
-	}
-];
-const urls = {
-	forgot_password: "https://myaccount-dev.nanoporetech.com/profile/details#password-form?RelayState=",
-	logout: "https://myaccount-dev.nanoporetech.com/sso/logout?RelayState=",
-	login: null,
-	messages: "https://myaccount-dev.nanoporetech.com/message_centre",
-	cart: "https://test.store.nanoporetech.com/cart"
-};
-const search = {
-	app_id: "N8NZI5A47F",
-	api_key: "b38860b015b02c9cb6993cf0367ed203",
-	indeces: [
-		{
-			index: "ont_dev_en_v3",
-			name: "All",
-			domain: "nanoporetech.com",
-			all_group: true,
-			filters: [
-				"tags",
-				"type"
-			],
-			replicas: [
-				{
-					name: "Sort by: Most relevant",
-					index: "ont_dev_en_v3"
-				},
-				{
-					name: "Sort by: Newest",
-					index: "ont_dev_en_v3_date_desc"
-				},
-				{
-					name: "Sort by: Oldest",
-					index: "ont_dev_en_v3_date_asc"
-				},
-				{
-					name: "Sort by: Recent activity",
-					index: "ont_dev_en_v3_activity_date_desc"
-				}
-			]
-		},
-		{
-			index: "cws_english_en",
-			name: "www",
-			domain: "nanoporetech.com",
-			filters: [
-				"tags",
-				"type"
-			],
-			replicas: [
-				{
-					name: "Sort by: Most relevant",
-					index: "cws_english_en"
-				},
-				{
-					name: "Sort by: Newest",
-					index: "cws_english_en_date_desc"
-				},
-				{
-					name: "Sort by: Oldest",
-					index: "cws_english_en_date_asc"
-				},
-				{
-					name: "Sort by: Recent activity",
-					index: "cws_english_en_activity_date_desc"
-				}
-			]
-		},
-		{
-			index: "store_prod",
-			name: "Store",
-			domain: "store.nanoporetech.com",
-			filters: [
-				"type"
-			],
-			replicas: [
-				{
-					name: "Sort by: Most relevant",
-					index: "store_prod"
-				},
-				{
-					name: "Sort by: Newest",
-					index: "store_date_desc"
-				},
-				{
-					name: "Sort by: Oldest",
-					index: "store_date_asc"
-				}
-			]
-		},
-		{
-			index: "cws_english_resources_en",
-			name: "Resources",
-			domain: "nanoporetech.com",
-			filters: [
-				"tags"
-			],
-			replicas: [
-				{
-					name: "Sort by: Most relevant",
-					index: "cws_english_resources_en"
-				},
-				{
-					name: "Sort by: Newest",
-					index: "cws_english_resources_en_date_desc"
-				},
-				{
-					name: "Sort by: Oldest",
-					index: "cws_english_resources_en_date_asc"
-				}
-			]
-		},
-		{
-			index: "community_prod",
-			name: "Community",
-			domain: "community.nanoporetech.com",
-			filters: [
-				"type",
-				"channel",
-				"authors",
-				"tags"
-			],
-			replicas: [
-				{
-					name: "Sort by: Most relevant",
-					index: "community_prod"
-				},
-				{
-					name: "Sort by: Newest",
-					index: "community_prod_date_desc"
-				},
-				{
-					name: "Sort by: Oldest",
-					index: "community_prod_date_asc"
-				},
-				{
-					name: "Sort by: Recent activity",
-					index: "community_prod_activity_date_desc"
-				}
-			]
-		}
-	]
-};
-const promotion = {
-	header: {
-		img: "https://nanoporetech.com/sites/default/files/s3/gn-promotion-lc20.png",
-		label: "London Calling 2020 Online",
-		url: "https://londoncallingconf.co.uk/lc20"
-	},
-	description: "A conference hosted by Oxford Nanopore Technologies",
-	meta: [
-		{
-			icon: "calendar",
-			label: "18th - 19th June 2020"
-		},
-		{
-			icon: "map-marker",
-			label: "Online"
-		}
-	],
-	cta: {
-		label: "Register Now",
-		url: "https://nanoporetech.com/lc-online/register"
-	}
-};
-const localMyAccount = {
-	user: user,
-	domains: domains,
-	cart: cart,
-	notifications: notifications,
-	links: links,
-	urls: urls,
-	search: search,
-	promotion: promotion
-};
-
-exports.cart = cart;
-exports['default'] = localMyAccount;
-exports.domains = domains;
-exports.links = links;
-exports.notifications = notifications;
-exports.promotion = promotion;
-exports.search = search;
-exports.urls = urls;
-exports.user = user;
-
-//# sourceMappingURL=local-my-account-53c19159.js.map

package/dist/cjs/local-my-account-53c19159.js.map

@@ -1 +0,0 @@
-{"file":"local-my-account-53c19159.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/cjs/math-ea9cdc71.js

@@ -1,41 +0,0 @@
-/*!
- * Web Components for Nanopore digital Web Apps
- */
-'use strict';
-
-/**
- * Returns a given number between a min and max
- * @param min - the minimum number
- * @param n - the number to clamp
- * @param max - the maximum number
- * @returns the clamped number
- */
-const clamp = (min, n, max) => {
-    return Math.max(min, Math.min(n, max));
-};
-/**
- * Generates a 53-bit hash from any given string
- * @param str - the string to hash
- * @param seed - optionally supply a seed (unsigned integer, 32-bit max) for alternate streams of the same input
- * @returns a 53-bit hash integer
- */
-function cyrb53(str, seed = 0) {
-    let h1 = 0xdeadbeef ^ seed, h2 = 0x41c6ce57 ^ seed;
-    for (let i = 0, ch; i < str.length; i++) {
-        ch = str.charCodeAt(i);
-        h1 = Math.imul(h1 ^ ch, 2654435761);
-        h2 = Math.imul(h2 ^ ch, 1597334677);
-    }
-    h1 =
-        Math.imul(h1 ^ (h1 >>> 16), 2246822507) ^
-            Math.imul(h2 ^ (h2 >>> 13), 3266489909);
-    h2 =
-        Math.imul(h2 ^ (h2 >>> 16), 2246822507) ^
-            Math.imul(h1 ^ (h1 >>> 13), 3266489909);
-    return 4294967296 * (2097151 & h2) + (h1 >>> 0);
-}
-
-exports.clamp = clamp;
-exports.cyrb53 = cyrb53;
-
-//# sourceMappingURL=math-ea9cdc71.js.map

package/dist/cjs/math-ea9cdc71.js.map

@@ -1 +0,0 @@
-{"file":"math-ea9cdc71.js","mappings":";;;;;AAAA;;;;;;;MAOa,KAAK,GAAG,CAAC,GAAW,EAAE,CAAS,EAAE,GAAW;IACvD,OAAO,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC;AACzC,EAAE;AAEF;;;;;;SAMgB,MAAM,CAAC,GAAW,EAAE,IAAI,GAAG,CAAC;IAC1C,IAAI,EAAE,GAAG,UAAU,GAAG,IAAI,EACxB,EAAE,GAAG,UAAU,GAAG,IAAI,CAAC;IACzB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,EAAE,CAAC,GAAG,GAAG,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;QACvC,EAAE,GAAG,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;QACvB,EAAE,GAAG,IAAI,CAAC,IAAI,CAAC,EAAE,GAAG,EAAE,EAAE,UAAU,CAAC,CAAC;QACpC,EAAE,GAAG,IAAI,CAAC,IAAI,CAAC,EAAE,GAAG,EAAE,EAAE,UAAU,CAAC,CAAC;KACrC;IACD,EAAE;QACA,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,UAAU,CAAC;YACvC,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,UAAU,CAAC,CAAC;IAC1C,EAAE;QACA,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,UAAU,CAAC;YACvC,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,UAAU,CAAC,CAAC;IAC1C,OAAO,UAAU,IAAI,OAAO,GAAG,EAAE,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC;AAClD;;;;;","names":[],"sources":["src/utils/math.ts"],"sourcesContent":["/**\n * Returns a given number between a min and max\n * @param min - the minimum number\n * @param n - the number to clamp\n * @param max - the maximum number\n * @returns the clamped number\n */\nexport const clamp = (min: number, n: number, max: number) => {\n  return Math.max(min, Math.min(n, max));\n};\n\n/**\n * Generates a 53-bit hash from any given string\n * @param str - the string to hash\n * @param seed - optionally supply a seed (unsigned integer, 32-bit max) for alternate streams of the same input\n * @returns a 53-bit hash integer\n */\nexport function cyrb53(str: string, seed = 0) {\n  let h1 = 0xdeadbeef ^ seed,\n    h2 = 0x41c6ce57 ^ seed;\n  for (let i = 0, ch; i < str.length; i++) {\n    ch = str.charCodeAt(i);\n    h1 = Math.imul(h1 ^ ch, 2654435761);\n    h2 = Math.imul(h2 ^ ch, 1597334677);\n  }\n  h1 =\n    Math.imul(h1 ^ (h1 >>> 16), 2246822507) ^\n    Math.imul(h2 ^ (h2 >>> 13), 3266489909);\n  h2 =\n    Math.imul(h2 ^ (h2 >>> 16), 2246822507) ^\n    Math.imul(h1 ^ (h1 >>> 13), 3266489909);\n  return 4294967296 * (2097151 & h2) + (h1 >>> 0);\n}\n"],"version":3}

package/dist/cjs/modal-ff47c677.js

@@ -1,51 +0,0 @@
-/*!
- * Web Components for Nanopore digital Web Apps
- */
-'use strict';
-
-const tabbable = require('./tabbable-619dc959.js');
-
-let activeModals = [];
-class Modal {
-    element;
-    tabDirection = 'forward';
-    constructor(element) {
-        this.element = element;
-        this.handleFocusIn = this.handleFocusIn.bind(this);
-        this.handleKeyDown = this.handleKeyDown.bind(this);
-    }
-    activate() {
-        activeModals.push(this.element);
-        document.addEventListener('focusin', this.handleFocusIn);
-        document.addEventListener('keydown', this.handleKeyDown);
-    }
-    deactivate() {
-        activeModals = activeModals.filter((modal) => modal !== this.element);
-        document.removeEventListener('focusin', this.handleFocusIn);
-        document.removeEventListener('keydown', this.handleKeyDown);
-    }
-    isActive() {
-        // The "active" modal is always the most recent one shown
-        return activeModals[activeModals.length - 1] === this.element;
-    }
-    handleFocusIn(event) {
-        const path = event.composedPath();
-        // Trap focus so it doesn't go out of the modal's boundary
-        if (this.isActive() && !path.includes(this.element)) {
-            const tabbableElements = tabbable.getTabbableElements(this.element);
-            const index = this.tabDirection === 'backward' ? tabbableElements.length - 1 : 0;
-            tabbableElements[index]?.focus({ preventScroll: true });
-        }
-    }
-    handleKeyDown(event) {
-        // Quick hack to determine tab direction
-        if (event.key === 'Tab' && event.shiftKey) {
-            this.tabDirection = 'backward';
-            setTimeout(() => (this.tabDirection = 'forward'));
-        }
-    }
-}
-
-exports.Modal = Modal;
-
-//# sourceMappingURL=modal-ff47c677.js.map

package/dist/cjs/modal-ff47c677.js.map

@@ -1 +0,0 @@
-{"file":"modal-ff47c677.js","mappings":";;;;;;;AAEA,IAAI,YAAY,GAAkB,EAAE,CAAC;MAEhB,KAAK;IACxB,OAAO,CAAc;IACrB,YAAY,GAA2B,SAAS,CAAC;IAEjD,YAAY,OAAoB;QAC9B,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;QACvB,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACnD,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;KACpD;IAED,QAAQ;QACN,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAChC,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;QACzD,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;KAC1D;IAED,UAAU;QACR,YAAY,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC,KAAK,KAAK,KAAK,KAAK,IAAI,CAAC,OAAO,CAAC,CAAC;QACtE,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;QAC5D,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;KAC7D;IAED,QAAQ;;QAEN,OAAO,YAAY,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC,KAAK,IAAI,CAAC,OAAO,CAAC;KAC/D;IAED,aAAa,CAAC,KAAY;QACxB,MAAM,IAAI,GAAG,KAAK,CAAC,YAAY,EAAE,CAAC;;QAGlC,IAAI,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE;YACnD,MAAM,gBAAgB,GAAGA,4BAAmB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;YAC3D,MAAM,KAAK,GACT,IAAI,CAAC,YAAY,KAAK,UAAU,GAAG,gBAAgB,CAAC,MAAM,GAAG,CAAC,GAAG,CAAC,CAAC;YACrE,gBAAgB,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC,CAAC;SACzD;KACF;IAED,aAAa,CAAC,KAAoB;;QAEhC,IAAI,KAAK,CAAC,GAAG,KAAK,KAAK,IAAI,KAAK,CAAC,QAAQ,EAAE;YACzC,IAAI,CAAC,YAAY,GAAG,UAAU,CAAC;YAC/B,UAAU,CAAC,OAAO,IAAI,CAAC,YAAY,GAAG,SAAS,CAAC,CAAC,CAAC;SACnD;KACF;;;;;","names":["getTabbableElements"],"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/cjs/nano-accordion.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"nano-accordion.entry.cjs.js","mappings":";;;;;;;;;;;;AAAA,MAAM,YAAY,GAAG,sOAAsO,CAAC;AAC5P,4BAAe,YAAY;;MCuBd,SAAS;;;;;IACX,UAAU,CAAU;;;;;IAOpB,UAAU,CAAe;;;;IAK1B,KAAK,CAAS;IAGtB,eAAe,CAAC,KAAkB;QAChC,KAAK,CAAC,eAAe,EAAE,CAAC;QAExB,MAAM,KAAK,GACTA,qBAAiB,CAAC,IAAI,CAAC,EAAE,EAAEC,qBAAY,CAAC,cAAc,CAAC,CAAC;YACxD,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAACA,qBAAY,CAAC,cAAc,CAAC,CAAC,CAAC;QACzD,KAAK,CAAC,OAAO,CAAC,CAAC,IAA4B,EAAE,CAAC;YAC5C,IAAI,IAAI,KAAK,KAAK,CAAC,MAAM;gBAAE,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;;gBACxC,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC;SAC1B,CAAC,CAAC;QACH,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;KACxB;IAGD,eAAe,CAAC,KAAkB;QAChC,KAAK,CAAC,eAAe,EAAE,CAAC;QACxB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QACvB,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;KACxB;IAED,MAAM;QACJ,QACEC,WAACC,UAAI,qDACH,KAAK,EAAE;gBACL,GAAGC,wBAAkB,CAAC,IAAI,CAAC,KAAK,CAAC;gBACjC,CAAC,cAAc,IAAI,CAAC,UAAU,EAAE,GAC9B,OAAO,IAAI,CAAC,UAAU,KAAK,QAAQ;gBACrC,gBAAgB,EAAE,IAAI;aACvB,IAEDF,uEAAQ,CACH,EACP;KACH;;;;;;","names":["getDirectChildren","transformTag","h","Host","createColorClasses"],"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  Listen,\n  Element,\n  Host,\n  Prop,\n  EventEmitter,\n  Event,\n  State,\n} from '@stencil/core';\n\nimport { h, transformTag } from '../../utils/renderer';\nimport { getDirectChildren } from '../../utils/dom';\nimport { createColorClasses } from '../../utils/theme';\nimport type { Color } from '../../types/shared';\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    const items =\n      getDirectChildren(this.el, transformTag('nano-details')) ||\n      this.el.querySelectorAll(transformTag('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          'nano-accordion': true,\n        }}\n      >\n        <slot />\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/nano-alert.cjs.entry.js.map

@@ -1 +0,0 @@
-{"file":"nano-alert.entry.cjs.js","mappings":"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","names":["transformTag","lockBodyScrolling","Modal","unlockBodyScrolling","h","Host","createColorClasses"],"sources":["src/components/alert/alert.scss?tag=nano-alert&encapsulation=shadow","src/components/alert/alert.tsx"],"sourcesContent":["@use 'sass:map';\n@use '../../global/style/nano-theme/tokens' as tokens;\n@use '../../global/style/utilities/mixins' as mx;\n\n:host {\n  /**\n   * @prop --border-radius: defaults to #{tokens.$layer-border-radius};\n   * @prop --border-color: defaults to #{tokens.$layer-border-color};\n   * @prop --border-width: defaults to #{tokens.$layer-border-width};\n   * @prop --background: defaults to #{tokens.$layer-bg-color};\n   * @prop --tint-color: defaults to var(--nano-color-base, #{nano-color(primary, base)});\n   * @prop --icon-size: defaults to 1.5rem;\n   * @prop --scrim-color: overlay colour of alert display. Defaults to #{tokens.$layer-overlay-dark};\n   * @prop --close-button-color: defaults to #{map.get(tokens.$colors, mediumgrey)} ;\n   */\n\n  --border-radius: #{tokens.$layer-border-radius};\n  --border-color: #{tokens.$layer-border-color};\n  --border-width: #{tokens.$layer-border-width};\n  --background: #{tokens.$layer-bg-color};\n  --tint-color: var(--nano-color-base, #{tokens.nano-color(primary, base)});\n  --icon-size: 2rem;\n  --scrim-color: #{tokens.$layer-overlay-dark};\n  --close-button-color: #{map.get(tokens.$colors, palegrey)};\n\n  display: block;\n}\n\n:host(.nano-color) {\n  --tint-color: var(--nano-color-base, #{tokens.nano-color(primary, base)});\n}\n\n.alert {\n  position: relative;\n  background-color: var(--background);\n  border: solid var(--border-width) var(--border-color);\n  border-block-start-width: 4px;\n  border-block-start-color: var(--tint-color);\n  border-radius: var(--border-radius);\n  opacity: 0;\n  transform: scale(0.9);\n  transition:\n    #{tokens.$transition-medium} opacity ease,\n    #{tokens.$transition-fast} transform ease;\n\n  &:focus {\n    outline: none;\n  }\n\n  &:not(.alert--showing) {\n    @include mx.hidden;\n  }\n\n  &--open {\n    opacity: 1;\n    transform: none;\n  }\n\n  &--toasty,\n  &--modal {\n    box-shadow: #{tokens.$layer-shadow-large};\n    margin: #{tokens.$spacing-medium};\n  }\n\n  &--modal {\n    &.alert--nodismiss {\n      animation: cannotClose 0.25s ease-in-out 1;\n\n      @keyframes cannotClose {\n        0% {\n          transform: scale(1);\n        }\n\n        50% {\n          transform: scale(1.08);\n        }\n\n        100% {\n          transform: scale(1);\n        }\n      }\n    }\n  }\n}\n\n.alert__content {\n  display: flex;\n  align-items: stretch;\n}\n\n.alert__modal-wrap {\n  position: fixed;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  inset: 0;\n  z-index: #{tokens.$layer-index-alert};\n}\n\n.alert__message {\n  flex: 1 1 auto;\n  padding: #{tokens.$spacing-medium};\n  overflow: hidden;\n  line-height: 1.6;\n}\n\n.alert__close {\n  --color: var(--close-button-color);\n\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  font-size: 1.1em;\n  padding-inline: 0 #{tokens.$spacing-medium};\n  padding-block: 0;\n}\n\n.alert__footer {\n  padding: 0 #{tokens.$spacing-small} 0;\n  display: flex;\n  flex-direction: row;\n  justify-content: space-around;\n  align-items: center;\n\n  ::slotted(*) {\n    flex: 1;\n    margin: 0 #{tokens.$spacing-small} #{tokens.$spacing-medium} !important;\n  }\n}\n\n.alert__overlay {\n  position: fixed;\n  inset: 0;\n  background-color: var(--scrim-color);\n  opacity: 0;\n  transition: #{tokens.$transition-fast} opacity;\n  z-index: #{tokens.$layer-index-alert};\n  backdrop-filter: blur(#{tokens.$layer-overlay-blur});\n  pointer-events: all;\n\n  &--open {\n    opacity: 1;\n  }\n}\n\n.alert__icon {\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  font-size: var(--icon-size);\n\n  ::slotted(*), &::slotted(*) {\n    color: var(--tint-color);\n    margin-inline-start: #{tokens.$spacing-medium};\n  }\n}\n","import {\n  Component,\n  ComponentInterface,\n  Element,\n  Event,\n  EventEmitter,\n  Method,\n  Prop,\n  State,\n  Watch,\n  Host,\n  VNode,\n  Build,\n} from '@stencil/core';\nimport Modal from '../../utils/modal';\nimport { lockBodyScrolling, unlockBodyScrolling } from '../../utils/scroll';\nimport { createColorClasses } from '../../utils/theme';\nimport { transformTag, h } from '../../utils/renderer';\nimport type { Color } from '../../types/shared';\n\nlet toastStackTr: HTMLElement;\nlet toastStackTl: HTMLElement;\nlet toastStackBl: HTMLElement;\nlet toastStackBr: HTMLElement;\n\nif (globalThis['document']) {\n  toastStackTr = Object.assign(document.createElement('div'), {\n    className: 'nano-toast-stack nano-toast-stack--tr',\n  });\n  toastStackTl = Object.assign(document.createElement('div'), {\n    className: 'nano-toast-stack nano-toast-stack--tl',\n  });\n  toastStackBl = Object.assign(document.createElement('div'), {\n    className: 'nano-toast-stack nano-toast-stack--bl',\n  });\n  toastStackBr = Object.assign(document.createElement('div'), {\n    className: 'nano-toast-stack nano-toast-stack--br',\n  });\n}\n\n/**\n * Alerts are used to display important messages either inline, as toast notifications or as modals requiring action.\n * @slot - The alert's content.\n * @slot icon - An icon to show in the alert.\n * @slot footer - Place items at the bottom of the alert. Best used with `button` elements - esp when used as with the `alert()` method.\n */\n@Component({\n  tag: 'nano-alert',\n  styleUrl: 'alert.scss',\n  shadow: true,\n})\nexport class Alert implements ComponentInterface {\n  private autoHideTimeout: ReturnType<typeof setTimeout>;\n  private panel: HTMLElement;\n  private overlay: HTMLElement;\n  private modal: Modal;\n  private originalTrigger: HTMLElement | null;\n  private goingToHide = false;\n  private goingToShow = false;\n\n  @State() isModal = false;\n  @State() isToast = false;\n  @State() isShowing = false;\n  @State() label: string;\n  @State() noDismiss = false;\n\n  @Element() host: HTMLNanoAlertElement;\n\n  /** Indicates whether or not the alert is open. You can use this in lieu of the show/hide methods. */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  @Watch('open')\n  handleOpenChange() {\n    if (this.open) this.show();\n    else this.hide();\n  }\n\n  /** Set to true to make the alert closable. */\n  @Prop({ reflect: true }) closable = false;\n\n  /** The color to use from the application's color palette. */\n  @Prop({ reflect: true }) color?: Color;\n\n  /**\n   * The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with the\n   * alert before it closes (e.g. moves the mouse over it), the timer will restart.\n   */\n  @Prop() duration = Infinity;\n\n  @Watch('duration')\n  handleDurationChange() {\n    this.restartAutoHide();\n  }\n\n  /**\n   * Relocate the dialog to the root of the DOM.\n   * Most useful in conjunction with `alert()` when parental elements\n   * have css stacking constraints which don't allow for `position: fixed`\n   */\n  @Prop() hoist = false;\n\n  @Watch('hoist')\n  handleHoistChange() {\n    if (!this.hoist || document.body.children[0] === this.host) return;\n    document.body.prepend(this.host);\n  }\n\n  /** Emitted when the alert opens. Calling `event.preventDefault()` will prevent it from being opened. */\n  @Event() nanoShow: EventEmitter;\n\n  /** Emitted after the alert opens and all transitions are complete. */\n  @Event() nanoAfterShow: EventEmitter;\n\n  /** Emitted when the alert closes. Calling `event.preventDefault()` will prevent it from being closed. */\n  @Event() nanoHide: EventEmitter;\n\n  /** Emitted after the alert closes and all transitions are complete. */\n  @Event() nanoAfterHide: EventEmitter;\n\n  /**\n   * Shows the alert.\n   * @returns a promise that resolves after the alert is shown\n   */\n  @Method()\n  async show() {\n    if (this.goingToShow) return;\n\n    const nanoShow = this.nanoShow.emit();\n    if (nanoShow.defaultPrevented) {\n      this.open = false;\n      return false;\n    }\n\n    this.host.hidden = false;\n    this.goingToShow = true;\n    this.open = true;\n\n    if (Build.isBrowser) {\n      requestAnimationFrame(() => {\n        this.isShowing = true;\n        this.goingToShow = false;\n      });\n    } else {\n      this.isShowing = true;\n      this.goingToShow = false;\n    }\n\n    if (this.duration < Infinity) {\n      clearTimeout(this.autoHideTimeout);\n      this.autoHideTimeout = setTimeout(() => this.hide(), this.duration);\n    }\n  }\n\n  /**\n   * Hides the alert\n   * @returns a promise that resolves after the alert is hidden\n   */\n  @Method()\n  async hide() {\n    if (this.goingToHide) {\n      return;\n    }\n    const nanoHide = this.nanoHide.emit();\n\n    if (nanoHide.defaultPrevented) {\n      this.open = true;\n      return false;\n    }\n    this.goingToHide = true;\n    this.open = false;\n\n    requestAnimationFrame(() => (this.goingToHide = false));\n    clearTimeout(this.autoHideTimeout);\n  }\n\n  /**\n   * Displays the alert as a toast notification. This will move the alert out of its position in the DOM and, when\n   * dismissed, it will be removed from the DOM completely. By storing a reference to the alert, you can reuse it by\n   * calling this method again. The returned promise will resolve after the alert is hidden.\n   *\n   * @param position options are tr (top-right - default), tl (top-left), br (bottom-right), bl (bottom-left)\n   * @returns a promise which will resolve after the alert has hidden\n   */\n  @Method()\n  async toast(position: 'tr' | 'tl' | 'bl' | 'br' = 'tr') {\n    this.isToast = true;\n    return new Promise<void>((resolve) => {\n      let toastStack: HTMLElement;\n      switch (position) {\n        case 'tl':\n          toastStack = toastStackTl;\n          break;\n        case 'bl':\n          toastStack = toastStackBl;\n          break;\n        case 'br':\n          toastStack = toastStackBr;\n          break;\n        default:\n          toastStack = toastStackTr;\n          break;\n      }\n\n      if (!toastStack.parentElement) {\n        document.body.appendChild(toastStack);\n      }\n\n      toastStack.appendChild(this.host);\n      this.connectedCallback();\n      this.show();\n\n      const onClose = () => {\n        this.host.remove();\n        this.isToast = false;\n        resolve();\n\n        // Remove the toast stack from the DOM when there are no more alerts\n        if (!toastStack.querySelector(transformTag('nano-alert'))) {\n          toastStack.remove();\n        }\n      };\n\n      this.host.addEventListener('nanoAfterHide', onClose, { once: true });\n      this.host.addEventListener('nano-after-hide', onClose, { once: true });\n    });\n  }\n\n  /**\n   * Displays the alert as a dialog / modal - more akin to a traditional js alert().\n   * @param label a label for assistive technology\n   */\n  @Method()\n  async alert(label: string) {\n    this.isModal = true;\n    this.label = label;\n\n    return new Promise<void>((resolve) => {\n      if (!document.body.contains(this.host)) {\n        document.body.appendChild(this.host);\n      }\n\n      this.modal.activate();\n      lockBodyScrolling(this.host);\n      this.originalTrigger = document.activeElement as HTMLElement;\n\n      requestAnimationFrame(() => {\n        this.show();\n      });\n\n      const onOpen = () =>\n        requestAnimationFrame(() => this.panel.focus({ preventScroll: true }));\n\n      const onClose = () => {\n        this.modal.deactivate();\n        this.host.remove();\n        this.label = undefined;\n        this.isModal = false;\n        resolve();\n\n        // Restore focus to the original trigger\n        if (\n          this.originalTrigger &&\n          typeof this.originalTrigger.focus === 'function'\n        ) {\n          setTimeout(() => this.originalTrigger.focus());\n        }\n      };\n\n      this.host.addEventListener('nanoAfterShow', onOpen, { once: true });\n      this.host.addEventListener('nano-after-show', onOpen, { once: true });\n\n      this.host.addEventListener('nanoAfterHide', onClose, {\n        once: true,\n      });\n      this.host.addEventListener('nano-after-hide', onClose, {\n        once: true,\n      });\n    });\n  }\n\n  private handleMouseMove = () => {\n    this.restartAutoHide();\n  };\n\n  private handleCloseClick = () => {\n    this.hide();\n  };\n\n  private handleTransitionEnd = (event: TransitionEvent) => {\n    if (\n      event.propertyName === 'opacity' &&\n      (event.target === this.panel || event.target === this.overlay)\n    ) {\n      this.host.hidden = !this.open;\n      this.isShowing = this.open;\n\n      if (this.open) this.nanoAfterShow.emit();\n      else this.nanoAfterHide.emit();\n    }\n  };\n\n  private handleButtonClick = (e: PointerEvent & { target: HTMLElement }) => {\n    if (e.defaultPrevented) return;\n    if (e.target.tagName && e.target.tagName.toLowerCase() === 'button')\n      this.hide();\n  };\n\n  private restartAutoHide = () => {\n    clearTimeout(this.autoHideTimeout);\n    if (this.open && this.duration < Infinity) {\n      this.autoHideTimeout = setTimeout(() => this.hide(), this.duration);\n    }\n  };\n\n  connectedCallback() {\n    this.modal = new Modal(this.host);\n    this.handleHoistChange();\n    this.host.addEventListener('click', this.handleButtonClick);\n    this.isShowing = typeof this.host.getAttribute('showing') === 'string';\n  }\n\n  disconnectedCallback() {\n    unlockBodyScrolling(this.host);\n    this.host.removeEventListener('click', this.handleButtonClick);\n  }\n\n  componentDidLoad() {\n    // Show on init if open\n    if (this.open && !this.isShowing) {\n      this.show();\n    }\n  }\n\n  private Panel = (): VNode => {\n    return (\n      <div\n        ref={(div) => (this.panel = div)}\n        part=\"panel\"\n        class={{\n          alert: true,\n          'alert--open': this.open,\n          'alert--toasty': this.isToast,\n          'alert--modal': !!this.isModal,\n          'alert--showing': this.isShowing,\n          'alert--nodismiss': this.noDismiss,\n        }}\n        tabIndex={this.isModal ? 0 : undefined}\n        role={this.isModal ? 'alertdialog' : 'alert'}\n        aria-live=\"assertive\"\n        aria-atomic=\"true\"\n        aria-hidden={this.isShowing ? 'false' : 'true'}\n        aria-modal={this.isModal ? 'true' : undefined}\n        aria-label={this.label ? this.label : undefined}\n        onMouseMove={this.handleMouseMove}\n        onTransitionEnd={this.handleTransitionEnd}\n      >\n        <div class=\"alert__content\">\n          <div part=\"icon\" class=\"alert__icon\">\n            <slot name=\"icon\" />\n          </div>\n          <div part=\"message\" class=\"alert__message\">\n            <slot />\n          </div>\n          {this.closable && (\n            <div class=\"alert__close\">\n              <nano-icon-button\n                class=\"alert__close\"\n                iconName=\"light/xmark\"\n                label=\"close menu\"\n                onClick={this.handleCloseClick}\n              ></nano-icon-button>\n            </div>\n          )}\n        </div>\n        <div class=\"alert__footer\">\n          <slot name=\"footer\" />\n        </div>\n      </div>\n    );\n  };\n\n  render() {\n    return (\n      <Host\n        class={{ ...createColorClasses(this.color), 'nano-alert': true }}\n        showing={this.isShowing}\n      >\n        {this.isModal && [\n          <div\n            part=\"overlay\"\n            class={{\n              alert__overlay: true,\n              'alert__overlay--open': this.open,\n            }}\n            ref={(div) => (this.overlay = div)}\n          />,\n          <div\n            class=\"alert__modal-wrap\"\n            onClick={(e: MouseEvent & { target: HTMLElement }) => {\n              if (!e.target.classList.contains('alert__modal-wrap')) return;\n              this.noDismiss = true;\n              setTimeout(() => (this.noDismiss = false), 250);\n            }}\n          >\n            <this.Panel />\n          </div>,\n        ]}\n        {!this.isModal && <this.Panel />}\n      </Host>\n    );\n  }\n}\n"],"version":3}