@warp-ds/elements 2.2.0-next.1 → 2.2.0-next.11

package/dist/packages/pill/locales/da/messages.mjs

@@ -0,0 +1 @@
+/*eslint-disable*/ export const messages = JSON.parse("{\"pill.aria.openFilter\":[\"Åbn filter\"],\"pill.aria.removeFilter\":[\"Fjern filter \",[\"label\"]]}");

package/dist/packages/pill/locales/en/messages.mjs

@@ -0,0 +1 @@
+/*eslint-disable*/ export const messages = JSON.parse("{\"pill.aria.openFilter\":[\"Open filter\"],\"pill.aria.removeFilter\":[\"Remove filter \",[\"label\"]]}");

package/dist/packages/pill/locales/fi/messages.mjs

@@ -0,0 +1 @@
+/*eslint-disable*/ export const messages = JSON.parse("{\"pill.aria.openFilter\":[\"Avaa suodatin\"],\"pill.aria.removeFilter\":[\"Tyhjennä suodatin \",[\"label\"]]}");

package/dist/packages/pill/locales/nb/messages.mjs

@@ -0,0 +1 @@
+/*eslint-disable*/ export const messages = JSON.parse("{\"pill.aria.openFilter\":[\"Åpne filter\"],\"pill.aria.removeFilter\":[\"Fjern filter \",[\"label\"]]}");

package/dist/packages/pill/locales/sv/messages.mjs

@@ -0,0 +1 @@
+/*eslint-disable*/ export const messages = JSON.parse("{\"pill.aria.openFilter\":[\"Öppna filter\"],\"pill.aria.removeFilter\":[\"Ta bort filtret \",[\"label\"]]}");

package/dist/packages/pill/pill.stories.d.ts

@@ -0,0 +1,12 @@
+import type { Meta, StoryObj } from '@storybook/web-components-vite';
+import type { WarpPill } from './index.js';
+import './index.js';
+declare const args: Partial<WarpPill> & {
+    [key: string]: any;
+};
+declare const meta: Meta<typeof args>;
+export default meta;
+type Story = StoryObj<typeof args>;
+export declare const Default: Story;
+export declare const Suggestion: Story;
+export declare const Closable: Story;

package/dist/packages/pill/pill.stories.js

@@ -0,0 +1,33 @@
+import { html } from 'lit';
+import { spread } from '@open-wc/lit-helpers';
+import { getStorybookHelpers } from '@wc-toolkit/storybook-helpers';
+import { prespread } from '../../.storybook/utilities.js';
+import './index.js';
+const { events, args, argTypes } = getStorybookHelpers('w-pill');
+const meta = {
+    title: 'Buttons/Pill',
+    render(args) {
+        return html `<w-pill ${spread(prespread(args))}>Lorem</w-pill>`;
+    },
+    args,
+    argTypes,
+    parameters: {
+        actions: {
+            handles: events,
+        },
+    },
+};
+export default meta;
+export const Default = {
+    args: {},
+};
+export const Suggestion = {
+    args: {
+        suggestion: true,
+    },
+};
+export const Closable = {
+    args: {
+        'can-close': true,
+    },
+};

package/dist/packages/pill/pill.test.d.ts

@@ -0,0 +1 @@
+import './index.js';

package/dist/packages/pill/pill.test.js

@@ -0,0 +1,23 @@
+import { html } from 'lit';
+import { expect, test } from 'vitest';
+import { render } from 'vitest-browser-lit';
+import './index.js';
+test('renders a pill', async () => {
+    const page = render(html ` <w-pill>Standard</w-pill>`);
+    await expect.element(page.getByText('Standard')).toBeVisible();
+});
+test('renders a pill with a close icon', async () => {
+    const page = render(html ` <w-pill can-close>Close me</w-pill>`);
+    await expect.element(page.getByText('Close me')).toBeVisible();
+    await expect.poll(() => page.getByText('Close me').element().shadowRoot.querySelector('w-icon-close-16')).toBeVisible();
+});
+test('renders screen reader label on the pill', async () => {
+    const page = render(html ` <w-pill open-sr-label="Open me please">Close me</w-pill>`);
+    await expect.element(page.getByText('Close me')).toBeVisible();
+    await expect.element(page.getByText('Open me please')).toBeVisible();
+});
+test('renders screen reader label on the pill', async () => {
+    const page = render(html ` <w-pill open-aria-label="Open me please">Close me</w-pill>`);
+    await expect.element(page.getByText('Close me')).toBeVisible();
+    await expect.element(page.getByText('Open me please')).toBeVisible();
+});

package/dist/packages/pill/styles.d.ts

@@ -0,0 +1 @@
+export declare const styles: import("lit").CSSResult;

package/dist/packages/pill/styles.js

@@ -0,0 +1,2 @@
+import { css } from 'lit';
+export const styles = css `*,:before,:after{--w-rotate:0;--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-scale-x:1;--w-scale-y:1;--w-scale-z:1;--w-skew-x:0;--w-skew-y:0;--w-translate-x:0;--w-translate-y:0;--w-translate-z:0}.bg-\\[--w-color-pill-suggestion-background\\]{background-color:var(--w-color-pill-suggestion-background)}.hover\\:bg-\\[--w-color-pill-suggestion-background-hover\\]:hover{background-color:var(--w-color-pill-suggestion-background-hover)}.active\\:bg-\\[--w-color-pill-suggestion-background-active\\]:active{background-color:var(--w-color-pill-suggestion-background-active)}.rounded-l-full{border-top-left-radius:9999px;border-bottom-left-radius:9999px}.rounded-r-full{border-top-right-radius:9999px;border-bottom-right-radius:9999px}.flex{display:flex}.inline-flex{display:inline-flex}.focusable:focus{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:focus-visible{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:not(:focus-visible){outline:none}.items-center{align-items:center}.static{position:static}.s-bg-primary{background-color:var(--w-s-color-background-primary)}.hover\\:s-bg-primary-hover:hover{background-color:var(--w-s-color-background-primary-hover)}.active\\:s-bg-primary-active:active{background-color:var(--w-s-color-background-primary-active)}.s-text{color:var(--w-s-color-text)}.s-text-inverted{color:var(--w-s-color-text-inverted)}.h-16{height:1.6rem}.py-8{padding-top:.8rem;padding-bottom:.8rem}.pl-12{padding-left:1.2rem}.pl-4{padding-left:.4rem}.pr-12{padding-right:1.2rem}.pr-2{padding-right:.2rem}.font-bold{font-weight:700}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.transition-all{transition-property:all;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.text-xs{font-size:var(--w-font-size-xs);line-height:var(--w-line-height-xs)}`;

package/dist/packages/rip-and-tear-checkbox/checkbox.d.ts

@@ -0,0 +1,64 @@
+import type { PropertyValues } from 'lit';
+import { BaseFormAssociatedElement } from '../rip-and-tear-radio/form-associated-element';
+import '@warp-ds/icons/elements/check-16';
+export declare class WCheckbox extends BaseFormAssociatedElement {
+    static css: import("lit").CSSResult[];
+    static shadowRootOptions: {
+        delegatesFocus: boolean;
+        mode: ShadowRootMode;
+        serializable?: boolean;
+        slotAssignment?: SlotAssignmentMode;
+    };
+    static get validators(): import("../rip-and-tear-radio/form-associated-element").Validator<BaseFormAssociatedElement>[];
+    private readonly hasSlotController;
+    input: HTMLInputElement;
+    title: string;
+    /** The name of the checkbox, submitted as a name/value pair with form data. */
+    name: string;
+    private _value;
+    /** The value of the checkbox, submitted as a name/value pair with form data. */
+    get value(): string | null;
+    set value(val: string | null);
+    /** The checkbox's size. */
+    size: 'small' | 'medium' | 'large';
+    /** Disables the checkbox. */
+    disabled: boolean;
+    /**
+     * Draws the checkbox in an indeterminate state. This is usually applied to checkboxes that represents a "select
+     * all/none" behavior when associated checkboxes have a mix of checked and unchecked states.
+     */
+    indeterminate: boolean;
+    /** Draws the checkbox in a checked state. */
+    checked: boolean;
+    /** The default value of the form control. Primarily used for resetting the form control. */
+    defaultChecked: boolean;
+    /**
+     * By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you
+     * to place the form control outside of a form and associate it with the form that has this `id`. The form must be in
+     * the same document or shadow root for this to work.
+     */
+    form: any;
+    /** Makes the checkbox a required field. */
+    required: boolean;
+    /** The checkbox's hint. If you need to display HTML, use the `hint` slot instead. */
+    hint: string;
+    private handleClick;
+    handleDefaultCheckedChange(): void;
+    handleValueOrCheckedChange(): void;
+    handleStateChange(): void;
+    handleDisabledChange(): void;
+    protected willUpdate(changedProperties: PropertyValues<this>): void;
+    formResetCallback(): void;
+    /** Simulates a click on the checkbox. */
+    click(): void;
+    /** Sets focus on the checkbox. */
+    focus(options?: FocusOptions): void;
+    /** Removes focus from the checkbox. */
+    blur(): void;
+    render(): import("lit").TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'w-checkbox': WCheckbox;
+    }
+}

package/dist/packages/rip-and-tear-checkbox/checkbox.js

@@ -0,0 +1,210 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html } from 'lit';
+import { property, query } from 'lit/decorators.js';
+import { classMap } from 'lit/directives/class-map.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
+import { live } from 'lit/directives/live.js';
+import { BaseFormAssociatedElement } from '../rip-and-tear-radio/form-associated-element';
+import { RequiredValidator } from '../rip-and-tear-radio/required-validator';
+import { HasSlotController } from '../rip-and-tear-radio/slot';
+import { watch } from '../rip-and-tear-radio/watch';
+import '@warp-ds/icons/elements/check-16';
+// eslint-disable-next-line
+// @ts-ignore
+import { styles } from './styles';
+export class WCheckbox extends BaseFormAssociatedElement {
+    constructor() {
+        super(...arguments);
+        this.hasSlotController = new HasSlotController(this, 'hint');
+        this.title = ''; // make reactive to pass through
+        /** The name of the checkbox, submitted as a name/value pair with form data. */
+        this.name = '';
+        this._value = this.getAttribute('value') ?? null;
+        /** The checkbox's size. */
+        this.size = 'medium';
+        /** Disables the checkbox. */
+        this.disabled = false;
+        /**
+         * Draws the checkbox in an indeterminate state. This is usually applied to checkboxes that represents a "select
+         * all/none" behavior when associated checkboxes have a mix of checked and unchecked states.
+         */
+        this.indeterminate = false;
+        /** Draws the checkbox in a checked state. */
+        this.checked = this.hasAttribute('checked');
+        /** The default value of the form control. Primarily used for resetting the form control. */
+        this.defaultChecked = this.hasAttribute('checked');
+        /**
+         * By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you
+         * to place the form control outside of a form and associate it with the form that has this `id`. The form must be in
+         * the same document or shadow root for this to work.
+         */
+        this.form = null;
+        /** Makes the checkbox a required field. */
+        this.required = false;
+        /** The checkbox's hint. If you need to display HTML, use the `hint` slot instead. */
+        this.hint = '';
+    }
+    static { this.css = [styles]; }
+    static { this.shadowRootOptions = { ...BaseFormAssociatedElement.shadowRootOptions, delegatesFocus: true }; }
+    static get validators() {
+        const validators = [
+            RequiredValidator({
+                validationProperty: 'checked',
+                // Use a checkbox so we get "free" translation strings.
+                validationElement: Object.assign(document.createElement('input'), {
+                    type: 'checkbox',
+                    required: true,
+                }),
+            }),
+        ];
+        return [...super.validators, ...validators];
+    }
+    /** The value of the checkbox, submitted as a name/value pair with form data. */
+    get value() {
+        return this._value ?? 'on';
+    }
+    set value(val) {
+        this._value = val;
+    }
+    handleClick() {
+        this.hasInteracted = true;
+        this.checked = !this.checked;
+        this.indeterminate = false;
+        this.updateComplete.then(() => {
+            this.dispatchEvent(new Event('change', { bubbles: true, composed: true }));
+        });
+    }
+    handleDefaultCheckedChange() {
+        if (!this.hasInteracted && this.checked !== this.defaultChecked) {
+            this.checked = this.defaultChecked;
+            this.handleValueOrCheckedChange();
+        }
+    }
+    handleValueOrCheckedChange() {
+        // These @watch() commands seem to override the base element checks for changes, so we need to setValue for the form and and updateValidity()
+        this.setValue(this.checked ? this.value : null, this._value);
+        this.updateValidity();
+    }
+    handleStateChange() {
+        if (this.hasUpdated) {
+            this.input.checked = this.checked; // force a sync update
+            this.input.indeterminate = this.indeterminate; // force a sync update
+        }
+        this.customStates.set('checked', this.checked);
+        this.customStates.set('indeterminate', this.indeterminate);
+        this.updateValidity();
+    }
+    handleDisabledChange() {
+        this.customStates.set('disabled', this.disabled);
+    }
+    willUpdate(changedProperties) {
+        super.willUpdate(changedProperties);
+        if (changedProperties.has('defaultChecked')) {
+            if (!this.hasInteracted) {
+                this.checked = this.defaultChecked;
+            }
+        }
+        if (changedProperties.has('value') || changedProperties.has('checked')) {
+            this.handleValueOrCheckedChange();
+        }
+    }
+    formResetCallback() {
+        // Evaluate checked before the super call because of our watcher on value.
+        this.checked = this.defaultChecked;
+        super.formResetCallback();
+        this.handleValueOrCheckedChange();
+    }
+    /** Simulates a click on the checkbox. */
+    click() {
+        this.input.click();
+    }
+    /** Sets focus on the checkbox. */
+    focus(options) {
+        this.input.focus(options);
+    }
+    /** Removes focus from the checkbox. */
+    blur() {
+        this.input.blur();
+    }
+    render() {
+        const hasHintSlot = this.hasSlotController.test('hint');
+        const hasHint = this.hint ? true : !!hasHintSlot;
+        const isIndeterminate = !this.checked && this.indeterminate;
+        return html `
+      <label part="base">
+        <span part="control">
+          <input
+            class="input"
+            type="checkbox"
+            title=${this.title /* An empty title prevents browser validation tooltips from appearing on hover */}
+            name=${this.name}
+            value=${ifDefined(this._value)}
+            .indeterminate=${live(this.indeterminate)}
+            .checked=${live(this.checked)}
+            .disabled=${this.disabled}
+            .required=${this.required}
+            aria-checked=${this.checked ? 'true' : 'false'}
+            aria-describedby="hint"
+            @click=${this.handleClick} />
+          ${isIndeterminate ? '–' : ''}
+        </span>
+
+        <slot part="label"></slot>
+      </label>
+
+      <slot id="hint" part="hint" name="hint" aria-hidden=${hasHint ? 'false' : 'true'} class="${classMap({ 'has-slotted': hasHint })}">
+        ${this.hint}
+      </slot>
+    `;
+    }
+}
+__decorate([
+    query('input[type="checkbox"]')
+], WCheckbox.prototype, "input", void 0);
+__decorate([
+    property()
+], WCheckbox.prototype, "title", void 0);
+__decorate([
+    property({ reflect: true })
+], WCheckbox.prototype, "name", void 0);
+__decorate([
+    property({ reflect: true })
+], WCheckbox.prototype, "value", null);
+__decorate([
+    property({ reflect: true })
+], WCheckbox.prototype, "size", void 0);
+__decorate([
+    property({ type: Boolean })
+], WCheckbox.prototype, "disabled", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], WCheckbox.prototype, "indeterminate", void 0);
+__decorate([
+    property({ type: Boolean, attribute: false })
+], WCheckbox.prototype, "checked", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: 'checked' })
+], WCheckbox.prototype, "defaultChecked", void 0);
+__decorate([
+    property({ reflect: true })
+], WCheckbox.prototype, "form", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], WCheckbox.prototype, "required", void 0);
+__decorate([
+    property()
+], WCheckbox.prototype, "hint", void 0);
+__decorate([
+    watch('defaultChecked')
+], WCheckbox.prototype, "handleDefaultCheckedChange", null);
+__decorate([
+    watch(['checked', 'indeterminate'])
+], WCheckbox.prototype, "handleStateChange", null);
+__decorate([
+    watch('disabled')
+], WCheckbox.prototype, "handleDisabledChange", null);

package/dist/packages/rip-and-tear-checkbox/index.d.ts

@@ -0,0 +1,6 @@
+import { WCheckbox } from './checkbox';
+declare global {
+    interface HTMLElementTagNameMap {
+        'w-checkbox': WCheckbox;
+    }
+}

package/dist/packages/rip-and-tear-checkbox/index.js

@@ -0,0 +1,160 @@
+var Ee=Object.create;var H=Object.defineProperty;var z=Object.getOwnPropertyDescriptor;var we=Object.getOwnPropertyNames;var ke=Object.getPrototypeOf,Ce=Object.prototype.hasOwnProperty;var J=s=>{throw TypeError(s)};var G=(s,t)=>()=>(t||s((t={exports:{}}).exports,t),t.exports);var _e=(s,t,e,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of we(t))!Ce.call(s,i)&&i!==e&&H(s,i,{get:()=>t[i],enumerable:!(r=z(t,i))||r.enumerable});return s};var Ve=(s,t,e)=>(e=s!=null?Ee(ke(s)):{},_e(t||!s||!s.__esModule?H(e,"default",{value:s,enumerable:!0}):e,s));var c=(s,t,e,r)=>{for(var i=r>1?void 0:r?z(t,e):t,a=s.length-1,n;a>=0;a--)(n=s[a])&&(i=(r?n(t,e,i):n(i))||i);return r&&i&&H(t,e,i),i};var X=(s,t,e)=>t.has(s)||J("Cannot "+e);var Z=(s,t,e)=>(X(s,t,"read from private field"),e?e.call(s):t.get(s)),Q=(s,t,e)=>t.has(s)?J("Cannot add the same private member more than once"):t instanceof WeakSet?t.add(s):t.set(s,e),Y=(s,t,e,r)=>(X(s,t,"write to private field"),r?r.call(s,e):t.set(s,e),e);var se=G(w=>{"use strict";Object.defineProperty(w,"__esModule",{value:!0});w.errorMessages=w.ErrorType=void 0;var _;(function(s){s.MalformedUnicode="MALFORMED_UNICODE",s.MalformedHexadecimal="MALFORMED_HEXADECIMAL",s.CodePointLimit="CODE_POINT_LIMIT",s.OctalDeprecation="OCTAL_DEPRECATION",s.EndOfString="END_OF_STRING"})(_=w.ErrorType||(w.ErrorType={}));w.errorMessages=new Map([[_.MalformedUnicode,"malformed Unicode character escape sequence"],[_.MalformedHexadecimal,"malformed hexadecimal character escape sequence"],[_.CodePointLimit,"Unicode codepoint must not be greater than 0x10FFFF in escape sequence"],[_.OctalDeprecation,'"0"-prefixed octal literals and octal escape sequences are deprecated; for octal literals use the "0o" prefix instead'],[_.EndOfString,"malformed escape sequence at end of string"]])});var ne=G(g=>{"use strict";Object.defineProperty(g,"__esModule",{value:!0});g.unraw=g.errorMessages=g.ErrorType=void 0;var h=se();Object.defineProperty(g,"ErrorType",{enumerable:!0,get:function(){return h.ErrorType}});Object.defineProperty(g,"errorMessages",{enumerable:!0,get:function(){return h.errorMessages}});function Le(s){return!s.match(/[^a-f0-9]/i)?parseInt(s,16):NaN}function x(s,t,e){let r=Le(s);if(Number.isNaN(r)||e!==void 0&&e!==s.length)throw new SyntaxError(h.errorMessages.get(t));return r}function Oe(s){let t=x(s,h.ErrorType.MalformedHexadecimal,2);return String.fromCharCode(t)}function ie(s,t){let e=x(s,h.ErrorType.MalformedUnicode,4);if(t!==void 0){let r=x(t,h.ErrorType.MalformedUnicode,4);return String.fromCharCode(e,r)}return String.fromCharCode(e)}function xe(s){return s.charAt(0)==="{"&&s.charAt(s.length-1)==="}"}function Ne(s){if(!xe(s))throw new SyntaxError(h.errorMessages.get(h.ErrorType.MalformedUnicode));let t=s.slice(1,-1),e=x(t,h.ErrorType.MalformedUnicode);try{return String.fromCodePoint(e)}catch(r){throw r instanceof RangeError?new SyntaxError(h.errorMessages.get(h.ErrorType.CodePointLimit)):r}}function Ie(s,t=!1){if(t)throw new SyntaxError(h.errorMessages.get(h.ErrorType.OctalDeprecation));let e=parseInt(s,8);return String.fromCharCode(e)}var De=new Map([["b","\b"],["f","\f"],["n",`
+`],["r","\r"],["t","	"],["v","\v"],["0","\0"]]);function Re(s){return De.get(s)||s}var He=/\\(?:(\\)|x([\s\S]{0,2})|u(\{[^}]*\}?)|u([\s\S]{4})\\u([^{][\s\S]{0,3})|u([\s\S]{0,4})|([0-3]?[0-7]{1,2})|([\s\S])|$)/g;function ae(s,t=!1){return s.replace(He,function(e,r,i,a,n,o,l,d,f){if(r!==void 0)return"\\";if(i!==void 0)return Oe(i);if(a!==void 0)return Ne(a);if(n!==void 0)return ie(n,o);if(l!==void 0)return ie(l);if(d==="0")return"\0";if(d!==void 0)return Ie(d,!t);if(f!==void 0)return Re(f);throw new SyntaxError(h.errorMessages.get(h.ErrorType.EndOfString))})}g.unraw=ae;g.default=ae});import{html as lt}from"lit";import{property as p,query as ct}from"lit/decorators.js";import{classMap as dt}from"lit/directives/class-map.js";import{ifDefined as ut}from"lit/directives/if-defined.js";import{live as ye}from"lit/directives/live.js";import{isServer as U}from"lit";import{property as C}from"lit/decorators.js";import{LitElement as Me,unsafeCSS as Te}from"lit";import{property as ee}from"lit/decorators.js";import{css as Se}from"lit";var W=Se`
+  :host {
+    box-sizing: border-box !important;
+  }
+
+  :host *,
+  :host *::before,
+  :host *::after {
+    box-sizing: inherit !important;
+  }
+`;var V,E=class extends Me{constructor(){super();Q(this,V,!1);this.initialReflectedProperties=new Map;this.customStates={set:(e,r)=>{var i;(i=this.internals)!=null&&i.states&&(r?this.internals.states.add(e):this.internals.states.delete(e))},has:e=>{var r;return(r=this.internals)!=null&&r.states?this.internals.states.has(e):!1}};try{this.internals=this.attachInternals()}catch(r){console.error("Element internals are not supported in your browser. Consider using a polyfill")}this.customStates.set("wa-defined",!0);let e=this.constructor;for(let[r,i]of e.elementProperties)i.default==="inherit"&&i.initial!==void 0&&typeof r=="string"&&this.customStates.set(`initial-${r}-${i.initial}`,!0)}static get styles(){let e=Array.isArray(this.css)?this.css:this.css?[this.css]:[];return[W,...e].map(r=>typeof r=="string"?Te(r):r)}attributeChangedCallback(e,r,i){Z(this,V)||(this.constructor.elementProperties.forEach((a,n)=>{a.reflect&&this[n]!=null&&this.initialReflectedProperties.set(n,this[n])}),Y(this,V,!0)),super.attributeChangedCallback(e,r,i)}willUpdate(e){super.willUpdate(e),this.initialReflectedProperties.forEach((r,i)=>{e.has(i)&&this[i]==null&&(this[i]=r)})}relayNativeEvent(e,r){e.stopImmediatePropagation(),this.dispatchEvent(new e.constructor(e.type,{...e,...r}))}};V=new WeakMap,c([ee()],E.prototype,"dir",2),c([ee()],E.prototype,"lang",2);var te=()=>({observedAttributes:["custom-error"],checkValidity(s){let t={message:"",isValid:!0,invalidKeys:[]};return s.customError&&(t.message=s.customError,t.isValid=!1,t.invalidKeys=["customError"]),t}});var T=class extends Event{constructor(){super("w-invalid",{bubbles:!0,cancelable:!1,composed:!0})}};var m=class extends E{constructor(){super();this.name=null;this.disabled=!1;this.required=!1;this.assumeInteractionOn=["input"];this.validators=[];this.valueHasChanged=!1;this.hasInteracted=!1;this.customError=null;this.emittedEvents=[];this.emitInvalid=e=>{e.target===this&&(this.hasInteracted=!0,this.dispatchEvent(new T))};this.handleInteraction=e=>{var i;let r=this.emittedEvents;r.includes(e.type)||r.push(e.type),r.length===((i=this.assumeInteractionOn)==null?void 0:i.length)&&(this.hasInteracted=!0)};U||this.addEventListener("invalid",this.emitInvalid)}static get validators(){return[te()]}static get observedAttributes(){let e=new Set(super.observedAttributes||[]);for(let r of this.validators)if(r.observedAttributes)for(let i of r.observedAttributes)e.add(i);return[...e]}connectedCallback(){super.connectedCallback(),this.updateValidity(),this.assumeInteractionOn.forEach(e=>{this.addEventListener(e,this.handleInteraction)})}firstUpdated(...e){super.firstUpdated(...e),this.updateValidity()}willUpdate(e){if(!U&&e.has("customError")&&(this.customError||(this.customError=null),this.setCustomValidity(this.customError||"")),e.has("value")||e.has("disabled")){let r=this.value;if(Array.isArray(r)){if(this.name){let i=new FormData;for(let a of r)i.append(this.name,a);this.setValue(i,i)}}else this.setValue(r,r)}e.has("disabled")&&(this.customStates.set("disabled",this.disabled),(this.hasAttribute("disabled")||!U&&!this.matches(":disabled"))&&this.toggleAttribute("disabled",this.disabled)),this.updateValidity(),super.willUpdate(e)}get labels(){return this.internals.labels}getForm(){return this.internals.form}get validity(){return this.internals.validity}get willValidate(){return this.internals.willValidate}get validationMessage(){return this.internals.validationMessage}checkValidity(){return this.updateValidity(),this.internals.checkValidity()}reportValidity(){return this.updateValidity(),this.hasInteracted=!0,this.internals.reportValidity()}get validationTarget(){return this.input||void 0}setValidity(...e){let r=e[0],i=e[1],a=e[2];a||(a=this.validationTarget),this.internals.setValidity(r,i,a||void 0),this.requestUpdate("validity"),this.setCustomStates()}setCustomStates(){let e=!!this.required,r=this.internals.validity.valid,i=this.hasInteracted;this.customStates.set("required",e),this.customStates.set("optional",!e),this.customStates.set("invalid",!r),this.customStates.set("valid",r),this.customStates.set("user-invalid",!r&&i),this.customStates.set("user-valid",r&&i)}setCustomValidity(e){if(!e){this.customError=null,this.setValidity({});return}this.customError=e,this.setValidity({customError:!0},e,this.validationTarget)}formResetCallback(){this.resetValidity(),this.hasInteracted=!1,this.valueHasChanged=!1,this.emittedEvents=[],this.updateValidity()}formDisabledCallback(e){this.disabled=e,this.updateValidity()}formStateRestoreCallback(e,r){this.value=e,r==="restore"&&this.resetValidity(),this.updateValidity()}setValue(...e){let[r,i]=e;this.internals.setFormValue(r,i)}get allValidators(){let e=this.constructor.validators||[],r=this.validators||[];return[...e,...r]}resetValidity(){this.setCustomValidity(""),this.setValidity({})}updateValidity(){if(this.disabled||this.hasAttribute("disabled")||!this.willValidate){this.resetValidity();return}let e=this.allValidators;if(!(e!=null&&e.length))return;let r={customError:!!this.customError},i=this.validationTarget||this.input||void 0,a="";for(let n of e){let{isValid:o,message:l,invalidKeys:d}=n.checkValidity(this);o||(a||(a=l),(d==null?void 0:d.length)>=0&&d.forEach(f=>r[f]=!0))}a||(a=this.validationMessage),this.setValidity(r,a,i)}};m.formAssociated=!0,c([C({reflect:!0})],m.prototype,"name",2),c([C({type:Boolean})],m.prototype,"disabled",2),c([C({state:!0,attribute:!1})],m.prototype,"valueHasChanged",2),c([C({state:!0,attribute:!1})],m.prototype,"hasInteracted",2),c([C({attribute:"custom-error",reflect:!0})],m.prototype,"customError",2),c([C({attribute:!1,state:!0,type:Object})],m.prototype,"validity",1);var re=(s={})=>{let{validationElement:t,validationProperty:e}=s;t||(t=Object.assign(document.createElement("input"),{required:!0})),e||(e="value");let r={observedAttributes:["required"],message:t.validationMessage,checkValidity(i){var d;let a={message:"",isValid:!0,invalidKeys:[]};return((d=i.required)!=null?d:i.hasAttribute("required"))&&!i[e]&&(a.message=typeof r.message=="function"?r.message(i):r.message||"",a.isValid=!1,a.invalidKeys.push("valueMissing")),a}};return r};var L=class{constructor(t,...e){this.slotNames=[];this.handleSlotChange=t=>{let e=t.target;(this.slotNames.includes("[default]")&&!e.name||e.name&&this.slotNames.includes(e.name))&&this.host.requestUpdate()};(this.host=t).addController(this),this.slotNames=e}hasDefaultSlot(){return[...this.host.childNodes].some(t=>{if(t.nodeType===Node.TEXT_NODE&&t.textContent.trim()!=="")return!0;if(t.nodeType===Node.ELEMENT_NODE){let e=t;if(e.tagName.toLowerCase()==="w-visually-hidden")return!1;if(!e.hasAttribute("slot"))return!0}return!1})}hasNamedSlot(t){return this.host.querySelector(`:scope > [slot="${t}"]`)!==null}test(t){return t==="[default]"?this.hasDefaultSlot():this.hasNamedSlot(t)}hostConnected(){this.host.shadowRoot.addEventListener("slotchange",this.handleSlotChange)}hostDisconnected(){this.host.shadowRoot.removeEventListener("slotchange",this.handleSlotChange)}};function O(s,t){let e={waitUntilFirstUpdate:!1,...t};return(r,i)=>{let{update:a}=r,n=Array.isArray(s)?s:[s];r.update=function(o){n.forEach(l=>{let d=l;if(o.has(d)){let f=o.get(d),v=this[d];f!==v&&(!e.waitUntilFirstUpdate||this.hasUpdated)&&this[i](f,v)}}),a.call(this,o)}}}import{LitElement as Ge}from"lit";import{unsafeStatic as Xe,html as Ze}from"lit/static-html.js";var ce=Ve(ne(),1);var y=s=>typeof s=="string",Ue=s=>typeof s=="function",oe=new Map,de="en";function P(s){return[...Array.isArray(s)?s:[s],de]}function $(s,t,e){let r=P(s);e||(e="default");let i;if(typeof e=="string")switch(i={day:"numeric",month:"short",year:"numeric"},e){case"full":i.weekday="long";case"long":i.month="long";break;case"short":i.month="numeric";break}else i=e;return N(()=>I("date",r,e),()=>new Intl.DateTimeFormat(r,i)).format(y(t)?new Date(t):t)}function Ae(s,t,e){let r;if(e||(e="default"),typeof e=="string")switch(r={second:"numeric",minute:"numeric",hour:"numeric"},e){case"full":case"long":r.timeZoneName="short";break;case"short":delete r.second}else r=e;return $(s,t,r)}function A(s,t,e){let r=P(s);return N(()=>I("number",r,e),()=>new Intl.NumberFormat(r,e)).format(t)}function le(s,t,e,{offset:r=0,...i}){var o,l;let a=P(s),n=t?N(()=>I("plural-ordinal",a),()=>new Intl.PluralRules(a,{type:"ordinal"})):N(()=>I("plural-cardinal",a),()=>new Intl.PluralRules(a,{type:"cardinal"}));return(l=(o=i[e])!=null?o:i[n.select(e-r)])!=null?l:i.other}function N(s,t){let e=s(),r=oe.get(e);return r||(r=t(),oe.set(e,r)),r}function I(s,t,e){let r=t.join("-");return`${s}-${r}-${JSON.stringify(e)}`}var ue=/\\u[a-fA-F0-9]{4}|\\x[a-fA-F0-9]{2}/,he="%__lingui_octothorpe__%",Fe=(s,t,e={})=>{let r=t||s,i=n=>typeof n=="object"?n:e[n],a=(n,o)=>{let l=Object.keys(e).length?i("number"):void 0,d=A(r,n,l);return o.replace(new RegExp(he,"g"),d)};return{plural:(n,o)=>{let{offset:l=0}=o,d=le(r,!1,n,o);return a(n-l,d)},selectordinal:(n,o)=>{let{offset:l=0}=o,d=le(r,!0,n,o);return a(n-l,d)},select:qe,number:(n,o)=>A(r,n,i(o)||{style:o}),date:(n,o)=>$(r,n,i(o)||o),time:(n,o)=>Ae(r,n,i(o)||o)}},qe=(s,t)=>{var e;return(e=t[s])!=null?e:t.other};function Pe(s,t,e){return(r={},i)=>{let a=Fe(t,e,i),n=(l,d=!1)=>Array.isArray(l)?l.reduce((f,v)=>{if(v==="#"&&d)return f+he;if(y(v))return f+v;let[B,b,K]=v,D={};b==="plural"||b==="selectordinal"||b==="select"?Object.entries(K).forEach(([R,be])=>{D[R]=n(be,b==="plural"||b==="selectordinal")}):D=K;let M;if(b){let R=a[b];M=R(r[B],D)}else M=r[B];return M==null?f:f+M},""):l,o=n(s);return y(o)&&ue.test(o)?(0,ce.unraw)(o):y(o)?o:o?String(o):""}}var $e=Object.defineProperty,je=(s,t,e)=>t in s?$e(s,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):s[t]=e,Be=(s,t,e)=>(je(s,typeof t!="symbol"?t+"":t,e),e),F=class{constructor(){Be(this,"_events",{})}on(t,e){var i;var r;return(i=(r=this._events)[t])!=null||(r[t]=[]),this._events[t].push(e),()=>this.removeListener(t,e)}removeListener(t,e){let r=this._getListeners(t);if(!r)return;let i=r.indexOf(e);~i&&r.splice(i,1)}emit(t,...e){let r=this._getListeners(t);r&&r.map(i=>i.apply(this,e))}_getListeners(t){let e=this._events[t];return Array.isArray(e)?e:!1}},Ke=Object.defineProperty,ze=(s,t,e)=>t in s?Ke(s,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):s[t]=e,k=(s,t,e)=>(ze(s,typeof t!="symbol"?t+"":t,e),e),q=class extends F{constructor(t){var e;super(),k(this,"_locale",""),k(this,"_locales"),k(this,"_localeData",{}),k(this,"_messages",{}),k(this,"_missing"),k(this,"_messageCompiler"),k(this,"t",this._.bind(this)),t.missing!=null&&(this._missing=t.missing),t.messages!=null&&this.load(t.messages),t.localeData!=null&&this.loadLocaleData(t.localeData),(typeof t.locale=="string"||t.locales)&&this.activate((e=t.locale)!=null?e:de,t.locales)}get locale(){return this._locale}get locales(){return this._locales}get messages(){var t;return(t=this._messages[this._locale])!=null?t:{}}get localeData(){var t;return(t=this._localeData[this._locale])!=null?t:{}}_loadLocaleData(t,e){let r=this._localeData[t];r?Object.assign(r,e):this._localeData[t]=e}setMessagesCompiler(t){return this._messageCompiler=t,this}loadLocaleData(t,e){typeof t=="string"?this._loadLocaleData(t,e):Object.keys(t).forEach(r=>this._loadLocaleData(r,t[r])),this.emit("change")}_load(t,e){let r=this._messages[t];r?Object.assign(r,e):this._messages[t]=e}load(t,e){typeof t=="string"&&typeof e=="object"?this._load(t,e):Object.entries(t).forEach(([r,i])=>this._load(r,i)),this.emit("change")}loadAndActivate({locale:t,locales:e,messages:r}){this._locale=t,this._locales=e||void 0,this._messages[this._locale]=r,this.emit("change")}activate(t,e){this._locale=t,this._locales=e,this.emit("change")}_(t,e,r){if(!this.locale)throw new Error("Lingui: Attempted to call a translation function without setting a locale.\nMake sure to call `i18n.activate(locale)` before using Lingui functions.\nThis issue may also occur due to a race condition in your initialization logic.");let i=r==null?void 0:r.message;t||(t=""),y(t)||(e=t.values||e,i=t.message,t=t.id);let a=this.messages[t],n=a===void 0,o=this._missing;if(o&&n)return Ue(o)?o(this._locale,t):o;n&&this.emit("missing",{id:t,locale:this._locale});let l=a||i||t;return y(l)&&(this._messageCompiler?l=this._messageCompiler(l):console.warn(`Uncompiled message detected! Message:
+
+> ${l}
+
+That means you use raw catalog or your catalog doesn't have a translation for the message and fallback was used.
+ICU features such as interpolation and plurals will not work properly for that message. 
+
+Please compile your catalog first. 
+`)),y(l)&&ue.test(l)?JSON.parse(`"${l}"`):y(l)?l:Pe(l,this._locale,this._locales)(e,r==null?void 0:r.formats)}date(t,e){return $(this._locales||this._locale,t,e)}number(t,e){return A(this._locales||this._locale,t,e)}};function Je(s={}){return new q(s)}var S=Je();var Qe=JSON.parse('{"icon.title.check":["Sjekkmerke"]}'),Ye=JSON.parse('{"icon.title.check":["Checkmark"]}'),We=JSON.parse('{"icon.title.check":["Valintamerkki"]}'),et=JSON.parse('{"icon.title.check":["Flueben"]}'),tt=JSON.parse('{"icon.title.check":["Bock"]}'),fe=["en","nb","fi","da","sv"],me="en",rt=()=>{var s;let t;switch((s=process==null?void 0:process.env)==null?void 0:s.NMP_BRAND){case"FINN":t="nb";break;case"TORI":t="fi";break;case"BLOCKET":t="sv";break;case"DBA":t="da";break;default:t="en"}return t},pe=()=>{var s;let t=(s=document==null?void 0:document.location)==null?void 0:s.hostname;return t!=null&&t.includes("finn")?"nb":t.includes("tori")?"fi":t.includes("blocket")?"sv":t.includes("dba")?"da":me},j=s=>fe.find(t=>s===t||s.toLowerCase().includes(t))||pe();function st(){var s;if(typeof window=="undefined"){let t=rt();return j(t)}try{let t=(s=document==null?void 0:document.documentElement)==null?void 0:s.lang,e=pe();return fe.includes(t)?j(t!=null?t:e):(console.warn("Unsupported locale set in html lang tag, falling back to detection by hostname"),j(e))}catch(t){return console.warn("could not detect locale, falling back to source locale",t),me}}var it=(s,t,e,r,i,a)=>s==="nb"?e:s==="fi"?r:s==="da"?i:s==="sv"?a:t,at=(s,t,e,r,i)=>{let a=st(),n=it(a,s,t,e,r,i);S.load(a,n),S.activate(a)};at(Ye,Qe,We,et,tt);var nt=class extends Ge{render(){let s=S.t({message:"Checkmark",id:"icon.title.check",comment:"Title for check icon"});return Ze`<svg xmlns="http://www.w3.org/2000/svg"width="16"height="16"fill="none"viewBox="0 0 16 16" part="w-icon-check-16-part">${Xe(`<title>${s}</title>`)}<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M3.83 7.667 7.163 11l5.334-6"></path></svg>`}};customElements.get("w-icon-check-16")||customElements.define("w-icon-check-16",nt);import{css as ot}from"lit";var ge=ot`
+:host {
+  display: block;
+  user-select: none;
+  -webkit-user-select: none;
+}
+
+[part~='control'] {
+  position: relative;
+  width: 2rem;
+  height: 2rem;
+  border-color: var(--w-s-color-border);
+  border-radius: 2px;
+  border-style: solid;
+  border-width: 1px;
+  background-color: var(--w-s-color-background);
+  transition-property: all;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+  margin-right: 0.8rem;
+  text-align: center;
+  line-height: var(--w-line-height-xs);
+  font-size: var(--w-font-size-m);
+}
+
+[part~='base'] {
+  display: flex;
+  align-items: center;
+  position: relative;
+  color: currentColor;
+  vertical-align: middle;
+  cursor: pointer;
+}
+
+[part~='label'] {
+  display: block;
+  font-size: var(--w-font-size-m);
+  line-height: var(--w-line-height-m);
+  user-select: none;
+  cursor: pointer;
+  padding: 0.2rem 0;
+}
+
+label:hover [part~='control']:not(:has(:checked, :indeterminate)) {
+  background-color: var(--w-s-color-background-hover);
+  border-color: var(--w-s-color-border-primary);
+}
+
+label:hover [part~='control']:has(:checked, :indeterminate) {
+  border-color: var(--w-s-color-border-primary-hover);
+  background-color: var(--w-s-color-background-primary-hover);
+}
+
+[part~='control']:has(:checked, :indeterminate) {
+  color: var(--checked-icon-color, white);
+  border-color: var(--w-s-color-border-primary);
+  background-color: var(--w-s-color-background-primary);
+}
+
+[part~='control']:has(:indeterminate) {
+  font-weight: 700;
+}
+
+[part~='control']:has(:invalid) {
+  border-color: var(--w-s-color-border-negative);
+}
+
+[part~='control']:has(:invalid):hover {
+  background-color: var(--w-s-color-background-negative-subtle-hover);
+}
+
+[part~='control']:has(:checked):has(:invalid) {
+  background-color: var(--w-s-color-background-negative);
+}
+
+[part~='control']:has(:checked) {
+  background-image: var(--w-icon-toggle-checked);
+  background-position: center;
+}
+
+/* Focus */
+[part~='control']:has(> input:focus-visible:not(:disabled)) {
+  outline: var(--wa-focus-ring);
+  outline-offset: var(--wa-focus-ring-offset);
+}
+
+/* Disabled */
+:host [part~='base']:has(input:disabled) {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
+input {
+  position: absolute;
+  padding: 0;
+  margin: 0;
+  height: 100%;
+  width: 100%;
+  opacity: 0;
+  pointer-events: none;
+}
+
+[part~='icon'] {
+  display: flex;
+
+  input:not(:checked, :indeterminate) + & {
+    visibility: hidden;
+  }
+}
+
+:host([required]) [part~='label']::after {
+  content: var(--wa-form-control-required-content);
+  color: var(--wa-form-control-required-content-color);
+  margin-inline-start: var(--wa-form-control-required-content-offset);
+}`;var ve,u=class extends m{constructor(){super(...arguments);this.hasSlotController=new L(this,"hint");this.title="";this.name="";this._value=(ve=this.getAttribute("value"))!=null?ve:null;this.size="medium";this.disabled=!1;this.indeterminate=!1;this.checked=this.hasAttribute("checked");this.defaultChecked=this.hasAttribute("checked");this.form=null;this.required=!1;this.hint=""}static get validators(){let e=[re({validationProperty:"checked",validationElement:Object.assign(document.createElement("input"),{type:"checkbox",required:!0})})];return[...super.validators,...e]}get value(){var e;return(e=this._value)!=null?e:"on"}set value(e){this._value=e}handleClick(){this.hasInteracted=!0,this.checked=!this.checked,this.indeterminate=!1,this.updateComplete.then(()=>{this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))})}handleDefaultCheckedChange(){!this.hasInteracted&&this.checked!==this.defaultChecked&&(this.checked=this.defaultChecked,this.handleValueOrCheckedChange())}handleValueOrCheckedChange(){this.setValue(this.checked?this.value:null,this._value),this.updateValidity()}handleStateChange(){this.hasUpdated&&(this.input.checked=this.checked,this.input.indeterminate=this.indeterminate),this.customStates.set("checked",this.checked),this.customStates.set("indeterminate",this.indeterminate),this.updateValidity()}handleDisabledChange(){this.customStates.set("disabled",this.disabled)}willUpdate(e){super.willUpdate(e),e.has("defaultChecked")&&(this.hasInteracted||(this.checked=this.defaultChecked)),(e.has("value")||e.has("checked"))&&this.handleValueOrCheckedChange()}formResetCallback(){this.checked=this.defaultChecked,super.formResetCallback(),this.handleValueOrCheckedChange()}click(){this.input.click()}focus(e){this.input.focus(e)}blur(){this.input.blur()}render(){let e=this.hasSlotController.test("hint"),r=this.hint?!0:!!e,i=!this.checked&&this.indeterminate;return lt`
+      <label part="base">
+        <span part="control">
+          <input
+            class="input"
+            type="checkbox"
+            title=${this.title}
+            name=${this.name}
+            value=${ut(this._value)}
+            .indeterminate=${ye(this.indeterminate)}
+            .checked=${ye(this.checked)}
+            .disabled=${this.disabled}
+            .required=${this.required}
+            aria-checked=${this.checked?"true":"false"}
+            aria-describedby="hint"
+            @click=${this.handleClick} />
+          ${i?"\u2013":""}
+        </span>
+
+        <slot part="label"></slot>
+      </label>
+
+      <slot id="hint" part="hint" name="hint" aria-hidden=${r?"false":"true"} class="${dt({"has-slotted":r})}">
+        ${this.hint}
+      </slot>
+    `}};u.css=[ge],u.shadowRootOptions={...m.shadowRootOptions,delegatesFocus:!0},c([ct('input[type="checkbox"]')],u.prototype,"input",2),c([p()],u.prototype,"title",2),c([p({reflect:!0})],u.prototype,"name",2),c([p({reflect:!0})],u.prototype,"value",1),c([p({reflect:!0})],u.prototype,"size",2),c([p({type:Boolean})],u.prototype,"disabled",2),c([p({type:Boolean,reflect:!0})],u.prototype,"indeterminate",2),c([p({type:Boolean,attribute:!1})],u.prototype,"checked",2),c([p({type:Boolean,reflect:!0,attribute:"checked"})],u.prototype,"defaultChecked",2),c([p({reflect:!0})],u.prototype,"form",2),c([p({type:Boolean,reflect:!0})],u.prototype,"required",2),c([p()],u.prototype,"hint",2),c([O("defaultChecked")],u.prototype,"handleDefaultCheckedChange",1),c([O(["checked","indeterminate"])],u.prototype,"handleStateChange",1),c([O("disabled")],u.prototype,"handleDisabledChange",1);customElements.get("w-checkbox")||customElements.define("w-checkbox",u);
+//# sourceMappingURL=index.js.map