@getflip/swirl-components 0.211.0 → 0.212.0

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/components.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "timestamp": "2024-07-09T16:31:22",
2
+ "timestamp": "2024-07-11T07:01:24",
3
3
  "compiler": {
4
4
  "name": "@stencil/core",
5
5
  "version": "4.18.1",
@@ -52554,6 +52554,25 @@
52554
52554
  "composed": true,
52555
52555
  "docs": "",
52556
52556
  "docsTags": []
52557
+ },
52558
+ {
52559
+ "event": "thumbnailClick",
52560
+ "detail": "MouseEvent",
52561
+ "bubbles": true,
52562
+ "complexType": {
52563
+ "original": "MouseEvent",
52564
+ "resolved": "MouseEvent",
52565
+ "references": {
52566
+ "MouseEvent": {
52567
+ "location": "global",
52568
+ "id": "global::MouseEvent"
52569
+ }
52570
+ }
52571
+ },
52572
+ "cancelable": true,
52573
+ "composed": true,
52574
+ "docs": "",
52575
+ "docsTags": []
52557
52576
  }
52558
52577
  ],
52559
52578
  "listeners": [],
@@ -73,6 +73,7 @@ const SwirlThumbnail = class {
73
73
  index.registerInstance(this, hostRef);
74
74
  this.edit = index.createEvent(this, "edit", 7);
75
75
  this.remove = index.createEvent(this, "remove", 7);
76
+ this.thumbnailClick = index.createEvent(this, "thumbnailClick", 7);
76
77
  this.alt = undefined;
77
78
  this.editButtonIcon = "<swirl-icon-crop></swirl-icon-crop>";
78
79
  this.editButtonLabel = "Edit";
@@ -100,7 +101,7 @@ const SwirlThumbnail = class {
100
101
  "thumbnail--interactive": this.interactive,
101
102
  "thumbnail--has-progress": this.progress !== undefined,
102
103
  });
103
- return (index.h(index.Host, { key: '706692e6b7d5ed33c84ccd2a7fe5b1be58e617e5' }, index.h("span", { key: '940029becf84f342ddca3f6de9c911b58f85a9c5', class: className, role: "group" }, index.h(ImageWrapper, { key: '67bfdff577225686174bd61d3ffa14c11fd3b3ad', class: "thumbnail__image-wrapper", type: this.interactive ? "button" : undefined }, index.h("img", { key: '0a788e2980ed107a26ba92a514da4e86342c7e7c', alt: this.alt, class: "thumbnail__image", loading: "lazy", src: this.src })), this.progress !== undefined && (index.h("span", { key: '6e17e8b76435f6f299433b9034fb06a42f732ef2', class: "thumbnail__progress-indicator" }, index.h("swirl-progress-indicator", { key: 'e01e32771284e758eccccb8e65f701ed9cbe4758', label: this.progressLabel, value: this.progress }))), showButtonGroup && (index.h("swirl-button-group", { key: '9abe3e2ca6ba0d02db2f7014606961a10d7eeac0', class: "thumbnail__buttons", segmented: showEditButton && showRemoveButton }, showEditButton && (index.h("span", { key: '0987b7f92bcac13d64abd0656fe79a7d60024e24' }, index.h("swirl-button", { key: 'ee9b5723f090837968300561818c3370c32eb9a5', hideLabel: true, icon: this.editButtonIcon, label: this.editButtonLabel, onClick: this.edit.emit, pill: this.size === "xl", variant: "on-image" }))), showRemoveButton && (index.h("span", { key: '0d4c4d2e5c93688ba662ec49579d66ca3a29fc57' }, index.h("swirl-button", { key: '80dc4e3b2074eb2dee6465fc27f0632d87226061', hideLabel: true, icon: "<swirl-icon-close></swirl-icon-close>", label: this.removeButtonLabel, onClick: this.remove.emit, pill: this.size === "xl", variant: "on-image" }))))), showTimestamp && (index.h("span", { key: '9829e4909b5fa94120d427c33fa5970d7e909754', class: "thumbnail__timestamp" }, this.timestamp)))));
104
+ return (index.h(index.Host, { key: '180fd0d7ad47d35b5867d6f698937454b21eb757' }, index.h("span", { key: '5540996b1ad2a87ef157e5be98efa7e7d1199d38', class: className, role: "group" }, index.h(ImageWrapper, { key: '3e2fc61e197695923fa301391ebceaf5bcf0eb00', class: "thumbnail__image-wrapper", onClick: this.thumbnailClick.emit, type: this.interactive ? "button" : undefined }, index.h("img", { key: '50c157965d5e67db73c17792b79406095ca78e9f', alt: this.alt, class: "thumbnail__image", loading: "lazy", src: this.src })), this.progress !== undefined && (index.h("span", { key: 'b144b3ed974c106e46c795a24f141e3bac47248e', class: "thumbnail__progress-indicator" }, index.h("swirl-progress-indicator", { key: '58a45909ee501fe941359e1e1b1ac091d6e10c4a', label: this.progressLabel, value: this.progress }))), showButtonGroup && (index.h("swirl-button-group", { key: '0124bcf1eb6489878914a59ccb756c1cf8568a1c', class: "thumbnail__buttons", segmented: showEditButton && showRemoveButton }, showEditButton && (index.h("span", { key: '74215d066d9d85f97f2b92ba963472392353a2ba' }, index.h("swirl-button", { key: 'fa9dcc701c7494e5a31ae4cf8c54a34303866413', hideLabel: true, icon: this.editButtonIcon, label: this.editButtonLabel, onClick: this.edit.emit, pill: this.size === "xl", variant: "on-image" }))), showRemoveButton && (index.h("span", { key: '129eaabf19586f3adb858d497d07dfe755a31916' }, index.h("swirl-button", { key: 'd8c1e423f87b9c780cc6b8c4e3500c321b770f65', hideLabel: true, icon: "<swirl-icon-close></swirl-icon-close>", label: this.removeButtonLabel, onClick: this.remove.emit, pill: this.size === "xl", variant: "on-image" }))))), showTimestamp && (index.h("span", { key: '48b943825e2e5784ec96d02a652e12e3d0baf406', class: "thumbnail__timestamp" }, this.timestamp)))));
104
105
  }
105
106
  };
106
107
  SwirlThumbnail.style = SwirlThumbnailStyle0;
@@ -29,7 +29,7 @@ export class SwirlThumbnail {
29
29
  "thumbnail--interactive": this.interactive,
30
30
  "thumbnail--has-progress": this.progress !== undefined,
31
31
  });
32
- return (h(Host, { key: '706692e6b7d5ed33c84ccd2a7fe5b1be58e617e5' }, h("span", { key: '940029becf84f342ddca3f6de9c911b58f85a9c5', class: className, role: "group" }, h(ImageWrapper, { key: '67bfdff577225686174bd61d3ffa14c11fd3b3ad', class: "thumbnail__image-wrapper", type: this.interactive ? "button" : undefined }, h("img", { key: '0a788e2980ed107a26ba92a514da4e86342c7e7c', alt: this.alt, class: "thumbnail__image", loading: "lazy", src: this.src })), this.progress !== undefined && (h("span", { key: '6e17e8b76435f6f299433b9034fb06a42f732ef2', class: "thumbnail__progress-indicator" }, h("swirl-progress-indicator", { key: 'e01e32771284e758eccccb8e65f701ed9cbe4758', label: this.progressLabel, value: this.progress }))), showButtonGroup && (h("swirl-button-group", { key: '9abe3e2ca6ba0d02db2f7014606961a10d7eeac0', class: "thumbnail__buttons", segmented: showEditButton && showRemoveButton }, showEditButton && (h("span", { key: '0987b7f92bcac13d64abd0656fe79a7d60024e24' }, h("swirl-button", { key: 'ee9b5723f090837968300561818c3370c32eb9a5', hideLabel: true, icon: this.editButtonIcon, label: this.editButtonLabel, onClick: this.edit.emit, pill: this.size === "xl", variant: "on-image" }))), showRemoveButton && (h("span", { key: '0d4c4d2e5c93688ba662ec49579d66ca3a29fc57' }, h("swirl-button", { key: '80dc4e3b2074eb2dee6465fc27f0632d87226061', hideLabel: true, icon: "<swirl-icon-close></swirl-icon-close>", label: this.removeButtonLabel, onClick: this.remove.emit, pill: this.size === "xl", variant: "on-image" }))))), showTimestamp && (h("span", { key: '9829e4909b5fa94120d427c33fa5970d7e909754', class: "thumbnail__timestamp" }, this.timestamp)))));
32
+ return (h(Host, { key: '180fd0d7ad47d35b5867d6f698937454b21eb757' }, h("span", { key: '5540996b1ad2a87ef157e5be98efa7e7d1199d38', class: className, role: "group" }, h(ImageWrapper, { key: '3e2fc61e197695923fa301391ebceaf5bcf0eb00', class: "thumbnail__image-wrapper", onClick: this.thumbnailClick.emit, type: this.interactive ? "button" : undefined }, h("img", { key: '50c157965d5e67db73c17792b79406095ca78e9f', alt: this.alt, class: "thumbnail__image", loading: "lazy", src: this.src })), this.progress !== undefined && (h("span", { key: 'b144b3ed974c106e46c795a24f141e3bac47248e', class: "thumbnail__progress-indicator" }, h("swirl-progress-indicator", { key: '58a45909ee501fe941359e1e1b1ac091d6e10c4a', label: this.progressLabel, value: this.progress }))), showButtonGroup && (h("swirl-button-group", { key: '0124bcf1eb6489878914a59ccb756c1cf8568a1c', class: "thumbnail__buttons", segmented: showEditButton && showRemoveButton }, showEditButton && (h("span", { key: '74215d066d9d85f97f2b92ba963472392353a2ba' }, h("swirl-button", { key: 'fa9dcc701c7494e5a31ae4cf8c54a34303866413', hideLabel: true, icon: this.editButtonIcon, label: this.editButtonLabel, onClick: this.edit.emit, pill: this.size === "xl", variant: "on-image" }))), showRemoveButton && (h("span", { key: '129eaabf19586f3adb858d497d07dfe755a31916' }, h("swirl-button", { key: 'd8c1e423f87b9c780cc6b8c4e3500c321b770f65', hideLabel: true, icon: "<swirl-icon-close></swirl-icon-close>", label: this.removeButtonLabel, onClick: this.remove.emit, pill: this.size === "xl", variant: "on-image" }))))), showTimestamp && (h("span", { key: '48b943825e2e5784ec96d02a652e12e3d0baf406', class: "thumbnail__timestamp" }, this.timestamp)))));
33
33
  }
34
34
  static get is() { return "swirl-thumbnail"; }
35
35
  static get encapsulation() { return "shadow"; }
@@ -327,6 +327,26 @@ export class SwirlThumbnail {
327
327
  }
328
328
  }
329
329
  }
330
+ }, {
331
+ "method": "thumbnailClick",
332
+ "name": "thumbnailClick",
333
+ "bubbles": true,
334
+ "cancelable": true,
335
+ "composed": true,
336
+ "docs": {
337
+ "tags": [],
338
+ "text": ""
339
+ },
340
+ "complexType": {
341
+ "original": "MouseEvent",
342
+ "resolved": "MouseEvent",
343
+ "references": {
344
+ "MouseEvent": {
345
+ "location": "global",
346
+ "id": "global::MouseEvent"
347
+ }
348
+ }
349
+ }
330
350
  }];
331
351
  }
332
352
  }