@planningcenter/tapestry 1.1.0-rc.9 → 1.1.1-qa-144.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/dist/index.css +55 -21
- package/dist/index.css.map +1 -1
- package/dist/packages/tapestry-wc/dist/components/index2.js +22 -0
- package/dist/packages/tapestry-wc/dist/components/index2.js.map +1 -0
- package/dist/packages/tapestry-wc/dist/components/popover-container.js +93 -7
- package/dist/packages/tapestry-wc/dist/components/popover-container.js.map +1 -1
- package/dist/packages/tapestry-wc/dist/components/sidenav-popover.js +4 -4
- package/dist/packages/tapestry-wc/dist/components/sidenav-popover.js.map +1 -1
- package/dist/packages/tapestry-wc/dist/components/sidenav-responsive-header.js +62 -0
- package/dist/packages/tapestry-wc/dist/components/sidenav-responsive-header.js.map +1 -0
- package/dist/packages/tapestry-wc/dist/components/tds-page-header.js +8 -3
- package/dist/packages/tapestry-wc/dist/components/tds-page-header.js.map +1 -1
- package/dist/packages/tapestry-wc/dist/components/tds-sidenav-item.js +23 -11
- package/dist/packages/tapestry-wc/dist/components/tds-sidenav-item.js.map +1 -1
- package/dist/packages/tapestry-wc/dist/components/tds-sidenav-responsive-header.js +2 -55
- package/dist/packages/tapestry-wc/dist/components/tds-sidenav-responsive-header.js.map +1 -1
- package/dist/packages/tapestry-wc/dist/components/tds-sidenav-section.js +12 -3
- package/dist/packages/tapestry-wc/dist/components/tds-sidenav-section.js.map +1 -1
- package/dist/packages/tapestry-wc/dist/components/tds-sidenav.js +25 -8
- package/dist/packages/tapestry-wc/dist/components/tds-sidenav.js.map +1 -1
- package/dist/unstable.css +58 -22
- package/dist/unstable.css.map +1 -1
- package/dist/webComponents.css +58 -22
- package/dist/webComponents.css.map +1 -1
- package/package.json +4 -3
- package/react-types/index.d.ts +46 -16
- package/dist/packages/tapestry-wc/dist/components/sidenav-item-enhancer.js +0 -63
- package/dist/packages/tapestry-wc/dist/components/sidenav-item-enhancer.js.map +0 -1
|
@@ -1,62 +1,9 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { d as defineCustomElement$1 } from './sidenav-responsive-header.js';
|
|
2
2
|
|
|
3
3
|
/*!
|
|
4
4
|
* Planning Center Tapestry Web Components
|
|
5
|
-
* Version: 1.1.0
|
|
5
|
+
* Version: 1.1.0
|
|
6
6
|
*/
|
|
7
|
-
|
|
8
|
-
const SidenavResponsiveHeader = /*@__PURE__*/ proxyCustomElement(class SidenavResponsiveHeader extends H {
|
|
9
|
-
constructor() {
|
|
10
|
-
super();
|
|
11
|
-
this.__registerHost();
|
|
12
|
-
/** Whether the sidenav is open */
|
|
13
|
-
this.isOpen = false;
|
|
14
|
-
}
|
|
15
|
-
// --------------------------------------------------------------------------
|
|
16
|
-
//
|
|
17
|
-
// Lifecycle
|
|
18
|
-
//
|
|
19
|
-
// --------------------------------------------------------------------------
|
|
20
|
-
componentWillLoad() {
|
|
21
|
-
var _a;
|
|
22
|
-
const parentNavId = (_a = this.el.closest("nav")) === null || _a === void 0 ? void 0 : _a.id;
|
|
23
|
-
if (!parentNavId) {
|
|
24
|
-
throw new Error("Sidenav header must be a child of a nav element");
|
|
25
|
-
}
|
|
26
|
-
this.popoverId = `${parentNavId}-popover`;
|
|
27
|
-
}
|
|
28
|
-
componentDidLoad() {
|
|
29
|
-
const popoverElement = document.getElementById(this.popoverId);
|
|
30
|
-
popoverElement === null || popoverElement === void 0 ? void 0 : popoverElement.addEventListener("toggle", (event) => {
|
|
31
|
-
this.isOpen = event.newState === "open";
|
|
32
|
-
});
|
|
33
|
-
}
|
|
34
|
-
// --------------------------------------------------------------------------
|
|
35
|
-
//
|
|
36
|
-
// Render Methods
|
|
37
|
-
//
|
|
38
|
-
// --------------------------------------------------------------------------
|
|
39
|
-
render() {
|
|
40
|
-
return (h(Host, { key: '2beea08c1c3cc57e47c74aa0ac7af85de30f21db', class: "tds-sidenav-responsive-header" }, h("button", { key: '1433aef8069096cfaac109552cd2409c1350623f', type: "button", class: "tds-sidenav-responsive-header-toggle", "aria-expanded": this.isOpen ? "true" : "false", "aria-label": this.isOpen ? "Close menu" : "Open menu", "aria-controls": this.popoverId, popoverTarget: this.popoverId }, h("svg", { key: '2d909350af5fd10bfeb849bf9f3f99e76c962ec8', xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" }, h("path", { key: '0c0ff6964b3db23d973ded312fcae1a950998833', d: "M0 6.91104H16V8.68904H0V6.91104ZM0 13.133H16V11.356H0V13.133ZM0 2.46704V4.24404H16V2.46704H0Z", fill: "currentColor" }))), h("h2", { key: '275c3e8fad37bc7dbc73177c9af0c52b7f57a13d', class: "tds-sidenav-responsive-header-label" }, this.label)));
|
|
41
|
-
}
|
|
42
|
-
get el() { return this; }
|
|
43
|
-
}, [0, "tds-sidenav-responsive-header", {
|
|
44
|
-
"label": [1],
|
|
45
|
-
"isOpen": [32]
|
|
46
|
-
}]);
|
|
47
|
-
function defineCustomElement$1() {
|
|
48
|
-
if (typeof customElements === "undefined") {
|
|
49
|
-
return;
|
|
50
|
-
}
|
|
51
|
-
const components = ["tds-sidenav-responsive-header"];
|
|
52
|
-
components.forEach(tagName => { switch (tagName) {
|
|
53
|
-
case "tds-sidenav-responsive-header":
|
|
54
|
-
if (!customElements.get(tagName)) {
|
|
55
|
-
customElements.define(tagName, SidenavResponsiveHeader);
|
|
56
|
-
}
|
|
57
|
-
break;
|
|
58
|
-
} });
|
|
59
|
-
}
|
|
60
7
|
const defineCustomElement = defineCustomElement$1;
|
|
61
8
|
|
|
62
9
|
export { defineCustomElement };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tds-sidenav-responsive-header.js","sources":["../../../../../../tapestry-wc/dist/components/tds-sidenav-responsive-header.js"],"sourcesContent":["/*!\n * Planning Center Tapestry Web Components\n * Version: 1.1.0
|
|
1
|
+
{"version":3,"file":"tds-sidenav-responsive-header.js","sources":["../../../../../../tapestry-wc/dist/components/tds-sidenav-responsive-header.js"],"sourcesContent":["/*!\n * Planning Center Tapestry Web Components\n * Version: 1.1.0\n */\nimport { S as SidenavResponsiveHeader, d as defineCustomElement$1 } from './sidenav-responsive-header.js';\n\nconst TdsSidenavResponsiveHeader = SidenavResponsiveHeader;\nconst defineCustomElement = defineCustomElement$1;\n\nexport { TdsSidenavResponsiveHeader, defineCustomElement };\n//# sourceMappingURL=tds-sidenav-responsive-header.js.map\n\n//# sourceMappingURL=tds-sidenav-responsive-header.js.map"],"names":[],"mappings":";;AAAA;AACA;AACA;AACA;AAIK,MAAC,mBAAmB,GAAG;;;;"}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { proxyCustomElement, H, h, Host } from './../../../../ext/@stencil/core/internal/client/index.js';
|
|
2
|
+
import { r as removeSSRSlot } from './index2.js';
|
|
2
3
|
|
|
3
4
|
/*!
|
|
4
5
|
* Planning Center Tapestry Web Components
|
|
5
|
-
* Version: 1.1.0
|
|
6
|
+
* Version: 1.1.0
|
|
6
7
|
*/
|
|
7
8
|
|
|
8
9
|
let sidenavSectionId = 0;
|
|
@@ -14,14 +15,22 @@ const SidenavSection = /*@__PURE__*/ proxyCustomElement(class SidenavSection ext
|
|
|
14
15
|
}
|
|
15
16
|
// --------------------------------------------------------------------------
|
|
16
17
|
//
|
|
18
|
+
// Lifecycle
|
|
19
|
+
//
|
|
20
|
+
// --------------------------------------------------------------------------
|
|
21
|
+
componentDidLoad() {
|
|
22
|
+
removeSSRSlot(this.el);
|
|
23
|
+
}
|
|
24
|
+
// --------------------------------------------------------------------------
|
|
25
|
+
//
|
|
17
26
|
// Render Methods
|
|
18
27
|
//
|
|
19
28
|
// --------------------------------------------------------------------------
|
|
20
29
|
render() {
|
|
21
|
-
return (h(Host, { key: '
|
|
30
|
+
return (h(Host, { key: '6180a3b3e7cc275db1cca6543e8e6baa0cd1194d', class: "tds-sidenav-section" }, this.label && (h("h2", { key: '82adb1e73d79c9408f422e52ca0231ff6999d7cd', id: `${this.componentId}`, class: "tds-sidenav-section-header" }, this.label)), h("ul", { key: '9c71dee8a2c859c632711d98ee4e1a3d4adab8a4', class: "tds-sidenav-section-list", "aria-labelledby": this.label ? `${this.componentId}` : undefined }, h("slot", { key: 'f745750d7fa95c5d90eff86d7379512ef1db0f6e' }))));
|
|
22
31
|
}
|
|
23
32
|
get el() { return this; }
|
|
24
|
-
}, [
|
|
33
|
+
}, [6, "tds-sidenav-section", {
|
|
25
34
|
"label": [1]
|
|
26
35
|
}]);
|
|
27
36
|
function defineCustomElement$1() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tds-sidenav-section.js","sources":["../../../../../../tapestry-wc/dist/components/tds-sidenav-section.js"],"sourcesContent":["/*!\n * Planning Center Tapestry Web Components\n * Version: 1.1.0
|
|
1
|
+
{"version":3,"file":"tds-sidenav-section.js","sources":["../../../../../../tapestry-wc/dist/components/tds-sidenav-section.js"],"sourcesContent":["/*!\n * Planning Center Tapestry Web Components\n * Version: 1.1.0\n */\nimport { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';\nimport { r as removeSSRSlot } from './index2.js';\n\nlet sidenavSectionId = 0;\nconst SidenavSection = /*@__PURE__*/ proxyCustomElement(class SidenavSection extends HTMLElement {\n constructor() {\n super();\n this.__registerHost();\n this.componentId = `sidenav-section-header-${sidenavSectionId++}`;\n }\n // --------------------------------------------------------------------------\n //\n // Lifecycle\n //\n // --------------------------------------------------------------------------\n componentDidLoad() {\n removeSSRSlot(this.el);\n }\n // --------------------------------------------------------------------------\n //\n // Render Methods\n //\n // --------------------------------------------------------------------------\n render() {\n return (h(Host, { key: '6180a3b3e7cc275db1cca6543e8e6baa0cd1194d', class: \"tds-sidenav-section\" }, this.label && (h(\"h2\", { key: '82adb1e73d79c9408f422e52ca0231ff6999d7cd', id: `${this.componentId}`, class: \"tds-sidenav-section-header\" }, this.label)), h(\"ul\", { key: '9c71dee8a2c859c632711d98ee4e1a3d4adab8a4', class: \"tds-sidenav-section-list\", \"aria-labelledby\": this.label ? `${this.componentId}` : undefined }, h(\"slot\", { key: 'f745750d7fa95c5d90eff86d7379512ef1db0f6e' }))));\n }\n get el() { return this; }\n}, [6, \"tds-sidenav-section\", {\n \"label\": [1]\n }]);\nfunction defineCustomElement$1() {\n if (typeof customElements === \"undefined\") {\n return;\n }\n const components = [\"tds-sidenav-section\"];\n components.forEach(tagName => { switch (tagName) {\n case \"tds-sidenav-section\":\n if (!customElements.get(tagName)) {\n customElements.define(tagName, SidenavSection);\n }\n break;\n } });\n}\n\nconst TdsSidenavSection = SidenavSection;\nconst defineCustomElement = defineCustomElement$1;\n\nexport { TdsSidenavSection, defineCustomElement };\n//# sourceMappingURL=tds-sidenav-section.js.map\n\n//# sourceMappingURL=tds-sidenav-section.js.map"],"names":["HTMLElement"],"mappings":";;;AAAA;AACA;AACA;AACA;AAGA;AACA,IAAI,gBAAgB,GAAG,CAAC,CAAC;AACzB,MAAM,cAAc,iBAAiB,kBAAkB,CAAC,MAAM,cAAc,SAASA,CAAW,CAAC;AACjG,IAAI,WAAW,GAAG;AAClB,QAAQ,KAAK,EAAE,CAAC;AAChB,QAAQ,IAAI,CAAC,cAAc,EAAE,CAAC;AAC9B,QAAQ,IAAI,CAAC,WAAW,GAAG,CAAC,uBAAuB,EAAE,gBAAgB,EAAE,CAAC,CAAC,CAAC;AAC1E,KAAK;AACL;AACA;AACA;AACA;AACA;AACA,IAAI,gBAAgB,GAAG;AACvB,QAAQ,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC/B,KAAK;AACL;AACA;AACA;AACA;AACA;AACA,IAAI,MAAM,GAAG;AACb,QAAQ,QAAQ,CAAC,CAAC,IAAI,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,KAAK,EAAE,qBAAqB,EAAE,EAAE,IAAI,CAAC,KAAK,KAAK,CAAC,CAAC,IAAI,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,EAAE,EAAE,CAAC,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC,EAAE,KAAK,EAAE,4BAA4B,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,KAAK,EAAE,0BAA0B,EAAE,iBAAiB,EAAE,IAAI,CAAC,KAAK,GAAG,CAAC,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC,GAAG,SAAS,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,CAAC,CAAC,CAAC,EAAE;AAC1e,KAAK;AACL,IAAI,IAAI,EAAE,GAAG,EAAE,OAAO,IAAI,CAAC,EAAE;AAC7B,CAAC,EAAE,CAAC,CAAC,EAAE,qBAAqB,EAAE;AAC9B,QAAQ,OAAO,EAAE,CAAC,CAAC,CAAC;AACpB,KAAK,CAAC,CAAC,CAAC;AACR,SAAS,qBAAqB,GAAG;AACjC,IAAI,IAAI,OAAO,cAAc,KAAK,WAAW,EAAE;AAC/C,QAAQ,OAAO;AACf,KAAK;AACL,IAAI,MAAM,UAAU,GAAG,CAAC,qBAAqB,CAAC,CAAC;AAC/C,IAAI,UAAU,CAAC,OAAO,CAAC,OAAO,IAAI,EAAE,QAAQ,OAAO;AACnD,QAAQ,KAAK,qBAAqB;AAClC,YAAY,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;AAC9C,gBAAgB,cAAc,CAAC,MAAM,CAAC,OAAO,EAAE,cAAc,CAAC,CAAC;AAC/D,aAAa;AACb,YAAY,MAAM;AAClB,KAAK,EAAE,CAAC,CAAC;AACT,CAAC;AAGI,MAAC,mBAAmB,GAAG;;;;"}
|
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
import { proxyCustomElement, H, h, Host } from './../../../../ext/@stencil/core/internal/client/index.js';
|
|
2
|
-
import {
|
|
3
|
-
import { d as defineCustomElement$
|
|
2
|
+
import { r as removeSSRSlot } from './index2.js';
|
|
3
|
+
import { d as defineCustomElement$4 } from './popover-container.js';
|
|
4
|
+
import { d as defineCustomElement$3 } from './sidenav-popover.js';
|
|
5
|
+
import { d as defineCustomElement$2 } from './sidenav-responsive-header.js';
|
|
4
6
|
|
|
5
7
|
/*!
|
|
6
8
|
* Planning Center Tapestry Web Components
|
|
7
|
-
* Version: 1.1.0
|
|
9
|
+
* Version: 1.1.0
|
|
8
10
|
*/
|
|
9
11
|
|
|
10
12
|
let sidenavMenuId = 0;
|
|
@@ -20,20 +22,30 @@ const Sidenav = /*@__PURE__*/ proxyCustomElement(class Sidenav extends H {
|
|
|
20
22
|
}
|
|
21
23
|
// --------------------------------------------------------------------------
|
|
22
24
|
//
|
|
25
|
+
// Lifecycle
|
|
26
|
+
//
|
|
27
|
+
// --------------------------------------------------------------------------
|
|
28
|
+
componentDidLoad() {
|
|
29
|
+
removeSSRSlot(this.el);
|
|
30
|
+
}
|
|
31
|
+
// --------------------------------------------------------------------------
|
|
32
|
+
//
|
|
23
33
|
// Render Methods
|
|
24
34
|
//
|
|
25
35
|
// --------------------------------------------------------------------------
|
|
26
36
|
render() {
|
|
27
|
-
return (h(Host, { key: '
|
|
37
|
+
return (h(Host, { key: '1e459bceead4531bace6d26d2742b4cbe68755fa' }, h("nav", { key: '37bac08078cc34536e24571d817600e45cba1f18', id: this.sidenavMenuId, class: "tds-sidenav", "aria-label": this.label }, h("tds-sidenav-responsive-header", { key: '3b717dfd822a8cc4fe928bddbac559e623ada2de', label: this.selectedItemLabel }), h("tds-sidenav-popover", { key: 'df132d2ba09ef44ac65a4dc5019e5a45def16da6' }, h("slot", { key: 'dbd56edde827fe59116145b5e6c3540afb7e2978' })))));
|
|
28
38
|
}
|
|
29
|
-
|
|
30
|
-
|
|
39
|
+
get el() { return this; }
|
|
40
|
+
}, [6, "tds-sidenav", {
|
|
41
|
+
"label": [1],
|
|
42
|
+
"selectedItemLabel": [1, "selected-item-label"]
|
|
31
43
|
}]);
|
|
32
44
|
function defineCustomElement$1() {
|
|
33
45
|
if (typeof customElements === "undefined") {
|
|
34
46
|
return;
|
|
35
47
|
}
|
|
36
|
-
const components = ["tds-sidenav", "tds-popover-container", "tds-sidenav-popover"];
|
|
48
|
+
const components = ["tds-sidenav", "tds-popover-container", "tds-sidenav-popover", "tds-sidenav-responsive-header"];
|
|
37
49
|
components.forEach(tagName => { switch (tagName) {
|
|
38
50
|
case "tds-sidenav":
|
|
39
51
|
if (!customElements.get(tagName)) {
|
|
@@ -42,10 +54,15 @@ function defineCustomElement$1() {
|
|
|
42
54
|
break;
|
|
43
55
|
case "tds-popover-container":
|
|
44
56
|
if (!customElements.get(tagName)) {
|
|
45
|
-
defineCustomElement$
|
|
57
|
+
defineCustomElement$4();
|
|
46
58
|
}
|
|
47
59
|
break;
|
|
48
60
|
case "tds-sidenav-popover":
|
|
61
|
+
if (!customElements.get(tagName)) {
|
|
62
|
+
defineCustomElement$3();
|
|
63
|
+
}
|
|
64
|
+
break;
|
|
65
|
+
case "tds-sidenav-responsive-header":
|
|
49
66
|
if (!customElements.get(tagName)) {
|
|
50
67
|
defineCustomElement$2();
|
|
51
68
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tds-sidenav.js","sources":["../../../../../../tapestry-wc/dist/components/tds-sidenav.js"],"sourcesContent":["/*!\n * Planning Center Tapestry Web Components\n * Version: 1.1.0
|
|
1
|
+
{"version":3,"file":"tds-sidenav.js","sources":["../../../../../../tapestry-wc/dist/components/tds-sidenav.js"],"sourcesContent":["/*!\n * Planning Center Tapestry Web Components\n * Version: 1.1.0\n */\nimport { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';\nimport { r as removeSSRSlot } from './index2.js';\nimport { d as defineCustomElement$4 } from './popover-container.js';\nimport { d as defineCustomElement$3 } from './sidenav-popover.js';\nimport { d as defineCustomElement$2 } from './sidenav-responsive-header.js';\n\nlet sidenavMenuId = 0;\nconst Sidenav = /*@__PURE__*/ proxyCustomElement(class Sidenav extends HTMLElement {\n constructor() {\n super();\n this.__registerHost();\n this.sidenavMenuId = `tds-sidenav-menu-${sidenavMenuId++}`;\n /**\n * The label for the sidenav, used for accessibility.\n */\n this.label = \"Secondary\";\n }\n // --------------------------------------------------------------------------\n //\n // Lifecycle\n //\n // --------------------------------------------------------------------------\n componentDidLoad() {\n removeSSRSlot(this.el);\n }\n // --------------------------------------------------------------------------\n //\n // Render Methods\n //\n // --------------------------------------------------------------------------\n render() {\n return (h(Host, { key: '1e459bceead4531bace6d26d2742b4cbe68755fa' }, h(\"nav\", { key: '37bac08078cc34536e24571d817600e45cba1f18', id: this.sidenavMenuId, class: \"tds-sidenav\", \"aria-label\": this.label }, h(\"tds-sidenav-responsive-header\", { key: '3b717dfd822a8cc4fe928bddbac559e623ada2de', label: this.selectedItemLabel }), h(\"tds-sidenav-popover\", { key: 'df132d2ba09ef44ac65a4dc5019e5a45def16da6' }, h(\"slot\", { key: 'dbd56edde827fe59116145b5e6c3540afb7e2978' })))));\n }\n get el() { return this; }\n}, [6, \"tds-sidenav\", {\n \"label\": [1],\n \"selectedItemLabel\": [1, \"selected-item-label\"]\n }]);\nfunction defineCustomElement$1() {\n if (typeof customElements === \"undefined\") {\n return;\n }\n const components = [\"tds-sidenav\", \"tds-popover-container\", \"tds-sidenav-popover\", \"tds-sidenav-responsive-header\"];\n components.forEach(tagName => { switch (tagName) {\n case \"tds-sidenav\":\n if (!customElements.get(tagName)) {\n customElements.define(tagName, Sidenav);\n }\n break;\n case \"tds-popover-container\":\n if (!customElements.get(tagName)) {\n defineCustomElement$4();\n }\n break;\n case \"tds-sidenav-popover\":\n if (!customElements.get(tagName)) {\n defineCustomElement$3();\n }\n break;\n case \"tds-sidenav-responsive-header\":\n if (!customElements.get(tagName)) {\n defineCustomElement$2();\n }\n break;\n } });\n}\n\nconst TdsSidenav = Sidenav;\nconst defineCustomElement = defineCustomElement$1;\n\nexport { TdsSidenav, defineCustomElement };\n//# sourceMappingURL=tds-sidenav.js.map\n\n//# sourceMappingURL=tds-sidenav.js.map"],"names":["HTMLElement"],"mappings":";;;;;;AAAA;AACA;AACA;AACA;AAMA;AACA,IAAI,aAAa,GAAG,CAAC,CAAC;AACtB,MAAM,OAAO,iBAAiB,kBAAkB,CAAC,MAAM,OAAO,SAASA,CAAW,CAAC;AACnF,IAAI,WAAW,GAAG;AAClB,QAAQ,KAAK,EAAE,CAAC;AAChB,QAAQ,IAAI,CAAC,cAAc,EAAE,CAAC;AAC9B,QAAQ,IAAI,CAAC,aAAa,GAAG,CAAC,iBAAiB,EAAE,aAAa,EAAE,CAAC,CAAC,CAAC;AACnE;AACA;AACA;AACA,QAAQ,IAAI,CAAC,KAAK,GAAG,WAAW,CAAC;AACjC,KAAK;AACL;AACA;AACA;AACA;AACA;AACA,IAAI,gBAAgB,GAAG;AACvB,QAAQ,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC/B,KAAK;AACL;AACA;AACA;AACA;AACA;AACA,IAAI,MAAM,GAAG;AACb,QAAQ,QAAQ,CAAC,CAAC,IAAI,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,EAAE,CAAC,CAAC,KAAK,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,EAAE,EAAE,IAAI,CAAC,aAAa,EAAE,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,IAAI,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,+BAA+B,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,KAAK,EAAE,IAAI,CAAC,iBAAiB,EAAE,CAAC,EAAE,CAAC,CAAC,qBAAqB,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE;AAC5d,KAAK;AACL,IAAI,IAAI,EAAE,GAAG,EAAE,OAAO,IAAI,CAAC,EAAE;AAC7B,CAAC,EAAE,CAAC,CAAC,EAAE,aAAa,EAAE;AACtB,QAAQ,OAAO,EAAE,CAAC,CAAC,CAAC;AACpB,QAAQ,mBAAmB,EAAE,CAAC,CAAC,EAAE,qBAAqB,CAAC;AACvD,KAAK,CAAC,CAAC,CAAC;AACR,SAAS,qBAAqB,GAAG;AACjC,IAAI,IAAI,OAAO,cAAc,KAAK,WAAW,EAAE;AAC/C,QAAQ,OAAO;AACf,KAAK;AACL,IAAI,MAAM,UAAU,GAAG,CAAC,aAAa,EAAE,uBAAuB,EAAE,qBAAqB,EAAE,+BAA+B,CAAC,CAAC;AACxH,IAAI,UAAU,CAAC,OAAO,CAAC,OAAO,IAAI,EAAE,QAAQ,OAAO;AACnD,QAAQ,KAAK,aAAa;AAC1B,YAAY,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;AAC9C,gBAAgB,cAAc,CAAC,MAAM,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;AACxD,aAAa;AACb,YAAY,MAAM;AAClB,QAAQ,KAAK,uBAAuB;AACpC,YAAY,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;AAC9C,gBAAgB,qBAAqB,EAAE,CAAC;AACxC,aAAa;AACb,YAAY,MAAM;AAClB,QAAQ,KAAK,qBAAqB;AAClC,YAAY,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;AAC9C,gBAAgB,qBAAqB,EAAE,CAAC;AACxC,aAAa;AACb,YAAY,MAAM;AAClB,QAAQ,KAAK,+BAA+B;AAC5C,YAAY,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;AAC9C,gBAAgB,qBAAqB,EAAE,CAAC;AACxC,aAAa;AACb,YAAY,MAAM;AAClB,KAAK,EAAE,CAAC,CAAC;AACT,CAAC;AAGI,MAAC,mBAAmB,GAAG;;;;"}
|
package/dist/unstable.css
CHANGED
|
@@ -80,7 +80,7 @@
|
|
|
80
80
|
|
|
81
81
|
--tds-page-header-nav-item-color-selected:
|
|
82
82
|
var(
|
|
83
|
-
--t-text-color-
|
|
83
|
+
--t-text-color-default-primary
|
|
84
84
|
);
|
|
85
85
|
--tds-page-header-nav-item-border-color-selected:
|
|
86
86
|
var(
|
|
@@ -97,7 +97,7 @@
|
|
|
97
97
|
}
|
|
98
98
|
|
|
99
99
|
|
|
100
|
-
@media (min-width:
|
|
100
|
+
@media (min-width: 720px) {
|
|
101
101
|
.tds-page-header {
|
|
102
102
|
--tds-page-header-padding-x: var(--t-spacing-3);
|
|
103
103
|
--tds-page-header-nav-background: transparent;
|
|
@@ -108,10 +108,6 @@
|
|
|
108
108
|
var(
|
|
109
109
|
--t-fill-color-neutral-070
|
|
110
110
|
);
|
|
111
|
-
--tds-page-header-nav-item-color-selected:
|
|
112
|
-
var(
|
|
113
|
-
--t-text-color-default-primary
|
|
114
|
-
);
|
|
115
111
|
}
|
|
116
112
|
}
|
|
117
113
|
}
|
|
@@ -195,8 +191,8 @@
|
|
|
195
191
|
white-space: nowrap;
|
|
196
192
|
text-decoration: none;
|
|
197
193
|
-webkit-appearance: none;
|
|
198
|
-
|
|
199
|
-
|
|
194
|
+
-moz-appearance: none;
|
|
195
|
+
appearance: none;
|
|
200
196
|
cursor: pointer;
|
|
201
197
|
outline-offset: -2px;
|
|
202
198
|
background-color: var(--tds-page-header-nav-item-background-color);
|
|
@@ -356,7 +352,9 @@
|
|
|
356
352
|
color: var(--t-text-color-default-headline);
|
|
357
353
|
white-space: nowrap;
|
|
358
354
|
text-decoration: none;
|
|
359
|
-
appearance: none;
|
|
355
|
+
-webkit-appearance: none;
|
|
356
|
+
-moz-appearance: none;
|
|
357
|
+
appearance: none;
|
|
360
358
|
cursor: pointer;
|
|
361
359
|
outline: 0;
|
|
362
360
|
background-color: transparent;
|
|
@@ -374,14 +372,14 @@
|
|
|
374
372
|
white-space: nowrap;
|
|
375
373
|
}
|
|
376
374
|
|
|
377
|
-
|
|
375
|
+
.selected > :is(.tds-sidenav-item :is(a,button)) {
|
|
378
376
|
--tds-sidenav-item-nested-background: transparent;
|
|
379
377
|
--tds-sidenav-item-nested-border-color: var(--tds-sidenav-item-nested-border-color-selected);
|
|
380
378
|
font-weight: 600;
|
|
381
379
|
background-color: var(--tds-sidenav-item-background-selected);
|
|
382
380
|
}
|
|
383
381
|
|
|
384
|
-
|
|
382
|
+
:is(.selected > :is(.tds-sidenav-item :is(a,button))) .prefix,:is(.selected > :is(.tds-sidenav-item :is(a,button))) [slot="prefix"] {
|
|
385
383
|
color: var(--t-icon-color-default-primary);
|
|
386
384
|
}
|
|
387
385
|
|
|
@@ -403,6 +401,8 @@
|
|
|
403
401
|
|
|
404
402
|
:is(:is(.tds-sidenav-item :is(a,button)) :is(.prefix,[slot="prefix"])) svg {
|
|
405
403
|
display: block;
|
|
404
|
+
width: 16px;
|
|
405
|
+
height: 16px;
|
|
406
406
|
}
|
|
407
407
|
|
|
408
408
|
:is(.tds-sidenav-item :is(a,button)):has(.prefix,[slot="prefix"]) + .tds-sidenav-section {
|
|
@@ -497,6 +497,7 @@
|
|
|
497
497
|
display: flex;
|
|
498
498
|
align-items: center;
|
|
499
499
|
justify-content: center;
|
|
500
|
+
order: 0;
|
|
500
501
|
height: var(--t-container-size-md);
|
|
501
502
|
padding: 3px var(--t-spacing-1);
|
|
502
503
|
background-color: var(--t-fill-color-button-neutral-outline-dim-default);
|
|
@@ -514,36 +515,69 @@
|
|
|
514
515
|
|
|
515
516
|
.tds-sidenav-responsive-header .tds-sidenav-responsive-header-label {
|
|
516
517
|
flex: 1;
|
|
518
|
+
order: 1;
|
|
517
519
|
margin: 0;
|
|
518
520
|
font-size: var(--t-font-size-lg);
|
|
519
521
|
font-weight: var(--t-font-weight-medium);
|
|
520
522
|
color: var(--t-text-color-default-headline);
|
|
521
523
|
}
|
|
522
524
|
|
|
523
|
-
@media (max-width:
|
|
525
|
+
@media (max-width: 719px) {
|
|
524
526
|
.tds-sidenav-collapse {
|
|
525
527
|
position: absolute;
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
padding: var(--t-spacing-2);
|
|
532
|
-
margin-top: 12px;
|
|
528
|
+
z-index: 10001;
|
|
529
|
+
max-width: min(448px, calc(100vw - 48px));
|
|
530
|
+
padding: 0;
|
|
531
|
+
margin: 12px 0;
|
|
532
|
+
overflow: hidden;
|
|
533
533
|
outline: 0;
|
|
534
|
-
background:
|
|
534
|
+
background: var(--t-surface-color-card);
|
|
535
535
|
border: 0;
|
|
536
536
|
border-radius: 6px;
|
|
537
537
|
box-shadow: 0 8px 20px 0 rgba(0, 0, 0, .25);
|
|
538
|
+
will-change: transform;
|
|
539
|
+
position-area: bottom span-right;
|
|
540
|
+
}
|
|
541
|
+
|
|
542
|
+
.tds-sidenav-collapse:popover-open,
|
|
543
|
+
.tds-sidenav-collapse.\:popover-open {
|
|
544
|
+
display: flex;
|
|
545
|
+
}
|
|
546
|
+
|
|
547
|
+
.tds-sidenav-scroll-container {
|
|
548
|
+
--webkit-overflow-scrolling: touch;
|
|
549
|
+
display: block;
|
|
550
|
+
width: 100%;
|
|
551
|
+
height: -moz-fit-content;
|
|
552
|
+
height: fit-content;
|
|
553
|
+
padding: var(--t-spacing-2);
|
|
554
|
+
overflow-y: auto;
|
|
555
|
+
}
|
|
556
|
+
|
|
557
|
+
.tds-sidenav-item :is(a, button) :is(.prefix, [slot="prefix"]) {
|
|
558
|
+
display: none;
|
|
538
559
|
}
|
|
539
560
|
}
|
|
540
561
|
|
|
541
|
-
@media (min-width:
|
|
562
|
+
@media (min-width: 720px) {
|
|
542
563
|
.tds-sidenav-responsive-header {
|
|
543
564
|
display: none;
|
|
544
565
|
}
|
|
545
566
|
}
|
|
546
567
|
|
|
568
|
+
:is(tds-sidenav,tds-sidenav-section,tds-sidenav-item):not(.hydrated) > * {
|
|
569
|
+
display: none;
|
|
570
|
+
}
|
|
571
|
+
|
|
572
|
+
:is(tds-sidenav,tds-sidenav-section,tds-sidenav-item):not(.hydrated) > [slot="ssr"] {
|
|
573
|
+
display: block;
|
|
574
|
+
}
|
|
575
|
+
|
|
576
|
+
tds-sidenav-section:not(.hydrated) > [slot="ssr"] {
|
|
577
|
+
display: flex;
|
|
578
|
+
flex-direction: column;
|
|
579
|
+
}
|
|
580
|
+
|
|
547
581
|
/**
|
|
548
582
|
* Do not edit directly, this file was auto-generated.
|
|
549
583
|
*/
|
|
@@ -1163,7 +1197,9 @@
|
|
|
1163
1197
|
text-align: center;
|
|
1164
1198
|
text-decoration: none;
|
|
1165
1199
|
cursor: pointer;
|
|
1166
|
-
user-select: none;
|
|
1200
|
+
-webkit-user-select: none;
|
|
1201
|
+
-moz-user-select: none;
|
|
1202
|
+
user-select: none;
|
|
1167
1203
|
background-color: var(--tds-btn-bg);
|
|
1168
1204
|
border: var(--tds-btn-border-width) solid var(--tds-btn-border-color);
|
|
1169
1205
|
border-radius: var(--tds-btn-border-radius);
|