@politiet/sheriff-web-components 2.7.0 → 2.7.1

package/dist/sds-tooltip/sds-tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sds-tooltip.js","sourceRoot":"","sources":["../../src/sds-tooltip/sds-tooltip.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { guardedCustomElement } from '../utils/guarded-custom-element';\nimport { styles } from './sds-tooltip.styles';\nimport '../shared/positioning.js';\nimport { SDSEventDispatcherMixin } from '../mixins/sds-event-dispatcher-mixin';\n\ntype SDSTooltipPlacement = 'top' | 'bottom' | 'left' | 'right';\n\nexport interface SDSTooltipProps {\n\tid: string;\n\tplacement?: SDSTooltipPlacement;\n}\n\n@guardedCustomElement('sds-tooltip')\nexport class SDSTooltip extends SDSEventDispatcherMixin(LitElement) {\n\tstatic override styles = [styles];\n\n\t@property({ type: String, reflect: true })\n\tplacement: SDSTooltipPlacement = 'top';\n\n\tprivate triggers: HTMLElement[] = [];\n\tprivate cleanups: (() => void)[] = [];\n\tprivate hoverTimeout: ReturnType<typeof setTimeout> | undefined;\n\tprivate activeTrigger: HTMLElement | undefined;\n\n\toverride connectedCallback() {\n\t\tsuper.connectedCallback();\n\t\tthis.setAttribute('role', 'tooltip');\n\t\tthis.setAttribute('popover', 'manual');\n\t\t// Avoid screen readers entering the tooltip\n\t\t// Rather set the tooltip's text as an aria-label on the trigger element\n\t\tthis.setAttribute('aria-hidden', 'true');\n\t\tthis.dataset.placement = this.placement;\n\t\tthis.bindTriggers();\n\t\t// Defer to allow triggers to complete their first render\n\t\trequestAnimationFrame(() => this.syncTriggerLabels());\n\t}\n\n\toverride updated(changed: Map<string, unknown>) {\n\t\tif (changed.has('placement')) {\n\t\t\tthis.dataset.placement = this.placement;\n\t\t}\n\t}\n\n\toverride disconnectedCallback() {\n\t\tsuper.disconnectedCallback();\n\t\tclearTimeout(this.hoverTimeout);\n\t\tdocument.removeEventListener('keydown', this.onKeyDown);\n\t\tfor (const cleanup of this.cleanups) {\n\t\t\tcleanup();\n\t\t}\n\t\tthis.cleanups = [];\n\t\tthis.triggers = [];\n\t\tthis.activeTrigger = undefined;\n\t}\n\n\toverride render() {\n\t\treturn html`<slot @slotchange=${this.syncTriggerLabels}></slot>`;\n\t}\n\n\tprivate syncTriggerLabels() {\n\t\tconst text = this.textContent?.trim() ?? '';\n\t\tif (!text) {\n\t\t\treturn;\n\t\t}\n\n\t\tthis.triggers.map((trigger) => {\n\t\t\tconst element = trigger.shadowRoot?.querySelector<HTMLElement>('button, a') ?? trigger;\n\t\t\tthis.cleanups.push(() => element.removeAttribute('aria-label'));\n\t\t\telement.setAttribute('aria-label', text);\n\t\t});\n\t}\n\n\tprivate bindTriggers() {\n\t\tif (!this.id) return;\n\n\t\tthis.triggers = [...document.querySelectorAll<HTMLElement>('[aria-describedby]')].filter((trigger) => {\n\t\t\tconst describedBy = trigger.getAttribute('aria-describedby');\n\t\t\t// `aria-describedby` is a space-separated ID list, e.g. \"field-help tooltip-id\".\n\t\t\t// `/\\s+/` splits on one or more whitespace characters so we can match this tooltip's id.\n\t\t\treturn describedBy?.split(/\\s+/).includes(this.id) ?? false;\n\t\t});\n\n\t\tfor (const trigger of this.triggers) {\n\t\t\tconst onMouseEnter = () => this.show(trigger);\n\t\t\tconst onMouseLeave = () => this.scheduleHide();\n\t\t\tconst onFocusIn = () => this.show(trigger);\n\t\t\tconst onFocusOut = () => this.hide();\n\n\t\t\ttrigger.addEventListener('mouseenter', onMouseEnter);\n\t\t\ttrigger.addEventListener('mouseleave', onMouseLeave);\n\t\t\ttrigger.addEventListener('focusin', onFocusIn);\n\t\t\ttrigger.addEventListener('focusout', onFocusOut);\n\n\t\t\tthis.cleanups.push(() => {\n\t\t\t\ttrigger.removeEventListener('mouseenter', onMouseEnter);\n\t\t\t\ttrigger.removeEventListener('mouseleave', onMouseLeave);\n\t\t\t\ttrigger.removeEventListener('focusin', onFocusIn);\n\t\t\t\ttrigger.removeEventListener('focusout', onFocusOut);\n\t\t\t});\n\t\t}\n\n\t\t// Hovering the tooltip itself keeps it open (MDN pattern)\n\t\tthis.addEventListener('mouseenter', this.onSelfMouseEnter);\n\t\tthis.addEventListener('mouseleave', this.onSelfMouseLeave);\n\t\tthis.cleanups.push(() => {\n\t\t\tthis.removeEventListener('mouseenter', this.onSelfMouseEnter);\n\t\t\tthis.removeEventListener('mouseleave', this.onSelfMouseLeave);\n\t\t});\n\t}\n\n\tprivate onSelfMouseEnter = () => {\n\t\tclearTimeout(this.hoverTimeout);\n\t};\n\tprivate onSelfMouseLeave = () => this.hide();\n\n\tprivate show(trigger: HTMLElement) {\n\t\tclearTimeout(this.hoverTimeout);\n\n\t\tif (!this.matches(':popover-open')) {\n\t\t\tthis.showPopover();\n\t\t}\n\n\t\tif (this.activeTrigger !== trigger) {\n\t\t\tthis.activeTrigger = trigger;\n\t\t\tthis.dispatchSheriffEvent('toggle', trigger);\n\t\t}\n\n\t\tdocument.addEventListener('keydown', this.onKeyDown);\n\t}\n\n\tprivate hide() {\n\t\tclearTimeout(this.hoverTimeout);\n\n\t\ttry {\n\t\t\tthis.hidePopover();\n\t\t} catch {\n\t\t\t// Already hidden\n\t\t}\n\n\t\tthis.activeTrigger = undefined;\n\t\tdocument.removeEventListener('keydown', this.onKeyDown);\n\t}\n\n\tprivate scheduleHide() {\n\t\tclearTimeout(this.hoverTimeout);\n\t\t// Grace period to let cursor travel from trigger to tooltip\n\t\tthis.hoverTimeout = setTimeout(() => this.hide(), 200);\n\t}\n\n\tprivate onKeyDown = (e: KeyboardEvent) => {\n\t\tif (e.key === 'Escape') {\n\t\t\tthis.hide();\n\t\t}\n\t};\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-tooltip': SDSTooltip;\n\t}\n}\n"]}

package/dist/sds-tooltip/sds-tooltip.spec.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=sds-tooltip.spec.d.ts.map

package/dist/sds-tooltip/sds-tooltip.spec.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sds-tooltip.spec.d.ts","sourceRoot":"","sources":["../../src/sds-tooltip/sds-tooltip.spec.ts"],"names":[],"mappings":""}

package/dist/sds-tooltip/sds-tooltip.spec.js

@@ -0,0 +1,35 @@
+import { test, expect } from '@playwright/test';
+test.describe('tooltip-component', () => {
+    test.beforeEach(async ({ page }) => {
+        await page.goto('iframe.html?viewMode=story&id=komponenter-tooltip--default');
+    });
+    test('is hidden by default', async ({ page }) => {
+        const tooltip = page.locator('#tooltip-default');
+        await expect(tooltip).not.toBeVisible();
+    });
+    test('shows on hover', async ({ page }) => {
+        const trigger = page.locator('sds-text[aria-describedby="tooltip-default"]');
+        const tooltip = page.locator('#tooltip-default');
+        await trigger.hover();
+        await expect(tooltip).toBeVisible();
+    });
+    test('shows on focus', async ({ page }) => {
+        const trigger = page.locator('sds-text[aria-describedby="tooltip-default"]');
+        const tooltip = page.locator('#tooltip-default');
+        await trigger.focus();
+        await expect(tooltip).toBeVisible();
+    });
+    test('hides on escape', async ({ page }) => {
+        const trigger = page.locator('sds-text[aria-describedby="tooltip-default"]');
+        const tooltip = page.locator('#tooltip-default');
+        await trigger.hover();
+        await expect(tooltip).toBeVisible();
+        await page.keyboard.press('Escape');
+        await expect(tooltip).not.toBeVisible();
+    });
+    test('has role tooltip', async ({ page }) => {
+        const tooltip = page.locator('#tooltip-default');
+        await expect(tooltip).toHaveAttribute('role', 'tooltip');
+    });
+});
+//# sourceMappingURL=sds-tooltip.spec.js.map

package/dist/sds-tooltip/sds-tooltip.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sds-tooltip.spec.js","sourceRoot":"","sources":["../../src/sds-tooltip/sds-tooltip.spec.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAEhD,IAAI,CAAC,QAAQ,CAAC,mBAAmB,EAAE,GAAG,EAAE;IACvC,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;QAClC,MAAM,IAAI,CAAC,IAAI,CAAC,4DAA4D,CAAC,CAAC;IAC/E,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,sBAAsB,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;QAC/C,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC;QACjD,MAAM,MAAM,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC;IACzC,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,gBAAgB,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;QACzC,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,8CAA8C,CAAC,CAAC;QAC7E,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC;QAEjD,MAAM,OAAO,CAAC,KAAK,EAAE,CAAC;QACtB,MAAM,MAAM,CAAC,OAAO,CAAC,CAAC,WAAW,EAAE,CAAC;IACrC,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,gBAAgB,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;QACzC,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,8CAA8C,CAAC,CAAC;QAC7E,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC;QAEjD,MAAM,OAAO,CAAC,KAAK,EAAE,CAAC;QACtB,MAAM,MAAM,CAAC,OAAO,CAAC,CAAC,WAAW,EAAE,CAAC;IACrC,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,iBAAiB,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;QAC1C,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,8CAA8C,CAAC,CAAC;QAC7E,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC;QAEjD,MAAM,OAAO,CAAC,KAAK,EAAE,CAAC;QACtB,MAAM,MAAM,CAAC,OAAO,CAAC,CAAC,WAAW,EAAE,CAAC;QAEpC,MAAM,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;QACpC,MAAM,MAAM,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC;IACzC,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,kBAAkB,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;QAC3C,MAAM,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC;QACjD,MAAM,MAAM,CAAC,OAAO,CAAC,CAAC,eAAe,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;IAC1D,CAAC,CAAC,CAAC;AACJ,CAAC,CAAC,CAAC","sourcesContent":["import { test, expect } from '@playwright/test';\n\ntest.describe('tooltip-component', () => {\n\ttest.beforeEach(async ({ page }) => {\n\t\tawait page.goto('iframe.html?viewMode=story&id=komponenter-tooltip--default');\n\t});\n\n\ttest('is hidden by default', async ({ page }) => {\n\t\tconst tooltip = page.locator('#tooltip-default');\n\t\tawait expect(tooltip).not.toBeVisible();\n\t});\n\n\ttest('shows on hover', async ({ page }) => {\n\t\tconst trigger = page.locator('sds-text[aria-describedby=\"tooltip-default\"]');\n\t\tconst tooltip = page.locator('#tooltip-default');\n\n\t\tawait trigger.hover();\n\t\tawait expect(tooltip).toBeVisible();\n\t});\n\n\ttest('shows on focus', async ({ page }) => {\n\t\tconst trigger = page.locator('sds-text[aria-describedby=\"tooltip-default\"]');\n\t\tconst tooltip = page.locator('#tooltip-default');\n\n\t\tawait trigger.focus();\n\t\tawait expect(tooltip).toBeVisible();\n\t});\n\n\ttest('hides on escape', async ({ page }) => {\n\t\tconst trigger = page.locator('sds-text[aria-describedby=\"tooltip-default\"]');\n\t\tconst tooltip = page.locator('#tooltip-default');\n\n\t\tawait trigger.hover();\n\t\tawait expect(tooltip).toBeVisible();\n\n\t\tawait page.keyboard.press('Escape');\n\t\tawait expect(tooltip).not.toBeVisible();\n\t});\n\n\ttest('has role tooltip', async ({ page }) => {\n\t\tconst tooltip = page.locator('#tooltip-default');\n\t\tawait expect(tooltip).toHaveAttribute('role', 'tooltip');\n\t});\n});\n"]}

package/dist/sds-tooltip/sds-tooltip.styles.d.ts

@@ -0,0 +1,2 @@
+export declare const styles: import("lit").CSSResult;
+//# sourceMappingURL=sds-tooltip.styles.d.ts.map

package/dist/sds-tooltip/sds-tooltip.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sds-tooltip.styles.d.ts","sourceRoot":"","sources":["../../src/sds-tooltip/sds-tooltip.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,MAAM,yBAmFlB,CAAC"}

package/dist/sds-tooltip/sds-tooltip.styles.js

@@ -0,0 +1,87 @@
+import { css, unsafeCSS } from 'lit';
+import stylesheet from './assets/tooltip-styles';
+export const styles = css `
+	${unsafeCSS(stylesheet)}
+
+	:host {
+		--dsc-tooltip-background: var(--sds-tooltip-background, var(--sds-color-neutral-text-default));
+		--dsc-tooltip-color: var(--sds-tooltip-text-color, var(--sds-color-neutral-background-default));
+		--dsc-tooltip-border-radius: var(--sds-tooltip-border-radius, var(--sds-radius-sm));
+		--dsc-tooltip-padding: var(--sds-tooltip-padding, var(--sds-spacing-4xs) var(--sds-spacing-3xs));
+		--dsc-tooltip-arrow-size: var(--sds-tooltip-arrow-size, 8px);
+
+		--_sds-tooltip-max-width: var(--sds-tooltip-max-width, 30ch);
+		--_sds-tooltip-font-size: var(--sds-tooltip-font-size, var(--sds-components-font-size-content-sm, 0.875rem));
+		--_sds-tooltip-line-height: var(--sds-tooltip-line-height, var(--sds-components-line-height-squeezed-sm, 1.125rem));
+
+		slot {
+			max-width: var(--_sds-tooltip-max-width);
+			font-size: var(--_sds-tooltip-font-size);
+			line-height: var(--_sds-tooltip-line-height);
+		}
+	}
+
+	/* Note: Designsystem's tooltip.css uses nested CSS selectors that do not work in the shadow DOM.
+	   These rules ensure that arrow positioning works for our tooltip.
+	   Do not remove unless the CSS selectors from Designsystem work out of the box. */
+	:host([data-floating|='top'])::before {
+		rotate: 45deg;
+		top: 100%;
+	}
+	:host([data-floating|='right'])::before {
+		left: 0;
+		rotate: 135deg;
+	}
+	:host([data-floating|='bottom'])::before {
+		rotate: -135deg;
+		top: 0;
+	}
+	:host([data-floating|='left'])::before {
+		left: 100%;
+		rotate: -45deg;
+	}
+
+	:host([data-floating='top'])::after,
+	:host([data-floating='bottom'])::after {
+		height: var(--dsc-tooltip-arrow-size);
+		left: 0;
+		width: 100%;
+	}
+	:host([data-floating='top'])::after {
+		top: 100%;
+	}
+	:host([data-floating='bottom'])::after {
+		top: calc(var(--dsc-tooltip-arrow-size) * -1);
+	}
+	:host([data-floating='left'])::after,
+	:host([data-floating='right'])::after {
+		height: 100%;
+		top: 0;
+		width: var(--dsc-tooltip-arrow-size);
+	}
+	:host([data-floating='right'])::after {
+		left: calc(var(--dsc-tooltip-arrow-size) * -1);
+	}
+	:host([data-floating='left'])::after {
+		left: 100%;
+	}
+
+	@keyframes ds-fade-in {
+		from {
+			opacity: 0;
+		}
+	}
+
+	@media (prefers-reduced-motion: reduce) {
+		:host {
+			animation: none;
+		}
+	}
+
+	@media (forced-colors: active) {
+		:host {
+			border: 1px solid CanvasText;
+		}
+	}
+`;
+//# sourceMappingURL=sds-tooltip.styles.js.map

package/dist/sds-tooltip/sds-tooltip.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sds-tooltip.styles.js","sourceRoot":"","sources":["../../src/sds-tooltip/sds-tooltip.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC;AACrC,OAAO,UAAU,MAAM,yBAAyB,CAAC;AAEjD,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;GACtB,SAAS,CAAC,UAAU,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkFvB,CAAC","sourcesContent":["import { css, unsafeCSS } from 'lit';\nimport stylesheet from './assets/tooltip-styles';\n\nexport const styles = css`\n\t${unsafeCSS(stylesheet)}\n\n\t:host {\n\t\t--dsc-tooltip-background: var(--sds-tooltip-background, var(--sds-color-neutral-text-default));\n\t\t--dsc-tooltip-color: var(--sds-tooltip-text-color, var(--sds-color-neutral-background-default));\n\t\t--dsc-tooltip-border-radius: var(--sds-tooltip-border-radius, var(--sds-radius-sm));\n\t\t--dsc-tooltip-padding: var(--sds-tooltip-padding, var(--sds-spacing-4xs) var(--sds-spacing-3xs));\n\t\t--dsc-tooltip-arrow-size: var(--sds-tooltip-arrow-size, 8px);\n\n\t\t--_sds-tooltip-max-width: var(--sds-tooltip-max-width, 30ch);\n\t\t--_sds-tooltip-font-size: var(--sds-tooltip-font-size, var(--sds-components-font-size-content-sm, 0.875rem));\n\t\t--_sds-tooltip-line-height: var(--sds-tooltip-line-height, var(--sds-components-line-height-squeezed-sm, 1.125rem));\n\n\t\tslot {\n\t\t\tmax-width: var(--_sds-tooltip-max-width);\n\t\t\tfont-size: var(--_sds-tooltip-font-size);\n\t\t\tline-height: var(--_sds-tooltip-line-height);\n\t\t}\n\t}\n\n\t/* Note: Designsystem's tooltip.css uses nested CSS selectors that do not work in the shadow DOM.\n\t   These rules ensure that arrow positioning works for our tooltip.\n\t   Do not remove unless the CSS selectors from Designsystem work out of the box. */\n\t:host([data-floating|='top'])::before {\n\t\trotate: 45deg;\n\t\ttop: 100%;\n\t}\n\t:host([data-floating|='right'])::before {\n\t\tleft: 0;\n\t\trotate: 135deg;\n\t}\n\t:host([data-floating|='bottom'])::before {\n\t\trotate: -135deg;\n\t\ttop: 0;\n\t}\n\t:host([data-floating|='left'])::before {\n\t\tleft: 100%;\n\t\trotate: -45deg;\n\t}\n\n\t:host([data-floating='top'])::after,\n\t:host([data-floating='bottom'])::after {\n\t\theight: var(--dsc-tooltip-arrow-size);\n\t\tleft: 0;\n\t\twidth: 100%;\n\t}\n\t:host([data-floating='top'])::after {\n\t\ttop: 100%;\n\t}\n\t:host([data-floating='bottom'])::after {\n\t\ttop: calc(var(--dsc-tooltip-arrow-size) * -1);\n\t}\n\t:host([data-floating='left'])::after,\n\t:host([data-floating='right'])::after {\n\t\theight: 100%;\n\t\ttop: 0;\n\t\twidth: var(--dsc-tooltip-arrow-size);\n\t}\n\t:host([data-floating='right'])::after {\n\t\tleft: calc(var(--dsc-tooltip-arrow-size) * -1);\n\t}\n\t:host([data-floating='left'])::after {\n\t\tleft: 100%;\n\t}\n\n\t@keyframes ds-fade-in {\n\t\tfrom {\n\t\t\topacity: 0;\n\t\t}\n\t}\n\n\t@media (prefers-reduced-motion: reduce) {\n\t\t:host {\n\t\t\tanimation: none;\n\t\t}\n\t}\n\n\t@media (forced-colors: active) {\n\t\t:host {\n\t\t\tborder: 1px solid CanvasText;\n\t\t}\n\t}\n`;\n"]}

package/dist/shared/positioning.d.ts

@@ -0,0 +1,2 @@
+import './assets/positioning.js';
+//# sourceMappingURL=positioning.d.ts.map

package/dist/shared/positioning.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"positioning.d.ts","sourceRoot":"","sources":["../../src/shared/positioning.ts"],"names":[],"mappings":"AAAA,OAAO,yBAAyB,CAAC"}

package/dist/shared/positioning.js

@@ -0,0 +1,2 @@
+import './assets/positioning.js';
+//# sourceMappingURL=positioning.js.map

package/dist/shared/positioning.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"positioning.js","sourceRoot":"","sources":["../../src/shared/positioning.ts"],"names":[],"mappings":"AAAA,OAAO,yBAAyB,CAAC","sourcesContent":["import './assets/positioning.js';\n"]}