@getflip/swirl-components 0.240.0 → 0.240.1

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.
@@ -29,13 +29,11 @@ export class SwirlTreeViewItem {
29
29
  this.itemId = undefined;
30
30
  this.label = undefined;
31
31
  this.expanded = false;
32
- this.hasChildren = false;
33
32
  this.level = 0;
34
33
  this.selected = false;
35
34
  }
36
35
  componentWillLoad() {
37
36
  this.updateLevel();
38
- this.hasChildren = Boolean(this.el.querySelector("swirl-tree-view-item"));
39
37
  }
40
38
  async expand() {
41
39
  if (this.expanded || !this.expandable) {
@@ -75,11 +73,12 @@ export class SwirlTreeViewItem {
75
73
  "tree-view-item--active": this.active,
76
74
  "tree-view-item--has-tags": hasTags,
77
75
  });
78
- return (h(Host, { key: 'e2d494173e35da47a1233acdf2d7338ebc995b61', id: this.itemId, role: "none" }, h("li", { key: 'e99bbab64c4b442f81708aace5ea2f13ecaf6247', class: className, role: "none" }, h("a", { key: '6094afda7a656d6a03cebb21d00f4fd63284bf50', "aria-current": this.active ? "page" : undefined, "aria-expanded": !this.hasChildren ? undefined : String(this.expanded), "aria-level": this.level + 1, "aria-owns": this.hasChildren ? `${this.itemId}-children` : undefined, "aria-selected": String(this.selected), class: "tree-view-item__link", href: this.href, onFocus: this.onFocus, style: {
76
+ const hasChildren = Boolean(this.el.querySelector("swirl-tree-view-item"));
77
+ return (h(Host, { key: '6aed3838b85950a041147d3b5e0b7e19f1202d47', id: this.itemId, role: "none" }, h("li", { key: '225c53b2130a8a5e1f85990bf4e8b9c93b024cbe', class: className, role: "none" }, h("a", { key: 'baada86aa5db298bab7ecdf9287dab3a7fdf09ac', "aria-current": this.active ? "page" : undefined, "aria-expanded": !hasChildren ? undefined : String(this.expanded), "aria-level": this.level + 1, "aria-owns": hasChildren ? `${this.itemId}-children` : undefined, "aria-selected": String(this.selected), class: "tree-view-item__link", href: this.href, onFocus: this.onFocus, style: {
79
78
  paddingLeft: `calc(${this.level} * var(--s-space-12) + var(--s-space-${this.expandable ? "4" : "8"}))`,
80
- }, ref: (el) => (this.link = el), role: "treeitem", tabIndex: this.selected ? 0 : -1 }, this.expandable && (h("span", { key: 'a3af25922f659a8908d55f43b1b9a737a0233c01', class: "tree-view-item__toggle-icon" }, this.hasChildren && (h(Fragment, { key: '4f066aa80ad37f2dae9b30f0a3401244d1e09b71' }, this.expanded ? (h("swirl-icon-expand-more", { onClick: this.onClickCollapse, size: 24 })) : (h("swirl-icon-chevron-right", { onClick: this.onClickExpand, size: 24 })))))), Boolean(this.icon) && (h(Fragment, { key: 'f064c126ab2d8224d4b66b9576970f4ccf3d9b07' }, h("span", { key: '4095d3d71de26ff6951557e48f65460b068d9bed', class: "tree-view-item__icon" }, iconIsEmoji ? (this.icon) : (h("swirl-icon", { glyph: this.icon, size: 24, color: this.iconColor }))))), h("span", { key: '6306d52d4829e87ebd17c3f991f763fcad54bd5c', class: "tree-view-item__label" }, this.label), h("span", { key: 'd08e144e7b8d22a9bf1a140a4417498ef4b87d06', class: "tree-view-item__tags" }, h("slot", { key: 'fa7f4d316844400e4a3366a76058a309be59c460', name: "tags" }))), h("ul", { key: 'eb2fdefba066f4d0c27e9f9308a06075307ed1ed', "aria-label": this.label, class: "tree-view-item__children", id: `${this.itemId}-children`, role: "group", style: {
81
- display: !this.expanded || !this.hasChildren ? "none" : undefined,
82
- } }, h("slot", { key: 'd48665a47eeb27ba310f9750627d30e129ba7c58' })))));
79
+ }, ref: (el) => (this.link = el), role: "treeitem", tabIndex: this.selected ? 0 : -1 }, this.expandable && (h("span", { key: '09f7377d4177ed746bb7574125e2fe602261da57', class: "tree-view-item__toggle-icon" }, hasChildren && (h(Fragment, { key: '9e07e333b2106457d32bac104803ab1d140c0b90' }, this.expanded ? (h("swirl-icon-expand-more", { onClick: this.onClickCollapse, size: 24 })) : (h("swirl-icon-chevron-right", { onClick: this.onClickExpand, size: 24 })))))), Boolean(this.icon) && (h(Fragment, { key: 'b1ddc56c30f695715ed78fb65fdf62650d66706c' }, h("span", { key: 'f1e0cb841cc74efe91ee72343102a88991634141', class: "tree-view-item__icon" }, iconIsEmoji ? (this.icon) : (h("swirl-icon", { glyph: this.icon, size: 24, color: this.iconColor }))))), h("span", { key: 'dfe0cd3a6b9fef717e62d9a800b8263cd7e58ad2', class: "tree-view-item__label" }, this.label), h("span", { key: 'ee783bcfbcf26b80de8d395d0636dcf8105e51ed', class: "tree-view-item__tags" }, h("slot", { key: '4abbe92f473c5235611b56474e27435c3f81295e', name: "tags" }))), h("ul", { key: '7388edec8e202eb51b5b086b3da98d9a56437075', "aria-label": this.label, class: "tree-view-item__children", id: `${this.itemId}-children`, role: "group", style: {
80
+ display: !this.expanded || !hasChildren ? "none" : undefined,
81
+ } }, h("slot", { key: '1267ae90169fef0a64b08f7a574cba930d85a7a5' })))));
83
82
  }
84
83
  static get is() { return "swirl-tree-view-item"; }
85
84
  static get encapsulation() { return "scoped"; }
@@ -226,7 +225,6 @@ export class SwirlTreeViewItem {
226
225
  static get states() {
227
226
  return {
228
227
  "expanded": {},
229
- "hasChildren": {},
230
228
  "level": {},
231
229
  "selected": {}
232
230
  };