@getflip/swirl-components 0.320.0 → 0.320.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.
package/components.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "timestamp": "2025-04-24T09:57:47",
2
+ "timestamp": "2025-04-25T13:40:10",
3
3
  "compiler": {
4
4
  "name": "@stencil/core",
5
5
  "version": "4.18.1",
@@ -207,8 +207,12 @@ const SwirlModal = class {
207
207
  bodyScrollLock_esm.disableBodyScroll(this.sidebarScrollContainer);
208
208
  }
209
209
  unlockBodyScroll() {
210
- bodyScrollLock_esm.enableBodyScroll(this.scrollContainer);
211
- bodyScrollLock_esm.enableBodyScroll(this.sidebarScrollContainer);
210
+ if (this.scrollContainer) {
211
+ bodyScrollLock_esm.enableBodyScroll(this.scrollContainer);
212
+ }
213
+ if (this.sidebarScrollContainer) {
214
+ bodyScrollLock_esm.enableBodyScroll(this.sidebarScrollContainer);
215
+ }
212
216
  }
213
217
  render() {
214
218
  const showControls = Boolean(this.primaryActionLabel) || Boolean(this.secondaryActionLabel);
@@ -234,21 +238,21 @@ const SwirlModal = class {
234
238
  "modal--sidebar-scrolled-down": this.sidebarScrolledDown,
235
239
  "modal--sidebar-scrollable": this.sidebarScrollable,
236
240
  });
237
- return (index.h(index.Host, { key: '3a3366fb403f5722bf8f544426dc0e28a38baf5c' }, index.h("section", { key: '62cf4ed359569d7252c9516ee986ab8e873bb754', "aria-hidden": String(!this.isOpen), "aria-label": this.label, "aria-modal": "true", class: className, onKeyDown: this.onKeyDown, role: "dialog", ref: (el) => (this.modalEl = el) }, index.h("div", { key: '80f26c8113995973f1984bb64d2ef0db6bc65d71', class: "modal__backdrop", onClick: this.onBackdropClick }), index.h("div", { key: '576ea88a03ebcf3c63711214f954131afc76edac', class: "modal__body", style: {
241
+ return (index.h(index.Host, { key: 'd162022c8b9967bb9eded76db12570bbadacaa7d' }, index.h("section", { key: '16daee0db84ad02cca21fbfb889862c595b790b7', "aria-hidden": String(!this.isOpen), "aria-label": this.label, "aria-modal": "true", class: className, onKeyDown: this.onKeyDown, role: "dialog", ref: (el) => (this.modalEl = el) }, index.h("div", { key: '9580dc9753a27e9619ca5c8a46de177e41ad0401', class: "modal__backdrop", onClick: this.onBackdropClick }), index.h("div", { key: '91fd94a7b8e5546f09d3abaf30b452ff36b53ed8', class: "modal__body", style: {
238
242
  "--swirl-modal-max-height": this.maxHeight,
239
243
  "--swirl-modal-height": this.height,
240
244
  minHeight: this.minHeight,
241
245
  maxWidth: this.maxWidth,
242
- } }, index.h("aside", { key: '4f7fb1ec21a4b715e2318c1a9f53882deb9e7ba8', class: "modal__sidebar" }, this.sidebarLabel && (index.h("header", { key: '87abcf300bfb125308856ac1b60ad0df28e99c27', class: "modal__sidebar-header" }, index.h("swirl-heading", { key: '81b6227d1085c4e7eb7c9f0cebfc18b3540f2e7c', as: "h3", class: "modal__sidebar-heading", level: 3, text: this.sidebarLabel }))), index.h("div", { key: 'f42abc8314b221af8f2dadeaa73d1de429e05177', class: "modal__sidebar-content", onScroll: this.determineSidebarScrollStatus, ref: (el) => (this.sidebarScrollContainer = el) }, index.h("slot", { key: '643816994f91313553b11980182285394f8096f5', name: "sidebar-content" })), index.h("div", { key: '20f5780da70f923151617a35b60e2a8ae13136e2', class: "modal__sidebar-footer" }, index.h("slot", { key: 'de224373f052ecc0c7eea72e83e4c98e6dd23cf1', name: "sidebar-footer" }))), index.h("div", { key: 'dd23b1b51b5545af639e8f5ace2106614cb551bd', class: "modal__main-content" }, index.h("header", { key: 'd71937f4fbf87caaeac6e0722a0c4bea5829b029', class: "modal__custom-header" }, index.h("slot", { key: '45336edc346f4b5931c32f029c3072d2c813208b', name: "custom-header" })), (!this.hideLabel || !this.hideCloseButton) && (index.h("header", { key: 'b965f7be0bb9b2500abb3c338d3d9c1c58cc01bc', class: "modal__header" }, index.h("div", { key: 'ed69b19865ceb4e27759d3936ee3f58995b7f9d9', class: "modal__header-bar" }, !this.hideCloseButton && (index.h("swirl-button", { key: '628e0e6b13c39b7d535b43de3ad9a9ec21517f8b', class: "modal__close-button", hideLabel: true, icon: this.variant === "default"
246
+ } }, index.h("aside", { key: '79480adbc827a85032debda4dc0d20307c4c3d72', class: "modal__sidebar" }, this.sidebarLabel && (index.h("header", { key: 'a6a3bd6cad2bef769cedaa030e4ce6a461a92c76', class: "modal__sidebar-header" }, index.h("swirl-heading", { key: 'ff5451d4f51467e5e60013dcc276f408a1c35bcc', as: "h3", class: "modal__sidebar-heading", level: 3, text: this.sidebarLabel }))), index.h("div", { key: 'e42c3111f5a095846bad8346885532eb2c7fbe96', class: "modal__sidebar-content", onScroll: this.determineSidebarScrollStatus, ref: (el) => (this.sidebarScrollContainer = el) }, index.h("slot", { key: '6a18599749a2ea252c90f0cf46ba13b6f70875a4', name: "sidebar-content" })), index.h("div", { key: '51afea19e6db35787dad89949f90cf7135bf3a2a', class: "modal__sidebar-footer" }, index.h("slot", { key: '5e27d543bf74ad187c4d413c92f1a0dad37ade6b', name: "sidebar-footer" }))), index.h("div", { key: 'bfa4d069ad12b4377bbd7e00dffc47be4c6be742', class: "modal__main-content" }, index.h("header", { key: '23d5b07a941a7a504a05d0af0116119aa6547029', class: "modal__custom-header" }, index.h("slot", { key: '6a10aed5e3989f04dce9aadb8c10b23c04265c24', name: "custom-header" })), (!this.hideLabel || !this.hideCloseButton) && (index.h("header", { key: '7cfa274ee7624dae949313d7e178ad7a091ec18f', class: "modal__header" }, index.h("div", { key: '591192e57b8630bb25d123ef8a8987202a7b90a6', class: "modal__header-bar" }, !this.hideCloseButton && (index.h("swirl-button", { key: '9ed3c60edd6464f3c56fdb080cb202d4847adb90', class: "modal__close-button", hideLabel: true, icon: this.variant === "default"
243
247
  ? "<swirl-icon-close></swirl-icon-close>"
244
- : "<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>", label: this.closeButtonLabel, onClick: this.onCloseButtonClick })), !this.hideLabel && (index.h("swirl-heading", { key: 'c9ca1c39d3b8447aa73dbdead5d9fda0a4352c98', as: "h2", class: "modal__heading", level: 3, text: this.label }))))), index.h("div", { key: 'd5263228d3ddf9de25fe5ff38b4697ab9d8e418b', class: "modal__content-container", style: {
248
+ : "<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>", label: this.closeButtonLabel, onClick: this.onCloseButtonClick })), !this.hideLabel && (index.h("swirl-heading", { key: 'f3d11935d48cb6a83141df054b82afc254792c2d', as: "h2", class: "modal__heading", level: 3, text: this.label }))))), index.h("div", { key: '6f0b289d11691dfd16a0716f2fa25f23f6f432e6', class: "modal__content-container", style: {
245
249
  gap: this.contentGap
246
250
  ? `var(--s-space-${this.contentGap})`
247
251
  : undefined,
248
- } }, index.h("div", { key: 'f44850b03d1716bc29de23e606bfbbbf076a4993', class: "modal__primary-content", style: {
252
+ } }, index.h("div", { key: '35d1da48878a59394e80fb417b8a79f87956a7c9', class: "modal__primary-content", style: {
249
253
  maxWidth: this.primaryContentMaxWidth,
250
254
  flex: this.primaryContentFlex,
251
- } }, index.h("div", { key: '2399661abddb5bfca0b6d7d14247421050fced42', class: "modal__header-tools" }, index.h("slot", { key: '810b31cd6deaa29a3e4e35cc7a43eea1f5b6aa6a', name: "header-tools" })), index.h("div", { key: 'ee7ad6321ce5af143d04d3593c5896a9350c69f8', class: "modal__content", onScroll: this.determineMainScrollStatus, ref: (el) => (this.scrollContainer = el) }, index.h("slot", { key: '51004f8664d52eaeafd8a704386b28e7ba4758d3' }))), index.h("div", { key: '64124ddb5d19bf945810dc5cc603e52febaf7598', class: "modal__secondary-content", style: {
255
+ } }, index.h("div", { key: '61110bfffefd307ef8689c8011d22ee04a191c7d', class: "modal__header-tools" }, index.h("slot", { key: '88132e16cf38cbdfea4af31b0e47b5f085296799', name: "header-tools" })), index.h("div", { key: '9af2183748d315be64eee21e828bb0594f1d4756', class: "modal__content", onScroll: this.determineMainScrollStatus, ref: (el) => (this.scrollContainer = el) }, index.h("slot", { key: 'bd270446b3c8e3b1591e7b0d3fbe8ccff0c82d47' }))), index.h("div", { key: '5f9a362288a72d1217d8793de47e6483ba26c41d', class: "modal__secondary-content", style: {
252
256
  maxWidth: this.secondaryContentMaxWidth,
253
257
  flex: this.secondaryContentFlex,
254
258
  padding: Boolean(this.secondaryContentPadding)
@@ -266,7 +270,7 @@ const SwirlModal = class {
266
270
  paddingInlineStart: Boolean(this.secondaryContentPaddingInlineStart)
267
271
  ? `var(--s-space-${this.secondaryContentPaddingInlineStart})`
268
272
  : undefined,
269
- } }, index.h("slot", { key: 'e1a3139d5eb54fc0b6446d17ea63a1efd5106378', name: "secondary-content" }))), index.h("div", { key: '0e671a3b4c808390af2a3840aa799be41fc03f90', class: "modal__custom-footer" }, index.h("slot", { key: '131a3cb5bc9ad8c9c001f057d55bc0eeec39264b', name: "custom-footer" })), showControls && (index.h("footer", { key: 'e4a15ee635125e219a8437ee86a4a1e35736edac', class: "modal__controls" }, index.h("swirl-button-group", { key: '0fd1929c805d700d0694e517984d03193de657a4', wrap: true }, this.secondaryActionLabel && (index.h("swirl-button", { key: 'b0464799d74c4d8e6d98e5580a38a91be6432ac5', label: this.secondaryActionLabel, onClick: this.onSecondaryAction })), this.primaryActionLabel && (index.h("swirl-button", { key: '946a61eefefaa5a483e2de0e492dc3b741a38198', intent: "primary", label: this.primaryActionLabel, onClick: this.onPrimaryAction, variant: "flat" }))))))))));
273
+ } }, index.h("slot", { key: '91c1ac6a98a4f4bc34ad0c7bb933d39630e42cba', name: "secondary-content" }))), index.h("div", { key: 'dc07e671d85ec799067c91d08515df4b6dc5f8a3', class: "modal__custom-footer" }, index.h("slot", { key: '76064566c0e4cdcb636202b2a396c1f471547c8b', name: "custom-footer" })), showControls && (index.h("footer", { key: '5da26f5013227d82fdcbf4cc26a035bacfbbc56a', class: "modal__controls" }, index.h("swirl-button-group", { key: 'd52363233ed5e6cd395137adbd730181f10832a8', wrap: true }, this.secondaryActionLabel && (index.h("swirl-button", { key: '19056321ef209dc0161bb368e705cdaf75adf895', label: this.secondaryActionLabel, onClick: this.onSecondaryAction })), this.primaryActionLabel && (index.h("swirl-button", { key: 'fd0641ba559b5bc16215595aef5d4688fde76b4b', intent: "primary", label: this.primaryActionLabel, onClick: this.onPrimaryAction, variant: "flat" }))))))))));
270
274
  }
271
275
  get el() { return index.getElement(this); }
272
276
  };