@adaptabletools/adaptable 10.0.0-canary.0

package/src/View/ChangeHistory/ChangeHistoryGrid.js

@@ -0,0 +1,306 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChangeHistoryGrid = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const AdaptableContext_1 = require("../AdaptableContext");
+const all_modules_1 = require("@ag-grid-community/all-modules");
+const agGrid_1 = tslib_1.__importDefault(require("../../agGrid"));
+const react_1 = require("react");
+const usePrevious_1 = tslib_1.__importDefault(require("../../components/utils/usePrevious"));
+exports.ChangeHistoryGrid = (props) => {
+    const { changeHistoryLog, adaptableContainerId, vendorContainerId, onUndoChange } = props;
+    const mainAdaptableInstance = AdaptableContext_1.useAdaptable();
+    const [adaptableApi, setAdaptableApi] = react_1.useState(null);
+    const undoChangeEnabled = mainAdaptableInstance.api.internalApi
+        .getEntitlementService()
+        .isModuleFullEntitlement('ChangeHistory');
+    const previousChangeHistoryLog = usePrevious_1.default(changeHistoryLog, changeHistoryLog);
+    // initialize Adaptable grid
+    react_1.useEffect(() => {
+        const initializeAdaptableGrid = async () => {
+            const gridOptions = buildGridOptions(mainAdaptableInstance, changeHistoryLog);
+            const adaptableOptions = buildAdaptableOptions(mainAdaptableInstance, gridOptions, adaptableContainerId, vendorContainerId, undoChangeEnabled, onUndoChange);
+            const initializedAdaptableApi = await agGrid_1.default.init(adaptableOptions);
+            setAdaptableApi(initializedAdaptableApi);
+        };
+        initializeAdaptableGrid();
+    }, []);
+    // update row data
+    react_1.useEffect(() => {
+        if (!!adaptableApi) {
+            const addedChangeKeys = Object.keys(changeHistoryLog).filter((newChangeKey) => {
+                const previousChangeWithSameKey = previousChangeHistoryLog[newChangeKey];
+                if (!previousChangeWithSameKey) {
+                    return true;
+                }
+                const addedChange = changeHistoryLog[newChangeKey];
+                return addedChange.changedAt !== previousChangeWithSameKey.changedAt;
+            });
+            const removedChangeKeys = Object.keys(previousChangeHistoryLog).filter((previousChangeKey) => {
+                const newChangeWithSameKey = changeHistoryLog[previousChangeKey];
+                if (!newChangeWithSameKey) {
+                    return true;
+                }
+                const previousChange = previousChangeHistoryLog[previousChangeKey];
+                return previousChange.changedAt !== newChangeWithSameKey.changedAt;
+            });
+            const addedChangeHistoryLogs = filterChangeHistoryLog(changeHistoryLog, addedChangeKeys);
+            const removedChangeHistoryLogs = filterChangeHistoryLog(previousChangeHistoryLog, removedChangeKeys);
+            // here we access directly the AG Grid API, but this is OK because:
+            // 1. this method (gridAPi.applyTransaction() is NOT accessible otherwise and making it public opens other cans of worms
+            // 2. this UI will be reimplemented with Infinite Table anyway
+            const addedRows = mapChangeHistoryRowData(addedChangeHistoryLogs, mainAdaptableInstance);
+            const removedRows = mapChangeHistoryRowData(removedChangeHistoryLogs, mainAdaptableInstance);
+            adaptableApi.internalApi.getAdaptableOptions().vendorGrid.api.applyTransactionAsync({
+                add: addedRows,
+                remove: removedRows,
+            });
+        }
+    }, [changeHistoryLog]);
+    return React.createElement(React.Fragment, null);
+};
+const buildAdaptableOptions = (mainAdaptableInstance, gridOptions, adaptableContainerId, vendorContainerId, undoChangeEnabled, onUndoChange) => {
+    const mainAdaptableOptions = mainAdaptableInstance.adaptableOptions;
+    const mainAdaptableTheme = mainAdaptableInstance.api.themeApi.getCurrentTheme();
+    const undoRowNode = (rowNode) => {
+        var _a;
+        const changeKey = (_a = rowNode === null || rowNode === void 0 ? void 0 : rowNode.data) === null || _a === void 0 ? void 0 : _a['changeKey'];
+        changeKey && onUndoChange(changeKey);
+    };
+    const options = {
+        vendorGrid: Object.assign(Object.assign({}, gridOptions), { modules: [...all_modules_1.AllCommunityModules] }),
+        primaryKey: 'primaryKey',
+        userName: `${mainAdaptableOptions.userName}`,
+        adaptableId: `${mainAdaptableOptions.adaptableId}::ChangeHistory`,
+        containerOptions: {
+            adaptableContainer: adaptableContainerId,
+            vendorContainer: vendorContainerId,
+        },
+        entitlementOptions: {
+            defaultAccessLevel: 'Hidden',
+        },
+        layoutOptions: {
+            createDefaultLayout: false,
+        },
+        userInterfaceOptions: {
+            actionColumns: [
+                {
+                    columnId: 'undoActionColumn',
+                    friendlyName: ' ',
+                    includeGroupedRows: true,
+                    actionColumnButton: {
+                        label: (button, context) => {
+                            if (context.api.gridApi.isGroupRowNode(context.rowNode)) {
+                                return 'Undo Group';
+                            }
+                            return 'Undo Change';
+                        },
+                        onClick: (button, context) => {
+                            var _a;
+                            const rowNode = context.rowNode;
+                            if (context.api.gridApi.isGroupRowNode(rowNode)) {
+                                // undo all children
+                                const childrenNodes = (_a = context.rowNode) === null || _a === void 0 ? void 0 : _a.childrenAfterFilter;
+                                if (childrenNodes) {
+                                    childrenNodes.forEach((childNode) => undoRowNode(childNode));
+                                }
+                            }
+                            else {
+                                undoRowNode(rowNode);
+                            }
+                        },
+                        buttonStyle: {
+                            variant: 'raised',
+                            tone: 'accent',
+                        },
+                    },
+                },
+            ],
+        },
+        predefinedConfig: {
+            Layout: {
+                Revision: Date.now(),
+                CurrentLayout: 'ChangeHistoryLayout',
+                Layouts: [
+                    {
+                        Name: 'ChangeHistoryLayout',
+                        Columns: [
+                            'changeInfo.primaryKeyValue',
+                            'changedColumnLabel',
+                            'changeInfo.oldValue',
+                            'changeInfo.newValue',
+                            'changeInfo.changedAt',
+                            'changeTriggerLabel',
+                            'undoActionColumn',
+                        ],
+                        ColumnSorts: [
+                            {
+                                ColumnId: 'changeInfo.changedAt',
+                                SortOrder: 'Desc',
+                            },
+                        ],
+                        ColumnWidthMap: {
+                            undoActionColumn: 110,
+                        },
+                        PinnedColumnsMap: {
+                            undoActionColumn: 'right',
+                        },
+                    },
+                ],
+            },
+            FormatColumn: {
+                Revision: Date.now(),
+                FormatColumns: [
+                    {
+                        Scope: {
+                            ColumnIds: ['changeInfo.changedAt'],
+                        },
+                        DisplayFormat: {
+                            Formatter: 'DateFormatter',
+                            Options: {
+                                Pattern: `${mainAdaptableOptions.userInterfaceOptions.dateInputOptions.dateFormat} HH:mm:ss`,
+                            },
+                        },
+                    },
+                ],
+            },
+            Theme: {
+                Revision: Date.now(),
+                CurrentTheme: mainAdaptableTheme,
+            },
+        },
+    };
+    if (!undoChangeEnabled) {
+        const layoutColumns = options.predefinedConfig.Layout.Layouts[0].Columns;
+        if (layoutColumns.includes('undoActionColumn')) {
+            // remove action column from layout
+            options.predefinedConfig.Layout.Layouts[0].Columns = layoutColumns.filter((columnId) => columnId !== 'undoActionColumn');
+        }
+    }
+    return options;
+};
+const buildGridOptions = (mainAdaptableInstance, changeHistoryLog) => {
+    var _a, _b;
+    const mainPrimaryKeyColumnHeader = (_b = (_a = mainAdaptableInstance.api.columnApi.getPrimaryKeyColumn()) === null || _a === void 0 ? void 0 : _a.FriendlyName) !== null && _b !== void 0 ? _b : 'Row ID';
+    const options = {
+        defaultColDef: {
+            floatingFilter: true,
+            filter: true,
+            sortable: true,
+            resizable: true,
+            enableRowGroup: true,
+            editable: false,
+            enablePivot: false,
+            enableValue: false,
+            lockPinned: true,
+            // default set to true to pass this to the action column
+            suppressAutoSize: true,
+            suppressMenu: true,
+            menuTabs: ['generalMenuTab', 'filterMenuTab'],
+        },
+        autoGroupColumnDef: {
+            sortable: true,
+            suppressMenu: false,
+        },
+        columnDefs: [
+            {
+                field: 'primaryKey',
+                type: ['abColDefString'],
+                hide: true,
+            },
+            {
+                headerName: `Row (${mainPrimaryKeyColumnHeader})`,
+                field: 'changeInfo.primaryKeyValue',
+                type: ['abColDefString'],
+                suppressAutoSize: false,
+                suppressMenu: false,
+                flex: 3,
+                initialFlex: 3,
+            },
+            {
+                headerName: 'Changed Column',
+                field: 'changedColumnLabel',
+                type: ['abColDefString'],
+                suppressAutoSize: false,
+                suppressMenu: false,
+                flex: 3,
+                initialFlex: 3,
+            },
+            {
+                headerName: 'Previous Value',
+                field: 'changeInfo.oldValue',
+                type: ['abColDefString'],
+                suppressAutoSize: false,
+                suppressMenu: false,
+                flex: 3,
+                initialFlex: 3,
+            },
+            {
+                headerName: 'New Value',
+                field: 'changeInfo.newValue',
+                type: ['abColDefString'],
+                suppressAutoSize: false,
+                suppressMenu: false,
+                flex: 3,
+                initialFlex: 3,
+            },
+            {
+                headerName: 'Changed at',
+                field: 'changeInfo.changedAt',
+                type: ['abColDefDate'],
+                suppressAutoSize: false,
+                suppressMenu: false,
+                flex: 3,
+                initialFlex: 3,
+            },
+            {
+                headerName: 'Source',
+                field: 'changeTriggerLabel',
+                type: ['abColDefString'],
+                suppressAutoSize: false,
+                suppressMenu: false,
+                flex: 2,
+                initialFlex: 2,
+            },
+        ],
+        rowData: mapChangeHistoryRowData(changeHistoryLog, mainAdaptableInstance),
+        enableRangeSelection: true,
+        suppressColumnVirtualisation: false,
+        sideBar: false,
+        suppressMenuHide: true,
+        rowSelection: 'multiple',
+        skipHeaderOnAutoSize: true,
+    };
+    return options;
+};
+const mapChangeHistoryRowData = (changeHistoryLog = {}, mainAdaptableInstance) => {
+    return Object.entries(changeHistoryLog).map(([changeKey, changeInfo]) => {
+        return {
+            primaryKey: `${changeKey}::${changeInfo.changedAt}`,
+            changeKey,
+            changeTriggerLabel: getChangeTriggerLabel(changeInfo),
+            changedColumnLabel: getColumnHeaderLabel(changeInfo.columnId, mainAdaptableInstance),
+            changeInfo,
+        };
+    });
+};
+// memoize headers to avoid unnecessary main grid lookups
+const headerMap = new Map();
+const getColumnHeaderLabel = (columnId, mainAdaptableInstance) => {
+    var _a, _b;
+    if (!headerMap.has(columnId)) {
+        headerMap.set(columnId, (_b = (_a = mainAdaptableInstance.api.columnApi.getColumnFromId(columnId)) === null || _a === void 0 ? void 0 : _a.FriendlyName) !== null && _b !== void 0 ? _b : columnId);
+    }
+    return headerMap.get(columnId);
+};
+const getChangeTriggerLabel = (changeInfo) => {
+    return changeInfo.trigger === 'tick' ? 'Ticking data' : 'User edit';
+};
+const filterChangeHistoryLog = (changeObject, filterValues) => {
+    const result = {};
+    filterValues.forEach((allowedKey) => {
+        result[allowedKey] = changeObject[allowedKey];
+    });
+    return result;
+};

package/src/View/ChangeHistory/ChangeHistoryPopup.d.ts

@@ -0,0 +1,12 @@
+import { ModuleViewPopupProps } from '../Components/SharedProps/ModuleViewPopupProps';
+import * as React from 'react';
+import { DataChangedInfo } from '../../PredefinedConfig/Common/DataChangedInfo';
+interface ChangeHistoryPopupProps extends ModuleViewPopupProps<ChangeHistoryPopupComponent> {
+    changeHistoryLog: Record<string, DataChangedInfo>;
+}
+declare class ChangeHistoryPopupComponent extends React.Component<ChangeHistoryPopupProps, {}> {
+    constructor(props: ChangeHistoryPopupProps);
+    render(): JSX.Element;
+}
+export declare let ChangeHistoryPopup: import("react-redux").ConnectedComponent<typeof ChangeHistoryPopupComponent, any>;
+export {};

package/src/View/ChangeHistory/ChangeHistoryPopup.js

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChangeHistoryPopup = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const UIHelper_1 = require("../UIHelper");
+const react_redux_1 = require("react-redux");
+const PanelWithButton_1 = require("../Components/Panels/PanelWithButton");
+const ChangeHistoryGrid_1 = require("./ChangeHistoryGrid");
+const SystemRedux_1 = require("../../Redux/ActionsReducers/SystemRedux");
+class ChangeHistoryPopupComponent extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = UIHelper_1.UIHelper.getEmptyConfigState();
+    }
+    render() {
+        const adaptableContainerId = 'changeHistoryAdaptableGrid';
+        const vendorContainerId = 'changeHistoryVendorGrid';
+        const handleChangeUndo = (changeKey) => {
+            const changeToBeUndone = this.props.changeHistoryLog[changeKey];
+            if (changeToBeUndone) {
+                this.props.api.gridApi.undoCellEdit(changeToBeUndone);
+                this.props.api.internalApi.dispatchReduxAction(SystemRedux_1.SystemChangeHistoryEntryDelete(changeToBeUndone));
+            }
+        };
+        return (React.createElement(PanelWithButton_1.PanelWithButton, { headerText: this.props.moduleInfo.FriendlyName, glyphicon: this.props.moduleInfo.Glyph, infoLink: this.props.moduleInfo.HelpPage, infoLinkDisabled: !this.props.api.internalApi.isDocumentationLinksDisplayed(), border: "none", bodyProps: { padding: 0 } },
+            React.createElement("div", { id: adaptableContainerId }),
+            React.createElement("div", { id: vendorContainerId, style: { height: '100%', width: '1000px' } }),
+            React.createElement(ChangeHistoryGrid_1.ChangeHistoryGrid, { adaptableContainerId: adaptableContainerId, vendorContainerId: vendorContainerId, changeHistoryLog: this.props.changeHistoryLog, onUndoChange: handleChangeUndo })));
+    }
+}
+function mapStateToProps(state, ownProps) {
+    return {
+        changeHistoryLog: state.System.ChangeHistory,
+    };
+}
+function mapDispatchToProps(dispatch) {
+    return {};
+}
+exports.ChangeHistoryPopup = react_redux_1.connect(mapStateToProps, mapDispatchToProps)(ChangeHistoryPopupComponent);

package/src/View/ColorPicker.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { HTMLProps } from 'react';
+import { BoxProps } from 'rebass';
+import { AdaptableApi } from '../Api/AdaptableApi';
+export declare type ColorPickerProps = HTMLProps<HTMLInputElement> & {
+    api: AdaptableApi;
+} & BoxProps;
+export declare const ColorPicker: React.ForwardRefExoticComponent<Pick<ColorPickerProps, "max" | "required" | "default" | "high" | "low" | "disabled" | "start" | "open" | "media" | "hidden" | "cite" | "data" | "dir" | "form" | "label" | "p" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "async" | "defer" | "manifest" | "m" | "color" | "content" | "size" | "flex" | "wrap" | "padding" | "multiple" | "alignSelf" | "backgroundColor" | "fontSize" | "height" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "opacity" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "translate" | "width" | "margin" | "children" | "key" | "list" | "step" | "contextMenu" | "api" | "type" | "min" | "rows" | "colSpan" | "rowSpan" | "onClick" | "value" | "download" | "checked" | "name" | "className" | "id" | "lang" | "method" | "target" | "role" | "tabIndex" | "crossOrigin" | "href" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "classID" | "useMap" | "wmode" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "as" | "hrefLang" | "integrity" | "rel" | "sizes" | "charSet" | "kind" | "src" | "srcLang" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "muted" | "playsInline" | "preload" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dateTime" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "srcSet" | "accept" | "capture" | "maxLength" | "minLength" | "readOnly" | "htmlFor" | "httpEquiv" | "optimum" | "reversed" | "selected" | "nonce" | "scoped" | "cellPadding" | "cellSpacing" | "headers" | "scope" | "cols" | "poster" | "challenge" | "keyType" | "keyParams" | "mt" | "mb" | "ml" | "mr" | "my" | "marginY" | "mx" | "marginX" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "css" | "bg"> & React.RefAttributes<unknown>>;

package/src/View/ColorPicker.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ColorPicker = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const Input_1 = tslib_1.__importDefault(require("../components/Input"));
+const tinycolor = require('tinycolor2');
+exports.ColorPicker = React.forwardRef((props, ref) => {
+    const ColorPalette = props.api.userInterfaceApi.getColorPalette();
+    let { api, value } = props, restProps = tslib_1.__rest(props, ["api", "value"]);
+    const ABcolorChoicesOptions = ColorPalette.map((x) => (React.createElement("option", { key: x, value: x }, x)));
+    const ABcolorChoices = React.createElement("datalist", { id: 'ABcolorChoices' }, ABcolorChoicesOptions);
+    value = React.useMemo(() => {
+        return tinycolor(value).toHexString();
+    }, [value]);
+    return (React.createElement("div", { className: 'ColorPicker' },
+        React.createElement(Input_1.default, Object.assign({}, restProps, { value: value, ref: ref, type: "color", style: {
+                width: 70,
+                padding: 0 /* we need this to be 0, since otherwise on Windows browsers, the chosen color cannot be seen */,
+            }, list: "ABcolorChoices" })),
+        ABcolorChoices));
+});

package/src/View/Components/AdaptableDateInput/index.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+import { AdaptableInputProps } from '../AdaptableInput';
+export declare type AdaptableDateInputProps = AdaptableInputProps;
+declare const AdaptableDateInput: React.ForwardRefExoticComponent<Pick<import("../../../components/Input").InputProps, "max" | "required" | "default" | "high" | "low" | "disabled" | "start" | "open" | "media" | "hidden" | "cite" | "data" | "dir" | "form" | "label" | "p" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "async" | "defer" | "manifest" | "m" | "color" | "content" | "size" | "flex" | "wrap" | "padding" | "multiple" | "alignSelf" | "backgroundColor" | "fontSize" | "height" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "opacity" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "translate" | "width" | "margin" | "children" | "key" | "list" | "step" | "contextMenu" | "type" | "min" | "rows" | "colSpan" | "rowSpan" | "onClick" | "value" | "download" | "checked" | "name" | "className" | "id" | "lang" | "method" | "target" | "role" | "tabIndex" | "crossOrigin" | "href" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "classID" | "useMap" | "wmode" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "as" | "hrefLang" | "integrity" | "rel" | "sizes" | "charSet" | "kind" | "src" | "srcLang" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "muted" | "playsInline" | "preload" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dateTime" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "srcSet" | "accept" | "capture" | "maxLength" | "minLength" | "readOnly" | "htmlFor" | "httpEquiv" | "optimum" | "reversed" | "selected" | "nonce" | "scoped" | "cellPadding" | "cellSpacing" | "headers" | "scope" | "cols" | "poster" | "challenge" | "keyType" | "keyParams" | "mt" | "mb" | "ml" | "mr" | "my" | "marginY" | "mx" | "marginX" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "css" | "bg" | "placehoder"> & React.RefAttributes<HTMLInputElement>>;
+export default AdaptableDateInput;

package/src/View/Components/AdaptableDateInput/index.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const Datepicker_1 = require("../../../components/Datepicker");
+const AdaptableContext_1 = require("../../AdaptableContext");
+const useProperty_1 = tslib_1.__importDefault(require("../../../components/utils/useProperty"));
+const DateHelper_1 = require("../../../Utilities/Helpers/DateHelper");
+const AdaptableDateInput = React.forwardRef((props, ref) => {
+    const dateInputOptions = AdaptableContext_1.useAdaptable().adaptableOptions.userInterfaceOptions.dateInputOptions;
+    const { value: _, defaultValue: __, onChange, required, disabled } = props, inputProps = tslib_1.__rest(props, ["value", "defaultValue", "onChange", "required", "disabled"]);
+    const [value, setValue] = useProperty_1.default(props, 'value', undefined, {
+        onChange: (dateString) => { var _a; return (_a = 
+        // wrap date value in FormEvent in order to keep the external API unchanged
+        props.onChange) === null || _a === void 0 ? void 0 : _a.call(
+        // wrap date value in FormEvent in order to keep the external API unchanged
+        props, {
+            target: {
+                // ALWAYS trigger onChange with the ISO format
+                value: dateString,
+            },
+        }); },
+    });
+    const dateValue = new Date(value);
+    const datepickerProps = Object.assign({ 
+        // this is OK as long as we do not support range datepicker
+        value: dateValue, onChange: (dateValue) => { var _a; 
+        // convert to ISO8601 string format
+        // see https://developer.mozilla.org/en-US/docs/Web/HTML/Date_and_time_formats#date_strings
+        return setValue((_a = DateHelper_1.dateToISO(dateValue)) !== null && _a !== void 0 ? _a : ''); }, required,
+        disabled, dateProps: {
+            format: dateInputOptions.dateFormat,
+            locale: dateInputOptions.locale,
+        }, showWeekNumber: dateInputOptions.showWeekNumber, showOutsideDays: dateInputOptions.showOutsideDays, datepickerButtons: dateInputOptions.datepickerButtons }, inputProps);
+    return React.createElement(Datepicker_1.Datepicker, Object.assign({ ref: ref }, datepickerProps));
+});
+exports.default = AdaptableDateInput;

package/src/View/Components/AdaptableInput/index.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+import { InputProps } from '../../../components/Input';
+export declare type AdaptableInputProps = InputProps;
+declare const AdaptableInput: React.ForwardRefExoticComponent<Pick<InputProps, "max" | "required" | "default" | "high" | "low" | "disabled" | "start" | "open" | "media" | "hidden" | "cite" | "data" | "dir" | "form" | "label" | "p" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "async" | "defer" | "manifest" | "m" | "color" | "content" | "size" | "flex" | "wrap" | "padding" | "multiple" | "alignSelf" | "backgroundColor" | "fontSize" | "height" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "opacity" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "translate" | "width" | "margin" | "children" | "key" | "list" | "step" | "contextMenu" | "type" | "min" | "rows" | "colSpan" | "rowSpan" | "onClick" | "value" | "download" | "checked" | "name" | "className" | "id" | "lang" | "method" | "target" | "role" | "tabIndex" | "crossOrigin" | "href" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "classID" | "useMap" | "wmode" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "draggable" | "placeholder" | "spellCheck" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "as" | "hrefLang" | "integrity" | "rel" | "sizes" | "charSet" | "kind" | "src" | "srcLang" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "muted" | "playsInline" | "preload" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dateTime" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "srcSet" | "accept" | "capture" | "maxLength" | "minLength" | "readOnly" | "htmlFor" | "httpEquiv" | "optimum" | "reversed" | "selected" | "nonce" | "scoped" | "cellPadding" | "cellSpacing" | "headers" | "scope" | "cols" | "poster" | "challenge" | "keyType" | "keyParams" | "mt" | "mb" | "ml" | "mr" | "my" | "marginY" | "mx" | "marginX" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "css" | "bg" | "placehoder"> & React.RefAttributes<HTMLInputElement>>;
+export default AdaptableInput;

package/src/View/Components/AdaptableInput/index.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const Input_1 = tslib_1.__importDefault(require("../../../components/Input"));
+const AdaptableContext_1 = require("../../AdaptableContext");
+const AdaptableDateInput_1 = tslib_1.__importDefault(require("../AdaptableDateInput"));
+const AdaptableInput = React.forwardRef((props, ref) => {
+    var _a, _b;
+    const useNativeInputDate = (_b = (_a = AdaptableContext_1.useAdaptable().adaptableOptions.userInterfaceOptions) === null || _a === void 0 ? void 0 : _a.dateInputOptions) === null || _b === void 0 ? void 0 : _b.useNativeInput;
+    if (props.type === 'date' && !useNativeInputDate) {
+        // use AdapTable date input
+        return React.createElement(AdaptableDateInput_1.default, Object.assign({}, props, { ref: ref }));
+    }
+    else {
+        // native input
+        return React.createElement(Input_1.default, Object.assign({}, props, { ref: ref }));
+    }
+});
+exports.default = AdaptableInput;

package/src/View/Components/AdaptableObjectCollection/index.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import { IColItem } from '../../UIInterfaces';
+export interface AdaptableObjectCollectionProps extends React.ClassAttributes<AdaptableObjectCollection> {
+    colItems: IColItem[];
+    items: any[];
+    allowOverflow?: boolean;
+    style?: React.CSSProperties;
+    headerAlign?: string;
+}
+export declare class AdaptableObjectCollection extends React.Component<AdaptableObjectCollectionProps, {}> {
+    render(): any;
+}

package/src/View/Components/AdaptableObjectCollection/index.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AdaptableObjectCollection = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+/// <reference path="../../typings/.d.ts" />
+const PanelWithRow_1 = require("../Panels/PanelWithRow");
+class AdaptableObjectCollection extends React.Component {
+    render() {
+        const allowOverflow = this.props.allowOverflow ? 'visible' : 'auto';
+        return (React.createElement("div", { style: Object.assign({}, this.props.style), className: "ab-ObjectCollection" },
+            React.createElement(PanelWithRow_1.PanelWithRow, { border: "none", colItems: this.props.colItems, headerAlign: this.props.headerAlign }),
+            React.createElement("div", { style: { overflowY: allowOverflow, boxShadow: 'none' } }, this.props.items)));
+    }
+}
+exports.AdaptableObjectCollection = AdaptableObjectCollection;

package/src/View/Components/AdaptableObjectRow/index.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import { IColItem } from '../../UIInterfaces';
+export interface AdaptableObjectRowProps extends React.ClassAttributes<AdaptableObjectRow> {
+    colItems: IColItem[];
+    fontSize?: string;
+    onClick?: (e: React.SyntheticEvent) => void;
+    style?: React.CSSProperties;
+    isSuspended?: boolean;
+}
+export declare class AdaptableObjectRow extends React.Component<AdaptableObjectRowProps, {}> {
+    render(): any;
+}

package/src/View/Components/AdaptableObjectRow/index.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AdaptableObjectRow = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+/// <reference path="../../typings/.d.ts" />
+const rebass_1 = require("rebass");
+const join_1 = tslib_1.__importDefault(require("../../../components/utils/join"));
+class AdaptableObjectRow extends React.Component {
+    render() {
+        const colItems = this.props.colItems.map((colItem, index) => (React.createElement(rebass_1.Text, { key: index, fontSize: 'var(--ab-font-size-3)', title: typeof colItem.Content === 'string' ? colItem.Content : undefined, style: {
+                flex: colItem.Size,
+                whiteSpace: 'nowrap',
+                textOverflow: 'ellipsis',
+                overflow: 'hidden',
+            }, "data-name": "list-group-cell", paddingLeft: 1, paddingRight: 1 }, colItem.Content)));
+        const className = join_1.default('ab-AdaptableObjectRow', this.props.isSuspended && 'ab-AdaptableObjectRow--is-suspended');
+        return (React.createElement("div", { className: className, onClick: this.props.onClick, style: this.props.style },
+            React.createElement(rebass_1.Flex, { "data-name": "list-group-item", className: "list-group-item", alignItems: "center", padding: 2, margin: 0, style: {
+                    overflowY: 'visible',
+                } }, colItems)));
+    }
+}
+exports.AdaptableObjectRow = AdaptableObjectRow;

package/src/View/Components/Buttons/ButtonApply.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import { SimpleButtonProps } from '../../../components/SimpleButton';
+export interface ApplyButtonProps extends SimpleButtonProps {
+}
+export declare class ButtonApply extends React.Component<ApplyButtonProps, {}> {
+    render(): JSX.Element;
+}

package/src/View/Components/Buttons/ButtonApply.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ButtonApply = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const SimpleButton_1 = tslib_1.__importDefault(require("../../../components/SimpleButton"));
+class ButtonApply extends React.Component {
+    render() {
+        return (React.createElement(SimpleButton_1.default, Object.assign({ "data-name": "apply", tooltip: "Apply", iconSize: 20, icon: "check", variant: "text" }, this.props)));
+    }
+}
+exports.ButtonApply = ButtonApply;

package/src/View/Components/Buttons/ButtonBase/index.d.ts

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import { ButtonProps as BtnProps } from 'rebass';
+import { AccessLevel } from '../../../../PredefinedConfig/Common/Entitlement';
+export interface ButtonBaseProps extends BtnProps {
+    overrideDisableButton?: boolean;
+    transformGlyph?: boolean;
+    className?: string;
+    accessLevel?: AccessLevel;
+    showDefaultStyle?: boolean;
+    displayMode?: string;
+    icon?: string;
+    toolTipAndText?: string;
+    glyph?: string;
+    overrideText?: string;
+    overrideTooltip?: string;
+    iconPosition?: string;
+    hideToolTip?: boolean;
+}
+export declare type ButtonProps = ButtonBaseProps;
+export declare class ButtonBase extends React.Component<ButtonBaseProps, {}> {
+    static defaultProps: ButtonBaseProps;
+    render(): JSX.Element;
+}