scb-wc-test 0.1.305 → 0.1.306

package/mvc/components/scb-drop-zone/scb-drop-zone.js

@@ -491,7 +491,7 @@ import{a as u,n as o,r as c,i as b,x as p,t as f}from"../../vendor/vendor.js";im
 
     .scb-drop-zone__selected-images {
       display: grid;
-      grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
+      grid-template-columns: repeat(4, minmax(180px, 1fr));
       gap: var(--spacing-3, 8px);
       margin-top: var(--spacing-4, 12px);
     }
@@ -538,9 +538,25 @@ import{a as u,n as o,r as c,i as b,x as p,t as f}from"../../vendor/vendor.js";im
       justify-self: end;
     }
 
+    @media (max-width: 1280px) {
+      .scb-drop-zone__selected-images {
+        grid-template-columns: repeat(3, minmax(180px, 1fr));
+      }
+    }
+
     @media (max-width: 900px) {
       .scb-drop-zone__layout--with-preview {
         grid-template-columns: 1fr;
       }
+
+      .scb-drop-zone__selected-images {
+        grid-template-columns: repeat(2, minmax(180px, 1fr));
+      }
+    }
+
+    @media (max-width: 640px) {
+      .scb-drop-zone__selected-images {
+        grid-template-columns: 1fr;
+      }
     }
   `;a([o({type:String,reflect:!0})],s.prototype,"type",2);a([o({type:String})],s.prototype,"name",2);a([o({type:Boolean,reflect:!0})],s.prototype,"multiple",2);a([o({type:String})],s.prototype,"label",2);a([o({type:String,attribute:"supporting-text"})],s.prototype,"supportingText",2);a([o({type:String,attribute:"meta-text"})],s.prototype,"metaText",2);a([o({type:String,attribute:"button-label"})],s.prototype,"buttonLabel",2);a([o({type:String,attribute:"replace-button-label"})],s.prototype,"replaceButtonLabel",2);a([o({type:String,attribute:"remove-button-label"})],s.prototype,"removeButtonLabel",2);a([o({type:String,attribute:"preview-eyebrow"})],s.prototype,"previewEyebrow",2);a([o({type:String,attribute:"empty-preview-title"})],s.prototype,"emptyPreviewTitle",2);a([o({type:String,attribute:"empty-preview-meta"})],s.prototype,"emptyPreviewMeta",2);a([o({type:String})],s.prototype,"accept",2);a([o({type:Boolean,attribute:"show-preview",reflect:!0})],s.prototype,"showPreview",2);a([o({type:Boolean,reflect:!0})],s.prototype,"disabled",2);a([o({type:String,attribute:!1})],s.prototype,"previewSrc",2);a([o({type:String,attribute:"default-image-src"})],s.prototype,"defaultImageSrc",2);a([o({type:String,attribute:!1})],s.prototype,"previewAlt",2);a([o({type:String,attribute:!1})],s.prototype,"previewTitle",2);a([o({type:String,attribute:!1})],s.prototype,"previewMeta",2);a([c()],s.prototype,"_isDragOver",2);a([c()],s.prototype,"_selectedPreviewKind",2);a([c()],s.prototype,"_selectedPreviewSrc",2);a([c()],s.prototype,"_selectedPreviewAlt",2);a([c()],s.prototype,"_selectedPreviewTitle",2);a([c()],s.prototype,"_selectedPreviewMeta",2);a([c()],s.prototype,"_selectedPreviewItems",2);s=a([f("scb-drop-zone")],s);

package/package.json

@@ -1,6 +1,6 @@
 {
     "name":  "scb-wc-test",
-    "version":  "0.1.305",
+    "version":  "0.1.306",
     "type":  "module",
     "main":  "index.js",
     "module":  "index.js",
@@ -386,5 +386,5 @@
                                   },
                     "./mvc/*":  "./mvc/*"
                 },
-    "buildHash":  "B2BD4FEBF4D08D675DCB573060FB3990016B7BABC7AB289D25B13A4762AFFE9A"
+    "buildHash":  "EE33DC5DD3A13BF0D2FCE29DE42193B3405EE2E5DC2C1662A4A05D9499E8220E"
 }

package/scb-drop-zone/scb-drop-zone.js

@@ -798,7 +798,7 @@ s.styles = u`
 
     .scb-drop-zone__selected-images {
       display: grid;
-      grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
+      grid-template-columns: repeat(4, minmax(180px, 1fr));
       gap: var(--spacing-3, 8px);
       margin-top: var(--spacing-4, 12px);
     }
@@ -845,10 +845,26 @@ s.styles = u`
       justify-self: end;
     }
 
+    @media (max-width: 1280px) {
+      .scb-drop-zone__selected-images {
+        grid-template-columns: repeat(3, minmax(180px, 1fr));
+      }
+    }
+
     @media (max-width: 900px) {
       .scb-drop-zone__layout--with-preview {
         grid-template-columns: 1fr;
       }
+
+      .scb-drop-zone__selected-images {
+        grid-template-columns: repeat(2, minmax(180px, 1fr));
+      }
+    }
+
+    @media (max-width: 640px) {
+      .scb-drop-zone__selected-images {
+        grid-template-columns: 1fr;
+      }
     }
   `;
 a([

package/scb-wc-test.bundle.js

@@ -7278,7 +7278,7 @@
 
     .scb-drop-zone__selected-images {
       display: grid;
-      grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
+      grid-template-columns: repeat(4, minmax(180px, 1fr));
       gap: var(--spacing-3, 8px);
       margin-top: var(--spacing-4, 12px);
     }
@@ -7325,10 +7325,26 @@
       justify-self: end;
     }
 
+    @media (max-width: 1280px) {
+      .scb-drop-zone__selected-images {
+        grid-template-columns: repeat(3, minmax(180px, 1fr));
+      }
+    }
+
     @media (max-width: 900px) {
       .scb-drop-zone__layout--with-preview {
         grid-template-columns: 1fr;
       }
+
+      .scb-drop-zone__selected-images {
+        grid-template-columns: repeat(2, minmax(180px, 1fr));
+      }
+    }
+
+    @media (max-width: 640px) {
+      .scb-drop-zone__selected-images {
+        grid-template-columns: 1fr;
+      }
     }
   `,X([o({type:String,reflect:!0})],q.prototype,"type",2),X([o({type:String})],q.prototype,"name",2),X([o({type:Boolean,reflect:!0})],q.prototype,"multiple",2),X([o({type:String})],q.prototype,"label",2),X([o({type:String,attribute:"supporting-text"})],q.prototype,"supportingText",2),X([o({type:String,attribute:"meta-text"})],q.prototype,"metaText",2),X([o({type:String,attribute:"button-label"})],q.prototype,"buttonLabel",2),X([o({type:String,attribute:"replace-button-label"})],q.prototype,"replaceButtonLabel",2),X([o({type:String,attribute:"remove-button-label"})],q.prototype,"removeButtonLabel",2),X([o({type:String,attribute:"preview-eyebrow"})],q.prototype,"previewEyebrow",2),X([o({type:String,attribute:"empty-preview-title"})],q.prototype,"emptyPreviewTitle",2),X([o({type:String,attribute:"empty-preview-meta"})],q.prototype,"emptyPreviewMeta",2),X([o({type:String})],q.prototype,"accept",2),X([o({type:Boolean,attribute:"show-preview",reflect:!0})],q.prototype,"showPreview",2),X([o({type:Boolean,reflect:!0})],q.prototype,"disabled",2),X([o({type:String,attribute:!1})],q.prototype,"previewSrc",2),X([o({type:String,attribute:"default-image-src"})],q.prototype,"defaultImageSrc",2),X([o({type:String,attribute:!1})],q.prototype,"previewAlt",2),X([o({type:String,attribute:!1})],q.prototype,"previewTitle",2),X([o({type:String,attribute:!1})],q.prototype,"previewMeta",2),X([T()],q.prototype,"_isDragOver",2),X([T()],q.prototype,"_selectedPreviewKind",2),X([T()],q.prototype,"_selectedPreviewSrc",2),X([T()],q.prototype,"_selectedPreviewAlt",2),X([T()],q.prototype,"_selectedPreviewTitle",2),X([T()],q.prototype,"_selectedPreviewMeta",2),X([T()],q.prototype,"_selectedPreviewItems",2),q=X([_("scb-drop-zone")],q);var ff=Object.defineProperty,gf=Object.getOwnPropertyDescriptor,Ki=(e,t,i,s)=>{for(var r=s>1?void 0:s?gf(t,i):t,a=e.length-1,n;a>=0;a--)(n=e[a])&&(r=(s?n(t,i,r):n(r))||r);return s&&r&&ff(t,i,r),r};let hi=class extends w{constructor(){super(...arguments),this.label="",this.hasSubMenu=!1,this.openLeft=!1,this.divider=!1,this.leadingIcon="",this.trailingIcon="",this.itemHref="",this.href="",this._observedSubMenu=null,this._syncSubMenuFlags=()=>{var r;const e=this.nextElementSibling,t=!!(e&&e.tagName==="SCB-OPTIONS-SUB-MENU"),i=!!(t&&e.hasAttribute("open-left"));t!==this.hasSubMenu&&(this.hasSubMenu=t),i!==this.openLeft&&(this.openLeft=i);const s=t?e:null;s!==this._observedSubMenu&&((r=this._subMenuAttrObserver)==null||r.disconnect(),this._subMenuAttrObserver=void 0,this._observedSubMenu=s,s&&(this._subMenuAttrObserver=new MutationObserver(()=>this._syncSubMenuFlags()),this._subMenuAttrObserver.observe(s,{attributes:!0,attributeFilter:["open-left"]})))},this.handleClick=e=>{this._effectiveHref?this._navigateToHref(e):this._toggleSubMenu()},this._onBlur=e=>{const t=this.closest("scb-options-sub-menu");if(t&&t.open){const i=e.relatedTarget;(!i||!t.contains(i))&&(t.dispatchEvent(new CustomEvent("hide-submenu",{bubbles:!0,composed:!0})),t.dispatchEvent(new CustomEvent("hidesubmenu",{bubbles:!0,composed:!0})))}},this._onFocus=()=>{const e=this.nextElementSibling;this.classList.contains("open-submenu")&&(e&&e.tagName==="SCB-OPTIONS-SUB-MENU"&&e.hasAttribute("open")||this.classList.remove("open-submenu"))},this._onKeyDown=e=>{var t,i,s,r,a,n;if(e.key==="Enter"||e.key===" "){e.preventDefault(),this.handleClick(e);return}if(e.key==="ArrowDown"){e.preventDefault();let l=this.nextElementSibling;for(;l&&l.tagName!=="SCB-OPTIONS-MENU-ITEM";)l=l.nextElementSibling;l&&((i=(t=l.shadowRoot)==null?void 0:t.querySelector("li"))==null||i.focus());return}if(e.key==="ArrowUp"){e.preventDefault();let l=this.previousElementSibling;for(;l&&l.tagName!=="SCB-OPTIONS-MENU-ITEM";)l=l.previousElementSibling;l&&((r=(s=l.shadowRoot)==null?void 0:s.querySelector("li"))==null||r.focus());return}if(e.key==="ArrowRight"){e.preventDefault();const l=this.nextElementSibling;l&&l.tagName==="SCB-OPTIONS-SUB-MENU"&&(l.hasAttribute("open")||(this._toggleSubMenu(),l.dispatchEvent(new CustomEvent("show-submenu",{bubbles:!0,composed:!0})),l.dispatchEvent(new CustomEvent("showsubmenu",{bubbles:!0,composed:!0}))),setTimeout(()=>{var p,b;const d=l.querySelector("scb-options-menu-item");d&&((b=(p=d.shadowRoot)==null?void 0:p.querySelector("li"))==null||b.focus())},0));return}if(e.key==="ArrowLeft"){e.preventDefault();const l=this.nextElementSibling;if(l&&l.tagName==="SCB-OPTIONS-SUB-MENU"&&l.hasAttribute("open")){this._toggleSubMenu(),l.dispatchEvent(new CustomEvent("hide-submenu",{bubbles:!0,composed:!0})),l.dispatchEvent(new CustomEvent("hidesubmenu",{bubbles:!0,composed:!0}));return}const d=this.closest("scb-options-sub-menu");if(d){const p=d.previousElementSibling;p&&p.tagName==="SCB-OPTIONS-MENU-ITEM"&&((n=(a=p.shadowRoot)==null?void 0:a.querySelector("li"))==null||n.focus())}return}}}get _effectiveHref(){return this.itemHref||this.href}connectedCallback(){super.connectedCallback(),this._syncSubMenuFlags(),this._subMenuChildObserver??(this._subMenuChildObserver=new MutationObserver(()=>this._syncSubMenuFlags())),this._subMenuChildObserver.disconnect();const e=this.parentElement;e&&this._subMenuChildObserver.observe(e,{childList:!0})}disconnectedCallback(){var e,t;(e=this._subMenuChildObserver)==null||e.disconnect(),(t=this._subMenuAttrObserver)==null||t.disconnect(),this._subMenuChildObserver=void 0,this._subMenuAttrObserver=void 0,this._observedSubMenu=null,super.disconnectedCallback()}render(){return c`
       ${this.divider?c`<scb-divider></scb-divider>`:""}