@synerise/ds-dropdown 1.0.33 → 1.1.0

package/dist/hooks/useDropdownVisibility.js

@@ -0,0 +1,40 @@
+import { useCallback, useEffect, useRef, useState } from 'react';
+export var useDropdownVisibility = function useDropdownVisibility(_ref) {
+  var open = _ref.open,
+    onOpenChange = _ref.onOpenChange;
+  var _useState = useState(open),
+    internalOpen = _useState[0],
+    setInternalOpen = _useState[1];
+  var skipDuplicates = useRef(0);
+  var controlledComponent = open !== undefined;
+  var actualOpen = controlledComponent ? open : internalOpen;
+  useEffect(function () {
+    skipDuplicates.current = 0;
+  }, [internalOpen]);
+  useEffect(function () {
+    if (controlledComponent && open !== internalOpen) {
+      if (skipDuplicates.current === 0) {
+        skipDuplicates.current += 1;
+        onOpenChange == null || onOpenChange(open);
+      }
+      setInternalOpen(open);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [controlledComponent, open]);
+  var toggleOpen = useCallback(function (openState) {
+    if (openState !== internalOpen) {
+      setInternalOpen(openState);
+    }
+    // PopupTrigger fires toggleOpen onClick
+    // the trigger in the implementation may or may not have an onClick that changes `open` state
+    // this prevents duplicated onOpenChange calls if both have onClicks defined
+    if (skipDuplicates.current === 0) {
+      skipDuplicates.current += 1;
+      onOpenChange == null || onOpenChange(openState);
+    }
+  }, [internalOpen, onOpenChange]);
+  return {
+    toggleOpen: toggleOpen,
+    open: actualOpen
+  };
+};

package/dist/index.d.ts

@@ -1 +1,9 @@
-export { default, type DropdownProps } from './Dropdown';
+export { default, Dropdown } from './Dropdown';
+export { DropdownMenu } from './components/DropdownMenu/DropdownMenu';
+export { DropdownOverlay } from './components/DropdownOverlay/DropdownOverlay';
+export { TextTrigger } from './components/TextTrigger/TextTrigger';
+export { BackAction } from './components/BackAction/BackAction';
+export { BottomAction } from './components/BottomAction/BottomAction';
+export type { DropdownPlacement, DropdownProps, DropdownSharedProps, DropdownSize, } from './Dropdown.types';
+export { type DropdownMenuProps } from './components/DropdownMenu/DropdownMenu.types';
+export { type DropdownMenuListItemProps } from './components/DropdownMenuList/DropdownMenuList.types';

package/dist/index.js

@@ -1 +1,6 @@
-export { default } from './Dropdown';
+export { default, Dropdown } from './Dropdown';
+export { DropdownMenu } from './components/DropdownMenu/DropdownMenu';
+export { DropdownOverlay } from './components/DropdownOverlay/DropdownOverlay';
+export { TextTrigger } from './components/TextTrigger/TextTrigger';
+export { BackAction } from './components/BackAction/BackAction';
+export { BottomAction } from './components/BottomAction/BottomAction';

package/dist/utils/getDropdownWidth.d.ts

@@ -0,0 +1,2 @@
+import { type DropdownSize } from '../Dropdown.types';
+export declare const getDropdownWidth: (size?: DropdownSize | number) => number | null;

package/dist/utils/getDropdownWidth.js

@@ -0,0 +1,18 @@
+export var getDropdownWidth = function getDropdownWidth(size) {
+  if (typeof size === 'number') {
+    return size;
+  }
+  switch (size) {
+    case 'small':
+      return 216;
+    case 'large':
+      return 588;
+    case 'medium':
+      return 282;
+    case 'auto':
+    case 'match-trigger':
+    case 'min-match-trigger':
+    default:
+      return null;
+  }
+};

package/dist/utils/getPlacement.d.ts

@@ -0,0 +1,3 @@
+import { type Placement } from '@floating-ui/react';
+import { type DropdownPlacement } from '../Dropdown.types';
+export declare const getPlacement: (placement: DropdownPlacement) => Placement;

package/dist/utils/getPlacement.js

@@ -0,0 +1,4 @@
+import { PLACEMENT_MAP } from '../Dropdown.const';
+export var getPlacement = function getPlacement(placement) {
+  return PLACEMENT_MAP[placement];
+};

package/dist/utils/getTransitionConfig.d.ts

@@ -0,0 +1,4 @@
+import { type Placement, type UseTransitionStylesProps } from '@floating-ui/react';
+export declare const getTransitionConfig: ({ placement, }: {
+    placement: Placement;
+}) => Partial<UseTransitionStylesProps>;

package/dist/utils/getTransitionConfig.js

@@ -0,0 +1,15 @@
+export var getTransitionConfig = function getTransitionConfig(_ref) {
+  var placement = _ref.placement;
+  var isTop = placement.indexOf('top');
+  return {
+    open: {
+      transform: 'scaleY(1)'
+    },
+    initial: {
+      transform: 'scaleY(0)'
+    },
+    common: {
+      transformOrigin: isTop ? 'top' : 'bottom'
+    }
+  };
+};

package/dist/utils/index.d.ts

@@ -0,0 +1,4 @@
+export * from './getPlacement';
+export * from './getTransitionConfig';
+export * from './isSplitFooter';
+export * from './getDropdownWidth';

package/dist/utils/index.js

@@ -0,0 +1,4 @@
+export * from './getPlacement';
+export * from './getTransitionConfig';
+export * from './isSplitFooter';
+export * from './getDropdownWidth';

package/dist/utils/isSplitFooter.d.ts

@@ -0,0 +1,2 @@
+import type { DropdownFooterProps, DropdownFooterSplit } from '../components/DropdownFooter/DropdownFooter.types';
+export declare const isSplitFooter: (footer: DropdownFooterProps["footer"]) => footer is DropdownFooterSplit;

package/dist/utils/isSplitFooter.js

@@ -0,0 +1,3 @@
+export var isSplitFooter = function isSplitFooter(footer) {
+  return !!(footer && typeof footer === 'object' && ('left' in footer || 'right' in footer));
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synerise/ds-dropdown",
-  "version": "1.0.33",
+  "version": "1.1.0",
   "description": "Dropdown UI Component for the Synerise Design System",
   "license": "ISC",
   "repository": "synerise/synerise-design",
@@ -35,17 +35,25 @@
   ],
   "types": "dist/index.d.ts",
   "dependencies": {
-    "@synerise/ds-divider": "^1.2.0",
-    "@synerise/ds-icon": "^1.7.3",
-    "@synerise/ds-search-bar": "^1.3.18",
-    "@synerise/ds-typography": "^1.0.22",
-    "@synerise/ds-utils": "^1.5.0"
+    "@floating-ui/react": "^0.27.13",
+    "@synerise/ds-divider": "^1.2.1",
+    "@synerise/ds-empty-states": "^1.0.21",
+    "@synerise/ds-icon": "^1.8.0",
+    "@synerise/ds-list-item": "^1.2.0",
+    "@synerise/ds-popover": "^1.1.0",
+    "@synerise/ds-scrollbar": "^1.2.0",
+    "@synerise/ds-search-bar": "^1.4.0",
+    "@synerise/ds-tooltip": "^1.3.0",
+    "@synerise/ds-typography": "^1.0.23",
+    "@synerise/ds-utils": "^1.5.0",
+    "classnames": "^2.2.6",
+    "react-window": "^1.8.11"
   },
   "peerDependencies": {
     "@synerise/ds-core": "*",
-    "antd": "4.24.16",
     "react": ">=16.9.0 <= 18.3.1",
+    "react-intl": "^6.8.7",
     "styled-components": "^5.3.3"
   },
-  "gitHead": "a40fca2cc78eda64afa96d18dc4d177538a22404"
+  "gitHead": "cbbb7d9f155735bcc4035d8fd8a7813878d6e051"
 }

package/dist/elements/BackAction/BackAction.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import { type Props } from './BackAction.types';
-declare const BackAction: ({ label, onClick, tooltip, tooltipProps }: Props) => React.JSX.Element;
-export default BackAction;

package/dist/elements/BottomAction/BottomAction.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import { type BottomActionProps } from './BottomAction.types';
-declare const BottomAction: ({ onClickAction, children, icon, ...rest }: BottomActionProps) => React.JSX.Element;
-export default BottomAction;

package/dist/elements/TextTrigger/TextTrigger.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import { type TextTriggerProps } from './TextTrigger.types';
-declare const TextTrigger: React.FC<TextTriggerProps>;
-export default TextTrigger;

package/dist/style/index.css

@@ -1 +0,0 @@
-.ant-dropdown-menu-item.ant-dropdown-menu-item-danger{color:#f52922}.ant-dropdown-menu-item.ant-dropdown-menu-item-danger:hover{color:#fff;background-color:#f52922}.ant-dropdown{box-sizing:border-box;margin:0;padding:0;color:#6a7580;font-size:13px;font-variant:tabular-nums;line-height:1.38;list-style:none;font-feature-settings:'tnum';position:absolute;top:-9999px;left:-9999px;z-index:991050;display:block}.ant-dropdown::before{position:absolute;top:-4px;right:0;bottom:-4px;left:-7px;z-index:-9999;opacity:.0001;content:' '}.ant-dropdown-wrap{position:relative}.ant-dropdown-wrap .ant-btn>.anticon-down{font-size:10px}.ant-dropdown-wrap .anticon-down::before{transition:transform .2s}.ant-dropdown-wrap-open .anticon-down::before{transform:rotate(180deg)}.ant-dropdown-hidden,.ant-dropdown-menu-hidden,.ant-dropdown-menu-submenu-hidden{display:none}.ant-dropdown-show-arrow.ant-dropdown-placement-top,.ant-dropdown-show-arrow.ant-dropdown-placement-topLeft,.ant-dropdown-show-arrow.ant-dropdown-placement-topRight{padding-bottom:9px}.ant-dropdown-show-arrow.ant-dropdown-placement-bottom,.ant-dropdown-show-arrow.ant-dropdown-placement-bottomLeft,.ant-dropdown-show-arrow.ant-dropdown-placement-bottomRight{padding-top:9px}.ant-dropdown-arrow{position:absolute;z-index:1;display:block;width:5px;height:5px;border-radius:0 0 2px;pointer-events:none}.ant-dropdown-arrow::before{position:absolute;top:-5px;left:-5px;width:15px;height:15px;background:#fff;background-repeat:no-repeat;background-position:-4px -4px;content:'';clip-path:inset(33% 33%);clip-path:path('M 3.5355339059327373 11.464466094067262 A 5 5 0 0 1 7.071067811865475 10 L 8 10 A 2 2 0 0 0 10 8 L 10 7.071067811865475 A 5 5 0 0 1 11.464466094067262 3.5355339059327373 L 10.464466094067262 3.5355339059327373 L 3.5355339059327373 10.464466094067262 Z')}.ant-dropdown-placement-top>.ant-dropdown-arrow,.ant-dropdown-placement-topLeft>.ant-dropdown-arrow,.ant-dropdown-placement-topRight>.ant-dropdown-arrow{bottom:5.53553391px;box-shadow:3px 3px 7px -3px rgba(0,0,0,.1);transform:rotate(45deg)}.ant-dropdown-placement-top>.ant-dropdown-arrow{left:50%;transform:translateX(-50%) rotate(45deg)}.ant-dropdown-placement-topLeft>.ant-dropdown-arrow{left:16px}.ant-dropdown-placement-topRight>.ant-dropdown-arrow{right:16px}.ant-dropdown-placement-bottom>.ant-dropdown-arrow,.ant-dropdown-placement-bottomLeft>.ant-dropdown-arrow,.ant-dropdown-placement-bottomRight>.ant-dropdown-arrow{top:4.94974747px;box-shadow:2px 2px 5px -2px rgba(0,0,0,.1);transform:rotate(-135deg) translateY(-.5px)}.ant-dropdown-placement-bottom>.ant-dropdown-arrow{left:50%;transform:translateX(-50%) rotate(-135deg) translateY(-.5px)}.ant-dropdown-placement-bottomLeft>.ant-dropdown-arrow{left:16px}.ant-dropdown-placement-bottomRight>.ant-dropdown-arrow{right:16px}.ant-dropdown-menu{position:relative;margin:0;padding:4px 0;text-align:left;list-style-type:none;background-color:#fff;background-clip:padding-box;border-radius:3px;outline:0;box-shadow:0 2px 6px rgba(171,178,183,.12)}.ant-dropdown-menu-item-group-title{padding:5px 16px;color:#232936;transition:all .3s}.ant-dropdown-menu-submenu-popup{position:absolute;z-index:991050;background:0 0;box-shadow:none;transform-origin:0 0}.ant-dropdown-menu-submenu-popup li,.ant-dropdown-menu-submenu-popup ul{list-style:none}.ant-dropdown-menu-submenu-popup ul{margin-right:.3em;margin-left:.3em}.ant-dropdown-menu-item{position:relative;display:flex;align-items:center}.ant-dropdown-menu-item-icon{min-width:12px;margin-right:8px;font-size:11px}.ant-dropdown-menu-title-content{flex:auto}.ant-dropdown-menu-title-content>a{color:inherit;transition:all .3s}.ant-dropdown-menu-title-content>a:hover{color:inherit}.ant-dropdown-menu-title-content>a::after{position:absolute;top:0;right:0;bottom:0;left:0;content:''}.ant-dropdown-menu-item,.ant-dropdown-menu-submenu-title{clear:both;margin:0;padding:5px 16px;color:#6a7580;font-weight:400;font-size:13px;line-height:22px;cursor:pointer;transition:all .3s}.ant-dropdown-menu-item-selected,.ant-dropdown-menu-submenu-title-selected{color:#0b68ff;background-color:#d9eeff}.ant-dropdown-menu-item.ant-dropdown-menu-item-active,.ant-dropdown-menu-item.ant-dropdown-menu-submenu-title-active,.ant-dropdown-menu-item:hover,.ant-dropdown-menu-submenu-title.ant-dropdown-menu-item-active,.ant-dropdown-menu-submenu-title.ant-dropdown-menu-submenu-title-active,.ant-dropdown-menu-submenu-title:hover{background-color:#f4faff}.ant-dropdown-menu-item.ant-dropdown-menu-item-disabled,.ant-dropdown-menu-item.ant-dropdown-menu-submenu-title-disabled,.ant-dropdown-menu-submenu-title.ant-dropdown-menu-item-disabled,.ant-dropdown-menu-submenu-title.ant-dropdown-menu-submenu-title-disabled{color:#b5bdc3;cursor:not-allowed}.ant-dropdown-menu-item.ant-dropdown-menu-item-disabled:hover,.ant-dropdown-menu-item.ant-dropdown-menu-submenu-title-disabled:hover,.ant-dropdown-menu-submenu-title.ant-dropdown-menu-item-disabled:hover,.ant-dropdown-menu-submenu-title.ant-dropdown-menu-submenu-title-disabled:hover{color:#b5bdc3;background-color:#fff;cursor:not-allowed}.ant-dropdown-menu-item.ant-dropdown-menu-item-disabled a,.ant-dropdown-menu-item.ant-dropdown-menu-submenu-title-disabled a,.ant-dropdown-menu-submenu-title.ant-dropdown-menu-item-disabled a,.ant-dropdown-menu-submenu-title.ant-dropdown-menu-submenu-title-disabled a{pointer-events:none}.ant-dropdown-menu-item-divider,.ant-dropdown-menu-submenu-title-divider{height:1px;margin:4px 0;overflow:hidden;line-height:0;background-color:#e9edee}.ant-dropdown-menu-item .ant-dropdown-menu-submenu-expand-icon,.ant-dropdown-menu-submenu-title .ant-dropdown-menu-submenu-expand-icon{position:absolute;right:8px}.ant-dropdown-menu-item .ant-dropdown-menu-submenu-expand-icon .ant-dropdown-menu-submenu-arrow-icon,.ant-dropdown-menu-submenu-title .ant-dropdown-menu-submenu-expand-icon .ant-dropdown-menu-submenu-arrow-icon{margin-right:0!important;color:#232936;font-size:10px;font-style:normal}.ant-dropdown-menu-item-group-list{margin:0 8px;padding:0;list-style:none}.ant-dropdown-menu-submenu-title{padding-right:27px}.ant-dropdown-menu-submenu-vertical{position:relative}.ant-dropdown-menu-submenu-vertical>.ant-dropdown-menu{position:absolute;top:0;left:100%;min-width:100%;margin-left:4px;transform-origin:0 0}.ant-dropdown-menu-submenu.ant-dropdown-menu-submenu-disabled .ant-dropdown-menu-submenu-title,.ant-dropdown-menu-submenu.ant-dropdown-menu-submenu-disabled .ant-dropdown-menu-submenu-title .ant-dropdown-menu-submenu-arrow-icon{color:#b5bdc3;background-color:#fff;cursor:not-allowed}.ant-dropdown-menu-submenu-selected .ant-dropdown-menu-submenu-title{color:#0b68ff}.ant-dropdown.ant-slide-down-appear.ant-slide-down-appear-active.ant-dropdown-placement-bottom,.ant-dropdown.ant-slide-down-appear.ant-slide-down-appear-active.ant-dropdown-placement-bottomLeft,.ant-dropdown.ant-slide-down-appear.ant-slide-down-appear-active.ant-dropdown-placement-bottomRight,.ant-dropdown.ant-slide-down-enter.ant-slide-down-enter-active.ant-dropdown-placement-bottom,.ant-dropdown.ant-slide-down-enter.ant-slide-down-enter-active.ant-dropdown-placement-bottomLeft,.ant-dropdown.ant-slide-down-enter.ant-slide-down-enter-active.ant-dropdown-placement-bottomRight{animation-name:antSlideUpIn}.ant-dropdown.ant-slide-up-appear.ant-slide-up-appear-active.ant-dropdown-placement-top,.ant-dropdown.ant-slide-up-appear.ant-slide-up-appear-active.ant-dropdown-placement-topLeft,.ant-dropdown.ant-slide-up-appear.ant-slide-up-appear-active.ant-dropdown-placement-topRight,.ant-dropdown.ant-slide-up-enter.ant-slide-up-enter-active.ant-dropdown-placement-top,.ant-dropdown.ant-slide-up-enter.ant-slide-up-enter-active.ant-dropdown-placement-topLeft,.ant-dropdown.ant-slide-up-enter.ant-slide-up-enter-active.ant-dropdown-placement-topRight{animation-name:antSlideDownIn}.ant-dropdown.ant-slide-down-leave.ant-slide-down-leave-active.ant-dropdown-placement-bottom,.ant-dropdown.ant-slide-down-leave.ant-slide-down-leave-active.ant-dropdown-placement-bottomLeft,.ant-dropdown.ant-slide-down-leave.ant-slide-down-leave-active.ant-dropdown-placement-bottomRight{animation-name:antSlideUpOut}.ant-dropdown.ant-slide-up-leave.ant-slide-up-leave-active.ant-dropdown-placement-top,.ant-dropdown.ant-slide-up-leave.ant-slide-up-leave-active.ant-dropdown-placement-topLeft,.ant-dropdown.ant-slide-up-leave.ant-slide-up-leave-active.ant-dropdown-placement-topRight{animation-name:antSlideDownOut}.ant-dropdown-button>.anticon.anticon-down,.ant-dropdown-link>.anticon.anticon-down,.ant-dropdown-trigger>.anticon.anticon-down{font-size:10px;vertical-align:baseline}.ant-dropdown-button{white-space:nowrap}.ant-dropdown-button.ant-btn-group>.ant-btn-loading,.ant-dropdown-button.ant-btn-group>.ant-btn-loading+.ant-btn{cursor:default;pointer-events:none}.ant-dropdown-button.ant-btn-group>.ant-btn-loading+.ant-btn::before{display:block}.ant-dropdown-button.ant-btn-group>.ant-btn:last-child:not(:first-child):not(.ant-btn-icon-only){padding-right:8px;padding-left:8px}.ant-dropdown-menu-dark,.ant-dropdown-menu-dark .ant-dropdown-menu{background:#001529}.ant-dropdown-menu-dark .ant-dropdown-menu-item,.ant-dropdown-menu-dark .ant-dropdown-menu-item>.anticon+span>a,.ant-dropdown-menu-dark .ant-dropdown-menu-item>a,.ant-dropdown-menu-dark .ant-dropdown-menu-submenu-title{color:#f9fafb}.ant-dropdown-menu-dark .ant-dropdown-menu-item .ant-dropdown-menu-submenu-arrow::after,.ant-dropdown-menu-dark .ant-dropdown-menu-item>.anticon+span>a .ant-dropdown-menu-submenu-arrow::after,.ant-dropdown-menu-dark .ant-dropdown-menu-item>a .ant-dropdown-menu-submenu-arrow::after,.ant-dropdown-menu-dark .ant-dropdown-menu-submenu-title .ant-dropdown-menu-submenu-arrow::after{color:#f9fafb}.ant-dropdown-menu-dark .ant-dropdown-menu-item:hover,.ant-dropdown-menu-dark .ant-dropdown-menu-item>.anticon+span>a:hover,.ant-dropdown-menu-dark .ant-dropdown-menu-item>a:hover,.ant-dropdown-menu-dark .ant-dropdown-menu-submenu-title:hover{color:#fff;background:0 0}.ant-dropdown-menu-dark .ant-dropdown-menu-item-selected,.ant-dropdown-menu-dark .ant-dropdown-menu-item-selected:hover,.ant-dropdown-menu-dark .ant-dropdown-menu-item-selected>a{color:#fff;background:#0b68ff}.ant-dropdown-rtl{direction:rtl}.ant-dropdown-rtl.ant-dropdown::before{right:-7px;left:0}.ant-dropdown-menu.ant-dropdown-menu-rtl{direction:rtl;text-align:right}.ant-dropdown-menu-submenu-rtl .ant-dropdown-menu-item-group-title,.ant-dropdown-rtl .ant-dropdown-menu-item-group-title{direction:rtl;text-align:right}.ant-dropdown-menu-submenu-popup.ant-dropdown-menu-submenu-rtl{transform-origin:100% 0}.ant-dropdown-rtl .ant-dropdown-menu-submenu-popup li,.ant-dropdown-rtl .ant-dropdown-menu-submenu-popup ul{text-align:right}.ant-dropdown-rtl .ant-dropdown-menu-item,.ant-dropdown-rtl .ant-dropdown-menu-submenu-title{text-align:right}.ant-dropdown-rtl .ant-dropdown-menu-item>.anticon:first-child,.ant-dropdown-rtl .ant-dropdown-menu-item>span>.anticon:first-child,.ant-dropdown-rtl .ant-dropdown-menu-submenu-title>.anticon:first-child,.ant-dropdown-rtl .ant-dropdown-menu-submenu-title>span>.anticon:first-child{margin-right:0;margin-left:8px}.ant-dropdown-rtl .ant-dropdown-menu-item .ant-dropdown-menu-submenu-expand-icon,.ant-dropdown-rtl .ant-dropdown-menu-submenu-title .ant-dropdown-menu-submenu-expand-icon{right:auto;left:8px}.ant-dropdown-rtl .ant-dropdown-menu-item .ant-dropdown-menu-submenu-expand-icon .ant-dropdown-menu-submenu-arrow-icon,.ant-dropdown-rtl .ant-dropdown-menu-submenu-title .ant-dropdown-menu-submenu-expand-icon .ant-dropdown-menu-submenu-arrow-icon{margin-left:0!important;transform:scaleX(-1)}.ant-dropdown-rtl .ant-dropdown-menu-submenu-title{padding-right:16px;padding-left:27px}.ant-dropdown-rtl .ant-dropdown-menu-submenu-vertical>.ant-dropdown-menu{right:100%;left:0;margin-right:4px;margin-left:0}.ant-dropdown{border-radius:3px;overflow:hidden}.ant-dropdown.ant-dropdown{box-shadow:0 16px 32px 0 rgba(35,41,54,.1);background:#fff;margin-top:0;padding-top:0}.ant-dropdown.ant-dropdown>div{box-shadow:none;margin:0;border-radius:3px;overflow:visible}.ant-dropdown:before{display:none!important}.ant-dropdown-menu{padding:8px 0}.ant-dropdown-menu-item-group-title{padding:4px 16px}.ant-dropdown-menu-item,.ant-dropdown-menu-submenu-title{font-size:13px;font-weight:500!important;min-width:175px;min-height:32px;padding:4px 16px}.ant-dropdown-menu-item>.icon,.ant-dropdown-menu-submenu-title>.icon{margin-right:8px;vertical-align:top}.ant-dropdown-menu-item>a,.ant-dropdown-menu-submenu-title>a{padding:4px 16px;margin:-4px -16px}.ant-dropdown-menu-item:hover,.ant-dropdown-menu-submenu-title:hover{color:#384350;background-color:#f4faff}.ant-dropdown-menu-item-selected{background-color:#f4faff;color:#384350}.ant-dropdown-trigger:after{animation:none;animation-fill-mode:none}