@adaptabletools/adaptable 10.0.0-canary.0

package/src/components/utils/getAvailableSizeInfo.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const getAvailableSizeInfo = ({ targetRect, constrainRect, maxSizeOffset, }) => {
+    let maxHeight;
+    let maxWidth;
+    const topAvailableSpace = Math.round(targetRect.top - constrainRect.top);
+    const leftAvailableSpace = Math.round(targetRect.left - constrainRect.left);
+    const bottomAvailableSpace = Math.round(constrainRect.bottom - targetRect.bottom);
+    const rightAvailableSpace = Math.round(constrainRect.right - targetRect.right);
+    let horizontalPosition = 'right';
+    let verticalPosition = 'bottom';
+    if (leftAvailableSpace > rightAvailableSpace) {
+        horizontalPosition = 'left';
+        maxWidth = Math.round(targetRect.left - constrainRect.left);
+    }
+    else {
+        maxWidth = rightAvailableSpace;
+    }
+    if (topAvailableSpace > bottomAvailableSpace) {
+        verticalPosition = 'top';
+        maxHeight = Math.round(targetRect.top - constrainRect.top);
+    }
+    else {
+        maxHeight = bottomAvailableSpace;
+    }
+    if (maxSizeOffset != null) {
+        maxWidth -= maxSizeOffset;
+        maxHeight -= maxSizeOffset;
+    }
+    return {
+        horizontalPosition,
+        verticalPosition,
+        maxWidth,
+        maxHeight,
+    };
+};
+exports.default = getAvailableSizeInfo;

package/src/components/utils/join.d.ts

@@ -0,0 +1,2 @@
+declare const join: (...args: any[]) => string;
+export default join;

package/src/components/utils/join.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const join = (...args) => args.filter((x) => !!x).join(' ');
+exports.default = join;

package/src/components/utils/selectParent/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (selector: string, node: any) => HTMLElement | null;
+export default _default;

package/src/components/utils/selectParent/index.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const matches_1 = tslib_1.__importDefault(require("./matches"));
+exports.default = (selector, node) => {
+    if (!node) {
+        return null;
+    }
+    while ((node = node.parentElement)) {
+        if (matches_1.default.call(node, selector)) {
+            return node;
+        }
+    }
+    return null;
+};

package/src/components/utils/selectParent/matches.d.ts

@@ -0,0 +1,2 @@
+declare var nativeMatches: any;
+export default nativeMatches;

package/src/components/utils/selectParent/matches.js

@@ -0,0 +1,9 @@
+'use strict';
+Object.defineProperty(exports, "__esModule", { value: true });
+var proto = typeof Element === 'undefined' ? {} : Element.prototype;
+var nativeMatches = proto.matches ||
+    proto.mozMatchesSelector ||
+    proto.msMatchesSelector ||
+    proto.oMatchesSelector ||
+    proto.webkitMatchesSelector;
+exports.default = nativeMatches;

package/src/components/utils/useAutoFocus.d.ts

@@ -0,0 +1,12 @@
+import { RefObject } from 'react';
+declare const useAutoFocus: (props: {
+    autoFocus?: boolean;
+    isOpen?: boolean;
+    previous?: ({ autoFocus }: {
+        autoFocus: boolean;
+    }) => boolean;
+    shouldFocus?: ({ autoFocus }: {
+        autoFocus: boolean;
+    }) => boolean;
+}, focusElementRef: RefObject<HTMLElement>) => void;
+export default useAutoFocus;

package/src/components/utils/useAutoFocus.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const react_1 = require("react");
+const usePrevious_1 = tslib_1.__importDefault(require("./usePrevious"));
+const useAutoFocus = (props, focusElementRef) => {
+    const autoFocus = props.autoFocus === undefined ? true : props.autoFocus;
+    const prevAutoFocus = usePrevious_1.default(props.previous ? props.previous({ autoFocus }) : autoFocus, undefined);
+    react_1.useEffect(() => {
+        if (focusElementRef.current &&
+            focusElementRef.current.focus &&
+            autoFocus &&
+            (props.shouldFocus ? props.shouldFocus({ autoFocus }) : true) &&
+            (prevAutoFocus === undefined || prevAutoFocus !== autoFocus)) {
+            focusElementRef.current.focus();
+        }
+    }, [autoFocus, prevAutoFocus, props.isOpen]);
+};
+exports.default = useAutoFocus;

package/src/components/utils/useContainerScrollObserver/index.d.ts

@@ -0,0 +1,6 @@
+declare type UseContainerScrollObserverCallback = (currentIndex: number) => void;
+export declare const useContainerScrollObserver: (callback: UseContainerScrollObserverCallback) => {
+    ref: (node: any) => void;
+    scrollToIndex: (index: number) => void;
+};
+export {};

package/src/components/utils/useContainerScrollObserver/index.js

@@ -0,0 +1,80 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useContainerScrollObserver = void 0;
+const react_1 = require("react");
+class SectionSelector {
+    constructor(node) {
+        this.scrollTop = 0;
+        this.childrenHeights = [];
+        this.select = (scrollTop) => {
+            this.refreshFromDOM();
+            const relativeCurrentHeight = (scrollTop * this.boxHeight) / this.maxScrollTop;
+            let heightSum = 0;
+            for (let i = 0, len = this.childrenHeights.length; i < len; i++) {
+                heightSum += this.childrenHeights[i];
+                if (heightSum > relativeCurrentHeight) {
+                    return i;
+                }
+            }
+            return this.childrenHeights.length - 1;
+        };
+        this.node = node;
+        this.refreshFromDOM();
+    }
+    refreshFromDOM() {
+        this.boxHeight = this.node.scrollHeight;
+        this.childrenHeights = Array.prototype.map.call(this.node.children, (child) => child.offsetHeight);
+        this.maxScrollTop = this.boxHeight - this.node.offsetHeight;
+    }
+    getVisibleRange(scrollTop = this.scrollTop) {
+        const top = scrollTop;
+        const height = this.node.offsetHeight;
+        const bottom = scrollTop + this.node.offsetHeight;
+        return {
+            top,
+            bottom,
+            height,
+        };
+    }
+}
+exports.useContainerScrollObserver = (callback) => {
+    const containerNodeRef = react_1.useRef(null);
+    const sectionSelectorRef = react_1.useRef(null);
+    const update = react_1.useCallback((scrollTop) => {
+        callback(sectionSelectorRef.current.select(scrollTop));
+    }, []);
+    const scrollRafRef = react_1.useRef(null);
+    const onScroll = react_1.useCallback(() => {
+        if (scrollRafRef.current) {
+            cancelAnimationFrame(scrollRafRef.current);
+            scrollRafRef.current = null;
+        }
+        requestAnimationFrame(() => {
+            scrollRafRef.current = null;
+            update(containerNodeRef.current.scrollTop);
+        });
+    }, []);
+    const setupScroll = react_1.useCallback((node) => {
+        var _a;
+        if (node) {
+            containerNodeRef.current = node;
+            node.addEventListener('scroll', onScroll, { passive: true });
+            sectionSelectorRef.current = new SectionSelector(node);
+        }
+        else {
+            (_a = containerNodeRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener('scroll', onScroll);
+            sectionSelectorRef.current = null;
+        }
+    }, []);
+    const ref = setupScroll;
+    return {
+        ref,
+        scrollToIndex: react_1.useCallback((index) => {
+            const container = containerNodeRef.current;
+            const node = container.childNodes[index];
+            node.scrollIntoView({
+                behavior: 'smooth',
+            });
+        }, []),
+    };
+};

package/src/components/utils/useDraggable.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+export default function useDraggable({ onMove, onDrop, getBoundingRect, }: {
+    onMove?: (event: MouseEvent) => void;
+    onDrop?: (dx: number, dy: number) => void;
+    getBoundingRect?: () => DOMRect;
+}): {
+    handleRef: (newNode: HTMLElement) => void;
+    targetRef: import("react").MutableRefObject<HTMLElement>;
+};

package/src/components/utils/useDraggable.js

@@ -0,0 +1,84 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+function clamp(num, min, max) {
+    return num <= min ? min : num >= max ? max : num;
+}
+function useDraggable({ onMove, onDrop, getBoundingRect = () => document.body.getBoundingClientRect(), }) {
+    const startRef = react_1.useRef();
+    const handleRef = react_1.useRef(null);
+    const targetRef = react_1.useRef(null);
+    const handleRefCallback = react_1.useCallback((newNode) => {
+        const oldNode = handleRef.current;
+        if (oldNode) {
+            oldNode.removeEventListener('mousedown', handleMouseDown);
+        }
+        if (newNode) {
+            newNode.addEventListener('mousedown', handleMouseDown);
+            boundInitialPosition();
+        }
+        handleRef.current = newNode;
+    }, []);
+    const applyTransform = (dx, dy) => {
+        if (!targetRef.current)
+            return;
+        targetRef.current.style.transform = `translate3d(${dx}px, ${dy}px, 0)`;
+    };
+    const getTranslation = (event) => {
+        if (!startRef.current)
+            return { dx: 0, dy: 0 };
+        const { pageX, pageY, bounds } = startRef.current;
+        return {
+            dx: clamp(event.pageX - pageX, bounds.left, bounds.right),
+            dy: clamp(event.pageY - pageY, bounds.top, bounds.bottom),
+        };
+    };
+    const getTranslationBounds = (targetRect, boundingRect) => {
+        const left = boundingRect.x - targetRect.x;
+        const right = left + boundingRect.width - targetRect.width;
+        const top = boundingRect.y - targetRect.y;
+        const bottom = top + boundingRect.height - targetRect.height;
+        return { left, right, top, bottom };
+    };
+    const handleMouseDown = (event) => {
+        if (!targetRef.current)
+            return;
+        event.preventDefault();
+        document.addEventListener('mouseup', handleMouseUp);
+        document.addEventListener('mousemove', handleMouseMove);
+        const targetRect = targetRef.current.getBoundingClientRect();
+        const boundingRect = getBoundingRect();
+        startRef.current = {
+            pageX: event.pageX,
+            pageY: event.pageY,
+            bounds: getTranslationBounds(targetRect, boundingRect),
+        };
+    };
+    const handleMouseUp = (event) => {
+        event.preventDefault();
+        document.removeEventListener('mouseup', handleMouseUp);
+        document.removeEventListener('mousemove', handleMouseMove);
+        const { dx, dy } = getTranslation(event);
+        applyTransform(0, 0);
+        onDrop && onDrop(dx, dy);
+    };
+    const handleMouseMove = (event) => {
+        event.preventDefault();
+        const { dx, dy } = getTranslation(event);
+        applyTransform(dx, dy);
+        onMove && onMove(event);
+    };
+    const boundInitialPosition = () => {
+        if (!targetRef.current)
+            return;
+        const targetRect = targetRef.current.getBoundingClientRect();
+        const boundingRect = getBoundingRect();
+        const bounds = getTranslationBounds(targetRect, boundingRect);
+        const dx = clamp(0, bounds.left, bounds.right);
+        const dy = clamp(0, bounds.top, bounds.bottom);
+        if (onDrop && (dx !== 0 || dy !== 0))
+            onDrop(dx, dy);
+    };
+    return { handleRef: handleRefCallback, targetRef };
+}
+exports.default = useDraggable;

package/src/components/utils/useGlobalEvent.d.ts

@@ -0,0 +1 @@
+export declare const useGlobalEvent: (eventName: string, callback: (event: KeyboardEvent) => void) => void;

package/src/components/utils/useGlobalEvent.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useGlobalEvent = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+exports.useGlobalEvent = (eventName, callback) => {
+    React.useEffect(() => {
+        window.addEventListener(eventName, callback);
+        return () => window.removeEventListener(eventName, callback);
+    }, [eventName, callback]);
+};

package/src/components/utils/useLatest.d.ts

@@ -0,0 +1 @@
+export declare const useLatest: <T>(value: T) => () => T;

package/src/components/utils/useLatest.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useLatest = void 0;
+const react_1 = require("react");
+exports.useLatest = (value) => {
+    const ref = react_1.useRef(value);
+    ref.current = value;
+    return react_1.useCallback(() => ref.current, []);
+};

package/src/components/utils/usePrevious.d.ts

@@ -0,0 +1,2 @@
+declare const usePrevious: <T>(value: T, initialValue: T) => T;
+export default usePrevious;

package/src/components/utils/usePrevious.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+const usePrevious = (value, initialValue) => {
+    const ref = react_1.useRef(initialValue);
+    react_1.useEffect(() => {
+        ref.current = value;
+    });
+    return ref.current;
+};
+exports.default = usePrevious;

package/src/components/utils/usePropState.d.ts

@@ -0,0 +1,2 @@
+import { Dispatch, SetStateAction } from 'react';
+export default function usePropState<S>(state: S | undefined, setState: Dispatch<SetStateAction<S>> | undefined, initialState: S | (() => S)): [S, Dispatch<SetStateAction<S>>];

package/src/components/utils/usePropState.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+function usePropState(state, setState, initialState) {
+    const [localState, setLocalState] = react_1.useState(initialState);
+    return [
+        state !== undefined ? state : localState,
+        setState !== undefined ? setState : setLocalState,
+    ];
+}
+exports.default = usePropState;

package/src/components/utils/useProperty.d.ts

@@ -0,0 +1,22 @@
+/**
+ *
+ * useProperty can be used to easily manage a given prop - especially when you want to support both the controlled and the uncontrolled behviour.
+ *
+ * @param props - the props of the component
+ * @param propName - the name of the property to manage
+ * @param defaultValue? - a default value for the prop - especially useful when the prop you're targeting via `propName` is uncontrolled
+ * @param config.onChange? - defaults to `props.on${PropName}Change` - useful when you want to be notified of when the property is changed - via the returned setter.
+ * config.onChange is called for both controlled and uncontrolled prop.
+ *
+ * If the prop is uncontrolled, when the returned propSetter is called, the useProperty hook will update the state internally - you can be notified of this via config.onChange.
+ *
+ * If you don't have config.onChange specified, the useProperty hook will try to call `props.on${PropName}Change` if it's defined.
+ *
+ * So even for a controlled prop, if you respect this convention and have this pair `${propName}` + `on${PropName}Change` - useProperty will do all the work and call the "event" handler prop for you.
+ *
+ * Returns [propValue, propSetterFunction] - the value of the prop and a setter function
+ */
+declare const useProperty: <TS>(props: any, propName: string, defaultValue?: TS, config?: {
+    onChange?: (value: TS, ...args: any[]) => void;
+}) => [TS, (value: TS | ((v: TS) => TS), ...args: any[]) => void];
+export default useProperty;

package/src/components/utils/useProperty.js

@@ -0,0 +1,49 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = require("react");
+const toUpperFirst = (str) => `${str.charAt(0).toUpperCase()}${str.substring(1)}`;
+const isControlled = (value) => value !== undefined;
+const emptyFn = () => { };
+/**
+ *
+ * useProperty can be used to easily manage a given prop - especially when you want to support both the controlled and the uncontrolled behviour.
+ *
+ * @param props - the props of the component
+ * @param propName - the name of the property to manage
+ * @param defaultValue? - a default value for the prop - especially useful when the prop you're targeting via `propName` is uncontrolled
+ * @param config.onChange? - defaults to `props.on${PropName}Change` - useful when you want to be notified of when the property is changed - via the returned setter.
+ * config.onChange is called for both controlled and uncontrolled prop.
+ *
+ * If the prop is uncontrolled, when the returned propSetter is called, the useProperty hook will update the state internally - you can be notified of this via config.onChange.
+ *
+ * If you don't have config.onChange specified, the useProperty hook will try to call `props.on${PropName}Change` if it's defined.
+ *
+ * So even for a controlled prop, if you respect this convention and have this pair `${propName}` + `on${PropName}Change` - useProperty will do all the work and call the "event" handler prop for you.
+ *
+ * Returns [propValue, propSetterFunction] - the value of the prop and a setter function
+ */
+const useProperty = (props, propName, defaultValue, config) => {
+    const PropName = toUpperFirst(propName);
+    const defaultValueFromProps = props[`default${PropName}`];
+    defaultValue = defaultValueFromProps === undefined ? defaultValue : defaultValueFromProps;
+    const [stateValue, setStateProperty] = react_1.useState(defaultValue);
+    let value = props[propName];
+    const controlled = isControlled(value);
+    const onChange = config && config.onChange ? config.onChange : props[`on${PropName}Change`] || emptyFn;
+    const setter = (value, ...args) => {
+        if (value instanceof Function) {
+            value = value(valueRef.current);
+        }
+        if (!controlled) {
+            setStateProperty(value);
+        }
+        onChange(value, ...args);
+    };
+    if (!controlled) {
+        value = stateValue;
+    }
+    const valueRef = react_1.useRef(value);
+    valueRef.current = value;
+    return [value, setter];
+};
+exports.default = useProperty;

package/src/components/utils/useRerender.d.ts

@@ -0,0 +1 @@
+export declare const useRerender: () => () => void;

package/src/components/utils/useRerender.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useRerender = void 0;
+const react_1 = require("react");
+exports.useRerender = () => {
+    const [_count, setCount] = react_1.useState(0);
+    return react_1.useCallback(() => {
+        setCount((count) => count + 1);
+    }, []);
+};

package/src/components/utils/useSelectionRange.d.ts

@@ -0,0 +1,5 @@
+export declare function useSelectionRange<T extends HTMLInputElement | HTMLTextAreaElement>(): {
+    ref: (node: T) => void;
+    selectionStart: number;
+    selectionEnd: number;
+};

package/src/components/utils/useSelectionRange.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSelectionRange = void 0;
+const react_1 = require("react");
+function useSelectionRange() {
+    const [range, setRange] = react_1.useState([null, null]);
+    const onSelectionChange = () => {
+        const isActive = ref.current === document.activeElement;
+        const start = isActive ? ref.current.selectionStart : null;
+        const end = isActive ? ref.current.selectionEnd : null;
+        setRange([start, end]);
+    };
+    const ref = react_1.useRef();
+    const refCallback = react_1.useCallback((newNode) => {
+        const oldNode = ref.current;
+        if (oldNode)
+            document.removeEventListener('selectionchange', onSelectionChange);
+        if (newNode)
+            document.addEventListener('selectionchange', onSelectionChange);
+        ref.current = newNode;
+    }, []);
+    return { ref: refCallback, selectionStart: range[0], selectionEnd: range[1] };
+}
+exports.useSelectionRange = useSelectionRange;

package/src/components/utils/useTheme.d.ts

@@ -0,0 +1,32 @@
+declare const _default: () => {
+    breakpoints: string[];
+    fontSizes: string[];
+    colors: {
+        accent: string;
+        blue: string;
+        warn: string;
+        info: string;
+        error: string;
+        errorlight: string;
+        defaultbackground: string;
+        primary: string;
+        primarydark: string;
+        primarylight: string;
+        'text-on-primary': string;
+        secondary: string;
+        secondarydark: string;
+        secondarylight: string;
+        'text-on-secondary': string;
+        'text-on-secondarylight': string;
+    };
+    space: string[];
+    fonts: {
+        sans: string;
+        mono: string;
+    };
+    fontWeights: {
+        normal: string;
+        bold: string;
+    };
+};
+export default _default;

package/src/components/utils/useTheme.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const theme_1 = tslib_1.__importDefault(require("../../theme"));
+exports.default = () => theme_1.default;

package/src/components/utils/uuid.d.ts

@@ -0,0 +1,2 @@
+export declare type TypeUuid = string;
+export declare const createUuid: () => TypeUuid;

package/src/components/utils/uuid.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createUuid = void 0;
+const uuid_1 = require("uuid");
+exports.createUuid = () => uuid_1.v4();

package/src/env.d.ts

@@ -0,0 +1,4 @@
+declare const _default: {
+    [key: string]: string;
+};
+export default _default;

package/src/env.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = {
+    IPUSHPULL_API_KEY: "CbBaMaoqHVifScrYwKssGnGyNkv5xHOhQVGm3cYP",
+    IPUSHPULL_API_SECRET: "xYzE51kuHyyt9kQCvMe0tz0H2sDSjyEQcF5SOBlPQmcL9em0NqcCzyqLYj5fhpuZxQ8BiVcYl6zoOHeI6GYZj1TkUiiLVFoW3HUxiCdEUjlPS8Vl2YHUMEPD5qkLYnGj",
+    INFINITE_TABLE_LICENSE_KEY: "StartDate=2021-06-29|EndDate=2030-01-01|Owner=Adaptable|Type=distribution|TS=1624971462479|C=137829811,1004007071,2756196225,1839832928,3994409405,636616862",
+};

package/src/metamodel/adaptable-metamodel-model.d.ts

@@ -0,0 +1,19 @@
+export declare type AdaptableMetamodel = Record<string, MetamodelItem>;
+export interface MetamodelItem {
+    name: string;
+    kind: 'TypeAlias' | 'Interface' | 'Class';
+    description: string;
+    properties?: MetamodelItemProperty[];
+}
+export interface MetamodelItemProperty {
+    name: string;
+    kind: MetamodelItemPropertyKind;
+    description: string;
+    uiLabel: string;
+    reference?: string;
+    isOptional?: boolean;
+    defaultValue?: unknown;
+    gridInfo?: 'item' | 'container';
+    noCode?: 'item' | 'container';
+}
+export declare type MetamodelItemPropertyKind = 'REFERENCE' | 'number' | 'string' | 'boolean' | 'date' | 'function' | 'indexType' | 'unknown';

package/src/metamodel/adaptable-metamodel-model.js

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