@uniformdev/design-system 18.14.0 → 18.16.0

package/dist/esm/index.js

@@ -542,6 +542,16 @@ var fadeInBottom = keyframes`
     transform: translateY(0);
   }
 `;
+var fadeInTop = keyframes`
+  0% {
+    opacity: 0;
+    transform: translateY(-10px);
+  }
+  100% {
+    opacity: 1;
+    transform: translateY(0);
+  }
+`;
 var fadeOutBottom = keyframes`
   0% {
     opacity: 1;
@@ -8288,6 +8298,7 @@ import {
   MenuButton,
   useMenuState
 } from "reakit/Menu";
+import { Portal } from "reakit/Portal";
 
 // src/components/Menu/Menu.styles.ts
 import { css as css17 } from "@emotion/react";
@@ -8320,7 +8331,7 @@ var Menu = ({
   const menuState = useMenuState({ placement });
   return /* @__PURE__ */ jsxs10(MenuContext.Provider, { value: menuState, children: [
     /* @__PURE__ */ jsx19(MenuButton, { ...menuState, ref: menuTrigger.ref, ...menuTrigger.props, children: (triggerProps) => React6.cloneElement(menuTrigger, triggerProps) }),
-    /* @__PURE__ */ jsx19(
+    /* @__PURE__ */ jsx19(Portal, { children: /* @__PURE__ */ jsx19(
       BaseMenu,
       {
         ...menuState,
@@ -8332,7 +8343,7 @@ var Menu = ({
         className: typeof menuItemsContainerCssClasses === "string" ? menuItemsContainerCssClasses : "",
         children
       }
-    )
+    ) })
   ] });
 };
 
@@ -11583,6 +11594,7 @@ export {
   fadeInBottom,
   fadeInLtr,
   fadeInRtl,
+  fadeInTop,
   fadeOutBottom,
   growSubtle,
   input,

package/dist/index.d.ts

@@ -84,6 +84,11 @@ declare const growSubtle: _emotion_react.Keyframes;
  * @description - fades in an element from the Y axis by 10px
  */
 declare const fadeInBottom: _emotion_react.Keyframes;
+/**
+ * fadeInTop animation
+ * @description - fades in an element from the Y axis by -10px
+ */
+declare const fadeInTop: _emotion_react.Keyframes;
 /**
  * fadeOutBottom animation
  * @description - fades out an element from the Y axis by 10px
@@ -252,7 +257,7 @@ type ButtonProps = ButtonProps$1 & {
  * @param {BaseButtonProps} props - object of button props from reakit
  * @example <Button buttonType="secondary" size="md" onClick={() => alert('hello world')}>Click me</Button>
  */
-declare const Button: React$1.ForwardRefExoticComponent<Pick<ButtonProps, "form" | "slot" | "style" | "title" | "className" | "key" | "type" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "nonce" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "value" | "autoFocus" | "disabled" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "focusable" | "size" | "buttonType" | "unstable_system" | "unstable_clickOnEnter" | "unstable_clickOnSpace" | "wrapElement" | "rounded"> & React$1.RefAttributes<HTMLButtonElement>>;
+declare const Button: React$1.ForwardRefExoticComponent<Omit<ButtonProps, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
 
 type ButtonThemeProps = 'primary' | 'secondary' | 'unimportant' | 'ghost';
 interface ActionButtonsProps {
@@ -1099,13 +1104,13 @@ type TableCellDataProps = React$1.ComponentPropsWithoutRef<'td'>;
     </TableFoot>
   </Table>
  */
-declare const Table: React$1.ForwardRefExoticComponent<Pick<React$1.DetailedHTMLProps<React$1.TableHTMLAttributes<HTMLTableElement>, HTMLTableElement>, "key" | keyof React$1.TableHTMLAttributes<HTMLTableElement>> & React$1.RefAttributes<HTMLTableElement>>;
-declare const TableHead: React$1.ForwardRefExoticComponent<Pick<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "key" | keyof React$1.HTMLAttributes<HTMLTableSectionElement>> & React$1.RefAttributes<HTMLTableSectionElement>>;
-declare const TableBody: React$1.ForwardRefExoticComponent<Pick<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "key" | keyof React$1.HTMLAttributes<HTMLTableSectionElement>> & React$1.RefAttributes<HTMLTableSectionElement>>;
-declare const TableFoot: React$1.ForwardRefExoticComponent<Pick<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "key" | keyof React$1.HTMLAttributes<HTMLTableSectionElement>> & React$1.RefAttributes<HTMLTableSectionElement>>;
-declare const TableRow: React$1.ForwardRefExoticComponent<Pick<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>, "key" | keyof React$1.HTMLAttributes<HTMLTableRowElement>> & React$1.RefAttributes<HTMLTableRowElement>>;
-declare const TableCellHead: React$1.ForwardRefExoticComponent<Pick<React$1.DetailedHTMLProps<React$1.ThHTMLAttributes<HTMLTableHeaderCellElement>, HTMLTableHeaderCellElement>, "key" | keyof React$1.ThHTMLAttributes<HTMLTableHeaderCellElement>> & React$1.RefAttributes<HTMLTableCellElement>>;
-declare const TableCellData: React$1.ForwardRefExoticComponent<Pick<React$1.DetailedHTMLProps<React$1.TdHTMLAttributes<HTMLTableDataCellElement>, HTMLTableDataCellElement>, "key" | keyof React$1.TdHTMLAttributes<HTMLTableDataCellElement>> & React$1.RefAttributes<HTMLTableCellElement>>;
+declare const Table: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.TableHTMLAttributes<HTMLTableElement>, HTMLTableElement>, "ref"> & React$1.RefAttributes<HTMLTableElement>>;
+declare const TableHead: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & React$1.RefAttributes<HTMLTableSectionElement>>;
+declare const TableBody: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & React$1.RefAttributes<HTMLTableSectionElement>>;
+declare const TableFoot: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & React$1.RefAttributes<HTMLTableSectionElement>>;
+declare const TableRow: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>, "ref"> & React$1.RefAttributes<HTMLTableRowElement>>;
+declare const TableCellHead: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.ThHTMLAttributes<HTMLTableHeaderCellElement>, HTMLTableHeaderCellElement>, "ref"> & React$1.RefAttributes<HTMLTableCellElement>>;
+declare const TableCellData: React$1.ForwardRefExoticComponent<Omit<React$1.DetailedHTMLProps<React$1.TdHTMLAttributes<HTMLTableDataCellElement>, HTMLTableDataCellElement>, "ref"> & React$1.RefAttributes<HTMLTableCellElement>>;
 
 declare const useCurrentTab: () => TabState;
 interface TabsProps {
@@ -1320,7 +1325,7 @@ type LinkProps = React$1.AnchorHTMLAttributes<HTMLAnchorElement> & {
 /** Uniform Link Component
  * @example <Link text="my link" href="#" />
  */
-declare const Link: React$1.ForwardRefExoticComponent<Pick<LinkProps, "text" | "external" | "linkColor" | keyof React$1.AnchorHTMLAttributes<HTMLAnchorElement>> & React$1.RefAttributes<HTMLAnchorElement>>;
+declare const Link: React$1.ForwardRefExoticComponent<Omit<LinkProps, "ref"> & React$1.RefAttributes<HTMLAnchorElement>>;
 type LinkManagerWithRefType = (props: Partial<LinkProps> & {
     as?: string;
     href: string;
@@ -1331,7 +1336,7 @@ type LinkManagerWithRefType = (props: Partial<LinkProps> & {
  * We recommend using this link `next/link`
  * @example <LinkWithRef linkManagerComponent={NextLink} href="some-url" text="my link" />
  */
-declare const LinkWithRef: React$1.ForwardRefExoticComponent<Pick<React$1.AnchorHTMLAttributes<HTMLAnchorElement> & {
+declare const LinkWithRef: React$1.ForwardRefExoticComponent<Omit<React$1.AnchorHTMLAttributes<HTMLAnchorElement> & {
     /** sets the link text and title text */
     text: string;
     /** (optional) sets the link color
@@ -1348,7 +1353,7 @@ declare const LinkWithRef: React$1.ForwardRefExoticComponent<Pick<React$1.Anchor
     href: string;
     as?: string | undefined;
     linkManagerComponent: LinkManagerWithRefType;
-}, "text" | "as" | "external" | "linkColor" | keyof React$1.AnchorHTMLAttributes<HTMLAnchorElement> | "linkManagerComponent"> & React$1.RefAttributes<HTMLAnchorElement>>;
+}, "ref"> & React$1.RefAttributes<HTMLAnchorElement>>;
 
 interface RouteProps {
     as: string;
@@ -1387,4 +1392,4 @@ type StatusBulletProps = React$1.HTMLAttributes<HTMLSpanElement> & {
 };
 declare const StatusBullet: ({ status, hideText, message, ...props }: StatusBulletProps) => _emotion_react_types_jsx_namespace.EmotionJSX.Element;
 
-export { ActionButtonsProps, AddButton, AddButtonProps, AddListButton, AddListButtonProps, AddListButtonThemeProps, AnimationFile, AnimationFileProps, ArrowPositionProps, Badge, BadgeProps, BoxHeightProps, BreakpointSize, BreakpointsMap, Button, ButtonProps, ButtonSizeProps, ButtonThemeProps$1 as ButtonThemeProps, ButtonWithMenu, ButtonWithMenuProps, Callout, CalloutProps, CalloutType, Caption, CaptionProps, Card, CardContainer, CardContainerBgColorProps, CardContainerProps, CardProps, CheckboxWithInfo, CheckboxWithInforProps, ChildFunction, ComboBoxGroupBase, Counter, CounterProps, CreateTeamIntegrationTile, CreateTeamIntegrationTileProps, DashedBox, DashedBoxProps, Details, DetailsProps, Drawer, DrawerContextValue, DrawerItem, DrawerProps, DrawerProvider, DrawerRenderer, DrawerRendererItemProps, DrawerRendererProps, EditTeamIntegrationTile, EditTeamIntegrationTileProps, ErrorMessage, ErrorMessageProps, Fieldset, FieldsetProps, Heading, HeadingProps, HexModalBackground, Icon, IconColor, IconName, IconProps, IconType, IconsProvider, InlineAlert, InlineAlertProps, Input, InputComboBox, InputComboBoxOption, InputComboBoxProps, InputInlineSelect, InputInlineSelectOption, InputInlineSelectProps, InputKeywordSearch, InputKeywordSearchProps, InputProps, InputSelect, InputSelectProps, InputToggle, InputToggleProps, IntegrationComingSoon, IntegrationComingSoonProps, IntegrationHeaderSection, IntegrationHeaderSectionProps, IntegrationLoadingTile, IntegrationLoadingTileProps, IntegrationModalHeader, IntegrationModalHeaderProps, IntegrationModalIcon, IntegrationModalIconProps, IntegrationTile, IntegrationTileProps, Label, LabelProps, Legend, LegendProps, LevelProps, LimitsBar, LimitsBarProps, Link, LinkColorProps, LinkList, LinkListProps, LinkManagerWithRefType, LinkProps, LinkWithRef, LoadingIcon, LoadingIconProps, LoadingIndicator, LoadingOverlay, LoadingOverlayProps, LottieFile, LottieFileKeyProps, LottieFileProps, Menu, MenuContext, MenuItem, MenuItemProps, MenuItemSeparator, MenuItemTextThemeProps, MenuProps, PageHeaderSection, PageHeaderSectionProps, Paragraph, ParagraphProps, RegisterDrawerProps, ResolveIcon, ResolveIconProps, ScrollableItemProps, ScrollableList, ScrollableListInputItem, ScrollableListItem, ScrollableListItemProps, ScrollableListProps, ShortcutContext, ShortcutRevealer, Skeleton, SkeletonProps, StatusBullet, StatusBulletProps, StatusTypeProps, Switch, SwitchProps, TabButton, TabButtonGroup, TabButtonProps, TabContent, TabContentProps, Table, TableBody, TableBodyProps, TableCellData, TableCellDataProps, TableCellHead, TableCellHeadProps, TableFoot, TableFootProps, TableHead, TableHeadProps, TableProps, TableRow, TableRowProps, Tabs, TabsProps, TextAlignProps, Textarea, TextareaProps, Theme, ThemeProps, TileContainer, TileContainerProps, Tooltip, TooltipProps, UniformBadge, UniformLogo, UniformLogoProps, UseShortcutOptions, WarningMessage, WarningMessageProps, breakpoints, button, buttonGhost, buttonGhostDestructive, buttonPrimary, buttonRippleEffect, buttonSecondary, buttonSecondaryInvert, buttonTertiary, buttonUnimportant, fadeIn, fadeInBottom, fadeInLtr, fadeInRtl, fadeOutBottom, growSubtle, input, inputError, inputSelect, isMacLike, labelText, macifyShortcut, mq, ripple, scrollbarStyles, skeletonLoading, supports, useBreakpoint, useCurrentTab, useDrawer, useIconContext, useMenuContext, useOutsideClick, useShortcut };
+export { ActionButtonsProps, AddButton, AddButtonProps, AddListButton, AddListButtonProps, AddListButtonThemeProps, AnimationFile, AnimationFileProps, ArrowPositionProps, Badge, BadgeProps, BoxHeightProps, BreakpointSize, BreakpointsMap, Button, ButtonProps, ButtonSizeProps, ButtonThemeProps$1 as ButtonThemeProps, ButtonWithMenu, ButtonWithMenuProps, Callout, CalloutProps, CalloutType, Caption, CaptionProps, Card, CardContainer, CardContainerBgColorProps, CardContainerProps, CardProps, CheckboxWithInfo, CheckboxWithInforProps, ChildFunction, ComboBoxGroupBase, Counter, CounterProps, CreateTeamIntegrationTile, CreateTeamIntegrationTileProps, DashedBox, DashedBoxProps, Details, DetailsProps, Drawer, DrawerContextValue, DrawerItem, DrawerProps, DrawerProvider, DrawerRenderer, DrawerRendererItemProps, DrawerRendererProps, EditTeamIntegrationTile, EditTeamIntegrationTileProps, ErrorMessage, ErrorMessageProps, Fieldset, FieldsetProps, Heading, HeadingProps, HexModalBackground, Icon, IconColor, IconName, IconProps, IconType, IconsProvider, InlineAlert, InlineAlertProps, Input, InputComboBox, InputComboBoxOption, InputComboBoxProps, InputInlineSelect, InputInlineSelectOption, InputInlineSelectProps, InputKeywordSearch, InputKeywordSearchProps, InputProps, InputSelect, InputSelectProps, InputToggle, InputToggleProps, IntegrationComingSoon, IntegrationComingSoonProps, IntegrationHeaderSection, IntegrationHeaderSectionProps, IntegrationLoadingTile, IntegrationLoadingTileProps, IntegrationModalHeader, IntegrationModalHeaderProps, IntegrationModalIcon, IntegrationModalIconProps, IntegrationTile, IntegrationTileProps, Label, LabelProps, Legend, LegendProps, LevelProps, LimitsBar, LimitsBarProps, Link, LinkColorProps, LinkList, LinkListProps, LinkManagerWithRefType, LinkProps, LinkWithRef, LoadingIcon, LoadingIconProps, LoadingIndicator, LoadingOverlay, LoadingOverlayProps, LottieFile, LottieFileKeyProps, LottieFileProps, Menu, MenuContext, MenuItem, MenuItemProps, MenuItemSeparator, MenuItemTextThemeProps, MenuProps, PageHeaderSection, PageHeaderSectionProps, Paragraph, ParagraphProps, RegisterDrawerProps, ResolveIcon, ResolveIconProps, ScrollableItemProps, ScrollableList, ScrollableListInputItem, ScrollableListItem, ScrollableListItemProps, ScrollableListProps, ShortcutContext, ShortcutRevealer, Skeleton, SkeletonProps, StatusBullet, StatusBulletProps, StatusTypeProps, Switch, SwitchProps, TabButton, TabButtonGroup, TabButtonProps, TabContent, TabContentProps, Table, TableBody, TableBodyProps, TableCellData, TableCellDataProps, TableCellHead, TableCellHeadProps, TableFoot, TableFootProps, TableHead, TableHeadProps, TableProps, TableRow, TableRowProps, Tabs, TabsProps, TextAlignProps, Textarea, TextareaProps, Theme, ThemeProps, TileContainer, TileContainerProps, Tooltip, TooltipProps, UniformBadge, UniformLogo, UniformLogoProps, UseShortcutOptions, WarningMessage, WarningMessageProps, breakpoints, button, buttonGhost, buttonGhostDestructive, buttonPrimary, buttonRippleEffect, buttonSecondary, buttonSecondaryInvert, buttonTertiary, buttonUnimportant, fadeIn, fadeInBottom, fadeInLtr, fadeInRtl, fadeInTop, fadeOutBottom, growSubtle, input, inputError, inputSelect, isMacLike, labelText, macifyShortcut, mq, ripple, scrollbarStyles, skeletonLoading, supports, useBreakpoint, useCurrentTab, useDrawer, useIconContext, useMenuContext, useOutsideClick, useShortcut };

package/dist/index.js

@@ -121,6 +121,7 @@ __export(src_exports, {
   fadeInBottom: () => fadeInBottom,
   fadeInLtr: () => fadeInLtr,
   fadeInRtl: () => fadeInRtl,
+  fadeInTop: () => fadeInTop,
   fadeOutBottom: () => fadeOutBottom,
   growSubtle: () => growSubtle,
   input: () => input,
@@ -688,6 +689,16 @@ var fadeInBottom = import_react5.keyframes`
     transform: translateY(0);
   }
 `;
+var fadeInTop = import_react5.keyframes`
+  0% {
+    opacity: 0;
+    transform: translateY(-10px);
+  }
+  100% {
+    opacity: 1;
+    transform: translateY(0);
+  }
+`;
 var fadeOutBottom = import_react5.keyframes`
   0% {
     opacity: 1;
@@ -8430,6 +8441,7 @@ var import_cg5 = require("react-icons/cg");
 // src/components/Menu/Menu.tsx
 var React6 = __toESM(require("react"));
 var import_Menu = require("reakit/Menu");
+var import_Portal = require("reakit/Portal");
 
 // src/components/Menu/Menu.styles.ts
 var import_react24 = require("@emotion/react");
@@ -8462,7 +8474,7 @@ var Menu = ({
   const menuState = (0, import_Menu.useMenuState)({ placement });
   return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(MenuContext.Provider, { value: menuState, children: [
     /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_Menu.MenuButton, { ...menuState, ref: menuTrigger.ref, ...menuTrigger.props, children: (triggerProps) => React6.cloneElement(menuTrigger, triggerProps) }),
-    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_Portal.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
       import_Menu.Menu,
       {
         ...menuState,
@@ -8474,7 +8486,7 @@ var Menu = ({
         className: typeof menuItemsContainerCssClasses === "string" ? menuItemsContainerCssClasses : "",
         children
       }
-    )
+    ) })
   ] });
 };
 
@@ -11716,6 +11728,7 @@ var StatusBullet = ({ status, hideText = false, message, ...props }) => {
   fadeInBottom,
   fadeInLtr,
   fadeInRtl,
+  fadeInTop,
   fadeOutBottom,
   growSubtle,
   input,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniformdev/design-system",
-  "version": "18.14.0",
+  "version": "18.16.0",
   "description": "Uniform design system components",
   "license": "SEE LICENSE IN LICENSE.txt",
   "main": "./dist/index.js",
@@ -20,7 +20,7 @@
     "@emotion/jest": "11.10.5",
     "@storybook/addon-docs": "6.5.16",
     "@storybook/react": "6.5.16",
-    "@types/react": "18.0.27",
+    "@types/react": "18.0.28",
     "autoprefixer": "10.4.13",
     "hygen": "6.2.11",
     "postcss": "8.4.21",
@@ -49,5 +49,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "43f1f11d6986b7b94c3287e8cc4b800937edb805"
+  "gitHead": "debae7a8698824593e47c8886dcd6a5d4c4727a7"
 }