@orangelogic/design-system 2.147.0 → 2.148.0

package/library/components/masonry.js

@@ -114,7 +114,7 @@ let r = class extends w {
         return o`<div data-id=${t[this.idKey]} class=${h({
           "masonry-list__item": !0,
           "masonry-list__item--error": t.hasError ?? !1
-        })} part="item" @click=${i}><cx-image part="image" class="masonry-list__item__image" alt=${t.alt || ""} src=${t.src} object-fit=${t.objectFit || u.Cover} ?loading=${t.loading}></cx-image>${y(this.actions.length > 0, () => this.renderActions(t))}</div>`;
+        })} part="item" @click=${i}><cx-image part="image" class="masonry-list__item__image" alt=${t.alt || ""} src=${t.src} object-fit=${t.objectFit || u.Cover} ?loading=${t.loading} retry-on-error></cx-image>${y(this.actions.length > 0, () => this.renderActions(t))}</div>`;
       }
     )}</div>`;
   }

package/library/components/types.js

@@ -5589,7 +5589,7 @@ let ro = class extends ui {
   }
   renderAssetPreview() {
     if ((this.previewSrc || this.value) && this.acceptsType(gl.Image))
-      return P`<cx-image part="image" class="asset-picker__image" src=${this.previewSrc || this.value} alt=${this.assetTitle} width="200px" object-fit=${Ao.Cover}></cx-image>`;
+      return P`<cx-image part="image" class="asset-picker__image" src=${this.previewSrc || this.value} alt=${this.assetTitle} width="200px" object-fit=${Ao.Cover} retry-on-error></cx-image>`;
     if (this.assetTitle && (this.acceptsType(gl.Audio) || this.acceptsType(gl.Video)))
       return P`<cx-typography variant="body-2">${Z1(this.assetTitle, 30, 11, 11)}</cx-typography>`;
     if (this.assetTitle && (this.acceptsType(gl.Other) || this.acceptsType(gl.All))) {
@@ -138565,7 +138565,7 @@ let Ss = class extends ui {
           </cx-checkbox></cx-space><cx-space wrap="nowrap" direction="vertical" class="image-dialog__col" spacing="x-small"><cx-typography variant="body2">${this.localize.term("preview")}</cx-typography><div class="image-container"><cx-image part="image" class=${Lt({
       image: !0,
       "undefined-src": this.isValidSrc === void 0
-    })} src=${this.data.src || ""} width="100%" height="100%" height-mode=${this.data.keepRatio ? Xn.Auto : Xn.Fixed} @cx-load=${this.handleImageLoad}></cx-image></div><cx-typography variant="body3">
+    })} src=${this.data.src || ""} width="100%" height="100%" height-mode=${this.data.keepRatio ? Xn.Auto : Xn.Fixed} retry-on-error @cx-load=${this.handleImageLoad}></cx-image></div><cx-typography variant="body3">
             In editor, drag image to reposition
           </cx-typography><cx-typography variant="body3">
             Click on image to enable image resizer

package/library/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@orangelogic/design-system",
   "type": "module",
-  "version": "2.147.0",
+  "version": "2.148.0",
   "license": "UNLICENSED",
   "types": "library/types.d.ts",
   "scripts": {

package/library/packages/atoms/src/components/image/image.d.ts

@@ -61,7 +61,7 @@ export default class CxImage extends ResizableElement {
     /** True while a load has failed and a retry is scheduled or in-flight (retry-on-error only). */
     isRetrying: boolean;
     /** Incremented on each retry attempt to force the img element to remount via keyed(). */
-    private retryIndex;
+    protected retryIndex: number;
     /**
      * The path to the image to load.
      */

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@orangelogic/design-system",
   "type": "module",
-  "version": "2.147.0",
+  "version": "2.148.0",
   "license": "UNLICENSED",
   "types": "library/types.d.ts",
   "scripts": {