@covalent/components 8.13.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.
- package/icon-button-toggle/icon-button-toggle.d.ts +7 -0
- package/icon-button-toggle/icon-button-toggle.d.ts.map +1 -1
- package/icon-button-toggle.js +12 -12
- package/icon-button-toggle.mjs +54 -45
- package/index.d.ts +1 -0
- package/index.d.ts.map +1 -1
- package/index.js +1 -1
- package/index.mjs +38 -36
- package/package.json +6 -1
- package/status-dialog/status-dialog.d.ts +37 -0
- package/status-dialog/status-dialog.d.ts.map +1 -0
- package/status-dialog.js +80 -0
- package/status-dialog.mjs +222 -0
|
@@ -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
|
};
|
package/index.d.ts
CHANGED
|
@@ -33,6 +33,7 @@ export * from './side-sheet/side-sheet';
|
|
|
33
33
|
export * from './slider/slider';
|
|
34
34
|
export * from './slider/slider-range';
|
|
35
35
|
export * from './snackbar/snackbar';
|
|
36
|
+
export * from './status-dialog/status-dialog';
|
|
36
37
|
export * from './status-header/status-header';
|
|
37
38
|
export * from './status-header/status-header-item';
|
|
38
39
|
export * from './switch/switch';
|
package/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../libs/components/src/index.ts"],"names":[],"mappings":"AAAA,cAAc,+BAA+B,CAAC;AAC9C,cAAc,eAAe,CAAC;AAC9B,cAAc,uBAAuB,CAAC;AACtC,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,qBAAqB,CAAC;AACpC,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,uCAAuC,CAAC;AACtD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,mCAAmC,CAAC;AAClD,cAAc,wCAAwC,CAAC;AACvD,cAAc,uBAAuB,CAAC;AACtC,cAAc,aAAa,CAAC;AAC5B,cAAc,2BAA2B,CAAC;AAC1C,cAAc,yCAAyC,CAAC;AACxD,cAAc,mCAAmC,CAAC;AAClD,cAAc,gCAAgC,CAAC;AAC/C,cAAc,mCAAmC,CAAC;AAClD,cAAc,wBAAwB,CAAC;AACvC,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC;AACjC,cAAc,sBAAsB,CAAC;AACrC,cAAc,wBAAwB,CAAC;AACvC,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,yBAAyB,CAAC;AACxC,cAAc,iBAAiB,CAAC;AAChC,cAAc,uBAAuB,CAAC;AACtC,cAAc,qBAAqB,CAAC;AACpC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,oCAAoC,CAAC;AACnD,cAAc,iBAAiB,CAAC;AAChC,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAClC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,iCAAiC,CAAC;AAChD,cAAc,uBAAuB,CAAC;AACtC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,yBAAyB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../libs/components/src/index.ts"],"names":[],"mappings":"AAAA,cAAc,+BAA+B,CAAC;AAC9C,cAAc,eAAe,CAAC;AAC9B,cAAc,uBAAuB,CAAC;AACtC,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,qBAAqB,CAAC;AACpC,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,uCAAuC,CAAC;AACtD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,mCAAmC,CAAC;AAClD,cAAc,wCAAwC,CAAC;AACvD,cAAc,uBAAuB,CAAC;AACtC,cAAc,aAAa,CAAC;AAC5B,cAAc,2BAA2B,CAAC;AAC1C,cAAc,yCAAyC,CAAC;AACxD,cAAc,mCAAmC,CAAC;AAClD,cAAc,gCAAgC,CAAC;AAC/C,cAAc,mCAAmC,CAAC;AAClD,cAAc,wBAAwB,CAAC;AACvC,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC;AACjC,cAAc,sBAAsB,CAAC;AACrC,cAAc,wBAAwB,CAAC;AACvC,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,yBAAyB,CAAC;AACxC,cAAc,iBAAiB,CAAC;AAChC,cAAc,uBAAuB,CAAC;AACtC,cAAc,qBAAqB,CAAC;AACpC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,oCAAoC,CAAC;AACnD,cAAc,iBAAiB,CAAC;AAChC,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAClC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,iCAAiC,CAAC;AAChD,cAAc,uBAAuB,CAAC;AACtC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,yBAAyB,CAAC"}
|
package/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./action-ribbon.js"),t=require("./alert.js"),r=require("./app-shell.js"),n=require("./badge.js"),o=require("./button.js"),a=require("./checkbox.js"),i=require("./card.js"),u=require("./chip-ebd0a88e.js"),l=require("./chip-set.js"),c=require("./circular-progress.js"),b=require("./code-snippet.js"),C=require("./dialog-82b03745.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./action-ribbon.js"),t=require("./alert.js"),r=require("./app-shell.js"),n=require("./badge.js"),o=require("./button.js"),a=require("./checkbox.js"),i=require("./card.js"),u=require("./chip-ebd0a88e.js"),l=require("./chip-set.js"),c=require("./circular-progress.js"),b=require("./code-snippet.js"),C=require("./dialog-82b03745.js"),s=require("./drawer.js"),p=require("./empty-state.js"),v=require("./expansion-panel.js"),d=require("./expansion-panel-item.js"),g=require("./formfield.js"),q=require("./icon.js"),m=require("./icon-button.js"),P=require("./icon-button-toggle.js"),y=require("./icon-check-toggle.js"),f=require("./icon-radio-toggle.js"),j=require("./linear-progress.js"),O=require("./check-list-item.js"),S=require("./list.js"),T=require("./list-item.js"),I=require("./nav-list-item.js"),h=require("./radio-list-item.js"),L=require("./menu.js"),x=require("./radio.js"),B=require("./select.js"),k=require("./side-sheet.js"),R=require("./slider.js"),A=require("./slider-range.js"),D=require("./snackbar.js"),F=require("./status-dialog.js"),w=require("./status-header.js"),E=require("./status-header-item.js"),H=require("./switch.js"),M=require("./tab.js"),N=require("./tab-bar.js"),_=require("./textarea.js"),z=require("./textfield.js"),G=require("./text-lockup.js"),J=require("./toolbar.js"),K=require("./tooltip.js"),Q=require("./top-app-bar.js"),U=require("./top-app-bar-fixed.js"),V=require("./tree-list.js"),W=require("./tree-list-item.js"),X=require("./typography.js");require("./query-assigned-elements-f623705d.js");require("./utils-a8190a39.js");require("./observer-a096ab43.js");require("./foundation-e980aa3d.js");require("./tslib.es6-98719205.js");require("./foundation-e830bd94.js");require("./class-map-b5efe8da.js");require("./property-57f6f6fe.js");require("./query-680f1868.js");require("./mwc-drawer-base-798b11f8.js");require("./inert.esm-2cee6f2e.js");require("./base-element-58a3f9ea.js");require("./mwc-icon-f87639bc.js");require("./ripple-handlers-5d5b21db.js");require("./state-0974a8e5.js");require("./style-map-88d2563f.js");require("./aria-property-849c8816.js");require("./event-options-3f5eb195.js");require("./if-defined-f1c45245.js");require("./mwc-checkbox-base-3d8c9549.js");require("./form-element-c553d6f5.js");require("./mwc-checkbox.css-b3434429.js");require("./keyboard-39125691.js");require("./_commonjsHelpers-2367a3a2.js");require("./query-assigned-nodes-99eae71d.js");require("./mwc-radio-base-913e02e2.js");require("./mwc-radio.css-4e140252.js");require("./mwc-list-item-base-297d86b0.js");require("./list-item-e336fb0e.js");require("./mwc-list-base-400b00e2.js");require("./mwc-menu-base-c75ca473.js");require("./mwc-line-ripple-directive-a6b39a3c.js");require("./mwc-slider.css-c7107d94.js");require("./directive-helpers-0ce1f995.js");require("./mwc-tab-base-f28722aa.js");require("./textfield-11525c88.js");require("./mwc-top-app-bar-base-aec60f27.js");require("./top-app-bar-a531c1b4.js");Object.defineProperty(exports,"CovalentActionRibbon",{enumerable:!0,get:()=>e.CovalentActionRibbon});Object.defineProperty(exports,"CovalentAlert",{enumerable:!0,get:()=>t.CovalentAlert});Object.defineProperty(exports,"CovalentAppShell",{enumerable:!0,get:()=>r.CovalentAppShell});Object.defineProperty(exports,"CovalentBadge",{enumerable:!0,get:()=>n.CovalentBadge});Object.defineProperty(exports,"CovalentButton",{enumerable:!0,get:()=>o.CovalentButton});Object.defineProperty(exports,"CovalentCheckbox",{enumerable:!0,get:()=>a.CovalentCheckbox});Object.defineProperty(exports,"CovalentCard",{enumerable:!0,get:()=>i.CovalentCard});Object.defineProperty(exports,"CovalentChip",{enumerable:!0,get:()=>u.CovalentChip});Object.defineProperty(exports,"CovalentChipSet",{enumerable:!0,get:()=>l.CovalentChipSet});Object.defineProperty(exports,"CovalentCircularProgress",{enumerable:!0,get:()=>c.CovalentCircularProgress});Object.defineProperty(exports,"CovalentCodeSnippet",{enumerable:!0,get:()=>b.CovalentCodeSnippet});Object.defineProperty(exports,"CovalentDialog",{enumerable:!0,get:()=>C.CovalentDialog});Object.defineProperty(exports,"CovalentDrawer",{enumerable:!0,get:()=>s.CovalentDrawer});Object.defineProperty(exports,"CovalentEmptyState",{enumerable:!0,get:()=>p.CovalentEmptyState});Object.defineProperty(exports,"CovalentExpansionPanel",{enumerable:!0,get:()=>v.CovalentExpansionPanel});Object.defineProperty(exports,"CovalentExpansionPanelItem",{enumerable:!0,get:()=>d.CovalentExpansionPanelItem});Object.defineProperty(exports,"CovalentFormfield",{enumerable:!0,get:()=>g.CovalentFormfield});Object.defineProperty(exports,"CovalentIcon",{enumerable:!0,get:()=>q.CovalentIcon});Object.defineProperty(exports,"CovalentIconButton",{enumerable:!0,get:()=>m.CovalentIconButton});Object.defineProperty(exports,"CovalentIconButtonToggle",{enumerable:!0,get:()=>P.CovalentIconButtonToggle});Object.defineProperty(exports,"CovalentIconCheckToggle",{enumerable:!0,get:()=>y.CovalentIconCheckToggle});Object.defineProperty(exports,"CovalentIconRadioToggle",{enumerable:!0,get:()=>f.CovalentIconRadioToggle});Object.defineProperty(exports,"CovalentLinearProgress",{enumerable:!0,get:()=>j.CovalentLinearProgress});Object.defineProperty(exports,"CovalentCheckListItem",{enumerable:!0,get:()=>O.CovalentCheckListItem});Object.defineProperty(exports,"CovalentList",{enumerable:!0,get:()=>S.CovalentList});Object.defineProperty(exports,"CovalentListItem",{enumerable:!0,get:()=>T.CovalentListItem});Object.defineProperty(exports,"CovalentNavRailListItem",{enumerable:!0,get:()=>I.CovalentNavRailListItem});Object.defineProperty(exports,"CovalentRadioListItem",{enumerable:!0,get:()=>h.CovalentRadioListItem});Object.defineProperty(exports,"CovalentMenu",{enumerable:!0,get:()=>L.CovalentMenu});Object.defineProperty(exports,"CovalentRadio",{enumerable:!0,get:()=>x.CovalentRadio});Object.defineProperty(exports,"CovalentSelect",{enumerable:!0,get:()=>B.CovalentSelect});Object.defineProperty(exports,"CovalentSideSheet",{enumerable:!0,get:()=>k.CovalentSideSheet});Object.defineProperty(exports,"CovalentSlider",{enumerable:!0,get:()=>R.CovalentSlider});Object.defineProperty(exports,"CovalentSliderRange",{enumerable:!0,get:()=>A.CovalentSliderRange});Object.defineProperty(exports,"CovalentSnackbar",{enumerable:!0,get:()=>D.CovalentSnackbar});Object.defineProperty(exports,"CovalentStatusDialog",{enumerable:!0,get:()=>F.CovalentStatusDialog});Object.defineProperty(exports,"CovalentStatusHeader",{enumerable:!0,get:()=>w.CovalentStatusHeader});Object.defineProperty(exports,"CovalentStatusHeaderItem",{enumerable:!0,get:()=>E.CovalentStatusHeaderItem});Object.defineProperty(exports,"CovalentSwitch",{enumerable:!0,get:()=>H.CovalentSwitch});Object.defineProperty(exports,"CovalentTab",{enumerable:!0,get:()=>M.CovalentTab});Object.defineProperty(exports,"CovalentTabBar",{enumerable:!0,get:()=>N.CovalentTabBar});Object.defineProperty(exports,"CovalentTextArea",{enumerable:!0,get:()=>_.CovalentTextArea});Object.defineProperty(exports,"CovalentTextField",{enumerable:!0,get:()=>z.CovalentTextField});Object.defineProperty(exports,"CovalentTextLockup",{enumerable:!0,get:()=>G.CovalentTextLockup});Object.defineProperty(exports,"CovalentToolbar",{enumerable:!0,get:()=>J.CovalentToolbar});Object.defineProperty(exports,"CovalentTooltip",{enumerable:!0,get:()=>K.CovalentTooltip});Object.defineProperty(exports,"CovalentTopAppBar",{enumerable:!0,get:()=>Q.CovalentTopAppBar});Object.defineProperty(exports,"CovalentTopAppBarFixed",{enumerable:!0,get:()=>U.CovalentTopAppBarFixed});Object.defineProperty(exports,"CovalentTreeList",{enumerable:!0,get:()=>V.CovalentTreeList});Object.defineProperty(exports,"CovalentTreeListItem",{enumerable:!0,get:()=>W.CovalentTreeListItem});Object.defineProperty(exports,"CovalentTypography",{enumerable:!0,get:()=>X.CovalentTypography});
|
package/index.mjs
CHANGED
|
@@ -16,12 +16,12 @@ import { CovalentExpansionPanel as so } from "./expansion-panel.mjs";
|
|
|
16
16
|
import { CovalentExpansionPanelItem as co } from "./expansion-panel-item.mjs";
|
|
17
17
|
import { CovalentFormfield as go } from "./formfield.mjs";
|
|
18
18
|
import { CovalentIcon as ho } from "./icon.mjs";
|
|
19
|
-
import { CovalentIconButton as
|
|
19
|
+
import { CovalentIconButton as Lo } from "./icon-button.mjs";
|
|
20
20
|
import { CovalentIconButtonToggle as Bo } from "./icon-button-toggle.mjs";
|
|
21
21
|
import { CovalentIconCheckToggle as Ro } from "./icon-check-toggle.mjs";
|
|
22
22
|
import { CovalentIconRadioToggle as Po } from "./icon-radio-toggle.mjs";
|
|
23
|
-
import { CovalentLinearProgress as
|
|
24
|
-
import { CovalentCheckListItem as
|
|
23
|
+
import { CovalentLinearProgress as Do } from "./linear-progress.mjs";
|
|
24
|
+
import { CovalentCheckListItem as Fo } from "./check-list-item.mjs";
|
|
25
25
|
import { CovalentList as Ho } from "./list.mjs";
|
|
26
26
|
import { CovalentListItem as No } from "./list-item.mjs";
|
|
27
27
|
import { CovalentNavRailListItem as qo } from "./nav-list-item.mjs";
|
|
@@ -33,21 +33,22 @@ import { CovalentSideSheet as Xo } from "./side-sheet.mjs";
|
|
|
33
33
|
import { CovalentSlider as Zo } from "./slider.mjs";
|
|
34
34
|
import { CovalentSliderRange as $o } from "./slider-range.mjs";
|
|
35
35
|
import { CovalentSnackbar as tt } from "./snackbar.mjs";
|
|
36
|
-
import {
|
|
37
|
-
import {
|
|
38
|
-
import {
|
|
39
|
-
import {
|
|
40
|
-
import {
|
|
41
|
-
import {
|
|
42
|
-
import {
|
|
43
|
-
import {
|
|
44
|
-
import {
|
|
45
|
-
import {
|
|
46
|
-
import {
|
|
47
|
-
import {
|
|
48
|
-
import {
|
|
49
|
-
import {
|
|
50
|
-
import {
|
|
36
|
+
import { CovalentStatusDialog as et } from "./status-dialog.mjs";
|
|
37
|
+
import { CovalentStatusHeader as mt } from "./status-header.mjs";
|
|
38
|
+
import { CovalentStatusHeaderItem as nt } from "./status-header-item.mjs";
|
|
39
|
+
import { CovalentSwitch as it } from "./switch.mjs";
|
|
40
|
+
import { CovalentTab as xt } from "./tab.mjs";
|
|
41
|
+
import { CovalentTabBar as vt } from "./tab-bar.mjs";
|
|
42
|
+
import { CovalentTextArea as Tt } from "./textarea.mjs";
|
|
43
|
+
import { CovalentTextField as dt } from "./textfield.mjs";
|
|
44
|
+
import { CovalentTextLockup as gt } from "./text-lockup.mjs";
|
|
45
|
+
import { CovalentToolbar as ht } from "./toolbar.mjs";
|
|
46
|
+
import { CovalentTooltip as Lt } from "./tooltip.mjs";
|
|
47
|
+
import { CovalentTopAppBar as Bt } from "./top-app-bar.mjs";
|
|
48
|
+
import { CovalentTopAppBarFixed as Rt } from "./top-app-bar-fixed.mjs";
|
|
49
|
+
import { CovalentTreeList as Pt } from "./tree-list.mjs";
|
|
50
|
+
import { CovalentTreeListItem as Dt } from "./tree-list-item.mjs";
|
|
51
|
+
import { CovalentTypography as Ft } from "./typography.mjs";
|
|
51
52
|
import "./query-assigned-elements-4a39219d.mjs";
|
|
52
53
|
import "./utils-dc65fdc9.mjs";
|
|
53
54
|
import "./observer-be7b92e2.mjs";
|
|
@@ -93,7 +94,7 @@ export {
|
|
|
93
94
|
U as CovalentBadge,
|
|
94
95
|
W as CovalentButton,
|
|
95
96
|
_ as CovalentCard,
|
|
96
|
-
|
|
97
|
+
Fo as CovalentCheckListItem,
|
|
97
98
|
Y as CovalentCheckbox,
|
|
98
99
|
oo as CovalentChip,
|
|
99
100
|
ro as CovalentChipSet,
|
|
@@ -106,11 +107,11 @@ export {
|
|
|
106
107
|
co as CovalentExpansionPanelItem,
|
|
107
108
|
go as CovalentFormfield,
|
|
108
109
|
ho as CovalentIcon,
|
|
109
|
-
|
|
110
|
+
Lo as CovalentIconButton,
|
|
110
111
|
Bo as CovalentIconButtonToggle,
|
|
111
112
|
Ro as CovalentIconCheckToggle,
|
|
112
113
|
Po as CovalentIconRadioToggle,
|
|
113
|
-
|
|
114
|
+
Do as CovalentLinearProgress,
|
|
114
115
|
Ho as CovalentList,
|
|
115
116
|
No as CovalentListItem,
|
|
116
117
|
Ko as CovalentMenu,
|
|
@@ -122,19 +123,20 @@ export {
|
|
|
122
123
|
Zo as CovalentSlider,
|
|
123
124
|
$o as CovalentSliderRange,
|
|
124
125
|
tt as CovalentSnackbar,
|
|
125
|
-
et as
|
|
126
|
-
mt as
|
|
127
|
-
nt as
|
|
128
|
-
it as
|
|
129
|
-
xt as
|
|
130
|
-
vt as
|
|
131
|
-
Tt as
|
|
132
|
-
dt as
|
|
133
|
-
gt as
|
|
134
|
-
ht as
|
|
135
|
-
|
|
136
|
-
Bt as
|
|
137
|
-
Rt as
|
|
138
|
-
Pt as
|
|
139
|
-
|
|
126
|
+
et as CovalentStatusDialog,
|
|
127
|
+
mt as CovalentStatusHeader,
|
|
128
|
+
nt as CovalentStatusHeaderItem,
|
|
129
|
+
it as CovalentSwitch,
|
|
130
|
+
xt as CovalentTab,
|
|
131
|
+
vt as CovalentTabBar,
|
|
132
|
+
Tt as CovalentTextArea,
|
|
133
|
+
dt as CovalentTextField,
|
|
134
|
+
gt as CovalentTextLockup,
|
|
135
|
+
ht as CovalentToolbar,
|
|
136
|
+
Lt as CovalentTooltip,
|
|
137
|
+
Bt as CovalentTopAppBar,
|
|
138
|
+
Rt as CovalentTopAppBarFixed,
|
|
139
|
+
Pt as CovalentTreeList,
|
|
140
|
+
Dt as CovalentTreeListItem,
|
|
141
|
+
Ft as CovalentTypography
|
|
140
142
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@covalent/components",
|
|
3
|
-
"version": "8.
|
|
3
|
+
"version": "8.14.1",
|
|
4
4
|
"description": "a catalog of material components for covalent",
|
|
5
5
|
"main": "./index.js",
|
|
6
6
|
"module": "./index.mjs",
|
|
@@ -191,6 +191,11 @@
|
|
|
191
191
|
"import": "./snackbar.mjs",
|
|
192
192
|
"require": "./snackbar.js"
|
|
193
193
|
},
|
|
194
|
+
"./status-dialog": {
|
|
195
|
+
"types": "./status-dialog.d.ts",
|
|
196
|
+
"import": "./status-dialog.mjs",
|
|
197
|
+
"require": "./status-dialog.js"
|
|
198
|
+
},
|
|
194
199
|
"./status-header": {
|
|
195
200
|
"types": "./status-header.d.ts",
|
|
196
201
|
"import": "./status-header.mjs",
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import CovalentDialog from '../dialog/dialog';
|
|
2
|
+
import '../icon/icon';
|
|
3
|
+
import '../icon-button/icon-button';
|
|
4
|
+
declare global {
|
|
5
|
+
interface HTMLElementTagNameMap {
|
|
6
|
+
'cv-status-dialog': CovalentStatusDialog;
|
|
7
|
+
}
|
|
8
|
+
}
|
|
9
|
+
/**
|
|
10
|
+
* Status Dialog
|
|
11
|
+
*
|
|
12
|
+
* @slot - This element has a slot
|
|
13
|
+
*/
|
|
14
|
+
export declare class CovalentStatusDialog extends CovalentDialog {
|
|
15
|
+
_details?: HTMLSlotElement;
|
|
16
|
+
/**
|
|
17
|
+
* The state representation error|positive|warning
|
|
18
|
+
*/
|
|
19
|
+
state: 'error' | 'positive' | 'warning';
|
|
20
|
+
/**
|
|
21
|
+
* Whether the content details are expanded
|
|
22
|
+
*/
|
|
23
|
+
protected expandDetails: boolean;
|
|
24
|
+
/**
|
|
25
|
+
* Whether the expand details link is shown
|
|
26
|
+
*/
|
|
27
|
+
showDetailsLink: boolean;
|
|
28
|
+
static styles: import("lit").CSSResult[];
|
|
29
|
+
protected firstUpdated(): void;
|
|
30
|
+
toggleDetails(): void;
|
|
31
|
+
private _getStatusIcon;
|
|
32
|
+
renderDetails(): import("lit-html").TemplateResult<1>;
|
|
33
|
+
protected renderHeading(): import("lit-html").TemplateResult<1>;
|
|
34
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
35
|
+
}
|
|
36
|
+
export default CovalentStatusDialog;
|
|
37
|
+
//# sourceMappingURL=status-dialog.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"status-dialog.d.ts","sourceRoot":"","sources":["../../../../libs/components/src/status-dialog/status-dialog.ts"],"names":[],"mappings":"AAKA,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAE9C,OAAO,cAAc,CAAC;AACtB,OAAO,4BAA4B,CAAC;AAEpC,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,kBAAkB,EAAE,oBAAoB,CAAC;KAC1C;CACF;AAED;;;;GAIG;AACH,qBACa,oBAAqB,SAAQ,cAAc;IAEtD,QAAQ,CAAC,EAAE,eAAe,CAAC;IAE3B;;OAEG;IAEH,KAAK,EAAE,OAAO,GAAG,UAAU,GAAG,SAAS,CAAW;IAElD;;OAEG;IAEH,SAAS,CAAC,aAAa,UAAS;IAEhC;;OAEG;IAEH,eAAe,UAAS;IAExB,OAAgB,MAAM,4BAKpB;cAEiB,YAAY,IAAI,IAAI;IAcvC,aAAa;IAIb,OAAO,CAAC,cAAc;IAUtB,aAAa;cA+BM,aAAa;IAqBvB,MAAM;CAuDhB;AAED,eAAe,oBAAoB,CAAC"}
|
package/status-dialog.js
ADDED
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("./query-assigned-elements-f623705d.js"),_=require("./property-57f6f6fe.js"),r=require("./state-0974a8e5.js"),h=require("./query-680f1868.js"),g=require("./dialog-82b03745.js"),o=require("./class-map-b5efe8da.js");require("./icon.js");require("./icon-button.js");require("./tslib.es6-98719205.js");require("./inert.esm-2cee6f2e.js");require("./base-element-58a3f9ea.js");require("./utils-a8190a39.js");require("./observer-a096ab43.js");require("./mwc-icon-f87639bc.js");require("./ripple-handlers-5d5b21db.js");require("./style-map-88d2563f.js");require("./aria-property-849c8816.js");require("./event-options-3f5eb195.js");require("./if-defined-f1c45245.js");/**
|
|
2
|
+
* @license
|
|
3
|
+
* Copyright 2016 Google Inc.
|
|
4
|
+
*
|
|
5
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
* in the Software without restriction, including without limitation the rights
|
|
8
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
* furnished to do so, subject to the following conditions:
|
|
11
|
+
*
|
|
12
|
+
* The above copyright notice and this permission notice shall be included in
|
|
13
|
+
* all copies or substantial portions of the Software.
|
|
14
|
+
*
|
|
15
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
21
|
+
* THE SOFTWARE.
|
|
22
|
+
*/var u={CLOSING:"mdc-dialog--closing",OPEN:"mdc-dialog--open",OPENING:"mdc-dialog--opening",SCROLLABLE:"mdc-dialog--scrollable",SCROLL_LOCK:"mdc-dialog-scroll-lock",STACKED:"mdc-dialog--stacked",FULLSCREEN:"mdc-dialog--fullscreen",SCROLL_DIVIDER_HEADER:"mdc-dialog-scroll-divider-header",SCROLL_DIVIDER_FOOTER:"mdc-dialog-scroll-divider-footer",SURFACE_SCRIM_SHOWN:"mdc-dialog__surface-scrim--shown",SURFACE_SCRIM_SHOWING:"mdc-dialog__surface-scrim--showing",SURFACE_SCRIM_HIDING:"mdc-dialog__surface-scrim--hiding",SCRIM_HIDDEN:"mdc-dialog__scrim--hidden"};const p=`:host{--mdc-dialog-content-ink-color: var(--cv-theme-on-surface-variant);--mdc-dialog-heading-ink-color: var(--cv-theme-on-surface);--mdc-dialog-min-width: 96vw;--mdc-theme-surface: var(--cv-theme-surface-container-lowest);--mdc-typography-body1-font-family: var( --cv-typography-subtitle1-font-family );--mdc-typography-headline6-font-size: var( --cv-typography-headline6-font-size );--mdc-typography-headline6-font-weight: var( --cv-typography-headline1-font-weight )}:host .mdc-dialog.error .status-dialog__state{background-color:var(--cv-theme-negative-8)}:host .mdc-dialog.error .status-dialog__state cv-icon{color:var(--cv-theme-negative)}:host .mdc-dialog.positive .status-dialog__state{background-color:var(--cv-theme-positive-8)}:host .mdc-dialog.positive .status-dialog__state cv-icon{color:var(--cv-theme-positive)}:host .mdc-dialog.warning .status-dialog__state{background-color:var(--cv-theme-caution-8)}:host .mdc-dialog.warning .status-dialog__state cv-icon{color:var(--cv-theme-caution)}:host .mdc-dialog .mdc-dialog__surface{max-width:calc(100vw - 40px)}:host .mdc-dialog .mdc-dialog__content{padding:0 16px}:host .mdc-dialog .mdc-dialog__content.padding-bottom{padding-bottom:2rem}:host .mdc-dialog__actions{flex-shrink:0;padding:16px}:host .mdc-dialog__content{flex-grow:1}:host .mdc-dialog__title{flex:1;line-height:var(--cv-typography-body1-line-height);margin:0;padding:0 40px 0 0}:host .mdc-dialog__title:before{display:none}:host .mdc-dialog.mdc-dialog--scrollable .mdc-dialog__title,:host .mdc-dialog.mdc-dialog--scrollable .mdc-dialog__actions{border:none}.status-dialog__arrow-icon{margin-top:2px}.status-dialog__arrow-icon.open{transform:rotate(0);transition:transform .25s ease-out}.status-dialog__arrow-icon.close{transform:rotate(180deg);transition:transform .25s ease-in}.status-dialog__container{display:flex}.status-dialog__content{display:flex;flex:1;flex-direction:column}.status-dialog__container,.status-dialog__content{max-height:calc(100% - 32px);overflow-y:auto}.status-dialog__details{display:none}.status-dialog__details.visible{display:block}.status-dialog__heading{--mdc-icon-button-size: 40px;align-items:start;box-sizing:border-box;display:inline-flex;justify-content:space-between;padding:18px 16px;width:100%}.status-dialog__heading.no-heading{justify-content:flex-end}.status-dialog__heading .status-dialog__close-icon{position:absolute;right:8px;top:10px}.status-dialog__state{--mdc-icon-size: 32px;padding:14px 16px 0}.status-dialog__state cv-icon{font-variation-settings:"FILL" 1}.status-dialog__toggle-details{align-items:center;color:var(--cv-theme-primary);cursor:pointer;display:inline-flex;font-size:14px;font-style:normal;font-weight:400;letter-spacing:.25px;line-height:20px;padding:16px 0}@media screen and (min-width: 600px){:host{--mdc-dialog-min-width: 575px}:host .mdc-dialog .mdc-dialog__surface{max-width:575px}}@media screen and (max-width: 480px){:host .status-dialog__container{flex-direction:column}:host .status-dialog__heading .status-dialog__close-icon{top:18px}:host .status-dialog__state{padding:4px}:host .status-dialog__state cv-icon{display:none}:host .mdc-dialog.error .status-dialog__state{background-color:var(--cv-theme-negative)}:host .mdc-dialog.positive .status-dialog__state{background-color:var(--cv-theme-positive)}:host .mdc-dialog.warning .status-dialog__state{background-color:var(--cv-theme-caution)}}
|
|
23
|
+
`;var m=Object.defineProperty,v=Object.getOwnPropertyDescriptor,l=(n,t,a,s)=>{for(var e=s>1?void 0:s?v(t,a):t,d=n.length-1,c;d>=0;d--)(c=n[d])&&(e=(s?c(t,a,e):c(e))||e);return s&&e&&m(t,a,e),e};exports.CovalentStatusDialog=class extends g.CovalentDialog$1{constructor(){super(...arguments),this.state="error",this.expandDetails=!1,this.showDetailsLink=!1}firstUpdated(){if(super.firstUpdated(),this._details){const t=this._details.assignedNodes({flatten:!0});this.showDetailsLink=t.some(a=>a.nodeType===Node.ELEMENT_NODE)}}toggleDetails(){this.expandDetails=!this.expandDetails}_getStatusIcon(){switch(this.state){case"positive":return"check";default:return this.state}}renderDetails(){const t={"status-dialog__details":!0,visible:this.expandDetails},a={open:!this.expandDetails,close:this.expandDetails},s=i.x`<cv-icon
|
|
24
|
+
class="${o.o(a)} status-dialog__arrow-icon"
|
|
25
|
+
>arrow_drop_down</cv-icon
|
|
26
|
+
>`;return i.x`${this.showDetailsLink?i.x`<div>
|
|
27
|
+
<span
|
|
28
|
+
class="status-dialog__toggle-details"
|
|
29
|
+
@click="${this.toggleDetails}"
|
|
30
|
+
>${this.expandDetails?"Hide details":"Show details"} ${s}
|
|
31
|
+
</span>
|
|
32
|
+
</div>`:""}
|
|
33
|
+
<slot
|
|
34
|
+
name="details"
|
|
35
|
+
id="details"
|
|
36
|
+
class="${o.o(t)}"
|
|
37
|
+
></slot>`}renderHeading(){const t={"status-dialog__heading":!0,"no-heading":!this.heading};let a=i.x``;return this.heading&&(a=i.x`<h2 id="title" class="mdc-dialog__title">
|
|
38
|
+
${this.heading}
|
|
39
|
+
</h2>`),i.x`<span class="${o.o(t)}">
|
|
40
|
+
${a}
|
|
41
|
+
<cv-icon-button
|
|
42
|
+
class="status-dialog__close-icon"
|
|
43
|
+
icon="close"
|
|
44
|
+
@click=${this.close}
|
|
45
|
+
></cv-icon-button>
|
|
46
|
+
</span>`}render(){const t={[u.STACKED]:this.stacked,error:this.state==="error",positive:this.state==="positive",warning:this.state==="warning"},a=this.renderHeading(),s=this.renderDetails(),e={"mdc-dialog__actions":!this.hideActions},d={"mdc-dialog__content":!0,"padding-bottom":this.hideActions};return i.x` <div
|
|
47
|
+
class="mdc-dialog ${o.o(t)}"
|
|
48
|
+
role="alertdialog"
|
|
49
|
+
aria-modal="true"
|
|
50
|
+
aria-labelledby="title"
|
|
51
|
+
aria-describedby="content"
|
|
52
|
+
>
|
|
53
|
+
<div class="mdc-dialog__container">
|
|
54
|
+
<div class="mdc-dialog__surface">
|
|
55
|
+
<div class="status-dialog__container">
|
|
56
|
+
<div class="status-dialog__state">
|
|
57
|
+
<cv-icon>${this._getStatusIcon()}<cv-icon>
|
|
58
|
+
</div>
|
|
59
|
+
<div class="status-dialog__content">
|
|
60
|
+
${a}
|
|
61
|
+
<div id="content" class="${o.o(d)}">
|
|
62
|
+
<slot id="contentSlot"></slot>
|
|
63
|
+
${s}
|
|
64
|
+
</div>
|
|
65
|
+
<footer id="actions" class="${o.o(e)}">
|
|
66
|
+
<span>
|
|
67
|
+
<slot name="secondaryAction"></slot>
|
|
68
|
+
</span>
|
|
69
|
+
<span>
|
|
70
|
+
<slot name="primaryAction"></slot>
|
|
71
|
+
</span>
|
|
72
|
+
</footer>
|
|
73
|
+
</div>
|
|
74
|
+
</div>
|
|
75
|
+
</div>
|
|
76
|
+
</div>
|
|
77
|
+
<div class="mdc-dialog__scrim"></div>
|
|
78
|
+
</div>`}};exports.CovalentStatusDialog.styles=[g.styles,i.i`
|
|
79
|
+
${i.r(p)}
|
|
80
|
+
`];l([h.i("#details")],exports.CovalentStatusDialog.prototype,"_details",2);l([_.n({type:String})],exports.CovalentStatusDialog.prototype,"state",2);l([r.t()],exports.CovalentStatusDialog.prototype,"expandDetails",2);l([r.t()],exports.CovalentStatusDialog.prototype,"showDetailsLink",2);exports.CovalentStatusDialog=l([i.e("cv-status-dialog")],exports.CovalentStatusDialog);const f=exports.CovalentStatusDialog;exports.default=f;
|
|
@@ -0,0 +1,222 @@
|
|
|
1
|
+
import { i as _, r as m, x as e, e as p } from "./query-assigned-elements-4a39219d.mjs";
|
|
2
|
+
import { n as h } from "./property-9b6ea53b.mjs";
|
|
3
|
+
import { t as g } from "./state-b5e865db.mjs";
|
|
4
|
+
import { i as v } from "./query-d843aa92.mjs";
|
|
5
|
+
import { s as u, a as f } from "./dialog-c9dbe94d.mjs";
|
|
6
|
+
import { o as l } from "./class-map-4b94b017.mjs";
|
|
7
|
+
import "./icon.mjs";
|
|
8
|
+
import "./icon-button.mjs";
|
|
9
|
+
import "./tslib.es6-c4b0f3b1.mjs";
|
|
10
|
+
import "./inert.esm-359d4581.mjs";
|
|
11
|
+
import "./base-element-acf30176.mjs";
|
|
12
|
+
import "./utils-dc65fdc9.mjs";
|
|
13
|
+
import "./observer-be7b92e2.mjs";
|
|
14
|
+
import "./mwc-icon-5227aec3.mjs";
|
|
15
|
+
import "./ripple-handlers-0d9ad7c2.mjs";
|
|
16
|
+
import "./style-map-bc3ed3e0.mjs";
|
|
17
|
+
import "./aria-property-fa2717fe.mjs";
|
|
18
|
+
import "./event-options-78d6cf94.mjs";
|
|
19
|
+
import "./if-defined-c367f208.mjs";
|
|
20
|
+
/**
|
|
21
|
+
* @license
|
|
22
|
+
* Copyright 2016 Google Inc.
|
|
23
|
+
*
|
|
24
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
25
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
26
|
+
* in the Software without restriction, including without limitation the rights
|
|
27
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
28
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
29
|
+
* furnished to do so, subject to the following conditions:
|
|
30
|
+
*
|
|
31
|
+
* The above copyright notice and this permission notice shall be included in
|
|
32
|
+
* all copies or substantial portions of the Software.
|
|
33
|
+
*
|
|
34
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
35
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
36
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
37
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
38
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
39
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
40
|
+
* THE SOFTWARE.
|
|
41
|
+
*/
|
|
42
|
+
var x = {
|
|
43
|
+
CLOSING: "mdc-dialog--closing",
|
|
44
|
+
OPEN: "mdc-dialog--open",
|
|
45
|
+
OPENING: "mdc-dialog--opening",
|
|
46
|
+
SCROLLABLE: "mdc-dialog--scrollable",
|
|
47
|
+
SCROLL_LOCK: "mdc-dialog-scroll-lock",
|
|
48
|
+
STACKED: "mdc-dialog--stacked",
|
|
49
|
+
FULLSCREEN: "mdc-dialog--fullscreen",
|
|
50
|
+
// Class for showing a scroll divider on full-screen dialog header element.
|
|
51
|
+
// Should only be displayed on scrollable content, when the dialog content is
|
|
52
|
+
// scrolled "underneath" the header.
|
|
53
|
+
SCROLL_DIVIDER_HEADER: "mdc-dialog-scroll-divider-header",
|
|
54
|
+
// Class for showing a scroll divider on a full-screen dialog footer element.
|
|
55
|
+
// Should only be displayed on scrolalble content, when the dialog content is
|
|
56
|
+
// obscured "underneath" the footer.
|
|
57
|
+
SCROLL_DIVIDER_FOOTER: "mdc-dialog-scroll-divider-footer",
|
|
58
|
+
// The "surface scrim" is a scrim covering only the surface of a dialog. This
|
|
59
|
+
// is used in situations where a confirmation dialog is shown over an already
|
|
60
|
+
// opened full-screen dialog. On larger screen-sizes, the full-screen dialog
|
|
61
|
+
// is sized as a modal and so in these situations we display a "surface scrim"
|
|
62
|
+
// to prevent a "double scrim" (where the scrim from the secondary
|
|
63
|
+
// confirmation dialog would overlap with the scrim from the full-screen
|
|
64
|
+
// dialog).
|
|
65
|
+
SURFACE_SCRIM_SHOWN: "mdc-dialog__surface-scrim--shown",
|
|
66
|
+
// "Showing" animating class for the surface-scrim.
|
|
67
|
+
SURFACE_SCRIM_SHOWING: "mdc-dialog__surface-scrim--showing",
|
|
68
|
+
// "Hiding" animating class for the surface-scrim.
|
|
69
|
+
SURFACE_SCRIM_HIDING: "mdc-dialog__surface-scrim--hiding",
|
|
70
|
+
// Class to hide a dialog's scrim (used in conjunction with a surface-scrim).
|
|
71
|
+
// Note that we only hide the original scrim rather than removing it entirely
|
|
72
|
+
// to prevent interactions with the content behind this scrim, and to capture
|
|
73
|
+
// scrim clicks.
|
|
74
|
+
SCRIM_HIDDEN: "mdc-dialog__scrim--hidden"
|
|
75
|
+
};
|
|
76
|
+
const y = `:host{--mdc-dialog-content-ink-color: var(--cv-theme-on-surface-variant);--mdc-dialog-heading-ink-color: var(--cv-theme-on-surface);--mdc-dialog-min-width: 96vw;--mdc-theme-surface: var(--cv-theme-surface-container-lowest);--mdc-typography-body1-font-family: var( --cv-typography-subtitle1-font-family );--mdc-typography-headline6-font-size: var( --cv-typography-headline6-font-size );--mdc-typography-headline6-font-weight: var( --cv-typography-headline1-font-weight )}:host .mdc-dialog.error .status-dialog__state{background-color:var(--cv-theme-negative-8)}:host .mdc-dialog.error .status-dialog__state cv-icon{color:var(--cv-theme-negative)}:host .mdc-dialog.positive .status-dialog__state{background-color:var(--cv-theme-positive-8)}:host .mdc-dialog.positive .status-dialog__state cv-icon{color:var(--cv-theme-positive)}:host .mdc-dialog.warning .status-dialog__state{background-color:var(--cv-theme-caution-8)}:host .mdc-dialog.warning .status-dialog__state cv-icon{color:var(--cv-theme-caution)}:host .mdc-dialog .mdc-dialog__surface{max-width:calc(100vw - 40px)}:host .mdc-dialog .mdc-dialog__content{padding:0 16px}:host .mdc-dialog .mdc-dialog__content.padding-bottom{padding-bottom:2rem}:host .mdc-dialog__actions{flex-shrink:0;padding:16px}:host .mdc-dialog__content{flex-grow:1}:host .mdc-dialog__title{flex:1;line-height:var(--cv-typography-body1-line-height);margin:0;padding:0 40px 0 0}:host .mdc-dialog__title:before{display:none}:host .mdc-dialog.mdc-dialog--scrollable .mdc-dialog__title,:host .mdc-dialog.mdc-dialog--scrollable .mdc-dialog__actions{border:none}.status-dialog__arrow-icon{margin-top:2px}.status-dialog__arrow-icon.open{transform:rotate(0);transition:transform .25s ease-out}.status-dialog__arrow-icon.close{transform:rotate(180deg);transition:transform .25s ease-in}.status-dialog__container{display:flex}.status-dialog__content{display:flex;flex:1;flex-direction:column}.status-dialog__container,.status-dialog__content{max-height:calc(100% - 32px);overflow-y:auto}.status-dialog__details{display:none}.status-dialog__details.visible{display:block}.status-dialog__heading{--mdc-icon-button-size: 40px;align-items:start;box-sizing:border-box;display:inline-flex;justify-content:space-between;padding:18px 16px;width:100%}.status-dialog__heading.no-heading{justify-content:flex-end}.status-dialog__heading .status-dialog__close-icon{position:absolute;right:8px;top:10px}.status-dialog__state{--mdc-icon-size: 32px;padding:14px 16px 0}.status-dialog__state cv-icon{font-variation-settings:"FILL" 1}.status-dialog__toggle-details{align-items:center;color:var(--cv-theme-primary);cursor:pointer;display:inline-flex;font-size:14px;font-style:normal;font-weight:400;letter-spacing:.25px;line-height:20px;padding:16px 0}@media screen and (min-width: 600px){:host{--mdc-dialog-min-width: 575px}:host .mdc-dialog .mdc-dialog__surface{max-width:575px}}@media screen and (max-width: 480px){:host .status-dialog__container{flex-direction:column}:host .status-dialog__heading .status-dialog__close-icon{top:18px}:host .status-dialog__state{padding:4px}:host .status-dialog__state cv-icon{display:none}:host .mdc-dialog.error .status-dialog__state{background-color:var(--cv-theme-negative)}:host .mdc-dialog.positive .status-dialog__state{background-color:var(--cv-theme-positive)}:host .mdc-dialog.warning .status-dialog__state{background-color:var(--cv-theme-caution)}}
|
|
77
|
+
`;
|
|
78
|
+
var w = Object.defineProperty, b = Object.getOwnPropertyDescriptor, n = (i, t, s, d) => {
|
|
79
|
+
for (var a = d > 1 ? void 0 : d ? b(t, s) : t, c = i.length - 1, r; c >= 0; c--)
|
|
80
|
+
(r = i[c]) && (a = (d ? r(t, s, a) : r(a)) || a);
|
|
81
|
+
return d && a && w(t, s, a), a;
|
|
82
|
+
};
|
|
83
|
+
let o = class extends f {
|
|
84
|
+
constructor() {
|
|
85
|
+
super(...arguments), this.state = "error", this.expandDetails = !1, this.showDetailsLink = !1;
|
|
86
|
+
}
|
|
87
|
+
firstUpdated() {
|
|
88
|
+
if (super.firstUpdated(), this._details) {
|
|
89
|
+
const i = this._details.assignedNodes({
|
|
90
|
+
flatten: !0
|
|
91
|
+
});
|
|
92
|
+
this.showDetailsLink = i.some(
|
|
93
|
+
(t) => t.nodeType === Node.ELEMENT_NODE
|
|
94
|
+
);
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
toggleDetails() {
|
|
98
|
+
this.expandDetails = !this.expandDetails;
|
|
99
|
+
}
|
|
100
|
+
_getStatusIcon() {
|
|
101
|
+
switch (this.state) {
|
|
102
|
+
case "positive":
|
|
103
|
+
return "check";
|
|
104
|
+
default:
|
|
105
|
+
return this.state;
|
|
106
|
+
}
|
|
107
|
+
}
|
|
108
|
+
// Renders the details section in the dialog content
|
|
109
|
+
renderDetails() {
|
|
110
|
+
const i = {
|
|
111
|
+
"status-dialog__details": !0,
|
|
112
|
+
visible: this.expandDetails
|
|
113
|
+
}, t = {
|
|
114
|
+
open: !this.expandDetails,
|
|
115
|
+
close: this.expandDetails
|
|
116
|
+
}, s = e`<cv-icon
|
|
117
|
+
class="${l(t)} status-dialog__arrow-icon"
|
|
118
|
+
>arrow_drop_down</cv-icon
|
|
119
|
+
>`;
|
|
120
|
+
return e`${this.showDetailsLink ? e`<div>
|
|
121
|
+
<span
|
|
122
|
+
class="status-dialog__toggle-details"
|
|
123
|
+
@click="${this.toggleDetails}"
|
|
124
|
+
>${this.expandDetails ? "Hide details" : "Show details"} ${s}
|
|
125
|
+
</span>
|
|
126
|
+
</div>` : ""}
|
|
127
|
+
<slot
|
|
128
|
+
name="details"
|
|
129
|
+
id="details"
|
|
130
|
+
class="${l(i)}"
|
|
131
|
+
></slot>`;
|
|
132
|
+
}
|
|
133
|
+
renderHeading() {
|
|
134
|
+
const i = {
|
|
135
|
+
"status-dialog__heading": !0,
|
|
136
|
+
"no-heading": !this.heading
|
|
137
|
+
};
|
|
138
|
+
let t = e``;
|
|
139
|
+
return this.heading && (t = e`<h2 id="title" class="mdc-dialog__title">
|
|
140
|
+
${this.heading}
|
|
141
|
+
</h2>`), e`<span class="${l(i)}">
|
|
142
|
+
${t}
|
|
143
|
+
<cv-icon-button
|
|
144
|
+
class="status-dialog__close-icon"
|
|
145
|
+
icon="close"
|
|
146
|
+
@click=${this.close}
|
|
147
|
+
></cv-icon-button>
|
|
148
|
+
</span>`;
|
|
149
|
+
}
|
|
150
|
+
render() {
|
|
151
|
+
const i = {
|
|
152
|
+
[x.STACKED]: this.stacked,
|
|
153
|
+
error: this.state === "error",
|
|
154
|
+
positive: this.state === "positive",
|
|
155
|
+
warning: this.state === "warning"
|
|
156
|
+
}, t = this.renderHeading(), s = this.renderDetails(), d = {
|
|
157
|
+
"mdc-dialog__actions": !this.hideActions
|
|
158
|
+
}, a = {
|
|
159
|
+
"mdc-dialog__content": !0,
|
|
160
|
+
"padding-bottom": this.hideActions
|
|
161
|
+
};
|
|
162
|
+
return e` <div
|
|
163
|
+
class="mdc-dialog ${l(i)}"
|
|
164
|
+
role="alertdialog"
|
|
165
|
+
aria-modal="true"
|
|
166
|
+
aria-labelledby="title"
|
|
167
|
+
aria-describedby="content"
|
|
168
|
+
>
|
|
169
|
+
<div class="mdc-dialog__container">
|
|
170
|
+
<div class="mdc-dialog__surface">
|
|
171
|
+
<div class="status-dialog__container">
|
|
172
|
+
<div class="status-dialog__state">
|
|
173
|
+
<cv-icon>${this._getStatusIcon()}<cv-icon>
|
|
174
|
+
</div>
|
|
175
|
+
<div class="status-dialog__content">
|
|
176
|
+
${t}
|
|
177
|
+
<div id="content" class="${l(a)}">
|
|
178
|
+
<slot id="contentSlot"></slot>
|
|
179
|
+
${s}
|
|
180
|
+
</div>
|
|
181
|
+
<footer id="actions" class="${l(d)}">
|
|
182
|
+
<span>
|
|
183
|
+
<slot name="secondaryAction"></slot>
|
|
184
|
+
</span>
|
|
185
|
+
<span>
|
|
186
|
+
<slot name="primaryAction"></slot>
|
|
187
|
+
</span>
|
|
188
|
+
</footer>
|
|
189
|
+
</div>
|
|
190
|
+
</div>
|
|
191
|
+
</div>
|
|
192
|
+
</div>
|
|
193
|
+
<div class="mdc-dialog__scrim"></div>
|
|
194
|
+
</div>`;
|
|
195
|
+
}
|
|
196
|
+
};
|
|
197
|
+
o.styles = [
|
|
198
|
+
u,
|
|
199
|
+
_`
|
|
200
|
+
${m(y)}
|
|
201
|
+
`
|
|
202
|
+
];
|
|
203
|
+
n([
|
|
204
|
+
v("#details")
|
|
205
|
+
], o.prototype, "_details", 2);
|
|
206
|
+
n([
|
|
207
|
+
h({ type: String })
|
|
208
|
+
], o.prototype, "state", 2);
|
|
209
|
+
n([
|
|
210
|
+
g()
|
|
211
|
+
], o.prototype, "expandDetails", 2);
|
|
212
|
+
n([
|
|
213
|
+
g()
|
|
214
|
+
], o.prototype, "showDetailsLink", 2);
|
|
215
|
+
o = n([
|
|
216
|
+
p("cv-status-dialog")
|
|
217
|
+
], o);
|
|
218
|
+
const j = o;
|
|
219
|
+
export {
|
|
220
|
+
o as CovalentStatusDialog,
|
|
221
|
+
j as default
|
|
222
|
+
};
|