@geneui/components 2.11.1 → 2.12.1

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.1\"] .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.1\"] .overlay-holder{display:flex;flex-direction:column;position:fixed;transition:width .4s,height .4s;z-index:300}[data-gene-ui-version=\"2.12.1\"] .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.1\"] .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.1\"] .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.1\"] .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.1\"] .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.1\"] .overlay-holder.t-horizontal.s-half{width:50%}[data-gene-ui-version=\"2.12.1\"] .overlay-holder.t-horizontal.s-wide{width:75%}[data-gene-ui-version=\"2.12.1\"] .overlay-holder.t-horizontal.s-minimal{width:30rem}[data-gene-ui-version=\"2.12.1\"] .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.1\"] .overlay-holder.t-vertical.s-extended{height:50vh}[data-gene-ui-version=\"2.12.1\"] .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.1\"] .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.1\"] .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.1\"] .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.1\"] .overlay-head{flex-shrink:0;position:relative;z-index:1}[data-gene-ui-version=\"2.12.1\"] .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.1\"] .overlay-body{display:flex;flex:auto;flex-direction:column;position:relative}[data-gene-ui-version=\"2.12.1\"] .overlay-body>.scroll-holder{height:100%;left:0;position:absolute!important;top:0;width:100%}[data-gene-ui-version=\"2.12.1\"] .overlay-body>.scroll-holder>.scroll-content{align-items:stretch;display:flex;flex-direction:column;justify-content:flex-start}[data-gene-ui-version=\"2.12.1\"] .overlay-body .overlay-content{flex:auto;padding:2.1rem 1.9rem}[data-gene-ui-version=\"2.12.1\"] .overlay-body .overlay-footer{display:flex;flex-shrink:0;justify-content:flex-end}[data-gene-ui-version=\"2.12.1\"] .overlay-body .overlay-footer>*{margin:1rem}[data-gene-ui-version=\"2.12.1\"] .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.1\"] .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.js → Overspread/index.js}

@@ -1,104 +1,48 @@
-import { _ as _extends } from './_rollupPluginBabelHelpers-e8fb2e5c.js';
+import { _ as _extends } from '../_rollupPluginBabelHelpers-e8fb2e5c.js';
 import React__default, { useState, useRef, useEffect, useCallback } from 'react';
-import { p as propTypesExports } from './index-e0af0caf.js';
-import { n as noop } from './index-ac59cb10.js';
-import './configs-91c86664.js';
-import { u as useClickOutside } from './useClickOutside-5183e396.js';
-import Icon from './Icon.js';
-import Portal from './Portal.js';
-import { m as Dropdown } from './index-0cf65939.js';
-import { P as Popover } from './index-a4635754.js';
-import Menu from './Menu.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 { 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-bd525a3a.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.js';
-import './Editor.js';
-import './useMount-6fef51a5.js';
-import './useDeviceType-dd51db38.js';
-import './useWindowSize-80369d76.js';
-import './Button.js';
-import './ValidatableUploader.js';
-import './index-d9e8a888.js';
-import './Grid.js';
-import './useWidth-9f4647f8.js';
-import './useKeyDown-38102ae7.js';
-import './BusyLoader.js';
-import './Image.js';
-import './Empty.js';
-import './Tooltip.js';
-import './Popover-f4d1cac0.js';
-import './Checkbox.js';
-import './checkboxRadioSwitcher-5b69d7bd.js';
-import './guid-8ddf77b3.js';
-import './ExtendedInput.js';
-import './index-5cea9a7d.js';
-import './Scrollbar.js';
-import './ValidatableRadio.js';
-import './RadioGroup.js';
-import './Radio.js';
-import './ValidatableCheckbox.js';
-import './ValidatableSwitcher.js';
-import './Switcher.js';
-import './ValidatableNumberInput.js';
-import './ValidatableTextInput.js';
-import './ValidatableDatePicker.js';
-import './index-5e722d91.js';
-import './index-702bf24a.js';
-import './index-122432cd.js';
-import './debounce-4419bc2f.js';
-import './DatePicker.js';
-import './localization-4ba17032.js';
-import './checkTimeValidation-e56771be.js';
-import './useEllipsisDetection-ef536015.js';
-import './Tabs.js';
-import './Steps.js';
-import './Timeline.js';
-import './Card.js';
-import './MobilePopup.js';
-import './SkeletonLoader.js';
-import './KeyValue.js';
-import './configs.js';
-import './Tag.js';
-import './Alert.js';
-import './index-00fe8887.js';
-import './rangeAndSlider-20599da4.js';
-import './Slider.js';
-import './Pagination.js';
-import './Divider.js';
-import './objectWithoutPropertiesLoose-299691d8.js';
-import './clsx.m-2bb6df4b.js';
-import './index-a59530cd.js';
-import './Notification.js';
-import './Modal.js';
-import './Collapse.js';
-import './Status.js';
-import './Avatar.js';
-import './Search.js';
-import './TextLink.js';
-import './Label.js';
-import './Paper.js';
-import './Badge.js';
-import './Time.js';
-import './Title.js';
-import './Option.js';
-import './index-b7a33c58.js';
-import './QRCode.js';
-import './Progress.js';
-import './MobileNavigation.js';
-import './Products.js';
-import './Breadcrumb.js';
-import './Section.js';
-import './ColorPicker.js';
-import './NavigationMenu.js';
-import './Textarea.js';
-import './AdvancedSearch.js';
-import './LinkButton.js';
+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 '../ExtendedInput/index.js';
+import '../SuggestionList/index.js';
+import '../config-0ca92874.js';
+import '../Checkbox/index.js';
+import '../checkboxRadioSwitcher-5b69d7bd.js';
+import '../index-583e0b30.js';
+import '../Tag/index.js';
 
-var css_248z = "[data-gene-ui-version=\"2.11.0\"] .overspread-container{height:100%;left:0;overflow:hidden;position:fixed;top:0;width:100%;z-index:300}[data-gene-ui-version=\"2.11.0\"] .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.11.0\"] .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.11.0\"] .overspread-head>li{align-items:center;display:flex;height:4.6rem;overflow:hidden}[data-gene-ui-version=\"2.11.0\"] .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.11.0\"] .overspread-head>li.over-h-act:last-child{grid-area:right;justify-content:flex-end}[data-gene-ui-version=\"2.11.0\"] .overspread-head>li.over-h-tt{font:600 1.7rem/2.3rem var(--font-family);grid-area:center}[data-gene-ui-version=\"2.11.0\"] .overspread-head>li>*{margin:0 .5rem}[data-gene-ui-version=\"2.11.0\"] .overspread-head>li .color-hero{color:var(--hero)}[data-gene-ui-version=\"2.11.0\"] .overspread-head button{transition:opacity .4s}[data-gene-ui-version=\"2.11.0\"] .overspread-head button:disabled{opacity:.5;pointer-events:none}[data-gene-ui-version=\"2.11.0\"] .overspread-body{-webkit-overflow-scrolling:touch;overflow-y:auto;padding:1.5rem}[data-gene-ui-version=\"2.11.0\"] .overspread-search{position:relative}[data-gene-ui-version=\"2.11.0\"] .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.11.0\"] .overspread-search:not(:focus-within,.show-search) .bc-icon-search{pointer-events:none}[data-gene-ui-version=\"2.11.0\"] .overspread-search:not(:focus-within,.show-search) .bc-icon-close{display:none}[data-gene-ui-version=\"2.11.0\"] .overspread-search.show-search,[data-gene-ui-version=\"2.11.0\"] .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.11.0\"] .overspread-search.show-search>*,[data-gene-ui-version=\"2.11.0\"] .overspread-search:focus-within>*{padding:0 .5rem}[data-gene-ui-version=\"2.11.0\"] .overspread-search.show-search .bc-icon-search,[data-gene-ui-version=\"2.11.0\"] .overspread-search:focus-within .bc-icon-search{display:none}[data-gene-ui-version=\"2.11.0\"] .overspread-search.show-search input,[data-gene-ui-version=\"2.11.0\"] .overspread-search:focus-within input{font:600 1.4rem var(--font-family);height:2.4rem;width:100%}[data-gene-ui-version=\"2.11.0\"] .overspread-search.show-search input::input-placeholder,[data-gene-ui-version=\"2.11.0\"] .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.11.0\"] .overspread-search.show-search input:placeholder,[data-gene-ui-version=\"2.11.0\"] .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.11.0\"] .overspread-search.show-search input::placeholder,[data-gene-ui-version=\"2.11.0\"] .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.11.0\"] .overspread-search.show-search input:input-placeholder,[data-gene-ui-version=\"2.11.0\"] .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.11.0\"] .back-button-holder{align-items:center;cursor:pointer;display:flex}";
+var css_248z = "[data-gene-ui-version=\"2.12.1\"] .overspread-container{height:100%;left:0;overflow:hidden;position:fixed;top:0;width:100%;z-index:300}[data-gene-ui-version=\"2.12.1\"] .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.1\"] .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.1\"] .overspread-head>li{align-items:center;display:flex;height:4.6rem;overflow:hidden}[data-gene-ui-version=\"2.12.1\"] .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.1\"] .overspread-head>li.over-h-act:last-child{grid-area:right;justify-content:flex-end}[data-gene-ui-version=\"2.12.1\"] .overspread-head>li.over-h-tt{font:600 1.7rem/2.3rem var(--font-family);grid-area:center}[data-gene-ui-version=\"2.12.1\"] .overspread-head>li>*{margin:0 .5rem}[data-gene-ui-version=\"2.12.1\"] .overspread-head>li .color-hero{color:var(--hero)}[data-gene-ui-version=\"2.12.1\"] .overspread-head button{transition:opacity .4s}[data-gene-ui-version=\"2.12.1\"] .overspread-head button:disabled{opacity:.5;pointer-events:none}[data-gene-ui-version=\"2.12.1\"] .overspread-body{-webkit-overflow-scrolling:touch;overflow-y:auto;padding:1.5rem}[data-gene-ui-version=\"2.12.1\"] .overspread-search{position:relative}[data-gene-ui-version=\"2.12.1\"] .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.1\"] .overspread-search:not(:focus-within,.show-search) .bc-icon-search{pointer-events:none}[data-gene-ui-version=\"2.12.1\"] .overspread-search:not(:focus-within,.show-search) .bc-icon-close{display:none}[data-gene-ui-version=\"2.12.1\"] .overspread-search.show-search,[data-gene-ui-version=\"2.12.1\"] .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.1\"] .overspread-search.show-search>*,[data-gene-ui-version=\"2.12.1\"] .overspread-search:focus-within>*{padding:0 .5rem}[data-gene-ui-version=\"2.12.1\"] .overspread-search.show-search .bc-icon-search,[data-gene-ui-version=\"2.12.1\"] .overspread-search:focus-within .bc-icon-search{display:none}[data-gene-ui-version=\"2.12.1\"] .overspread-search.show-search input,[data-gene-ui-version=\"2.12.1\"] .overspread-search:focus-within input{font:600 1.4rem var(--font-family);height:2.4rem;width:100%}[data-gene-ui-version=\"2.12.1\"] .overspread-search.show-search input::input-placeholder,[data-gene-ui-version=\"2.12.1\"] .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.1\"] .overspread-search.show-search input:placeholder,[data-gene-ui-version=\"2.12.1\"] .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.1\"] .overspread-search.show-search input::placeholder,[data-gene-ui-version=\"2.12.1\"] .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.1\"] .overspread-search.show-search input:input-placeholder,[data-gene-ui-version=\"2.12.1\"] .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.1\"] .back-button-holder{align-items:center;cursor:pointer;display:flex}";
 styleInject(css_248z);
 
 function Overspread(props) {
@@ -229,99 +173,99 @@ function Overspread(props) {
   }, children))));
 }
 Overspread.propTypes = {
-  title: propTypesExports.string,
+  title: PropTypes.string,
   /**
    * Enables title's dropdown,
    */
-  titleHasOptions: propTypesExports.bool,
+  titleHasOptions: PropTypes.bool,
   /**
    * Fires event for handling change of value/selected option
    * ((event: Event) => void)
    */
-  onSelectingTitleOption: propTypesExports.func,
+  onSelectingTitleOption: PropTypes.func,
   /**
    * Title's dropdown data
    */
-  dataForTitleWithOptions: propTypesExports.array,
+  dataForTitleWithOptions: PropTypes.array,
   /**
    *  Default value for title's dropdown
    */
-  defaultValueForTitleWithOptions: propTypesExports.object,
+  defaultValueForTitleWithOptions: PropTypes.object,
   /**
    * Enables search,
    */
-  hasSearch: propTypesExports.bool,
+  hasSearch: PropTypes.bool,
   /**
    * Fires event when user types in search field
    * (event: Event) => void
    */
-  searchOutput: propTypesExports.func,
+  searchOutput: PropTypes.func,
   /**
    * Displays dropdown on the right corner,
    */
-  hasOptions: propTypesExports.bool,
+  hasOptions: PropTypes.bool,
   /**
    * Right corner dropdown's data
    */
-  dataForOptions: propTypesExports.array,
+  dataForOptions: PropTypes.array,
   /**
    * Fires event for handling change of value/selected option
    * ((event: Event) => void)
    */
-  onSelectingOption: propTypesExports.func,
+  onSelectingOption: PropTypes.func,
   /** Opened state */
-  opened: propTypesExports.bool,
+  opened: PropTypes.bool,
   /**
    * Any valid node
    */
-  children: propTypesExports.node,
+  children: PropTypes.node,
   /**
    * Enables done button on the right corner,
    */
-  hasDone: propTypesExports.bool,
+  hasDone: PropTypes.bool,
   /**
    * Shows done icon instead of text
    */
-  doneWithIcon: propTypesExports.bool,
+  doneWithIcon: PropTypes.bool,
   /**
    * Done button disabled state
    */
-  disabledDone: propTypesExports.bool,
+  disabledDone: PropTypes.bool,
   /**
    * Custom text for done button
    */
-  doneText: propTypesExports.string,
+  doneText: PropTypes.string,
   /**
    * Fires event when done button is clicked
    * ((event: Event) => void)
    */
-  onDone: propTypesExports.func,
+  onDone: PropTypes.func,
   /**
    * Enables back button on the left corner,
    */
-  hasBack: propTypesExports.bool,
+  hasBack: PropTypes.bool,
   /**
    * Custom text for back button
    */
-  backText: propTypesExports.string,
+  backText: PropTypes.string,
   /**
    * Displays chevron icon in back button
    */
-  backWithIcon: propTypesExports.bool,
+  backWithIcon: PropTypes.bool,
   /**
    * Fires event when back button is clicked
    * ((event: Event) => void)
    */
-  onBack: propTypesExports.func,
+  onBack: PropTypes.func,
   /**
    * Fires event when close icon is clicked
    * ((event: Event) => void)
    */
-  onClose: propTypesExports.func,
+  onClose: PropTypes.func,
   /**
    * Function calls when the animation ends.
    */
-  onAnimationEnd: propTypesExports.func
+  onAnimationEnd: PropTypes.func
 };
 Overspread.defaultProps = {
   hasSearch: false,

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-5cea9a7d.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=\"2.11.0\"] .pagination-holder{align-items:center;display:flex}[data-gene-ui-version=\"2.11.0\"] .pagination-holder .icon{cursor:pointer}[data-gene-ui-version=\"2.11.0\"] .pagination-holder .defaultCursor{cursor:default}[data-gene-ui-version=\"2.11.0\"] .pagination-holder .input-element{text-align:center}";
+var css_248z = "[data-gene-ui-version=\"2.12.1\"] .pagination-holder{align-items:center;display:flex}[data-gene-ui-version=\"2.12.1\"] .pagination-holder .icon{cursor:pointer}[data-gene-ui-version=\"2.12.1\"] .pagination-holder .defaultCursor{cursor:default}[data-gene-ui-version=\"2.12.1\"] .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,