@spectrum-web-components/thumbnail 0.40.2 → 0.40.4

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.
Files changed (9) hide show
  1. package/package.json +5 -5
  2. package/src/spectrum-thumbnail.css.dev.js +8 -4
  3. package/src/spectrum-thumbnail.css.dev.js.map +2 -2
  4. package/src/spectrum-thumbnail.css.js +8 -4
  5. package/src/spectrum-thumbnail.css.js.map +2 -2
  6. package/src/thumbnail.css.dev.js +8 -4
  7. package/src/thumbnail.css.dev.js.map +2 -2
  8. package/src/thumbnail.css.js +8 -4
  9. package/src/thumbnail.css.js.map +2 -2
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spectrum-web-components/thumbnail",
3
- "version": "0.40.2",
3
+ "version": "0.40.4",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -57,11 +57,11 @@
57
57
  "lit-html"
58
58
  ],
59
59
  "dependencies": {
60
- "@spectrum-web-components/base": "^0.40.2",
61
- "@spectrum-web-components/opacity-checkerboard": "^0.40.2"
60
+ "@spectrum-web-components/base": "^0.40.4",
61
+ "@spectrum-web-components/opacity-checkerboard": "^0.40.4"
62
62
  },
63
63
  "devDependencies": {
64
- "@spectrum-css/thumbnail": "^5.0.7"
64
+ "@spectrum-css/thumbnail": "^5.2.0"
65
65
  },
66
66
  "types": "./src/index.d.ts",
67
67
  "customElements": "custom-elements.json",
@@ -69,5 +69,5 @@
69
69
  "./sp-*.js",
70
70
  "./**/*.dev.js"
71
71
  ],
72
- "gitHead": "e5fd35c7a98569150ca695ec0e0e7411c9c64c28"
72
+ "gitHead": "e7bca020d0da71c4d92e95044bf58780d2e8e603"
73
73
  }
package/src/spectrum-thumbnail.css.dev.js CHANGED
@@ -63,10 +63,12 @@ var(--spectrum-thumbnail-focus-indicator-gap)
63
63
  var(--spectrum-thumbnail-focus-indicator-thickness)
64
64
  ))*-1);position:absolute}:host([focused]) .image-wrapper{border-radius:var(
65
65
  --mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)
66
- );overflow:hidden}:host([layer]){align-items:center;border:var(
67
- --mod-thumbnail-layer-border-width-outer,var(--spectrum-thumbnail-layer-border-width-outer)
68
- ) solid var(
66
+ );overflow:hidden}:host([layer]){align-items:center;border-color:var(
67
+ --highcontrast-thumbnail-layer-border-color-outer,var(
69
68
  --mod-thumbnail-layer-border-color-outer,var(--spectrum-thumbnail-layer-border-color-outer)
69
+ )
70
+ );border-style:solid;border-width:var(
71
+ --mod-thumbnail-layer-border-width-outer,var(--spectrum-thumbnail-layer-border-width-outer)
70
72
  );box-sizing:border-box;display:flex;justify-content:center}:host([layer]):before{content:none}:host([layer][selected]){outline-color:var(
71
73
  --highcontrast-thumbnail-border-color-selected,var(
72
74
  --mod-thumbnail-border-color-selected,var(--spectrum-thumbnail-border-color-selected)
@@ -86,7 +88,9 @@ var(--spectrum-thumbnail-layer-border-width-inner)
86
88
  --mod-thumbnail-layer-border-width-inner,
87
89
  var(--spectrum-thumbnail-layer-border-width-inner)
88
90
  )*2);outline-color:var(
91
+ --highcontrast-thumbnail-layer-border-color-inner,var(
89
92
  --mod-thumbnail-layer-border-color-inner,var(--spectrum-thumbnail-layer-border-color-inner)
93
+ )
90
94
  );outline-style:solid;outline-width:calc(var(
91
95
  --mod-thumbnail-layer-border-width-inner,
92
96
  var(--spectrum-thumbnail-layer-border-width-inner)
@@ -95,7 +99,7 @@ var(--spectrum-thumbnail-layer-border-width-inner)
95
99
  var(--spectrum-thumbnail-layer-border-width-outer)
96
100
  ))}.image-wrapper,.layer-inner{align-items:center;display:flex;justify-content:center}.image-wrapper{block-size:100%;inline-size:100%}::slotted(*){max-block-size:100%;max-inline-size:100%;position:relative;z-index:1}:host([cover]) ::slotted(*){block-size:100%;inline-size:100%;object-fit:cover;object-position:center}.background{background-position:50%;background-size:cover;block-size:100%;border-radius:var(
97
101
  --mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)
98
- );inline-size:100%;inset-block:0;inset-inline:0;position:absolute;z-index:0}@media (forced-colors:active){:host{--highcontrast-thumbnail-border-color-selected:SelectedItem;--highcontrast-thumbnail-focus-indicator-color:Highlight;--highcontrast-thumbnail-border-color:CanvasText;background-color:Canvas;color:CanvasText;forced-color-adjust:none}}
102
+ );inline-size:100%;inset-block:0;inset-inline:0;position:absolute;z-index:0}@media (forced-colors:active){:host{--highcontrast-thumbnail-border-color-selected:Highlight;--highcontrast-thumbnail-focus-indicator-color:Highlight;--highcontrast-thumbnail-border-color:CanvasText;--highcontrast-thumbnail-layer-border-color-inner:Canvas;--highcontrast-thumbnail-layer-border-color-outer:CanvasText;forced-color-adjust:none}}
99
103
  `;
100
104
  export default styles;
101
105
  //# sourceMappingURL=spectrum-thumbnail.css.dev.js.map
package/src/spectrum-thumbnail.css.dev.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["spectrum-thumbnail.css.ts"],
4
- "sourcesContent": ["/*\nCopyright 2023 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-500);--spectrum-thumbnail-border-radius:var(--spectrum-corner-radius-75);--spectrum-thumbnail-border-width:var(--spectrum-border-width-100);--spectrum-thumbnail-border-color-rgba:rgba(var(--spectrum-gray-800-rgb),var(--spectrum-thumbnail-border-color-opacity));--spectrum-thumbnail-layer-border-width-inner:var(\n--spectrum-border-width-400\n);--spectrum-thumbnail-layer-border-color-inner:var(--spectrum-white);--spectrum-thumbnail-layer-border-width-outer:var(\n--spectrum-border-width-100\n);--spectrum-thumbnail-layer-border-color-outer:var(--spectrum-gray-500);--spectrum-thumbnail-border-width-selected:var(\n--spectrum-border-width-200\n);--spectrum-thumbnail-border-color-selected:var(\n--spectrum-accent-color-800\n);--spectrum-thumbnail-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-thumbnail-focus-indicator-gap:var(\n--spectrum-focus-indicator-gap\n);--spectrum-thumbnail-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n);--spectrum-thumbnail-color-opacity-disabled:var(\n--spectrum-thumbnail-opacity-disabled\n)}:host([size=\"50\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-50)}:host([size=\"75\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-75)}:host([size=\"100\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-100)}:host([size=\"200\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-200)}:host([size=\"300\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-300)}:host([size=\"400\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-400)}:host([size=\"500\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-500)}:host([size=\"600\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-600)}:host([size=\"700\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-700)}:host([size=\"800\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-800)}:host([size=\"900\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-900)}:host([size=\"1000\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-1000)}:host{block-size:var(--mod-thumbnail-size,var(--spectrum-thumbnail-size));border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);display:block;inline-size:var(--mod-thumbnail-size,var(--spectrum-thumbnail-size));margin:0;overflow:hidden;padding:0;position:relative;vertical-align:top;z-index:0}:host:before{block-size:100%;border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);box-shadow:inset 0 0 0 var(\n--mod-thumbnail-border-width,var(--spectrum-thumbnail-border-width)\n) var(\n--highcontrast-thumbnail-border-color,var(\n--mod-thumbnail-border-color,var(--spectrum-thumbnail-border-color-rgba)\n)\n);content:\"\";inline-size:100%;position:absolute;z-index:2}:host([disabled]){opacity:var(\n--mod-thumbnail-color-opacity-disabled,var(--spectrum-thumbnail-color-opacity-disabled)\n)}:host([focused]){overflow:visible}:host([focused]):after{border-color:var(\n--highcontrast-thumbnail-focus-indicator-color,var(\n--mod-thumbnail-focus-indicator-color,var(--spectrum-thumbnail-focus-indicator-color)\n)\n);border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);border-style:solid;border-width:var(\n--mod-thumbnail-focus-indicator-thickness,var(--spectrum-thumbnail-focus-indicator-thickness)\n);content:\"\";inset-block-end:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-block-start:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-inline-end:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-inline-start:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);position:absolute}:host([focused]) .image-wrapper{border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);overflow:hidden}:host([layer]){align-items:center;border:var(\n--mod-thumbnail-layer-border-width-outer,var(--spectrum-thumbnail-layer-border-width-outer)\n) solid var(\n--mod-thumbnail-layer-border-color-outer,var(--spectrum-thumbnail-layer-border-color-outer)\n);box-sizing:border-box;display:flex;justify-content:center}:host([layer]):before{content:none}:host([layer][selected]){outline-color:var(\n--highcontrast-thumbnail-border-color-selected,var(\n--mod-thumbnail-border-color-selected,var(--spectrum-thumbnail-border-color-selected)\n)\n);outline-offset:calc(var(\n--mod-thumbnail-border-width-selected,\nvar(--spectrum-thumbnail-border-width-selected)\n) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n));outline-style:solid;outline-width:var(\n--mod-thumbnail-border-width-selected,var(--spectrum-thumbnail-border-width-selected)\n)}.layer-inner{block-size:calc(var(--spectrum-thumbnail-size) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n)*2);inline-size:calc(var(--spectrum-thumbnail-size) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n)*2);outline-color:var(\n--mod-thumbnail-layer-border-color-inner,var(--spectrum-thumbnail-layer-border-color-inner)\n);outline-style:solid;outline-width:calc(var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n) - var(\n--mod-thumbnail-layer-border-width-outer,\nvar(--spectrum-thumbnail-layer-border-width-outer)\n))}.image-wrapper,.layer-inner{align-items:center;display:flex;justify-content:center}.image-wrapper{block-size:100%;inline-size:100%}::slotted(*){max-block-size:100%;max-inline-size:100%;position:relative;z-index:1}:host([cover]) ::slotted(*){block-size:100%;inline-size:100%;object-fit:cover;object-position:center}.background{background-position:50%;background-size:cover;block-size:100%;border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);inline-size:100%;inset-block:0;inset-inline:0;position:absolute;z-index:0}@media (forced-colors:active){:host{--highcontrast-thumbnail-border-color-selected:SelectedItem;--highcontrast-thumbnail-focus-indicator-color:Highlight;--highcontrast-thumbnail-border-color:CanvasText;background-color:Canvas;color:CanvasText;forced-color-adjust:none}}\n`;\nexport default styles;"],
5
- "mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiGf,eAAe;",
4
+ "sourcesContent": ["/*\nCopyright 2024 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-500);--spectrum-thumbnail-border-radius:var(--spectrum-corner-radius-75);--spectrum-thumbnail-border-width:var(--spectrum-border-width-100);--spectrum-thumbnail-border-color-rgba:rgba(var(--spectrum-gray-800-rgb),var(--spectrum-thumbnail-border-color-opacity));--spectrum-thumbnail-layer-border-width-inner:var(\n--spectrum-border-width-400\n);--spectrum-thumbnail-layer-border-color-inner:var(--spectrum-white);--spectrum-thumbnail-layer-border-width-outer:var(\n--spectrum-border-width-100\n);--spectrum-thumbnail-layer-border-color-outer:var(--spectrum-gray-500);--spectrum-thumbnail-border-width-selected:var(\n--spectrum-border-width-200\n);--spectrum-thumbnail-border-color-selected:var(\n--spectrum-accent-color-800\n);--spectrum-thumbnail-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-thumbnail-focus-indicator-gap:var(\n--spectrum-focus-indicator-gap\n);--spectrum-thumbnail-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n);--spectrum-thumbnail-color-opacity-disabled:var(\n--spectrum-thumbnail-opacity-disabled\n)}:host([size=\"50\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-50)}:host([size=\"75\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-75)}:host([size=\"100\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-100)}:host([size=\"200\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-200)}:host([size=\"300\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-300)}:host([size=\"400\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-400)}:host([size=\"500\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-500)}:host([size=\"600\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-600)}:host([size=\"700\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-700)}:host([size=\"800\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-800)}:host([size=\"900\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-900)}:host([size=\"1000\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-1000)}:host{block-size:var(--mod-thumbnail-size,var(--spectrum-thumbnail-size));border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);display:block;inline-size:var(--mod-thumbnail-size,var(--spectrum-thumbnail-size));margin:0;overflow:hidden;padding:0;position:relative;vertical-align:top;z-index:0}:host:before{block-size:100%;border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);box-shadow:inset 0 0 0 var(\n--mod-thumbnail-border-width,var(--spectrum-thumbnail-border-width)\n) var(\n--highcontrast-thumbnail-border-color,var(\n--mod-thumbnail-border-color,var(--spectrum-thumbnail-border-color-rgba)\n)\n);content:\"\";inline-size:100%;position:absolute;z-index:2}:host([disabled]){opacity:var(\n--mod-thumbnail-color-opacity-disabled,var(--spectrum-thumbnail-color-opacity-disabled)\n)}:host([focused]){overflow:visible}:host([focused]):after{border-color:var(\n--highcontrast-thumbnail-focus-indicator-color,var(\n--mod-thumbnail-focus-indicator-color,var(--spectrum-thumbnail-focus-indicator-color)\n)\n);border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);border-style:solid;border-width:var(\n--mod-thumbnail-focus-indicator-thickness,var(--spectrum-thumbnail-focus-indicator-thickness)\n);content:\"\";inset-block-end:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-block-start:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-inline-end:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-inline-start:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);position:absolute}:host([focused]) .image-wrapper{border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);overflow:hidden}:host([layer]){align-items:center;border-color:var(\n--highcontrast-thumbnail-layer-border-color-outer,var(\n--mod-thumbnail-layer-border-color-outer,var(--spectrum-thumbnail-layer-border-color-outer)\n)\n);border-style:solid;border-width:var(\n--mod-thumbnail-layer-border-width-outer,var(--spectrum-thumbnail-layer-border-width-outer)\n);box-sizing:border-box;display:flex;justify-content:center}:host([layer]):before{content:none}:host([layer][selected]){outline-color:var(\n--highcontrast-thumbnail-border-color-selected,var(\n--mod-thumbnail-border-color-selected,var(--spectrum-thumbnail-border-color-selected)\n)\n);outline-offset:calc(var(\n--mod-thumbnail-border-width-selected,\nvar(--spectrum-thumbnail-border-width-selected)\n) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n));outline-style:solid;outline-width:var(\n--mod-thumbnail-border-width-selected,var(--spectrum-thumbnail-border-width-selected)\n)}.layer-inner{block-size:calc(var(--spectrum-thumbnail-size) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n)*2);inline-size:calc(var(--spectrum-thumbnail-size) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n)*2);outline-color:var(\n--highcontrast-thumbnail-layer-border-color-inner,var(\n--mod-thumbnail-layer-border-color-inner,var(--spectrum-thumbnail-layer-border-color-inner)\n)\n);outline-style:solid;outline-width:calc(var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n) - var(\n--mod-thumbnail-layer-border-width-outer,\nvar(--spectrum-thumbnail-layer-border-width-outer)\n))}.image-wrapper,.layer-inner{align-items:center;display:flex;justify-content:center}.image-wrapper{block-size:100%;inline-size:100%}::slotted(*){max-block-size:100%;max-inline-size:100%;position:relative;z-index:1}:host([cover]) ::slotted(*){block-size:100%;inline-size:100%;object-fit:cover;object-position:center}.background{background-position:50%;background-size:cover;block-size:100%;border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);inline-size:100%;inset-block:0;inset-inline:0;position:absolute;z-index:0}@media (forced-colors:active){:host{--highcontrast-thumbnail-border-color-selected:Highlight;--highcontrast-thumbnail-focus-indicator-color:Highlight;--highcontrast-thumbnail-border-color:CanvasText;--highcontrast-thumbnail-layer-border-color-inner:Canvas;--highcontrast-thumbnail-layer-border-color-outer:CanvasText;forced-color-adjust:none}}\n`;\nexport default styles;"],
5
+ "mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAqGf,eAAe;",
6
6
  "names": []
7
7
  }
package/src/spectrum-thumbnail.css.js CHANGED
@@ -61,10 +61,12 @@ var(--spectrum-thumbnail-focus-indicator-gap)
61
61
  var(--spectrum-thumbnail-focus-indicator-thickness)
62
62
  ))*-1);position:absolute}:host([focused]) .image-wrapper{border-radius:var(
63
63
  --mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)
64
- );overflow:hidden}:host([layer]){align-items:center;border:var(
65
- --mod-thumbnail-layer-border-width-outer,var(--spectrum-thumbnail-layer-border-width-outer)
66
- ) solid var(
64
+ );overflow:hidden}:host([layer]){align-items:center;border-color:var(
65
+ --highcontrast-thumbnail-layer-border-color-outer,var(
67
66
  --mod-thumbnail-layer-border-color-outer,var(--spectrum-thumbnail-layer-border-color-outer)
67
+ )
68
+ );border-style:solid;border-width:var(
69
+ --mod-thumbnail-layer-border-width-outer,var(--spectrum-thumbnail-layer-border-width-outer)
68
70
  );box-sizing:border-box;display:flex;justify-content:center}:host([layer]):before{content:none}:host([layer][selected]){outline-color:var(
69
71
  --highcontrast-thumbnail-border-color-selected,var(
70
72
  --mod-thumbnail-border-color-selected,var(--spectrum-thumbnail-border-color-selected)
@@ -84,7 +86,9 @@ var(--spectrum-thumbnail-layer-border-width-inner)
84
86
  --mod-thumbnail-layer-border-width-inner,
85
87
  var(--spectrum-thumbnail-layer-border-width-inner)
86
88
  )*2);outline-color:var(
89
+ --highcontrast-thumbnail-layer-border-color-inner,var(
87
90
  --mod-thumbnail-layer-border-color-inner,var(--spectrum-thumbnail-layer-border-color-inner)
91
+ )
88
92
  );outline-style:solid;outline-width:calc(var(
89
93
  --mod-thumbnail-layer-border-width-inner,
90
94
  var(--spectrum-thumbnail-layer-border-width-inner)
@@ -93,6 +97,6 @@ var(--spectrum-thumbnail-layer-border-width-inner)
93
97
  var(--spectrum-thumbnail-layer-border-width-outer)
94
98
  ))}.image-wrapper,.layer-inner{align-items:center;display:flex;justify-content:center}.image-wrapper{block-size:100%;inline-size:100%}::slotted(*){max-block-size:100%;max-inline-size:100%;position:relative;z-index:1}:host([cover]) ::slotted(*){block-size:100%;inline-size:100%;object-fit:cover;object-position:center}.background{background-position:50%;background-size:cover;block-size:100%;border-radius:var(
95
99
  --mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)
96
- );inline-size:100%;inset-block:0;inset-inline:0;position:absolute;z-index:0}@media (forced-colors:active){:host{--highcontrast-thumbnail-border-color-selected:SelectedItem;--highcontrast-thumbnail-focus-indicator-color:Highlight;--highcontrast-thumbnail-border-color:CanvasText;background-color:Canvas;color:CanvasText;forced-color-adjust:none}}
100
+ );inline-size:100%;inset-block:0;inset-inline:0;position:absolute;z-index:0}@media (forced-colors:active){:host{--highcontrast-thumbnail-border-color-selected:Highlight;--highcontrast-thumbnail-focus-indicator-color:Highlight;--highcontrast-thumbnail-border-color:CanvasText;--highcontrast-thumbnail-layer-border-color-inner:Canvas;--highcontrast-thumbnail-layer-border-color-outer:CanvasText;forced-color-adjust:none}}
97
101
  `;export default e;
98
102
  //# sourceMappingURL=spectrum-thumbnail.css.js.map
package/src/spectrum-thumbnail.css.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["spectrum-thumbnail.css.ts"],
4
- "sourcesContent": ["/*\nCopyright 2023 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-500);--spectrum-thumbnail-border-radius:var(--spectrum-corner-radius-75);--spectrum-thumbnail-border-width:var(--spectrum-border-width-100);--spectrum-thumbnail-border-color-rgba:rgba(var(--spectrum-gray-800-rgb),var(--spectrum-thumbnail-border-color-opacity));--spectrum-thumbnail-layer-border-width-inner:var(\n--spectrum-border-width-400\n);--spectrum-thumbnail-layer-border-color-inner:var(--spectrum-white);--spectrum-thumbnail-layer-border-width-outer:var(\n--spectrum-border-width-100\n);--spectrum-thumbnail-layer-border-color-outer:var(--spectrum-gray-500);--spectrum-thumbnail-border-width-selected:var(\n--spectrum-border-width-200\n);--spectrum-thumbnail-border-color-selected:var(\n--spectrum-accent-color-800\n);--spectrum-thumbnail-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-thumbnail-focus-indicator-gap:var(\n--spectrum-focus-indicator-gap\n);--spectrum-thumbnail-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n);--spectrum-thumbnail-color-opacity-disabled:var(\n--spectrum-thumbnail-opacity-disabled\n)}:host([size=\"50\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-50)}:host([size=\"75\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-75)}:host([size=\"100\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-100)}:host([size=\"200\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-200)}:host([size=\"300\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-300)}:host([size=\"400\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-400)}:host([size=\"500\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-500)}:host([size=\"600\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-600)}:host([size=\"700\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-700)}:host([size=\"800\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-800)}:host([size=\"900\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-900)}:host([size=\"1000\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-1000)}:host{block-size:var(--mod-thumbnail-size,var(--spectrum-thumbnail-size));border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);display:block;inline-size:var(--mod-thumbnail-size,var(--spectrum-thumbnail-size));margin:0;overflow:hidden;padding:0;position:relative;vertical-align:top;z-index:0}:host:before{block-size:100%;border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);box-shadow:inset 0 0 0 var(\n--mod-thumbnail-border-width,var(--spectrum-thumbnail-border-width)\n) var(\n--highcontrast-thumbnail-border-color,var(\n--mod-thumbnail-border-color,var(--spectrum-thumbnail-border-color-rgba)\n)\n);content:\"\";inline-size:100%;position:absolute;z-index:2}:host([disabled]){opacity:var(\n--mod-thumbnail-color-opacity-disabled,var(--spectrum-thumbnail-color-opacity-disabled)\n)}:host([focused]){overflow:visible}:host([focused]):after{border-color:var(\n--highcontrast-thumbnail-focus-indicator-color,var(\n--mod-thumbnail-focus-indicator-color,var(--spectrum-thumbnail-focus-indicator-color)\n)\n);border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);border-style:solid;border-width:var(\n--mod-thumbnail-focus-indicator-thickness,var(--spectrum-thumbnail-focus-indicator-thickness)\n);content:\"\";inset-block-end:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-block-start:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-inline-end:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-inline-start:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);position:absolute}:host([focused]) .image-wrapper{border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);overflow:hidden}:host([layer]){align-items:center;border:var(\n--mod-thumbnail-layer-border-width-outer,var(--spectrum-thumbnail-layer-border-width-outer)\n) solid var(\n--mod-thumbnail-layer-border-color-outer,var(--spectrum-thumbnail-layer-border-color-outer)\n);box-sizing:border-box;display:flex;justify-content:center}:host([layer]):before{content:none}:host([layer][selected]){outline-color:var(\n--highcontrast-thumbnail-border-color-selected,var(\n--mod-thumbnail-border-color-selected,var(--spectrum-thumbnail-border-color-selected)\n)\n);outline-offset:calc(var(\n--mod-thumbnail-border-width-selected,\nvar(--spectrum-thumbnail-border-width-selected)\n) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n));outline-style:solid;outline-width:var(\n--mod-thumbnail-border-width-selected,var(--spectrum-thumbnail-border-width-selected)\n)}.layer-inner{block-size:calc(var(--spectrum-thumbnail-size) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n)*2);inline-size:calc(var(--spectrum-thumbnail-size) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n)*2);outline-color:var(\n--mod-thumbnail-layer-border-color-inner,var(--spectrum-thumbnail-layer-border-color-inner)\n);outline-style:solid;outline-width:calc(var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n) - var(\n--mod-thumbnail-layer-border-width-outer,\nvar(--spectrum-thumbnail-layer-border-width-outer)\n))}.image-wrapper,.layer-inner{align-items:center;display:flex;justify-content:center}.image-wrapper{block-size:100%;inline-size:100%}::slotted(*){max-block-size:100%;max-inline-size:100%;position:relative;z-index:1}:host([cover]) ::slotted(*){block-size:100%;inline-size:100%;object-fit:cover;object-position:center}.background{background-position:50%;background-size:cover;block-size:100%;border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);inline-size:100%;inset-block:0;inset-inline:0;position:absolute;z-index:0}@media (forced-colors:active){:host{--highcontrast-thumbnail-border-color-selected:SelectedItem;--highcontrast-thumbnail-focus-indicator-color:Highlight;--highcontrast-thumbnail-border-color:CanvasText;background-color:Canvas;color:CanvasText;forced-color-adjust:none}}\n`;\nexport default styles;"],
5
- "mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAiGf,eAAeC",
4
+ "sourcesContent": ["/*\nCopyright 2024 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-500);--spectrum-thumbnail-border-radius:var(--spectrum-corner-radius-75);--spectrum-thumbnail-border-width:var(--spectrum-border-width-100);--spectrum-thumbnail-border-color-rgba:rgba(var(--spectrum-gray-800-rgb),var(--spectrum-thumbnail-border-color-opacity));--spectrum-thumbnail-layer-border-width-inner:var(\n--spectrum-border-width-400\n);--spectrum-thumbnail-layer-border-color-inner:var(--spectrum-white);--spectrum-thumbnail-layer-border-width-outer:var(\n--spectrum-border-width-100\n);--spectrum-thumbnail-layer-border-color-outer:var(--spectrum-gray-500);--spectrum-thumbnail-border-width-selected:var(\n--spectrum-border-width-200\n);--spectrum-thumbnail-border-color-selected:var(\n--spectrum-accent-color-800\n);--spectrum-thumbnail-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-thumbnail-focus-indicator-gap:var(\n--spectrum-focus-indicator-gap\n);--spectrum-thumbnail-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n);--spectrum-thumbnail-color-opacity-disabled:var(\n--spectrum-thumbnail-opacity-disabled\n)}:host([size=\"50\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-50)}:host([size=\"75\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-75)}:host([size=\"100\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-100)}:host([size=\"200\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-200)}:host([size=\"300\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-300)}:host([size=\"400\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-400)}:host([size=\"500\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-500)}:host([size=\"600\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-600)}:host([size=\"700\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-700)}:host([size=\"800\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-800)}:host([size=\"900\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-900)}:host([size=\"1000\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-1000)}:host{block-size:var(--mod-thumbnail-size,var(--spectrum-thumbnail-size));border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);display:block;inline-size:var(--mod-thumbnail-size,var(--spectrum-thumbnail-size));margin:0;overflow:hidden;padding:0;position:relative;vertical-align:top;z-index:0}:host:before{block-size:100%;border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);box-shadow:inset 0 0 0 var(\n--mod-thumbnail-border-width,var(--spectrum-thumbnail-border-width)\n) var(\n--highcontrast-thumbnail-border-color,var(\n--mod-thumbnail-border-color,var(--spectrum-thumbnail-border-color-rgba)\n)\n);content:\"\";inline-size:100%;position:absolute;z-index:2}:host([disabled]){opacity:var(\n--mod-thumbnail-color-opacity-disabled,var(--spectrum-thumbnail-color-opacity-disabled)\n)}:host([focused]){overflow:visible}:host([focused]):after{border-color:var(\n--highcontrast-thumbnail-focus-indicator-color,var(\n--mod-thumbnail-focus-indicator-color,var(--spectrum-thumbnail-focus-indicator-color)\n)\n);border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);border-style:solid;border-width:var(\n--mod-thumbnail-focus-indicator-thickness,var(--spectrum-thumbnail-focus-indicator-thickness)\n);content:\"\";inset-block-end:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-block-start:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-inline-end:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-inline-start:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);position:absolute}:host([focused]) .image-wrapper{border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);overflow:hidden}:host([layer]){align-items:center;border-color:var(\n--highcontrast-thumbnail-layer-border-color-outer,var(\n--mod-thumbnail-layer-border-color-outer,var(--spectrum-thumbnail-layer-border-color-outer)\n)\n);border-style:solid;border-width:var(\n--mod-thumbnail-layer-border-width-outer,var(--spectrum-thumbnail-layer-border-width-outer)\n);box-sizing:border-box;display:flex;justify-content:center}:host([layer]):before{content:none}:host([layer][selected]){outline-color:var(\n--highcontrast-thumbnail-border-color-selected,var(\n--mod-thumbnail-border-color-selected,var(--spectrum-thumbnail-border-color-selected)\n)\n);outline-offset:calc(var(\n--mod-thumbnail-border-width-selected,\nvar(--spectrum-thumbnail-border-width-selected)\n) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n));outline-style:solid;outline-width:var(\n--mod-thumbnail-border-width-selected,var(--spectrum-thumbnail-border-width-selected)\n)}.layer-inner{block-size:calc(var(--spectrum-thumbnail-size) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n)*2);inline-size:calc(var(--spectrum-thumbnail-size) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n)*2);outline-color:var(\n--highcontrast-thumbnail-layer-border-color-inner,var(\n--mod-thumbnail-layer-border-color-inner,var(--spectrum-thumbnail-layer-border-color-inner)\n)\n);outline-style:solid;outline-width:calc(var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n) - var(\n--mod-thumbnail-layer-border-width-outer,\nvar(--spectrum-thumbnail-layer-border-width-outer)\n))}.image-wrapper,.layer-inner{align-items:center;display:flex;justify-content:center}.image-wrapper{block-size:100%;inline-size:100%}::slotted(*){max-block-size:100%;max-inline-size:100%;position:relative;z-index:1}:host([cover]) ::slotted(*){block-size:100%;inline-size:100%;object-fit:cover;object-position:center}.background{background-position:50%;background-size:cover;block-size:100%;border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);inline-size:100%;inset-block:0;inset-inline:0;position:absolute;z-index:0}@media (forced-colors:active){:host{--highcontrast-thumbnail-border-color-selected:Highlight;--highcontrast-thumbnail-focus-indicator-color:Highlight;--highcontrast-thumbnail-border-color:CanvasText;--highcontrast-thumbnail-layer-border-color-inner:Canvas;--highcontrast-thumbnail-layer-border-color-outer:CanvasText;forced-color-adjust:none}}\n`;\nexport default styles;"],
5
+ "mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAqGf,eAAeC",
6
6
  "names": ["css", "styles"]
7
7
  }
package/src/thumbnail.css.dev.js CHANGED
@@ -63,10 +63,12 @@ var(--spectrum-thumbnail-focus-indicator-gap)
63
63
  var(--spectrum-thumbnail-focus-indicator-thickness)
64
64
  ))*-1);position:absolute}:host([focused]) .image-wrapper{border-radius:var(
65
65
  --mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)
66
- );overflow:hidden}:host([layer]){align-items:center;border:var(
67
- --mod-thumbnail-layer-border-width-outer,var(--spectrum-thumbnail-layer-border-width-outer)
68
- ) solid var(
66
+ );overflow:hidden}:host([layer]){align-items:center;border-color:var(
67
+ --highcontrast-thumbnail-layer-border-color-outer,var(
69
68
  --mod-thumbnail-layer-border-color-outer,var(--spectrum-thumbnail-layer-border-color-outer)
69
+ )
70
+ );border-style:solid;border-width:var(
71
+ --mod-thumbnail-layer-border-width-outer,var(--spectrum-thumbnail-layer-border-width-outer)
70
72
  );box-sizing:border-box;display:flex;justify-content:center}:host([layer]):before{content:none}:host([layer][selected]){outline-color:var(
71
73
  --highcontrast-thumbnail-border-color-selected,var(
72
74
  --mod-thumbnail-border-color-selected,var(--spectrum-thumbnail-border-color-selected)
@@ -86,7 +88,9 @@ var(--spectrum-thumbnail-layer-border-width-inner)
86
88
  --mod-thumbnail-layer-border-width-inner,
87
89
  var(--spectrum-thumbnail-layer-border-width-inner)
88
90
  )*2);outline-color:var(
91
+ --highcontrast-thumbnail-layer-border-color-inner,var(
89
92
  --mod-thumbnail-layer-border-color-inner,var(--spectrum-thumbnail-layer-border-color-inner)
93
+ )
90
94
  );outline-style:solid;outline-width:calc(var(
91
95
  --mod-thumbnail-layer-border-width-inner,
92
96
  var(--spectrum-thumbnail-layer-border-width-inner)
@@ -95,7 +99,7 @@ var(--spectrum-thumbnail-layer-border-width-inner)
95
99
  var(--spectrum-thumbnail-layer-border-width-outer)
96
100
  ))}.image-wrapper,.layer-inner{align-items:center;display:flex;justify-content:center}.image-wrapper{block-size:100%;inline-size:100%}::slotted(*){max-block-size:100%;max-inline-size:100%;position:relative;z-index:1}:host([cover]) ::slotted(*){block-size:100%;inline-size:100%;object-fit:cover;object-position:center}.background{background-position:50%;background-size:cover;block-size:100%;border-radius:var(
97
101
  --mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)
98
- );inline-size:100%;inset-block:0;inset-inline:0;position:absolute;z-index:0}@media (forced-colors:active){:host{--highcontrast-thumbnail-border-color-selected:SelectedItem;--highcontrast-thumbnail-focus-indicator-color:Highlight;--highcontrast-thumbnail-border-color:CanvasText;background-color:Canvas;color:CanvasText;forced-color-adjust:none}}::slotted(:not(img)){display:none}
102
+ );inline-size:100%;inset-block:0;inset-inline:0;position:absolute;z-index:0}@media (forced-colors:active){:host{--highcontrast-thumbnail-border-color-selected:Highlight;--highcontrast-thumbnail-focus-indicator-color:Highlight;--highcontrast-thumbnail-border-color:CanvasText;--highcontrast-thumbnail-layer-border-color-inner:Canvas;--highcontrast-thumbnail-layer-border-color-outer:CanvasText;forced-color-adjust:none}}::slotted(:not(img)){display:none}
99
103
  `;
100
104
  export default styles;
101
105
  //# sourceMappingURL=thumbnail.css.dev.js.map
package/src/thumbnail.css.dev.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["thumbnail.css.ts"],
4
- "sourcesContent": ["/*\nCopyright 2023 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-500);--spectrum-thumbnail-border-radius:var(--spectrum-corner-radius-75);--spectrum-thumbnail-border-width:var(--spectrum-border-width-100);--spectrum-thumbnail-border-color-rgba:rgba(var(--spectrum-gray-800-rgb),var(--spectrum-thumbnail-border-color-opacity));--spectrum-thumbnail-layer-border-width-inner:var(\n--spectrum-border-width-400\n);--spectrum-thumbnail-layer-border-color-inner:var(--spectrum-white);--spectrum-thumbnail-layer-border-width-outer:var(\n--spectrum-border-width-100\n);--spectrum-thumbnail-layer-border-color-outer:var(--spectrum-gray-500);--spectrum-thumbnail-border-width-selected:var(\n--spectrum-border-width-200\n);--spectrum-thumbnail-border-color-selected:var(\n--spectrum-accent-color-800\n);--spectrum-thumbnail-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-thumbnail-focus-indicator-gap:var(\n--spectrum-focus-indicator-gap\n);--spectrum-thumbnail-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n);--spectrum-thumbnail-color-opacity-disabled:var(\n--spectrum-thumbnail-opacity-disabled\n)}:host([size=\"50\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-50)}:host([size=\"75\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-75)}:host([size=\"100\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-100)}:host([size=\"200\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-200)}:host([size=\"300\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-300)}:host([size=\"400\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-400)}:host([size=\"500\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-500)}:host([size=\"600\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-600)}:host([size=\"700\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-700)}:host([size=\"800\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-800)}:host([size=\"900\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-900)}:host([size=\"1000\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-1000)}:host{block-size:var(--mod-thumbnail-size,var(--spectrum-thumbnail-size));border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);display:block;inline-size:var(--mod-thumbnail-size,var(--spectrum-thumbnail-size));margin:0;overflow:hidden;padding:0;position:relative;vertical-align:top;z-index:0}:host:before{block-size:100%;border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);box-shadow:inset 0 0 0 var(\n--mod-thumbnail-border-width,var(--spectrum-thumbnail-border-width)\n) var(\n--highcontrast-thumbnail-border-color,var(\n--mod-thumbnail-border-color,var(--spectrum-thumbnail-border-color-rgba)\n)\n);content:\"\";inline-size:100%;position:absolute;z-index:2}:host([disabled]){opacity:var(\n--mod-thumbnail-color-opacity-disabled,var(--spectrum-thumbnail-color-opacity-disabled)\n)}:host([focused]){overflow:visible}:host([focused]):after{border-color:var(\n--highcontrast-thumbnail-focus-indicator-color,var(\n--mod-thumbnail-focus-indicator-color,var(--spectrum-thumbnail-focus-indicator-color)\n)\n);border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);border-style:solid;border-width:var(\n--mod-thumbnail-focus-indicator-thickness,var(--spectrum-thumbnail-focus-indicator-thickness)\n);content:\"\";inset-block-end:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-block-start:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-inline-end:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-inline-start:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);position:absolute}:host([focused]) .image-wrapper{border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);overflow:hidden}:host([layer]){align-items:center;border:var(\n--mod-thumbnail-layer-border-width-outer,var(--spectrum-thumbnail-layer-border-width-outer)\n) solid var(\n--mod-thumbnail-layer-border-color-outer,var(--spectrum-thumbnail-layer-border-color-outer)\n);box-sizing:border-box;display:flex;justify-content:center}:host([layer]):before{content:none}:host([layer][selected]){outline-color:var(\n--highcontrast-thumbnail-border-color-selected,var(\n--mod-thumbnail-border-color-selected,var(--spectrum-thumbnail-border-color-selected)\n)\n);outline-offset:calc(var(\n--mod-thumbnail-border-width-selected,\nvar(--spectrum-thumbnail-border-width-selected)\n) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n));outline-style:solid;outline-width:var(\n--mod-thumbnail-border-width-selected,var(--spectrum-thumbnail-border-width-selected)\n)}.layer-inner{block-size:calc(var(--spectrum-thumbnail-size) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n)*2);inline-size:calc(var(--spectrum-thumbnail-size) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n)*2);outline-color:var(\n--mod-thumbnail-layer-border-color-inner,var(--spectrum-thumbnail-layer-border-color-inner)\n);outline-style:solid;outline-width:calc(var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n) - var(\n--mod-thumbnail-layer-border-width-outer,\nvar(--spectrum-thumbnail-layer-border-width-outer)\n))}.image-wrapper,.layer-inner{align-items:center;display:flex;justify-content:center}.image-wrapper{block-size:100%;inline-size:100%}::slotted(*){max-block-size:100%;max-inline-size:100%;position:relative;z-index:1}:host([cover]) ::slotted(*){block-size:100%;inline-size:100%;object-fit:cover;object-position:center}.background{background-position:50%;background-size:cover;block-size:100%;border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);inline-size:100%;inset-block:0;inset-inline:0;position:absolute;z-index:0}@media (forced-colors:active){:host{--highcontrast-thumbnail-border-color-selected:SelectedItem;--highcontrast-thumbnail-focus-indicator-color:Highlight;--highcontrast-thumbnail-border-color:CanvasText;background-color:Canvas;color:CanvasText;forced-color-adjust:none}}::slotted(:not(img)){display:none}\n`;\nexport default styles;"],
5
- "mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiGf,eAAe;",
4
+ "sourcesContent": ["/*\nCopyright 2024 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-500);--spectrum-thumbnail-border-radius:var(--spectrum-corner-radius-75);--spectrum-thumbnail-border-width:var(--spectrum-border-width-100);--spectrum-thumbnail-border-color-rgba:rgba(var(--spectrum-gray-800-rgb),var(--spectrum-thumbnail-border-color-opacity));--spectrum-thumbnail-layer-border-width-inner:var(\n--spectrum-border-width-400\n);--spectrum-thumbnail-layer-border-color-inner:var(--spectrum-white);--spectrum-thumbnail-layer-border-width-outer:var(\n--spectrum-border-width-100\n);--spectrum-thumbnail-layer-border-color-outer:var(--spectrum-gray-500);--spectrum-thumbnail-border-width-selected:var(\n--spectrum-border-width-200\n);--spectrum-thumbnail-border-color-selected:var(\n--spectrum-accent-color-800\n);--spectrum-thumbnail-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-thumbnail-focus-indicator-gap:var(\n--spectrum-focus-indicator-gap\n);--spectrum-thumbnail-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n);--spectrum-thumbnail-color-opacity-disabled:var(\n--spectrum-thumbnail-opacity-disabled\n)}:host([size=\"50\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-50)}:host([size=\"75\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-75)}:host([size=\"100\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-100)}:host([size=\"200\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-200)}:host([size=\"300\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-300)}:host([size=\"400\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-400)}:host([size=\"500\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-500)}:host([size=\"600\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-600)}:host([size=\"700\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-700)}:host([size=\"800\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-800)}:host([size=\"900\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-900)}:host([size=\"1000\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-1000)}:host{block-size:var(--mod-thumbnail-size,var(--spectrum-thumbnail-size));border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);display:block;inline-size:var(--mod-thumbnail-size,var(--spectrum-thumbnail-size));margin:0;overflow:hidden;padding:0;position:relative;vertical-align:top;z-index:0}:host:before{block-size:100%;border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);box-shadow:inset 0 0 0 var(\n--mod-thumbnail-border-width,var(--spectrum-thumbnail-border-width)\n) var(\n--highcontrast-thumbnail-border-color,var(\n--mod-thumbnail-border-color,var(--spectrum-thumbnail-border-color-rgba)\n)\n);content:\"\";inline-size:100%;position:absolute;z-index:2}:host([disabled]){opacity:var(\n--mod-thumbnail-color-opacity-disabled,var(--spectrum-thumbnail-color-opacity-disabled)\n)}:host([focused]){overflow:visible}:host([focused]):after{border-color:var(\n--highcontrast-thumbnail-focus-indicator-color,var(\n--mod-thumbnail-focus-indicator-color,var(--spectrum-thumbnail-focus-indicator-color)\n)\n);border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);border-style:solid;border-width:var(\n--mod-thumbnail-focus-indicator-thickness,var(--spectrum-thumbnail-focus-indicator-thickness)\n);content:\"\";inset-block-end:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-block-start:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-inline-end:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-inline-start:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);position:absolute}:host([focused]) .image-wrapper{border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);overflow:hidden}:host([layer]){align-items:center;border-color:var(\n--highcontrast-thumbnail-layer-border-color-outer,var(\n--mod-thumbnail-layer-border-color-outer,var(--spectrum-thumbnail-layer-border-color-outer)\n)\n);border-style:solid;border-width:var(\n--mod-thumbnail-layer-border-width-outer,var(--spectrum-thumbnail-layer-border-width-outer)\n);box-sizing:border-box;display:flex;justify-content:center}:host([layer]):before{content:none}:host([layer][selected]){outline-color:var(\n--highcontrast-thumbnail-border-color-selected,var(\n--mod-thumbnail-border-color-selected,var(--spectrum-thumbnail-border-color-selected)\n)\n);outline-offset:calc(var(\n--mod-thumbnail-border-width-selected,\nvar(--spectrum-thumbnail-border-width-selected)\n) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n));outline-style:solid;outline-width:var(\n--mod-thumbnail-border-width-selected,var(--spectrum-thumbnail-border-width-selected)\n)}.layer-inner{block-size:calc(var(--spectrum-thumbnail-size) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n)*2);inline-size:calc(var(--spectrum-thumbnail-size) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n)*2);outline-color:var(\n--highcontrast-thumbnail-layer-border-color-inner,var(\n--mod-thumbnail-layer-border-color-inner,var(--spectrum-thumbnail-layer-border-color-inner)\n)\n);outline-style:solid;outline-width:calc(var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n) - var(\n--mod-thumbnail-layer-border-width-outer,\nvar(--spectrum-thumbnail-layer-border-width-outer)\n))}.image-wrapper,.layer-inner{align-items:center;display:flex;justify-content:center}.image-wrapper{block-size:100%;inline-size:100%}::slotted(*){max-block-size:100%;max-inline-size:100%;position:relative;z-index:1}:host([cover]) ::slotted(*){block-size:100%;inline-size:100%;object-fit:cover;object-position:center}.background{background-position:50%;background-size:cover;block-size:100%;border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);inline-size:100%;inset-block:0;inset-inline:0;position:absolute;z-index:0}@media (forced-colors:active){:host{--highcontrast-thumbnail-border-color-selected:Highlight;--highcontrast-thumbnail-focus-indicator-color:Highlight;--highcontrast-thumbnail-border-color:CanvasText;--highcontrast-thumbnail-layer-border-color-inner:Canvas;--highcontrast-thumbnail-layer-border-color-outer:CanvasText;forced-color-adjust:none}}::slotted(:not(img)){display:none}\n`;\nexport default styles;"],
5
+ "mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAqGf,eAAe;",
6
6
  "names": []
7
7
  }
package/src/thumbnail.css.js CHANGED
@@ -61,10 +61,12 @@ var(--spectrum-thumbnail-focus-indicator-gap)
61
61
  var(--spectrum-thumbnail-focus-indicator-thickness)
62
62
  ))*-1);position:absolute}:host([focused]) .image-wrapper{border-radius:var(
63
63
  --mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)
64
- );overflow:hidden}:host([layer]){align-items:center;border:var(
65
- --mod-thumbnail-layer-border-width-outer,var(--spectrum-thumbnail-layer-border-width-outer)
66
- ) solid var(
64
+ );overflow:hidden}:host([layer]){align-items:center;border-color:var(
65
+ --highcontrast-thumbnail-layer-border-color-outer,var(
67
66
  --mod-thumbnail-layer-border-color-outer,var(--spectrum-thumbnail-layer-border-color-outer)
67
+ )
68
+ );border-style:solid;border-width:var(
69
+ --mod-thumbnail-layer-border-width-outer,var(--spectrum-thumbnail-layer-border-width-outer)
68
70
  );box-sizing:border-box;display:flex;justify-content:center}:host([layer]):before{content:none}:host([layer][selected]){outline-color:var(
69
71
  --highcontrast-thumbnail-border-color-selected,var(
70
72
  --mod-thumbnail-border-color-selected,var(--spectrum-thumbnail-border-color-selected)
@@ -84,7 +86,9 @@ var(--spectrum-thumbnail-layer-border-width-inner)
84
86
  --mod-thumbnail-layer-border-width-inner,
85
87
  var(--spectrum-thumbnail-layer-border-width-inner)
86
88
  )*2);outline-color:var(
89
+ --highcontrast-thumbnail-layer-border-color-inner,var(
87
90
  --mod-thumbnail-layer-border-color-inner,var(--spectrum-thumbnail-layer-border-color-inner)
91
+ )
88
92
  );outline-style:solid;outline-width:calc(var(
89
93
  --mod-thumbnail-layer-border-width-inner,
90
94
  var(--spectrum-thumbnail-layer-border-width-inner)
@@ -93,6 +97,6 @@ var(--spectrum-thumbnail-layer-border-width-inner)
93
97
  var(--spectrum-thumbnail-layer-border-width-outer)
94
98
  ))}.image-wrapper,.layer-inner{align-items:center;display:flex;justify-content:center}.image-wrapper{block-size:100%;inline-size:100%}::slotted(*){max-block-size:100%;max-inline-size:100%;position:relative;z-index:1}:host([cover]) ::slotted(*){block-size:100%;inline-size:100%;object-fit:cover;object-position:center}.background{background-position:50%;background-size:cover;block-size:100%;border-radius:var(
95
99
  --mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)
96
- );inline-size:100%;inset-block:0;inset-inline:0;position:absolute;z-index:0}@media (forced-colors:active){:host{--highcontrast-thumbnail-border-color-selected:SelectedItem;--highcontrast-thumbnail-focus-indicator-color:Highlight;--highcontrast-thumbnail-border-color:CanvasText;background-color:Canvas;color:CanvasText;forced-color-adjust:none}}::slotted(:not(img)){display:none}
100
+ );inline-size:100%;inset-block:0;inset-inline:0;position:absolute;z-index:0}@media (forced-colors:active){:host{--highcontrast-thumbnail-border-color-selected:Highlight;--highcontrast-thumbnail-focus-indicator-color:Highlight;--highcontrast-thumbnail-border-color:CanvasText;--highcontrast-thumbnail-layer-border-color-inner:Canvas;--highcontrast-thumbnail-layer-border-color-outer:CanvasText;forced-color-adjust:none}}::slotted(:not(img)){display:none}
97
101
  `;export default e;
98
102
  //# sourceMappingURL=thumbnail.css.js.map
package/src/thumbnail.css.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["thumbnail.css.ts"],
4
- "sourcesContent": ["/*\nCopyright 2023 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-500);--spectrum-thumbnail-border-radius:var(--spectrum-corner-radius-75);--spectrum-thumbnail-border-width:var(--spectrum-border-width-100);--spectrum-thumbnail-border-color-rgba:rgba(var(--spectrum-gray-800-rgb),var(--spectrum-thumbnail-border-color-opacity));--spectrum-thumbnail-layer-border-width-inner:var(\n--spectrum-border-width-400\n);--spectrum-thumbnail-layer-border-color-inner:var(--spectrum-white);--spectrum-thumbnail-layer-border-width-outer:var(\n--spectrum-border-width-100\n);--spectrum-thumbnail-layer-border-color-outer:var(--spectrum-gray-500);--spectrum-thumbnail-border-width-selected:var(\n--spectrum-border-width-200\n);--spectrum-thumbnail-border-color-selected:var(\n--spectrum-accent-color-800\n);--spectrum-thumbnail-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-thumbnail-focus-indicator-gap:var(\n--spectrum-focus-indicator-gap\n);--spectrum-thumbnail-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n);--spectrum-thumbnail-color-opacity-disabled:var(\n--spectrum-thumbnail-opacity-disabled\n)}:host([size=\"50\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-50)}:host([size=\"75\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-75)}:host([size=\"100\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-100)}:host([size=\"200\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-200)}:host([size=\"300\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-300)}:host([size=\"400\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-400)}:host([size=\"500\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-500)}:host([size=\"600\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-600)}:host([size=\"700\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-700)}:host([size=\"800\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-800)}:host([size=\"900\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-900)}:host([size=\"1000\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-1000)}:host{block-size:var(--mod-thumbnail-size,var(--spectrum-thumbnail-size));border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);display:block;inline-size:var(--mod-thumbnail-size,var(--spectrum-thumbnail-size));margin:0;overflow:hidden;padding:0;position:relative;vertical-align:top;z-index:0}:host:before{block-size:100%;border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);box-shadow:inset 0 0 0 var(\n--mod-thumbnail-border-width,var(--spectrum-thumbnail-border-width)\n) var(\n--highcontrast-thumbnail-border-color,var(\n--mod-thumbnail-border-color,var(--spectrum-thumbnail-border-color-rgba)\n)\n);content:\"\";inline-size:100%;position:absolute;z-index:2}:host([disabled]){opacity:var(\n--mod-thumbnail-color-opacity-disabled,var(--spectrum-thumbnail-color-opacity-disabled)\n)}:host([focused]){overflow:visible}:host([focused]):after{border-color:var(\n--highcontrast-thumbnail-focus-indicator-color,var(\n--mod-thumbnail-focus-indicator-color,var(--spectrum-thumbnail-focus-indicator-color)\n)\n);border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);border-style:solid;border-width:var(\n--mod-thumbnail-focus-indicator-thickness,var(--spectrum-thumbnail-focus-indicator-thickness)\n);content:\"\";inset-block-end:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-block-start:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-inline-end:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-inline-start:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);position:absolute}:host([focused]) .image-wrapper{border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);overflow:hidden}:host([layer]){align-items:center;border:var(\n--mod-thumbnail-layer-border-width-outer,var(--spectrum-thumbnail-layer-border-width-outer)\n) solid var(\n--mod-thumbnail-layer-border-color-outer,var(--spectrum-thumbnail-layer-border-color-outer)\n);box-sizing:border-box;display:flex;justify-content:center}:host([layer]):before{content:none}:host([layer][selected]){outline-color:var(\n--highcontrast-thumbnail-border-color-selected,var(\n--mod-thumbnail-border-color-selected,var(--spectrum-thumbnail-border-color-selected)\n)\n);outline-offset:calc(var(\n--mod-thumbnail-border-width-selected,\nvar(--spectrum-thumbnail-border-width-selected)\n) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n));outline-style:solid;outline-width:var(\n--mod-thumbnail-border-width-selected,var(--spectrum-thumbnail-border-width-selected)\n)}.layer-inner{block-size:calc(var(--spectrum-thumbnail-size) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n)*2);inline-size:calc(var(--spectrum-thumbnail-size) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n)*2);outline-color:var(\n--mod-thumbnail-layer-border-color-inner,var(--spectrum-thumbnail-layer-border-color-inner)\n);outline-style:solid;outline-width:calc(var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n) - var(\n--mod-thumbnail-layer-border-width-outer,\nvar(--spectrum-thumbnail-layer-border-width-outer)\n))}.image-wrapper,.layer-inner{align-items:center;display:flex;justify-content:center}.image-wrapper{block-size:100%;inline-size:100%}::slotted(*){max-block-size:100%;max-inline-size:100%;position:relative;z-index:1}:host([cover]) ::slotted(*){block-size:100%;inline-size:100%;object-fit:cover;object-position:center}.background{background-position:50%;background-size:cover;block-size:100%;border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);inline-size:100%;inset-block:0;inset-inline:0;position:absolute;z-index:0}@media (forced-colors:active){:host{--highcontrast-thumbnail-border-color-selected:SelectedItem;--highcontrast-thumbnail-focus-indicator-color:Highlight;--highcontrast-thumbnail-border-color:CanvasText;background-color:Canvas;color:CanvasText;forced-color-adjust:none}}::slotted(:not(img)){display:none}\n`;\nexport default styles;"],
5
- "mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAiGf,eAAeC",
4
+ "sourcesContent": ["/*\nCopyright 2024 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host{--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-500);--spectrum-thumbnail-border-radius:var(--spectrum-corner-radius-75);--spectrum-thumbnail-border-width:var(--spectrum-border-width-100);--spectrum-thumbnail-border-color-rgba:rgba(var(--spectrum-gray-800-rgb),var(--spectrum-thumbnail-border-color-opacity));--spectrum-thumbnail-layer-border-width-inner:var(\n--spectrum-border-width-400\n);--spectrum-thumbnail-layer-border-color-inner:var(--spectrum-white);--spectrum-thumbnail-layer-border-width-outer:var(\n--spectrum-border-width-100\n);--spectrum-thumbnail-layer-border-color-outer:var(--spectrum-gray-500);--spectrum-thumbnail-border-width-selected:var(\n--spectrum-border-width-200\n);--spectrum-thumbnail-border-color-selected:var(\n--spectrum-accent-color-800\n);--spectrum-thumbnail-focus-indicator-thickness:var(\n--spectrum-focus-indicator-thickness\n);--spectrum-thumbnail-focus-indicator-gap:var(\n--spectrum-focus-indicator-gap\n);--spectrum-thumbnail-focus-indicator-color:var(\n--spectrum-focus-indicator-color\n);--spectrum-thumbnail-color-opacity-disabled:var(\n--spectrum-thumbnail-opacity-disabled\n)}:host([size=\"50\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-50)}:host([size=\"75\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-75)}:host([size=\"100\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-100)}:host([size=\"200\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-200)}:host([size=\"300\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-300)}:host([size=\"400\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-400)}:host([size=\"500\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-500)}:host([size=\"600\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-600)}:host([size=\"700\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-700)}:host([size=\"800\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-800)}:host([size=\"900\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-900)}:host([size=\"1000\"]){--spectrum-thumbnail-size:var(--spectrum-thumbnail-size-1000)}:host{block-size:var(--mod-thumbnail-size,var(--spectrum-thumbnail-size));border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);display:block;inline-size:var(--mod-thumbnail-size,var(--spectrum-thumbnail-size));margin:0;overflow:hidden;padding:0;position:relative;vertical-align:top;z-index:0}:host:before{block-size:100%;border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);box-shadow:inset 0 0 0 var(\n--mod-thumbnail-border-width,var(--spectrum-thumbnail-border-width)\n) var(\n--highcontrast-thumbnail-border-color,var(\n--mod-thumbnail-border-color,var(--spectrum-thumbnail-border-color-rgba)\n)\n);content:\"\";inline-size:100%;position:absolute;z-index:2}:host([disabled]){opacity:var(\n--mod-thumbnail-color-opacity-disabled,var(--spectrum-thumbnail-color-opacity-disabled)\n)}:host([focused]){overflow:visible}:host([focused]):after{border-color:var(\n--highcontrast-thumbnail-focus-indicator-color,var(\n--mod-thumbnail-focus-indicator-color,var(--spectrum-thumbnail-focus-indicator-color)\n)\n);border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);border-style:solid;border-width:var(\n--mod-thumbnail-focus-indicator-thickness,var(--spectrum-thumbnail-focus-indicator-thickness)\n);content:\"\";inset-block-end:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-block-start:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-inline-end:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);inset-inline-start:calc((var(\n--mod-thumbnail-focus-indicator-gap,\nvar(--spectrum-thumbnail-focus-indicator-gap)\n) + var(\n--mod-thumbnail-focus-indicator-thickness,\nvar(--spectrum-thumbnail-focus-indicator-thickness)\n))*-1);position:absolute}:host([focused]) .image-wrapper{border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);overflow:hidden}:host([layer]){align-items:center;border-color:var(\n--highcontrast-thumbnail-layer-border-color-outer,var(\n--mod-thumbnail-layer-border-color-outer,var(--spectrum-thumbnail-layer-border-color-outer)\n)\n);border-style:solid;border-width:var(\n--mod-thumbnail-layer-border-width-outer,var(--spectrum-thumbnail-layer-border-width-outer)\n);box-sizing:border-box;display:flex;justify-content:center}:host([layer]):before{content:none}:host([layer][selected]){outline-color:var(\n--highcontrast-thumbnail-border-color-selected,var(\n--mod-thumbnail-border-color-selected,var(--spectrum-thumbnail-border-color-selected)\n)\n);outline-offset:calc(var(\n--mod-thumbnail-border-width-selected,\nvar(--spectrum-thumbnail-border-width-selected)\n) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n));outline-style:solid;outline-width:var(\n--mod-thumbnail-border-width-selected,var(--spectrum-thumbnail-border-width-selected)\n)}.layer-inner{block-size:calc(var(--spectrum-thumbnail-size) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n)*2);inline-size:calc(var(--spectrum-thumbnail-size) - var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n)*2);outline-color:var(\n--highcontrast-thumbnail-layer-border-color-inner,var(\n--mod-thumbnail-layer-border-color-inner,var(--spectrum-thumbnail-layer-border-color-inner)\n)\n);outline-style:solid;outline-width:calc(var(\n--mod-thumbnail-layer-border-width-inner,\nvar(--spectrum-thumbnail-layer-border-width-inner)\n) - var(\n--mod-thumbnail-layer-border-width-outer,\nvar(--spectrum-thumbnail-layer-border-width-outer)\n))}.image-wrapper,.layer-inner{align-items:center;display:flex;justify-content:center}.image-wrapper{block-size:100%;inline-size:100%}::slotted(*){max-block-size:100%;max-inline-size:100%;position:relative;z-index:1}:host([cover]) ::slotted(*){block-size:100%;inline-size:100%;object-fit:cover;object-position:center}.background{background-position:50%;background-size:cover;block-size:100%;border-radius:var(\n--mod-thumbnail-border-radius,var(--spectrum-thumbnail-border-radius)\n);inline-size:100%;inset-block:0;inset-inline:0;position:absolute;z-index:0}@media (forced-colors:active){:host{--highcontrast-thumbnail-border-color-selected:Highlight;--highcontrast-thumbnail-focus-indicator-color:Highlight;--highcontrast-thumbnail-border-color:CanvasText;--highcontrast-thumbnail-layer-border-color-inner:Canvas;--highcontrast-thumbnail-layer-border-color-outer:CanvasText;forced-color-adjust:none}}::slotted(:not(img)){display:none}\n`;\nexport default styles;"],
5
+ "mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAqGf,eAAeC",
6
6
  "names": ["css", "styles"]
7
7
  }