@planningcenter/tapestry 1.5.0-rc.10 → 1.5.0-rc.12

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.
Files changed (52) hide show
  1. package/dist/components/Banner/Banner.d.ts.map +1 -1
  2. package/dist/components/Banner/Banner.js.map +1 -1
  3. package/dist/components/button/BaseButton.d.ts +2 -2
  4. package/dist/components/button/BaseButton.d.ts.map +1 -1
  5. package/dist/components/button/BaseButton.js.map +1 -1
  6. package/dist/components/button/Button.d.ts +1 -1
  7. package/dist/components/button/Button.d.ts.map +1 -1
  8. package/dist/components/button/Button.js.map +1 -1
  9. package/dist/components/button/IconButton.d.ts +1 -1
  10. package/dist/components/button/IconButton.d.ts.map +1 -1
  11. package/dist/components/button/IconButton.js.map +1 -1
  12. package/dist/components/button/index.d.ts.map +1 -1
  13. package/dist/components/page-header/index.js +1 -1
  14. package/dist/components/sidenav/index.js +1 -1
  15. package/dist/components/sidenav/index.js.map +1 -1
  16. package/dist/index.css +144 -128
  17. package/dist/index.css.map +1 -1
  18. package/dist/tapestry-wc/dist/components/{p-8UBbpZ0c.js → p-C2Jj15mH.js} +2 -2
  19. package/dist/tapestry-wc/dist/components/p-C2Jj15mH.js.map +1 -0
  20. package/dist/tapestry-wc/dist/components/{p-DxaErtCG.js → p-Cuy415rf.js} +3 -3
  21. package/dist/tapestry-wc/dist/components/p-Cuy415rf.js.map +1 -0
  22. package/dist/tapestry-wc/dist/components/{p-Cht-ntUS.js → p-DSNIkNQb.js} +2 -2
  23. package/dist/tapestry-wc/dist/components/p-DSNIkNQb.js.map +1 -0
  24. package/dist/tapestry-wc/dist/components/{p-i08KYys-.js → p-_xUoKc6A.js} +3 -3
  25. package/dist/tapestry-wc/dist/components/p-_xUoKc6A.js.map +1 -0
  26. package/dist/tapestry-wc/dist/components/{p-rbR8aD1l.js → p-bMlwEklI.js} +3 -3
  27. package/dist/tapestry-wc/dist/components/p-bMlwEklI.js.map +1 -0
  28. package/dist/tapestry-wc/dist/components/tds-page-header-nav.js +2 -2
  29. package/dist/tapestry-wc/dist/components/tds-page-header-nav.js.map +1 -1
  30. package/dist/tapestry-wc/dist/components/tds-page-header.js +3 -3
  31. package/dist/tapestry-wc/dist/components/tds-page-header.js.map +1 -1
  32. package/dist/tapestry-wc/dist/components/tds-sidenav-item.js +3 -3
  33. package/dist/tapestry-wc/dist/components/tds-sidenav-item.js.map +1 -1
  34. package/dist/tapestry-wc/dist/components/tds-sidenav-responsive-header.js +2 -2
  35. package/dist/tapestry-wc/dist/components/tds-sidenav-responsive-header.js.map +1 -1
  36. package/dist/tapestry-wc/dist/components/tds-sidenav-section.js +3 -3
  37. package/dist/tapestry-wc/dist/components/tds-sidenav-section.js.map +1 -1
  38. package/dist/tapestry-wc/dist/components/tds-sidenav.js +5 -5
  39. package/dist/tapestry-wc/dist/components/tds-sidenav.js.map +1 -1
  40. package/dist/unstable.css +216 -151
  41. package/dist/unstable.css.map +1 -1
  42. package/dist/utilities/buttonLinkShared.d.ts.map +1 -1
  43. package/dist/utilities/buttonLinkShared.js +4 -3
  44. package/dist/utilities/buttonLinkShared.js.map +1 -1
  45. package/dist/webComponents.css +216 -151
  46. package/dist/webComponents.css.map +1 -1
  47. package/package.json +3 -3
  48. package/dist/tapestry-wc/dist/components/p-8UBbpZ0c.js.map +0 -1
  49. package/dist/tapestry-wc/dist/components/p-Cht-ntUS.js.map +0 -1
  50. package/dist/tapestry-wc/dist/components/p-DxaErtCG.js.map +0 -1
  51. package/dist/tapestry-wc/dist/components/p-i08KYys-.js.map +0 -1
  52. package/dist/tapestry-wc/dist/components/p-rbR8aD1l.js.map +0 -1
package/dist/components/Banner/Banner.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../../src/components/Banner/Banner.tsx"],"names":[],"mappings":"AAAA,OAAO,cAAc,CAAA;AAIrB,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,KAAK,WAAW,GAAG;IACjB,2CAA2C;IAC3C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAE1B;;;OAGG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IAEnB;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;IAE9D,kCAAkC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAA;AAuBD,eAAO,MAAM,MAAM,uCAKhB,WAAW,sBAcb,CAAA;AAED,eAAe,MAAM,CAAA"}
1
+ {"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../../src/components/Banner/Banner.tsx"],"names":[],"mappings":"AAAA,OAAO,cAAc,CAAA;AAIrB,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,KAAK,WAAW,GAAG;IACjB,2CAA2C;IAC3C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IAEzB;;;OAGG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAA;IAElB;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAA;IAE7D,kCAAkC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAuBD,eAAO,MAAM,MAAM,uCAKhB,WAAW,sBAcb,CAAA;AAED,eAAe,MAAM,CAAA"}
package/dist/components/Banner/Banner.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Banner.js","sources":["../../../src/components/Banner/Banner.tsx"],"sourcesContent":["import \"./Banner.css\"\n\nimport Icon from \"@utilities/Icon\"\nimport classnames from \"classnames\"\nimport React from \"react\"\n\ntype BannerProps = {\n /** The content to display in the banner */\n children: React.ReactNode,\n\n /**\n * Set the size of the banner (adjusts padding)\n * @default \"md\"\n */\n size?: \"sm\" | \"md\",\n\n /**\n * Set the status of the banner\n * @default \"neutral\"\n */\n status?: \"neutral\" | \"info\" | \"warning\" | \"error\" | \"success\",\n\n /** Set the title of the banner */\n title?: string,\n}\n\nconst ICONS = {\n error: \"general#exclamation-triangle\",\n info: \"general#info-circle\",\n neutral: null,\n success: \"general#check-circle\",\n warning: \"general#exclamation-triangle\",\n}\n\nconst SIZES = {\n md: \"\",\n sm: \"t-banner--sm\",\n}\n\nconst STATUSES = {\n error: \"t-banner--status-error\",\n info: \"t-banner--status-info\",\n neutral: \"t-banner--status-neutral\",\n success: \"t-banner--status-success\",\n warning: \"t-banner--status-warning\",\n}\n\nexport const Banner = ({\n children = \"\",\n size = \"md\",\n status = \"neutral\",\n title = \"\",\n}: BannerProps) => {\n return (\n <div className={classnames(\"t-banner\", SIZES[size], STATUSES[status])}>\n {ICONS[status] && (\n <span className=\"t-banner-icon\">\n <Icon symbol={ICONS[status]} aria-hidden />\n </span>\n )}\n <div>\n {title && <span className=\"t-banner-title\">{title}</span>}\n <div className=\"t-banner-body\">{children}</div>\n </div>\n </div>\n )\n}\n\nexport default Banner\n"],"names":[],"mappings":";;;;AA0BA,MAAM,KAAK,GAAG;AACZ,IAAA,KAAK,EAAE,8BAA8B;AACrC,IAAA,IAAI,EAAE,qBAAqB;AAC3B,IAAA,OAAO,EAAE,IAAI;AACb,IAAA,OAAO,EAAE,sBAAsB;AAC/B,IAAA,OAAO,EAAE,8BAA8B;CACxC,CAAA;AAED,MAAM,KAAK,GAAG;AACZ,IAAA,EAAE,EAAE,EAAE;AACN,IAAA,EAAE,EAAE,cAAc;CACnB,CAAA;AAED,MAAM,QAAQ,GAAG;AACf,IAAA,KAAK,EAAE,wBAAwB;AAC/B,IAAA,IAAI,EAAE,uBAAuB;AAC7B,IAAA,OAAO,EAAE,0BAA0B;AACnC,IAAA,OAAO,EAAE,0BAA0B;AACnC,IAAA,OAAO,EAAE,0BAA0B;CACpC,CAAA;MAEY,MAAM,GAAG,CAAC,EACrB,QAAQ,GAAG,EAAE,EACb,IAAI,GAAG,IAAI,EACX,MAAM,GAAG,SAAS,EAClB,KAAK,GAAG,EAAE,GACE,KAAI;AAChB,IAAA,QACE,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,UAAU,EAAE,KAAK,CAAC,IAAI,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC,EAAA;QAClE,KAAK,CAAC,MAAM,CAAC,KACZ,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAC,eAAe,EAAA;YAC7B,KAAC,CAAA,aAAA,CAAA,IAAI,EAAC,EAAA,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,EAAgB,aAAA,EAAA,IAAA,EAAA,CAAA,CACtC,CACR;AACD,QAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,IAAA;AACG,YAAA,KAAK,IAAI,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAC,gBAAgB,EAAA,EAAE,KAAK,CAAQ;YACzD,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,eAAe,EAAA,EAAE,QAAQ,CAAO,CAC3C,CACF,EACP;AACH;;;;"}
1
+ {"version":3,"file":"Banner.js","sources":["../../../src/components/Banner/Banner.tsx"],"sourcesContent":["import \"./Banner.css\"\n\nimport Icon from \"@utilities/Icon\"\nimport classnames from \"classnames\"\nimport React from \"react\"\n\ntype BannerProps = {\n /** The content to display in the banner */\n children: React.ReactNode\n\n /**\n * Set the size of the banner (adjusts padding)\n * @default \"md\"\n */\n size?: \"sm\" | \"md\"\n\n /**\n * Set the status of the banner\n * @default \"neutral\"\n */\n status?: \"neutral\" | \"info\" | \"warning\" | \"error\" | \"success\"\n\n /** Set the title of the banner */\n title?: string\n}\n\nconst ICONS = {\n error: \"general#exclamation-triangle\",\n info: \"general#info-circle\",\n neutral: null,\n success: \"general#check-circle\",\n warning: \"general#exclamation-triangle\",\n}\n\nconst SIZES = {\n md: \"\",\n sm: \"t-banner--sm\",\n}\n\nconst STATUSES = {\n error: \"t-banner--status-error\",\n info: \"t-banner--status-info\",\n neutral: \"t-banner--status-neutral\",\n success: \"t-banner--status-success\",\n warning: \"t-banner--status-warning\",\n}\n\nexport const Banner = ({\n children = \"\",\n size = \"md\",\n status = \"neutral\",\n title = \"\",\n}: BannerProps) => {\n return (\n <div className={classnames(\"t-banner\", SIZES[size], STATUSES[status])}>\n {ICONS[status] && (\n <span className=\"t-banner-icon\">\n <Icon symbol={ICONS[status]} aria-hidden />\n </span>\n )}\n <div>\n {title && <span className=\"t-banner-title\">{title}</span>}\n <div className=\"t-banner-body\">{children}</div>\n </div>\n </div>\n )\n}\n\nexport default Banner\n"],"names":[],"mappings":";;;;AA0BA,MAAM,KAAK,GAAG;AACZ,IAAA,KAAK,EAAE,8BAA8B;AACrC,IAAA,IAAI,EAAE,qBAAqB;AAC3B,IAAA,OAAO,EAAE,IAAI;AACb,IAAA,OAAO,EAAE,sBAAsB;AAC/B,IAAA,OAAO,EAAE,8BAA8B;CACxC,CAAA;AAED,MAAM,KAAK,GAAG;AACZ,IAAA,EAAE,EAAE,EAAE;AACN,IAAA,EAAE,EAAE,cAAc;CACnB,CAAA;AAED,MAAM,QAAQ,GAAG;AACf,IAAA,KAAK,EAAE,wBAAwB;AAC/B,IAAA,IAAI,EAAE,uBAAuB;AAC7B,IAAA,OAAO,EAAE,0BAA0B;AACnC,IAAA,OAAO,EAAE,0BAA0B;AACnC,IAAA,OAAO,EAAE,0BAA0B;CACpC,CAAA;MAEY,MAAM,GAAG,CAAC,EACrB,QAAQ,GAAG,EAAE,EACb,IAAI,GAAG,IAAI,EACX,MAAM,GAAG,SAAS,EAClB,KAAK,GAAG,EAAE,GACE,KAAI;AAChB,IAAA,QACE,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,UAAU,EAAE,KAAK,CAAC,IAAI,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC,EAAA;QAClE,KAAK,CAAC,MAAM,CAAC,KACZ,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAC,eAAe,EAAA;YAC7B,KAAC,CAAA,aAAA,CAAA,IAAI,EAAC,EAAA,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,EAAgB,aAAA,EAAA,IAAA,EAAA,CAAA,CACtC,CACR;AACD,QAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,IAAA;AACG,YAAA,KAAK,IAAI,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAC,gBAAgB,EAAA,EAAE,KAAK,CAAQ;YACzD,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,eAAe,EAAA,EAAE,QAAQ,CAAO,CAC3C,CACF,EACP;AACH;;;;"}
package/dist/components/button/BaseButton.d.ts CHANGED
@@ -1,10 +1,10 @@
1
1
  import "./btn.css";
2
2
  import React, { ButtonHTMLAttributes } from "react";
3
3
  import { BaseComponentProps, ComponentKind } from "../../utilities/buttonLinkShared";
4
- export interface BaseButtonProps extends Omit<BaseComponentProps, 'kind'> {
4
+ export interface BaseButtonProps extends Omit<BaseComponentProps, "kind"> {
5
5
  kind?: ComponentKind;
6
6
  label: React.ReactNode;
7
7
  }
8
- export type BaseButtonElementProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, keyof BaseButtonProps | 'children'> & BaseButtonProps;
8
+ export type BaseButtonElementProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, keyof BaseButtonProps | "children"> & BaseButtonProps;
9
9
  export declare const BaseButton: React.ForwardRefExoticComponent<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "children" | keyof BaseButtonProps> & BaseButtonProps & React.RefAttributes<HTMLButtonElement>>;
10
10
  //# sourceMappingURL=BaseButton.d.ts.map
package/dist/components/button/BaseButton.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"BaseButton.d.ts","sourceRoot":"","sources":["../../../src/components/button/BaseButton.tsx"],"names":[],"mappings":"AAAA,OAAO,WAAW,CAAC;AAGnB,OAAO,KAAK,EAAE,EAAE,oBAAoB,EAAc,MAAM,OAAO,CAAC;AAEhE,OAAO,EACL,kBAAkB,EAGlB,aAAa,EAGd,MAAM,kCAAkC,CAAC;AAE1C,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,kBAAkB,EAAE,MAAM,CAAC;IACvE,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;CACxB;AAED,MAAM,MAAM,sBAAsB,GAAG,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,eAAe,GAAG,UAAU,CAAC,GAAG,eAAe,CAAC;AAezI,eAAO,MAAM,UAAU,qLAoBtB,CAAC"}
1
+ {"version":3,"file":"BaseButton.d.ts","sourceRoot":"","sources":["../../../src/components/button/BaseButton.tsx"],"names":[],"mappings":"AAAA,OAAO,WAAW,CAAA;AAGlB,OAAO,KAAK,EAAE,EAAE,oBAAoB,EAAc,MAAM,OAAO,CAAA;AAE/D,OAAO,EACL,kBAAkB,EAGlB,aAAa,EAGd,MAAM,kCAAkC,CAAA;AAEzC,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,kBAAkB,EAAE,MAAM,CAAC;IACvE,IAAI,CAAC,EAAE,aAAa,CAAA;IACpB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;CACvB;AAED,MAAM,MAAM,sBAAsB,GAAG,IAAI,CACvC,oBAAoB,CAAC,iBAAiB,CAAC,EACvC,MAAM,eAAe,GAAG,UAAU,CACnC,GACC,eAAe,CAAA;AAejB,eAAO,MAAM,UAAU,qLA+BtB,CAAA"}
package/dist/components/button/BaseButton.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"BaseButton.js","sources":["../../../src/components/button/BaseButton.tsx"],"sourcesContent":["import \"./btn.css\";\n\nimport classNames from \"classnames\";\nimport React, { ButtonHTMLAttributes, forwardRef } from \"react\";\n\nimport {\n BaseComponentProps,\n COMPONENT_KIND_CLASS_MAP,\n COMPONENT_SIZE_CLASS_MAP,\n ComponentKind,\n ComponentSize,\n enhanceElementWithClassName\n} from \"../../utilities/buttonLinkShared\";\n\nexport interface BaseButtonProps extends Omit<BaseComponentProps, 'kind'> {\n kind?: ComponentKind;\n label: React.ReactNode;\n}\n\nexport type BaseButtonElementProps = Omit<ButtonHTMLAttributes<HTMLButtonElement>, keyof BaseButtonProps | 'children'> & BaseButtonProps;\n\nconst buildComponentClassName = (\n size?: ComponentSize,\n kind?: ComponentKind,\n className?: string\n): string => {\n return classNames(\n kind && \"tds-btn\",\n size && size !== \"md\" && COMPONENT_SIZE_CLASS_MAP[size],\n kind && COMPONENT_KIND_CLASS_MAP[kind],\n className\n );\n};\n\nexport const BaseButton = forwardRef<HTMLButtonElement, BaseButtonElementProps>(\n ({ size, prefix, suffix, kind = \"secondary\", label, className, ...restProps }: BaseButtonElementProps, ref) => {\n const combinedClassName = buildComponentClassName(size, kind, className);\n\n const prefixElement = enhanceElementWithClassName(prefix, \"prefix\");\n const suffixElement = enhanceElementWithClassName(suffix, \"suffix\");\n\n return (\n <button\n type=\"button\"\n className={combinedClassName}\n ref={ref}\n {...restProps}\n >\n {prefixElement}\n {label}\n {suffixElement}\n </button>\n );\n }\n);\n\nBaseButton.displayName = \"BaseButton\";\n"],"names":[],"mappings":";;;;AAqBA,MAAM,uBAAuB,GAAG,CAC9B,IAAoB,EACpB,IAAoB,EACpB,SAAkB,KACR;IACV,OAAO,UAAU,CACf,IAAI,IAAI,SAAS,EACjB,IAAI,IAAI,IAAI,KAAK,IAAI,IAAI,wBAAwB,CAAC,IAAI,CAAC,EACvD,IAAI,IAAI,wBAAwB,CAAC,IAAI,CAAC,EACtC,SAAS,CACV,CAAC;AACJ,CAAC,CAAC;AAEK,MAAM,UAAU,GAAG,UAAU,CAClC,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,GAAG,WAAW,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,SAAS,EAA0B,EAAE,GAAG,KAAI;IAC5G,MAAM,iBAAiB,GAAG,uBAAuB,CAAC,IAAI,EAAE,IAAI,EAAE,SAAS,CAAC,CAAC;IAEzE,MAAM,aAAa,GAAG,2BAA2B,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;IACpE,MAAM,aAAa,GAAG,2BAA2B,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;AAEpE,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,iBAAiB,EAC5B,GAAG,EAAE,GAAG,KACJ,SAAS,EAAA;QAEZ,aAAa;QACb,KAAK;QACL,aAAa,CACP,EACT;AACJ,CAAC,EACD;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY;;;;"}
1
+ {"version":3,"file":"BaseButton.js","sources":["../../../src/components/button/BaseButton.tsx"],"sourcesContent":["import \"./btn.css\"\n\nimport classNames from \"classnames\"\nimport React, { ButtonHTMLAttributes, forwardRef } from \"react\"\n\nimport {\n BaseComponentProps,\n COMPONENT_KIND_CLASS_MAP,\n COMPONENT_SIZE_CLASS_MAP,\n ComponentKind,\n ComponentSize,\n enhanceElementWithClassName,\n} from \"../../utilities/buttonLinkShared\"\n\nexport interface BaseButtonProps extends Omit<BaseComponentProps, \"kind\"> {\n kind?: ComponentKind\n label: React.ReactNode\n}\n\nexport type BaseButtonElementProps = Omit<\n ButtonHTMLAttributes<HTMLButtonElement>,\n keyof BaseButtonProps | \"children\"\n> &\n BaseButtonProps\n\nconst buildComponentClassName = (\n size?: ComponentSize,\n kind?: ComponentKind,\n className?: string\n): string => {\n return classNames(\n kind && \"tds-btn\",\n size && size !== \"md\" && COMPONENT_SIZE_CLASS_MAP[size],\n kind && COMPONENT_KIND_CLASS_MAP[kind],\n className\n )\n}\n\nexport const BaseButton = forwardRef<HTMLButtonElement, BaseButtonElementProps>(\n (\n {\n size,\n prefix,\n suffix,\n kind = \"secondary\",\n label,\n className,\n ...restProps\n }: BaseButtonElementProps,\n ref\n ) => {\n const combinedClassName = buildComponentClassName(size, kind, className)\n\n const prefixElement = enhanceElementWithClassName(prefix, \"prefix\")\n const suffixElement = enhanceElementWithClassName(suffix, \"suffix\")\n\n return (\n <button\n type=\"button\"\n className={combinedClassName}\n ref={ref}\n {...restProps}\n >\n {prefixElement}\n {label}\n {suffixElement}\n </button>\n )\n }\n)\n\nBaseButton.displayName = \"BaseButton\"\n"],"names":[],"mappings":";;;;AAyBA,MAAM,uBAAuB,GAAG,CAC9B,IAAoB,EACpB,IAAoB,EACpB,SAAkB,KACR;IACV,OAAO,UAAU,CACf,IAAI,IAAI,SAAS,EACjB,IAAI,IAAI,IAAI,KAAK,IAAI,IAAI,wBAAwB,CAAC,IAAI,CAAC,EACvD,IAAI,IAAI,wBAAwB,CAAC,IAAI,CAAC,EACtC,SAAS,CACV,CAAA;AACH,CAAC,CAAA;AAEM,MAAM,UAAU,GAAG,UAAU,CAClC,CACE,EACE,IAAI,EACJ,MAAM,EACN,MAAM,EACN,IAAI,GAAG,WAAW,EAClB,KAAK,EACL,SAAS,EACT,GAAG,SAAS,EACW,EACzB,GAAG,KACD;IACF,MAAM,iBAAiB,GAAG,uBAAuB,CAAC,IAAI,EAAE,IAAI,EAAE,SAAS,CAAC,CAAA;IAExE,MAAM,aAAa,GAAG,2BAA2B,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAA;IACnE,MAAM,aAAa,GAAG,2BAA2B,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAA;AAEnE,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,iBAAiB,EAC5B,GAAG,EAAE,GAAG,KACJ,SAAS,EAAA;QAEZ,aAAa;QACb,KAAK;QACL,aAAa,CACP,EACV;AACH,CAAC,EACF;AAED,UAAU,CAAC,WAAW,GAAG,YAAY;;;;"}
package/dist/components/button/Button.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import "./btn.css";
2
2
  import React from "react";
3
3
  import { BaseButtonElementProps } from "./BaseButton";
4
- export type ButtonElementProps = Omit<BaseButtonElementProps, 'label'> & {
4
+ export type ButtonElementProps = Omit<BaseButtonElementProps, "label"> & {
5
5
  label: string;
6
6
  };
7
7
  /**
package/dist/components/button/Button.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,WAAW,CAAC;AAEnB,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAc,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAElE,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,sBAAsB,EAAE,OAAO,CAAC,GAAG;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AAE3F;;;;;;GAMG;AACH,eAAO,MAAM,MAAM;WAT+D,MAAM;2CAavF,CAAC"}
1
+ {"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,WAAW,CAAA;AAElB,OAAO,KAAqB,MAAM,OAAO,CAAA;AAEzC,OAAO,EAAc,sBAAsB,EAAE,MAAM,cAAc,CAAA;AAEjE,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,sBAAsB,EAAE,OAAO,CAAC,GAAG;IACvE,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED;;;;;;GAMG;AACH,eAAO,MAAM,MAAM;WAVV,MAAM;2CAcd,CAAA"}
package/dist/components/button/Button.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Button.js","sources":["../../../src/components/button/Button.tsx"],"sourcesContent":["import \"./btn.css\";\n\nimport React, { forwardRef } from \"react\";\n\nimport { BaseButton, BaseButtonElementProps } from \"./BaseButton\";\n\nexport type ButtonElementProps = Omit<BaseButtonElementProps, 'label'> & { label: string };\n\n/**\n * A button component that renders as a button element.\n * Supports various sizes, styles, and content types.\n * Label must be a string.\n *\n * @component\n */\nexport const Button = forwardRef<HTMLButtonElement, ButtonElementProps>(\n (props, ref) => {\n return <BaseButton {...props} ref={ref} />;\n }\n);\n\nButton.displayName = \"Button\";\n"],"names":[],"mappings":";;;AAQA;;;;;;AAMG;AACU,MAAA,MAAM,GAAG,UAAU,CAC9B,CAAC,KAAK,EAAE,GAAG,KAAI;IACb,OAAO,KAAA,CAAA,aAAA,CAAC,UAAU,EAAK,EAAA,GAAA,KAAK,EAAE,GAAG,EAAE,GAAG,EAAA,CAAI,CAAC;AAC7C,CAAC,EACD;AAEF,MAAM,CAAC,WAAW,GAAG,QAAQ;;;;"}
1
+ {"version":3,"file":"Button.js","sources":["../../../src/components/button/Button.tsx"],"sourcesContent":["import \"./btn.css\"\n\nimport React, { forwardRef } from \"react\"\n\nimport { BaseButton, BaseButtonElementProps } from \"./BaseButton\"\n\nexport type ButtonElementProps = Omit<BaseButtonElementProps, \"label\"> & {\n label: string\n}\n\n/**\n * A button component that renders as a button element.\n * Supports various sizes, styles, and content types.\n * Label must be a string.\n *\n * @component\n */\nexport const Button = forwardRef<HTMLButtonElement, ButtonElementProps>(\n (props, ref) => {\n return <BaseButton {...props} ref={ref} />\n }\n)\n\nButton.displayName = \"Button\"\n"],"names":[],"mappings":";;;AAUA;;;;;;AAMG;AACU,MAAA,MAAM,GAAG,UAAU,CAC9B,CAAC,KAAK,EAAE,GAAG,KAAI;IACb,OAAO,KAAA,CAAA,aAAA,CAAC,UAAU,EAAK,EAAA,GAAA,KAAK,EAAE,GAAG,EAAE,GAAG,EAAA,CAAI,CAAA;AAC5C,CAAC,EACF;AAED,MAAM,CAAC,WAAW,GAAG,QAAQ;;;;"}
package/dist/components/button/IconButton.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import "./btn.css";
2
2
  import React from "react";
3
3
  import { BaseButtonElementProps } from "./BaseButton";
4
- export type IconButtonProps = Omit<BaseButtonElementProps, 'label'> & {
4
+ export type IconButtonProps = Omit<BaseButtonElementProps, "label"> & {
5
5
  "aria-label": string;
6
6
  icon: React.ReactNode;
7
7
  };
package/dist/components/button/IconButton.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../src/components/button/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,WAAW,CAAC;AAGnB,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAc,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAElE,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,sBAAsB,EAAE,OAAO,CAAC,GAAG;IACpE,YAAY,EAAE,MAAM,CAAC;IACrB,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;CACvB,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,UAAU;kBAVP,MAAM;UACd,KAAK,CAAC,SAAS;2CAsBtB,CAAC"}
1
+ {"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../src/components/button/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,WAAW,CAAA;AAGlB,OAAO,KAAqB,MAAM,OAAO,CAAA;AAEzC,OAAO,EAAc,sBAAsB,EAAE,MAAM,cAAc,CAAA;AAEjE,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,sBAAsB,EAAE,OAAO,CAAC,GAAG;IACpE,YAAY,EAAE,MAAM,CAAA;IACpB,IAAI,EAAE,KAAK,CAAC,SAAS,CAAA;CACtB,CAAA;AAED;;;;;GAKG;AACH,eAAO,MAAM,UAAU;kBAVP,MAAM;UACd,KAAK,CAAC,SAAS;2CAsBtB,CAAA"}
package/dist/components/button/IconButton.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"IconButton.js","sources":["../../../src/components/button/IconButton.tsx"],"sourcesContent":["import \"./btn.css\";\n\nimport classNames from \"classnames\";\nimport React, { forwardRef } from \"react\";\n\nimport { BaseButton, BaseButtonElementProps } from \"./BaseButton\";\n\nexport type IconButtonProps = Omit<BaseButtonElementProps, 'label'> & {\n \"aria-label\": string;\n icon: React.ReactNode;\n};\n\n/**\n * An icon-only button component that renders as a button element.\n * Requires an icon and aria-label for accessibility.\n *\n * @component\n */\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n ({ icon, className, ...restProps }: IconButtonProps, ref) => {\n const iconOnlyClassName = classNames(\"tds-btn--icononly\", className);\n\n return (\n <BaseButton\n {...restProps}\n label={icon}\n className={iconOnlyClassName}\n ref={ref}\n />\n );\n }\n);\n\nIconButton.displayName = \"IconButton\";\n"],"names":[],"mappings":";;;;AAYA;;;;;AAKG;AACU,MAAA,UAAU,GAAG,UAAU,CAClC,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,SAAS,EAAmB,EAAE,GAAG,KAAI;IAC1D,MAAM,iBAAiB,GAAG,UAAU,CAAC,mBAAmB,EAAE,SAAS,CAAC,CAAC;AAErE,IAAA,QACE,KAAC,CAAA,aAAA,CAAA,UAAU,OACL,SAAS,EACb,KAAK,EAAE,IAAI,EACX,SAAS,EAAE,iBAAiB,EAC5B,GAAG,EAAE,GAAG,EAAA,CACR,EACF;AACJ,CAAC,EACD;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY;;;;"}
1
+ {"version":3,"file":"IconButton.js","sources":["../../../src/components/button/IconButton.tsx"],"sourcesContent":["import \"./btn.css\"\n\nimport classNames from \"classnames\"\nimport React, { forwardRef } from \"react\"\n\nimport { BaseButton, BaseButtonElementProps } from \"./BaseButton\"\n\nexport type IconButtonProps = Omit<BaseButtonElementProps, \"label\"> & {\n \"aria-label\": string\n icon: React.ReactNode\n}\n\n/**\n * An icon-only button component that renders as a button element.\n * Requires an icon and aria-label for accessibility.\n *\n * @component\n */\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n ({ icon, className, ...restProps }: IconButtonProps, ref) => {\n const iconOnlyClassName = classNames(\"tds-btn--icononly\", className)\n\n return (\n <BaseButton\n {...restProps}\n label={icon}\n className={iconOnlyClassName}\n ref={ref}\n />\n )\n }\n)\n\nIconButton.displayName = \"IconButton\"\n"],"names":[],"mappings":";;;;AAYA;;;;;AAKG;AACU,MAAA,UAAU,GAAG,UAAU,CAClC,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,SAAS,EAAmB,EAAE,GAAG,KAAI;IAC1D,MAAM,iBAAiB,GAAG,UAAU,CAAC,mBAAmB,EAAE,SAAS,CAAC,CAAA;AAEpE,IAAA,QACE,KAAC,CAAA,aAAA,CAAA,UAAU,OACL,SAAS,EACb,KAAK,EAAE,IAAI,EACX,SAAS,EAAE,iBAAiB,EAC5B,GAAG,EAAE,GAAG,EAAA,CACR,EACH;AACH,CAAC,EACF;AAED,UAAU,CAAC,WAAW,GAAG,YAAY;;;;"}
package/dist/components/button/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,WAAW,CAAC;AAEnB,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,WAAW,CAAA;AAElB,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AACjC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA"}
package/dist/components/page-header/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import '../../tapestry-wc/dist/components/p-Cht-ntUS.js';
1
+ import '../../tapestry-wc/dist/components/p-DSNIkNQb.js';
2
2
  import { defineCustomElement } from '../../tapestry-wc/dist/components/tds-page-header.js';
3
3
  import { defineCustomElement as defineCustomElement$1 } from '../../tapestry-wc/dist/components/tds-page-header-nav.js';
4
4
 
package/dist/components/sidenav/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import '../../tapestry-wc/dist/components/p-Cht-ntUS.js';
1
+ import '../../tapestry-wc/dist/components/p-DSNIkNQb.js';
2
2
  import { defineCustomElement } from '../../tapestry-wc/dist/components/tds-sidenav.js';
3
3
  import { defineCustomElement as defineCustomElement$1 } from '../../tapestry-wc/dist/components/tds-sidenav-item.js';
4
4
  import { defineCustomElement as defineCustomElement$3 } from '../../tapestry-wc/dist/components/tds-sidenav-responsive-header.js';
package/dist/components/sidenav/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../src/components/sidenav/index.tsx"],"sourcesContent":["import \"./index.css\"\n\nimport { defineCustomElementTdsSidenav, defineCustomElementTdsSidenavItem, defineCustomElementTdsSidenavResponsiveHeader, defineCustomElementTdsSidenavSection } from \"tapestry-wc\"\n\ndefineCustomElementTdsSidenav()\ndefineCustomElementTdsSidenavItem()\ndefineCustomElementTdsSidenavSection()\ndefineCustomElementTdsSidenavResponsiveHeader()\n"],"names":["defineCustomElementTdsSidenav","defineCustomElementTdsSidenavItem","defineCustomElementTdsSidenavSection","defineCustomElementTdsSidenavResponsiveHeader"],"mappings":";;;;;;AAIAA,mBAA6B,EAAE,CAAA;AAC/BC,qBAAiC,EAAE,CAAA;AACnCC,qBAAoC,EAAE,CAAA;AACtCC,qBAA6C,EAAE"}
1
+ {"version":3,"file":"index.js","sources":["../../../src/components/sidenav/index.tsx"],"sourcesContent":["import \"./index.css\"\n\nimport {\n defineCustomElementTdsSidenav,\n defineCustomElementTdsSidenavItem,\n defineCustomElementTdsSidenavResponsiveHeader,\n defineCustomElementTdsSidenavSection,\n} from \"tapestry-wc\"\n\ndefineCustomElementTdsSidenav()\ndefineCustomElementTdsSidenavItem()\ndefineCustomElementTdsSidenavSection()\ndefineCustomElementTdsSidenavResponsiveHeader()\n"],"names":["defineCustomElementTdsSidenav","defineCustomElementTdsSidenavItem","defineCustomElementTdsSidenavSection","defineCustomElementTdsSidenavResponsiveHeader"],"mappings":";;;;;;AASAA,mBAA6B,EAAE,CAAA;AAC/BC,qBAAiC,EAAE,CAAA;AACnCC,qBAAoC,EAAE,CAAA;AACtCC,qBAA6C,EAAE"}
package/dist/index.css CHANGED
@@ -552,96 +552,83 @@
552
552
 
553
553
  @layer t-component {
554
554
  .tds-page-header {
555
- --tds-page-header-background-color: var(--t-fill-color-product-current-gradient-tint, var(--t-surface-color-card));
556
- --tds-page-header-background-color-inactive:
557
- var(
558
- --t-fill-color-transparency-dark-010
559
- );
555
+ --tds-page-header-background-color: var(
556
+ --t-fill-color-product-current-gradient-tint,
557
+ var(--t-surface-color-card)
558
+ );
559
+ --tds-page-header-background-color-inactive: var(
560
+ --t-fill-color-transparency-dark-010
561
+ );
560
562
  --tds-page-header-color: var(--t-text-color-default-secondary);
561
563
  --tds-page-header-headline-color: var(--t-text-color-default-headline);
562
564
  --tds-page-header-padding-x: var(--t-spacing-2);
563
565
  --tds-page-header-padding-y: var(--t-spacing-2);
564
- --tds-page-header-nav-padding-x:
565
- var(
566
- --tds-page-header-padding-x,
567
- var(--t-spacing-3)
568
- );
569
- --tds-page-header-nav-background:
570
- linear-gradient(
571
- 180deg,
572
- rgba(0, 0, 0, 0) 0%,
573
- rgba(0, 0, 0, .1) 100%
574
- );
566
+ --tds-page-header-nav-padding-x: var(
567
+ --tds-page-header-padding-x,
568
+ var(--t-spacing-3)
569
+ );
570
+ --tds-page-header-nav-background: linear-gradient(
571
+ 180deg,
572
+ rgba(0, 0, 0, 0) 0%,
573
+ rgba(0, 0, 0, 0.1) 100%
574
+ );
575
575
  --tds-page-header-nav-item-padding-x: var(--t-spacing-1);
576
576
  --tds-page-header-nav-item-padding-y: var(--t-spacing-1);
577
577
  --tds-page-header-nav-item-color: var(--t-text-color-default-primary);
578
- --tds-page-header-nav-item-background-color:
579
- var(
580
- --t-fill-color-transparency-light-060
581
- );
578
+ --tds-page-header-nav-item-background-color: var(
579
+ --t-fill-color-transparency-light-060
580
+ );
582
581
  --tds-page-header-nav-item-border-width: 0;
583
582
 
584
- --tds-page-header-nav-item-border-color:
585
- var(
586
- --tds-page-header-nav-item-background-color
587
- );
588
- --tds-page-header-nav-item-border-bottom-color:
589
- var(
590
- --t-border-color-default-base
591
- );
583
+ --tds-page-header-nav-item-border-color: var(
584
+ --tds-page-header-nav-item-background-color
585
+ );
586
+ --tds-page-header-nav-item-border-bottom-color: var(
587
+ --t-border-color-default-base
588
+ );
592
589
 
593
590
  --tds-page-header-nav-item-color-hover: var(--t-text-color-default-primary);
594
- --tds-page-header-nav-item-background-color-hover:
595
- var(
596
- --t-fill-color-neutral-080
597
- );
598
- --tds-page-header-nav-item-border-color-hover:
599
- var(
600
- --tds-page-header-nav-item-background-color-hover
601
- );
591
+ --tds-page-header-nav-item-background-color-hover: var(
592
+ --t-fill-color-neutral-080
593
+ );
594
+ --tds-page-header-nav-item-border-color-hover: var(
595
+ --tds-page-header-nav-item-background-color-hover
596
+ );
602
597
 
603
- --tds-page-header-nav-item-background-color-active:
604
- var(
605
- --t-fill-color-neutral-060
606
- );
607
- --tds-page-header-nav-item-border-color-active:
608
- var(
609
- --tds-page-header-nav-item-background-color-hover
610
- );
598
+ --tds-page-header-nav-item-background-color-active: var(
599
+ --t-fill-color-neutral-060
600
+ );
601
+ --tds-page-header-nav-item-border-color-active: var(
602
+ --tds-page-header-nav-item-background-color-hover
603
+ );
611
604
 
612
- --tds-page-header-nav-item-color-disabled:
613
- var(
614
- --t-text-color-default-disabled
615
- );
616
- --tds-page-header-nav-item-background-color-disabled:
617
- var(
618
- --t-fill-color-neutral-080
619
- );
620
- --tds-page-header-nav-item-border-color-disabled:
621
- var(
622
- --tds-page-header-nav-item-background-color-disabled
623
- );
605
+ --tds-page-header-nav-item-color-disabled: var(
606
+ --t-text-color-default-disabled
607
+ );
608
+ --tds-page-header-nav-item-background-color-disabled: var(
609
+ --t-fill-color-neutral-080
610
+ );
611
+ --tds-page-header-nav-item-border-color-disabled: var(
612
+ --tds-page-header-nav-item-background-color-disabled
613
+ );
624
614
 
625
- --tds-page-header-nav-item-color-selected:
626
- var(
627
- --t-text-color-default-primary
628
- );
629
- --tds-page-header-nav-item-border-color-selected:
630
- var(
631
- --t-border-color-default-base
632
- );
633
- --tds-page-header-nav-item-background-color-selected:
634
- var(
635
- --t-fill-color-neutral-100
636
- );
637
- --tds-page-header-nav-item-border-bottom-color-selected:
638
- var(
639
- --tds-page-header-nav-item-background-color-selected
640
- );
641
- --tds-page-header-nav-item-indicator-color: var(--t-icon-color-status-warning-primary);
615
+ --tds-page-header-nav-item-color-selected: var(
616
+ --t-text-color-default-primary
617
+ );
618
+ --tds-page-header-nav-item-border-color-selected: var(
619
+ --t-border-color-default-base
620
+ );
621
+ --tds-page-header-nav-item-background-color-selected: var(
622
+ --t-fill-color-neutral-100
623
+ );
624
+ --tds-page-header-nav-item-border-bottom-color-selected: var(
625
+ --tds-page-header-nav-item-background-color-selected
626
+ );
627
+ --tds-page-header-nav-item-indicator-color: var(
628
+ --t-icon-color-status-warning-primary
629
+ );
642
630
  }
643
631
 
644
-
645
632
  @media (min-width: 720px) {
646
633
  .tds-page-header {
647
634
  --tds-page-header-background-color: var(--t-surface-color-card);
@@ -650,10 +637,9 @@
650
637
  --tds-page-header-nav-item-padding-x: var(--t-spacing-2);
651
638
  --tds-page-header-nav-item-border-width: 1px;
652
639
  --tds-page-header-nav-item-color: var(--t-text-color-default-secondary);
653
- --tds-page-header-nav-item-background-color:
654
- var(
655
- --t-fill-color-neutral-070
656
- );
640
+ --tds-page-header-nav-item-background-color: var(
641
+ --t-fill-color-neutral-070
642
+ );
657
643
  }
658
644
  }
659
645
  }
@@ -729,8 +715,7 @@
729
715
  .tds-page-header nav.tds-page-header__nav button {
730
716
  position: relative;
731
717
  display: inline-flex;
732
- padding:
733
- var(--tds-page-header-nav-item-padding-y)
718
+ padding: var(--tds-page-header-nav-item-padding-y)
734
719
  var(--tds-page-header-nav-item-padding-x);
735
720
  font-size: var(--t-font-size-md);
736
721
  color: var(--tds-page-header-nav-item-color);
@@ -742,24 +727,32 @@
742
727
  cursor: pointer;
743
728
  outline-offset: -2px;
744
729
  background-color: var(--tds-page-header-nav-item-background-color);
745
- border:
746
- var(--tds-page-header-nav-item-border-width) solid
730
+ border: var(--tds-page-header-nav-item-border-width) solid
747
731
  var(--tds-page-header-nav-item-border-color);
748
732
  border-bottom: 1px solid var(--tds-page-header-nav-item-border-bottom-color);
749
733
  border-radius: var(--t-border-radius-md) var(--t-border-radius-md) 0 0;
750
734
  }
751
735
 
752
- .tds-page-header nav:is([slot="navigation"], .tds-page-header__nav) li:has(.indicator) {
736
+ .tds-page-header
737
+ nav:is([slot="navigation"], .tds-page-header__nav)
738
+ li:has(.indicator) {
753
739
  position: relative;
754
740
  }
755
741
 
756
- .tds-page-header nav:is([slot="navigation"], .tds-page-header__nav) li:has(.indicator) :is(a, button) {
742
+ .tds-page-header
743
+ nav:is([slot="navigation"], .tds-page-header__nav)
744
+ li:has(.indicator)
745
+ :is(a, button) {
757
746
  -webkit-mask: radial-gradient(8px at calc(100% - 3px) 0, #0000 98%, #000);
758
747
  mask: radial-gradient(8px at calc(100% - 3px) 0, #0000 98%, #000);
759
748
  }
760
749
 
761
- .tds-page-header nav:is([slot="navigation"], .tds-page-header__nav) li:has(.indicator)::before,
762
- .tds-page-header nav:is([slot="navigation"], .tds-page-header__nav) li:has(.indicator)::after {
750
+ .tds-page-header
751
+ nav:is([slot="navigation"], .tds-page-header__nav)
752
+ li:has(.indicator)::before,
753
+ .tds-page-header
754
+ nav:is([slot="navigation"], .tds-page-header__nav)
755
+ li:has(.indicator)::after {
763
756
  position: absolute;
764
757
  top: -5px;
765
758
  right: -2px;
@@ -771,7 +764,9 @@
771
764
  }
772
765
 
773
766
  @media (prefers-reduced-motion: no-preference) {
774
- .tds-page-header nav:is([slot="navigation"], .tds-page-header__nav) li:has(.indicator)::after {
767
+ .tds-page-header
768
+ nav:is([slot="navigation"], .tds-page-header__nav)
769
+ li:has(.indicator)::after {
775
770
  animation: indicator-pulse 1.25s ease infinite;
776
771
  }
777
772
  }
@@ -780,22 +775,18 @@
780
775
  .tds-page-header nav[slot="navigation"] button.selected,
781
776
  .tds-page-header nav.tds-page-header__nav a.selected,
782
777
  .tds-page-header nav.tds-page-header__nav button.selected {
783
- --tds-page-header-nav-item-color:
784
- var(
785
- --tds-page-header-nav-item-color-selected
786
- );
787
- --tds-page-header-nav-item-border-color:
788
- var(
789
- --tds-page-header-nav-item-border-color-selected
790
- );
791
- --tds-page-header-nav-item-background-color:
792
- var(
793
- --tds-page-header-nav-item-background-color-selected
794
- );
795
- --tds-page-header-nav-item-border-bottom-color:
796
- var(
797
- --tds-page-header-nav-item-background-color-selected
798
- );
778
+ --tds-page-header-nav-item-color: var(
779
+ --tds-page-header-nav-item-color-selected
780
+ );
781
+ --tds-page-header-nav-item-border-color: var(
782
+ --tds-page-header-nav-item-border-color-selected
783
+ );
784
+ --tds-page-header-nav-item-background-color: var(
785
+ --tds-page-header-nav-item-background-color-selected
786
+ );
787
+ --tds-page-header-nav-item-border-bottom-color: var(
788
+ --tds-page-header-nav-item-background-color-selected
789
+ );
799
790
  }
800
791
 
801
792
  .tds-page-header nav[slot="navigation"] a:not(.selected):hover,
@@ -803,14 +794,12 @@
803
794
  .tds-page-header nav.tds-page-header__nav a:not(.selected):hover,
804
795
  .tds-page-header nav.tds-page-header__nav button:not(.selected):hover {
805
796
  --tds-page-header-nav-item-color: var(--tds-page-header-nav-item-color-hover);
806
- --tds-page-header-nav-item-background-color:
807
- var(
808
- --tds-page-header-nav-item-background-color-hover
809
- );
810
- --tds-page-header-nav-item-border-color:
811
- var(
812
- --tds-page-header-nav-item-border-color-hover
813
- );
797
+ --tds-page-header-nav-item-background-color: var(
798
+ --tds-page-header-nav-item-background-color-hover
799
+ );
800
+ --tds-page-header-nav-item-border-color: var(
801
+ --tds-page-header-nav-item-border-color-hover
802
+ );
814
803
  }
815
804
 
816
805
  .tds-page-header nav[slot="navigation"] a:not(.selected):active,
@@ -855,8 +844,8 @@
855
844
 
856
845
  @keyframes indicator-pulse {
857
846
  0% {
858
- opacity: .3;
859
- transform: scale(.9);
847
+ opacity: 0.3;
848
+ transform: scale(0.9);
860
849
  }
861
850
  100% {
862
851
  opacity: 0;
@@ -877,15 +866,26 @@
877
866
  --tds-sidenav-indent: 12px;
878
867
  --tds-sidenav-item-depth: 0;
879
868
 
880
- --tds-sidenav-item-transition: background-color .2s cubic-bezier(.19, .91, .38, 1);
869
+ --tds-sidenav-item-transition: background-color 0.2s
870
+ cubic-bezier(0.19, 0.91, 0.38, 1);
881
871
 
882
- --tds-sidenav-item-background-hover: var(--t-fill-color-button-interaction-ghost-hover);
883
- --tds-sidenav-item-background-active: var(--t-fill-color-button-interaction-ghost-active);
884
- --tds-sidenav-item-background-selected: var(--t-fill-color-button-interaction-ghost-active);
872
+ --tds-sidenav-item-background-hover: var(
873
+ --t-fill-color-button-interaction-ghost-hover
874
+ );
875
+ --tds-sidenav-item-background-active: var(
876
+ --t-fill-color-button-interaction-ghost-active
877
+ );
878
+ --tds-sidenav-item-background-selected: var(
879
+ --t-fill-color-button-interaction-ghost-active
880
+ );
885
881
 
886
882
  --tds-sidenav-item-nested-border-color: var(--t-fill-color-neutral-050);
887
- --tds-sidenav-item-nested-border-color-hover: var(--t-fill-color-neutral-050);
888
- --tds-sidenav-item-nested-border-color-selected: var(--t-border-color-status-info);
883
+ --tds-sidenav-item-nested-border-color-hover: var(
884
+ --t-fill-color-neutral-050
885
+ );
886
+ --tds-sidenav-item-nested-border-color-selected: var(
887
+ --t-border-color-status-info
888
+ );
889
889
 
890
890
  --tds-sidenav-item-icon-color: var(--t-icon-color-default-secondary);
891
891
  --tds-sidenav-item-icon-color-selected: var(--t-icon-color-default-primary);
@@ -896,8 +896,12 @@
896
896
  --tds-sidenav-item-background-hover: var(--t-fill-color-neutral-080);
897
897
  --tds-sidenav-item-background-active: var(--t-fill-color-neutral-070);
898
898
  --tds-sidenav-item-background-selected: var(--t-fill-color-neutral-050);
899
- --tds-sidenav-item-nested-border-color-hover: var(--t-fill-color-neutral-050);
900
- --tds-sidenav-item-nested-border-color-selected: var(--t-fill-color-neutral-010);
899
+ --tds-sidenav-item-nested-border-color-hover: var(
900
+ --t-fill-color-neutral-050
901
+ );
902
+ --tds-sidenav-item-nested-border-color-selected: var(
903
+ --t-fill-color-neutral-010
904
+ );
901
905
  }
902
906
  }
903
907
 
@@ -1025,7 +1029,10 @@
1025
1029
  block-size: 0;
1026
1030
  overflow-y: clip;
1027
1031
  opacity: 0;
1028
- transition: content-visibility .2s allow-discrete, opacity .2s, block-size .2s;
1032
+ transition:
1033
+ content-visibility 0.2s allow-discrete,
1034
+ opacity 0.2s,
1035
+ block-size 0.2s;
1029
1036
  }
1030
1037
 
1031
1038
  :is(.tds-sidenav-item .tds-sidenav-section-list) .tds-sidenav-section-list {
@@ -1035,7 +1042,10 @@
1035
1042
  :is(.tds-sidenav-section-list .tds-sidenav-section-list .tds-sidenav-item) :is(a,button) {
1036
1043
  height: 32px;
1037
1044
  padding-block: 9px;
1038
- padding-left: calc((var(--tds-sidenav-indent) * var(--tds-sidenav-item-depth)) + var(--tds-sidenav-indent) + 2px);
1045
+ padding-left: calc(
1046
+ (var(--tds-sidenav-indent) * var(--tds-sidenav-item-depth)) +
1047
+ var(--tds-sidenav-indent) + 2px
1048
+ );
1039
1049
  line-height: 1;
1040
1050
  background-color: transparent;
1041
1051
  }
@@ -1053,22 +1063,28 @@
1053
1063
 
1054
1064
  :is(:is(.tds-sidenav-section-list .tds-sidenav-section-list .tds-sidenav-item) :is(a,button))::after {
1055
1065
  position: absolute;
1056
- inset: 0 0 0 calc(var(--tds-sidenav-indent) * var(--tds-sidenav-item-depth));
1066
+ inset: 0 0 0
1067
+ calc(var(--tds-sidenav-indent) * var(--tds-sidenav-item-depth));
1057
1068
  z-index: -1;
1058
1069
  height: 100%;
1059
1070
  content: "";
1060
1071
  background-color: var(--tds-sidenav-item-background);
1061
- border-radius: 0 var(--t-border-radius-default) var(--t-border-radius-default) 0;
1072
+ border-radius: 0 var(--t-border-radius-default)
1073
+ var(--t-border-radius-default) 0;
1062
1074
  transition: var(--tds-sidenav-item-transition);
1063
1075
  }
1064
1076
 
1065
1077
  :is(:is(.tds-sidenav-section-list .tds-sidenav-section-list .tds-sidenav-item) :is(a,button)):hover,:is(:is(.tds-sidenav-section-list .tds-sidenav-section-list .tds-sidenav-item) :is(a,button)):focus-visible {
1066
- --tds-sidenav-item-nested-border-color: var(--tds-sidenav-item-nested-border-color-hover);
1078
+ --tds-sidenav-item-nested-border-color: var(
1079
+ --tds-sidenav-item-nested-border-color-hover
1080
+ );
1067
1081
  --tds-sidenav-item-background: var(--tds-sidenav-item-background-hover);
1068
1082
  }
1069
1083
 
1070
1084
  .selected:is(.tds-sidenav-section-list .tds-sidenav-section-list .tds-sidenav-item) :is(a,button) {
1071
- --tds-sidenav-item-nested-border-color: var(--tds-sidenav-item-nested-border-color-selected);
1085
+ --tds-sidenav-item-nested-border-color: var(
1086
+ --tds-sidenav-item-nested-border-color-selected
1087
+ );
1072
1088
  }
1073
1089
 
1074
1090
  .tds-sidenav-responsive-header {
@@ -1120,7 +1136,7 @@
1120
1136
  background: var(--t-surface-color-card);
1121
1137
  border: 0;
1122
1138
  border-radius: 6px;
1123
- box-shadow: 0 8px 20px 0 rgba(0, 0, 0, .25);
1139
+ box-shadow: 0 8px 20px 0 rgba(0, 0, 0, 0.25);
1124
1140
  will-change: transform;
1125
1141
  position-area: bottom span-right;
1126
1142
  }