@spectrum-web-components/card 0.0.0-20241209155954

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.
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["card.css.ts"],
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{box-sizing:border-box;min-inline-size:var(--mod-card-minimum-width,var(--spectrum-card-minimum-width));border:var(--mod-card-border-width,var(--spectrum-card-border-width))solid transparent;border-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border-color:var(--highcontrast-card-border-color,var(--mod-card-border-color,var(--spectrum-card-border-color)));background-color:var(--highcontrast-card-background-color,var(--mod-card-background-color,var(--spectrum-card-background-color)));flex-direction:column;-webkit-text-decoration:none;text-decoration:none;display:inline-flex;position:relative}:host:after,:host:before{content:\"\";block-size:100%;inline-size:100%;position:absolute;inset-block-start:0;inset-inline-start:0}:host:after{border-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border:0 solid #0000;margin-block-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);margin-inline-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);inset-inline-end:0}:host(:focus-visible){outline:none}:host(:focus-visible):after{border-width:var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width));border-color:var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color))}:host(:focus-visible) #cover-photo,:host(:focus-visible) #preview{border-start-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width)));border-start-end-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width)))}:host([selected]){border-color:var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)))}:host([selected]):before{background-color:rgba(var(--mod-card-selected-background-color-rgb,var(--spectrum-card-selected-background-color-rgb)),var(--mod-card-selected-background-opacity,var(--spectrum-card-selected-background-opacity)))}:host([drop-target]){border-color:var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)));box-shadow:0 0 0 1px var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)));background-color:var(--mod-card-background-color,var(--spectrum-card-background-color-quiet))}:host([focused]) .actions,:host([focused]) .checkbox-toggle,:host([selected]) .actions,:host([selected]) .checkbox-toggle,:host(:focus) .actions,:host(:focus) .checkbox-toggle{visibility:visible;opacity:1;pointer-events:all}.checkbox-toggle{visibility:hidden;box-shadow:var(--mod-card-actions-drop-shadow-x,var(--spectrum-card-actions-drop-shadow-x))var(--mod-card-actions-drop-shadow-y,var(--spectrum-card-actions-drop-shadow-y))var(--mod-card-actions-drop-shadow-blur,var(--spectrum-card-actions-drop-shadow-blur))var(--mod-card-actions-drop-shadow-color,var(--spectrum-card-actions-drop-shadow-color));inline-size:var(--mod-card-actions-size,var(--spectrum-card-actions-size));block-size:var(--mod-card-actions-size,var(--spectrum-card-actions-size));border-radius:var(--mod-card-actions-border-radius,var(--spectrum-card-actions-border-radius));background-color:rgba(var(--mod-card-actions-background-color-rgb,var(--spectrum-card-actions-background-color-rgb)),var(--mod-card-actions-background-color-opacity,var(--spectrum-card-actions-background-color-opacity)));pointer-events:auto;box-sizing:border-box;transition:transform .13s ease-in-out,opacity .13s ease-in-out,visibility 0s linear .13s;transition:transform var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s))ease-in-out,opacity var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s))ease-in-out,visibility 0s linear var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s));justify-content:center;align-items:center;display:inline-flex;position:absolute;inset-block-start:calc(var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));inset-inline-start:calc(var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width)))}.actions{inset-block-start:var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing));inset-inline-end:var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing))}#cover-photo{block-size:var(--mod-card-preview-minimum-height,var(--spectrum-card-preview-minimum-height));box-sizing:border-box;background-position:50%;background-size:cover;background-color:var(--mod-card-preview-background-color,var(--spectrum-card-preview-background-color));border-block-end-color:var(--mod-card-border-color,var(--spectrum-card-border-color));border-start-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));border-start-end-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));border-end-end-radius:0;border-end-start-radius:0;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.spectrum-Divider{margin:0}.content{align-items:center;margin-block-start:var(--mod-card-content-margin-top,var(--spectrum-card-content-margin-top));display:flex}.body{padding-block-start:var(--mod-card-body-padding-block-start,var(--mod-card-title-padding-top,var(--spectrum-card-title-padding-top)));padding-block-end:var(--mod-card-body-padding-block-end,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))));padding-inline-start:var(--mod-card-body-padding-inline-start,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))));padding-inline-end:var(--mod-card-body-padding-inline-end,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))))}#preview{color:var(--highcontrast-card-body-font-color,var(--mod-card-body-font-color,var(--spectrum-card-body-font-color)));border-start-start-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border-start-end-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border-end-end-radius:0;border-end-start-radius:0;align-items:center;display:flex;overflow:hidden}.title{font-family:var(--mod-card-title-font-family,var(--spectrum-card-title-font-family));font-size:var(--mod-card-title-font-size,var(--spectrum-card-title-font-size));font-weight:var(--mod-card-title-font-weight,var(--spectrum-card-title-font-weight));font-style:var(--mod-card-title-font-style,var(--spectrum-card-title-font-style));line-height:var(--mod-card-title-line-height,var(--spectrum-card-title-line-height));padding-inline-end:var(--mod-card-title-padding-right,var(--spectrum-card-title-padding-right))}.subtitle,.title{color:var(--highcontrast-card-title-font-color,var(--mod-card-title-font-color,var(--spectrum-card-title-font-color)))}.subtitle{text-transform:none}.subtitle,.subtitle+::slotted([slot=description]):before{padding-inline-end:var(--mod-card-subtitle-padding-right,var(--spectrum-card-subtitle-padding-right))}.subtitle+::slotted([slot=description]):before{content:\"\u2022\"}::slotted([slot=description]){font-family:var(--mod-card-body-font-family,var(--spectrum-card-body-font-family));font-size:var(--mod-card-body-font-size,var(--spectrum-card-body-font-size));font-weight:var(--mod-card-body-font-weight,var(--spectrum-card-body-font-weight));font-style:var(--mod-card-body-font-style,var(--spectrum-card-body-font-style))}::slotted([slot=description]),::slotted([slot=footer]){line-height:var(--mod-card-body-line-height,var(--spectrum-card-body-line-height));color:var(--highcontrast-card-body-font-color,var(--mod-card-body-font-color,var(--spectrum-card-body-font-color)))}::slotted([slot=footer]){border-block-start:var(--mod-card-border-width,var(--spectrum-card-border-width))solid var(--mod-card-divider-color,var(--spectrum-card-divider-color));margin-block-start:var(--mod-card-footer-margin-block-start,calc(( var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-content-margin-bottom,var(--spectrum-card-content-margin-bottom)))*-1));margin-inline-start:var(--mod-card-footer-margin-inline-start,var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)));margin-inline-end:var(--mod-card-footer-margin-inline-end,var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)));padding-block-start:var(--mod-card-footer-padding-block-start,var(--mod-card-footer-margin-top,var(--spectrum-card-footer-padding-top)));padding-block-end:var(--mod-card-footer-padding-block-end,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))))}.header{justify-content:space-between;align-items:center;display:flex}.action-button{z-index:1;justify-content:flex-end;align-self:center;display:flex}:host([variant=quiet]) #preview{border:var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))solid transparent}:host([variant=quiet][focused]):after,:host([variant=quiet]:focus):after{border-width:0}:host([variant=quiet][focused]) #preview:after,:host([variant=quiet]:focus) #preview:after{border-color:var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color))}:host([variant=quiet][selected]) #preview{border:var(--mod-card-preview-border-width-selected,var(--mod-card-preview-border-width,var(--spectrum-card-preview-border-width-selected)))solid;border-color:var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)))}:host([variant=gallery]),:host([variant=quiet]){--spectrum-card-content-margin-top:var(--mod-card-content-margin-top-quiet,var(--spectrum-card-content-margin-top-quiet));--spectrum-card-minimum-width:var(--mod-card-minimum-width-quiet,var(--spectrum-card-minimum-width-quiet));block-size:100%;min-inline-size:var(--mod-card-minimum-width,var(--spectrum-card-minimum-width));background-color:initial;border-width:0;border-color:#0000;border-radius:0;overflow:visible}:host([variant=gallery]):before,:host([variant=quiet]):before{display:none}:host([variant=gallery]) #preview,:host([variant=quiet]) #preview{border-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));background-color:var(--mod-card-preview-background-color,var(--mod-card-background-color,var(--spectrum-card-preview-background-color)));min-block-size:var(--mod-card-preview-minimum-height,var(--spectrum-card-preview-minimum-height));inline-size:100%;box-sizing:border-box;transition:background-color var(--mod-card-animation-duration,var(--mod-animation-duration-100,var(--spectrum-animation-duration-100)));flex:1;margin:0 auto;position:relative;overflow:visible}:host([variant=gallery]) #preview:after,:host([variant=gallery]) #preview:before,:host([variant=quiet]) #preview:after,:host([variant=quiet]) #preview:before{content:\"\";block-size:100%;inline-size:100%;position:absolute;inset-block-start:0;inset-inline-start:0}:host([variant=gallery]) #preview:after,:host([variant=quiet]) #preview:after{border-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) + var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width)));border:0 solid #0000;margin-block-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);margin-inline-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);inset-inline-end:0}:host([variant=gallery][drop-target]),:host([variant=quiet][drop-target]){background-color:initial;box-shadow:none;border-color:#0000}:host([variant=gallery][drop-target]) #preview,:host([variant=quiet][drop-target]) #preview{background-color:var(--mod-card-preview-background-color,var(--mod-card-background-color,var(--spectrum-card-preview-background-color)));transition:none}:host([variant=gallery][drop-target]) #preview:before,:host([variant=quiet][drop-target]) #preview:before{border-color:var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color));box-shadow:0 0 0 1px var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color))}:host([variant=gallery][selected]) #preview:before,:host([variant=quiet][selected]) #preview:before{background-color:rgba(var(--mod-card-selected-background-color-rgb,var(--spectrum-card-selected-background-color-rgb)),var(--mod-card-selected-background-opacity,var(--spectrum-card-selected-background-opacity)))}:host([variant=gallery]) .body,:host([variant=quiet]) .body{margin-block-start:var(--mod-card-content-margin-top,var(--spectrum-card-content-margin-top));padding:0}:host([variant=gallery]) ::slotted([slot=footer]),:host([variant=quiet]) ::slotted([slot=footer]){margin-inline:0}:host([horizontal]){flex-direction:row}@media (hover:hover){:host(:hover){border-color:var(--highcontrast-card-border-color-hover,var(--mod-card-border-color-hover,var(--spectrum-card-border-color-hover)))}:host(:hover) .actions,:host(:hover) .checkbox-toggle{visibility:visible;opacity:1;pointer-events:all}:host([variant=gallery]:hover),:host([variant=quiet]:hover){border-color:#0000}:host([variant=gallery]:hover) #preview,:host([variant=quiet]:hover) #preview{background-color:var(--mod-card-preview-background-color-hover,var(--mod-card-background-color-hover,var(--spectrum-card-preview-background-color-hover)))}:host([horizontal]:hover) #preview{border-color:var(--mod-card-border-color-hover,var(--spectrum-card-border-color-hover))}}:host([horizontal]) #preview{min-block-size:0;padding:var(--mod-card-horizontal-preview-padding,var(--spectrum-card-horizontal-preview-padding));background-color:var(--mod-card-preview-background-color,var(--spectrum-card-preview-background-color));border-color:var(--mod-card-border-color,var(--spectrum-card-border-color));border-start-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));flex-shrink:0;justify-content:center;align-items:center;display:flex}:host([horizontal]) .content,:host([horizontal]) .header{block-size:auto;margin-block-start:0}:host([horizontal]) .content{margin-block-end:0}:host([horizontal]) .title{padding-inline-end:0}:host([horizontal]) .body{padding-block:0;padding-inline:var(--mod-card-horizontal-body-padding,var(--spectrum-card-horizontal-body-padding));flex-direction:column;flex-shrink:0;justify-content:center;display:flex}:host([variant=gallery]){min-inline-size:0}:host([variant=gallery]) #preview{border-radius:0;padding:0}:host{--spectrum-card-background-color:var(--system-card-background-color);--spectrum-card-body-spacing:var(--system-card-body-spacing);--spectrum-card-title-padding-top:var(--system-card-title-padding-top);--spectrum-card-title-padding-right:var(--system-card-title-padding-right);--spectrum-card-content-margin-top:var(--system-card-content-margin-top);--spectrum-card-content-margin-bottom:var(--system-card-content-margin-bottom);--spectrum-card-footer-padding-top:var(--system-card-footer-padding-top);--spectrum-card-subtitle-padding-right:var(--system-card-subtitle-padding-right);--spectrum-card-border-width:var(--system-card-border-width);--spectrum-card-corner-radius:var(--system-card-corner-radius);--spectrum-card-border-color:var(--system-card-border-color);--spectrum-card-border-color-hover:var(--system-card-border-color-hover);--spectrum-card-border-color-selected:var(--system-card-border-color-selected);--spectrum-card-divider-color:var(--system-card-divider-color);--spectrum-card-title-font-family:var(--system-card-title-font-family);--spectrum-card-title-font-size:var(--system-card-title-font-size);--spectrum-card-title-font-weight:var(--system-card-title-font-weight);--spectrum-card-title-font-style:var(--system-card-title-font-style);--spectrum-card-title-line-height:var(--system-card-title-line-height);--spectrum-card-title-font-color:var(--system-card-title-font-color);--spectrum-card-body-font-family:var(--system-card-body-font-family);--spectrum-card-body-font-size:var(--system-card-body-font-size);--spectrum-card-body-font-weight:var(--system-card-body-font-weight);--spectrum-card-body-font-style:var(--system-card-body-font-style);--spectrum-card-body-line-height:var(--system-card-body-line-height);--spectrum-card-body-font-color:var(--system-card-body-font-color);--spectrum-card-actions-spacing:var(--system-card-actions-spacing);--spectrum-card-actions-size:var(--system-card-actions-size);--spectrum-card-actions-border-radius:var(--system-card-actions-border-radius);--spectrum-card-actions-background-color-rgb:var(--system-card-actions-background-color-rgb);--spectrum-card-actions-background-color-opacity:var(--system-card-actions-background-color-opacity);--spectrum-card-actions-drop-shadow-color:var(--system-card-actions-drop-shadow-color);--spectrum-card-actions-drop-shadow-x:var(--system-card-actions-drop-shadow-x);--spectrum-card-actions-drop-shadow-y:var(--system-card-actions-drop-shadow-y);--spectrum-card-actions-drop-shadow-blur:var(--system-card-actions-drop-shadow-blur);--spectrum-card-focus-indicator-color:var(--system-card-focus-indicator-color);--spectrum-card-focus-indicator-width:var(--system-card-focus-indicator-width);--spectrum-card-selected-background-opacity:var(--system-card-selected-background-opacity);--spectrum-card-preview-border-width-selected:var(--system-card-preview-border-width-selected);--spectrum-card-preview-background-color:var(--system-card-preview-background-color);--spectrum-card-preview-background-color-hover:var(--system-card-preview-background-color-hover);--spectrum-card-horizontal-body-padding:var(--system-card-horizontal-body-padding);--spectrum-card-horizontal-preview-padding:var(--system-card-horizontal-preview-padding);--spectrum-card-content-margin-top-quiet:var(--system-card-content-margin-top-quiet);--spectrum-card-minimum-width-quiet:var(--system-card-minimum-width-quiet);--spectrum-card-background-color-quiet:var(--system-card-background-color-quiet)}:host([href]:not([href=\"\"])){cursor:pointer}#like-anchor{pointer-events:none;position:absolute;inset:0}.action-button{flex-grow:0}:host([dir=ltr]) .action-button{margin-left:auto}:host([dir=rtl]) .action-button{margin-right:auto}slot[name=description]{font-size:var(--spectrum-card-subtitle-text-size,var(--spectrum-global-dimension-font-size-50))}#preview+#cover-photo{display:none}#cover-photo ::slotted(*),:host(:not([variant=quiet])) #preview ::slotted(*){width:100%;object-fit:cover;display:block}:host(:not([variant=gallery])) #preview ::slotted(*){height:100%}:host([horizontal]) #preview{width:auto}:host([horizontal]) sp-asset{height:inherit}sp-popover{align-items:center}.actions{visibility:hidden;margin:auto}.title{width:var(--spectrum-card-title-width)}.subtitle{text-transform:none}:host:before,:host:after{pointer-events:none}\n`;\nexport default styles;"],
5
+ "mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAGf,eAAe;",
6
+ "names": []
7
+ }
@@ -0,0 +1,4 @@
1
+ "use strict";import{css as r}from"@spectrum-web-components/base";const o=r`
2
+ :host{box-sizing:border-box;min-inline-size:var(--mod-card-minimum-width,var(--spectrum-card-minimum-width));border:var(--mod-card-border-width,var(--spectrum-card-border-width))solid transparent;border-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border-color:var(--highcontrast-card-border-color,var(--mod-card-border-color,var(--spectrum-card-border-color)));background-color:var(--highcontrast-card-background-color,var(--mod-card-background-color,var(--spectrum-card-background-color)));flex-direction:column;-webkit-text-decoration:none;text-decoration:none;display:inline-flex;position:relative}:host:after,:host:before{content:"";block-size:100%;inline-size:100%;position:absolute;inset-block-start:0;inset-inline-start:0}:host:after{border-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border:0 solid #0000;margin-block-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);margin-inline-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);inset-inline-end:0}:host(:focus-visible){outline:none}:host(:focus-visible):after{border-width:var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width));border-color:var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color))}:host(:focus-visible) #cover-photo,:host(:focus-visible) #preview{border-start-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width)));border-start-end-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width)))}:host([selected]){border-color:var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)))}:host([selected]):before{background-color:rgba(var(--mod-card-selected-background-color-rgb,var(--spectrum-card-selected-background-color-rgb)),var(--mod-card-selected-background-opacity,var(--spectrum-card-selected-background-opacity)))}:host([drop-target]){border-color:var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)));box-shadow:0 0 0 1px var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)));background-color:var(--mod-card-background-color,var(--spectrum-card-background-color-quiet))}:host([focused]) .actions,:host([focused]) .checkbox-toggle,:host([selected]) .actions,:host([selected]) .checkbox-toggle,:host(:focus) .actions,:host(:focus) .checkbox-toggle{visibility:visible;opacity:1;pointer-events:all}.checkbox-toggle{visibility:hidden;box-shadow:var(--mod-card-actions-drop-shadow-x,var(--spectrum-card-actions-drop-shadow-x))var(--mod-card-actions-drop-shadow-y,var(--spectrum-card-actions-drop-shadow-y))var(--mod-card-actions-drop-shadow-blur,var(--spectrum-card-actions-drop-shadow-blur))var(--mod-card-actions-drop-shadow-color,var(--spectrum-card-actions-drop-shadow-color));inline-size:var(--mod-card-actions-size,var(--spectrum-card-actions-size));block-size:var(--mod-card-actions-size,var(--spectrum-card-actions-size));border-radius:var(--mod-card-actions-border-radius,var(--spectrum-card-actions-border-radius));background-color:rgba(var(--mod-card-actions-background-color-rgb,var(--spectrum-card-actions-background-color-rgb)),var(--mod-card-actions-background-color-opacity,var(--spectrum-card-actions-background-color-opacity)));pointer-events:auto;box-sizing:border-box;transition:transform .13s ease-in-out,opacity .13s ease-in-out,visibility 0s linear .13s;transition:transform var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s))ease-in-out,opacity var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s))ease-in-out,visibility 0s linear var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s));justify-content:center;align-items:center;display:inline-flex;position:absolute;inset-block-start:calc(var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));inset-inline-start:calc(var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width)))}.actions{inset-block-start:var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing));inset-inline-end:var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing))}#cover-photo{block-size:var(--mod-card-preview-minimum-height,var(--spectrum-card-preview-minimum-height));box-sizing:border-box;background-position:50%;background-size:cover;background-color:var(--mod-card-preview-background-color,var(--spectrum-card-preview-background-color));border-block-end-color:var(--mod-card-border-color,var(--spectrum-card-border-color));border-start-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));border-start-end-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));border-end-end-radius:0;border-end-start-radius:0;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.spectrum-Divider{margin:0}.content{align-items:center;margin-block-start:var(--mod-card-content-margin-top,var(--spectrum-card-content-margin-top));display:flex}.body{padding-block-start:var(--mod-card-body-padding-block-start,var(--mod-card-title-padding-top,var(--spectrum-card-title-padding-top)));padding-block-end:var(--mod-card-body-padding-block-end,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))));padding-inline-start:var(--mod-card-body-padding-inline-start,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))));padding-inline-end:var(--mod-card-body-padding-inline-end,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))))}#preview{color:var(--highcontrast-card-body-font-color,var(--mod-card-body-font-color,var(--spectrum-card-body-font-color)));border-start-start-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border-start-end-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border-end-end-radius:0;border-end-start-radius:0;align-items:center;display:flex;overflow:hidden}.title{font-family:var(--mod-card-title-font-family,var(--spectrum-card-title-font-family));font-size:var(--mod-card-title-font-size,var(--spectrum-card-title-font-size));font-weight:var(--mod-card-title-font-weight,var(--spectrum-card-title-font-weight));font-style:var(--mod-card-title-font-style,var(--spectrum-card-title-font-style));line-height:var(--mod-card-title-line-height,var(--spectrum-card-title-line-height));padding-inline-end:var(--mod-card-title-padding-right,var(--spectrum-card-title-padding-right))}.subtitle,.title{color:var(--highcontrast-card-title-font-color,var(--mod-card-title-font-color,var(--spectrum-card-title-font-color)))}.subtitle{text-transform:none}.subtitle,.subtitle+::slotted([slot=description]):before{padding-inline-end:var(--mod-card-subtitle-padding-right,var(--spectrum-card-subtitle-padding-right))}.subtitle+::slotted([slot=description]):before{content:"•"}::slotted([slot=description]){font-family:var(--mod-card-body-font-family,var(--spectrum-card-body-font-family));font-size:var(--mod-card-body-font-size,var(--spectrum-card-body-font-size));font-weight:var(--mod-card-body-font-weight,var(--spectrum-card-body-font-weight));font-style:var(--mod-card-body-font-style,var(--spectrum-card-body-font-style))}::slotted([slot=description]),::slotted([slot=footer]){line-height:var(--mod-card-body-line-height,var(--spectrum-card-body-line-height));color:var(--highcontrast-card-body-font-color,var(--mod-card-body-font-color,var(--spectrum-card-body-font-color)))}::slotted([slot=footer]){border-block-start:var(--mod-card-border-width,var(--spectrum-card-border-width))solid var(--mod-card-divider-color,var(--spectrum-card-divider-color));margin-block-start:var(--mod-card-footer-margin-block-start,calc(( var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-content-margin-bottom,var(--spectrum-card-content-margin-bottom)))*-1));margin-inline-start:var(--mod-card-footer-margin-inline-start,var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)));margin-inline-end:var(--mod-card-footer-margin-inline-end,var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)));padding-block-start:var(--mod-card-footer-padding-block-start,var(--mod-card-footer-margin-top,var(--spectrum-card-footer-padding-top)));padding-block-end:var(--mod-card-footer-padding-block-end,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))))}.header{justify-content:space-between;align-items:center;display:flex}.action-button{z-index:1;justify-content:flex-end;align-self:center;display:flex}:host([variant=quiet]) #preview{border:var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))solid transparent}:host([variant=quiet][focused]):after,:host([variant=quiet]:focus):after{border-width:0}:host([variant=quiet][focused]) #preview:after,:host([variant=quiet]:focus) #preview:after{border-color:var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color))}:host([variant=quiet][selected]) #preview{border:var(--mod-card-preview-border-width-selected,var(--mod-card-preview-border-width,var(--spectrum-card-preview-border-width-selected)))solid;border-color:var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)))}:host([variant=gallery]),:host([variant=quiet]){--spectrum-card-content-margin-top:var(--mod-card-content-margin-top-quiet,var(--spectrum-card-content-margin-top-quiet));--spectrum-card-minimum-width:var(--mod-card-minimum-width-quiet,var(--spectrum-card-minimum-width-quiet));block-size:100%;min-inline-size:var(--mod-card-minimum-width,var(--spectrum-card-minimum-width));background-color:initial;border-width:0;border-color:#0000;border-radius:0;overflow:visible}:host([variant=gallery]):before,:host([variant=quiet]):before{display:none}:host([variant=gallery]) #preview,:host([variant=quiet]) #preview{border-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));background-color:var(--mod-card-preview-background-color,var(--mod-card-background-color,var(--spectrum-card-preview-background-color)));min-block-size:var(--mod-card-preview-minimum-height,var(--spectrum-card-preview-minimum-height));inline-size:100%;box-sizing:border-box;transition:background-color var(--mod-card-animation-duration,var(--mod-animation-duration-100,var(--spectrum-animation-duration-100)));flex:1;margin:0 auto;position:relative;overflow:visible}:host([variant=gallery]) #preview:after,:host([variant=gallery]) #preview:before,:host([variant=quiet]) #preview:after,:host([variant=quiet]) #preview:before{content:"";block-size:100%;inline-size:100%;position:absolute;inset-block-start:0;inset-inline-start:0}:host([variant=gallery]) #preview:after,:host([variant=quiet]) #preview:after{border-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) + var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width)));border:0 solid #0000;margin-block-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);margin-inline-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);inset-inline-end:0}:host([variant=gallery][drop-target]),:host([variant=quiet][drop-target]){background-color:initial;box-shadow:none;border-color:#0000}:host([variant=gallery][drop-target]) #preview,:host([variant=quiet][drop-target]) #preview{background-color:var(--mod-card-preview-background-color,var(--mod-card-background-color,var(--spectrum-card-preview-background-color)));transition:none}:host([variant=gallery][drop-target]) #preview:before,:host([variant=quiet][drop-target]) #preview:before{border-color:var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color));box-shadow:0 0 0 1px var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color))}:host([variant=gallery][selected]) #preview:before,:host([variant=quiet][selected]) #preview:before{background-color:rgba(var(--mod-card-selected-background-color-rgb,var(--spectrum-card-selected-background-color-rgb)),var(--mod-card-selected-background-opacity,var(--spectrum-card-selected-background-opacity)))}:host([variant=gallery]) .body,:host([variant=quiet]) .body{margin-block-start:var(--mod-card-content-margin-top,var(--spectrum-card-content-margin-top));padding:0}:host([variant=gallery]) ::slotted([slot=footer]),:host([variant=quiet]) ::slotted([slot=footer]){margin-inline:0}:host([horizontal]){flex-direction:row}@media (hover:hover){:host(:hover){border-color:var(--highcontrast-card-border-color-hover,var(--mod-card-border-color-hover,var(--spectrum-card-border-color-hover)))}:host(:hover) .actions,:host(:hover) .checkbox-toggle{visibility:visible;opacity:1;pointer-events:all}:host([variant=gallery]:hover),:host([variant=quiet]:hover){border-color:#0000}:host([variant=gallery]:hover) #preview,:host([variant=quiet]:hover) #preview{background-color:var(--mod-card-preview-background-color-hover,var(--mod-card-background-color-hover,var(--spectrum-card-preview-background-color-hover)))}:host([horizontal]:hover) #preview{border-color:var(--mod-card-border-color-hover,var(--spectrum-card-border-color-hover))}}:host([horizontal]) #preview{min-block-size:0;padding:var(--mod-card-horizontal-preview-padding,var(--spectrum-card-horizontal-preview-padding));background-color:var(--mod-card-preview-background-color,var(--spectrum-card-preview-background-color));border-color:var(--mod-card-border-color,var(--spectrum-card-border-color));border-start-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));flex-shrink:0;justify-content:center;align-items:center;display:flex}:host([horizontal]) .content,:host([horizontal]) .header{block-size:auto;margin-block-start:0}:host([horizontal]) .content{margin-block-end:0}:host([horizontal]) .title{padding-inline-end:0}:host([horizontal]) .body{padding-block:0;padding-inline:var(--mod-card-horizontal-body-padding,var(--spectrum-card-horizontal-body-padding));flex-direction:column;flex-shrink:0;justify-content:center;display:flex}:host([variant=gallery]){min-inline-size:0}:host([variant=gallery]) #preview{border-radius:0;padding:0}:host{--spectrum-card-background-color:var(--system-card-background-color);--spectrum-card-body-spacing:var(--system-card-body-spacing);--spectrum-card-title-padding-top:var(--system-card-title-padding-top);--spectrum-card-title-padding-right:var(--system-card-title-padding-right);--spectrum-card-content-margin-top:var(--system-card-content-margin-top);--spectrum-card-content-margin-bottom:var(--system-card-content-margin-bottom);--spectrum-card-footer-padding-top:var(--system-card-footer-padding-top);--spectrum-card-subtitle-padding-right:var(--system-card-subtitle-padding-right);--spectrum-card-border-width:var(--system-card-border-width);--spectrum-card-corner-radius:var(--system-card-corner-radius);--spectrum-card-border-color:var(--system-card-border-color);--spectrum-card-border-color-hover:var(--system-card-border-color-hover);--spectrum-card-border-color-selected:var(--system-card-border-color-selected);--spectrum-card-divider-color:var(--system-card-divider-color);--spectrum-card-title-font-family:var(--system-card-title-font-family);--spectrum-card-title-font-size:var(--system-card-title-font-size);--spectrum-card-title-font-weight:var(--system-card-title-font-weight);--spectrum-card-title-font-style:var(--system-card-title-font-style);--spectrum-card-title-line-height:var(--system-card-title-line-height);--spectrum-card-title-font-color:var(--system-card-title-font-color);--spectrum-card-body-font-family:var(--system-card-body-font-family);--spectrum-card-body-font-size:var(--system-card-body-font-size);--spectrum-card-body-font-weight:var(--system-card-body-font-weight);--spectrum-card-body-font-style:var(--system-card-body-font-style);--spectrum-card-body-line-height:var(--system-card-body-line-height);--spectrum-card-body-font-color:var(--system-card-body-font-color);--spectrum-card-actions-spacing:var(--system-card-actions-spacing);--spectrum-card-actions-size:var(--system-card-actions-size);--spectrum-card-actions-border-radius:var(--system-card-actions-border-radius);--spectrum-card-actions-background-color-rgb:var(--system-card-actions-background-color-rgb);--spectrum-card-actions-background-color-opacity:var(--system-card-actions-background-color-opacity);--spectrum-card-actions-drop-shadow-color:var(--system-card-actions-drop-shadow-color);--spectrum-card-actions-drop-shadow-x:var(--system-card-actions-drop-shadow-x);--spectrum-card-actions-drop-shadow-y:var(--system-card-actions-drop-shadow-y);--spectrum-card-actions-drop-shadow-blur:var(--system-card-actions-drop-shadow-blur);--spectrum-card-focus-indicator-color:var(--system-card-focus-indicator-color);--spectrum-card-focus-indicator-width:var(--system-card-focus-indicator-width);--spectrum-card-selected-background-opacity:var(--system-card-selected-background-opacity);--spectrum-card-preview-border-width-selected:var(--system-card-preview-border-width-selected);--spectrum-card-preview-background-color:var(--system-card-preview-background-color);--spectrum-card-preview-background-color-hover:var(--system-card-preview-background-color-hover);--spectrum-card-horizontal-body-padding:var(--system-card-horizontal-body-padding);--spectrum-card-horizontal-preview-padding:var(--system-card-horizontal-preview-padding);--spectrum-card-content-margin-top-quiet:var(--system-card-content-margin-top-quiet);--spectrum-card-minimum-width-quiet:var(--system-card-minimum-width-quiet);--spectrum-card-background-color-quiet:var(--system-card-background-color-quiet)}:host([href]:not([href=""])){cursor:pointer}#like-anchor{pointer-events:none;position:absolute;inset:0}.action-button{flex-grow:0}:host([dir=ltr]) .action-button{margin-left:auto}:host([dir=rtl]) .action-button{margin-right:auto}slot[name=description]{font-size:var(--spectrum-card-subtitle-text-size,var(--spectrum-global-dimension-font-size-50))}#preview+#cover-photo{display:none}#cover-photo ::slotted(*),:host(:not([variant=quiet])) #preview ::slotted(*){width:100%;object-fit:cover;display:block}:host(:not([variant=gallery])) #preview ::slotted(*){height:100%}:host([horizontal]) #preview{width:auto}:host([horizontal]) sp-asset{height:inherit}sp-popover{align-items:center}.actions{visibility:hidden;margin:auto}.title{width:var(--spectrum-card-title-width)}.subtitle{text-transform:none}:host:before,:host:after{pointer-events:none}
3
+ `;export default o;
4
+ //# sourceMappingURL=card.css.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["card.css.ts"],
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{box-sizing:border-box;min-inline-size:var(--mod-card-minimum-width,var(--spectrum-card-minimum-width));border:var(--mod-card-border-width,var(--spectrum-card-border-width))solid transparent;border-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border-color:var(--highcontrast-card-border-color,var(--mod-card-border-color,var(--spectrum-card-border-color)));background-color:var(--highcontrast-card-background-color,var(--mod-card-background-color,var(--spectrum-card-background-color)));flex-direction:column;-webkit-text-decoration:none;text-decoration:none;display:inline-flex;position:relative}:host:after,:host:before{content:\"\";block-size:100%;inline-size:100%;position:absolute;inset-block-start:0;inset-inline-start:0}:host:after{border-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border:0 solid #0000;margin-block-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);margin-inline-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);inset-inline-end:0}:host(:focus-visible){outline:none}:host(:focus-visible):after{border-width:var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width));border-color:var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color))}:host(:focus-visible) #cover-photo,:host(:focus-visible) #preview{border-start-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width)));border-start-end-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width)))}:host([selected]){border-color:var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)))}:host([selected]):before{background-color:rgba(var(--mod-card-selected-background-color-rgb,var(--spectrum-card-selected-background-color-rgb)),var(--mod-card-selected-background-opacity,var(--spectrum-card-selected-background-opacity)))}:host([drop-target]){border-color:var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)));box-shadow:0 0 0 1px var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)));background-color:var(--mod-card-background-color,var(--spectrum-card-background-color-quiet))}:host([focused]) .actions,:host([focused]) .checkbox-toggle,:host([selected]) .actions,:host([selected]) .checkbox-toggle,:host(:focus) .actions,:host(:focus) .checkbox-toggle{visibility:visible;opacity:1;pointer-events:all}.checkbox-toggle{visibility:hidden;box-shadow:var(--mod-card-actions-drop-shadow-x,var(--spectrum-card-actions-drop-shadow-x))var(--mod-card-actions-drop-shadow-y,var(--spectrum-card-actions-drop-shadow-y))var(--mod-card-actions-drop-shadow-blur,var(--spectrum-card-actions-drop-shadow-blur))var(--mod-card-actions-drop-shadow-color,var(--spectrum-card-actions-drop-shadow-color));inline-size:var(--mod-card-actions-size,var(--spectrum-card-actions-size));block-size:var(--mod-card-actions-size,var(--spectrum-card-actions-size));border-radius:var(--mod-card-actions-border-radius,var(--spectrum-card-actions-border-radius));background-color:rgba(var(--mod-card-actions-background-color-rgb,var(--spectrum-card-actions-background-color-rgb)),var(--mod-card-actions-background-color-opacity,var(--spectrum-card-actions-background-color-opacity)));pointer-events:auto;box-sizing:border-box;transition:transform .13s ease-in-out,opacity .13s ease-in-out,visibility 0s linear .13s;transition:transform var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s))ease-in-out,opacity var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s))ease-in-out,visibility 0s linear var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s));justify-content:center;align-items:center;display:inline-flex;position:absolute;inset-block-start:calc(var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));inset-inline-start:calc(var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width)))}.actions{inset-block-start:var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing));inset-inline-end:var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing))}#cover-photo{block-size:var(--mod-card-preview-minimum-height,var(--spectrum-card-preview-minimum-height));box-sizing:border-box;background-position:50%;background-size:cover;background-color:var(--mod-card-preview-background-color,var(--spectrum-card-preview-background-color));border-block-end-color:var(--mod-card-border-color,var(--spectrum-card-border-color));border-start-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));border-start-end-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));border-end-end-radius:0;border-end-start-radius:0;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.spectrum-Divider{margin:0}.content{align-items:center;margin-block-start:var(--mod-card-content-margin-top,var(--spectrum-card-content-margin-top));display:flex}.body{padding-block-start:var(--mod-card-body-padding-block-start,var(--mod-card-title-padding-top,var(--spectrum-card-title-padding-top)));padding-block-end:var(--mod-card-body-padding-block-end,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))));padding-inline-start:var(--mod-card-body-padding-inline-start,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))));padding-inline-end:var(--mod-card-body-padding-inline-end,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))))}#preview{color:var(--highcontrast-card-body-font-color,var(--mod-card-body-font-color,var(--spectrum-card-body-font-color)));border-start-start-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border-start-end-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border-end-end-radius:0;border-end-start-radius:0;align-items:center;display:flex;overflow:hidden}.title{font-family:var(--mod-card-title-font-family,var(--spectrum-card-title-font-family));font-size:var(--mod-card-title-font-size,var(--spectrum-card-title-font-size));font-weight:var(--mod-card-title-font-weight,var(--spectrum-card-title-font-weight));font-style:var(--mod-card-title-font-style,var(--spectrum-card-title-font-style));line-height:var(--mod-card-title-line-height,var(--spectrum-card-title-line-height));padding-inline-end:var(--mod-card-title-padding-right,var(--spectrum-card-title-padding-right))}.subtitle,.title{color:var(--highcontrast-card-title-font-color,var(--mod-card-title-font-color,var(--spectrum-card-title-font-color)))}.subtitle{text-transform:none}.subtitle,.subtitle+::slotted([slot=description]):before{padding-inline-end:var(--mod-card-subtitle-padding-right,var(--spectrum-card-subtitle-padding-right))}.subtitle+::slotted([slot=description]):before{content:\"\u2022\"}::slotted([slot=description]){font-family:var(--mod-card-body-font-family,var(--spectrum-card-body-font-family));font-size:var(--mod-card-body-font-size,var(--spectrum-card-body-font-size));font-weight:var(--mod-card-body-font-weight,var(--spectrum-card-body-font-weight));font-style:var(--mod-card-body-font-style,var(--spectrum-card-body-font-style))}::slotted([slot=description]),::slotted([slot=footer]){line-height:var(--mod-card-body-line-height,var(--spectrum-card-body-line-height));color:var(--highcontrast-card-body-font-color,var(--mod-card-body-font-color,var(--spectrum-card-body-font-color)))}::slotted([slot=footer]){border-block-start:var(--mod-card-border-width,var(--spectrum-card-border-width))solid var(--mod-card-divider-color,var(--spectrum-card-divider-color));margin-block-start:var(--mod-card-footer-margin-block-start,calc(( var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-content-margin-bottom,var(--spectrum-card-content-margin-bottom)))*-1));margin-inline-start:var(--mod-card-footer-margin-inline-start,var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)));margin-inline-end:var(--mod-card-footer-margin-inline-end,var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)));padding-block-start:var(--mod-card-footer-padding-block-start,var(--mod-card-footer-margin-top,var(--spectrum-card-footer-padding-top)));padding-block-end:var(--mod-card-footer-padding-block-end,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))))}.header{justify-content:space-between;align-items:center;display:flex}.action-button{z-index:1;justify-content:flex-end;align-self:center;display:flex}:host([variant=quiet]) #preview{border:var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))solid transparent}:host([variant=quiet][focused]):after,:host([variant=quiet]:focus):after{border-width:0}:host([variant=quiet][focused]) #preview:after,:host([variant=quiet]:focus) #preview:after{border-color:var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color))}:host([variant=quiet][selected]) #preview{border:var(--mod-card-preview-border-width-selected,var(--mod-card-preview-border-width,var(--spectrum-card-preview-border-width-selected)))solid;border-color:var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)))}:host([variant=gallery]),:host([variant=quiet]){--spectrum-card-content-margin-top:var(--mod-card-content-margin-top-quiet,var(--spectrum-card-content-margin-top-quiet));--spectrum-card-minimum-width:var(--mod-card-minimum-width-quiet,var(--spectrum-card-minimum-width-quiet));block-size:100%;min-inline-size:var(--mod-card-minimum-width,var(--spectrum-card-minimum-width));background-color:initial;border-width:0;border-color:#0000;border-radius:0;overflow:visible}:host([variant=gallery]):before,:host([variant=quiet]):before{display:none}:host([variant=gallery]) #preview,:host([variant=quiet]) #preview{border-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));background-color:var(--mod-card-preview-background-color,var(--mod-card-background-color,var(--spectrum-card-preview-background-color)));min-block-size:var(--mod-card-preview-minimum-height,var(--spectrum-card-preview-minimum-height));inline-size:100%;box-sizing:border-box;transition:background-color var(--mod-card-animation-duration,var(--mod-animation-duration-100,var(--spectrum-animation-duration-100)));flex:1;margin:0 auto;position:relative;overflow:visible}:host([variant=gallery]) #preview:after,:host([variant=gallery]) #preview:before,:host([variant=quiet]) #preview:after,:host([variant=quiet]) #preview:before{content:\"\";block-size:100%;inline-size:100%;position:absolute;inset-block-start:0;inset-inline-start:0}:host([variant=gallery]) #preview:after,:host([variant=quiet]) #preview:after{border-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) + var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width)));border:0 solid #0000;margin-block-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);margin-inline-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);inset-inline-end:0}:host([variant=gallery][drop-target]),:host([variant=quiet][drop-target]){background-color:initial;box-shadow:none;border-color:#0000}:host([variant=gallery][drop-target]) #preview,:host([variant=quiet][drop-target]) #preview{background-color:var(--mod-card-preview-background-color,var(--mod-card-background-color,var(--spectrum-card-preview-background-color)));transition:none}:host([variant=gallery][drop-target]) #preview:before,:host([variant=quiet][drop-target]) #preview:before{border-color:var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color));box-shadow:0 0 0 1px var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color))}:host([variant=gallery][selected]) #preview:before,:host([variant=quiet][selected]) #preview:before{background-color:rgba(var(--mod-card-selected-background-color-rgb,var(--spectrum-card-selected-background-color-rgb)),var(--mod-card-selected-background-opacity,var(--spectrum-card-selected-background-opacity)))}:host([variant=gallery]) .body,:host([variant=quiet]) .body{margin-block-start:var(--mod-card-content-margin-top,var(--spectrum-card-content-margin-top));padding:0}:host([variant=gallery]) ::slotted([slot=footer]),:host([variant=quiet]) ::slotted([slot=footer]){margin-inline:0}:host([horizontal]){flex-direction:row}@media (hover:hover){:host(:hover){border-color:var(--highcontrast-card-border-color-hover,var(--mod-card-border-color-hover,var(--spectrum-card-border-color-hover)))}:host(:hover) .actions,:host(:hover) .checkbox-toggle{visibility:visible;opacity:1;pointer-events:all}:host([variant=gallery]:hover),:host([variant=quiet]:hover){border-color:#0000}:host([variant=gallery]:hover) #preview,:host([variant=quiet]:hover) #preview{background-color:var(--mod-card-preview-background-color-hover,var(--mod-card-background-color-hover,var(--spectrum-card-preview-background-color-hover)))}:host([horizontal]:hover) #preview{border-color:var(--mod-card-border-color-hover,var(--spectrum-card-border-color-hover))}}:host([horizontal]) #preview{min-block-size:0;padding:var(--mod-card-horizontal-preview-padding,var(--spectrum-card-horizontal-preview-padding));background-color:var(--mod-card-preview-background-color,var(--spectrum-card-preview-background-color));border-color:var(--mod-card-border-color,var(--spectrum-card-border-color));border-start-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));flex-shrink:0;justify-content:center;align-items:center;display:flex}:host([horizontal]) .content,:host([horizontal]) .header{block-size:auto;margin-block-start:0}:host([horizontal]) .content{margin-block-end:0}:host([horizontal]) .title{padding-inline-end:0}:host([horizontal]) .body{padding-block:0;padding-inline:var(--mod-card-horizontal-body-padding,var(--spectrum-card-horizontal-body-padding));flex-direction:column;flex-shrink:0;justify-content:center;display:flex}:host([variant=gallery]){min-inline-size:0}:host([variant=gallery]) #preview{border-radius:0;padding:0}:host{--spectrum-card-background-color:var(--system-card-background-color);--spectrum-card-body-spacing:var(--system-card-body-spacing);--spectrum-card-title-padding-top:var(--system-card-title-padding-top);--spectrum-card-title-padding-right:var(--system-card-title-padding-right);--spectrum-card-content-margin-top:var(--system-card-content-margin-top);--spectrum-card-content-margin-bottom:var(--system-card-content-margin-bottom);--spectrum-card-footer-padding-top:var(--system-card-footer-padding-top);--spectrum-card-subtitle-padding-right:var(--system-card-subtitle-padding-right);--spectrum-card-border-width:var(--system-card-border-width);--spectrum-card-corner-radius:var(--system-card-corner-radius);--spectrum-card-border-color:var(--system-card-border-color);--spectrum-card-border-color-hover:var(--system-card-border-color-hover);--spectrum-card-border-color-selected:var(--system-card-border-color-selected);--spectrum-card-divider-color:var(--system-card-divider-color);--spectrum-card-title-font-family:var(--system-card-title-font-family);--spectrum-card-title-font-size:var(--system-card-title-font-size);--spectrum-card-title-font-weight:var(--system-card-title-font-weight);--spectrum-card-title-font-style:var(--system-card-title-font-style);--spectrum-card-title-line-height:var(--system-card-title-line-height);--spectrum-card-title-font-color:var(--system-card-title-font-color);--spectrum-card-body-font-family:var(--system-card-body-font-family);--spectrum-card-body-font-size:var(--system-card-body-font-size);--spectrum-card-body-font-weight:var(--system-card-body-font-weight);--spectrum-card-body-font-style:var(--system-card-body-font-style);--spectrum-card-body-line-height:var(--system-card-body-line-height);--spectrum-card-body-font-color:var(--system-card-body-font-color);--spectrum-card-actions-spacing:var(--system-card-actions-spacing);--spectrum-card-actions-size:var(--system-card-actions-size);--spectrum-card-actions-border-radius:var(--system-card-actions-border-radius);--spectrum-card-actions-background-color-rgb:var(--system-card-actions-background-color-rgb);--spectrum-card-actions-background-color-opacity:var(--system-card-actions-background-color-opacity);--spectrum-card-actions-drop-shadow-color:var(--system-card-actions-drop-shadow-color);--spectrum-card-actions-drop-shadow-x:var(--system-card-actions-drop-shadow-x);--spectrum-card-actions-drop-shadow-y:var(--system-card-actions-drop-shadow-y);--spectrum-card-actions-drop-shadow-blur:var(--system-card-actions-drop-shadow-blur);--spectrum-card-focus-indicator-color:var(--system-card-focus-indicator-color);--spectrum-card-focus-indicator-width:var(--system-card-focus-indicator-width);--spectrum-card-selected-background-opacity:var(--system-card-selected-background-opacity);--spectrum-card-preview-border-width-selected:var(--system-card-preview-border-width-selected);--spectrum-card-preview-background-color:var(--system-card-preview-background-color);--spectrum-card-preview-background-color-hover:var(--system-card-preview-background-color-hover);--spectrum-card-horizontal-body-padding:var(--system-card-horizontal-body-padding);--spectrum-card-horizontal-preview-padding:var(--system-card-horizontal-preview-padding);--spectrum-card-content-margin-top-quiet:var(--system-card-content-margin-top-quiet);--spectrum-card-minimum-width-quiet:var(--system-card-minimum-width-quiet);--spectrum-card-background-color-quiet:var(--system-card-background-color-quiet)}:host([href]:not([href=\"\"])){cursor:pointer}#like-anchor{pointer-events:none;position:absolute;inset:0}.action-button{flex-grow:0}:host([dir=ltr]) .action-button{margin-left:auto}:host([dir=rtl]) .action-button{margin-right:auto}slot[name=description]{font-size:var(--spectrum-card-subtitle-text-size,var(--spectrum-global-dimension-font-size-50))}#preview+#cover-photo{display:none}#cover-photo ::slotted(*),:host(:not([variant=quiet])) #preview ::slotted(*){width:100%;object-fit:cover;display:block}:host(:not([variant=gallery])) #preview ::slotted(*){height:100%}:host([horizontal]) #preview{width:auto}:host([horizontal]) sp-asset{height:inherit}sp-popover{align-items:center}.actions{visibility:hidden;margin:auto}.title{width:var(--spectrum-card-title-width)}.subtitle{text-transform:none}:host:before,:host:after{pointer-events:none}\n`;\nexport default styles;"],
5
+ "mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA,EAGf,eAAeC",
6
+ "names": ["css", "styles"]
7
+ }
package/src/index.d.ts ADDED
@@ -0,0 +1 @@
1
+ export * from './Card.js';
@@ -0,0 +1,3 @@
1
+ "use strict";
2
+ export * from "./Card.dev.js";
3
+ //# sourceMappingURL=index.dev.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["index.ts"],
4
+ "sourcesContent": ["/*\nCopyright 2020 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*/\nexport * from './Card.dev.js'\n"],
5
+ "mappings": ";AAWA,cAAc;",
6
+ "names": []
7
+ }
package/src/index.js ADDED
@@ -0,0 +1,2 @@
1
+ "use strict";export*from"./Card.js";
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["index.ts"],
4
+ "sourcesContent": ["/*\nCopyright 2020 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*/\nexport * from './Card.js';\n"],
5
+ "mappings": "aAWA,WAAc",
6
+ "names": []
7
+ }
@@ -0,0 +1,2 @@
1
+ declare const styles: import("@spectrum-web-components/base").CSSResult;
2
+ export default styles;
@@ -0,0 +1,7 @@
1
+ "use strict";
2
+ import { css } from "@spectrum-web-components/base";
3
+ const styles = css`
4
+ :host{box-sizing:border-box;min-inline-size:var(--mod-card-minimum-width,var(--spectrum-card-minimum-width));border:var(--mod-card-border-width,var(--spectrum-card-border-width))solid transparent;border-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border-color:var(--highcontrast-card-border-color,var(--mod-card-border-color,var(--spectrum-card-border-color)));background-color:var(--highcontrast-card-background-color,var(--mod-card-background-color,var(--spectrum-card-background-color)));flex-direction:column;-webkit-text-decoration:none;text-decoration:none;display:inline-flex;position:relative}:host:after,:host:before{content:"";block-size:100%;inline-size:100%;position:absolute;inset-block-start:0;inset-inline-start:0}:host:after{border-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border:0 solid #0000;margin-block-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);margin-inline-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);inset-inline-end:0}:host(:focus-visible){outline:none}:host(:focus-visible):after{border-width:var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width));border-color:var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color))}:host(:focus-visible) #cover-photo,:host(:focus-visible) #preview{border-start-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width)));border-start-end-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width)))}:host([selected]){border-color:var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)))}:host([selected]):before{background-color:rgba(var(--mod-card-selected-background-color-rgb,var(--spectrum-card-selected-background-color-rgb)),var(--mod-card-selected-background-opacity,var(--spectrum-card-selected-background-opacity)))}:host([drop-target]){border-color:var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)));box-shadow:0 0 0 1px var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)));background-color:var(--mod-card-background-color,var(--spectrum-card-background-color-quiet))}:host([focused]) .actions,:host([focused]) .checkbox-toggle,:host([selected]) .actions,:host([selected]) .checkbox-toggle,:host(:focus) .actions,:host(:focus) .checkbox-toggle{visibility:visible;opacity:1;pointer-events:all}.checkbox-toggle{visibility:hidden;box-shadow:var(--mod-card-actions-drop-shadow-x,var(--spectrum-card-actions-drop-shadow-x))var(--mod-card-actions-drop-shadow-y,var(--spectrum-card-actions-drop-shadow-y))var(--mod-card-actions-drop-shadow-blur,var(--spectrum-card-actions-drop-shadow-blur))var(--mod-card-actions-drop-shadow-color,var(--spectrum-card-actions-drop-shadow-color));inline-size:var(--mod-card-actions-size,var(--spectrum-card-actions-size));block-size:var(--mod-card-actions-size,var(--spectrum-card-actions-size));border-radius:var(--mod-card-actions-border-radius,var(--spectrum-card-actions-border-radius));background-color:rgba(var(--mod-card-actions-background-color-rgb,var(--spectrum-card-actions-background-color-rgb)),var(--mod-card-actions-background-color-opacity,var(--spectrum-card-actions-background-color-opacity)));pointer-events:auto;box-sizing:border-box;transition:transform .13s ease-in-out,opacity .13s ease-in-out,visibility 0s linear .13s;transition:transform var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s))ease-in-out,opacity var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s))ease-in-out,visibility 0s linear var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s));justify-content:center;align-items:center;display:inline-flex;position:absolute;inset-block-start:calc(var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));inset-inline-start:calc(var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width)))}.actions{inset-block-start:var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing));inset-inline-end:var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing))}#cover-photo{block-size:var(--mod-card-preview-minimum-height,var(--spectrum-card-preview-minimum-height));box-sizing:border-box;background-position:50%;background-size:cover;background-color:var(--mod-card-preview-background-color,var(--spectrum-card-preview-background-color));border-block-end-color:var(--mod-card-border-color,var(--spectrum-card-border-color));border-start-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));border-start-end-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));border-end-end-radius:0;border-end-start-radius:0;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.spectrum-Divider{margin:0}.content{align-items:center;margin-block-start:var(--mod-card-content-margin-top,var(--spectrum-card-content-margin-top));display:flex}.body{padding-block-start:var(--mod-card-body-padding-block-start,var(--mod-card-title-padding-top,var(--spectrum-card-title-padding-top)));padding-block-end:var(--mod-card-body-padding-block-end,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))));padding-inline-start:var(--mod-card-body-padding-inline-start,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))));padding-inline-end:var(--mod-card-body-padding-inline-end,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))))}#preview{color:var(--highcontrast-card-body-font-color,var(--mod-card-body-font-color,var(--spectrum-card-body-font-color)));border-start-start-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border-start-end-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border-end-end-radius:0;border-end-start-radius:0;align-items:center;display:flex;overflow:hidden}.title{font-family:var(--mod-card-title-font-family,var(--spectrum-card-title-font-family));font-size:var(--mod-card-title-font-size,var(--spectrum-card-title-font-size));font-weight:var(--mod-card-title-font-weight,var(--spectrum-card-title-font-weight));font-style:var(--mod-card-title-font-style,var(--spectrum-card-title-font-style));line-height:var(--mod-card-title-line-height,var(--spectrum-card-title-line-height));padding-inline-end:var(--mod-card-title-padding-right,var(--spectrum-card-title-padding-right))}.subtitle,.title{color:var(--highcontrast-card-title-font-color,var(--mod-card-title-font-color,var(--spectrum-card-title-font-color)))}.subtitle{text-transform:none}.subtitle,.subtitle+::slotted([slot=description]):before{padding-inline-end:var(--mod-card-subtitle-padding-right,var(--spectrum-card-subtitle-padding-right))}.subtitle+::slotted([slot=description]):before{content:"•"}::slotted([slot=description]){font-family:var(--mod-card-body-font-family,var(--spectrum-card-body-font-family));font-size:var(--mod-card-body-font-size,var(--spectrum-card-body-font-size));font-weight:var(--mod-card-body-font-weight,var(--spectrum-card-body-font-weight));font-style:var(--mod-card-body-font-style,var(--spectrum-card-body-font-style))}::slotted([slot=description]),::slotted([slot=footer]){line-height:var(--mod-card-body-line-height,var(--spectrum-card-body-line-height));color:var(--highcontrast-card-body-font-color,var(--mod-card-body-font-color,var(--spectrum-card-body-font-color)))}::slotted([slot=footer]){border-block-start:var(--mod-card-border-width,var(--spectrum-card-border-width))solid var(--mod-card-divider-color,var(--spectrum-card-divider-color));margin-block-start:var(--mod-card-footer-margin-block-start,calc(( var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-content-margin-bottom,var(--spectrum-card-content-margin-bottom)))*-1));margin-inline-start:var(--mod-card-footer-margin-inline-start,var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)));margin-inline-end:var(--mod-card-footer-margin-inline-end,var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)));padding-block-start:var(--mod-card-footer-padding-block-start,var(--mod-card-footer-margin-top,var(--spectrum-card-footer-padding-top)));padding-block-end:var(--mod-card-footer-padding-block-end,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))))}.header{justify-content:space-between;align-items:center;display:flex}.action-button{z-index:1;justify-content:flex-end;align-self:center;display:flex}:host([variant=quiet]) #preview{border:var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))solid transparent}:host([variant=quiet][focused]):after,:host([variant=quiet]:focus):after{border-width:0}:host([variant=quiet][focused]) #preview:after,:host([variant=quiet]:focus) #preview:after{border-color:var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color))}:host([variant=quiet][selected]) #preview{border:var(--mod-card-preview-border-width-selected,var(--mod-card-preview-border-width,var(--spectrum-card-preview-border-width-selected)))solid;border-color:var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)))}:host([variant=gallery]),:host([variant=quiet]){--spectrum-card-content-margin-top:var(--mod-card-content-margin-top-quiet,var(--spectrum-card-content-margin-top-quiet));--spectrum-card-minimum-width:var(--mod-card-minimum-width-quiet,var(--spectrum-card-minimum-width-quiet));block-size:100%;min-inline-size:var(--mod-card-minimum-width,var(--spectrum-card-minimum-width));background-color:initial;border-width:0;border-color:#0000;border-radius:0;overflow:visible}:host([variant=gallery]):before,:host([variant=quiet]):before{display:none}:host([variant=gallery]) #preview,:host([variant=quiet]) #preview{border-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));background-color:var(--mod-card-preview-background-color,var(--mod-card-background-color,var(--spectrum-card-preview-background-color)));min-block-size:var(--mod-card-preview-minimum-height,var(--spectrum-card-preview-minimum-height));inline-size:100%;box-sizing:border-box;transition:background-color var(--mod-card-animation-duration,var(--mod-animation-duration-100,var(--spectrum-animation-duration-100)));flex:1;margin:0 auto;position:relative;overflow:visible}:host([variant=gallery]) #preview:after,:host([variant=gallery]) #preview:before,:host([variant=quiet]) #preview:after,:host([variant=quiet]) #preview:before{content:"";block-size:100%;inline-size:100%;position:absolute;inset-block-start:0;inset-inline-start:0}:host([variant=gallery]) #preview:after,:host([variant=quiet]) #preview:after{border-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) + var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width)));border:0 solid #0000;margin-block-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);margin-inline-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);inset-inline-end:0}:host([variant=gallery][drop-target]),:host([variant=quiet][drop-target]){background-color:initial;box-shadow:none;border-color:#0000}:host([variant=gallery][drop-target]) #preview,:host([variant=quiet][drop-target]) #preview{background-color:var(--mod-card-preview-background-color,var(--mod-card-background-color,var(--spectrum-card-preview-background-color)));transition:none}:host([variant=gallery][drop-target]) #preview:before,:host([variant=quiet][drop-target]) #preview:before{border-color:var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color));box-shadow:0 0 0 1px var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color))}:host([variant=gallery][selected]) #preview:before,:host([variant=quiet][selected]) #preview:before{background-color:rgba(var(--mod-card-selected-background-color-rgb,var(--spectrum-card-selected-background-color-rgb)),var(--mod-card-selected-background-opacity,var(--spectrum-card-selected-background-opacity)))}:host([variant=gallery]) .body,:host([variant=quiet]) .body{margin-block-start:var(--mod-card-content-margin-top,var(--spectrum-card-content-margin-top));padding:0}:host([variant=gallery]) ::slotted([slot=footer]),:host([variant=quiet]) ::slotted([slot=footer]){margin-inline:0}:host([horizontal]){flex-direction:row}@media (hover:hover){:host(:hover){border-color:var(--highcontrast-card-border-color-hover,var(--mod-card-border-color-hover,var(--spectrum-card-border-color-hover)))}:host(:hover) .actions,:host(:hover) .checkbox-toggle{visibility:visible;opacity:1;pointer-events:all}:host([variant=gallery]:hover),:host([variant=quiet]:hover){border-color:#0000}:host([variant=gallery]:hover) #preview,:host([variant=quiet]:hover) #preview{background-color:var(--mod-card-preview-background-color-hover,var(--mod-card-background-color-hover,var(--spectrum-card-preview-background-color-hover)))}:host([horizontal]:hover) #preview{border-color:var(--mod-card-border-color-hover,var(--spectrum-card-border-color-hover))}}:host([horizontal]) #preview{min-block-size:0;padding:var(--mod-card-horizontal-preview-padding,var(--spectrum-card-horizontal-preview-padding));background-color:var(--mod-card-preview-background-color,var(--spectrum-card-preview-background-color));border-color:var(--mod-card-border-color,var(--spectrum-card-border-color));border-start-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));flex-shrink:0;justify-content:center;align-items:center;display:flex}:host([horizontal]) .content,:host([horizontal]) .header{block-size:auto;margin-block-start:0}:host([horizontal]) .content{margin-block-end:0}:host([horizontal]) .title{padding-inline-end:0}:host([horizontal]) .body{padding-block:0;padding-inline:var(--mod-card-horizontal-body-padding,var(--spectrum-card-horizontal-body-padding));flex-direction:column;flex-shrink:0;justify-content:center;display:flex}:host([variant=gallery]){min-inline-size:0}:host([variant=gallery]) #preview{border-radius:0;padding:0}
5
+ `;
6
+ export default styles;
7
+ //# sourceMappingURL=spectrum-card.css.dev.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["spectrum-card.css.ts"],
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{box-sizing:border-box;min-inline-size:var(--mod-card-minimum-width,var(--spectrum-card-minimum-width));border:var(--mod-card-border-width,var(--spectrum-card-border-width))solid transparent;border-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border-color:var(--highcontrast-card-border-color,var(--mod-card-border-color,var(--spectrum-card-border-color)));background-color:var(--highcontrast-card-background-color,var(--mod-card-background-color,var(--spectrum-card-background-color)));flex-direction:column;-webkit-text-decoration:none;text-decoration:none;display:inline-flex;position:relative}:host:after,:host:before{content:\"\";block-size:100%;inline-size:100%;position:absolute;inset-block-start:0;inset-inline-start:0}:host:after{border-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border:0 solid #0000;margin-block-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);margin-inline-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);inset-inline-end:0}:host(:focus-visible){outline:none}:host(:focus-visible):after{border-width:var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width));border-color:var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color))}:host(:focus-visible) #cover-photo,:host(:focus-visible) #preview{border-start-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width)));border-start-end-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width)))}:host([selected]){border-color:var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)))}:host([selected]):before{background-color:rgba(var(--mod-card-selected-background-color-rgb,var(--spectrum-card-selected-background-color-rgb)),var(--mod-card-selected-background-opacity,var(--spectrum-card-selected-background-opacity)))}:host([drop-target]){border-color:var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)));box-shadow:0 0 0 1px var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)));background-color:var(--mod-card-background-color,var(--spectrum-card-background-color-quiet))}:host([focused]) .actions,:host([focused]) .checkbox-toggle,:host([selected]) .actions,:host([selected]) .checkbox-toggle,:host(:focus) .actions,:host(:focus) .checkbox-toggle{visibility:visible;opacity:1;pointer-events:all}.checkbox-toggle{visibility:hidden;box-shadow:var(--mod-card-actions-drop-shadow-x,var(--spectrum-card-actions-drop-shadow-x))var(--mod-card-actions-drop-shadow-y,var(--spectrum-card-actions-drop-shadow-y))var(--mod-card-actions-drop-shadow-blur,var(--spectrum-card-actions-drop-shadow-blur))var(--mod-card-actions-drop-shadow-color,var(--spectrum-card-actions-drop-shadow-color));inline-size:var(--mod-card-actions-size,var(--spectrum-card-actions-size));block-size:var(--mod-card-actions-size,var(--spectrum-card-actions-size));border-radius:var(--mod-card-actions-border-radius,var(--spectrum-card-actions-border-radius));background-color:rgba(var(--mod-card-actions-background-color-rgb,var(--spectrum-card-actions-background-color-rgb)),var(--mod-card-actions-background-color-opacity,var(--spectrum-card-actions-background-color-opacity)));pointer-events:auto;box-sizing:border-box;transition:transform .13s ease-in-out,opacity .13s ease-in-out,visibility 0s linear .13s;transition:transform var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s))ease-in-out,opacity var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s))ease-in-out,visibility 0s linear var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s));justify-content:center;align-items:center;display:inline-flex;position:absolute;inset-block-start:calc(var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));inset-inline-start:calc(var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width)))}.actions{inset-block-start:var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing));inset-inline-end:var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing))}#cover-photo{block-size:var(--mod-card-preview-minimum-height,var(--spectrum-card-preview-minimum-height));box-sizing:border-box;background-position:50%;background-size:cover;background-color:var(--mod-card-preview-background-color,var(--spectrum-card-preview-background-color));border-block-end-color:var(--mod-card-border-color,var(--spectrum-card-border-color));border-start-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));border-start-end-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));border-end-end-radius:0;border-end-start-radius:0;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.spectrum-Divider{margin:0}.content{align-items:center;margin-block-start:var(--mod-card-content-margin-top,var(--spectrum-card-content-margin-top));display:flex}.body{padding-block-start:var(--mod-card-body-padding-block-start,var(--mod-card-title-padding-top,var(--spectrum-card-title-padding-top)));padding-block-end:var(--mod-card-body-padding-block-end,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))));padding-inline-start:var(--mod-card-body-padding-inline-start,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))));padding-inline-end:var(--mod-card-body-padding-inline-end,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))))}#preview{color:var(--highcontrast-card-body-font-color,var(--mod-card-body-font-color,var(--spectrum-card-body-font-color)));border-start-start-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border-start-end-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border-end-end-radius:0;border-end-start-radius:0;align-items:center;display:flex;overflow:hidden}.title{font-family:var(--mod-card-title-font-family,var(--spectrum-card-title-font-family));font-size:var(--mod-card-title-font-size,var(--spectrum-card-title-font-size));font-weight:var(--mod-card-title-font-weight,var(--spectrum-card-title-font-weight));font-style:var(--mod-card-title-font-style,var(--spectrum-card-title-font-style));line-height:var(--mod-card-title-line-height,var(--spectrum-card-title-line-height));padding-inline-end:var(--mod-card-title-padding-right,var(--spectrum-card-title-padding-right))}.subtitle,.title{color:var(--highcontrast-card-title-font-color,var(--mod-card-title-font-color,var(--spectrum-card-title-font-color)))}.subtitle{text-transform:none}.subtitle,.subtitle+::slotted([slot=description]):before{padding-inline-end:var(--mod-card-subtitle-padding-right,var(--spectrum-card-subtitle-padding-right))}.subtitle+::slotted([slot=description]):before{content:\"\u2022\"}::slotted([slot=description]){font-family:var(--mod-card-body-font-family,var(--spectrum-card-body-font-family));font-size:var(--mod-card-body-font-size,var(--spectrum-card-body-font-size));font-weight:var(--mod-card-body-font-weight,var(--spectrum-card-body-font-weight));font-style:var(--mod-card-body-font-style,var(--spectrum-card-body-font-style))}::slotted([slot=description]),::slotted([slot=footer]){line-height:var(--mod-card-body-line-height,var(--spectrum-card-body-line-height));color:var(--highcontrast-card-body-font-color,var(--mod-card-body-font-color,var(--spectrum-card-body-font-color)))}::slotted([slot=footer]){border-block-start:var(--mod-card-border-width,var(--spectrum-card-border-width))solid var(--mod-card-divider-color,var(--spectrum-card-divider-color));margin-block-start:var(--mod-card-footer-margin-block-start,calc(( var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-content-margin-bottom,var(--spectrum-card-content-margin-bottom)))*-1));margin-inline-start:var(--mod-card-footer-margin-inline-start,var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)));margin-inline-end:var(--mod-card-footer-margin-inline-end,var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)));padding-block-start:var(--mod-card-footer-padding-block-start,var(--mod-card-footer-margin-top,var(--spectrum-card-footer-padding-top)));padding-block-end:var(--mod-card-footer-padding-block-end,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))))}.header{justify-content:space-between;align-items:center;display:flex}.action-button{z-index:1;justify-content:flex-end;align-self:center;display:flex}:host([variant=quiet]) #preview{border:var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))solid transparent}:host([variant=quiet][focused]):after,:host([variant=quiet]:focus):after{border-width:0}:host([variant=quiet][focused]) #preview:after,:host([variant=quiet]:focus) #preview:after{border-color:var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color))}:host([variant=quiet][selected]) #preview{border:var(--mod-card-preview-border-width-selected,var(--mod-card-preview-border-width,var(--spectrum-card-preview-border-width-selected)))solid;border-color:var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)))}:host([variant=gallery]),:host([variant=quiet]){--spectrum-card-content-margin-top:var(--mod-card-content-margin-top-quiet,var(--spectrum-card-content-margin-top-quiet));--spectrum-card-minimum-width:var(--mod-card-minimum-width-quiet,var(--spectrum-card-minimum-width-quiet));block-size:100%;min-inline-size:var(--mod-card-minimum-width,var(--spectrum-card-minimum-width));background-color:initial;border-width:0;border-color:#0000;border-radius:0;overflow:visible}:host([variant=gallery]):before,:host([variant=quiet]):before{display:none}:host([variant=gallery]) #preview,:host([variant=quiet]) #preview{border-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));background-color:var(--mod-card-preview-background-color,var(--mod-card-background-color,var(--spectrum-card-preview-background-color)));min-block-size:var(--mod-card-preview-minimum-height,var(--spectrum-card-preview-minimum-height));inline-size:100%;box-sizing:border-box;transition:background-color var(--mod-card-animation-duration,var(--mod-animation-duration-100,var(--spectrum-animation-duration-100)));flex:1;margin:0 auto;position:relative;overflow:visible}:host([variant=gallery]) #preview:after,:host([variant=gallery]) #preview:before,:host([variant=quiet]) #preview:after,:host([variant=quiet]) #preview:before{content:\"\";block-size:100%;inline-size:100%;position:absolute;inset-block-start:0;inset-inline-start:0}:host([variant=gallery]) #preview:after,:host([variant=quiet]) #preview:after{border-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) + var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width)));border:0 solid #0000;margin-block-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);margin-inline-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);inset-inline-end:0}:host([variant=gallery][drop-target]),:host([variant=quiet][drop-target]){background-color:initial;box-shadow:none;border-color:#0000}:host([variant=gallery][drop-target]) #preview,:host([variant=quiet][drop-target]) #preview{background-color:var(--mod-card-preview-background-color,var(--mod-card-background-color,var(--spectrum-card-preview-background-color)));transition:none}:host([variant=gallery][drop-target]) #preview:before,:host([variant=quiet][drop-target]) #preview:before{border-color:var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color));box-shadow:0 0 0 1px var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color))}:host([variant=gallery][selected]) #preview:before,:host([variant=quiet][selected]) #preview:before{background-color:rgba(var(--mod-card-selected-background-color-rgb,var(--spectrum-card-selected-background-color-rgb)),var(--mod-card-selected-background-opacity,var(--spectrum-card-selected-background-opacity)))}:host([variant=gallery]) .body,:host([variant=quiet]) .body{margin-block-start:var(--mod-card-content-margin-top,var(--spectrum-card-content-margin-top));padding:0}:host([variant=gallery]) ::slotted([slot=footer]),:host([variant=quiet]) ::slotted([slot=footer]){margin-inline:0}:host([horizontal]){flex-direction:row}@media (hover:hover){:host(:hover){border-color:var(--highcontrast-card-border-color-hover,var(--mod-card-border-color-hover,var(--spectrum-card-border-color-hover)))}:host(:hover) .actions,:host(:hover) .checkbox-toggle{visibility:visible;opacity:1;pointer-events:all}:host([variant=gallery]:hover),:host([variant=quiet]:hover){border-color:#0000}:host([variant=gallery]:hover) #preview,:host([variant=quiet]:hover) #preview{background-color:var(--mod-card-preview-background-color-hover,var(--mod-card-background-color-hover,var(--spectrum-card-preview-background-color-hover)))}:host([horizontal]:hover) #preview{border-color:var(--mod-card-border-color-hover,var(--spectrum-card-border-color-hover))}}:host([horizontal]) #preview{min-block-size:0;padding:var(--mod-card-horizontal-preview-padding,var(--spectrum-card-horizontal-preview-padding));background-color:var(--mod-card-preview-background-color,var(--spectrum-card-preview-background-color));border-color:var(--mod-card-border-color,var(--spectrum-card-border-color));border-start-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));flex-shrink:0;justify-content:center;align-items:center;display:flex}:host([horizontal]) .content,:host([horizontal]) .header{block-size:auto;margin-block-start:0}:host([horizontal]) .content{margin-block-end:0}:host([horizontal]) .title{padding-inline-end:0}:host([horizontal]) .body{padding-block:0;padding-inline:var(--mod-card-horizontal-body-padding,var(--spectrum-card-horizontal-body-padding));flex-direction:column;flex-shrink:0;justify-content:center;display:flex}:host([variant=gallery]){min-inline-size:0}:host([variant=gallery]) #preview{border-radius:0;padding:0}\n`;\nexport default styles;"],
5
+ "mappings": ";AAWA,SAAS,WAAW;AACpB,MAAM,SAAS;AAAA;AAAA;AAGf,eAAe;",
6
+ "names": []
7
+ }
@@ -0,0 +1,4 @@
1
+ "use strict";import{css as r}from"@spectrum-web-components/base";const o=r`
2
+ :host{box-sizing:border-box;min-inline-size:var(--mod-card-minimum-width,var(--spectrum-card-minimum-width));border:var(--mod-card-border-width,var(--spectrum-card-border-width))solid transparent;border-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border-color:var(--highcontrast-card-border-color,var(--mod-card-border-color,var(--spectrum-card-border-color)));background-color:var(--highcontrast-card-background-color,var(--mod-card-background-color,var(--spectrum-card-background-color)));flex-direction:column;-webkit-text-decoration:none;text-decoration:none;display:inline-flex;position:relative}:host:after,:host:before{content:"";block-size:100%;inline-size:100%;position:absolute;inset-block-start:0;inset-inline-start:0}:host:after{border-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border:0 solid #0000;margin-block-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);margin-inline-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);inset-inline-end:0}:host(:focus-visible){outline:none}:host(:focus-visible):after{border-width:var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width));border-color:var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color))}:host(:focus-visible) #cover-photo,:host(:focus-visible) #preview{border-start-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width)));border-start-end-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width)))}:host([selected]){border-color:var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)))}:host([selected]):before{background-color:rgba(var(--mod-card-selected-background-color-rgb,var(--spectrum-card-selected-background-color-rgb)),var(--mod-card-selected-background-opacity,var(--spectrum-card-selected-background-opacity)))}:host([drop-target]){border-color:var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)));box-shadow:0 0 0 1px var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)));background-color:var(--mod-card-background-color,var(--spectrum-card-background-color-quiet))}:host([focused]) .actions,:host([focused]) .checkbox-toggle,:host([selected]) .actions,:host([selected]) .checkbox-toggle,:host(:focus) .actions,:host(:focus) .checkbox-toggle{visibility:visible;opacity:1;pointer-events:all}.checkbox-toggle{visibility:hidden;box-shadow:var(--mod-card-actions-drop-shadow-x,var(--spectrum-card-actions-drop-shadow-x))var(--mod-card-actions-drop-shadow-y,var(--spectrum-card-actions-drop-shadow-y))var(--mod-card-actions-drop-shadow-blur,var(--spectrum-card-actions-drop-shadow-blur))var(--mod-card-actions-drop-shadow-color,var(--spectrum-card-actions-drop-shadow-color));inline-size:var(--mod-card-actions-size,var(--spectrum-card-actions-size));block-size:var(--mod-card-actions-size,var(--spectrum-card-actions-size));border-radius:var(--mod-card-actions-border-radius,var(--spectrum-card-actions-border-radius));background-color:rgba(var(--mod-card-actions-background-color-rgb,var(--spectrum-card-actions-background-color-rgb)),var(--mod-card-actions-background-color-opacity,var(--spectrum-card-actions-background-color-opacity)));pointer-events:auto;box-sizing:border-box;transition:transform .13s ease-in-out,opacity .13s ease-in-out,visibility 0s linear .13s;transition:transform var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s))ease-in-out,opacity var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s))ease-in-out,visibility 0s linear var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s));justify-content:center;align-items:center;display:inline-flex;position:absolute;inset-block-start:calc(var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));inset-inline-start:calc(var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width)))}.actions{inset-block-start:var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing));inset-inline-end:var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing))}#cover-photo{block-size:var(--mod-card-preview-minimum-height,var(--spectrum-card-preview-minimum-height));box-sizing:border-box;background-position:50%;background-size:cover;background-color:var(--mod-card-preview-background-color,var(--spectrum-card-preview-background-color));border-block-end-color:var(--mod-card-border-color,var(--spectrum-card-border-color));border-start-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));border-start-end-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));border-end-end-radius:0;border-end-start-radius:0;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.spectrum-Divider{margin:0}.content{align-items:center;margin-block-start:var(--mod-card-content-margin-top,var(--spectrum-card-content-margin-top));display:flex}.body{padding-block-start:var(--mod-card-body-padding-block-start,var(--mod-card-title-padding-top,var(--spectrum-card-title-padding-top)));padding-block-end:var(--mod-card-body-padding-block-end,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))));padding-inline-start:var(--mod-card-body-padding-inline-start,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))));padding-inline-end:var(--mod-card-body-padding-inline-end,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))))}#preview{color:var(--highcontrast-card-body-font-color,var(--mod-card-body-font-color,var(--spectrum-card-body-font-color)));border-start-start-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border-start-end-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border-end-end-radius:0;border-end-start-radius:0;align-items:center;display:flex;overflow:hidden}.title{font-family:var(--mod-card-title-font-family,var(--spectrum-card-title-font-family));font-size:var(--mod-card-title-font-size,var(--spectrum-card-title-font-size));font-weight:var(--mod-card-title-font-weight,var(--spectrum-card-title-font-weight));font-style:var(--mod-card-title-font-style,var(--spectrum-card-title-font-style));line-height:var(--mod-card-title-line-height,var(--spectrum-card-title-line-height));padding-inline-end:var(--mod-card-title-padding-right,var(--spectrum-card-title-padding-right))}.subtitle,.title{color:var(--highcontrast-card-title-font-color,var(--mod-card-title-font-color,var(--spectrum-card-title-font-color)))}.subtitle{text-transform:none}.subtitle,.subtitle+::slotted([slot=description]):before{padding-inline-end:var(--mod-card-subtitle-padding-right,var(--spectrum-card-subtitle-padding-right))}.subtitle+::slotted([slot=description]):before{content:"•"}::slotted([slot=description]){font-family:var(--mod-card-body-font-family,var(--spectrum-card-body-font-family));font-size:var(--mod-card-body-font-size,var(--spectrum-card-body-font-size));font-weight:var(--mod-card-body-font-weight,var(--spectrum-card-body-font-weight));font-style:var(--mod-card-body-font-style,var(--spectrum-card-body-font-style))}::slotted([slot=description]),::slotted([slot=footer]){line-height:var(--mod-card-body-line-height,var(--spectrum-card-body-line-height));color:var(--highcontrast-card-body-font-color,var(--mod-card-body-font-color,var(--spectrum-card-body-font-color)))}::slotted([slot=footer]){border-block-start:var(--mod-card-border-width,var(--spectrum-card-border-width))solid var(--mod-card-divider-color,var(--spectrum-card-divider-color));margin-block-start:var(--mod-card-footer-margin-block-start,calc(( var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-content-margin-bottom,var(--spectrum-card-content-margin-bottom)))*-1));margin-inline-start:var(--mod-card-footer-margin-inline-start,var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)));margin-inline-end:var(--mod-card-footer-margin-inline-end,var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)));padding-block-start:var(--mod-card-footer-padding-block-start,var(--mod-card-footer-margin-top,var(--spectrum-card-footer-padding-top)));padding-block-end:var(--mod-card-footer-padding-block-end,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))))}.header{justify-content:space-between;align-items:center;display:flex}.action-button{z-index:1;justify-content:flex-end;align-self:center;display:flex}:host([variant=quiet]) #preview{border:var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))solid transparent}:host([variant=quiet][focused]):after,:host([variant=quiet]:focus):after{border-width:0}:host([variant=quiet][focused]) #preview:after,:host([variant=quiet]:focus) #preview:after{border-color:var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color))}:host([variant=quiet][selected]) #preview{border:var(--mod-card-preview-border-width-selected,var(--mod-card-preview-border-width,var(--spectrum-card-preview-border-width-selected)))solid;border-color:var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)))}:host([variant=gallery]),:host([variant=quiet]){--spectrum-card-content-margin-top:var(--mod-card-content-margin-top-quiet,var(--spectrum-card-content-margin-top-quiet));--spectrum-card-minimum-width:var(--mod-card-minimum-width-quiet,var(--spectrum-card-minimum-width-quiet));block-size:100%;min-inline-size:var(--mod-card-minimum-width,var(--spectrum-card-minimum-width));background-color:initial;border-width:0;border-color:#0000;border-radius:0;overflow:visible}:host([variant=gallery]):before,:host([variant=quiet]):before{display:none}:host([variant=gallery]) #preview,:host([variant=quiet]) #preview{border-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));background-color:var(--mod-card-preview-background-color,var(--mod-card-background-color,var(--spectrum-card-preview-background-color)));min-block-size:var(--mod-card-preview-minimum-height,var(--spectrum-card-preview-minimum-height));inline-size:100%;box-sizing:border-box;transition:background-color var(--mod-card-animation-duration,var(--mod-animation-duration-100,var(--spectrum-animation-duration-100)));flex:1;margin:0 auto;position:relative;overflow:visible}:host([variant=gallery]) #preview:after,:host([variant=gallery]) #preview:before,:host([variant=quiet]) #preview:after,:host([variant=quiet]) #preview:before{content:"";block-size:100%;inline-size:100%;position:absolute;inset-block-start:0;inset-inline-start:0}:host([variant=gallery]) #preview:after,:host([variant=quiet]) #preview:after{border-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) + var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width)));border:0 solid #0000;margin-block-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);margin-inline-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);inset-inline-end:0}:host([variant=gallery][drop-target]),:host([variant=quiet][drop-target]){background-color:initial;box-shadow:none;border-color:#0000}:host([variant=gallery][drop-target]) #preview,:host([variant=quiet][drop-target]) #preview{background-color:var(--mod-card-preview-background-color,var(--mod-card-background-color,var(--spectrum-card-preview-background-color)));transition:none}:host([variant=gallery][drop-target]) #preview:before,:host([variant=quiet][drop-target]) #preview:before{border-color:var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color));box-shadow:0 0 0 1px var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color))}:host([variant=gallery][selected]) #preview:before,:host([variant=quiet][selected]) #preview:before{background-color:rgba(var(--mod-card-selected-background-color-rgb,var(--spectrum-card-selected-background-color-rgb)),var(--mod-card-selected-background-opacity,var(--spectrum-card-selected-background-opacity)))}:host([variant=gallery]) .body,:host([variant=quiet]) .body{margin-block-start:var(--mod-card-content-margin-top,var(--spectrum-card-content-margin-top));padding:0}:host([variant=gallery]) ::slotted([slot=footer]),:host([variant=quiet]) ::slotted([slot=footer]){margin-inline:0}:host([horizontal]){flex-direction:row}@media (hover:hover){:host(:hover){border-color:var(--highcontrast-card-border-color-hover,var(--mod-card-border-color-hover,var(--spectrum-card-border-color-hover)))}:host(:hover) .actions,:host(:hover) .checkbox-toggle{visibility:visible;opacity:1;pointer-events:all}:host([variant=gallery]:hover),:host([variant=quiet]:hover){border-color:#0000}:host([variant=gallery]:hover) #preview,:host([variant=quiet]:hover) #preview{background-color:var(--mod-card-preview-background-color-hover,var(--mod-card-background-color-hover,var(--spectrum-card-preview-background-color-hover)))}:host([horizontal]:hover) #preview{border-color:var(--mod-card-border-color-hover,var(--spectrum-card-border-color-hover))}}:host([horizontal]) #preview{min-block-size:0;padding:var(--mod-card-horizontal-preview-padding,var(--spectrum-card-horizontal-preview-padding));background-color:var(--mod-card-preview-background-color,var(--spectrum-card-preview-background-color));border-color:var(--mod-card-border-color,var(--spectrum-card-border-color));border-start-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));flex-shrink:0;justify-content:center;align-items:center;display:flex}:host([horizontal]) .content,:host([horizontal]) .header{block-size:auto;margin-block-start:0}:host([horizontal]) .content{margin-block-end:0}:host([horizontal]) .title{padding-inline-end:0}:host([horizontal]) .body{padding-block:0;padding-inline:var(--mod-card-horizontal-body-padding,var(--spectrum-card-horizontal-body-padding));flex-direction:column;flex-shrink:0;justify-content:center;display:flex}:host([variant=gallery]){min-inline-size:0}:host([variant=gallery]) #preview{border-radius:0;padding:0}
3
+ `;export default o;
4
+ //# sourceMappingURL=spectrum-card.css.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["spectrum-card.css.ts"],
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{box-sizing:border-box;min-inline-size:var(--mod-card-minimum-width,var(--spectrum-card-minimum-width));border:var(--mod-card-border-width,var(--spectrum-card-border-width))solid transparent;border-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border-color:var(--highcontrast-card-border-color,var(--mod-card-border-color,var(--spectrum-card-border-color)));background-color:var(--highcontrast-card-background-color,var(--mod-card-background-color,var(--spectrum-card-background-color)));flex-direction:column;-webkit-text-decoration:none;text-decoration:none;display:inline-flex;position:relative}:host:after,:host:before{content:\"\";block-size:100%;inline-size:100%;position:absolute;inset-block-start:0;inset-inline-start:0}:host:after{border-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border:0 solid #0000;margin-block-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);margin-inline-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);inset-inline-end:0}:host(:focus-visible){outline:none}:host(:focus-visible):after{border-width:var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width));border-color:var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color))}:host(:focus-visible) #cover-photo,:host(:focus-visible) #preview{border-start-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width)));border-start-end-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width)))}:host([selected]){border-color:var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)))}:host([selected]):before{background-color:rgba(var(--mod-card-selected-background-color-rgb,var(--spectrum-card-selected-background-color-rgb)),var(--mod-card-selected-background-opacity,var(--spectrum-card-selected-background-opacity)))}:host([drop-target]){border-color:var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)));box-shadow:0 0 0 1px var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)));background-color:var(--mod-card-background-color,var(--spectrum-card-background-color-quiet))}:host([focused]) .actions,:host([focused]) .checkbox-toggle,:host([selected]) .actions,:host([selected]) .checkbox-toggle,:host(:focus) .actions,:host(:focus) .checkbox-toggle{visibility:visible;opacity:1;pointer-events:all}.checkbox-toggle{visibility:hidden;box-shadow:var(--mod-card-actions-drop-shadow-x,var(--spectrum-card-actions-drop-shadow-x))var(--mod-card-actions-drop-shadow-y,var(--spectrum-card-actions-drop-shadow-y))var(--mod-card-actions-drop-shadow-blur,var(--spectrum-card-actions-drop-shadow-blur))var(--mod-card-actions-drop-shadow-color,var(--spectrum-card-actions-drop-shadow-color));inline-size:var(--mod-card-actions-size,var(--spectrum-card-actions-size));block-size:var(--mod-card-actions-size,var(--spectrum-card-actions-size));border-radius:var(--mod-card-actions-border-radius,var(--spectrum-card-actions-border-radius));background-color:rgba(var(--mod-card-actions-background-color-rgb,var(--spectrum-card-actions-background-color-rgb)),var(--mod-card-actions-background-color-opacity,var(--spectrum-card-actions-background-color-opacity)));pointer-events:auto;box-sizing:border-box;transition:transform .13s ease-in-out,opacity .13s ease-in-out,visibility 0s linear .13s;transition:transform var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s))ease-in-out,opacity var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s))ease-in-out,visibility 0s linear var(--mod-overlay-animation-duration,var(--spectrum-animation-duration-100,.13s));justify-content:center;align-items:center;display:inline-flex;position:absolute;inset-block-start:calc(var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));inset-inline-start:calc(var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width)))}.actions{inset-block-start:var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing));inset-inline-end:var(--mod-card-actions-spacing,var(--spectrum-card-actions-spacing))}#cover-photo{block-size:var(--mod-card-preview-minimum-height,var(--spectrum-card-preview-minimum-height));box-sizing:border-box;background-position:50%;background-size:cover;background-color:var(--mod-card-preview-background-color,var(--spectrum-card-preview-background-color));border-block-end-color:var(--mod-card-border-color,var(--spectrum-card-border-color));border-start-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));border-start-end-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));border-end-end-radius:0;border-end-start-radius:0;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.spectrum-Divider{margin:0}.content{align-items:center;margin-block-start:var(--mod-card-content-margin-top,var(--spectrum-card-content-margin-top));display:flex}.body{padding-block-start:var(--mod-card-body-padding-block-start,var(--mod-card-title-padding-top,var(--spectrum-card-title-padding-top)));padding-block-end:var(--mod-card-body-padding-block-end,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))));padding-inline-start:var(--mod-card-body-padding-inline-start,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))));padding-inline-end:var(--mod-card-body-padding-inline-end,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))))}#preview{color:var(--highcontrast-card-body-font-color,var(--mod-card-body-font-color,var(--spectrum-card-body-font-color)));border-start-start-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border-start-end-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));border-end-end-radius:0;border-end-start-radius:0;align-items:center;display:flex;overflow:hidden}.title{font-family:var(--mod-card-title-font-family,var(--spectrum-card-title-font-family));font-size:var(--mod-card-title-font-size,var(--spectrum-card-title-font-size));font-weight:var(--mod-card-title-font-weight,var(--spectrum-card-title-font-weight));font-style:var(--mod-card-title-font-style,var(--spectrum-card-title-font-style));line-height:var(--mod-card-title-line-height,var(--spectrum-card-title-line-height));padding-inline-end:var(--mod-card-title-padding-right,var(--spectrum-card-title-padding-right))}.subtitle,.title{color:var(--highcontrast-card-title-font-color,var(--mod-card-title-font-color,var(--spectrum-card-title-font-color)))}.subtitle{text-transform:none}.subtitle,.subtitle+::slotted([slot=description]):before{padding-inline-end:var(--mod-card-subtitle-padding-right,var(--spectrum-card-subtitle-padding-right))}.subtitle+::slotted([slot=description]):before{content:\"\u2022\"}::slotted([slot=description]){font-family:var(--mod-card-body-font-family,var(--spectrum-card-body-font-family));font-size:var(--mod-card-body-font-size,var(--spectrum-card-body-font-size));font-weight:var(--mod-card-body-font-weight,var(--spectrum-card-body-font-weight));font-style:var(--mod-card-body-font-style,var(--spectrum-card-body-font-style))}::slotted([slot=description]),::slotted([slot=footer]){line-height:var(--mod-card-body-line-height,var(--spectrum-card-body-line-height));color:var(--highcontrast-card-body-font-color,var(--mod-card-body-font-color,var(--spectrum-card-body-font-color)))}::slotted([slot=footer]){border-block-start:var(--mod-card-border-width,var(--spectrum-card-border-width))solid var(--mod-card-divider-color,var(--spectrum-card-divider-color));margin-block-start:var(--mod-card-footer-margin-block-start,calc(( var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-content-margin-bottom,var(--spectrum-card-content-margin-bottom)))*-1));margin-inline-start:var(--mod-card-footer-margin-inline-start,var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)));margin-inline-end:var(--mod-card-footer-margin-inline-end,var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)));padding-block-start:var(--mod-card-footer-padding-block-start,var(--mod-card-footer-margin-top,var(--spectrum-card-footer-padding-top)));padding-block-end:var(--mod-card-footer-padding-block-end,calc(var(--mod-card-body-spacing,var(--spectrum-card-body-spacing)) - var(--mod-card-border-width,var(--spectrum-card-border-width))))}.header{justify-content:space-between;align-items:center;display:flex}.action-button{z-index:1;justify-content:flex-end;align-self:center;display:flex}:host([variant=quiet]) #preview{border:var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))solid transparent}:host([variant=quiet][focused]):after,:host([variant=quiet]:focus):after{border-width:0}:host([variant=quiet][focused]) #preview:after,:host([variant=quiet]:focus) #preview:after{border-color:var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color))}:host([variant=quiet][selected]) #preview{border:var(--mod-card-preview-border-width-selected,var(--mod-card-preview-border-width,var(--spectrum-card-preview-border-width-selected)))solid;border-color:var(--highcontrast-card-border-color-selected,var(--mod-card-border-color-selected,var(--spectrum-card-border-color-selected)))}:host([variant=gallery]),:host([variant=quiet]){--spectrum-card-content-margin-top:var(--mod-card-content-margin-top-quiet,var(--spectrum-card-content-margin-top-quiet));--spectrum-card-minimum-width:var(--mod-card-minimum-width-quiet,var(--spectrum-card-minimum-width-quiet));block-size:100%;min-inline-size:var(--mod-card-minimum-width,var(--spectrum-card-minimum-width));background-color:initial;border-width:0;border-color:#0000;border-radius:0;overflow:visible}:host([variant=gallery]):before,:host([variant=quiet]):before{display:none}:host([variant=gallery]) #preview,:host([variant=quiet]) #preview{border-radius:var(--mod-card-corner-radius,var(--spectrum-card-corner-radius));background-color:var(--mod-card-preview-background-color,var(--mod-card-background-color,var(--spectrum-card-preview-background-color)));min-block-size:var(--mod-card-preview-minimum-height,var(--spectrum-card-preview-minimum-height));inline-size:100%;box-sizing:border-box;transition:background-color var(--mod-card-animation-duration,var(--mod-animation-duration-100,var(--spectrum-animation-duration-100)));flex:1;margin:0 auto;position:relative;overflow:visible}:host([variant=gallery]) #preview:after,:host([variant=gallery]) #preview:before,:host([variant=quiet]) #preview:after,:host([variant=quiet]) #preview:before{content:\"\";block-size:100%;inline-size:100%;position:absolute;inset-block-start:0;inset-inline-start:0}:host([variant=gallery]) #preview:after,:host([variant=quiet]) #preview:after{border-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) + var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width)));border:0 solid #0000;margin-block-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);margin-inline-start:calc(var(--mod-card-focus-indicator-width,var(--spectrum-card-focus-indicator-width))*-1);inset-inline-end:0}:host([variant=gallery][drop-target]),:host([variant=quiet][drop-target]){background-color:initial;box-shadow:none;border-color:#0000}:host([variant=gallery][drop-target]) #preview,:host([variant=quiet][drop-target]) #preview{background-color:var(--mod-card-preview-background-color,var(--mod-card-background-color,var(--spectrum-card-preview-background-color)));transition:none}:host([variant=gallery][drop-target]) #preview:before,:host([variant=quiet][drop-target]) #preview:before{border-color:var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color));box-shadow:0 0 0 1px var(--mod-card-focus-indicator-color,var(--spectrum-card-focus-indicator-color))}:host([variant=gallery][selected]) #preview:before,:host([variant=quiet][selected]) #preview:before{background-color:rgba(var(--mod-card-selected-background-color-rgb,var(--spectrum-card-selected-background-color-rgb)),var(--mod-card-selected-background-opacity,var(--spectrum-card-selected-background-opacity)))}:host([variant=gallery]) .body,:host([variant=quiet]) .body{margin-block-start:var(--mod-card-content-margin-top,var(--spectrum-card-content-margin-top));padding:0}:host([variant=gallery]) ::slotted([slot=footer]),:host([variant=quiet]) ::slotted([slot=footer]){margin-inline:0}:host([horizontal]){flex-direction:row}@media (hover:hover){:host(:hover){border-color:var(--highcontrast-card-border-color-hover,var(--mod-card-border-color-hover,var(--spectrum-card-border-color-hover)))}:host(:hover) .actions,:host(:hover) .checkbox-toggle{visibility:visible;opacity:1;pointer-events:all}:host([variant=gallery]:hover),:host([variant=quiet]:hover){border-color:#0000}:host([variant=gallery]:hover) #preview,:host([variant=quiet]:hover) #preview{background-color:var(--mod-card-preview-background-color-hover,var(--mod-card-background-color-hover,var(--spectrum-card-preview-background-color-hover)))}:host([horizontal]:hover) #preview{border-color:var(--mod-card-border-color-hover,var(--spectrum-card-border-color-hover))}}:host([horizontal]) #preview{min-block-size:0;padding:var(--mod-card-horizontal-preview-padding,var(--spectrum-card-horizontal-preview-padding));background-color:var(--mod-card-preview-background-color,var(--spectrum-card-preview-background-color));border-color:var(--mod-card-border-color,var(--spectrum-card-border-color));border-start-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));border-start-end-radius:0;border-end-end-radius:0;border-end-start-radius:calc(var(--mod-card-corner-radius,var(--spectrum-card-corner-radius)) - var(--mod-card-border-width,var(--spectrum-card-border-width)));flex-shrink:0;justify-content:center;align-items:center;display:flex}:host([horizontal]) .content,:host([horizontal]) .header{block-size:auto;margin-block-start:0}:host([horizontal]) .content{margin-block-end:0}:host([horizontal]) .title{padding-inline-end:0}:host([horizontal]) .body{padding-block:0;padding-inline:var(--mod-card-horizontal-body-padding,var(--spectrum-card-horizontal-body-padding));flex-direction:column;flex-shrink:0;justify-content:center;display:flex}:host([variant=gallery]){min-inline-size:0}:host([variant=gallery]) #preview{border-radius:0;padding:0}\n`;\nexport default styles;"],
5
+ "mappings": "aAWA,OAAS,OAAAA,MAAW,gCACpB,MAAMC,EAASD;AAAA;AAAA,EAGf,eAAeC",
6
+ "names": ["css", "styles"]
7
+ }
@@ -0,0 +1,74 @@
1
+ // @ts-check
2
+ /*
3
+ Copyright 2023 Adobe. All rights reserved.
4
+ This file is licensed to you under the Apache License, Version 2.0 (the 'License');
5
+ you may not use this file except in compliance with the License. You may obtain a copy
6
+ of the License at http://www.apache.org/licenses/LICENSE-2.0
7
+
8
+ Unless required by applicable law or agreed to in writing, software distributed under
9
+ the License is distributed on an 'AS IS' BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
10
+ OF ANY KIND, either express or implied. See the License for the specific language
11
+ governing permissions and limitations under the License.
12
+ */
13
+
14
+ import { converterFor } from '../../../tasks/process-spectrum-utils.js';
15
+
16
+ const converter = converterFor('spectrum-Card');
17
+
18
+ /**
19
+ * @type { import('../../../tasks/spectrum-css-converter').SpectrumCSSConverter }
20
+ */
21
+ const config = {
22
+ conversions: [
23
+ {
24
+ inPackage: '@spectrum-css/card',
25
+ outPackage: 'card',
26
+ fileName: 'card',
27
+ components: [
28
+ converter.classToHost(),
29
+ converter.classToClass('spectrum-Card-body'),
30
+ converter.classToClass('spectrum-Card-header'),
31
+ converter.classToClass('spectrum-Card-title'),
32
+ converter.classToClass('spectrum-Card-subtitle'),
33
+ converter.classToClass('spectrum-Card-content'),
34
+ converter.classToClass(
35
+ 'spectrum-Card-quickActions',
36
+ 'checkbox-toggle'
37
+ ),
38
+ converter.classToClass('spectrum-Card-actions'),
39
+ converter.classToClass(
40
+ 'spectrum-Card-actionButton',
41
+ 'action-button'
42
+ ),
43
+ converter.classToClass('spectrum-Checkbox', 'checkbox'),
44
+ ...converter.enumerateAttributes(
45
+ [['spectrum-Card--quiet'], ['spectrum-Card--gallery']],
46
+ 'variant'
47
+ ),
48
+ converter.classToAttribute('is-focused', 'focused'),
49
+ converter.classToAttribute('is-selected', 'selected'),
50
+ converter.classToAttribute('is-drop-target', 'drop-target'),
51
+ // Default to `size='m'` without needing the attribute
52
+ converter.classToHost('spectrum-Card--sizeM'),
53
+ ...converter.enumerateAttributes(
54
+ [
55
+ ['spectrum-Card--sizeS', 's'],
56
+ ['spectrum-Card--sizeL', 'l'],
57
+ ['spectrum-Card--sizeXL', 'xl'],
58
+ ],
59
+ 'size'
60
+ ),
61
+ converter.classToAttribute('spectrum-Card--horizontal'),
62
+ converter.classToId('spectrum-Card-coverPhoto', 'cover-photo'),
63
+ converter.classToId('spectrum-Card-preview'),
64
+ converter.classToSlotted('spectrum-Card-footer', 'footer'),
65
+ converter.classToSlotted(
66
+ 'spectrum-Card-description',
67
+ 'description'
68
+ ),
69
+ ],
70
+ },
71
+ ],
72
+ };
73
+
74
+ export default config;