@cloudscape-design/components 3.0.693 → 3.0.694

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 (158) hide show
  1. package/app-layout/visual-refresh-toolbar/drawer/styles.css.js +6 -6
  2. package/app-layout/visual-refresh-toolbar/drawer/styles.scoped.css +7 -7
  3. package/app-layout/visual-refresh-toolbar/drawer/styles.selectors.js +6 -6
  4. package/app-layout/visual-refresh-toolbar/navigation/styles.css.js +6 -6
  5. package/app-layout/visual-refresh-toolbar/navigation/styles.scoped.css +15 -11
  6. package/app-layout/visual-refresh-toolbar/navigation/styles.selectors.js +6 -6
  7. package/app-layout/visual-refresh-toolbar/skeleton/styles.css.js +16 -16
  8. package/app-layout/visual-refresh-toolbar/skeleton/styles.scoped.css +28 -28
  9. package/app-layout/visual-refresh-toolbar/skeleton/styles.selectors.js +16 -16
  10. package/app-layout/visual-refresh-toolbar/toolbar/trigger-button/styles.css.js +6 -6
  11. package/app-layout/visual-refresh-toolbar/toolbar/trigger-button/styles.scoped.css +30 -44
  12. package/app-layout/visual-refresh-toolbar/toolbar/trigger-button/styles.selectors.js +6 -6
  13. package/button-dropdown/analytics-metadata/interfaces.d.ts +26 -0
  14. package/button-dropdown/analytics-metadata/interfaces.d.ts.map +1 -0
  15. package/button-dropdown/analytics-metadata/interfaces.js +4 -0
  16. package/button-dropdown/analytics-metadata/interfaces.js.map +1 -0
  17. package/button-dropdown/analytics-metadata/styles.css.js +8 -0
  18. package/button-dropdown/analytics-metadata/styles.scoped.css +9 -0
  19. package/button-dropdown/analytics-metadata/styles.selectors.js +9 -0
  20. package/button-dropdown/category-elements/category-element.d.ts +1 -1
  21. package/button-dropdown/category-elements/category-element.d.ts.map +1 -1
  22. package/button-dropdown/category-elements/category-element.js +2 -2
  23. package/button-dropdown/category-elements/category-element.js.map +1 -1
  24. package/button-dropdown/category-elements/expandable-category-element.d.ts +1 -1
  25. package/button-dropdown/category-elements/expandable-category-element.d.ts.map +1 -1
  26. package/button-dropdown/category-elements/expandable-category-element.js +14 -3
  27. package/button-dropdown/category-elements/expandable-category-element.js.map +1 -1
  28. package/button-dropdown/category-elements/mobile-expandable-category-element.d.ts +1 -1
  29. package/button-dropdown/category-elements/mobile-expandable-category-element.d.ts.map +1 -1
  30. package/button-dropdown/category-elements/mobile-expandable-category-element.js +14 -3
  31. package/button-dropdown/category-elements/mobile-expandable-category-element.js.map +1 -1
  32. package/button-dropdown/index.d.ts.map +1 -1
  33. package/button-dropdown/index.js +10 -1
  34. package/button-dropdown/index.js.map +1 -1
  35. package/button-dropdown/interfaces.d.ts +3 -0
  36. package/button-dropdown/interfaces.d.ts.map +1 -1
  37. package/button-dropdown/interfaces.js.map +1 -1
  38. package/button-dropdown/internal.d.ts.map +1 -1
  39. package/button-dropdown/internal.js +22 -6
  40. package/button-dropdown/internal.js.map +1 -1
  41. package/button-dropdown/item-element/index.d.ts +1 -1
  42. package/button-dropdown/item-element/index.d.ts.map +1 -1
  43. package/button-dropdown/item-element/index.js +15 -4
  44. package/button-dropdown/item-element/index.js.map +1 -1
  45. package/button-dropdown/items-list.d.ts +1 -1
  46. package/button-dropdown/items-list.d.ts.map +1 -1
  47. package/button-dropdown/items-list.js +4 -4
  48. package/button-dropdown/items-list.js.map +1 -1
  49. package/button-dropdown/styles.css.js +18 -15
  50. package/button-dropdown/styles.scoped.css +31 -22
  51. package/button-dropdown/styles.selectors.js +18 -15
  52. package/container/analytics-metadata/interfaces.d.ts +5 -0
  53. package/container/analytics-metadata/interfaces.d.ts.map +1 -0
  54. package/container/analytics-metadata/interfaces.js +4 -0
  55. package/container/analytics-metadata/interfaces.js.map +1 -0
  56. package/container/analytics-metadata/styles.css.js +6 -0
  57. package/container/analytics-metadata/styles.scoped.css +7 -0
  58. package/container/analytics-metadata/styles.selectors.js +7 -0
  59. package/container/index.d.ts.map +1 -1
  60. package/container/index.js +6 -1
  61. package/container/index.js.map +1 -1
  62. package/container/internal.d.ts.map +1 -1
  63. package/container/internal.js +4 -2
  64. package/container/internal.js.map +1 -1
  65. package/drawer/implementation.d.ts.map +1 -1
  66. package/drawer/implementation.js +3 -1
  67. package/drawer/implementation.js.map +1 -1
  68. package/drawer/styles.css.js +4 -3
  69. package/drawer/styles.scoped.css +16 -8
  70. package/drawer/styles.selectors.js +4 -3
  71. package/form/analytics-metadata/interfaces.d.ts +13 -0
  72. package/form/analytics-metadata/interfaces.d.ts.map +1 -0
  73. package/form/analytics-metadata/interfaces.js +4 -0
  74. package/form/analytics-metadata/interfaces.js.map +1 -0
  75. package/form/analytics-metadata/styles.css.js +6 -0
  76. package/form/analytics-metadata/styles.scoped.css +7 -0
  77. package/form/analytics-metadata/styles.selectors.js +7 -0
  78. package/form/index.d.ts.map +1 -1
  79. package/form/index.js +1 -1
  80. package/form/index.js.map +1 -1
  81. package/form/internal.d.ts +4 -2
  82. package/form/internal.d.ts.map +1 -1
  83. package/form/internal.js +13 -3
  84. package/form/internal.js.map +1 -1
  85. package/header/analytics-metadata/styles.css.js +6 -0
  86. package/header/analytics-metadata/styles.scoped.css +7 -0
  87. package/header/analytics-metadata/styles.selectors.js +7 -0
  88. package/header/internal.d.ts.map +1 -1
  89. package/header/internal.js +4 -2
  90. package/header/internal.js.map +1 -1
  91. package/help-panel/implementation.d.ts.map +1 -1
  92. package/help-panel/implementation.js +4 -2
  93. package/help-panel/implementation.js.map +1 -1
  94. package/help-panel/styles.css.js +5 -4
  95. package/help-panel/styles.scoped.css +74 -65
  96. package/help-panel/styles.selectors.js +5 -4
  97. package/internal/components/button-trigger/styles.css.js +11 -11
  98. package/internal/components/button-trigger/styles.scoped.css +52 -49
  99. package/internal/components/button-trigger/styles.selectors.js +11 -11
  100. package/internal/components/token-list/index.d.ts +1 -0
  101. package/internal/components/token-list/index.d.ts.map +1 -1
  102. package/internal/components/token-list/index.js.map +1 -1
  103. package/internal/components/tooltip/index.d.ts.map +1 -1
  104. package/internal/components/tooltip/index.js +1 -1
  105. package/internal/components/tooltip/index.js.map +1 -1
  106. package/internal/environment.js +1 -1
  107. package/internal/environment.json +1 -1
  108. package/internal/manifest.json +1 -1
  109. package/package.json +1 -1
  110. package/popover/internal.d.ts +2 -1
  111. package/popover/internal.d.ts.map +1 -1
  112. package/popover/internal.js +1 -1
  113. package/popover/internal.js.map +1 -1
  114. package/popover/styles.css.js +52 -50
  115. package/popover/styles.scoped.css +75 -67
  116. package/popover/styles.selectors.js +52 -50
  117. package/property-filter/filtering-token/index.d.ts +25 -8
  118. package/property-filter/filtering-token/index.d.ts.map +1 -1
  119. package/property-filter/filtering-token/index.js +51 -11
  120. package/property-filter/filtering-token/index.js.map +1 -1
  121. package/property-filter/filtering-token/styles.css.js +18 -7
  122. package/property-filter/filtering-token/styles.scoped.css +100 -17
  123. package/property-filter/filtering-token/styles.selectors.js +18 -7
  124. package/property-filter/styles.css.js +31 -32
  125. package/property-filter/styles.scoped.css +33 -34
  126. package/property-filter/styles.selectors.js +31 -32
  127. package/property-filter/test-classes/styles.css.js +14 -9
  128. package/property-filter/test-classes/styles.scoped.css +29 -9
  129. package/property-filter/test-classes/styles.selectors.js +14 -9
  130. package/property-filter/token-editor.d.ts +5 -5
  131. package/property-filter/token-editor.d.ts.map +1 -1
  132. package/property-filter/token-editor.js +19 -25
  133. package/property-filter/token-editor.js.map +1 -1
  134. package/property-filter/token.d.ts.map +1 -1
  135. package/property-filter/token.js +15 -5
  136. package/property-filter/token.js.map +1 -1
  137. package/side-navigation/implementation.d.ts.map +1 -1
  138. package/side-navigation/implementation.js +3 -1
  139. package/side-navigation/implementation.js.map +1 -1
  140. package/side-navigation/styles.css.js +29 -28
  141. package/side-navigation/styles.scoped.css +47 -38
  142. package/side-navigation/styles.selectors.js +29 -28
  143. package/split-panel/implementation.d.ts.map +1 -1
  144. package/split-panel/implementation.js +3 -1
  145. package/split-panel/implementation.js.map +1 -1
  146. package/split-panel/side.d.ts.map +1 -1
  147. package/split-panel/side.js +4 -1
  148. package/split-panel/side.js.map +1 -1
  149. package/split-panel/styles.css.js +27 -27
  150. package/split-panel/styles.scoped.css +62 -44
  151. package/split-panel/styles.selectors.js +27 -27
  152. package/test-utils/dom/property-filter/index.d.ts +10 -0
  153. package/test-utils/dom/property-filter/index.js +25 -1
  154. package/test-utils/dom/property-filter/index.js.map +1 -1
  155. package/test-utils/selectors/property-filter/index.d.ts +10 -0
  156. package/test-utils/selectors/property-filter/index.js +25 -1
  157. package/test-utils/selectors/property-filter/index.js.map +1 -1
  158. package/test-utils/tsconfig.tsbuildinfo +1 -1
@@ -1,33 +1,34 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "root": "awsui_root_l0dv0_1s9d7_97",
5
- "header": "awsui_header_l0dv0_1s9d7_134",
6
- "header-link": "awsui_header-link_l0dv0_1s9d7_147",
7
- "header-link--has-logo": "awsui_header-link--has-logo_l0dv0_1s9d7_157",
8
- "header-link-text": "awsui_header-link-text_l0dv0_1s9d7_157",
9
- "header-logo": "awsui_header-logo_l0dv0_1s9d7_162",
10
- "header-logo--stretched": "awsui_header-logo--stretched_l0dv0_1s9d7_168",
11
- "list-container": "awsui_list-container_l0dv0_1s9d7_173",
12
- "list": "awsui_list_l0dv0_1s9d7_173",
13
- "list-variant-root": "awsui_list-variant-root_l0dv0_1s9d7_185",
14
- "list-variant-root--last": "awsui_list-variant-root--last_l0dv0_1s9d7_192",
15
- "list-variant-expandable-link-group": "awsui_list-variant-expandable-link-group_l0dv0_1s9d7_196",
16
- "list-item": "awsui_list-item_l0dv0_1s9d7_200",
17
- "section": "awsui_section_l0dv0_1s9d7_208",
18
- "expandable-link-group": "awsui_expandable-link-group_l0dv0_1s9d7_209",
19
- "section--no-ident": "awsui_section--no-ident_l0dv0_1s9d7_212",
20
- "expandable-link-group--no-ident": "awsui_expandable-link-group--no-ident_l0dv0_1s9d7_213",
21
- "refresh": "awsui_refresh_l0dv0_1s9d7_221",
22
- "list-variant-section-group": "awsui_list-variant-section-group_l0dv0_1s9d7_229",
23
- "section-group": "awsui_section-group_l0dv0_1s9d7_236",
24
- "section-group-title": "awsui_section-group-title_l0dv0_1s9d7_247",
25
- "link": "awsui_link_l0dv0_1s9d7_251",
26
- "link-active": "awsui_link-active_l0dv0_1s9d7_260",
27
- "info": "awsui_info_l0dv0_1s9d7_297",
28
- "external-icon": "awsui_external-icon_l0dv0_1s9d7_301",
29
- "divider": "awsui_divider_l0dv0_1s9d7_305",
30
- "divider-default": "awsui_divider-default_l0dv0_1s9d7_310",
31
- "divider-header": "awsui_divider-header_l0dv0_1s9d7_316"
4
+ "root": "awsui_root_l0dv0_lk9xb_97",
5
+ "header": "awsui_header_l0dv0_lk9xb_134",
6
+ "with-toolbar": "awsui_with-toolbar_l0dv0_lk9xb_146",
7
+ "header-link": "awsui_header-link_l0dv0_lk9xb_150",
8
+ "header-link--has-logo": "awsui_header-link--has-logo_l0dv0_lk9xb_160",
9
+ "header-link-text": "awsui_header-link-text_l0dv0_lk9xb_160",
10
+ "header-logo": "awsui_header-logo_l0dv0_lk9xb_165",
11
+ "header-logo--stretched": "awsui_header-logo--stretched_l0dv0_lk9xb_171",
12
+ "list-container": "awsui_list-container_l0dv0_lk9xb_176",
13
+ "list": "awsui_list_l0dv0_lk9xb_176",
14
+ "list-variant-root": "awsui_list-variant-root_l0dv0_lk9xb_191",
15
+ "list-variant-root--last": "awsui_list-variant-root--last_l0dv0_lk9xb_198",
16
+ "list-variant-expandable-link-group": "awsui_list-variant-expandable-link-group_l0dv0_lk9xb_202",
17
+ "list-item": "awsui_list-item_l0dv0_lk9xb_206",
18
+ "section": "awsui_section_l0dv0_lk9xb_214",
19
+ "expandable-link-group": "awsui_expandable-link-group_l0dv0_lk9xb_215",
20
+ "section--no-ident": "awsui_section--no-ident_l0dv0_lk9xb_218",
21
+ "expandable-link-group--no-ident": "awsui_expandable-link-group--no-ident_l0dv0_lk9xb_219",
22
+ "refresh": "awsui_refresh_l0dv0_lk9xb_227",
23
+ "list-variant-section-group": "awsui_list-variant-section-group_l0dv0_lk9xb_235",
24
+ "section-group": "awsui_section-group_l0dv0_lk9xb_242",
25
+ "section-group-title": "awsui_section-group-title_l0dv0_lk9xb_253",
26
+ "link": "awsui_link_l0dv0_lk9xb_257",
27
+ "link-active": "awsui_link-active_l0dv0_lk9xb_266",
28
+ "info": "awsui_info_l0dv0_lk9xb_303",
29
+ "external-icon": "awsui_external-icon_l0dv0_lk9xb_307",
30
+ "divider": "awsui_divider_l0dv0_lk9xb_311",
31
+ "divider-default": "awsui_divider-default_l0dv0_lk9xb_316",
32
+ "divider-header": "awsui_divider-header_l0dv0_lk9xb_322"
32
33
  };
33
34
 
@@ -94,7 +94,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
94
94
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
95
95
  SPDX-License-Identifier: Apache-2.0
96
96
  */
97
- .awsui_root_l0dv0_1s9d7_97:not(#\9) {
97
+ .awsui_root_l0dv0_lk9xb_97:not(#\9) {
98
98
  border-collapse: separate;
99
99
  border-spacing: 0;
100
100
  box-sizing: border-box;
@@ -132,7 +132,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
132
132
  word-break: break-word;
133
133
  }
134
134
 
135
- .awsui_header_l0dv0_1s9d7_134:not(#\9) {
135
+ .awsui_header_l0dv0_lk9xb_134:not(#\9) {
136
136
  font-size: var(--font-panel-header-size-edjz3l, 18px);
137
137
  line-height: var(--font-panel-header-line-height-kxi4u2, 22px);
138
138
  font-weight: var(--font-weight-heading-l-f8711v, 700);
@@ -144,8 +144,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
144
144
  padding-inline-start: var(--space-panel-nav-left-b1g0mt, 28px);
145
145
  padding-inline-end: calc(var(--space-scaled-xxl-wbot5q, 32px) + var(--space-xl-lmui9r, 24px));
146
146
  }
147
+ .awsui_with-toolbar_l0dv0_lk9xb_146 > .awsui_header_l0dv0_lk9xb_134:not(#\9) {
148
+ padding-block: var(--space-static-m-lrhgl2, 16px);
149
+ }
147
150
 
148
- .awsui_header-link_l0dv0_1s9d7_147:not(#\9) {
151
+ .awsui_header-link_l0dv0_lk9xb_150:not(#\9) {
149
152
  font-size: var(--font-panel-header-size-edjz3l, 18px);
150
153
  line-height: var(--font-panel-header-line-height-kxi4u2, 22px);
151
154
  font-weight: var(--font-weight-heading-l-f8711v, 700);
@@ -155,27 +158,30 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
155
158
  min-block-size: var(--font-panel-header-line-height-kxi4u2, 22px);
156
159
  display: flex;
157
160
  }
158
- .awsui_header-link--has-logo_l0dv0_1s9d7_157 > .awsui_header-link-text_l0dv0_1s9d7_157:not(#\9) {
161
+ .awsui_header-link--has-logo_l0dv0_lk9xb_160 > .awsui_header-link-text_l0dv0_lk9xb_160:not(#\9) {
159
162
  font-weight: 400;
160
163
  align-self: center;
161
164
  }
162
165
 
163
- .awsui_header-logo_l0dv0_1s9d7_162:not(#\9) {
166
+ .awsui_header-logo_l0dv0_lk9xb_165:not(#\9) {
164
167
  margin-inline-end: var(--space-s-34lx8l, 12px);
165
168
  margin-block-start: var(--space-xxxs-zbmxqb, 2px);
166
169
  max-inline-size: calc(1.25 * var(--size-icon-big-zkdryd, 32px));
167
170
  align-self: flex-start;
168
171
  }
169
- .awsui_header-logo--stretched_l0dv0_1s9d7_168:not(#\9) {
172
+ .awsui_header-logo--stretched_l0dv0_lk9xb_171:not(#\9) {
170
173
  max-inline-size: 100%;
171
174
  margin-inline-end: 0;
172
175
  }
173
176
 
174
- .awsui_list-container_l0dv0_1s9d7_173:not(#\9) {
177
+ .awsui_list-container_l0dv0_lk9xb_176:not(#\9) {
175
178
  margin-block-start: var(--space-panel-content-top-wac3yp, 20px);
176
179
  }
180
+ .awsui_with-toolbar_l0dv0_lk9xb_146 > .awsui_list-container_l0dv0_lk9xb_176:not(#\9) {
181
+ margin-block-start: 0px;
182
+ }
177
183
 
178
- .awsui_list_l0dv0_1s9d7_173:not(#\9) {
184
+ .awsui_list_l0dv0_lk9xb_176:not(#\9) {
179
185
  margin-block: 0;
180
186
  margin-inline: 0;
181
187
  padding-block: 0;
@@ -183,22 +189,22 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
183
189
  padding-inline-start: var(--space-l-t419sm, 20px);
184
190
  }
185
191
 
186
- .awsui_list-variant-root_l0dv0_1s9d7_185:not(#\9) {
192
+ .awsui_list-variant-root_l0dv0_lk9xb_191:not(#\9) {
187
193
  margin-block: 0;
188
194
  margin-inline: 0;
189
195
  padding-block: 0;
190
196
  padding-inline-start: var(--space-panel-nav-left-b1g0mt, 28px);
191
197
  padding-inline-end: var(--space-panel-side-right-xofg51, 24px);
192
198
  }
193
- .awsui_list-variant-root--last_l0dv0_1s9d7_192:not(#\9) {
199
+ .awsui_list-variant-root--last_l0dv0_lk9xb_198:not(#\9) {
194
200
  margin-block-end: var(--space-panel-content-bottom-7k6er3, 40px);
195
201
  }
196
202
 
197
- .awsui_list-variant-expandable-link-group_l0dv0_1s9d7_196:not(#\9) {
203
+ .awsui_list-variant-expandable-link-group_l0dv0_lk9xb_202:not(#\9) {
198
204
  padding-inline-start: var(--space-xxxl-4x2gki, 40px);
199
205
  }
200
206
 
201
- .awsui_list-item_l0dv0_1s9d7_200:not(#\9) {
207
+ .awsui_list-item_l0dv0_lk9xb_206:not(#\9) {
202
208
  margin-block: var(--space-scaled-xs-26e2du, 8px);
203
209
  margin-inline: 0;
204
210
  padding-block: 0;
@@ -206,35 +212,35 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
206
212
  list-style: none;
207
213
  }
208
214
 
209
- .awsui_section_l0dv0_1s9d7_208:not(#\9),
210
- .awsui_expandable-link-group_l0dv0_1s9d7_209:not(#\9) {
215
+ .awsui_section_l0dv0_lk9xb_214:not(#\9),
216
+ .awsui_expandable-link-group_l0dv0_lk9xb_215:not(#\9) {
211
217
  margin-inline-start: calc(-1 * var(--space-l-t419sm, 20px));
212
218
  }
213
- .awsui_section--no-ident_l0dv0_1s9d7_212:not(#\9),
214
- .awsui_expandable-link-group--no-ident_l0dv0_1s9d7_213:not(#\9) {
219
+ .awsui_section--no-ident_l0dv0_lk9xb_218:not(#\9),
220
+ .awsui_expandable-link-group--no-ident_l0dv0_lk9xb_219:not(#\9) {
215
221
  margin-inline-start: 0;
216
222
  }
217
223
 
218
- .awsui_section_l0dv0_1s9d7_208:not(#\9) {
224
+ .awsui_section_l0dv0_lk9xb_214:not(#\9) {
219
225
  margin-block: calc(var(--space-scaled-2x-l-ujnz41, 20px) - var(--border-divider-section-width-1061zr, 1px));
220
226
  /* stylelint-disable-next-line selector-max-type */
221
227
  }
222
- .awsui_section_l0dv0_1s9d7_208.awsui_refresh_l0dv0_1s9d7_221:not(#\9) {
228
+ .awsui_section_l0dv0_lk9xb_214.awsui_refresh_l0dv0_lk9xb_227:not(#\9) {
223
229
  margin-block: calc(var(--space-scaled-2x-m-owtj1o, 16px) - var(--border-divider-section-width-1061zr, 1px));
224
230
  }
225
- .awsui_section_l0dv0_1s9d7_208 > div:not(#\9) {
231
+ .awsui_section_l0dv0_lk9xb_214 > div:not(#\9) {
226
232
  padding-block: 0;
227
233
  padding-inline: 0;
228
234
  }
229
235
 
230
- .awsui_list-variant-section-group_l0dv0_1s9d7_229:not(#\9) {
236
+ .awsui_list-variant-section-group_l0dv0_lk9xb_235:not(#\9) {
231
237
  margin-block: 0;
232
238
  margin-inline: 0;
233
239
  padding-block: 0;
234
240
  padding-inline: 0;
235
241
  }
236
242
 
237
- .awsui_section-group_l0dv0_1s9d7_236:not(#\9) {
243
+ .awsui_section-group_l0dv0_lk9xb_242:not(#\9) {
238
244
  font-size: var(--font-size-heading-m-sjd256, 18px);
239
245
  line-height: var(--line-height-heading-m-50evfk, 22px);
240
246
  letter-spacing: var(--letter-spacing-heading-m-0w575i, -0.01em);
@@ -245,11 +251,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
245
251
  margin-inline: 0;
246
252
  }
247
253
 
248
- .awsui_section-group-title_l0dv0_1s9d7_247:not(#\9) {
254
+ .awsui_section-group-title_l0dv0_lk9xb_253:not(#\9) {
249
255
  /* used in test-utils */
250
256
  }
251
257
 
252
- .awsui_link_l0dv0_1s9d7_251:not(#\9) {
258
+ .awsui_link_l0dv0_lk9xb_257:not(#\9) {
253
259
  font-size: var(--font-size-body-m-x4okxb, 14px);
254
260
  line-height: var(--line-height-body-m-30ar75, 20px);
255
261
  color: var(--color-text-body-secondary-w9jvno, #414d5c);
@@ -258,30 +264,30 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
258
264
  -moz-osx-font-smoothing: auto;
259
265
  }
260
266
 
261
- .awsui_link-active_l0dv0_1s9d7_260:not(#\9) {
267
+ .awsui_link-active_l0dv0_lk9xb_266:not(#\9) {
262
268
  font-weight: var(--font-wayfinding-link-active-weight-rbmzei, 700);
263
269
  -webkit-font-smoothing: var(--font-smoothing-webkit-m8nc84, antialiased);
264
270
  -moz-osx-font-smoothing: var(--font-smoothing-moz-osx-foywby, grayscale);
265
271
  color: var(--color-text-accent-n2acxv, #0972d3);
266
272
  }
267
273
 
268
- .awsui_header-link_l0dv0_1s9d7_147:not(#\9),
269
- .awsui_link_l0dv0_1s9d7_251:not(#\9) {
274
+ .awsui_header-link_l0dv0_lk9xb_150:not(#\9),
275
+ .awsui_link_l0dv0_lk9xb_257:not(#\9) {
270
276
  text-decoration: none;
271
277
  }
272
- .awsui_header-link_l0dv0_1s9d7_147:not(#\9):hover,
273
- .awsui_link_l0dv0_1s9d7_251:not(#\9):hover {
278
+ .awsui_header-link_l0dv0_lk9xb_150:not(#\9):hover,
279
+ .awsui_link_l0dv0_lk9xb_257:not(#\9):hover {
274
280
  color: var(--color-text-accent-n2acxv, #0972d3);
275
281
  }
276
- .awsui_header-link_l0dv0_1s9d7_147:not(#\9):focus,
277
- .awsui_link_l0dv0_1s9d7_251:not(#\9):focus {
282
+ .awsui_header-link_l0dv0_lk9xb_150:not(#\9):focus,
283
+ .awsui_link_l0dv0_lk9xb_257:not(#\9):focus {
278
284
  outline: none;
279
285
  }
280
- .awsui_header-link_l0dv0_1s9d7_147:not(#\9):hover, .awsui_header-link_l0dv0_1s9d7_147:not(#\9):focus, .awsui_link_l0dv0_1s9d7_251:not(#\9):hover, .awsui_link_l0dv0_1s9d7_251:not(#\9):focus {
286
+ .awsui_header-link_l0dv0_lk9xb_150:not(#\9):hover, .awsui_header-link_l0dv0_lk9xb_150:not(#\9):focus, .awsui_link_l0dv0_lk9xb_257:not(#\9):hover, .awsui_link_l0dv0_lk9xb_257:not(#\9):focus {
281
287
  text-decoration: none;
282
288
  }
283
- body[data-awsui-focus-visible=true] .awsui_header-link_l0dv0_1s9d7_147:not(#\9):focus,
284
- body[data-awsui-focus-visible=true] .awsui_link_l0dv0_1s9d7_251:not(#\9):focus {
289
+ body[data-awsui-focus-visible=true] .awsui_header-link_l0dv0_lk9xb_150:not(#\9):focus,
290
+ body[data-awsui-focus-visible=true] .awsui_link_l0dv0_lk9xb_257:not(#\9):focus {
285
291
  outline: thin dotted;
286
292
  outline: var(--border-link-focus-ring-outline-kkfop6, 0);
287
293
  outline-offset: 2px;
@@ -293,26 +299,29 @@ body[data-awsui-focus-visible=true] .awsui_link_l0dv0_1s9d7_251:not(#\9):focus {
293
299
  box-shadow: 0 0 0 var(--border-link-focus-ring-shadow-spread-v8hkrl, 2px) var(--color-border-item-focused-b2ntyl, #0972d3);
294
300
  }
295
301
 
296
- .awsui_info_l0dv0_1s9d7_297:not(#\9) {
302
+ .awsui_info_l0dv0_lk9xb_303:not(#\9) {
297
303
  margin-inline-start: var(--space-xs-zb16t3, 8px);
298
304
  }
299
305
 
300
- .awsui_external-icon_l0dv0_1s9d7_301:not(#\9) {
306
+ .awsui_external-icon_l0dv0_lk9xb_307:not(#\9) {
301
307
  margin-inline-start: var(--space-xxs-p8yyaw, 4px);
302
308
  }
303
309
 
304
- .awsui_divider_l0dv0_1s9d7_305:not(#\9) {
310
+ .awsui_divider_l0dv0_lk9xb_311:not(#\9) {
305
311
  border-block: none;
306
312
  border-inline: none;
307
313
  }
308
314
 
309
- .awsui_divider-default_l0dv0_1s9d7_310:not(#\9) {
315
+ .awsui_divider-default_l0dv0_lk9xb_316:not(#\9) {
310
316
  margin-block: var(--space-scaled-2x-xl-udij7m, 24px);
311
317
  margin-inline: calc(-1 * var(--space-panel-divider-margin-horizontal-sbik1z, 8px));
312
318
  border-block-start: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-divider-default-j74lyz, #b6bec9);
313
319
  }
314
320
 
315
- .awsui_divider-header_l0dv0_1s9d7_316:not(#\9) {
321
+ .awsui_divider-header_l0dv0_lk9xb_322:not(#\9) {
316
322
  margin-block-start: 0;
317
323
  border-block-start: var(--border-divider-section-width-1061zr, 1px) solid var(--color-border-panel-header-lf0q4c, #b6bec9);
324
+ }
325
+ .awsui_with-toolbar_l0dv0_lk9xb_146 > .awsui_divider-header_l0dv0_lk9xb_322:not(#\9) {
326
+ border-color: transparent;
318
327
  }
@@ -2,33 +2,34 @@
2
2
  // es-module interop with Babel and Typescript
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
4
  module.exports.default = {
5
- "root": "awsui_root_l0dv0_1s9d7_97",
6
- "header": "awsui_header_l0dv0_1s9d7_134",
7
- "header-link": "awsui_header-link_l0dv0_1s9d7_147",
8
- "header-link--has-logo": "awsui_header-link--has-logo_l0dv0_1s9d7_157",
9
- "header-link-text": "awsui_header-link-text_l0dv0_1s9d7_157",
10
- "header-logo": "awsui_header-logo_l0dv0_1s9d7_162",
11
- "header-logo--stretched": "awsui_header-logo--stretched_l0dv0_1s9d7_168",
12
- "list-container": "awsui_list-container_l0dv0_1s9d7_173",
13
- "list": "awsui_list_l0dv0_1s9d7_173",
14
- "list-variant-root": "awsui_list-variant-root_l0dv0_1s9d7_185",
15
- "list-variant-root--last": "awsui_list-variant-root--last_l0dv0_1s9d7_192",
16
- "list-variant-expandable-link-group": "awsui_list-variant-expandable-link-group_l0dv0_1s9d7_196",
17
- "list-item": "awsui_list-item_l0dv0_1s9d7_200",
18
- "section": "awsui_section_l0dv0_1s9d7_208",
19
- "expandable-link-group": "awsui_expandable-link-group_l0dv0_1s9d7_209",
20
- "section--no-ident": "awsui_section--no-ident_l0dv0_1s9d7_212",
21
- "expandable-link-group--no-ident": "awsui_expandable-link-group--no-ident_l0dv0_1s9d7_213",
22
- "refresh": "awsui_refresh_l0dv0_1s9d7_221",
23
- "list-variant-section-group": "awsui_list-variant-section-group_l0dv0_1s9d7_229",
24
- "section-group": "awsui_section-group_l0dv0_1s9d7_236",
25
- "section-group-title": "awsui_section-group-title_l0dv0_1s9d7_247",
26
- "link": "awsui_link_l0dv0_1s9d7_251",
27
- "link-active": "awsui_link-active_l0dv0_1s9d7_260",
28
- "info": "awsui_info_l0dv0_1s9d7_297",
29
- "external-icon": "awsui_external-icon_l0dv0_1s9d7_301",
30
- "divider": "awsui_divider_l0dv0_1s9d7_305",
31
- "divider-default": "awsui_divider-default_l0dv0_1s9d7_310",
32
- "divider-header": "awsui_divider-header_l0dv0_1s9d7_316"
5
+ "root": "awsui_root_l0dv0_lk9xb_97",
6
+ "header": "awsui_header_l0dv0_lk9xb_134",
7
+ "with-toolbar": "awsui_with-toolbar_l0dv0_lk9xb_146",
8
+ "header-link": "awsui_header-link_l0dv0_lk9xb_150",
9
+ "header-link--has-logo": "awsui_header-link--has-logo_l0dv0_lk9xb_160",
10
+ "header-link-text": "awsui_header-link-text_l0dv0_lk9xb_160",
11
+ "header-logo": "awsui_header-logo_l0dv0_lk9xb_165",
12
+ "header-logo--stretched": "awsui_header-logo--stretched_l0dv0_lk9xb_171",
13
+ "list-container": "awsui_list-container_l0dv0_lk9xb_176",
14
+ "list": "awsui_list_l0dv0_lk9xb_176",
15
+ "list-variant-root": "awsui_list-variant-root_l0dv0_lk9xb_191",
16
+ "list-variant-root--last": "awsui_list-variant-root--last_l0dv0_lk9xb_198",
17
+ "list-variant-expandable-link-group": "awsui_list-variant-expandable-link-group_l0dv0_lk9xb_202",
18
+ "list-item": "awsui_list-item_l0dv0_lk9xb_206",
19
+ "section": "awsui_section_l0dv0_lk9xb_214",
20
+ "expandable-link-group": "awsui_expandable-link-group_l0dv0_lk9xb_215",
21
+ "section--no-ident": "awsui_section--no-ident_l0dv0_lk9xb_218",
22
+ "expandable-link-group--no-ident": "awsui_expandable-link-group--no-ident_l0dv0_lk9xb_219",
23
+ "refresh": "awsui_refresh_l0dv0_lk9xb_227",
24
+ "list-variant-section-group": "awsui_list-variant-section-group_l0dv0_lk9xb_235",
25
+ "section-group": "awsui_section-group_l0dv0_lk9xb_242",
26
+ "section-group-title": "awsui_section-group-title_l0dv0_lk9xb_253",
27
+ "link": "awsui_link_l0dv0_lk9xb_257",
28
+ "link-active": "awsui_link-active_l0dv0_lk9xb_266",
29
+ "info": "awsui_info_l0dv0_lk9xb_303",
30
+ "external-icon": "awsui_external-icon_l0dv0_lk9xb_307",
31
+ "divider": "awsui_divider_l0dv0_lk9xb_311",
32
+ "divider-default": "awsui_divider-default_l0dv0_lk9xb_316",
33
+ "divider-header": "awsui_divider-header_l0dv0_lk9xb_322"
33
34
  };
34
35
 
@@ -1 +1 @@
1
- {"version":3,"file":"implementation.d.ts","sourceRoot":"","sources":["../../../src/split-panel/implementation.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAuD,MAAM,OAAO,CAAC;AAkB5E,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAO/C,OAAO,EAAE,eAAe,EAAE,CAAC;AAE3B,eAAO,MAAM,wBAAwB,qFAwOpC,CAAC;AAEF,eAAO,MAAM,0BAA0B,mMAIZ,CAAC"}
1
+ {"version":3,"file":"implementation.d.ts","sourceRoot":"","sources":["../../../src/split-panel/implementation.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAuD,MAAM,OAAO,CAAC;AAoB5E,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAO/C,OAAO,EAAE,eAAe,EAAE,CAAC;AAE3B,eAAO,MAAM,wBAAwB,qFAyOpC,CAAC;AAEF,eAAO,MAAM,0BAA0B,mMAIZ,CAAC"}
@@ -3,6 +3,7 @@ import { __rest } from "tslib";
3
3
  // SPDX-License-Identifier: Apache-2.0
4
4
  import React, { useEffect, useLayoutEffect, useRef, useState } from 'react';
5
5
  import clsx from 'clsx';
6
+ import { getGlobalFlag } from '@cloudscape-design/component-toolkit/internal';
6
7
  import { useKeyboardEvents } from '../app-layout/utils/use-keyboard-events';
7
8
  import { usePointerEvents } from '../app-layout/utils/use-pointer-events';
8
9
  import { InternalButton } from '../button/internal';
@@ -27,6 +28,7 @@ export const SplitPanelImplementation = React.forwardRef((_a, __internalRootRef)
27
28
  const { position, topOffset, bottomOffset, rightOffset, contentWidthStyles, isOpen, isForcedPosition, onPreferencesChange, onResize, onToggle, size, relativeSize, setSplitPanelToggle, refs, } = useSplitPanelContext();
28
29
  const baseProps = getBaseProps(restProps);
29
30
  const i18n = useInternalI18n('split-panel');
31
+ const hasToolbar = getGlobalFlag('appLayoutWidget');
30
32
  const [isPreferencesOpen, setPreferencesOpen] = useState(false);
31
33
  const appLayoutMaxWidth = isRefresh && position === 'bottom' ? contentWidthStyles : undefined;
32
34
  const openButtonAriaLabel = i18n('i18nStrings.openButtonAriaLabel', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.openButtonAriaLabel);
@@ -47,7 +49,7 @@ export const SplitPanelImplementation = React.forwardRef((_a, __internalRootRef)
47
49
  [globalVars.stickyVerticalBottomOffset]: bottomOffset,
48
50
  };
49
51
  const panelHeaderId = useUniqueId('split-panel-header');
50
- const wrappedHeader = (React.createElement("div", { className: styles.header, style: appLayoutMaxWidth },
52
+ const wrappedHeader = (React.createElement("div", { className: clsx(styles.header, hasToolbar && styles['with-toolbar']), style: appLayoutMaxWidth },
51
53
  React.createElement("h2", { className: clsx(styles['header-text'], testUtilStyles['header-text']), id: panelHeaderId }, header),
52
54
  React.createElement("div", { className: styles['header-actions'] },
53
55
  !hidePreferencesButton && isOpen && (React.createElement(React.Fragment, null,
@@ -1 +1 @@
1
- {"version":3,"file":"implementation.js","sourceRoot":"","sources":["../../../src/split-panel/implementation.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useLayoutEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { SizeControlProps } from '../app-layout/utils/interfaces';\nimport { useKeyboardEvents } from '../app-layout/utils/use-keyboard-events';\nimport { usePointerEvents } from '../app-layout/utils/use-pointer-events';\nimport { InternalButton } from '../button/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport { getBaseProps } from '../internal/base-component';\nimport PanelResizeHandle from '../internal/components/panel-resize-handle';\nimport { Transition } from '../internal/components/transition';\nimport { useSplitPanelContext } from '../internal/context/split-panel-context';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport globalVars from '../internal/styles/global-vars';\nimport { createWidgetizedForwardRef } from '../internal/widgets';\nimport { SplitPanelContentBottom } from './bottom';\nimport { SplitPanelProps } from './interfaces';\nimport PreferencesModal from './preferences-modal';\nimport { SplitPanelContentSide } from './side';\n\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\nexport { SplitPanelProps };\n\nexport const SplitPanelImplementation = React.forwardRef<HTMLElement, SplitPanelProps>(\n (\n { header, children, hidePreferencesButton = false, closeBehavior = 'collapse', i18nStrings, ...restProps },\n __internalRootRef\n ) => {\n const isRefresh = useVisualRefresh();\n\n const {\n position,\n topOffset,\n bottomOffset,\n rightOffset,\n contentWidthStyles,\n isOpen,\n isForcedPosition,\n onPreferencesChange,\n onResize,\n onToggle,\n size,\n relativeSize,\n setSplitPanelToggle,\n refs,\n } = useSplitPanelContext();\n const baseProps = getBaseProps(restProps);\n const i18n = useInternalI18n('split-panel');\n const [isPreferencesOpen, setPreferencesOpen] = useState<boolean>(false);\n\n const appLayoutMaxWidth = isRefresh && position === 'bottom' ? contentWidthStyles : undefined;\n\n const openButtonAriaLabel = i18n('i18nStrings.openButtonAriaLabel', i18nStrings?.openButtonAriaLabel);\n useEffect(() => {\n setSplitPanelToggle({ displayed: closeBehavior === 'collapse', ariaLabel: openButtonAriaLabel });\n }, [setSplitPanelToggle, openButtonAriaLabel, closeBehavior]);\n\n const splitPanelRefObject = useRef<HTMLDivElement>(null);\n\n const sizeControlProps: SizeControlProps = {\n position,\n panelRef: splitPanelRefObject,\n handleRef: refs.slider,\n onResize,\n };\n const onSliderPointerDown = usePointerEvents(sizeControlProps);\n const onKeyDown = useKeyboardEvents(sizeControlProps);\n\n const contentStyle = {\n [globalVars.stickyVerticalTopOffset]: topOffset,\n [globalVars.stickyVerticalBottomOffset]: bottomOffset,\n };\n\n const panelHeaderId = useUniqueId('split-panel-header');\n\n const wrappedHeader = (\n <div className={styles.header} style={appLayoutMaxWidth}>\n <h2 className={clsx(styles['header-text'], testUtilStyles['header-text'])} id={panelHeaderId}>\n {header}\n </h2>\n <div className={styles['header-actions']}>\n {!hidePreferencesButton && isOpen && (\n <>\n <InternalButton\n className={testUtilStyles['preferences-button']}\n iconName=\"settings\"\n variant=\"icon\"\n onClick={() => setPreferencesOpen(true)}\n formAction=\"none\"\n ariaLabel={i18n('i18nStrings.preferencesTitle', i18nStrings?.preferencesTitle)}\n ref={refs.preferences}\n />\n <span className={styles.divider} />\n </>\n )}\n\n {isOpen ? (\n <InternalButton\n className={testUtilStyles['close-button']}\n iconName={\n isRefresh && closeBehavior === 'collapse'\n ? position === 'side'\n ? 'angle-right'\n : 'angle-down'\n : 'close'\n }\n variant=\"icon\"\n onClick={onToggle}\n formAction=\"none\"\n ariaLabel={i18n('i18nStrings.closeButtonAriaLabel', i18nStrings?.closeButtonAriaLabel)}\n ariaExpanded={isOpen}\n />\n ) : position === 'side' ? null : (\n <InternalButton\n className={testUtilStyles['open-button']}\n iconName=\"angle-up\"\n variant=\"icon\"\n formAction=\"none\"\n ariaLabel={i18n('i18nStrings.openButtonAriaLabel', i18nStrings?.openButtonAriaLabel)}\n ref={refs.toggle}\n ariaExpanded={isOpen}\n />\n )}\n </div>\n </div>\n );\n\n const resizeHandle = (\n <PanelResizeHandle\n ref={refs.slider}\n className={testUtilStyles.slider}\n ariaLabel={i18n('i18nStrings.resizeHandleAriaLabel', i18nStrings?.resizeHandleAriaLabel)}\n // Allows us to use the logical left/right keys to move the slider left/right,\n // but match aria keyboard behavior of using left/right to decrease/increase\n // the slider value.\n ariaValuenow={position === 'bottom' ? relativeSize : 100 - relativeSize}\n position={position}\n onKeyDown={onKeyDown}\n onPointerDown={onSliderPointerDown}\n />\n );\n\n /*\n This effect forces the browser to recalculate the layout\n whenever the split panel might have moved.\n\n This is needed as a workaround for a bug in Safari, which does\n not automatically calculate the new position of the split panel\n _content_ when the split panel moves.\n */\n useLayoutEffect(() => {\n const root = splitPanelRefObject.current;\n\n if (root) {\n const property = 'transform';\n const temporaryValue = 'translateZ(0)';\n\n const valueBefore = root.style[property];\n root.style[property] = temporaryValue;\n\n // This line forces the browser to recalculate the layout\n void root.offsetHeight;\n\n root.style[property] = valueBefore;\n }\n }, [rightOffset, __internalRootRef]);\n\n const mergedRef = useMergeRefs(splitPanelRefObject, __internalRootRef);\n\n if (closeBehavior === 'hide' && !isOpen) {\n return <></>;\n }\n\n /**\n * The AppLayout factor moved the circular buttons out of the\n * SplitPanel and into the Tools component. This conditional\n * is still needed for the early return to prevent execution\n * of the following code.\n */\n if (isRefresh && !isOpen && position === 'side') {\n return <></>;\n }\n\n return (\n <Transition in={isOpen ?? false}>\n {(state, transitioningElementRef) => (\n <>\n {position === 'side' && (\n <SplitPanelContentSide\n style={contentStyle}\n resizeHandle={resizeHandle}\n baseProps={baseProps}\n isOpen={isOpen}\n splitPanelRef={mergedRef}\n cappedSize={size}\n onToggle={onToggle}\n openButtonAriaLabel={i18n('i18nStrings.openButtonAriaLabel', i18nStrings?.openButtonAriaLabel)}\n toggleRef={refs.toggle}\n header={wrappedHeader}\n panelHeaderId={panelHeaderId}\n >\n {children}\n </SplitPanelContentSide>\n )}\n\n {position === 'bottom' && (\n <SplitPanelContentBottom\n style={contentStyle}\n resizeHandle={resizeHandle}\n baseProps={baseProps}\n isOpen={isOpen}\n splitPanelRef={mergedRef}\n cappedSize={size}\n onToggle={onToggle}\n header={wrappedHeader}\n panelHeaderId={panelHeaderId}\n state={state}\n transitioningElementRef={transitioningElementRef}\n appLayoutMaxWidth={appLayoutMaxWidth}\n >\n {children}\n </SplitPanelContentBottom>\n )}\n {isPreferencesOpen && (\n <PreferencesModal\n visible={true}\n preferences={{ position }}\n disabledSidePosition={position === 'bottom' && isForcedPosition}\n isRefresh={isRefresh}\n i18nStrings={{\n header: i18n('i18nStrings.preferencesTitle', i18nStrings?.preferencesTitle),\n confirm: i18n('i18nStrings.preferencesConfirm', i18nStrings?.preferencesConfirm),\n cancel: i18n('i18nStrings.preferencesCancel', i18nStrings?.preferencesCancel),\n positionLabel: i18n('i18nStrings.preferencesPositionLabel', i18nStrings?.preferencesPositionLabel),\n positionDescription: i18n(\n 'i18nStrings.preferencesPositionDescription',\n i18nStrings?.preferencesPositionDescription\n ),\n positionBottom: i18n('i18nStrings.preferencesPositionBottom', i18nStrings?.preferencesPositionBottom),\n positionSide: i18n('i18nStrings.preferencesPositionSide', i18nStrings?.preferencesPositionSide),\n }}\n onConfirm={preferences => {\n onPreferencesChange({ ...preferences });\n setPreferencesOpen(false);\n }}\n onDismiss={() => {\n setPreferencesOpen(false);\n }}\n />\n )}\n </>\n )}\n </Transition>\n );\n }\n);\n\nexport const createWidgetizedSplitPanel = createWidgetizedForwardRef<\n SplitPanelProps,\n HTMLElement,\n typeof SplitPanelImplementation\n>(SplitPanelImplementation);\n"]}
1
+ {"version":3,"file":"implementation.js","sourceRoot":"","sources":["../../../src/split-panel/implementation.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useLayoutEffect, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { getGlobalFlag } from '@cloudscape-design/component-toolkit/internal';\n\nimport { SizeControlProps } from '../app-layout/utils/interfaces';\nimport { useKeyboardEvents } from '../app-layout/utils/use-keyboard-events';\nimport { usePointerEvents } from '../app-layout/utils/use-pointer-events';\nimport { InternalButton } from '../button/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport { getBaseProps } from '../internal/base-component';\nimport PanelResizeHandle from '../internal/components/panel-resize-handle';\nimport { Transition } from '../internal/components/transition';\nimport { useSplitPanelContext } from '../internal/context/split-panel-context';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport globalVars from '../internal/styles/global-vars';\nimport { createWidgetizedForwardRef } from '../internal/widgets';\nimport { SplitPanelContentBottom } from './bottom';\nimport { SplitPanelProps } from './interfaces';\nimport PreferencesModal from './preferences-modal';\nimport { SplitPanelContentSide } from './side';\n\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\nexport { SplitPanelProps };\n\nexport const SplitPanelImplementation = React.forwardRef<HTMLElement, SplitPanelProps>(\n (\n { header, children, hidePreferencesButton = false, closeBehavior = 'collapse', i18nStrings, ...restProps },\n __internalRootRef\n ) => {\n const isRefresh = useVisualRefresh();\n\n const {\n position,\n topOffset,\n bottomOffset,\n rightOffset,\n contentWidthStyles,\n isOpen,\n isForcedPosition,\n onPreferencesChange,\n onResize,\n onToggle,\n size,\n relativeSize,\n setSplitPanelToggle,\n refs,\n } = useSplitPanelContext();\n const baseProps = getBaseProps(restProps);\n const i18n = useInternalI18n('split-panel');\n const hasToolbar = getGlobalFlag('appLayoutWidget');\n const [isPreferencesOpen, setPreferencesOpen] = useState<boolean>(false);\n\n const appLayoutMaxWidth = isRefresh && position === 'bottom' ? contentWidthStyles : undefined;\n\n const openButtonAriaLabel = i18n('i18nStrings.openButtonAriaLabel', i18nStrings?.openButtonAriaLabel);\n useEffect(() => {\n setSplitPanelToggle({ displayed: closeBehavior === 'collapse', ariaLabel: openButtonAriaLabel });\n }, [setSplitPanelToggle, openButtonAriaLabel, closeBehavior]);\n\n const splitPanelRefObject = useRef<HTMLDivElement>(null);\n\n const sizeControlProps: SizeControlProps = {\n position,\n panelRef: splitPanelRefObject,\n handleRef: refs.slider,\n onResize,\n };\n const onSliderPointerDown = usePointerEvents(sizeControlProps);\n const onKeyDown = useKeyboardEvents(sizeControlProps);\n\n const contentStyle = {\n [globalVars.stickyVerticalTopOffset]: topOffset,\n [globalVars.stickyVerticalBottomOffset]: bottomOffset,\n };\n\n const panelHeaderId = useUniqueId('split-panel-header');\n\n const wrappedHeader = (\n <div className={clsx(styles.header, hasToolbar && styles['with-toolbar'])} style={appLayoutMaxWidth}>\n <h2 className={clsx(styles['header-text'], testUtilStyles['header-text'])} id={panelHeaderId}>\n {header}\n </h2>\n <div className={styles['header-actions']}>\n {!hidePreferencesButton && isOpen && (\n <>\n <InternalButton\n className={testUtilStyles['preferences-button']}\n iconName=\"settings\"\n variant=\"icon\"\n onClick={() => setPreferencesOpen(true)}\n formAction=\"none\"\n ariaLabel={i18n('i18nStrings.preferencesTitle', i18nStrings?.preferencesTitle)}\n ref={refs.preferences}\n />\n <span className={styles.divider} />\n </>\n )}\n\n {isOpen ? (\n <InternalButton\n className={testUtilStyles['close-button']}\n iconName={\n isRefresh && closeBehavior === 'collapse'\n ? position === 'side'\n ? 'angle-right'\n : 'angle-down'\n : 'close'\n }\n variant=\"icon\"\n onClick={onToggle}\n formAction=\"none\"\n ariaLabel={i18n('i18nStrings.closeButtonAriaLabel', i18nStrings?.closeButtonAriaLabel)}\n ariaExpanded={isOpen}\n />\n ) : position === 'side' ? null : (\n <InternalButton\n className={testUtilStyles['open-button']}\n iconName=\"angle-up\"\n variant=\"icon\"\n formAction=\"none\"\n ariaLabel={i18n('i18nStrings.openButtonAriaLabel', i18nStrings?.openButtonAriaLabel)}\n ref={refs.toggle}\n ariaExpanded={isOpen}\n />\n )}\n </div>\n </div>\n );\n\n const resizeHandle = (\n <PanelResizeHandle\n ref={refs.slider}\n className={testUtilStyles.slider}\n ariaLabel={i18n('i18nStrings.resizeHandleAriaLabel', i18nStrings?.resizeHandleAriaLabel)}\n // Allows us to use the logical left/right keys to move the slider left/right,\n // but match aria keyboard behavior of using left/right to decrease/increase\n // the slider value.\n ariaValuenow={position === 'bottom' ? relativeSize : 100 - relativeSize}\n position={position}\n onKeyDown={onKeyDown}\n onPointerDown={onSliderPointerDown}\n />\n );\n\n /*\n This effect forces the browser to recalculate the layout\n whenever the split panel might have moved.\n\n This is needed as a workaround for a bug in Safari, which does\n not automatically calculate the new position of the split panel\n _content_ when the split panel moves.\n */\n useLayoutEffect(() => {\n const root = splitPanelRefObject.current;\n\n if (root) {\n const property = 'transform';\n const temporaryValue = 'translateZ(0)';\n\n const valueBefore = root.style[property];\n root.style[property] = temporaryValue;\n\n // This line forces the browser to recalculate the layout\n void root.offsetHeight;\n\n root.style[property] = valueBefore;\n }\n }, [rightOffset, __internalRootRef]);\n\n const mergedRef = useMergeRefs(splitPanelRefObject, __internalRootRef);\n\n if (closeBehavior === 'hide' && !isOpen) {\n return <></>;\n }\n\n /**\n * The AppLayout factor moved the circular buttons out of the\n * SplitPanel and into the Tools component. This conditional\n * is still needed for the early return to prevent execution\n * of the following code.\n */\n if (isRefresh && !isOpen && position === 'side') {\n return <></>;\n }\n\n return (\n <Transition in={isOpen ?? false}>\n {(state, transitioningElementRef) => (\n <>\n {position === 'side' && (\n <SplitPanelContentSide\n style={contentStyle}\n resizeHandle={resizeHandle}\n baseProps={baseProps}\n isOpen={isOpen}\n splitPanelRef={mergedRef}\n cappedSize={size}\n onToggle={onToggle}\n openButtonAriaLabel={i18n('i18nStrings.openButtonAriaLabel', i18nStrings?.openButtonAriaLabel)}\n toggleRef={refs.toggle}\n header={wrappedHeader}\n panelHeaderId={panelHeaderId}\n >\n {children}\n </SplitPanelContentSide>\n )}\n\n {position === 'bottom' && (\n <SplitPanelContentBottom\n style={contentStyle}\n resizeHandle={resizeHandle}\n baseProps={baseProps}\n isOpen={isOpen}\n splitPanelRef={mergedRef}\n cappedSize={size}\n onToggle={onToggle}\n header={wrappedHeader}\n panelHeaderId={panelHeaderId}\n state={state}\n transitioningElementRef={transitioningElementRef}\n appLayoutMaxWidth={appLayoutMaxWidth}\n >\n {children}\n </SplitPanelContentBottom>\n )}\n {isPreferencesOpen && (\n <PreferencesModal\n visible={true}\n preferences={{ position }}\n disabledSidePosition={position === 'bottom' && isForcedPosition}\n isRefresh={isRefresh}\n i18nStrings={{\n header: i18n('i18nStrings.preferencesTitle', i18nStrings?.preferencesTitle),\n confirm: i18n('i18nStrings.preferencesConfirm', i18nStrings?.preferencesConfirm),\n cancel: i18n('i18nStrings.preferencesCancel', i18nStrings?.preferencesCancel),\n positionLabel: i18n('i18nStrings.preferencesPositionLabel', i18nStrings?.preferencesPositionLabel),\n positionDescription: i18n(\n 'i18nStrings.preferencesPositionDescription',\n i18nStrings?.preferencesPositionDescription\n ),\n positionBottom: i18n('i18nStrings.preferencesPositionBottom', i18nStrings?.preferencesPositionBottom),\n positionSide: i18n('i18nStrings.preferencesPositionSide', i18nStrings?.preferencesPositionSide),\n }}\n onConfirm={preferences => {\n onPreferencesChange({ ...preferences });\n setPreferencesOpen(false);\n }}\n onDismiss={() => {\n setPreferencesOpen(false);\n }}\n />\n )}\n </>\n )}\n </Transition>\n );\n }\n);\n\nexport const createWidgetizedSplitPanel = createWidgetizedForwardRef<\n SplitPanelProps,\n HTMLElement,\n typeof SplitPanelImplementation\n>(SplitPanelImplementation);\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"side.d.ts","sourceRoot":"","sources":["../../../src/split-panel/side.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAInD,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAKtD,UAAU,0BAA2B,SAAQ,sBAAsB;IACjE,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;CAC7C;AAED,wBAAgB,qBAAqB,CAAC,EACpC,KAAK,EACL,SAAS,EACT,aAAa,EACb,SAAS,EACT,MAAM,EACN,QAAQ,EACR,YAAY,EACZ,MAAM,EACN,UAAU,EACV,mBAAmB,EACnB,aAAa,EACb,QAAQ,GACT,EAAE,0BAA0B,eA+C5B"}
1
+ {"version":3,"file":"side.d.ts","sourceRoot":"","sources":["../../../src/split-panel/side.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AAInD,OAAO,EAAE,sBAAsB,EAAE,MAAM,cAAc,CAAC;AAKtD,UAAU,0BAA2B,SAAQ,sBAAsB;IACjE,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;CAC7C;AAED,wBAAgB,qBAAqB,CAAC,EACpC,KAAK,EACL,SAAS,EACT,aAAa,EACb,SAAS,EACT,MAAM,EACN,QAAQ,EACR,YAAY,EACZ,MAAM,EACN,UAAU,EACV,mBAAmB,EACnB,aAAa,EACb,QAAQ,GACT,EAAE,0BAA0B,eAiD5B"}
@@ -2,6 +2,7 @@
2
2
  // SPDX-License-Identifier: Apache-2.0
3
3
  import React from 'react';
4
4
  import clsx from 'clsx';
5
+ import { getGlobalFlag } from '@cloudscape-design/component-toolkit/internal';
5
6
  import InternalButton from '../button/internal';
6
7
  import { useSplitPanelContext } from '../internal/context/split-panel-context';
7
8
  import { useVisualRefresh } from '../internal/hooks/use-visual-mode';
@@ -10,16 +11,18 @@ import testUtilStyles from './test-classes/styles.css.js';
10
11
  export function SplitPanelContentSide({ style, baseProps, splitPanelRef, toggleRef, header, children, resizeHandle, isOpen, cappedSize, openButtonAriaLabel, panelHeaderId, onToggle, }) {
11
12
  const { topOffset, bottomOffset } = useSplitPanelContext();
12
13
  const isRefresh = useVisualRefresh();
14
+ const hasToolbar = getGlobalFlag('appLayoutWidget');
13
15
  return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(baseProps.className, styles.drawer, styles['position-side'], testUtilStyles.root, {
14
16
  [testUtilStyles['open-position-side']]: isOpen,
15
17
  [styles['drawer-closed']]: !isOpen,
18
+ [styles['with-toolbar']]: hasToolbar,
16
19
  }), style: Object.assign({ width: isOpen && isRefresh ? cappedSize : undefined, maxWidth: isRefresh ? '100%' : undefined }, style), ref: splitPanelRef }),
17
20
  React.createElement("div", { className: styles['drawer-content-side'], style: {
18
21
  top: topOffset,
19
22
  bottom: bottomOffset,
20
23
  }, onClick: () => !isOpen && onToggle(), "aria-labelledby": panelHeaderId, role: "region" },
21
24
  isOpen ? (React.createElement("div", { className: styles['slider-wrapper-side'] }, resizeHandle)) : (React.createElement(InternalButton, { className: clsx(testUtilStyles['open-button'], styles['open-button-side']), iconName: "angle-left", variant: "icon", formAction: "none", ariaLabel: openButtonAriaLabel, ariaExpanded: isOpen, ref: isRefresh ? null : toggleRef })),
22
- React.createElement("div", { className: styles['content-side'], "aria-hidden": !isOpen },
25
+ React.createElement("div", { className: clsx(styles['content-side'], hasToolbar && styles['with-toolbar']), "aria-hidden": !isOpen },
23
26
  React.createElement("div", { className: styles['pane-header-wrapper-side'] }, header),
24
27
  React.createElement("div", { className: styles['pane-content-wrapper-side'] }, children)))));
25
28
  }
@@ -1 +1 @@
1
- {"version":3,"file":"side.js","sourceRoot":"","sources":["../../../src/split-panel/side.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAGxB,OAAO,cAAc,MAAM,oBAAoB,CAAC;AAChD,OAAO,EAAE,oBAAoB,EAAE,MAAM,yCAAyC,CAAC;AAC/E,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAGrE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,cAAc,MAAM,8BAA8B,CAAC;AAO1D,MAAM,UAAU,qBAAqB,CAAC,EACpC,KAAK,EACL,SAAS,EACT,aAAa,EACb,SAAS,EACT,MAAM,EACN,QAAQ,EACR,YAAY,EACZ,MAAM,EACN,UAAU,EACV,mBAAmB,EACnB,aAAa,EACb,QAAQ,GACmB;IAC3B,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,GAAG,oBAAoB,EAAE,CAAC;IAC3D,MAAM,SAAS,GAAG,gBAAgB,EAAE,CAAC;IACrC,OAAO,CACL,6CACM,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,eAAe,CAAC,EAAE,cAAc,CAAC,IAAI,EAAE;YAChG,CAAC,cAAc,CAAC,oBAAoB,CAAC,CAAC,EAAE,MAAM;YAC9C,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,CAAC,MAAM;SACnC,CAAC,EACF,KAAK,kBACH,KAAK,EAAE,MAAM,IAAI,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,EACnD,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,IACrC,KAAK,GAEV,GAAG,EAAE,aAAa;QAElB,6BACE,SAAS,EAAE,MAAM,CAAC,qBAAqB,CAAC,EACxC,KAAK,EAAE;gBACL,GAAG,EAAE,SAAS;gBACd,MAAM,EAAE,YAAY;aACrB,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,MAAM,IAAI,QAAQ,EAAE,qBACnB,aAAa,EAC9B,IAAI,EAAC,QAAQ;YAEZ,MAAM,CAAC,CAAC,CAAC,CACR,6BAAK,SAAS,EAAE,MAAM,CAAC,qBAAqB,CAAC,IAAG,YAAY,CAAO,CACpE,CAAC,CAAC,CAAC,CACF,oBAAC,cAAc,IACb,SAAS,EAAE,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,EAAE,MAAM,CAAC,kBAAkB,CAAC,CAAC,EAC1E,QAAQ,EAAC,YAAY,EACrB,OAAO,EAAC,MAAM,EACd,UAAU,EAAC,MAAM,EACjB,SAAS,EAAE,mBAAmB,EAC9B,YAAY,EAAE,MAAM,EACpB,GAAG,EAAE,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,GACjC,CACH;YACD,6BAAK,SAAS,EAAE,MAAM,CAAC,cAAc,CAAC,iBAAe,CAAC,MAAM;gBAC1D,6BAAK,SAAS,EAAE,MAAM,CAAC,0BAA0B,CAAC,IAAG,MAAM,CAAO;gBAClE,6BAAK,SAAS,EAAE,MAAM,CAAC,2BAA2B,CAAC,IAAG,QAAQ,CAAO,CACjE,CACF,CACF,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport { ButtonProps } from '../button/interfaces';\nimport InternalButton from '../button/internal';\nimport { useSplitPanelContext } from '../internal/context/split-panel-context';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { SplitPanelContentProps } from './interfaces';\n\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\ninterface SplitPanelContentSideProps extends SplitPanelContentProps {\n openButtonAriaLabel?: string;\n toggleRef: React.RefObject<ButtonProps.Ref>;\n}\n\nexport function SplitPanelContentSide({\n style,\n baseProps,\n splitPanelRef,\n toggleRef,\n header,\n children,\n resizeHandle,\n isOpen,\n cappedSize,\n openButtonAriaLabel,\n panelHeaderId,\n onToggle,\n}: SplitPanelContentSideProps) {\n const { topOffset, bottomOffset } = useSplitPanelContext();\n const isRefresh = useVisualRefresh();\n return (\n <div\n {...baseProps}\n className={clsx(baseProps.className, styles.drawer, styles['position-side'], testUtilStyles.root, {\n [testUtilStyles['open-position-side']]: isOpen,\n [styles['drawer-closed']]: !isOpen,\n })}\n style={{\n width: isOpen && isRefresh ? cappedSize : undefined,\n maxWidth: isRefresh ? '100%' : undefined,\n ...style,\n }}\n ref={splitPanelRef}\n >\n <div\n className={styles['drawer-content-side']}\n style={{\n top: topOffset,\n bottom: bottomOffset,\n }}\n onClick={() => !isOpen && onToggle()}\n aria-labelledby={panelHeaderId}\n role=\"region\"\n >\n {isOpen ? (\n <div className={styles['slider-wrapper-side']}>{resizeHandle}</div>\n ) : (\n <InternalButton\n className={clsx(testUtilStyles['open-button'], styles['open-button-side'])}\n iconName=\"angle-left\"\n variant=\"icon\"\n formAction=\"none\"\n ariaLabel={openButtonAriaLabel}\n ariaExpanded={isOpen}\n ref={isRefresh ? null : toggleRef}\n />\n )}\n <div className={styles['content-side']} aria-hidden={!isOpen}>\n <div className={styles['pane-header-wrapper-side']}>{header}</div>\n <div className={styles['pane-content-wrapper-side']}>{children}</div>\n </div>\n </div>\n </div>\n );\n}\n"]}
1
+ {"version":3,"file":"side.js","sourceRoot":"","sources":["../../../src/split-panel/side.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,aAAa,EAAE,MAAM,+CAA+C,CAAC;AAG9E,OAAO,cAAc,MAAM,oBAAoB,CAAC;AAChD,OAAO,EAAE,oBAAoB,EAAE,MAAM,yCAAyC,CAAC;AAC/E,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAGrE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,cAAc,MAAM,8BAA8B,CAAC;AAO1D,MAAM,UAAU,qBAAqB,CAAC,EACpC,KAAK,EACL,SAAS,EACT,aAAa,EACb,SAAS,EACT,MAAM,EACN,QAAQ,EACR,YAAY,EACZ,MAAM,EACN,UAAU,EACV,mBAAmB,EACnB,aAAa,EACb,QAAQ,GACmB;IAC3B,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,GAAG,oBAAoB,EAAE,CAAC;IAC3D,MAAM,SAAS,GAAG,gBAAgB,EAAE,CAAC;IACrC,MAAM,UAAU,GAAG,aAAa,CAAC,iBAAiB,CAAC,CAAC;IACpD,OAAO,CACL,6CACM,SAAS,IACb,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,eAAe,CAAC,EAAE,cAAc,CAAC,IAAI,EAAE;YAChG,CAAC,cAAc,CAAC,oBAAoB,CAAC,CAAC,EAAE,MAAM;YAC9C,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,EAAE,CAAC,MAAM;YAClC,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC,EAAE,UAAU;SACrC,CAAC,EACF,KAAK,kBACH,KAAK,EAAE,MAAM,IAAI,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,EACnD,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,IACrC,KAAK,GAEV,GAAG,EAAE,aAAa;QAElB,6BACE,SAAS,EAAE,MAAM,CAAC,qBAAqB,CAAC,EACxC,KAAK,EAAE;gBACL,GAAG,EAAE,SAAS;gBACd,MAAM,EAAE,YAAY;aACrB,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,MAAM,IAAI,QAAQ,EAAE,qBACnB,aAAa,EAC9B,IAAI,EAAC,QAAQ;YAEZ,MAAM,CAAC,CAAC,CAAC,CACR,6BAAK,SAAS,EAAE,MAAM,CAAC,qBAAqB,CAAC,IAAG,YAAY,CAAO,CACpE,CAAC,CAAC,CAAC,CACF,oBAAC,cAAc,IACb,SAAS,EAAE,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,EAAE,MAAM,CAAC,kBAAkB,CAAC,CAAC,EAC1E,QAAQ,EAAC,YAAY,EACrB,OAAO,EAAC,MAAM,EACd,UAAU,EAAC,MAAM,EACjB,SAAS,EAAE,mBAAmB,EAC9B,YAAY,EAAE,MAAM,EACpB,GAAG,EAAE,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,GACjC,CACH;YACD,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,EAAE,UAAU,IAAI,MAAM,CAAC,cAAc,CAAC,CAAC,iBAAe,CAAC,MAAM;gBACtG,6BAAK,SAAS,EAAE,MAAM,CAAC,0BAA0B,CAAC,IAAG,MAAM,CAAO;gBAClE,6BAAK,SAAS,EAAE,MAAM,CAAC,2BAA2B,CAAC,IAAG,QAAQ,CAAO,CACjE,CACF,CACF,CACP,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport { getGlobalFlag } from '@cloudscape-design/component-toolkit/internal';\n\nimport { ButtonProps } from '../button/interfaces';\nimport InternalButton from '../button/internal';\nimport { useSplitPanelContext } from '../internal/context/split-panel-context';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { SplitPanelContentProps } from './interfaces';\n\nimport styles from './styles.css.js';\nimport testUtilStyles from './test-classes/styles.css.js';\n\ninterface SplitPanelContentSideProps extends SplitPanelContentProps {\n openButtonAriaLabel?: string;\n toggleRef: React.RefObject<ButtonProps.Ref>;\n}\n\nexport function SplitPanelContentSide({\n style,\n baseProps,\n splitPanelRef,\n toggleRef,\n header,\n children,\n resizeHandle,\n isOpen,\n cappedSize,\n openButtonAriaLabel,\n panelHeaderId,\n onToggle,\n}: SplitPanelContentSideProps) {\n const { topOffset, bottomOffset } = useSplitPanelContext();\n const isRefresh = useVisualRefresh();\n const hasToolbar = getGlobalFlag('appLayoutWidget');\n return (\n <div\n {...baseProps}\n className={clsx(baseProps.className, styles.drawer, styles['position-side'], testUtilStyles.root, {\n [testUtilStyles['open-position-side']]: isOpen,\n [styles['drawer-closed']]: !isOpen,\n [styles['with-toolbar']]: hasToolbar,\n })}\n style={{\n width: isOpen && isRefresh ? cappedSize : undefined,\n maxWidth: isRefresh ? '100%' : undefined,\n ...style,\n }}\n ref={splitPanelRef}\n >\n <div\n className={styles['drawer-content-side']}\n style={{\n top: topOffset,\n bottom: bottomOffset,\n }}\n onClick={() => !isOpen && onToggle()}\n aria-labelledby={panelHeaderId}\n role=\"region\"\n >\n {isOpen ? (\n <div className={styles['slider-wrapper-side']}>{resizeHandle}</div>\n ) : (\n <InternalButton\n className={clsx(testUtilStyles['open-button'], styles['open-button-side'])}\n iconName=\"angle-left\"\n variant=\"icon\"\n formAction=\"none\"\n ariaLabel={openButtonAriaLabel}\n ariaExpanded={isOpen}\n ref={isRefresh ? null : toggleRef}\n />\n )}\n <div className={clsx(styles['content-side'], hasToolbar && styles['with-toolbar'])} aria-hidden={!isOpen}>\n <div className={styles['pane-header-wrapper-side']}>{header}</div>\n <div className={styles['pane-content-wrapper-side']}>{children}</div>\n </div>\n </div>\n </div>\n );\n}\n"]}
@@ -1,32 +1,32 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "drawer": "awsui_drawer_1r9lg_10v1l_197",
5
- "refresh": "awsui_refresh_1r9lg_10v1l_197",
6
- "animating": "awsui_animating_1r9lg_10v1l_211",
7
- "drawer-closed": "awsui_drawer-closed_1r9lg_10v1l_266",
8
- "drawer-content-side": "awsui_drawer-content-side_1r9lg_10v1l_271",
9
- "drawer-content-bottom": "awsui_drawer-content-bottom_1r9lg_10v1l_287",
10
- "position-bottom": "awsui_position-bottom_1r9lg_10v1l_294",
11
- "with-toolbar": "awsui_with-toolbar_1r9lg_10v1l_311",
12
- "position-side": "awsui_position-side_1r9lg_10v1l_324",
13
- "slider-wrapper-bottom": "awsui_slider-wrapper-bottom_1r9lg_10v1l_330",
14
- "slider-wrapper-side": "awsui_slider-wrapper-side_1r9lg_10v1l_341",
15
- "open-button-side": "awsui_open-button-side_1r9lg_10v1l_352",
16
- "pane-header-wrapper-bottom": "awsui_pane-header-wrapper-bottom_1r9lg_10v1l_361",
17
- "drawer-mobile": "awsui_drawer-mobile_1r9lg_10v1l_371",
18
- "drawer-disable-content-paddings": "awsui_drawer-disable-content-paddings_1r9lg_10v1l_375",
19
- "content-bottom": "awsui_content-bottom_1r9lg_10v1l_384",
20
- "pane-bottom-center-align": "awsui_pane-bottom-center-align_1r9lg_10v1l_400",
21
- "pane-bottom-content-nav-padding": "awsui_pane-bottom-content-nav-padding_1r9lg_10v1l_405",
22
- "pane-bottom-content-tools-padding": "awsui_pane-bottom-content-tools-padding_1r9lg_10v1l_409",
23
- "content-bottom-max-width": "awsui_content-bottom-max-width_1r9lg_10v1l_413",
24
- "content-side": "awsui_content-side_1r9lg_10v1l_418",
25
- "pane-header-wrapper-side": "awsui_pane-header-wrapper-side_1r9lg_10v1l_428",
26
- "pane-content-wrapper-side": "awsui_pane-content-wrapper-side_1r9lg_10v1l_434",
27
- "header": "awsui_header_1r9lg_10v1l_442",
28
- "header-text": "awsui_header-text_1r9lg_10v1l_452",
29
- "header-actions": "awsui_header-actions_1r9lg_10v1l_465",
30
- "divider": "awsui_divider_1r9lg_10v1l_473"
4
+ "drawer": "awsui_drawer_1r9lg_5tc2t_197",
5
+ "refresh": "awsui_refresh_1r9lg_5tc2t_197",
6
+ "animating": "awsui_animating_1r9lg_5tc2t_211",
7
+ "drawer-closed": "awsui_drawer-closed_1r9lg_5tc2t_266",
8
+ "drawer-content-side": "awsui_drawer-content-side_1r9lg_5tc2t_271",
9
+ "drawer-content-bottom": "awsui_drawer-content-bottom_1r9lg_5tc2t_287",
10
+ "position-bottom": "awsui_position-bottom_1r9lg_5tc2t_294",
11
+ "with-toolbar": "awsui_with-toolbar_1r9lg_5tc2t_311",
12
+ "position-side": "awsui_position-side_1r9lg_5tc2t_324",
13
+ "slider-wrapper-bottom": "awsui_slider-wrapper-bottom_1r9lg_5tc2t_333",
14
+ "slider-wrapper-side": "awsui_slider-wrapper-side_1r9lg_5tc2t_344",
15
+ "open-button-side": "awsui_open-button-side_1r9lg_5tc2t_355",
16
+ "pane-header-wrapper-bottom": "awsui_pane-header-wrapper-bottom_1r9lg_5tc2t_364",
17
+ "drawer-mobile": "awsui_drawer-mobile_1r9lg_5tc2t_374",
18
+ "drawer-disable-content-paddings": "awsui_drawer-disable-content-paddings_1r9lg_5tc2t_378",
19
+ "content-bottom": "awsui_content-bottom_1r9lg_5tc2t_390",
20
+ "pane-bottom-center-align": "awsui_pane-bottom-center-align_1r9lg_5tc2t_409",
21
+ "pane-bottom-content-nav-padding": "awsui_pane-bottom-content-nav-padding_1r9lg_5tc2t_414",
22
+ "pane-bottom-content-tools-padding": "awsui_pane-bottom-content-tools-padding_1r9lg_5tc2t_418",
23
+ "content-bottom-max-width": "awsui_content-bottom-max-width_1r9lg_5tc2t_422",
24
+ "content-side": "awsui_content-side_1r9lg_5tc2t_427",
25
+ "pane-header-wrapper-side": "awsui_pane-header-wrapper-side_1r9lg_5tc2t_437",
26
+ "pane-content-wrapper-side": "awsui_pane-content-wrapper-side_1r9lg_5tc2t_446",
27
+ "header": "awsui_header_1r9lg_5tc2t_457",
28
+ "header-text": "awsui_header-text_1r9lg_5tc2t_470",
29
+ "header-actions": "awsui_header-actions_1r9lg_5tc2t_483",
30
+ "divider": "awsui_divider_1r9lg_5tc2t_491"
31
31
  };
32
32