@covalent/components 8.21.2 → 8.23.0
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/{dialog-16aad066.mjs → dialog-78a9fd0e.mjs} +63 -63
- package/{dialog-86192b9a.js → dialog-83104700.js} +7 -7
- package/dialog.js +1 -1
- package/dialog.mjs +1 -1
- package/focused-page/focused-page.d.ts +55 -0
- package/focused-page/focused-page.d.ts.map +1 -0
- package/focused-page.js +21 -0
- package/focused-page.mjs +112 -0
- package/full-screen-dialog/full-screen-dialog.d.ts +32 -0
- package/full-screen-dialog/full-screen-dialog.d.ts.map +1 -0
- package/full-screen-dialog.js +26 -0
- package/full-screen-dialog.mjs +79 -0
- package/index.d.ts +2 -0
- package/index.d.ts.map +1 -1
- package/index.js +1 -1
- package/index.mjs +109 -104
- package/package.json +11 -1
- package/side-sheet-0053becf.mjs +5 -0
- package/side-sheet-a99095ce.js +2 -0
- package/side-sheet.js +3 -4
- package/side-sheet.mjs +22 -23
- package/status-dialog.js +1 -1
- package/status-dialog.mjs +1 -1
@@ -0,0 +1,55 @@
|
|
1
|
+
import { LitElement, PropertyValues, TemplateResult } from 'lit';
|
2
|
+
/**
|
3
|
+
* Focused page
|
4
|
+
*
|
5
|
+
* @slot - This element has a slot
|
6
|
+
*/
|
7
|
+
export declare class CovalentFocusedPage extends LitElement {
|
8
|
+
static styles: import("lit").CSSResult[];
|
9
|
+
/**
|
10
|
+
* Whether the help section is open or not
|
11
|
+
*/
|
12
|
+
helpOpen: boolean;
|
13
|
+
/**
|
14
|
+
* Whether the help section is resizable
|
15
|
+
*/
|
16
|
+
helpResizable: boolean;
|
17
|
+
/**
|
18
|
+
* Whether the help section is resizable
|
19
|
+
*/
|
20
|
+
hideTopBorder: boolean;
|
21
|
+
/**
|
22
|
+
* DOM element of the container div
|
23
|
+
*/
|
24
|
+
container: HTMLDivElement;
|
25
|
+
/**
|
26
|
+
* DOM element of the help panel
|
27
|
+
*/
|
28
|
+
helpPanel: HTMLElement;
|
29
|
+
/**
|
30
|
+
* DOM element of the resize handler
|
31
|
+
*/
|
32
|
+
resizeHandle: HTMLElement;
|
33
|
+
/**
|
34
|
+
* Whether the help section is being resized
|
35
|
+
*/
|
36
|
+
private _isResizing;
|
37
|
+
constructor();
|
38
|
+
protected firstUpdated(): void;
|
39
|
+
openHelpPanel(): void;
|
40
|
+
closeHelpPanel(): void;
|
41
|
+
resetHelpPanelWidth(): void;
|
42
|
+
setHelpPanelWidth(width: string): void;
|
43
|
+
protected updated(_changedProperties: PropertyValues): void;
|
44
|
+
private _resizerMouseMove;
|
45
|
+
private _resizerMouseUp;
|
46
|
+
private _startResizing;
|
47
|
+
protected render(): TemplateResult<1>;
|
48
|
+
}
|
49
|
+
declare global {
|
50
|
+
interface HTMLElementTagNameMap {
|
51
|
+
'cv-focused-page': CovalentFocusedPage;
|
52
|
+
}
|
53
|
+
}
|
54
|
+
export default CovalentFocusedPage;
|
55
|
+
//# sourceMappingURL=focused-page.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"focused-page.d.ts","sourceRoot":"","sources":["../../../../libs/components/src/focused-page/focused-page.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,UAAU,EAEV,cAAc,EACd,cAAc,EAEf,MAAM,KAAK,CAAC;AAKb;;;;GAIG;AAEH,qBACa,mBAAoB,SAAQ,UAAU;IACjD,OAAgB,MAAM,4BAIpB;IAEF;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,aAAa,UAAS;IAEtB;;OAEG;IAEH,aAAa,UAAS;IAEtB;;OAEG;IAEH,SAAS,EAAG,cAAc,CAAC;IAE3B;;OAEG;IAEH,SAAS,EAAG,WAAW,CAAC;IAExB;;OAEG;IAEH,YAAY,EAAG,WAAW,CAAC;IAE3B;;OAEG;IACH,OAAO,CAAC,WAAW,CAAS;;IAU5B,SAAS,CAAC,YAAY,IAAI,IAAI;IAI9B,aAAa,IAAI,IAAI;IAOrB,cAAc;IAKd,mBAAmB;IAKnB,iBAAiB,CAAC,KAAK,EAAE,MAAM;IAI/B,SAAS,CAAC,OAAO,CAAC,kBAAkB,EAAE,cAAc,GAAG,IAAI;IAY3D,OAAO,CAAC,iBAAiB;IA8BzB,OAAO,CAAC,eAAe;IASvB,OAAO,CAAC,cAAc;IAStB,SAAS,CAAC,MAAM,IAAI,cAAc,CAAC,CAAC,CAAC;CA+BtC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,mBAAmB,CAAC;KACxC;CACF;AAED,eAAe,mBAAmB,CAAC"}
|
package/focused-page.js
ADDED
@@ -0,0 +1,21 @@
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("./query-assigned-elements-f623705d.js"),h=require("./property-57f6f6fe.js"),p=require("./query-680f1868.js"),d=require("./class-map-0a4c6ca9.js");require("./directive-1186bc23.js");const c=`:host{height:100%;left:0;position:fixed;top:0;width:100%}.action-items{padding:.5rem .75rem;text-align:right}.content{box-sizing:border-box;display:flex;flex:1;max-height:100vh;overflow:auto;transition:visibility .3s ease}.fullscreen-container{border-top:4px solid var(--cv-theme-tertiary);box-sizing:border-box;display:flex;height:100%;width:100%}.fullscreen-container:not(.help-open) .help-panel{width:0}.fullscreen-container:not(.help-open) .help-panel .resize-handle{display:none}.fullscreen-container.hide-border{border:none}.help{--mdc-theme-surface: var(--cv-theme-surface-container-low);box-sizing:border-box;flex:1;max-height:100vh;overflow-y:auto}.help-panel{background:var(--cv-theme-surface-container-low);box-sizing:border-box;display:flex;flex:0 0 auto;max-width:100%;position:relative;resize:none;transition:width .2s;width:var(--cv-focused-page-help-width, 320px);z-index:5}.help-panel .resize-handle{cursor:ew-resize;height:100%;opacity:0;position:absolute;transition:opacity .3s ease;-webkit-user-select:none;user-select:none;width:8px;z-index:9}.help-panel .resize-handle:before{background-color:var(--mdc-theme-primary);content:"";height:100%;left:0;position:absolute;top:0;transform:translate(-50%);width:2px}.help-panel .resize-handle:hover,.help-panel.resizing .resize-handle{opacity:1}.main{box-sizing:border-box;flex:1;height:100%}@media only screen and (max-width: 479.98px){.help-open .help-panel{width:100%;z-index:100}}@media only screen and (max-width: 959.98px){.help-open .help-panel{box-shadow:0 8px 12px 6px #00000026,0 4px 4px #0000004d;height:100%;position:absolute;right:0}}
|
2
|
+
`;var u=Object.defineProperty,g=Object.getOwnPropertyDescriptor,l=(a,e,s,i)=>{for(var t=i>1?void 0:i?g(e,s):e,o=a.length-1,r;o>=0;o--)(r=a[o])&&(t=(i?r(e,s,t):r(t))||t);return i&&t&&u(e,s,t),t};exports.CovalentFocusedPage=class extends n.s{constructor(){super(),this.helpOpen=!1,this.helpResizable=!1,this.hideTopBorder=!1,this._isResizing=!1,this._resizerMouseMove=this._resizerMouseMove.bind(this),this._resizerMouseUp=this._resizerMouseUp.bind(this),this._startResizing=this._startResizing.bind(this),this.resetHelpPanelWidth=this.resetHelpPanelWidth.bind(this)}firstUpdated(){this.openHelpPanel()}openHelpPanel(){const e=parseInt(localStorage.getItem("focusedPageHelpWidth")||"")||320;this.setHelpPanelWidth(this.helpOpen?`${e}px`:"0")}closeHelpPanel(){this.setHelpPanelWidth("0"),this.helpOpen=!1}resetHelpPanelWidth(){this.setHelpPanelWidth("320px"),localStorage.setItem("focusedPageHelpWidth","320")}setHelpPanelWidth(e){var s;(s=this.container)==null||s.style.setProperty("--cv-focused-page-help-width",e)}updated(e){super.updated(e),e.has("helpOpen")&&(this.helpOpen?this.openHelpPanel():this.closeHelpPanel())}_resizerMouseMove(e){if(!this.container||!this.helpPanel||!this._isResizing)return;const s=window.innerWidth,i=this.container.getBoundingClientRect();let t;s<960?t=this.helpPanel.getBoundingClientRect().right-e.clientX:t=i.right-e.clientX,s<960&&t>320&&t<s-40?(this.setHelpPanelWidth(`${t}px`),localStorage.setItem("focusedPageHelpWidth",`${t}`)):t>320&&t<i.width-600&&(this.setHelpPanelWidth(`${t}px`),localStorage.setItem("focusedPageHelpWidth",`${t}`))}_resizerMouseUp(){this._isResizing=!1,this.helpPanel.classList.remove("resizing"),this.helpPanel.style.transition="width 200ms",document.removeEventListener("mouseup",this._resizerMouseUp),document.removeEventListener("mousemove",this._resizerMouseMove)}_startResizing(e){e.target===this.resizeHandle&&(this._isResizing=!0,this.helpPanel.classList.add("resizing"),this.helpPanel.style.transition="none",document.addEventListener("mouseup",this._resizerMouseUp),document.addEventListener("mousemove",this._resizerMouseMove))}render(){const e={"fullscreen-container":!0,"help-open":this.helpOpen,"hide-border":this.hideTopBorder},s={"help-panel":!0,"help-resizable":this.helpResizable};return n.x`<div class="${d.o(e)}">
|
3
|
+
<div class="content">
|
4
|
+
<section class="main">
|
5
|
+
<slot></slot>
|
6
|
+
</section>
|
7
|
+
</div>
|
8
|
+
<aside
|
9
|
+
class="${d.o(s)}"
|
10
|
+
id="help-panel"
|
11
|
+
@mousedown="${i=>this._startResizing(i)}"
|
12
|
+
>
|
13
|
+
${this.helpResizable?n.x`<div
|
14
|
+
class="resize-handle"
|
15
|
+
@dblclick="${()=>this.helpOpen&&this.resetHelpPanelWidth()}"
|
16
|
+
></div>`:n.A}
|
17
|
+
<div class="help"><slot name="help"></slot></div>
|
18
|
+
</aside>
|
19
|
+
</div>`}};exports.CovalentFocusedPage.styles=[n.i`
|
20
|
+
${n.r(c)}
|
21
|
+
`];l([h.n({type:Boolean,reflect:!0})],exports.CovalentFocusedPage.prototype,"helpOpen",2);l([h.n({type:Boolean,reflect:!0})],exports.CovalentFocusedPage.prototype,"helpResizable",2);l([h.n({type:Boolean,reflect:!0})],exports.CovalentFocusedPage.prototype,"hideTopBorder",2);l([p.i(".fullscreen-container")],exports.CovalentFocusedPage.prototype,"container",2);l([p.i("#help-panel")],exports.CovalentFocusedPage.prototype,"helpPanel",2);l([p.i(".resize-handle")],exports.CovalentFocusedPage.prototype,"resizeHandle",2);exports.CovalentFocusedPage=l([n.e("cv-focused-page")],exports.CovalentFocusedPage);const v=exports.CovalentFocusedPage;exports.default=v;
|
package/focused-page.mjs
ADDED
@@ -0,0 +1,112 @@
|
|
1
|
+
import { i as u, r as f, s as g, x as d, A as m, e as v } from "./query-assigned-elements-4a39219d.mjs";
|
2
|
+
import { n as h } from "./property-9b6ea53b.mjs";
|
3
|
+
import { i as p } from "./query-d843aa92.mjs";
|
4
|
+
import { o as c } from "./class-map-6e504a9a.mjs";
|
5
|
+
import "./directive-daf4e9b6.mjs";
|
6
|
+
const x = `:host{height:100%;left:0;position:fixed;top:0;width:100%}.action-items{padding:.5rem .75rem;text-align:right}.content{box-sizing:border-box;display:flex;flex:1;max-height:100vh;overflow:auto;transition:visibility .3s ease}.fullscreen-container{border-top:4px solid var(--cv-theme-tertiary);box-sizing:border-box;display:flex;height:100%;width:100%}.fullscreen-container:not(.help-open) .help-panel{width:0}.fullscreen-container:not(.help-open) .help-panel .resize-handle{display:none}.fullscreen-container.hide-border{border:none}.help{--mdc-theme-surface: var(--cv-theme-surface-container-low);box-sizing:border-box;flex:1;max-height:100vh;overflow-y:auto}.help-panel{background:var(--cv-theme-surface-container-low);box-sizing:border-box;display:flex;flex:0 0 auto;max-width:100%;position:relative;resize:none;transition:width .2s;width:var(--cv-focused-page-help-width, 320px);z-index:5}.help-panel .resize-handle{cursor:ew-resize;height:100%;opacity:0;position:absolute;transition:opacity .3s ease;-webkit-user-select:none;user-select:none;width:8px;z-index:9}.help-panel .resize-handle:before{background-color:var(--mdc-theme-primary);content:"";height:100%;left:0;position:absolute;top:0;transform:translate(-50%);width:2px}.help-panel .resize-handle:hover,.help-panel.resizing .resize-handle{opacity:1}.main{box-sizing:border-box;flex:1;height:100%}@media only screen and (max-width: 479.98px){.help-open .help-panel{width:100%;z-index:100}}@media only screen and (max-width: 959.98px){.help-open .help-panel{box-shadow:0 8px 12px 6px #00000026,0 4px 4px #0000004d;height:100%;position:absolute;right:0}}
|
7
|
+
`;
|
8
|
+
var z = Object.defineProperty, b = Object.getOwnPropertyDescriptor, o = (e, i, n, t) => {
|
9
|
+
for (var l = t > 1 ? void 0 : t ? b(i, n) : i, r = e.length - 1, a; r >= 0; r--)
|
10
|
+
(a = e[r]) && (l = (t ? a(i, n, l) : a(l)) || l);
|
11
|
+
return t && l && z(i, n, l), l;
|
12
|
+
};
|
13
|
+
let s = class extends g {
|
14
|
+
constructor() {
|
15
|
+
super(), this.helpOpen = !1, this.helpResizable = !1, this.hideTopBorder = !1, this._isResizing = !1, this._resizerMouseMove = this._resizerMouseMove.bind(this), this._resizerMouseUp = this._resizerMouseUp.bind(this), this._startResizing = this._startResizing.bind(this), this.resetHelpPanelWidth = this.resetHelpPanelWidth.bind(this);
|
16
|
+
}
|
17
|
+
firstUpdated() {
|
18
|
+
this.openHelpPanel();
|
19
|
+
}
|
20
|
+
openHelpPanel() {
|
21
|
+
const e = parseInt(localStorage.getItem("focusedPageHelpWidth") || "") || 320;
|
22
|
+
this.setHelpPanelWidth(this.helpOpen ? `${e}px` : "0");
|
23
|
+
}
|
24
|
+
closeHelpPanel() {
|
25
|
+
this.setHelpPanelWidth("0"), this.helpOpen = !1;
|
26
|
+
}
|
27
|
+
resetHelpPanelWidth() {
|
28
|
+
this.setHelpPanelWidth("320px"), localStorage.setItem("focusedPageHelpWidth", "320");
|
29
|
+
}
|
30
|
+
setHelpPanelWidth(e) {
|
31
|
+
var i;
|
32
|
+
(i = this.container) == null || i.style.setProperty("--cv-focused-page-help-width", e);
|
33
|
+
}
|
34
|
+
updated(e) {
|
35
|
+
super.updated(e), e.has("helpOpen") && (this.helpOpen ? this.openHelpPanel() : this.closeHelpPanel());
|
36
|
+
}
|
37
|
+
// Called when the resize handler is dragged to resize the help panel
|
38
|
+
_resizerMouseMove(e) {
|
39
|
+
if (!this.container || !this.helpPanel || !this._isResizing)
|
40
|
+
return;
|
41
|
+
const i = window.innerWidth, n = this.container.getBoundingClientRect();
|
42
|
+
let t;
|
43
|
+
i < 960 ? t = this.helpPanel.getBoundingClientRect().right - e.clientX : t = n.right - e.clientX, i < 960 && t > 320 && t < i - 40 ? (this.setHelpPanelWidth(`${t}px`), localStorage.setItem("focusedPageHelpWidth", `${t}`)) : t > 320 && t < n.width - 600 && (this.setHelpPanelWidth(`${t}px`), localStorage.setItem("focusedPageHelpWidth", `${t}`));
|
44
|
+
}
|
45
|
+
// Called when dragging is finished (i.e. mouse up event on resize handler)
|
46
|
+
_resizerMouseUp() {
|
47
|
+
this._isResizing = !1, this.helpPanel.classList.remove("resizing"), this.helpPanel.style.transition = "width 200ms", document.removeEventListener("mouseup", this._resizerMouseUp), document.removeEventListener("mousemove", this._resizerMouseMove);
|
48
|
+
}
|
49
|
+
// Called when dragging starts (i.e. mouse down event on resize handler)
|
50
|
+
_startResizing(e) {
|
51
|
+
e.target === this.resizeHandle && (this._isResizing = !0, this.helpPanel.classList.add("resizing"), this.helpPanel.style.transition = "none", document.addEventListener("mouseup", this._resizerMouseUp), document.addEventListener("mousemove", this._resizerMouseMove));
|
52
|
+
}
|
53
|
+
render() {
|
54
|
+
const e = {
|
55
|
+
"fullscreen-container": !0,
|
56
|
+
"help-open": this.helpOpen,
|
57
|
+
"hide-border": this.hideTopBorder
|
58
|
+
}, i = {
|
59
|
+
"help-panel": !0,
|
60
|
+
"help-resizable": this.helpResizable
|
61
|
+
};
|
62
|
+
return d`<div class="${c(e)}">
|
63
|
+
<div class="content">
|
64
|
+
<section class="main">
|
65
|
+
<slot></slot>
|
66
|
+
</section>
|
67
|
+
</div>
|
68
|
+
<aside
|
69
|
+
class="${c(i)}"
|
70
|
+
id="help-panel"
|
71
|
+
@mousedown="${(n) => this._startResizing(n)}"
|
72
|
+
>
|
73
|
+
${this.helpResizable ? d`<div
|
74
|
+
class="resize-handle"
|
75
|
+
@dblclick="${() => this.helpOpen && this.resetHelpPanelWidth()}"
|
76
|
+
></div>` : m}
|
77
|
+
<div class="help"><slot name="help"></slot></div>
|
78
|
+
</aside>
|
79
|
+
</div>`;
|
80
|
+
}
|
81
|
+
};
|
82
|
+
s.styles = [
|
83
|
+
u`
|
84
|
+
${f(x)}
|
85
|
+
`
|
86
|
+
];
|
87
|
+
o([
|
88
|
+
h({ type: Boolean, reflect: !0 })
|
89
|
+
], s.prototype, "helpOpen", 2);
|
90
|
+
o([
|
91
|
+
h({ type: Boolean, reflect: !0 })
|
92
|
+
], s.prototype, "helpResizable", 2);
|
93
|
+
o([
|
94
|
+
h({ type: Boolean, reflect: !0 })
|
95
|
+
], s.prototype, "hideTopBorder", 2);
|
96
|
+
o([
|
97
|
+
p(".fullscreen-container")
|
98
|
+
], s.prototype, "container", 2);
|
99
|
+
o([
|
100
|
+
p("#help-panel")
|
101
|
+
], s.prototype, "helpPanel", 2);
|
102
|
+
o([
|
103
|
+
p(".resize-handle")
|
104
|
+
], s.prototype, "resizeHandle", 2);
|
105
|
+
s = o([
|
106
|
+
v("cv-focused-page")
|
107
|
+
], s);
|
108
|
+
const W = s;
|
109
|
+
export {
|
110
|
+
s as CovalentFocusedPage,
|
111
|
+
W as default
|
112
|
+
};
|
@@ -0,0 +1,32 @@
|
|
1
|
+
import { TemplateResult } from 'lit';
|
2
|
+
import CovalentDialog from '../dialog/dialog';
|
3
|
+
import '../focused-page/focused-page';
|
4
|
+
/**
|
5
|
+
* Full-screen Dialog
|
6
|
+
*
|
7
|
+
* @slot - This element has a slot
|
8
|
+
*/
|
9
|
+
export declare class CovalentFullscreenDialog extends CovalentDialog {
|
10
|
+
static styles: import("lit").CSSResult[];
|
11
|
+
/**
|
12
|
+
* Whether the help section is open or not
|
13
|
+
*/
|
14
|
+
helpOpen: boolean;
|
15
|
+
/**
|
16
|
+
* Whether the help section is resizable
|
17
|
+
*/
|
18
|
+
helpResizable: boolean;
|
19
|
+
/**
|
20
|
+
* Since the default, action slots of mdc-dialog have been replaced with the focused page component,
|
21
|
+
* override this method to return focused page as the initial focus element
|
22
|
+
*/
|
23
|
+
protected getInitialFocusEl(): HTMLElement | null;
|
24
|
+
protected render(): TemplateResult<1>;
|
25
|
+
}
|
26
|
+
declare global {
|
27
|
+
interface HTMLElementTagNameMap {
|
28
|
+
'cv-full-screen-dialog': CovalentFullscreenDialog;
|
29
|
+
}
|
30
|
+
}
|
31
|
+
export default CovalentFullscreenDialog;
|
32
|
+
//# sourceMappingURL=full-screen-dialog.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"full-screen-dialog.d.ts","sourceRoot":"","sources":["../../../../libs/components/src/full-screen-dialog/full-screen-dialog.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,cAAc,EAAa,MAAM,KAAK,CAAC;AAI3D,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAC9C,OAAO,8BAA8B,CAAC;AAEtC;;;;GAIG;AAEH,qBACa,wBAAyB,SAAQ,cAAc;IAC1D,OAAgB,MAAM,4BAMpB;IAEF;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,aAAa,UAAS;IAEtB;;;OAGG;cACgB,iBAAiB,IAAI,WAAW,GAAG,IAAI;cAcvC,MAAM,IAAI,cAAc,CAAC,CAAC,CAAC;CAyB/C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,uBAAuB,EAAE,wBAAwB,CAAC;KACnD;CACF;AAED,eAAe,wBAAwB,CAAC"}
|
@@ -0,0 +1,26 @@
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("./query-assigned-elements-f623705d.js"),c=require("./property-57f6f6fe.js"),d=require("./side-sheet-a99095ce.js"),u=require("./dialog-83104700.js");require("./focused-page.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("./query-680f1868.js");require("./class-map-0a4c6ca9.js");require("./directive-1186bc23.js");const v=`:host{--cv-dialog-border-radius: 0;--cv-dialog-horizontal-padding: 0;--cv-dialog-vertical-padding: 0;--cv-side-sheet-width: 100vw}
|
2
|
+
`;var g=Object.defineProperty,p=Object.getOwnPropertyDescriptor,n=(i,l,r,o)=>{for(var e=o>1?void 0:o?p(l,r):l,s=i.length-1,a;s>=0;s--)(a=i[s])&&(e=(o?a(l,r,e):a(e))||e);return o&&e&&g(l,r,e),e};exports.CovalentFullscreenDialog=class extends u.CovalentDialog$1{constructor(){super(...arguments),this.helpOpen=!1,this.helpResizable=!1}getInitialFocusEl(){const l=`[${this.initialFocusAttribute}]`,r=this.querySelector(l);return r||this.renderRoot.querySelector("cv-focused-page")}render(){return t.x` <div
|
3
|
+
class="mdc-dialog"
|
4
|
+
role="alertdialog"
|
5
|
+
aria-modal="true"
|
6
|
+
aria-labelledby="title"
|
7
|
+
aria-describedby="content"
|
8
|
+
>
|
9
|
+
<div class="mdc-dialog__container">
|
10
|
+
<div class="mdc-dialog__surface">
|
11
|
+
<div id="content" class="mdc-dialog__content">
|
12
|
+
<cv-focused-page
|
13
|
+
.helpOpen="${this.helpOpen}"
|
14
|
+
.helpResizable="${this.helpResizable}"
|
15
|
+
.hideTopBorder="${!0}"
|
16
|
+
>
|
17
|
+
<slot></slot>
|
18
|
+
<slot name="help" slot="help"> </slot>
|
19
|
+
</cv-focused-page>
|
20
|
+
</div>
|
21
|
+
</div>
|
22
|
+
</div>
|
23
|
+
<div class="mdc-dialog__scrim"></div>
|
24
|
+
</div>`}};exports.CovalentFullscreenDialog.styles=[t.i`
|
25
|
+
${t.r(u.CovalentDialog$1.styles)} ${t.r(d.baseStyles)} ${t.r(v)}
|
26
|
+
`];n([c.n({type:Boolean,reflect:!0})],exports.CovalentFullscreenDialog.prototype,"helpOpen",2);n([c.n({type:Boolean,reflect:!0})],exports.CovalentFullscreenDialog.prototype,"helpResizable",2);exports.CovalentFullscreenDialog=n([t.e("cv-full-screen-dialog")],exports.CovalentFullscreenDialog);const h=exports.CovalentFullscreenDialog;exports.default=h;
|
@@ -0,0 +1,79 @@
|
|
1
|
+
import { i as u, r as c, x as v, e as m } from "./query-assigned-elements-4a39219d.mjs";
|
2
|
+
import { n as p } from "./property-9b6ea53b.mjs";
|
3
|
+
import { b as h } from "./side-sheet-0053becf.mjs";
|
4
|
+
import { a as n } from "./dialog-78a9fd0e.mjs";
|
5
|
+
import "./focused-page.mjs";
|
6
|
+
import "./tslib.es6-c4b0f3b1.mjs";
|
7
|
+
import "./inert.esm-359d4581.mjs";
|
8
|
+
import "./base-element-acf30176.mjs";
|
9
|
+
import "./utils-dc65fdc9.mjs";
|
10
|
+
import "./observer-be7b92e2.mjs";
|
11
|
+
import "./query-d843aa92.mjs";
|
12
|
+
import "./class-map-6e504a9a.mjs";
|
13
|
+
import "./directive-daf4e9b6.mjs";
|
14
|
+
const g = `:host{--cv-dialog-border-radius: 0;--cv-dialog-horizontal-padding: 0;--cv-dialog-vertical-padding: 0;--cv-side-sheet-width: 100vw}
|
15
|
+
`;
|
16
|
+
var f = Object.defineProperty, b = Object.getOwnPropertyDescriptor, d = (l, e, r, i) => {
|
17
|
+
for (var t = i > 1 ? void 0 : i ? b(e, r) : e, s = l.length - 1, a; s >= 0; s--)
|
18
|
+
(a = l[s]) && (t = (i ? a(e, r, t) : a(t)) || t);
|
19
|
+
return i && t && f(e, r, t), t;
|
20
|
+
};
|
21
|
+
let o = class extends n {
|
22
|
+
constructor() {
|
23
|
+
super(...arguments), this.helpOpen = !1, this.helpResizable = !1;
|
24
|
+
}
|
25
|
+
/**
|
26
|
+
* Since the default, action slots of mdc-dialog have been replaced with the focused page component,
|
27
|
+
* override this method to return focused page as the initial focus element
|
28
|
+
*/
|
29
|
+
getInitialFocusEl() {
|
30
|
+
const l = `[${this.initialFocusAttribute}]`, e = this.querySelector(l);
|
31
|
+
return e || this.renderRoot.querySelector("cv-focused-page");
|
32
|
+
}
|
33
|
+
render() {
|
34
|
+
return v` <div
|
35
|
+
class="mdc-dialog"
|
36
|
+
role="alertdialog"
|
37
|
+
aria-modal="true"
|
38
|
+
aria-labelledby="title"
|
39
|
+
aria-describedby="content"
|
40
|
+
>
|
41
|
+
<div class="mdc-dialog__container">
|
42
|
+
<div class="mdc-dialog__surface">
|
43
|
+
<div id="content" class="mdc-dialog__content">
|
44
|
+
<cv-focused-page
|
45
|
+
.helpOpen="${this.helpOpen}"
|
46
|
+
.helpResizable="${this.helpResizable}"
|
47
|
+
.hideTopBorder="${!0}"
|
48
|
+
>
|
49
|
+
<slot></slot>
|
50
|
+
<slot name="help" slot="help"> </slot>
|
51
|
+
</cv-focused-page>
|
52
|
+
</div>
|
53
|
+
</div>
|
54
|
+
</div>
|
55
|
+
<div class="mdc-dialog__scrim"></div>
|
56
|
+
</div>`;
|
57
|
+
}
|
58
|
+
};
|
59
|
+
o.styles = [
|
60
|
+
u`
|
61
|
+
${c(n.styles)} ${c(
|
62
|
+
h
|
63
|
+
)} ${c(g)}
|
64
|
+
`
|
65
|
+
];
|
66
|
+
d([
|
67
|
+
p({ type: Boolean, reflect: !0 })
|
68
|
+
], o.prototype, "helpOpen", 2);
|
69
|
+
d([
|
70
|
+
p({ type: Boolean, reflect: !0 })
|
71
|
+
], o.prototype, "helpResizable", 2);
|
72
|
+
o = d([
|
73
|
+
m("cv-full-screen-dialog")
|
74
|
+
], o);
|
75
|
+
const B = o;
|
76
|
+
export {
|
77
|
+
o as CovalentFullscreenDialog,
|
78
|
+
B as default
|
79
|
+
};
|
package/index.d.ts
CHANGED
@@ -15,7 +15,9 @@ export * from './drawer/drawer';
|
|
15
15
|
export * from './empty-state/empty-state';
|
16
16
|
export * from './expansion-panel/expansion-panel';
|
17
17
|
export * from './expansion-panel/expansion-panel-item';
|
18
|
+
export * from './focused-page/focused-page';
|
18
19
|
export * from './formfield/formfield';
|
20
|
+
export * from './full-screen-dialog/full-screen-dialog';
|
19
21
|
export * from './icon/icon';
|
20
22
|
export * from './icon-button/icon-button';
|
21
23
|
export * from './icon-button-toggle/icon-button-toggle';
|
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,2BAA2B,CAAC;AAC1C,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,+BAA+B,CAAC;AAC9C,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"}
|
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,2BAA2B,CAAC;AAC1C,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,6BAA6B,CAAC;AAC5C,cAAc,uBAAuB,CAAC;AACtC,cAAc,yCAAyC,CAAC;AACxD,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,+BAA+B,CAAC;AAC9C,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"),
|
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"),l=require("./chip-c65a4549.js"),u=require("./chip-set.js"),c=require("./circular-progress.js"),b=require("./code-editor-b36fad77.js"),C=require("./code-snippet.js"),s=require("./dialog-83104700.js"),v=require("./drawer.js"),p=require("./empty-state.js"),d=require("./expansion-panel.js"),g=require("./expansion-panel-item.js"),q=require("./focused-page.js"),m=require("./formfield.js"),P=require("./full-screen-dialog.js"),y=require("./icon.js"),f=require("./icon-button.js"),j=require("./icon-button-toggle.js"),O=require("./icon-check-toggle.js"),S=require("./icon-radio-toggle.js"),T=require("./linear-progress.js"),I=require("./check-list-item.js"),h=require("./list.js"),L=require("./list-item.js"),x=require("./nav-list-item.js"),B=require("./radio-list-item.js"),k=require("./menu.js"),R=require("./notebook-cell.js"),A=require("./radio.js"),F=require("./select.js"),D=require("./side-sheet.js"),E=require("./slider.js"),w=require("./slider-range.js"),H=require("./snackbar.js"),N=require("./status-dialog.js"),M=require("./status-header.js"),_=require("./status-header-item.js"),z=require("./switch.js"),G=require("./tab.js"),J=require("./tab-bar.js"),K=require("./textarea.js"),Q=require("./textfield.js"),U=require("./text-lockup.js"),V=require("./toolbar.js"),W=require("./tooltip.js"),X=require("./top-app-bar.js"),Y=require("./top-app-bar-fixed.js"),Z=require("./tree-list.js"),$=require("./tree-list-item.js"),ee=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-0a4c6ca9.js");require("./directive-1186bc23.js");require("./property-57f6f6fe.js");require("./query-680f1868.js");require("./mwc-drawer-base-bbae43c3.js");require("./inert.esm-2cee6f2e.js");require("./base-element-58a3f9ea.js");require("./mwc-icon-f87639bc.js");require("./ripple-handlers-9fb4a31a.js");require("./state-0974a8e5.js");require("./style-map-a135c6ab.js");require("./aria-property-849c8816.js");require("./event-options-3f5eb195.js");require("./if-defined-f1c45245.js");require("./mwc-checkbox-base-935d9566.js");require("./form-element-c553d6f5.js");require("./mwc-checkbox.css-b3434429.js");require("./keyboard-39125691.js");require("./_commonjsHelpers-2367a3a2.js");require("./async-directive-4a34f75e.js");require("./directive-helpers-0ce1f995.js");require("./query-assigned-nodes-99eae71d.js");require("./side-sheet-a99095ce.js");require("./mwc-radio-base-147cf999.js");require("./mwc-radio.css-4e140252.js");require("./mwc-list-item-base-06d93e6e.js");require("./list-item-8b940ec8.js");require("./mwc-list-base-22616d0a.js");require("./mwc-menu-base-08f54c38.js");require("./mwc-line-ripple-directive-40145003.js");require("./mwc-slider.css-c5f99704.js");require("./mwc-tab-base-f2269fd1.js");require("./textfield-83e78e56.js");require("./mwc-top-app-bar-base-8c8cde51.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:()=>l.CovalentChip});Object.defineProperty(exports,"CovalentChipSet",{enumerable:!0,get:()=>u.CovalentChipSet});Object.defineProperty(exports,"CovalentCircularProgress",{enumerable:!0,get:()=>c.CovalentCircularProgress});Object.defineProperty(exports,"CovalentCodeEditor",{enumerable:!0,get:()=>b.CovalentCodeEditor});Object.defineProperty(exports,"CovalentCodeSnippet",{enumerable:!0,get:()=>C.CovalentCodeSnippet});Object.defineProperty(exports,"CovalentDialog",{enumerable:!0,get:()=>s.CovalentDialog});Object.defineProperty(exports,"CovalentDrawer",{enumerable:!0,get:()=>v.CovalentDrawer});Object.defineProperty(exports,"CovalentEmptyState",{enumerable:!0,get:()=>p.CovalentEmptyState});Object.defineProperty(exports,"CovalentExpansionPanel",{enumerable:!0,get:()=>d.CovalentExpansionPanel});Object.defineProperty(exports,"CovalentExpansionPanelItem",{enumerable:!0,get:()=>g.CovalentExpansionPanelItem});Object.defineProperty(exports,"CovalentFocusedPage",{enumerable:!0,get:()=>q.CovalentFocusedPage});Object.defineProperty(exports,"CovalentFormfield",{enumerable:!0,get:()=>m.CovalentFormfield});Object.defineProperty(exports,"CovalentFullscreenDialog",{enumerable:!0,get:()=>P.CovalentFullscreenDialog});Object.defineProperty(exports,"CovalentIcon",{enumerable:!0,get:()=>y.CovalentIcon});Object.defineProperty(exports,"CovalentIconButton",{enumerable:!0,get:()=>f.CovalentIconButton});Object.defineProperty(exports,"CovalentIconButtonToggle",{enumerable:!0,get:()=>j.CovalentIconButtonToggle});Object.defineProperty(exports,"CovalentIconCheckToggle",{enumerable:!0,get:()=>O.CovalentIconCheckToggle});Object.defineProperty(exports,"CovalentIconRadioToggle",{enumerable:!0,get:()=>S.CovalentIconRadioToggle});Object.defineProperty(exports,"CovalentLinearProgress",{enumerable:!0,get:()=>T.CovalentLinearProgress});Object.defineProperty(exports,"CovalentCheckListItem",{enumerable:!0,get:()=>I.CovalentCheckListItem});Object.defineProperty(exports,"CovalentList",{enumerable:!0,get:()=>h.CovalentList});Object.defineProperty(exports,"CovalentListItem",{enumerable:!0,get:()=>L.CovalentListItem});Object.defineProperty(exports,"CovalentNavRailListItem",{enumerable:!0,get:()=>x.CovalentNavRailListItem});Object.defineProperty(exports,"CovalentRadioListItem",{enumerable:!0,get:()=>B.CovalentRadioListItem});Object.defineProperty(exports,"CovalentMenu",{enumerable:!0,get:()=>k.CovalentMenu});Object.defineProperty(exports,"CovalentNotebookCell",{enumerable:!0,get:()=>R.CovalentNotebookCell});Object.defineProperty(exports,"CovalentRadio",{enumerable:!0,get:()=>A.CovalentRadio});Object.defineProperty(exports,"CovalentSelect",{enumerable:!0,get:()=>F.CovalentSelect});Object.defineProperty(exports,"CovalentSideSheet",{enumerable:!0,get:()=>D.CovalentSideSheet});Object.defineProperty(exports,"CovalentSlider",{enumerable:!0,get:()=>E.CovalentSlider});Object.defineProperty(exports,"CovalentSliderRange",{enumerable:!0,get:()=>w.CovalentSliderRange});Object.defineProperty(exports,"CovalentSnackbar",{enumerable:!0,get:()=>H.CovalentSnackbar});Object.defineProperty(exports,"CovalentStatusDialog",{enumerable:!0,get:()=>N.CovalentStatusDialog});Object.defineProperty(exports,"CovalentStatusHeader",{enumerable:!0,get:()=>M.CovalentStatusHeader});Object.defineProperty(exports,"CovalentStatusHeaderItem",{enumerable:!0,get:()=>_.CovalentStatusHeaderItem});Object.defineProperty(exports,"CovalentSwitch",{enumerable:!0,get:()=>z.CovalentSwitch});Object.defineProperty(exports,"CovalentTab",{enumerable:!0,get:()=>G.CovalentTab});Object.defineProperty(exports,"CovalentTabBar",{enumerable:!0,get:()=>J.CovalentTabBar});Object.defineProperty(exports,"CovalentTextArea",{enumerable:!0,get:()=>K.CovalentTextArea});Object.defineProperty(exports,"CovalentTextField",{enumerable:!0,get:()=>Q.CovalentTextField});Object.defineProperty(exports,"CovalentTextLockup",{enumerable:!0,get:()=>U.CovalentTextLockup});Object.defineProperty(exports,"CovalentToolbar",{enumerable:!0,get:()=>V.CovalentToolbar});Object.defineProperty(exports,"CovalentTooltip",{enumerable:!0,get:()=>W.CovalentTooltip});Object.defineProperty(exports,"CovalentTopAppBar",{enumerable:!0,get:()=>X.CovalentTopAppBar});Object.defineProperty(exports,"CovalentTopAppBarFixed",{enumerable:!0,get:()=>Y.CovalentTopAppBarFixed});Object.defineProperty(exports,"CovalentTreeList",{enumerable:!0,get:()=>Z.CovalentTreeList});Object.defineProperty(exports,"CovalentTreeListItem",{enumerable:!0,get:()=>$.CovalentTreeListItem});Object.defineProperty(exports,"CovalentTypography",{enumerable:!0,get:()=>ee.CovalentTypography});
|