@geneui/components 2.11.2 → 2.12.2

package/Overlay/index.js

@@ -0,0 +1,189 @@
+import { _ as _extends } from '../_rollupPluginBabelHelpers-e8fb2e5c.js';
+import React__default, { useState, useMemo, useCallback, useEffect } from 'react';
+import PropTypes from 'prop-types';
+import { c as classnames } from '../index-6ff23041.js';
+import { p as positions } from '../configs-fed6ac34.js';
+import { n as noop } from '../index-a0e4e333.js';
+import useKeyDown from '../hooks/useKeyDown.js';
+import useClickOutside from '../hooks/useClickOutside.js';
+import CustomScrollbar from '../Scrollbar/index.js';
+import Button from '../Button/index.js';
+import Divider from '../Divider/index.js';
+import ModuleTitle from '../ModuleTitle/index.js';
+import { s as styleInject } from '../style-inject.es-746bb8ed.js';
+import '../dateValidation-67caec66.js';
+import '../_commonjsHelpers-24198af3.js';
+import 'react-dom';
+import '../Icon/index.js';
+import '../Tooltip/index.js';
+import '../Popover-f4d1cac0.js';
+import '../hooks/useDeviceType.js';
+import '../hooks/useWindowSize.js';
+import '../GeneUIProvider/index.js';
+
+var css_248z = "[data-gene-ui-version=\"2.12.2\"] .overlay-back-drop{animation:fadeIn 1s forwards;background:rgba(var(--background-rgb),.6);height:100%;left:0;opacity:0;position:fixed;top:0;width:100%;z-index:299}@keyframes fadeIn{to{opacity:1}}[data-gene-ui-version=\"2.12.2\"] .overlay-holder{display:flex;flex-direction:column;position:fixed;transition:width .4s,height .4s;z-index:300}[data-gene-ui-version=\"2.12.2\"] .overlay-holder.t-horizontal{animation:slideInX .4s linear forwards;background:var(--background);bottom:0;top:var(--header-height,0)}@keyframes slideInX{to{transform:translateX(0)}}[data-gene-ui-version=\"2.12.2\"] .overlay-holder.t-horizontal.p-left{box-shadow:.5rem 0 .6rem 0 #0000000d;transform:translateX(-120%)}html:not([dir=rtl]) .overlay-holder.t-horizontal.p-left{left:0}html[dir=rtl] .overlay-holder.t-horizontal.p-left{box-shadow:-.5rem 0 .6rem 0 #0000000d;right:0;transform:translateX(120%)}[data-gene-ui-version=\"2.12.2\"] .overlay-holder.t-horizontal.p-left .overlay-close{border-radius:0 .4rem .4rem 0;box-shadow:.5rem 0 .6rem 0 #0000000d}html:not([dir=rtl]) .overlay-holder.t-horizontal.p-left .overlay-close{left:100%}html[dir=rtl] .overlay-holder.t-horizontal.p-left .overlay-close{border-radius:.4rem 0 0 .4rem;box-shadow:-.5rem 0 .6rem 0 #0000000d;right:100%}[data-gene-ui-version=\"2.12.2\"] .overlay-holder.t-horizontal.p-right{box-shadow:-.5rem 0 .6rem 0 #0000000d;transform:translateX(120%)}html:not([dir=rtl]) .overlay-holder.t-horizontal.p-right{right:0}html[dir=rtl] .overlay-holder.t-horizontal.p-right{box-shadow:.5rem 0 .6rem 0 #0000000d;left:0;transform:translateX(-120%)}[data-gene-ui-version=\"2.12.2\"] .overlay-holder.t-horizontal.p-right .overlay-close{border-radius:.4rem 0 0 .4rem;box-shadow:-.5rem 0 .6rem 0 #0000000d}html:not([dir=rtl]) .overlay-holder.t-horizontal.p-right .overlay-close{right:100%}html[dir=rtl] .overlay-holder.t-horizontal.p-right .overlay-close{border-radius:0 .4rem .4rem 0;box-shadow:.5rem 0 .6rem 0 #0000000d;left:100%}[data-gene-ui-version=\"2.12.2\"] .overlay-holder.t-horizontal.s-half{width:50%}[data-gene-ui-version=\"2.12.2\"] .overlay-holder.t-horizontal.s-wide{width:75%}[data-gene-ui-version=\"2.12.2\"] .overlay-holder.t-horizontal.s-minimal{width:30rem}[data-gene-ui-version=\"2.12.2\"] .overlay-holder.t-vertical{animation:slideInY .4s linear forwards;background:var(--background);height:25vh;left:0;width:100%}@keyframes slideInY{to{transform:translateY(0)}}[data-gene-ui-version=\"2.12.2\"] .overlay-holder.t-vertical.s-extended{height:50vh}[data-gene-ui-version=\"2.12.2\"] .overlay-holder.t-vertical.p-top{border-radius:0 0 2rem 2rem;box-shadow:0 .3rem .6rem 0 #0000000d;top:0;transform:translateY(-120%)}[data-gene-ui-version=\"2.12.2\"] .overlay-holder.t-vertical.p-top .extend-reduce{box-shadow:0 .3rem .6rem 0 #0000000d;top:100%;transform:translate(-50%,-50%)}[data-gene-ui-version=\"2.12.2\"] .overlay-holder.t-vertical.p-bottom{border-radius:2rem 2rem 0 0;bottom:0;box-shadow:0 -.3rem .6rem 0 #0000000d;flex-direction:column-reverse;transform:translateY(120%)}[data-gene-ui-version=\"2.12.2\"] .overlay-holder.t-vertical.p-bottom .extend-reduce{bottom:100%;box-shadow:0 -.3rem .6rem 0 #0000000d;transform:translate(-50%,50%)}[data-gene-ui-version=\"2.12.2\"] .overlay-head{flex-shrink:0;position:relative;z-index:1}[data-gene-ui-version=\"2.12.2\"] .overlay-close{align-items:center;background:var(--background);display:flex;height:6rem;justify-content:center;position:absolute;top:0;width:6rem}[data-gene-ui-version=\"2.12.2\"] .overlay-body{display:flex;flex:auto;flex-direction:column;position:relative}[data-gene-ui-version=\"2.12.2\"] .overlay-body>.scroll-holder{height:100%;left:0;position:absolute!important;top:0;width:100%}[data-gene-ui-version=\"2.12.2\"] .overlay-body>.scroll-holder>.scroll-content{align-items:stretch;display:flex;flex-direction:column;justify-content:flex-start}[data-gene-ui-version=\"2.12.2\"] .overlay-body .overlay-content{flex:auto;padding:2.1rem 1.9rem}[data-gene-ui-version=\"2.12.2\"] .overlay-body .overlay-footer{display:flex;flex-shrink:0;justify-content:flex-end}[data-gene-ui-version=\"2.12.2\"] .overlay-body .overlay-footer>*{margin:1rem}[data-gene-ui-version=\"2.12.2\"] .extend-reduce{background:var(--background);border-radius:3.6rem;color:var(--hero);cursor:pointer;font:600 1.4rem/1.8rem var(--font-family);height:3.6rem;left:50%;min-width:14rem;padding:0 2rem;position:absolute;text-align:center;transition:color .3s,background .3s}[data-gene-ui-version=\"2.12.2\"] .extend-reduce:hover{background:var(--hero);color:var(--hero-sc)}";
+styleInject(css_248z);
+
+const horizontalSizes = ['half', 'wide', 'minimal'];
+function Overlay(_ref) {
+  let {
+    position,
+    title,
+    description,
+    horizontalSize,
+    headerActions,
+    footer,
+    children,
+    onClose,
+    onClickOutside,
+    className,
+    closeText,
+    reduceText,
+    extendText,
+    withBackDrop,
+    onToggle,
+    isExtended,
+    ...restProps
+  } = _ref;
+  const setRef = useClickOutside(onClickOutside);
+  const [extended, setExtended] = useState(!!isExtended);
+  const isControlled = useMemo(() => typeof isExtended === 'boolean', [isExtended]);
+  const isVertical = useMemo(() => position === 'top' || position === 'bottom', [position]);
+  const toggleExtended = useCallback(() => setExtended(prev => !prev), []);
+  const handleToggle = useCallback(event => {
+    isControlled ? onToggle(event, extended) : toggleExtended();
+  }, [onToggle, extended]);
+  useKeyDown(e => onClose(e), [], {
+    current: window
+  }, ['Escape']);
+  useEffect(() => {
+    setExtended(isExtended);
+  }, [isExtended]);
+  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", _extends({
+    className: classnames(className, 'overlay-holder', "p-".concat(position), {
+      't-vertical': isVertical,
+      't-horizontal': !isVertical,
+      's-extended': isVertical && extended,
+      ["s-".concat(horizontalSize)]: !isVertical
+    })
+  }, restProps, {
+    ref: setRef
+  }), /*#__PURE__*/React__default.createElement("div", {
+    className: "overlay-head"
+  }, /*#__PURE__*/React__default.createElement(ModuleTitle, {
+    size: "extra-big",
+    title: title,
+    description: description,
+    position: isVertical ? position : 'top',
+    cornerRadius: isVertical ? 'position-radius' : 'no-radius'
+  }, headerActions, isVertical && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Divider, {
+    type: "vertical"
+  }), /*#__PURE__*/React__default.createElement(Button, {
+    onClick: onClose,
+    appearance: "minimal"
+  }, closeText))), !isVertical && /*#__PURE__*/React__default.createElement("div", {
+    className: "overlay-close"
+  }, /*#__PURE__*/React__default.createElement(Button, {
+    onClick: onClose,
+    icon: "bc-icon-close",
+    appearance: "minimal",
+    color: "default"
+  }))), /*#__PURE__*/React__default.createElement("div", {
+    className: "overlay-body"
+  }, /*#__PURE__*/React__default.createElement(CustomScrollbar, null, /*#__PURE__*/React__default.createElement("div", {
+    className: "overlay-content"
+  }, children), isVertical && /*#__PURE__*/React__default.createElement("div", {
+    className: "overlay-footer"
+  }, footer)), isVertical && /*#__PURE__*/React__default.createElement("button", {
+    onClick: handleToggle,
+    className: "extend-reduce"
+  }, extended ? reduceText : extendText))), withBackDrop && /*#__PURE__*/React__default.createElement("div", {
+    className: "overlay-back-drop"
+  }));
+}
+Overlay.propTypes = {
+  /**
+   * Controls position of the element
+   */
+  position: PropTypes.oneOf(positions),
+  /**
+   * Title for element
+   */
+  title: PropTypes.string,
+  /**
+   * Description text for element
+   */
+  description: PropTypes.string,
+  /**
+   * Controls size of the element
+   */
+  horizontalSize: PropTypes.oneOf(horizontalSizes),
+  /**
+   * Header action bar,
+   * React valid elements
+   */
+  headerActions: PropTypes.node,
+  /**
+   * Overlay footer
+   * React valid elements
+   */
+  footer: PropTypes.node,
+  /**
+   * Overlay content
+   * Valid React elements
+   */
+  children: PropTypes.node,
+  /**
+   * Fires event when user click on close button
+   * (event: Event) => void
+   */
+  onClose: PropTypes.func,
+  /**
+   * CSS class for element
+   */
+  className: PropTypes.string,
+  /**
+   * Custom text for close button
+   */
+  closeText: PropTypes.string,
+  /**
+   * Custom text for reduce button
+   */
+  reduceText: PropTypes.string,
+  /**
+   * Custom text for extend button
+   */
+  extendText: PropTypes.string,
+  /**
+   * Fires event when user click on outside of content
+   * (event: Event) => void
+   */
+  onClickOutside: PropTypes.func,
+  /**
+   * Adds a white layer on the background when Overlay opens
+   */
+  withBackDrop: PropTypes.bool,
+  /**
+   * with onToggle prop you wash the event listener pressing the open and close button
+   * (event: Event, extend: Boolean) => void
+   */
+  onToggle: PropTypes.func,
+  /**
+   * using isExtended props you can control the opening of the component
+   * if you add this prop then the component becomes controlled from outside
+   */
+  isExtended: PropTypes.bool
+};
+Overlay.defaultProps = {
+  position: positions[2],
+  horizontalSize: horizontalSizes[0],
+  closeText: 'Close',
+  reduceText: 'Reduce',
+  onClickOutside: noop,
+  extendText: 'Extend',
+  onClose: noop,
+  onToggle: noop,
+  withBackDrop: false
+};
+
+export { Overlay as default };

package/Overspread/index.js

@@ -0,0 +1,289 @@
+import { _ as _extends } from '../_rollupPluginBabelHelpers-e8fb2e5c.js';
+import React__default, { useState, useRef, useEffect, useCallback } from 'react';
+import PropTypes from 'prop-types';
+import { n as noop } from '../index-a0e4e333.js';
+import '../configs-fed6ac34.js';
+import useClickOutside from '../hooks/useClickOutside.js';
+import Icon from '../Icon/index.js';
+import Portal from '../Portal/index.js';
+import Popover from '../Popover/index.js';
+import Menu from '../Menu/index.js';
+import { D as Dropdown } from '../index-34e47647.js';
+import { s as styleInject } from '../style-inject.es-746bb8ed.js';
+import '../dateValidation-67caec66.js';
+import '../_commonjsHelpers-24198af3.js';
+import 'react-dom';
+import '../index-6ff23041.js';
+import '../GeneUIProvider/index.js';
+import '../Popover-f4d1cac0.js';
+import '../index-122432cd.js';
+import '../hooks/useDeviceType.js';
+import '../hooks/useWindowSize.js';
+import '../hooks/useUpdatableRef.js';
+import '../hooks/useForceUpdate.js';
+import '../Scrollbar/index.js';
+import '../guid-8ddf77b3.js';
+import '../Option/index.js';
+import '../hooks/useEllipsisDetection.js';
+import '../Tooltip/index.js';
+import '../objectWithoutPropertiesLoose-d8a4a68c.js';
+import '../react-lifecycles-compat.es-6e1f3768.js';
+import '../clsx.m-2bb6df4b.js';
+import '../hooks/useMount.js';
+import '../hooks/useClick.js';
+import '../hooks/useKeyDown.js';
+import '../BusyLoader/index.js';
+import '../Empty/index.js';
+import '../index-462461c0.js';
+import '../debounce-4419bc2f.js';
+import '../ExtendedInput/index.js';
+import '../SuggestionList/index.js';
+import '../config-0ca92874.js';
+import '../Checkbox/index.js';
+import '../checkboxRadioSwitcher-5b69d7bd.js';
+import '../index-2ad83e03.js';
+import '../Tag/index.js';
+
+var css_248z = "[data-gene-ui-version=\"2.12.2\"] .overspread-container{height:100%;left:0;overflow:hidden;position:fixed;top:0;width:100%;z-index:300}[data-gene-ui-version=\"2.12.2\"] .overspread-holder{animation:overspread-reveal .5s forwards;background:var(--background);display:grid;grid-template-columns:100%;grid-template-rows:auto 1fr;height:100%;transform:translate3d(0,100%,0);width:100%}@keyframes overspread-reveal{to{transform:translateZ(0)}}[data-gene-ui-version=\"2.12.2\"] .overspread-head{border-bottom:1px solid rgba(var(--background-sc-rgb),.05);display:grid;grid-template-areas:\"left center right\";grid-template-columns:1fr auto 1fr;padding:0 1rem;position:relative;width:100%}[data-gene-ui-version=\"2.12.2\"] .overspread-head>li{align-items:center;display:flex;height:4.6rem;overflow:hidden}[data-gene-ui-version=\"2.12.2\"] .overspread-head>li.over-h-act{font:600 1.5rem/2.3rem var(--font-family);grid-area:left;min-width:-webkit-fit-content;min-width:-moz-fit-content;min-width:fit-content;width:100%}[data-gene-ui-version=\"2.12.2\"] .overspread-head>li.over-h-act:last-child{grid-area:right;justify-content:flex-end}[data-gene-ui-version=\"2.12.2\"] .overspread-head>li.over-h-tt{font:600 1.7rem/2.3rem var(--font-family);grid-area:center}[data-gene-ui-version=\"2.12.2\"] .overspread-head>li>*{margin:0 .5rem}[data-gene-ui-version=\"2.12.2\"] .overspread-head>li .color-hero{color:var(--hero)}[data-gene-ui-version=\"2.12.2\"] .overspread-head button{transition:opacity .4s}[data-gene-ui-version=\"2.12.2\"] .overspread-head button:disabled{opacity:.5;pointer-events:none}[data-gene-ui-version=\"2.12.2\"] .overspread-body{-webkit-overflow-scrolling:touch;overflow-y:auto;padding:1.5rem}[data-gene-ui-version=\"2.12.2\"] .overspread-search{position:relative}[data-gene-ui-version=\"2.12.2\"] .overspread-search:not(:focus-within,.show-search) input{height:100%;left:0;opacity:0;position:absolute;top:0;width:100%}[data-gene-ui-version=\"2.12.2\"] .overspread-search:not(:focus-within,.show-search) .bc-icon-search{pointer-events:none}[data-gene-ui-version=\"2.12.2\"] .overspread-search:not(:focus-within,.show-search) .bc-icon-close{display:none}[data-gene-ui-version=\"2.12.2\"] .overspread-search.show-search,[data-gene-ui-version=\"2.12.2\"] .overspread-search:focus-within{background:var(--background);display:flex;left:0;margin:0;padding:0 1rem;position:absolute;top:50%;transform:translateY(-50%);width:100%;z-index:10}[data-gene-ui-version=\"2.12.2\"] .overspread-search.show-search>*,[data-gene-ui-version=\"2.12.2\"] .overspread-search:focus-within>*{padding:0 .5rem}[data-gene-ui-version=\"2.12.2\"] .overspread-search.show-search .bc-icon-search,[data-gene-ui-version=\"2.12.2\"] .overspread-search:focus-within .bc-icon-search{display:none}[data-gene-ui-version=\"2.12.2\"] .overspread-search.show-search input,[data-gene-ui-version=\"2.12.2\"] .overspread-search:focus-within input{font:600 1.4rem var(--font-family);height:2.4rem;width:100%}[data-gene-ui-version=\"2.12.2\"] .overspread-search.show-search input::input-placeholder,[data-gene-ui-version=\"2.12.2\"] .overspread-search:focus-within input::input-placeholder{color:rgba(var(--background-sc-rgb),.5);font-size:1.4rem;font-weight:600}[data-gene-ui-version=\"2.12.2\"] .overspread-search.show-search input:placeholder,[data-gene-ui-version=\"2.12.2\"] .overspread-search:focus-within input:placeholder{color:rgba(var(--background-sc-rgb),.5);font-size:1.4rem;font-weight:600}[data-gene-ui-version=\"2.12.2\"] .overspread-search.show-search input::placeholder,[data-gene-ui-version=\"2.12.2\"] .overspread-search:focus-within input::placeholder{color:rgba(var(--background-sc-rgb),.5);font-size:1.4rem;font-weight:600}[data-gene-ui-version=\"2.12.2\"] .overspread-search.show-search input:input-placeholder,[data-gene-ui-version=\"2.12.2\"] .overspread-search:focus-within input:input-placeholder{color:rgba(var(--background-sc-rgb),.5);font-size:1.4rem;font-weight:600}[data-gene-ui-version=\"2.12.2\"] .back-button-holder{align-items:center;cursor:pointer;display:flex}";
+styleInject(css_248z);
+
+function Overspread(props) {
+  const {
+    opened,
+    title,
+    hasDone,
+    disabledDone,
+    children,
+    hasSearch,
+    hasOptions,
+    titleHasOptions,
+    searchOutput,
+    hasBack,
+    doneText,
+    backWithIcon,
+    backText,
+    doneWithIcon,
+    onClose,
+    onDone,
+    onBack,
+    onSelectingOption,
+    onSelectingTitleOption,
+    dataForOptions,
+    dataForTitleWithOptions,
+    defaultValueForTitleWithOptions,
+    onAnimationEnd,
+    ...restProps
+  } = props;
+  const isControlled = ('opened' in props);
+  const [isOpen, setIsOpen] = useState(opened);
+  const [optionsPopoverIsOpen, setOptionsPopoverIsOpen] = useState(false);
+  const portalRef = useRef(null);
+  useEffect(() => setIsOpen(opened), [opened]);
+  const handleSearchOutput = useCallback(e => {
+    searchOutput && searchOutput(e.target.value);
+  }, [searchOutput]);
+  const handleClose = useCallback(e => {
+    !isControlled && setIsOpen(isOpen => !isOpen);
+    onClose && onClose(e);
+  }, [onClose, isControlled]);
+  const handleDone = useCallback(e => {
+    !isControlled && setIsOpen(isOpen => !isOpen);
+    onDone && onDone(e);
+  }, [onDone, isControlled]);
+  const outsideClickHandler = useCallback(() => {
+    setOptionsPopoverIsOpen(false);
+  }, []);
+  const outsideClickRef = useClickOutside(outsideClickHandler);
+  const onAnimationEndHandler = useCallback(() => {
+    onAnimationEnd && onAnimationEnd();
+  }, [onAnimationEnd]);
+  useEffect(() => {
+    var _portalRef$current;
+    portalRef === null || portalRef === void 0 ? void 0 : (_portalRef$current = portalRef.current) === null || _portalRef$current === void 0 ? void 0 : _portalRef$current.addEventListener('animationend', onAnimationEndHandler);
+  }, [portalRef.current, isOpen]);
+  const cleanup = () => {
+    var _portalRef$current2;
+    portalRef === null || portalRef === void 0 ? void 0 : (_portalRef$current2 = portalRef.current) === null || _portalRef$current2 === void 0 ? void 0 : _portalRef$current2.removeEventListener('animationend', onAnimationEndHandler);
+  };
+  useEffect(() => cleanup, []);
+  return /*#__PURE__*/React__default.createElement(Portal, {
+    isOpen: isOpen
+  }, /*#__PURE__*/React__default.createElement("div", _extends({
+    className: "overspread-container"
+  }, restProps), /*#__PURE__*/React__default.createElement("div", {
+    className: "overspread-holder",
+    ref: portalRef
+  }, /*#__PURE__*/React__default.createElement("ul", {
+    className: "overspread-head"
+  }, /*#__PURE__*/React__default.createElement("li", {
+    className: "over-h-act"
+  }, hasBack ? /*#__PURE__*/React__default.createElement("p", {
+    onClick: onBack,
+    className: "back-button-holder cursor-pointer"
+  }, backWithIcon && /*#__PURE__*/React__default.createElement(Icon, {
+    type: "bc-icon-arrow-left"
+  }), /*#__PURE__*/React__default.createElement("span", null, backText)) : /*#__PURE__*/React__default.createElement(Icon, {
+    type: "bc-icon-close",
+    onClick: handleClose,
+    className: "cursor-pointer"
+  })), /*#__PURE__*/React__default.createElement("li", {
+    className: "over-h-tt"
+  }, titleHasOptions ? /*#__PURE__*/React__default.createElement(Dropdown, {
+    hasSearch: false,
+    value: defaultValueForTitleWithOptions.value,
+    data: dataForTitleWithOptions,
+    placeholder: " ",
+    appearance: "light",
+    onChange: onSelectingTitleOption,
+    flexibility: "content-size"
+  }) : /*#__PURE__*/React__default.createElement("p", {
+    className: "ellipsis-text"
+  }, title)), /*#__PURE__*/React__default.createElement("li", {
+    className: "over-h-act"
+  }, hasSearch && /*#__PURE__*/React__default.createElement("div", {
+    className: "overspread-search cursor-pointer"
+  }, /*#__PURE__*/React__default.createElement(Icon, {
+    type: "bc-icon-close"
+  }), /*#__PURE__*/React__default.createElement("input", {
+    onChange: handleSearchOutput,
+    placeholder: "Search"
+  }), /*#__PURE__*/React__default.createElement(Icon, {
+    type: "bc-icon-search"
+  })), hasOptions && /*#__PURE__*/React__default.createElement(Popover, {
+    isOpen: optionsPopoverIsOpen,
+    extendTargetWidth: false,
+    Content: /*#__PURE__*/React__default.createElement(Menu, {
+      ref: outsideClickRef,
+      data: dataForOptions,
+      onSelect: function () {
+        setOptionsPopoverIsOpen(false);
+        onSelectingOption(...arguments);
+      }
+    }),
+    align: "end"
+  }, /*#__PURE__*/React__default.createElement(Icon, {
+    type: "bc-icon-more-vertical",
+    onClick: () => setOptionsPopoverIsOpen(true)
+  })), hasDone && /*#__PURE__*/React__default.createElement("button", {
+    disabled: disabledDone,
+    onClick: handleDone,
+    className: "color-hero cursor-pointer"
+  }, doneWithIcon ? /*#__PURE__*/React__default.createElement(Icon, {
+    type: "bc-icon-checkbox-checked"
+  }) : doneText))), children && /*#__PURE__*/React__default.createElement("div", {
+    className: "overspread-body"
+  }, children))));
+}
+Overspread.propTypes = {
+  title: PropTypes.string,
+  /**
+   * Enables title's dropdown,
+   */
+  titleHasOptions: PropTypes.bool,
+  /**
+   * Fires event for handling change of value/selected option
+   * ((event: Event) => void)
+   */
+  onSelectingTitleOption: PropTypes.func,
+  /**
+   * Title's dropdown data
+   */
+  dataForTitleWithOptions: PropTypes.array,
+  /**
+   *  Default value for title's dropdown
+   */
+  defaultValueForTitleWithOptions: PropTypes.object,
+  /**
+   * Enables search,
+   */
+  hasSearch: PropTypes.bool,
+  /**
+   * Fires event when user types in search field
+   * (event: Event) => void
+   */
+  searchOutput: PropTypes.func,
+  /**
+   * Displays dropdown on the right corner,
+   */
+  hasOptions: PropTypes.bool,
+  /**
+   * Right corner dropdown's data
+   */
+  dataForOptions: PropTypes.array,
+  /**
+   * Fires event for handling change of value/selected option
+   * ((event: Event) => void)
+   */
+  onSelectingOption: PropTypes.func,
+  /** Opened state */
+  opened: PropTypes.bool,
+  /**
+   * Any valid node
+   */
+  children: PropTypes.node,
+  /**
+   * Enables done button on the right corner,
+   */
+  hasDone: PropTypes.bool,
+  /**
+   * Shows done icon instead of text
+   */
+  doneWithIcon: PropTypes.bool,
+  /**
+   * Done button disabled state
+   */
+  disabledDone: PropTypes.bool,
+  /**
+   * Custom text for done button
+   */
+  doneText: PropTypes.string,
+  /**
+   * Fires event when done button is clicked
+   * ((event: Event) => void)
+   */
+  onDone: PropTypes.func,
+  /**
+   * Enables back button on the left corner,
+   */
+  hasBack: PropTypes.bool,
+  /**
+   * Custom text for back button
+   */
+  backText: PropTypes.string,
+  /**
+   * Displays chevron icon in back button
+   */
+  backWithIcon: PropTypes.bool,
+  /**
+   * Fires event when back button is clicked
+   * ((event: Event) => void)
+   */
+  onBack: PropTypes.func,
+  /**
+   * Fires event when close icon is clicked
+   * ((event: Event) => void)
+   */
+  onClose: PropTypes.func,
+  /**
+   * Function calls when the animation ends.
+   */
+  onAnimationEnd: PropTypes.func
+};
+Overspread.defaultProps = {
+  hasSearch: false,
+  hasBack: false,
+  hasOptions: false,
+  doneText: 'Done',
+  titleHasOptions: false,
+  backWithIcon: false,
+  doneWithIcon: false,
+  hasDone: true,
+  onDone: noop,
+  onBack: noop,
+  onClose: noop,
+  onSelectingOption: noop,
+  onSelectingTitleOption: noop,
+  onAnimationEnd: noop
+};
+
+export { Overspread as default };

package/{Pagination.js → Pagination/index.js}

@@ -1,31 +1,32 @@
 import React__default, { useState, useCallback } from 'react';
-import { p as propTypesExports } from './index-e0af0caf.js';
-import { c as classnames } from './index-6ff23041.js';
-import { a as conflictPropsLog, k as keyboardHandler } from './index-ac59cb10.js';
-import Button from './Button.js';
-import Divider from './Divider.js';
-import TextInput from './ValidatableTextInput.js';
-import Tooltip from './Tooltip.js';
-import './globalStyling-9c60a159.js';
-import { s as styleInject } from './style-inject.es-746bb8ed.js';
-import './dateValidation-67caec66.js';
-import './_commonjsHelpers-24198af3.js';
+import PropTypes from 'prop-types';
+import { c as classnames } from '../index-6ff23041.js';
+import { a as conflictPropsLog, k as keyboardHandler } from '../index-a0e4e333.js';
+import Button from '../Button/index.js';
+import Divider from '../Divider/index.js';
+import Tooltip from '../Tooltip/index.js';
+import TextInput from '../ValidatableTextInput/index.js';
+import { s as styleInject } from '../style-inject.es-746bb8ed.js';
+import '../dateValidation-67caec66.js';
+import '../_commonjsHelpers-24198af3.js';
 import 'react-dom';
-import './_rollupPluginBabelHelpers-e8fb2e5c.js';
-import './Icon.js';
-import './useMount-6fef51a5.js';
-import './configs-91c86664.js';
-import './ExtendedInput.js';
-import './useDeviceType-dd51db38.js';
-import './useWindowSize-80369d76.js';
-import './index-897d8240.js';
-import './useKeyDown-38102ae7.js';
-import './useClickOutside-5183e396.js';
-import './Scrollbar.js';
-import './Popover-f4d1cac0.js';
-import './GeneUIProvider.js';
+import '../_rollupPluginBabelHelpers-e8fb2e5c.js';
+import '../Icon/index.js';
+import '../Popover-f4d1cac0.js';
+import '../configs-fed6ac34.js';
+import '../hooks/useDeviceType.js';
+import '../hooks/useWindowSize.js';
+import '../GeneUIProvider/index.js';
+import '../hooks/useMount.js';
+import '../ExtendedInput/index.js';
+import '../hooks/useEllipsisDetection.js';
+import '../SuggestionList/index.js';
+import '../hooks/useKeyDown.js';
+import '../hooks/useClickOutside.js';
+import '../config-0ca92874.js';
+import '../Scrollbar/index.js';
 
-var css_248z = "[data-gene-ui-version=\"1.0.0\"] .pagination-holder{align-items:center;display:flex}[data-gene-ui-version=\"1.0.0\"] .pagination-holder .icon{cursor:pointer}[data-gene-ui-version=\"1.0.0\"] .pagination-holder .defaultCursor{cursor:default}[data-gene-ui-version=\"1.0.0\"] .pagination-holder .input-element{text-align:center}";
+var css_248z = "[data-gene-ui-version=\"2.12.2\"] .pagination-holder{align-items:center;display:flex}[data-gene-ui-version=\"2.12.2\"] .pagination-holder .icon{cursor:pointer}[data-gene-ui-version=\"2.12.2\"] .pagination-holder .defaultCursor{cursor:default}[data-gene-ui-version=\"2.12.2\"] .pagination-holder .input-element{text-align:center}";
 styleInject(css_248z);
 
 const drawCount = 5;
@@ -215,37 +216,37 @@ Pagination.propTypes = {
    * Fires event when user changes the page
    * (page: Number) => void
    */
-  onChange: propTypesExports.func,
+  onChange: PropTypes.func,
   /**
    * Initially selected page
    */
-  selected: propTypesExports.number,
+  selected: PropTypes.number,
   /**
    * Custom text if element will indicate error
    */
-  errorText: propTypesExports.string,
+  errorText: PropTypes.string,
   /**
    * Turn on/off pagination's autofocus
    */
-  autoFocus: propTypesExports.bool,
+  autoFocus: PropTypes.bool,
   /**
    * Initially selected page
    */
-  defaultSelected: propTypesExports.number,
+  defaultSelected: PropTypes.number,
   /**
    * Total pages count
    */
-  count: propTypesExports.number.isRequired,
+  count: PropTypes.number.isRequired,
   /**
    * Text for next icon tooltip.
    */
-  nextIconTooltipText: propTypesExports.string,
+  nextIconTooltipText: PropTypes.string,
   /**
    * Text for previous icon tooltip.
    */
-  previousIconTooltipText: propTypesExports.string,
+  previousIconTooltipText: PropTypes.string,
   // TODO: bad naming
-  supportedKeyCodes: propTypesExports.arrayOf(propTypesExports.number)
+  supportedKeyCodes: PropTypes.arrayOf(PropTypes.number)
 };
 Pagination.defaultProps = {
   count: 1,