linear-react-components-ui 1.1.20-beta.33 → 1.1.20-beta.34

package/lib/labels/types.d.ts

@@ -0,0 +1,26 @@
+import { ReactElement } from 'react';
+import { PermissionAttr } from '../@types/PermissionAttr.js';
+import { Position } from '../@types/Position.js';
+import { Size } from '../@types/Size.js';
+import { IconNames } from '../@types/Icon.js';
+import '../icons/helper.js';
+
+interface ILabelProps extends React.HTMLAttributes<HTMLDivElement> {
+    customClass?: string;
+    size?: Size;
+    iconName?: IconNames;
+    iconAlign?: Position;
+    icon?: ReactElement;
+    targetRef?: (ref: HTMLDivElement | null) => void;
+    bordered?: boolean;
+    tooltipPosition?: Exclude<Position, 'center'>;
+    tooltipWidth?: string | number;
+    tooltip?: string;
+    visible?: boolean;
+    disabled?: boolean;
+    permissionAttr?: PermissionAttr | PermissionAttr[];
+    skeletonize?: boolean;
+    validationKey?: string;
+}
+
+export { ILabelProps };

package/lib/labels/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/list/Header.d.ts

@@ -0,0 +1,10 @@
+import { IListHeaderProps } from './types.js';
+import 'react';
+import '../@types/PermissionAttr.js';
+import '../@types/Icon.js';
+import '../icons/helper.js';
+import '../@types/Position.js';
+
+declare const Header: ({ title, children, style, customClass }: IListHeaderProps) => JSX.Element;
+
+export { Header as default };

package/lib/list/Header.js

@@ -0,0 +1,23 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const Header = _ref => {
+  let {
+    title,
+    children,
+    style,
+    customClass
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement("li", {
+    className: `list-header ${customClass}`,
+    style: style
+  }, /*#__PURE__*/_react.default.createElement("h1", {
+    className: "title"
+  }, title), children);
+};
+var _default = exports.default = Header;

package/lib/list/Item.d.ts

@@ -0,0 +1,13 @@
+import { IListItemProps } from './types.js';
+import 'react';
+import '../@types/PermissionAttr.js';
+import '../@types/Icon.js';
+import '../icons/helper.js';
+import '../@types/Position.js';
+
+declare const _default: {
+    (props: IListItemProps): JSX.Element;
+    displayName: string;
+};
+
+export { _default as default };

package/lib/list/Item.js

@@ -0,0 +1,162 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactRouterDom = require("react-router-dom");
+var _icons = _interopRequireDefault(require("../icons"));
+var _checkbox = _interopRequireDefault(require("../checkbox"));
+var _helpers = require("./helpers");
+var _withDropdown = require("../dropdown/withDropdown");
+var constants = _interopRequireWildcard(require("../internals/constants"));
+var _withTooltip = _interopRequireWildcard(require("../internals/withTooltip"));
+var _permissionValidations = require("../permissionValidations");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+const Item = props => {
+  const {
+    onClick,
+    leftIconName,
+    leftIcon,
+    displayCheckbox,
+    url,
+    leftElement,
+    hovered = true,
+    customClass,
+    text,
+    subText,
+    rightIcon,
+    rightIconName,
+    itemId = '',
+    rightElement,
+    style,
+    children,
+    disabled,
+    separator = true,
+    visible = true,
+    permissionAttr,
+    skeletonize,
+    targetRef,
+    target,
+    onDeniedText = 'Permissão Negada! Consulte o Administrador do sistema.'
+  } = props;
+  const {
+    handleSelectItem,
+    selectable,
+    selectedItemId,
+    selectedItemRef,
+    selectOnEnter
+  } = (0, _react.useContext)(_helpers.ListContext);
+  const dropdownContext = (0, _react.useContext)(_withDropdown.WithDropdownContext);
+  const {
+    handlerSetOnDeniedText
+  } = (0, _react.useContext)(_withTooltip.TooltipContext);
+  const options = [_permissionValidations.OPTIONS_ON_DENIED.disabled, _permissionValidations.OPTIONS_ON_DENIED.unvisible];
+  const [onDenied] = (0, _react.useState)((0, _permissionValidations.actionsOnPermissionDenied)(options, permissionAttr));
+  const navigate = (0, _reactRouterDom.useNavigate)();
+  const disabledByPermission = onDenied.disabled;
+  const shouldDisable = () => disabled || onDenied.disabled;
+  const disabledIconColor = 'rgb(193, 193, 193)';
+  const getClass = () => `item ${customClass} ${separator && 'list-separator'} ${shouldDisable() && 'disabled'}
+    ${displayCheckbox && 'list-checkbox'}`;
+  const getIcon = (iconName, icon) => {
+    const noIconDisabledByPermission = !icon && !displayCheckbox && !leftElement && !leftIconName && !leftIcon && onDenied.disabled;
+    if (icon) {
+      return icon;
+    } else if (noIconDisabledByPermission) {
+      return /*#__PURE__*/_react.default.createElement(_icons.default, {
+        name: "padlock",
+        color: disabledIconColor
+      });
+    } else if (iconName) {
+      return /*#__PURE__*/_react.default.createElement(_icons.default, {
+        name: !disabledByPermission ? iconName : 'padlock',
+        color: !disabledByPermission ? '' : disabledIconColor
+      });
+    }
+    return null;
+  };
+  const handleOnSelectItem = e => {
+    if (onClick !== undefined) onClick(e, itemId);
+    if (dropdownContext && dropdownContext.handleDropdownClose) {
+      dropdownContext.handleDropdownClose();
+    }
+    if (selectable) handleSelectItem(itemId, onClick);
+  };
+  const onKeyDown = (0, _react.useCallback)(e => {
+    if ([constants.keyCodes.ENTER].includes(e.keyCode) && !skeletonize && itemId && selectedItemId === itemId) {
+      e.preventDefault();
+      handleOnSelectItem(e);
+      if (url) {
+        if (target === '_blank') {
+          window.open(url, '_blank')?.focus();
+        } else {
+          navigate(url);
+        }
+      }
+    }
+  }, [url, selectedItemId, itemId]);
+  const getProps = () => {
+    if (shouldDisable()) return undefined;
+    if (onClick === undefined && dropdownContext === undefined && !selectable) return null;
+    return {
+      onClick: event => {
+        handleOnSelectItem(event);
+      },
+      role: 'button',
+      tabIndex: 0
+    };
+  };
+  (0, _react.useEffect)(() => {
+    if (selectOnEnter) document.addEventListener('keydown', onKeyDown);
+    return () => {
+      document.removeEventListener('keydown', onKeyDown);
+    };
+  }, [url, selectedItemId, itemId]);
+  (0, _react.useEffect)(() => {
+    if (disabledByPermission) handlerSetOnDeniedText(onDeniedText);
+  }, [disabledByPermission]);
+  const renderCheckBox = (0, _react.useMemo)(() => {
+    if (!disabledByPermission && displayCheckbox) {
+      return /*#__PURE__*/_react.default.createElement(_checkbox.default, {
+        name: "checkbox"
+      });
+    } else if (disabledByPermission && displayCheckbox) {
+      return /*#__PURE__*/_react.default.createElement(_icons.default, {
+        name: "padlock"
+      });
+    }
+    return null;
+  }, [disabledByPermission && displayCheckbox]);
+  if (!visible || onDenied.unvisible) return null;
+  return /*#__PURE__*/_react.default.createElement("li", _extends({
+    ref: ref => {
+      if (targetRef) targetRef(ref);
+      return itemId && selectedItemId === itemId ? selectedItemRef : null;
+    },
+    style: style,
+    className: `item-container ${hovered && 'hovered'}
+        ${itemId && selectedItemId === itemId ? '-activedlist' : ''}`
+  }, getProps(), {
+    key: itemId
+  }), url && !shouldDisable() && /*#__PURE__*/_react.default.createElement(_reactRouterDom.Link, {
+    className: "linkitem",
+    to: url,
+    target: target
+  }), (displayCheckbox || leftElement || leftIconName || leftIcon) && /*#__PURE__*/_react.default.createElement("div", {
+    className: `${getClass()} -icon-left`
+  }, renderCheckBox, leftElement, getIcon(leftIconName, leftIcon)), (text || subText || children) && /*#__PURE__*/_react.default.createElement("div", {
+    className: `${getClass()}`
+  }, text && /*#__PURE__*/_react.default.createElement("p", {
+    className: `${text && 'text'}`
+  }, text), subText && /*#__PURE__*/_react.default.createElement("p", {
+    className: `${subText && 'subtext'}`
+  }, subText), children), (rightIconName || rightIcon || rightElement || disabledByPermission) && /*#__PURE__*/_react.default.createElement("div", {
+    className: `${getClass()} -icon-right`
+  }, getIcon(rightIconName, rightIcon), rightElement));
+};
+var _default = exports.default = (0, _withTooltip.default)(Item);

package/lib/list/Separator.d.ts

@@ -0,0 +1,3 @@
+declare const Separator: () => JSX.Element;
+
+export { Separator as default };

package/lib/list/Separator.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const Separator = () => /*#__PURE__*/_react.default.createElement("li", {
+  className: "list-separator"
+});
+var _default = exports.default = Separator;

package/lib/list/helpers.d.ts

@@ -0,0 +1,15 @@
+import React__default from 'react';
+import { IListContext } from './types.js';
+import '../@types/PermissionAttr.js';
+import '../@types/Icon.js';
+import '../icons/helper.js';
+import '../@types/Position.js';
+
+declare const ListContext: React__default.Context<IListContext>;
+declare const LIST_ITEMS_TYPES: {
+    listHeader: string;
+    listItem: string;
+    listSeparator: string;
+};
+
+export { LIST_ITEMS_TYPES, ListContext };

package/lib/list/helpers.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ListContext = exports.LIST_ITEMS_TYPES = void 0;
+var _react = _interopRequireDefault(require("react"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const ListContext = exports.ListContext = /*#__PURE__*/_react.default.createContext({});
+const LIST_ITEMS_TYPES = exports.LIST_ITEMS_TYPES = {
+  listHeader: 'Header',
+  listItem: 'Item',
+  listSeparator: 'Separator'
+};

package/lib/list/index.d.ts

@@ -0,0 +1,13 @@
+export { default as ListHeader } from './Header.js';
+export { default as ListItem } from './Item.js';
+export { default as ListSeparator } from './Separator.js';
+import { IListProps } from './types.js';
+import 'react';
+import '../@types/PermissionAttr.js';
+import '../@types/Icon.js';
+import '../icons/helper.js';
+import '../@types/Position.js';
+
+declare const List: (props: IListProps) => JSX.Element;
+
+export { List as default };

package/lib/list/index.js

@@ -0,0 +1,182 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "ListHeader", {
+  enumerable: true,
+  get: function () {
+    return _Header.default;
+  }
+});
+Object.defineProperty(exports, "ListItem", {
+  enumerable: true,
+  get: function () {
+    return _Item.default;
+  }
+});
+Object.defineProperty(exports, "ListSeparator", {
+  enumerable: true,
+  get: function () {
+    return _Separator.default;
+  }
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _Header = _interopRequireDefault(require("./Header"));
+var _Item = _interopRequireDefault(require("./Item"));
+var constants = _interopRequireWildcard(require("../internals/constants"));
+var _Separator = _interopRequireDefault(require("./Separator"));
+require("../assets/styles/list.scss");
+var _helpers = require("./helpers");
+var _skeleton = _interopRequireDefault(require("../skeleton"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const List = props => {
+  const {
+    children,
+    customClass,
+    condensed,
+    transparent,
+    style,
+    selectable,
+    onSelectItem,
+    skeletonize = false,
+    skeletonHeight = 48,
+    skeletonItens = 5,
+    selectOnEnter = false
+  } = props;
+  const selectedItemRef = (0, _react.useRef)(null);
+  const listRef = (0, _react.useRef)(null);
+  const [selectedItemId, setSelectedItemId] = (0, _react.useState)('');
+  const [itensId, setItensId] = (0, _react.useState)([]);
+  const [newChildren, setNewChildren] = (0, _react.useState)(children);
+  const contextValues = {
+    selectable,
+    selectOnEnter,
+    selectedItemId,
+    selectedItemRef,
+    children,
+    skeletonize,
+    handleSelectItem: (itemId, onClick) => {
+      if (!onSelectItem && onClick) setSelectedItemId(itemId);
+      if (onSelectItem) onSelectItem(itemId);
+    }
+  };
+  const onKeyDown = e => {
+    if ([constants.keyCodes.ARROW_DOWN, constants.keyCodes.ARROW_UP].includes(e.keyCode) && !skeletonize) {
+      e.preventDefault();
+      if (e.keyCode === constants.keyCodes.ARROW_DOWN) {
+        if (selectedItemId === itensId[itensId.length - 1]) {
+          setSelectedItemId(itensId[0]);
+        } else {
+          const index = itensId.indexOf(selectedItemId === '' ? '0' : selectedItemId);
+          setSelectedItemId(itensId[index + 1]);
+        }
+      } else if (e.keyCode === constants.keyCodes.ARROW_UP) {
+        if (selectedItemId === itensId[0]) {
+          setSelectedItemId(itensId[itensId.length - 1]);
+        } else {
+          const index = itensId.indexOf(selectedItemId);
+          setSelectedItemId(itensId[index - 1]);
+        }
+      }
+      return selectedItemRef.current && selectedItemRef.current.focus();
+    }
+    return null;
+  };
+  const getSkeleton = function () {
+    let length = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
+    const maxSkeletonsItensExceeded = 2;
+    const skeletonItensCount = length > skeletonItens ? maxSkeletonsItensExceeded : Math.floor(skeletonItens / length);
+    const skeletonItensList = Array.from(Array(skeletonItensCount).keys());
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: "skeleton-transparency"
+    }, skeletonItensList.map(id => /*#__PURE__*/_react.default.createElement(_Item.default, {
+      key: id,
+      hovered: false,
+      style: {
+        pointerEvents: 'none'
+      }
+    }, /*#__PURE__*/_react.default.createElement(_skeleton.default, {
+      height: skeletonHeight,
+      style: {
+        margin: '6px 0'
+      }
+    }))));
+  };
+  const getNewChildren = headersChildren => {
+    if (!headersChildren) return getSkeleton();
+    return Array.isArray(headersChildren) && headersChildren.length > 0 ? headersChildren.map(item => /*#__PURE__*/_react.default.createElement(_react.Fragment, {
+      key: item.props.title
+    }, item, getSkeleton(headersChildren.length))) : /*#__PURE__*/_react.default.createElement(_react.Fragment, null, headersChildren, getSkeleton());
+  };
+  (0, _react.useEffect)(() => {
+    if (selectedItemRef.current && listRef.current && listRef.current.scroll) {
+      const selectedItemRect = selectedItemRef.current.getBoundingClientRect();
+      const listRect = listRef.current.getBoundingClientRect();
+      const defaultScrollTop = 0;
+      const defaultBottomOffset = 100;
+      if (selectedItemRect.top - selectedItemRect.height > listRect.bottom) {
+        listRef.current.scroll({
+          top: selectedItemRect.top
+        });
+      } else if (selectedItemRect.top + selectedItemRect.height - listRect.y >= listRect.height) {
+        listRef.current.scroll({
+          top: listRef.current.scrollTop + selectedItemRect.height
+        });
+      } else if (selectedItemRect.bottom < defaultBottomOffset) {
+        listRef.current.scroll({
+          top: defaultScrollTop
+        });
+      } else {
+        listRef.current.scroll({
+          top: listRef.current.scrollTop - selectedItemRect.height
+        });
+      }
+    }
+  }, [selectedItemRef.current]);
+  (0, _react.useEffect)(() => {
+    if (!skeletonize) document.addEventListener('keydown', onKeyDown);
+    return () => {
+      document.removeEventListener('keydown', onKeyDown);
+    };
+  }, [skeletonize, selectedItemId, itensId]);
+  (0, _react.useEffect)(() => {
+    if (onSelectItem && props.selectedItemId) setSelectedItemId(props.selectedItemId);
+  }, [props.selectedItemId]);
+  (0, _react.useEffect)(() => {
+    if (Array.isArray(children) && children.length > 0) {
+      const newItensIds = children.map(item => item.props && item.props.itemId).filter(Boolean);
+      setItensId(newItensIds);
+    } else if (!Array.isArray(children) && children.props) {
+      const childrenWithProps = children;
+      if (childrenWithProps.props.itemId) setItensId([childrenWithProps.props.itemId]);
+    }
+  }, [children]);
+  (0, _react.useEffect)(() => {
+    if (skeletonize) {
+      let headersChildren = null;
+      if (Array.isArray(children) && children.length > 0) {
+        const childrenWithType = children;
+        headersChildren = childrenWithType.filter(item => item.type && typeof item.type !== 'string' && item.type.name === _helpers.LIST_ITEMS_TYPES.listHeader);
+      } else if (!Array.isArray(children)) {
+        headersChildren = children.type && typeof children.type !== 'string' && children.type.name === _helpers.LIST_ITEMS_TYPES.listHeader ? children : null;
+      }
+      setNewChildren(getNewChildren(headersChildren));
+    } else {
+      setNewChildren(children);
+    }
+  }, [skeletonize, children]);
+  return /*#__PURE__*/_react.default.createElement(_helpers.ListContext.Provider, {
+    value: contextValues
+  }, /*#__PURE__*/_react.default.createElement("ul", {
+    "data-testid": "list-component",
+    style: style,
+    ref: listRef,
+    className: `list-component ${condensed && '-condensed'}
+        ${customClass} ${!transparent && '-listbackground'}`
+  }, newChildren));
+};
+var _default = exports.default = List;

package/lib/list/types.d.ts

@@ -0,0 +1,73 @@
+import { ReactNode, ReactElement, CSSProperties, ComponentPropsWithoutRef, Ref } from 'react';
+import { PermissionAttr } from '../@types/PermissionAttr.js';
+import { IconNames } from '../@types/Icon.js';
+import { Position } from '../@types/Position.js';
+import '../icons/helper.js';
+
+type ItemId = string;
+interface KeyboardEvent {
+    key: string;
+    keyCode: number;
+    preventDefault: () => void;
+}
+interface IListHeaderProps {
+    title?: string;
+    style?: object;
+    children?: ReactNode;
+    customClass?: string;
+}
+interface IListProps {
+    children: ReactElement | ReactElement[];
+    transparent?: boolean;
+    customClass?: string;
+    condensed?: boolean;
+    selectable?: boolean;
+    style?: CSSProperties;
+    onSelectItem?: (itemId: string) => void;
+    selectedItemId?: string;
+    skeletonize?: boolean;
+    skeletonHeight?: number;
+    skeletonItens?: number;
+    selectOnEnter?: boolean;
+}
+interface IListItemProps {
+    text?: string;
+    style?: object;
+    separator?: boolean;
+    hovered?: boolean;
+    disabled?: boolean;
+    displayCheckbox?: boolean;
+    subText?: string;
+    leftElement?: ReactElement;
+    rightElement?: ReactElement;
+    leftIcon?: ReactElement;
+    rightIcon?: ReactElement;
+    onClick?: (event?: React.MouseEvent<HTMLLIElement, MouseEvent> | KeyboardEvent, itemId?: string) => void;
+    leftIconName?: IconNames;
+    rightIconName?: IconNames;
+    customClass?: string;
+    url?: string;
+    target?: ComponentPropsWithoutRef<'a'>['target'];
+    visible?: boolean;
+    itemId?: string;
+    children?: ReactNode;
+    permissionAttr?: PermissionAttr | PermissionAttr[];
+    selectOnEnter?: boolean;
+    skeletonize?: boolean;
+    targetRef?: (ref: HTMLLIElement) => void;
+    tooltipPosition?: Exclude<Position, 'center'>;
+    tooltipWidth?: string | number;
+    tooltip?: string;
+    onDeniedText?: string;
+}
+interface IListContext {
+    selectable: boolean;
+    selectedItemId: string;
+    selectedItemRef: Ref<HTMLLIElement>;
+    selectOnEnter: boolean;
+    skeletonize: boolean;
+    children: ReactNode;
+    handleSelectItem: (itemId: string, onClick?: () => void) => void;
+}
+
+export { IListContext, IListHeaderProps, IListItemProps, IListProps, ItemId, KeyboardEvent };

package/lib/list/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/menus/float/MenuItem.d.ts

@@ -0,0 +1,9 @@
+import { IFloatMenuItemProps } from './types.js';
+import 'react';
+import '../../@types/SizePixels.js';
+import '../../@types/Icon.js';
+import '../../icons/helper.js';
+
+declare const MenuItem: ({ title, url, iconName, iconColor, iconSize, dropdownMenu, onClick, }: IFloatMenuItemProps) => JSX.Element;
+
+export { MenuItem as default };

package/lib/menus/float/MenuItem.js

@@ -0,0 +1,69 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _lodash = _interopRequireDefault(require("lodash"));
+var _icons = _interopRequireDefault(require("../../icons"));
+var _withDropdown = require("../../dropdown/withDropdown");
+var _buttons = _interopRequireDefault(require("../../buttons"));
+var _helpers = _interopRequireDefault(require("./helpers"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const MenuItem = _ref => {
+  let {
+    title,
+    url,
+    iconName,
+    iconColor = 'gray',
+    iconSize = 24,
+    dropdownMenu,
+    onClick
+  } = _ref;
+  const {
+    customClassMenuItem
+  } = (0, _react.useContext)(_helpers.default);
+  const dropdownContext = (0, _react.useContext)(_withDropdown.WithDropdownContext);
+  const handleOnClick = () => {
+    if (onClick) {
+      onClick(dropdownContext?.handleDropdownClose);
+      return;
+    }
+    if (dropdownContext) dropdownContext.handleDropdownClose();
+  };
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "floatmenuitem"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: `${customClassMenuItem} -items`
+  }, !_lodash.default.isEmpty(dropdownMenu) && !onClick && /*#__PURE__*/_react.default.createElement(_buttons.default, {
+    customClass: "floatmenudropdown",
+    iconName: "more1",
+    transparent: true,
+    size: "medium",
+    boxShadow: false,
+    dropdown: true,
+    showIconDropdown: false
+  }, dropdownMenu), /*#__PURE__*/_react.default.createElement("a", {
+    className: "floatmenulink",
+    target: "_blank",
+    onClick: handleOnClick,
+    href: url,
+    style: {
+      cursor: onClick ? 'pointer' : undefined
+    },
+    rel: "noreferrer"
+  }, /*#__PURE__*/_react.default.createElement("span", {
+    className: "iconcontainer"
+  }, /*#__PURE__*/_react.default.createElement(_icons.default, {
+    name: iconName,
+    size: iconSize,
+    color: iconColor,
+    customClass: "iconmenu"
+  })), /*#__PURE__*/_react.default.createElement("span", {
+    className: "nameitem"
+  }, title))));
+};
+var _default = exports.default = MenuItem;