@spectrum-web-components/thumbnail - npm Package Compare versions

Comparing version 0.1.6-alpha.27 to 0.2.0

CHANGELOG.md

@@ -6,2 +6,8 @@ # Change Log
 
+# [0.2.0](https://github.com/adobe/spectrum-web-components/compare/@spectrum-web-components/thumbnail@0.1.5...@spectrum-web-components/thumbnail@0.2.0) (2021-06-07)
+
+### Features
+
+-   **tabs:** add sp-tab-panel element ([b17d276](https://github.com/adobe/spectrum-web-components/commit/b17d2765cf415578a31e5fa23515c25ff4c3922d))
+
 ## [0.1.5](https://github.com/adobe/spectrum-web-components/compare/@spectrum-web-components/thumbnail@0.1.4...@spectrum-web-components/thumbnail@0.1.5) (2021-05-12)
@@ -8,0 +14,0 @@

package.json

 {
     "name": "@spectrum-web-components/thumbnail",
-    "version": "0.1.6-alpha.27+24b598bc7",
+    "version": "0.2.0",
     "publishConfig": {
@@ -46,3 +46,3 @@ "access": "public"
     "dependencies": {
-        "@spectrum-web-components/base": "^0.4.4-alpha.101+24b598bc7",
+        "@spectrum-web-components/base": "^0.4.3",
         "tslib": "^2.0.0"
@@ -59,3 +59,3 @@ },
     ],
-    "gitHead": "24b598bc7c57c7f279c8957abbc0b0827ecd7089"
+    "gitHead": "b425768aaf694ab19ddad4fcab9939c29a2a503b"
 }

src/spectrum-thumbnail.css.d.ts

@@ -1,2 +0,2 @@
-declare const styles: import("@spectrum-web-components/base").CSSResultGroup;
+declare const styles: import("@spectrum-web-components/base").CSSResult;
 export default styles;

src/spectrum-thumbnail.css.js

@@ -14,5 +14,5 @@ /*
 const styles = css `
-:host{--spectrum-thumbnail-border-radius:var(--spectrum-alias-border-radius-small,var(--spectrum-global-dimension-size-25));--spectrum-thumbnail-size-S:var(--spectrum-global-dimension-size-300);--spectrum-thumbnail-size-M:var(--spectrum-global-dimension-size-400);--spectrum-thumbnail-size-L:var(--spectrum-global-dimension-size-500);--spectrum-thumbnail-size-XL:var(--spectrum-global-dimension-size-600);--spectrum-thumbnail-size-XXL:var(--spectrum-global-dimension-size-700);position:relative;margin:0;padding:0;display:flex;align-items:center;justify-content:center;width:var(--spectrum-thumbnail-size-M);height:var(--spectrum-thumbnail-size-M);vertical-align:top;overflow:hidden;background-size:var(--spectrum-global-dimension-static-size-200,16px) var(--spectrum-global-dimension-static-size-200,16px);background-position:0 0,0 var(--spectrum-global-dimension-static-size-100,8px),var(--spectrum-global-dimension-static-size-100,8px) calc(-1*var(--spectrum-global-dimension-static-size-100, 8px)),calc(-1*var(--spectrum-global-dimension-static-size-100, 8px)) 0}:host,:host:before{border-radius:var(--spectrum-thumbnail-border-radius)}:host:before{content:"";z-index:2;position:absolute;width:100%;height:100%}:host([size=s]){width:var(--spectrum-thumbnail-size-S);height:var(--spectrum-thumbnail-size-S)}:host([size=m]){width:var(--spectrum-thumbnail-size-M);height:var(--spectrum-thumbnail-size-M)}:host([size=l]){width:var(--spectrum-thumbnail-size-L);height:var(--spectrum-thumbnail-size-L)}:host([size=xl]){width:var(--spectrum-thumbnail-size-XL);height:var(--spectrum-thumbnail-size-XL)}:host([size=xxl]){width:var(--spectrum-thumbnail-size-XXL);height:var(--spectrum-thumbnail-size-XXL)}::slotted(*){max-height:100%;max-width:100%;z-index:1}.background{position:absolute;z-index:0;left:0;top:0;right:0;bottom:0;height:100%;width:100%;background-size:cover;background-position:50%}:host{--spectrum-thumbnail-border-size:var(--spectrum-alias-border-size-thin,var(--spectrum-global-dimension-static-size-10));--spectrum-thumbnail-border-size-selected:var(--spectrum-alias-border-size-thick,var(--spectrum-global-dimension-static-size-25));--spectrum-thumbnail-border-size-focus:var(--spectrum-alias-border-size-thick,var(--spectrum-global-dimension-static-size-25));--spectrum-thumbnail-border-color:var(--spectrum-alias-dropshadow-color);--spectrum-thumbnail-border-color-focus:var(--spectrum-alias-border-color-focus,var(--spectrum-global-color-blue-400));--spectrum-thumbnail-border-color-selected:var(--spectrum-global-color-blue-500);background-color:var(--spectrum-global-color-static-white,#fff);background-image:linear-gradient(-45deg,transparent 75.5%,var(--spectrum-global-color-static-gray-500,#bcbcbc) 0),linear-gradient(45deg,transparent 75.5%,var(--spectrum-global-color-static-gray-500,#bcbcbc) 0),linear-gradient(-45deg,var(--spectrum-global-color-static-gray-500,#bcbcbc) 25.5%,transparent 0),linear-gradient(45deg,var(--spectrum-global-color-static-gray-500,#bcbcbc) 25.5%,transparent 0)}:host:before{box-shadow:inset 0 0 0 var(--spectrum-thumbnail-border-size) var(--spectrum-thumbnail-border-color)}:host([selected]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host([selected]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host(.focus-visible),:host(.focus-visible),:host([focused]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-focus)/2) var(--spectrum-thumbnail-border-color-focus)}:host(.focus-visible),:host(:focus-visible),:host([focused]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-focus)/2) var(--spectrum-thumbnail-border-color-focus)}:host(.focus-visible):before,:host(.focus-visible):before,:host([focused]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host(.focus-visible):before,:host(:focus-visible):before,:host([focused]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}
+:host{--spectrum-thumbnail-border-radius:var(--spectrum-alias-border-radius-small,var(--spectrum-global-dimension-size-25));--spectrum-thumbnail-size-S:var(--spectrum-global-dimension-size-300);--spectrum-thumbnail-size-M:var(--spectrum-global-dimension-size-400);--spectrum-thumbnail-size-L:var(--spectrum-global-dimension-size-500);--spectrum-thumbnail-size-XL:var(--spectrum-global-dimension-size-600);--spectrum-thumbnail-size-XXL:var(--spectrum-global-dimension-size-700);position:relative;margin:0;padding:0;display:flex;align-items:center;justify-content:center;width:var(--spectrum-thumbnail-size-M);height:var(--spectrum-thumbnail-size-M);border-radius:var(--spectrum-thumbnail-border-radius);vertical-align:top;overflow:hidden;background-size:var(--spectrum-global-dimension-static-size-200,16px) var(--spectrum-global-dimension-static-size-200,16px);background-position:0 0,0 var(--spectrum-global-dimension-static-size-100,8px),var(--spectrum-global-dimension-static-size-100,8px) calc(-1*var(--spectrum-global-dimension-static-size-100, 8px)),calc(-1*var(--spectrum-global-dimension-static-size-100, 8px)) 0}:host:before{content:"";z-index:2;position:absolute;width:100%;height:100%;border-radius:var(--spectrum-thumbnail-border-radius)}:host([size=s]){width:var(--spectrum-thumbnail-size-S);height:var(--spectrum-thumbnail-size-S)}:host([size=m]){width:var(--spectrum-thumbnail-size-M);height:var(--spectrum-thumbnail-size-M)}:host([size=l]){width:var(--spectrum-thumbnail-size-L);height:var(--spectrum-thumbnail-size-L)}:host([size=xl]){width:var(--spectrum-thumbnail-size-XL);height:var(--spectrum-thumbnail-size-XL)}:host([size=xxl]){width:var(--spectrum-thumbnail-size-XXL);height:var(--spectrum-thumbnail-size-XXL)}::slotted(*){max-height:100%;max-width:100%;z-index:1}.background{position:absolute;z-index:0;left:0;top:0;right:0;bottom:0;height:100%;width:100%;background-size:cover;background-position:50%}:host{--spectrum-thumbnail-border-size:var(--spectrum-alias-border-size-thin,var(--spectrum-global-dimension-static-size-10));--spectrum-thumbnail-border-size-selected:var(--spectrum-alias-border-size-thick,var(--spectrum-global-dimension-static-size-25));--spectrum-thumbnail-border-size-focus:var(--spectrum-alias-border-size-thick,var(--spectrum-global-dimension-static-size-25));--spectrum-thumbnail-border-color:var(--spectrum-alias-dropshadow-color);--spectrum-thumbnail-border-color-focus:var(--spectrum-alias-border-color-focus,var(--spectrum-global-color-blue-400));--spectrum-thumbnail-border-color-selected:var(--spectrum-global-color-blue-500);background-color:var(--spectrum-global-color-static-white,#fff);background-image:linear-gradient(-45deg,transparent 75.5%,var(--spectrum-global-color-static-gray-500,#bcbcbc) 0),linear-gradient(45deg,transparent 75.5%,var(--spectrum-global-color-static-gray-500,#bcbcbc) 0),linear-gradient(-45deg,var(--spectrum-global-color-static-gray-500,#bcbcbc) 25.5%,transparent 0),linear-gradient(45deg,var(--spectrum-global-color-static-gray-500,#bcbcbc) 25.5%,transparent 0)}:host:before{box-shadow:inset 0 0 0 var(--spectrum-thumbnail-border-size) var(--spectrum-thumbnail-border-color)}:host([selected]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host([selected]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host(.focus-visible),:host([focused]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-focus)/2) var(--spectrum-thumbnail-border-color-focus)}:host(.focus-visible),:host([focused]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-focus)/2) var(--spectrum-thumbnail-border-color-focus)}:host(:focus-visible),:host([focused]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-focus)/2) var(--spectrum-thumbnail-border-color-focus)}:host(.focus-visible):before,:host([focused]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host(.focus-visible):before,:host([focused]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host(:focus-visible):before,:host([focused]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}
 `;
 export default styles;
 //# sourceMappingURL=spectrum-thumbnail.css.js.map

src/spectrum-thumbnail.css.ts

@@ -14,4 +14,4 @@ /*
 const styles = css`
-:host{--spectrum-thumbnail-border-radius:var(--spectrum-alias-border-radius-small,var(--spectrum-global-dimension-size-25));--spectrum-thumbnail-size-S:var(--spectrum-global-dimension-size-300);--spectrum-thumbnail-size-M:var(--spectrum-global-dimension-size-400);--spectrum-thumbnail-size-L:var(--spectrum-global-dimension-size-500);--spectrum-thumbnail-size-XL:var(--spectrum-global-dimension-size-600);--spectrum-thumbnail-size-XXL:var(--spectrum-global-dimension-size-700);position:relative;margin:0;padding:0;display:flex;align-items:center;justify-content:center;width:var(--spectrum-thumbnail-size-M);height:var(--spectrum-thumbnail-size-M);vertical-align:top;overflow:hidden;background-size:var(--spectrum-global-dimension-static-size-200,16px) var(--spectrum-global-dimension-static-size-200,16px);background-position:0 0,0 var(--spectrum-global-dimension-static-size-100,8px),var(--spectrum-global-dimension-static-size-100,8px) calc(-1*var(--spectrum-global-dimension-static-size-100, 8px)),calc(-1*var(--spectrum-global-dimension-static-size-100, 8px)) 0}:host,:host:before{border-radius:var(--spectrum-thumbnail-border-radius)}:host:before{content:"";z-index:2;position:absolute;width:100%;height:100%}:host([size=s]){width:var(--spectrum-thumbnail-size-S);height:var(--spectrum-thumbnail-size-S)}:host([size=m]){width:var(--spectrum-thumbnail-size-M);height:var(--spectrum-thumbnail-size-M)}:host([size=l]){width:var(--spectrum-thumbnail-size-L);height:var(--spectrum-thumbnail-size-L)}:host([size=xl]){width:var(--spectrum-thumbnail-size-XL);height:var(--spectrum-thumbnail-size-XL)}:host([size=xxl]){width:var(--spectrum-thumbnail-size-XXL);height:var(--spectrum-thumbnail-size-XXL)}::slotted(*){max-height:100%;max-width:100%;z-index:1}.background{position:absolute;z-index:0;left:0;top:0;right:0;bottom:0;height:100%;width:100%;background-size:cover;background-position:50%}:host{--spectrum-thumbnail-border-size:var(--spectrum-alias-border-size-thin,var(--spectrum-global-dimension-static-size-10));--spectrum-thumbnail-border-size-selected:var(--spectrum-alias-border-size-thick,var(--spectrum-global-dimension-static-size-25));--spectrum-thumbnail-border-size-focus:var(--spectrum-alias-border-size-thick,var(--spectrum-global-dimension-static-size-25));--spectrum-thumbnail-border-color:var(--spectrum-alias-dropshadow-color);--spectrum-thumbnail-border-color-focus:var(--spectrum-alias-border-color-focus,var(--spectrum-global-color-blue-400));--spectrum-thumbnail-border-color-selected:var(--spectrum-global-color-blue-500);background-color:var(--spectrum-global-color-static-white,#fff);background-image:linear-gradient(-45deg,transparent 75.5%,var(--spectrum-global-color-static-gray-500,#bcbcbc) 0),linear-gradient(45deg,transparent 75.5%,var(--spectrum-global-color-static-gray-500,#bcbcbc) 0),linear-gradient(-45deg,var(--spectrum-global-color-static-gray-500,#bcbcbc) 25.5%,transparent 0),linear-gradient(45deg,var(--spectrum-global-color-static-gray-500,#bcbcbc) 25.5%,transparent 0)}:host:before{box-shadow:inset 0 0 0 var(--spectrum-thumbnail-border-size) var(--spectrum-thumbnail-border-color)}:host([selected]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host([selected]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host(.focus-visible),:host(.focus-visible),:host([focused]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-focus)/2) var(--spectrum-thumbnail-border-color-focus)}:host(.focus-visible),:host(:focus-visible),:host([focused]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-focus)/2) var(--spectrum-thumbnail-border-color-focus)}:host(.focus-visible):before,:host(.focus-visible):before,:host([focused]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host(.focus-visible):before,:host(:focus-visible):before,:host([focused]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}
+:host{--spectrum-thumbnail-border-radius:var(--spectrum-alias-border-radius-small,var(--spectrum-global-dimension-size-25));--spectrum-thumbnail-size-S:var(--spectrum-global-dimension-size-300);--spectrum-thumbnail-size-M:var(--spectrum-global-dimension-size-400);--spectrum-thumbnail-size-L:var(--spectrum-global-dimension-size-500);--spectrum-thumbnail-size-XL:var(--spectrum-global-dimension-size-600);--spectrum-thumbnail-size-XXL:var(--spectrum-global-dimension-size-700);position:relative;margin:0;padding:0;display:flex;align-items:center;justify-content:center;width:var(--spectrum-thumbnail-size-M);height:var(--spectrum-thumbnail-size-M);border-radius:var(--spectrum-thumbnail-border-radius);vertical-align:top;overflow:hidden;background-size:var(--spectrum-global-dimension-static-size-200,16px) var(--spectrum-global-dimension-static-size-200,16px);background-position:0 0,0 var(--spectrum-global-dimension-static-size-100,8px),var(--spectrum-global-dimension-static-size-100,8px) calc(-1*var(--spectrum-global-dimension-static-size-100, 8px)),calc(-1*var(--spectrum-global-dimension-static-size-100, 8px)) 0}:host:before{content:"";z-index:2;position:absolute;width:100%;height:100%;border-radius:var(--spectrum-thumbnail-border-radius)}:host([size=s]){width:var(--spectrum-thumbnail-size-S);height:var(--spectrum-thumbnail-size-S)}:host([size=m]){width:var(--spectrum-thumbnail-size-M);height:var(--spectrum-thumbnail-size-M)}:host([size=l]){width:var(--spectrum-thumbnail-size-L);height:var(--spectrum-thumbnail-size-L)}:host([size=xl]){width:var(--spectrum-thumbnail-size-XL);height:var(--spectrum-thumbnail-size-XL)}:host([size=xxl]){width:var(--spectrum-thumbnail-size-XXL);height:var(--spectrum-thumbnail-size-XXL)}::slotted(*){max-height:100%;max-width:100%;z-index:1}.background{position:absolute;z-index:0;left:0;top:0;right:0;bottom:0;height:100%;width:100%;background-size:cover;background-position:50%}:host{--spectrum-thumbnail-border-size:var(--spectrum-alias-border-size-thin,var(--spectrum-global-dimension-static-size-10));--spectrum-thumbnail-border-size-selected:var(--spectrum-alias-border-size-thick,var(--spectrum-global-dimension-static-size-25));--spectrum-thumbnail-border-size-focus:var(--spectrum-alias-border-size-thick,var(--spectrum-global-dimension-static-size-25));--spectrum-thumbnail-border-color:var(--spectrum-alias-dropshadow-color);--spectrum-thumbnail-border-color-focus:var(--spectrum-alias-border-color-focus,var(--spectrum-global-color-blue-400));--spectrum-thumbnail-border-color-selected:var(--spectrum-global-color-blue-500);background-color:var(--spectrum-global-color-static-white,#fff);background-image:linear-gradient(-45deg,transparent 75.5%,var(--spectrum-global-color-static-gray-500,#bcbcbc) 0),linear-gradient(45deg,transparent 75.5%,var(--spectrum-global-color-static-gray-500,#bcbcbc) 0),linear-gradient(-45deg,var(--spectrum-global-color-static-gray-500,#bcbcbc) 25.5%,transparent 0),linear-gradient(45deg,var(--spectrum-global-color-static-gray-500,#bcbcbc) 25.5%,transparent 0)}:host:before{box-shadow:inset 0 0 0 var(--spectrum-thumbnail-border-size) var(--spectrum-thumbnail-border-color)}:host([selected]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host([selected]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host(.focus-visible),:host([focused]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-focus)/2) var(--spectrum-thumbnail-border-color-focus)}:host(.focus-visible),:host([focused]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-focus)/2) var(--spectrum-thumbnail-border-color-focus)}:host(:focus-visible),:host([focused]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-focus)/2) var(--spectrum-thumbnail-border-color-focus)}:host(.focus-visible):before,:host([focused]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host(.focus-visible):before,:host([focused]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host(:focus-visible):before,:host([focused]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}
 `;
 export default styles;

src/thumbnail.css.d.ts

@@ -1,2 +0,2 @@
-declare const styles: import("@spectrum-web-components/base").CSSResultGroup;
+declare const styles: import("@spectrum-web-components/base").CSSResult;
 export default styles;

src/thumbnail.css.js

@@ -14,5 +14,5 @@ /*
 const styles = css `
-:host{--spectrum-thumbnail-border-radius:var(--spectrum-alias-border-radius-small,var(--spectrum-global-dimension-size-25));--spectrum-thumbnail-size-S:var(--spectrum-global-dimension-size-300);--spectrum-thumbnail-size-M:var(--spectrum-global-dimension-size-400);--spectrum-thumbnail-size-L:var(--spectrum-global-dimension-size-500);--spectrum-thumbnail-size-XL:var(--spectrum-global-dimension-size-600);--spectrum-thumbnail-size-XXL:var(--spectrum-global-dimension-size-700);position:relative;margin:0;padding:0;display:flex;align-items:center;justify-content:center;width:var(--spectrum-thumbnail-size-M);height:var(--spectrum-thumbnail-size-M);vertical-align:top;overflow:hidden;background-size:var(--spectrum-global-dimension-static-size-200,16px) var(--spectrum-global-dimension-static-size-200,16px);background-position:0 0,0 var(--spectrum-global-dimension-static-size-100,8px),var(--spectrum-global-dimension-static-size-100,8px) calc(-1*var(--spectrum-global-dimension-static-size-100, 8px)),calc(-1*var(--spectrum-global-dimension-static-size-100, 8px)) 0}:host,:host:before{border-radius:var(--spectrum-thumbnail-border-radius)}:host:before{content:"";z-index:2;position:absolute;width:100%;height:100%}:host([size=s]){width:var(--spectrum-thumbnail-size-S);height:var(--spectrum-thumbnail-size-S)}:host([size=m]){width:var(--spectrum-thumbnail-size-M);height:var(--spectrum-thumbnail-size-M)}:host([size=l]){width:var(--spectrum-thumbnail-size-L);height:var(--spectrum-thumbnail-size-L)}:host([size=xl]){width:var(--spectrum-thumbnail-size-XL);height:var(--spectrum-thumbnail-size-XL)}:host([size=xxl]){width:var(--spectrum-thumbnail-size-XXL);height:var(--spectrum-thumbnail-size-XXL)}::slotted(*){max-height:100%;max-width:100%;z-index:1}.background{position:absolute;z-index:0;left:0;top:0;right:0;bottom:0;height:100%;width:100%;background-size:cover;background-position:50%}:host{--spectrum-thumbnail-border-size:var(--spectrum-alias-border-size-thin,var(--spectrum-global-dimension-static-size-10));--spectrum-thumbnail-border-size-selected:var(--spectrum-alias-border-size-thick,var(--spectrum-global-dimension-static-size-25));--spectrum-thumbnail-border-size-focus:var(--spectrum-alias-border-size-thick,var(--spectrum-global-dimension-static-size-25));--spectrum-thumbnail-border-color:var(--spectrum-alias-dropshadow-color);--spectrum-thumbnail-border-color-focus:var(--spectrum-alias-border-color-focus,var(--spectrum-global-color-blue-400));--spectrum-thumbnail-border-color-selected:var(--spectrum-global-color-blue-500);background-color:var(--spectrum-global-color-static-white,#fff);background-image:linear-gradient(-45deg,transparent 75.5%,var(--spectrum-global-color-static-gray-500,#bcbcbc) 0),linear-gradient(45deg,transparent 75.5%,var(--spectrum-global-color-static-gray-500,#bcbcbc) 0),linear-gradient(-45deg,var(--spectrum-global-color-static-gray-500,#bcbcbc) 25.5%,transparent 0),linear-gradient(45deg,var(--spectrum-global-color-static-gray-500,#bcbcbc) 25.5%,transparent 0)}:host:before{box-shadow:inset 0 0 0 var(--spectrum-thumbnail-border-size) var(--spectrum-thumbnail-border-color)}:host([selected]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host([selected]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host(.focus-visible),:host(.focus-visible),:host([focused]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-focus)/2) var(--spectrum-thumbnail-border-color-focus)}:host(.focus-visible),:host(:focus-visible),:host([focused]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-focus)/2) var(--spectrum-thumbnail-border-color-focus)}:host(.focus-visible):before,:host(.focus-visible):before,:host([focused]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host(.focus-visible):before,:host(:focus-visible):before,:host([focused]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}::slotted(:not(img)){display:none}:host([cover]) ::slotted(img){object-fit:cover;width:100%;height:100%}
+:host{--spectrum-thumbnail-border-radius:var(--spectrum-alias-border-radius-small,var(--spectrum-global-dimension-size-25));--spectrum-thumbnail-size-S:var(--spectrum-global-dimension-size-300);--spectrum-thumbnail-size-M:var(--spectrum-global-dimension-size-400);--spectrum-thumbnail-size-L:var(--spectrum-global-dimension-size-500);--spectrum-thumbnail-size-XL:var(--spectrum-global-dimension-size-600);--spectrum-thumbnail-size-XXL:var(--spectrum-global-dimension-size-700);position:relative;margin:0;padding:0;display:flex;align-items:center;justify-content:center;width:var(--spectrum-thumbnail-size-M);height:var(--spectrum-thumbnail-size-M);border-radius:var(--spectrum-thumbnail-border-radius);vertical-align:top;overflow:hidden;background-size:var(--spectrum-global-dimension-static-size-200,16px) var(--spectrum-global-dimension-static-size-200,16px);background-position:0 0,0 var(--spectrum-global-dimension-static-size-100,8px),var(--spectrum-global-dimension-static-size-100,8px) calc(-1*var(--spectrum-global-dimension-static-size-100, 8px)),calc(-1*var(--spectrum-global-dimension-static-size-100, 8px)) 0}:host:before{content:"";z-index:2;position:absolute;width:100%;height:100%;border-radius:var(--spectrum-thumbnail-border-radius)}:host([size=s]){width:var(--spectrum-thumbnail-size-S);height:var(--spectrum-thumbnail-size-S)}:host([size=m]){width:var(--spectrum-thumbnail-size-M);height:var(--spectrum-thumbnail-size-M)}:host([size=l]){width:var(--spectrum-thumbnail-size-L);height:var(--spectrum-thumbnail-size-L)}:host([size=xl]){width:var(--spectrum-thumbnail-size-XL);height:var(--spectrum-thumbnail-size-XL)}:host([size=xxl]){width:var(--spectrum-thumbnail-size-XXL);height:var(--spectrum-thumbnail-size-XXL)}::slotted(*){max-height:100%;max-width:100%;z-index:1}.background{position:absolute;z-index:0;left:0;top:0;right:0;bottom:0;height:100%;width:100%;background-size:cover;background-position:50%}:host{--spectrum-thumbnail-border-size:var(--spectrum-alias-border-size-thin,var(--spectrum-global-dimension-static-size-10));--spectrum-thumbnail-border-size-selected:var(--spectrum-alias-border-size-thick,var(--spectrum-global-dimension-static-size-25));--spectrum-thumbnail-border-size-focus:var(--spectrum-alias-border-size-thick,var(--spectrum-global-dimension-static-size-25));--spectrum-thumbnail-border-color:var(--spectrum-alias-dropshadow-color);--spectrum-thumbnail-border-color-focus:var(--spectrum-alias-border-color-focus,var(--spectrum-global-color-blue-400));--spectrum-thumbnail-border-color-selected:var(--spectrum-global-color-blue-500);background-color:var(--spectrum-global-color-static-white,#fff);background-image:linear-gradient(-45deg,transparent 75.5%,var(--spectrum-global-color-static-gray-500,#bcbcbc) 0),linear-gradient(45deg,transparent 75.5%,var(--spectrum-global-color-static-gray-500,#bcbcbc) 0),linear-gradient(-45deg,var(--spectrum-global-color-static-gray-500,#bcbcbc) 25.5%,transparent 0),linear-gradient(45deg,var(--spectrum-global-color-static-gray-500,#bcbcbc) 25.5%,transparent 0)}:host:before{box-shadow:inset 0 0 0 var(--spectrum-thumbnail-border-size) var(--spectrum-thumbnail-border-color)}:host([selected]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host([selected]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host(.focus-visible),:host([focused]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-focus)/2) var(--spectrum-thumbnail-border-color-focus)}:host(.focus-visible),:host([focused]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-focus)/2) var(--spectrum-thumbnail-border-color-focus)}:host(:focus-visible),:host([focused]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-focus)/2) var(--spectrum-thumbnail-border-color-focus)}:host(.focus-visible):before,:host([focused]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host(.focus-visible):before,:host([focused]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host(:focus-visible):before,:host([focused]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}::slotted(:not(img)){display:none}:host([cover]) ::slotted(img){object-fit:cover;width:100%;height:100%}
 `;
 export default styles;
 //# sourceMappingURL=thumbnail.css.js.map

src/thumbnail.css.ts

@@ -14,4 +14,4 @@ /*
 const styles = css`
-:host{--spectrum-thumbnail-border-radius:var(--spectrum-alias-border-radius-small,var(--spectrum-global-dimension-size-25));--spectrum-thumbnail-size-S:var(--spectrum-global-dimension-size-300);--spectrum-thumbnail-size-M:var(--spectrum-global-dimension-size-400);--spectrum-thumbnail-size-L:var(--spectrum-global-dimension-size-500);--spectrum-thumbnail-size-XL:var(--spectrum-global-dimension-size-600);--spectrum-thumbnail-size-XXL:var(--spectrum-global-dimension-size-700);position:relative;margin:0;padding:0;display:flex;align-items:center;justify-content:center;width:var(--spectrum-thumbnail-size-M);height:var(--spectrum-thumbnail-size-M);vertical-align:top;overflow:hidden;background-size:var(--spectrum-global-dimension-static-size-200,16px) var(--spectrum-global-dimension-static-size-200,16px);background-position:0 0,0 var(--spectrum-global-dimension-static-size-100,8px),var(--spectrum-global-dimension-static-size-100,8px) calc(-1*var(--spectrum-global-dimension-static-size-100, 8px)),calc(-1*var(--spectrum-global-dimension-static-size-100, 8px)) 0}:host,:host:before{border-radius:var(--spectrum-thumbnail-border-radius)}:host:before{content:"";z-index:2;position:absolute;width:100%;height:100%}:host([size=s]){width:var(--spectrum-thumbnail-size-S);height:var(--spectrum-thumbnail-size-S)}:host([size=m]){width:var(--spectrum-thumbnail-size-M);height:var(--spectrum-thumbnail-size-M)}:host([size=l]){width:var(--spectrum-thumbnail-size-L);height:var(--spectrum-thumbnail-size-L)}:host([size=xl]){width:var(--spectrum-thumbnail-size-XL);height:var(--spectrum-thumbnail-size-XL)}:host([size=xxl]){width:var(--spectrum-thumbnail-size-XXL);height:var(--spectrum-thumbnail-size-XXL)}::slotted(*){max-height:100%;max-width:100%;z-index:1}.background{position:absolute;z-index:0;left:0;top:0;right:0;bottom:0;height:100%;width:100%;background-size:cover;background-position:50%}:host{--spectrum-thumbnail-border-size:var(--spectrum-alias-border-size-thin,var(--spectrum-global-dimension-static-size-10));--spectrum-thumbnail-border-size-selected:var(--spectrum-alias-border-size-thick,var(--spectrum-global-dimension-static-size-25));--spectrum-thumbnail-border-size-focus:var(--spectrum-alias-border-size-thick,var(--spectrum-global-dimension-static-size-25));--spectrum-thumbnail-border-color:var(--spectrum-alias-dropshadow-color);--spectrum-thumbnail-border-color-focus:var(--spectrum-alias-border-color-focus,var(--spectrum-global-color-blue-400));--spectrum-thumbnail-border-color-selected:var(--spectrum-global-color-blue-500);background-color:var(--spectrum-global-color-static-white,#fff);background-image:linear-gradient(-45deg,transparent 75.5%,var(--spectrum-global-color-static-gray-500,#bcbcbc) 0),linear-gradient(45deg,transparent 75.5%,var(--spectrum-global-color-static-gray-500,#bcbcbc) 0),linear-gradient(-45deg,var(--spectrum-global-color-static-gray-500,#bcbcbc) 25.5%,transparent 0),linear-gradient(45deg,var(--spectrum-global-color-static-gray-500,#bcbcbc) 25.5%,transparent 0)}:host:before{box-shadow:inset 0 0 0 var(--spectrum-thumbnail-border-size) var(--spectrum-thumbnail-border-color)}:host([selected]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host([selected]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host(.focus-visible),:host(.focus-visible),:host([focused]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-focus)/2) var(--spectrum-thumbnail-border-color-focus)}:host(.focus-visible),:host(:focus-visible),:host([focused]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-focus)/2) var(--spectrum-thumbnail-border-color-focus)}:host(.focus-visible):before,:host(.focus-visible):before,:host([focused]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host(.focus-visible):before,:host(:focus-visible):before,:host([focused]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}::slotted(:not(img)){display:none}:host([cover]) ::slotted(img){object-fit:cover;width:100%;height:100%}
+:host{--spectrum-thumbnail-border-radius:var(--spectrum-alias-border-radius-small,var(--spectrum-global-dimension-size-25));--spectrum-thumbnail-size-S:var(--spectrum-global-dimension-size-300);--spectrum-thumbnail-size-M:var(--spectrum-global-dimension-size-400);--spectrum-thumbnail-size-L:var(--spectrum-global-dimension-size-500);--spectrum-thumbnail-size-XL:var(--spectrum-global-dimension-size-600);--spectrum-thumbnail-size-XXL:var(--spectrum-global-dimension-size-700);position:relative;margin:0;padding:0;display:flex;align-items:center;justify-content:center;width:var(--spectrum-thumbnail-size-M);height:var(--spectrum-thumbnail-size-M);border-radius:var(--spectrum-thumbnail-border-radius);vertical-align:top;overflow:hidden;background-size:var(--spectrum-global-dimension-static-size-200,16px) var(--spectrum-global-dimension-static-size-200,16px);background-position:0 0,0 var(--spectrum-global-dimension-static-size-100,8px),var(--spectrum-global-dimension-static-size-100,8px) calc(-1*var(--spectrum-global-dimension-static-size-100, 8px)),calc(-1*var(--spectrum-global-dimension-static-size-100, 8px)) 0}:host:before{content:"";z-index:2;position:absolute;width:100%;height:100%;border-radius:var(--spectrum-thumbnail-border-radius)}:host([size=s]){width:var(--spectrum-thumbnail-size-S);height:var(--spectrum-thumbnail-size-S)}:host([size=m]){width:var(--spectrum-thumbnail-size-M);height:var(--spectrum-thumbnail-size-M)}:host([size=l]){width:var(--spectrum-thumbnail-size-L);height:var(--spectrum-thumbnail-size-L)}:host([size=xl]){width:var(--spectrum-thumbnail-size-XL);height:var(--spectrum-thumbnail-size-XL)}:host([size=xxl]){width:var(--spectrum-thumbnail-size-XXL);height:var(--spectrum-thumbnail-size-XXL)}::slotted(*){max-height:100%;max-width:100%;z-index:1}.background{position:absolute;z-index:0;left:0;top:0;right:0;bottom:0;height:100%;width:100%;background-size:cover;background-position:50%}:host{--spectrum-thumbnail-border-size:var(--spectrum-alias-border-size-thin,var(--spectrum-global-dimension-static-size-10));--spectrum-thumbnail-border-size-selected:var(--spectrum-alias-border-size-thick,var(--spectrum-global-dimension-static-size-25));--spectrum-thumbnail-border-size-focus:var(--spectrum-alias-border-size-thick,var(--spectrum-global-dimension-static-size-25));--spectrum-thumbnail-border-color:var(--spectrum-alias-dropshadow-color);--spectrum-thumbnail-border-color-focus:var(--spectrum-alias-border-color-focus,var(--spectrum-global-color-blue-400));--spectrum-thumbnail-border-color-selected:var(--spectrum-global-color-blue-500);background-color:var(--spectrum-global-color-static-white,#fff);background-image:linear-gradient(-45deg,transparent 75.5%,var(--spectrum-global-color-static-gray-500,#bcbcbc) 0),linear-gradient(45deg,transparent 75.5%,var(--spectrum-global-color-static-gray-500,#bcbcbc) 0),linear-gradient(-45deg,var(--spectrum-global-color-static-gray-500,#bcbcbc) 25.5%,transparent 0),linear-gradient(45deg,var(--spectrum-global-color-static-gray-500,#bcbcbc) 25.5%,transparent 0)}:host:before{box-shadow:inset 0 0 0 var(--spectrum-thumbnail-border-size) var(--spectrum-thumbnail-border-color)}:host([selected]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host([selected]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host(.focus-visible),:host([focused]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-focus)/2) var(--spectrum-thumbnail-border-color-focus)}:host(.focus-visible),:host([focused]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-focus)/2) var(--spectrum-thumbnail-border-color-focus)}:host(:focus-visible),:host([focused]){box-shadow:0 0 0 calc(var(--spectrum-thumbnail-border-size-focus)/2) var(--spectrum-thumbnail-border-color-focus)}:host(.focus-visible):before,:host([focused]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host(.focus-visible):before,:host([focused]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}:host(:focus-visible):before,:host([focused]):before{box-shadow:inset 0 0 0 calc(var(--spectrum-thumbnail-border-size-selected)/2) var(--spectrum-thumbnail-border-color-selected)}::slotted(:not(img)){display:none}:host([cover]) ::slotted(img){object-fit:cover;width:100%;height:100%}
 `;
 export default styles;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Manifest confusion

Supply chain risk

This package has inconsistent metadata. This could be malicious or caused by an error when publishing the package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

71150

increased by2.66%

Number of medium supply chain risk alerts

0

decreased by-100%

Dependency changes

• Updated@spectrum-web-components/base@^0.4.3