@danske/sapphire-angular 1.19.3 → 1.19.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/button/src/icon-button.component.mjs +2 -2
- package/esm2020/lib/theme/src/themes.mjs +4 -4
- package/fesm2015/danske-sapphire-angular.mjs +6 -6
- package/fesm2015/danske-sapphire-angular.mjs.map +1 -1
- package/fesm2020/danske-sapphire-angular.mjs +6 -6
- package/fesm2020/danske-sapphire-angular.mjs.map +1 -1
- package/package.json +3 -3
|
@@ -53,7 +53,7 @@ IconButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
|
|
|
53
53
|
provide: ICON_SIZE_PROVIDER,
|
|
54
54
|
useExisting: forwardRef(() => IconButtonComponent),
|
|
55
55
|
},
|
|
56
|
-
], hostDirectives: [{ directive: i1.UseComponentStylesOnHost }], ngImport: i0, template: "<span class=\"sapphire-icon-button__icon\">\n <ng-content></ng-content>\n</span>\n", styles: [".sapphire-icon-button{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;white-space:nowrap;margin:0;padding:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;height:var(--sapphire-icon-button-size-height-m);width:var(--sapphire-icon-button-size-width-m);flex-shrink:0;border-radius:var(--sapphire-icon-button-size-radius-m);border-style:solid;border-width:0;border-color:transparent;transition-property:opacity,background-color,color;transition-duration:var(--sapphire-icon-button-time-transition);transition-timing-function:ease-in-out;cursor:pointer}a.sapphire-icon-button{text-decoration:none}.sapphire-icon-button:disabled,.sapphire-icon-button.is-disabled{opacity:var(--sapphire-icon-button-opacity-disabled);cursor:not-allowed}.sapphire-icon-button:focus{outline:none}.sapphire-icon-button.is-focus,.sapphire-icon-button:not(.js-focus):focus-visible{outline:var(--sapphire-icon-button-size-focus-ring-border) solid var(--sapphire-icon-button-color-focus-ring);outline-offset:var(--sapphire-icon-button-size-focus-ring-offset)}.sapphire-icon-button--primary-fill{background-color:var(--sapphire-icon-button-color-background-primary-default);color:var(--sapphire-icon-button-color-content-primary-default)}.sapphire-icon-button--primary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--primary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-primary-hover)}.sapphire-icon-button--primary-fill.is-focus,.sapphire-icon-button--primary-fill:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-primary-focus)}.sapphire-icon-button--primary-fill:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--primary-fill:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--primary-fill:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-primary-active)}.sapphire-icon-button--secondary-fill{background-color:var(--sapphire-icon-button-color-background-secondary-default);color:var(--sapphire-icon-button-color-content-secondary-default)}.sapphire-icon-button--secondary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--secondary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-secondary-hover);color:var(--sapphire-icon-button-color-content-secondary-hover)}.sapphire-icon-button--secondary-fill.is-focus,.sapphire-icon-button--secondary-fill:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-secondary-focus)}.sapphire-icon-button--secondary-fill:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--secondary-fill:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--secondary-fill:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-secondary-active);color:var(--sapphire-icon-button-color-content-secondary-active)}.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-secondary-surface-secondary-default)}.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-secondary-surface-secondary-hover)}.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-secondary-surface-secondary-focus)}.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-secondary-surface-secondary-active)}.sapphire-icon-button--secondary-ghost{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-default);color:var(--sapphire-icon-button-color-content-secondary-default)}.sapphire-icon-button--secondary-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--secondary-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-hover);color:var(--sapphire-icon-button-color-content-secondary-hover)}.sapphire-icon-button--secondary-ghost.is-focus,.sapphire-icon-button--secondary-ghost:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-focus)}.sapphire-icon-button--secondary-ghost:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--secondary-ghost:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--secondary-ghost:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-active);color:var(--sapphire-icon-button-color-content-secondary-active)}.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-surface-secondary-default)}.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-surface-secondary-hover)}.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-surface-secondary-focus)}.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-surface-secondary-active)}.sapphire-icon-button--tertiary-fill{background-color:var(--sapphire-icon-button-color-background-tertiary-default);color:var(--sapphire-icon-button-color-content-tertiary-default)}.sapphire-icon-button--tertiary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--tertiary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-tertiary-hover);color:var(--sapphire-icon-button-color-content-tertiary-hover)}.sapphire-icon-button--tertiary-fill.is-focus,.sapphire-icon-button--tertiary-fill:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-tertiary-focus)}.sapphire-icon-button--tertiary-fill:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--tertiary-fill:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--tertiary-fill:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-tertiary-active);color:var(--sapphire-icon-button-color-content-tertiary-active)}.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-tertiary-surface-secondary-default)}.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-tertiary-surface-secondary-hover)}.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-tertiary-surface-secondary-focus)}.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-tertiary-surface-secondary-active)}.sapphire-icon-button--tertiary-ghost{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-default);color:var(--sapphire-icon-button-color-content-tertiary-default)}.sapphire-icon-button--tertiary-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--tertiary-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-hover);color:var(--sapphire-icon-button-color-content-tertiary-hover)}.sapphire-icon-button--tertiary-ghost.is-focus,.sapphire-icon-button--tertiary-ghost:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-focus)}.sapphire-icon-button--tertiary-ghost:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--tertiary-ghost:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--tertiary-ghost:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-active);color:var(--sapphire-icon-button-color-content-tertiary-active)}.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-surface-secondary-default)}.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-surface-secondary-hover)}.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-surface-secondary-focus)}.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-surface-secondary-active)}.sapphire-icon-button--danger-fill{background-color:var(--sapphire-icon-button-color-background-danger-default);color:var(--sapphire-icon-button-color-content-danger-default)}.sapphire-icon-button--danger-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--danger-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-danger-hover);color:var(--sapphire-icon-button-color-content-danger-hover)}.sapphire-icon-button--danger-fill.is-focus,.sapphire-icon-button--danger-fill:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-danger-focus)}.sapphire-icon-button--danger-fill:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--danger-fill:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--danger-fill:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-danger-active);color:var(--sapphire-icon-button-color-content-danger-active)}.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-danger-surface-secondary-default)}.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-danger-surface-secondary-hover)}.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-danger-surface-secondary-focus)}.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-danger-surface-secondary-active)}.sapphire-icon-button--danger-ghost{background-color:var(--sapphire-icon-button-color-background-danger-ghost-default);color:var(--sapphire-icon-button-color-content-danger-default)}.sapphire-icon-button--danger-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--danger-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-danger-ghost-hover);color:var(--sapphire-icon-button-color-content-danger-hover)}.sapphire-icon-button--danger-ghost.is-focus,.sapphire-icon-button--danger-ghost:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-danger-ghost-focus)}.sapphire-icon-button--danger-ghost:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--danger-ghost:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--danger-ghost:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-danger-ghost-active);color:var(--sapphire-icon-button-color-content-danger-active)}.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-danger-ghost-surface-secondary-default)}.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-danger-ghost-surface-secondary-hover)}.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-danger-ghost-surface-secondary-focus)}.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-button-color-background-danger-ghost-surface-secondary-active)}.sapphire-icon-button__icon{display:flex;flex-direction:column;justify-content:center;align-items:center;height:var(--sapphire-icon-button-size-icon-m);width:var(--sapphire-icon-button-size-icon-m)}.sapphire-icon-button--large .sapphire-icon-button__icon{height:var(--sapphire-icon-button-size-icon-l);width:var(--sapphire-icon-button-size-icon-l)}.sapphire-icon-button--small .sapphire-icon-button__icon{height:var(--sapphire-icon-button-size-icon-s);width:var(--sapphire-icon-button-size-icon-s)}.sapphire-icon-button--extra-small .sapphire-icon-button__icon{height:var(--sapphire-icon-button-size-icon-xs);width:var(--sapphire-icon-button-size-icon-xs)}.sapphire-icon-button--large{height:var(--sapphire-icon-button-size-height-l);width:var(--sapphire-icon-button-size-width-l);border-radius:var(--sapphire-icon-button-size-radius-l)}.sapphire-icon-button--small{height:var(--sapphire-icon-button-size-height-s);width:var(--sapphire-icon-button-size-width-s);border-radius:var(--sapphire-icon-button-size-radius-s)}.sapphire-icon-button--extra-small{height:var(--sapphire-icon-button-size-height-xs);width:var(--sapphire-icon-button-size-width-xs);border-radius:var(--sapphire-icon-button-size-radius-xs)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
56
|
+
], hostDirectives: [{ directive: i1.UseComponentStylesOnHost }], ngImport: i0, template: "<span class=\"sapphire-icon-button__icon\">\n <ng-content></ng-content>\n</span>\n", styles: [".sapphire-icon-button{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;white-space:nowrap;margin:0;padding:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;height:var(--sapphire-icon-button-size-height-m);width:var(--sapphire-icon-button-size-width-m);flex-shrink:0;border-radius:var(--sapphire-icon-button-size-radius-m);border-style:solid;border-width:0;border-color:transparent;transition-property:opacity,background-color,color;transition-duration:var(--sapphire-icon-button-time-transition);transition-timing-function:ease-in-out;cursor:pointer}a.sapphire-icon-button{text-decoration:none}.sapphire-icon-button:disabled,.sapphire-icon-button.is-disabled{opacity:var(--sapphire-icon-button-opacity-disabled);cursor:not-allowed}.sapphire-icon-button:focus{outline:none}.sapphire-icon-button.is-focus,.sapphire-icon-button:not(.js-focus):focus-visible{outline:var(--sapphire-icon-button-size-focus-ring-border) solid var(--sapphire-icon-button-color-focus-ring);outline-offset:var(--sapphire-icon-button-size-focus-ring-offset)}.sapphire-icon-button--primary-fill{background-color:var(--sapphire-icon-button-color-background-primary-default);color:var(--sapphire-icon-button-color-content-primary-default)}.sapphire-icon-button--primary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--primary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-primary-hover)}.sapphire-icon-button--primary-fill.is-focus,.sapphire-icon-button--primary-fill:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-primary-focus)}.sapphire-icon-button--primary-fill:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--primary-fill:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--primary-fill:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-primary-active)}.sapphire-icon-button--secondary-fill{background-color:var(--sapphire-icon-button-color-background-secondary-default);color:var(--sapphire-icon-button-color-content-secondary-default)}.sapphire-icon-button--secondary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--secondary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-secondary-hover);color:var(--sapphire-icon-button-color-content-secondary-hover)}.sapphire-icon-button--secondary-fill.is-focus,.sapphire-icon-button--secondary-fill:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-secondary-focus)}.sapphire-icon-button--secondary-fill:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--secondary-fill:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--secondary-fill:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-secondary-active);color:var(--sapphire-icon-button-color-content-secondary-active)}.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-secondary-surface-secondary-default)}.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-secondary-surface-secondary-hover)}.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-secondary-surface-secondary-focus)}.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-secondary-surface-secondary-active)}.sapphire-icon-button--secondary-ghost{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-default);color:var(--sapphire-icon-button-color-content-secondary-default)}.sapphire-icon-button--secondary-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--secondary-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-hover);color:var(--sapphire-icon-button-color-content-secondary-hover)}.sapphire-icon-button--secondary-ghost.is-focus,.sapphire-icon-button--secondary-ghost:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-focus)}.sapphire-icon-button--secondary-ghost:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--secondary-ghost:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--secondary-ghost:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-active);color:var(--sapphire-icon-button-color-content-secondary-active)}.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-surface-secondary-default)}.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-surface-secondary-hover)}.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-surface-secondary-focus)}.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-surface-secondary-active)}.sapphire-icon-button--tertiary-fill{background-color:var(--sapphire-icon-button-color-background-tertiary-default);color:var(--sapphire-icon-button-color-content-tertiary-default)}.sapphire-icon-button--tertiary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--tertiary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-tertiary-hover);color:var(--sapphire-icon-button-color-content-tertiary-hover)}.sapphire-icon-button--tertiary-fill.is-focus,.sapphire-icon-button--tertiary-fill:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-tertiary-focus)}.sapphire-icon-button--tertiary-fill:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--tertiary-fill:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--tertiary-fill:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-tertiary-active);color:var(--sapphire-icon-button-color-content-tertiary-active)}.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-tertiary-surface-secondary-default)}.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-tertiary-surface-secondary-hover)}.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-tertiary-surface-secondary-focus)}.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-tertiary-surface-secondary-active)}.sapphire-icon-button--tertiary-ghost{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-default);color:var(--sapphire-icon-button-color-content-tertiary-default)}.sapphire-icon-button--tertiary-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--tertiary-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-hover);color:var(--sapphire-icon-button-color-content-tertiary-hover)}.sapphire-icon-button--tertiary-ghost.is-focus,.sapphire-icon-button--tertiary-ghost:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-focus)}.sapphire-icon-button--tertiary-ghost:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--tertiary-ghost:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--tertiary-ghost:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-active);color:var(--sapphire-icon-button-color-content-tertiary-active)}.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-surface-secondary-default)}.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-surface-secondary-hover)}.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-surface-secondary-focus)}.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-surface-secondary-active)}.sapphire-icon-button--danger-fill{background-color:var(--sapphire-icon-button-color-background-danger-default);color:var(--sapphire-icon-button-color-content-danger-default)}.sapphire-icon-button--danger-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--danger-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-danger-hover);color:var(--sapphire-icon-button-color-content-danger-hover)}.sapphire-icon-button--danger-fill.is-focus,.sapphire-icon-button--danger-fill:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-danger-focus)}.sapphire-icon-button--danger-fill:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--danger-fill:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--danger-fill:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-danger-active);color:var(--sapphire-icon-button-color-content-danger-active)}.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-danger-surface-secondary-default)}.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-danger-surface-secondary-hover)}.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-danger-surface-secondary-focus)}.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-danger-surface-secondary-active)}.sapphire-icon-button--danger-ghost{background-color:var(--sapphire-icon-button-color-background-danger-ghost-default);color:var(--sapphire-icon-button-color-content-danger-default)}.sapphire-icon-button--danger-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--danger-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-danger-ghost-hover);color:var(--sapphire-icon-button-color-content-danger-hover)}.sapphire-icon-button--danger-ghost.is-focus,.sapphire-icon-button--danger-ghost:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-danger-ghost-focus)}.sapphire-icon-button--danger-ghost:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--danger-ghost:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--danger-ghost:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-danger-ghost-active);color:var(--sapphire-icon-button-color-content-danger-active)}.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-danger-ghost-surface-secondary-default)}.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-danger-ghost-surface-secondary-hover)}.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-danger-ghost-surface-secondary-focus)}.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-danger-ghost-surface-secondary-active)}.sapphire-icon-button__icon{display:flex;flex-direction:column;justify-content:center;align-items:center;height:var(--sapphire-icon-button-size-icon-m);width:var(--sapphire-icon-button-size-icon-m)}.sapphire-icon-button--large .sapphire-icon-button__icon{height:var(--sapphire-icon-button-size-icon-l);width:var(--sapphire-icon-button-size-icon-l)}.sapphire-icon-button--small .sapphire-icon-button__icon{height:var(--sapphire-icon-button-size-icon-s);width:var(--sapphire-icon-button-size-icon-s)}.sapphire-icon-button--extra-small .sapphire-icon-button__icon{height:var(--sapphire-icon-button-size-icon-xs);width:var(--sapphire-icon-button-size-icon-xs)}.sapphire-icon-button--large{height:var(--sapphire-icon-button-size-height-l);width:var(--sapphire-icon-button-size-width-l);border-radius:var(--sapphire-icon-button-size-radius-l)}.sapphire-icon-button--small{height:var(--sapphire-icon-button-size-height-s);width:var(--sapphire-icon-button-size-width-s);border-radius:var(--sapphire-icon-button-size-radius-s)}.sapphire-icon-button--extra-small{height:var(--sapphire-icon-button-size-height-xs);width:var(--sapphire-icon-button-size-width-xs);border-radius:var(--sapphire-icon-button-size-radius-xs)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
57
57
|
__decorate([
|
|
58
58
|
CoerceBoolean
|
|
59
59
|
], IconButtonComponent.prototype, "disabled", void 0);
|
|
@@ -72,7 +72,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
72
72
|
'[class.sapphire-icon-button--small]': 'size === "small"',
|
|
73
73
|
'[class.sapphire-icon-button--extra-small]': 'size === "extraSmall"',
|
|
74
74
|
'[class.sapphire-icon-button--secondary-surface]': 'surface === "secondary"',
|
|
75
|
-
}, hostDirectives: [UseComponentStylesOnHost], template: "<span class=\"sapphire-icon-button__icon\">\n <ng-content></ng-content>\n</span>\n", styles: [".sapphire-icon-button{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;white-space:nowrap;margin:0;padding:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;height:var(--sapphire-icon-button-size-height-m);width:var(--sapphire-icon-button-size-width-m);flex-shrink:0;border-radius:var(--sapphire-icon-button-size-radius-m);border-style:solid;border-width:0;border-color:transparent;transition-property:opacity,background-color,color;transition-duration:var(--sapphire-icon-button-time-transition);transition-timing-function:ease-in-out;cursor:pointer}a.sapphire-icon-button{text-decoration:none}.sapphire-icon-button:disabled,.sapphire-icon-button.is-disabled{opacity:var(--sapphire-icon-button-opacity-disabled);cursor:not-allowed}.sapphire-icon-button:focus{outline:none}.sapphire-icon-button.is-focus,.sapphire-icon-button:not(.js-focus):focus-visible{outline:var(--sapphire-icon-button-size-focus-ring-border) solid var(--sapphire-icon-button-color-focus-ring);outline-offset:var(--sapphire-icon-button-size-focus-ring-offset)}.sapphire-icon-button--primary-fill{background-color:var(--sapphire-icon-button-color-background-primary-default);color:var(--sapphire-icon-button-color-content-primary-default)}.sapphire-icon-button--primary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--primary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-primary-hover)}.sapphire-icon-button--primary-fill.is-focus,.sapphire-icon-button--primary-fill:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-primary-focus)}.sapphire-icon-button--primary-fill:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--primary-fill:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--primary-fill:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-primary-active)}.sapphire-icon-button--secondary-fill{background-color:var(--sapphire-icon-button-color-background-secondary-default);color:var(--sapphire-icon-button-color-content-secondary-default)}.sapphire-icon-button--secondary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--secondary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-secondary-hover);color:var(--sapphire-icon-button-color-content-secondary-hover)}.sapphire-icon-button--secondary-fill.is-focus,.sapphire-icon-button--secondary-fill:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-secondary-focus)}.sapphire-icon-button--secondary-fill:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--secondary-fill:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--secondary-fill:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-secondary-active);color:var(--sapphire-icon-button-color-content-secondary-active)}.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-secondary-surface-secondary-default)}.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-secondary-surface-secondary-hover)}.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-secondary-surface-secondary-focus)}.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-secondary-surface-secondary-active)}.sapphire-icon-button--secondary-ghost{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-default);color:var(--sapphire-icon-button-color-content-secondary-default)}.sapphire-icon-button--secondary-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--secondary-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-hover);color:var(--sapphire-icon-button-color-content-secondary-hover)}.sapphire-icon-button--secondary-ghost.is-focus,.sapphire-icon-button--secondary-ghost:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-focus)}.sapphire-icon-button--secondary-ghost:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--secondary-ghost:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--secondary-ghost:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-active);color:var(--sapphire-icon-button-color-content-secondary-active)}.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-surface-secondary-default)}.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-surface-secondary-hover)}.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-surface-secondary-focus)}.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-surface-secondary-active)}.sapphire-icon-button--tertiary-fill{background-color:var(--sapphire-icon-button-color-background-tertiary-default);color:var(--sapphire-icon-button-color-content-tertiary-default)}.sapphire-icon-button--tertiary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--tertiary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-tertiary-hover);color:var(--sapphire-icon-button-color-content-tertiary-hover)}.sapphire-icon-button--tertiary-fill.is-focus,.sapphire-icon-button--tertiary-fill:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-tertiary-focus)}.sapphire-icon-button--tertiary-fill:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--tertiary-fill:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--tertiary-fill:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-tertiary-active);color:var(--sapphire-icon-button-color-content-tertiary-active)}.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-tertiary-surface-secondary-default)}.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-tertiary-surface-secondary-hover)}.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-tertiary-surface-secondary-focus)}.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-tertiary-surface-secondary-active)}.sapphire-icon-button--tertiary-ghost{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-default);color:var(--sapphire-icon-button-color-content-tertiary-default)}.sapphire-icon-button--tertiary-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--tertiary-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-hover);color:var(--sapphire-icon-button-color-content-tertiary-hover)}.sapphire-icon-button--tertiary-ghost.is-focus,.sapphire-icon-button--tertiary-ghost:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-focus)}.sapphire-icon-button--tertiary-ghost:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--tertiary-ghost:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--tertiary-ghost:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-active);color:var(--sapphire-icon-button-color-content-tertiary-active)}.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-surface-secondary-default)}.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-surface-secondary-hover)}.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-surface-secondary-focus)}.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-surface-secondary-active)}.sapphire-icon-button--danger-fill{background-color:var(--sapphire-icon-button-color-background-danger-default);color:var(--sapphire-icon-button-color-content-danger-default)}.sapphire-icon-button--danger-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--danger-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-danger-hover);color:var(--sapphire-icon-button-color-content-danger-hover)}.sapphire-icon-button--danger-fill.is-focus,.sapphire-icon-button--danger-fill:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-danger-focus)}.sapphire-icon-button--danger-fill:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--danger-fill:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--danger-fill:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-danger-active);color:var(--sapphire-icon-button-color-content-danger-active)}.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-danger-surface-secondary-default)}.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-danger-surface-secondary-hover)}.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-danger-surface-secondary-focus)}.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-danger-surface-secondary-active)}.sapphire-icon-button--danger-ghost{background-color:var(--sapphire-icon-button-color-background-danger-ghost-default);color:var(--sapphire-icon-button-color-content-danger-default)}.sapphire-icon-button--danger-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--danger-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-danger-ghost-hover);color:var(--sapphire-icon-button-color-content-danger-hover)}.sapphire-icon-button--danger-ghost.is-focus,.sapphire-icon-button--danger-ghost:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-danger-ghost-focus)}.sapphire-icon-button--danger-ghost:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--danger-ghost:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--danger-ghost:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-danger-ghost-active);color:var(--sapphire-icon-button-color-content-danger-active)}.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-danger-ghost-surface-secondary-default)}.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-danger-ghost-surface-secondary-hover)}.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-danger-ghost-surface-secondary-focus)}.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-button-color-background-danger-ghost-surface-secondary-active)}.sapphire-icon-button__icon{display:flex;flex-direction:column;justify-content:center;align-items:center;height:var(--sapphire-icon-button-size-icon-m);width:var(--sapphire-icon-button-size-icon-m)}.sapphire-icon-button--large .sapphire-icon-button__icon{height:var(--sapphire-icon-button-size-icon-l);width:var(--sapphire-icon-button-size-icon-l)}.sapphire-icon-button--small .sapphire-icon-button__icon{height:var(--sapphire-icon-button-size-icon-s);width:var(--sapphire-icon-button-size-icon-s)}.sapphire-icon-button--extra-small .sapphire-icon-button__icon{height:var(--sapphire-icon-button-size-icon-xs);width:var(--sapphire-icon-button-size-icon-xs)}.sapphire-icon-button--large{height:var(--sapphire-icon-button-size-height-l);width:var(--sapphire-icon-button-size-width-l);border-radius:var(--sapphire-icon-button-size-radius-l)}.sapphire-icon-button--small{height:var(--sapphire-icon-button-size-height-s);width:var(--sapphire-icon-button-size-width-s);border-radius:var(--sapphire-icon-button-size-radius-s)}.sapphire-icon-button--extra-small{height:var(--sapphire-icon-button-size-height-xs);width:var(--sapphire-icon-button-size-width-xs);border-radius:var(--sapphire-icon-button-size-radius-xs)}\n"] }]
|
|
75
|
+
}, hostDirectives: [UseComponentStylesOnHost], template: "<span class=\"sapphire-icon-button__icon\">\n <ng-content></ng-content>\n</span>\n", styles: [".sapphire-icon-button{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;white-space:nowrap;margin:0;padding:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;height:var(--sapphire-icon-button-size-height-m);width:var(--sapphire-icon-button-size-width-m);flex-shrink:0;border-radius:var(--sapphire-icon-button-size-radius-m);border-style:solid;border-width:0;border-color:transparent;transition-property:opacity,background-color,color;transition-duration:var(--sapphire-icon-button-time-transition);transition-timing-function:ease-in-out;cursor:pointer}a.sapphire-icon-button{text-decoration:none}.sapphire-icon-button:disabled,.sapphire-icon-button.is-disabled{opacity:var(--sapphire-icon-button-opacity-disabled);cursor:not-allowed}.sapphire-icon-button:focus{outline:none}.sapphire-icon-button.is-focus,.sapphire-icon-button:not(.js-focus):focus-visible{outline:var(--sapphire-icon-button-size-focus-ring-border) solid var(--sapphire-icon-button-color-focus-ring);outline-offset:var(--sapphire-icon-button-size-focus-ring-offset)}.sapphire-icon-button--primary-fill{background-color:var(--sapphire-icon-button-color-background-primary-default);color:var(--sapphire-icon-button-color-content-primary-default)}.sapphire-icon-button--primary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--primary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-primary-hover)}.sapphire-icon-button--primary-fill.is-focus,.sapphire-icon-button--primary-fill:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-primary-focus)}.sapphire-icon-button--primary-fill:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--primary-fill:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--primary-fill:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-primary-active)}.sapphire-icon-button--secondary-fill{background-color:var(--sapphire-icon-button-color-background-secondary-default);color:var(--sapphire-icon-button-color-content-secondary-default)}.sapphire-icon-button--secondary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--secondary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-secondary-hover);color:var(--sapphire-icon-button-color-content-secondary-hover)}.sapphire-icon-button--secondary-fill.is-focus,.sapphire-icon-button--secondary-fill:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-secondary-focus)}.sapphire-icon-button--secondary-fill:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--secondary-fill:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--secondary-fill:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-secondary-active);color:var(--sapphire-icon-button-color-content-secondary-active)}.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-secondary-surface-secondary-default)}.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-secondary-surface-secondary-hover)}.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-secondary-surface-secondary-focus)}.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--secondary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-secondary-surface-secondary-active)}.sapphire-icon-button--secondary-ghost{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-default);color:var(--sapphire-icon-button-color-content-secondary-default)}.sapphire-icon-button--secondary-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--secondary-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-hover);color:var(--sapphire-icon-button-color-content-secondary-hover)}.sapphire-icon-button--secondary-ghost.is-focus,.sapphire-icon-button--secondary-ghost:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-focus)}.sapphire-icon-button--secondary-ghost:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--secondary-ghost:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--secondary-ghost:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-active);color:var(--sapphire-icon-button-color-content-secondary-active)}.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-surface-secondary-default)}.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-surface-secondary-hover)}.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-surface-secondary-focus)}.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--secondary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-secondary-ghost-surface-secondary-active)}.sapphire-icon-button--tertiary-fill{background-color:var(--sapphire-icon-button-color-background-tertiary-default);color:var(--sapphire-icon-button-color-content-tertiary-default)}.sapphire-icon-button--tertiary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--tertiary-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-tertiary-hover);color:var(--sapphire-icon-button-color-content-tertiary-hover)}.sapphire-icon-button--tertiary-fill.is-focus,.sapphire-icon-button--tertiary-fill:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-tertiary-focus)}.sapphire-icon-button--tertiary-fill:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--tertiary-fill:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--tertiary-fill:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-tertiary-active);color:var(--sapphire-icon-button-color-content-tertiary-active)}.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-tertiary-surface-secondary-default)}.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-tertiary-surface-secondary-hover)}.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-tertiary-surface-secondary-focus)}.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--tertiary-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-tertiary-surface-secondary-active)}.sapphire-icon-button--tertiary-ghost{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-default);color:var(--sapphire-icon-button-color-content-tertiary-default)}.sapphire-icon-button--tertiary-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--tertiary-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-hover);color:var(--sapphire-icon-button-color-content-tertiary-hover)}.sapphire-icon-button--tertiary-ghost.is-focus,.sapphire-icon-button--tertiary-ghost:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-focus)}.sapphire-icon-button--tertiary-ghost:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--tertiary-ghost:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--tertiary-ghost:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-active);color:var(--sapphire-icon-button-color-content-tertiary-active)}.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-surface-secondary-default)}.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-surface-secondary-hover)}.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-surface-secondary-focus)}.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--tertiary-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-tertiary-ghost-surface-secondary-active)}.sapphire-icon-button--danger-fill{background-color:var(--sapphire-icon-button-color-background-danger-default);color:var(--sapphire-icon-button-color-content-danger-default)}.sapphire-icon-button--danger-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--danger-fill:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-danger-hover);color:var(--sapphire-icon-button-color-content-danger-hover)}.sapphire-icon-button--danger-fill.is-focus,.sapphire-icon-button--danger-fill:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-danger-focus)}.sapphire-icon-button--danger-fill:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--danger-fill:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--danger-fill:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-danger-active);color:var(--sapphire-icon-button-color-content-danger-active)}.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-danger-surface-secondary-default)}.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-danger-surface-secondary-hover)}.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-danger-surface-secondary-focus)}.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--danger-fill.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-danger-surface-secondary-active)}.sapphire-icon-button--danger-ghost{background-color:var(--sapphire-icon-button-color-background-danger-ghost-default);color:var(--sapphire-icon-button-color-content-danger-default)}.sapphire-icon-button--danger-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--danger-ghost:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-danger-ghost-hover);color:var(--sapphire-icon-button-color-content-danger-hover)}.sapphire-icon-button--danger-ghost.is-focus,.sapphire-icon-button--danger-ghost:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-danger-ghost-focus)}.sapphire-icon-button--danger-ghost:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--danger-ghost:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--danger-ghost:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-danger-ghost-active);color:var(--sapphire-icon-button-color-content-danger-active)}.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface{background-color:var(--sapphire-icon-button-color-background-danger-ghost-surface-secondary-default)}.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active):not(.js-hover):hover,.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):not(:active):not(.is-active).is-hover{background-color:var(--sapphire-icon-button-color-background-danger-ghost-surface-secondary-hover)}.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface.is-focus,.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(.js-focus):focus-visible{background-color:var(--sapphire-icon-button-color-background-danger-ghost-surface-secondary-focus)}.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled).is-active,.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):active,.sapphire-icon-button--danger-ghost.sapphire-icon-button--secondary-surface:not(:disabled):not(.is-disabled):focus-visible:active{background-color:var(--sapphire-icon-button-color-background-danger-ghost-surface-secondary-active)}.sapphire-icon-button__icon{display:flex;flex-direction:column;justify-content:center;align-items:center;height:var(--sapphire-icon-button-size-icon-m);width:var(--sapphire-icon-button-size-icon-m)}.sapphire-icon-button--large .sapphire-icon-button__icon{height:var(--sapphire-icon-button-size-icon-l);width:var(--sapphire-icon-button-size-icon-l)}.sapphire-icon-button--small .sapphire-icon-button__icon{height:var(--sapphire-icon-button-size-icon-s);width:var(--sapphire-icon-button-size-icon-s)}.sapphire-icon-button--extra-small .sapphire-icon-button__icon{height:var(--sapphire-icon-button-size-icon-xs);width:var(--sapphire-icon-button-size-icon-xs)}.sapphire-icon-button--large{height:var(--sapphire-icon-button-size-height-l);width:var(--sapphire-icon-button-size-width-l);border-radius:var(--sapphire-icon-button-size-radius-l)}.sapphire-icon-button--small{height:var(--sapphire-icon-button-size-height-s);width:var(--sapphire-icon-button-size-width-s);border-radius:var(--sapphire-icon-button-size-radius-s)}.sapphire-icon-button--extra-small{height:var(--sapphire-icon-button-size-height-xs);width:var(--sapphire-icon-button-size-width-xs);border-radius:var(--sapphire-icon-button-size-radius-xs)}\n"] }]
|
|
76
76
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { variant: [{
|
|
77
77
|
type: Input
|
|
78
78
|
}], appearance: [{
|