@codacy/ui-components 0.64.16 → 0.64.18

package/lib/Dropdown/Content/DropdownItem.js

@@ -1,32 +1,39 @@
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DropdownItem = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+var _react = _interopRequireWildcard(require("react"));
+var _Dropdown = require("../Dropdown.styles");
+var _Dropdown2 = require("../Dropdown");
+var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["children", "onClick", "disabled", "automaticClose", "value", "active"];
-import React, { useCallback } from 'react';
-import { DropdownItemWrapper } from '../Dropdown.styles';
-import { useDropdownContext } from '../Dropdown';
-export var DropdownItem = function DropdownItem(_ref) {
+var DropdownItem = exports.DropdownItem = function DropdownItem(_ref) {
   var children = _ref.children,
-      onClick = _ref.onClick,
-      _ref$disabled = _ref.disabled,
-      disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-      _ref$automaticClose = _ref.automaticClose,
-      automaticClose = _ref$automaticClose === void 0 ? true : _ref$automaticClose,
-      value = _ref.value,
-      active = _ref.active,
-      props = _objectWithoutProperties(_ref, _excluded);
-
-  var dropdownContext = useDropdownContext();
-  var handleClick = useCallback(function (event) {
+    onClick = _ref.onClick,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    _ref$automaticClose = _ref.automaticClose,
+    automaticClose = _ref$automaticClose === void 0 ? true : _ref$automaticClose,
+    value = _ref.value,
+    active = _ref.active,
+    props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+  var dropdownContext = (0, _Dropdown2.useDropdownContext)();
+  var handleClick = (0, _react.useCallback)(function (event) {
     if (event) event.stopPropagation();
-
     if (!disabled) {
       if (!!value) dropdownContext.setValue(value);
       if (!!onClick) onClick(value);
     }
-
     if (automaticClose) dropdownContext.setOpen(false);
   }, [automaticClose, disabled, dropdownContext, onClick, value]);
   var isActive = active === undefined ? !!value && value === dropdownContext.value : active;
-  return /*#__PURE__*/React.createElement(DropdownItemWrapper, Object.assign({}, props, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.DropdownItemWrapper, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, props), {}, {
     onClick: handleClick,
     onKeyDown: function onKeyDown(event) {
       if (event.key === 'Enter') handleClick();
@@ -35,6 +42,7 @@ export var DropdownItem = function DropdownItem(_ref) {
     disabled: disabled,
     active: isActive,
     "aria-selected": isActive,
-    role: "option"
-  }), children);
+    role: "option",
+    children: children
+  }));
 };

package/lib/Dropdown/Content/DropdownSeparator.js

@@ -1,9 +1,21 @@
-import React from 'react';
-import { DropdownSeparatorWrapper } from '../Dropdown.styles';
-import { Divider } from '../../Divider';
-export var DropdownSeparator = function DropdownSeparator(_ref) {
-  var props = Object.assign({}, _ref);
-  return /*#__PURE__*/React.createElement(DropdownSeparatorWrapper, props, /*#__PURE__*/React.createElement(Divider, {
-    my: 2
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DropdownSeparator = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+var _objectDestructuringEmpty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectDestructuringEmpty"));
+var _react = _interopRequireDefault(require("react"));
+var _Dropdown = require("../Dropdown.styles");
+var _Divider = require("../../Divider");
+var _jsxRuntime = require("react/jsx-runtime");
+var DropdownSeparator = exports.DropdownSeparator = function DropdownSeparator(_ref) {
+  var props = Object.assign({}, ((0, _objectDestructuringEmpty2["default"])(_ref), _ref));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.DropdownSeparatorWrapper, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, props), {}, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Divider.Divider, {
+      my: 2
+    })
   }));
 };

package/lib/Dropdown/Content/index.js

@@ -1,3 +1,38 @@
-export * from './DropdownItem';
-export * from './DropdownSeparator';
-export * from './DropdownInput';
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _DropdownItem = require("./DropdownItem");
+Object.keys(_DropdownItem).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _DropdownItem[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _DropdownItem[key];
+    }
+  });
+});
+var _DropdownSeparator = require("./DropdownSeparator");
+Object.keys(_DropdownSeparator).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _DropdownSeparator[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _DropdownSeparator[key];
+    }
+  });
+});
+var _DropdownInput = require("./DropdownInput");
+Object.keys(_DropdownInput).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _DropdownInput[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _DropdownInput[key];
+    }
+  });
+});

package/lib/Dropdown/Dropdown.js

@@ -1,91 +1,94 @@
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useDropdownContext = exports.DropdownContext = exports.Dropdown = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+var _react = _interopRequireWildcard(require("react"));
+var _Dropdown = require("./Dropdown.styles");
+var _reactDom = _interopRequireDefault(require("react-dom"));
+var _reactPopper = require("react-popper");
+var _react2 = require("@emotion/react");
+var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["trigger", "disabled", "placement", "size", "initialValue", "portal", "children", "onOpen", "onClose", "onChange"];
-import React, { useState, useContext, useEffect } from 'react';
-import { DropdownWrapper, DropdownPanel } from './Dropdown.styles';
-import ReactDOM from 'react-dom';
-import { usePopper } from 'react-popper';
-import { useTheme } from 'emotion-theming';
-export var DropdownContext = React.createContext(null);
+var DropdownContext = exports.DropdownContext = /*#__PURE__*/_react["default"].createContext(null);
+
 /**
  * Base structure for dropdowns, dropdown buttons or menus, selects, etc.
  */
-
-export var Dropdown = function Dropdown(_ref) {
+var Dropdown = exports.Dropdown = function Dropdown(_ref) {
   var trigger = _ref.trigger,
-      disabled = _ref.disabled,
-      _ref$placement = _ref.placement,
-      placement = _ref$placement === void 0 ? 'left' : _ref$placement,
-      _ref$size = _ref.size,
-      size = _ref$size === void 0 ? 'md' : _ref$size,
-      initialValue = _ref.initialValue,
-      _ref$portal = _ref.portal,
-      portal = _ref$portal === void 0 ? false : _ref$portal,
-      children = _ref.children,
-      onOpen = _ref.onOpen,
-      onClose = _ref.onClose,
-      onChange = _ref.onChange,
-      props = _objectWithoutProperties(_ref, _excluded);
-
-  var _useState = useState(initialValue || null),
-      _useState2 = _slicedToArray(_useState, 2),
-      value = _useState2[0],
-      setValue = _useState2[1];
-
-  var _useState3 = useState(false),
-      _useState4 = _slicedToArray(_useState3, 2),
-      open = _useState4[0],
-      setOpen = _useState4[1];
-
-  var _useState5 = useState(),
-      _useState6 = _slicedToArray(_useState5, 2),
-      triggerRef = _useState6[0],
-      setTriggerRef = _useState6[1];
-
-  var _useState7 = useState(),
-      _useState8 = _slicedToArray(_useState7, 2),
-      panelRef = _useState8[0],
-      setPanelRef = _useState8[1];
-
-  var parentDropdownCtx = useContext(DropdownContext);
-  var theme = useTheme();
-
-  var _usePopper = usePopper(triggerRef, panelRef, {
-    placement: placement === 'left' ? 'bottom-start' : 'bottom-end',
-    modifiers: [{
-      name: 'offset',
-      enabled: true,
-      options: {
-        offset: [0, 8]
-      }
-    }, {
-      name: 'flip',
-      enabled: true
-    }]
-  }),
-      styles = _usePopper.styles,
-      attributes = _usePopper.attributes;
-
+    disabled = _ref.disabled,
+    _ref$placement = _ref.placement,
+    placement = _ref$placement === void 0 ? 'left' : _ref$placement,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 'md' : _ref$size,
+    initialValue = _ref.initialValue,
+    _ref$portal = _ref.portal,
+    portal = _ref$portal === void 0 ? false : _ref$portal,
+    children = _ref.children,
+    onOpen = _ref.onOpen,
+    onClose = _ref.onClose,
+    onChange = _ref.onChange,
+    props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+  var _useState = (0, _react.useState)(initialValue || null),
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    value = _useState2[0],
+    setValue = _useState2[1];
+  var _useState3 = (0, _react.useState)(false),
+    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+    open = _useState4[0],
+    setOpen = _useState4[1];
+  var _useState5 = (0, _react.useState)(),
+    _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
+    triggerRef = _useState6[0],
+    setTriggerRef = _useState6[1];
+  var _useState7 = (0, _react.useState)(),
+    _useState8 = (0, _slicedToArray2["default"])(_useState7, 2),
+    panelRef = _useState8[0],
+    setPanelRef = _useState8[1];
+  var parentDropdownCtx = (0, _react.useContext)(DropdownContext);
+  var theme = (0, _react2.useTheme)();
+  var _usePopper = (0, _reactPopper.usePopper)(triggerRef, panelRef, {
+      placement: placement === 'left' ? 'bottom-start' : 'bottom-end',
+      modifiers: [{
+        name: 'offset',
+        enabled: true,
+        options: {
+          offset: [0, 8]
+        }
+      }, {
+        name: 'flip',
+        enabled: true
+      }]
+    }),
+    styles = _usePopper.styles,
+    attributes = _usePopper.attributes;
   var level = ((parentDropdownCtx === null || parentDropdownCtx === void 0 ? void 0 : parentDropdownCtx.level) || 0) + 1;
-  useEffect(function () {
+  (0, _react.useEffect)(function () {
     if (open && onOpen) onOpen();
     if (!open && onClose) onClose();
   }, [open, onOpen, onClose]);
-  useEffect(function () {
+  (0, _react.useEffect)(function () {
     if (onChange) onChange(value);
   }, [value, onChange]);
-  var content = /*#__PURE__*/React.createElement(DropdownPanel, Object.assign({
+  var content = /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.DropdownPanel, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({
     ref: setPanelRef,
-    style: _objectSpread(_objectSpread({}, styles.popper), {}, {
+    style: (0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, styles.popper), {}, {
       visibility: open ? 'visible' : 'hidden',
       zIndex: level + theme.zIndices['dropdown']
     })
-  }, attributes.popper, {
-    size: size
-  }), children);
+  }, attributes.popper), {}, {
+    size: size,
+    children: children
+  }));
   var containerElement = portal && document.querySelector(portal === true ? 'body' : portal);
-  return /*#__PURE__*/React.createElement(DropdownContext.Provider, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(DropdownContext.Provider, {
     value: {
       open: open,
       setOpen: setOpen,
@@ -95,22 +98,23 @@ export var Dropdown = function Dropdown(_ref) {
       triggerRef: triggerRef,
       panelRef: panelRef,
       level: level
-    }
-  }, /*#__PURE__*/React.createElement(DropdownWrapper, Object.assign({
-    open: open
-  }, props), React.cloneElement(trigger, {
-    ref: setTriggerRef,
-    open: open,
-    'aria-haspopup': 'true',
-    'aria-expanded': open.toString()
-  }), open && (containerElement ? ReactDOM.createPortal(content, containerElement) : content)));
+    },
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Dropdown.DropdownWrapper, (0, _objectSpread2["default"])((0, _objectSpread2["default"])({
+      open: open
+    }, props), {}, {
+      children: [/*#__PURE__*/_react["default"].cloneElement(trigger, {
+        ref: setTriggerRef,
+        open: open,
+        'aria-haspopup': 'true',
+        'aria-expanded': open.toString()
+      }), open && (containerElement ? /*#__PURE__*/_reactDom["default"].createPortal(content, containerElement) : content)]
+    }))
+  });
 };
-export var useDropdownContext = function useDropdownContext() {
-  var dropdownContext = useContext(DropdownContext);
-
+var useDropdownContext = exports.useDropdownContext = function useDropdownContext() {
+  var dropdownContext = (0, _react.useContext)(DropdownContext);
   if (dropdownContext === null) {
     throw new Error("You are using DropdownContext outside it's provider.");
   }
-
   return dropdownContext;
 };

package/lib/Dropdown/Dropdown.styles.d.ts

@@ -1,42 +1,45 @@
 /// <reference types="react" />
 import { CodacyTheme } from '../theme';
-import { BoxProps } from '../Flexbox';
 import { DropdownProps, DropdownItemProps } from './Dropdown.types';
-export declare const DropdownWrapper: import("@emotion/styled-base").StyledComponent<Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Pick<import("..").ColorProps & import("..").LayoutProps & import("..").SpaceProps & import("..").BorderProps & import("..").PositionProps & import("..").ShadowProps & import("..").TextAlignProps & Omit<import("..").TypographyProps, "fontWeight"> & import("../Flexbox").As & {
+export declare const DropdownWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("..").ColorProps & Omit<import("..").LayoutProps, "size"> & import("..").SpaceProps & import("..").BorderProps & import("..").PositionProps & import("..").ShadowProps & import("..").TextAlignProps & Omit<import("..").TypographyProps, "fontWeight"> & import("../Flexbox").As & {
     fontWeight?: import("styled-system").ResponsiveValue<number | import("../theme").FontWeights, CodacyTheme> | undefined;
-}, "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textAlign" | "as" | keyof import("..").ColorProps | keyof import("..").LayoutProps | keyof import("..").SpaceProps | keyof import("..").BorderProps | keyof import("..").PositionProps | keyof import("..").ShadowProps> & {
-    theme?: object | undefined;
-}, "key" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textAlign" | "as" | "theme" | keyof import("react").HTMLAttributes<HTMLDivElement> | keyof import("..").ColorProps | keyof import("..").LayoutProps | keyof import("..").SpaceProps | keyof import("..").BorderProps | keyof import("..").PositionProps | keyof import("..").ShadowProps> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
-} & Pick<BoxProps, "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textAlign" | "as" | keyof import("..").ColorProps | keyof import("..").LayoutProps | keyof import("..").SpaceProps | keyof import("..").BorderProps | keyof import("..").PositionProps | keyof import("..").ShadowProps | keyof import("..").FlexboxProps | keyof import("..").GridboxProps> & {
-    theme?: object | undefined;
-}, {
+} & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+} & import("..").FlexboxProps & import("..").GridboxProps & {
     open: boolean;
-}, CodacyTheme>;
-export declare const DropdownPanel: import("@emotion/styled-base").StyledComponent<Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Pick<import("react").HTMLAttributes<HTMLDivElement>, keyof import("react").HTMLAttributes<HTMLDivElement>> & {
-    theme?: CodacyTheme | undefined;
-}, "key" | "theme" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, Pick<DropdownProps, "size">, CodacyTheme>;
-export declare const DropdownItemWrapper: import("@emotion/styled-base").StyledComponent<Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Pick<import("..").ColorProps & import("..").LayoutProps & import("..").SpaceProps & import("..").BorderProps & import("..").PositionProps & import("..").ShadowProps & import("..").TextAlignProps & Omit<import("..").TypographyProps, "fontWeight"> & import("../Flexbox").As & {
+}, {}, {}>;
+export declare const DropdownPanel: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").HTMLAttributes<HTMLDivElement> & import("react").ClassAttributes<HTMLDivElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+} & Pick<DropdownProps, "size">, {}, {}>;
+export declare const DropdownItemWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("..").ColorProps & Omit<import("..").LayoutProps, "size"> & import("..").SpaceProps & import("..").BorderProps & import("..").PositionProps & import("..").ShadowProps & import("..").TextAlignProps & Omit<import("..").TypographyProps, "fontWeight"> & import("../Flexbox").As & {
     fontWeight?: import("styled-system").ResponsiveValue<number | import("../theme").FontWeights, CodacyTheme> | undefined;
-}, "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textAlign" | "as" | keyof import("..").ColorProps | keyof import("..").LayoutProps | keyof import("..").SpaceProps | keyof import("..").BorderProps | keyof import("..").PositionProps | keyof import("..").ShadowProps> & {
-    theme?: object | undefined;
-}, "key" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textAlign" | "as" | "theme" | keyof import("react").HTMLAttributes<HTMLDivElement> | keyof import("..").ColorProps | keyof import("..").LayoutProps | keyof import("..").SpaceProps | keyof import("..").BorderProps | keyof import("..").PositionProps | keyof import("..").ShadowProps> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
-} & Pick<BoxProps, "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textAlign" | "as" | keyof import("..").ColorProps | keyof import("..").LayoutProps | keyof import("..").SpaceProps | keyof import("..").BorderProps | keyof import("..").PositionProps | keyof import("..").ShadowProps | keyof import("..").FlexboxProps | keyof import("..").GridboxProps> & {
-    theme?: object | undefined;
-}, Pick<DropdownItemProps, "disabled"> & {
+} & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+} & import("..").FlexboxProps & import("..").GridboxProps & Pick<DropdownItemProps, "disabled"> & {
     active: boolean;
-}, CodacyTheme>;
-export declare const DropdownFooter: import("@emotion/styled-base").StyledComponent<Pick<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & Pick<import("..").ColorProps & import("..").LayoutProps & import("..").SpaceProps & import("..").BorderProps & import("..").PositionProps & import("..").ShadowProps & import("..").TextAlignProps & Omit<import("..").TypographyProps, "fontWeight"> & import("../Flexbox").As & {
+}, {}, {}>;
+export declare const DropdownFooter: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("..").ColorProps & Omit<import("..").LayoutProps, "size"> & import("..").SpaceProps & import("..").BorderProps & import("..").PositionProps & import("..").ShadowProps & import("..").TextAlignProps & Omit<import("..").TypographyProps, "fontWeight"> & import("../Flexbox").As & {
     fontWeight?: import("styled-system").ResponsiveValue<number | import("../theme").FontWeights, CodacyTheme> | undefined;
-}, "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textAlign" | "as" | keyof import("..").ColorProps | keyof import("..").LayoutProps | keyof import("..").SpaceProps | keyof import("..").BorderProps | keyof import("..").PositionProps | keyof import("..").ShadowProps> & {
-    theme?: object | undefined;
-}, "key" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textAlign" | "as" | "theme" | keyof import("react").HTMLAttributes<HTMLDivElement> | keyof import("..").ColorProps | keyof import("..").LayoutProps | keyof import("..").SpaceProps | keyof import("..").BorderProps | keyof import("..").PositionProps | keyof import("..").ShadowProps> & {
-    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
-} & Pick<BoxProps, "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textAlign" | "as" | keyof import("..").ColorProps | keyof import("..").LayoutProps | keyof import("..").SpaceProps | keyof import("..").BorderProps | keyof import("..").PositionProps | keyof import("..").ShadowProps | keyof import("..").FlexboxProps | keyof import("..").GridboxProps> & {
-    theme?: object | undefined;
-}, BoxProps, CodacyTheme>;
-export declare const DropdownSeparatorWrapper: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Record<string, unknown>, CodacyTheme>;
-export declare const DropdownInputWrapper: import("@emotion/styled-base").StyledComponent<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Record<string, unknown>, CodacyTheme>;
+} & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+} & import("..").FlexboxProps & import("..").GridboxProps, {}, {}>;
+export declare const DropdownSeparatorWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & Record<string, unknown>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const DropdownInputWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & Record<string, unknown>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;