@cas-smartdesign/radio-button-group 4.0.1

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

@@ -0,0 +1,61 @@
+import { LitElement, TemplateResult, PropertyValues } from "lit";
+import { ValidationLevel } from "@cas-smartdesign/field-validation-message";
+import type { LayoutType, IValueChangeEvent } from "./types";
+export { RadioButton } from "./radio-button";
+export type * from "./types";
+declare global {
+    interface HTMLElementTagNameMap {
+        [RadioButtonGroup.ID]: RadioButtonGroup;
+    }
+}
+export interface CustomEventMap extends HTMLElementEventMap {
+    "value-change": CustomEvent<IValueChangeEvent>;
+}
+export interface RadioButtonGroup {
+    addEventListener<K extends keyof CustomEventMap>(event: K, listener: ((this: this, ev: CustomEventMap[K]) => unknown) | null, options?: AddEventListenerOptions | boolean): void;
+    addEventListener(type: string, callback: EventListenerOrEventListenerObject | null, options?: AddEventListenerOptions | boolean): void;
+    removeEventListener<K extends keyof CustomEventMap>(type: K, listener: (this: this, ev: CustomEventMap[K]) => unknown, options?: boolean | EventListenerOptions): void;
+    removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    dispatchEvent<EventType extends CustomEventMap[keyof CustomEventMap]>(event: EventType): boolean;
+}
+export declare class RadioButtonGroup extends LitElement {
+    static readonly ID = "sd-radio-button-group";
+    static ensureDefined: () => void;
+    layout: LayoutType;
+    value: string;
+    uncheckAllowed: boolean;
+    disabled: boolean;
+    validationMessage: string;
+    validationIconSrc: string;
+    validationLevel: ValidationLevel;
+    private _buttonsSlot;
+    private _buttons;
+    private _focusIndex;
+    private _checkedButton;
+    get focusIndex(): number;
+    set focusIndex(index: number);
+    protected firstUpdated(changedProperties: PropertyValues): void;
+    protected updated(changedProperties: PropertyValues): void;
+    static get styles(): import("lit").CSSResult[];
+    render(): TemplateResult;
+    private handleSlotChange;
+    private updateCheckedButton;
+    private handleFocusIn;
+    private handleFocusOut;
+    private disableButtons;
+    private enableButtons;
+    private handleButtonClick;
+    private fireValueChangeEvent;
+    private handleKeyDown;
+    private getNextFocusIndex;
+    private getPreviousFocusIndex;
+    private isFocusable;
+    private updateChecked;
+    private toggleButton;
+    private updateValue;
+    private updateFocused;
+    private checkButton;
+    private uncheckButton;
+    private get buttonsSlot();
+    private get selectedIndex();
+}

package/dist/radio-button-group.mjs

@@ -0,0 +1,276 @@
+import { LitElement as b, css as g, unsafeCSS as v, html as f } from "lit";
+import { property as n } from "lit/decorators/property.js";
+import { ifDefined as x } from "lit/directives/if-defined.js";
+import { ValidationLevel as k } from "@cas-smartdesign/field-validation-message";
+const y = ":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}.root{display:inline-flex;align-items:center;vertical-align:middle;width:100%;padding-top:6px;padding-bottom:6px}.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: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}";
+var I = Object.defineProperty, m = Object.getOwnPropertyDescriptor, p = (o, t, e, s) => {
+  for (var i = s > 1 ? void 0 : s ? m(t, e) : t, c = o.length - 1, d; c >= 0; c--)
+    (d = o[c]) && (i = (s ? d(t, e, i) : d(i)) || i);
+  return s && i && I(t, e, i), i;
+};
+let w = 0;
+var a;
+const u = (a = class extends b {
+  constructor() {
+    super(), this.checked = !1, this.value = "", this.disabled = !1, this.label = "", this.handleClick = (t) => {
+      t.preventDefault();
+    }, this.a11yID = a.ID + "_" + w++;
+  }
+  static get styles() {
+    return [
+      g`
+                ${v(y)}
+            `
+    ];
+  }
+  render() {
+    return f`
+            <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>
+        `;
+  }
+}, a.ID = "sd-radio-button", a.ensureDefined = () => {
+  customElements.get(a.ID) || customElements.define(a.ID, a);
+}, a);
+p([
+  n({ type: Boolean, reflect: !0, attribute: !0 })
+], u.prototype, "checked", 2);
+p([
+  n({ type: String, reflect: !0, attribute: !0 })
+], u.prototype, "value", 2);
+p([
+  n({ type: Boolean, reflect: !0, attribute: !0 })
+], u.prototype, "disabled", 2);
+p([
+  n({ type: String, reflect: !0, attribute: !0 })
+], u.prototype, "label", 2);
+let B = u;
+const _ = ":host(:focus){outline:none}.buttons-container{display:flex}.buttons-container.vertical{flex-direction:column}.validation-message{margin-left:5px}";
+var C = Object.defineProperty, D = Object.getOwnPropertyDescriptor, h = (o, t, e, s) => {
+  for (var i = s > 1 ? void 0 : s ? D(t, e) : t, c = o.length - 1, d; c >= 0; c--)
+    (d = o[c]) && (i = (s ? d(t, e, i) : d(i)) || i);
+  return s && i && C(t, e, i), i;
+}, l;
+const r = (l = class extends b {
+  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((t) => {
+        !t.hasAttribute("disabled") && this.disabled && t.setAttribute("disabled", ""), t.setAttribute("tabIndex", "-1"), this.updateCheckedButton(t);
+      });
+    }, this.handleFocusIn = (t) => {
+      const e = t.target, s = this._buttons.findIndex((i) => i == e);
+      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 = (t) => {
+      this.focus();
+      const e = this._buttons.find((i) => i.contains(t.target)), s = this._buttons.findIndex((i) => i == e);
+      s >= 0 && (this.focusIndex = s, this.updateChecked());
+    }, this.handleKeyDown = (t) => {
+      let e = !0;
+      switch (t.key) {
+        case "Down":
+        case "ArrowDown": {
+          const s = this.getNextFocusIndex(this.focusIndex + 1);
+          this.focusIndex = s !== -1 ? s : this.getNextFocusIndex(0), this.uncheckAllowed || this.updateChecked();
+          break;
+        }
+        case "Up":
+        case "ArrowUp": {
+          const s = this.getPreviousFocusIndex(this.focusIndex - 1);
+          this.focusIndex = s !== -1 ? s : this.getPreviousFocusIndex(this.childElementCount - 1), this.uncheckAllowed || this.updateChecked();
+          break;
+        }
+        case "Enter": {
+          this.updateChecked();
+          break;
+        }
+        default:
+          e = !1;
+      }
+      e && (t.preventDefault(), t.stopPropagation());
+    };
+  }
+  get focusIndex() {
+    return this._focusIndex;
+  }
+  set focusIndex(t) {
+    if (t >= -1 && t < this.childElementCount) {
+      const e = this._focusIndex;
+      if (this._focusIndex = t, e !== t) {
+        const s = this._buttons[e], i = this._buttons[this.focusIndex];
+        this.updateFocused(s, i);
+      }
+    }
+  }
+  firstUpdated(t) {
+    super.firstUpdated(t), this.buttonsSlot.addEventListener("slotchange", this.handleSlotChange), this.addEventListener("focusin", this.handleFocusIn), this.addEventListener("focusout", this.handleFocusOut), this.addEventListener("keydown", this.handleKeyDown);
+  }
+  updated(t) {
+    super.updated(t), t.has("disabled") && (this.disabled ? this.disableButtons() : this.enableButtons());
+  }
+  static get styles() {
+    return [
+      g`
+                ${v(_)}
+            `
+    ];
+  }
+  render() {
+    return f`
+            <div
+                class="buttons-container ${this.layout === "vertical" ? "vertical" : "horizontal"}"
+                @click="${x(this.disabled ? void 0 : this.handleButtonClick)}"
+            >
+                <slot></slot>
+            </div>
+            ${this.validationMessage && f`
+                <sd-field-validation-message
+                    class="validation-message"
+                    .message=${this.validationMessage}
+                    .icon=${this.validationIconSrc}
+                    .level=${this.validationLevel}
+                >
+                </sd-field-validation-message>
+            `}
+        `;
+  }
+  updateCheckedButton(t) {
+    if (this._checkedButton && this._checkedButton !== t)
+      this.uncheckButton(t);
+    else if (t.hasAttribute("checked")) {
+      this._checkedButton = t;
+      const e = t.getAttribute("value");
+      this.updateValue(e);
+    }
+  }
+  disableButtons() {
+    var t;
+    (t = this._buttons) == null || t.forEach((e) => {
+      e.setAttribute("disabled", "");
+    });
+  }
+  enableButtons() {
+    var t;
+    (t = this._buttons) == null || t.forEach((e) => {
+      e.removeAttribute("disabled");
+    });
+  }
+  fireValueChangeEvent() {
+    this.dispatchEvent(
+      new CustomEvent("value-change", {
+        detail: {
+          value: this.value,
+          selectedIndex: this.selectedIndex
+        }
+      })
+    );
+  }
+  getNextFocusIndex(t) {
+    for (let e = t; e < this.childElementCount; e++) {
+      const s = this._buttons[e];
+      if (this.isFocusable(s))
+        return e;
+    }
+    return -1;
+  }
+  getPreviousFocusIndex(t) {
+    for (let e = t; e >= 0; e--) {
+      const s = this._buttons[e];
+      if (this.isFocusable(s))
+        return e;
+    }
+    return -1;
+  }
+  isFocusable(t) {
+    return !t.hasAttribute("disabled");
+  }
+  updateChecked() {
+    const t = this._checkedButton, e = this._buttons[this.focusIndex];
+    this._checkedButton = e, t && t !== e && this.uncheckButton(t), e && this.toggleButton(e);
+  }
+  toggleButton(t) {
+    t.hasAttribute("checked") ? this.uncheckAllowed && (this.uncheckButton(t), this._checkedButton = null, this.updateValue("")) : (this.checkButton(t), this.updateValue(t.getAttribute("value")));
+  }
+  updateValue(t) {
+    this.value = t, this.fireValueChangeEvent();
+  }
+  updateFocused(t, e) {
+    var s, i;
+    (s = t == null ? void 0 : t.removeAttribute) == null || s.call(t, "focused"), (i = e == null ? void 0 : e.setAttribute) == null || i.call(e, "focused", "");
+  }
+  checkButton(t) {
+    t.setAttribute("checked", "");
+  }
+  uncheckButton(t) {
+    t.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);
+  }
+}, l.ID = "sd-radio-button-group", l.ensureDefined = () => {
+  B.ensureDefined(), customElements.get(l.ID) || customElements.define(l.ID, l);
+}, l);
+h([
+  n({ type: String, reflect: !0, attribute: !0 })
+], r.prototype, "layout", 2);
+h([
+  n({ type: String })
+], r.prototype, "value", 2);
+h([
+  n({ type: Boolean, reflect: !0, attribute: "uncheck-allowed" })
+], r.prototype, "uncheckAllowed", 2);
+h([
+  n({ type: Boolean, reflect: !0, attribute: !0 })
+], r.prototype, "disabled", 2);
+h([
+  n({ type: String })
+], r.prototype, "validationMessage", 2);
+h([
+  n({ type: String })
+], r.prototype, "validationIconSrc", 2);
+h([
+  n({
+    type: {
+      fromAttribute(o) {
+        return o && k[o.toLowerCase()];
+      },
+      toAttribute(o) {
+        return o && o.toLowerCase();
+      }
+    },
+    reflect: !0
+  })
+], r.prototype, "validationLevel", 2);
+let A = r;
+A.ensureDefined();
+export {
+  B as RadioButton,
+  A as RadioButtonGroup
+};
+//# sourceMappingURL=radio-button-group.mjs.map

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

@@ -0,0 +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            this.disabled ? this.disableButtons() : this.enableButtons();\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                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                break;\n            }\n            case \"Up\":\n            case \"ArrowUp\": {\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                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 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","newIndex","index","oldValue","previousButton","currentButton","changedProperties","ifDefined","value","i","previousChecked","currentChecked","newValue","previousFocused","currentFocused","_b","ValidationLevel","RadioButtonGroup"],"mappings":"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"}

package/dist/radio-button.d.ts

@@ -0,0 +1,19 @@
+import { LitElement, TemplateResult } from "lit";
+declare global {
+    interface HTMLElementTagNameMap {
+        [RadioButton.ID]: RadioButton;
+    }
+}
+export declare class RadioButton extends LitElement {
+    static readonly ID = "sd-radio-button";
+    static ensureDefined: () => void;
+    checked: boolean;
+    value: string;
+    disabled: boolean;
+    label: string;
+    private a11yID;
+    constructor();
+    static get styles(): import("lit").CSSResult[];
+    render(): TemplateResult;
+    private handleClick;
+}

package/dist/types.d.ts

@@ -0,0 +1,5 @@
+export type LayoutType = "horizontal" | "vertical";
+export interface IValueChangeEvent {
+    value: string;
+    selectedIndex: number;
+}

package/npm-third-party-licenses.json

@@ -0,0 +1,192 @@
+{
+    "@cypress/vite-dev-server@5.0.7": {
+        "licenses": "MIT",
+        "repository": "https://github.com/cypress-io/cypress",
+        "licenseUrl": "https://github.com/cypress-io/cypress/tree/develop/npm/vite-dev-server#readme"
+    },
+    "@rollup/plugin-node-resolve@15.2.3": {
+        "licenses": "MIT",
+        "repository": "https://github.com/rollup/plugins",
+        "licenseUrl": "https://github.com/rollup/plugins/raw/HEAD/LICENSE"
+    },
+    "@types/node@20.10.6": {
+        "licenses": "MIT",
+        "repository": "https://github.com/DefinitelyTyped/DefinitelyTyped",
+        "licenseUrl": "https://github.com/DefinitelyTyped/DefinitelyTyped/raw/HEAD/LICENSE"
+    },
+    "@types/postcss-prefix-selector@1.16.3": {
+        "licenses": "MIT",
+        "repository": "https://github.com/DefinitelyTyped/DefinitelyTyped",
+        "licenseUrl": "https://github.com/DefinitelyTyped/DefinitelyTyped/raw/HEAD/LICENSE"
+    },
+    "@typescript-eslint/eslint-plugin@6.17.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/typescript-eslint/typescript-eslint",
+        "licenseUrl": "https://github.com/typescript-eslint/typescript-eslint/raw/HEAD/LICENSE"
+    },
+    "@typescript-eslint/parser@6.17.0": {
+        "licenses": "BSD-2-Clause",
+        "repository": "https://github.com/typescript-eslint/typescript-eslint",
+        "licenseUrl": "https://github.com/typescript-eslint/typescript-eslint/raw/HEAD/LICENSE"
+    },
+    "@vitest/coverage-v8@1.1.1": {
+        "licenses": "MIT",
+        "repository": "https://github.com/vitest-dev/vitest",
+        "licenseUrl": "https://github.com/vitest-dev/vitest/raw/HEAD/LICENSE"
+    },
+    "@vitest/ui@1.1.1": {
+        "licenses": "MIT",
+        "repository": "https://github.com/vitest-dev/vitest",
+        "licenseUrl": "https://github.com/vitest-dev/vitest/raw/HEAD/LICENSE"
+    },
+    "axe-core@4.8.3": {
+        "licenses": "MPL-2.0",
+        "repository": "https://github.com/dequelabs/axe-core",
+        "licenseUrl": "https://github.com/dequelabs/axe-core/raw/HEAD/LICENSE"
+    },
+    "cypress-axe@1.5.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/component-driven/cypress-axe",
+        "licenseUrl": "https://github.com/component-driven/cypress-axe/raw/HEAD/License.md"
+    },
+    "cypress-real-events@1.13.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/dmtrKovalenko/cypress-real-events",
+        "licenseUrl": "https://github.com/dmtrKovalenko/cypress-real-events"
+    },
+    "cypress@13.6.2": {
+        "licenses": "MIT",
+        "repository": "https://github.com/cypress-io/cypress",
+        "licenseUrl": "https://cypress.io"
+    },
+    "esbuild@0.19.11": {
+        "licenses": "MIT",
+        "repository": "https://github.com/evanw/esbuild",
+        "licenseUrl": "https://github.com/evanw/esbuild/raw/HEAD/LICENSE.md"
+    },
+    "eslint-config-google@0.14.0": {
+        "licenses": "Apache-2.0",
+        "repository": "https://github.com/google/eslint-config-google",
+        "licenseUrl": "https://github.com/google/eslint-config-google/raw/HEAD/LICENSE"
+    },
+    "eslint-config-prettier@9.1.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/prettier/eslint-config-prettier",
+        "licenseUrl": "https://github.com/prettier/eslint-config-prettier/raw/HEAD/LICENSE"
+    },
+    "eslint@8.56.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/eslint/eslint",
+        "licenseUrl": "https://github.com/eslint/eslint/raw/HEAD/LICENSE"
+    },
+    "github-markdown-css@5.5.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/sindresorhus/github-markdown-css",
+        "licenseUrl": "https://github.com/sindresorhus/github-markdown-css/raw/HEAD/license"
+    },
+    "highlight.js@11.9.0": {
+        "licenses": "BSD-3-Clause",
+        "repository": "https://github.com/highlightjs/highlight.js",
+        "licenseUrl": "https://github.com/highlightjs/highlight.js/raw/HEAD/LICENSE"
+    },
+    "junit-report-builder@3.1.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/davidparsson/junit-report-builder",
+        "licenseUrl": "https://github.com/davidparsson/junit-report-builder/raw/HEAD/LICENSE"
+    },
+    "lint-staged@15.2.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/okonet/lint-staged",
+        "licenseUrl": "https://github.com/okonet/lint-staged/raw/HEAD/LICENSE"
+    },
+    "lit@2.8.0": {
+        "licenses": "BSD-3-Clause",
+        "repository": "https://github.com/lit/lit",
+        "licenseUrl": "https://github.com/lit/lit/raw/HEAD/LICENSE"
+    },
+    "marked@11.1.1": {
+        "licenses": "MIT",
+        "repository": "https://github.com/markedjs/marked",
+        "licenseUrl": "https://github.com/markedjs/marked/raw/HEAD/LICENSE.md"
+    },
+    "postcss-prefix-selector@1.16.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/RadValentin/postcss-prefix-selector",
+        "licenseUrl": "https://github.com/RadValentin/postcss-prefix-selector/raw/HEAD/LICENSE"
+    },
+    "postcss@8.4.32": {
+        "licenses": "MIT",
+        "repository": "https://github.com/postcss/postcss",
+        "licenseUrl": "https://github.com/postcss/postcss/raw/HEAD/LICENSE"
+    },
+    "prettier@3.1.1": {
+        "licenses": "MIT",
+        "repository": "https://github.com/prettier/prettier",
+        "licenseUrl": "https://github.com/prettier/prettier/raw/HEAD/LICENSE"
+    },
+    "resolve-pkg@2.0.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/sindresorhus/resolve-pkg",
+        "licenseUrl": "https://github.com/sindresorhus/resolve-pkg/raw/HEAD/license"
+    },
+    "sass@1.69.6": {
+        "licenses": "MIT",
+        "repository": "https://github.com/sass/dart-sass",
+        "licenseUrl": "https://github.com/sass/dart-sass/raw/HEAD/LICENSE"
+    },
+    "stylelint-config-recommended-scss@14.0.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/stylelint-scss/stylelint-config-recommended-scss",
+        "licenseUrl": "https://github.com/stylelint-scss/stylelint-config-recommended-scss/raw/HEAD/LICENSE"
+    },
+    "stylelint-config-standard@36.0.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/stylelint/stylelint-config-standard",
+        "licenseUrl": "https://github.com/stylelint/stylelint-config-standard/raw/HEAD/LICENSE"
+    },
+    "stylelint-scss@6.0.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/stylelint-scss/stylelint-scss",
+        "licenseUrl": "https://github.com/stylelint-scss/stylelint-scss/raw/HEAD/LICENSE"
+    },
+    "stylelint@16.1.0": {
+        "licenses": "MIT",
+        "repository": "https://github.com/stylelint/stylelint",
+        "licenseUrl": "https://github.com/stylelint/stylelint/raw/HEAD/LICENSE"
+    },
+    "tsup@8.0.1": {
+        "licenses": "MIT",
+        "repository": "https://github.com/egoist/tsup",
+        "licenseUrl": "https://github.com/egoist/tsup/raw/HEAD/LICENSE"
+    },
+    "turbo@1.11.2": {
+        "licenses": "MPL-2.0",
+        "repository": "https://github.com/vercel/turbo",
+        "licenseUrl": "https://github.com/vercel/turbo/raw/HEAD/LICENSE"
+    },
+    "typescript@5.3.3": {
+        "licenses": "Apache-2.0",
+        "repository": "https://github.com/Microsoft/TypeScript",
+        "licenseUrl": "https://github.com/Microsoft/TypeScript/raw/HEAD/LICENSE.txt"
+    },
+    "vite-tsconfig-paths@4.2.3": {
+        "licenses": "MIT",
+        "repository": "https://github.com/aleclarson/vite-tsconfig-paths",
+        "licenseUrl": "https://github.com/aleclarson/vite-tsconfig-paths/raw/HEAD/LICENSE"
+    },
+    "vite@5.0.10": {
+        "licenses": "MIT",
+        "repository": "https://github.com/vitejs/vite",
+        "licenseUrl": "https://github.com/vitejs/vite/raw/HEAD/LICENSE.md"
+    },
+    "vitest@1.1.1": {
+        "licenses": "MIT",
+        "repository": "https://github.com/vitest-dev/vitest",
+        "licenseUrl": "https://github.com/vitest-dev/vitest/raw/HEAD/LICENSE.md"
+    },
+    "yargs@17.7.2": {
+        "licenses": "MIT",
+        "repository": "https://github.com/yargs/yargs",
+        "licenseUrl": "https://github.com/yargs/yargs/raw/HEAD/LICENSE"
+    }
+}

package/package.json

@@ -0,0 +1,38 @@
+{
+  "name": "@cas-smartdesign/radio-button-group",
+  "version": "4.0.1",
+  "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": "^2.8.0",
+    "@cas-smartdesign/field-validation-message": "^5.0.1",
+    "@cas-smartdesign/styles": "^3.6.1"
+  },
+  "files": [
+    "dist",
+    "npm-third-party-licenses.json"
+  ],
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/",
+    "access": "public"
+  },
+  "devDependencies": {
+    "@cas-smartdesign/button": "^5.0.1",
+    "@cas-smartdesign/element-preview": "^0.2.1",
+    "@cas-smartdesign/license-generator": "^1.6.1"
+  },
+  "scripts": {
+    "version": "pnpm version",
+    "generate-declaration": "tsc -p tsconfig.types.json",
+    "build:no-license": "vite build && pnpm generate-declaration && vite build --mode documentation",
+    "build": "pnpm generate-license && pnpm build:no-license",
+    "watch": "vite build --watch",
+    "dev": "vite",
+    "generate-license": "sd-license-generator --r ../../",
+    "test:component": "pnpm cypress run --component --quiet --browser chrome",
+    "cypress:open": "pnpm cypress open --component"
+  }
+}