@cloudscape-design/components 3.0.773 → 3.0.775

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 (267) hide show
  1. package/app-layout/drawer/index.js.map +1 -1
  2. package/app-layout/drawer/overflow-menu.d.ts +6 -2
  3. package/app-layout/drawer/overflow-menu.d.ts.map +1 -1
  4. package/app-layout/drawer/overflow-menu.js +22 -8
  5. package/app-layout/drawer/overflow-menu.js.map +1 -1
  6. package/app-layout/interfaces.d.ts +2 -1
  7. package/app-layout/interfaces.d.ts.map +1 -1
  8. package/app-layout/interfaces.js.map +1 -1
  9. package/app-layout/mobile-toolbar/index.js.map +1 -1
  10. package/app-layout/runtime-api.d.ts +4 -3
  11. package/app-layout/runtime-api.d.ts.map +1 -1
  12. package/app-layout/runtime-api.js +15 -11
  13. package/app-layout/runtime-api.js.map +1 -1
  14. package/app-layout/test-classes/styles.css.js +20 -19
  15. package/app-layout/test-classes/styles.scoped.css +23 -19
  16. package/app-layout/test-classes/styles.selectors.js +20 -19
  17. package/app-layout/utils/use-drawers.d.ts +12 -1
  18. package/app-layout/utils/use-drawers.d.ts.map +1 -1
  19. package/app-layout/utils/use-drawers.js +125 -20
  20. package/app-layout/utils/use-drawers.js.map +1 -1
  21. package/app-layout/utils/use-focus-control.d.ts +10 -0
  22. package/app-layout/utils/use-focus-control.d.ts.map +1 -1
  23. package/app-layout/utils/use-focus-control.js +60 -1
  24. package/app-layout/utils/use-focus-control.js.map +1 -1
  25. package/app-layout/utils/visibility-context.d.ts +3 -0
  26. package/app-layout/utils/visibility-context.d.ts.map +1 -0
  27. package/app-layout/utils/visibility-context.js +5 -0
  28. package/app-layout/utils/visibility-context.js.map +1 -0
  29. package/app-layout/visual-refresh/drawers.js.map +1 -1
  30. package/app-layout/visual-refresh-toolbar/compute-layout.d.ts +5 -1
  31. package/app-layout/visual-refresh-toolbar/compute-layout.d.ts.map +1 -1
  32. package/app-layout/visual-refresh-toolbar/compute-layout.js +15 -4
  33. package/app-layout/visual-refresh-toolbar/compute-layout.js.map +1 -1
  34. package/app-layout/visual-refresh-toolbar/drawer/global-drawer.d.ts +15 -0
  35. package/app-layout/visual-refresh-toolbar/drawer/global-drawer.d.ts.map +1 -0
  36. package/app-layout/visual-refresh-toolbar/drawer/global-drawer.js +71 -0
  37. package/app-layout/visual-refresh-toolbar/drawer/global-drawer.js.map +1 -0
  38. package/app-layout/visual-refresh-toolbar/drawer/global-drawers.d.ts +6 -1
  39. package/app-layout/visual-refresh-toolbar/drawer/global-drawers.d.ts.map +1 -1
  40. package/app-layout/visual-refresh-toolbar/drawer/global-drawers.js +15 -4
  41. package/app-layout/visual-refresh-toolbar/drawer/global-drawers.js.map +1 -1
  42. package/app-layout/visual-refresh-toolbar/drawer/local-drawer.d.ts.map +1 -1
  43. package/app-layout/visual-refresh-toolbar/drawer/local-drawer.js +35 -23
  44. package/app-layout/visual-refresh-toolbar/drawer/local-drawer.js.map +1 -1
  45. package/app-layout/visual-refresh-toolbar/drawer/styles.css.js +10 -6
  46. package/app-layout/visual-refresh-toolbar/drawer/styles.scoped.css +28 -6
  47. package/app-layout/visual-refresh-toolbar/drawer/styles.selectors.js +10 -6
  48. package/app-layout/visual-refresh-toolbar/index.d.ts.map +1 -1
  49. package/app-layout/visual-refresh-toolbar/index.js +60 -6
  50. package/app-layout/visual-refresh-toolbar/index.js.map +1 -1
  51. package/app-layout/visual-refresh-toolbar/interfaces.d.ts +10 -1
  52. package/app-layout/visual-refresh-toolbar/interfaces.d.ts.map +1 -1
  53. package/app-layout/visual-refresh-toolbar/interfaces.js.map +1 -1
  54. package/app-layout/visual-refresh-toolbar/skeleton/index.d.ts +3 -1
  55. package/app-layout/visual-refresh-toolbar/skeleton/index.d.ts.map +1 -1
  56. package/app-layout/visual-refresh-toolbar/skeleton/index.js +3 -2
  57. package/app-layout/visual-refresh-toolbar/skeleton/index.js.map +1 -1
  58. package/app-layout/visual-refresh-toolbar/skeleton/styles.css.js +17 -16
  59. package/app-layout/visual-refresh-toolbar/skeleton/styles.scoped.css +50 -32
  60. package/app-layout/visual-refresh-toolbar/skeleton/styles.selectors.js +17 -16
  61. package/app-layout/visual-refresh-toolbar/toolbar/drawer-triggers.d.ts +6 -2
  62. package/app-layout/visual-refresh-toolbar/toolbar/drawer-triggers.d.ts.map +1 -1
  63. package/app-layout/visual-refresh-toolbar/toolbar/drawer-triggers.js +34 -10
  64. package/app-layout/visual-refresh-toolbar/toolbar/drawer-triggers.js.map +1 -1
  65. package/app-layout/visual-refresh-toolbar/toolbar/index.d.ts +5 -1
  66. package/app-layout/visual-refresh-toolbar/toolbar/index.d.ts.map +1 -1
  67. package/app-layout/visual-refresh-toolbar/toolbar/index.js +17 -13
  68. package/app-layout/visual-refresh-toolbar/toolbar/index.js.map +1 -1
  69. package/collection-preferences/analytics-metadata/interfaces.d.ts +43 -0
  70. package/collection-preferences/analytics-metadata/interfaces.d.ts.map +1 -0
  71. package/collection-preferences/analytics-metadata/interfaces.js +4 -0
  72. package/collection-preferences/analytics-metadata/interfaces.js.map +1 -0
  73. package/collection-preferences/analytics-metadata/styles.css.js +6 -0
  74. package/collection-preferences/analytics-metadata/styles.scoped.css +7 -0
  75. package/collection-preferences/analytics-metadata/styles.selectors.js +7 -0
  76. package/collection-preferences/analytics-metadata/utils.d.ts +9 -0
  77. package/collection-preferences/analytics-metadata/utils.d.ts.map +1 -0
  78. package/collection-preferences/analytics-metadata/utils.js +48 -0
  79. package/collection-preferences/analytics-metadata/utils.js.map +1 -0
  80. package/collection-preferences/content-display/content-display-option.d.ts +1 -0
  81. package/collection-preferences/content-display/content-display-option.d.ts.map +1 -1
  82. package/collection-preferences/content-display/content-display-option.js +2 -2
  83. package/collection-preferences/content-display/content-display-option.js.map +1 -1
  84. package/collection-preferences/content-display/draggable-option.d.ts.map +1 -1
  85. package/collection-preferences/content-display/draggable-option.js +2 -2
  86. package/collection-preferences/content-display/draggable-option.js.map +1 -1
  87. package/collection-preferences/content-display/index.d.ts +1 -1
  88. package/collection-preferences/content-display/index.d.ts.map +1 -1
  89. package/collection-preferences/content-display/index.js +21 -7
  90. package/collection-preferences/content-display/index.js.map +1 -1
  91. package/collection-preferences/content-display/styles.css.js +13 -11
  92. package/collection-preferences/content-display/styles.scoped.css +19 -17
  93. package/collection-preferences/content-display/styles.selectors.js +13 -11
  94. package/collection-preferences/index.d.ts.map +1 -1
  95. package/collection-preferences/index.js +21 -15
  96. package/collection-preferences/index.js.map +1 -1
  97. package/collection-preferences/interfaces.d.ts +29 -0
  98. package/collection-preferences/interfaces.d.ts.map +1 -1
  99. package/collection-preferences/interfaces.js.map +1 -1
  100. package/collection-preferences/styles.css.js +39 -37
  101. package/collection-preferences/styles.scoped.css +46 -44
  102. package/collection-preferences/styles.selectors.js +39 -37
  103. package/collection-preferences/utils.d.ts.map +1 -1
  104. package/collection-preferences/utils.js +12 -13
  105. package/collection-preferences/utils.js.map +1 -1
  106. package/collection-preferences/visible-content.d.ts.map +1 -1
  107. package/collection-preferences/visible-content.js +2 -1
  108. package/collection-preferences/visible-content.js.map +1 -1
  109. package/date-range-picker/index.d.ts.map +1 -1
  110. package/date-range-picker/index.js +9 -10
  111. package/date-range-picker/index.js.map +1 -1
  112. package/date-range-picker/styles.css.js +38 -39
  113. package/date-range-picker/styles.scoped.css +47 -51
  114. package/date-range-picker/styles.selectors.js +38 -39
  115. package/flashbar/styles.css.js +50 -50
  116. package/flashbar/styles.scoped.css +156 -149
  117. package/flashbar/styles.selectors.js +50 -50
  118. package/i18n/messages/all.all.js +1 -1
  119. package/i18n/messages/all.all.json +1 -1
  120. package/i18n/messages/all.ar.js +1 -1
  121. package/i18n/messages/all.ar.json +1 -1
  122. package/i18n/messages/all.de.js +1 -1
  123. package/i18n/messages/all.de.json +1 -1
  124. package/i18n/messages/all.en-GB.js +1 -1
  125. package/i18n/messages/all.en-GB.json +1 -1
  126. package/i18n/messages/all.en.js +1 -1
  127. package/i18n/messages/all.en.json +1 -1
  128. package/i18n/messages/all.es.js +1 -1
  129. package/i18n/messages/all.es.json +1 -1
  130. package/i18n/messages/all.fr.js +1 -1
  131. package/i18n/messages/all.fr.json +1 -1
  132. package/i18n/messages/all.id.js +1 -1
  133. package/i18n/messages/all.id.json +1 -1
  134. package/i18n/messages/all.it.js +1 -1
  135. package/i18n/messages/all.it.json +1 -1
  136. package/i18n/messages/all.ja.js +1 -1
  137. package/i18n/messages/all.ja.json +1 -1
  138. package/i18n/messages/all.ko.js +1 -1
  139. package/i18n/messages/all.ko.json +1 -1
  140. package/i18n/messages/all.pt-BR.js +1 -1
  141. package/i18n/messages/all.pt-BR.json +1 -1
  142. package/i18n/messages/all.tr.js +1 -1
  143. package/i18n/messages/all.tr.json +1 -1
  144. package/i18n/messages/all.zh-CN.js +1 -1
  145. package/i18n/messages/all.zh-CN.json +1 -1
  146. package/i18n/messages/all.zh-TW.js +1 -1
  147. package/i18n/messages/all.zh-TW.json +1 -1
  148. package/i18n/messages-types.d.ts +7 -0
  149. package/i18n/messages-types.d.ts.map +1 -1
  150. package/i18n/messages-types.js.map +1 -1
  151. package/index.d.ts +1 -0
  152. package/index.d.ts.map +1 -1
  153. package/index.js +1 -0
  154. package/index.js.map +1 -1
  155. package/internal/analytics/interfaces.d.ts +1 -0
  156. package/internal/analytics/interfaces.d.ts.map +1 -1
  157. package/internal/analytics/interfaces.js.map +1 -1
  158. package/internal/components/drag-handle/index.d.ts +2 -1
  159. package/internal/components/drag-handle/index.d.ts.map +1 -1
  160. package/internal/components/drag-handle/index.js +3 -3
  161. package/internal/components/drag-handle/index.js.map +1 -1
  162. package/internal/components/drag-handle/styles.css.js +2 -1
  163. package/internal/components/drag-handle/styles.scoped.css +6 -2
  164. package/internal/components/drag-handle/styles.selectors.js +2 -1
  165. package/internal/environment.js +1 -1
  166. package/internal/environment.json +1 -1
  167. package/internal/hooks/use-component-analytics/index.d.ts +7 -1
  168. package/internal/hooks/use-component-analytics/index.d.ts.map +1 -1
  169. package/internal/hooks/use-component-analytics/index.js +21 -4
  170. package/internal/hooks/use-component-analytics/index.js.map +1 -1
  171. package/internal/manifest.json +1 -1
  172. package/internal/plugins/controllers/drawers.d.ts +19 -2
  173. package/internal/plugins/controllers/drawers.d.ts.map +1 -1
  174. package/internal/plugins/controllers/drawers.js +34 -2
  175. package/internal/plugins/controllers/drawers.js.map +1 -1
  176. package/internal/plugins/helpers/runtime-content-wrapper.d.ts +4 -2
  177. package/internal/plugins/helpers/runtime-content-wrapper.d.ts.map +1 -1
  178. package/internal/plugins/helpers/runtime-content-wrapper.js +19 -4
  179. package/internal/plugins/helpers/runtime-content-wrapper.js.map +1 -1
  180. package/modal/internal.d.ts +1 -0
  181. package/modal/internal.d.ts.map +1 -1
  182. package/modal/internal.js +2 -2
  183. package/modal/internal.js.map +1 -1
  184. package/package.json +2 -1
  185. package/prompt-input/interfaces.d.ts +0 -16
  186. package/prompt-input/interfaces.d.ts.map +1 -1
  187. package/prompt-input/interfaces.js.map +1 -1
  188. package/prompt-input/internal.d.ts.map +1 -1
  189. package/prompt-input/internal.js +11 -28
  190. package/prompt-input/internal.js.map +1 -1
  191. package/prompt-input/styles.css.js +8 -14
  192. package/prompt-input/styles.scoped.css +68 -264
  193. package/prompt-input/styles.selectors.js +8 -14
  194. package/prompt-input/test-classes/styles.css.js +3 -5
  195. package/prompt-input/test-classes/styles.scoped.css +3 -11
  196. package/prompt-input/test-classes/styles.selectors.js +3 -5
  197. package/steps/index.d.ts +6 -0
  198. package/steps/index.d.ts.map +1 -0
  199. package/steps/index.js +19 -0
  200. package/steps/index.js.map +1 -0
  201. package/steps/interfaces.d.ts +40 -0
  202. package/steps/interfaces.d.ts.map +1 -0
  203. package/steps/interfaces.js +2 -0
  204. package/steps/interfaces.js.map +1 -0
  205. package/steps/internal.d.ts +8 -0
  206. package/steps/internal.d.ts.map +1 -0
  207. package/steps/internal.js +21 -0
  208. package/steps/internal.js.map +1 -0
  209. package/steps/styles.css.js +11 -0
  210. package/steps/styles.scoped.css +247 -0
  211. package/steps/styles.selectors.js +12 -0
  212. package/table/internal.d.ts.map +1 -1
  213. package/table/internal.js +2 -2
  214. package/table/internal.js.map +1 -1
  215. package/test-utils/dom/collection-preferences/content-display-preference.d.ts +9 -0
  216. package/test-utils/dom/collection-preferences/content-display-preference.js +13 -0
  217. package/test-utils/dom/collection-preferences/content-display-preference.js.map +1 -1
  218. package/test-utils/dom/index.d.ts +3 -0
  219. package/test-utils/dom/index.js +9 -1
  220. package/test-utils/dom/index.js.map +1 -1
  221. package/test-utils/dom/prompt-input/index.d.ts +0 -2
  222. package/test-utils/dom/prompt-input/index.js +0 -6
  223. package/test-utils/dom/prompt-input/index.js.map +1 -1
  224. package/test-utils/dom/steps/index.d.ts +18 -0
  225. package/test-utils/dom/steps/index.js +33 -0
  226. package/test-utils/dom/steps/index.js.map +1 -0
  227. package/test-utils/selectors/collection-preferences/content-display-preference.d.ts +9 -0
  228. package/test-utils/selectors/collection-preferences/content-display-preference.js +13 -0
  229. package/test-utils/selectors/collection-preferences/content-display-preference.js.map +1 -1
  230. package/test-utils/selectors/index.d.ts +3 -0
  231. package/test-utils/selectors/index.js +9 -1
  232. package/test-utils/selectors/index.js.map +1 -1
  233. package/test-utils/selectors/prompt-input/index.d.ts +0 -2
  234. package/test-utils/selectors/prompt-input/index.js +0 -6
  235. package/test-utils/selectors/prompt-input/index.js.map +1 -1
  236. package/test-utils/selectors/steps/index.d.ts +18 -0
  237. package/test-utils/selectors/steps/index.js +33 -0
  238. package/test-utils/selectors/steps/index.js.map +1 -0
  239. package/test-utils/tsconfig.tsbuildinfo +1 -1
  240. package/wizard/analytics-metadata/interfaces.d.ts +35 -0
  241. package/wizard/analytics-metadata/interfaces.d.ts.map +1 -0
  242. package/wizard/analytics-metadata/interfaces.js +4 -0
  243. package/wizard/analytics-metadata/interfaces.js.map +1 -0
  244. package/wizard/analytics-metadata/styles.css.js +6 -0
  245. package/wizard/analytics-metadata/styles.scoped.css +7 -0
  246. package/wizard/analytics-metadata/styles.selectors.js +7 -0
  247. package/wizard/analytics-metadata/utils.d.ts +7 -0
  248. package/wizard/analytics-metadata/utils.d.ts.map +1 -0
  249. package/wizard/analytics-metadata/utils.js +14 -0
  250. package/wizard/analytics-metadata/utils.js.map +1 -0
  251. package/wizard/index.d.ts.map +1 -1
  252. package/wizard/index.js +1 -1
  253. package/wizard/index.js.map +1 -1
  254. package/wizard/internal.d.ts +4 -2
  255. package/wizard/internal.d.ts.map +1 -1
  256. package/wizard/internal.js +14 -3
  257. package/wizard/internal.js.map +1 -1
  258. package/wizard/wizard-actions.d.ts +4 -1
  259. package/wizard/wizard-actions.d.ts.map +1 -1
  260. package/wizard/wizard-actions.js +9 -5
  261. package/wizard/wizard-actions.js.map +1 -1
  262. package/wizard/wizard-form.d.ts.map +1 -1
  263. package/wizard/wizard-form.js +1 -1
  264. package/wizard/wizard-form.js.map +1 -1
  265. package/wizard/wizard-navigation.d.ts.map +1 -1
  266. package/wizard/wizard-navigation.js +12 -6
  267. package/wizard/wizard-navigation.js.map +1 -1
@@ -5,6 +5,8 @@ export class DrawersController {
5
5
  constructor() {
6
6
  this.drawers = [];
7
7
  this.drawersRegistrationListener = null;
8
+ this.drawerOpenedListener = null;
9
+ this.drawerClosedListener = null;
8
10
  this.scheduleUpdate = debounce(() => {
9
11
  var _a;
10
12
  (_a = this.drawersRegistrationListener) === null || _a === void 0 ? void 0 : _a.call(this, this.drawers);
@@ -51,17 +53,47 @@ export class DrawersController {
51
53
  this.clearRegisteredDrawers = () => {
52
54
  this.drawers = [];
53
55
  };
56
+ this.onDrawerOpened = (listener) => {
57
+ if (this.drawerOpenedListener !== null) {
58
+ console.warn('[AwsUi] [runtime drawers] multiple app layout instances detected');
59
+ }
60
+ this.drawerOpenedListener = listener;
61
+ return () => {
62
+ this.drawerOpenedListener = null;
63
+ };
64
+ };
65
+ this.onDrawerClosed = (listener) => {
66
+ if (this.drawerClosedListener !== null) {
67
+ console.warn('[AwsUi] [runtime drawers] multiple app layout instances detected');
68
+ }
69
+ this.drawerClosedListener = listener;
70
+ return () => {
71
+ this.drawerClosedListener = null;
72
+ };
73
+ };
74
+ this.openDrawer = (drawerId) => {
75
+ var _a;
76
+ (_a = this.drawerOpenedListener) === null || _a === void 0 ? void 0 : _a.call(this, drawerId);
77
+ };
78
+ this.closeDrawer = (drawerId) => {
79
+ var _a;
80
+ (_a = this.drawerClosedListener) === null || _a === void 0 ? void 0 : _a.call(this, drawerId);
81
+ };
54
82
  }
55
83
  installPublic(api = {}) {
56
- var _a, _b;
84
+ var _a, _b, _c, _d;
57
85
  (_a = api.registerDrawer) !== null && _a !== void 0 ? _a : (api.registerDrawer = this.registerDrawer);
58
86
  (_b = api.updateDrawer) !== null && _b !== void 0 ? _b : (api.updateDrawer = this.updateDrawer);
87
+ (_c = api.openDrawer) !== null && _c !== void 0 ? _c : (api.openDrawer = this.openDrawer);
88
+ (_d = api.closeDrawer) !== null && _d !== void 0 ? _d : (api.closeDrawer = this.closeDrawer);
59
89
  return api;
60
90
  }
61
91
  installInternal(internalApi = {}) {
62
- var _a, _b;
92
+ var _a, _b, _c, _d;
63
93
  (_a = internalApi.clearRegisteredDrawers) !== null && _a !== void 0 ? _a : (internalApi.clearRegisteredDrawers = this.clearRegisteredDrawers);
64
94
  (_b = internalApi.onDrawersRegistered) !== null && _b !== void 0 ? _b : (internalApi.onDrawersRegistered = this.onDrawersRegistered);
95
+ (_c = internalApi.onDrawerOpened) !== null && _c !== void 0 ? _c : (internalApi.onDrawerOpened = this.onDrawerOpened);
96
+ (_d = internalApi.onDrawerClosed) !== null && _d !== void 0 ? _d : (internalApi.onDrawerClosed = this.onDrawerClosed);
65
97
  return internalApi;
66
98
  }
67
99
  }
@@ -1 +1 @@
1
- {"version":3,"file":"drawers.js","sourceRoot":"","sources":["../../../../../src/internal/plugins/controllers/drawers.ts"],"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 debounce from '../../debounce';\nimport { NonCancelableEventHandler } from '../../events';\n\nexport interface DrawerConfig {\n id: string;\n ariaLabels: {\n content?: string;\n closeButton?: string;\n triggerButton?: string;\n resizeHandle?: string;\n };\n badge?: boolean;\n resizable?: boolean;\n defaultSize?: number;\n onResize?: NonCancelableEventHandler<{ size: number; id: string }>;\n orderPriority?: number;\n defaultActive?: boolean;\n trigger: {\n iconSvg: string;\n };\n mountContent: (container: HTMLElement) => void;\n unmountContent: (container: HTMLElement) => void;\n}\n\nexport type UpdateDrawerConfig = Pick<DrawerConfig, 'id' | 'badge' | 'resizable' | 'defaultSize'>;\n\nexport type DrawersRegistrationListener = (drawers: Array<DrawerConfig>) => void;\n\nexport interface DrawersApiPublic {\n registerDrawer(config: DrawerConfig): void;\n updateDrawer(config: UpdateDrawerConfig): void;\n}\n\nexport interface DrawersApiInternal {\n clearRegisteredDrawers(): void;\n onDrawersRegistered(listener: DrawersRegistrationListener): () => void;\n}\n\nexport class DrawersController {\n private drawers: Array<DrawerConfig> = [];\n private drawersRegistrationListener: DrawersRegistrationListener | null = null;\n\n scheduleUpdate = debounce(() => {\n this.drawersRegistrationListener?.(this.drawers);\n }, 0);\n\n registerDrawer = (config: DrawerConfig) => {\n this.drawers = this.drawers.concat(config);\n this.scheduleUpdate();\n };\n\n updateDrawer = (config: UpdateDrawerConfig) => {\n const { id: drawerId, resizable, badge, defaultSize } = config;\n const drawerIndex = this.drawers.findIndex(({ id }) => id === drawerId);\n const oldDrawerConfig = this.drawers?.[drawerIndex];\n if (drawerIndex >= 0 && oldDrawerConfig) {\n const drawers = this.drawers.slice();\n const drawerConfig = { ...oldDrawerConfig };\n if (typeof resizable === 'boolean') {\n drawerConfig.resizable = resizable;\n }\n if (typeof badge === 'boolean') {\n drawerConfig.badge = badge;\n }\n if (typeof defaultSize === 'number') {\n drawerConfig.defaultSize = defaultSize;\n }\n\n drawers[drawerIndex] = drawerConfig;\n this.drawers = drawers;\n this.scheduleUpdate();\n } else {\n throw new Error(`[AwsUi] [runtime drawers] drawer with id ${drawerId} not found`);\n }\n };\n\n onDrawersRegistered = (listener: DrawersRegistrationListener) => {\n if (this.drawersRegistrationListener !== null) {\n console.warn('[AwsUi] [runtime drawers] multiple app layout instances detected');\n }\n this.drawersRegistrationListener = listener;\n this.scheduleUpdate();\n return () => {\n this.drawersRegistrationListener = null;\n };\n };\n\n clearRegisteredDrawers = () => {\n this.drawers = [];\n };\n\n installPublic(api: Partial<DrawersApiPublic> = {}): DrawersApiPublic {\n api.registerDrawer ??= this.registerDrawer;\n api.updateDrawer ??= this.updateDrawer;\n return api as DrawersApiPublic;\n }\n\n installInternal(internalApi: Partial<DrawersApiInternal> = {}): DrawersApiInternal {\n internalApi.clearRegisteredDrawers ??= this.clearRegisteredDrawers;\n internalApi.onDrawersRegistered ??= this.onDrawersRegistered;\n return internalApi as DrawersApiInternal;\n }\n}\n"]}
1
+ {"version":3,"file":"drawers.js","sourceRoot":"","sources":["../../../../../src/internal/plugins/controllers/drawers.ts"],"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 debounce from '../../debounce';\nimport { NonCancelableEventHandler } from '../../events';\n\nexport type DrawerVisibilityChange = (callback: (isVisible: boolean) => void) => void;\n\nexport interface MountContentContext {\n onVisibilityChange: DrawerVisibilityChange;\n}\n\nexport interface DrawerConfig {\n id: string;\n type?: 'local' | 'global';\n ariaLabels: {\n content?: string;\n closeButton?: string;\n triggerButton?: string;\n resizeHandle?: string;\n };\n badge?: boolean;\n resizable?: boolean;\n defaultSize?: number;\n onResize?: NonCancelableEventHandler<{ size: number; id: string }>;\n orderPriority?: number;\n defaultActive?: boolean;\n trigger?: {\n iconSvg: string;\n };\n mountContent: (container: HTMLElement, mountContext: MountContentContext) => void;\n unmountContent: (container: HTMLElement) => void;\n preserveInactiveContent?: boolean;\n}\n\nexport type UpdateDrawerConfig = Pick<DrawerConfig, 'id' | 'badge' | 'resizable' | 'defaultSize'>;\n\nexport type DrawersRegistrationListener = (drawers: Array<DrawerConfig>) => void;\n\nexport type DrawersToggledListener = (drawerId: string) => void;\n\nexport interface DrawersApiPublic {\n registerDrawer(config: DrawerConfig): void;\n updateDrawer(config: UpdateDrawerConfig): void;\n openDrawer(drawerId: string): void;\n closeDrawer(drawerId: string): void;\n}\n\nexport interface DrawersApiInternal {\n clearRegisteredDrawers(): void;\n onDrawersRegistered(listener: DrawersRegistrationListener): () => void;\n onDrawerOpened(listener: DrawersToggledListener): () => void;\n onDrawerClosed(listener: DrawersToggledListener): () => void;\n}\n\nexport class DrawersController {\n private drawers: Array<DrawerConfig> = [];\n private drawersRegistrationListener: DrawersRegistrationListener | null = null;\n private drawerOpenedListener: DrawersToggledListener | null = null;\n private drawerClosedListener: DrawersToggledListener | null = null;\n\n scheduleUpdate = debounce(() => {\n this.drawersRegistrationListener?.(this.drawers);\n }, 0);\n\n registerDrawer = (config: DrawerConfig) => {\n this.drawers = this.drawers.concat(config);\n this.scheduleUpdate();\n };\n\n updateDrawer = (config: UpdateDrawerConfig) => {\n const { id: drawerId, resizable, badge, defaultSize } = config;\n const drawerIndex = this.drawers.findIndex(({ id }) => id === drawerId);\n const oldDrawerConfig = this.drawers?.[drawerIndex];\n if (drawerIndex >= 0 && oldDrawerConfig) {\n const drawers = this.drawers.slice();\n const drawerConfig = { ...oldDrawerConfig };\n if (typeof resizable === 'boolean') {\n drawerConfig.resizable = resizable;\n }\n if (typeof badge === 'boolean') {\n drawerConfig.badge = badge;\n }\n if (typeof defaultSize === 'number') {\n drawerConfig.defaultSize = defaultSize;\n }\n\n drawers[drawerIndex] = drawerConfig;\n this.drawers = drawers;\n this.scheduleUpdate();\n } else {\n throw new Error(`[AwsUi] [runtime drawers] drawer with id ${drawerId} not found`);\n }\n };\n\n onDrawersRegistered = (listener: DrawersRegistrationListener) => {\n if (this.drawersRegistrationListener !== null) {\n console.warn('[AwsUi] [runtime drawers] multiple app layout instances detected');\n }\n this.drawersRegistrationListener = listener;\n this.scheduleUpdate();\n return () => {\n this.drawersRegistrationListener = null;\n };\n };\n\n clearRegisteredDrawers = () => {\n this.drawers = [];\n };\n\n onDrawerOpened = (listener: DrawersToggledListener) => {\n if (this.drawerOpenedListener !== null) {\n console.warn('[AwsUi] [runtime drawers] multiple app layout instances detected');\n }\n\n this.drawerOpenedListener = listener;\n\n return () => {\n this.drawerOpenedListener = null;\n };\n };\n\n onDrawerClosed = (listener: DrawersToggledListener) => {\n if (this.drawerClosedListener !== null) {\n console.warn('[AwsUi] [runtime drawers] multiple app layout instances detected');\n }\n\n this.drawerClosedListener = listener;\n\n return () => {\n this.drawerClosedListener = null;\n };\n };\n\n openDrawer = (drawerId: string) => {\n this.drawerOpenedListener?.(drawerId);\n };\n\n closeDrawer = (drawerId: string) => {\n this.drawerClosedListener?.(drawerId);\n };\n\n installPublic(api: Partial<DrawersApiPublic> = {}): DrawersApiPublic {\n api.registerDrawer ??= this.registerDrawer;\n api.updateDrawer ??= this.updateDrawer;\n api.openDrawer ??= this.openDrawer;\n api.closeDrawer ??= this.closeDrawer;\n return api as DrawersApiPublic;\n }\n\n installInternal(internalApi: Partial<DrawersApiInternal> = {}): DrawersApiInternal {\n internalApi.clearRegisteredDrawers ??= this.clearRegisteredDrawers;\n internalApi.onDrawersRegistered ??= this.onDrawersRegistered;\n internalApi.onDrawerOpened ??= this.onDrawerOpened;\n internalApi.onDrawerClosed ??= this.onDrawerClosed;\n return internalApi as DrawersApiInternal;\n }\n}\n"]}
@@ -1,8 +1,10 @@
1
1
  /// <reference types="react" />
2
+ import { MountContentContext } from '../controllers/drawers';
2
3
  interface RuntimeContentWrapperProps {
3
- mountContent: (container: HTMLElement) => void;
4
+ mountContent: (container: HTMLElement, mountContent: MountContentContext) => void;
4
5
  unmountContent: (container: HTMLElement) => void;
6
+ id?: string;
5
7
  }
6
- export declare function RuntimeContentWrapper({ mountContent, unmountContent }: RuntimeContentWrapperProps): JSX.Element;
8
+ export declare function RuntimeContentWrapper({ mountContent, unmountContent, id }: RuntimeContentWrapperProps): JSX.Element;
7
9
  export {};
8
10
  //# sourceMappingURL=runtime-content-wrapper.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"runtime-content-wrapper.d.ts","sourceRoot":"","sources":["../../../../../src/internal/plugins/helpers/runtime-content-wrapper.tsx"],"names":[],"mappings":";AAIA,UAAU,0BAA0B;IAClC,YAAY,EAAE,CAAC,SAAS,EAAE,WAAW,KAAK,IAAI,CAAC;IAC/C,cAAc,EAAE,CAAC,SAAS,EAAE,WAAW,KAAK,IAAI,CAAC;CAClD;AAED,wBAAgB,qBAAqB,CAAC,EAAE,YAAY,EAAE,cAAc,EAAE,EAAE,0BAA0B,eAWjG"}
1
+ {"version":3,"file":"runtime-content-wrapper.d.ts","sourceRoot":"","sources":["../../../../../src/internal/plugins/helpers/runtime-content-wrapper.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAI7D,UAAU,0BAA0B;IAClC,YAAY,EAAE,CAAC,SAAS,EAAE,WAAW,EAAE,YAAY,EAAE,mBAAmB,KAAK,IAAI,CAAC;IAClF,cAAc,EAAE,CAAC,SAAS,EAAE,WAAW,KAAK,IAAI,CAAC;IACjD,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AAED,wBAAgB,qBAAqB,CAAC,EAAE,YAAY,EAAE,cAAc,EAAE,EAAE,EAAE,EAAE,0BAA0B,eAyBrG"}
@@ -1,14 +1,29 @@
1
1
  // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
2
2
  // SPDX-License-Identifier: Apache-2.0
3
- import React, { useEffect, useRef } from 'react';
4
- export function RuntimeContentWrapper({ mountContent, unmountContent }) {
3
+ import React, { useContext, useEffect, useRef } from 'react';
4
+ import { ActiveDrawersContext } from '../../../app-layout/utils/visibility-context';
5
+ export function RuntimeContentWrapper({ mountContent, unmountContent, id }) {
5
6
  const ref = useRef(null);
7
+ const visibilityChangeCallback = useRef(null);
8
+ const activeDrawersIds = useContext(ActiveDrawersContext);
9
+ const isVisible = !!id && activeDrawersIds.includes(id);
6
10
  useEffect(() => {
7
11
  const container = ref.current;
8
- mountContent(container);
9
- return () => unmountContent(container);
12
+ mountContent(container, {
13
+ onVisibilityChange: cb => {
14
+ visibilityChangeCallback.current = cb;
15
+ },
16
+ });
17
+ return () => {
18
+ unmountContent(container);
19
+ visibilityChangeCallback.current = null;
20
+ };
10
21
  // eslint-disable-next-line react-hooks/exhaustive-deps
11
22
  }, []);
23
+ useEffect(() => {
24
+ var _a;
25
+ (_a = visibilityChangeCallback.current) === null || _a === void 0 ? void 0 : _a.call(visibilityChangeCallback, isVisible);
26
+ }, [isVisible]);
12
27
  return React.createElement("div", { ref: ref });
13
28
  }
14
29
  //# sourceMappingURL=runtime-content-wrapper.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"runtime-content-wrapper.js","sourceRoot":"","sources":["../../../../../src/internal/plugins/helpers/runtime-content-wrapper.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAOjD,MAAM,UAAU,qBAAqB,CAAC,EAAE,YAAY,EAAE,cAAc,EAA8B;IAChG,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEzC,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,SAAS,GAAG,GAAG,CAAC,OAAQ,CAAC;QAC/B,YAAY,CAAC,SAAS,CAAC,CAAC;QACxB,OAAO,GAAG,EAAE,CAAC,cAAc,CAAC,SAAS,CAAC,CAAC;QACvC,uDAAuD;IACzD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,6BAAK,GAAG,EAAE,GAAG,GAAQ,CAAC;AAC/B,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useRef } from 'react';\n\ninterface RuntimeContentWrapperProps {\n mountContent: (container: HTMLElement) => void;\n unmountContent: (container: HTMLElement) => void;\n}\n\nexport function RuntimeContentWrapper({ mountContent, unmountContent }: RuntimeContentWrapperProps) {\n const ref = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n const container = ref.current!;\n mountContent(container);\n return () => unmountContent(container);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n return <div ref={ref}></div>;\n}\n"]}
1
+ {"version":3,"file":"runtime-content-wrapper.js","sourceRoot":"","sources":["../../../../../src/internal/plugins/helpers/runtime-content-wrapper.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAE7D,OAAO,EAAE,oBAAoB,EAAE,MAAM,8CAA8C,CAAC;AAWpF,MAAM,UAAU,qBAAqB,CAAC,EAAE,YAAY,EAAE,cAAc,EAAE,EAAE,EAA8B;IACpG,MAAM,GAAG,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACzC,MAAM,wBAAwB,GAAG,MAAM,CAA4B,IAAI,CAAC,CAAC;IACzE,MAAM,gBAAgB,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC;IAC1D,MAAM,SAAS,GAAG,CAAC,CAAC,EAAE,IAAI,gBAAgB,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;IAExD,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,SAAS,GAAG,GAAG,CAAC,OAAQ,CAAC;QAC/B,YAAY,CAAC,SAAS,EAAE;YACtB,kBAAkB,EAAE,EAAE,CAAC,EAAE;gBACvB,wBAAwB,CAAC,OAAO,GAAG,EAAE,CAAC;YACxC,CAAC;SACF,CAAC,CAAC;QACH,OAAO,GAAG,EAAE;YACV,cAAc,CAAC,SAAS,CAAC,CAAC;YAC1B,wBAAwB,CAAC,OAAO,GAAG,IAAI,CAAC;QAC1C,CAAC,CAAC;QACF,uDAAuD;IACzD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,SAAS,CAAC,GAAG,EAAE;;QACb,MAAA,wBAAwB,CAAC,OAAO,yEAAG,SAAS,CAAC,CAAC;IAChD,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,OAAO,6BAAK,GAAG,EAAE,GAAG,GAAQ,CAAC;AAC/B,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useContext, useEffect, useRef } from 'react';\n\nimport { ActiveDrawersContext } from '../../../app-layout/utils/visibility-context';\nimport { MountContentContext } from '../controllers/drawers';\n\ntype VisibilityCallback = (isVisible: boolean) => void;\n\ninterface RuntimeContentWrapperProps {\n mountContent: (container: HTMLElement, mountContent: MountContentContext) => void;\n unmountContent: (container: HTMLElement) => void;\n id?: string;\n}\n\nexport function RuntimeContentWrapper({ mountContent, unmountContent, id }: RuntimeContentWrapperProps) {\n const ref = useRef<HTMLDivElement>(null);\n const visibilityChangeCallback = useRef<VisibilityCallback | null>(null);\n const activeDrawersIds = useContext(ActiveDrawersContext);\n const isVisible = !!id && activeDrawersIds.includes(id);\n\n useEffect(() => {\n const container = ref.current!;\n mountContent(container, {\n onVisibilityChange: cb => {\n visibilityChangeCallback.current = cb;\n },\n });\n return () => {\n unmountContent(container);\n visibilityChangeCallback.current = null;\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n useEffect(() => {\n visibilityChangeCallback.current?.(isVisible);\n }, [isVisible]);\n\n return <div ref={ref}></div>;\n}\n"]}
@@ -4,6 +4,7 @@ import { SomeRequired } from '../internal/types';
4
4
  import { ModalProps } from './interfaces';
5
5
  type InternalModalProps = SomeRequired<ModalProps, 'size'> & InternalBaseComponentProps & {
6
6
  __injectAnalyticsComponentMetadata?: boolean;
7
+ referrerId?: string;
7
8
  };
8
9
  export default function InternalModal({ modalRoot, getModalRoot, removeModalRoot, ...rest }: InternalModalProps): JSX.Element;
9
10
  export {};
@@ -1 +1 @@
1
- {"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/modal/internal.tsx"],"names":[],"mappings":";AAoBA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAMlF,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAMjD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAK1C,KAAK,kBAAkB,GAAG,YAAY,CAAC,UAAU,EAAE,MAAM,CAAC,GACxD,0BAA0B,GAAG;IAAE,kCAAkC,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC;AAEhF,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,eAAe,EAAE,GAAG,IAAI,EAAE,EAAE,kBAAkB,eAM9G"}
1
+ {"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/modal/internal.tsx"],"names":[],"mappings":";AAoBA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAMlF,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAMjD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAK1C,KAAK,kBAAkB,GAAG,YAAY,CAAC,UAAU,EAAE,MAAM,CAAC,GACxD,0BAA0B,GAAG;IAAE,kCAAkC,CAAC,EAAE,OAAO,CAAC;IAAC,UAAU,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAErG,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,EAAE,SAAS,EAAE,YAAY,EAAE,eAAe,EAAE,GAAG,IAAI,EAAE,EAAE,kBAAkB,eAM9G"}
package/modal/internal.js CHANGED
@@ -34,7 +34,7 @@ export default function InternalModal(_a) {
34
34
  // useContainerQuery needs its targeted element to exist on the first render in order to work properly.
35
35
  function PortaledModal(_a) {
36
36
  var _b;
37
- var { size, visible, header, children, footer, disableContentPaddings, onDismiss, __internalRootRef = null, __injectAnalyticsComponentMetadata } = _a, rest = __rest(_a, ["size", "visible", "header", "children", "footer", "disableContentPaddings", "onDismiss", "__internalRootRef", "__injectAnalyticsComponentMetadata"]);
37
+ var { size, visible, header, children, footer, disableContentPaddings, onDismiss, __internalRootRef = null, __injectAnalyticsComponentMetadata, referrerId } = _a, rest = __rest(_a, ["size", "visible", "header", "children", "footer", "disableContentPaddings", "onDismiss", "__internalRootRef", "__injectAnalyticsComponentMetadata", "referrerId"]);
38
38
  const instanceUniqueId = useUniqueId();
39
39
  const headerId = `${rest.id || instanceUniqueId}-header`;
40
40
  const lastMouseDownElementRef = useRef(null);
@@ -100,7 +100,7 @@ function PortaledModal(_a) {
100
100
  return (React.createElement(FunnelNameSelectorContext.Provider, { value: `.${styles['header--text']}` },
101
101
  React.createElement(ResetContextsForModal, null,
102
102
  React.createElement(ModalContext.Provider, { value: { isInModal: true } },
103
- React.createElement("div", Object.assign({}, baseProps, { className: clsx(styles.root, { [styles.hidden]: !visible }, baseProps.className, isRefresh && styles.refresh), role: "dialog", "aria-modal": true, "aria-labelledby": headerId, onMouseDown: onOverlayMouseDown, onClick: onOverlayClick, ref: mergedRef, style: footerHeight ? { scrollPaddingBottom: footerHeight } : undefined, "data-awsui-referrer-id": (_b = subStepRef.current) === null || _b === void 0 ? void 0 : _b.id }),
103
+ React.createElement("div", Object.assign({}, baseProps, { className: clsx(styles.root, { [styles.hidden]: !visible }, baseProps.className, isRefresh && styles.refresh), role: "dialog", "aria-modal": true, "aria-labelledby": headerId, onMouseDown: onOverlayMouseDown, onClick: onOverlayClick, ref: mergedRef, style: footerHeight ? { scrollPaddingBottom: footerHeight } : undefined, "data-awsui-referrer-id": ((_b = subStepRef.current) === null || _b === void 0 ? void 0 : _b.id) || referrerId }),
104
104
  React.createElement(FocusLock, { disabled: !visible, autoFocus: true, restoreFocus: true, className: styles['focus-lock'] },
105
105
  React.createElement("div", Object.assign({ className: clsx(styles.dialog, styles[size], styles[`breakpoint-${breakpoint}`], isRefresh && styles.refresh), onKeyDown: escKeyHandler }, metadataAttribute),
106
106
  React.createElement("div", { className: styles.container },
@@ -1 +1 @@
1
- {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/modal/internal.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, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useContainerQuery } from '@cloudscape-design/component-toolkit';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { InternalButton } from '../button/internal';\nimport InternalHeader from '../header/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport { FunnelNameSelectorContext } from '../internal/analytics/context/analytics-context';\nimport { useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\nimport { getBaseProps } from '../internal/base-component';\nimport FocusLock from '../internal/components/focus-lock';\nimport Portal from '../internal/components/portal';\nimport { ModalContext } from '../internal/context/modal-context';\nimport ResetContextsForModal from '../internal/context/reset-contexts-for-modal';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { useContainerBreakpoints } from '../internal/hooks/container-queries';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useIntersectionObserver } from '../internal/hooks/use-intersection-observer';\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 { KeyCode } from '../internal/keycode';\nimport { SomeRequired } from '../internal/types';\nimport {\n GeneratedAnalyticsMetadataModalComponent,\n GeneratedAnalyticsMetadataModalDismiss,\n} from './analytics-metadata/interfaces';\nimport { disableBodyScrolling, enableBodyScrolling } from './body-scroll';\nimport { ModalProps } from './interfaces';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\ntype InternalModalProps = SomeRequired<ModalProps, 'size'> &\n InternalBaseComponentProps & { __injectAnalyticsComponentMetadata?: boolean };\n\nexport default function InternalModal({ modalRoot, getModalRoot, removeModalRoot, ...rest }: InternalModalProps) {\n return (\n <Portal container={modalRoot} getContainer={getModalRoot} removeContainer={removeModalRoot}>\n <PortaledModal {...rest} />\n </Portal>\n );\n}\n\ntype PortaledModalProps = Omit<InternalModalProps, 'modalRoot' | 'getModalRoot' | 'removeModalRoot'>;\n\n// Separate component to prevent the Portal from getting in the way of refs, as it needs extra cycles to render the inner components.\n// useContainerQuery needs its targeted element to exist on the first render in order to work properly.\nfunction PortaledModal({\n size,\n visible,\n header,\n children,\n footer,\n disableContentPaddings,\n onDismiss,\n __internalRootRef = null,\n __injectAnalyticsComponentMetadata,\n ...rest\n}: PortaledModalProps) {\n const instanceUniqueId = useUniqueId();\n const headerId = `${rest.id || instanceUniqueId}-header`;\n const lastMouseDownElementRef = useRef<HTMLElement | null>(null);\n const [breakpoint, breakpointsRef] = useContainerBreakpoints(['xs']);\n\n const i18n = useInternalI18n('modal');\n const closeAriaLabel = i18n('closeAriaLabel', rest.closeAriaLabel);\n\n const refObject = useRef<HTMLDivElement>(null);\n const mergedRef = useMergeRefs(breakpointsRef, refObject, __internalRootRef);\n\n const isRefresh = useVisualRefresh();\n\n const baseProps = getBaseProps(rest);\n\n const analyticsComponentMetadata: GeneratedAnalyticsMetadataModalComponent = {\n name: 'awsui.Modal',\n label: `.${analyticsSelectors.header} h2`,\n };\n\n const metadataAttribute = __injectAnalyticsComponentMetadata\n ? getAnalyticsMetadataAttribute({ component: analyticsComponentMetadata })\n : {};\n\n // enable body scroll and restore focus if unmounting while visible\n useEffect(() => {\n return () => {\n enableBodyScrolling();\n };\n }, []);\n\n // enable / disable body scroll\n useEffect(() => {\n if (visible) {\n disableBodyScrolling();\n } else {\n enableBodyScrolling();\n }\n }, [visible]);\n\n // Because we hide the element with styles (and not actually detach it from DOM), we need to scroll to top\n useEffect(() => {\n if (visible && refObject.current) {\n refObject.current.scrollTop = 0;\n }\n }, [visible]);\n\n const dismiss = (reason: string) => fireNonCancelableEvent(onDismiss, { reason });\n\n const onOverlayMouseDown = (event: React.MouseEvent) => {\n lastMouseDownElementRef.current = event.target as HTMLElement;\n };\n const onOverlayClick = (event: React.MouseEvent) => {\n const overlay = refObject.current;\n const lastClicked = lastMouseDownElementRef.current;\n\n if (event.target === overlay && lastClicked === overlay) {\n dismiss('overlay');\n }\n };\n const onCloseButtonClick = () => dismiss('closeButton');\n const escKeyHandler = (event: React.KeyboardEvent) => {\n if (event.keyCode === KeyCode.escape) {\n dismiss('keyboard');\n }\n };\n\n // We use an empty div element at the end of the content slot as a sentinel\n // to detect when the user has scrolled to the bottom.\n const { ref: stickySentinelRef, isIntersecting: footerStuck } = useIntersectionObserver();\n\n // Add extra scroll padding to account for the height of the sticky footer,\n // to prevent it from covering focused elements.\n const [footerHeight, footerRef] = useContainerQuery(rect => rect.borderBoxHeight);\n const { subStepRef } = useFunnelSubStep();\n\n return (\n <FunnelNameSelectorContext.Provider value={`.${styles['header--text']}`}>\n <ResetContextsForModal>\n <ModalContext.Provider value={{ isInModal: true }}>\n <div\n {...baseProps}\n className={clsx(\n styles.root,\n { [styles.hidden]: !visible },\n baseProps.className,\n isRefresh && styles.refresh\n )}\n role=\"dialog\"\n aria-modal={true}\n aria-labelledby={headerId}\n onMouseDown={onOverlayMouseDown}\n onClick={onOverlayClick}\n ref={mergedRef}\n style={footerHeight ? { scrollPaddingBottom: footerHeight } : undefined}\n data-awsui-referrer-id={subStepRef.current?.id}\n >\n <FocusLock disabled={!visible} autoFocus={true} restoreFocus={true} className={styles['focus-lock']}>\n <div\n className={clsx(\n styles.dialog,\n styles[size],\n styles[`breakpoint-${breakpoint}`],\n isRefresh && styles.refresh\n )}\n onKeyDown={escKeyHandler}\n {...metadataAttribute}\n >\n <div className={styles.container}>\n <div className={clsx(styles.header, analyticsSelectors.header)}>\n <InternalHeader\n variant=\"h2\"\n __disableActionsWrapping={true}\n actions={\n <div\n {...getAnalyticsMetadataAttribute({\n action: 'dismiss',\n } as Partial<GeneratedAnalyticsMetadataModalDismiss>)}\n >\n <InternalButton\n ariaLabel={closeAriaLabel}\n className={styles['dismiss-control']}\n variant=\"modal-dismiss\"\n iconName=\"close\"\n formAction=\"none\"\n onClick={onCloseButtonClick}\n />\n </div>\n }\n >\n <span id={headerId} className={styles['header--text']}>\n {header}\n </span>\n </InternalHeader>\n </div>\n <div className={clsx(styles.content, { [styles['no-paddings']]: disableContentPaddings })}>\n {children}\n <div ref={stickySentinelRef} />\n </div>\n {footer && (\n <div ref={footerRef} className={clsx(styles.footer, footerStuck && styles['footer--stuck'])}>\n {footer}\n </div>\n )}\n </div>\n </div>\n </FocusLock>\n </div>\n </ModalContext.Provider>\n </ResetContextsForModal>\n </FunnelNameSelectorContext.Provider>\n );\n}\n"]}
1
+ {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/modal/internal.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, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useContainerQuery } from '@cloudscape-design/component-toolkit';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { InternalButton } from '../button/internal';\nimport InternalHeader from '../header/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport { FunnelNameSelectorContext } from '../internal/analytics/context/analytics-context';\nimport { useFunnelSubStep } from '../internal/analytics/hooks/use-funnel';\nimport { getBaseProps } from '../internal/base-component';\nimport FocusLock from '../internal/components/focus-lock';\nimport Portal from '../internal/components/portal';\nimport { ModalContext } from '../internal/context/modal-context';\nimport ResetContextsForModal from '../internal/context/reset-contexts-for-modal';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { useContainerBreakpoints } from '../internal/hooks/container-queries';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useIntersectionObserver } from '../internal/hooks/use-intersection-observer';\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 { KeyCode } from '../internal/keycode';\nimport { SomeRequired } from '../internal/types';\nimport {\n GeneratedAnalyticsMetadataModalComponent,\n GeneratedAnalyticsMetadataModalDismiss,\n} from './analytics-metadata/interfaces';\nimport { disableBodyScrolling, enableBodyScrolling } from './body-scroll';\nimport { ModalProps } from './interfaces';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\ntype InternalModalProps = SomeRequired<ModalProps, 'size'> &\n InternalBaseComponentProps & { __injectAnalyticsComponentMetadata?: boolean; referrerId?: string };\n\nexport default function InternalModal({ modalRoot, getModalRoot, removeModalRoot, ...rest }: InternalModalProps) {\n return (\n <Portal container={modalRoot} getContainer={getModalRoot} removeContainer={removeModalRoot}>\n <PortaledModal {...rest} />\n </Portal>\n );\n}\n\ntype PortaledModalProps = Omit<InternalModalProps, 'modalRoot' | 'getModalRoot' | 'removeModalRoot'>;\n\n// Separate component to prevent the Portal from getting in the way of refs, as it needs extra cycles to render the inner components.\n// useContainerQuery needs its targeted element to exist on the first render in order to work properly.\nfunction PortaledModal({\n size,\n visible,\n header,\n children,\n footer,\n disableContentPaddings,\n onDismiss,\n __internalRootRef = null,\n __injectAnalyticsComponentMetadata,\n referrerId,\n ...rest\n}: PortaledModalProps) {\n const instanceUniqueId = useUniqueId();\n const headerId = `${rest.id || instanceUniqueId}-header`;\n const lastMouseDownElementRef = useRef<HTMLElement | null>(null);\n const [breakpoint, breakpointsRef] = useContainerBreakpoints(['xs']);\n\n const i18n = useInternalI18n('modal');\n const closeAriaLabel = i18n('closeAriaLabel', rest.closeAriaLabel);\n\n const refObject = useRef<HTMLDivElement>(null);\n const mergedRef = useMergeRefs(breakpointsRef, refObject, __internalRootRef);\n\n const isRefresh = useVisualRefresh();\n\n const baseProps = getBaseProps(rest);\n\n const analyticsComponentMetadata: GeneratedAnalyticsMetadataModalComponent = {\n name: 'awsui.Modal',\n label: `.${analyticsSelectors.header} h2`,\n };\n\n const metadataAttribute = __injectAnalyticsComponentMetadata\n ? getAnalyticsMetadataAttribute({ component: analyticsComponentMetadata })\n : {};\n\n // enable body scroll and restore focus if unmounting while visible\n useEffect(() => {\n return () => {\n enableBodyScrolling();\n };\n }, []);\n\n // enable / disable body scroll\n useEffect(() => {\n if (visible) {\n disableBodyScrolling();\n } else {\n enableBodyScrolling();\n }\n }, [visible]);\n\n // Because we hide the element with styles (and not actually detach it from DOM), we need to scroll to top\n useEffect(() => {\n if (visible && refObject.current) {\n refObject.current.scrollTop = 0;\n }\n }, [visible]);\n\n const dismiss = (reason: string) => fireNonCancelableEvent(onDismiss, { reason });\n\n const onOverlayMouseDown = (event: React.MouseEvent) => {\n lastMouseDownElementRef.current = event.target as HTMLElement;\n };\n const onOverlayClick = (event: React.MouseEvent) => {\n const overlay = refObject.current;\n const lastClicked = lastMouseDownElementRef.current;\n\n if (event.target === overlay && lastClicked === overlay) {\n dismiss('overlay');\n }\n };\n const onCloseButtonClick = () => dismiss('closeButton');\n const escKeyHandler = (event: React.KeyboardEvent) => {\n if (event.keyCode === KeyCode.escape) {\n dismiss('keyboard');\n }\n };\n\n // We use an empty div element at the end of the content slot as a sentinel\n // to detect when the user has scrolled to the bottom.\n const { ref: stickySentinelRef, isIntersecting: footerStuck } = useIntersectionObserver();\n\n // Add extra scroll padding to account for the height of the sticky footer,\n // to prevent it from covering focused elements.\n const [footerHeight, footerRef] = useContainerQuery(rect => rect.borderBoxHeight);\n const { subStepRef } = useFunnelSubStep();\n\n return (\n <FunnelNameSelectorContext.Provider value={`.${styles['header--text']}`}>\n <ResetContextsForModal>\n <ModalContext.Provider value={{ isInModal: true }}>\n <div\n {...baseProps}\n className={clsx(\n styles.root,\n { [styles.hidden]: !visible },\n baseProps.className,\n isRefresh && styles.refresh\n )}\n role=\"dialog\"\n aria-modal={true}\n aria-labelledby={headerId}\n onMouseDown={onOverlayMouseDown}\n onClick={onOverlayClick}\n ref={mergedRef}\n style={footerHeight ? { scrollPaddingBottom: footerHeight } : undefined}\n data-awsui-referrer-id={subStepRef.current?.id || referrerId}\n >\n <FocusLock disabled={!visible} autoFocus={true} restoreFocus={true} className={styles['focus-lock']}>\n <div\n className={clsx(\n styles.dialog,\n styles[size],\n styles[`breakpoint-${breakpoint}`],\n isRefresh && styles.refresh\n )}\n onKeyDown={escKeyHandler}\n {...metadataAttribute}\n >\n <div className={styles.container}>\n <div className={clsx(styles.header, analyticsSelectors.header)}>\n <InternalHeader\n variant=\"h2\"\n __disableActionsWrapping={true}\n actions={\n <div\n {...getAnalyticsMetadataAttribute({\n action: 'dismiss',\n } as Partial<GeneratedAnalyticsMetadataModalDismiss>)}\n >\n <InternalButton\n ariaLabel={closeAriaLabel}\n className={styles['dismiss-control']}\n variant=\"modal-dismiss\"\n iconName=\"close\"\n formAction=\"none\"\n onClick={onCloseButtonClick}\n />\n </div>\n }\n >\n <span id={headerId} className={styles['header--text']}>\n {header}\n </span>\n </InternalHeader>\n </div>\n <div className={clsx(styles.content, { [styles['no-paddings']]: disableContentPaddings })}>\n {children}\n <div ref={stickySentinelRef} />\n </div>\n {footer && (\n <div ref={footerRef} className={clsx(styles.footer, footerStuck && styles['footer--stuck'])}>\n {footer}\n </div>\n )}\n </div>\n </div>\n </FocusLock>\n </div>\n </ModalContext.Provider>\n </ResetContextsForModal>\n </FunnelNameSelectorContext.Provider>\n );\n}\n"]}
package/package.json CHANGED
@@ -72,6 +72,7 @@
72
72
  "./spinner": "./spinner/index.js",
73
73
  "./split-panel": "./split-panel/index.js",
74
74
  "./status-indicator": "./status-indicator/index.js",
75
+ "./steps": "./steps/index.js",
75
76
  "./table": "./table/index.js",
76
77
  "./tabs": "./tabs/index.js",
77
78
  "./tag-editor": "./tag-editor/index.js",
@@ -126,7 +127,7 @@
126
127
  "./internal/base-component/index.js",
127
128
  "./internal/base-component/styles.css.js"
128
129
  ],
129
- "version": "3.0.773",
130
+ "version": "3.0.775",
130
131
  "repository": {
131
132
  "type": "git",
132
133
  "url": "https://github.com/cloudscape-design/components.git"
@@ -64,22 +64,6 @@ export interface PromptInputProps extends BaseInputProps, InputKeyEvents, InputA
64
64
  * Specifies the maximum number of lines of text the textarea will expand to.
65
65
  */
66
66
  maxRows?: number;
67
- /**
68
- * Use this slot to add secondary actions to the prompt input.
69
- */
70
- secondaryActions?: React.ReactNode;
71
- /**
72
- * Use this slot to add secondary content, such as file attachments, to the prompt input.
73
- */
74
- secondaryContent?: React.ReactNode;
75
- /**
76
- * Determines whether the secondary actions area of the input has padding. If true, removes the default padding from the secondary actions area.
77
- */
78
- disableSecondaryActionsPaddings?: boolean;
79
- /**
80
- * Determines whether the secondary content area of the input has padding. If true, removes the default padding from the secondary content area.
81
- */
82
- disableSecondaryContentPaddings?: boolean;
83
67
  }
84
68
  export declare namespace PromptInputProps {
85
69
  type KeyDetail = BaseKeyDetail;
@@ -1 +1 @@
1
- {"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/prompt-input/interfaces.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EACL,gBAAgB,EAChB,cAAc,EACd,iBAAiB,EACjB,gBAAgB,EAChB,cAAc,EACd,eAAe,EAChB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,+BAA+B,EAAE,MAAM,wCAAwC,CAAC;AACzF,OAAO,EAAE,aAAa,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAE9E,MAAM,WAAW,gBACf,SAAQ,cAAc,EACpB,cAAc,EACd,gBAAgB,EAChB,iBAAiB,EACjB,eAAe,EACf,kBAAkB,EAClB,+BAA+B;IACjC;;;OAGG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC,gBAAgB,CAAC,YAAY,CAAC,CAAC;IACpE;;OAEG;IACH,oBAAoB,CAAC,EAAE,SAAS,CAAC,IAAI,CAAC;IACtC;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B;;;;;;;;;;;;;;;;;;;;OAoBG;IACH,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACtC;;;OAGG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B;;;OAGG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAE/B;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEnC;;OAEG;IACH,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEnC;;OAEG;IACH,+BAA+B,CAAC,EAAE,OAAO,CAAC;IAE1C;;OAEG;IACH,+BAA+B,CAAC,EAAE,OAAO,CAAC;CAC3C;AAED,yBAAiB,gBAAgB,CAAC;IAChC,KAAY,SAAS,GAAG,aAAa,CAAC;IACtC,KAAY,YAAY,GAAG,gBAAgB,CAAC;IAE5C,UAAiB,GAAG;QAClB;;WAEG;QACH,KAAK,IAAI,IAAI,CAAC;QAEd;;WAEG;QACH,MAAM,IAAI,IAAI,CAAC;KAChB;CACF"}
1
+ {"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/prompt-input/interfaces.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EACL,gBAAgB,EAChB,cAAc,EACd,iBAAiB,EACjB,gBAAgB,EAChB,cAAc,EACd,eAAe,EAChB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,+BAA+B,EAAE,MAAM,wCAAwC,CAAC;AACzF,OAAO,EAAE,aAAa,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAE9E,MAAM,WAAW,gBACf,SAAQ,cAAc,EACpB,cAAc,EACd,gBAAgB,EAChB,iBAAiB,EACjB,eAAe,EACf,kBAAkB,EAClB,+BAA+B;IACjC;;;OAGG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC,gBAAgB,CAAC,YAAY,CAAC,CAAC;IACpE;;OAEG;IACH,oBAAoB,CAAC,EAAE,SAAS,CAAC,IAAI,CAAC;IACtC;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B;;;;;;;;;;;;;;;;;;;;OAoBG;IACH,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACtC;;;OAGG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B;;;OAGG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAE/B;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,yBAAiB,gBAAgB,CAAC;IAChC,KAAY,SAAS,GAAG,aAAa,CAAC;IACtC,KAAY,YAAY,GAAG,gBAAgB,CAAC;IAE5C,UAAiB,GAAG;QAClB;;WAEG;QACH,KAAK,IAAI,IAAI,CAAC;QAEd;;WAEG;QACH,MAAM,IAAI,IAAI,CAAC;KAChB;CACF"}
@@ -1 +1 @@
1
- {"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/prompt-input/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { IconProps } from '../icon/interfaces';\nimport {\n BaseChangeDetail,\n BaseInputProps,\n InputAutoComplete,\n InputAutoCorrect,\n InputKeyEvents,\n InputSpellcheck,\n} from '../input/interfaces';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { FormFieldValidationControlProps } from '../internal/context/form-field-context';\nimport { BaseKeyDetail, NonCancelableEventHandler } from '../internal/events';\n\nexport interface PromptInputProps\n extends BaseInputProps,\n InputKeyEvents,\n InputAutoCorrect,\n InputAutoComplete,\n InputSpellcheck,\n BaseComponentProps,\n FormFieldValidationControlProps {\n /**\n * Called whenever a user clicks the action button or presses the \"Enter\" key.\n * The event `detail` contains the current value of the field.\n */\n onAction?: NonCancelableEventHandler<PromptInputProps.ActionDetail>;\n /**\n * Determines what icon to display in the action button.\n */\n actionButtonIconName?: IconProps.Name;\n /**\n * Specifies the URL of a custom icon. Use this property if the icon you want isn't available.\n *\n * If you set both `actionButtonIconUrl` and `actionButtonIconSvg`, `actionButtonIconSvg` will take precedence.\n */\n actionButtonIconUrl?: string;\n /**\n * Specifies the SVG of a custom icon.\n *\n * Use this property if you want your custom icon to inherit colors dictated by variant or hover states.\n * When this property is set, the component will be decorated with `aria-hidden=\"true\"`. Ensure that the `svg` element:\n * - has attribute `focusable=\"false\"`.\n * - has `viewBox=\"0 0 16 16\"`.\n *\n * If you set the `svg` element as the root node of the slot, the component will automatically\n * - set `stroke=\"currentColor\"`, `fill=\"none\"`, and `vertical-align=\"top\"`.\n * - set the stroke width based on the size of the icon.\n * - set the width and height of the SVG element based on the size of the icon.\n *\n * If you don't want these styles to be automatically set, wrap the `svg` element into a `span`.\n * You can still set the stroke to `currentColor` to inherit the color of the surrounding elements.\n *\n * If you set both `actionButtonIconUrl` and `actionButtonIconSvg`, `iconSvg` will take precedence.\n *\n * *Note:* Remember to remove any additional elements (for example: `defs`) and related CSS classes from SVG files exported from design software.\n * In most cases, they aren't needed, as the `svg` element inherits styles from the icon component.\n */\n actionButtonIconSvg?: React.ReactNode;\n /**\n * Specifies alternate text for a custom icon. We recommend that you provide this for accessibility.\n * This property is ignored if you use a predefined icon or if you set your custom icon using the `iconSvg` slot.\n */\n actionButtonIconAlt?: string;\n /**\n * Adds an aria-label to the action button.\n * @i18n\n */\n actionButtonAriaLabel?: string;\n\n /**\n * Specifies whether to disable the action button.\n */\n disableActionButton?: boolean;\n\n /**\n * Specifies the minimum number of lines of text to set the height to.\n */\n minRows?: number;\n\n /**\n * Specifies the maximum number of lines of text the textarea will expand to.\n */\n maxRows?: number;\n\n /**\n * Use this slot to add secondary actions to the prompt input.\n */\n secondaryActions?: React.ReactNode;\n\n /**\n * Use this slot to add secondary content, such as file attachments, to the prompt input.\n */\n secondaryContent?: React.ReactNode;\n\n /**\n * Determines whether the secondary actions area of the input has padding. If true, removes the default padding from the secondary actions area.\n */\n disableSecondaryActionsPaddings?: boolean;\n\n /**\n * Determines whether the secondary content area of the input has padding. If true, removes the default padding from the secondary content area.\n */\n disableSecondaryContentPaddings?: boolean;\n}\n\nexport namespace PromptInputProps {\n export type KeyDetail = BaseKeyDetail;\n export type ActionDetail = BaseChangeDetail;\n\n export interface Ref {\n /**\n * Sets input focus on the textarea control.\n */\n focus(): void;\n\n /**\n * Selects all text in the textarea control.\n */\n select(): void;\n }\n}\n"]}
1
+ {"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/prompt-input/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { IconProps } from '../icon/interfaces';\nimport {\n BaseChangeDetail,\n BaseInputProps,\n InputAutoComplete,\n InputAutoCorrect,\n InputKeyEvents,\n InputSpellcheck,\n} from '../input/interfaces';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { FormFieldValidationControlProps } from '../internal/context/form-field-context';\nimport { BaseKeyDetail, NonCancelableEventHandler } from '../internal/events';\n\nexport interface PromptInputProps\n extends BaseInputProps,\n InputKeyEvents,\n InputAutoCorrect,\n InputAutoComplete,\n InputSpellcheck,\n BaseComponentProps,\n FormFieldValidationControlProps {\n /**\n * Called whenever a user clicks the action button or presses the \"Enter\" key.\n * The event `detail` contains the current value of the field.\n */\n onAction?: NonCancelableEventHandler<PromptInputProps.ActionDetail>;\n /**\n * Determines what icon to display in the action button.\n */\n actionButtonIconName?: IconProps.Name;\n /**\n * Specifies the URL of a custom icon. Use this property if the icon you want isn't available.\n *\n * If you set both `actionButtonIconUrl` and `actionButtonIconSvg`, `actionButtonIconSvg` will take precedence.\n */\n actionButtonIconUrl?: string;\n /**\n * Specifies the SVG of a custom icon.\n *\n * Use this property if you want your custom icon to inherit colors dictated by variant or hover states.\n * When this property is set, the component will be decorated with `aria-hidden=\"true\"`. Ensure that the `svg` element:\n * - has attribute `focusable=\"false\"`.\n * - has `viewBox=\"0 0 16 16\"`.\n *\n * If you set the `svg` element as the root node of the slot, the component will automatically\n * - set `stroke=\"currentColor\"`, `fill=\"none\"`, and `vertical-align=\"top\"`.\n * - set the stroke width based on the size of the icon.\n * - set the width and height of the SVG element based on the size of the icon.\n *\n * If you don't want these styles to be automatically set, wrap the `svg` element into a `span`.\n * You can still set the stroke to `currentColor` to inherit the color of the surrounding elements.\n *\n * If you set both `actionButtonIconUrl` and `actionButtonIconSvg`, `iconSvg` will take precedence.\n *\n * *Note:* Remember to remove any additional elements (for example: `defs`) and related CSS classes from SVG files exported from design software.\n * In most cases, they aren't needed, as the `svg` element inherits styles from the icon component.\n */\n actionButtonIconSvg?: React.ReactNode;\n /**\n * Specifies alternate text for a custom icon. We recommend that you provide this for accessibility.\n * This property is ignored if you use a predefined icon or if you set your custom icon using the `iconSvg` slot.\n */\n actionButtonIconAlt?: string;\n /**\n * Adds an aria-label to the action button.\n * @i18n\n */\n actionButtonAriaLabel?: string;\n\n /**\n * Specifies whether to disable the action button.\n */\n disableActionButton?: boolean;\n\n /**\n * Specifies the minimum number of lines of text to set the height to.\n */\n minRows?: number;\n\n /**\n * Specifies the maximum number of lines of text the textarea will expand to.\n */\n maxRows?: number;\n}\n\nexport namespace PromptInputProps {\n export type KeyDetail = BaseKeyDetail;\n export type ActionDetail = BaseChangeDetail;\n\n export interface Ref {\n /**\n * Sets input focus on the textarea control.\n */\n focus(): void;\n\n /**\n * Selects all text in the textarea control.\n */\n select(): void;\n }\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/prompt-input/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmE,MAAM,OAAO,CAAC;AAWxF,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAElF,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAKhD,MAAM,WAAW,wBAAyB,SAAQ,gBAAgB,EAAE,0BAA0B;CAAG;AAEjG,QAAA,MAAM,mBAAmB,uGAuMxB,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
1
+ {"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/prompt-input/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmE,MAAM,OAAO,CAAC;AAWxF,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAElF,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAKhD,MAAM,WAAW,wBAAyB,SAAQ,gBAAgB,EAAE,0BAA0B;CAAG;AAEjG,QAAA,MAAM,mBAAmB,uGAkKxB,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
@@ -14,7 +14,7 @@ import { useVisualRefresh } from '../internal/hooks/use-visual-mode';
14
14
  import styles from './styles.css.js';
15
15
  import testutilStyles from './test-classes/styles.css.js';
16
16
  const InternalPromptInput = React.forwardRef((_a, ref) => {
17
- var { value, actionButtonAriaLabel, actionButtonIconName, actionButtonIconUrl, actionButtonIconSvg, actionButtonIconAlt, ariaLabel, autoComplete, autoFocus, disableActionButton, disableBrowserAutocorrect, disabled, maxRows = 3, minRows, name, onAction, onBlur, onChange, onFocus, onKeyDown, onKeyUp, placeholder, readOnly, spellcheck, secondaryActions, secondaryContent, disableSecondaryActionsPaddings, disableSecondaryContentPaddings, __internalRootRef = null } = _a, rest = __rest(_a, ["value", "actionButtonAriaLabel", "actionButtonIconName", "actionButtonIconUrl", "actionButtonIconSvg", "actionButtonIconAlt", "ariaLabel", "autoComplete", "autoFocus", "disableActionButton", "disableBrowserAutocorrect", "disabled", "maxRows", "minRows", "name", "onAction", "onBlur", "onChange", "onFocus", "onKeyDown", "onKeyUp", "placeholder", "readOnly", "spellcheck", "secondaryActions", "secondaryContent", "disableSecondaryActionsPaddings", "disableSecondaryContentPaddings", "__internalRootRef"]);
17
+ var { value, actionButtonAriaLabel, actionButtonIconName, actionButtonIconUrl, actionButtonIconSvg, actionButtonIconAlt, ariaLabel, autoComplete, autoFocus, disableActionButton, disableBrowserAutocorrect, disabled, maxRows = 3, minRows, name, onAction, onBlur, onChange, onFocus, onKeyDown, onKeyUp, placeholder, readOnly, spellcheck, __internalRootRef = null } = _a, rest = __rest(_a, ["value", "actionButtonAriaLabel", "actionButtonIconName", "actionButtonIconUrl", "actionButtonIconSvg", "actionButtonIconAlt", "ariaLabel", "autoComplete", "autoFocus", "disableActionButton", "disableBrowserAutocorrect", "disabled", "maxRows", "minRows", "name", "onAction", "onBlur", "onChange", "onFocus", "onKeyDown", "onKeyUp", "placeholder", "readOnly", "spellcheck", "__internalRootRef"]);
18
18
  const { ariaLabelledby, ariaDescribedby, controlId, invalid, warning } = useFormFieldContext(rest);
19
19
  const baseProps = getBaseProps(rest);
20
20
  const textareaRef = useRef(null);
@@ -48,12 +48,11 @@ const InternalPromptInput = React.forwardRef((_a, ref) => {
48
48
  fireNonCancelableEvent(onChange, { value: event.target.value });
49
49
  adjustTextareaHeight();
50
50
  };
51
- const hasActionButton = actionButtonIconName || actionButtonIconSvg || actionButtonIconUrl;
52
51
  const adjustTextareaHeight = useCallback(() => {
53
52
  if (textareaRef.current) {
54
53
  textareaRef.current.style.height = 'auto';
55
54
  const maxRowsHeight = `calc(${maxRows <= 0 ? 3 : maxRows} * (${LINE_HEIGHT} + ${PADDING} / 2) + ${PADDING})`;
56
- const scrollHeight = `calc(${textareaRef.current.scrollHeight}px)`;
55
+ const scrollHeight = `calc(${textareaRef.current.scrollHeight}px + ${PADDING})`;
57
56
  textareaRef.current.style.height = `min(${scrollHeight}, ${maxRowsHeight})`;
58
57
  }
59
58
  }, [maxRows, LINE_HEIGHT, PADDING]);
@@ -78,8 +77,10 @@ const InternalPromptInput = React.forwardRef((_a, ref) => {
78
77
  placeholder,
79
78
  autoFocus,
80
79
  className: clsx(styles.textarea, testutilStyles.textarea, {
81
- [styles.invalid]: invalid,
82
- [styles.warning]: warning,
80
+ [styles['textarea-readonly']]: readOnly,
81
+ [styles['textarea-invalid']]: invalid,
82
+ [styles['textarea-warning']]: warning && !invalid,
83
+ [styles['textarea-with-button']]: actionButtonIconName,
83
84
  }),
84
85
  autoComplete: convertAutoComplete(autoComplete),
85
86
  spellCheck: spellcheck,
@@ -94,33 +95,15 @@ const InternalPromptInput = React.forwardRef((_a, ref) => {
94
95
  onBlur: onBlur && (() => fireNonCancelableEvent(onBlur)),
95
96
  onFocus: onFocus && (() => fireNonCancelableEvent(onFocus)),
96
97
  };
98
+ const hasActionButton = actionButtonIconName || actionButtonIconSvg || actionButtonIconUrl;
97
99
  if (disableBrowserAutocorrect) {
98
100
  attributes.autoCorrect = 'off';
99
101
  attributes.autoCapitalize = 'off';
100
102
  }
101
- const action = (React.createElement("div", { className: styles.button },
102
- React.createElement(InternalButton, { className: clsx(styles['action-button'], testutilStyles['action-button']), ariaLabel: actionButtonAriaLabel, disabled: disabled || readOnly || disableActionButton, __focusable: readOnly, iconName: actionButtonIconName, iconUrl: actionButtonIconUrl, iconSvg: actionButtonIconSvg, iconAlt: actionButtonIconAlt, onClick: () => fireNonCancelableEvent(onAction, { value }), variant: "icon" })));
103
- return (React.createElement("div", Object.assign({}, baseProps, { "aria-label": ariaLabel, className: clsx(styles.root, testutilStyles.root, baseProps.className, {
104
- [styles['textarea-readonly']]: readOnly,
105
- [styles['textarea-invalid']]: invalid,
106
- [styles['textarea-warning']]: warning && !invalid,
107
- [styles.disabled]: disabled,
108
- }), ref: __internalRootRef, role: "region" }),
109
- secondaryContent && (React.createElement("div", { className: clsx(styles['secondary-content'], testutilStyles['secondary-content'], {
110
- [styles['with-paddings']]: !disableSecondaryContentPaddings,
111
- [styles.invalid]: invalid,
112
- [styles.warning]: warning,
113
- }) }, secondaryContent)),
114
- React.createElement("div", { className: styles['textarea-wrapper'] },
115
- React.createElement("textarea", Object.assign({ ref: textareaRef, id: controlId }, attributes)),
116
- hasActionButton && !secondaryActions && action),
117
- secondaryActions && (React.createElement("div", { className: clsx(styles['secondary-actions'], testutilStyles['secondary-actions'], {
118
- [styles['with-paddings']]: !disableSecondaryActionsPaddings,
119
- [styles.invalid]: invalid,
120
- [styles.warning]: warning,
121
- }) },
122
- secondaryActions,
123
- hasActionButton && action))));
103
+ return (React.createElement("div", Object.assign({}, baseProps, { className: clsx(styles.root, testutilStyles.root, baseProps.className), ref: __internalRootRef }),
104
+ React.createElement("textarea", Object.assign({ ref: textareaRef, id: controlId }, attributes)),
105
+ hasActionButton && (React.createElement("div", { className: styles.button },
106
+ React.createElement(InternalButton, { className: clsx(styles['action-button'], testutilStyles['action-button']), ariaLabel: actionButtonAriaLabel, disabled: disabled || readOnly || disableActionButton, iconName: actionButtonIconName, iconUrl: actionButtonIconUrl, iconSvg: actionButtonIconSvg, iconAlt: actionButtonIconAlt, onClick: () => fireNonCancelableEvent(onAction, { value }), variant: "icon" })))));
124
107
  });
125
108
  export default InternalPromptInput;
126
109
  //# sourceMappingURL=internal.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/prompt-input/internal.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, { Ref, useCallback, useEffect, useImperativeHandle, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useDensityMode } from '@cloudscape-design/component-toolkit/internal';\n\nimport InternalButton from '../button/internal';\nimport { convertAutoComplete } from '../input/utils';\nimport { getBaseProps } from '../internal/base-component';\nimport { useFormFieldContext } from '../internal/context/form-field-context';\nimport { fireKeyboardEvent, fireNonCancelableEvent } from '../internal/events';\nimport * as tokens from '../internal/generated/styles/tokens';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { PromptInputProps } from './interfaces';\n\nimport styles from './styles.css.js';\nimport testutilStyles from './test-classes/styles.css.js';\n\nexport interface InternalPromptInputProps extends PromptInputProps, InternalBaseComponentProps {}\n\nconst InternalPromptInput = React.forwardRef(\n (\n {\n value,\n actionButtonAriaLabel,\n actionButtonIconName,\n actionButtonIconUrl,\n actionButtonIconSvg,\n actionButtonIconAlt,\n ariaLabel,\n autoComplete,\n autoFocus,\n disableActionButton,\n disableBrowserAutocorrect,\n disabled,\n maxRows = 3,\n minRows,\n name,\n onAction,\n onBlur,\n onChange,\n onFocus,\n onKeyDown,\n onKeyUp,\n placeholder,\n readOnly,\n spellcheck,\n secondaryActions,\n secondaryContent,\n disableSecondaryActionsPaddings,\n disableSecondaryContentPaddings,\n __internalRootRef = null,\n ...rest\n }: InternalPromptInputProps,\n ref: Ref<PromptInputProps.Ref>\n ) => {\n const { ariaLabelledby, ariaDescribedby, controlId, invalid, warning } = useFormFieldContext(rest);\n\n const baseProps = getBaseProps(rest);\n\n const textareaRef = useRef<HTMLTextAreaElement>(null);\n\n const isRefresh = useVisualRefresh();\n const isCompactMode = useDensityMode(textareaRef) === 'compact';\n\n const PADDING = isRefresh ? tokens.spaceXxs : tokens.spaceXxxs;\n const LINE_HEIGHT = tokens.lineHeightBodyM;\n\n useImperativeHandle(\n ref,\n () => ({\n focus(...args: Parameters<HTMLElement['focus']>) {\n textareaRef.current?.focus(...args);\n },\n select() {\n textareaRef.current?.select();\n },\n }),\n [textareaRef]\n );\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLTextAreaElement>) => {\n if (onKeyDown) {\n fireKeyboardEvent(onKeyDown, event);\n }\n\n if (event.key === 'Enter' && !event.shiftKey) {\n if ('form' in event.target && event.target.form !== null && !event.isDefaultPrevented()) {\n (event.target.form as HTMLFormElement).requestSubmit();\n }\n\n event.preventDefault();\n fireNonCancelableEvent(onAction, { value });\n }\n };\n\n const handleChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n fireNonCancelableEvent(onChange, { value: event.target.value });\n adjustTextareaHeight();\n };\n\n const hasActionButton = actionButtonIconName || actionButtonIconSvg || actionButtonIconUrl;\n\n const adjustTextareaHeight = useCallback(() => {\n if (textareaRef.current) {\n textareaRef.current.style.height = 'auto';\n const maxRowsHeight = `calc(${maxRows <= 0 ? 3 : maxRows} * (${LINE_HEIGHT} + ${PADDING} / 2) + ${PADDING})`;\n const scrollHeight = `calc(${textareaRef.current.scrollHeight}px)`;\n textareaRef.current.style.height = `min(${scrollHeight}, ${maxRowsHeight})`;\n }\n }, [maxRows, LINE_HEIGHT, PADDING]);\n\n useEffect(() => {\n const handleResize = () => {\n adjustTextareaHeight();\n };\n\n window.addEventListener('resize', handleResize);\n\n return () => {\n window.removeEventListener('resize', handleResize);\n };\n }, [adjustTextareaHeight]);\n\n useEffect(() => {\n adjustTextareaHeight();\n }, [value, adjustTextareaHeight, maxRows, isCompactMode]);\n\n const attributes: React.TextareaHTMLAttributes<HTMLTextAreaElement> = {\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n 'aria-describedby': ariaDescribedby,\n 'aria-invalid': invalid ? 'true' : undefined,\n name,\n placeholder,\n autoFocus,\n className: clsx(styles.textarea, testutilStyles.textarea, {\n [styles.invalid]: invalid,\n [styles.warning]: warning,\n }),\n autoComplete: convertAutoComplete(autoComplete),\n spellCheck: spellcheck,\n disabled,\n readOnly: readOnly ? true : undefined,\n rows: minRows || 1,\n onKeyDown: handleKeyDown,\n onKeyUp: onKeyUp && (event => fireKeyboardEvent(onKeyUp, event)),\n // We set a default value on the component in order to force it into the controlled mode.\n value: value || '',\n onChange: handleChange,\n onBlur: onBlur && (() => fireNonCancelableEvent(onBlur)),\n onFocus: onFocus && (() => fireNonCancelableEvent(onFocus)),\n };\n\n if (disableBrowserAutocorrect) {\n attributes.autoCorrect = 'off';\n attributes.autoCapitalize = 'off';\n }\n\n const action = (\n <div className={styles.button}>\n <InternalButton\n className={clsx(styles['action-button'], testutilStyles['action-button'])}\n ariaLabel={actionButtonAriaLabel}\n disabled={disabled || readOnly || disableActionButton}\n __focusable={readOnly}\n iconName={actionButtonIconName}\n iconUrl={actionButtonIconUrl}\n iconSvg={actionButtonIconSvg}\n iconAlt={actionButtonIconAlt}\n onClick={() => fireNonCancelableEvent(onAction, { value })}\n variant=\"icon\"\n />\n </div>\n );\n\n return (\n <div\n {...baseProps}\n aria-label={ariaLabel}\n className={clsx(styles.root, testutilStyles.root, baseProps.className, {\n [styles['textarea-readonly']]: readOnly,\n [styles['textarea-invalid']]: invalid,\n [styles['textarea-warning']]: warning && !invalid,\n [styles.disabled]: disabled,\n })}\n ref={__internalRootRef}\n role=\"region\"\n >\n {secondaryContent && (\n <div\n className={clsx(styles['secondary-content'], testutilStyles['secondary-content'], {\n [styles['with-paddings']]: !disableSecondaryContentPaddings,\n [styles.invalid]: invalid,\n [styles.warning]: warning,\n })}\n >\n {secondaryContent}\n </div>\n )}\n <div className={styles['textarea-wrapper']}>\n <textarea ref={textareaRef} id={controlId} {...attributes} />\n {hasActionButton && !secondaryActions && action}\n </div>\n {secondaryActions && (\n <div\n className={clsx(styles['secondary-actions'], testutilStyles['secondary-actions'], {\n [styles['with-paddings']]: !disableSecondaryActionsPaddings,\n [styles.invalid]: invalid,\n [styles.warning]: warning,\n })}\n >\n {secondaryActions}\n {hasActionButton && action}\n </div>\n )}\n </div>\n );\n }\n);\n\nexport default InternalPromptInput;\n"]}
1
+ {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/prompt-input/internal.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, { Ref, useCallback, useEffect, useImperativeHandle, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useDensityMode } from '@cloudscape-design/component-toolkit/internal';\n\nimport InternalButton from '../button/internal';\nimport { convertAutoComplete } from '../input/utils';\nimport { getBaseProps } from '../internal/base-component';\nimport { useFormFieldContext } from '../internal/context/form-field-context';\nimport { fireKeyboardEvent, fireNonCancelableEvent } from '../internal/events';\nimport * as tokens from '../internal/generated/styles/tokens';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { PromptInputProps } from './interfaces';\n\nimport styles from './styles.css.js';\nimport testutilStyles from './test-classes/styles.css.js';\n\nexport interface InternalPromptInputProps extends PromptInputProps, InternalBaseComponentProps {}\n\nconst InternalPromptInput = React.forwardRef(\n (\n {\n value,\n actionButtonAriaLabel,\n actionButtonIconName,\n actionButtonIconUrl,\n actionButtonIconSvg,\n actionButtonIconAlt,\n ariaLabel,\n autoComplete,\n autoFocus,\n disableActionButton,\n disableBrowserAutocorrect,\n disabled,\n maxRows = 3,\n minRows,\n name,\n onAction,\n onBlur,\n onChange,\n onFocus,\n onKeyDown,\n onKeyUp,\n placeholder,\n readOnly,\n spellcheck,\n __internalRootRef = null,\n ...rest\n }: InternalPromptInputProps,\n ref: Ref<PromptInputProps.Ref>\n ) => {\n const { ariaLabelledby, ariaDescribedby, controlId, invalid, warning } = useFormFieldContext(rest);\n\n const baseProps = getBaseProps(rest);\n\n const textareaRef = useRef<HTMLTextAreaElement>(null);\n\n const isRefresh = useVisualRefresh();\n const isCompactMode = useDensityMode(textareaRef) === 'compact';\n\n const PADDING = isRefresh ? tokens.spaceXxs : tokens.spaceXxxs;\n const LINE_HEIGHT = tokens.lineHeightBodyM;\n\n useImperativeHandle(\n ref,\n () => ({\n focus(...args: Parameters<HTMLElement['focus']>) {\n textareaRef.current?.focus(...args);\n },\n select() {\n textareaRef.current?.select();\n },\n }),\n [textareaRef]\n );\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLTextAreaElement>) => {\n if (onKeyDown) {\n fireKeyboardEvent(onKeyDown, event);\n }\n\n if (event.key === 'Enter' && !event.shiftKey) {\n if ('form' in event.target && event.target.form !== null && !event.isDefaultPrevented()) {\n (event.target.form as HTMLFormElement).requestSubmit();\n }\n\n event.preventDefault();\n fireNonCancelableEvent(onAction, { value });\n }\n };\n\n const handleChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n fireNonCancelableEvent(onChange, { value: event.target.value });\n adjustTextareaHeight();\n };\n\n const adjustTextareaHeight = useCallback(() => {\n if (textareaRef.current) {\n textareaRef.current.style.height = 'auto';\n const maxRowsHeight = `calc(${maxRows <= 0 ? 3 : maxRows} * (${LINE_HEIGHT} + ${PADDING} / 2) + ${PADDING})`;\n const scrollHeight = `calc(${textareaRef.current.scrollHeight}px + ${PADDING})`;\n textareaRef.current.style.height = `min(${scrollHeight}, ${maxRowsHeight})`;\n }\n }, [maxRows, LINE_HEIGHT, PADDING]);\n\n useEffect(() => {\n const handleResize = () => {\n adjustTextareaHeight();\n };\n\n window.addEventListener('resize', handleResize);\n\n return () => {\n window.removeEventListener('resize', handleResize);\n };\n }, [adjustTextareaHeight]);\n\n useEffect(() => {\n adjustTextareaHeight();\n }, [value, adjustTextareaHeight, maxRows, isCompactMode]);\n\n const attributes: React.TextareaHTMLAttributes<HTMLTextAreaElement> = {\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n 'aria-describedby': ariaDescribedby,\n 'aria-invalid': invalid ? 'true' : undefined,\n name,\n placeholder,\n autoFocus,\n className: clsx(styles.textarea, testutilStyles.textarea, {\n [styles['textarea-readonly']]: readOnly,\n [styles['textarea-invalid']]: invalid,\n [styles['textarea-warning']]: warning && !invalid,\n [styles['textarea-with-button']]: actionButtonIconName,\n }),\n autoComplete: convertAutoComplete(autoComplete),\n spellCheck: spellcheck,\n disabled,\n readOnly: readOnly ? true : undefined,\n rows: minRows || 1,\n onKeyDown: handleKeyDown,\n onKeyUp: onKeyUp && (event => fireKeyboardEvent(onKeyUp, event)),\n // We set a default value on the component in order to force it into the controlled mode.\n value: value || '',\n onChange: handleChange,\n onBlur: onBlur && (() => fireNonCancelableEvent(onBlur)),\n onFocus: onFocus && (() => fireNonCancelableEvent(onFocus)),\n };\n\n const hasActionButton = actionButtonIconName || actionButtonIconSvg || actionButtonIconUrl;\n\n if (disableBrowserAutocorrect) {\n attributes.autoCorrect = 'off';\n attributes.autoCapitalize = 'off';\n }\n\n return (\n <div\n {...baseProps}\n className={clsx(styles.root, testutilStyles.root, baseProps.className)}\n ref={__internalRootRef}\n >\n <textarea ref={textareaRef} id={controlId} {...attributes} />\n {hasActionButton && (\n <div className={styles.button}>\n <InternalButton\n className={clsx(styles['action-button'], testutilStyles['action-button'])}\n ariaLabel={actionButtonAriaLabel}\n disabled={disabled || readOnly || disableActionButton}\n iconName={actionButtonIconName}\n iconUrl={actionButtonIconUrl}\n iconSvg={actionButtonIconSvg}\n iconAlt={actionButtonIconAlt}\n onClick={() => fireNonCancelableEvent(onAction, { value })}\n variant=\"icon\"\n />\n </div>\n )}\n </div>\n );\n }\n);\n\nexport default InternalPromptInput;\n"]}
@@ -1,19 +1,13 @@
1
1
 
2
2
  import './styles.scoped.css';
3
3
  export default {
4
- "root": "awsui_root_55fkh_1vvqx_142",
5
- "textarea-readonly": "awsui_textarea-readonly_55fkh_1vvqx_184",
6
- "disabled": "awsui_disabled_55fkh_1vvqx_189",
7
- "textarea-invalid": "awsui_textarea-invalid_55fkh_1vvqx_197",
8
- "textarea-warning": "awsui_textarea-warning_55fkh_1vvqx_222",
9
- "textarea": "awsui_textarea_55fkh_1vvqx_184",
10
- "invalid": "awsui_invalid_55fkh_1vvqx_325",
11
- "warning": "awsui_warning_55fkh_1vvqx_325",
12
- "textarea-wrapper": "awsui_textarea-wrapper_55fkh_1vvqx_344",
13
- "button": "awsui_button_55fkh_1vvqx_348",
14
- "action-button": "awsui_action-button_55fkh_1vvqx_353",
15
- "secondary-content": "awsui_secondary-content_55fkh_1vvqx_378",
16
- "with-paddings": "awsui_with-paddings_55fkh_1vvqx_416",
17
- "secondary-actions": "awsui_secondary-actions_55fkh_1vvqx_426"
4
+ "root": "awsui_root_55fkh_1r4bl_142",
5
+ "button": "awsui_button_55fkh_1r4bl_145",
6
+ "action-button": "awsui_action-button_55fkh_1r4bl_150",
7
+ "textarea": "awsui_textarea_55fkh_1r4bl_172",
8
+ "textarea-readonly": "awsui_textarea-readonly_55fkh_1r4bl_225",
9
+ "textarea-invalid": "awsui_textarea-invalid_55fkh_1r4bl_267",
10
+ "textarea-warning": "awsui_textarea-warning_55fkh_1r4bl_276",
11
+ "textarea-with-button": "awsui_textarea-with-button_55fkh_1r4bl_285"
18
12
  };
19
13