sas-ui 0.8.236 → 0.8.238

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.
Files changed (9) hide show
  1. package/dist/cjs/sas-chat-bubble_12.cjs.entry.js +6 -4
  2. package/dist/collection/components/sas-setup-guide-tile/sas-setup-guide-tile.js +22 -6
  3. package/dist/custom-elements/index.js +6 -4
  4. package/dist/esm/sas-chat-bubble_12.entry.js +6 -4
  5. package/dist/sas-ui/{p-7cec3516.entry.js → p-fda7dcc2.entry.js} +1 -1
  6. package/dist/sas-ui/sas-ui.esm.js +1 -1
  7. package/dist/types/components/sas-setup-guide-tile/sas-setup-guide-tile.d.ts +3 -1
  8. package/dist/types/components.d.ts +5 -1
  9. package/package.json +1 -1
package/dist/cjs/sas-chat-bubble_12.cjs.entry.js CHANGED
@@ -820,7 +820,8 @@ let SasSetupGuideTile = class {
820
820
  this.pendingitemclicked = index.createEvent(this, "pendingitemclicked", 7);
821
821
  this.videoclicked = index.createEvent(this, "videoclicked", 7);
822
822
  this.iconclicked = index.createEvent(this, "iconclicked", 7);
823
- this.proIconclicked = index.createEvent(this, "proIconclicked", 7);
823
+ this.proiconclicked = index.createEvent(this, "proiconclicked", 7);
824
+ this.seemoreitemclicked = index.createEvent(this, "seemoreitemclicked", 7);
824
825
  /** Icon name for video/help */
825
826
  this.icon = 'fas fa-video';
826
827
  /** image for video/help */
@@ -848,6 +849,7 @@ let SasSetupGuideTile = class {
848
849
  };
849
850
  this.toggleExpand = () => {
850
851
  this.expanded = !this.expanded;
852
+ this.seemoreitemclicked.emit();
851
853
  };
852
854
  this.handleCompletedItemClicked = (itemId) => {
853
855
  this.completeditemclicked.emit(itemId);
@@ -862,9 +864,9 @@ let SasSetupGuideTile = class {
862
864
  event.stopPropagation(); // avoid triggering pendingitemclicked after this one
863
865
  this.iconclicked.emit(itemId);
864
866
  };
865
- this.handleProIconClick = (event) => {
867
+ this.handleProIconClick = (event, itemName) => {
866
868
  event.stopPropagation();
867
- this.proIconclicked.emit();
869
+ this.proiconclicked.emit(itemName);
868
870
  };
869
871
  }
870
872
  normalize(input) {
@@ -886,7 +888,7 @@ let SasSetupGuideTile = class {
886
888
  const completedItems = this.normalize(this.completed);
887
889
  const pendingItems = this.normalize(this.pending);
888
890
  const lockedItems = this.normalize(this.locked);
889
- return (index.h(index.Host, null, index.h("div", { class: "tile", style: { width: this.width } }, index.h("div", { class: "header" }, index.h("h3", { class: "title" }, this.title)), completedItems.length > 0 && (index.h("div", { class: "completed" }, index.h("div", { class: "completed-header", onClick: this.toggleCompleted }, index.h("span", null, "Completed"), index.h("div", { class: "right" }, index.h("span", { class: "count" }, completedItems.length), index.h("sas-icon", { class: "icon-chevron", icon: this.completedopen ? 'fas fa-chevron-up' : 'fas fa-chevron-down', size: "default" }))), index.h("div", { class: `completed-list ${this.completedopen ? 'open' : ''}` }, completedItems.map(item => (index.h("div", { onClick: () => this.handleCompletedItemClicked(item.itemId), class: "completed-item completedItem" }, item.itemName, index.h("sas-icon", { id: "icon-completed", type: "default", size: "default", status: "high", icon: "fa-solid fa-circle-check" }))))))), completedItems.length > 0 && pendingItems.length > 0 && (index.h("div", { class: "dashed-divider" })), index.h("div", { class: "pending-container" }, pendingItems.length > 0 && pendingItems.map(item => (index.h("div", { onClick: () => this.handlePendingItemClicked(item.itemId), class: "pending" }, item.itemName, item.isPro && (index.h("sas-chip", { type: "small", status: "open", text: "PRO", onClick: this.handleProIconClick })), !item.isPro && (index.h("sas-icon", { class: "iconInfo", type: "default", size: "default", status: "high", icon: "far fa-circle-info", onClick: (event) => this.handleIconClick(event, item.itemId) }))))), index.h("div", { class: `pending-list ${this.expanded ? 'open' : ''} disabled` }, index.h("div", { class: "dashed-divider mtb-8" }), lockedItems.length > 0 && lockedItems.map(item => (index.h("sas-tooltip", { position: 'right' }, index.h("div", { slot: "trigger", class: "trigger-wrapper" }, index.h("div", { class: "pending-item" }, item.itemName, item.isPro && (index.h("sas-chip", { class: 'click-allowed', type: "small", status: "open", text: "PRO", onClick: this.handleProIconClick })))), index.h("div", { slot: "text" }, item.itemLockedTooltip)))))), lockedItems.length > 0 && (index.h("button", { class: "see-more", onClick: this.toggleExpand }, this.expanded ? 'See less' : 'See more', index.h("sas-icon", { class: "see-more-icon", icon: this.expanded ? 'fas fa-chevron-up' : 'fas fa-chevron-down', type: "default", size: "default" }))))));
891
+ return (index.h(index.Host, null, index.h("div", { class: "tile", style: { width: this.width } }, index.h("div", { class: "header" }, index.h("h3", { class: "title" }, this.title)), completedItems.length > 0 && (index.h("div", { class: "completed" }, index.h("div", { class: "completed-header", onClick: this.toggleCompleted }, index.h("span", null, "Completed"), index.h("div", { class: "right" }, index.h("span", { class: "count" }, completedItems.length), index.h("sas-icon", { class: "icon-chevron", icon: this.completedopen ? 'fas fa-chevron-up' : 'fas fa-chevron-down', size: "default" }))), index.h("div", { class: `completed-list ${this.completedopen ? 'open' : ''}` }, completedItems.map(item => (index.h("div", { onClick: () => this.handleCompletedItemClicked(item.itemId), class: "completed-item completedItem" }, item.itemName, index.h("sas-icon", { id: "icon-completed", type: "default", size: "default", status: "high", icon: "fa-solid fa-circle-check" }))))))), completedItems.length > 0 && pendingItems.length > 0 && (index.h("div", { class: "dashed-divider" })), index.h("div", { class: "pending-container" }, pendingItems.length > 0 && pendingItems.map(item => (index.h("div", { onClick: () => this.handlePendingItemClicked(item.itemId), class: "pending" }, item.itemName, item.isPro && (index.h("sas-chip", { type: "small", status: "open", text: "PRO", onClick: (event) => this.handleProIconClick(event, item.itemName) })), !item.isPro && (index.h("sas-icon", { class: "iconInfo", type: "default", size: "default", status: "high", icon: "far fa-circle-info", onClick: (event) => this.handleIconClick(event, item.itemId) }))))), index.h("div", { class: `pending-list ${this.expanded ? 'open' : ''} disabled` }, index.h("div", { class: "dashed-divider mtb-8" }), lockedItems.length > 0 && lockedItems.map(item => (index.h("sas-tooltip", { position: 'right' }, index.h("div", { slot: "trigger", class: "trigger-wrapper" }, index.h("div", { class: "pending-item" }, item.itemName, item.isPro && (index.h("sas-chip", { class: 'click-allowed', type: "small", status: "open", text: "PRO", onClick: (event) => this.handleProIconClick(event, item.itemName) })))), index.h("div", { slot: "text" }, item.itemLockedTooltip)))))), lockedItems.length > 0 && (index.h("button", { class: "see-more", onClick: this.toggleExpand }, this.expanded ? 'See less' : 'See more', index.h("sas-icon", { class: "see-more-icon", icon: this.expanded ? 'fas fa-chevron-up' : 'fas fa-chevron-down', type: "default", size: "default" }))))));
890
892
  }
891
893
  };
892
894
  SasSetupGuideTile.style = sasSetupGuideTileCss;
package/dist/collection/components/sas-setup-guide-tile/sas-setup-guide-tile.js CHANGED
@@ -28,6 +28,7 @@ export class SasSetupGuideTile {
28
28
  };
29
29
  this.toggleExpand = () => {
30
30
  this.expanded = !this.expanded;
31
+ this.seemoreitemclicked.emit();
31
32
  };
32
33
  this.handleCompletedItemClicked = (itemId) => {
33
34
  this.completeditemclicked.emit(itemId);
@@ -42,9 +43,9 @@ export class SasSetupGuideTile {
42
43
  event.stopPropagation(); // avoid triggering pendingitemclicked after this one
43
44
  this.iconclicked.emit(itemId);
44
45
  };
45
- this.handleProIconClick = (event) => {
46
+ this.handleProIconClick = (event, itemName) => {
46
47
  event.stopPropagation();
47
- this.proIconclicked.emit();
48
+ this.proiconclicked.emit(itemName);
48
49
  };
49
50
  }
50
51
  normalize(input) {
@@ -83,7 +84,7 @@ export class SasSetupGuideTile {
83
84
  h("div", { class: "pending-container" },
84
85
  pendingItems.length > 0 && pendingItems.map(item => (h("div", { onClick: () => this.handlePendingItemClicked(item.itemId), class: "pending" },
85
86
  item.itemName,
86
- item.isPro && (h("sas-chip", { type: "small", status: "open", text: "PRO", onClick: this.handleProIconClick })),
87
+ item.isPro && (h("sas-chip", { type: "small", status: "open", text: "PRO", onClick: (event) => this.handleProIconClick(event, item.itemName) })),
87
88
  !item.isPro && (h("sas-icon", { class: "iconInfo", type: "default", size: "default", status: "high", icon: "far fa-circle-info", onClick: (event) => this.handleIconClick(event, item.itemId) }))))),
88
89
  h("div", { class: `pending-list ${this.expanded ? 'open' : ''} disabled` },
89
90
  h("div", { class: "dashed-divider mtb-8" }),
@@ -91,7 +92,7 @@ export class SasSetupGuideTile {
91
92
  h("div", { slot: "trigger", class: "trigger-wrapper" },
92
93
  h("div", { class: "pending-item" },
93
94
  item.itemName,
94
- item.isPro && (h("sas-chip", { class: 'click-allowed', type: "small", status: "open", text: "PRO", onClick: this.handleProIconClick })))),
95
+ item.isPro && (h("sas-chip", { class: 'click-allowed', type: "small", status: "open", text: "PRO", onClick: (event) => this.handleProIconClick(event, item.itemName) })))),
95
96
  h("div", { slot: "text" }, item.itemLockedTooltip)))))),
96
97
  lockedItems.length > 0 && (h("button", { class: "see-more", onClick: this.toggleExpand },
97
98
  this.expanded ? 'See less' : 'See more',
@@ -365,8 +366,8 @@ export class SasSetupGuideTile {
365
366
  "references": {}
366
367
  }
367
368
  }, {
368
- "method": "proIconclicked",
369
- "name": "proIconclicked",
369
+ "method": "proiconclicked",
370
+ "name": "proiconclicked",
370
371
  "bubbles": true,
371
372
  "cancelable": true,
372
373
  "composed": true,
@@ -379,5 +380,20 @@ export class SasSetupGuideTile {
379
380
  "resolved": "string",
380
381
  "references": {}
381
382
  }
383
+ }, {
384
+ "method": "seemoreitemclicked",
385
+ "name": "seemoreitemclicked",
386
+ "bubbles": true,
387
+ "cancelable": true,
388
+ "composed": true,
389
+ "docs": {
390
+ "tags": [],
391
+ "text": "Fired when pending item is clicked"
392
+ },
393
+ "complexType": {
394
+ "original": "string",
395
+ "resolved": "string",
396
+ "references": {}
397
+ }
382
398
  }]; }
383
399
  }
package/dist/custom-elements/index.js CHANGED
@@ -13504,7 +13504,8 @@ let SasSetupGuideTile$1 = class extends H {
13504
13504
  this.pendingitemclicked = createEvent(this, "pendingitemclicked", 7);
13505
13505
  this.videoclicked = createEvent(this, "videoclicked", 7);
13506
13506
  this.iconclicked = createEvent(this, "iconclicked", 7);
13507
- this.proIconclicked = createEvent(this, "proIconclicked", 7);
13507
+ this.proiconclicked = createEvent(this, "proiconclicked", 7);
13508
+ this.seemoreitemclicked = createEvent(this, "seemoreitemclicked", 7);
13508
13509
  /** Icon name for video/help */
13509
13510
  this.icon = 'fas fa-video';
13510
13511
  /** image for video/help */
@@ -13532,6 +13533,7 @@ let SasSetupGuideTile$1 = class extends H {
13532
13533
  };
13533
13534
  this.toggleExpand = () => {
13534
13535
  this.expanded = !this.expanded;
13536
+ this.seemoreitemclicked.emit();
13535
13537
  };
13536
13538
  this.handleCompletedItemClicked = (itemId) => {
13537
13539
  this.completeditemclicked.emit(itemId);
@@ -13546,9 +13548,9 @@ let SasSetupGuideTile$1 = class extends H {
13546
13548
  event.stopPropagation(); // avoid triggering pendingitemclicked after this one
13547
13549
  this.iconclicked.emit(itemId);
13548
13550
  };
13549
- this.handleProIconClick = (event) => {
13551
+ this.handleProIconClick = (event, itemName) => {
13550
13552
  event.stopPropagation();
13551
- this.proIconclicked.emit();
13553
+ this.proiconclicked.emit(itemName);
13552
13554
  };
13553
13555
  }
13554
13556
  normalize(input) {
@@ -13570,7 +13572,7 @@ let SasSetupGuideTile$1 = class extends H {
13570
13572
  const completedItems = this.normalize(this.completed);
13571
13573
  const pendingItems = this.normalize(this.pending);
13572
13574
  const lockedItems = this.normalize(this.locked);
13573
- return (h(Host, null, h("div", { class: "tile", style: { width: this.width } }, h("div", { class: "header" }, h("h3", { class: "title" }, this.title)), completedItems.length > 0 && (h("div", { class: "completed" }, h("div", { class: "completed-header", onClick: this.toggleCompleted }, h("span", null, "Completed"), h("div", { class: "right" }, h("span", { class: "count" }, completedItems.length), h("sas-icon", { class: "icon-chevron", icon: this.completedopen ? 'fas fa-chevron-up' : 'fas fa-chevron-down', size: "default" }))), h("div", { class: `completed-list ${this.completedopen ? 'open' : ''}` }, completedItems.map(item => (h("div", { onClick: () => this.handleCompletedItemClicked(item.itemId), class: "completed-item completedItem" }, item.itemName, h("sas-icon", { id: "icon-completed", type: "default", size: "default", status: "high", icon: "fa-solid fa-circle-check" }))))))), completedItems.length > 0 && pendingItems.length > 0 && (h("div", { class: "dashed-divider" })), h("div", { class: "pending-container" }, pendingItems.length > 0 && pendingItems.map(item => (h("div", { onClick: () => this.handlePendingItemClicked(item.itemId), class: "pending" }, item.itemName, item.isPro && (h("sas-chip", { type: "small", status: "open", text: "PRO", onClick: this.handleProIconClick })), !item.isPro && (h("sas-icon", { class: "iconInfo", type: "default", size: "default", status: "high", icon: "far fa-circle-info", onClick: (event) => this.handleIconClick(event, item.itemId) }))))), h("div", { class: `pending-list ${this.expanded ? 'open' : ''} disabled` }, h("div", { class: "dashed-divider mtb-8" }), lockedItems.length > 0 && lockedItems.map(item => (h("sas-tooltip", { position: 'right' }, h("div", { slot: "trigger", class: "trigger-wrapper" }, h("div", { class: "pending-item" }, item.itemName, item.isPro && (h("sas-chip", { class: 'click-allowed', type: "small", status: "open", text: "PRO", onClick: this.handleProIconClick })))), h("div", { slot: "text" }, item.itemLockedTooltip)))))), lockedItems.length > 0 && (h("button", { class: "see-more", onClick: this.toggleExpand }, this.expanded ? 'See less' : 'See more', h("sas-icon", { class: "see-more-icon", icon: this.expanded ? 'fas fa-chevron-up' : 'fas fa-chevron-down', type: "default", size: "default" }))))));
13575
+ return (h(Host, null, h("div", { class: "tile", style: { width: this.width } }, h("div", { class: "header" }, h("h3", { class: "title" }, this.title)), completedItems.length > 0 && (h("div", { class: "completed" }, h("div", { class: "completed-header", onClick: this.toggleCompleted }, h("span", null, "Completed"), h("div", { class: "right" }, h("span", { class: "count" }, completedItems.length), h("sas-icon", { class: "icon-chevron", icon: this.completedopen ? 'fas fa-chevron-up' : 'fas fa-chevron-down', size: "default" }))), h("div", { class: `completed-list ${this.completedopen ? 'open' : ''}` }, completedItems.map(item => (h("div", { onClick: () => this.handleCompletedItemClicked(item.itemId), class: "completed-item completedItem" }, item.itemName, h("sas-icon", { id: "icon-completed", type: "default", size: "default", status: "high", icon: "fa-solid fa-circle-check" }))))))), completedItems.length > 0 && pendingItems.length > 0 && (h("div", { class: "dashed-divider" })), h("div", { class: "pending-container" }, pendingItems.length > 0 && pendingItems.map(item => (h("div", { onClick: () => this.handlePendingItemClicked(item.itemId), class: "pending" }, item.itemName, item.isPro && (h("sas-chip", { type: "small", status: "open", text: "PRO", onClick: (event) => this.handleProIconClick(event, item.itemName) })), !item.isPro && (h("sas-icon", { class: "iconInfo", type: "default", size: "default", status: "high", icon: "far fa-circle-info", onClick: (event) => this.handleIconClick(event, item.itemId) }))))), h("div", { class: `pending-list ${this.expanded ? 'open' : ''} disabled` }, h("div", { class: "dashed-divider mtb-8" }), lockedItems.length > 0 && lockedItems.map(item => (h("sas-tooltip", { position: 'right' }, h("div", { slot: "trigger", class: "trigger-wrapper" }, h("div", { class: "pending-item" }, item.itemName, item.isPro && (h("sas-chip", { class: 'click-allowed', type: "small", status: "open", text: "PRO", onClick: (event) => this.handleProIconClick(event, item.itemName) })))), h("div", { slot: "text" }, item.itemLockedTooltip)))))), lockedItems.length > 0 && (h("button", { class: "see-more", onClick: this.toggleExpand }, this.expanded ? 'See less' : 'See more', h("sas-icon", { class: "see-more-icon", icon: this.expanded ? 'fas fa-chevron-up' : 'fas fa-chevron-down', type: "default", size: "default" }))))));
13574
13576
  }
13575
13577
  static get style() { return sasSetupGuideTileCss; }
13576
13578
  };
package/dist/esm/sas-chat-bubble_12.entry.js CHANGED
@@ -816,7 +816,8 @@ let SasSetupGuideTile = class {
816
816
  this.pendingitemclicked = createEvent(this, "pendingitemclicked", 7);
817
817
  this.videoclicked = createEvent(this, "videoclicked", 7);
818
818
  this.iconclicked = createEvent(this, "iconclicked", 7);
819
- this.proIconclicked = createEvent(this, "proIconclicked", 7);
819
+ this.proiconclicked = createEvent(this, "proiconclicked", 7);
820
+ this.seemoreitemclicked = createEvent(this, "seemoreitemclicked", 7);
820
821
  /** Icon name for video/help */
821
822
  this.icon = 'fas fa-video';
822
823
  /** image for video/help */
@@ -844,6 +845,7 @@ let SasSetupGuideTile = class {
844
845
  };
845
846
  this.toggleExpand = () => {
846
847
  this.expanded = !this.expanded;
848
+ this.seemoreitemclicked.emit();
847
849
  };
848
850
  this.handleCompletedItemClicked = (itemId) => {
849
851
  this.completeditemclicked.emit(itemId);
@@ -858,9 +860,9 @@ let SasSetupGuideTile = class {
858
860
  event.stopPropagation(); // avoid triggering pendingitemclicked after this one
859
861
  this.iconclicked.emit(itemId);
860
862
  };
861
- this.handleProIconClick = (event) => {
863
+ this.handleProIconClick = (event, itemName) => {
862
864
  event.stopPropagation();
863
- this.proIconclicked.emit();
865
+ this.proiconclicked.emit(itemName);
864
866
  };
865
867
  }
866
868
  normalize(input) {
@@ -882,7 +884,7 @@ let SasSetupGuideTile = class {
882
884
  const completedItems = this.normalize(this.completed);
883
885
  const pendingItems = this.normalize(this.pending);
884
886
  const lockedItems = this.normalize(this.locked);
885
- return (h(Host, null, h("div", { class: "tile", style: { width: this.width } }, h("div", { class: "header" }, h("h3", { class: "title" }, this.title)), completedItems.length > 0 && (h("div", { class: "completed" }, h("div", { class: "completed-header", onClick: this.toggleCompleted }, h("span", null, "Completed"), h("div", { class: "right" }, h("span", { class: "count" }, completedItems.length), h("sas-icon", { class: "icon-chevron", icon: this.completedopen ? 'fas fa-chevron-up' : 'fas fa-chevron-down', size: "default" }))), h("div", { class: `completed-list ${this.completedopen ? 'open' : ''}` }, completedItems.map(item => (h("div", { onClick: () => this.handleCompletedItemClicked(item.itemId), class: "completed-item completedItem" }, item.itemName, h("sas-icon", { id: "icon-completed", type: "default", size: "default", status: "high", icon: "fa-solid fa-circle-check" }))))))), completedItems.length > 0 && pendingItems.length > 0 && (h("div", { class: "dashed-divider" })), h("div", { class: "pending-container" }, pendingItems.length > 0 && pendingItems.map(item => (h("div", { onClick: () => this.handlePendingItemClicked(item.itemId), class: "pending" }, item.itemName, item.isPro && (h("sas-chip", { type: "small", status: "open", text: "PRO", onClick: this.handleProIconClick })), !item.isPro && (h("sas-icon", { class: "iconInfo", type: "default", size: "default", status: "high", icon: "far fa-circle-info", onClick: (event) => this.handleIconClick(event, item.itemId) }))))), h("div", { class: `pending-list ${this.expanded ? 'open' : ''} disabled` }, h("div", { class: "dashed-divider mtb-8" }), lockedItems.length > 0 && lockedItems.map(item => (h("sas-tooltip", { position: 'right' }, h("div", { slot: "trigger", class: "trigger-wrapper" }, h("div", { class: "pending-item" }, item.itemName, item.isPro && (h("sas-chip", { class: 'click-allowed', type: "small", status: "open", text: "PRO", onClick: this.handleProIconClick })))), h("div", { slot: "text" }, item.itemLockedTooltip)))))), lockedItems.length > 0 && (h("button", { class: "see-more", onClick: this.toggleExpand }, this.expanded ? 'See less' : 'See more', h("sas-icon", { class: "see-more-icon", icon: this.expanded ? 'fas fa-chevron-up' : 'fas fa-chevron-down', type: "default", size: "default" }))))));
887
+ return (h(Host, null, h("div", { class: "tile", style: { width: this.width } }, h("div", { class: "header" }, h("h3", { class: "title" }, this.title)), completedItems.length > 0 && (h("div", { class: "completed" }, h("div", { class: "completed-header", onClick: this.toggleCompleted }, h("span", null, "Completed"), h("div", { class: "right" }, h("span", { class: "count" }, completedItems.length), h("sas-icon", { class: "icon-chevron", icon: this.completedopen ? 'fas fa-chevron-up' : 'fas fa-chevron-down', size: "default" }))), h("div", { class: `completed-list ${this.completedopen ? 'open' : ''}` }, completedItems.map(item => (h("div", { onClick: () => this.handleCompletedItemClicked(item.itemId), class: "completed-item completedItem" }, item.itemName, h("sas-icon", { id: "icon-completed", type: "default", size: "default", status: "high", icon: "fa-solid fa-circle-check" }))))))), completedItems.length > 0 && pendingItems.length > 0 && (h("div", { class: "dashed-divider" })), h("div", { class: "pending-container" }, pendingItems.length > 0 && pendingItems.map(item => (h("div", { onClick: () => this.handlePendingItemClicked(item.itemId), class: "pending" }, item.itemName, item.isPro && (h("sas-chip", { type: "small", status: "open", text: "PRO", onClick: (event) => this.handleProIconClick(event, item.itemName) })), !item.isPro && (h("sas-icon", { class: "iconInfo", type: "default", size: "default", status: "high", icon: "far fa-circle-info", onClick: (event) => this.handleIconClick(event, item.itemId) }))))), h("div", { class: `pending-list ${this.expanded ? 'open' : ''} disabled` }, h("div", { class: "dashed-divider mtb-8" }), lockedItems.length > 0 && lockedItems.map(item => (h("sas-tooltip", { position: 'right' }, h("div", { slot: "trigger", class: "trigger-wrapper" }, h("div", { class: "pending-item" }, item.itemName, item.isPro && (h("sas-chip", { class: 'click-allowed', type: "small", status: "open", text: "PRO", onClick: (event) => this.handleProIconClick(event, item.itemName) })))), h("div", { slot: "text" }, item.itemLockedTooltip)))))), lockedItems.length > 0 && (h("button", { class: "see-more", onClick: this.toggleExpand }, this.expanded ? 'See less' : 'See more', h("sas-icon", { class: "see-more-icon", icon: this.expanded ? 'fas fa-chevron-up' : 'fas fa-chevron-down', type: "default", size: "default" }))))));
886
888
  }
887
889
  };
888
890
  SasSetupGuideTile.style = sasSetupGuideTileCss;