@planningcenter/tapestry 4.11.0 → 4.12.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.
Files changed (195) hide show
  1. package/dist/components/DataTable/CollectionEditorsLazy.js +2 -1
  2. package/dist/components/DataTable/CollectionEditorsLazy.js.map +1 -1
  3. package/dist/components/DataTable/DataTable.d.ts +49 -14
  4. package/dist/components/DataTable/DataTable.d.ts.map +1 -1
  5. package/dist/components/DataTable/DataTable.js +32 -24
  6. package/dist/components/DataTable/DataTable.js.map +1 -1
  7. package/dist/components/DataTable/DeleteSavedViewAlertDialog.d.ts +14 -0
  8. package/dist/components/DataTable/DeleteSavedViewAlertDialog.d.ts.map +1 -0
  9. package/dist/components/DataTable/DeleteSavedViewAlertDialog.js +10 -0
  10. package/dist/components/DataTable/DeleteSavedViewAlertDialog.js.map +1 -0
  11. package/dist/components/DataTable/ManageSavedViewsButton.d.ts +4 -1
  12. package/dist/components/DataTable/ManageSavedViewsButton.d.ts.map +1 -1
  13. package/dist/components/DataTable/ManageSavedViewsButton.js +3 -7
  14. package/dist/components/DataTable/ManageSavedViewsButton.js.map +1 -1
  15. package/dist/components/DataTable/ManageSavedViewsModal.d.ts +11 -1
  16. package/dist/components/DataTable/ManageSavedViewsModal.d.ts.map +1 -1
  17. package/dist/components/DataTable/ManageSavedViewsModal.js +265 -5
  18. package/dist/components/DataTable/ManageSavedViewsModal.js.map +1 -1
  19. package/dist/components/DataTable/ManageSavedViewsModal.module.css.js +4 -0
  20. package/dist/components/DataTable/ManageSavedViewsModal.module.css.js.map +1 -0
  21. package/dist/components/DataTable/NewSavedViewModal.d.ts +4 -1
  22. package/dist/components/DataTable/NewSavedViewModal.d.ts.map +1 -1
  23. package/dist/components/DataTable/NewSavedViewModal.js.map +1 -1
  24. package/dist/components/DataTable/ResultsCount.d.ts +9 -0
  25. package/dist/components/DataTable/ResultsCount.d.ts.map +1 -1
  26. package/dist/components/DataTable/ResultsCount.js +1 -1
  27. package/dist/components/DataTable/ResultsCount.js.map +1 -1
  28. package/dist/components/DataTable/SavedViewsBar.d.ts +14 -6
  29. package/dist/components/DataTable/SavedViewsBar.d.ts.map +1 -1
  30. package/dist/components/DataTable/SavedViewsBar.js +176 -45
  31. package/dist/components/DataTable/SavedViewsBar.js.map +1 -1
  32. package/dist/components/DataTable/TableActions.d.ts.map +1 -1
  33. package/dist/components/DataTable/TableActions.js +4 -6
  34. package/dist/components/DataTable/TableActions.js.map +1 -1
  35. package/dist/components/DataTable/ViewSettingsToggle.d.ts.map +1 -1
  36. package/dist/components/DataTable/ViewSettingsToggle.js +2 -4
  37. package/dist/components/DataTable/ViewSettingsToggle.js.map +1 -1
  38. package/dist/components/DataTable/index.d.ts +1 -1
  39. package/dist/components/DataTable/index.d.ts.map +1 -1
  40. package/dist/components/DataTable/savedViews.d.ts +40 -15
  41. package/dist/components/DataTable/savedViews.d.ts.map +1 -1
  42. package/dist/components/DataTable/savedViews.js +85 -6
  43. package/dist/components/DataTable/savedViews.js.map +1 -1
  44. package/dist/components/DataTable/useActiveSavedView.d.ts +1 -1
  45. package/dist/components/DataTable/useActiveSavedView.d.ts.map +1 -1
  46. package/dist/components/DataTable/useActiveSavedView.js +9 -3
  47. package/dist/components/DataTable/useActiveSavedView.js.map +1 -1
  48. package/dist/components/DataTable/useFilterAnnouncement.d.ts +24 -0
  49. package/dist/components/DataTable/useFilterAnnouncement.d.ts.map +1 -0
  50. package/dist/components/DataTable/useFilterAnnouncement.js +49 -0
  51. package/dist/components/DataTable/useFilterAnnouncement.js.map +1 -0
  52. package/dist/components/DataTable/useUpdateSavedViewName.d.ts +7 -0
  53. package/dist/components/DataTable/useUpdateSavedViewName.d.ts.map +1 -0
  54. package/dist/components/DataTable/useUpdateSavedViewName.js +12 -0
  55. package/dist/components/DataTable/useUpdateSavedViewName.js.map +1 -0
  56. package/dist/components/button/ActionsDropdownIconButton.d.ts +18 -9
  57. package/dist/components/button/ActionsDropdownIconButton.d.ts.map +1 -1
  58. package/dist/components/button/ActionsDropdownIconButton.js +5 -2
  59. package/dist/components/button/ActionsDropdownIconButton.js.map +1 -1
  60. package/dist/components/button/BaseButton.d.ts.map +1 -1
  61. package/dist/components/button/BaseButton.js +2 -1
  62. package/dist/components/button/BaseButton.js.map +1 -1
  63. package/dist/components/button/DropdownIconButton.d.ts +4 -5
  64. package/dist/components/button/DropdownIconButton.d.ts.map +1 -1
  65. package/dist/components/button/DropdownIconButton.js +2 -1
  66. package/dist/components/button/DropdownIconButton.js.map +1 -1
  67. package/dist/components/button/IconButton.d.ts +31 -10
  68. package/dist/components/button/IconButton.d.ts.map +1 -1
  69. package/dist/components/button/IconButton.js +8 -2
  70. package/dist/components/button/IconButton.js.map +1 -1
  71. package/dist/components/button/ToggleIconButton.d.ts +4 -1
  72. package/dist/components/button/ToggleIconButton.d.ts.map +1 -1
  73. package/dist/components/button/ToggleIconButton.js +1 -0
  74. package/dist/components/button/ToggleIconButton.js.map +1 -1
  75. package/dist/components/button/index.d.ts +1 -0
  76. package/dist/components/button/index.d.ts.map +1 -1
  77. package/dist/components/combo-box/ComboBox.d.ts +8 -0
  78. package/dist/components/combo-box/ComboBox.d.ts.map +1 -1
  79. package/dist/components/combo-box/ComboBox.js +31 -5
  80. package/dist/components/combo-box/ComboBox.js.map +1 -1
  81. package/dist/components/date-picker/DatePicker.d.ts.map +1 -1
  82. package/dist/components/date-picker/DatePicker.js +18 -14
  83. package/dist/components/date-picker/DatePicker.js.map +1 -1
  84. package/dist/components/internal/LoadingAnnouncement.d.ts +11 -0
  85. package/dist/components/internal/LoadingAnnouncement.d.ts.map +1 -0
  86. package/dist/components/internal/LoadingAnnouncement.js +21 -0
  87. package/dist/components/internal/LoadingAnnouncement.js.map +1 -0
  88. package/dist/components/internal/alert-dialog/AlertDialog.d.ts +56 -0
  89. package/dist/components/internal/alert-dialog/AlertDialog.d.ts.map +1 -0
  90. package/dist/components/internal/alert-dialog/AlertDialog.js +68 -0
  91. package/dist/components/internal/alert-dialog/AlertDialog.js.map +1 -0
  92. package/dist/components/internal/alert-dialog/index.d.ts +5 -0
  93. package/dist/components/internal/alert-dialog/index.d.ts.map +1 -0
  94. package/dist/components/internal/index.d.ts +1 -0
  95. package/dist/components/internal/index.d.ts.map +1 -1
  96. package/dist/components/internal/tooltip/Tooltip.d.ts +13 -5
  97. package/dist/components/internal/tooltip/Tooltip.d.ts.map +1 -1
  98. package/dist/components/internal/tooltip/Tooltip.js +63 -8
  99. package/dist/components/internal/tooltip/Tooltip.js.map +1 -1
  100. package/dist/components/internal/tooltip/TooltipTriggerContext.d.ts +3 -3
  101. package/dist/components/internal/tooltip/TooltipTriggerContext.d.ts.map +1 -1
  102. package/dist/components/internal/tooltip/TooltipTriggerContext.js +1 -1
  103. package/dist/components/internal/tooltip/TooltipTriggerContext.js.map +1 -1
  104. package/dist/components/internal/tooltip/index.d.ts +1 -1
  105. package/dist/components/internal/tooltip/index.d.ts.map +1 -1
  106. package/dist/components/link/BaseLink.d.ts.map +1 -1
  107. package/dist/components/link/BaseLink.js +15 -3
  108. package/dist/components/link/BaseLink.js.map +1 -1
  109. package/dist/components/link/IconLink.d.ts +28 -290
  110. package/dist/components/link/IconLink.d.ts.map +1 -1
  111. package/dist/components/link/IconLink.js +9 -2
  112. package/dist/components/link/IconLink.js.map +1 -1
  113. package/dist/components/page-header/defineElements.js +1 -1
  114. package/dist/components/pane/Pane.d.ts +1 -1
  115. package/dist/components/pane/Pane.js +1 -1
  116. package/dist/components/pane/Pane.js.map +1 -1
  117. package/dist/components/pane/PaneBody.d.ts +1 -1
  118. package/dist/components/pane/PaneBody.js +1 -1
  119. package/dist/components/pane/PaneBody.js.map +1 -1
  120. package/dist/components/pane/PaneDivider.d.ts +6 -3
  121. package/dist/components/pane/PaneDivider.d.ts.map +1 -1
  122. package/dist/components/pane/PaneDivider.js +3 -3
  123. package/dist/components/pane/PaneDivider.js.map +1 -1
  124. package/dist/components/pane/PaneFooter.d.ts +1 -1
  125. package/dist/components/pane/PaneFooter.js +1 -1
  126. package/dist/components/pane/PaneFooter.js.map +1 -1
  127. package/dist/components/pane/PaneHeader.d.ts +1 -1
  128. package/dist/components/pane/PaneHeader.js +1 -1
  129. package/dist/components/pane/PaneHeader.js.map +1 -1
  130. package/dist/components/pane/PaneHeaderActions.d.ts +1 -1
  131. package/dist/components/pane/PaneHeaderActions.js +1 -1
  132. package/dist/components/pane/PaneHeaderActions.js.map +1 -1
  133. package/dist/components/sidenav/defineElements.js +1 -1
  134. package/dist/components/time-field/TimeField.d.ts.map +1 -1
  135. package/dist/components/time-field/TimeField.js +7 -3
  136. package/dist/components/time-field/TimeField.js.map +1 -1
  137. package/dist/index.css +169 -27
  138. package/dist/index.css.map +1 -1
  139. package/dist/index.d.ts +1 -0
  140. package/dist/index.d.ts.map +1 -1
  141. package/dist/index.js +6 -0
  142. package/dist/index.js.map +1 -1
  143. package/dist/packages/tapestry-wc/dist/components/{p-np7vhMVg.js → p-A1JK45WV.js} +3 -3
  144. package/dist/packages/tapestry-wc/dist/components/p-A1JK45WV.js.map +1 -0
  145. package/dist/packages/tapestry-wc/dist/components/{p-BVvtAaVT.js → p-BbuNAv9q.js} +3 -3
  146. package/dist/packages/tapestry-wc/dist/components/p-BbuNAv9q.js.map +1 -0
  147. package/dist/packages/tapestry-wc/dist/components/{p-B2xqMgNQ.js → p-CBFtMIxJ.js} +2 -2
  148. package/dist/packages/tapestry-wc/dist/components/p-CBFtMIxJ.js.map +1 -0
  149. package/dist/packages/tapestry-wc/dist/components/{p-Rn6lOB18.js → p-CY_DC4d_.js} +3 -3
  150. package/dist/packages/tapestry-wc/dist/components/p-CY_DC4d_.js.map +1 -0
  151. package/dist/packages/tapestry-wc/dist/components/{p-6NO22Vi_.js → p-DNHgMtxw.js} +2 -2
  152. package/dist/packages/tapestry-wc/dist/components/p-DNHgMtxw.js.map +1 -0
  153. package/dist/packages/tapestry-wc/dist/components/tds-page-header-nav.js +2 -2
  154. package/dist/packages/tapestry-wc/dist/components/tds-page-header-nav.js.map +1 -1
  155. package/dist/packages/tapestry-wc/dist/components/tds-page-header.js +3 -3
  156. package/dist/packages/tapestry-wc/dist/components/tds-page-header.js.map +1 -1
  157. package/dist/packages/tapestry-wc/dist/components/tds-sidenav-item.js +3 -3
  158. package/dist/packages/tapestry-wc/dist/components/tds-sidenav-item.js.map +1 -1
  159. package/dist/packages/tapestry-wc/dist/components/tds-sidenav-responsive-header.js +2 -2
  160. package/dist/packages/tapestry-wc/dist/components/tds-sidenav-responsive-header.js.map +1 -1
  161. package/dist/packages/tapestry-wc/dist/components/tds-sidenav-section.js +3 -3
  162. package/dist/packages/tapestry-wc/dist/components/tds-sidenav-section.js.map +1 -1
  163. package/dist/packages/tapestry-wc/dist/components/tds-sidenav.js +5 -5
  164. package/dist/packages/tapestry-wc/dist/components/tds-sidenav.js.map +1 -1
  165. package/dist/reactRender.css +756 -574
  166. package/dist/reactRender.css.map +1 -1
  167. package/dist/reactRenderLegacy.css +756 -574
  168. package/dist/reactRenderLegacy.css.map +1 -1
  169. package/dist/tapestryMount.css +756 -574
  170. package/dist/tapestryMount.css.map +1 -1
  171. package/dist/tapestryMountLegacy.css +756 -574
  172. package/dist/tapestryMountLegacy.css.map +1 -1
  173. package/dist/unstable.css +309 -127
  174. package/dist/unstable.css.map +1 -1
  175. package/dist/unstable.d.ts +0 -1
  176. package/dist/unstable.d.ts.map +1 -1
  177. package/dist/unstable.js +6 -6
  178. package/dist/utilities/dateFieldLocale.d.ts +2 -0
  179. package/dist/utilities/dateFieldLocale.d.ts.map +1 -0
  180. package/dist/utilities/dateFieldLocale.js +32 -0
  181. package/dist/utilities/dateFieldLocale.js.map +1 -0
  182. package/dist/utilities/useAnnounce.d.ts +22 -0
  183. package/dist/utilities/useAnnounce.d.ts.map +1 -0
  184. package/dist/utilities/useAnnounce.js +27 -0
  185. package/dist/utilities/useAnnounce.js.map +1 -0
  186. package/dist/utilities/useDateFieldLocale.d.ts +2 -0
  187. package/dist/utilities/useDateFieldLocale.d.ts.map +1 -0
  188. package/dist/utilities/useDateFieldLocale.js +11 -0
  189. package/dist/utilities/useDateFieldLocale.js.map +1 -0
  190. package/package.json +4 -4
  191. package/dist/packages/tapestry-wc/dist/components/p-6NO22Vi_.js.map +0 -1
  192. package/dist/packages/tapestry-wc/dist/components/p-B2xqMgNQ.js.map +0 -1
  193. package/dist/packages/tapestry-wc/dist/components/p-BVvtAaVT.js.map +0 -1
  194. package/dist/packages/tapestry-wc/dist/components/p-Rn6lOB18.js.map +0 -1
  195. package/dist/packages/tapestry-wc/dist/components/p-np7vhMVg.js.map +0 -1
package/dist/unstable.css CHANGED
@@ -1411,6 +1411,13 @@
1411
1411
  }
1412
1412
  }
1413
1413
 
1414
+ .tds-data-table-saved-view-default-indicator{
1415
+ display:inline-flex;
1416
+ margin-inline-start:var(--t-spacing-1);
1417
+ font-size:var(--t-font-size-sm);
1418
+ color:var(--t-text-color-secondary);
1419
+ }
1420
+
1414
1421
  .tds-data-table-filters-shelf{
1415
1422
  height:auto;
1416
1423
  overflow:hidden;
@@ -3496,6 +3503,83 @@ a.tds-dropdown-item:is(:hover, :active){
3496
3503
  }
3497
3504
  }
3498
3505
 
3506
+ .tds-alert-dialog{
3507
+ padding-block-start:0;
3508
+ text-align:center;
3509
+ }
3510
+
3511
+ .tds-alert-dialog-header{
3512
+ display:flex;
3513
+ flex-direction:column;
3514
+ gap:var(--t-spacing-3);
3515
+ align-items:center;
3516
+ padding-block-start:var(--t-spacing-5);
3517
+ padding-inline:var(--t-spacing-4);
3518
+ }
3519
+
3520
+ .tds-alert-dialog-icon{
3521
+ flex-shrink:0;
3522
+ width:var(--t-element-size-3xl);
3523
+ height:var(--t-element-size-3xl);
3524
+ }
3525
+
3526
+ .tds-alert-dialog-icon--info{
3527
+ fill:var(--t-icon-color-status-info);
3528
+ }
3529
+
3530
+ .tds-alert-dialog-icon--success{
3531
+ fill:var(--t-icon-color-status-success);
3532
+ }
3533
+
3534
+ .tds-alert-dialog-icon--warning{
3535
+ fill:var(--t-icon-color-status-warning);
3536
+ }
3537
+
3538
+ .tds-alert-dialog-icon--danger,
3539
+ .tds-alert-dialog-icon--error{
3540
+ fill:var(--t-icon-color-status-error);
3541
+ }
3542
+
3543
+ .tds-alert-dialog-title{
3544
+ width:100%;
3545
+ margin:0;
3546
+ font-size:var(--t-font-size-2xl);
3547
+ font-weight:var(--t-font-weight-semibold);
3548
+ line-height:1.4;
3549
+ color:var(--t-text-color-headline);
3550
+ overflow-wrap:break-word;
3551
+ }
3552
+
3553
+ .tds-alert-dialog-body{
3554
+ padding-block:var(--t-spacing-2) var(--t-spacing-4);
3555
+ padding-inline:var(--t-spacing-4);
3556
+ font-size:var(--t-font-size-md);
3557
+ line-height:1.4;
3558
+ color:var(--t-text-color);
3559
+ overflow-wrap:break-word;
3560
+ }
3561
+
3562
+ .tds-alert-dialog-body > :first-child{
3563
+ margin-block-start:0;
3564
+ }
3565
+
3566
+ .tds-alert-dialog-body > :last-child{
3567
+ margin-block-end:0;
3568
+ }
3569
+
3570
+ .tds-alert-dialog-footer{
3571
+ flex-wrap:wrap;
3572
+ gap:var(--t-spacing-1);
3573
+ justify-content:center;
3574
+ padding:var(--t-spacing-3);
3575
+ }
3576
+ @media (max-width: 719px){
3577
+ .tds-alert-dialog-footer{
3578
+ reading-flow:flex-visual;
3579
+ flex-direction:column-reverse;
3580
+ }
3581
+ }
3582
+
3499
3583
 
3500
3584
  :is(.tds-input input)::-webkit-search-decoration,:is(.tds-input input)::-webkit-search-cancel-button,:is(.tds-input input)::-webkit-search-results-button,:is(.tds-input input)::-webkit-search-results-decoration{
3501
3585
  -webkit-appearance:none;
@@ -3700,6 +3784,89 @@ a.tds-dropdown-item:is(:hover, :active){
3700
3784
  line-height:1.35;
3701
3785
  }
3702
3786
 
3787
+ .views-list-3AMVI{
3788
+ display:flex;
3789
+ flex-direction:column;
3790
+ row-gap:var(--t-spacing-1);
3791
+ padding-inline-start:0;
3792
+ margin-block:0;
3793
+ list-style:none;
3794
+ }
3795
+
3796
+ .views-list-item-cWGsC{
3797
+ position:relative;
3798
+ display:flex;
3799
+ -moz-column-gap:var(--t-spacing-1);
3800
+ column-gap:var(--t-spacing-1);
3801
+ }
3802
+
3803
+ .views-list-item-cWGsC[data-dragging] > :not(.view-list-drop-indicator-zyDIt){
3804
+ opacity:.5;
3805
+ }
3806
+
3807
+ .view-list-item-drag-handle-fiO5Z{
3808
+ --tds-btn-color:var(--t-text-color-secondary);
3809
+
3810
+ cursor:grab;
3811
+ }
3812
+ .view-list-drop-indicator-zyDIt{
3813
+ --_drop-indicator-width:var(--t-spacing-fourth);
3814
+ position:absolute;
3815
+ inset-inline:0;
3816
+ block-size:var(--_drop-indicator-width);
3817
+ border-radius:var(--_drop-indicator-width);
3818
+ }
3819
+ .view-list-drop-indicator-zyDIt[data-drop-position="before"]{
3820
+ inset-block-start:calc((var(--t-spacing-1) + var(--_drop-indicator-width)) / -2);
3821
+ }
3822
+ .view-list-drop-indicator-zyDIt[data-drop-position="after"]{
3823
+ inset-block-end:calc((var(--t-spacing-1) + var(--_drop-indicator-width)) / -2);
3824
+ }
3825
+ .view-list-drop-indicator-zyDIt[data-drop-target]{
3826
+ background-color:var(--t-focus-ring-color);
3827
+ }
3828
+ @media (forced-colors: active){
3829
+ .view-list-drop-indicator-zyDIt[data-drop-target]{
3830
+ forced-color-adjust:none;
3831
+ background-color:Highlight;
3832
+ }
3833
+ }
3834
+
3835
+ .views-list-item--drag-ghost-zEVbL{
3836
+ padding:var(--t-spacing-half);
3837
+ background-color:var(--t-surface-color-canvas);
3838
+ border-radius:var(--t-border-radius-md);
3839
+ transform:translateZ(0);
3840
+ }
3841
+
3842
+ .views-list-item--drag-ghost-zEVbL button:not(.view-list-item-drag-handle-fiO5Z){
3843
+ opacity:.5;
3844
+ transition:none;
3845
+ }
3846
+
3847
+ .view-list-item-input-dowHY{
3848
+ flex-grow:1;
3849
+ }
3850
+
3851
+ .views-list-item--static-9zGpJ{
3852
+ display:flex;
3853
+ -moz-column-gap:var(--t-spacing-1);
3854
+ column-gap:var(--t-spacing-1);
3855
+ }
3856
+
3857
+ .view-list-item-static-name-nxBiG{
3858
+ display:flex;
3859
+ flex-grow:1;
3860
+ align-items:center;
3861
+ min-block-size:var(--t-container-size-md);
3862
+ padding-inline:var(--t-spacing-1);
3863
+ font-size:var(--t-font-size-md);
3864
+ color:var(--t-form-color);
3865
+ background-color:var(--t-form-background-color-readonly);
3866
+ border:var(--t-form-border-width) solid var(--t-form-border-color-readonly);
3867
+ border-radius:var(--t-form-border-radius);
3868
+ }
3869
+
3703
3870
  .tds-search-input-control{
3704
3871
  --tds-search-input-outline-color:rgb(from var(--t-focus-ring-color) r g b / 0);
3705
3872
  --tds-search-input-outline-offset:0;
@@ -4465,6 +4632,15 @@ a.tds-dropdown-item:is(:hover, :active){
4465
4632
  --tds-loading-spinner-visibility:visible;
4466
4633
  --tds-loading-spinner-animation-play-state:running;
4467
4634
  }
4635
+
4636
+ .tds-combo-box-loading-label--hidden{
4637
+ position:absolute;
4638
+ width:1px;
4639
+ height:1px;
4640
+ overflow:hidden;
4641
+ white-space:nowrap;
4642
+ clip-path:inset(50%);
4643
+ }
4468
4644
  .tds-combo-box-list-section:not(:first-child){
4469
4645
  margin-block-start:var(--t-spacing-half);
4470
4646
  }
@@ -5350,133 +5526,6 @@ a.tds-dropdown-item:is(:hover, :active){
5350
5526
  margin-inline-end:var(--tds-number-stepper-button-offset);
5351
5527
  }
5352
5528
 
5353
- .tds-pane{
5354
- --tds-pane-background-color:var(--t-surface-color-card);
5355
- --tds-pane-border-radius:var(--t-border-radius-lg);
5356
- --tds-pane-border-color:var(--t-border-color);
5357
-
5358
- --tds-pane-header-padding-block:var(--t-spacing-1-half);
5359
- --tds-pane-header-padding-inline:var(--tds-pane-body-padding);
5360
-
5361
- --tds-pane-title-color:var(--t-text-color-headline);
5362
- --tds-pane-title-font-size:var(--t-font-size-lg);
5363
- --tds-pane-title-font-weight:var(--t-font-weight-medium);
5364
- --tds-pane-title-line-height:1.4;
5365
-
5366
- --tds-pane-body-padding:var(--t-spacing-3);
5367
-
5368
- --tds-pane-footer-padding-block:var(--t-spacing-2);
5369
- --tds-pane-footer-padding-inline:var(--tds-pane-body-padding);
5370
-
5371
- --tds-pane-divider-margin-block:var(--tds-pane-body-padding);
5372
- --tds-pane-divider-margin-inline:calc(-1 * var(--tds-pane-body-padding));
5373
-
5374
- background:var(--tds-pane-background-color);
5375
- border-radius:var(--tds-pane-border-radius);
5376
- border:var(--t-border-width) solid var(--tds-pane-border-color);
5377
- display:flex;
5378
- flex-direction:column;
5379
- }
5380
-
5381
- .tds-pane-header{
5382
- border-bottom:var(--t-border-width) solid var(--tds-pane-border-color);
5383
- padding-block:var(--tds-pane-header-padding-block);
5384
- padding-inline:var(--tds-pane-header-padding-inline);
5385
- }
5386
-
5387
- .tds-pane-header > tds-helper-shelf > .tds-helper-shelf-trigger{
5388
- margin-inline:calc(-1 * var(--t-spacing-1)) auto;
5389
- }
5390
-
5391
- .tds-pane-header > tds-helper-shelf > .tds-helper-shelf{
5392
- flex-basis:100%;
5393
- order:1;
5394
- }
5395
-
5396
- .tds-pane-header:has( > tds-helper-shelf){
5397
- row-gap:var(--tds-pane-header-padding-block);
5398
- padding-block-end:0;
5399
- }
5400
-
5401
- .tds-pane-header > tds-helper-shelf > .tds-helper-shelf > .tds-helper-shelf-content{
5402
- font-size:var(--t-font-size-md);
5403
- margin-block-end:var(--tds-pane-header-padding-block);
5404
- }
5405
-
5406
- .tds-pane-title{
5407
- color:var(--tds-pane-title-color);
5408
- font-size:var(--tds-pane-title-font-size);
5409
- font-weight:var(--tds-pane-title-font-weight);
5410
- line-height:var(--tds-pane-title-line-height);
5411
- margin:0;
5412
- }
5413
-
5414
- .tds-pane-body{
5415
- padding:var(--tds-pane-body-padding);
5416
- }
5417
-
5418
- .tds-pane-footer{
5419
- padding-block-end:var(--tds-pane-footer-padding-block);
5420
- padding-inline:var(--tds-pane-footer-padding-inline);
5421
- }
5422
-
5423
- .tds-pane-divider{
5424
- border:0;
5425
- border-top:var(--t-border-width) solid var(--tds-pane-border-color);
5426
- margin-block:var(--tds-pane-divider-margin-block);
5427
- margin-inline:var(--tds-pane-divider-margin-inline);
5428
- }
5429
-
5430
- tds-helper-shelf{
5431
- display:contents;
5432
- }
5433
-
5434
- .tds-helper-shelf{
5435
- --tds-helper-shelf-background-color:var(--t-fill-color-neutral-090);
5436
- --tds-helper-shelf-border-radius:var(--t-border-radius-md);
5437
- --tds-helper-shelf-color:var(--t-text-color);
5438
- --tds-helper-shelf-font-size:var(--t-font-size-sm);
5439
- --tds-helper-shelf-padding:var(--t-spacing-1);
5440
-
5441
- height:0;
5442
- overflow:hidden;
5443
- transition:height var(--t-duration-300) var(--t-ease-in);
5444
- }
5445
-
5446
- @media (prefers-reduced-motion: reduce){
5447
-
5448
- .tds-helper-shelf{
5449
- transition:none;
5450
- }
5451
- }
5452
-
5453
- .tds-helper-shelf--expanded{
5454
- height:auto;
5455
- transition-timing-function:var(--t-ease-out);
5456
- }
5457
-
5458
- @supports (interpolate-size: allow-keywords){
5459
- .tds-helper-shelf{
5460
- interpolate-size:allow-keywords;
5461
- }
5462
- }
5463
-
5464
- .tds-helper-shelf-content{
5465
- padding:var(--tds-helper-shelf-padding);
5466
- font-size:var(--tds-helper-shelf-font-size);
5467
- color:var(--tds-helper-shelf-color);
5468
- background:var(--tds-helper-shelf-background-color);
5469
- border-radius:var(--tds-helper-shelf-border-radius);
5470
- }
5471
-
5472
- .tds-helper-shelf-trigger{
5473
- --tds-helper-shelf-trigger-color-expanded:var(--t-text-color-interaction);
5474
- }
5475
-
5476
- .tds-helper-shelf-trigger[aria-expanded="true"]{
5477
- --tds-btn-color:var(--tds-helper-shelf-trigger-color-expanded);
5478
- }
5479
-
5480
5529
  @layer t-critical, t-component;
5481
5530
 
5482
5531
  :root{
@@ -7806,6 +7855,139 @@ tds-sidenav-section:not(.hydrated) > [slot="ssr"]{
7806
7855
  clip-path:inset(50%);
7807
7856
  }
7808
7857
 
7858
+ .tds-pane{
7859
+ --tds-pane-background-color:var(--t-surface-color-card);
7860
+ --tds-pane-border-radius:var(--t-border-radius-lg);
7861
+ --tds-pane-border-color:var(--t-border-color);
7862
+
7863
+ --tds-pane-header-padding-block:var(--t-spacing-1-half);
7864
+ --tds-pane-header-padding-inline:var(--tds-pane-body-padding);
7865
+
7866
+ --tds-pane-title-color:var(--t-text-color-headline);
7867
+ --tds-pane-title-font-size:var(--t-font-size-lg);
7868
+ --tds-pane-title-font-weight:var(--t-font-weight-medium);
7869
+ --tds-pane-title-line-height:1.4;
7870
+
7871
+ --tds-pane-body-padding:var(--t-spacing-3);
7872
+
7873
+ --tds-pane-footer-padding-block:var(--t-spacing-2);
7874
+ --tds-pane-footer-padding-inline:var(--tds-pane-body-padding);
7875
+
7876
+ --tds-pane-divider-margin-block:var(--tds-pane-body-padding);
7877
+ --tds-pane-divider-margin-inline:calc(-1 * var(--tds-pane-body-padding));
7878
+
7879
+ background:var(--tds-pane-background-color);
7880
+ border-radius:var(--tds-pane-border-radius);
7881
+ border:var(--t-border-width) solid var(--tds-pane-border-color);
7882
+ display:flex;
7883
+ flex-direction:column;
7884
+ }
7885
+
7886
+ .tds-pane-header{
7887
+ border-bottom:var(--t-border-width) solid var(--tds-pane-border-color);
7888
+ padding-block:var(--tds-pane-header-padding-block);
7889
+ padding-inline:var(--tds-pane-header-padding-inline);
7890
+ }
7891
+
7892
+ .tds-pane-header > tds-helper-shelf > .tds-helper-shelf-trigger{
7893
+ margin-inline:calc(-1 * var(--t-spacing-1)) auto;
7894
+ }
7895
+
7896
+ .tds-pane-header > tds-helper-shelf > .tds-helper-shelf{
7897
+ flex-basis:100%;
7898
+ order:1;
7899
+ }
7900
+
7901
+ .tds-pane-header:has( > tds-helper-shelf){
7902
+ row-gap:var(--tds-pane-header-padding-block);
7903
+ padding-block-end:0;
7904
+ }
7905
+
7906
+ .tds-pane-header > tds-helper-shelf > .tds-helper-shelf > .tds-helper-shelf-content{
7907
+ font-size:var(--t-font-size-md);
7908
+ margin-block-end:var(--tds-pane-header-padding-block);
7909
+ }
7910
+
7911
+ .tds-pane-title{
7912
+ color:var(--tds-pane-title-color);
7913
+ font-size:var(--tds-pane-title-font-size);
7914
+ font-weight:var(--tds-pane-title-font-weight);
7915
+ line-height:var(--tds-pane-title-line-height);
7916
+ margin:0;
7917
+ }
7918
+
7919
+ .tds-pane-body{
7920
+ padding:var(--tds-pane-body-padding);
7921
+ }
7922
+
7923
+ .tds-pane-footer{
7924
+ padding-block-end:var(--tds-pane-footer-padding-block);
7925
+ padding-inline:var(--tds-pane-footer-padding-inline);
7926
+ }
7927
+
7928
+ .tds-pane-divider{
7929
+ border:0;
7930
+ border-top:var(--t-border-width) solid var(--tds-pane-border-color);
7931
+ margin-block:var(--tds-pane-divider-margin-block);
7932
+ margin-inline:var(--tds-pane-divider-margin-inline);
7933
+ }
7934
+
7935
+ .tds-pane-divider.tds-pane-divider--inset{
7936
+ margin-inline:0;
7937
+ }
7938
+
7939
+ tds-helper-shelf{
7940
+ display:contents;
7941
+ }
7942
+
7943
+ .tds-helper-shelf{
7944
+ --tds-helper-shelf-background-color:var(--t-fill-color-neutral-090);
7945
+ --tds-helper-shelf-border-radius:var(--t-border-radius-md);
7946
+ --tds-helper-shelf-color:var(--t-text-color);
7947
+ --tds-helper-shelf-font-size:var(--t-font-size-sm);
7948
+ --tds-helper-shelf-line-height:1.5;
7949
+ --tds-helper-shelf-padding:var(--t-spacing-1);
7950
+
7951
+ height:0;
7952
+ overflow:hidden;
7953
+ transition:height var(--t-duration-300) var(--t-ease-in);
7954
+ }
7955
+
7956
+ @media (prefers-reduced-motion: reduce){
7957
+
7958
+ .tds-helper-shelf{
7959
+ transition:none;
7960
+ }
7961
+ }
7962
+
7963
+ .tds-helper-shelf--expanded{
7964
+ height:auto;
7965
+ transition-timing-function:var(--t-ease-out);
7966
+ }
7967
+
7968
+ @supports (interpolate-size: allow-keywords){
7969
+ .tds-helper-shelf{
7970
+ interpolate-size:allow-keywords;
7971
+ }
7972
+ }
7973
+
7974
+ .tds-helper-shelf-content{
7975
+ padding:var(--tds-helper-shelf-padding);
7976
+ font-size:var(--tds-helper-shelf-font-size);
7977
+ line-height:var(--tds-helper-shelf-line-height);
7978
+ color:var(--tds-helper-shelf-color);
7979
+ background:var(--tds-helper-shelf-background-color);
7980
+ border-radius:var(--tds-helper-shelf-border-radius);
7981
+ }
7982
+
7983
+ .tds-helper-shelf-trigger{
7984
+ --tds-helper-shelf-trigger-color-expanded:var(--t-text-color-interaction);
7985
+ }
7986
+
7987
+ .tds-helper-shelf-trigger[aria-expanded="true"]{
7988
+ --tds-btn-color:var(--tds-helper-shelf-trigger-color-expanded);
7989
+ }
7990
+
7809
7991
  .tds-input:has(textarea){
7810
7992
  --tds-input-padding-block:6px;
7811
7993
  --tds-input-resizer-size:var(--t-element-size-sm);