@finastra/account-card - npm Package Compare versions

Comparing version 1.6.0 to 1.7.0

.eslintrc.json

@@ -8,3 +8,3 @@ {
       "parserOptions": {
-        "project": ["libs/web-components/account-card/tsconfig.*?.json"]
+        "project": ["packages/fds-components-web/account-card/tsconfig.*?.json"]
       },
@@ -11,0 +11,0 @@ "rules": {}

dist/src/styles.css.js

@@ -7,3 +7,3 @@ /**
 import { css } from 'lit';
-export const styles = css `:host{display:block;height:fit-content;--mdc-card-border-radius: 4px}:host .mdc-elevation-overlay{position:absolute;border-radius:inherit;pointer-events:none;opacity:0;opacity:var(--mdc-elevation-overlay-opacity, 0);transition:opacity 280ms cubic-bezier(0.4, 0, 0.2, 1);background-color:#fff;background-color:var(--mdc-elevation-overlay-color, #fff)}:host .mdc-card{border-radius:4px;border-radius:var(--mdc-shape-medium, 4px);background-color:#fff;background-color:var(--mdc-theme-surface, #fff);position:relative;box-shadow:0px 2px 1px -1px rgba(0, 0, 0, 0.2),0px 1px 1px 0px rgba(0, 0, 0, 0.14),0px 1px 3px 0px rgba(0,0,0,.12);display:flex;flex-direction:column;box-sizing:border-box}:host .mdc-card .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}:host .mdc-card::after{border-radius:4px;border-radius:var(--mdc-shape-medium, 4px);position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:1px solid rgba(0,0,0,0);border-radius:inherit;content:"";pointer-events:none;pointer-events:none}@media screen and (forced-colors: active){:host .mdc-card::after{border-color:CanvasText}}:host .mdc-card--outlined{box-shadow:0px 0px 0px 0px rgba(0, 0, 0, 0.2),0px 0px 0px 0px rgba(0, 0, 0, 0.14),0px 0px 0px 0px rgba(0,0,0,.12);border-width:1px;border-style:solid;border-color:#e0e0e0}:host .mdc-card--outlined::after{border:none}:host .mdc-card__content{border-radius:inherit;height:100%}:host .mdc-card__media{position:relative;box-sizing:border-box;background-repeat:no-repeat;background-position:center;background-size:cover}:host .mdc-card__media::before{display:block;content:""}:host .mdc-card__media:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}:host .mdc-card__media:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}:host .mdc-card__media--square::before{margin-top:100%}:host .mdc-card__media--16-9::before{margin-top:56.25%}:host .mdc-card__media-content{position:absolute;top:0;right:0;bottom:0;left:0;box-sizing:border-box}:host .mdc-card__primary-action{display:flex;flex-direction:column;box-sizing:border-box;position:relative;outline:none;color:inherit;text-decoration:none;cursor:pointer;overflow:hidden}:host .mdc-card__primary-action:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}:host .mdc-card__primary-action:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}:host .mdc-card__actions{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;min-height:52px;padding:8px}:host .mdc-card__actions--full-bleed{padding:0}:host .mdc-card__action-buttons,:host .mdc-card__action-icons{display:flex;flex-direction:row;align-items:center;box-sizing:border-box}:host .mdc-card__action-icons{color:rgba(0, 0, 0, 0.6);flex-grow:1;justify-content:flex-end}:host .mdc-card__action-buttons+.mdc-card__action-icons{margin-left:16px;margin-right:0}[dir=rtl] :host .mdc-card__action-buttons+.mdc-card__action-icons,:host .mdc-card__action-buttons+.mdc-card__action-icons[dir=rtl]{margin-left:0;margin-right:16px}:host .mdc-card__action{display:inline-flex;flex-direction:row;align-items:center;box-sizing:border-box;justify-content:center;cursor:pointer;user-select:none}:host .mdc-card__action:focus{outline:none}:host .mdc-card__action--button{margin-left:0;margin-right:8px;padding:0 8px}[dir=rtl] :host .mdc-card__action--button,:host .mdc-card__action--button[dir=rtl]{margin-left:8px;margin-right:0}:host .mdc-card__action--button:last-child{margin-left:0;margin-right:0}[dir=rtl] :host .mdc-card__action--button:last-child,:host .mdc-card__action--button:last-child[dir=rtl]{margin-left:0;margin-right:0}:host .mdc-card__actions--full-bleed .mdc-card__action--button{justify-content:space-between;width:100%;height:auto;max-height:none;margin:0;padding:8px 16px;text-align:left}[dir=rtl] :host .mdc-card__actions--full-bleed .mdc-card__action--button,:host .mdc-card__actions--full-bleed .mdc-card__action--button[dir=rtl]{text-align:right}:host .mdc-card__action--icon{margin:-6px 0;padding:12px}:host .mdc-card__action--icon:not(:disabled){color:rgba(0, 0, 0, 0.6)}@keyframes mdc-ripple-fg-radius-in{from{animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transform:translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1)}to{transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}}@keyframes mdc-ripple-fg-opacity-in{from{animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@keyframes mdc-ripple-fg-opacity-out{from{animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}:host .mdc-card__primary-action{--mdc-ripple-fg-size: 0;--mdc-ripple-left: 0;--mdc-ripple-top: 0;--mdc-ripple-fg-scale: 1;--mdc-ripple-fg-translate-end: 0;--mdc-ripple-fg-translate-start: 0;-webkit-tap-highlight-color:rgba(0,0,0,0);will-change:transform,opacity}:host .mdc-card__primary-action .mdc-card__ripple::before,:host .mdc-card__primary-action .mdc-card__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:""}:host .mdc-card__primary-action .mdc-card__ripple::before{transition:opacity 15ms linear,background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}:host .mdc-card__primary-action .mdc-card__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}:host .mdc-card__primary-action.mdc-ripple-upgraded .mdc-card__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}:host .mdc-card__primary-action.mdc-ripple-upgraded .mdc-card__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}:host .mdc-card__primary-action.mdc-ripple-upgraded--unbounded .mdc-card__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}:host .mdc-card__primary-action.mdc-ripple-upgraded--foreground-activation .mdc-card__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards,mdc-ripple-fg-opacity-in 75ms forwards}:host .mdc-card__primary-action.mdc-ripple-upgraded--foreground-deactivation .mdc-card__ripple::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}:host .mdc-card__primary-action .mdc-card__ripple::before,:host .mdc-card__primary-action .mdc-card__ripple::after{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}:host .mdc-card__primary-action.mdc-ripple-upgraded .mdc-card__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}:host .mdc-card__primary-action .mdc-card__ripple::before,:host .mdc-card__primary-action .mdc-card__ripple::after{background-color:#000;background-color:var(--mdc-ripple-color, #000)}:host .mdc-card__primary-action:hover .mdc-card__ripple::before,:host .mdc-card__primary-action.mdc-ripple-surface--hover .mdc-card__ripple::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}:host .mdc-card__primary-action.mdc-ripple-upgraded--background-focused .mdc-card__ripple::before,:host .mdc-card__primary-action:not(.mdc-ripple-upgraded):focus .mdc-card__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}:host .mdc-card__primary-action:not(.mdc-ripple-upgraded) .mdc-card__ripple::after{transition:opacity 150ms linear}:host .mdc-card__primary-action:not(.mdc-ripple-upgraded):active .mdc-card__ripple::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}:host .mdc-card__primary-action.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}:host .mdc-card__primary-action .mdc-card__ripple{box-sizing:content-box;height:100%;overflow:hidden;left:0;pointer-events:none;position:absolute;top:0;width:100%}:host .mdc-card__primary-action.mdc-ripple-upgraded--background-focused::after,:host .mdc-card__primary-action:not(.mdc-ripple-upgraded):focus::after{position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:5px double rgba(0,0,0,0);border-radius:inherit;content:"";pointer-events:none}@media screen and (forced-colors: active){:host .mdc-card__primary-action.mdc-ripple-upgraded--background-focused::after,:host .mdc-card__primary-action:not(.mdc-ripple-upgraded):focus::after{border-color:CanvasText}}.mdc-card{flex:1;background:var(--fds-surface, #ffffff);height:100%;overflow:hidden;padding:var(--fds-spacing-3, 16px)}.mdc-card--selectable:hover{cursor:pointer;background:var(--fds-surface-hover, #ffffff)}.mdc-card--selectable:active{background:var(--fds-surface-selected, rgba(105, 78, 214, 0.08))}.mdc-card--disabled{cursor:not-allowed;background:var(--fds-surface-disabled, rgba(0, 0, 0, 0.12))}.mdc-card--outlined{border-color:var(--fds-outline, rgba(0, 0, 0, 0.12))}slot{border-radius:inherit}:host{min-width:230px}:host :host{display:block;height:fit-content;--mdc-card-border-radius: 4px}:host :host .mdc-card{border-radius:4px;border-radius:var(--mdc-shape-medium, 4px);background-color:#fff;background-color:var(--mdc-theme-surface, #fff);position:relative;box-shadow:0px 2px 1px -1px rgba(0, 0, 0, 0.2),0px 1px 1px 0px rgba(0, 0, 0, 0.14),0px 1px 3px 0px rgba(0,0,0,.12);display:flex;flex-direction:column;box-sizing:border-box}:host :host .mdc-card .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}:host :host .mdc-card::after{border-radius:4px;border-radius:var(--mdc-shape-medium, 4px);position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:1px solid rgba(0,0,0,0);border-radius:inherit;content:"";pointer-events:none;pointer-events:none}@media screen and (forced-colors: active){:host :host .mdc-card::after{border-color:CanvasText}}:host :host .mdc-card--outlined{box-shadow:0px 0px 0px 0px rgba(0, 0, 0, 0.2),0px 0px 0px 0px rgba(0, 0, 0, 0.14),0px 0px 0px 0px rgba(0,0,0,.12);border-width:1px;border-style:solid;border-color:#e0e0e0}:host :host .mdc-card--outlined::after{border:none}:host :host .mdc-card__content{border-radius:inherit;height:100%}:host :host .mdc-card__media{position:relative;box-sizing:border-box;background-repeat:no-repeat;background-position:center;background-size:cover}:host :host .mdc-card__media::before{display:block;content:""}:host :host .mdc-card__media:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}:host :host .mdc-card__media:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}:host :host .mdc-card__media--square::before{margin-top:100%}:host :host .mdc-card__media--16-9::before{margin-top:56.25%}:host :host .mdc-card__media-content{position:absolute;top:0;right:0;bottom:0;left:0;box-sizing:border-box}:host :host .mdc-card__primary-action{display:flex;flex-direction:column;box-sizing:border-box;position:relative;outline:none;color:inherit;text-decoration:none;cursor:pointer;overflow:hidden}:host :host .mdc-card__primary-action:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}:host :host .mdc-card__primary-action:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}:host :host .mdc-card__actions{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;min-height:52px;padding:8px}:host :host .mdc-card__actions--full-bleed{padding:0}:host :host .mdc-card__action-buttons,:host :host .mdc-card__action-icons{display:flex;flex-direction:row;align-items:center;box-sizing:border-box}:host :host .mdc-card__action-icons{color:rgba(0, 0, 0, 0.6);flex-grow:1;justify-content:flex-end}:host :host .mdc-card__action-buttons+.mdc-card__action-icons{margin-left:16px;margin-right:0}[dir=rtl] :host :host .mdc-card__action-buttons+.mdc-card__action-icons,:host :host .mdc-card__action-buttons+.mdc-card__action-icons[dir=rtl]{margin-left:0;margin-right:16px}:host :host .mdc-card__action{display:inline-flex;flex-direction:row;align-items:center;box-sizing:border-box;justify-content:center;cursor:pointer;user-select:none}:host :host .mdc-card__action:focus{outline:none}:host :host .mdc-card__action--button{margin-left:0;margin-right:8px;padding:0 8px}[dir=rtl] :host :host .mdc-card__action--button,:host :host .mdc-card__action--button[dir=rtl]{margin-left:8px;margin-right:0}:host :host .mdc-card__action--button:last-child{margin-left:0;margin-right:0}[dir=rtl] :host :host .mdc-card__action--button:last-child,:host :host .mdc-card__action--button:last-child[dir=rtl]{margin-left:0;margin-right:0}:host :host .mdc-card__actions--full-bleed .mdc-card__action--button{justify-content:space-between;width:100%;height:auto;max-height:none;margin:0;padding:8px 16px;text-align:left}[dir=rtl] :host :host .mdc-card__actions--full-bleed .mdc-card__action--button,:host :host .mdc-card__actions--full-bleed .mdc-card__action--button[dir=rtl]{text-align:right}:host :host .mdc-card__action--icon{margin:-6px 0;padding:12px}:host :host .mdc-card__action--icon:not(:disabled){color:rgba(0, 0, 0, 0.6)}:host :host .mdc-card__primary-action{--mdc-ripple-fg-size: 0;--mdc-ripple-left: 0;--mdc-ripple-top: 0;--mdc-ripple-fg-scale: 1;--mdc-ripple-fg-translate-end: 0;--mdc-ripple-fg-translate-start: 0;-webkit-tap-highlight-color:rgba(0,0,0,0);will-change:transform,opacity}:host :host .mdc-card__primary-action .mdc-card__ripple::before,:host :host .mdc-card__primary-action .mdc-card__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:""}:host :host .mdc-card__primary-action .mdc-card__ripple::before{transition:opacity 15ms linear,background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}:host :host .mdc-card__primary-action .mdc-card__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}:host :host .mdc-card__primary-action.mdc-ripple-upgraded .mdc-card__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}:host :host .mdc-card__primary-action.mdc-ripple-upgraded .mdc-card__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}:host :host .mdc-card__primary-action.mdc-ripple-upgraded--unbounded .mdc-card__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}:host :host .mdc-card__primary-action.mdc-ripple-upgraded--foreground-activation .mdc-card__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards,mdc-ripple-fg-opacity-in 75ms forwards}:host :host .mdc-card__primary-action.mdc-ripple-upgraded--foreground-deactivation .mdc-card__ripple::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}:host :host .mdc-card__primary-action .mdc-card__ripple::before,:host :host .mdc-card__primary-action .mdc-card__ripple::after{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}:host :host .mdc-card__primary-action.mdc-ripple-upgraded .mdc-card__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}:host :host .mdc-card__primary-action .mdc-card__ripple::before,:host :host .mdc-card__primary-action .mdc-card__ripple::after{background-color:#000;background-color:var(--mdc-ripple-color, #000)}:host :host .mdc-card__primary-action:hover .mdc-card__ripple::before,:host :host .mdc-card__primary-action.mdc-ripple-surface--hover .mdc-card__ripple::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}:host :host .mdc-card__primary-action.mdc-ripple-upgraded--background-focused .mdc-card__ripple::before,:host :host .mdc-card__primary-action:not(.mdc-ripple-upgraded):focus .mdc-card__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}:host :host .mdc-card__primary-action:not(.mdc-ripple-upgraded) .mdc-card__ripple::after{transition:opacity 150ms linear}:host :host .mdc-card__primary-action:not(.mdc-ripple-upgraded):active .mdc-card__ripple::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}:host :host .mdc-card__primary-action.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}:host :host .mdc-card__primary-action .mdc-card__ripple{box-sizing:content-box;height:100%;overflow:hidden;left:0;pointer-events:none;position:absolute;top:0;width:100%}:host :host .mdc-card__primary-action.mdc-ripple-upgraded--background-focused::after,:host :host .mdc-card__primary-action:not(.mdc-ripple-upgraded):focus::after{position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:5px double rgba(0,0,0,0);border-radius:inherit;content:"";pointer-events:none}@media screen and (forced-colors: active){:host :host .mdc-card__primary-action.mdc-ripple-upgraded--background-focused::after,:host :host .mdc-card__primary-action:not(.mdc-ripple-upgraded):focus::after{border-color:CanvasText}}:host .mdc-card{flex:1;background:var(--fds-surface, #ffffff);height:100%;overflow:hidden;padding:var(--fds-spacing-3, 16px)}:host .mdc-card--selectable:hover{cursor:pointer;background:var(--fds-surface-hover, #ffffff)}:host .mdc-card--selectable:active{background:var(--fds-surface-selected, rgba(105, 78, 214, 0.08))}:host .mdc-card--disabled{cursor:not-allowed;background:var(--fds-surface-disabled, rgba(0, 0, 0, 0.12))}:host .mdc-card--outlined{border-color:var(--fds-outline, rgba(0, 0, 0, 0.12))}:host slot{border-radius:inherit}:host .account-content{display:flex;gap:var(--fds-spacing-2, 8px)}:host .account-icon{margin-top:var(--fds-spacing-1, 4px);border-radius:50%;width:38px;height:38px;display:flex;justify-content:center;align-items:center;background:var(--fds-primary-lighter, )}:host .account-name{font:var(--fds-body-1, normal normal var(--fds-body-1-font-weight, 300) var(--fds-body-1-font-size, 1rem)/var(--fds-body-1-line-height, 1.5rem) var(--fds-body-1-font-family, Roboto));letter-spacing:0.5px;color:var(--fds-on-surface, #000000)}:host .account-balance{font:var(--fds-headline-5, normal normal var(--fds-headline-5-font-weight, 800) var(--fds-headline-5-font-size, 1rem)/var(--fds-headline-5-line-height, 1.375rem) var(--fds-headline-5-font-family, Spartan));letter-spacing:0;color:var(--fds-on-surface, #000000);margin-top:var(--fds-spacing-4, 24px)}:host .account-number{font:var(--fds-body-3, normal normal var(--fds-body-3-font-weight, 300) var(--fds-body-3-font-size, 0.75rem)/var(--fds-body-3-line-height, 1.125rem) var(--fds-body-3-font-family, Roboto));letter-spacing:0.25px;color:var(--fds-on-surface-medium, rgba(0, 0, 0, 0.54));padding-top:var(--fds-spacing-2, 8px);padding-bottom:var(--fds-spacing-2, 8px);padding-right:var(--fds-spacing-3, 16px);padding-left:var(--fds-spacing-3, 16px)}:host .mdc-card--disabled .account-name,:host .mdc-card--disabled .account-balance,:host .mdc-card--disabled .account-number{color:var(--fds-on-surface-disabled, rgba(0, 0, 0, 0.29))}:host .mdc-card--disabled .account-icon{background:var(--fds-surface-disabled, rgba(0, 0, 0, 0.12))}`;
+export const styles = css `:host{display:block;height:fit-content;--mdc-card-border-radius: 4px}:host .mdc-elevation-overlay{position:absolute;border-radius:inherit;pointer-events:none;opacity:0;opacity:var(--mdc-elevation-overlay-opacity, 0);transition:opacity 280ms cubic-bezier(0.4, 0, 0.2, 1);background-color:#fff;background-color:var(--mdc-elevation-overlay-color, #fff)}:host .mdc-card{border-radius:4px;border-radius:var(--mdc-shape-medium, 4px);background-color:#fff;background-color:var(--mdc-theme-surface, #fff);position:relative;box-shadow:0px 2px 1px -1px rgba(0, 0, 0, 0.2),0px 1px 1px 0px rgba(0, 0, 0, 0.14),0px 1px 3px 0px rgba(0,0,0,.12);display:flex;flex-direction:column;box-sizing:border-box}:host .mdc-card .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}:host .mdc-card::after{border-radius:4px;border-radius:var(--mdc-shape-medium, 4px);position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:1px solid rgba(0,0,0,0);border-radius:inherit;content:"";pointer-events:none;pointer-events:none}@media screen and (forced-colors: active){:host .mdc-card::after{border-color:CanvasText}}:host .mdc-card--outlined{box-shadow:0px 0px 0px 0px rgba(0, 0, 0, 0.2),0px 0px 0px 0px rgba(0, 0, 0, 0.14),0px 0px 0px 0px rgba(0,0,0,.12);border-width:1px;border-style:solid;border-color:#e0e0e0}:host .mdc-card--outlined::after{border:none}:host .mdc-card__content{border-radius:inherit;height:100%}:host .mdc-card__media{position:relative;box-sizing:border-box;background-repeat:no-repeat;background-position:center;background-size:cover}:host .mdc-card__media::before{display:block;content:""}:host .mdc-card__media:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}:host .mdc-card__media:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}:host .mdc-card__media--square::before{margin-top:100%}:host .mdc-card__media--16-9::before{margin-top:56.25%}:host .mdc-card__media-content{position:absolute;top:0;right:0;bottom:0;left:0;box-sizing:border-box}:host .mdc-card__primary-action{display:flex;flex-direction:column;box-sizing:border-box;position:relative;outline:none;color:inherit;text-decoration:none;cursor:pointer;overflow:hidden}:host .mdc-card__primary-action:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}:host .mdc-card__primary-action:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}:host .mdc-card__actions{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;min-height:52px;padding:8px}:host .mdc-card__actions--full-bleed{padding:0}:host .mdc-card__action-buttons,:host .mdc-card__action-icons{display:flex;flex-direction:row;align-items:center;box-sizing:border-box}:host .mdc-card__action-icons{color:rgba(0, 0, 0, 0.6);flex-grow:1;justify-content:flex-end}:host .mdc-card__action-buttons+.mdc-card__action-icons{margin-left:16px;margin-right:0}[dir=rtl] :host .mdc-card__action-buttons+.mdc-card__action-icons,:host .mdc-card__action-buttons+.mdc-card__action-icons[dir=rtl]{margin-left:0;margin-right:16px}:host .mdc-card__action{display:inline-flex;flex-direction:row;align-items:center;box-sizing:border-box;justify-content:center;cursor:pointer;user-select:none}:host .mdc-card__action:focus{outline:none}:host .mdc-card__action--button{margin-left:0;margin-right:8px;padding:0 8px}[dir=rtl] :host .mdc-card__action--button,:host .mdc-card__action--button[dir=rtl]{margin-left:8px;margin-right:0}:host .mdc-card__action--button:last-child{margin-left:0;margin-right:0}[dir=rtl] :host .mdc-card__action--button:last-child,:host .mdc-card__action--button:last-child[dir=rtl]{margin-left:0;margin-right:0}:host .mdc-card__actions--full-bleed .mdc-card__action--button{justify-content:space-between;width:100%;height:auto;max-height:none;margin:0;padding:8px 16px;text-align:left}[dir=rtl] :host .mdc-card__actions--full-bleed .mdc-card__action--button,:host .mdc-card__actions--full-bleed .mdc-card__action--button[dir=rtl]{text-align:right}:host .mdc-card__action--icon{margin:-6px 0;padding:12px}:host .mdc-card__action--icon:not(:disabled){color:rgba(0, 0, 0, 0.6)}@keyframes mdc-ripple-fg-radius-in{from{animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transform:translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1)}to{transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}}@keyframes mdc-ripple-fg-opacity-in{from{animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@keyframes mdc-ripple-fg-opacity-out{from{animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}:host .mdc-card__primary-action{--mdc-ripple-fg-size: 0;--mdc-ripple-left: 0;--mdc-ripple-top: 0;--mdc-ripple-fg-scale: 1;--mdc-ripple-fg-translate-end: 0;--mdc-ripple-fg-translate-start: 0;-webkit-tap-highlight-color:rgba(0,0,0,0);will-change:transform,opacity}:host .mdc-card__primary-action .mdc-card__ripple::before,:host .mdc-card__primary-action .mdc-card__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:""}:host .mdc-card__primary-action .mdc-card__ripple::before{transition:opacity 15ms linear,background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}:host .mdc-card__primary-action .mdc-card__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}:host .mdc-card__primary-action.mdc-ripple-upgraded .mdc-card__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}:host .mdc-card__primary-action.mdc-ripple-upgraded .mdc-card__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}:host .mdc-card__primary-action.mdc-ripple-upgraded--unbounded .mdc-card__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}:host .mdc-card__primary-action.mdc-ripple-upgraded--foreground-activation .mdc-card__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards,mdc-ripple-fg-opacity-in 75ms forwards}:host .mdc-card__primary-action.mdc-ripple-upgraded--foreground-deactivation .mdc-card__ripple::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}:host .mdc-card__primary-action .mdc-card__ripple::before,:host .mdc-card__primary-action .mdc-card__ripple::after{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}:host .mdc-card__primary-action.mdc-ripple-upgraded .mdc-card__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}:host .mdc-card__primary-action .mdc-card__ripple::before,:host .mdc-card__primary-action .mdc-card__ripple::after{background-color:#000;background-color:var(--mdc-ripple-color, #000)}:host .mdc-card__primary-action:hover .mdc-card__ripple::before,:host .mdc-card__primary-action.mdc-ripple-surface--hover .mdc-card__ripple::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}:host .mdc-card__primary-action.mdc-ripple-upgraded--background-focused .mdc-card__ripple::before,:host .mdc-card__primary-action:not(.mdc-ripple-upgraded):focus .mdc-card__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}:host .mdc-card__primary-action:not(.mdc-ripple-upgraded) .mdc-card__ripple::after{transition:opacity 150ms linear}:host .mdc-card__primary-action:not(.mdc-ripple-upgraded):active .mdc-card__ripple::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}:host .mdc-card__primary-action.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}:host .mdc-card__primary-action .mdc-card__ripple{box-sizing:content-box;height:100%;overflow:hidden;left:0;pointer-events:none;position:absolute;top:0;width:100%}:host .mdc-card__primary-action.mdc-ripple-upgraded--background-focused::after,:host .mdc-card__primary-action:not(.mdc-ripple-upgraded):focus::after{position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:5px double rgba(0,0,0,0);border-radius:inherit;content:"";pointer-events:none}@media screen and (forced-colors: active){:host .mdc-card__primary-action.mdc-ripple-upgraded--background-focused::after,:host .mdc-card__primary-action:not(.mdc-ripple-upgraded):focus::after{border-color:CanvasText}}.mdc-card{flex:1;background:var(--fds-surface, #ffffff);height:100%;overflow:hidden;padding:var(--fds-spacing-3, 16px)}.mdc-card--selectable:hover{cursor:pointer;background:var(--fds-surface-hover, #ffffff)}.mdc-card--selectable:active{background:var(--fds-surface-selected, rgba(105, 78, 214, 0.08))}.mdc-card--disabled{cursor:not-allowed;background:var(--fds-surface-disabled, rgba(0, 0, 0, 0.12))}.mdc-card--outlined{border-color:var(--fds-outline, rgba(0, 0, 0, 0.12))}slot{border-radius:inherit}:host{min-width:230px}:host :host{display:block;height:fit-content;--mdc-card-border-radius: 4px}:host :host .mdc-card{border-radius:4px;border-radius:var(--mdc-shape-medium, 4px);background-color:#fff;background-color:var(--mdc-theme-surface, #fff);position:relative;box-shadow:0px 2px 1px -1px rgba(0, 0, 0, 0.2),0px 1px 1px 0px rgba(0, 0, 0, 0.14),0px 1px 3px 0px rgba(0,0,0,.12);display:flex;flex-direction:column;box-sizing:border-box}:host :host .mdc-card .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}:host :host .mdc-card::after{border-radius:4px;border-radius:var(--mdc-shape-medium, 4px);position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:1px solid rgba(0,0,0,0);border-radius:inherit;content:"";pointer-events:none;pointer-events:none}@media screen and (forced-colors: active){:host :host .mdc-card::after{border-color:CanvasText}}:host :host .mdc-card--outlined{box-shadow:0px 0px 0px 0px rgba(0, 0, 0, 0.2),0px 0px 0px 0px rgba(0, 0, 0, 0.14),0px 0px 0px 0px rgba(0,0,0,.12);border-width:1px;border-style:solid;border-color:#e0e0e0}:host :host .mdc-card--outlined::after{border:none}:host :host .mdc-card__content{border-radius:inherit;height:100%}:host :host .mdc-card__media{position:relative;box-sizing:border-box;background-repeat:no-repeat;background-position:center;background-size:cover}:host :host .mdc-card__media::before{display:block;content:""}:host :host .mdc-card__media:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}:host :host .mdc-card__media:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}:host :host .mdc-card__media--square::before{margin-top:100%}:host :host .mdc-card__media--16-9::before{margin-top:56.25%}:host :host .mdc-card__media-content{position:absolute;top:0;right:0;bottom:0;left:0;box-sizing:border-box}:host :host .mdc-card__primary-action{display:flex;flex-direction:column;box-sizing:border-box;position:relative;outline:none;color:inherit;text-decoration:none;cursor:pointer;overflow:hidden}:host :host .mdc-card__primary-action:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}:host :host .mdc-card__primary-action:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}:host :host .mdc-card__actions{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;min-height:52px;padding:8px}:host :host .mdc-card__actions--full-bleed{padding:0}:host :host .mdc-card__action-buttons,:host :host .mdc-card__action-icons{display:flex;flex-direction:row;align-items:center;box-sizing:border-box}:host :host .mdc-card__action-icons{color:rgba(0, 0, 0, 0.6);flex-grow:1;justify-content:flex-end}:host :host .mdc-card__action-buttons+.mdc-card__action-icons{margin-left:16px;margin-right:0}[dir=rtl] :host :host .mdc-card__action-buttons+.mdc-card__action-icons,:host :host .mdc-card__action-buttons+.mdc-card__action-icons[dir=rtl]{margin-left:0;margin-right:16px}:host :host .mdc-card__action{display:inline-flex;flex-direction:row;align-items:center;box-sizing:border-box;justify-content:center;cursor:pointer;user-select:none}:host :host .mdc-card__action:focus{outline:none}:host :host .mdc-card__action--button{margin-left:0;margin-right:8px;padding:0 8px}[dir=rtl] :host :host .mdc-card__action--button,:host :host .mdc-card__action--button[dir=rtl]{margin-left:8px;margin-right:0}:host :host .mdc-card__action--button:last-child{margin-left:0;margin-right:0}[dir=rtl] :host :host .mdc-card__action--button:last-child,:host :host .mdc-card__action--button:last-child[dir=rtl]{margin-left:0;margin-right:0}:host :host .mdc-card__actions--full-bleed .mdc-card__action--button{justify-content:space-between;width:100%;height:auto;max-height:none;margin:0;padding:8px 16px;text-align:left}[dir=rtl] :host :host .mdc-card__actions--full-bleed .mdc-card__action--button,:host :host .mdc-card__actions--full-bleed .mdc-card__action--button[dir=rtl]{text-align:right}:host :host .mdc-card__action--icon{margin:-6px 0;padding:12px}:host :host .mdc-card__action--icon:not(:disabled){color:rgba(0, 0, 0, 0.6)}:host :host .mdc-card__primary-action{--mdc-ripple-fg-size: 0;--mdc-ripple-left: 0;--mdc-ripple-top: 0;--mdc-ripple-fg-scale: 1;--mdc-ripple-fg-translate-end: 0;--mdc-ripple-fg-translate-start: 0;-webkit-tap-highlight-color:rgba(0,0,0,0);will-change:transform,opacity}:host :host .mdc-card__primary-action .mdc-card__ripple::before,:host :host .mdc-card__primary-action .mdc-card__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:""}:host :host .mdc-card__primary-action .mdc-card__ripple::before{transition:opacity 15ms linear,background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}:host :host .mdc-card__primary-action .mdc-card__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}:host :host .mdc-card__primary-action.mdc-ripple-upgraded .mdc-card__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}:host :host .mdc-card__primary-action.mdc-ripple-upgraded .mdc-card__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}:host :host .mdc-card__primary-action.mdc-ripple-upgraded--unbounded .mdc-card__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}:host :host .mdc-card__primary-action.mdc-ripple-upgraded--foreground-activation .mdc-card__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards,mdc-ripple-fg-opacity-in 75ms forwards}:host :host .mdc-card__primary-action.mdc-ripple-upgraded--foreground-deactivation .mdc-card__ripple::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}:host :host .mdc-card__primary-action .mdc-card__ripple::before,:host :host .mdc-card__primary-action .mdc-card__ripple::after{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}:host :host .mdc-card__primary-action.mdc-ripple-upgraded .mdc-card__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}:host :host .mdc-card__primary-action .mdc-card__ripple::before,:host :host .mdc-card__primary-action .mdc-card__ripple::after{background-color:#000;background-color:var(--mdc-ripple-color, #000)}:host :host .mdc-card__primary-action:hover .mdc-card__ripple::before,:host :host .mdc-card__primary-action.mdc-ripple-surface--hover .mdc-card__ripple::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}:host :host .mdc-card__primary-action.mdc-ripple-upgraded--background-focused .mdc-card__ripple::before,:host :host .mdc-card__primary-action:not(.mdc-ripple-upgraded):focus .mdc-card__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}:host :host .mdc-card__primary-action:not(.mdc-ripple-upgraded) .mdc-card__ripple::after{transition:opacity 150ms linear}:host :host .mdc-card__primary-action:not(.mdc-ripple-upgraded):active .mdc-card__ripple::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}:host :host .mdc-card__primary-action.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}:host :host .mdc-card__primary-action .mdc-card__ripple{box-sizing:content-box;height:100%;overflow:hidden;left:0;pointer-events:none;position:absolute;top:0;width:100%}:host :host .mdc-card__primary-action.mdc-ripple-upgraded--background-focused::after,:host :host .mdc-card__primary-action:not(.mdc-ripple-upgraded):focus::after{position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:5px double rgba(0,0,0,0);border-radius:inherit;content:"";pointer-events:none}@media screen and (forced-colors: active){:host :host .mdc-card__primary-action.mdc-ripple-upgraded--background-focused::after,:host :host .mdc-card__primary-action:not(.mdc-ripple-upgraded):focus::after{border-color:CanvasText}}:host .mdc-card{flex:1;background:var(--fds-surface, #ffffff);height:100%;overflow:hidden;padding:var(--fds-spacing-3, 16px)}:host .mdc-card--selectable:hover{cursor:pointer;background:var(--fds-surface-hover, #ffffff)}:host .mdc-card--selectable:active{background:var(--fds-surface-selected, rgba(105, 78, 214, 0.08))}:host .mdc-card--disabled{cursor:not-allowed;background:var(--fds-surface-disabled, rgba(0, 0, 0, 0.12))}:host .mdc-card--outlined{border-color:var(--fds-outline, rgba(0, 0, 0, 0.12))}:host slot{border-radius:inherit}:host .account-content{display:flex;gap:var(--fds-spacing-2, 8px)}:host .account-icon{margin-top:var(--fds-spacing-1, 4px);border-radius:50%;width:38px;height:38px;display:flex;justify-content:center;align-items:center;background:var(--fds-surface-selected, rgba(105, 78, 214, 0.08))}:host .account-name{font:var(--fds-body-1, normal normal var(--fds-body-1-font-weight, 300) var(--fds-body-1-font-size, 1rem)/var(--fds-body-1-line-height, 1.5rem) var(--fds-body-1-font-family, Roboto));letter-spacing:0.5px;color:var(--fds-on-surface, #000000)}:host .account-balance{font:var(--fds-headline-5, normal normal var(--fds-headline-5-font-weight, 800) var(--fds-headline-5-font-size, 1rem)/var(--fds-headline-5-line-height, 1.375rem) var(--fds-headline-5-font-family, Spartan));letter-spacing:0;color:var(--fds-on-surface, #000000);margin-top:var(--fds-spacing-4, 24px)}:host .account-number{font:var(--fds-body-3, normal normal var(--fds-body-3-font-weight, 300) var(--fds-body-3-font-size, 0.75rem)/var(--fds-body-3-line-height, 1.125rem) var(--fds-body-3-font-family, Roboto));letter-spacing:0.25px;color:var(--fds-on-surface-medium, rgba(0, 0, 0, 0.54));padding-top:var(--fds-spacing-2, 8px);padding-bottom:var(--fds-spacing-2, 8px);padding-right:var(--fds-spacing-3, 16px);padding-left:var(--fds-spacing-3, 16px)}:host .mdc-card--disabled .account-name,:host .mdc-card--disabled .account-balance,:host .mdc-card--disabled .account-number{color:var(--fds-on-surface-disabled, rgba(0, 0, 0, 0.29))}:host .mdc-card--disabled .account-icon{background:var(--fds-surface-disabled, rgba(0, 0, 0, 0.12))}`;
 //# sourceMappingURL=styles.css.js.map

package.json

 {
   "name": "@finastra/account-card",
   "displayName": "AccountCard",
-  "version": "1.6.0",
+  "version": "1.7.0",
   "description": "AccountCard Web Component",
@@ -18,4 +18,4 @@ "keywords": [
   "dependencies": {
-    "@finastra/divider": "1.6.0",
-    "@finastra/icon": "1.6.0",
+    "@finastra/divider": "1.7.0",
+    "@finastra/icon": "1.7.0",
     "lit": "^2.0.0",
@@ -26,3 +26,4 @@ "tslib": "^2.0.1"
     "access": "public"
-  }
+  },
+  "gitHead": "65b11966df3f37a9105ba7ead15eae3e6fc36ae3"
 }

README.md

@@ -28,16 +28,15 @@ # Account Card
 <!-- DOC -->
-
 #### Properties
 
-| Property        | Attribute       | Type      | Default                       | Description                                                   |
-| --------------- | --------------- | --------- | ----------------------------- | ------------------------------------------------------------- |
-| `balance`       | `balance`       | `number`  | 0                             | Account balance.                                              |
-| `currency`      | `currency`      | `string`  | "USD"                         | Account currency ISO format.                                  |
-| `disabled`      | `disabled`      | `boolean` | false                         | Disabled style of the card.                                   |
-| `icon`          | `icon`          | `string`  | "credit_card"                 | Change card icon.                                             |
-| `iconAriaLabel` | `iconAriaLabel` | `boolean` | "Credit Card"                 | Change the card icon aria label.                              |
-| `name`          | `name`          | `string`  | "Account"                     | Account Name.                                                 |
-| `number`        | `number`        | `string`  | "XXXX XXXX XXXX XXXX XXXX XX" | Account number.                                               |
+| Property        | Attribute       | Type      | Default                       | Description                                      |
+|-----------------|-----------------|-----------|-------------------------------|--------------------------------------------------|
+| `balance`       | `balance`       | `number`  | 0                             | Account balance.                                 |
+| `currency`      | `currency`      | `string`  | "USD"                         | Account currency ISO format.                     |
+| `disabled`      | `disabled`      | `boolean` | false                         | Disabled style of the card.                      |
+| `icon`          | `icon`          | `string`  | "credit_card"                 | Change card icon.                                |
+| `iconAriaLabel` | `iconAriaLabel` | `boolean` | "Credit Card"                 | Change the card icon aria label.                 |
+| `name`          | `name`          | `string`  | "Account"                     | Account Name.                                    |
+| `number`        | `number`        | `string`  | "XXXX XXXX XXXX XXXX XXXX XX" | Account number.                                  |
 | `outlined`      | `outlined`      | `boolean` | false                         | Change the card style to outlined, default style is elevated. |
-| `selectable`    | `selectable`    | `boolean` | false                         | Change the card style to an action card.                      |
+| `selectable`    | `selectable`    | `boolean` | false                         | Change the card style to an action card.         |
 
@@ -47,6 +46,5 @@ #### Methods
 | Method              | Type                    |
-| ------------------- | ----------------------- |
+|---------------------|-------------------------|
 | `renderBalance`     | `(): string`            |
 | `renderCardContent` | `(): TemplateResult<1>` |
-
 <!-- /DOC -->

No alert changes

Improved metrics

Total package byte prevSize

55973

increased by5.21%

Number of package files

17

increased by13.33%

Worsened metrics

Number of lines in readme file

49

decreased by-3.92%

Dependency changes

• + Added@finastra/divider@1.7.0(transitive)

• + Added@finastra/icon@1.7.0(transitive)

• - Removed@finastra/divider@1.6.0(transitive)

• - Removed@finastra/icon@1.6.0(transitive)

• Updated@finastra/divider@1.7.0

• Updated@finastra/icon@1.7.0