@kaizen/components 1.35.2 → 1.37.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (128) hide show
  1. package/dist/cjs/KaizenProvider/KaizenProvider.cjs +6 -1
  2. package/dist/cjs/KaizenProvider/KaizenProvider.cjs.map +1 -1
  3. package/dist/cjs/Modal/ContextModal/ContextModal.cjs +9 -6
  4. package/dist/cjs/Modal/ContextModal/ContextModal.cjs.map +1 -1
  5. package/dist/cjs/Notification/ToastNotification/ToastNotification/ToastNotification.cjs +33 -0
  6. package/dist/cjs/Notification/ToastNotification/ToastNotification/ToastNotification.cjs.map +1 -0
  7. package/dist/cjs/Notification/ToastNotification/ToastNotificationsList/ToastNotificationsList.cjs +36 -0
  8. package/dist/cjs/Notification/ToastNotification/ToastNotificationsList/ToastNotificationsList.cjs.map +1 -0
  9. package/dist/cjs/Notification/ToastNotification/ToastNotificationsList/ToastNotificationsList.module.scss.cjs +7 -0
  10. package/dist/cjs/Notification/ToastNotification/ToastNotificationsList/ToastNotificationsList.module.scss.cjs.map +1 -0
  11. package/dist/cjs/Notification/ToastNotification/ToastNotificationsList/subcomponents/ToastNotificationsMap/ToastNotificationsMap.cjs +42 -0
  12. package/dist/cjs/Notification/ToastNotification/ToastNotificationsList/subcomponents/ToastNotificationsMap/ToastNotificationsMap.cjs.map +1 -0
  13. package/dist/cjs/Notification/ToastNotification/context/ToastNotificationContext.cjs +72 -0
  14. package/dist/cjs/Notification/ToastNotification/context/ToastNotificationContext.cjs.map +1 -0
  15. package/dist/cjs/Notification/ToastNotification/hooks/useToastNotification.cjs +9 -0
  16. package/dist/cjs/Notification/ToastNotification/hooks/useToastNotification.cjs.map +1 -0
  17. package/dist/cjs/RichTextEditor/RichTextEditor/RichTextEditor.cjs +6 -2
  18. package/dist/cjs/RichTextEditor/RichTextEditor/RichTextEditor.cjs.map +1 -1
  19. package/dist/cjs/__future__/Select/Select.cjs +14 -1
  20. package/dist/cjs/__future__/Select/Select.cjs.map +1 -1
  21. package/dist/cjs/dts/Modal/ContextModal/ContextModal.d.ts +2 -1
  22. package/dist/cjs/dts/Notification/ToastNotification/ToastNotification/ToastNotification.d.ts +16 -0
  23. package/dist/cjs/dts/Notification/ToastNotification/ToastNotification/index.d.ts +1 -0
  24. package/dist/cjs/dts/Notification/ToastNotification/ToastNotificationsList/ToastNotificationsList.d.ts +4 -0
  25. package/dist/cjs/dts/Notification/ToastNotification/ToastNotificationsList/subcomponents/ToastNotificationsMap/ToastNotificationsMap.d.ts +12 -0
  26. package/dist/cjs/dts/Notification/ToastNotification/ToastNotificationsList/subcomponents/ToastNotificationsMap/index.d.ts +1 -0
  27. package/dist/cjs/dts/Notification/ToastNotification/context/ToastNotificationContext.d.ts +21 -0
  28. package/dist/cjs/dts/Notification/ToastNotification/hooks/useToastNotification.d.ts +2 -0
  29. package/dist/cjs/dts/Notification/ToastNotification/index.d.ts +3 -2
  30. package/dist/cjs/dts/Notification/ToastNotification/types.d.ts +1 -9
  31. package/dist/cjs/dts/Notification/index.d.ts +1 -0
  32. package/dist/cjs/dts/RichTextEditor/RichTextEditor/RichTextEditor.d.ts +1 -1
  33. package/dist/cjs/dts/__future__/Select/Select.d.ts +5 -1
  34. package/dist/cjs/dts/index.d.ts +4 -3
  35. package/dist/cjs/index.cjs +16 -8
  36. package/dist/cjs/index.cjs.map +1 -1
  37. package/dist/cjs/index.css +9 -8
  38. package/dist/esm/KaizenProvider/KaizenProvider.mjs +6 -1
  39. package/dist/esm/KaizenProvider/KaizenProvider.mjs.map +1 -1
  40. package/dist/esm/Modal/ContextModal/ContextModal.mjs +9 -6
  41. package/dist/esm/Modal/ContextModal/ContextModal.mjs.map +1 -1
  42. package/dist/esm/Notification/ToastNotification/ToastNotification/ToastNotification.mjs +31 -0
  43. package/dist/esm/Notification/ToastNotification/ToastNotification/ToastNotification.mjs.map +1 -0
  44. package/dist/esm/Notification/ToastNotification/ToastNotificationsList/ToastNotificationsList.mjs +34 -0
  45. package/dist/esm/Notification/ToastNotification/ToastNotificationsList/ToastNotificationsList.mjs.map +1 -0
  46. package/dist/esm/Notification/ToastNotification/ToastNotificationsList/ToastNotificationsList.module.scss.mjs +5 -0
  47. package/dist/esm/Notification/ToastNotification/ToastNotificationsList/ToastNotificationsList.module.scss.mjs.map +1 -0
  48. package/dist/esm/Notification/ToastNotification/ToastNotificationsList/subcomponents/ToastNotificationsMap/ToastNotificationsMap.mjs +40 -0
  49. package/dist/esm/Notification/ToastNotification/ToastNotificationsList/subcomponents/ToastNotificationsMap/ToastNotificationsMap.mjs.map +1 -0
  50. package/dist/esm/Notification/ToastNotification/context/ToastNotificationContext.mjs +69 -0
  51. package/dist/esm/Notification/ToastNotification/context/ToastNotificationContext.mjs.map +1 -0
  52. package/dist/esm/Notification/ToastNotification/hooks/useToastNotification.mjs +7 -0
  53. package/dist/esm/Notification/ToastNotification/hooks/useToastNotification.mjs.map +1 -0
  54. package/dist/esm/RichTextEditor/RichTextEditor/RichTextEditor.mjs +6 -2
  55. package/dist/esm/RichTextEditor/RichTextEditor/RichTextEditor.mjs.map +1 -1
  56. package/dist/esm/__future__/Select/Select.mjs +15 -2
  57. package/dist/esm/__future__/Select/Select.mjs.map +1 -1
  58. package/dist/esm/dts/Modal/ContextModal/ContextModal.d.ts +2 -1
  59. package/dist/esm/dts/Notification/ToastNotification/ToastNotification/ToastNotification.d.ts +16 -0
  60. package/dist/esm/dts/Notification/ToastNotification/ToastNotification/index.d.ts +1 -0
  61. package/dist/esm/dts/Notification/ToastNotification/ToastNotificationsList/ToastNotificationsList.d.ts +4 -0
  62. package/dist/esm/dts/Notification/ToastNotification/ToastNotificationsList/subcomponents/ToastNotificationsMap/ToastNotificationsMap.d.ts +12 -0
  63. package/dist/esm/dts/Notification/ToastNotification/ToastNotificationsList/subcomponents/ToastNotificationsMap/index.d.ts +1 -0
  64. package/dist/esm/dts/Notification/ToastNotification/context/ToastNotificationContext.d.ts +21 -0
  65. package/dist/esm/dts/Notification/ToastNotification/hooks/useToastNotification.d.ts +2 -0
  66. package/dist/esm/dts/Notification/ToastNotification/index.d.ts +3 -2
  67. package/dist/esm/dts/Notification/ToastNotification/types.d.ts +1 -9
  68. package/dist/esm/dts/Notification/index.d.ts +1 -0
  69. package/dist/esm/dts/RichTextEditor/RichTextEditor/RichTextEditor.d.ts +1 -1
  70. package/dist/esm/dts/__future__/Select/Select.d.ts +5 -1
  71. package/dist/esm/dts/index.d.ts +4 -3
  72. package/dist/esm/index.css +8 -7
  73. package/dist/esm/index.mjs +8 -4
  74. package/dist/esm/index.mjs.map +1 -1
  75. package/dist/index.d.ts +136 -81
  76. package/dist/styles.css +1 -1
  77. package/package.json +2 -2
  78. package/src/DatePicker/DatePicker.spec.tsx +1 -1
  79. package/src/KaizenProvider/KaizenProvider.tsx +6 -1
  80. package/src/Modal/ContextModal/ContextModal.spec.tsx +3 -3
  81. package/src/Modal/ContextModal/ContextModal.tsx +9 -5
  82. package/src/Notification/ToastNotification/ToastNotification/ToastNotification.spec.tsx +33 -0
  83. package/src/Notification/ToastNotification/ToastNotification/ToastNotification.tsx +48 -0
  84. package/src/Notification/ToastNotification/ToastNotification/index.ts +1 -0
  85. package/src/Notification/ToastNotification/{subcomponents/ToastNotificationsList → ToastNotificationsList}/ToastNotificationsList.module.scss +1 -1
  86. package/src/Notification/ToastNotification/ToastNotificationsList/ToastNotificationsList.tsx +40 -0
  87. package/src/Notification/ToastNotification/ToastNotificationsList/subcomponents/ToastNotificationsMap/ToastNotificationsMap.tsx +49 -0
  88. package/src/Notification/ToastNotification/ToastNotificationsList/subcomponents/ToastNotificationsMap/index.ts +1 -0
  89. package/src/Notification/ToastNotification/_docs/ToastNotification.mdx +19 -14
  90. package/src/Notification/ToastNotification/_docs/ToastNotification.stickersheet.stories.tsx +33 -70
  91. package/src/Notification/ToastNotification/_docs/ToastNotification.stories.tsx +123 -93
  92. package/src/Notification/ToastNotification/context/ToastNotificationContext.tsx +96 -0
  93. package/src/Notification/ToastNotification/hooks/useToastNotification.ts +9 -0
  94. package/src/Notification/ToastNotification/index.ts +3 -2
  95. package/src/Notification/ToastNotification/types.ts +1 -18
  96. package/src/Notification/index.ts +1 -0
  97. package/src/RichTextEditor/RichTextEditor/RichTextEditor.tsx +6 -1
  98. package/src/RichTextEditor/utils/commands/addMark.spec.ts +0 -1
  99. package/src/Tooltip/Tooltip.spec.tsx +6 -1
  100. package/src/__future__/Select/Select.spec.tsx +78 -2
  101. package/src/__future__/Select/Select.tsx +18 -2
  102. package/src/__future__/Select/_docs/Select.mdx +8 -0
  103. package/src/__future__/Select/_docs/Select.stories.tsx +29 -0
  104. package/src/index.ts +4 -3
  105. package/dist/cjs/dts/Notification/ToastNotification/ToastNotification.d.ts +0 -14
  106. package/dist/cjs/dts/Notification/ToastNotification/subcomponents/ToastNotificationManager/ToastNotificationManager.d.ts +0 -7
  107. package/dist/cjs/dts/Notification/ToastNotification/subcomponents/ToastNotificationManager/index.d.ts +0 -1
  108. package/dist/cjs/dts/Notification/ToastNotification/subcomponents/ToastNotificationsList/ToastNotificationsList.d.ts +0 -11
  109. package/dist/cjs/dts/Notification/ToastNotification/subcomponents/ToastNotificationsListContainer/ToastNotificationsListContainer.d.ts +0 -7
  110. package/dist/cjs/dts/Notification/ToastNotification/subcomponents/ToastNotificationsListContainer/index.d.ts +0 -1
  111. package/dist/esm/dts/Notification/ToastNotification/ToastNotification.d.ts +0 -14
  112. package/dist/esm/dts/Notification/ToastNotification/subcomponents/ToastNotificationManager/ToastNotificationManager.d.ts +0 -7
  113. package/dist/esm/dts/Notification/ToastNotification/subcomponents/ToastNotificationManager/index.d.ts +0 -1
  114. package/dist/esm/dts/Notification/ToastNotification/subcomponents/ToastNotificationsList/ToastNotificationsList.d.ts +0 -11
  115. package/dist/esm/dts/Notification/ToastNotification/subcomponents/ToastNotificationsListContainer/ToastNotificationsListContainer.d.ts +0 -7
  116. package/dist/esm/dts/Notification/ToastNotification/subcomponents/ToastNotificationsListContainer/index.d.ts +0 -1
  117. package/src/Notification/ToastNotification/ToastNotification.spec.tsx +0 -31
  118. package/src/Notification/ToastNotification/ToastNotification.tsx +0 -43
  119. package/src/Notification/ToastNotification/subcomponents/ToastNotificationManager/ToastNotificationManager.spec.tsx +0 -144
  120. package/src/Notification/ToastNotification/subcomponents/ToastNotificationManager/ToastNotificationManager.tsx +0 -135
  121. package/src/Notification/ToastNotification/subcomponents/ToastNotificationManager/index.ts +0 -1
  122. package/src/Notification/ToastNotification/subcomponents/ToastNotificationsList/ToastNotificationsList.tsx +0 -40
  123. package/src/Notification/ToastNotification/subcomponents/ToastNotificationsListContainer/ToastNotificationsListContainer.spec.tsx +0 -73
  124. package/src/Notification/ToastNotification/subcomponents/ToastNotificationsListContainer/ToastNotificationsListContainer.tsx +0 -31
  125. package/src/Notification/ToastNotification/subcomponents/ToastNotificationsListContainer/index.ts +0 -1
  126. /package/dist/cjs/dts/Notification/ToastNotification/{subcomponents/ToastNotificationsList → ToastNotificationsList}/index.d.ts +0 -0
  127. /package/dist/esm/dts/Notification/ToastNotification/{subcomponents/ToastNotificationsList → ToastNotificationsList}/index.d.ts +0 -0
  128. /package/src/Notification/ToastNotification/{subcomponents/ToastNotificationsList → ToastNotificationsList}/index.ts +0 -0
@@ -0,0 +1,34 @@
1
+ import React from 'react';
2
+ import { createPortal } from 'react-dom';
3
+ import { useToastNotificationContext } from '../context/ToastNotificationContext.mjs';
4
+ import { ToastNotificationsMap } from './subcomponents/ToastNotificationsMap/ToastNotificationsMap.mjs';
5
+ import styles from './ToastNotificationsList.module.scss.mjs';
6
+ const ToastNotificationsList = /*#__PURE__*/function () {
7
+ const ToastNotificationsList = function () {
8
+ var _a = useToastNotificationContext(),
9
+ notifications = _a.notifications,
10
+ removeToastNotification = _a.removeToastNotification;
11
+ var containers = document.querySelectorAll('[data-testid="toast-notifications-list"');
12
+ if (containers) {
13
+ // Remove any duplicate instances
14
+ // (eg. Storybook docs page has multiple stories each with their own context)
15
+ containers.forEach(function (c, i) {
16
+ if (i === 0) return;
17
+ c.remove();
18
+ });
19
+ }
20
+ return /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement("div", {
21
+ "data-testid": "toast-notifications-list",
22
+ role: "status",
23
+ className: styles.toastNotificationsList
24
+ }, /*#__PURE__*/React.createElement(ToastNotificationsMap, {
25
+ notifications: notifications,
26
+ onHide: removeToastNotification,
27
+ container: containers[0]
28
+ })), document.body);
29
+ };
30
+ ToastNotificationsList.displayName = "ToastNotificationsList";
31
+ return ToastNotificationsList;
32
+ }();
33
+ export { ToastNotificationsList };
34
+ //# sourceMappingURL=ToastNotificationsList.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ToastNotificationsList.mjs","sources":["../../../../../src/Notification/ToastNotification/ToastNotificationsList/ToastNotificationsList.tsx"],"sourcesContent":["import React from \"react\"\nimport { createPortal } from \"react-dom\"\nimport { useToastNotificationContext } from \"../context/ToastNotificationContext\"\nimport { ToastNotificationsMap } from \"./subcomponents/ToastNotificationsMap\"\nimport styles from \"./ToastNotificationsList.module.scss\"\n\nexport const ToastNotificationsList = (): JSX.Element => {\n const { notifications, removeToastNotification } =\n useToastNotificationContext()\n\n const containers = document.querySelectorAll(\n '[data-testid=\"toast-notifications-list\"'\n )\n\n if (containers) {\n // Remove any duplicate instances\n // (eg. Storybook docs page has multiple stories each with their own context)\n containers.forEach((c, i) => {\n if (i === 0) return\n c.remove()\n })\n }\n\n return createPortal(\n <div\n data-testid=\"toast-notifications-list\"\n role=\"status\"\n className={styles.toastNotificationsList}\n >\n <ToastNotificationsMap\n notifications={notifications}\n onHide={removeToastNotification}\n container={containers[0]}\n />\n </div>,\n document.body\n )\n}\n\nToastNotificationsList.displayName = \"ToastNotificationsList\"\n"],"names":["ToastNotificationsList","_a","useToastNotificationContext","notifications","removeToastNotification","containers","document","querySelectorAll","forEach","c","i","remove","createPortal","React","createElement","role","className","styles","toastNotificationsList","ToastNotificationsMap","onHide","container","body","displayName"],"mappings":";;;;;MAMaA,sBAAsB;EAAA,MAAtBA,sBAAsB,GAAG,SAAAA,CAAA,EAAA;IAC9B,IAAAC,EAAA,GACJC,2BAA2B,CAAA,CAAE;MADvBC,aAAa,GAAAF,EAAA,CAAAE,aAAA;MAAEC,uBAAuB,GAAAH,EAAA,CAAAG,uBACf;IAE/B,IAAMC,UAAU,GAAGC,QAAQ,CAACC,gBAAgB,CAC1C,yCAAyC,CAC1C;IAED,IAAIF,UAAU,EAAE;;;MAGdA,UAAU,CAACG,OAAO,CAAC,UAACC,CAAC,EAAEC,CAAC,EAAA;QACtB,IAAIA,CAAC,KAAK,CAAC,EAAE;QACbD,CAAC,CAACE,MAAM,CAAA,CAAE;MACZ,CAAC,CAAC;IACH;IAED,oBAAOC,YAAY,eACjBC,KACc,CAAAC,aAAA,CAAA,KAAA,EAAA;MAAA,aAAA,EAAA,0BAA0B;MACtCC,IAAI,EAAC,QAAQ;MACbC,SAAS,EAAEC,MAAM,CAACC;IAAsB,CAAA,eAExCL,KAAC,CAAAC,aAAA,CAAAK,qBAAqB;MACpBhB,aAAa,EAAEA,aAAa;MAC5BiB,MAAM,EAAEhB,uBAAuB;MAC/BiB,SAAS,EAAEhB,UAAU,CAAC,CAAC;IAAC,CACxB,CAAA,CACE,EACNC,QAAQ,CAACgB,IAAI,CACd;EACH,CAAC;EAEDtB,sBAAsB,CAACuB,WAAW,GAAG,wBAAwB;EAAA,OAjChDvB,sBAAsB;AAAA;"}
@@ -0,0 +1,5 @@
1
+ var styles = {
2
+ "toastNotificationsList": "ToastNotificationsList-module_toastNotificationsList__APiSP"
3
+ };
4
+ export { styles as default };
5
+ //# sourceMappingURL=ToastNotificationsList.module.scss.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ToastNotificationsList.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}
@@ -0,0 +1,40 @@
1
+ import { __rest, __assign } from 'tslib';
2
+ import React from 'react';
3
+ import { createPortal } from 'react-dom';
4
+ import { GenericNotification } from '../../../../subcomponents/GenericNotification/GenericNotification.mjs';
5
+ const ToastNotificationsMap = /*#__PURE__*/function () {
6
+ const ToastNotificationsMap = function (_a) {
7
+ var notifications = _a.notifications,
8
+ defaultOnHide = _a.onHide,
9
+ container = _a.container;
10
+ if (!container) return null;
11
+ // To consolidate all notifications into a single list when there are multiple contexts,
12
+ // this list cannot render with a container (must be portalled into one).
13
+ return /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement(React.Fragment, null, notifications.map(function (_a) {
14
+ var id = _a.id,
15
+ type = _a.type,
16
+ title = _a.title,
17
+ persistent = _a.persistent,
18
+ onHide = _a.onHide,
19
+ message = _a.message,
20
+ restProps = __rest(_a, ["id", "type", "title", "persistent", "onHide", "message"]);
21
+ return /*#__PURE__*/React.createElement(GenericNotification, __assign({
22
+ key: id,
23
+ style: "toast",
24
+ type: type,
25
+ title: title,
26
+ persistent: persistent,
27
+ onHide: function () {
28
+ if (typeof onHide !== "undefined") {
29
+ onHide();
30
+ }
31
+ defaultOnHide(id);
32
+ }
33
+ }, restProps), message);
34
+ })), container);
35
+ };
36
+ ToastNotificationsMap.displayName = "ToastNotificationsMap";
37
+ return ToastNotificationsMap;
38
+ }();
39
+ export { ToastNotificationsMap };
40
+ //# sourceMappingURL=ToastNotificationsMap.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ToastNotificationsMap.mjs","sources":["../../../../../../../src/Notification/ToastNotification/ToastNotificationsList/subcomponents/ToastNotificationsMap/ToastNotificationsMap.tsx"],"sourcesContent":["import React, { HTMLAttributes } from \"react\"\nimport { createPortal } from \"react-dom\"\nimport { GenericNotification } from \"~components/Notification/subcomponents/GenericNotification\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport { ToastNotificationObj } from \"../../../types\"\n\nexport type ToastNotificationsMapProps = {\n notifications: ToastNotificationObj[]\n onHide: (notificationId: string) => void\n container: Element | null\n} & OverrideClassName<HTMLAttributes<HTMLDivElement>>\n\nexport const ToastNotificationsMap = ({\n notifications,\n onHide: defaultOnHide,\n container,\n}: ToastNotificationsMapProps): JSX.Element | null => {\n if (!container) return null\n\n // To consolidate all notifications into a single list when there are multiple contexts,\n // this list cannot render with a container (must be portalled into one).\n return createPortal(\n <>\n {notifications.map(\n ({ id, type, title, persistent, onHide, message, ...restProps }) => (\n <GenericNotification\n key={id}\n style=\"toast\"\n type={type}\n title={title}\n persistent={persistent}\n onHide={(): void => {\n if (typeof onHide !== \"undefined\") {\n onHide()\n }\n defaultOnHide(id)\n }}\n {...restProps}\n >\n {message}\n </GenericNotification>\n )\n )}\n </>,\n container\n )\n}\n\nToastNotificationsMap.displayName = \"ToastNotificationsMap\"\n"],"names":["ToastNotificationsMap","_a","notifications","defaultOnHide","onHide","container","createPortal","React","createElement","Fragment","map","id","type","title","persistent","message","restProps","__rest","GenericNotification","__assign","key","style","displayName"],"mappings":";;;;MAYaA,qBAAqB;EAAA,MAArBA,qBAAqB,GAAG,SAAAA,CAACC,EAIT,EAAA;IAH3B,IAAAC,aAAa,mBAAA;MACLC,aAAa,GAAAF,EAAA,CAAAG,MAAA;MACrBC,SAAS,GAAAJ,EAAA,CAAAI,SAAA;IAET,IAAI,CAACA,SAAS,EAAE,OAAO,IAAI;;;IAI3B,oBAAOC,YAAY,eACjBC,KACG,CAAAC,aAAA,CAAAD,KAAA,CAAAE,QAAA,EAAA,IAAA,EAAAP,aAAa,CAACQ,GAAG,CAChB,UAACT,EAA8D,EAAA;MAA5D,IAAAU,EAAE,QAAA;QAAEC,IAAI,UAAA;QAAEC,KAAK,WAAA;QAAEC,UAAU,gBAAA;QAAEV,MAAM,YAAA;QAAEW,OAAO,aAAA;QAAKC,SAAS,GAA5DC,MAAA,CAAAhB,EAAA,EAAA,CAAA,IAAA,EAAA,MAAA,EAAA,OAAA,EAAA,YAAA,EAAA,QAAA,EAAA,SAAA,CAA8D,CAAF;MAAO,oBAClEM,KAAC,CAAAC,aAAA,CAAAU,mBAAmB,EAClBC,QAAA,CAAA;QAAAC,GAAG,EAAET,EAAE;QACPU,KAAK,EAAC,OAAO;QACbT,IAAI,EAAEA,IAAI;QACVC,KAAK,EAAEA,KAAK;QACZC,UAAU,EAAEA,UAAU;QACtBV,MAAM,EAAE,SAAAA,CAAA,EAAA;UACN,IAAI,OAAOA,MAAM,KAAK,WAAW,EAAE;YACjCA,MAAM,EAAE;UACT;UACDD,aAAa,CAACQ,EAAE,CAAC;QACnB;SACIK,SAAS,CAAA,EAEZD,OAAO,CACY;IACvB,CAAA,CACF,CACA,EACHV,SAAS,CACV;EACH,CAAC;EAEDL,qBAAqB,CAACsB,WAAW,GAAG,uBAAuB;EAAA,OApC9CtB,qBAAqB;AAAA;"}
@@ -0,0 +1,69 @@
1
+ import { __assign, __spreadArray } from 'tslib';
2
+ import React, { useContext, useState } from 'react';
3
+ import { v4 } from 'uuid';
4
+ var ToastNotificationContext = /*#__PURE__*/React.createContext(null);
5
+ var useToastNotificationContext = function () {
6
+ var context = useContext(ToastNotificationContext);
7
+ if (!context) {
8
+ throw new Error("useToastNotificationContext must be used within the ToastNotificationContext.Provider");
9
+ }
10
+ return context;
11
+ };
12
+ const ToastNotificationProvider = /*#__PURE__*/function () {
13
+ const ToastNotificationProvider = function (_a) {
14
+ var children = _a.children;
15
+ var _b = useState([]),
16
+ notifications = _b[0],
17
+ setNotifications = _b[1];
18
+ var addToastNotification = function (notification) {
19
+ var uuid = v4();
20
+ var notificationWithId = __assign({
21
+ id: uuid
22
+ }, notification);
23
+ var notificationExists = notifications.find(function (_a) {
24
+ var id = _a.id;
25
+ return id === notification.id;
26
+ });
27
+ if (!notificationExists) {
28
+ setNotifications(function (existing) {
29
+ return __spreadArray(__spreadArray([], existing, true), [notificationWithId], false);
30
+ });
31
+ }
32
+ };
33
+ var updateToastNotification = function (notification) {
34
+ var notificationIndex = notifications.findIndex(function (_a) {
35
+ var id = _a.id;
36
+ return id === notification.id;
37
+ });
38
+ var copy = notifications.slice();
39
+ copy.splice(notificationIndex, 1, notification); // Mutation to insert notification over itself
40
+ setNotifications(copy);
41
+ };
42
+ var removeToastNotification = function (notificationID) {
43
+ var notificationIndex = notifications.findIndex(function (_a) {
44
+ var id = _a.id;
45
+ return id === notificationID;
46
+ });
47
+ var copy = notifications.slice();
48
+ copy.splice(notificationIndex, 1); // Mutation
49
+ setNotifications(copy);
50
+ };
51
+ var clearToastNotifications = function () {
52
+ setNotifications([]);
53
+ };
54
+ var value = {
55
+ notifications: notifications,
56
+ addToastNotification: addToastNotification,
57
+ updateToastNotification: updateToastNotification,
58
+ removeToastNotification: removeToastNotification,
59
+ clearToastNotifications: clearToastNotifications
60
+ };
61
+ return /*#__PURE__*/React.createElement(ToastNotificationContext.Provider, {
62
+ value: value
63
+ }, children);
64
+ };
65
+ ToastNotificationProvider.displayName = "ToastNotificationProvider";
66
+ return ToastNotificationProvider;
67
+ }();
68
+ export { ToastNotificationProvider, useToastNotificationContext };
69
+ //# sourceMappingURL=ToastNotificationContext.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ToastNotificationContext.mjs","sources":["../../../../../src/Notification/ToastNotification/context/ToastNotificationContext.tsx"],"sourcesContent":["import React, { useContext, useState } from \"react\"\nimport { v4 as uuidv4 } from \"uuid\"\nimport { ToastNotificationObj } from \"../types\"\n\ntype ToastNotificationObjOptionalId = Omit<ToastNotificationObj, \"id\"> & {\n id?: string\n}\n\nexport type ToastNotificationContextValue = {\n notifications: ToastNotificationObj[]\n addToastNotification: (notification: ToastNotificationObjOptionalId) => void\n updateToastNotification: (notification: ToastNotificationObj) => void\n removeToastNotification: (notificationId: string) => void\n clearToastNotifications: () => void\n}\n\nconst ToastNotificationContext =\n React.createContext<ToastNotificationContextValue | null>(null)\n\nexport const useToastNotificationContext =\n (): ToastNotificationContextValue => {\n const context = useContext(ToastNotificationContext)\n\n if (!context) {\n throw new Error(\n \"useToastNotificationContext must be used within the ToastNotificationContext.Provider\"\n )\n }\n\n return context\n }\n\ntype ToastNotificationProviderProps = {\n children: React.ReactNode\n}\n\nexport const ToastNotificationProvider = ({\n children,\n}: ToastNotificationProviderProps): JSX.Element | null => {\n const [notifications, setNotifications] = useState<ToastNotificationObj[]>([])\n\n const addToastNotification: ToastNotificationContextValue[\"addToastNotification\"] =\n notification => {\n const uuid = uuidv4()\n const notificationWithId = { id: uuid, ...notification }\n\n const notificationExists = notifications.find(\n ({ id }) => id === notification.id\n )\n\n if (!notificationExists) {\n setNotifications(existing => [...existing, notificationWithId])\n }\n }\n\n const updateToastNotification = (\n notification: ToastNotificationObj\n ): void => {\n const notificationIndex = notifications.findIndex(\n ({ id }) => id === notification.id\n )\n\n const copy = notifications.slice()\n copy.splice(notificationIndex, 1, notification) // Mutation to insert notification over itself\n setNotifications(copy)\n }\n\n const removeToastNotification = (notificationID: string): void => {\n const notificationIndex = notifications.findIndex(\n ({ id }) => id === notificationID\n )\n const copy = notifications.slice()\n copy.splice(notificationIndex, 1) // Mutation\n setNotifications(copy)\n }\n\n const clearToastNotifications = (): void => {\n setNotifications([])\n }\n\n const value = {\n notifications,\n addToastNotification,\n updateToastNotification,\n removeToastNotification,\n clearToastNotifications,\n } satisfies ToastNotificationContextValue\n\n return (\n <ToastNotificationContext.Provider value={value}>\n {children}\n </ToastNotificationContext.Provider>\n )\n}\n\nToastNotificationProvider.displayName = \"ToastNotificationProvider\"\n"],"names":["ToastNotificationContext","React","createContext","useToastNotificationContext","context","useContext","Error","ToastNotificationProvider","_a","children","_b","useState","notifications","setNotifications","addToastNotification","notification","uuid","uuidv4","notificationWithId","id","notificationExists","find","existing","__spreadArray","updateToastNotification","notificationIndex","findIndex","copy","slice","splice","removeToastNotification","notificationID","clearToastNotifications","value","createElement","Provider","displayName"],"mappings":"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"}
@@ -0,0 +1,7 @@
1
+ import { useToastNotificationContext } from '../context/ToastNotificationContext.mjs';
2
+ var useToastNotification = function () {
3
+ var context = useToastNotificationContext();
4
+ return context;
5
+ };
6
+ export { useToastNotification };
7
+ //# sourceMappingURL=useToastNotification.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useToastNotification.mjs","sources":["../../../../../src/Notification/ToastNotification/hooks/useToastNotification.ts"],"sourcesContent":["import {\n ToastNotificationContextValue,\n useToastNotificationContext,\n} from \"../context/ToastNotificationContext\"\n\nexport const useToastNotification = (): ToastNotificationContextValue => {\n const context = useToastNotificationContext()\n return context\n}\n"],"names":["useToastNotification","context","useToastNotificationContext"],"mappings":";AAKa,IAAAA,oBAAoB,GAAG,SAAAA,CAAA,EAAA;EAClC,IAAMC,OAAO,GAAGC,2BAA2B,EAAE;EAC7C,OAAOD,OAAO;AAChB,CAAA;"}
@@ -5,6 +5,9 @@ import { FieldMessage } from '../../FieldMessage/FieldMessage.mjs';
5
5
  import { Label } from '../../Label/Label.mjs';
6
6
  import { InlineNotification } from '../../Notification/InlineNotification/InlineNotification.mjs';
7
7
  import '../../Notification/GlobalNotification/GlobalNotification.mjs';
8
+ import '../../Notification/ToastNotification/ToastNotification/ToastNotification.mjs';
9
+ import '../../Notification/ToastNotification/ToastNotificationsList/ToastNotificationsList.mjs';
10
+ import '../../Notification/ToastNotification/context/ToastNotificationContext.mjs';
8
11
  import * as ProseMirrorState from 'prosemirror-state';
9
12
  import 'prosemirror-view';
10
13
  import { useRichTextEditor } from '../utils/core/hooks/useRichTextEditor.mjs';
@@ -37,6 +40,7 @@ const RichTextEditor = /*#__PURE__*/function () {
37
40
  defaultValue = _a.defaultValue,
38
41
  labelText = _a.labelText,
39
42
  labelledBy = _a["aria-labelledby"],
43
+ describedBy = _a["aria-describedby"],
40
44
  classNameOverride = _a.classNameOverride,
41
45
  controls = _a.controls,
42
46
  _b = _a.rows,
@@ -47,7 +51,7 @@ const RichTextEditor = /*#__PURE__*/function () {
47
51
  description = _a.description,
48
52
  _c = _a.status,
49
53
  status = _c === void 0 ? "default" : _c,
50
- restProps = __rest(_a, ["onChange", "defaultValue", "labelText", "aria-labelledby", "classNameOverride", "controls", "rows", "dataError", "onDataError", "validationMessage", "description", "status"]);
54
+ restProps = __rest(_a, ["onChange", "defaultValue", "labelText", "aria-labelledby", "aria-describedby", "classNameOverride", "controls", "rows", "dataError", "onDataError", "validationMessage", "description", "status"]);
51
55
  var reactId = useId();
52
56
  var schema = useState(createSchemaFromControls(controls))[0];
53
57
  var labelId = useState(labelledBy || reactId)[0];
@@ -94,7 +98,7 @@ const RichTextEditor = /*#__PURE__*/function () {
94
98
  }, [editorState]);
95
99
  var validationMessageAria = validationMessage ? "".concat(editorId, "-rte-validation-message") : "";
96
100
  var descriptionAria = description ? "".concat(editorId, "-rte-description") : "";
97
- var ariaDescribedBy = "".concat(validationMessageAria, " ").concat(descriptionAria);
101
+ var ariaDescribedBy = classnames(validationMessageAria, descriptionAria, describedBy);
98
102
  return /*#__PURE__*/React.createElement(React.Fragment, null, !labelledBy && labelText && /*#__PURE__*/React.createElement(Label, {
99
103
  id: labelId,
100
104
  labelText: labelText
@@ -1 +1 @@
1
- {"version":3,"file":"RichTextEditor.mjs","sources":["../../../../src/RichTextEditor/RichTextEditor/RichTextEditor.tsx"],"sourcesContent":["import React, {\n useState,\n useEffect,\n HTMLAttributes,\n ReactNode,\n useId,\n} from \"react\"\nimport classnames from \"classnames\"\nimport { FieldMessage } from \"~components/FieldMessage\"\nimport { Label } from \"~components/Label\"\nimport { InlineNotification } from \"~components/Notification\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport { ToolbarItems, EditorContentArray, EditorRows } from \"../types\"\nimport { useRichTextEditor } from \"../utils/core\"\nimport { createLinkManager } from \"../utils/plugins\"\nimport {\n ProseMirrorCommands,\n ProseMirrorHistory,\n ProseMirrorKeymap,\n ProseMirrorModel,\n ProseMirrorState,\n} from \"../utils/prosemirror\"\nimport { createSchemaFromControls } from \"./schema\"\nimport { ToggleIconButton } from \"./subcomponents/ToggleIconButton\"\nimport { Toolbar } from \"./subcomponents/Toolbar\"\nimport { ToolbarSection } from \"./subcomponents/ToolbarSection\"\nimport { buildControlMap } from \"./utils/controlmap\"\nimport { buildInputRules } from \"./utils/inputrules\"\nimport { buildKeymap } from \"./utils/keymap\"\nimport styles from \"./RichTextEditor.module.scss\"\n\ntype BaseRichTextEditorProps = {\n onChange: (content: ProseMirrorState.EditorState) => void\n defaultValue: EditorContentArray\n controls?: ToolbarItems[]\n /**\n * Sets a default min-height for the editable area in units of body paragraph line height, similar to the 'rows' attribute on <textarea>.\n * The editable area will autogrow, so this only affects the component when the content doesn't exceed this height.\n */\n rows?: EditorRows\n dataError?: React.ReactElement\n onDataError?: () => void\n status?: \"default\" | \"error\" | \"caution\"\n /**\n * A descriptive message for `error` or `caution` states\n */\n validationMessage?: React.ReactNode\n /**\n * A description that provides context\n */\n description?: React.ReactNode\n} & OverrideClassName<\n Omit<HTMLAttributes<HTMLDivElement>, \"onChange\" | \"defaultValue\">\n>\n\ntype WithLabelText = {\n labelText: ReactNode\n \"aria-labelledby\"?: never\n}\n\ntype WithLabelledBy = {\n labelText?: never\n \"aria-labelledby\": string\n}\n\nexport type RichTextEditorProps = BaseRichTextEditorProps &\n (WithLabelText | WithLabelledBy)\n/**\n * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081896752/Rich+Text+Editor Guidance} |\n * {@link https://cultureamp.design/?path=/docs/components-richtexteditor--docs Storybook}\n */\nexport const RichTextEditor = ({\n onChange,\n defaultValue,\n labelText,\n \"aria-labelledby\": labelledBy,\n classNameOverride,\n controls,\n rows = 3,\n dataError,\n onDataError,\n validationMessage,\n description,\n status = \"default\",\n ...restProps\n}: RichTextEditorProps): JSX.Element => {\n const reactId = useId()\n const [schema] = useState<ProseMirrorModel.Schema>(\n createSchemaFromControls(controls)\n )\n const [labelId] = useState<string>(labelledBy || reactId)\n const [editorId] = useState<string>(reactId)\n\n const useRichTextEditorResult = (():\n | ReturnType<typeof useRichTextEditor>\n | Error => {\n try {\n return useRichTextEditor(\n ProseMirrorState.EditorState.create({\n doc: ProseMirrorModel.Node.fromJSON(schema, {\n type: \"doc\",\n // we're converting empty arrays to the ProseMirror default \"empty\" state because when\n // given an empty array ProseMirror returns undefined, breaking the type\n content:\n defaultValue?.length > 0 ? defaultValue : [{ type: \"paragraph\" }],\n }),\n schema,\n plugins: getPlugins(controls, schema),\n }),\n { \"aria-labelledby\": labelId, role: \"textbox\" }\n )\n } catch {\n return new Error(\"Bad data error\")\n }\n })()\n\n if (useRichTextEditorResult instanceof Error) {\n onDataError && onDataError()\n return (\n <InlineNotification\n headingProps={{\n children: \"Error\",\n variant: \"heading-6\",\n }}\n type=\"negative\"\n persistent\n >\n {dataError || \"Something went wrong\"}\n </InlineNotification>\n )\n }\n\n const [editorRef, editorState, dispatchTransaction] = useRichTextEditorResult\n\n const controlMap = buildControlMap(schema, editorState, controls)\n\n useEffect(() => {\n onChange(editorState)\n // Including `onContentChange` in the dependencies here will cause a 'Maximum update depth exceeded' issue\n }, [editorState])\n\n const validationMessageAria = validationMessage\n ? `${editorId}-rte-validation-message`\n : \"\"\n const descriptionAria = description ? `${editorId}-rte-description` : \"\"\n\n const ariaDescribedBy = `${validationMessageAria} ${descriptionAria}`\n\n return (\n <>\n {!labelledBy && labelText && <Label id={labelId} labelText={labelText} />}\n {/* TODO: add a bit of margin here once we have a classNameOverride on Label */}\n <div className={classnames(styles.editorWrapper, styles[status])}>\n {controls && (\n <Toolbar\n aria-controls={editorId}\n aria-label=\"Text formatting\"\n classNameOverride={styles.toolbar}\n >\n {controlMap.map((section, index) => (\n <ToolbarSection key={index}>\n {section.map((controlConfig, controlKeyIndex) => (\n <ToggleIconButton\n key={controlKeyIndex}\n icon={controlConfig.icon}\n disabled={controlConfig.disabled}\n label={controlConfig.label}\n isActive={controlConfig.isActive}\n onClick={(): void =>\n dispatchTransaction(controlConfig.action)\n }\n />\n ))}\n </ToolbarSection>\n ))}\n </Toolbar>\n )}\n <div\n id={editorId}\n ref={editorRef}\n className={classnames(\n styles.editor,\n styles[`rows${rows}`],\n classNameOverride,\n controls != null && controls.length > 0 && styles.hasToolbar\n )}\n aria-describedby={ariaDescribedBy}\n {...restProps}\n />\n </div>\n\n {validationMessage && (\n <FieldMessage\n id={validationMessageAria}\n message={validationMessage}\n status={status}\n />\n )}\n\n {description && (\n <FieldMessage id={descriptionAria} message={description} />\n )}\n </>\n )\n}\n\nRichTextEditor.displayName = \"RichTextEditor\"\n\nfunction getPlugins(\n controls: ToolbarItems[] | undefined,\n schema: ProseMirrorModel.Schema\n): Array<\n | ProseMirrorState.Plugin<unknown>\n | ProseMirrorState.Plugin<{\n transform: ProseMirrorState.Transaction\n from: number\n to: number\n text: string\n } | null>\n> {\n const allControlNames: string[] = controls\n ? controls.reduce((acc: string[], c: ToolbarItems) => [...acc, c.name], [])\n : []\n const plugins = [\n ProseMirrorHistory.history(),\n ProseMirrorKeymap.keymap(buildKeymap(schema)),\n ProseMirrorKeymap.keymap(ProseMirrorCommands.baseKeymap),\n buildInputRules(schema),\n ]\n\n if (allControlNames.includes(\"link\")) {\n plugins.push(\n createLinkManager({\n markType: schema.marks.link,\n })\n )\n }\n\n return plugins\n}\n"],"names":["RichTextEditor","_a","onChange","defaultValue","labelText","labelledBy","classNameOverride","controls","_b","rows","dataError","onDataError","validationMessage","description","_c","status","restProps","__rest","reactId","useId","schema","useState","createSchemaFromControls","labelId","editorId","useRichTextEditorResult","useRichTextEditor","ProseMirrorState","EditorState","create","doc","ProseMirrorModel","Node","fromJSON","type","content","length","plugins","getPlugins","role","Error","React","createElement","InlineNotification","headingProps","children","variant","persistent","editorRef","editorState","dispatchTransaction","controlMap","buildControlMap","useEffect","validationMessageAria","concat","descriptionAria","ariaDescribedBy","Fragment","Label","id","className","classnames","styles","editorWrapper","Toolbar","toolbar","map","section","index","ToolbarSection","key","controlConfig","controlKeyIndex","ToggleIconButton","icon","disabled","label","isActive","onClick","action","__assign","ref","editor","hasToolbar","FieldMessage","message","displayName","allControlNames","reduce","acc","c","name","ProseMirrorHistory","history","ProseMirrorKeymap","keymap","buildKeymap","ProseMirrorCommands","baseKeymap","buildInputRules","includes","push","createLinkManager","markType","marks","link"],"mappings":"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"}
1
+ {"version":3,"file":"RichTextEditor.mjs","sources":["../../../../src/RichTextEditor/RichTextEditor/RichTextEditor.tsx"],"sourcesContent":["import React, {\n useState,\n useEffect,\n HTMLAttributes,\n ReactNode,\n useId,\n} from \"react\"\nimport classnames from \"classnames\"\nimport { FieldMessage } from \"~components/FieldMessage\"\nimport { Label } from \"~components/Label\"\nimport { InlineNotification } from \"~components/Notification\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport { ToolbarItems, EditorContentArray, EditorRows } from \"../types\"\nimport { useRichTextEditor } from \"../utils/core\"\nimport { createLinkManager } from \"../utils/plugins\"\nimport {\n ProseMirrorCommands,\n ProseMirrorHistory,\n ProseMirrorKeymap,\n ProseMirrorModel,\n ProseMirrorState,\n} from \"../utils/prosemirror\"\nimport { createSchemaFromControls } from \"./schema\"\nimport { ToggleIconButton } from \"./subcomponents/ToggleIconButton\"\nimport { Toolbar } from \"./subcomponents/Toolbar\"\nimport { ToolbarSection } from \"./subcomponents/ToolbarSection\"\nimport { buildControlMap } from \"./utils/controlmap\"\nimport { buildInputRules } from \"./utils/inputrules\"\nimport { buildKeymap } from \"./utils/keymap\"\nimport styles from \"./RichTextEditor.module.scss\"\n\ntype BaseRichTextEditorProps = {\n onChange: (content: ProseMirrorState.EditorState) => void\n defaultValue: EditorContentArray\n controls?: ToolbarItems[]\n /**\n * Sets a default min-height for the editable area in units of body paragraph line height, similar to the 'rows' attribute on <textarea>.\n * The editable area will autogrow, so this only affects the component when the content doesn't exceed this height.\n */\n rows?: EditorRows\n dataError?: React.ReactElement\n onDataError?: () => void\n status?: \"default\" | \"error\" | \"caution\"\n /**\n * A descriptive message for `error` or `caution` states\n */\n validationMessage?: React.ReactNode\n /**\n * A description that provides context\n */\n description?: React.ReactNode\n} & OverrideClassName<\n Omit<HTMLAttributes<HTMLDivElement>, \"onChange\" | \"defaultValue\">\n>\n\ntype WithLabelText = {\n labelText: ReactNode\n \"aria-labelledby\"?: never\n}\n\ntype WithLabelledBy = {\n labelText?: never\n \"aria-labelledby\": string\n}\n\nexport type RichTextEditorProps = BaseRichTextEditorProps &\n (WithLabelText | WithLabelledBy)\n/**\n * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081896752/Rich+Text+Editor Guidance} |\n * {@link https://cultureamp.design/?path=/docs/components-richtexteditor--docs Storybook}\n */\nexport const RichTextEditor = ({\n onChange,\n defaultValue,\n labelText,\n \"aria-labelledby\": labelledBy,\n \"aria-describedby\": describedBy,\n classNameOverride,\n controls,\n rows = 3,\n dataError,\n onDataError,\n validationMessage,\n description,\n status = \"default\",\n ...restProps\n}: RichTextEditorProps): JSX.Element => {\n const reactId = useId()\n const [schema] = useState<ProseMirrorModel.Schema>(\n createSchemaFromControls(controls)\n )\n const [labelId] = useState<string>(labelledBy || reactId)\n const [editorId] = useState<string>(reactId)\n\n const useRichTextEditorResult = (():\n | ReturnType<typeof useRichTextEditor>\n | Error => {\n try {\n return useRichTextEditor(\n ProseMirrorState.EditorState.create({\n doc: ProseMirrorModel.Node.fromJSON(schema, {\n type: \"doc\",\n // we're converting empty arrays to the ProseMirror default \"empty\" state because when\n // given an empty array ProseMirror returns undefined, breaking the type\n content:\n defaultValue?.length > 0 ? defaultValue : [{ type: \"paragraph\" }],\n }),\n schema,\n plugins: getPlugins(controls, schema),\n }),\n { \"aria-labelledby\": labelId, role: \"textbox\" }\n )\n } catch {\n return new Error(\"Bad data error\")\n }\n })()\n\n if (useRichTextEditorResult instanceof Error) {\n onDataError && onDataError()\n return (\n <InlineNotification\n headingProps={{\n children: \"Error\",\n variant: \"heading-6\",\n }}\n type=\"negative\"\n persistent\n >\n {dataError || \"Something went wrong\"}\n </InlineNotification>\n )\n }\n\n const [editorRef, editorState, dispatchTransaction] = useRichTextEditorResult\n\n const controlMap = buildControlMap(schema, editorState, controls)\n\n useEffect(() => {\n onChange(editorState)\n // Including `onContentChange` in the dependencies here will cause a 'Maximum update depth exceeded' issue\n }, [editorState])\n\n const validationMessageAria = validationMessage\n ? `${editorId}-rte-validation-message`\n : \"\"\n const descriptionAria = description ? `${editorId}-rte-description` : \"\"\n\n const ariaDescribedBy = classnames(\n validationMessageAria,\n descriptionAria,\n describedBy\n )\n\n return (\n <>\n {!labelledBy && labelText && <Label id={labelId} labelText={labelText} />}\n {/* TODO: add a bit of margin here once we have a classNameOverride on Label */}\n <div className={classnames(styles.editorWrapper, styles[status])}>\n {controls && (\n <Toolbar\n aria-controls={editorId}\n aria-label=\"Text formatting\"\n classNameOverride={styles.toolbar}\n >\n {controlMap.map((section, index) => (\n <ToolbarSection key={index}>\n {section.map((controlConfig, controlKeyIndex) => (\n <ToggleIconButton\n key={controlKeyIndex}\n icon={controlConfig.icon}\n disabled={controlConfig.disabled}\n label={controlConfig.label}\n isActive={controlConfig.isActive}\n onClick={(): void =>\n dispatchTransaction(controlConfig.action)\n }\n />\n ))}\n </ToolbarSection>\n ))}\n </Toolbar>\n )}\n <div\n id={editorId}\n ref={editorRef}\n className={classnames(\n styles.editor,\n styles[`rows${rows}`],\n classNameOverride,\n controls != null && controls.length > 0 && styles.hasToolbar\n )}\n aria-describedby={ariaDescribedBy}\n {...restProps}\n />\n </div>\n\n {validationMessage && (\n <FieldMessage\n id={validationMessageAria}\n message={validationMessage}\n status={status}\n />\n )}\n\n {description && (\n <FieldMessage id={descriptionAria} message={description} />\n )}\n </>\n )\n}\n\nRichTextEditor.displayName = \"RichTextEditor\"\n\nfunction getPlugins(\n controls: ToolbarItems[] | undefined,\n schema: ProseMirrorModel.Schema\n): Array<\n | ProseMirrorState.Plugin<unknown>\n | ProseMirrorState.Plugin<{\n transform: ProseMirrorState.Transaction\n from: number\n to: number\n text: string\n } | null>\n> {\n const allControlNames: string[] = controls\n ? controls.reduce((acc: string[], c: ToolbarItems) => [...acc, c.name], [])\n : []\n const plugins = [\n ProseMirrorHistory.history(),\n ProseMirrorKeymap.keymap(buildKeymap(schema)),\n ProseMirrorKeymap.keymap(ProseMirrorCommands.baseKeymap),\n buildInputRules(schema),\n ]\n\n if (allControlNames.includes(\"link\")) {\n plugins.push(\n createLinkManager({\n markType: schema.marks.link,\n })\n )\n }\n\n return plugins\n}\n"],"names":["RichTextEditor","_a","onChange","defaultValue","labelText","labelledBy","describedBy","classNameOverride","controls","_b","rows","dataError","onDataError","validationMessage","description","_c","status","restProps","__rest","reactId","useId","schema","useState","createSchemaFromControls","labelId","editorId","useRichTextEditorResult","useRichTextEditor","ProseMirrorState","EditorState","create","doc","ProseMirrorModel","Node","fromJSON","type","content","length","plugins","getPlugins","role","Error","React","createElement","InlineNotification","headingProps","children","variant","persistent","editorRef","editorState","dispatchTransaction","controlMap","buildControlMap","useEffect","validationMessageAria","concat","descriptionAria","ariaDescribedBy","classnames","Fragment","Label","id","className","styles","editorWrapper","Toolbar","toolbar","map","section","index","ToolbarSection","key","controlConfig","controlKeyIndex","ToggleIconButton","icon","disabled","label","isActive","onClick","action","__assign","ref","editor","hasToolbar","FieldMessage","message","displayName","allControlNames","reduce","acc","c","name","ProseMirrorHistory","history","ProseMirrorKeymap","keymap","buildKeymap","ProseMirrorCommands","baseKeymap","buildInputRules","includes","push","createLinkManager","markType","marks","link"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmEA;;;AAGG;AAHH,MAIaA,cAAc;EAAA,MAAdA,cAAc,GAAG,SAAAA,CAACC,EAeT,EAAA;IAdpB,IAAAC,QAAQ,cAAA;MACRC,YAAY,kBAAA;MACZC,SAAS,GAAAH,EAAA,CAAAG,SAAA;MACUC,UAAU,GAAAJ,EAAA,CAAA,iBAAA,CAAA;MACTK,WAAW,GAAAL,EAAA,CAAA,kBAAA,CAAA;MAC/BM,iBAAiB,GAAAN,EAAA,CAAAM,iBAAA;MACjBC,QAAQ,GAAAP,EAAA,CAAAO,QAAA;MACRC,EAAQ,GAAAR,EAAA,CAAAS,IAAA;MAARA,IAAI,GAAAD,EAAA,KAAA,KAAA,CAAA,GAAG,CAAC,GAAAA,EAAA;MACRE,SAAS,GAAAV,EAAA,CAAAU,SAAA;MACTC,WAAW,GAAAX,EAAA,CAAAW,WAAA;MACXC,iBAAiB,GAAAZ,EAAA,CAAAY,iBAAA;MACjBC,WAAW,iBAAA;MACXC,EAAA,GAAAd,EAAA,CAAAe,MAAkB;MAAlBA,MAAM,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,SAAS,KAAA;MACfE,SAAS,GAdiBC,MAAA,CAAAjB,EAAA,EAAA,CAAA,UAAA,EAAA,cAAA,EAAA,WAAA,EAAA,iBAAA,EAAA,kBAAA,EAAA,mBAAA,EAAA,UAAA,EAAA,MAAA,EAAA,WAAA,EAAA,aAAA,EAAA,mBAAA,EAAA,aAAA,EAAA,QAAA,CAe9B,CADa;IAEZ,IAAMkB,OAAO,GAAGC,KAAK,EAAE;IAChB,IAAAC,MAAM,GAAIC,QAAQ,CACvBC,wBAAwB,CAACf,QAAQ,CAAC,CACnC,CAAA,CAAA,CAFY;IAGN,IAAAgB,OAAO,GAAIF,QAAQ,CAASjB,UAAU,IAAIc,OAAO,CAAC,CAAA,CAAA,CAA3C;IACP,IAAAM,QAAQ,GAAIH,QAAQ,CAASH,OAAO,CAAC,GAA7B;IAEf,IAAMO,uBAAuB,GAAI,YAAA;MAG/B,IAAI;QACF,OAAOC,iBAAiB,CACtBC,gBAAgB,CAACC,WAAW,CAACC,MAAM,CAAC;UAClCC,GAAG,EAAEC,gBAAgB,CAACC,IAAI,CAACC,QAAQ,CAACb,MAAM,EAAE;YAC1Cc,IAAI,EAAE,KAAK;;;YAGXC,OAAO,EACL,CAAAjC,YAAY,KAAZ,IAAA,IAAAA,YAAY,uBAAZA,YAAY,CAAEkC,MAAM,IAAG,CAAC,GAAGlC,YAAY,GAAG,CAAC;cAAEgC,IAAI,EAAE;aAAa;WACnE,CAAC;UACFd,MAAM,EAAAA,MAAA;UACNiB,OAAO,EAAEC,UAAU,CAAC/B,QAAQ,EAAEa,MAAM;SACrC,CAAC,EACF;UAAE,iBAAiB,EAAEG,OAAO;UAAEgB,IAAI,EAAE;QAAW,CAAA,CAChD;MACF,CAAA,CAAC,OAAMvC,EAAA,EAAA;QACN,OAAO,IAAIwC,KAAK,CAAC,gBAAgB,CAAC;MACnC;KACF,EAAG;IAEJ,IAAIf,uBAAuB,YAAYe,KAAK,EAAE;MAC5C7B,WAAW,IAAIA,WAAW,CAAA,CAAE;MAC5B,oBACE8B,KAAA,CAAAC,aAAA,CAACC,kBAAkB,EAAA;QACjBC,YAAY,EAAE;UACZC,QAAQ,EAAE,OAAO;UACjBC,OAAO,EAAE;SACV;QACDZ,IAAI,EAAC,UAAU;QACfa,UAAU,EAET;MAAA,CAAA,EAAArC,SAAS,IAAI,sBAAsB,CACjB;IAExB;IAEM,IAAAsC,SAAS,GAAsCvB,uBAAuB,CAAA,CAAA,CAA7D;MAAEwB,WAAW,GAAyBxB,uBAAuB,CAAA,CAAA,CAAhD;MAAEyB,mBAAmB,GAAIzB,uBAAuB,GAA3B;IAElD,IAAM0B,UAAU,GAAGC,eAAe,CAAChC,MAAM,EAAE6B,WAAW,EAAE1C,QAAQ,CAAC;IAEjE8C,SAAS,CAAC,YAAA;MACRpD,QAAQ,CAACgD,WAAW,CAAC;;IAEvB,CAAC,EAAE,CAACA,WAAW,CAAC,CAAC;IAEjB,IAAMK,qBAAqB,GAAG1C,iBAAiB,GAC3C,EAAG,CAAA2C,MAAA,CAAA/B,QAAQ,EAAyB,yBAAA,CAAA,GACpC,EAAE;IACN,IAAMgC,eAAe,GAAG3C,WAAW,GAAG,EAAG,CAAA0C,MAAA,CAAA/B,QAAQ,EAAkB,kBAAA,CAAA,GAAG,EAAE;IAExE,IAAMiC,eAAe,GAAGC,UAAU,CAChCJ,qBAAqB,EACrBE,eAAe,EACfnD,WAAW,CACZ;IAED,oBACEoC,KAAA,CAAAC,aAAA,CAAAD,KAAA,CAAAkB,QAAA,EAAA,IAAA,EACG,CAACvD,UAAU,IAAID,SAAS,iBAAIsC,oBAACmB,KAAK,EAAA;MAACC,EAAE,EAAEtC,OAAO;MAAEpB,SAAS,EAAEA;KAAa,CAAA,eAEzEsC,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;MAAKoB,SAAS,EAAEJ,UAAU,CAACK,MAAM,CAACC,aAAa,EAAED,MAAM,CAAChD,MAAM,CAAC;IAAC,CAAA,EAC7DR,QAAQ,iBACPkC,KAAA,CAAAC,aAAA,CAACuB,OAAO,EAAA;MAAA,eAAA,EACSzC,QAAQ;MACZ,YAAA,EAAA,iBAAiB;MAC5BlB,iBAAiB,EAAEyD,MAAM,CAACG;KAAO,EAEhCf,UAAU,CAACgB,GAAG,CAAC,UAACC,OAAO,EAAEC,KAAK,EAAK;MAAA,oBAClC5B,KAAC,CAAAC,aAAA,CAAA4B,cAAc,EAAC;QAAAC,GAAG,EAAEF;MAAK,CAAA,EACvBD,OAAO,CAACD,GAAG,CAAC,UAACK,aAAa,EAAEC,eAAe,EAAK;QAAA,oBAC/ChC,KAAA,CAAAC,aAAA,CAACgC,gBAAgB,EACf;UAAAH,GAAG,EAAEE,eAAe;UACpBE,IAAI,EAAEH,aAAa,CAACG,IAAI;UACxBC,QAAQ,EAAEJ,aAAa,CAACI,QAAQ;UAChCC,KAAK,EAAEL,aAAa,CAACK,KAAK;UAC1BC,QAAQ,EAAEN,aAAa,CAACM,QAAQ;UAChCC,OAAO,EAAE,SAAAA,CAAA,EAAA;YACP,OAAA7B,mBAAmB,CAACsB,aAAa,CAACQ,MAAM,CAAC;UAAA;QAAA,CAAA,CAE3C;MACH,CAAA,CAAC,CACa;IAdiB,CAenC,CAAC,CAEL,eACDvC,KACE,CAAAC,aAAA,CAAA,KAAA,EAAAuC,QAAA,CAAA;MAAApB,EAAE,EAAErC,QAAQ;MACZ0D,GAAG,EAAElC,SAAS;MACdc,SAAS,EAAEJ,UAAU,CACnBK,MAAM,CAACoB,MAAM,EACbpB,MAAM,CAAC,MAAA,CAAAR,MAAA,CAAO9C,IAAI,CAAE,CAAC,EACrBH,iBAAiB,EACjBC,QAAQ,IAAI,IAAI,IAAIA,QAAQ,CAAC6B,MAAM,GAAG,CAAC,IAAI2B,MAAM,CAACqB,UAAU,CAC7D;MAAA,kBAAA,EACiB3B;IAAe,CAC7B,EAAAzC,SAAS,EACb,CACE,EAELJ,iBAAiB,iBAChB6B,KAAA,CAAAC,aAAA,CAAC2C,YAAY,EAAA;MACXxB,EAAE,EAAEP,qBAAqB;MACzBgC,OAAO,EAAE1E,iBAAiB;MAC1BG,MAAM,EAAEA;MAEX,EAEAF,WAAW,iBACV4B,KAAA,CAAAC,aAAA,CAAC2C,YAAY,EAAA;MAACxB,EAAE,EAAEL,eAAe;MAAE8B,OAAO,EAAEzE;KAAW,CACxD,CACA;EAEP,CAAC;EAEDd,cAAc,CAACwF,WAAW,GAAG,gBAAgB;EAAA,OA5IhCxF,cAAc;AAAA;AA8I3B,SAASuC,UAAUA,CACjB/B,QAAoC,EACpCa,MAA+B,EAAA;EAU/B,IAAMoE,eAAe,GAAajF,QAAQ,GACtCA,QAAQ,CAACkF,MAAM,CAAC,UAACC,GAAa,EAAEC,CAAe,EAAA;IAAK,uCAAID,GAAG,EAAA,IAAA,CAAA,EAAA,CAAEC,CAAC,CAACC,IAAI;EAAC,CAAA,EAAE,EAAE,CAAC,GACzE,EAAE;EACN,IAAMvD,OAAO,GAAG,CACdwD,kBAAkB,CAACC,OAAO,CAAE,CAAA,EAC5BC,iBAAiB,CAACC,MAAM,CAACC,WAAW,CAAC7E,MAAM,CAAC,CAAC,EAC7C2E,iBAAiB,CAACC,MAAM,CAACE,mBAAmB,CAACC,UAAU,CAAC,EACxDC,eAAe,CAAChF,MAAM,CAAC,CACxB;EAED,IAAIoE,eAAe,CAACa,QAAQ,CAAC,MAAM,CAAC,EAAE;IACpChE,OAAO,CAACiE,IAAI,CACVC,iBAAiB,CAAC;MAChBC,QAAQ,EAAEpF,MAAM,CAACqF,KAAK,CAACC;IACxB,CAAA,CAAC,CACH;EACF;EAED,OAAOrE,OAAO;AAChB;"}
@@ -1,5 +1,5 @@
1
1
  import { __rest, __assign } from 'tslib';
2
- import React, { useId } from 'react';
2
+ import React, { useId, useState, useEffect } from 'react';
3
3
  import { useButton } from '@react-aria/button';
4
4
  import { useSelect, HiddenSelect } from '@react-aria/select';
5
5
  import { useSelectState } from '@react-stately/select';
@@ -43,11 +43,13 @@ const Select = /*#__PURE__*/function () {
43
43
  description = _a.description,
44
44
  placeholder = _a.placeholder,
45
45
  isDisabled = _a.isDisabled,
46
- restProps = __rest(_a, ["label", "items", "id", "trigger", "children", "status", "validationMessage", "isReversed", "isFullWidth", "disabledValues", "classNameOverride", "selectedKey", "description", "placeholder", "isDisabled"]);
46
+ portalContainerId = _a.portalContainerId,
47
+ restProps = __rest(_a, ["label", "items", "id", "trigger", "children", "status", "validationMessage", "isReversed", "isFullWidth", "disabledValues", "classNameOverride", "selectedKey", "description", "placeholder", "isDisabled", "portalContainerId"]);
47
48
  var refs = useFloating().refs;
48
49
  var triggerRef = refs.reference;
49
50
  var id = propsId !== null && propsId !== void 0 ? propsId : useId();
50
51
  var descriptionId = "".concat(id, "--description");
52
+ var popoverId = "".concat(id, "--popover");
51
53
  var disabledKeys = getDisabledKeysFromItems(items);
52
54
  var ariaSelectProps = __assign({
53
55
  label: label,
@@ -89,6 +91,15 @@ const Select = /*#__PURE__*/function () {
89
91
  isReversed: isReversed,
90
92
  ref: refs.setReference
91
93
  });
94
+ var _d = useState(),
95
+ portalContainer = _d[0],
96
+ setPortalContainer = _d[1];
97
+ useEffect(function () {
98
+ if (portalContainerId) {
99
+ var portalElement = document.getElementById(portalContainerId);
100
+ portalElement && setPortalContainer(portalElement);
101
+ }
102
+ }, []);
92
103
  return /*#__PURE__*/React.createElement("div", {
93
104
  className: classnames(!isFullWidth && styles.notFullWidth, classNameOverride)
94
105
  }, /*#__PURE__*/React.createElement(HiddenSelect, {
@@ -99,6 +110,8 @@ const Select = /*#__PURE__*/function () {
99
110
  }), /*#__PURE__*/React.createElement("div", {
100
111
  className: styles.container
101
112
  }, trigger === undefined ? /*#__PURE__*/React.createElement(SelectToggle, __assign({}, selectToggleProps)) : trigger(selectToggleProps, selectToggleProps.ref), state.isOpen && /*#__PURE__*/React.createElement(Popover, {
113
+ id: popoverId,
114
+ portalContainer: portalContainer,
102
115
  refs: refs,
103
116
  focusOnProps: {
104
117
  onEscapeKey: state.close,
@@ -1 +1 @@
1
- {"version":3,"file":"Select.mjs","sources":["../../../../src/__future__/Select/Select.tsx"],"sourcesContent":["import React, { useId } from \"react\"\nimport { UseFloatingReturn } from \"@floating-ui/react-dom\"\nimport { useButton } from \"@react-aria/button\"\nimport { HiddenSelect, useSelect } from \"@react-aria/select\"\nimport {\n useSelectState,\n SelectProps as AriaSelectProps,\n} from \"@react-stately/select\"\nimport { Key } from \"@react-types/shared\"\nimport classnames from \"classnames\"\nimport { FieldMessage } from \"~components/FieldMessage\"\nimport {\n Popover,\n useFloating,\n} from \"~components/MultiSelect/subcomponents/Popover\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport { SelectProvider } from \"./context\"\nimport {\n ListBox,\n ListBoxSection,\n ListItem,\n Option,\n SectionDivider,\n SelectPopoverContents,\n SelectPopoverContentsProps,\n SelectToggle,\n SelectToggleProps,\n} from \"./subcomponents\"\nimport { SelectItem, SelectOption } from \"./types\"\nimport { getDisabledKeysFromItems } from \"./utils/getDisabledKeysFromItems\"\nimport { transformSelectItemToCollectionElement } from \"./utils/transformSelectItemToCollectionElement\"\nimport styles from \"./Select.module.scss\"\n\ntype OmittedAriaSelectProps = \"children\" | \"items\"\n\nexport type SelectProps<Option extends SelectOption = SelectOption> = {\n /**\n * Item objects in the collection.\n */\n items: Array<SelectItem<Option>>\n id?: string\n trigger?: (\n selectToggleProps: SelectToggleProps & {\n ref: UseFloatingReturn<HTMLButtonElement>[\"refs\"][\"setReference\"]\n },\n // @deprecated: This arg is unnecessary now, but provided for legacy usages\n ref: UseFloatingReturn<HTMLButtonElement>[\"refs\"][\"setReference\"]\n ) => JSX.Element\n children?: SelectPopoverContentsProps<Option>[\"children\"]\n /**\n * Updates the styling of the validation FieldMessage.\n */\n status?: \"error\" | \"caution\"\n /**\n * A descriptive message for the 'status' states.\n */\n validationMessage?: React.ReactNode | undefined\n /**\n * Use the `reversed` styles.\n */\n isReversed?: boolean\n /**\n * Use the `fullWidth` styles.\n */\n isFullWidth?: boolean\n /**\n * @deprecated: Either define `disabled` in your `Option` (in `items`), or use `disabledKeys`\n */\n disabledValues?: Key[]\n} & OverrideClassName<Omit<AriaSelectProps<Option>, OmittedAriaSelectProps>>\n\n/**\n * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081896474/Select Guidance} |\n * {@link https://cultureamp.design/?path=/docs/components-select--docs Storybook}\n */\nexport const Select = <Option extends SelectOption = SelectOption>({\n label,\n items,\n id: propsId,\n trigger,\n children,\n status,\n validationMessage,\n isReversed,\n isFullWidth,\n disabledValues,\n classNameOverride,\n selectedKey,\n description,\n placeholder,\n isDisabled,\n ...restProps\n}: SelectProps<Option>): JSX.Element => {\n const { refs } = useFloating<HTMLButtonElement>()\n const triggerRef = refs.reference\n\n const id = propsId ?? useId()\n const descriptionId = `${id}--description`\n\n const disabledKeys = getDisabledKeysFromItems(items)\n\n const ariaSelectProps: AriaSelectProps<SelectItem<Option>> = {\n label,\n items,\n children: transformSelectItemToCollectionElement,\n disabledKeys: disabledValues ?? disabledKeys,\n selectedKey:\n typeof selectedKey === \"number\" ? selectedKey.toString() : selectedKey,\n description,\n placeholder,\n isDisabled,\n ...restProps,\n }\n\n const state = useSelectState(ariaSelectProps)\n\n const {\n labelProps,\n triggerProps: reactAriaTriggerProps,\n valueProps,\n menuProps,\n errorMessageProps,\n descriptionProps,\n } = useSelect(ariaSelectProps, state, triggerRef)\n\n // Hack incoming:\n // react-aria/useSelect wants to prefix the combobox's accessible name with the value of the select.\n // We use role=combobox, meaning screen readers will read the value.\n // So we're modifying the `aria-labelledby` property to remove the value element id.\n // Issue: https://github.com/adobe/react-spectrum/issues/4091\n const reactAriaLabelledBy = reactAriaTriggerProps[\"aria-labelledby\"]\n const triggerProps = {\n ...reactAriaTriggerProps,\n \"aria-labelledby\": reactAriaLabelledBy?.substring(\n reactAriaLabelledBy.indexOf(\" \") + 1\n ),\n }\n\n const { buttonProps } = useButton(triggerProps, triggerRef)\n const selectToggleProps = {\n ...buttonProps,\n label,\n labelProps,\n value: state?.selectedItem?.rendered,\n valueProps,\n isOpen: state.isOpen,\n placeholder,\n status,\n isDisabled: triggerProps.isDisabled,\n isReversed,\n ref: refs.setReference,\n }\n\n return (\n <div\n className={classnames(\n !isFullWidth && styles.notFullWidth,\n classNameOverride\n )}\n >\n <HiddenSelect\n label={label}\n name={id}\n state={state}\n triggerRef={triggerRef}\n />\n\n <div className={styles.container}>\n {trigger === undefined ? (\n <SelectToggle {...selectToggleProps} />\n ) : (\n trigger(selectToggleProps, selectToggleProps.ref)\n )}\n {state.isOpen && (\n <Popover\n refs={refs}\n focusOnProps={{\n onEscapeKey: state.close,\n onClickOutside: state.close,\n noIsolation: true,\n }}\n >\n <SelectProvider<Option> state={state}>\n <SelectPopoverContents menuProps={menuProps}>\n {children}\n </SelectPopoverContents>\n </SelectProvider>\n </Popover>\n )}\n </div>\n\n {validationMessage && (\n <FieldMessage\n {...errorMessageProps}\n message={validationMessage}\n status={status}\n reversed={isReversed}\n />\n )}\n\n {description && (\n <FieldMessage\n {...descriptionProps}\n id={descriptionId}\n message={description}\n reversed={isReversed}\n />\n )}\n </div>\n )\n}\n\nSelect.displayName = \"Select\"\n\nSelect.Section = ListBoxSection\nSelect.SectionDivider = SectionDivider\nSelect.Option = Option\nSelect.ItemDefaultRender = ListItem\n\n// @deprecated Legacy exported aliases\nSelect.TriggerButton = SelectToggle\nSelect.ListBox = ListBox\n"],"names":["Select","_a","label","items","propsId","id","trigger","children","status","validationMessage","isReversed","isFullWidth","disabledValues","classNameOverride","selectedKey","description","placeholder","isDisabled","restProps","__rest","refs","useFloating","triggerRef","reference","useId","descriptionId","concat","disabledKeys","getDisabledKeysFromItems","ariaSelectProps","transformSelectItemToCollectionElement","toString","state","useSelectState","_c","useSelect","labelProps","reactAriaTriggerProps","triggerProps","valueProps","menuProps","errorMessageProps","descriptionProps","reactAriaLabelledBy","__assign","substring","indexOf","buttonProps","useButton","selectToggleProps","value","selectedItem","_b","rendered","isOpen","ref","setReference","React","createElement","className","classnames","styles","notFullWidth","HiddenSelect","name","container","undefined","SelectToggle","Popover","focusOnProps","onEscapeKey","close","onClickOutside","noIsolation","SelectProvider","SelectPopoverContents","FieldMessage","message","reversed","displayName","Section","ListBoxSection","SectionDivider","Option","ItemDefaultRender","ListItem","TriggerButton","ListBox"],"mappings":"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"}
1
+ {"version":3,"file":"Select.mjs","sources":["../../../../src/__future__/Select/Select.tsx"],"sourcesContent":["import React, { useEffect, useId, useState } from \"react\"\nimport { UseFloatingReturn } from \"@floating-ui/react-dom\"\nimport { useButton } from \"@react-aria/button\"\nimport { HiddenSelect, useSelect } from \"@react-aria/select\"\nimport {\n useSelectState,\n SelectProps as AriaSelectProps,\n} from \"@react-stately/select\"\nimport { Key } from \"@react-types/shared\"\nimport classnames from \"classnames\"\nimport { FieldMessage } from \"~components/FieldMessage\"\nimport {\n Popover,\n useFloating,\n} from \"~components/MultiSelect/subcomponents/Popover\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport { SelectProvider } from \"./context\"\nimport {\n ListBox,\n ListBoxSection,\n ListItem,\n Option,\n SectionDivider,\n SelectPopoverContents,\n SelectPopoverContentsProps,\n SelectToggle,\n SelectToggleProps,\n} from \"./subcomponents\"\nimport { SelectItem, SelectOption } from \"./types\"\nimport { getDisabledKeysFromItems } from \"./utils/getDisabledKeysFromItems\"\nimport { transformSelectItemToCollectionElement } from \"./utils/transformSelectItemToCollectionElement\"\nimport styles from \"./Select.module.scss\"\n\ntype OmittedAriaSelectProps = \"children\" | \"items\"\n\nexport type SelectProps<Option extends SelectOption = SelectOption> = {\n /**\n * Item objects in the collection.\n */\n items: Array<SelectItem<Option>>\n id?: string\n trigger?: (\n selectToggleProps: SelectToggleProps & {\n ref: UseFloatingReturn<HTMLButtonElement>[\"refs\"][\"setReference\"]\n },\n // @deprecated: This arg is unnecessary now, but provided for legacy usages\n ref: UseFloatingReturn<HTMLButtonElement>[\"refs\"][\"setReference\"]\n ) => JSX.Element\n children?: SelectPopoverContentsProps<Option>[\"children\"]\n /**\n * Updates the styling of the validation FieldMessage.\n */\n status?: \"error\" | \"caution\"\n /**\n * A descriptive message for the 'status' states.\n */\n validationMessage?: React.ReactNode | undefined\n /**\n * Use the `reversed` styles.\n */\n isReversed?: boolean\n /**\n * Use the `fullWidth` styles.\n */\n isFullWidth?: boolean\n /**\n * @deprecated: Either define `disabled` in your `Option` (in `items`), or use `disabledKeys`\n */\n disabledValues?: Key[]\n /**\n * Creates a portal for the Popover to the matching element id\n */\n portalContainerId?: string\n} & OverrideClassName<Omit<AriaSelectProps<Option>, OmittedAriaSelectProps>>\n\n/**\n * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081896474/Select Guidance} |\n * {@link https://cultureamp.design/?path=/docs/components-select--docs Storybook}\n */\nexport const Select = <Option extends SelectOption = SelectOption>({\n label,\n items,\n id: propsId,\n trigger,\n children,\n status,\n validationMessage,\n isReversed,\n isFullWidth,\n disabledValues,\n classNameOverride,\n selectedKey,\n description,\n placeholder,\n isDisabled,\n portalContainerId,\n ...restProps\n}: SelectProps<Option>): JSX.Element => {\n const { refs } = useFloating<HTMLButtonElement>()\n const triggerRef = refs.reference\n const id = propsId ?? useId()\n const descriptionId = `${id}--description`\n const popoverId = `${id}--popover`\n\n const disabledKeys = getDisabledKeysFromItems(items)\n\n const ariaSelectProps: AriaSelectProps<SelectItem<Option>> = {\n label,\n items,\n children: transformSelectItemToCollectionElement,\n disabledKeys: disabledValues ?? disabledKeys,\n selectedKey:\n typeof selectedKey === \"number\" ? selectedKey.toString() : selectedKey,\n description,\n placeholder,\n isDisabled,\n ...restProps,\n }\n\n const state = useSelectState(ariaSelectProps)\n\n const {\n labelProps,\n triggerProps: reactAriaTriggerProps,\n valueProps,\n menuProps,\n errorMessageProps,\n descriptionProps,\n } = useSelect(ariaSelectProps, state, triggerRef)\n\n // Hack incoming:\n // react-aria/useSelect wants to prefix the combobox's accessible name with the value of the select.\n // We use role=combobox, meaning screen readers will read the value.\n // So we're modifying the `aria-labelledby` property to remove the value element id.\n // Issue: https://github.com/adobe/react-spectrum/issues/4091\n const reactAriaLabelledBy = reactAriaTriggerProps[\"aria-labelledby\"]\n const triggerProps = {\n ...reactAriaTriggerProps,\n \"aria-labelledby\": reactAriaLabelledBy?.substring(\n reactAriaLabelledBy.indexOf(\" \") + 1\n ),\n }\n\n const { buttonProps } = useButton(triggerProps, triggerRef)\n const selectToggleProps = {\n ...buttonProps,\n label,\n labelProps,\n value: state?.selectedItem?.rendered,\n valueProps,\n isOpen: state.isOpen,\n placeholder,\n status,\n isDisabled: triggerProps.isDisabled,\n isReversed,\n ref: refs.setReference,\n }\n\n const [portalContainer, setPortalContainer] = useState<HTMLElement>()\n\n useEffect(() => {\n if (portalContainerId) {\n const portalElement = document.getElementById(portalContainerId)\n portalElement && setPortalContainer(portalElement)\n }\n }, [])\n\n return (\n <div\n className={classnames(\n !isFullWidth && styles.notFullWidth,\n classNameOverride\n )}\n >\n <HiddenSelect\n label={label}\n name={id}\n state={state}\n triggerRef={triggerRef}\n />\n\n <div className={styles.container}>\n {trigger === undefined ? (\n <SelectToggle {...selectToggleProps} />\n ) : (\n trigger(selectToggleProps, selectToggleProps.ref)\n )}\n {state.isOpen && (\n <Popover\n id={popoverId}\n portalContainer={portalContainer}\n refs={refs}\n focusOnProps={{\n onEscapeKey: state.close,\n onClickOutside: state.close,\n noIsolation: true,\n }}\n >\n <SelectProvider<Option> state={state}>\n <SelectPopoverContents menuProps={menuProps}>\n {children}\n </SelectPopoverContents>\n </SelectProvider>\n </Popover>\n )}\n </div>\n\n {validationMessage && (\n <FieldMessage\n {...errorMessageProps}\n message={validationMessage}\n status={status}\n reversed={isReversed}\n />\n )}\n\n {description && (\n <FieldMessage\n {...descriptionProps}\n id={descriptionId}\n message={description}\n reversed={isReversed}\n />\n )}\n </div>\n )\n}\n\nSelect.displayName = \"Select\"\n\nSelect.Section = ListBoxSection\nSelect.SectionDivider = SectionDivider\nSelect.Option = Option\nSelect.ItemDefaultRender = ListItem\n\n// @deprecated Legacy exported aliases\nSelect.TriggerButton = SelectToggle\nSelect.ListBox = ListBox\n"],"names":["Select","_a","label","items","propsId","id","trigger","children","status","validationMessage","isReversed","isFullWidth","disabledValues","classNameOverride","selectedKey","description","placeholder","isDisabled","portalContainerId","restProps","__rest","refs","useFloating","triggerRef","reference","useId","descriptionId","concat","popoverId","disabledKeys","getDisabledKeysFromItems","ariaSelectProps","transformSelectItemToCollectionElement","toString","state","useSelectState","_c","useSelect","labelProps","reactAriaTriggerProps","triggerProps","valueProps","menuProps","errorMessageProps","descriptionProps","reactAriaLabelledBy","__assign","substring","indexOf","buttonProps","useButton","selectToggleProps","value","selectedItem","_b","rendered","isOpen","ref","setReference","_d","useState","portalContainer","setPortalContainer","useEffect","portalElement","document","getElementById","React","createElement","className","classnames","styles","notFullWidth","HiddenSelect","name","container","undefined","SelectToggle","Popover","focusOnProps","onEscapeKey","close","onClickOutside","noIsolation","SelectProvider","SelectPopoverContents","FieldMessage","message","reversed","displayName","Section","ListBoxSection","SectionDivider","Option","ItemDefaultRender","ListItem","TriggerButton","ListBox"],"mappings":"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"}
@@ -4,6 +4,7 @@ export type ContextModalSecondaryActionProps = {
4
4
  onSecondaryAction: () => void;
5
5
  } | {
6
6
  secondaryLabel?: undefined;
7
+ onSecondaryAction?: never;
7
8
  };
8
9
  export type ContextModalProps = Readonly<{
9
10
  isOpen: boolean;
@@ -35,6 +36,6 @@ export type ContextModalProps = Readonly<{
35
36
  * {@link https://cultureamp.design/?path=/docs/components-modals--contextmodal--docs Storybook}
36
37
  */
37
38
  export declare const ContextModal: {
38
- ({ isOpen, unpadded, layout, title, onConfirm, onAfterLeave, confirmLabel, confirmWorking, renderBackground, children, contentHeader, image, ...props }: ContextModalProps): JSX.Element;
39
+ ({ isOpen, unpadded, layout, title, onConfirm, onDismiss: propsOnDismiss, onAfterLeave, confirmLabel, confirmWorking, renderBackground, children, contentHeader, image, secondaryLabel, onSecondaryAction, ...props }: ContextModalProps): JSX.Element;
39
40
  displayName: string;
40
41
  };
@@ -0,0 +1,16 @@
1
+ import React from "react";
2
+ import { ToastNotificationObj } from "../types";
3
+ export type ToastNotificationProps = Omit<ToastNotificationObj, "id" | "message" | "persistent"> & {
4
+ children: React.ReactNode;
5
+ id?: string;
6
+ /**
7
+ * Removes the dismiss trigger. Functions the same as `persistent` in `addToastNotification`.
8
+ * If this is true you will need to manage the removal of notifications manually.
9
+ * @default false
10
+ */
11
+ hideCloseIcon?: boolean;
12
+ };
13
+ export declare const ToastNotification: {
14
+ ({ id: propsId, hideCloseIcon, type, title, onHide, children, ...restProps }: ToastNotificationProps): null;
15
+ displayName: string;
16
+ };
@@ -0,0 +1 @@
1
+ export * from "./ToastNotification";
@@ -0,0 +1,4 @@
1
+ export declare const ToastNotificationsList: {
2
+ (): JSX.Element;
3
+ displayName: string;
4
+ };
@@ -0,0 +1,12 @@
1
+ import { HTMLAttributes } from "react";
2
+ import { OverrideClassName } from "../../../../../types/OverrideClassName";
3
+ import { ToastNotificationObj } from "../../../types";
4
+ export type ToastNotificationsMapProps = {
5
+ notifications: ToastNotificationObj[];
6
+ onHide: (notificationId: string) => void;
7
+ container: Element | null;
8
+ } & OverrideClassName<HTMLAttributes<HTMLDivElement>>;
9
+ export declare const ToastNotificationsMap: {
10
+ ({ notifications, onHide: defaultOnHide, container, }: ToastNotificationsMapProps): JSX.Element | null;
11
+ displayName: string;
12
+ };
@@ -0,0 +1,21 @@
1
+ import React from "react";
2
+ import { ToastNotificationObj } from "../types";
3
+ type ToastNotificationObjOptionalId = Omit<ToastNotificationObj, "id"> & {
4
+ id?: string;
5
+ };
6
+ export type ToastNotificationContextValue = {
7
+ notifications: ToastNotificationObj[];
8
+ addToastNotification: (notification: ToastNotificationObjOptionalId) => void;
9
+ updateToastNotification: (notification: ToastNotificationObj) => void;
10
+ removeToastNotification: (notificationId: string) => void;
11
+ clearToastNotifications: () => void;
12
+ };
13
+ export declare const useToastNotificationContext: () => ToastNotificationContextValue;
14
+ type ToastNotificationProviderProps = {
15
+ children: React.ReactNode;
16
+ };
17
+ export declare const ToastNotificationProvider: {
18
+ ({ children, }: ToastNotificationProviderProps): JSX.Element | null;
19
+ displayName: string;
20
+ };
21
+ export {};
@@ -0,0 +1,2 @@
1
+ import { ToastNotificationContextValue } from "../context/ToastNotificationContext";
2
+ export declare const useToastNotification: () => ToastNotificationContextValue;
@@ -1,3 +1,4 @@
1
1
  export * from "./ToastNotification";
2
- export * from "./subcomponents/ToastNotificationManager";
3
- export * from "./subcomponents/ToastNotificationsList";
2
+ export * from "./ToastNotificationsList";
3
+ export * from "./hooks/useToastNotification";
4
+ export * from "./types";
@@ -1,8 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  import { DataAttributes } from "../../types/DataAttributes";
3
3
  import { NotificationType } from "../types";
4
- type Modify<T, R> = Omit<T, keyof R> & R;
5
- export type ToastNotification = {
4
+ export type ToastNotificationObj = {
6
5
  id: string;
7
6
  type: NotificationType;
8
7
  title: string;
@@ -14,10 +13,3 @@ export type ToastNotification = {
14
13
  */
15
14
  persistent?: boolean;
16
15
  } & DataAttributes;
17
- export type ToastNotificationWithOptionals = Modify<ToastNotification, {
18
- id?: string;
19
- }>;
20
- export type AddToastNotification = (notification: ToastNotificationWithOptionals) => void;
21
- export type RemoveToastNotification = (notificationId: string) => void;
22
- export type ClearToastNotifications = () => void;
23
- export {};
@@ -1,2 +1,3 @@
1
1
  export * from "./InlineNotification";
2
2
  export * from "./GlobalNotification";
3
+ export * from "./ToastNotification";
@@ -37,7 +37,7 @@ export type RichTextEditorProps = BaseRichTextEditorProps & (WithLabelText | Wit
37
37
  * {@link https://cultureamp.design/?path=/docs/components-richtexteditor--docs Storybook}
38
38
  */
39
39
  export declare const RichTextEditor: {
40
- ({ onChange, defaultValue, labelText, "aria-labelledby": labelledBy, classNameOverride, controls, rows, dataError, onDataError, validationMessage, description, status, ...restProps }: RichTextEditorProps): JSX.Element;
40
+ ({ onChange, defaultValue, labelText, "aria-labelledby": labelledBy, "aria-describedby": describedBy, classNameOverride, controls, rows, dataError, onDataError, validationMessage, description, status, ...restProps }: RichTextEditorProps): JSX.Element;
41
41
  displayName: string;
42
42
  };
43
43
  export {};
@@ -36,13 +36,17 @@ export type SelectProps<Option extends SelectOption = SelectOption> = {
36
36
  * @deprecated: Either define `disabled` in your `Option` (in `items`), or use `disabledKeys`
37
37
  */
38
38
  disabledValues?: Key[];
39
+ /**
40
+ * Creates a portal for the Popover to the matching element id
41
+ */
42
+ portalContainerId?: string;
39
43
  } & OverrideClassName<Omit<AriaSelectProps<Option>, OmittedAriaSelectProps>>;
40
44
  /**
41
45
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081896474/Select Guidance} |
42
46
  * {@link https://cultureamp.design/?path=/docs/components-select--docs Storybook}
43
47
  */
44
48
  export declare const Select: {
45
- <Option extends SelectOption = SelectOption>({ label, items, id: propsId, trigger, children, status, validationMessage, isReversed, isFullWidth, disabledValues, classNameOverride, selectedKey, description, placeholder, isDisabled, ...restProps }: SelectProps<Option>): JSX.Element;
49
+ <Option extends SelectOption = SelectOption>({ label, items, id: propsId, trigger, children, status, validationMessage, isReversed, isFullWidth, disabledValues, classNameOverride, selectedKey, description, placeholder, isDisabled, portalContainerId, ...restProps }: SelectProps<Option>): JSX.Element;
46
50
  displayName: string;
47
51
  Section: {
48
52
  <Option_1 extends SelectOption = SelectOption>({ section, }: import("./subcomponents").ListBoxSectionProps<Option_1>): JSX.Element;
@@ -48,13 +48,14 @@ export * from "./Table";
48
48
  export * from "./Tabs";
49
49
  export * from "./Tag";
50
50
  export * from "./Text";
51
- export * from "./TextField";
52
51
  export * from "./TextArea";
53
52
  export * from "./TextAreaField";
53
+ export * from "./TextField";
54
54
  export * from "./Tile";
55
55
  export * from "./TimeField";
56
+ export * from "./TitleBlockZen";
56
57
  export * from "./ToggleSwitch";
57
58
  export * from "./Tooltip";
58
- export * from "./TitleBlockZen";
59
- export * from "./Workflow";
59
+ export * from "./VisuallyHidden";
60
60
  export * from "./Well";
61
+ export * from "./Workflow";