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

package/src/components/Datepicker/index.js

@@ -1,19 +1,22 @@
-import { __rest } from "tslib";
-import * as React from 'react';
-import OverlayTrigger from '../OverlayTrigger';
-import Input from '../Input';
-import { useState } from 'react';
-import useProperty from '../utils/useProperty';
-import FieldWrap from '../FieldWrap';
-import SimpleButton from '../SimpleButton';
-import { Flex } from 'rebass';
-import { DateFormatter } from '../../Utilities/Helpers/FormatHelper';
-import { Caption } from './Caption';
-import { CaptionLabel } from './CaptionLabel';
-import { useDatepickerContext } from './DatepickerContext';
-import addDays from 'date-fns/addDays';
-import addBusinessDays from 'date-fns/addBusinessDays';
-import { DayPicker, useInput } from 'react-day-picker';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Datepicker = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const OverlayTrigger_1 = tslib_1.__importDefault(require("../OverlayTrigger"));
+const Input_1 = tslib_1.__importDefault(require("../Input"));
+const react_1 = require("react");
+const useProperty_1 = tslib_1.__importDefault(require("../utils/useProperty"));
+const FieldWrap_1 = tslib_1.__importDefault(require("../FieldWrap"));
+const SimpleButton_1 = tslib_1.__importDefault(require("../SimpleButton"));
+const rebass_1 = require("rebass");
+const FormatHelper_1 = require("../../Utilities/Helpers/FormatHelper");
+const Caption_1 = require("./Caption");
+const CaptionLabel_1 = require("./CaptionLabel");
+const DatepickerContext_1 = require("./DatepickerContext");
+const addDays_1 = tslib_1.__importDefault(require("date-fns/addDays"));
+const addBusinessDays_1 = tslib_1.__importDefault(require("date-fns/addBusinessDays"));
+const react_day_picker_1 = require("react-day-picker");
 const DatepickerOverlay = ({ onHide, children, onKeyDown, }) => {
     const domRef = React.useRef(null);
     React.useEffect(() => {
@@ -31,26 +34,26 @@ const DatepickerOverlay = ({ onHide, children, onKeyDown, }) => {
             }
         } }, children));
 };
-export const Datepicker = React.forwardRef((props, ref) => {
+exports.Datepicker = React.forwardRef((props, ref) => {
     var _a;
-    const { dateProps, required, disabled, style, placeholder, showWeekNumber, showOutsideDays, value: _, defaultValue: __, onChange: ___, showClearButton: showClearButtonFromProps, datepickerButtons } = props, boxProps = __rest(props, ["dateProps", "required", "disabled", "style", "placeholder", "showWeekNumber", "showOutsideDays", "value", "defaultValue", "onChange", "showClearButton", "datepickerButtons"]);
-    const datepickerContext = useDatepickerContext();
+    const { dateProps, required, disabled, style, placeholder, showWeekNumber, showOutsideDays, value: _, defaultValue: __, onChange: ___, showClearButton: showClearButtonFromProps, datepickerButtons } = props, boxProps = tslib_1.__rest(props, ["dateProps", "required", "disabled", "style", "placeholder", "showWeekNumber", "showOutsideDays", "value", "defaultValue", "onChange", "showClearButton", "datepickerButtons"]);
+    const datepickerContext = (0, DatepickerContext_1.useDatepickerContext)();
     const showClearButton = (showClearButtonFromProps !== null && showClearButtonFromProps !== void 0 ? showClearButtonFromProps : datepickerContext.showClearButton) === false ? false : true;
-    let [value, setValue] = useProperty(props, 'value', undefined, {
+    let [value, setValue] = (0, useProperty_1.default)(props, 'value', undefined, {
         onChange: props.onChange,
     });
     const useInputOptions = Object.assign(Object.assign({}, dateProps), { required });
     if (value && value instanceof Date && !isNaN(+value)) {
         useInputOptions.defaultSelected = value;
     }
-    const [month, setMonth] = useState(value !== null && value !== void 0 ? value : new Date());
-    const { dayPickerProps, setSelected } = useInput(useInputOptions);
+    const [month, setMonth] = (0, react_1.useState)(value !== null && value !== void 0 ? value : new Date());
+    const { dayPickerProps, setSelected } = (0, react_day_picker_1.useInput)(useInputOptions);
     const updateValue = (value) => {
         setValue(value);
         setSelected(value);
     };
-    const inputValue = (_a = DateFormatter(value, { Pattern: dateProps.format })) !== null && _a !== void 0 ? _a : '';
-    const [visible, doSetVisible] = useState(false);
+    const inputValue = (_a = (0, FormatHelper_1.DateFormatter)(value, { Pattern: dateProps.format })) !== null && _a !== void 0 ? _a : '';
+    const [visible, doSetVisible] = (0, react_1.useState)(false);
     const setVisible = (visible, keyboardEventKey) => {
         var _a, _b;
         doSetVisible(visible);
@@ -64,33 +67,33 @@ export const Datepicker = React.forwardRef((props, ref) => {
     const clearValue = () => {
         updateValue(undefined);
     };
-    const renderButton = (label, onClick) => (React.createElement(SimpleButton, { onClick: onClick, margin: '2px' }, label));
+    const renderButton = (label, onClick) => (React.createElement(SimpleButton_1.default, { onClick: onClick, margin: '2px' }, label));
     const todayDate = new Date();
     const footerButtonsMap = {
         clear: renderButton('Clear', () => clearValue()),
         close: renderButton('Close', () => setVisible(false)),
         today: renderButton('Today', () => updateValue(todayDate)),
-        tomorrow: renderButton('Tomorrow', () => updateValue(addDays(todayDate, 1))),
-        yesterday: renderButton('Yesterday', () => updateValue(addDays(todayDate, -1))),
-        nextWorkday: renderButton('Next Workday', () => updateValue(addBusinessDays(todayDate, 1))),
-        prevWorkday: renderButton('Prev Workday', () => updateValue(addBusinessDays(todayDate, -1))),
+        tomorrow: renderButton('Tomorrow', () => updateValue((0, addDays_1.default)(todayDate, 1))),
+        yesterday: renderButton('Yesterday', () => updateValue((0, addDays_1.default)(todayDate, -1))),
+        nextWorkday: renderButton('Next Workday', () => updateValue((0, addBusinessDays_1.default)(todayDate, 1))),
+        prevWorkday: renderButton('Prev Workday', () => updateValue((0, addBusinessDays_1.default)(todayDate, -1))),
         '-': React.createElement("div", { style: { flex: '1 1 1%' } }),
         '|': React.createElement("hr", { style: { width: '100%', height: 0, margin: 0, border: 'none' } }),
     };
     const footerButtons = datepickerButtons.map((buttonKey, index) => React.cloneElement(footerButtonsMap[buttonKey], { key: index }));
-    const clearButton = showClearButton ? (React.createElement(SimpleButton, { "data-name": "clear", variant: "text", tooltip: "Clear", iconSize: 20, padding: 0, icon: "close", onMouseDown: (e) => {
+    const clearButton = showClearButton ? (React.createElement(SimpleButton_1.default, { "data-name": "clear", variant: "text", tooltip: "Clear", iconSize: 20, padding: 0, icon: "close", onMouseDown: (e) => {
             e.preventDefault();
             clearValue();
         }, accessLevel: 'Full' })) : null;
-    const calendarButton = (React.createElement(SimpleButton, { disabled: disabled, variant: "text", icon: "calendar", tooltip: "Date", iconSize: 20, px: 0, py: 0, onClick: () => setVisible(true) }));
-    return (React.createElement(Flex, null,
-        React.createElement(OverlayTrigger, { visible: visible, render: () => (React.createElement(DatepickerOverlay, { onHide: () => setVisible(false), onKeyDown: (e) => {
+    const calendarButton = (React.createElement(SimpleButton_1.default, { disabled: disabled, variant: "text", icon: "calendar", tooltip: "Date", iconSize: 20, px: 0, py: 0, onClick: () => setVisible(true) }));
+    return (React.createElement(rebass_1.Flex, null,
+        React.createElement(OverlayTrigger_1.default, { visible: visible, render: () => (React.createElement(DatepickerOverlay, { onHide: () => setVisible(false), onKeyDown: (e) => {
                     if (e.key === 'Escape' || e.key === 'Enter') {
                         setVisible(false, e.key);
                     }
                 } },
-                React.createElement(DayPicker, Object.assign({ fixedWeeks: true }, dayPickerProps, { showWeekNumber: showWeekNumber, showOutsideDays: showOutsideDays, mode: "single", month: isNaN(+month) ? new Date() : month, onMonthChange: setMonth, components: { Caption, CaptionLabel }, onSelect: updateValue, footer: React.createElement(Flex, { justifyContent: "space-between", mt: 2, flexWrap: 'wrap' }, footerButtons) })))) },
-            React.createElement(FieldWrap, Object.assign({}, boxProps, { style: {
+                React.createElement(react_day_picker_1.DayPicker, Object.assign({ fixedWeeks: true }, dayPickerProps, { showWeekNumber: showWeekNumber, showOutsideDays: showOutsideDays, mode: "single", month: isNaN(+month) ? new Date() : month, onMonthChange: setMonth, components: { Caption: Caption_1.Caption, CaptionLabel: CaptionLabel_1.CaptionLabel }, onSelect: updateValue, footer: React.createElement(rebass_1.Flex, { justifyContent: "space-between", mt: 2, flexWrap: 'wrap' }, footerButtons) })))) },
+            React.createElement(FieldWrap_1.default, Object.assign({}, boxProps, { style: {
                     borderRadius: style === null || style === void 0 ? void 0 : style.borderRadius,
                     width: style === null || style === void 0 ? void 0 : style.width,
                     maxWidth: style === null || style === void 0 ? void 0 : style.maxWidth,
@@ -99,7 +102,7 @@ export const Datepicker = React.forwardRef((props, ref) => {
                         setVisible(true);
                     }
                 } }),
-                React.createElement(Input, { value: inputValue, placehoder: placeholder !== null && placeholder !== void 0 ? placeholder : dateProps.format, style: style, disabled: disabled, readOnly: true, ref: ref }),
+                React.createElement(Input_1.default, { value: inputValue, placehoder: placeholder !== null && placeholder !== void 0 ? placeholder : dateProps.format, style: style, disabled: disabled, readOnly: true, ref: ref }),
                 !!inputValue ? clearButton : null,
                 calendarButton))));
 });

package/src/components/Dialog/index.js

@@ -1,23 +1,26 @@
-import { __rest } from "tslib";
-import * as React from 'react';
-import { useRef, useEffect } from 'react';
-import join from '../utils/join';
-import contains from '../utils/contains';
-import captureTabNavigation from '../utils/captureTabNavigation';
-import { Box } from 'rebass';
-import { Modal } from '../Modal';
-import useIsOpen from './useIsOpen';
-import useAutoFocus from '../utils/useAutoFocus';
-import { Icon } from '../icons';
-import { WindowModal } from '../WindowModal';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Dialog = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const react_1 = require("react");
+const join_1 = tslib_1.__importDefault(require("../utils/join"));
+const contains_1 = tslib_1.__importDefault(require("../utils/contains"));
+const captureTabNavigation_1 = tslib_1.__importDefault(require("../utils/captureTabNavigation"));
+const rebass_1 = require("rebass");
+const Modal_1 = require("../Modal");
+const useIsOpen_1 = tslib_1.__importDefault(require("./useIsOpen"));
+const useAutoFocus_1 = tslib_1.__importDefault(require("../utils/useAutoFocus"));
+const icons_1 = require("../icons");
+const WindowModal_1 = require("../WindowModal");
 const baseClassName = 'ab-Dialog';
-export const Dialog = React.forwardRef((props, dialogRef) => {
-    let { modal, fixed, focusOnBrowserVisible = false, autoFocus = true, className, children, modalProps, dismissOnClickOutside = false, onDismiss, windowModal, windowModalProps } = props, boxProps = __rest(props, ["modal", "fixed", "focusOnBrowserVisible", "autoFocus", "className", "children", "modalProps", "dismissOnClickOutside", "onDismiss", "windowModal", "windowModalProps"]);
+exports.Dialog = React.forwardRef((props, dialogRef) => {
+    let { modal, fixed, focusOnBrowserVisible = false, autoFocus = true, className, children, modalProps, dismissOnClickOutside = false, onDismiss, windowModal, windowModalProps } = props, boxProps = tslib_1.__rest(props, ["modal", "fixed", "focusOnBrowserVisible", "autoFocus", "className", "children", "modalProps", "dismissOnClickOutside", "onDismiss", "windowModal", "windowModalProps"]);
     modal = props.modal === undefined ? true : props.modal;
     fixed = props.fixed === undefined ? true : props.fixed;
-    const [isOpen, setIsOpen] = useIsOpen(props);
-    const boxRef = useRef(null);
-    useAutoFocus({
+    const [isOpen, setIsOpen] = (0, useIsOpen_1.default)(props);
+    const boxRef = (0, react_1.useRef)(null);
+    (0, useAutoFocus_1.default)({
         isOpen,
         autoFocus: props.autoFocus,
         previous: ({ autoFocus }) => autoFocus && isOpen,
@@ -28,7 +31,7 @@ export const Dialog = React.forwardRef((props, dialogRef) => {
         if (props.onKeyDown) {
             props.onKeyDown(e);
         }
-        captureTabNavigation(boxRef.current, e);
+        (0, captureTabNavigation_1.default)(boxRef.current, e);
         if (e.key === 'Escape') {
             if (e.nativeEvent.anotherModalClosed) {
                 return;
@@ -45,9 +48,9 @@ export const Dialog = React.forwardRef((props, dialogRef) => {
             }
             setIsOpen(false);
         }
-        captureTabNavigation(boxRef.current, event);
+        (0, captureTabNavigation_1.default)(boxRef.current, event);
     };
-    useEffect(() => {
+    (0, react_1.useEffect)(() => {
         if (dismissOnClickOutside && isOpen) {
             const dismissDialog = (e) => {
                 requestAnimationFrame(() => {
@@ -69,14 +72,14 @@ export const Dialog = React.forwardRef((props, dialogRef) => {
     const bringToFront = React.useCallback(() => {
         if (boxRef.current &&
             boxRef.current.focus &&
-            (!document.activeElement || !contains(boxRef.current, document.activeElement))) {
+            (!document.activeElement || !(0, contains_1.default)(boxRef.current, document.activeElement))) {
             boxRef.current.focus();
         }
     }, [boxRef]);
     React.useImperativeHandle(dialogRef, () => ({
         bringToFront,
     }));
-    useEffect(() => {
+    (0, react_1.useEffect)(() => {
         let listener;
         if (focusOnBrowserVisible) {
             listener = () => {
@@ -95,28 +98,28 @@ export const Dialog = React.forwardRef((props, dialogRef) => {
     if (!isOpen) {
         return null;
     }
-    const closeButton = showCloseButton ? (React.createElement(Box, { padding: 1, title: "Close dialog", onClick: () => setIsOpen(false), className: `${baseClassName}__close-button` },
-        React.createElement(Icon, { size: 24, name: "close" }))) : null;
+    const closeButton = showCloseButton ? (React.createElement(rebass_1.Box, { padding: 1, title: "Close dialog", onClick: () => setIsOpen(false), className: `${baseClassName}__close-button` },
+        React.createElement(icons_1.Icon, { size: 24, name: "close" }))) : null;
     const setPreventDismissFlag = (e) => {
         if (dismissOnClickOutside) {
             e.nativeEvent.preventDialogDismiss = true;
         }
     };
-    const box = (React.createElement(Box, Object.assign({}, boxProps, { onClick: (e) => {
+    const box = (React.createElement(rebass_1.Box, Object.assign({}, boxProps, { onClick: (e) => {
             setPreventDismissFlag(e);
             if (boxProps && boxProps.onClick) {
                 boxProps.onClick(e);
             }
-        }, onKeyDown: onKeyDown, className: join(baseClassName, modal ? `${baseClassName}--modal` : `${baseClassName}--not-modal`, className), ref: boxRef }),
+        }, onKeyDown: onKeyDown, className: (0, join_1.default)(baseClassName, modal ? `${baseClassName}--modal` : `${baseClassName}--not-modal`, className), ref: boxRef }),
         children,
         closeButton));
     const content = fixed ? (React.createElement("div", { onClick: setPreventDismissFlag, className: `${baseClassName}-fixed-wrapper` }, box)) : (box);
     if (windowModal) {
-        return React.createElement(WindowModal, Object.assign({}, windowModalProps), content);
+        return React.createElement(WindowModal_1.WindowModal, Object.assign({}, windowModalProps), content);
     }
     if (modal) {
-        return (React.createElement(Modal, Object.assign({}, modalProps, { isOpen: isOpen, onBringToFront: bringToFront }), box));
+        return (React.createElement(Modal_1.Modal, Object.assign({}, modalProps, { isOpen: isOpen, onBringToFront: bringToFront }), box));
     }
     return content;
 });
-export default Dialog;
+exports.default = exports.Dialog;

package/src/components/Dialog/useIsOpen.js

@@ -1,6 +1,9 @@
-import useProperty from '../utils/useProperty';
-export default (props) => {
-    return useProperty(props, 'isOpen', true, {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const useProperty_1 = tslib_1.__importDefault(require("../utils/useProperty"));
+exports.default = (props) => {
+    return (0, useProperty_1.default)(props, 'isOpen', true, {
         onChange: (isOpen) => {
             if (!isOpen && props.onDismiss) {
                 props.onDismiss();

package/src/components/DragAndDropContext/DragAndDropContext.js

@@ -1,5 +1,9 @@
-import * as React from 'react';
-export const DragAndDropContext = React.createContext({
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DragAndDropContext = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+exports.DragAndDropContext = React.createContext({
     availableItems: [],
     permittedActions: {
         createTab: true,

package/src/components/DragAndDropContext/ModuleManager.js

@@ -1,11 +1,15 @@
-import * as React from 'react';
-import { DragDropContext } from 'react-beautiful-dnd';
-import { PanelWithButton } from '../../View/Components/Panels/PanelWithButton';
-import SimpleButton from '../SimpleButton';
-import { DragAndDropContext } from './DragAndDropContext';
-import { TabList } from './TabList';
-import { UnusedPanel } from './UnusedPanel';
-export const ModuleManager = (props) => {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ModuleManager = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const react_beautiful_dnd_1 = require("react-beautiful-dnd");
+const PanelWithButton_1 = require("../../View/Components/Panels/PanelWithButton");
+const SimpleButton_1 = tslib_1.__importDefault(require("../SimpleButton"));
+const DragAndDropContext_1 = require("./DragAndDropContext");
+const TabList_1 = require("./TabList");
+const UnusedPanel_1 = require("./UnusedPanel");
+const ModuleManager = (props) => {
     const { availableItems, tabs, onTabsChange, tabsTitle, disabled, unusedPanelTitle, dragItemText, permittedActions, } = props;
     const contextValue = React.useMemo(() => {
         const preparedPermittedAction = Object.assign({ createTab: true, editTabName: true, dragAndDropTab: true, deleteTab: true }, permittedActions);
@@ -62,15 +66,16 @@ export const ModuleManager = (props) => {
             return Object.assign(Object.assign({}, tab), { Name: tabName });
         }));
     };
-    return (React.createElement(DragDropContext, { onDragEnd: (result) => {
+    return (React.createElement(react_beautiful_dnd_1.DragDropContext, { onDragEnd: (result) => {
             if (result.type === 'TAB')
                 handleTabDragEnd(result);
             if (result.type === 'TOOLBAR')
                 handleToolbarDragEnd(result);
         } },
-        React.createElement(DragAndDropContext.Provider, { value: contextValue },
+        React.createElement(DragAndDropContext_1.DragAndDropContext.Provider, { value: contextValue },
             React.createElement("div", { className: "ab-ModuleSelector", style: { display: 'flex', flexDirection: 'column' } },
-                React.createElement(UnusedPanel, { title: unusedPanelTitle, disabled: disabled, items: unusedItems, dragItemText: dragItemText }),
-                React.createElement(PanelWithButton, { className: "ab-ModuleSelector-UsedPanel", headerText: tabsTitle, button: contextValue.permittedActions.createTab && (React.createElement(SimpleButton, { disabled: disabled, onClick: handleTabAdd }, "Add Tab")) },
-                    React.createElement(TabList, { disabled: disabled, tabs: tabs, onRemoveTab: handleRemoveTab, onRemoveToolbar: handleRemoveToolbar, onChangeTabName: handleChangeTabName }))))));
+                React.createElement(UnusedPanel_1.UnusedPanel, { title: unusedPanelTitle, disabled: disabled, items: unusedItems, dragItemText: dragItemText }),
+                React.createElement(PanelWithButton_1.PanelWithButton, { className: "ab-ModuleSelector-UsedPanel", headerText: tabsTitle, button: contextValue.permittedActions.createTab && (React.createElement(SimpleButton_1.default, { disabled: disabled, onClick: handleTabAdd }, "Add Tab")) },
+                    React.createElement(TabList_1.TabList, { disabled: disabled, tabs: tabs, onRemoveTab: handleRemoveTab, onRemoveToolbar: handleRemoveToolbar, onChangeTabName: handleChangeTabName }))))));
 };
+exports.ModuleManager = ModuleManager;

package/src/components/DragAndDropContext/TabList.js

@@ -1,43 +1,51 @@
-import * as React from 'react';
-import { Draggable, Droppable } from 'react-beautiful-dnd';
-import { Box, Flex } from 'rebass';
-import { Icon } from '../icons';
-import SimpleButton from '../SimpleButton';
-import { DragAndDropContext } from './DragAndDropContext';
-export function TabList({ tabs, onRemoveTab, onRemoveToolbar, onChangeTabName, disabled, }) {
-    return (React.createElement(Droppable, { droppableId: "MAIN", type: "TAB", direction: "horizontal" }, (provided) => (React.createElement("div", Object.assign({}, provided.droppableProps, { className: "ab-ModuleSelector__TabList", ref: provided.innerRef, style: { display: 'flex' }, "data-name": "dashboard-tabs" }),
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ToolbarItem = exports.ToolbarList = exports.TabItem = exports.TabList = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const react_beautiful_dnd_1 = require("react-beautiful-dnd");
+const rebass_1 = require("rebass");
+const icons_1 = require("../icons");
+const SimpleButton_1 = tslib_1.__importDefault(require("../SimpleButton"));
+const DragAndDropContext_1 = require("./DragAndDropContext");
+function TabList({ tabs, onRemoveTab, onRemoveToolbar, onChangeTabName, disabled, }) {
+    return (React.createElement(react_beautiful_dnd_1.Droppable, { droppableId: "MAIN", type: "TAB", direction: "horizontal" }, (provided) => (React.createElement("div", Object.assign({}, provided.droppableProps, { className: "ab-ModuleSelector__TabList", ref: provided.innerRef, style: { display: 'flex' }, "data-name": "dashboard-tabs" }),
         tabs.map((tab, tabIndex) => (React.createElement(TabItem, { disabled: disabled, key: tabIndex, tabIndex: tabIndex, tab: tab, onRemove: () => onRemoveTab(tabIndex), onRemoveToolbar: (toolbarIndex) => onRemoveToolbar(tabIndex, toolbarIndex), onChangeTabName: (tabName) => onChangeTabName(tabIndex, tabName) }))),
         provided.placeholder))));
 }
-export function TabItem({ tab, tabIndex, onRemove, onRemoveToolbar, onChangeTabName, disabled, }) {
-    const context = React.useContext(DragAndDropContext);
+exports.TabList = TabList;
+function TabItem({ tab, tabIndex, onRemove, onRemoveToolbar, onChangeTabName, disabled, }) {
+    const context = React.useContext(DragAndDropContext_1.DragAndDropContext);
     const isDragDisabled = disabled || !context.permittedActions.dragAndDropTab;
-    return (React.createElement(Draggable, { isDragDisabled: isDragDisabled, draggableId: String(tabIndex), index: tabIndex }, (provided) => (React.createElement("div", Object.assign({ className: "ab-ModuleSelector__TabItem", "data-name": "dashboard-tab", ref: provided.innerRef }, provided.draggableProps, { style: Object.assign({}, (isDragDisabled ? {} : provided.draggableProps.style)) }),
+    return (React.createElement(react_beautiful_dnd_1.Draggable, { isDragDisabled: isDragDisabled, draggableId: String(tabIndex), index: tabIndex }, (provided) => (React.createElement("div", Object.assign({ className: "ab-ModuleSelector__TabItem", "data-name": "dashboard-tab", ref: provided.innerRef }, provided.draggableProps, { style: Object.assign({}, (isDragDisabled ? {} : provided.draggableProps.style)) }),
         React.createElement("div", { className: "ab-ModuleSelector__TabItem__header" },
             React.createElement("div", Object.assign({}, (disabled ? {} : provided.dragHandleProps), { style: context.permittedActions.dragAndDropTab
                     ? {}
                     : {
                         display: 'none',
                     } }),
-                React.createElement(Icon, { name: "drag" })),
+                React.createElement(icons_1.Icon, { name: "drag" })),
             context.permittedActions.editTabName ? (React.createElement("input", { className: "ab-ModuleSelector__TabItem__header-input", type: "text", disabled: disabled, value: tab.Name, onChange: (event) => {
                     onChangeTabName(event.target.value);
                 } })) : (tab.Name),
-            context.permittedActions.deleteTab && (React.createElement(SimpleButton, { disabled: disabled, icon: "delete", variant: "text", onClick: onRemove }))),
+            context.permittedActions.deleteTab && (React.createElement(SimpleButton_1.default, { disabled: disabled, icon: "delete", variant: "text", onClick: onRemove }))),
         React.createElement(ToolbarList, { disabled: disabled, toolbars: tab.Items, droppableId: String(tabIndex), onRemove: onRemoveToolbar })))));
 }
-export function ToolbarList({ toolbars, droppableId, onRemove, disabled, }) {
-    return (React.createElement(Droppable, { droppableId: droppableId, type: "TOOLBAR" }, (provided, snapshot) => (React.createElement(Box, Object.assign({ className: "ab-ModuleSelector__ToolbarList", ref: provided.innerRef }, (disabled ? {} : provided.droppableProps), { "data-name": "dashboard-toolbar-drop-target", backgroundColor: snapshot.isDraggingOver ? 'var(--ab-dashboard-tab-drop-target__background)' : '' }), toolbars === null || toolbars === void 0 ? void 0 :
+exports.TabItem = TabItem;
+function ToolbarList({ toolbars, droppableId, onRemove, disabled, }) {
+    return (React.createElement(react_beautiful_dnd_1.Droppable, { droppableId: droppableId, type: "TOOLBAR" }, (provided, snapshot) => (React.createElement(rebass_1.Box, Object.assign({ className: "ab-ModuleSelector__ToolbarList", ref: provided.innerRef }, (disabled ? {} : provided.droppableProps), { "data-name": "dashboard-toolbar-drop-target", backgroundColor: snapshot.isDraggingOver ? 'var(--ab-dashboard-tab-drop-target__background)' : '' }), toolbars === null || toolbars === void 0 ? void 0 :
         toolbars.map((toolbar, toolbarIndex) => (React.createElement(ToolbarItem, { disabled: disabled, key: toolbar, toolbar: toolbar, toolbarIndex: toolbarIndex, onRemove: () => onRemove(toolbarIndex) }))),
         provided.placeholder))));
 }
-export function ToolbarItem({ toolbar, toolbarIndex, onRemove, disabled, }) {
-    const { availableItems } = React.useContext(DragAndDropContext);
+exports.ToolbarList = ToolbarList;
+function ToolbarItem({ toolbar, toolbarIndex, onRemove, disabled, }) {
+    const { availableItems } = React.useContext(DragAndDropContext_1.DragAndDropContext);
     let currentItem = availableItems.find((t) => t.Id === toolbar);
     const title = currentItem ? currentItem.Title : toolbar;
-    return (React.createElement(Draggable, { isDragDisabled: disabled, draggableId: toolbar, index: toolbarIndex }, (provided, snapshot) => (React.createElement(Flex, Object.assign({ className: "ab-ModuleSelector__ToolbarItem", alignItems: "center", mb: 1, pl: 1, backgroundColor: snapshot.isDragging
+    return (React.createElement(react_beautiful_dnd_1.Draggable, { isDragDisabled: disabled, draggableId: toolbar, index: toolbarIndex }, (provided, snapshot) => (React.createElement(rebass_1.Flex, Object.assign({ className: "ab-ModuleSelector__ToolbarItem", alignItems: "center", mb: 1, pl: 1, backgroundColor: snapshot.isDragging
             ? 'var(--ab-dashboard-toolbar-drag__background)'
             : 'var(--ab-color-primarylight)', ref: provided.innerRef }, provided.draggableProps, provided.dragHandleProps, { style: provided.draggableProps.style }),
         React.createElement("div", { style: { flex: 1 } }, title),
-        React.createElement(SimpleButton, { disabled: disabled, icon: "close", variant: "text", padding: 1, onClick: onRemove })))));
+        React.createElement(SimpleButton_1.default, { disabled: disabled, icon: "close", variant: "text", padding: 1, onClick: onRemove })))));
 }
+exports.ToolbarItem = ToolbarItem;

package/src/components/DragAndDropContext/UnusedPanel.js

@@ -1,18 +1,23 @@
-import * as React from 'react';
-import { Draggable, Droppable } from 'react-beautiful-dnd';
-import { Box } from 'rebass';
-import { DragAndDropContext } from './DragAndDropContext';
-export function UnusedPanel({ items, disabled, title, dragItemText, }) {
-    return (React.createElement(Box, { pb: 1, mb: 2, className: "ab-ModuleSelector__UnusedPanel", "data-name": "unusedpanel-items" },
-        React.createElement(Box, { p: 2 },
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.UnusedPanel = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const react_beautiful_dnd_1 = require("react-beautiful-dnd");
+const rebass_1 = require("rebass");
+const DragAndDropContext_1 = require("./DragAndDropContext");
+function UnusedPanel({ items, disabled, title, dragItemText, }) {
+    return (React.createElement(rebass_1.Box, { pb: 1, mb: 2, className: "ab-ModuleSelector__UnusedPanel", "data-name": "unusedpanel-items" },
+        React.createElement(rebass_1.Box, { p: 2 },
             React.createElement("b", null, title),
             " (",
             dragItemText,
             ")"),
         React.createElement(UnusedItemList, { disabled: disabled, items: items })));
 }
+exports.UnusedPanel = UnusedPanel;
 function UnusedItemList({ items, disabled }) {
-    return (React.createElement(Droppable, { droppableId: "UNUSED", type: "TOOLBAR", isDropDisabled: true, direction: "horizontal" }, (provided) => (React.createElement("div", Object.assign({ ref: provided.innerRef, "data-name": "unusedpanel-items-list" }, provided.droppableProps, { style: {
+    return (React.createElement(react_beautiful_dnd_1.Droppable, { droppableId: "UNUSED", type: "TOOLBAR", isDropDisabled: true, direction: "horizontal" }, (provided) => (React.createElement("div", Object.assign({ ref: provided.innerRef, "data-name": "unusedpanel-items-list" }, provided.droppableProps, { style: {
             display: 'flex',
             flexDirection: 'row',
             flexWrap: 'wrap',
@@ -23,10 +28,10 @@ function UnusedItemList({ items, disabled }) {
         provided.placeholder))));
 }
 function UnusedItem({ unusedItem, unusedItemIndex, disabled, }) {
-    const { availableItems } = React.useContext(DragAndDropContext);
+    const { availableItems } = React.useContext(DragAndDropContext_1.DragAndDropContext);
     let currentItem = availableItems.find((t) => t.Id === unusedItem);
     const title = currentItem ? currentItem.Title : unusedItem;
-    return (React.createElement(Draggable, { isDragDisabled: disabled, draggableId: unusedItem, index: unusedItemIndex }, (provided, snapshot) => {
+    return (React.createElement(react_beautiful_dnd_1.Draggable, { isDragDisabled: disabled, draggableId: unusedItem, index: unusedItemIndex }, (provided, snapshot) => {
         const eventHandlers = disabled
             ? {}
             : Object.assign(Object.assign({}, provided.draggableProps), provided.dragHandleProps);

package/src/components/DragAndDropContext/types.js

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

package/src/components/Drawer/index.js

@@ -1,5 +1,9 @@
-import * as React from 'react';
-export const Drawer = (props) => {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Drawer = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const Drawer = (props) => {
     const [isOpen, setIsOpen] = React.useState(() => {
         return props.open;
     });
@@ -53,3 +57,4 @@ export const Drawer = (props) => {
     }
     return (React.createElement("div", { onKeyDown: handleOnKeyDown, style: style, onTransitionEnd: handletransitionEnd }, props.children));
 };
+exports.Drawer = Drawer;

package/src/components/Dropdown/Arrows.js

@@ -1,5 +1,8 @@
-import * as React from 'react';
-import { Icon } from '../icons';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const icons_1 = require("../icons");
 const Arrows = () => {
     return (React.createElement("div", { style: {
             display: 'flex',
@@ -12,7 +15,7 @@ const Arrows = () => {
             transform: 'translate3d(0px, -50%, 0px)',
             cursor: 'pointer',
         } },
-        React.createElement(Icon, { name: "triangle-up", size: 24, style: { position: 'relative', top: 7 } }),
-        React.createElement(Icon, { name: "triangle-down", size: 24, style: { position: 'relative', top: -7 } })));
+        React.createElement(icons_1.Icon, { name: "triangle-up", size: 24, style: { position: 'relative', top: 7 } }),
+        React.createElement(icons_1.Icon, { name: "triangle-down", size: 24, style: { position: 'relative', top: -7 } })));
 };
-export default Arrows;
+exports.default = Arrows;

package/src/components/Dropdown/index.js

@@ -1,22 +1,24 @@
-import { __rest } from "tslib";
-import * as React from 'react';
-import { useState, useRef } from 'react';
-import { Flex } from 'rebass';
-import join from '../utils/join';
-import useProperty from '../utils/useProperty';
-import Arrows from './Arrows';
-import SimpleButton from '../SimpleButton';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const react_1 = require("react");
+const rebass_1 = require("rebass");
+const join_1 = tslib_1.__importDefault(require("../utils/join"));
+const useProperty_1 = tslib_1.__importDefault(require("../utils/useProperty"));
+const Arrows_1 = tslib_1.__importDefault(require("./Arrows"));
+const SimpleButton_1 = tslib_1.__importDefault(require("../SimpleButton"));
 const baseClassName = 'ab-Dropdown';
 const Dropdown = (props) => {
-    let { options, multiple, name, autoFocus, showEmptyItem = true, showClearButton, disabled, allowSearch, clearButtonProps, value: _, onChange: __, style, onExpand } = props, boxProps = __rest(props, ["options", "multiple", "name", "autoFocus", "showEmptyItem", "showClearButton", "disabled", "allowSearch", "clearButtonProps", "value", "onChange", "style", "onExpand"]);
+    let { options, multiple, name, autoFocus, showEmptyItem = true, showClearButton, disabled, allowSearch, clearButtonProps, value: _, onChange: __, style, onExpand } = props, boxProps = tslib_1.__rest(props, ["options", "multiple", "name", "autoFocus", "showEmptyItem", "showClearButton", "disabled", "allowSearch", "clearButtonProps", "value", "onChange", "style", "onExpand"]);
     if (showClearButton !== false) {
         showClearButton = true;
     }
-    let [value, setValue] = useProperty(props, 'value', undefined, {
+    let [value, setValue] = (0, useProperty_1.default)(props, 'value', undefined, {
         onChange: props.onChange,
     });
     let selectedOption = null;
-    let [lazyOptions, setLazyOptions] = useState([]);
+    let [lazyOptions, setLazyOptions] = (0, react_1.useState)([]);
     let onMouseDown = () => {
         if (onExpand) {
             onExpand();
@@ -54,9 +56,9 @@ const Dropdown = (props) => {
     const onChange = (option, e) => {
         setValue(option ? option.value : option, e, option);
     };
-    const selectRef = useRef(null);
-    const domRef = useRef(null);
-    const [focused, setFocused] = useState(false);
+    const selectRef = (0, react_1.useRef)(null);
+    const domRef = (0, react_1.useRef)(null);
+    const [focused, setFocused] = (0, react_1.useState)(false);
     const onFocus = (e) => {
         if (e.target === selectRef.current) {
             setFocused(true);
@@ -77,14 +79,14 @@ const Dropdown = (props) => {
         selectedText = placeholder;
     }
     //20  ... 20 16
-    const renderClearButton = () => (React.createElement(SimpleButton, Object.assign({ variant: "text", icon: "close", tone: "none", tooltip: "Clear", iconSize: 20, px: 0, py: 0, marginRight: 1 }, clearButtonProps, { style: Object.assign({ zIndex: 10, color: 'inherit' }, (clearButtonProps ? clearButtonProps.style : null)), onClick: (e) => {
+    const renderClearButton = () => (React.createElement(SimpleButton_1.default, Object.assign({ variant: "text", icon: "close", tone: "none", tooltip: "Clear", iconSize: 20, px: 0, py: 0, marginRight: 1 }, clearButtonProps, { style: Object.assign({ zIndex: 10, color: 'inherit' }, (clearButtonProps ? clearButtonProps.style : null)), onClick: (e) => {
             e.preventDefault();
             onChange(null, e);
         } })));
-    return (React.createElement(Flex, Object.assign({ ref: domRef, flexDirection: "row", alignItems: "center" }, boxProps, { className: join(props.className, baseClassName, !selectedOption ? `${baseClassName}--empty` : `${baseClassName}--not-empty`, focused ? `${baseClassName}--focused` : `${baseClassName}--not-focused`, disabled ? `${baseClassName}--disabled` : null), style: style, tabIndex: focused ? -1 : props.tabIndex || 0, onFocus: onFocus, onBlur: onBlur }),
+    return (React.createElement(rebass_1.Flex, Object.assign({ ref: domRef, flexDirection: "row", alignItems: "center" }, boxProps, { className: (0, join_1.default)(props.className, baseClassName, !selectedOption ? `${baseClassName}--empty` : `${baseClassName}--not-empty`, focused ? `${baseClassName}--focused` : `${baseClassName}--not-focused`, disabled ? `${baseClassName}--disabled` : null), style: style, tabIndex: focused ? -1 : props.tabIndex || 0, onFocus: onFocus, onBlur: onBlur }),
         React.createElement("div", { style: { display: 'inline-block' }, className: `${baseClassName}__text` },
             selectedText,
-            React.createElement(Arrows, null)),
+            React.createElement(Arrows_1.default, null)),
         React.createElement("select", { ref: selectRef, tabIndex: -1, disabled: disabled, value: value == null ? '' : value, onChange: (e) => {
                 const selected = finalOptions.filter((o) => o.value == e.target.value)[0];
                 onChange(selected, e);
@@ -100,4 +102,4 @@ const Dropdown = (props) => {
         })),
         showClearButton && selectedOption ? renderClearButton() : null));
 };
-export default Dropdown;
+exports.default = Dropdown;

package/src/components/DropdownButton/DropdownButtonItem.js

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