@sbb-esta/lyne-elements-dev 5.4.2-dev.1786575507 → 5.4.2-dev.1786604750
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/custom-elements.json
CHANGED
|
@@ -28746,6 +28746,15 @@
|
|
|
28746
28746
|
"description": "Whether the radios can be deselected.",
|
|
28747
28747
|
"attribute": "allow-empty-selection"
|
|
28748
28748
|
},
|
|
28749
|
+
{
|
|
28750
|
+
"kind": "field",
|
|
28751
|
+
"name": "compareWith",
|
|
28752
|
+
"type": {
|
|
28753
|
+
"text": "(v1: T | null, v2: T | null) => boolean"
|
|
28754
|
+
},
|
|
28755
|
+
"privacy": "public",
|
|
28756
|
+
"description": "Function used to compare values."
|
|
28757
|
+
},
|
|
28749
28758
|
{
|
|
28750
28759
|
"kind": "field",
|
|
28751
28760
|
"name": "value",
|
|
@@ -23,6 +23,8 @@ export declare class SbbRadioButtonGroupElement<T = string> extends SbbSelection
|
|
|
23
23
|
* Whether the radios can be deselected.
|
|
24
24
|
*/
|
|
25
25
|
accessor allowEmptySelection: boolean;
|
|
26
|
+
/** Function used to compare values. */
|
|
27
|
+
accessor compareWith: (v1: T | null, v2: T | null) => boolean;
|
|
26
28
|
/**
|
|
27
29
|
* The value of the radio group.
|
|
28
30
|
*/
|
|
@@ -17,6 +17,9 @@ let SbbRadioButtonGroupElement = (() => {
|
|
|
17
17
|
let _allowEmptySelection_decorators;
|
|
18
18
|
let _allowEmptySelection_initializers = [];
|
|
19
19
|
let _allowEmptySelection_extraInitializers = [];
|
|
20
|
+
let _compareWith_decorators;
|
|
21
|
+
let _compareWith_initializers = [];
|
|
22
|
+
let _compareWith_extraInitializers = [];
|
|
20
23
|
let _set_value_decorators;
|
|
21
24
|
let _name_decorators;
|
|
22
25
|
let _name_initializers = [];
|
|
@@ -28,6 +31,7 @@ let SbbRadioButtonGroupElement = (() => {
|
|
|
28
31
|
attribute: "allow-empty-selection",
|
|
29
32
|
type: Boolean
|
|
30
33
|
})];
|
|
34
|
+
_compareWith_decorators = [property({ attribute: false })];
|
|
31
35
|
_set_value_decorators = [property()];
|
|
32
36
|
_name_decorators = [forceType(), property()];
|
|
33
37
|
__esDecorate(this, null, _allowEmptySelection_decorators, {
|
|
@@ -44,6 +48,20 @@ let SbbRadioButtonGroupElement = (() => {
|
|
|
44
48
|
},
|
|
45
49
|
metadata: _metadata
|
|
46
50
|
}, _allowEmptySelection_initializers, _allowEmptySelection_extraInitializers);
|
|
51
|
+
__esDecorate(this, null, _compareWith_decorators, {
|
|
52
|
+
kind: "accessor",
|
|
53
|
+
name: "compareWith",
|
|
54
|
+
static: false,
|
|
55
|
+
private: false,
|
|
56
|
+
access: {
|
|
57
|
+
has: (obj) => "compareWith" in obj,
|
|
58
|
+
get: (obj) => obj.compareWith,
|
|
59
|
+
set: (obj, value) => {
|
|
60
|
+
obj.compareWith = value;
|
|
61
|
+
}
|
|
62
|
+
},
|
|
63
|
+
metadata: _metadata
|
|
64
|
+
}, _compareWith_initializers, _compareWith_extraInitializers);
|
|
47
65
|
__esDecorate(this, null, _set_value_decorators, {
|
|
48
66
|
kind: "setter",
|
|
49
67
|
name: "value",
|
|
@@ -101,18 +119,22 @@ let SbbRadioButtonGroupElement = (() => {
|
|
|
101
119
|
set allowEmptySelection(value) {
|
|
102
120
|
this.#allowEmptySelection_accessor_storage = value;
|
|
103
121
|
}
|
|
122
|
+
#compareWith_accessor_storage;
|
|
123
|
+
/** Function used to compare values. */
|
|
124
|
+
get compareWith() {
|
|
125
|
+
return this.#compareWith_accessor_storage;
|
|
126
|
+
}
|
|
127
|
+
set compareWith(value) {
|
|
128
|
+
this.#compareWith_accessor_storage = value;
|
|
129
|
+
}
|
|
104
130
|
/**
|
|
105
131
|
* The value of the radio group.
|
|
106
132
|
*/
|
|
107
133
|
set value(val) {
|
|
108
134
|
this._fallbackValue = val;
|
|
109
135
|
if (!this.hasUpdated) return;
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
return;
|
|
113
|
-
}
|
|
114
|
-
const toCheck = this.selectionElements.find((r) => r.value === val);
|
|
115
|
-
if (toCheck) toCheck.checked = true;
|
|
136
|
+
const toCheck = val == null ? null : this.selectionElements.find((r) => this.compareWith(r.value, val));
|
|
137
|
+
this.selectionElements.forEach((r) => r.checked = r === toCheck);
|
|
116
138
|
}
|
|
117
139
|
get value() {
|
|
118
140
|
return this.selectionElements.find((r) => r.checked && !r.disabled)?.value ?? this._fallbackValue;
|
|
@@ -134,10 +156,11 @@ let SbbRadioButtonGroupElement = (() => {
|
|
|
134
156
|
this.selectionElementSelectors = (__runInitializers(this, _instanceExtraInitializers), "sbb-radio-button, sbb-radio-button-panel");
|
|
135
157
|
this.panelElementSelector = "sbb-radio-button-panel";
|
|
136
158
|
this.#allowEmptySelection_accessor_storage = __runInitializers(this, _allowEmptySelection_initializers, false);
|
|
159
|
+
this.#compareWith_accessor_storage = (__runInitializers(this, _allowEmptySelection_extraInitializers), __runInitializers(this, _compareWith_initializers, (v1, v2) => v1 === v2));
|
|
137
160
|
/**
|
|
138
161
|
* Used to preserve the `value` in case the radios are not yet 'loaded'
|
|
139
162
|
*/
|
|
140
|
-
this._fallbackValue = (__runInitializers(this,
|
|
163
|
+
this._fallbackValue = (__runInitializers(this, _compareWith_extraInitializers), null);
|
|
141
164
|
this.#name_accessor_storage = __runInitializers(this, _name_initializers, `sbb-radio-button-group-${++nextId}`);
|
|
142
165
|
__runInitializers(this, _name_extraInitializers);
|
|
143
166
|
this.addEventListener?.("change", (e) => this._onRadioChange(e));
|
package/package.json
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sbb-esta/lyne-elements-dev",
|
|
3
|
-
"version": "5.4.2-dev.
|
|
3
|
+
"version": "5.4.2-dev.1786604750",
|
|
4
4
|
"description": "Lyne Design System",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"design system",
|
|
7
7
|
"web components",
|
|
8
8
|
"lit",
|
|
9
|
-
"https://github.com/sbb-design-systems/lyne-components/commit/
|
|
9
|
+
"https://github.com/sbb-design-systems/lyne-components/commit/976ff9812d5fc177022342e73a2ca75748d049e7"
|
|
10
10
|
],
|
|
11
11
|
"type": "module",
|
|
12
12
|
"exports": {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{__esDecorate as e,__runInitializers as t}from"tslib";import{property as n}from"lit/decorators.js";import{SbbSelectionGroupBaseElement as r,forceType as i}from"./core.js";let a=0,o=(()=>{let o=r,s=[],c,l=[],u=[],d,f,p=[],m=[];return class extends o{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(o[Symbol.metadata]??null):void 0;c=[i(),n({attribute:`allow-empty-selection`,type:Boolean})],d=[n()],
|
|
1
|
+
import{__esDecorate as e,__runInitializers as t}from"tslib";import{property as n}from"lit/decorators.js";import{SbbSelectionGroupBaseElement as r,forceType as i}from"./core.js";let a=0,o=(()=>{let o=r,s=[],c,l=[],u=[],d,f=[],p=[],m,h,g=[],_=[];return class extends o{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(o[Symbol.metadata]??null):void 0;c=[i(),n({attribute:`allow-empty-selection`,type:Boolean})],d=[n({attribute:!1})],m=[n()],h=[i(),n()],e(this,null,c,{kind:`accessor`,name:`allowEmptySelection`,static:!1,private:!1,access:{has:e=>`allowEmptySelection`in e,get:e=>e.allowEmptySelection,set:(e,t)=>{e.allowEmptySelection=t}},metadata:t},l,u),e(this,null,d,{kind:`accessor`,name:`compareWith`,static:!1,private:!1,access:{has:e=>`compareWith`in e,get:e=>e.compareWith,set:(e,t)=>{e.compareWith=t}},metadata:t},f,p),e(this,null,m,{kind:`setter`,name:`value`,static:!1,private:!1,access:{has:e=>`value`in e,set:(e,t)=>{e.value=t}},metadata:t},null,s),e(this,null,h,{kind:`accessor`,name:`name`,static:!1,private:!1,access:{has:e=>`name`in e,get:e=>e.name,set:(e,t)=>{e.name=t}},metadata:t},g,_),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-radio-button-group`}static{this.role=`radiogroup`}static{this.events={didChange:`didChange`,change:`change`,input:`input`}}#e;get allowEmptySelection(){return this.#e}set allowEmptySelection(e){this.#e=e}#t;get compareWith(){return this.#t}set compareWith(e){this.#t=e}set value(e){if(this._fallbackValue=e,!this.hasUpdated)return;let t=e==null?null:this.selectionElements.find(t=>this.compareWith(t.value,e));this.selectionElements.forEach(e=>e.checked=e===t)}get value(){return this.selectionElements.find(e=>e.checked&&!e.disabled)?.value??this._fallbackValue}#n;get name(){return this.#n}set name(e){this.#n=e}get radioButtons(){return this.selectionElements}constructor(){super(),this.selectionElementSelectors=(t(this,s),`sbb-radio-button, sbb-radio-button-panel`),this.panelElementSelector=`sbb-radio-button-panel`,this.#e=t(this,l,!1),this.#t=(t(this,u),t(this,f,(e,t)=>e===t)),this._fallbackValue=(t(this,p),null),this.#n=t(this,g,`sbb-radio-button-group-${++a}`),t(this,_),this.addEventListener?.(`change`,e=>this._onRadioChange(e)),this.addEventListener?.(`ɵradiobuttonvaluechange`,()=>this._updateRadioState())}willUpdate(e){super.willUpdate(e),e.has(`name`)&&this._updateRadiosName()}firstUpdated(e){super.firstUpdated(e),this.updateComplete.then(()=>this._updateRadioState())}_onRadioChange(e){let t=e.target;t.localName!==`sbb-radio-button`&&t.localName!==`sbb-radio-button-panel`||t.group!==this||(this._fallbackValue=null,this.dispatchEvent(new Event(`didChange`,{bubbles:!0})))}_updateRadiosName(){this.selectionElements.forEach(e=>e.name=this.name)}_updateRadioState(){this._fallbackValue!=null&&(this.value=this.value)}onSlotChange(){super.onSlotChange(),this._updateRadiosName(),this._updateRadioState()}}})();export{o as SbbRadioButtonGroupElement};
|