@covalent/components 8.14.0 → 8.14.1
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.
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { PropertyValues } from 'lit';
|
|
1
2
|
import { IconButtonToggle } from '@material/mwc-icon-button-toggle/mwc-icon-button-toggle';
|
|
2
3
|
declare global {
|
|
3
4
|
interface HTMLElementTagNameMap {
|
|
@@ -5,7 +6,13 @@ declare global {
|
|
|
5
6
|
}
|
|
6
7
|
}
|
|
7
8
|
export declare class CovalentIconButtonToggle extends IconButtonToggle {
|
|
9
|
+
/**
|
|
10
|
+
* Angular doesn't allow properties that begin with 'on' to be set due to security reasons.
|
|
11
|
+
* This is an alias for the 'on' property in mwc-icon-button-toggle, which can be used to toggle the button on/off.
|
|
12
|
+
*/
|
|
13
|
+
toggledOn: boolean;
|
|
8
14
|
static styles: import("lit").CSSResult[];
|
|
15
|
+
protected update(changedProperties: PropertyValues): void;
|
|
9
16
|
protected renderRipple(): "" | import("lit-html").TemplateResult<1>;
|
|
10
17
|
}
|
|
11
18
|
export default CovalentIconButtonToggle;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon-button-toggle.d.ts","sourceRoot":"","sources":["../../../../libs/components/src/icon-button-toggle/icon-button-toggle.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"icon-button-toggle.d.ts","sourceRoot":"","sources":["../../../../libs/components/src/icon-button-toggle/icon-button-toggle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,cAAc,EAAa,MAAM,KAAK,CAAC;AAE3D,OAAO,EAAE,gBAAgB,EAAE,MAAM,yDAAyD,CAAC;AAG3F,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,uBAAuB,EAAE,wBAAwB,CAAC;KACnD;CACF;AAED,qBACa,wBAAyB,SAAQ,gBAAgB;IAC5D;;;OAGG;IAEH,SAAS,UAAS;IAElB,OAAgB,MAAM,4BAKpB;IAEF,SAAS,CAAC,MAAM,CAAC,iBAAiB,EAAE,cAAc;IAUlD,SAAS,CAAC,YAAY;CAUvB;AAED,eAAe,wBAAwB,CAAC"}
|
package/icon-button-toggle.js
CHANGED
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("./query-assigned-elements-f623705d.js"),
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("./query-assigned-elements-f623705d.js"),r=require("./property-57f6f6fe.js"),t=require("./tslib.es6-98719205.js"),b=require("./ripple-handlers-5d5b21db.js"),g=require("./aria-property-849c8816.js"),f=require("./state-0974a8e5.js"),m=require("./event-options-3f5eb195.js"),_=require("./query-680f1868.js"),v=require("./class-map-b5efe8da.js"),u=require("./if-defined-f1c45245.js");require("./base-element-58a3f9ea.js");require("./utils-a8190a39.js");require("./style-map-88d2563f.js");/**
|
|
2
2
|
* @license
|
|
3
3
|
* Copyright 2021 Google LLC
|
|
4
4
|
* SPDX-LIcense-Identifier: Apache-2.0
|
|
5
|
-
*/const
|
|
5
|
+
*/const x=c.i`.material-icons{font-family:var(--mdc-icon-font, "Material Icons");font-weight:normal;font-style:normal;font-size:var(--mdc-icon-size, 24px);line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:"liga"}.mdc-icon-button{font-size:24px;width:48px;height:48px;padding:12px}.mdc-icon-button .mdc-icon-button__focus-ring{display:none}.mdc-icon-button.mdc-ripple-upgraded--background-focused .mdc-icon-button__focus-ring,.mdc-icon-button:not(.mdc-ripple-upgraded):focus .mdc-icon-button__focus-ring{display:block;max-height:48px;max-width:48px}@media screen and (forced-colors: active){.mdc-icon-button.mdc-ripple-upgraded--background-focused .mdc-icon-button__focus-ring,.mdc-icon-button:not(.mdc-ripple-upgraded):focus .mdc-icon-button__focus-ring{pointer-events:none;border:2px solid transparent;border-radius:6px;box-sizing:content-box;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:100%;width:100%}}@media screen and (forced-colors: active)and (forced-colors: active){.mdc-icon-button.mdc-ripple-upgraded--background-focused .mdc-icon-button__focus-ring,.mdc-icon-button:not(.mdc-ripple-upgraded):focus .mdc-icon-button__focus-ring{border-color:CanvasText}}@media screen and (forced-colors: active){.mdc-icon-button.mdc-ripple-upgraded--background-focused .mdc-icon-button__focus-ring::after,.mdc-icon-button:not(.mdc-ripple-upgraded):focus .mdc-icon-button__focus-ring::after{content:"";border:2px solid transparent;border-radius:8px;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(100% + 4px);width:calc(100% + 4px)}}@media screen and (forced-colors: active)and (forced-colors: active){.mdc-icon-button.mdc-ripple-upgraded--background-focused .mdc-icon-button__focus-ring::after,.mdc-icon-button:not(.mdc-ripple-upgraded):focus .mdc-icon-button__focus-ring::after{border-color:CanvasText}}.mdc-icon-button.mdc-icon-button--reduced-size .mdc-icon-button__ripple{width:40px;height:40px;margin-top:4px;margin-bottom:4px;margin-right:4px;margin-left:4px}.mdc-icon-button.mdc-icon-button--reduced-size.mdc-ripple-upgraded--background-focused .mdc-icon-button__focus-ring,.mdc-icon-button.mdc-icon-button--reduced-size:not(.mdc-ripple-upgraded):focus .mdc-icon-button__focus-ring{max-height:40px;max-width:40px}.mdc-icon-button .mdc-icon-button__touch{position:absolute;top:50%;height:48px;left:50%;width:48px;transform:translate(-50%, -50%)}.mdc-icon-button:disabled{color:rgba(0, 0, 0, 0.38);color:var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38))}.mdc-icon-button svg,.mdc-icon-button img{width:24px;height:24px}.mdc-icon-button{display:inline-block;position:relative;box-sizing:border-box;border:none;outline:none;background-color:transparent;fill:currentColor;color:inherit;text-decoration:none;cursor:pointer;user-select:none;z-index:0;overflow:visible}.mdc-icon-button .mdc-icon-button__touch{position:absolute;top:50%;height:48px;left:50%;width:48px;transform:translate(-50%, -50%)}.mdc-icon-button:disabled{cursor:default;pointer-events:none}.mdc-icon-button--display-flex{align-items:center;display:inline-flex;justify-content:center}.mdc-icon-button__icon{display:inline-block}.mdc-icon-button__icon.mdc-icon-button__icon--on{display:none}.mdc-icon-button--on .mdc-icon-button__icon{display:none}.mdc-icon-button--on .mdc-icon-button__icon.mdc-icon-button__icon--on{display:inline-block}.mdc-icon-button__link{height:100%;left:0;outline:none;position:absolute;top:0;width:100%}.mdc-icon-button{display:inline-block;position:relative;box-sizing:border-box;border:none;outline:none;background-color:transparent;fill:currentColor;color:inherit;text-decoration:none;cursor:pointer;user-select:none;z-index:0;overflow:visible}.mdc-icon-button .mdc-icon-button__touch{position:absolute;top:50%;height:48px;left:50%;width:48px;transform:translate(-50%, -50%)}.mdc-icon-button:disabled{cursor:default;pointer-events:none}.mdc-icon-button--display-flex{align-items:center;display:inline-flex;justify-content:center}.mdc-icon-button__icon{display:inline-block}.mdc-icon-button__icon.mdc-icon-button__icon--on{display:none}.mdc-icon-button--on .mdc-icon-button__icon{display:none}.mdc-icon-button--on .mdc-icon-button__icon.mdc-icon-button__icon--on{display:inline-block}.mdc-icon-button__link{height:100%;left:0;outline:none;position:absolute;top:0;width:100%}:host{display:inline-block;outline:none}:host([disabled]){pointer-events:none}.mdc-icon-button i,.mdc-icon-button svg,.mdc-icon-button img,.mdc-icon-button ::slotted(*){display:block}:host{--mdc-ripple-color: currentcolor;-webkit-tap-highlight-color:transparent}:host,.mdc-icon-button{vertical-align:top}.mdc-icon-button{width:var(--mdc-icon-button-size, 48px);height:var(--mdc-icon-button-size, 48px);padding:calc( (var(--mdc-icon-button-size, 48px) - var(--mdc-icon-size, 24px)) / 2 )}.mdc-icon-button i,.mdc-icon-button svg,.mdc-icon-button img,.mdc-icon-button ::slotted(*){display:block;width:var(--mdc-icon-size, 24px);height:var(--mdc-icon-size, 24px)}`;/**
|
|
6
6
|
* @license
|
|
7
7
|
* Copyright 2019 Google LLC
|
|
8
8
|
* SPDX-License-Identifier: Apache-2.0
|
|
9
|
-
*/class
|
|
9
|
+
*/class e extends c.s{constructor(){super(...arguments),this.disabled=!1,this.onIcon="",this.offIcon="",this.on=!1,this.shouldRenderRipple=!1,this.rippleHandlers=new b.RippleHandlers(()=>(this.shouldRenderRipple=!0,this.ripple))}handleClick(){this.on=!this.on,this.dispatchEvent(new CustomEvent("icon-button-toggle-change",{detail:{isOn:this.on},bubbles:!0}))}click(){this.mdcRoot.focus(),this.mdcRoot.click()}focus(){this.rippleHandlers.startFocus(),this.mdcRoot.focus()}blur(){this.rippleHandlers.endFocus(),this.mdcRoot.blur()}renderRipple(){return this.shouldRenderRipple?c.x`
|
|
10
10
|
<mwc-ripple
|
|
11
11
|
.disabled="${this.disabled}"
|
|
12
12
|
unbounded>
|
|
13
|
-
</mwc-ripple>`:""}render(){const
|
|
14
|
-
class="mdc-icon-button mdc-icon-button--display-flex ${
|
|
13
|
+
</mwc-ripple>`:""}render(){const o={"mdc-icon-button--on":this.on},n=this.ariaLabelOn!==void 0&&this.ariaLabelOff!==void 0,s=n?void 0:this.on,i=n?this.on?this.ariaLabelOn:this.ariaLabelOff:this.ariaLabel;return c.x`<button
|
|
14
|
+
class="mdc-icon-button mdc-icon-button--display-flex ${v.o(o)}"
|
|
15
15
|
aria-pressed="${u.l(s)}"
|
|
16
16
|
aria-label="${u.l(i)}"
|
|
17
17
|
@click="${this.handleClick}"
|
|
@@ -35,16 +35,16 @@
|
|
|
35
35
|
><i class="material-icons">${this.onIcon}</i
|
|
36
36
|
></slot
|
|
37
37
|
></span>
|
|
38
|
-
</button>`}handleRippleMouseDown(
|
|
38
|
+
</button>`}handleRippleMouseDown(o){const n=()=>{window.removeEventListener("mouseup",n),this.handleRippleDeactivate()};window.addEventListener("mouseup",n),this.rippleHandlers.startPress(o)}handleRippleTouchStart(o){this.rippleHandlers.startPress(o)}handleRippleDeactivate(){this.rippleHandlers.endPress()}handleRippleMouseEnter(){this.rippleHandlers.startHover()}handleRippleMouseLeave(){this.rippleHandlers.endHover()}handleRippleFocus(){this.rippleHandlers.startFocus()}handleRippleBlur(){this.rippleHandlers.endFocus()}}t.__decorate([_.i(".mdc-icon-button")],e.prototype,"mdcRoot",void 0);t.__decorate([g.ariaProperty,r.n({type:String,attribute:"aria-label"})],e.prototype,"ariaLabel",void 0);t.__decorate([r.n({type:Boolean,reflect:!0})],e.prototype,"disabled",void 0);t.__decorate([r.n({type:String})],e.prototype,"onIcon",void 0);t.__decorate([r.n({type:String})],e.prototype,"offIcon",void 0);t.__decorate([r.n({type:String})],e.prototype,"ariaLabelOn",void 0);t.__decorate([r.n({type:String})],e.prototype,"ariaLabelOff",void 0);t.__decorate([r.n({type:Boolean,reflect:!0})],e.prototype,"on",void 0);t.__decorate([b.e("mwc-ripple")],e.prototype,"ripple",void 0);t.__decorate([f.t()],e.prototype,"shouldRenderRipple",void 0);t.__decorate([m.e({passive:!0})],e.prototype,"handleRippleMouseDown",null);t.__decorate([m.e({passive:!0})],e.prototype,"handleRippleTouchStart",null);/**
|
|
39
39
|
* @license
|
|
40
40
|
* Copyright 2019 Google LLC
|
|
41
41
|
* SPDX-License-Identifier: Apache-2.0
|
|
42
|
-
*/let
|
|
43
|
-
`;var
|
|
42
|
+
*/let l=class extends e{};l.styles=[x];l=t.__decorate([c.e("mwc-icon-button-toggle")],l);const y=`:host{border-radius:50%;color:var(--cv-theme-on-surface-variant)}:host([disabled]){background-color:transparent}:host([on]){--mdc-ripple-press-opacity: .16;--mdc-ripple-hover-opacity: .12;--mdc-ripple-focus-opacity: .16;background-color:var(--cv-theme-primary-8);color:var(--cv-theme-primary)}:host([on]) .material-icons{font-variation-settings:"FILL" 1}
|
|
43
|
+
`;var w=Object.defineProperty,R=Object.getOwnPropertyDescriptor,h=(d,o,n,s)=>{for(var i=s>1?void 0:s?R(o,n):o,a=d.length-1,p;a>=0;a--)(p=d[a])&&(i=(s?p(o,n,i):p(i))||i);return s&&i&&w(o,n,i),i};exports.CovalentIconButtonToggle=class extends l{constructor(){super(...arguments),this.toggledOn=!1}update(o){o.has("toggledOn")&&this.toggledOn!==this.on&&(this.on=this.toggledOn),o.has("on")&&this.toggledOn!==this.on&&(this.toggledOn=this.on),super.update(o)}renderRipple(){return this.shouldRenderRipple?c.x` <mwc-ripple
|
|
44
44
|
.disabled="${this.disabled}"
|
|
45
|
-
.activated="${this.
|
|
45
|
+
.activated="${this.toggledOn}"
|
|
46
46
|
unbounded
|
|
47
47
|
>
|
|
48
|
-
</mwc-ripple>`:""}};exports.CovalentIconButtonToggle.styles=[...
|
|
49
|
-
${c.r(
|
|
50
|
-
`];exports.CovalentIconButtonToggle=
|
|
48
|
+
</mwc-ripple>`:""}};exports.CovalentIconButtonToggle.styles=[...l.styles,c.i`
|
|
49
|
+
${c.r(y)}
|
|
50
|
+
`];h([r.n({type:Boolean,reflect:!0})],exports.CovalentIconButtonToggle.prototype,"toggledOn",2);exports.CovalentIconButtonToggle=h([c.e("cv-icon-button-toggle")],exports.CovalentIconButtonToggle);const k=exports.CovalentIconButtonToggle;exports.default=k;
|
package/icon-button-toggle.mjs
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import { i as b, s as
|
|
1
|
+
import { i as b, s as _, x as u, e as h, r as v } from "./query-assigned-elements-4a39219d.mjs";
|
|
2
|
+
import { n as r } from "./property-9b6ea53b.mjs";
|
|
2
3
|
import { _ as o } from "./tslib.es6-c4b0f3b1.mjs";
|
|
3
|
-
import { e as
|
|
4
|
-
import { a as
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
9
|
-
import { o as k } from "./class-map-4b94b017.mjs";
|
|
4
|
+
import { e as x, R as y } from "./ripple-handlers-0d9ad7c2.mjs";
|
|
5
|
+
import { a as w } from "./aria-property-fa2717fe.mjs";
|
|
6
|
+
import { t as R } from "./state-b5e865db.mjs";
|
|
7
|
+
import { e as g } from "./event-options-78d6cf94.mjs";
|
|
8
|
+
import { i as k } from "./query-d843aa92.mjs";
|
|
9
|
+
import { o as $ } from "./class-map-4b94b017.mjs";
|
|
10
10
|
import { l as m } from "./if-defined-c367f208.mjs";
|
|
11
11
|
import "./base-element-acf30176.mjs";
|
|
12
12
|
import "./utils-dc65fdc9.mjs";
|
|
@@ -16,15 +16,15 @@ import "./style-map-bc3ed3e0.mjs";
|
|
|
16
16
|
* Copyright 2021 Google LLC
|
|
17
17
|
* SPDX-LIcense-Identifier: Apache-2.0
|
|
18
18
|
*/
|
|
19
|
-
const
|
|
19
|
+
const z = b`.material-icons{font-family:var(--mdc-icon-font, "Material Icons");font-weight:normal;font-style:normal;font-size:var(--mdc-icon-size, 24px);line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:"liga"}.mdc-icon-button{font-size:24px;width:48px;height:48px;padding:12px}.mdc-icon-button .mdc-icon-button__focus-ring{display:none}.mdc-icon-button.mdc-ripple-upgraded--background-focused .mdc-icon-button__focus-ring,.mdc-icon-button:not(.mdc-ripple-upgraded):focus .mdc-icon-button__focus-ring{display:block;max-height:48px;max-width:48px}@media screen and (forced-colors: active){.mdc-icon-button.mdc-ripple-upgraded--background-focused .mdc-icon-button__focus-ring,.mdc-icon-button:not(.mdc-ripple-upgraded):focus .mdc-icon-button__focus-ring{pointer-events:none;border:2px solid transparent;border-radius:6px;box-sizing:content-box;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:100%;width:100%}}@media screen and (forced-colors: active)and (forced-colors: active){.mdc-icon-button.mdc-ripple-upgraded--background-focused .mdc-icon-button__focus-ring,.mdc-icon-button:not(.mdc-ripple-upgraded):focus .mdc-icon-button__focus-ring{border-color:CanvasText}}@media screen and (forced-colors: active){.mdc-icon-button.mdc-ripple-upgraded--background-focused .mdc-icon-button__focus-ring::after,.mdc-icon-button:not(.mdc-ripple-upgraded):focus .mdc-icon-button__focus-ring::after{content:"";border:2px solid transparent;border-radius:8px;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(100% + 4px);width:calc(100% + 4px)}}@media screen and (forced-colors: active)and (forced-colors: active){.mdc-icon-button.mdc-ripple-upgraded--background-focused .mdc-icon-button__focus-ring::after,.mdc-icon-button:not(.mdc-ripple-upgraded):focus .mdc-icon-button__focus-ring::after{border-color:CanvasText}}.mdc-icon-button.mdc-icon-button--reduced-size .mdc-icon-button__ripple{width:40px;height:40px;margin-top:4px;margin-bottom:4px;margin-right:4px;margin-left:4px}.mdc-icon-button.mdc-icon-button--reduced-size.mdc-ripple-upgraded--background-focused .mdc-icon-button__focus-ring,.mdc-icon-button.mdc-icon-button--reduced-size:not(.mdc-ripple-upgraded):focus .mdc-icon-button__focus-ring{max-height:40px;max-width:40px}.mdc-icon-button .mdc-icon-button__touch{position:absolute;top:50%;height:48px;left:50%;width:48px;transform:translate(-50%, -50%)}.mdc-icon-button:disabled{color:rgba(0, 0, 0, 0.38);color:var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38))}.mdc-icon-button svg,.mdc-icon-button img{width:24px;height:24px}.mdc-icon-button{display:inline-block;position:relative;box-sizing:border-box;border:none;outline:none;background-color:transparent;fill:currentColor;color:inherit;text-decoration:none;cursor:pointer;user-select:none;z-index:0;overflow:visible}.mdc-icon-button .mdc-icon-button__touch{position:absolute;top:50%;height:48px;left:50%;width:48px;transform:translate(-50%, -50%)}.mdc-icon-button:disabled{cursor:default;pointer-events:none}.mdc-icon-button--display-flex{align-items:center;display:inline-flex;justify-content:center}.mdc-icon-button__icon{display:inline-block}.mdc-icon-button__icon.mdc-icon-button__icon--on{display:none}.mdc-icon-button--on .mdc-icon-button__icon{display:none}.mdc-icon-button--on .mdc-icon-button__icon.mdc-icon-button__icon--on{display:inline-block}.mdc-icon-button__link{height:100%;left:0;outline:none;position:absolute;top:0;width:100%}.mdc-icon-button{display:inline-block;position:relative;box-sizing:border-box;border:none;outline:none;background-color:transparent;fill:currentColor;color:inherit;text-decoration:none;cursor:pointer;user-select:none;z-index:0;overflow:visible}.mdc-icon-button .mdc-icon-button__touch{position:absolute;top:50%;height:48px;left:50%;width:48px;transform:translate(-50%, -50%)}.mdc-icon-button:disabled{cursor:default;pointer-events:none}.mdc-icon-button--display-flex{align-items:center;display:inline-flex;justify-content:center}.mdc-icon-button__icon{display:inline-block}.mdc-icon-button__icon.mdc-icon-button__icon--on{display:none}.mdc-icon-button--on .mdc-icon-button__icon{display:none}.mdc-icon-button--on .mdc-icon-button__icon.mdc-icon-button__icon--on{display:inline-block}.mdc-icon-button__link{height:100%;left:0;outline:none;position:absolute;top:0;width:100%}:host{display:inline-block;outline:none}:host([disabled]){pointer-events:none}.mdc-icon-button i,.mdc-icon-button svg,.mdc-icon-button img,.mdc-icon-button ::slotted(*){display:block}:host{--mdc-ripple-color: currentcolor;-webkit-tap-highlight-color:transparent}:host,.mdc-icon-button{vertical-align:top}.mdc-icon-button{width:var(--mdc-icon-button-size, 48px);height:var(--mdc-icon-button-size, 48px);padding:calc( (var(--mdc-icon-button-size, 48px) - var(--mdc-icon-size, 24px)) / 2 )}.mdc-icon-button i,.mdc-icon-button svg,.mdc-icon-button img,.mdc-icon-button ::slotted(*){display:block;width:var(--mdc-icon-size, 24px);height:var(--mdc-icon-size, 24px)}`;
|
|
20
20
|
/**
|
|
21
21
|
* @license
|
|
22
22
|
* Copyright 2019 Google LLC
|
|
23
23
|
* SPDX-License-Identifier: Apache-2.0
|
|
24
24
|
*/
|
|
25
|
-
class t extends
|
|
25
|
+
class t extends _ {
|
|
26
26
|
constructor() {
|
|
27
|
-
super(...arguments), this.disabled = !1, this.onIcon = "", this.offIcon = "", this.on = !1, this.shouldRenderRipple = !1, this.rippleHandlers = new
|
|
27
|
+
super(...arguments), this.disabled = !1, this.onIcon = "", this.offIcon = "", this.on = !1, this.shouldRenderRipple = !1, this.rippleHandlers = new y(() => (this.shouldRenderRipple = !0, this.ripple));
|
|
28
28
|
}
|
|
29
29
|
handleClick() {
|
|
30
30
|
this.on = !this.on, this.dispatchEvent(new CustomEvent("icon-button-toggle-change", { detail: { isOn: this.on }, bubbles: !0 }));
|
|
@@ -50,10 +50,10 @@ class t extends g {
|
|
|
50
50
|
render() {
|
|
51
51
|
const n = {
|
|
52
52
|
"mdc-icon-button--on": this.on
|
|
53
|
-
}, e = this.ariaLabelOn !== void 0 && this.ariaLabelOff !== void 0,
|
|
53
|
+
}, e = this.ariaLabelOn !== void 0 && this.ariaLabelOff !== void 0, s = e ? void 0 : this.on, i = e ? this.on ? this.ariaLabelOn : this.ariaLabelOff : this.ariaLabel;
|
|
54
54
|
return u`<button
|
|
55
|
-
class="mdc-icon-button mdc-icon-button--display-flex ${
|
|
56
|
-
aria-pressed="${m(
|
|
55
|
+
class="mdc-icon-button mdc-icon-button--display-flex ${$(n)}"
|
|
56
|
+
aria-pressed="${m(s)}"
|
|
57
57
|
aria-label="${m(i)}"
|
|
58
58
|
@click="${this.handleClick}"
|
|
59
59
|
?disabled="${this.disabled}"
|
|
@@ -104,81 +104,90 @@ class t extends g {
|
|
|
104
104
|
}
|
|
105
105
|
}
|
|
106
106
|
o([
|
|
107
|
-
|
|
107
|
+
k(".mdc-icon-button")
|
|
108
108
|
], t.prototype, "mdcRoot", void 0);
|
|
109
109
|
o([
|
|
110
|
-
|
|
111
|
-
|
|
110
|
+
w,
|
|
111
|
+
r({ type: String, attribute: "aria-label" })
|
|
112
112
|
], t.prototype, "ariaLabel", void 0);
|
|
113
113
|
o([
|
|
114
|
-
|
|
114
|
+
r({ type: Boolean, reflect: !0 })
|
|
115
115
|
], t.prototype, "disabled", void 0);
|
|
116
116
|
o([
|
|
117
|
-
|
|
117
|
+
r({ type: String })
|
|
118
118
|
], t.prototype, "onIcon", void 0);
|
|
119
119
|
o([
|
|
120
|
-
|
|
120
|
+
r({ type: String })
|
|
121
121
|
], t.prototype, "offIcon", void 0);
|
|
122
122
|
o([
|
|
123
|
-
|
|
123
|
+
r({ type: String })
|
|
124
124
|
], t.prototype, "ariaLabelOn", void 0);
|
|
125
125
|
o([
|
|
126
|
-
|
|
126
|
+
r({ type: String })
|
|
127
127
|
], t.prototype, "ariaLabelOff", void 0);
|
|
128
128
|
o([
|
|
129
|
-
|
|
129
|
+
r({ type: Boolean, reflect: !0 })
|
|
130
130
|
], t.prototype, "on", void 0);
|
|
131
131
|
o([
|
|
132
|
-
|
|
132
|
+
x("mwc-ripple")
|
|
133
133
|
], t.prototype, "ripple", void 0);
|
|
134
134
|
o([
|
|
135
|
-
|
|
135
|
+
R()
|
|
136
136
|
], t.prototype, "shouldRenderRipple", void 0);
|
|
137
137
|
o([
|
|
138
|
-
|
|
138
|
+
g({ passive: !0 })
|
|
139
139
|
], t.prototype, "handleRippleMouseDown", null);
|
|
140
140
|
o([
|
|
141
|
-
|
|
141
|
+
g({ passive: !0 })
|
|
142
142
|
], t.prototype, "handleRippleTouchStart", null);
|
|
143
143
|
/**
|
|
144
144
|
* @license
|
|
145
145
|
* Copyright 2019 Google LLC
|
|
146
146
|
* SPDX-License-Identifier: Apache-2.0
|
|
147
147
|
*/
|
|
148
|
-
let
|
|
148
|
+
let d = class extends t {
|
|
149
149
|
};
|
|
150
|
-
|
|
151
|
-
|
|
150
|
+
d.styles = [z];
|
|
151
|
+
d = o([
|
|
152
152
|
h("mwc-icon-button-toggle")
|
|
153
|
-
],
|
|
154
|
-
const
|
|
153
|
+
], d);
|
|
154
|
+
const O = `:host{border-radius:50%;color:var(--cv-theme-on-surface-variant)}:host([disabled]){background-color:transparent}:host([on]){--mdc-ripple-press-opacity: .16;--mdc-ripple-hover-opacity: .12;--mdc-ripple-focus-opacity: .16;background-color:var(--cv-theme-primary-8);color:var(--cv-theme-primary)}:host([on]) .material-icons{font-variation-settings:"FILL" 1}
|
|
155
155
|
`;
|
|
156
|
-
var L = Object.defineProperty, I = Object.getOwnPropertyDescriptor,
|
|
157
|
-
for (var i =
|
|
158
|
-
(p =
|
|
159
|
-
return
|
|
156
|
+
var L = Object.defineProperty, I = Object.getOwnPropertyDescriptor, f = (c, n, e, s) => {
|
|
157
|
+
for (var i = s > 1 ? void 0 : s ? I(n, e) : n, a = c.length - 1, p; a >= 0; a--)
|
|
158
|
+
(p = c[a]) && (i = (s ? p(n, e, i) : p(i)) || i);
|
|
159
|
+
return s && i && L(n, e, i), i;
|
|
160
160
|
};
|
|
161
|
-
let
|
|
161
|
+
let l = class extends d {
|
|
162
|
+
constructor() {
|
|
163
|
+
super(...arguments), this.toggledOn = !1;
|
|
164
|
+
}
|
|
165
|
+
update(c) {
|
|
166
|
+
c.has("toggledOn") && this.toggledOn !== this.on && (this.on = this.toggledOn), c.has("on") && this.toggledOn !== this.on && (this.toggledOn = this.on), super.update(c);
|
|
167
|
+
}
|
|
162
168
|
renderRipple() {
|
|
163
169
|
return this.shouldRenderRipple ? u` <mwc-ripple
|
|
164
170
|
.disabled="${this.disabled}"
|
|
165
|
-
.activated="${this.
|
|
171
|
+
.activated="${this.toggledOn}"
|
|
166
172
|
unbounded
|
|
167
173
|
>
|
|
168
174
|
</mwc-ripple>` : "";
|
|
169
175
|
}
|
|
170
176
|
};
|
|
171
|
-
|
|
172
|
-
...
|
|
177
|
+
l.styles = [
|
|
178
|
+
...d.styles,
|
|
173
179
|
b`
|
|
174
|
-
${
|
|
180
|
+
${v(O)}
|
|
175
181
|
`
|
|
176
182
|
];
|
|
177
|
-
|
|
183
|
+
f([
|
|
184
|
+
r({ type: Boolean, reflect: !0 })
|
|
185
|
+
], l.prototype, "toggledOn", 2);
|
|
186
|
+
l = f([
|
|
178
187
|
h("cv-icon-button-toggle")
|
|
179
|
-
],
|
|
180
|
-
const q =
|
|
188
|
+
], l);
|
|
189
|
+
const q = l;
|
|
181
190
|
export {
|
|
182
|
-
|
|
191
|
+
l as CovalentIconButtonToggle,
|
|
183
192
|
q as default
|
|
184
193
|
};
|