@pexip/components 20.0.0 → 20.1.0

package/CHANGELOG.md

@@ -1,5 +1,31 @@
 # Changelog
 
+## 20.1.0
+
+### Minor Changes
+
+- d7432f8: Add `variant` prop to `CondensedTabs` with `underline` style support.
+  Add `isFullWidth` and `noMargin` props to `Sheet`.
+- 300946c: Adds `className` optional prop to `withTransition`
+- c064e2d: - Add `withTopDivider` / `withBottomDivider` props to `AriaMenuItem`
+  for rendering dividers around menu items
+  - Move Menu section divider inside `<List>` for consistent padding with menu
+    items
+  - Add `role="separator"` to dividers for accessibility
+  - Update divider color tokens (`neutral-30` / `neutral-80`), preserve old
+    values in `variables.legacy.scss`
+  - Add `WithDividers` story for AriaMenu
+- fe02b23: Adds 'right' and 'left' position to `NotificationTooltip`
+
+### Patch Changes
+
+- 15954c9: Lint
+- 6732861: Fix issue with the css overrides.
+- Updated dependencies [44ad859]
+- Updated dependencies [514c523]
+  - @pexip/utils@17.4.0
+  - @pexip/hooks@21.0.8
+
 ## 20.0.0
 
 ### Major Changes

package/api-docs/README.mdx

@@ -73,6 +73,7 @@ import '@pexip/components/dist/index.css';
 | [TextProps](type-aliases/TextProps.mdx) | - |
 | [TextLinkProps](type-aliases/TextLinkProps.mdx) | - |
 | [NotificationTooltipPosition](type-aliases/NotificationTooltipPosition.mdx) | - |
+| [NotificationTooltipProps](type-aliases/NotificationTooltipProps.mdx) | - |
 | [OverlayOpacity](type-aliases/OverlayOpacity.mdx) | - |
 | [FullSizeWindowColorBackgroundProps](type-aliases/FullSizeWindowColorBackgroundProps.mdx) | - |
 | [FullSizeWindowImageBackgroundProps](type-aliases/FullSizeWindowImageBackgroundProps.mdx) | - |

package/api-docs/functions/announce.mdx

@@ -13,7 +13,7 @@ Announcer needs to be mounted in the application for this to work.
 | Parameter | Type | Default value | Description |
 | ------ | ------ | ------ | ------ |
 | `message` | `ReactNode` | `undefined` | The message to announce. |
-| `politeness` | `"assertive"` \| `"polite"` | `'polite'` | The politeness level of the announcement. |
+| `politeness` | `"assertive" \| "polite"` | `'polite'` | The politeness level of the announcement. |
 | `timeout` | `number` | `5000` | The time in milliseconds util the message is removed from area-live region. |
 
 ## Returns

package/api-docs/functions/onEnter.mdx

@@ -6,8 +6,8 @@ function onEnter<E, T>(callback): (e) => void;
 
 | Type Parameter |
 | ------ |
-| `E` *extends* `HTMLElement` |
-| `T` *extends* (`e`) => `void` |
+| `E extends HTMLElement` |
+| `T extends (e) => void` |
 
 ## Parameters
 
@@ -25,7 +25,7 @@ function onEnter<E, T>(callback): (e) => void;
 
 | Parameter | Type |
 | ------ | ------ |
-| `e` | `KeyboardEvent`\<`E`\> |
+| `e` | `KeyboardEvent<E>` |
 
 ### Returns
 

package/api-docs/functions/sizeToPadding.mdx

@@ -11,12 +11,22 @@ function sizeToPadding(t):
 
 | Parameter | Type |
 | ------ | ------ |
-| `t` | `"small"` \| `"medium"` \| `"compact"` \| `"large"` \| `"none"` |
+| `t` | `"small" \| "medium" \| "compact" \| "large" \| "none"` |
 
 ## Returns
 
-  \| `"compactPadding"`
-  \| `"largePadding"`
-  \| `"mediumPadding"`
-  \| `"nonePadding"`
-  \| `"smallPadding"`
+```ts
+| "compactPadding"
+```
+```ts
+| "largePadding"
+```
+```ts
+| "mediumPadding"
+```
+```ts
+| "nonePadding"
+```
+```ts
+| "smallPadding"
+```

package/api-docs/functions/useBreakpointChange.mdx

@@ -4,4 +4,4 @@ function useBreakpointChange(): Signal<undefined, undefined>;
 
 ## Returns
 
-`Signal`\<`undefined`, `undefined`\>
+`Signal<undefined, undefined>`

package/api-docs/functions/useFocusFrom.mdx

@@ -11,7 +11,7 @@ will be focused on the next tab.
 
 | Parameter | Type | Description |
 | ------ | ------ | ------ |
-| `element` | `HTMLElement` \| `null` | element which focus point should start from |
+| `element` | `HTMLElement \| null` | element which focus point should start from |
 
 ## Returns
 
@@ -21,4 +21,4 @@ focusFrom function, when called sets the focus point to the given element
 
 | Name | Type |
 | ------ | ------ |
-| `focusFrom()` | () => `void` |
+| `focusFrom()` | `() => void` |

package/api-docs/functions/useFocusFromOpened.mdx

@@ -12,7 +12,7 @@ element inside the container element.
 
 | Parameter | Type | Description |
 | ------ | ------ | ------ |
-| `element` | `HTMLElement` \| `null` | element which focus point should start from |
+| `element` | `HTMLElement \| null` | element which focus point should start from |
 | `isOpen` | `boolean` | when isOpen is true the element will get the focus point |
 
 ## Returns

package/api-docs/functions/useGroupedPagesNav.mdx

@@ -6,11 +6,11 @@ function useGroupedPagesNav(__namedParameters): GroupedPageNav[];
 
 | Parameter | Type |
 | ------ | ------ |
-| `__namedParameters` | \{ `groupChunkSize?`: `number`; `pageIndex`: `number`; `totalPagesCount`: `number`; \} |
+| `__namedParameters` | `{ groupChunkSize?: number; pageIndex: number; totalPagesCount: number; }` |
 | `__namedParameters.groupChunkSize?` | `number` |
 | `__namedParameters.pageIndex` | `number` |
 | `__namedParameters.totalPagesCount` | `number` |
 
 ## Returns
 
-`GroupedPageNav`[]
+`GroupedPageNav[]`

package/api-docs/functions/useInput.mdx

@@ -6,8 +6,10 @@ function useInput(props): [string, Omit<Omit<DetailedHTMLProps<InputHTMLAttribut
 
 | Parameter | Type |
 | ------ | ------ |
-| `props` | `Omit`\<`Omit`\<`DetailedHTMLProps`\<`InputHTMLAttributes`\<`HTMLInputElement`\>, `HTMLInputElement`\>, `"disabled"`\> & `object`, `"ref"`\> & `RefAttributes`\<`Pick`\<`HTMLInputElement`, `"focus"`\>\> |
+| `props` | `Omit<Omit<DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "disabled"> & object, "ref"> & RefAttributes<Pick<HTMLInputElement, "focus">>` |
 
 ## Returns
 
-\[`string`, `Omit`\<`Omit`\<`DetailedHTMLProps`\<`InputHTMLAttributes`\<`HTMLInputElement`\>, `HTMLInputElement`\>, `"disabled"`\> & `object`, `"ref"`\> & `RefAttributes`\<`Pick`\<`HTMLInputElement`, `"focus"`\>\>\]
+```ts
+[string, Omit<Omit<DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "disabled"> & object, "ref"> & RefAttributes<Pick<HTMLInputElement, "focus">>]
+```

package/api-docs/functions/useModal.mdx

@@ -14,5 +14,5 @@ function useModal(isOpen): object;
 
 | Name | Type |
 | ------ | ------ |
-| `ref` | `RefObject`\<`HTMLDivElement` \| `null`\> |
-| `modalProps` | `DOMAttributes`\<`FocusableElement`\> |
+| `ref` | `RefObject<HTMLDivElement \| null>` |
+| `modalProps` | `DOMAttributes<FocusableElement>` |

package/api-docs/functions/useModalHandle.mdx

@@ -9,4 +9,4 @@ function useModalHandle(): object;
 | Name | Type |
 | ------ | ------ |
 | `modalHandleRef` | `RefObject`\<[`ModalHandle`](../interfaces/ModalHandle.mdx) \| `null`\> |
-| `focusModal()` | () => `void` |
+| `focusModal()` | `() => void` |

package/api-docs/functions/useModalWithoutPreventScroll.mdx

@@ -20,5 +20,5 @@ causes the virtual keyboard to cover focused inputs.
 
 | Name | Type | Default value |
 | ------ | ------ | ------ |
-| `ref` | `RefObject`\<`HTMLDivElement` \| `null`\> | - |
-| `modalProps` | `DOMAttributes`\<`FocusableElement`\> | `overlayProps` |
+| `ref` | `RefObject<HTMLDivElement \| null>` | - |
+| `modalProps` | `DOMAttributes<FocusableElement>` | `overlayProps` |

package/api-docs/functions/useMultistepIndicator.mdx

@@ -34,12 +34,28 @@ readonly \[\{
   `prevStepsCompleted`: `boolean`;
   `steps`: [`MultistepItem`](../interfaces/MultistepItem.mdx)[];
 \}, \{
-  `moveToStep`: (`stepIndex`, `__namedParameters`) => `void`;
-  `resetAllSteps`: () => `void`;
-  `resetStep`: (`stepIndex`) => `void`;
-  `updateStepActive`: (`stepIndex`, `isActive`) => `void`;
-  `updateStepCompleted`: (`stepIndex`, `__namedParameters`) => `void`;
-  `updateStepFailed`: (`stepIndex`, `__namedParameters`) => `void`;
-  `updateStepDisabled`: (`stepIndex`, `isDisabled`) => `void`;
-  `updateStepLeave`: (`stepIndex`, `__namedParameters`) => `void`;
+```ts
+moveToStep: (stepIndex, __namedParameters) => void;
+```
+```ts
+resetAllSteps: () => void;
+```
+```ts
+resetStep: (stepIndex) => void;
+```
+```ts
+updateStepActive: (stepIndex, isActive) => void;
+```
+```ts
+updateStepCompleted: (stepIndex, __namedParameters) => void;
+```
+```ts
+updateStepFailed: (stepIndex, __namedParameters) => void;
+```
+```ts
+updateStepDisabled: (stepIndex, isDisabled) => void;
+```
+```ts
+updateStepLeave: (stepIndex, __namedParameters) => void;
+```
 \}\]

package/api-docs/functions/useOutOfViewNavigation.mdx

@@ -6,10 +6,10 @@ function useOutOfViewNavigation(__namedParameters): object;
 
 | Parameter | Type |
 | ------ | ------ |
-| `__namedParameters` | \{ `isDisabled?`: `boolean`; `content`: `ReactElement`; `root`: `HTMLElement` \| `null`; `moveBy?`: `number`; `containerClassName?`: `string`; \} |
+| `__namedParameters` | `{ isDisabled?: boolean; content: ReactElement; root: HTMLElement \| null; moveBy?: number; containerClassName?: string; }` |
 | `__namedParameters.isDisabled?` | `boolean` |
 | `__namedParameters.content` | `ReactElement` |
-| `__namedParameters.root` | `HTMLElement` \| `null` |
+| `__namedParameters.root` | `HTMLElement \| null` |
 | `__namedParameters.moveBy?` | `number` |
 | `__namedParameters.containerClassName?` | `string` |
 
@@ -20,6 +20,6 @@ function useOutOfViewNavigation(__namedParameters): object;
 | Name | Type |
 | ------ | ------ |
 | `navigationView` | `Element` |
-| `moveLeft` | () => `void` \| `undefined` |
-| `moveRight` | () => `void` \| `undefined` |
+| `moveLeft` | `() => void \| undefined` |
+| `moveRight` | `() => void \| undefined` |
 | `hasOverflowingContent` | `boolean` |

package/api-docs/functions/useScrollIntoView.mdx

@@ -6,10 +6,10 @@ function useScrollIntoView(element, options): () => void;
 
 | Parameter | Type |
 | ------ | ------ |
-| `element` | `RefObject`\<`HTMLElement` \| `null`\> |
-| `options` | \{ `delay?`: `number`; `scrollIntoViewOptions?`: `Partial`\<`ScrollIntoViewOptions`\>; \} |
+| `element` | `RefObject<HTMLElement \| null>` |
+| `options` | `{ delay?: number; scrollIntoViewOptions?: Partial<ScrollIntoViewOptions>; }` |
 | `options.delay?` | `number` |
-| `options.scrollIntoViewOptions?` | `Partial`\<`ScrollIntoViewOptions`\> |
+| `options.scrollIntoViewOptions?` | `Partial<ScrollIntoViewOptions>` |
 
 ## Returns
 

package/api-docs/functions/useTabs.mdx

@@ -15,4 +15,4 @@ function useTabs(activeTabIndex): object;
 | Name | Type |
 | ------ | ------ |
 | `activeTab` | `number` |
-| `setActiveTab` | `Dispatch`\<`SetStateAction`\<`number`\>\> |
+| `setActiveTab` | `Dispatch<SetStateAction<number>>` |

package/api-docs/functions/withColorScheme.mdx

@@ -6,14 +6,14 @@ function withColorScheme<P>(Component, colorScheme): (props) => Element;
 
 | Type Parameter |
 | ------ |
-| `P` *extends* `object` |
+| `P extends object` |
 
 ## Parameters
 
 | Parameter | Type |
 | ------ | ------ |
-| `Component` | `ComponentType`\<`P`\> |
-| `colorScheme` | `"dark"` \| `"light"` |
+| `Component` | `ComponentType<P>` |
+| `colorScheme` | `"dark" \| "light"` |
 
 ## Returns
 

package/api-docs/functions/withTabName.mdx

@@ -12,7 +12,7 @@ function withTabName<P>(Component, componentProps?): (props) => Element;
 
 | Parameter | Type |
 | ------ | ------ |
-| `Component` | `ComponentType`\<`P`\> |
+| `Component` | `ComponentType<P>` |
 | `componentProps?` | `P` |
 
 ## Returns
@@ -25,7 +25,7 @@ function withTabName<P>(Component, componentProps?): (props) => Element;
 
 | Parameter | Type |
 | ------ | ------ |
-| `props` | `P` & `ClassAttributes`\<`HTMLButtonElement`\> & `ButtonHTMLAttributes`\<`HTMLButtonElement`\> |
+| `props` | `P` & `ClassAttributes<HTMLButtonElement>` & `ButtonHTMLAttributes<HTMLButtonElement>` |
 
 ### Returns
 

package/api-docs/functions/withTransition.mdx

@@ -9,15 +9,15 @@ function withTransition<P>(
 
 | Type Parameter |
 | ------ |
-| `P` *extends* `object` |
+| `P extends object` |
 
 ## Parameters
 
 | Parameter | Type | Default value |
 | ------ | ------ | ------ |
-| `Component` | `ComponentType`\<`P`\> | `undefined` |
+| `Component` | `ComponentType<P>` | `undefined` |
 | `timeout` | `number` | `undefined` |
-| `stateAfterTransition` | `"hide"` \| `"unmount"` | `'unmount'` |
+| `stateAfterTransition` | `"hide" \| "unmount"` | `'unmount'` |
 
 ## Returns
 
@@ -33,4 +33,6 @@ function withTransition<P>(
 
 ### Returns
 
-`Element` \| `null`
+```ts
+Element | null
+```

package/api-docs/interfaces/FullSizeWindowCommonProps.mdx

@@ -2,7 +2,7 @@
 
 | Property | Type |
 | ------ | ------ |
-| <a id="padding"></a> `padding?` | `"small"` \| `"none"` |
-| <a id="flexdirection"></a> `flexDirection?` | `"column"` \| `"row"` \| `"rowReverse"` \| `"columnReverse"` |
-| <a id="justifycontent"></a> `justifyContent?` | `"center"` \| `"flexStart"` |
-| <a id="position"></a> `position?` | `"fixed"` \| `"absolute"` |
+| <a id="padding"></a> `padding?` | `"small" \| "none"` |
+| <a id="flexdirection"></a> `flexDirection?` | `"column" \| "row" \| "rowReverse" \| "columnReverse"` |
+| <a id="justifycontent"></a> `justifyContent?` | `"center" \| "flexStart"` |
+| <a id="position"></a> `position?` | `"fixed" \| "absolute"` |

package/api-docs/interfaces/IconCollection.mdx

@@ -21,6 +21,8 @@
 | <a id="iconaudiotransmission"></a> `IconAudioTransmission` | [`IconSource`](IconSource.mdx) |
 | <a id="iconauthenticated"></a> `IconAuthenticated` | [`IconSource`](IconSource.mdx) |
 | <a id="iconbackgroundblur"></a> `IconBackgroundBlur` | [`IconSource`](IconSource.mdx) |
+| <a id="iconbackgroundblurlight"></a> `IconBackgroundBlurLight` | [`IconSource`](IconSource.mdx) |
+| <a id="iconbackgroundblurstrong"></a> `IconBackgroundBlurStrong` | [`IconSource`](IconSource.mdx) |
 | <a id="iconbackgroundreplace"></a> `IconBackgroundReplace` | [`IconSource`](IconSource.mdx) |
 | <a id="iconbackspace"></a> `IconBackspace` | [`IconSource`](IconSource.mdx) |
 | <a id="iconbacktotop"></a> `IconBackToTop` | [`IconSource`](IconSource.mdx) |
@@ -97,6 +99,7 @@
 | <a id="iconmorevertical"></a> `IconMoreVertical` | [`IconSource`](IconSource.mdx) |
 | <a id="iconmove"></a> `IconMove` | [`IconSource`](IconSource.mdx) |
 | <a id="iconnotauthenticated"></a> `IconNotauthenticated` | [`IconSource`](IconSource.mdx) |
+| <a id="iconnotauthenticated-1"></a> `IconNotAuthenticated` | [`IconSource`](IconSource.mdx) |
 | <a id="iconopeninnew"></a> `IconOpenInNew` | [`IconSource`](IconSource.mdx) |
 | <a id="iconparticipant"></a> `IconParticipant` | [`IconSource`](IconSource.mdx) |
 | <a id="iconpasswordhide"></a> `IconPasswordHide` | [`IconSource`](IconSource.mdx) |
@@ -124,6 +127,7 @@
 | <a id="iconshare"></a> `IconShare` | [`IconSource`](IconSource.mdx) |
 | <a id="iconshield"></a> `IconShield` | [`IconSource`](IconSource.mdx) |
 | <a id="iconshuffle"></a> `IconShuffle` | [`IconSource`](IconSource.mdx) |
+| <a id="iconsort"></a> `IconSort` | [`IconSource`](IconSource.mdx) |
 | <a id="iconspeakerdisabled"></a> `IconSpeakerDisabled` | [`IconSource`](IconSource.mdx) |
 | <a id="iconspeakeroff"></a> `IconSpeakerOff` | [`IconSource`](IconSource.mdx) |
 | <a id="iconspeakeron"></a> `IconSpeakerOn` | [`IconSource`](IconSource.mdx) |

package/api-docs/interfaces/IconSource.mdx

@@ -2,6 +2,6 @@
 
 | Property | Type |
 | ------ | ------ |
-| <a id="size16"></a> `size16` | `FC`\<`SVGProps`\<`SVGSVGElement`\>\> |
-| <a id="size24"></a> `size24` | `FC`\<`SVGProps`\<`SVGSVGElement`\>\> |
-| <a id="size32"></a> `size32` | `FC`\<`SVGProps`\<`SVGSVGElement`\>\> |
+| <a id="size16"></a> `size16` | `FC<SVGProps<SVGSVGElement>>` |
+| <a id="size24"></a> `size24` | `FC<SVGProps<SVGSVGElement>>` |
+| <a id="size32"></a> `size32` | `FC<SVGProps<SVGSVGElement>>` |

package/api-docs/interfaces/LoadingBoxProps.mdx

@@ -1,6 +1,8 @@
 ## Extends
 
-- `Pick`\<`React.ComponentProps`\<*typeof* [`Spinner`](../variables/Spinner.mdx)\>, `"sizeModifier"` \| `"colorScheme"`\>
+```ts
+- Pick<React.ComponentProps<typeof Spinner>, "sizeModifier" | "colorScheme">
+```
 
 ## Properties
 
@@ -8,5 +10,5 @@
 | ------ | ------ | ------ |
 | <a id="classname"></a> `className?` | `string` | - |
 | <a id="isloading"></a> `isLoading?` | `boolean` | - |
-| <a id="sizemodifier"></a> `sizeModifier?` | `"small"` \| `"medium"` \| `"compact"` | `Pick.sizeModifier` |
-| <a id="colorscheme"></a> `colorScheme?` | `"dark"` \| `"light"` | `Pick.colorScheme` |
+| <a id="sizemodifier"></a> `sizeModifier?` | `"small" \| "medium" \| "compact"` | `Pick.sizeModifier` |
+| <a id="colorscheme"></a> `colorScheme?` | `"dark" \| "light"` | `Pick.colorScheme` |

package/api-docs/interfaces/ModalHandle.mdx

@@ -2,4 +2,4 @@
 
 | Property | Type |
 | ------ | ------ |
-| <a id="focus"></a> `focus` | () => `void` |
+| <a id="focus"></a> `focus` | `() => void` |

package/api-docs/interfaces/MultistepItem.mdx

@@ -4,7 +4,7 @@
 | ------ | ------ |
 | <a id="label"></a> `label` | `string` |
 | <a id="url"></a> `url?` | `string` |
-| <a id="onclick"></a> `onClick?` | () => `void` |
+| <a id="onclick"></a> `onClick?` | `() => void` |
 | <a id="iscompleted"></a> `isCompleted?` | `boolean` |
 | <a id="isfailed"></a> `isFailed?` | `boolean` |
 | <a id="isdisabled"></a> `isDisabled?` | `boolean` |

package/api-docs/interfaces/StatCardRowData.mdx

@@ -2,14 +2,14 @@
 
 | Property | Type |
 | ------ | ------ |
-| <a id="caption"></a> `caption?` | \| `string` \| `ReactElement`\<`unknown`, `string` \| `JSXElementConstructor`\<`any`\>\> |
+| <a id="caption"></a> `caption?` | `\| string \| ReactElement<unknown, string` | JSXElementConstructor\<any\>\>` |
 | <a id="captionclassname"></a> `captionClassName?` | `string` |
-| <a id="captionsize"></a> `captionSize?` | `"small"` \| `"medium"` |
+| <a id="captionsize"></a> `captionSize?` | `"small" \| "medium"` |
 | <a id="captiontitle"></a> `captionTitle?` | `string` |
-| <a id="figure"></a> `figure?` | \| `string` \| `number` \| `ReactElement`\<`unknown`, `string` \| `JSXElementConstructor`\<`any`\>\> |
+| <a id="figure"></a> `figure?` | `\| string \| number \| ReactElement<unknown, string` | JSXElementConstructor\<any\>\>` |
 | <a id="figureclassname"></a> `figureClassName?` | `string` |
-| <a id="figuresize"></a> `figureSize?` | `"small"` \| `"medium"` |
+| <a id="figuresize"></a> `figureSize?` | `"small" \| "medium"` |
 | <a id="figuretitle"></a> `figureTitle?` | `string` |
-| <a id="icon"></a> `icon?` | `ReactElement`\<`unknown`, `string` \| `JSXElementConstructor`\<`any`\>\> |
+| <a id="icon"></a> `icon?` | `ReactElement<unknown, string \| JSXElementConstructor<any>>` |
 | <a id="iconcolor"></a> `iconColor?` | `string` |
 | <a id="isactive"></a> `isActive?` | `boolean` |

package/api-docs/interfaces/ToastProps.mdx

@@ -3,12 +3,12 @@
 | Property | Type |
 | ------ | ------ |
 | <a id="classname"></a> `className?` | `string` |
-| <a id="colorscheme"></a> `colorScheme?` | `"dark"` \| `"light"` |
+| <a id="colorscheme"></a> `colorScheme?` | `"dark" \| "light"` |
 | <a id="enhancestart"></a> `enhanceStart?` | `ReactNode` |
 | <a id="isclickable"></a> `isClickable?` | `boolean` |
 | <a id="isdanger"></a> `isDanger?` | `boolean` |
 | <a id="isdisplayed"></a> `isDisplayed` | `boolean` |
 | <a id="message"></a> `message` | `ReactNode` |
-| <a id="ondismiss"></a> `onDismiss?` | () => `void` |
-| <a id="position"></a> `position?` | `"bottomCenter"` \| `"topCenter"` |
+| <a id="ondismiss"></a> `onDismiss?` | `() => void` |
+| <a id="position"></a> `position?` | `"bottomCenter" \| "topCenter"` |
 | <a id="timeout"></a> `timeout?` | `number` |

package/api-docs/interfaces/VideoHandle.mdx

@@ -2,5 +2,5 @@
 
 | Property | Type |
 | ------ | ------ |
-| <a id="resume"></a> `resume` | () => `void` |
-| <a id="focus"></a> `focus` | () => `void` |
+| <a id="resume"></a> `resume` | `() => void` |
+| <a id="focus"></a> `focus` | `() => void` |

package/api-docs/interfaces/WithTransitionProps.mdx

@@ -3,3 +3,4 @@
 | Property | Type |
 | ------ | ------ |
 | <a id="isvisible"></a> `isVisible` | `boolean` |
+| <a id="classname"></a> `className?` | `string` |

package/api-docs/type-aliases/ActivityCardAction.mdx

@@ -7,4 +7,4 @@ type ActivityCardAction = object;
 | Property | Type |
 | ------ | ------ |
 | <a id="label"></a> `label` | `string` |
-| <a id="action"></a> `action?` | () => `void` |
+| <a id="action"></a> `action?` | `() => void` |

package/api-docs/type-aliases/AriaMenuItem.mdx

@@ -11,7 +11,7 @@ The structure of a menu item that can be used to create a dropdown menu.
 | `key` | `string` | The unique key for the item. |
 | `label` | `React.ReactNode` | The label of the item. |
 | `testId?` | `string` | The test id for the item. |
-| `onItemClick()?` | () => `void` | If set, this function will be called when the user clicks this item. |
+| `onItemClick()?` | `() => void` | If set, this function will be called when the user clicks this item. |
 | `closeMenuOnItemClick?` | `boolean` | If set to false, the menu will not close when the user clicks this item. |
 | `icon?` | `React.ReactNode` | The icon to display next to the item. |
 | `alternativeHoverClassName?` | `string` | Class name that is used to override the default hover style. |
@@ -19,3 +19,6 @@ The structure of a menu item that can be used to create a dropdown menu.
 | `className?` | `string` | The class name for the item. |
 | `style?` | `CSSProperties` | The style for the item. |
 | `isActive?` | `boolean` | Sets the `data-active` attribute to `true` and applies styling |
+| `isDisabled?` | `boolean` | If set to true, the item will be disabled. |
+| `withTopDivider?` | `boolean` | If set to true, a divider will be rendered above the item. |
+| `withBottomDivider?` | `boolean` | If set to true, a divider will be rendered below the item. |

package/api-docs/type-aliases/AriaMenuProps.mdx

@@ -9,7 +9,7 @@ type AriaMenuProps = object;
 | <a id="items"></a> `items` | [`AriaMenuItem`](AriaMenuItem.mdx)[] | An array of menu items. |
 | <a id="button"></a> `button` | `ReactElement` | The react element that triggers the menu. |
 | <a id="headercontent"></a> `headerContent?` | `ReactElement` | Optional content to show above the menu items. |
-| <a id="onopenchange"></a> `onOpenChange?` | (`isOpen`) => `void` | Callback function called when the menu open state changes. |
+| <a id="onopenchange"></a> `onOpenChange?` | `(isOpen) => void` | Callback function called when the menu open state changes. |
 | <a id="testid"></a> `testId?` | `string` | The test id for the menu. |
 | <a id="colorscheme"></a> `colorScheme?` | [`ColorScheme`](ColorScheme.mdx) | The color scheme for the menu. |
 | <a id="popoverplacement"></a> `popoverPlacement?` | `Placement` | The placement of the popover. |

package/api-docs/type-aliases/BreadcrumbItem.mdx

@@ -6,6 +6,6 @@ type BreadcrumbItem = object;
 
 | Property | Type |
 | ------ | ------ |
-| <a id="action"></a> `action?` | () => `void` |
+| <a id="action"></a> `action?` | `() => void` |
 | <a id="label"></a> `label` | `string` |
 | <a id="url"></a> `url?` | `string` |

package/api-docs/type-aliases/ClickEventHandler.mdx

@@ -13,7 +13,7 @@ type ClickEventHandler<T, E> = (event) => void;
 
 | Parameter | Type |
 | ------ | ------ |
-| `event` | `React.SyntheticEvent`\<`T`, `E`\> |
+| `event` | `React.SyntheticEvent<T, E>` |
 
 ## Returns
 

package/api-docs/type-aliases/MenuAction.mdx

@@ -9,7 +9,7 @@ type MenuAction = object;
 | <a id="enhancerstart"></a> `enhancerStart?` | `React.ReactNode` |
 | <a id="isdisabled"></a> `isDisabled?` | `boolean` |
 | <a id="label"></a> `label` | `string` |
-| <a id="onclick"></a> `onClick?` | () => `void` |
+| <a id="onclick"></a> `onClick?` | `() => void` |
 | <a id="target"></a> `target?` | [`LinkTarget`](LinkTarget.mdx) |
 | <a id="testid"></a> `testId?` | `string` |
 | <a id="url"></a> `url?` | `string` |

package/api-docs/type-aliases/MenuItem.mdx

@@ -6,13 +6,13 @@ type MenuItem<T> = object;
 
 | Type Parameter | Default type |
 | ------ | ------ |
-| `T` *extends* `string` | `string` |
+| `T extends string` | `string` |
 
 ## Properties
 
 | Property | Type |
 | ------ | ------ |
-| <a id="clickaction"></a> `clickAction?` | `React.MouseEventHandler`\<`HTMLElement`\> |
+| <a id="clickaction"></a> `clickAction?` | `React.MouseEventHandler<HTMLElement>` |
 | <a id="colorscheme"></a> `colorScheme?` | [`ColorScheme`](ColorScheme.mdx) |
 | <a id="icon"></a> `icon?` | [`IconSource`](../interfaces/IconSource.mdx) |
 | <a id="iconcolor"></a> `iconColor?` | `string` |
@@ -22,7 +22,7 @@ type MenuItem<T> = object;
 | <a id="isdisabled"></a> `isDisabled?` | `boolean` |
 | <a id="isfixedicon"></a> `isFixedIcon?` | `boolean` |
 | <a id="label"></a> `label` | `React.ReactNode` |
-| <a id="linkwrapper"></a> `linkWrapper?` | (`{ children, }`) => `React.ReactElement` |
+| <a id="linkwrapper"></a> `linkWrapper?` | `({ children, }) => React.ReactElement` |
 | <a id="role"></a> `role?` | `React.AriaRole` |
 | <a id="target"></a> `target?` | [`LinkTarget`](LinkTarget.mdx) |
 | <a id="testid"></a> `testId?` | `string` |

package/api-docs/type-aliases/MultiselectOption.mdx

@@ -13,4 +13,4 @@ type MultiselectOption<T> = Option<T> & object;
 
 | Type Parameter | Default type |
 | ------ | ------ |
-| `T` *extends* `string` | `string` |
+| `T extends string` | `string` |

package/api-docs/type-aliases/NotificationToastMessage.mdx

@@ -15,4 +15,4 @@ type NotificationToastMessage = object;
 | <a id="position"></a> `position?` | [`ToastPosition`](ToastPosition.mdx) | - |
 | <a id="testid"></a> `testid?` | `string` | - |
 | <a id="timeout"></a> `timeout?` | `number` | - |
-| <a id="ondismiss"></a> `onDismiss?` | () => `void` | - |
+| <a id="ondismiss"></a> `onDismiss?` | `() => void` | - |

package/api-docs/type-aliases/NotificationTooltipPosition.mdx

@@ -9,5 +9,7 @@ type NotificationTooltipPosition =
   | "bottomCenter"
   | "bottomLeft"
   | "bottomStart"
-  | "bottomEnd";
+  | "bottomEnd"
+  | "left"
+  | "right";
 ```

package/api-docs/type-aliases/NotificationTooltipProps.mdx

@@ -0,0 +1,3 @@
+```ts
+type NotificationTooltipProps = React.ComponentProps<typeof NotificationTooltip>;
+```

package/api-docs/type-aliases/Option.mdx

@@ -6,7 +6,7 @@ type Option<T> = object;
 
 | Type Parameter | Default type |
 | ------ | ------ |
-| `T` *extends* `string` | `string` |
+| `T extends string` | `string` |
 
 ## Properties