@planningcenter/tapestry 1.1.0-rc.8 → 1.1.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/components/page-header/PageHeader.d.ts +26 -0
- package/dist/components/page-header/PageHeader.d.ts.map +1 -0
- package/dist/components/page-header/PageHeader.js +13 -0
- package/dist/components/page-header/PageHeader.js.map +1 -0
- package/dist/index.css +161 -99
- package/dist/index.css.map +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/index.js.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 +5 -5
- 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 +164 -100
- package/dist/unstable.css.map +1 -1
- package/dist/webComponents.css +164 -100
- package/dist/webComponents.css.map +1 -1
- package/package.json +4 -3
- package/react-types/index.d.ts +62 -24
- 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
|
@@ -9,90 +9,105 @@
|
|
|
9
9
|
@layer t-component {
|
|
10
10
|
.tds-page-header {
|
|
11
11
|
--tds-page-header-background-color: var(--t-surface-color-card);
|
|
12
|
-
--tds-page-header-background-color-inactive:
|
|
13
|
-
|
|
14
|
-
|
|
12
|
+
--tds-page-header-background-color-inactive:
|
|
13
|
+
var(
|
|
14
|
+
--t-fill-color-transparency-dark-010
|
|
15
|
+
);
|
|
15
16
|
--tds-page-header-color: var(--t-text-color-default-secondary);
|
|
16
17
|
--tds-page-header-headline-color: var(--t-text-color-default-headline);
|
|
17
18
|
--tds-page-header-padding-x: var(--t-spacing-2);
|
|
18
19
|
--tds-page-header-padding-y: var(--t-spacing-2);
|
|
19
|
-
--tds-page-header-nav-padding-x:
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
20
|
+
--tds-page-header-nav-padding-x:
|
|
21
|
+
var(
|
|
22
|
+
--tds-page-header-padding-x,
|
|
23
|
+
var(--t-spacing-3)
|
|
24
|
+
);
|
|
25
|
+
--tds-page-header-nav-background:
|
|
26
|
+
linear-gradient(
|
|
27
|
+
180deg,
|
|
28
|
+
rgba(0, 0, 0, 0) 0%,
|
|
29
|
+
rgba(0, 0, 0, .1) 100%
|
|
30
|
+
);
|
|
28
31
|
--tds-page-header-nav-item-padding-x: var(--t-spacing-1);
|
|
29
32
|
--tds-page-header-nav-item-padding-y: var(--t-spacing-1);
|
|
30
33
|
--tds-page-header-nav-item-color: var(--t-text-color-default-primary);
|
|
31
|
-
--tds-page-header-nav-item-background-color:
|
|
32
|
-
|
|
33
|
-
|
|
34
|
+
--tds-page-header-nav-item-background-color:
|
|
35
|
+
var(
|
|
36
|
+
--t-fill-color-transparency-light-060
|
|
37
|
+
);
|
|
34
38
|
--tds-page-header-nav-item-border-width: 0;
|
|
35
39
|
|
|
36
|
-
--tds-page-header-nav-item-border-color:
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
40
|
+
--tds-page-header-nav-item-border-color:
|
|
41
|
+
var(
|
|
42
|
+
--tds-page-header-nav-item-background-color
|
|
43
|
+
);
|
|
44
|
+
--tds-page-header-nav-item-border-bottom-color:
|
|
45
|
+
var(
|
|
46
|
+
--t-border-color-default-base
|
|
47
|
+
);
|
|
42
48
|
|
|
43
49
|
--tds-page-header-nav-item-color-hover: var(--t-text-color-default-primary);
|
|
44
|
-
--tds-page-header-nav-item-background-color-hover:
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
+
--tds-page-header-nav-item-background-color-hover:
|
|
51
|
+
var(
|
|
52
|
+
--t-fill-color-neutral-080
|
|
53
|
+
);
|
|
54
|
+
--tds-page-header-nav-item-border-color-hover:
|
|
55
|
+
var(
|
|
56
|
+
--tds-page-header-nav-item-background-color-hover
|
|
57
|
+
);
|
|
50
58
|
|
|
51
|
-
--tds-page-header-nav-item-background-color-active:
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
59
|
+
--tds-page-header-nav-item-background-color-active:
|
|
60
|
+
var(
|
|
61
|
+
--t-fill-color-neutral-060
|
|
62
|
+
);
|
|
63
|
+
--tds-page-header-nav-item-border-color-active:
|
|
64
|
+
var(
|
|
65
|
+
--tds-page-header-nav-item-background-color-hover
|
|
66
|
+
);
|
|
57
67
|
|
|
58
|
-
--tds-page-header-nav-item-color-disabled:
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
68
|
+
--tds-page-header-nav-item-color-disabled:
|
|
69
|
+
var(
|
|
70
|
+
--t-text-color-default-disabled
|
|
71
|
+
);
|
|
72
|
+
--tds-page-header-nav-item-background-color-disabled:
|
|
73
|
+
var(
|
|
74
|
+
--t-fill-color-neutral-080
|
|
75
|
+
);
|
|
76
|
+
--tds-page-header-nav-item-border-color-disabled:
|
|
77
|
+
var(
|
|
78
|
+
--tds-page-header-nav-item-background-color-disabled
|
|
79
|
+
);
|
|
67
80
|
|
|
68
|
-
--tds-page-header-nav-item-color-selected:
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
81
|
+
--tds-page-header-nav-item-color-selected:
|
|
82
|
+
var(
|
|
83
|
+
--t-text-color-default-primary
|
|
84
|
+
);
|
|
85
|
+
--tds-page-header-nav-item-border-color-selected:
|
|
86
|
+
var(
|
|
87
|
+
--t-border-color-default-base
|
|
88
|
+
);
|
|
89
|
+
--tds-page-header-nav-item-background-color-selected:
|
|
90
|
+
var(
|
|
91
|
+
--t-fill-color-neutral-100
|
|
92
|
+
);
|
|
93
|
+
--tds-page-header-nav-item-border-bottom-color-selected:
|
|
94
|
+
var(
|
|
95
|
+
--tds-page-header-nav-item-background-color-selected
|
|
96
|
+
);
|
|
80
97
|
}
|
|
81
98
|
|
|
82
99
|
|
|
83
|
-
@media (width
|
|
100
|
+
@media (min-width: 720px) {
|
|
84
101
|
.tds-page-header {
|
|
85
102
|
--tds-page-header-padding-x: var(--t-spacing-3);
|
|
86
103
|
--tds-page-header-nav-background: transparent;
|
|
87
104
|
--tds-page-header-nav-item-padding-x: var(--t-spacing-2);
|
|
88
105
|
--tds-page-header-nav-item-border-width: 1px;
|
|
89
106
|
--tds-page-header-nav-item-color: var(--t-text-color-default-secondary);
|
|
90
|
-
--tds-page-header-nav-item-background-color:
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
--t-text-color-default-primary
|
|
95
|
-
);
|
|
107
|
+
--tds-page-header-nav-item-background-color:
|
|
108
|
+
var(
|
|
109
|
+
--t-fill-color-neutral-070
|
|
110
|
+
);
|
|
96
111
|
}
|
|
97
112
|
}
|
|
98
113
|
}
|
|
@@ -157,10 +172,10 @@
|
|
|
157
172
|
display: flex;
|
|
158
173
|
gap: var(--t-spacing-half);
|
|
159
174
|
padding: 0 var(--tds-page-header-nav-padding-x);
|
|
160
|
-
margin: 0 0 -1px
|
|
175
|
+
margin: 0 0 -1px;
|
|
161
176
|
overflow: auto;
|
|
162
|
-
background: var(--tds-page-header-nav-background);
|
|
163
177
|
list-style: none;
|
|
178
|
+
background: var(--tds-page-header-nav-background);
|
|
164
179
|
}
|
|
165
180
|
|
|
166
181
|
.tds-page-header nav[slot="navigation"] a,
|
|
@@ -168,19 +183,21 @@
|
|
|
168
183
|
.tds-page-header nav.tds-page-header__nav a,
|
|
169
184
|
.tds-page-header nav.tds-page-header__nav button {
|
|
170
185
|
display: inline-flex;
|
|
171
|
-
padding:
|
|
186
|
+
padding:
|
|
187
|
+
var(--tds-page-header-nav-item-padding-y)
|
|
172
188
|
var(--tds-page-header-nav-item-padding-x);
|
|
173
189
|
font-size: var(--t-font-size-md);
|
|
174
190
|
color: var(--tds-page-header-nav-item-color);
|
|
175
191
|
white-space: nowrap;
|
|
176
192
|
text-decoration: none;
|
|
177
193
|
-webkit-appearance: none;
|
|
178
|
-
|
|
179
|
-
|
|
194
|
+
-moz-appearance: none;
|
|
195
|
+
appearance: none;
|
|
180
196
|
cursor: pointer;
|
|
181
197
|
outline-offset: -2px;
|
|
182
198
|
background-color: var(--tds-page-header-nav-item-background-color);
|
|
183
|
-
border:
|
|
199
|
+
border:
|
|
200
|
+
var(--tds-page-header-nav-item-border-width) solid
|
|
184
201
|
var(--tds-page-header-nav-item-border-color);
|
|
185
202
|
border-bottom: 1px solid var(--tds-page-header-nav-item-border-bottom-color);
|
|
186
203
|
border-radius: var(--t-border-radius-md) var(--t-border-radius-md) 0 0;
|
|
@@ -190,18 +207,22 @@
|
|
|
190
207
|
.tds-page-header nav[slot="navigation"] button.selected,
|
|
191
208
|
.tds-page-header nav.tds-page-header__nav a.selected,
|
|
192
209
|
.tds-page-header nav.tds-page-header__nav button.selected {
|
|
193
|
-
--tds-page-header-nav-item-color:
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
210
|
+
--tds-page-header-nav-item-color:
|
|
211
|
+
var(
|
|
212
|
+
--tds-page-header-nav-item-color-selected
|
|
213
|
+
);
|
|
214
|
+
--tds-page-header-nav-item-border-color:
|
|
215
|
+
var(
|
|
216
|
+
--tds-page-header-nav-item-border-color-selected
|
|
217
|
+
);
|
|
218
|
+
--tds-page-header-nav-item-background-color:
|
|
219
|
+
var(
|
|
220
|
+
--tds-page-header-nav-item-background-color-selected
|
|
221
|
+
);
|
|
222
|
+
--tds-page-header-nav-item-border-bottom-color:
|
|
223
|
+
var(
|
|
224
|
+
--tds-page-header-nav-item-background-color-selected
|
|
225
|
+
);
|
|
205
226
|
}
|
|
206
227
|
|
|
207
228
|
.tds-page-header nav[slot="navigation"] a:not(.selected):hover,
|
|
@@ -209,12 +230,14 @@
|
|
|
209
230
|
.tds-page-header nav.tds-page-header__nav a:not(.selected):hover,
|
|
210
231
|
.tds-page-header nav.tds-page-header__nav button:not(.selected):hover {
|
|
211
232
|
--tds-page-header-nav-item-color: var(--tds-page-header-nav-item-color-hover);
|
|
212
|
-
--tds-page-header-nav-item-background-color:
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
233
|
+
--tds-page-header-nav-item-background-color:
|
|
234
|
+
var(
|
|
235
|
+
--tds-page-header-nav-item-background-color-hover
|
|
236
|
+
);
|
|
237
|
+
--tds-page-header-nav-item-border-color:
|
|
238
|
+
var(
|
|
239
|
+
--tds-page-header-nav-item-border-color-hover
|
|
240
|
+
);
|
|
218
241
|
}
|
|
219
242
|
|
|
220
243
|
.tds-page-header nav[slot="navigation"] a:not(.selected):active,
|
|
@@ -234,7 +257,7 @@
|
|
|
234
257
|
opacity: 1;
|
|
235
258
|
}
|
|
236
259
|
|
|
237
|
-
@media (width
|
|
260
|
+
@media (min-width: 720px) {
|
|
238
261
|
.tds-page-header__title-bar,
|
|
239
262
|
.tds-page-header--profile .tds-page-header__title-bar {
|
|
240
263
|
flex-direction: row;
|
|
@@ -329,7 +352,9 @@
|
|
|
329
352
|
color: var(--t-text-color-default-headline);
|
|
330
353
|
white-space: nowrap;
|
|
331
354
|
text-decoration: none;
|
|
332
|
-
appearance: none;
|
|
355
|
+
-webkit-appearance: none;
|
|
356
|
+
-moz-appearance: none;
|
|
357
|
+
appearance: none;
|
|
333
358
|
cursor: pointer;
|
|
334
359
|
outline: 0;
|
|
335
360
|
background-color: transparent;
|
|
@@ -347,14 +372,14 @@
|
|
|
347
372
|
white-space: nowrap;
|
|
348
373
|
}
|
|
349
374
|
|
|
350
|
-
|
|
375
|
+
.selected > :is(.tds-sidenav-item :is(a,button)) {
|
|
351
376
|
--tds-sidenav-item-nested-background: transparent;
|
|
352
377
|
--tds-sidenav-item-nested-border-color: var(--tds-sidenav-item-nested-border-color-selected);
|
|
353
378
|
font-weight: 600;
|
|
354
379
|
background-color: var(--tds-sidenav-item-background-selected);
|
|
355
380
|
}
|
|
356
381
|
|
|
357
|
-
|
|
382
|
+
:is(.selected > :is(.tds-sidenav-item :is(a,button))) .prefix,:is(.selected > :is(.tds-sidenav-item :is(a,button))) [slot="prefix"] {
|
|
358
383
|
color: var(--t-icon-color-default-primary);
|
|
359
384
|
}
|
|
360
385
|
|
|
@@ -376,6 +401,8 @@
|
|
|
376
401
|
|
|
377
402
|
:is(:is(.tds-sidenav-item :is(a,button)) :is(.prefix,[slot="prefix"])) svg {
|
|
378
403
|
display: block;
|
|
404
|
+
width: 16px;
|
|
405
|
+
height: 16px;
|
|
379
406
|
}
|
|
380
407
|
|
|
381
408
|
:is(.tds-sidenav-item :is(a,button)):has(.prefix,[slot="prefix"]) + .tds-sidenav-section {
|
|
@@ -470,6 +497,7 @@
|
|
|
470
497
|
display: flex;
|
|
471
498
|
align-items: center;
|
|
472
499
|
justify-content: center;
|
|
500
|
+
order: 0;
|
|
473
501
|
height: var(--t-container-size-md);
|
|
474
502
|
padding: 3px var(--t-spacing-1);
|
|
475
503
|
background-color: var(--t-fill-color-button-neutral-outline-dim-default);
|
|
@@ -487,36 +515,70 @@
|
|
|
487
515
|
|
|
488
516
|
.tds-sidenav-responsive-header .tds-sidenav-responsive-header-label {
|
|
489
517
|
flex: 1;
|
|
518
|
+
order: 1;
|
|
490
519
|
margin: 0;
|
|
491
520
|
font-size: var(--t-font-size-lg);
|
|
492
521
|
font-weight: var(--t-font-weight-medium);
|
|
493
522
|
color: var(--t-text-color-default-headline);
|
|
494
523
|
}
|
|
495
524
|
|
|
496
|
-
@media (max-width:
|
|
525
|
+
@media (max-width: 719px) {
|
|
497
526
|
.tds-sidenav-collapse {
|
|
527
|
+
display: none;
|
|
498
528
|
position: absolute;
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
padding: var(--t-spacing-2);
|
|
505
|
-
margin-top: 12px;
|
|
529
|
+
z-index: 10001;
|
|
530
|
+
max-width: min(448px, calc(100vw - 48px));
|
|
531
|
+
padding: 0;
|
|
532
|
+
margin: 12px 0;
|
|
533
|
+
overflow: hidden;
|
|
506
534
|
outline: 0;
|
|
507
|
-
background:
|
|
535
|
+
background: var(--t-surface-color-card);
|
|
508
536
|
border: 0;
|
|
509
537
|
border-radius: 6px;
|
|
510
538
|
box-shadow: 0 8px 20px 0 rgba(0, 0, 0, .25);
|
|
539
|
+
will-change: transform;
|
|
540
|
+
position-area: bottom span-right;
|
|
541
|
+
}
|
|
542
|
+
|
|
543
|
+
.tds-sidenav-collapse:popover-open,
|
|
544
|
+
.tds-sidenav-collapse.\:popover-open {
|
|
545
|
+
display: flex;
|
|
546
|
+
}
|
|
547
|
+
|
|
548
|
+
.tds-sidenav-scroll-container {
|
|
549
|
+
--webkit-overflow-scrolling: touch;
|
|
550
|
+
display: block;
|
|
551
|
+
width: 100%;
|
|
552
|
+
height: -moz-fit-content;
|
|
553
|
+
height: fit-content;
|
|
554
|
+
padding: var(--t-spacing-2);
|
|
555
|
+
overflow-y: auto;
|
|
556
|
+
}
|
|
557
|
+
|
|
558
|
+
.tds-sidenav-item :is(a, button) :is(.prefix, [slot="prefix"]) {
|
|
559
|
+
display: none;
|
|
511
560
|
}
|
|
512
561
|
}
|
|
513
562
|
|
|
514
|
-
@media (min-width:
|
|
563
|
+
@media (min-width: 720px) {
|
|
515
564
|
.tds-sidenav-responsive-header {
|
|
516
565
|
display: none;
|
|
517
566
|
}
|
|
518
567
|
}
|
|
519
568
|
|
|
569
|
+
:is(tds-sidenav,tds-sidenav-section,tds-sidenav-item):not(.hydrated) > :not([slot="ssr"]) {
|
|
570
|
+
display: none;
|
|
571
|
+
}
|
|
572
|
+
|
|
573
|
+
:is(tds-sidenav,tds-sidenav-section,tds-sidenav-item):not(.hydrated) > [slot="ssr"] {
|
|
574
|
+
display: block;
|
|
575
|
+
}
|
|
576
|
+
|
|
577
|
+
tds-sidenav-section:not(.hydrated) > [slot="ssr"] {
|
|
578
|
+
display: flex;
|
|
579
|
+
flex-direction: column;
|
|
580
|
+
}
|
|
581
|
+
|
|
520
582
|
/**
|
|
521
583
|
* Do not edit directly, this file was auto-generated.
|
|
522
584
|
*/
|
|
@@ -1136,7 +1198,9 @@
|
|
|
1136
1198
|
text-align: center;
|
|
1137
1199
|
text-decoration: none;
|
|
1138
1200
|
cursor: pointer;
|
|
1139
|
-
user-select: none;
|
|
1201
|
+
-webkit-user-select: none;
|
|
1202
|
+
-moz-user-select: none;
|
|
1203
|
+
user-select: none;
|
|
1140
1204
|
background-color: var(--tds-btn-bg);
|
|
1141
1205
|
border: var(--tds-btn-border-width) solid var(--tds-btn-border-color);
|
|
1142
1206
|
border-radius: var(--tds-btn-border-radius);
|