@kaizen/components 1.35.1 → 1.36.0

package/dist/cjs/RichTextEditor/RichTextEditor/RichTextEditor.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"RichTextEditor.cjs","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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"}
+{"version":3,"file":"RichTextEditor.cjs","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":"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"}

package/dist/cjs/__future__/Select/Select.cjs

@@ -45,11 +45,13 @@ const Select = /*#__PURE__*/function () {
       description = _a.description,
       placeholder = _a.placeholder,
       isDisabled = _a.isDisabled,
-      restProps = tslib.__rest(_a, ["label", "items", "id", "trigger", "children", "status", "validationMessage", "isReversed", "isFullWidth", "disabledValues", "classNameOverride", "selectedKey", "description", "placeholder", "isDisabled"]);
+      portalContainerId = _a.portalContainerId,
+      restProps = tslib.__rest(_a, ["label", "items", "id", "trigger", "children", "status", "validationMessage", "isReversed", "isFullWidth", "disabledValues", "classNameOverride", "selectedKey", "description", "placeholder", "isDisabled", "portalContainerId"]);
     var refs = reactDom.useFloating().refs;
     var triggerRef = refs.reference;
     var id = propsId !== null && propsId !== void 0 ? propsId : React.useId();
     var descriptionId = "".concat(id, "--description");
+    var popoverId = "".concat(id, "--popover");
     var disabledKeys = getDisabledKeysFromItems.getDisabledKeysFromItems(items);
     var ariaSelectProps = tslib.__assign({
       label: label,
@@ -64,11 +66,20 @@ const Select = /*#__PURE__*/function () {
     var state = select.useSelectState(ariaSelectProps);
     var _c = select$1.useSelect(ariaSelectProps, state, triggerRef),
       labelProps = _c.labelProps,
-      triggerProps = _c.triggerProps,
+      reactAriaTriggerProps = _c.triggerProps,
       valueProps = _c.valueProps,
       menuProps = _c.menuProps,
       errorMessageProps = _c.errorMessageProps,
       descriptionProps = _c.descriptionProps;
+    // Hack incoming:
+    // react-aria/useSelect wants to prefix the combobox's accessible name with the value of the select.
+    // We use role=combobox, meaning screen readers will read the value.
+    // So we're modifying the `aria-labelledby` property to remove the value element id.
+    // Issue: https://github.com/adobe/react-spectrum/issues/4091
+    var reactAriaLabelledBy = reactAriaTriggerProps["aria-labelledby"];
+    var triggerProps = tslib.__assign(tslib.__assign({}, reactAriaTriggerProps), {
+      "aria-labelledby": reactAriaLabelledBy === null || reactAriaLabelledBy === void 0 ? void 0 : reactAriaLabelledBy.substring(reactAriaLabelledBy.indexOf(" ") + 1)
+    });
     var buttonProps = button.useButton(triggerProps, triggerRef).buttonProps;
     var selectToggleProps = tslib.__assign(tslib.__assign({}, buttonProps), {
       label: label,
@@ -82,6 +93,15 @@ const Select = /*#__PURE__*/function () {
       isReversed: isReversed,
       ref: refs.setReference
     });
+    var _d = React.useState(),
+      portalContainer = _d[0],
+      setPortalContainer = _d[1];
+    React.useEffect(function () {
+      if (portalContainerId) {
+        var portalElement = document.getElementById(portalContainerId);
+        portalElement && setPortalContainer(portalElement);
+      }
+    }, []);
     return React.createElement("div", {
       className: classnames(!isFullWidth && Select_module.notFullWidth, classNameOverride)
     }, React.createElement(select$1.HiddenSelect, {
@@ -92,6 +112,8 @@ const Select = /*#__PURE__*/function () {
     }), React.createElement("div", {
       className: Select_module.container
     }, trigger === undefined ? React.createElement(SelectToggle.SelectToggle, tslib.__assign({}, selectToggleProps)) : trigger(selectToggleProps, selectToggleProps.ref), state.isOpen && React.createElement(Popover.Popover, {
+      id: popoverId,
+      portalContainer: portalContainer,
       refs: refs,
       focusOnProps: {
         onEscapeKey: state.close,

package/dist/cjs/__future__/Select/Select.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Select.cjs","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,\n    valueProps,\n    menuProps,\n    errorMessageProps,\n    descriptionProps,\n  } = useSelect(ariaSelectProps, state, triggerRef)\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","triggerProps","valueProps","menuProps","errorMessageProps","descriptionProps","buttonProps","useButton","selectToggleProps","__assign","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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"}
+{"version":3,"file":"Select.cjs","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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"}

package/dist/cjs/dts/Modal/ContextModal/ContextModal.d.ts

@@ -4,6 +4,7 @@ export type ContextModalSecondaryActionProps = {
     onSecondaryAction: () => void;
 } | {
     secondaryLabel?: undefined;
+    onSecondaryAction?: never;
 };
 export type ContextModalProps = Readonly<{
     isOpen: boolean;
@@ -35,6 +36,6 @@ export type ContextModalProps = Readonly<{
  * {@link https://cultureamp.design/?path=/docs/components-modals--contextmodal--docs Storybook}
  */
 export declare const ContextModal: {
-    ({ isOpen, unpadded, layout, title, onConfirm, onAfterLeave, confirmLabel, confirmWorking, renderBackground, children, contentHeader, image, ...props }: ContextModalProps): JSX.Element;
+    ({ isOpen, unpadded, layout, title, onConfirm, onDismiss: propsOnDismiss, onAfterLeave, confirmLabel, confirmWorking, renderBackground, children, contentHeader, image, secondaryLabel, onSecondaryAction, ...props }: ContextModalProps): JSX.Element;
     displayName: string;
 };

package/dist/cjs/dts/MultiSelect/MultiSelect.d.ts

@@ -2,7 +2,7 @@ import { HTMLAttributes } from "react";
 import { FieldMessageProps } from "../FieldMessage";
 import { OverrideClassName } from "../types/OverrideClassName";
 import { MultiSelectOptionsProps } from "./subcomponents/MultiSelectOptions";
-import { MultiSelectOption } from "./types";
+import { MultiSelectOption, ValidationMessage } from "./types";
 export type MultiSelectProps = {
     label: string;
     items: MultiSelectOptionsProps["options"];
@@ -14,8 +14,10 @@ export type MultiSelectProps = {
     onSelectedValuesChange: MultiSelectOptionsProps["onChange"];
     isOpen: boolean;
     onOpenChange: (isOpen: boolean) => void;
+    /** A status and message to provide context to the validation issue  */
+    validationMessage?: ValidationMessage;
 } & OverrideClassName<HTMLAttributes<HTMLDivElement>>;
 export declare const MultiSelect: {
-    ({ id: propsId, label, items, selectedValues, description, onSelectedValuesChange, isOpen, onOpenChange, classNameOverride, ...restProps }: MultiSelectProps): JSX.Element;
+    ({ id: propsId, label, items, selectedValues, description, onSelectedValuesChange, isOpen, onOpenChange, classNameOverride, validationMessage, ...restProps }: MultiSelectProps): JSX.Element;
     displayName: string;
 };

package/dist/cjs/dts/MultiSelect/subcomponents/MultiSelectToggle/MultiSelectToggle.d.ts

@@ -1,4 +1,5 @@
 import React, { HTMLAttributes } from "react";
+import { FieldMessageProps } from "../../../FieldMessage";
 import { OverrideClassName } from "../../../types/OverrideClassName";
 import { MultiSelectOption } from "../../types";
 export type MultiSelectToggleProps = {
@@ -7,6 +8,7 @@ export type MultiSelectToggleProps = {
     ["aria-controls"]: string;
     selectedOptions: MultiSelectOption[];
     isOpen?: boolean;
+    status?: FieldMessageProps["status"];
     onRemoveOption: (optionValue: MultiSelectOption["value"]) => void;
     onRemoveAllOptions: () => void;
 } & OverrideClassName<HTMLAttributes<HTMLDivElement>>;
@@ -16,6 +18,7 @@ export declare const MultiSelectToggle: React.ForwardRefExoticComponent<{
     "aria-controls": string;
     selectedOptions: MultiSelectOption[];
     isOpen?: boolean | undefined;
+    status?: FieldMessageProps["status"];
     onRemoveOption: (optionValue: MultiSelectOption["value"]) => void;
     onRemoveAllOptions: () => void;
 } & Omit<React.HTMLAttributes<HTMLDivElement>, "className"> & {

package/dist/cjs/dts/MultiSelect/types.d.ts

@@ -1,4 +1,10 @@
+/// <reference types="react" />
+import { FieldMessageStatus } from "../FieldMessage";
 export type MultiSelectOption = {
     label: string;
     value: string | number;
 };
+export type ValidationMessage = {
+    status?: Extract<FieldMessageStatus, "error" | "caution">;
+    message: string | React.ReactElement;
+};

package/dist/cjs/dts/Notification/ToastNotification/ToastNotification/ToastNotification.d.ts

@@ -0,0 +1,16 @@
+import React from "react";
+import { ToastNotificationObj } from "../types";
+export type ToastNotificationProps = Omit<ToastNotificationObj, "id" | "message" | "persistent"> & {
+    children: React.ReactNode;
+    id?: string;
+    /**
+     * Removes the dismiss trigger. Functions the same as `persistent` in `addToastNotification`.
+     * If this is true you will need to manage the removal of notifications manually.
+     * @default false
+     */
+    hideCloseIcon?: boolean;
+};
+export declare const ToastNotification: {
+    ({ id: propsId, hideCloseIcon, type, title, onHide, children, ...restProps }: ToastNotificationProps): null;
+    displayName: string;
+};

package/dist/cjs/dts/Notification/ToastNotification/ToastNotification/index.d.ts

@@ -0,0 +1 @@
+export * from "./ToastNotification";

package/dist/cjs/dts/Notification/ToastNotification/ToastNotificationsList/ToastNotificationsList.d.ts

@@ -0,0 +1,4 @@
+export declare const ToastNotificationsList: {
+    (): JSX.Element;
+    displayName: string;
+};

package/dist/cjs/dts/Notification/ToastNotification/ToastNotificationsList/subcomponents/ToastNotificationsMap/ToastNotificationsMap.d.ts

@@ -0,0 +1,12 @@
+import { HTMLAttributes } from "react";
+import { OverrideClassName } from "../../../../../types/OverrideClassName";
+import { ToastNotificationObj } from "../../../types";
+export type ToastNotificationsMapProps = {
+    notifications: ToastNotificationObj[];
+    onHide: (notificationId: string) => void;
+    container: Element | null;
+} & OverrideClassName<HTMLAttributes<HTMLDivElement>>;
+export declare const ToastNotificationsMap: {
+    ({ notifications, onHide: defaultOnHide, container, }: ToastNotificationsMapProps): JSX.Element | null;
+    displayName: string;
+};

package/dist/cjs/dts/Notification/ToastNotification/ToastNotificationsList/subcomponents/ToastNotificationsMap/index.d.ts

@@ -0,0 +1 @@
+export * from "./ToastNotificationsMap";

package/dist/cjs/dts/Notification/ToastNotification/context/ToastNotificationContext.d.ts

@@ -0,0 +1,21 @@
+import React from "react";
+import { ToastNotificationObj } from "../types";
+type ToastNotificationObjOptionalId = Omit<ToastNotificationObj, "id"> & {
+    id?: string;
+};
+export type ToastNotificationContextValue = {
+    notifications: ToastNotificationObj[];
+    addToastNotification: (notification: ToastNotificationObjOptionalId) => void;
+    updateToastNotification: (notification: ToastNotificationObj) => void;
+    removeToastNotification: (notificationId: string) => void;
+    clearToastNotifications: () => void;
+};
+export declare const useToastNotificationContext: () => ToastNotificationContextValue;
+type ToastNotificationProviderProps = {
+    children: React.ReactNode;
+};
+export declare const ToastNotificationProvider: {
+    ({ children, }: ToastNotificationProviderProps): JSX.Element | null;
+    displayName: string;
+};
+export {};

package/dist/cjs/dts/Notification/ToastNotification/hooks/useToastNotification.d.ts

@@ -0,0 +1,2 @@
+import { ToastNotificationContextValue } from "../context/ToastNotificationContext";
+export declare const useToastNotification: () => ToastNotificationContextValue;

package/dist/cjs/dts/Notification/ToastNotification/index.d.ts

@@ -1,3 +1,4 @@
 export * from "./ToastNotification";
-export * from "./subcomponents/ToastNotificationManager";
-export * from "./subcomponents/ToastNotificationsList";
+export * from "./ToastNotificationsList";
+export * from "./hooks/useToastNotification";
+export * from "./types";

package/dist/cjs/dts/Notification/ToastNotification/types.d.ts

@@ -1,8 +1,7 @@
 /// <reference types="react" />
 import { DataAttributes } from "../../types/DataAttributes";
 import { NotificationType } from "../types";
-type Modify<T, R> = Omit<T, keyof R> & R;
-export type ToastNotification = {
+export type ToastNotificationObj = {
     id: string;
     type: NotificationType;
     title: string;
@@ -14,10 +13,3 @@ export type ToastNotification = {
      */
     persistent?: boolean;
 } & DataAttributes;
-export type ToastNotificationWithOptionals = Modify<ToastNotification, {
-    id?: string;
-}>;
-export type AddToastNotification = (notification: ToastNotificationWithOptionals) => void;
-export type RemoveToastNotification = (notificationId: string) => void;
-export type ClearToastNotifications = () => void;
-export {};

package/dist/cjs/dts/Notification/index.d.ts

@@ -1,2 +1,3 @@
 export * from "./InlineNotification";
 export * from "./GlobalNotification";
+export * from "./ToastNotification";

package/dist/cjs/dts/RichTextEditor/RichTextEditor/RichTextEditor.d.ts

@@ -37,7 +37,7 @@ export type RichTextEditorProps = BaseRichTextEditorProps & (WithLabelText | Wit
  * {@link https://cultureamp.design/?path=/docs/components-richtexteditor--docs Storybook}
  */
 export declare const RichTextEditor: {
-    ({ onChange, defaultValue, labelText, "aria-labelledby": labelledBy, classNameOverride, controls, rows, dataError, onDataError, validationMessage, description, status, ...restProps }: RichTextEditorProps): JSX.Element;
+    ({ onChange, defaultValue, labelText, "aria-labelledby": labelledBy, "aria-describedby": describedBy, classNameOverride, controls, rows, dataError, onDataError, validationMessage, description, status, ...restProps }: RichTextEditorProps): JSX.Element;
     displayName: string;
 };
 export {};

package/dist/cjs/dts/__future__/Select/Select.d.ts

@@ -36,13 +36,17 @@ export type SelectProps<Option extends SelectOption = SelectOption> = {
      * @deprecated: Either define `disabled` in your `Option` (in `items`), or use `disabledKeys`
      */
     disabledValues?: Key[];
+    /**
+     * Creates a portal for the Popover to the matching element id
+     */
+    portalContainerId?: string;
 } & OverrideClassName<Omit<AriaSelectProps<Option>, OmittedAriaSelectProps>>;
 /**
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081896474/Select Guidance} |
  * {@link https://cultureamp.design/?path=/docs/components-select--docs Storybook}
  */
 export declare const Select: {
-    <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;
+    <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;
     displayName: string;
     Section: {
         <Option_1 extends SelectOption = SelectOption>({ section, }: import("./subcomponents").ListBoxSectionProps<Option_1>): JSX.Element;

package/dist/cjs/index.cjs

@@ -334,6 +334,9 @@ var ModalBody = require('./Modal/GenericModal/subcomponents/ModalBody/ModalBody.
 var InputEditModal = require('./Modal/InputEditModal/InputEditModal.cjs');
 var InlineNotification = require('./Notification/InlineNotification/InlineNotification.cjs');
 var GlobalNotification = require('./Notification/GlobalNotification/GlobalNotification.cjs');
+var ToastNotification = require('./Notification/ToastNotification/ToastNotification/ToastNotification.cjs');
+var ToastNotificationsList = require('./Notification/ToastNotification/ToastNotificationsList/ToastNotificationsList.cjs');
+var useToastNotification = require('./Notification/ToastNotification/hooks/useToastNotification.cjs');
 var Pagination = require('./Pagination/Pagination.cjs');
 var DirectionalLink = require('./Pagination/subcomponents/DirectionalLink/DirectionalLink.cjs');
 var PaginationLink = require('./Pagination/subcomponents/PaginationLink/PaginationLink.cjs');
@@ -943,6 +946,9 @@ exports.ModalBody = ModalBody.ModalBody;
 exports.InputEditModal = InputEditModal.InputEditModal;
 exports.InlineNotification = InlineNotification.InlineNotification;
 exports.GlobalNotification = GlobalNotification.GlobalNotification;
+exports.ToastNotification = ToastNotification.ToastNotification;
+exports.ToastNotificationsList = ToastNotificationsList.ToastNotificationsList;
+exports.useToastNotification = useToastNotification.useToastNotification;
 exports.Pagination = Pagination.Pagination;
 exports.DirectionalLink = DirectionalLink.DirectionalLink;
 exports.PaginationLink = PaginationLink.PaginationLink;

package/dist/cjs/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}