@cas-smartdesign/radio-button-group 4.4.0 → 5.0.0

package/dist/radio-button-group.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"radio-button-group.mjs","sources":["../radio-button.ts","../radio-button-group.ts"],"sourcesContent":["import { LitElement, TemplateResult, html, unsafeCSS, css, nothing } from \"lit\";\nimport { property } from \"lit/decorators/property.js\";\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        [RadioButton.ID]: RadioButton;\n    }\n}\n\nimport style from \"./scss/button.scss?inline\";\nlet idCounter = 0;\n\nexport class RadioButton extends LitElement {\n    public static readonly ID = \"sd-radio-button\";\n    public static ensureDefined = (): void => {\n        if (!customElements.get(RadioButton.ID)) {\n            customElements.define(RadioButton.ID, RadioButton);\n        }\n    };\n    @property({ type: Boolean, reflect: true, attribute: true })\n    public checked = false;\n    @property({ type: String, reflect: true, attribute: true })\n    public value = \"\";\n    @property({ type: Boolean, reflect: true, attribute: true })\n    public disabled = false;\n    @property({ type: String, reflect: true, attribute: true })\n    public label = \"\";\n\n    private a11yID;\n\n    constructor() {\n        super();\n        this.a11yID = RadioButton.ID + \"_\" + idCounter++;\n    }\n\n    static get styles() {\n        return [\n            css`\n                ${unsafeCSS(style)}\n            `,\n        ];\n    }\n\n    public render(): TemplateResult {\n        return html`\n            <div class=\"root\">\n                <div class=\"radio-button-container\">\n                    <input\n                        type=\"radio\"\n                        id=\"${this.a11yID}\"\n                        .checked=\"${this.checked}\"\n                        ?disabled=\"${this.disabled}\"\n                        @click=\"${this.handleClick}\"\n                        class=\"radio-button\"\n                    />\n                    <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"-14 -14 28 28\">\n                        <circle\n                            class=\"highlight\"\n                            style=\"display:none\"\n                            r=\"11px\"\n                            fill=\"transparent\"\n                            stroke-width=\"6px\"\n                        ></circle>\n                        <circle class=\"inner\" r=\"6px\" style=\"display:none\" stroke=\"none\"></circle>\n                        <circle class=\"outer\" r=\"9px\" fill=\"transparent\" stroke-width=\"2px\"></circle>\n                    </svg>\n                </div>\n                <label class=\"label\" for=\"${this.a11yID}\" @click=\"${this.handleClick}\">${this.label}</label>\n            </div>\n        `;\n    }\n\n    private handleClick = (event: MouseEvent): void => {\n        event.preventDefault();\n    };\n}\n","import { LitElement, TemplateResult, html, PropertyValues, ComplexAttributeConverter, unsafeCSS, css } from \"lit\";\nimport { property } from \"lit/decorators/property.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { RadioButton } from \"./radio-button\";\nimport { ValidationLevel } from \"@cas-smartdesign/field-validation-message\";\nimport type { LayoutType, IValueChangeEvent } from \"./types\";\n\nexport { RadioButton } from \"./radio-button\";\nexport type * from \"./types\";\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        [RadioButtonGroup.ID]: RadioButtonGroup;\n    }\n}\nimport style from \"./scss/group.scss?inline\";\n\nexport interface CustomEventMap extends HTMLElementEventMap {\n    \"value-change\": CustomEvent<IValueChangeEvent>;\n}\n\nexport interface RadioButtonGroup {\n    addEventListener<K extends keyof CustomEventMap>(\n        event: K,\n        listener: ((this: this, ev: CustomEventMap[K]) => unknown) | null,\n        options?: AddEventListenerOptions | boolean,\n    ): void;\n    addEventListener(\n        type: string,\n        callback: EventListenerOrEventListenerObject | null,\n        options?: AddEventListenerOptions | boolean,\n    ): void;\n    removeEventListener<K extends keyof CustomEventMap>(\n        type: K,\n        listener: (this: this, ev: CustomEventMap[K]) => unknown,\n        options?: boolean | EventListenerOptions,\n    ): void;\n    removeEventListener(\n        type: string,\n        listener: EventListenerOrEventListenerObject,\n        options?: boolean | EventListenerOptions,\n    ): void;\n    dispatchEvent<EventType extends CustomEventMap[keyof CustomEventMap]>(event: EventType): boolean;\n}\n\nexport class RadioButtonGroup extends LitElement {\n    public static readonly ID = \"sd-radio-button-group\";\n    public static ensureDefined = (): void => {\n        RadioButton.ensureDefined();\n        if (!customElements.get(RadioButtonGroup.ID)) {\n            customElements.define(RadioButtonGroup.ID, RadioButtonGroup);\n        }\n    };\n    @property({ type: String, reflect: true, attribute: true })\n    public layout: LayoutType = \"horizontal\";\n    @property({ type: String })\n    public value = \"\";\n    @property({ type: Boolean, reflect: true, attribute: \"uncheck-allowed\" })\n    public uncheckAllowed = false;\n    @property({ type: Boolean, reflect: true, attribute: true })\n    public disabled = false;\n    @property({ type: String })\n    public validationMessage: string;\n    @property({ type: String })\n    public validationIconSrc: string;\n    @property({\n        type: {\n            fromAttribute(value: string): ValidationLevel {\n                return value && ValidationLevel[value.toLowerCase()];\n            },\n            toAttribute(value: ValidationLevel): string {\n                return value && value.toLowerCase();\n            },\n        } as ComplexAttributeConverter,\n        reflect: true,\n    })\n    public validationLevel: ValidationLevel;\n\n    private _buttonsSlot: HTMLSlotElement;\n    private _buttons: HTMLElement[];\n    private _focusIndex = -1;\n    private _checkedButton: HTMLElement = null;\n\n    public get focusIndex(): number {\n        return this._focusIndex;\n    }\n\n    public set focusIndex(index: number) {\n        if (index >= -1 && index < this.childElementCount) {\n            const oldValue = this._focusIndex;\n            this._focusIndex = index;\n            if (oldValue !== index) {\n                const previousButton = this._buttons[oldValue];\n                const currentButton = this._buttons[this.focusIndex];\n                this.updateFocused(previousButton, currentButton);\n            }\n        }\n    }\n\n    protected firstUpdated(changedProperties: PropertyValues): void {\n        super.firstUpdated(changedProperties);\n        this.buttonsSlot.addEventListener(\"slotchange\", this.handleSlotChange);\n        this.addEventListener(\"focusin\", this.handleFocusIn);\n        this.addEventListener(\"focusout\", this.handleFocusOut);\n        this.addEventListener(\"keydown\", this.handleKeyDown);\n    }\n\n    protected updated(changedProperties: PropertyValues): void {\n        super.updated(changedProperties);\n        if (changedProperties.has(\"disabled\")) {\n            if (this.disabled) {\n                this.disableButtons();\n            } else {\n                this.enableButtons();\n            }\n        }\n    }\n\n    static get styles() {\n        return [\n            css`\n                ${unsafeCSS(style)}\n            `,\n        ];\n    }\n    public render(): TemplateResult {\n        return html`\n            <div\n                class=\"buttons-container ${this.layout === \"vertical\" ? \"vertical\" : \"horizontal\"}\"\n                @click=\"${ifDefined(this.disabled ? undefined : this.handleButtonClick)}\"\n            >\n                <slot></slot>\n            </div>\n            ${this.validationMessage &&\n            html`\n                <sd-field-validation-message\n                    class=\"validation-message\"\n                    .message=${this.validationMessage}\n                    .icon=${this.validationIconSrc}\n                    .level=${this.validationLevel}\n                >\n                </sd-field-validation-message>\n            `}\n        `;\n    }\n\n    private handleSlotChange = (): void => {\n        this._buttons = this.buttonsSlot.assignedElements() as HTMLElement[];\n        this._buttons.forEach((button) => {\n            if (!button.hasAttribute(\"disabled\") && this.disabled) {\n                button.setAttribute(\"disabled\", \"\");\n            }\n            // prevent radio buttons to be able to get focus by tabbing\n            // as focus is handled by this element\n            button.setAttribute(\"tabIndex\", \"-1\");\n            this.updateCheckedButton(button);\n        });\n    };\n\n    private updateCheckedButton(button: HTMLElement): void {\n        if (this._checkedButton && this._checkedButton !== button) {\n            this.uncheckButton(button);\n        } else if (button.hasAttribute(\"checked\")) {\n            this._checkedButton = button;\n            const value = button.getAttribute(\"value\");\n            this.updateValue(value);\n        }\n    }\n\n    private handleFocusIn = (event: FocusEvent): void => {\n        const target = event.target as HTMLElement;\n        const ind = this._buttons.findIndex((button) => button == target);\n        this.focusIndex = this.focusIndex >= 0 ? this.focusIndex : this.getNextFocusIndex(ind !== -1 ? ind : 0);\n        this.updateFocused(null, this._buttons[this.focusIndex]);\n    };\n\n    private handleFocusOut = (): void => {\n        this.updateFocused(this._buttons[this.focusIndex]);\n    };\n\n    private disableButtons(): void {\n        this._buttons?.forEach((button) => {\n            button.setAttribute(\"disabled\", \"\");\n        });\n    }\n\n    private enableButtons(): void {\n        this._buttons?.forEach((button) => {\n            button.removeAttribute(\"disabled\");\n        });\n    }\n\n    private handleButtonClick = (event: MouseEvent): void => {\n        // the individual buttons are not focusable\n        this.focus();\n        const target = this._buttons.find((button) => button.contains(event.target as Node));\n        const targetIndex = this._buttons.findIndex((button) => button == target);\n        if (targetIndex >= 0) {\n            this.focusIndex = targetIndex;\n            this.updateChecked();\n        }\n    };\n\n    private fireValueChangeEvent(): void {\n        this.dispatchEvent(\n            new CustomEvent<IValueChangeEvent>(\"value-change\", {\n                detail: {\n                    value: this.value,\n                    selectedIndex: this.selectedIndex,\n                },\n            }),\n        );\n    }\n\n    private handleKeyDown = (event: KeyboardEvent): void => {\n        let shouldPrevent = true;\n        switch (event.key) {\n            case \"Down\":\n            case \"ArrowDown\":\n            case \"Right\":\n            case \"ArrowRight\": {\n                this.focusNext();\n                break;\n            }\n            case \"Up\":\n            case \"ArrowUp\":\n            case \"Left\":\n            case \"ArrowLeft\": {\n                this.focusPrevious();\n                break;\n            }\n            case \"Enter\": {\n                this.updateChecked();\n                break;\n            }\n            default: {\n                shouldPrevent = false;\n            }\n        }\n        if (shouldPrevent) {\n            event.preventDefault();\n            event.stopPropagation();\n        }\n    };\n\n    private focusNext() {\n        const newIndex = this.getNextFocusIndex(this.focusIndex + 1);\n        this.focusIndex = newIndex !== -1 ? newIndex : this.getNextFocusIndex(0);\n        if (!this.uncheckAllowed) {\n            this.updateChecked();\n        }\n    }\n\n    private focusPrevious() {\n        const newIndex = this.getPreviousFocusIndex(this.focusIndex - 1);\n        this.focusIndex = newIndex !== -1 ? newIndex : this.getPreviousFocusIndex(this.childElementCount - 1);\n        if (!this.uncheckAllowed) {\n            this.updateChecked();\n        }\n    }\n\n    private getNextFocusIndex(index: number): number {\n        for (let i = index; i < this.childElementCount; i++) {\n            const button = this._buttons[i];\n            if (this.isFocusable(button)) {\n                return i;\n            }\n        }\n\n        return -1;\n    }\n\n    private getPreviousFocusIndex(index: number): number {\n        for (let i = index; i >= 0; i--) {\n            const button = this._buttons[i];\n            if (this.isFocusable(button)) {\n                return i;\n            }\n        }\n\n        return -1;\n    }\n\n    private isFocusable(button: HTMLElement): boolean {\n        return !button.hasAttribute(\"disabled\");\n    }\n\n    private updateChecked(): void {\n        const previousChecked = this._checkedButton;\n        const currentChecked = this._buttons[this.focusIndex];\n        this._checkedButton = currentChecked;\n        if (previousChecked && previousChecked !== currentChecked) {\n            this.uncheckButton(previousChecked);\n        }\n        if (currentChecked) {\n            this.toggleButton(currentChecked);\n        }\n    }\n\n    private toggleButton(button: HTMLElement): void {\n        const checked = button.hasAttribute(\"checked\");\n        if (checked) {\n            if (this.uncheckAllowed) {\n                this.uncheckButton(button);\n                this._checkedButton = null;\n                this.updateValue(\"\");\n            }\n        } else {\n            this.checkButton(button);\n            this.updateValue(button.getAttribute(\"value\"));\n        }\n    }\n\n    private updateValue(newValue: string): void {\n        this.value = newValue;\n        this.fireValueChangeEvent();\n    }\n\n    private updateFocused(previousFocused?: HTMLElement, currentFocused?: HTMLElement): void {\n        previousFocused?.removeAttribute?.(\"focused\");\n        currentFocused?.setAttribute?.(\"focused\", \"\");\n    }\n\n    private checkButton(button: HTMLElement): void {\n        button.setAttribute(\"checked\", \"\");\n    }\n\n    private uncheckButton(button: HTMLElement): void {\n        button.removeAttribute(\"checked\");\n    }\n\n    private get buttonsSlot(): HTMLSlotElement {\n        if (this.shadowRoot && !this._buttonsSlot) {\n            this._buttonsSlot = this.shadowRoot.querySelector(\"slot\");\n        }\n        return this._buttonsSlot;\n    }\n\n    private get selectedIndex(): number {\n        return this._buttons.indexOf(this._checkedButton);\n    }\n}\n\nRadioButtonGroup.ensureDefined();\n"],"names":["idCounter","_RadioButton","_a","LitElement","event","css","unsafeCSS","style","html","__decorateClass","property","RadioButton","_RadioButtonGroup","button","target","ind","targetIndex","shouldPrevent","index","oldValue","previousButton","currentButton","changedProperties","ifDefined","value","newIndex","i","previousChecked","currentChecked","newValue","previousFocused","currentFocused","ValidationLevel","RadioButtonGroup"],"mappings":"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"}
+{"version":3,"file":"radio-button-group.mjs","names":[],"sources":["../scss/button.scss?inline","../radio-button.ts","../scss/group.scss?inline","../radio-button-group.ts"],"sourcesContent":["@use \"@cas-smartdesign/styles/scss/variables/colors\";\n@use \"@cas-smartdesign/styles/scss/variables/typography\";\n\n:host {\n\tdisplay: block;\n}\n\n:host,\n.label,\n.checkbox {\n\toutline: none;\n}\n\n:host([disabled]) {\n\tpointer-events: none;\n\n\t.root {\n\t\topacity: 0.6;\n\t\tcursor: default;\n\t\tfilter: grayscale(100%);\n\t}\n}\n\n:host(:not([disabled])[focused]) .highlight {\n\tdisplay: block !important;\n}\n\n:host([checked]) {\n\tcircle.inner {\n\t\tdisplay: block !important;\n\t}\n\tcircle.outer {\n\t\tstroke: var(--sd-radio-button-checked-color, colors.$sd-blue) !important;\n\t}\n}\n\n:host([oneline]) .label {\n\twhite-space: nowrap;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n}\n\n.root {\n\tdisplay: inline-flex;\n\talign-items: center;\n\tvertical-align: middle;\n\twidth: 100%;\n\tpadding: var(--sd-radio-button-padding, 6px 0px);\n\n\t.radio-button-container {\n\t\tposition: relative;\n\t\tdisplay: inline-block;\n\t\twidth: 28px;\n\t\theight: 28px;\n\t\tbox-sizing: border-box;\n\t\tcursor: pointer;\n\t\tmargin-right: 5px;\n\t\tflex-shrink: 0;\n\n\t\tinput {\n\t\t\tposition: absolute;\n\t\t\ttop: 0;\n\t\t\tleft: 0;\n\t\t\topacity: 0;\n\t\t}\n\n\t\tcircle.highlight {\n\t\t\tstroke: var(--sd-radio-button-highlight-color, rgba(colors.$sd-blue, 0.3));\n\t\t}\n\t\tcircle.inner {\n\t\t\tfill: var(--sd-radio-button-checked-color, colors.$sd-blue);\n\t\t}\n\t\tcircle.outer {\n\t\t\tstroke: var(--sd-radio-button-unchecked-color, colors.$sd-grey);\n\t\t}\n\t}\n\n\t.label {\n\t\tfont-family: var(--sd-radio-button-font-family, typography.$sd-font-family);\n\t\ttext-overflow: ellipsis;\n\t\toverflow-x: hidden;\n\t\tuser-select: none;\n\t\tcursor: pointer;\n\t\tpadding-top: 2px;\n\t\tpadding-bottom: 2px;\n\t}\n}\n","import { LitElement, type TemplateResult, html, unsafeCSS, css } from \"lit\";\nimport { property } from \"lit/decorators/property.js\";\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        [RadioButton.ID]: RadioButton;\n    }\n}\n\nimport style from \"./scss/button.scss?inline\";\nlet idCounter = 0;\n\nexport class RadioButton extends LitElement {\n    public static readonly ID = \"sd-radio-button\";\n    public static ensureDefined = (): void => {\n        if (!customElements.get(RadioButton.ID)) {\n            customElements.define(RadioButton.ID, RadioButton);\n        }\n    };\n    @property({ type: Boolean, reflect: true, attribute: true })\n    public checked = false;\n    @property({ type: String, reflect: true, attribute: true })\n    public value = \"\";\n    @property({ type: Boolean, reflect: true, attribute: true })\n    public disabled = false;\n    @property({ type: String, reflect: true, attribute: true })\n    public label = \"\";\n\n    private a11yID;\n\n    constructor() {\n        super();\n        this.a11yID = RadioButton.ID + \"_\" + idCounter++;\n    }\n\n    static override get styles() {\n        return [\n            css`\n                ${unsafeCSS(style)}\n            `,\n        ];\n    }\n\n    public override render(): TemplateResult {\n        return html`\n            <div class=\"root\">\n                <div class=\"radio-button-container\">\n                    <input\n                        type=\"radio\"\n                        id=\"${this.a11yID}\"\n                        .checked=\"${this.checked}\"\n                        ?disabled=\"${this.disabled}\"\n                        @click=\"${this.handleClick}\"\n                        class=\"radio-button\"\n                    />\n                    <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"-14 -14 28 28\">\n                        <circle\n                            class=\"highlight\"\n                            style=\"display:none\"\n                            r=\"11px\"\n                            fill=\"transparent\"\n                            stroke-width=\"6px\"\n                        ></circle>\n                        <circle class=\"inner\" r=\"6px\" style=\"display:none\" stroke=\"none\"></circle>\n                        <circle class=\"outer\" r=\"9px\" fill=\"transparent\" stroke-width=\"2px\"></circle>\n                    </svg>\n                </div>\n                <label class=\"label\" for=\"${this.a11yID}\" @click=\"${this.handleClick}\">${this.label}</label>\n            </div>\n        `;\n    }\n\n    private handleClick = (event: MouseEvent): void => {\n        event.preventDefault();\n    };\n}\n",":host(:focus) {\n\toutline: none;\n}\n\n.buttons-container {\n\tdisplay: flex;\n\tgap: var(--sd-radio-button-group-gap, 0);\n}\n\n.buttons-container.vertical {\n\tflex-direction: column;\n}\n\n.validation-message {\n\tmargin-left: 5px;\n}\n","import SDFieldValidationMessage, { ValidationLevel } from \"@cas-smartdesign/field-validation-message\";\nimport {\n    LitElement,\n    type TemplateResult,\n    html,\n    type PropertyValues,\n    type ComplexAttributeConverter,\n    unsafeCSS,\n    css,\n} from \"lit\";\nimport { property } from \"lit/decorators/property.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\n\nimport type { LayoutType, IValueChangeEvent } from \"./types\";\n\nimport { RadioButton } from \"./radio-button\";\n\nexport { RadioButton } from \"./radio-button\";\nexport type * from \"./types\";\n\nimport style from \"./scss/group.scss?inline\";\n\ndeclare global {\n    interface HTMLElementTagNameMap {\n        [RadioButtonGroup.ID]: RadioButtonGroup;\n    }\n    interface HTMLElementEventMap {\n        \"sd-radio-button-group-value-change\": CustomEvent<IValueChangeEvent>;\n    }\n}\n\nexport class RadioButtonGroup extends LitElement {\n    public static readonly ID = \"sd-radio-button-group\";\n    public static ensureDefined = (): void => {\n        RadioButton.ensureDefined();\n        if (!customElements.get(RadioButtonGroup.ID)) {\n            customElements.define(RadioButtonGroup.ID, RadioButtonGroup);\n        }\n    };\n    @property({ type: String, reflect: true, attribute: true })\n    public layout: LayoutType = \"horizontal\";\n    @property({ type: String })\n    public value: string | undefined = \"\";\n    @property({ type: Boolean, reflect: true, attribute: \"uncheck-allowed\" })\n    public uncheckAllowed = false;\n    @property({ type: Boolean, reflect: true, attribute: true })\n    public disabled = false;\n    @property({ type: String })\n    public validationMessage: string | undefined;\n    @property({ type: String })\n    public validationIconSrc: string | undefined;\n    @property({\n        type: {\n            fromAttribute(value: string): ValidationLevel | undefined {\n                return SDFieldValidationMessage.parseLevel(value);\n            },\n            toAttribute(value: ValidationLevel | undefined): string | undefined {\n                return value != null ? value.toLowerCase() : undefined;\n            },\n        } as ComplexAttributeConverter,\n        reflect: true,\n    })\n    public validationLevel: ValidationLevel | undefined;\n\n    private _buttonsSlot: HTMLSlotElement | undefined;\n    private _buttons: HTMLElement[] = [];\n    private _focusIndex = -1;\n    private _checkedButton: HTMLElement | undefined = undefined;\n\n    public get focusIndex(): number {\n        return this._focusIndex;\n    }\n\n    public set focusIndex(index: number) {\n        if (index >= -1 && index < this.childElementCount) {\n            const oldValue = this._focusIndex;\n            this._focusIndex = index;\n            if (oldValue !== index) {\n                const previousButton = this._buttons[oldValue];\n                const currentButton = this._buttons[this.focusIndex];\n                this.updateFocused(previousButton, currentButton);\n            }\n        }\n    }\n\n    protected override firstUpdated(changedProperties: PropertyValues): void {\n        super.firstUpdated(changedProperties);\n        this.buttonsSlot!.addEventListener(\"slotchange\", this.handleSlotChange);\n        this.addEventListener(\"focusin\", this.handleFocusIn);\n        this.addEventListener(\"focusout\", this.handleFocusOut);\n        this.addEventListener(\"keydown\", this.handleKeyDown);\n    }\n\n    protected override updated(changedProperties: PropertyValues): void {\n        super.updated(changedProperties);\n        if (changedProperties.has(\"disabled\")) {\n            if (this.disabled) {\n                this.disableButtons();\n            } else {\n                this.enableButtons();\n            }\n        }\n    }\n\n    static override get styles() {\n        return [\n            css`\n                ${unsafeCSS(style)}\n            `,\n        ];\n    }\n    public override render(): TemplateResult {\n        return html`\n            <div\n                class=\"buttons-container ${this.layout === \"vertical\" ? \"vertical\" : \"horizontal\"}\"\n                @click=\"${ifDefined(this.disabled ? undefined : this.handleButtonClick)}\"\n            >\n                <slot></slot>\n            </div>\n            ${this.validationMessage &&\n            html`\n                <sd-field-validation-message\n                    class=\"validation-message\"\n                    .message=${this.validationMessage}\n                    .icon=${this.validationIconSrc}\n                    .level=${this.validationLevel}\n                >\n                </sd-field-validation-message>\n            `}\n        `;\n    }\n\n    private handleSlotChange = (): void => {\n        this._buttons = this.buttonsSlot!.assignedElements() as HTMLElement[];\n        this._buttons.forEach((button) => {\n            if (!button.hasAttribute(\"disabled\") && this.disabled) {\n                button.setAttribute(\"disabled\", \"\");\n            }\n            // prevent radio buttons to be able to get focus by tabbing\n            // as focus is handled by this element\n            button.setAttribute(\"tabIndex\", \"-1\");\n            this.updateCheckedButton(button);\n        });\n    };\n\n    private updateCheckedButton(button: HTMLElement): void {\n        if (this._checkedButton && this._checkedButton !== button) {\n            this.uncheckButton(button);\n        } else if (button.hasAttribute(\"checked\")) {\n            this._checkedButton = button;\n            const value = button.getAttribute(\"value\");\n            this.updateValue(value);\n        }\n    }\n\n    private handleFocusIn = (event: FocusEvent): void => {\n        const target = event.target as HTMLElement;\n        const ind = this._buttons.findIndex((button) => button == target);\n        this.focusIndex = this.focusIndex >= 0 ? this.focusIndex : this.getNextFocusIndex(ind !== -1 ? ind : 0);\n        this.updateFocused(undefined, this._buttons[this.focusIndex]);\n    };\n\n    private handleFocusOut = (): void => {\n        this.updateFocused(this._buttons[this.focusIndex]);\n    };\n\n    private disableButtons(): void {\n        this._buttons?.forEach((button) => {\n            button.setAttribute(\"disabled\", \"\");\n        });\n    }\n\n    private enableButtons(): void {\n        this._buttons?.forEach((button) => {\n            button.removeAttribute(\"disabled\");\n        });\n    }\n\n    private handleButtonClick = (event: MouseEvent): void => {\n        // the individual buttons are not focusable\n        this.focus();\n        const target = this._buttons.find((button) => button.contains(event.target as Node));\n        const targetIndex = this._buttons.findIndex((button) => button == target);\n        if (targetIndex >= 0) {\n            this.focusIndex = targetIndex;\n            this.updateChecked();\n        }\n    };\n\n    private fireValueChangeEvent(): void {\n        this.dispatchEvent(\n            new CustomEvent<IValueChangeEvent>(\"sd-radio-button-group-value-change\", {\n                detail: {\n                    value: this.value,\n                    selectedIndex: this.selectedIndex,\n                },\n            }),\n        );\n    }\n\n    private handleKeyDown = (event: KeyboardEvent): void => {\n        let shouldPrevent = true;\n        switch (event.key) {\n            case \"Down\":\n            case \"ArrowDown\":\n            case \"Right\":\n            case \"ArrowRight\": {\n                this.focusNext();\n                break;\n            }\n            case \"Up\":\n            case \"ArrowUp\":\n            case \"Left\":\n            case \"ArrowLeft\": {\n                this.focusPrevious();\n                break;\n            }\n            case \"Enter\": {\n                this.updateChecked();\n                break;\n            }\n            default: {\n                shouldPrevent = false;\n            }\n        }\n        if (shouldPrevent) {\n            event.preventDefault();\n            event.stopPropagation();\n        }\n    };\n\n    private focusNext() {\n        const newIndex = this.getNextFocusIndex(this.focusIndex + 1);\n        this.focusIndex = newIndex !== -1 ? newIndex : this.getNextFocusIndex(0);\n        if (!this.uncheckAllowed) {\n            this.updateChecked();\n        }\n    }\n\n    private focusPrevious() {\n        const newIndex = this.getPreviousFocusIndex(this.focusIndex - 1);\n        this.focusIndex = newIndex !== -1 ? newIndex : this.getPreviousFocusIndex(this.childElementCount - 1);\n        if (!this.uncheckAllowed) {\n            this.updateChecked();\n        }\n    }\n\n    private getNextFocusIndex(index: number): number {\n        for (let i = index; i < this.childElementCount; i++) {\n            const button = this._buttons[i];\n            if (button != null && this.isFocusable(button)) {\n                return i;\n            }\n        }\n\n        return -1;\n    }\n\n    private getPreviousFocusIndex(index: number): number {\n        for (let i = index; i >= 0; i--) {\n            const button = this._buttons[i];\n            if (button != null && this.isFocusable(button)) {\n                return i;\n            }\n        }\n\n        return -1;\n    }\n\n    private isFocusable(button: HTMLElement): boolean {\n        return !button.hasAttribute(\"disabled\");\n    }\n\n    private updateChecked(): void {\n        const previousChecked = this._checkedButton;\n        const currentChecked = this._buttons[this.focusIndex];\n        this._checkedButton = currentChecked;\n        if (previousChecked && previousChecked !== currentChecked) {\n            this.uncheckButton(previousChecked);\n        }\n        if (currentChecked) {\n            this.toggleButton(currentChecked);\n        }\n    }\n\n    private toggleButton(button: HTMLElement): void {\n        const checked = button.hasAttribute(\"checked\");\n        if (checked) {\n            if (this.uncheckAllowed) {\n                this.uncheckButton(button);\n                this._checkedButton = undefined;\n                this.updateValue(\"\");\n            }\n        } else {\n            this.checkButton(button);\n            this.updateValue(button.getAttribute(\"value\"));\n        }\n    }\n\n    private updateValue(newValue: string | null | undefined): void {\n        this.value = newValue ?? undefined;\n        this.fireValueChangeEvent();\n    }\n\n    private updateFocused(previousFocused?: HTMLElement, currentFocused?: HTMLElement): void {\n        previousFocused?.removeAttribute?.(\"focused\");\n        currentFocused?.setAttribute?.(\"focused\", \"\");\n    }\n\n    private checkButton(button: HTMLElement): void {\n        button.setAttribute(\"checked\", \"\");\n    }\n\n    private uncheckButton(button: HTMLElement): void {\n        button.removeAttribute(\"checked\");\n    }\n\n    private get buttonsSlot(): HTMLSlotElement | undefined {\n        if (this.shadowRoot && !this._buttonsSlot) {\n            this._buttonsSlot = this.shadowRoot.querySelector(\"slot\") ?? undefined;\n        }\n        return this._buttonsSlot;\n    }\n\n    private get selectedIndex(): number {\n        if (this._buttons == undefined || this._checkedButton == undefined) {\n            return -1;\n        }\n        return this._buttons.indexOf(this._checkedButton);\n    }\n}\n\nRadioButtonGroup.ensureDefined();\n"],"mappings":"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"}

package/dist/radio-button.d.ts

@@ -1,4 +1,4 @@
-import { LitElement, TemplateResult } from "lit";
+import { LitElement, type TemplateResult } from "lit";
 declare global {
     interface HTMLElementTagNameMap {
         [RadioButton.ID]: RadioButton;
@@ -17,3 +17,4 @@ export declare class RadioButton extends LitElement {
     render(): TemplateResult;
     private handleClick;
 }
+//# sourceMappingURL=radio-button.d.ts.map

package/dist/radio-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio-button.d.ts","sourceRoot":"","sources":["../radio-button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,KAAK,cAAc,EAAwB,MAAM,KAAK,CAAC;AAG5E,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,CAAC,WAAW,CAAC,EAAE,CAAC,EAAE,WAAW,CAAC;KACjC;CACJ;AAKD,qBAAa,WAAY,SAAQ,UAAU;IACvC,gBAAuB,EAAE,qBAAqB;IAC9C,OAAc,aAAa,QAAO,IAAI,CAIpC;IAEK,OAAO,UAAS;IAEhB,KAAK,SAAM;IAEX,QAAQ,UAAS;IAEjB,KAAK,SAAM;IAElB,OAAO,CAAC,MAAM,CAAC;;IAOf,WAAoB,MAAM,8BAMzB;IAEe,MAAM,IAAI,cAAc;IA6BxC,OAAO,CAAC,WAAW,CAEjB;CACL"}

package/dist/types.d.ts

@@ -1,5 +1,6 @@
 export type LayoutType = "horizontal" | "vertical";
 export interface IValueChangeEvent {
-    value: string;
+    value: string | undefined;
     selectedIndex: number;
 }
+//# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,UAAU,GAAG,YAAY,GAAG,UAAU,CAAC;AAEnD,MAAM,WAAW,iBAAiB;IAC9B,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,aAAa,EAAE,MAAM,CAAC;CACzB"}

package/npm-third-party-licenses.json

@@ -1,88 +1,58 @@
 {
-    "@cypress/vite-dev-server@7.0.0": {
+    "@cypress/vite-dev-server@7.2.1": {
         "licenses": "MIT",
         "repository": "https://github.com/cypress-io/cypress",
         "licenseUrl": "https://github.com/cypress-io/cypress/tree/develop/npm/vite-dev-server#readme"
     },
-    "@eslint/js@9.34.0": {
+    "@tsdown/css@0.21.7": {
         "licenses": "MIT",
-        "repository": "https://github.com/eslint/eslint",
-        "licenseUrl": "https://unpkg.com/@eslint/js@9.34.0/LICENSE"
+        "repository": "https://github.com/rolldown/tsdown",
+        "licenseUrl": "https://unpkg.com/@tsdown/css@0.21.7/LICENSE"
     },
-    "@rollup/plugin-node-resolve@16.0.1": {
-        "licenses": "MIT",
-        "repository": "https://github.com/rollup/plugins",
-        "licenseUrl": "https://unpkg.com/@rollup/plugin-node-resolve@16.0.1/LICENSE"
-    },
-    "@types/node@24.3.0": {
+    "@types/node@25.5.2": {
         "licenses": "MIT",
         "repository": "https://github.com/DefinitelyTyped/DefinitelyTyped",
-        "licenseUrl": "https://unpkg.com/@types/node@24.3.0/LICENSE"
+        "licenseUrl": "https://unpkg.com/@types/node@25.5.2/LICENSE"
     },
     "@types/postcss-prefix-selector@1.16.3": {
         "licenses": "MIT",
         "repository": "https://github.com/DefinitelyTyped/DefinitelyTyped",
         "licenseUrl": "https://unpkg.com/@types/postcss-prefix-selector@1.16.3/LICENSE"
     },
-    "@typescript-eslint/eslint-plugin@8.41.0": {
+    "@types/yargs@17.0.35": {
         "licenses": "MIT",
-        "repository": "https://github.com/typescript-eslint/typescript-eslint",
-        "licenseUrl": "https://unpkg.com/@typescript-eslint/eslint-plugin@8.41.0/LICENSE"
-    },
-    "@typescript-eslint/parser@8.41.0": {
-        "licenses": "MIT",
-        "repository": "https://github.com/typescript-eslint/typescript-eslint",
-        "licenseUrl": "https://unpkg.com/@typescript-eslint/parser@8.41.0/LICENSE"
+        "repository": "https://github.com/DefinitelyTyped/DefinitelyTyped",
+        "licenseUrl": "https://unpkg.com/@types/yargs@17.0.35/LICENSE"
     },
-    "@vitest/coverage-v8@4.0.18": {
+    "@vitest/coverage-v8@4.1.2": {
         "licenses": "MIT",
         "repository": "https://github.com/vitest-dev/vitest",
-        "licenseUrl": "https://unpkg.com/@vitest/coverage-v8@4.0.18/LICENSE"
+        "licenseUrl": "https://unpkg.com/@vitest/coverage-v8@4.1.2/LICENSE"
     },
-    "@vitest/ui@4.0.18": {
+    "@vitest/ui@4.1.2": {
         "licenses": "MIT",
         "repository": "https://github.com/vitest-dev/vitest",
-        "licenseUrl": "https://unpkg.com/@vitest/ui@4.0.18/LICENSE"
+        "licenseUrl": "https://unpkg.com/@vitest/ui@4.1.2/LICENSE"
     },
-    "axe-core@4.10.3": {
+    "axe-core@4.11.2": {
         "licenses": "MPL-2.0",
         "repository": "https://github.com/dequelabs/axe-core",
-        "licenseUrl": "https://unpkg.com/axe-core@4.10.3/LICENSE"
+        "licenseUrl": "https://unpkg.com/axe-core@4.11.2/LICENSE"
     },
     "cypress-axe@1.7.0": {
         "licenses": "MIT",
         "repository": "https://github.com/component-driven/cypress-axe",
         "licenseUrl": "https://unpkg.com/cypress-axe@1.7.0/License.md"
     },
-    "cypress@15.0.0": {
+    "cypress@15.13.0": {
         "licenses": "MIT",
         "repository": "https://github.com/cypress-io/cypress",
         "licenseUrl": "https://cypress.io"
     },
-    "esbuild@0.27.2": {
-        "licenses": "MIT",
-        "repository": "https://github.com/evanw/esbuild",
-        "licenseUrl": "https://unpkg.com/esbuild@0.27.2/LICENSE.md"
-    },
-    "eslint-config-google@0.14.0": {
-        "licenses": "Apache-2.0",
-        "repository": "https://github.com/google/eslint-config-google",
-        "licenseUrl": "https://unpkg.com/eslint-config-google@0.14.0/LICENSE"
-    },
-    "eslint-config-prettier@10.1.8": {
-        "licenses": "MIT",
-        "repository": "https://github.com/prettier/eslint-config-prettier",
-        "licenseUrl": "https://unpkg.com/eslint-config-prettier@10.1.8/LICENSE"
-    },
-    "eslint@9.34.0": {
-        "licenses": "MIT",
-        "repository": "https://github.com/eslint/eslint",
-        "licenseUrl": "https://unpkg.com/eslint@9.34.0/LICENSE"
-    },
-    "github-markdown-css@5.8.1": {
+    "github-markdown-css@5.9.0": {
         "licenses": "MIT",
         "repository": "https://github.com/sindresorhus/github-markdown-css",
-        "licenseUrl": "https://unpkg.com/github-markdown-css@5.8.1/license"
+        "licenseUrl": "https://unpkg.com/github-markdown-css@5.9.0/license"
     },
     "highlight.js@11.11.1": {
         "licenses": "BSD-3-Clause",
@@ -94,100 +64,80 @@
         "repository": "https://github.com/davidparsson/junit-report-builder",
         "licenseUrl": "https://unpkg.com/junit-report-builder@5.1.1/LICENSE"
     },
-    "lint-staged@16.1.5": {
+    "lint-staged@16.4.0": {
         "licenses": "MIT",
         "repository": "https://github.com/lint-staged/lint-staged",
-        "licenseUrl": "https://unpkg.com/lint-staged@16.1.5/LICENSE"
+        "licenseUrl": "https://unpkg.com/lint-staged@16.4.0/LICENSE"
     },
-    "lit@3.3.1": {
+    "lit@3.3.2": {
         "licenses": "BSD-3-Clause",
         "repository": "https://github.com/lit/lit",
-        "licenseUrl": "https://unpkg.com/lit@3.3.1/LICENSE"
+        "licenseUrl": "https://unpkg.com/lit@3.3.2/LICENSE"
     },
-    "marked@16.2.1": {
+    "marked@18.0.0": {
         "licenses": "MIT",
         "repository": "https://github.com/markedjs/marked",
-        "licenseUrl": "https://unpkg.com/marked@16.2.1/LICENSE.md"
+        "licenseUrl": "https://unpkg.com/marked@18.0.0/LICENSE.md"
     },
-    "postcss-prefix-selector@2.1.1": {
+    "oxfmt@0.44.0": {
         "licenses": "MIT",
-        "repository": "https://github.com/RadValentin/postcss-prefix-selector",
-        "licenseUrl": "https://unpkg.com/postcss-prefix-selector@2.1.1/LICENSE"
+        "repository": "https://github.com/oxc-project/oxc",
+        "licenseUrl": "https://unpkg.com/oxfmt@0.44.0/LICENSE"
     },
-    "postcss@8.5.6": {
+    "oxlint-tsgolint@0.20.0": {
         "licenses": "MIT",
-        "repository": "https://github.com/postcss/postcss",
-        "licenseUrl": "https://unpkg.com/postcss@8.5.6/LICENSE"
+        "repository": "https://github.com/oxc-project/tsgolint",
+        "licenseUrl": "https://unpkg.com/oxlint-tsgolint@0.20.0/LICENSE"
     },
-    "prettier@3.8.1": {
+    "oxlint@1.59.0": {
         "licenses": "MIT",
-        "repository": "https://github.com/prettier/prettier",
-        "licenseUrl": "https://unpkg.com/prettier@3.8.1/LICENSE"
+        "repository": "https://github.com/oxc-project/oxc",
+        "licenseUrl": "https://unpkg.com/oxlint@1.59.0/LICENSE"
     },
-    "resolve-pkg@2.0.0": {
-        "licenses": "MIT",
-        "repository": "https://github.com/sindresorhus/resolve-pkg",
-        "licenseUrl": "https://unpkg.com/resolve-pkg@2.0.0/license"
-    },
-    "sass@1.91.0": {
-        "licenses": "MIT",
-        "repository": "https://github.com/sass/dart-sass",
-        "licenseUrl": "https://unpkg.com/sass@1.91.0/LICENSE"
-    },
-    "stylelint-config-recommended-scss@16.0.0": {
+    "postcss-prefix-selector@2.1.1": {
         "licenses": "MIT",
-        "repository": "https://github.com/stylelint-scss/stylelint-config-recommended-scss",
-        "licenseUrl": "https://unpkg.com/stylelint-config-recommended-scss@16.0.0/LICENSE"
+        "repository": "https://github.com/RadValentin/postcss-prefix-selector",
+        "licenseUrl": "https://unpkg.com/postcss-prefix-selector@2.1.1/LICENSE"
     },
-    "stylelint-config-standard@39.0.0": {
+    "postcss@8.5.8": {
         "licenses": "MIT",
-        "repository": "https://github.com/stylelint/stylelint-config-standard",
-        "licenseUrl": "https://unpkg.com/stylelint-config-standard@39.0.0/LICENSE"
+        "repository": "https://github.com/postcss/postcss",
+        "licenseUrl": "https://unpkg.com/postcss@8.5.8/LICENSE"
     },
-    "stylelint-scss@6.12.1": {
+    "resolve-pkg@3.0.1": {
         "licenses": "MIT",
-        "repository": "https://github.com/stylelint-scss/stylelint-scss",
-        "licenseUrl": "https://unpkg.com/stylelint-scss@6.12.1/LICENSE"
+        "repository": "https://github.com/sindresorhus/resolve-pkg",
+        "licenseUrl": "https://unpkg.com/resolve-pkg@3.0.1/license"
     },
-    "stylelint@16.23.1": {
+    "sass@1.99.0": {
         "licenses": "MIT",
-        "repository": "https://github.com/stylelint/stylelint",
-        "licenseUrl": "https://unpkg.com/stylelint@16.23.1/LICENSE"
+        "repository": "https://github.com/sass/dart-sass",
+        "licenseUrl": "https://unpkg.com/sass@1.99.0/LICENSE"
     },
-    "tsup@8.5.1": {
+    "tsdown@0.21.7": {
         "licenses": "MIT",
-        "repository": "https://github.com/egoist/tsup",
-        "licenseUrl": "https://unpkg.com/tsup@8.5.1/LICENSE"
+        "repository": "https://github.com/rolldown/tsdown",
+        "licenseUrl": "https://unpkg.com/tsdown@0.21.7/LICENSE"
     },
-    "turbo@2.5.6": {
+    "turbo@2.9.4": {
         "licenses": "MIT",
         "repository": "https://github.com/vercel/turborepo",
-        "licenseUrl": "https://unpkg.com/turbo@2.5.6/LICENSE"
+        "licenseUrl": "https://unpkg.com/turbo@2.9.4/LICENSE"
     },
-    "typescript-eslint@8.41.0": {
-        "licenses": "MIT",
-        "repository": "https://github.com/typescript-eslint/typescript-eslint",
-        "licenseUrl": "https://unpkg.com/typescript-eslint@8.41.0/LICENSE"
-    },
-    "typescript@5.9.3": {
+    "typescript@6.0.2": {
         "licenses": "Apache-2.0",
         "repository": "https://github.com/microsoft/TypeScript",
-        "licenseUrl": "https://unpkg.com/typescript@5.9.3/LICENSE.txt"
-    },
-    "vite-tsconfig-paths@5.1.4": {
-        "licenses": "MIT",
-        "repository": "https://github.com/aleclarson/vite-tsconfig-paths",
-        "licenseUrl": "https://unpkg.com/vite-tsconfig-paths@5.1.4/LICENSE"
+        "licenseUrl": "https://unpkg.com/typescript@6.0.2/LICENSE.txt"
     },
-    "vite@7.3.1": {
+    "vite@8.0.5": {
         "licenses": "MIT",
         "repository": "https://github.com/vitejs/vite",
-        "licenseUrl": "https://unpkg.com/vite@7.3.1/LICENSE.md"
+        "licenseUrl": "https://unpkg.com/vite@8.0.5/LICENSE.md"
     },
-    "vitest@4.0.18": {
+    "vitest@4.1.2": {
         "licenses": "MIT",
         "repository": "https://github.com/vitest-dev/vitest",
-        "licenseUrl": "https://unpkg.com/vitest@4.0.18/LICENSE.md"
+        "licenseUrl": "https://unpkg.com/vitest@4.1.2/LICENSE.md"
     },
     "yargs@18.0.0": {
         "licenses": "MIT",

package/package.json

@@ -1,28 +1,29 @@
 {
   "name": "@cas-smartdesign/radio-button-group",
-  "version": "4.4.0",
+  "version": "5.0.0",
   "description": "Radio button and radio button group elements with SmartDesign look & feel",
-  "main": "dist/radio-button-group-with-externals.js",
-  "module": "dist/radio-button-group.mjs",
   "license": "SEE LICENSE IN LICENSE",
-  "types": "dist/radio-button-group.d.ts",
-  "dependencies": {
-    "lit": "^3.3.1",
-    "@cas-smartdesign/field-validation-message": "^5.3.2",
-    "@cas-smartdesign/styles": "^3.8.0"
-  },
   "files": [
     "dist",
     "npm-third-party-licenses.json"
   ],
+  "type": "module",
+  "main": "dist/radio-button-group.mjs",
+  "module": "dist/radio-button-group.mjs",
+  "types": "dist/radio-button-group.d.ts",
   "publishConfig": {
-    "registry": "https://registry.npmjs.org/",
-    "access": "public"
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "dependencies": {
+    "lit": "^3.3.2",
+    "@cas-smartdesign/field-validation-message": "^6.0.0",
+    "@cas-smartdesign/styles": "^3.9.0"
   },
   "devDependencies": {
-    "@cas-smartdesign/license-generator": "^1.9.0",
-    "@cas-smartdesign/element-preview": "^0.4.0",
-    "@cas-smartdesign/button": "^5.4.0"
+    "@cas-smartdesign/element-preview": "^1.0.0",
+    "@cas-smartdesign/button": "^6.0.0",
+    "@cas-smartdesign/license-generator": "^1.10.0"
   },
   "scripts": {
     "version": "pnpm version",

package/readme.md

@@ -23,7 +23,7 @@ A radio-button-group and a radio-button element based on [lit-element](https://g
 
 ### Custom events
 
-- `value-change`: **_CustomEvent\<IValueChangeEvent\>_**
+- `sd-radio-button-group-value-change`: **_CustomEvent\<IValueChangeEvent\>_**
   - This event is dispatched when the value is changed because of a user interaction
 
 ### Validation

package/dist/radio-button-group-with-externals.js

@@ -1,84 +0,0 @@
-var window;(window||={})["@cas-smartdesign/radio-button-group"]=(()=>{var Q=Object.defineProperty;var It=Object.getOwnPropertyDescriptor;var Ut=Object.getOwnPropertyNames;var Bt=Object.prototype.hasOwnProperty;var Mt=(e,t)=>{for(var s in t)Q(e,s,{get:t[s],enumerable:!0})},Ot=(e,t,s,i)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of Ut(t))!Bt.call(e,o)&&o!==s&&Q(e,o,{get:()=>t[o],enumerable:!(i=It(t,o))||i.enumerable});return e};var Lt=e=>Ot(Q({},"__esModule",{value:!0}),e);var ae={};Mt(ae,{RadioButton:()=>kt,RadioButtonGroup:()=>Pt});var q=globalThis,W=q.ShadowRoot&&(q.ShadyCSS===void 0||q.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,X=Symbol(),ut=new WeakMap,M=class{constructor(t,s,i){if(this._$cssResult$=!0,i!==X)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=s}get styleSheet(){let t=this.o,s=this.t;if(W&&t===void 0){let i=s!==void 0&&s.length===1;i&&(t=ut.get(s)),t===void 0&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),i&&ut.set(s,t))}return t}toString(){return this.cssText}},y=e=>new M(typeof e=="string"?e:e+"",void 0,X),P=(e,...t)=>{let s=e.length===1?e[0]:t.reduce(((i,o,n)=>i+(r=>{if(r._$cssResult$===!0)return r.cssText;if(typeof r=="number")return r;throw Error("Value passed to 'css' function must be a 'css' function result: "+r+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(o)+e[n+1]),e[0]);return new M(s,e,X)},pt=(e,t)=>{if(W)e.adoptedStyleSheets=t.map((s=>s instanceof CSSStyleSheet?s:s.styleSheet));else for(let s of t){let i=document.createElement("style"),o=q.litNonce;o!==void 0&&i.setAttribute("nonce",o),i.textContent=s.cssText,e.appendChild(i)}},Y=W?e=>e:e=>e instanceof CSSStyleSheet?(t=>{let s="";for(let i of t.cssRules)s+=i.cssText;return y(s)})(e):e;var{is:Dt,defineProperty:Ht,getOwnPropertyDescriptor:Rt,getOwnPropertyNames:Tt,getOwnPropertySymbols:Nt,getPrototypeOf:zt}=Object,K=globalThis,ft=K.trustedTypes,jt=ft?ft.emptyScript:"",Ft=K.reactiveElementPolyfillSupport,O=(e,t)=>e,L={toAttribute(e,t){switch(t){case Boolean:e=e?jt:null;break;case Object:case Array:e=e==null?e:JSON.stringify(e)}return e},fromAttribute(e,t){let s=e;switch(t){case Boolean:s=e!==null;break;case Number:s=e===null?null:Number(e);break;case Object:case Array:try{s=JSON.parse(e)}catch{s=null}}return s}},Z=(e,t)=>!Dt(e,t),gt={attribute:!0,type:String,converter:L,reflect:!1,useDefault:!1,hasChanged:Z};Symbol.metadata??=Symbol("metadata"),K.litPropertyMetadata??=new WeakMap;var v=class extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,s=gt){if(s.state&&(s.attribute=!1),this._$Ei(),this.prototype.hasOwnProperty(t)&&((s=Object.create(s)).wrapped=!0),this.elementProperties.set(t,s),!s.noAccessor){let i=Symbol(),o=this.getPropertyDescriptor(t,i,s);o!==void 0&&Ht(this.prototype,t,o)}}static getPropertyDescriptor(t,s,i){let{get:o,set:n}=Rt(this.prototype,t)??{get(){return this[s]},set(r){this[s]=r}};return{get:o,set(r){let h=o?.call(this);n?.call(this,r),this.requestUpdate(t,h,i)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)??gt}static _$Ei(){if(this.hasOwnProperty(O("elementProperties")))return;let t=zt(this);t.finalize(),t.l!==void 0&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties)}static finalize(){if(this.hasOwnProperty(O("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(O("properties"))){let s=this.properties,i=[...Tt(s),...Nt(s)];for(let o of i)this.createProperty(o,s[o])}let t=this[Symbol.metadata];if(t!==null){let s=litPropertyMetadata.get(t);if(s!==void 0)for(let[i,o]of s)this.elementProperties.set(i,o)}this._$Eh=new Map;for(let[s,i]of this.elementProperties){let o=this._$Eu(s,i);o!==void 0&&this._$Eh.set(o,s)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(t){let s=[];if(Array.isArray(t)){let i=new Set(t.flat(1/0).reverse());for(let o of i)s.unshift(Y(o))}else t!==void 0&&s.push(Y(t));return s}static _$Eu(t,s){let i=s.attribute;return i===!1?void 0:typeof i=="string"?i:typeof t=="string"?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){this._$ES=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach((t=>t(this)))}addController(t){(this._$EO??=new Set).add(t),this.renderRoot!==void 0&&this.isConnected&&t.hostConnected?.()}removeController(t){this._$EO?.delete(t)}_$E_(){let t=new Map,s=this.constructor.elementProperties;for(let i of s.keys())this.hasOwnProperty(i)&&(t.set(i,this[i]),delete this[i]);t.size>0&&(this._$Ep=t)}createRenderRoot(){let t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return pt(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(!0),this._$EO?.forEach((t=>t.hostConnected?.()))}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach((t=>t.hostDisconnected?.()))}attributeChangedCallback(t,s,i){this._$AK(t,i)}_$ET(t,s){let i=this.constructor.elementProperties.get(t),o=this.constructor._$Eu(t,i);if(o!==void 0&&i.reflect===!0){let n=(i.converter?.toAttribute!==void 0?i.converter:L).toAttribute(s,i.type);this._$Em=t,n==null?this.removeAttribute(o):this.setAttribute(o,n),this._$Em=null}}_$AK(t,s){let i=this.constructor,o=i._$Eh.get(t);if(o!==void 0&&this._$Em!==o){let n=i.getPropertyOptions(o),r=typeof n.converter=="function"?{fromAttribute:n.converter}:n.converter?.fromAttribute!==void 0?n.converter:L;this._$Em=o;let h=r.fromAttribute(s,n.type);this[o]=h??this._$Ej?.get(o)??h,this._$Em=null}}requestUpdate(t,s,i){if(t!==void 0){let o=this.constructor,n=this[t];if(i??=o.getPropertyOptions(t),!((i.hasChanged??Z)(n,s)||i.useDefault&&i.reflect&&n===this._$Ej?.get(t)&&!this.hasAttribute(o._$Eu(t,i))))return;this.C(t,s,i)}this.isUpdatePending===!1&&(this._$ES=this._$EP())}C(t,s,{useDefault:i,reflect:o,wrapped:n},r){i&&!(this._$Ej??=new Map).has(t)&&(this._$Ej.set(t,r??s??this[t]),n!==!0||r!==void 0)||(this._$AL.has(t)||(this.hasUpdated||i||(s=void 0),this._$AL.set(t,s)),o===!0&&this._$Em!==t&&(this._$Eq??=new Set).add(t))}async _$EP(){this.isUpdatePending=!0;try{await this._$ES}catch(s){Promise.reject(s)}let t=this.scheduleUpdate();return t!=null&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(let[o,n]of this._$Ep)this[o]=n;this._$Ep=void 0}let i=this.constructor.elementProperties;if(i.size>0)for(let[o,n]of i){let{wrapped:r}=n,h=this[o];r!==!0||this._$AL.has(o)||h===void 0||this.C(o,void 0,n,h)}}let t=!1,s=this._$AL;try{t=this.shouldUpdate(s),t?(this.willUpdate(s),this._$EO?.forEach((i=>i.hostUpdate?.())),this.update(s)):this._$EM()}catch(i){throw t=!1,this._$EM(),i}t&&this._$AE(s)}willUpdate(t){}_$AE(t){this._$EO?.forEach((s=>s.hostUpdated?.())),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$EM(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return!0}update(t){this._$Eq&&=this._$Eq.forEach((s=>this._$ET(s,this[s]))),this._$EM()}updated(t){}firstUpdated(t){}};v.elementStyles=[],v.shadowRootOptions={mode:"open"},v[O("elementProperties")]=new Map,v[O("finalized")]=new Map,Ft?.({ReactiveElement:v}),(K.reactiveElementVersions??=[]).push("2.1.1");var rt=globalThis,J=rt.trustedTypes,vt=J?J.createPolicy("lit-html",{createHTML:e=>e}):void 0,At="$lit$",$=`lit$${Math.random().toFixed(9).slice(2)}$`,xt="?"+$,Vt=`<${xt}>`,S=document,H=()=>S.createComment(""),R=e=>e===null||typeof e!="object"&&typeof e!="function",at=Array.isArray,qt=e=>at(e)||typeof e?.[Symbol.iterator]=="function",tt=`[ 	
-\f\r]`,D=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,mt=/-->/g,$t=/>/g,A=RegExp(`>|${tt}(?:([^\\s"'>=/]+)(${tt}*=${tt}*(?:[^ 	
-\f\r"'\`<>=]|("|')|))|$)`,"g"),_t=/'/g,bt=/"/g,St=/^(?:script|style|textarea|title)$/i,ht=e=>(t,...s)=>({_$litType$:e,strings:t,values:s}),E=ht(1),pe=ht(2),fe=ht(3),w=Symbol.for("lit-noChange"),c=Symbol.for("lit-nothing"),yt=new WeakMap,x=S.createTreeWalker(S,129);function wt(e,t){if(!at(e)||!e.hasOwnProperty("raw"))throw Error("invalid template strings array");return vt!==void 0?vt.createHTML(t):t}var Wt=(e,t)=>{let s=e.length-1,i=[],o,n=t===2?"<svg>":t===3?"<math>":"",r=D;for(let h=0;h<s;h++){let a=e[h],d,u,l=-1,g=0;for(;g<a.length&&(r.lastIndex=g,u=r.exec(a),u!==null);)g=r.lastIndex,r===D?u[1]==="!--"?r=mt:u[1]!==void 0?r=$t:u[2]!==void 0?(St.test(u[2])&&(o=RegExp("</"+u[2],"g")),r=A):u[3]!==void 0&&(r=A):r===A?u[0]===">"?(r=o??D,l=-1):u[1]===void 0?l=-2:(l=r.lastIndex-u[2].length,d=u[1],r=u[3]===void 0?A:u[3]==='"'?bt:_t):r===bt||r===_t?r=A:r===mt||r===$t?r=D:(r=A,o=void 0);let m=r===A&&e[h+1].startsWith("/>")?" ":"";n+=r===D?a+Vt:l>=0?(i.push(d),a.slice(0,l)+At+a.slice(l)+$+m):a+$+(l===-2?h:m)}return[wt(e,n+(e[s]||"<?>")+(t===2?"</svg>":t===3?"</math>":"")),i]},T=class e{constructor({strings:t,_$litType$:s},i){let o;this.parts=[];let n=0,r=0,h=t.length-1,a=this.parts,[d,u]=Wt(t,s);if(this.el=e.createElement(d,i),x.currentNode=this.el.content,s===2||s===3){let l=this.el.content.firstChild;l.replaceWith(...l.childNodes)}for(;(o=x.nextNode())!==null&&a.length<h;){if(o.nodeType===1){if(o.hasAttributes())for(let l of o.getAttributeNames())if(l.endsWith(At)){let g=u[r++],m=o.getAttribute(l).split($),V=/([.?@])?(.*)/.exec(g);a.push({type:1,index:n,name:V[2],strings:m,ctor:V[1]==="."?st:V[1]==="?"?it:V[1]==="@"?ot:U}),o.removeAttribute(l)}else l.startsWith($)&&(a.push({type:6,index:n}),o.removeAttribute(l));if(St.test(o.tagName)){let l=o.textContent.split($),g=l.length-1;if(g>0){o.textContent=J?J.emptyScript:"";for(let m=0;m<g;m++)o.append(l[m],H()),x.nextNode(),a.push({type:2,index:++n});o.append(l[g],H())}}}else if(o.nodeType===8)if(o.data===xt)a.push({type:2,index:n});else{let l=-1;for(;(l=o.data.indexOf($,l+1))!==-1;)a.push({type:7,index:n}),l+=$.length-1}n++}}static createElement(t,s){let i=S.createElement("template");return i.innerHTML=t,i}};function I(e,t,s=e,i){if(t===w)return t;let o=i!==void 0?s._$Co?.[i]:s._$Cl,n=R(t)?void 0:t._$litDirective$;return o?.constructor!==n&&(o?._$AO?.(!1),n===void 0?o=void 0:(o=new n(e),o._$AT(e,s,i)),i!==void 0?(s._$Co??=[])[i]=o:s._$Cl=o),o!==void 0&&(t=I(e,o._$AS(e,t.values),o,i)),t}var et=class{constructor(t,s){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=s}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){let{el:{content:s},parts:i}=this._$AD,o=(t?.creationScope??S).importNode(s,!0);x.currentNode=o;let n=x.nextNode(),r=0,h=0,a=i[0];for(;a!==void 0;){if(r===a.index){let d;a.type===2?d=new N(n,n.nextSibling,this,t):a.type===1?d=new a.ctor(n,a.name,a.strings,this,t):a.type===6&&(d=new nt(n,this,t)),this._$AV.push(d),a=i[++h]}r!==a?.index&&(n=x.nextNode(),r++)}return x.currentNode=S,o}p(t){let s=0;for(let i of this._$AV)i!==void 0&&(i.strings!==void 0?(i._$AI(t,i,s),s+=i.strings.length-2):i._$AI(t[s])),s++}},N=class e{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,s,i,o){this.type=2,this._$AH=c,this._$AN=void 0,this._$AA=t,this._$AB=s,this._$AM=i,this.options=o,this._$Cv=o?.isConnected??!0}get parentNode(){let t=this._$AA.parentNode,s=this._$AM;return s!==void 0&&t?.nodeType===11&&(t=s.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,s=this){t=I(this,t,s),R(t)?t===c||t==null||t===""?(this._$AH!==c&&this._$AR(),this._$AH=c):t!==this._$AH&&t!==w&&this._(t):t._$litType$!==void 0?this.$(t):t.nodeType!==void 0?this.T(t):qt(t)?this.k(t):this._(t)}O(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.O(t))}_(t){this._$AH!==c&&R(this._$AH)?this._$AA.nextSibling.data=t:this.T(S.createTextNode(t)),this._$AH=t}$(t){let{values:s,_$litType$:i}=t,o=typeof i=="number"?this._$AC(t):(i.el===void 0&&(i.el=T.createElement(wt(i.h,i.h[0]),this.options)),i);if(this._$AH?._$AD===o)this._$AH.p(s);else{let n=new et(o,this),r=n.u(this.options);n.p(s),this.T(r),this._$AH=n}}_$AC(t){let s=yt.get(t.strings);return s===void 0&&yt.set(t.strings,s=new T(t)),s}k(t){at(this._$AH)||(this._$AH=[],this._$AR());let s=this._$AH,i,o=0;for(let n of t)o===s.length?s.push(i=new e(this.O(H()),this.O(H()),this,this.options)):i=s[o],i._$AI(n),o++;o<s.length&&(this._$AR(i&&i._$AB.nextSibling,o),s.length=o)}_$AR(t=this._$AA.nextSibling,s){for(this._$AP?.(!1,!0,s);t!==this._$AB;){let i=t.nextSibling;t.remove(),t=i}}setConnected(t){this._$AM===void 0&&(this._$Cv=t,this._$AP?.(t))}},U=class{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,s,i,o,n){this.type=1,this._$AH=c,this._$AN=void 0,this.element=t,this.name=s,this._$AM=o,this.options=n,i.length>2||i[0]!==""||i[1]!==""?(this._$AH=Array(i.length-1).fill(new String),this.strings=i):this._$AH=c}_$AI(t,s=this,i,o){let n=this.strings,r=!1;if(n===void 0)t=I(this,t,s,0),r=!R(t)||t!==this._$AH&&t!==w,r&&(this._$AH=t);else{let h=t,a,d;for(t=n[0],a=0;a<n.length-1;a++)d=I(this,h[i+a],s,a),d===w&&(d=this._$AH[a]),r||=!R(d)||d!==this._$AH[a],d===c?t=c:t!==c&&(t+=(d??"")+n[a+1]),this._$AH[a]=d}r&&!o&&this.j(t)}j(t){t===c?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"")}},st=class extends U{constructor(){super(...arguments),this.type=3}j(t){this.element[this.name]=t===c?void 0:t}},it=class extends U{constructor(){super(...arguments),this.type=4}j(t){this.element.toggleAttribute(this.name,!!t&&t!==c)}},ot=class extends U{constructor(t,s,i,o,n){super(t,s,i,o,n),this.type=5}_$AI(t,s=this){if((t=I(this,t,s,0)??c)===w)return;let i=this._$AH,o=t===c&&i!==c||t.capture!==i.capture||t.once!==i.once||t.passive!==i.passive,n=t!==c&&(i===c||o);o&&this.element.removeEventListener(this.name,this,i),n&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){typeof this._$AH=="function"?this._$AH.call(this.options?.host??this.element,t):this._$AH.handleEvent(t)}},nt=class{constructor(t,s,i){this.element=t,this.type=6,this._$AN=void 0,this._$AM=s,this.options=i}get _$AU(){return this._$AM._$AU}_$AI(t){I(this,t)}};var Kt=rt.litHtmlPolyfillSupport;Kt?.(T,N),(rt.litHtmlVersions??=[]).push("3.3.1");var Et=(e,t,s)=>{let i=s?.renderBefore??t,o=i._$litPart$;if(o===void 0){let n=s?.renderBefore??null;i._$litPart$=o=new N(t.insertBefore(H(),n),n,void 0,s??{})}return o._$AI(e),o};var lt=globalThis,f=class extends v{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){let t=super.createRenderRoot();return this.renderOptions.renderBefore??=t.firstChild,t}update(t){let s=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=Et(s,this.renderRoot,this.renderOptions)}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(!0)}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(!1)}render(){return w}};f._$litElement$=!0,f.finalized=!0,lt.litElementHydrateSupport?.({LitElement:f});var Zt=lt.litElementPolyfillSupport;Zt?.({LitElement:f});(lt.litElementVersions??=[]).push("4.2.1");var Jt={attribute:!0,type:String,converter:L,reflect:!1,hasChanged:Z},Gt=(e=Jt,t,s)=>{let{kind:i,metadata:o}=s,n=globalThis.litPropertyMetadata.get(o);if(n===void 0&&globalThis.litPropertyMetadata.set(o,n=new Map),i==="setter"&&((e=Object.create(e)).wrapped=!0),n.set(s.name,e),i==="accessor"){let{name:r}=s;return{set(h){let a=t.get.call(this);t.set.call(this,h),this.requestUpdate(r,a,e)},init(h){return h!==void 0&&this.C(r,void 0,e,h),h}}}if(i==="setter"){let{name:r}=s;return function(h){let a=this[r];t.call(this,h),this.requestUpdate(r,a,e)}}throw Error("Unsupported decorator location: "+i)};function p(e){return(t,s)=>typeof s=="object"?Gt(e,t,s):((i,o,n)=>{let r=o.hasOwnProperty(n);return o.constructor.createProperty(n,i),r?Object.getOwnPropertyDescriptor(o,n):void 0})(e,t,s)}var Ct=e=>e??c;var Qt=':host{display:inline-block;font-size:var(--sd-field-validation-message-font-size, 13px);line-height:var(--sd-field-validation-message-line-height, 20px);font-family:var(--sd-field-validation-message-font-family, "Segoe UI", "Lucida Sans", Arial, sans-serif);color:var(--sd-field-validation-message-color, #111);contain:content}:host([hidden]){display:none!important}:host([level=warn i]){color:var(--sd-field-validation-message-warn-color, #555555)}:host([level=suggest i]){color:var(--sd-field-validation-message-suggest-color, #bf8800)}:host([level=error i]){color:var(--sd-field-validation-message-error-color, #cc0017)}.icon{height:12px;width:12px;padding-right:4px;margin-bottom:-1px}',Xt="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2012%2012'%3e%3cstyle%20id='style3'%3e%20.st0{fill:%23fff}.st1{fill:%23c00}%20%3c/style%3e%3cg%20id='g5'%3e%3cpath%20class='st1'%20d='M6%20.9c2.8%200%205.1%202.3%205.1%205.1S8.8%2011.1%206%2011.1.9%208.8.9%206%203.2.9%206%20.9m0-1C2.7-.1-.1%202.7-.1%206s2.7%206.1%206.1%206.1%206.1-2.7%206.1-6.1S9.3-.1%206-.1z'%20id='path9'/%3e%3c/g%3e%3cg%20id='g11'%3e%3cpath%20class='st0'%20id='rect13'%20d='M5.5%202.5h1v4h-1z'/%3e%3cpath%20class='st1'%20d='M6%203v3-3m1-1H5v5h2V2z'%20id='path15'/%3e%3c/g%3e%3cg%20id='g17'%3e%3cpath%20class='st0'%20id='rect19'%20d='M5.5%208.5h1v1h-1z'/%3e%3cpath%20class='st1'%20id='polygon21'%20d='M7%208H5v2h2V8z'/%3e%3c/g%3e%3c/svg%3e",Yt="data:image/svg+xml,%3csvg%20id='Ebene_1'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cstyle%3e%20.st0{fill:%23bf8800}%20%3c/style%3e%3cpath%20class='st0'%20d='M12%20.8l11%2019.8v1.3H1v-1.3L12%20.8zm.8-.6h-1.6L0%2020v3h24v-3L12.8.2z'/%3e%3cpath%20class='st0'%20d='M11%208h2v8h-2zm0%2010h2v2h-2z'/%3e%3c/svg%3e",te="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2012%2012'%3e%3cpath%20class='st1'%20d='M6%20.9c2.8%200%205.1%202.3%205.1%205.1S8.8%2011.1%206%2011.1.9%208.8.9%206%203.2.9%206%20.9m0-1C2.7-.1-.1%202.7-.1%206s2.7%206.1%206.1%206.1%206.1-2.7%206.1-6.1S9.3-.1%206-.1z'%20fill='%23555'/%3e%3cpath%20d='M6%209V6v3m-1%201h2V5H5v5zm2-8H5v2h2z'%20class='st1'%20fill='%23555'/%3e%3c/svg%3e",ee=Object.defineProperty,dt=(e,t,s,i)=>{for(var o=void 0,n=e.length-1,r;n>=0;n--)(r=e[n])&&(o=r(t,s,o)||o);return o&&ee(t,s,o),o},B,z=(B=class extends f{static parseLevel(e){if(e){let t=Object.keys(j).find(s=>s.toLowerCase()===e.toLowerCase());return t&&j[t]}}static get styles(){return[P`
-                ${y(Qt)}
-            `]}render(){return E`${this.iconToUse&&E`<img class="icon" src="${this.iconToUse}">`}${this.message}`}get iconToUse(){return this.icon||this._defaultIconPath}shouldUpdate(e){return e.has("level")&&(this._defaultIconPath=this.iconForLevel,!this.icon)?!0:super.shouldUpdate(e)}get iconForLevel(){switch(B.parseLevel(this.level)){case"warn":return te;case"suggest":return Yt;case"error":return Xt;default:return null}}},B.ID="sd-field-validation-message",B.levelConverter={fromAttribute(e){return B.parseLevel(e)},toAttribute(e){return e&&e.toLowerCase()}},B);dt([p({type:String,attribute:!0})],z.prototype,"message");dt([p({type:String,attribute:!0})],z.prototype,"icon");dt([p({converter:z.levelConverter,reflect:!0})],z.prototype,"level");var ct=z,j=(e=>(e.Warn="warn",e.Suggest="suggest",e.Error="error",e))(j||{});customElements.get(ct.ID)||customElements.define(ct.ID,ct);var se=':host{display:block}:host,.label,.checkbox{outline:none}:host([disabled]){pointer-events:none}:host([disabled]) .root{opacity:.6;cursor:default;filter:grayscale(100%)}:host(:not([disabled])[focused]) .highlight{display:block!important}:host([checked]) circle.inner{display:block!important}:host([checked]) circle.outer{stroke:var(--sd-radio-button-checked-color, #1467ba)!important}:host([oneline]) .label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.root{display:inline-flex;align-items:center;vertical-align:middle;width:100%;padding:var(--sd-radio-button-padding, 6px 0px)}.root .radio-button-container{position:relative;display:inline-block;width:28px;height:28px;box-sizing:border-box;cursor:pointer;margin-right:5px;flex-shrink:0}.root .radio-button-container input{position:absolute;top:0;left:0;opacity:0}.root .radio-button-container circle.highlight{stroke:var(--sd-radio-button-highlight-color, rgba(20, 103, 186, .3))}.root .radio-button-container circle.inner{fill:var(--sd-radio-button-checked-color, #1467ba)}.root .radio-button-container circle.outer{stroke:var(--sd-radio-button-unchecked-color, #767676)}.root .label{font-family:var(--sd-radio-button-font-family, "Segoe UI", "Lucida Sans", Arial, sans-serif);text-overflow:ellipsis;overflow-x:hidden;-webkit-user-select:none;user-select:none;cursor:pointer;padding-top:2px;padding-bottom:2px}',ie=Object.defineProperty,G=(e,t,s,i)=>{for(var o=void 0,n=e.length-1,r;n>=0;n--)(r=e[n])&&(o=r(t,s,o)||o);return o&&ie(t,s,o),o},oe=0,_,F=(_=class extends f{constructor(){super(),this.checked=!1,this.value="",this.disabled=!1,this.label="",this.handleClick=e=>{e.preventDefault()},this.a11yID=_.ID+"_"+oe++}static get styles(){return[P`
-                ${y(se)}
-            `]}render(){return E`
-            <div class="root">
-                <div class="radio-button-container">
-                    <input
-                        type="radio"
-                        id="${this.a11yID}"
-                        .checked="${this.checked}"
-                        ?disabled="${this.disabled}"
-                        @click="${this.handleClick}"
-                        class="radio-button"
-                    />
-                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="-14 -14 28 28">
-                        <circle
-                            class="highlight"
-                            style="display:none"
-                            r="11px"
-                            fill="transparent"
-                            stroke-width="6px"
-                        ></circle>
-                        <circle class="inner" r="6px" style="display:none" stroke="none"></circle>
-                        <circle class="outer" r="9px" fill="transparent" stroke-width="2px"></circle>
-                    </svg>
-                </div>
-                <label class="label" for="${this.a11yID}" @click="${this.handleClick}">${this.label}</label>
-            </div>
-        `}},_.ID="sd-radio-button",_.ensureDefined=()=>{customElements.get(_.ID)||customElements.define(_.ID,_)},_);G([p({type:Boolean,reflect:!0,attribute:!0})],F.prototype,"checked");G([p({type:String,reflect:!0,attribute:!0})],F.prototype,"value");G([p({type:Boolean,reflect:!0,attribute:!0})],F.prototype,"disabled");G([p({type:String,reflect:!0,attribute:!0})],F.prototype,"label");var kt=F,ne=":host(:focus){outline:none}.buttons-container{display:flex;gap:var(--sd-radio-button-group-gap, 0)}.buttons-container.vertical{flex-direction:column}.validation-message{margin-left:5px}",re=Object.defineProperty,k=(e,t,s,i)=>{for(var o=void 0,n=e.length-1,r;n>=0;n--)(r=e[n])&&(o=r(t,s,o)||o);return o&&re(t,s,o),o},C,b=(C=class extends f{constructor(){super(...arguments),this.layout="horizontal",this.value="",this.uncheckAllowed=!1,this.disabled=!1,this._focusIndex=-1,this._checkedButton=null,this.handleSlotChange=()=>{this._buttons=this.buttonsSlot.assignedElements(),this._buttons.forEach(e=>{!e.hasAttribute("disabled")&&this.disabled&&e.setAttribute("disabled",""),e.setAttribute("tabIndex","-1"),this.updateCheckedButton(e)})},this.handleFocusIn=e=>{let t=e.target,s=this._buttons.findIndex(i=>i==t);this.focusIndex=this.focusIndex>=0?this.focusIndex:this.getNextFocusIndex(s!==-1?s:0),this.updateFocused(null,this._buttons[this.focusIndex])},this.handleFocusOut=()=>{this.updateFocused(this._buttons[this.focusIndex])},this.handleButtonClick=e=>{this.focus();let t=this._buttons.find(i=>i.contains(e.target)),s=this._buttons.findIndex(i=>i==t);s>=0&&(this.focusIndex=s,this.updateChecked())},this.handleKeyDown=e=>{let t=!0;switch(e.key){case"Down":case"ArrowDown":case"Right":case"ArrowRight":{this.focusNext();break}case"Up":case"ArrowUp":case"Left":case"ArrowLeft":{this.focusPrevious();break}case"Enter":{this.updateChecked();break}default:t=!1}t&&(e.preventDefault(),e.stopPropagation())}}get focusIndex(){return this._focusIndex}set focusIndex(e){if(e>=-1&&e<this.childElementCount){let t=this._focusIndex;if(this._focusIndex=e,t!==e){let s=this._buttons[t],i=this._buttons[this.focusIndex];this.updateFocused(s,i)}}}firstUpdated(e){super.firstUpdated(e),this.buttonsSlot.addEventListener("slotchange",this.handleSlotChange),this.addEventListener("focusin",this.handleFocusIn),this.addEventListener("focusout",this.handleFocusOut),this.addEventListener("keydown",this.handleKeyDown)}updated(e){super.updated(e),e.has("disabled")&&(this.disabled?this.disableButtons():this.enableButtons())}static get styles(){return[P`
-                ${y(ne)}
-            `]}render(){return E`
-            <div
-                class="buttons-container ${this.layout==="vertical"?"vertical":"horizontal"}"
-                @click="${Ct(this.disabled?void 0:this.handleButtonClick)}"
-            >
-                <slot></slot>
-            </div>
-            ${this.validationMessage&&E`
-                <sd-field-validation-message
-                    class="validation-message"
-                    .message=${this.validationMessage}
-                    .icon=${this.validationIconSrc}
-                    .level=${this.validationLevel}
-                >
-                </sd-field-validation-message>
-            `}
-        `}updateCheckedButton(e){if(this._checkedButton&&this._checkedButton!==e)this.uncheckButton(e);else if(e.hasAttribute("checked")){this._checkedButton=e;let t=e.getAttribute("value");this.updateValue(t)}}disableButtons(){this._buttons?.forEach(e=>{e.setAttribute("disabled","")})}enableButtons(){this._buttons?.forEach(e=>{e.removeAttribute("disabled")})}fireValueChangeEvent(){this.dispatchEvent(new CustomEvent("value-change",{detail:{value:this.value,selectedIndex:this.selectedIndex}}))}focusNext(){let e=this.getNextFocusIndex(this.focusIndex+1);this.focusIndex=e!==-1?e:this.getNextFocusIndex(0),this.uncheckAllowed||this.updateChecked()}focusPrevious(){let e=this.getPreviousFocusIndex(this.focusIndex-1);this.focusIndex=e!==-1?e:this.getPreviousFocusIndex(this.childElementCount-1),this.uncheckAllowed||this.updateChecked()}getNextFocusIndex(e){for(let t=e;t<this.childElementCount;t++){let s=this._buttons[t];if(this.isFocusable(s))return t}return-1}getPreviousFocusIndex(e){for(let t=e;t>=0;t--){let s=this._buttons[t];if(this.isFocusable(s))return t}return-1}isFocusable(e){return!e.hasAttribute("disabled")}updateChecked(){let e=this._checkedButton,t=this._buttons[this.focusIndex];this._checkedButton=t,e&&e!==t&&this.uncheckButton(e),t&&this.toggleButton(t)}toggleButton(e){e.hasAttribute("checked")?this.uncheckAllowed&&(this.uncheckButton(e),this._checkedButton=null,this.updateValue("")):(this.checkButton(e),this.updateValue(e.getAttribute("value")))}updateValue(e){this.value=e,this.fireValueChangeEvent()}updateFocused(e,t){e?.removeAttribute?.("focused"),t?.setAttribute?.("focused","")}checkButton(e){e.setAttribute("checked","")}uncheckButton(e){e.removeAttribute("checked")}get buttonsSlot(){return this.shadowRoot&&!this._buttonsSlot&&(this._buttonsSlot=this.shadowRoot.querySelector("slot")),this._buttonsSlot}get selectedIndex(){return this._buttons.indexOf(this._checkedButton)}},C.ID="sd-radio-button-group",C.ensureDefined=()=>{kt.ensureDefined(),customElements.get(C.ID)||customElements.define(C.ID,C)},C);k([p({type:String,reflect:!0,attribute:!0})],b.prototype,"layout");k([p({type:String})],b.prototype,"value");k([p({type:Boolean,reflect:!0,attribute:"uncheck-allowed"})],b.prototype,"uncheckAllowed");k([p({type:Boolean,reflect:!0,attribute:!0})],b.prototype,"disabled");k([p({type:String})],b.prototype,"validationMessage");k([p({type:String})],b.prototype,"validationIconSrc");k([p({type:{fromAttribute(e){return e&&j[e.toLowerCase()]},toAttribute(e){return e&&e.toLowerCase()}},reflect:!0})],b.prototype,"validationLevel");var Pt=b;Pt.ensureDefined();return Lt(ae);})();
-/*! Bundled license information:
-
-@lit/reactive-element/css-tag.js:
-  (**
-   * @license
-   * Copyright 2019 Google LLC
-   * SPDX-License-Identifier: BSD-3-Clause
-   *)
-
-@lit/reactive-element/reactive-element.js:
-lit-html/lit-html.js:
-lit-element/lit-element.js:
-@lit/reactive-element/decorators/property.js:
-  (**
-   * @license
-   * Copyright 2017 Google LLC
-   * SPDX-License-Identifier: BSD-3-Clause
-   *)
-
-lit-html/is-server.js:
-  (**
-   * @license
-   * Copyright 2022 Google LLC
-   * SPDX-License-Identifier: BSD-3-Clause
-   *)
-
-lit-html/directives/if-defined.js:
-  (**
-   * @license
-   * Copyright 2018 Google LLC
-   * SPDX-License-Identifier: BSD-3-Clause
-   *)
-*/
-//# sourceMappingURL=radio-button-group-with-externals.js.map