kr-elements 0.0.1-alpha.27 → 0.0.1-alpha.29
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.
|
@@ -114,33 +114,41 @@ class ComboboxMarkup {
|
|
|
114
114
|
}
|
|
115
115
|
};
|
|
116
116
|
createAndAppendTag(option) {
|
|
117
|
+
const value = option.value;
|
|
117
118
|
const userTagTemplate = this.#shadowRoot.host.firstElementChild;
|
|
119
|
+
let tag;
|
|
120
|
+
let button;
|
|
118
121
|
if (userTagTemplate && userTagTemplate instanceof HTML_combobox_tag_element_js_1.HTMLComboboxTagElement) {
|
|
119
|
-
|
|
122
|
+
tag = userTagTemplate.cloneNode(true);
|
|
120
123
|
tag.querySelectorAll('[part]')
|
|
121
124
|
.forEach(node => {
|
|
122
|
-
const
|
|
123
|
-
|
|
124
|
-
|
|
125
|
+
const tokens = Array.from(node.part.values());
|
|
126
|
+
for (const token of tokens) {
|
|
127
|
+
const relatedPart = option.querySelector(`[part*="${token}"]`);
|
|
128
|
+
if (relatedPart) {
|
|
129
|
+
const newNode = relatedPart.cloneNode(true);
|
|
130
|
+
newNode.part.add(...tokens);
|
|
131
|
+
tag.replaceChild(newNode, node);
|
|
132
|
+
break;
|
|
133
|
+
}
|
|
125
134
|
}
|
|
126
135
|
});
|
|
127
|
-
|
|
128
|
-
if (!
|
|
136
|
+
button = tag.querySelector('[part*="tag-clear-button"]');
|
|
137
|
+
if (!button && this.#shadowRoot.host.hasAttribute('multiple')) {
|
|
129
138
|
throw new Error(`A button with part "tag-clear-button"`);
|
|
130
139
|
}
|
|
131
|
-
clearButton.setAttribute('value', option.value);
|
|
132
|
-
this.tagsContainer.appendChild(tag);
|
|
133
|
-
return clearButton;
|
|
134
140
|
}
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
141
|
+
else {
|
|
142
|
+
const template = this.tagTemplate;
|
|
143
|
+
tag = template.cloneNode(true);
|
|
144
|
+
const label = tag.querySelector('[part="tag-label"]');
|
|
145
|
+
label.textContent = option.label;
|
|
146
|
+
button = tag.querySelector('[part="tag-clear-button"]');
|
|
147
|
+
}
|
|
148
|
+
button.setAttribute('value', value);
|
|
149
|
+
tag.setAttribute('value', value);
|
|
142
150
|
this.tagsContainer.appendChild(tag);
|
|
143
|
-
return
|
|
151
|
+
return button;
|
|
144
152
|
}
|
|
145
153
|
getTagByValue(value) {
|
|
146
154
|
return this.tagsContainer.querySelector(`box-tag[value="${value}"]`);
|
|
@@ -111,33 +111,41 @@ export class ComboboxMarkup {
|
|
|
111
111
|
}
|
|
112
112
|
};
|
|
113
113
|
createAndAppendTag(option) {
|
|
114
|
+
const value = option.value;
|
|
114
115
|
const userTagTemplate = this.#shadowRoot.host.firstElementChild;
|
|
116
|
+
let tag;
|
|
117
|
+
let button;
|
|
115
118
|
if (userTagTemplate && userTagTemplate instanceof HTMLComboboxTagElement) {
|
|
116
|
-
|
|
119
|
+
tag = userTagTemplate.cloneNode(true);
|
|
117
120
|
tag.querySelectorAll('[part]')
|
|
118
121
|
.forEach(node => {
|
|
119
|
-
const
|
|
120
|
-
|
|
121
|
-
|
|
122
|
+
const tokens = Array.from(node.part.values());
|
|
123
|
+
for (const token of tokens) {
|
|
124
|
+
const relatedPart = option.querySelector(`[part*="${token}"]`);
|
|
125
|
+
if (relatedPart) {
|
|
126
|
+
const newNode = relatedPart.cloneNode(true);
|
|
127
|
+
newNode.part.add(...tokens);
|
|
128
|
+
tag.replaceChild(newNode, node);
|
|
129
|
+
break;
|
|
130
|
+
}
|
|
122
131
|
}
|
|
123
132
|
});
|
|
124
|
-
|
|
125
|
-
if (!
|
|
133
|
+
button = tag.querySelector('[part*="tag-clear-button"]');
|
|
134
|
+
if (!button && this.#shadowRoot.host.hasAttribute('multiple')) {
|
|
126
135
|
throw new Error(`A button with part "tag-clear-button"`);
|
|
127
136
|
}
|
|
128
|
-
clearButton.setAttribute('value', option.value);
|
|
129
|
-
this.tagsContainer.appendChild(tag);
|
|
130
|
-
return clearButton;
|
|
131
137
|
}
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
138
|
+
else {
|
|
139
|
+
const template = this.tagTemplate;
|
|
140
|
+
tag = template.cloneNode(true);
|
|
141
|
+
const label = tag.querySelector('[part="tag-label"]');
|
|
142
|
+
label.textContent = option.label;
|
|
143
|
+
button = tag.querySelector('[part="tag-clear-button"]');
|
|
144
|
+
}
|
|
145
|
+
button.setAttribute('value', value);
|
|
146
|
+
tag.setAttribute('value', value);
|
|
139
147
|
this.tagsContainer.appendChild(tag);
|
|
140
|
-
return
|
|
148
|
+
return button;
|
|
141
149
|
}
|
|
142
150
|
getTagByValue(value) {
|
|
143
151
|
return this.tagsContainer.querySelector(`box-tag[value="${value}"]`);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Combobox.markup.d.ts","sourceRoot":"","sources":["../../../src/combobox/Combobox.markup.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AACxE,OAAO,EAAE,yBAAyB,EAAE,MAAM,mCAAmC,CAAC;AAE9E,qBAAa,cAAc;;IAGzB,aAAa,EAAE,cAAc,GAAG,IAAI,CAAQ;IAC5C,gBAAgB,EAAE,cAAc,GAAG,IAAI,CAAQ;IAC/C,cAAc,EAAE,iBAAiB,GAAG,IAAI,CAAQ;IAChD,QAAQ,EAAE,cAAc,GAAG,IAAI,CAAQ;IACvC,WAAW,EAAE,cAAc,GAAG,IAAI,CAAQ;IAC1C,WAAW,EAAE,gBAAgB,GAAG,IAAI,CAAQ;IAC5C,WAAW,EAAE,sBAAsB,GAAG,IAAI,CAAQ;IAElD,SAAS,UAAS;gBAEN,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,gBAAgB;IAU/D,OAAO;IAiBP,IAAI,CAAC,KAAK,EAAE,MAAM;IAiBlB,UAAU;IASV,YAAY,aAIX;IAED,mBAAmB,CAAC,IAAI,EAAE,OAAO;IAmBjC,YAAY,aAUX;IAED,YAAY,GAAI,OAAO,KAAK,UAU3B;IAED,kBAAkB,CAAC,MAAM,EAAE,yBAAyB;
|
|
1
|
+
{"version":3,"file":"Combobox.markup.d.ts","sourceRoot":"","sources":["../../../src/combobox/Combobox.markup.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,gCAAgC,CAAC;AACxE,OAAO,EAAE,yBAAyB,EAAE,MAAM,mCAAmC,CAAC;AAE9E,qBAAa,cAAc;;IAGzB,aAAa,EAAE,cAAc,GAAG,IAAI,CAAQ;IAC5C,gBAAgB,EAAE,cAAc,GAAG,IAAI,CAAQ;IAC/C,cAAc,EAAE,iBAAiB,GAAG,IAAI,CAAQ;IAChD,QAAQ,EAAE,cAAc,GAAG,IAAI,CAAQ;IACvC,WAAW,EAAE,cAAc,GAAG,IAAI,CAAQ;IAC1C,WAAW,EAAE,gBAAgB,GAAG,IAAI,CAAQ;IAC5C,WAAW,EAAE,sBAAsB,GAAG,IAAI,CAAQ;IAElD,SAAS,UAAS;gBAEN,UAAU,EAAE,UAAU,EAAE,SAAS,EAAE,gBAAgB;IAU/D,OAAO;IAiBP,IAAI,CAAC,KAAK,EAAE,MAAM;IAiBlB,UAAU;IASV,YAAY,aAIX;IAED,mBAAmB,CAAC,IAAI,EAAE,OAAO;IAmBjC,YAAY,aAUX;IAED,YAAY,GAAI,OAAO,KAAK,UAU3B;IAED,kBAAkB,CAAC,MAAM,EAAE,yBAAyB;IAuCpD,aAAa,CAAC,KAAK,EAAE,MAAM;IAI3B,gBAAgB,CAAC,KAAK,EAAE,MAAM;IAI9B,IAAI,eAAe,0CAGlB;IAED,MAAM,KAAK,QAAQ,WAqLlB;CACF"}
|