npm - @salla.sa/twilight-components - Versions diffs - 2.14.442 → 2.14.443 - Mend

@@ -3,7 +3,7 @@
  */
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-const sallaProductCardEmbedCss = ":host(:has(.s-product-card-embed-card-align-left)){float:inline-start;max-width:12rem;margin-block-end:1em;margin-inline-end:1em;shape-outside:margin-box}:host(:has(.s-product-card-embed-card-align-right)){float:inline-end;max-width:12rem;margin-block-end:1em;margin-inline-start:1em;shape-outside:margin-box}:host(:has(.s-product-card-embed-card-align-center)){display:block;clear:both;max-width:12rem;margin-block:1em;margin-inline:auto}:host(:has(.s-product-card-embed-card-align-left)) .s-product-card-embed-card-align-left,:host(:has(.s-product-card-embed-card-align-right)) .s-product-card-embed-card-align-right{float:none}";
+const sallaProductCardEmbedCss = "@charset \"UTF-8\";:host{display:inline-block;vertical-align:top;max-width:12rem}:host([align=left]){float:inline-start;margin-block-end:1em;margin-inline-end:1em;shape-outside:margin-box}:host([align=right]){float:inline-end;margin-block-end:1em;margin-inline-start:1em;shape-outside:margin-box}:host([align=center]){display:block;clear:both;margin-block:1em;margin-inline:auto}.s-product-card-embed-card{display:block}";
 const SallaProductCardEmbed$1 = /*@__PURE__*/ proxyCustomElement(class SallaProductCardEmbed extends HTMLElement {
     constructor() {
@@ -17,9 +17,29 @@ const SallaProductCardEmbed$1 = /*@__PURE__*/ proxyCustomElement(class SallaProd
         await salla.onReady();
         await this.fetchProduct();
     }
+    componentDidLoad() {
+        this.ensureParentContainsFloats();
+    }
     componentDidRender() {
         this.renderCardNode();
     }
+    /**
+     * The host floats for `align="left"|"right"`. If the parent is a plain
+     * block element with visible overflow it won't contain those floats,
+     * letting them spill into following siblings (e.g. a comments section).
+     * Promote such parents to a block formatting context.
+     */
+    ensureParentContainsFloats() {
+        if (this.align !== 'left' && this.align !== 'right')
+            return;
+        const parent = this.hostEl?.parentElement;
+        if (!parent)
+            return;
+        const cs = getComputedStyle(parent);
+        if (cs.display === 'block' && cs.overflow === 'visible' && cs.float === 'none') {
+            parent.style.display = 'flow-root';
+        }
+    }
     fetchProduct() {
         if (!this.productId) {
             this.productData = null;
@@ -64,10 +84,11 @@ const SallaProductCardEmbed$1 = /*@__PURE__*/ proxyCustomElement(class SallaProd
             's-product-card-embed-card-align-right': this.align === 'right',
             's-product-card-embed-card-align-center': this.align === 'center',
         };
-        return (h(Host, { key: '77c85dadd3d886ab94323d5676b3a8135157352e' }, this.hasError && h("span", { key: 'ee80e9375cbdbc08546ae6ad0d1020b32a3dafc8', class: "s-product-card-embed-fallback" }), h("div", { key: '50e35de032d0d66f7772a8e44b5744587307795c', class: cardClasses, ref: (el) => {
+        return (h(Host, { key: '4fcd0b6e5da26ac976b0f3c5c031b614dc9d04b1' }, this.hasError && h("span", { key: '55b4a2649d4912b61f6b75e3c2437bfaee7863e0', class: "s-product-card-embed-fallback" }), h("div", { key: 'ac5882e5dd36ac28cc6e5a24186156c7cadda820', class: cardClasses, ref: (el) => {
                 this.cardContainer = el;
             } })));
     }
+    get hostEl() { return this; }
     static get style() { return sallaProductCardEmbedCss; }
 }, [0, "salla-product-card-embed", {
         "productId": [8, "product-id"],

@@ -1,7 +1,7 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { d as getDefaultExportFromCjs } from './index-CU41HKIU.js';
+import { d as getDefaultExportFromCjs } from './index-C1Q9TkIB.js';
 function _mergeNamespaces(n, m) {
     m.forEach(function (e) {

@@ -1,7 +1,7 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { d as getDefaultExportFromCjs } from './index-CU41HKIU.js';
+import { d as getDefaultExportFromCjs } from './index-C1Q9TkIB.js';
 function _mergeNamespaces(n, m) {
   m.forEach(function (e) {

@@ -1,7 +1,7 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { d as getDefaultExportFromCjs } from './index-CU41HKIU.js';
+import { d as getDefaultExportFromCjs } from './index-C1Q9TkIB.js';
 function _mergeNamespaces(n, m) {
     m.forEach(function (e) {

@@ -1,7 +1,7 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { d as getDefaultExportFromCjs } from './index-CU41HKIU.js';
+import { d as getDefaultExportFromCjs } from './index-C1Q9TkIB.js';
 function _mergeNamespaces(n, m) {
     m.forEach(function (e) {

@@ -1,7 +1,7 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { d as getDefaultExportFromCjs } from './index-CU41HKIU.js';
+import { d as getDefaultExportFromCjs } from './index-C1Q9TkIB.js';
 function _mergeNamespaces(n, m) {
   m.forEach(function (e) {

@@ -1,7 +1,7 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { h } from './index-CU41HKIU.js';
+import { h } from './index-C1Q9TkIB.js';
 function nearestLowerMultiple(number, multipleOf = window.matchMedia('(min-width: 768px)').matches ? 3 : 2) {
     return number < multipleOf ? number : number - (number % multipleOf);

@salla.sa/twilight-components 2.14.442 → 2.14.443