@adaptabletools/adaptable 17.0.0-canary.4 → 17.0.0-canary.5

package/src/components/OverlayTrigger/index.js

@@ -1,38 +1,43 @@
-import { __rest } from "tslib";
-import * as React from 'react';
-import { useRef, useEffect } from 'react';
-import batchUpdate from '../utils/batchUpdate';
-import selectParent from '../utils/selectParent';
-import useProperty from '../utils/useProperty';
-import Overlay from './Overlay';
-import join from '../utils/join';
-import usePrevious from '../utils/usePrevious';
-import { getDocRect, getRect } from './utils';
-import useAgGridClassName from './useAgGridClassName';
-import contains from '../utils/contains';
-import { isBrowserDocumentAvailable } from '../../View/UIHelper';
-import { useOverlay } from '../InfiniteTable';
-import { useAdaptable } from '../../View/AdaptableContext';
-export const getConstrainElement = (target, constrainTo) => {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getConstrainRect = exports.getConstrainElement = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const react_1 = require("react");
+const batchUpdate_1 = tslib_1.__importDefault(require("../utils/batchUpdate"));
+const selectParent_1 = tslib_1.__importDefault(require("../utils/selectParent"));
+const useProperty_1 = tslib_1.__importDefault(require("../utils/useProperty"));
+const Overlay_1 = tslib_1.__importDefault(require("./Overlay"));
+const join_1 = tslib_1.__importDefault(require("../utils/join"));
+const usePrevious_1 = tslib_1.__importDefault(require("../utils/usePrevious"));
+const utils_1 = require("./utils");
+const useAgGridClassName_1 = tslib_1.__importDefault(require("./useAgGridClassName"));
+const contains_1 = tslib_1.__importDefault(require("../utils/contains"));
+const UIHelper_1 = require("../../View/UIHelper");
+const InfiniteTable_1 = require("../InfiniteTable");
+const AdaptableContext_1 = require("../../View/AdaptableContext");
+const getConstrainElement = (target, constrainTo) => {
     let el = null;
     if (typeof constrainTo === 'string') {
-        el = selectParent(constrainTo, target);
+        el = (0, selectParent_1.default)(constrainTo, target);
     }
     if (typeof constrainTo === 'function') {
         el = constrainTo(target);
     }
     return el;
 };
-export const getConstrainRect = (target, constrainTo) => {
-    let el = getConstrainElement(target, constrainTo);
+exports.getConstrainElement = getConstrainElement;
+const getConstrainRect = (target, constrainTo) => {
+    let el = (0, exports.getConstrainElement)(target, constrainTo);
     if (el && el.tagName) {
-        return getRect(el);
+        return (0, utils_1.getRect)(el);
     }
-    return getDocRect();
+    return (0, utils_1.getDocRect)();
 };
+exports.getConstrainRect = getConstrainRect;
 let portalElement;
 const ensurePortalElement = () => {
-    if (!isBrowserDocumentAvailable()) {
+    if (!(0, UIHelper_1.isBrowserDocumentAvailable)()) {
         return;
     }
     if (portalElement) {
@@ -46,7 +51,7 @@ const ensurePortalElement = () => {
     document.body.appendChild(portalElement);
 };
 const OverlayTrigger = React.forwardRef((props, ref) => {
-    const adaptable = useAdaptable();
+    const adaptable = (0, AdaptableContext_1.useAdaptable)();
     let { visible: _, showTriangle, showEvent, hideEvent, render, targetOffset, preventPortalEventPropagation = false, defaultZIndex, anchor, hideDelay = 0, opacityTransitionDuration, onVisibleChange, alignPosition = [
         // overlay - target
         ['TopLeft', 'BottomLeft'],
@@ -58,15 +63,15 @@ const OverlayTrigger = React.forwardRef((props, ref) => {
         ['BottomRight', 'TopRight'],
         ['BottomRight', 'TopCenter'],
         ['BottomRight', 'TopLeft'],
-    ], constrainTo, target: targetProp } = props, domProps = __rest(props, ["visible", "showTriangle", "showEvent", "hideEvent", "render", "targetOffset", "preventPortalEventPropagation", "defaultZIndex", "anchor", "hideDelay", "opacityTransitionDuration", "onVisibleChange", "alignPosition", "constrainTo", "target"]);
-    const { showOverlay, clearAll: clearAllOverlays, hideOverlay, portal, } = useOverlay({
+    ], constrainTo, target: targetProp } = props, domProps = tslib_1.__rest(props, ["visible", "showTriangle", "showEvent", "hideEvent", "render", "targetOffset", "preventPortalEventPropagation", "defaultZIndex", "anchor", "hideDelay", "opacityTransitionDuration", "onVisibleChange", "alignPosition", "constrainTo", "target"]);
+    const { showOverlay, clearAll: clearAllOverlays, hideOverlay, portal, } = (0, InfiniteTable_1.useOverlay)({
         portalContainer: portalElement,
     });
-    const domRef = useRef(null);
-    const targetRef = useRef(null);
-    const overlayRef = useRef(null);
-    const [visible, doSetVisible] = useProperty(props, 'visible', false);
-    const hideTimeoutRef = useRef(null);
+    const domRef = (0, react_1.useRef)(null);
+    const targetRef = (0, react_1.useRef)(null);
+    const overlayRef = (0, react_1.useRef)(null);
+    const [visible, doSetVisible] = (0, useProperty_1.default)(props, 'visible', false);
+    const hideTimeoutRef = (0, react_1.useRef)(null);
     const setVisible = React.useCallback((visible) => {
         onVisibleChange === null || onVisibleChange === void 0 ? void 0 : onVisibleChange(visible);
         if (!visible) {
@@ -82,24 +87,24 @@ const OverlayTrigger = React.forwardRef((props, ref) => {
         }
         doSetVisible(true);
     }, []);
-    const prevVisible = usePrevious(visible, false);
+    const prevVisible = (0, usePrevious_1.default)(visible, false);
     ensurePortalElement();
     const onShow = React.useCallback((event) => {
         const target = targetRef.current;
-        if (event && preventPortalEventPropagation && !contains(target, event.target)) {
+        if (event && preventPortalEventPropagation && !(0, contains_1.default)(target, event.target)) {
             // because of how React portals behave - see https://github.com/facebook/react/issues/11387
             // after the portal is rendered, even though an item is in a separate dom parent, if it's in the portal,
             // events from it are propagated to the components in the portal and thus break some stuff
             return;
         }
-        batchUpdate(() => {
+        (0, batchUpdate_1.default)(() => {
             setVisible(true);
         }).commit();
     }, [constrainTo, preventPortalEventPropagation]);
     const onHide = React.useCallback((_event) => {
         setVisible(false);
     }, [setVisible]);
-    useEffect(() => {
+    (0, react_1.useEffect)(() => {
         if (ref) {
             const api = {
                 show: onShow,
@@ -113,7 +118,7 @@ const OverlayTrigger = React.forwardRef((props, ref) => {
             }
         }
     }, [ref]);
-    useEffect(() => {
+    (0, react_1.useEffect)(() => {
         let target = domRef.current.previousSibling;
         if (targetProp) {
             target = targetProp(target);
@@ -149,7 +154,7 @@ const OverlayTrigger = React.forwardRef((props, ref) => {
         }
         const targetWidth = target.getBoundingClientRect().width;
         if ((prevVisible && !visible) || visible) {
-            const overlayContent = (React.createElement(Overlay, Object.assign({}, domProps, { ref: (node) => {
+            const overlayContent = (React.createElement(Overlay_1.default, Object.assign({}, domProps, { ref: (node) => {
                     if (overlayRef.current && overlayRef.current != node) {
                         overlayRef.current.removeEventListener(showEvent, onShow);
                         overlayRef.current.removeEventListener(hideEvent, onHide);
@@ -159,7 +164,7 @@ const OverlayTrigger = React.forwardRef((props, ref) => {
                         node.addEventListener(showEvent, onShow);
                         node.addEventListener(hideEvent, onHide);
                     }
-                }, className: join('ab-Overlay', showTriangle ? 'ab-Overlay--show-triangle' : '', agGridClassName, domProps.className), style: { transition: `opacity ${opacityTransitionDuration}` }, visible: visible, onTransitionEnd: () => {
+                }, className: (0, join_1.default)('ab-Overlay', showTriangle ? 'ab-Overlay--show-triangle' : '', agGridClassName, domProps.className), style: { transition: `opacity ${opacityTransitionDuration}` }, visible: visible, onTransitionEnd: () => {
                     if (!visible) {
                         clearAllOverlays();
                         hideOverlay('overlay-trigger');
@@ -167,13 +172,13 @@ const OverlayTrigger = React.forwardRef((props, ref) => {
                 } }), props.render({ targetWidth: targetWidth })));
             let preparedConstrinTo;
             if (constrainTo) {
-                preparedConstrinTo = getConstrainElement(targetRef.current, constrainTo);
+                preparedConstrinTo = (0, exports.getConstrainElement)(targetRef.current, constrainTo);
             }
             else {
                 preparedConstrinTo = adaptable === null || adaptable === void 0 ? void 0 : adaptable.getAgGridContainerElement();
             }
             // show only if visible or if it was visible and now it is invisible
-            const alignToRect = getRect(target, targetOffset !== null && targetOffset !== void 0 ? targetOffset : 0);
+            const alignToRect = (0, utils_1.getRect)(target, targetOffset !== null && targetOffset !== void 0 ? targetOffset : 0);
             const showOverlayOptions = {
                 id: 'overlay-trigger',
                 alignPosition,
@@ -186,7 +191,7 @@ const OverlayTrigger = React.forwardRef((props, ref) => {
             clearAllOverlays();
         }
     }, [visible, props.render]);
-    const agGridClassName = useAgGridClassName([visible]);
+    const agGridClassName = (0, useAgGridClassName_1.default)([visible]);
     return (React.createElement(React.Fragment, null,
         React.Children.only(props.children),
         React.createElement("div", { "data-name": "OverlayTrigger", "data-visible": visible, ref: domRef, style: {
@@ -207,4 +212,4 @@ OverlayTrigger.defaultProps = {
     defaultZIndex: 1000000,
     opacityTransitionDuration: '250ms',
 };
-export default OverlayTrigger;
+exports.default = OverlayTrigger;

package/src/components/OverlayTrigger/useAgGridClassName.js

@@ -1,12 +1,14 @@
-import { useMemo } from 'react';
-import { useAdaptable } from '../../View/AdaptableContext';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+const AdaptableContext_1 = require("../../View/AdaptableContext");
 const useAgGridClassName = (deps = []) => {
-    const adaptable = useAdaptable();
-    return useMemo(() => {
+    const adaptable = (0, AdaptableContext_1.useAdaptable)();
+    return (0, react_1.useMemo)(() => {
         if (adaptable) {
             return adaptable.getAgGridCurrentThemeName();
         }
         return '';
     }, deps);
 };
-export default useAgGridClassName;
+exports.default = useAgGridClassName;

package/src/components/OverlayTrigger/utils.js

@@ -1,4 +1,7 @@
-export const getRect = (node, offset = 0) => {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getIntersection = exports.getDocRect = exports.getRect = void 0;
+const getRect = (node, offset = 0) => {
     const rect = node.getBoundingClientRect();
     return {
         top: rect.top - offset,
@@ -9,7 +12,8 @@ export const getRect = (node, offset = 0) => {
         height: rect.height + offset,
     };
 };
-export const getDocRect = () => {
+exports.getRect = getRect;
+const getDocRect = () => {
     const docRect = {
         width: window.innerWidth,
         right: window.innerWidth,
@@ -20,7 +24,8 @@ export const getDocRect = () => {
     };
     return docRect;
 };
-export const getIntersection = (rect1, rect2) => {
+exports.getDocRect = getDocRect;
+const getIntersection = (rect1, rect2) => {
     const left = Math.max(rect1.left, rect2.left);
     const top = Math.max(rect1.top, rect2.top);
     const right = Math.min(rect1.right, rect2.right);
@@ -36,3 +41,4 @@ export const getIntersection = (rect1, rect2) => {
         height,
     };
 };
+exports.getIntersection = getIntersection;

package/src/components/Panel/index.js

@@ -1,28 +1,31 @@
-import { __rest } from "tslib";
-import * as React from 'react';
-import { Box, Flex } from 'rebass';
-import join from '../utils/join';
-export const baseClassName = 'ab-Panel';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.baseClassName = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const rebass_1 = require("rebass");
+const join_1 = tslib_1.__importDefault(require("../utils/join"));
+exports.baseClassName = 'ab-Panel';
 const Header = (_a) => {
-    var { children, variant = 'default' } = _a, headerProps = __rest(_a, ["children", "variant"]);
+    var { children, variant = 'default' } = _a, headerProps = tslib_1.__rest(_a, ["children", "variant"]);
     if (!children) {
         return null;
     }
     const style = {};
-    return (React.createElement(Flex, Object.assign({ flexDirection: "row", alignItems: "center" }, headerProps, { style: Object.assign(Object.assign({}, style), headerProps.style), className: join(`${baseClassName}__header`, `${baseClassName}__header--variant-${variant}`) }), children));
+    return (React.createElement(rebass_1.Flex, Object.assign({ flexDirection: "row", alignItems: "center" }, headerProps, { style: Object.assign(Object.assign({}, style), headerProps.style), className: (0, join_1.default)(`${exports.baseClassName}__header`, `${exports.baseClassName}__header--variant-${variant}`) }), children));
 };
 const Body = (_a) => {
-    var { children, bodyScroll, variant } = _a, bodyProps = __rest(_a, ["children", "bodyScroll", "variant"]);
+    var { children, bodyScroll, variant } = _a, bodyProps = tslib_1.__rest(_a, ["children", "bodyScroll", "variant"]);
     if (!children) {
         return null;
     }
     if (bodyScroll === true) {
         bodyScroll = 'auto';
     }
-    return (React.createElement(Box, Object.assign({}, bodyProps, { className: join(`${baseClassName}__body`, variant && `${baseClassName}__body--variant-${variant}`, bodyScroll ? `${baseClassName}__body--scroll-${bodyScroll}` : null) }), children));
+    return (React.createElement(rebass_1.Box, Object.assign({}, bodyProps, { className: (0, join_1.default)(`${exports.baseClassName}__body`, variant && `${exports.baseClassName}__body--variant-${variant}`, bodyScroll ? `${exports.baseClassName}__body--scroll-${bodyScroll}` : null) }), children));
 };
 const Panel = (props) => {
-    const { borderRadius, border, className, header, children, headerProps, bodyProps, bodyScroll, variant = 'default' } = props, boxProps = __rest(props, ["borderRadius", "border", "className", "header", "children", "headerProps", "bodyProps", "bodyScroll", "variant"]);
+    const { borderRadius, border, className, header, children, headerProps, bodyProps, bodyScroll, variant = 'default' } = props, boxProps = tslib_1.__rest(props, ["borderRadius", "border", "className", "header", "children", "headerProps", "bodyProps", "bodyScroll", "variant"]);
     const style = {};
     if (borderRadius !== undefined) {
         style['--ab-cmp-panel__border-radius'] =
@@ -30,8 +33,8 @@ const Panel = (props) => {
     }
     const headerStyle = Object.assign({ border }, (headerProps ? headerProps.style : null));
     const bodyStyle = Object.assign({ border }, (bodyProps ? bodyProps.style : null));
-    return (React.createElement(Box, Object.assign({}, boxProps, { style: Object.assign(Object.assign({}, style), boxProps.style), className: join(className, baseClassName, `${baseClassName}--variant-${variant}`, !header ? `${baseClassName}--no-header` : `${baseClassName}--with-header`) }),
+    return (React.createElement(rebass_1.Box, Object.assign({}, boxProps, { style: Object.assign(Object.assign({}, style), boxProps.style), className: (0, join_1.default)(className, exports.baseClassName, `${exports.baseClassName}--variant-${variant}`, !header ? `${exports.baseClassName}--no-header` : `${exports.baseClassName}--with-header`) }),
         React.createElement(Header, Object.assign({}, headerProps, { style: headerStyle, variant: variant }), header),
         React.createElement(Body, Object.assign({}, bodyProps, { style: bodyStyle, bodyScroll: bodyScroll, variant: variant }), children)));
 };
-export default Panel;
+exports.default = Panel;

package/src/components/PopupWithFooter.js

@@ -1,11 +1,14 @@
-import { __rest } from "tslib";
-import * as React from 'react';
-import Dialog from './Dialog';
-import FlexWithFooter from './FlexWithFooter';
-export const PopupWithFooter = React.forwardRef((props, ref) => {
-    const { showModal, onHide, footer, maxWidth, style } = props, dialogProps = __rest(props, ["showModal", "onHide", "footer", "maxWidth", "style"]);
-    return (React.createElement(Dialog, Object.assign({}, dialogProps, { ref: ref, isOpen: showModal, onDismiss: onHide, showCloseButton: false, padding: 0 }),
-        React.createElement(FlexWithFooter, { flexDirection: "column", style: style, footer: footer, footerProps: {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PopupWithFooter = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const Dialog_1 = tslib_1.__importDefault(require("./Dialog"));
+const FlexWithFooter_1 = tslib_1.__importDefault(require("./FlexWithFooter"));
+exports.PopupWithFooter = React.forwardRef((props, ref) => {
+    const { showModal, onHide, footer, maxWidth, style } = props, dialogProps = tslib_1.__rest(props, ["showModal", "onHide", "footer", "maxWidth", "style"]);
+    return (React.createElement(Dialog_1.default, Object.assign({}, dialogProps, { ref: ref, isOpen: showModal, onDismiss: onHide, showCloseButton: false, padding: 0 }),
+        React.createElement(FlexWithFooter_1.default, { flexDirection: "column", style: style, footer: footer, footerProps: {
                 padding: 2,
                 backgroundColor: 'primary',
                 className: 'ab-Popup__footer',

package/src/components/ProgressIndicator/ProgressIndicator.js

@@ -1,18 +1,22 @@
-import * as React from 'react';
-import { useSelector } from 'react-redux';
-import { useEffect, useState } from 'react';
-import { LoaderSpinner } from '../Loader';
-import { useAdaptable } from '../../View/AdaptableContext';
-export const ProgressIndicator = () => {
-    const { active, label } = useSelector((state) => state.System.ProgressIndicator);
-    const [visible, setVisible] = useState(false);
-    const [progressIndicatorCoordinates, setProgressIndicatorCoordinates] = useState({
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ProgressIndicator = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const react_redux_1 = require("react-redux");
+const react_1 = require("react");
+const Loader_1 = require("../Loader");
+const AdaptableContext_1 = require("../../View/AdaptableContext");
+const ProgressIndicator = () => {
+    const { active, label } = (0, react_redux_1.useSelector)((state) => state.System.ProgressIndicator);
+    const [visible, setVisible] = (0, react_1.useState)(false);
+    const [progressIndicatorCoordinates, setProgressIndicatorCoordinates] = (0, react_1.useState)({
         top: 0,
         left: 0,
         height: 0,
         width: 0,
     });
-    const adaptable = useAdaptable();
+    const adaptable = (0, AdaptableContext_1.useAdaptable)();
     const disableAdaptableGrid = (containerElement, disabled) => {
         const DISABLING_CSS_CLASS = 'ab-wait-for-progress-indicator';
         if (!containerElement) {
@@ -32,7 +36,7 @@ export const ProgressIndicator = () => {
         const { top, left, height, width } = containerElement.getBoundingClientRect();
         setProgressIndicatorCoordinates({ top, left, height, width });
     };
-    useEffect(() => {
+    (0, react_1.useEffect)(() => {
         disableAdaptableGrid(adaptable.getAdaptableContainerElement(), active);
         disableAdaptableGrid(adaptable.getAgGridContainerElement(), active);
         updateGridContainerCoordinates(adaptable.getAdaptableContainerElement());
@@ -43,6 +47,7 @@ export const ProgressIndicator = () => {
     }, [active]);
     return (React.createElement(React.Fragment, null, active && (React.createElement("div", { className: `ab-progress-indicator-wrapper ${visible ? 'ab-progress-indicator-wrapper--visible' : ''}`, style: progressIndicatorCoordinates },
         React.createElement("div", { className: "ab-progress-indicator-body" },
-            React.createElement(LoaderSpinner, null),
+            React.createElement(Loader_1.LoaderSpinner, null),
             React.createElement("span", { style: { marginLeft: 'var(--ab-space-2)' } }, label))))));
 };
+exports.ProgressIndicator = ProgressIndicator;

package/src/components/Radio/index.js

@@ -1,21 +1,25 @@
-import { __rest } from "tslib";
-import * as React from 'react';
-import { useState } from 'react';
-import { Box, Flex } from 'rebass';
-import useProperty from '../utils/useProperty';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RadioGroup = exports.useRadioContext = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const react_1 = require("react");
+const rebass_1 = require("rebass");
+const useProperty_1 = tslib_1.__importDefault(require("../utils/useProperty"));
 const RadioContext = React.createContext({
     value: null,
     name: '',
     onChange: (v) => { },
 });
-export const useRadioContext = () => {
+const useRadioContext = () => {
     return React.useContext(RadioContext);
 };
+exports.useRadioContext = useRadioContext;
 const Radio = (_a) => {
-    var { children, checked, onChange, value, name, gapDistance = 10, childrenPosition = 'end', as = 'label', id, tabIndex, disabled } = _a, props = __rest(_a, ["children", "checked", "onChange", "value", "name", "gapDistance", "childrenPosition", "as", "id", "tabIndex", "disabled"]);
-    const context = useRadioContext();
+    var { children, checked, onChange, value, name, gapDistance = 10, childrenPosition = 'end', as = 'label', id, tabIndex, disabled } = _a, props = tslib_1.__rest(_a, ["children", "checked", "onChange", "value", "name", "gapDistance", "childrenPosition", "as", "id", "tabIndex", "disabled"]);
+    const context = (0, exports.useRadioContext)();
     const { value: contextValue, onChange: contextOnChange, name: contextName } = context;
-    const [stateChecked, setStateChecked] = useState(false);
+    const [stateChecked, setStateChecked] = (0, react_1.useState)(false);
     const computedChecked = checked !== undefined
         ? checked
         : contextValue !== undefined
@@ -38,7 +42,7 @@ const Radio = (_a) => {
     const beforeGap = childrenPosition === 'start' ? gap : null;
     const after = childrenPosition === 'end' ? children : null;
     const afterGap = childrenPosition === 'end' ? gap : null;
-    return (React.createElement(Box, Object.assign({ className: "ab-Radio", my: 2 }, props, { style: Object.assign({ display: 'inline-flex', flexFlow: 'row', alignItems: 'center', cursor: 'pointer', position: 'relative' }, props.style), as: as }),
+    return (React.createElement(rebass_1.Box, Object.assign({ className: "ab-Radio", my: 2 }, props, { style: Object.assign({ display: 'inline-flex', flexFlow: 'row', alignItems: 'center', cursor: 'pointer', position: 'relative' }, props.style), as: as }),
         before,
         beforeGap,
         React.createElement("input", { disabled: disabled, className: "ab-Radio-input", id: id, checked: computedChecked, type: "radio", name: name !== null && name !== void 0 ? name : contextName, value: value, tabIndex: tabIndex, style: {
@@ -50,14 +54,15 @@ const Radio = (_a) => {
         afterGap,
         after));
 };
-export const RadioGroup = (props) => {
-    const { orientation, value: _value, name, onRadioChange } = props, flexProps = __rest(props, ["orientation", "value", "name", "onRadioChange"]);
-    const [value, setValue] = useProperty(props, 'value', undefined, {
+const RadioGroup = (props) => {
+    const { orientation, value: _value, name, onRadioChange } = props, flexProps = tslib_1.__rest(props, ["orientation", "value", "name", "onRadioChange"]);
+    const [value, setValue] = (0, useProperty_1.default)(props, 'value', undefined, {
         onChange: (value) => {
             onRadioChange(value);
         },
     });
     return (React.createElement(RadioContext.Provider, { value: { value, onChange: setValue, name } },
-        React.createElement(Flex, Object.assign({ className: "ab-RadioGroup", flexDirection: orientation == 'horizontal' ? 'row' : 'column', alignItems: orientation == 'horizontal' ? 'center' : 'flex=start' }, flexProps))));
+        React.createElement(rebass_1.Flex, Object.assign({ className: "ab-RadioGroup", flexDirection: orientation == 'horizontal' ? 'row' : 'column', alignItems: orientation == 'horizontal' ? 'center' : 'flex=start' }, flexProps))));
 };
-export default Radio;
+exports.RadioGroup = RadioGroup;
+exports.default = Radio;

package/src/components/ResizeObserver/getResizeObserverObject.js

@@ -1,4 +1,8 @@
-export const getResizeObserverObject = () => {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getResizeObserverObject = void 0;
+const getResizeObserverObject = () => {
     const globalObject = typeof globalThis !== 'undefined' ? globalThis : window;
     return globalObject.ResizeObserver;
 };
+exports.getResizeObserverObject = getResizeObserverObject;

package/src/components/ResizeObserver/index.js

@@ -1,8 +1,12 @@
-import * as React from 'react';
-import { useMemo, useRef, useEffect, useLayoutEffect, useCallback } from 'react';
-import { getResizeObserverObject } from './getResizeObserverObject';
-export const setupResizeObserver = (node, callback) => {
-    const RO = getResizeObserverObject();
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ReactResizeObserver = exports.useResizeObserver = exports.setupResizeObserver = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const react_1 = require("react");
+const getResizeObserverObject_1 = require("./getResizeObserverObject");
+const setupResizeObserver = (node, callback) => {
+    const RO = (0, getResizeObserverObject_1.getResizeObserverObject)();
     if (!RO) {
         return () => { };
     }
@@ -27,21 +31,22 @@ export const setupResizeObserver = (node, callback) => {
         observer.disconnect();
     };
 };
+exports.setupResizeObserver = setupResizeObserver;
 /**
  * A hook that notifies you when a certain DOM element has changed it's size
  *
  * @param ref A React ref to a DOM element
  * @param callback The function to be called when the element is resized.
  */
-export const useResizeObserver = (ref, callback, config = { earlyAttach: false }) => {
-    const sizeRef = useRef({
+const useResizeObserver = (ref, callback, config = { earlyAttach: false }) => {
+    const sizeRef = (0, react_1.useRef)({
         width: 0,
         height: 0,
     });
     const effectFn = (callback) => {
         let disconnect;
         if (ref.current) {
-            disconnect = setupResizeObserver(ref.current, (size) => {
+            disconnect = (0, exports.setupResizeObserver)(ref.current, (size) => {
                 size = {
                     width: Math.round(size.width),
                     height: Math.round(size.height),
@@ -59,21 +64,22 @@ export const useResizeObserver = (ref, callback, config = { earlyAttach: false }
             }
         };
     };
-    useEffect(() => {
+    (0, react_1.useEffect)(() => {
         if (!config.earlyAttach) {
             return effectFn(callback);
         }
         return () => { };
     }, [ref.current, callback, config.earlyAttach]);
-    useLayoutEffect(() => {
+    (0, react_1.useLayoutEffect)(() => {
         if (config.earlyAttach) {
             return effectFn(callback);
         }
         return () => { };
     }, [ref.current, callback, config.earlyAttach]);
 };
-export const ReactResizeObserver = (props) => {
-    const style = useMemo(() => ({
+exports.useResizeObserver = useResizeObserver;
+const ReactResizeObserver = (props) => {
+    const style = (0, react_1.useMemo)(() => ({
         position: 'absolute',
         top: 0,
         left: 0,
@@ -82,19 +88,20 @@ export const ReactResizeObserver = (props) => {
         boxSizing: 'border-box',
     }), []);
     const { notifyOnMount, earlyAttach } = props;
-    const firstTime = useRef(true);
-    const ref = useRef(null);
-    const onResize = useCallback((size) => {
+    const firstTime = (0, react_1.useRef)(true);
+    const ref = (0, react_1.useRef)(null);
+    const onResize = (0, react_1.useCallback)((size) => {
         if (firstTime.current && !notifyOnMount) {
             firstTime.current = false;
             return;
         }
         props.onResize(size);
     }, [props.onResize]);
-    useResizeObserver(ref, onResize, { earlyAttach: earlyAttach || false });
+    (0, exports.useResizeObserver)(ref, onResize, { earlyAttach: earlyAttach || false });
     return React.createElement("div", { ref: ref, style: style });
 };
-ReactResizeObserver.defaultProps = {
+exports.ReactResizeObserver = ReactResizeObserver;
+exports.ReactResizeObserver.defaultProps = {
     notifyOnMount: true,
     earlyAttach: false,
 };

package/src/components/Select/Select.js

@@ -1,7 +1,11 @@
-import { isSameDay } from 'date-fns';
-import * as React from 'react';
-import ReactSelect, { components } from 'react-select';
-import CreatableSelect from 'react-select/creatable';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Select = void 0;
+const tslib_1 = require("tslib");
+const date_fns_1 = require("date-fns");
+const React = tslib_1.__importStar(require("react"));
+const react_select_1 = tslib_1.__importStar(require("react-select"));
+const creatable_1 = tslib_1.__importDefault(require("react-select/creatable"));
 const commonStyles = ({ isFocused, isDisabled, }) => {
     return {
         color: 'var(--ab-cmp-input__color)',
@@ -10,11 +14,11 @@ const commonStyles = ({ isFocused, isDisabled, }) => {
             : 'var(--ab-cmp-input__background)',
     };
 };
-export const Select = function (props) {
+const Select = function (props) {
     var _a, _b, _c, _d, _e;
     let selectedOption = (_b = ((_a = props.options) !== null && _a !== void 0 ? _a : []).find((option) => {
         if (typeof option.value === 'object' && option.value instanceof Date) {
-            return isSameDay(option.value, props.value);
+            return (0, date_fns_1.isSameDay)(option.value, props.value);
         }
         return option.value === props.value;
     })) !== null && _b !== void 0 ? _b : null;
@@ -37,17 +41,17 @@ export const Select = function (props) {
      */
     const SelectContainer = React.useMemo(() => {
         return (inputProps) => {
-            return (React.createElement(components.SelectContainer, Object.assign({}, inputProps, { innerProps: Object.assign({ 
+            return (React.createElement(react_select_1.components.SelectContainer, Object.assign({}, inputProps, { innerProps: Object.assign({ 
                     // @ts-ignore
                     'data-name': props['data-name'], 'data-id': props['data-id'] }, inputProps.innerProps) })));
         };
     }, []);
     const ValueContainer = React.useMemo(() => {
         return (inputProps) => {
-            return (React.createElement(components.ValueContainer, Object.assign({}, inputProps, { innerProps: Object.assign({ 'data-name': 'value-container' }, inputProps.innerProps) })));
+            return (React.createElement(react_select_1.components.ValueContainer, Object.assign({}, inputProps, { innerProps: Object.assign({ 'data-name': 'value-container' }, inputProps.innerProps) })));
         };
     }, []);
-    const SelectComponent = props.isCreatable ? CreatableSelect : ReactSelect;
+    const SelectComponent = props.isCreatable ? creatable_1.default : react_select_1.default;
     return (React.createElement(SelectComponent, { onInputChange: props.onInputChange, onFocus: props.onFocus, isLoading: props.isLoding, options: props.options, className: props.className, isDisabled: disabled, isMulti: props.isMulti, value: selectedOption, menuPosition: (_e = props.menuPosition) !== null && _e !== void 0 ? _e : 'fixed', isClearable: props.isClearable, onChange: (option) => {
             if (props.isMulti) {
                 props.onChange(option.map((x) => x === null || x === void 0 ? void 0 : x.value));
@@ -59,7 +63,7 @@ export const Select = function (props) {
             SelectContainer,
             ValueContainer,
             SingleValue: (singleValueProps) => {
-                return (React.createElement(components.SingleValue, Object.assign({}, singleValueProps), props.rederSingleValue
+                return (React.createElement(react_select_1.components.SingleValue, Object.assign({}, singleValueProps), props.rederSingleValue
                     ? props.rederSingleValue(selectedOption)
                     : singleValueProps.children));
             },
@@ -129,3 +133,4 @@ export const Select = function (props) {
             },
         } }));
 };
+exports.Select = Select;

package/src/components/Select/index.js

@@ -1 +1,4 @@
-export * from './Select';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./Select"), exports);