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

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

@@ -1,5 +1,5 @@
-import { LitElement, TemplateResult, PropertyValues } from "lit";
 import { ValidationLevel } from "@cas-smartdesign/field-validation-message";
+import { LitElement, type TemplateResult, type PropertyValues } from "lit";
 import type { LayoutType, IValueChangeEvent } from "./types";
 export { RadioButton } from "./radio-button";
 export type * from "./types";
@@ -7,27 +7,20 @@ 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;
+    interface HTMLElementEventMap {
+        "sd-radio-button-group-value-change": CustomEvent<IValueChangeEvent>;
+    }
 }
 export declare class RadioButtonGroup extends LitElement {
     static readonly ID = "sd-radio-button-group";
     static ensureDefined: () => void;
     layout: LayoutType;
-    value: string;
+    value: string | undefined;
     uncheckAllowed: boolean;
     disabled: boolean;
-    validationMessage: string;
-    validationIconSrc: string;
-    validationLevel: ValidationLevel;
+    validationMessage: string | undefined;
+    validationIconSrc: string | undefined;
+    validationLevel: ValidationLevel | undefined;
     private _buttonsSlot;
     private _buttons;
     private _focusIndex;
@@ -61,3 +54,4 @@ export declare class RadioButtonGroup extends LitElement {
     private get buttonsSlot();
     private get selectedIndex();
 }
+//# sourceMappingURL=radio-button-group.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"radio-button-group.d.ts","sourceRoot":"","sources":["../radio-button-group.ts"],"names":[],"mappings":"AAAA,OAAiC,EAAE,eAAe,EAAE,MAAM,2CAA2C,CAAC;AACtG,OAAO,EACH,UAAU,EACV,KAAK,cAAc,EAEnB,KAAK,cAAc,EAItB,MAAM,KAAK,CAAC;AAIb,OAAO,KAAK,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAI7D,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC7C,mBAAmB,SAAS,CAAC;AAI7B,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,CAAC,gBAAgB,CAAC,EAAE,CAAC,EAAE,gBAAgB,CAAC;KAC3C;IACD,UAAU,mBAAmB;QACzB,oCAAoC,EAAE,WAAW,CAAC,iBAAiB,CAAC,CAAC;KACxE;CACJ;AAED,qBAAa,gBAAiB,SAAQ,UAAU;IAC5C,gBAAuB,EAAE,2BAA2B;IACpD,OAAc,aAAa,QAAO,IAAI,CAKpC;IAEK,MAAM,EAAE,UAAU,CAAgB;IAElC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAM;IAE/B,cAAc,UAAS;IAEvB,QAAQ,UAAS;IAEjB,iBAAiB,EAAE,MAAM,GAAG,SAAS,CAAC;IAEtC,iBAAiB,EAAE,MAAM,GAAG,SAAS,CAAC;IAYtC,eAAe,EAAE,eAAe,GAAG,SAAS,CAAC;IAEpD,OAAO,CAAC,YAAY,CAA8B;IAClD,OAAO,CAAC,QAAQ,CAAqB;IACrC,OAAO,CAAC,WAAW,CAAM;IACzB,OAAO,CAAC,cAAc,CAAsC;IAE5D,IAAW,UAAU,IAAI,MAAM,CAE9B;IAED,IAAW,UAAU,CAAC,KAAK,EAAE,MAAM,EAUlC;cAEkB,YAAY,CAAC,iBAAiB,EAAE,cAAc,GAAG,IAAI;cAQrD,OAAO,CAAC,iBAAiB,EAAE,cAAc,GAAG,IAAI;IAWnE,WAAoB,MAAM,8BAMzB;IACe,MAAM,IAAI,cAAc;IAqBxC,OAAO,CAAC,gBAAgB,CAWtB;IAEF,OAAO,CAAC,mBAAmB;IAU3B,OAAO,CAAC,aAAa,CAKnB;IAEF,OAAO,CAAC,cAAc,CAEpB;IAEF,OAAO,CAAC,cAAc;IAMtB,OAAO,CAAC,aAAa;IAMrB,OAAO,CAAC,iBAAiB,CASvB;IAEF,OAAO,CAAC,oBAAoB;IAW5B,OAAO,CAAC,aAAa,CA6BnB;IAEF,OAAO,CAAC,SAAS;IAQjB,OAAO,CAAC,aAAa;IAQrB,OAAO,CAAC,iBAAiB;IAWzB,OAAO,CAAC,qBAAqB;IAW7B,OAAO,CAAC,WAAW;IAInB,OAAO,CAAC,aAAa;IAYrB,OAAO,CAAC,YAAY;IAcpB,OAAO,CAAC,WAAW;IAKnB,OAAO,CAAC,aAAa;IAKrB,OAAO,CAAC,WAAW;IAInB,OAAO,CAAC,aAAa;IAIrB,OAAO,KAAK,WAAW,GAKtB;IAED,OAAO,KAAK,aAAa,GAKxB;CACJ"}

package/dist/radio-button-group.mjs

@@ -1,30 +1,45 @@
-import { LitElement as b, unsafeCSS as v, css as g, html as p } from "lit";
-import { property as r } from "lit/decorators/property.js";
-import { ifDefined as k } from "lit/directives/if-defined.js";
-import { ValidationLevel as x } 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}: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}';
-var I = Object.defineProperty, f = (o, t, e, i) => {
-  for (var s = void 0, c = o.length - 1, u; c >= 0; c--)
-    (u = o[c]) && (s = u(t, e, s) || s);
-  return s && I(t, e, s), s;
-};
-let m = 0;
-var n;
-const h = (n = class extends b {
-  constructor() {
-    super(), this.checked = !1, this.value = "", this.disabled = !1, this.label = "", this.handleClick = (t) => {
-      t.preventDefault();
-    }, this.a11yID = n.ID + "_" + m++;
-  }
-  static get styles() {
-    return [
-      g`
-                ${v(y)}
-            `
-    ];
-  }
-  render() {
-    return p`
+import e from "@cas-smartdesign/field-validation-message";
+import { LitElement as t, css as n, html as r, unsafeCSS as i } from "lit";
+import { property as a } from "lit/decorators/property.js";
+import { ifDefined as o } from "lit/directives/if-defined.js";
+//#region scss/button.scss?inline
+var s = ":host{display:block}:host,.label,.checkbox{outline:none}:host([disabled]){pointer-events:none}:host([disabled]) .root{opacity:.6;cursor:default;filter:grayscale()}:host(:not([disabled])[focused]) .highlight,: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:pre;text-overflow:ellipsis;overflow:hidden}.root{vertical-align:middle;width:100%;padding:var(--sd-radio-button-padding,6px 0px);align-items:center;display:inline-flex}.root .radio-button-container{box-sizing:border-box;cursor:pointer;flex-shrink:0;width:28px;height:28px;margin-right:5px;display:inline-block;position:relative}.root .radio-button-container input{opacity:0;position:absolute;top:0;left:0}.root .radio-button-container circle.highlight{stroke:var(--sd-radio-button-highlight-color,#1467ba4d)}.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;-webkit-user-select:none;user-select:none;cursor:pointer;padding-top:2px;padding-bottom:2px;overflow-x:hidden}";
+//#endregion
+//#region \0@oxc-project+runtime@0.122.0/helpers/decorateMetadata.js
+function c(e, t) {
+	if (typeof Reflect == "object" && typeof Reflect.metadata == "function") return Reflect.metadata(e, t);
+}
+//#endregion
+//#region \0@oxc-project+runtime@0.122.0/helpers/decorate.js
+function l(e, t, n, r) {
+	var i = arguments.length, a = i < 3 ? t : r === null ? r = Object.getOwnPropertyDescriptor(t, n) : r, o;
+	if (typeof Reflect == "object" && typeof Reflect.decorate == "function") a = Reflect.decorate(e, t, n, r);
+	else for (var s = e.length - 1; s >= 0; s--) (o = e[s]) && (a = (i < 3 ? o(a) : i > 3 ? o(t, n, a) : o(t, n)) || a);
+	return i > 3 && a && Object.defineProperty(t, n, a), a;
+}
+//#endregion
+//#region radio-button.ts
+var u = 0, d = class e extends t {
+	static {
+		this.ID = "sd-radio-button";
+	}
+	static {
+		this.ensureDefined = () => {
+			customElements.get(e.ID) || customElements.define(e.ID, e);
+		};
+	}
+	constructor() {
+		super(), this.checked = !1, this.value = "", this.disabled = !1, this.label = "", this.handleClick = (e) => {
+			e.preventDefault();
+		}, this.a11yID = e.ID + "_" + u++;
+	}
+	static get styles() {
+		return [n`
+                ${i(s)}
+            `];
+	}
+	render() {
+		return r`
             <div class="root">
                 <div class="radio-button-container">
                     <input
@@ -50,105 +65,105 @@ const h = (n = class extends b {
                 <label class="label" for="${this.a11yID}" @click="${this.handleClick}">${this.label}</label>
             </div>
         `;
-  }
-}, n.ID = "sd-radio-button", n.ensureDefined = () => {
-  customElements.get(n.ID) || customElements.define(n.ID, n);
-}, n);
-f([
-  r({ type: Boolean, reflect: !0, attribute: !0 })
-], h.prototype, "checked");
-f([
-  r({ type: String, reflect: !0, attribute: !0 })
-], h.prototype, "value");
-f([
-  r({ type: Boolean, reflect: !0, attribute: !0 })
-], h.prototype, "disabled");
-f([
-  r({ type: String, reflect: !0, attribute: !0 })
-], h.prototype, "label");
-let w = h;
-const B = ":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}";
-var C = Object.defineProperty, d = (o, t, e, i) => {
-  for (var s = void 0, c = o.length - 1, u; c >= 0; c--)
-    (u = o[c]) && (s = u(t, e, s) || s);
-  return s && C(t, e, s), s;
-}, a;
-const l = (a = 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, i = this._buttons.findIndex((s) => s == e);
-      this.focusIndex = this.focusIndex >= 0 ? this.focusIndex : this.getNextFocusIndex(i !== -1 ? i : 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((s) => s.contains(t.target)), i = this._buttons.findIndex((s) => s == e);
-      i >= 0 && (this.focusIndex = i, this.updateChecked());
-    }, this.handleKeyDown = (t) => {
-      let e = !0;
-      switch (t.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:
-          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 i = this._buttons[e], s = this._buttons[this.focusIndex];
-        this.updateFocused(i, s);
-      }
-    }
-  }
-  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(B)}
-            `
-    ];
-  }
-  render() {
-    return p`
+	}
+};
+l([a({
+	type: Boolean,
+	reflect: !0,
+	attribute: !0
+}), c("design:type", Object)], d.prototype, "checked", void 0), l([a({
+	type: String,
+	reflect: !0,
+	attribute: !0
+}), c("design:type", Object)], d.prototype, "value", void 0), l([a({
+	type: Boolean,
+	reflect: !0,
+	attribute: !0
+}), c("design:type", Object)], d.prototype, "disabled", void 0), l([a({
+	type: String,
+	reflect: !0,
+	attribute: !0
+}), c("design:type", Object)], d.prototype, "label", void 0);
+//#endregion
+//#region scss/group.scss?inline
+var f = ":host(:focus){outline:none}.buttons-container{gap:var(--sd-radio-button-group-gap,0);display:flex}.buttons-container.vertical{flex-direction:column}.validation-message{margin-left:5px}", p = class e extends t {
+	constructor(...e) {
+		super(...e), this.layout = "horizontal", this.value = "", this.uncheckAllowed = !1, this.disabled = !1, this._buttons = [], this._focusIndex = -1, this._checkedButton = void 0, 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, n = this._buttons.findIndex((e) => e == t);
+			this.focusIndex = this.focusIndex >= 0 ? this.focusIndex : this.getNextFocusIndex(n === -1 ? 0 : n), this.updateFocused(void 0, this._buttons[this.focusIndex]);
+		}, this.handleFocusOut = () => {
+			this.updateFocused(this._buttons[this.focusIndex]);
+		}, this.handleButtonClick = (e) => {
+			this.focus();
+			let t = this._buttons.find((t) => t.contains(e.target)), n = this._buttons.findIndex((e) => e == t);
+			n >= 0 && (this.focusIndex = n, 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());
+		};
+	}
+	static {
+		this.ID = "sd-radio-button-group";
+	}
+	static {
+		this.ensureDefined = () => {
+			d.ensureDefined(), customElements.get(e.ID) || customElements.define(e.ID, e);
+		};
+	}
+	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 e = this._buttons[t], n = this._buttons[this.focusIndex];
+				this.updateFocused(e, n);
+			}
+		}
+	}
+	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 [n`
+                ${i(f)}
+            `];
+	}
+	render() {
+		return r`
             <div
                 class="buttons-container ${this.layout === "vertical" ? "vertical" : "horizontal"}"
-                @click="${k(this.disabled ? void 0 : this.handleButtonClick)}"
+                @click="${o(this.disabled ? void 0 : this.handleButtonClick)}"
             >
                 <slot></slot>
             </div>
-            ${this.validationMessage && p`
+            ${this.validationMessage && r`
                 <sd-field-validation-message
                     class="validation-message"
                     .message=${this.validationMessage}
@@ -158,126 +173,106 @@ const l = (a = class extends b {
                 </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() {
-    this._buttons?.forEach((t) => {
-      t.setAttribute("disabled", "");
-    });
-  }
-  enableButtons() {
-    this._buttons?.forEach((t) => {
-      t.removeAttribute("disabled");
-    });
-  }
-  fireValueChangeEvent() {
-    this.dispatchEvent(
-      new CustomEvent("value-change", {
-        detail: {
-          value: this.value,
-          selectedIndex: this.selectedIndex
-        }
-      })
-    );
-  }
-  focusNext() {
-    const t = this.getNextFocusIndex(this.focusIndex + 1);
-    this.focusIndex = t !== -1 ? t : this.getNextFocusIndex(0), this.uncheckAllowed || this.updateChecked();
-  }
-  focusPrevious() {
-    const t = this.getPreviousFocusIndex(this.focusIndex - 1);
-    this.focusIndex = t !== -1 ? t : this.getPreviousFocusIndex(this.childElementCount - 1), this.uncheckAllowed || this.updateChecked();
-  }
-  getNextFocusIndex(t) {
-    for (let e = t; e < this.childElementCount; e++) {
-      const i = this._buttons[e];
-      if (this.isFocusable(i))
-        return e;
-    }
-    return -1;
-  }
-  getPreviousFocusIndex(t) {
-    for (let e = t; e >= 0; e--) {
-      const i = this._buttons[e];
-      if (this.isFocusable(i))
-        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) {
-    t?.removeAttribute?.("focused"), e?.setAttribute?.("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);
-  }
-}, a.ID = "sd-radio-button-group", a.ensureDefined = () => {
-  w.ensureDefined(), customElements.get(a.ID) || customElements.define(a.ID, a);
-}, a);
-d([
-  r({ type: String, reflect: !0, attribute: !0 })
-], l.prototype, "layout");
-d([
-  r({ type: String })
-], l.prototype, "value");
-d([
-  r({ type: Boolean, reflect: !0, attribute: "uncheck-allowed" })
-], l.prototype, "uncheckAllowed");
-d([
-  r({ type: Boolean, reflect: !0, attribute: !0 })
-], l.prototype, "disabled");
-d([
-  r({ type: String })
-], l.prototype, "validationMessage");
-d([
-  r({ type: String })
-], l.prototype, "validationIconSrc");
-d([
-  r({
-    type: {
-      fromAttribute(o) {
-        return o && x[o.toLowerCase()];
-      },
-      toAttribute(o) {
-        return o && o.toLowerCase();
-      }
-    },
-    reflect: !0
-  })
-], l.prototype, "validationLevel");
-let _ = l;
-_.ensureDefined();
-export {
-  w as RadioButton,
-  _ as RadioButtonGroup
+	}
+	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("sd-radio-button-group-value-change", { detail: {
+			value: this.value,
+			selectedIndex: this.selectedIndex
+		} }));
+	}
+	focusNext() {
+		let e = this.getNextFocusIndex(this.focusIndex + 1);
+		this.focusIndex = e === -1 ? this.getNextFocusIndex(0) : e, this.uncheckAllowed || this.updateChecked();
+	}
+	focusPrevious() {
+		let e = this.getPreviousFocusIndex(this.focusIndex - 1);
+		this.focusIndex = e === -1 ? this.getPreviousFocusIndex(this.childElementCount - 1) : e, this.uncheckAllowed || this.updateChecked();
+	}
+	getNextFocusIndex(e) {
+		for (let t = e; t < this.childElementCount; t++) {
+			let e = this._buttons[t];
+			if (e != null && this.isFocusable(e)) return t;
+		}
+		return -1;
+	}
+	getPreviousFocusIndex(e) {
+		for (let t = e; t >= 0; t--) {
+			let e = this._buttons[t];
+			if (e != null && this.isFocusable(e)) 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 = void 0, this.updateValue("")) : (this.checkButton(e), this.updateValue(e.getAttribute("value")));
+	}
+	updateValue(e) {
+		this.value = e ?? void 0, 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") ?? void 0), this._buttonsSlot;
+	}
+	get selectedIndex() {
+		return this._buttons == null || this._checkedButton == null ? -1 : this._buttons.indexOf(this._checkedButton);
+	}
 };
-//# sourceMappingURL=radio-button-group.mjs.map
+l([a({
+	type: String,
+	reflect: !0,
+	attribute: !0
+}), c("design:type", Object)], p.prototype, "layout", void 0), l([a({ type: String }), c("design:type", Object)], p.prototype, "value", void 0), l([a({
+	type: Boolean,
+	reflect: !0,
+	attribute: "uncheck-allowed"
+}), c("design:type", Object)], p.prototype, "uncheckAllowed", void 0), l([a({
+	type: Boolean,
+	reflect: !0,
+	attribute: !0
+}), c("design:type", Object)], p.prototype, "disabled", void 0), l([a({ type: String }), c("design:type", Object)], p.prototype, "validationMessage", void 0), l([a({ type: String }), c("design:type", Object)], p.prototype, "validationIconSrc", void 0), l([a({
+	type: {
+		fromAttribute(t) {
+			return e.parseLevel(t);
+		},
+		toAttribute(e) {
+			return e?.toLowerCase();
+		}
+	},
+	reflect: !0
+}), c("design:type", Object)], p.prototype, "validationLevel", void 0), p.ensureDefined();
+//#endregion
+export { d as RadioButton, p as RadioButtonGroup };
+
+//# sourceMappingURL=radio-button-group.mjs.map