kr-elements 0.0.1-alpha.27 → 0.0.1-alpha.28

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,38 @@ 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
- const tag = userTagTemplate.cloneNode(true);
122
+ tag = userTagTemplate.cloneNode(true);
120
123
  tag.querySelectorAll('[part]')
121
124
  .forEach(node => {
122
- const relatedPart = option.querySelector(`[part*="${node.getAttribute('part')}"]`);
123
- if (relatedPart) {
124
- tag.replaceChild(relatedPart.cloneNode(true), node);
125
+ for (const token of node.part.values()) {
126
+ const relatedPart = option.querySelector(`[part*="${token}"]`);
127
+ if (relatedPart) {
128
+ tag.replaceChild(relatedPart.cloneNode(true), node);
129
+ break;
130
+ }
125
131
  }
126
132
  });
127
- const clearButton = tag.querySelector('[part*="tag-clear-button"]');
128
- if (!clearButton && this.#shadowRoot.host.hasAttribute('multiple')) {
133
+ button = tag.querySelector('[part*="tag-clear-button"]');
134
+ if (!button && this.#shadowRoot.host.hasAttribute('multiple')) {
129
135
  throw new Error(`A button with part "tag-clear-button"`);
130
136
  }
131
- clearButton.setAttribute('value', option.value);
132
- this.tagsContainer.appendChild(tag);
133
- return clearButton;
134
137
  }
135
- const template = this.tagTemplate;
136
- const tag = template.cloneNode(true);
137
- const label = tag.querySelector('[part="tag-label"]');
138
- label.textContent = option.label;
139
- const clearButton = tag.querySelector('[part="tag-clear-button"]');
140
- clearButton.setAttribute('value', option.value);
141
- tag.setAttribute('value', option.value);
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);
142
147
  this.tagsContainer.appendChild(tag);
143
- return clearButton;
148
+ return button;
144
149
  }
145
150
  getTagByValue(value) {
146
151
  return this.tagsContainer.querySelector(`box-tag[value="${value}"]`);
@@ -111,33 +111,38 @@ 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
- const tag = userTagTemplate.cloneNode(true);
119
+ tag = userTagTemplate.cloneNode(true);
117
120
  tag.querySelectorAll('[part]')
118
121
  .forEach(node => {
119
- const relatedPart = option.querySelector(`[part*="${node.getAttribute('part')}"]`);
120
- if (relatedPart) {
121
- tag.replaceChild(relatedPart.cloneNode(true), node);
122
+ for (const token of node.part.values()) {
123
+ const relatedPart = option.querySelector(`[part*="${token}"]`);
124
+ if (relatedPart) {
125
+ tag.replaceChild(relatedPart.cloneNode(true), node);
126
+ break;
127
+ }
122
128
  }
123
129
  });
124
- const clearButton = tag.querySelector('[part*="tag-clear-button"]');
125
- if (!clearButton && this.#shadowRoot.host.hasAttribute('multiple')) {
130
+ button = tag.querySelector('[part*="tag-clear-button"]');
131
+ if (!button && this.#shadowRoot.host.hasAttribute('multiple')) {
126
132
  throw new Error(`A button with part "tag-clear-button"`);
127
133
  }
128
- clearButton.setAttribute('value', option.value);
129
- this.tagsContainer.appendChild(tag);
130
- return clearButton;
131
134
  }
132
- const template = this.tagTemplate;
133
- const tag = template.cloneNode(true);
134
- const label = tag.querySelector('[part="tag-label"]');
135
- label.textContent = option.label;
136
- const clearButton = tag.querySelector('[part="tag-clear-button"]');
137
- clearButton.setAttribute('value', option.value);
138
- tag.setAttribute('value', option.value);
135
+ else {
136
+ const template = this.tagTemplate;
137
+ tag = template.cloneNode(true);
138
+ const label = tag.querySelector('[part="tag-label"]');
139
+ label.textContent = option.label;
140
+ button = tag.querySelector('[part="tag-clear-button"]');
141
+ }
142
+ button.setAttribute('value', value);
143
+ tag.setAttribute('value', value);
139
144
  this.tagsContainer.appendChild(tag);
140
- return clearButton;
145
+ return button;
141
146
  }
142
147
  getTagByValue(value) {
143
148
  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;IA8BpD,aAAa,CAAC,KAAK,EAAE,MAAM;IAI3B,gBAAgB,CAAC,KAAK,EAAE,MAAM;IAI9B,IAAI,eAAe,0CAGlB;IAED,MAAM,KAAK,QAAQ,WAqLlB;CACF"}
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;IAoCpD,aAAa,CAAC,KAAK,EAAE,MAAM;IAI3B,gBAAgB,CAAC,KAAK,EAAE,MAAM;IAI9B,IAAI,eAAe,0CAGlB;IAED,MAAM,KAAK,QAAQ,WAqLlB;CACF"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "kr-elements",
3
- "version": "0.0.1-alpha.27",
3
+ "version": "0.0.1-alpha.28",
4
4
  "description": "Custom elements",
5
5
  "type": "module",
6
6
  "scripts": {