@adaptabletools/adaptable 14.0.0-canary.0 → 14.0.0-canary.1

package/src/components/Input/index.d.ts

@@ -8,5 +8,5 @@ export declare type InputProps = HTMLProps<HTMLInputElement> & {
     disabled?: boolean;
     list?: any;
 } & BoxProps;
-declare const Input: React.ForwardRefExoticComponent<Pick<InputProps, "max" | "required" | "type" | "data" | "default" | "high" | "low" | "key" | "id" | "media" | "height" | "width" | "start" | "open" | "name" | "alignSelf" | "backgroundColor" | "color" | "content" | "flex" | "fontSize" | "margin" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "opacity" | "order" | "padding" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "translate" | "value" | "hidden" | "cite" | "dir" | "form" | "label" | "p" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "acceptCharset" | "action" | "method" | "noValidate" | "target" | "accessKey" | "draggable" | "lang" | "className" | "prefix" | "children" | "contentEditable" | "inputMode" | "nonce" | "tabIndex" | "async" | "disabled" | "multiple" | "size" | "manifest" | "m" | "wrap" | "accept" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "dateTime" | "defer" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "list" | "loop" | "marginHeight" | "marginWidth" | "maxLength" | "mediaGroup" | "min" | "minLength" | "muted" | "optimum" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "contextMenu" | "placeholder" | "spellCheck" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "is" | "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" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "step" | "useMap" | "wmode" | "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" | "onClick" | "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" | "mt" | "mb" | "ml" | "mr" | "my" | "marginY" | "mx" | "marginX" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "bg" | "css" | "placehoder"> & React.RefAttributes<HTMLInputElement>>;
+declare const Input: React.ForwardRefExoticComponent<Pick<InputProps, "max" | "required" | "type" | "data" | "default" | "high" | "low" | "key" | "id" | "media" | "height" | "width" | "start" | "open" | "name" | "alignContent" | "alignItems" | "alignSelf" | "backgroundColor" | "color" | "content" | "display" | "flex" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "justifyContent" | "justifyItems" | "justifySelf" | "letterSpacing" | "lineHeight" | "margin" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "opacity" | "order" | "overflow" | "overflowX" | "overflowY" | "padding" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "textAlign" | "translate" | "verticalAlign" | "value" | "hidden" | "cite" | "dir" | "form" | "label" | "p" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "acceptCharset" | "action" | "method" | "noValidate" | "target" | "accessKey" | "draggable" | "lang" | "className" | "prefix" | "children" | "contentEditable" | "inputMode" | "nonce" | "tabIndex" | "async" | "disabled" | "multiple" | "size" | "manifest" | "m" | "wrap" | "accept" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "dateTime" | "defer" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "list" | "loop" | "marginHeight" | "marginWidth" | "maxLength" | "mediaGroup" | "min" | "minLength" | "muted" | "optimum" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "contextMenu" | "placeholder" | "spellCheck" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "is" | "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" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "step" | "useMap" | "wmode" | "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" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "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" | "bg" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "css" | "variant" | "tx" | "sx" | "placehoder"> & React.RefAttributes<HTMLInputElement>>;
 export default Input;

package/src/components/List/ListGroupItem/index.d.ts

@@ -1,10 +1,12 @@
 import * as React from 'react';
 import { ReactComponentLike } from 'prop-types';
-declare const ListGroupItem: React.ForwardRefExoticComponent<Pick<React.HTMLProps<HTMLElement> & {
+import { HTMLProps } from 'react';
+declare type TypeProps = HTMLProps<HTMLElement> & {
     factory?: string | ReactComponentLike;
     active?: boolean;
     noZebra?: boolean;
     index?: number;
     selectionId?: string | number;
-}, "index" | "max" | "required" | "type" | "data" | "default" | "high" | "low" | "key" | "id" | "media" | "height" | "width" | "active" | "start" | "open" | "name" | "color" | "content" | "translate" | "value" | "hidden" | "cite" | "dir" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "acceptCharset" | "action" | "method" | "noValidate" | "target" | "accessKey" | "draggable" | "lang" | "className" | "prefix" | "children" | "contentEditable" | "inputMode" | "nonce" | "tabIndex" | "async" | "disabled" | "multiple" | "size" | "manifest" | "wrap" | "accept" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "dateTime" | "defer" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "list" | "loop" | "marginHeight" | "marginWidth" | "maxLength" | "mediaGroup" | "min" | "minLength" | "muted" | "optimum" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "contextMenu" | "placeholder" | "spellCheck" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "is" | "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" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "step" | "useMap" | "wmode" | "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" | "onClick" | "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" | "factory" | "noZebra" | "selectionId"> & React.RefAttributes<unknown>>;
+};
+declare const ListGroupItem: React.ForwardRefExoticComponent<Pick<TypeProps, "index" | "max" | "required" | "type" | "data" | "default" | "high" | "low" | "key" | "id" | "media" | "height" | "width" | "active" | "start" | "open" | "name" | "color" | "content" | "translate" | "value" | "hidden" | "cite" | "dir" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "acceptCharset" | "action" | "method" | "noValidate" | "target" | "accessKey" | "draggable" | "lang" | "className" | "prefix" | "children" | "contentEditable" | "inputMode" | "nonce" | "tabIndex" | "async" | "disabled" | "multiple" | "size" | "manifest" | "wrap" | "accept" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "dateTime" | "defer" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "list" | "loop" | "marginHeight" | "marginWidth" | "maxLength" | "mediaGroup" | "min" | "minLength" | "muted" | "optimum" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "contextMenu" | "placeholder" | "spellCheck" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "is" | "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" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "step" | "useMap" | "wmode" | "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" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "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" | "factory" | "noZebra" | "selectionId"> & React.RefAttributes<unknown>>;
 export default ListGroupItem;

package/src/components/Loader/Loader.d.ts

@@ -2,6 +2,6 @@ import * as React from 'react';
 export declare const LoaderSpinner: React.FunctionComponent<{
     style?: React.CSSProperties;
 }>;
-export declare const Loader: React.FunctionComponent<{
+export declare const Loader: React.FunctionComponent<React.PropsWithChildren<{
     style?: React.CSSProperties;
-}>;
+}>>;

package/src/components/Logo/index.d.ts

@@ -2,5 +2,5 @@ import * as React from 'react';
 interface LogoProps {
     style?: React.CSSProperties;
 }
-export declare const Logo: React.FunctionComponent<LogoProps>;
+export declare const Logo: React.FunctionComponent<React.PropsWithChildren<LogoProps>>;
 export {};

package/src/components/Modal/index.d.ts

@@ -6,4 +6,4 @@ export interface ModalProps extends FlexProps {
     backdropZIndexOffset?: number;
     onBringToFront?: () => void;
 }
-export declare const Modal: React.FunctionComponent<ModalProps>;
+export declare const Modal: React.FunctionComponent<React.PropsWithChildren<ModalProps>>;

package/src/components/Modal/index.js

@@ -11,8 +11,6 @@ const rebass_1 = require("rebass");
 const Backdrop_1 = tslib_1.__importStar(require("./Backdrop"));
 const uuid_1 = require("../utils/uuid");
 const UIHelper_1 = require("../../View/UIHelper");
-// const uuidv4 = require('uuid/v4');
-// const createUuid = (): string => uuidv4();
 let portalElement;
 const ensurePortalElement = () => {
     if (!(0, UIHelper_1.isBrowserDocumentAvailable)()) {

package/src/components/OverlayTrigger/Overlay.d.ts

@@ -1,11 +1,8 @@
 import * as React from 'react';
 import { HTMLAttributes } from 'react';
-import { BoundingClientRect } from '../utils/getAvailableSizeInfo';
 export interface OverlayProps extends HTMLAttributes<HTMLElement> {
     visible: boolean;
-    anchor: 'vertical' | 'horizontal';
-    position: 'top' | 'bottom' | 'left' | 'right';
-    getConstrainRect: () => BoundingClientRect;
+    onTransitionEnd?: () => void;
 }
 export declare const useRefresh: () => () => void;
 declare const Overlay: React.ForwardRefExoticComponent<OverlayProps & React.RefAttributes<Element>>;

package/src/components/OverlayTrigger/Overlay.js

@@ -6,8 +6,6 @@ const React = tslib_1.__importStar(require("react"));
 const react_1 = require("react");
 const batchUpdate_1 = tslib_1.__importDefault(require("../utils/batchUpdate"));
 const usePrevious_1 = tslib_1.__importDefault(require("../utils/usePrevious"));
-const isEqual_1 = tslib_1.__importDefault(require("lodash/isEqual"));
-const utils_1 = require("./utils");
 const useRefresh = () => {
     const [x, update] = (0, react_1.useState)(0);
     return () => {
@@ -15,13 +13,8 @@ const useRefresh = () => {
     };
 };
 exports.useRefresh = useRefresh;
-const translateToValues = (x) => x
-    .split('(')[1]
-    .split(')')[0]
-    .split(',')
-    .map((s) => s.trim());
 const Overlay = React.forwardRef((props, ref) => {
-    const { visible, getConstrainRect, anchor, position } = props, domProps = tslib_1.__rest(props, ["visible", "getConstrainRect", "anchor", "position"]);
+    const { visible } = props, domProps = tslib_1.__rest(props, ["visible"]);
     const domRef = (0, react_1.useRef)(null);
     const setRef = (node) => {
         domRef.current = node;
@@ -40,44 +33,14 @@ const Overlay = React.forwardRef((props, ref) => {
             setOpacity(props.visible ? 1 : 0);
         }).commit();
     }, [visible]);
-    (0, react_1.useLayoutEffect)(() => {
-        if (!visible) {
-            return;
-        }
-        const constrainRect = getConstrainRect();
-        const domNode = domRef.current;
-        const thisRect = (0, utils_1.getRect)(domNode);
-        const intersection = (0, utils_1.getIntersection)(constrainRect, thisRect);
-        if (!(0, isEqual_1.default)(intersection, thisRect)) {
-            const transform = props.style
-                ? props.style.transform || 'translate3d(0px, 0px, 0px)'
-                : 'translate3d(0px, 0px, 0px)';
-            const horizontalDiff = Math.round(thisRect.left < constrainRect.left
-                ? constrainRect.left - thisRect.left
-                : thisRect.right > constrainRect.right
-                    ? constrainRect.right - thisRect.right
-                    : 0);
-            const verticalDiff = Math.round(thisRect.top < constrainRect.top
-                ? constrainRect.top - thisRect.top
-                : thisRect.bottom > constrainRect.bottom
-                    ? constrainRect.bottom - thisRect.bottom
-                    : 0);
-            const values = translateToValues(transform);
-            if (horizontalDiff) {
-                values[0] = `calc(${values[0]} + ${horizontalDiff}px)`;
-            }
-            if (verticalDiff) {
-                values[1] = `calc(${values[1]} + ${verticalDiff}px)`;
-            }
-            domNode.style.transform = `translate3d(${values.join(', ')})`;
-        }
-    }, [visible]);
     if (prevVisible && !visible) {
         transitionInProgressRef.current = true;
     }
     const onTransitionEnd = () => {
+        var _a;
         transitionInProgressRef.current = false;
         refresh();
+        (_a = props === null || props === void 0 ? void 0 : props.onTransitionEnd) === null || _a === void 0 ? void 0 : _a.call(props);
     };
     const renderTime = Date.now();
     const renderTimeRef = (0, react_1.useRef)(renderTime);

package/src/components/OverlayTrigger/index.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
 import { ReactNode, CSSProperties } from 'react';
-import { BoundingClientRect } from '../utils/getAvailableSizeInfo';
-import { OverlayHorizontalAlign } from './getOverlayStyle';
+import { OverlayShowParams } from '../InfiniteTable';
 export declare type ConstrainToType = ((node: HTMLElement) => HTMLElement) | string;
-export declare const getConstrainRect: (target: HTMLElement, constrainTo?: ConstrainToType) => BoundingClientRect;
+export declare const getConstrainElement: (target: HTMLElement, constrainTo?: ConstrainToType) => HTMLElement;
+export declare const getConstrainRect: (target: HTMLElement, constrainTo?: ConstrainToType) => import("../utils/getAvailableSizeInfo").BoundingClientRect;
 export interface OverlayTriggerProps extends React.HTMLAttributes<HTMLElement> {
     opacityTransitionDuration?: string | number;
     children: React.ReactNode;
@@ -20,7 +20,7 @@ export interface OverlayTriggerProps extends React.HTMLAttributes<HTMLElement> {
     targetOffset?: number;
     defaultZIndex?: number;
     anchor?: 'vertical' | 'horizontal';
-    alignHorizontal?: OverlayHorizontalAlign;
+    alignPosition?: OverlayShowParams['alignPosition'];
     constrainTo?: ConstrainToType;
 }
 declare const OverlayTrigger: React.ForwardRefExoticComponent<OverlayTriggerProps & React.RefAttributes<{

package/src/components/OverlayTrigger/index.js

@@ -1,16 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getConstrainRect = void 0;
+exports.getConstrainRect = exports.getConstrainElement = void 0;
 const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
 const react_1 = require("react");
 const batchUpdate_1 = tslib_1.__importDefault(require("../utils/batchUpdate"));
-const getAvailableSizeInfo_1 = tslib_1.__importDefault(require("../utils/getAvailableSizeInfo"));
-const react_dom_1 = require("react-dom");
 const selectParent_1 = tslib_1.__importDefault(require("../utils/selectParent"));
 const useProperty_1 = tslib_1.__importDefault(require("../utils/useProperty"));
 const Overlay_1 = tslib_1.__importDefault(require("./Overlay"));
-const getOverlayStyle_1 = tslib_1.__importDefault(require("./getOverlayStyle"));
 const join_1 = tslib_1.__importDefault(require("../utils/join"));
 const usePrevious_1 = tslib_1.__importDefault(require("../utils/usePrevious"));
 const utils_1 = require("./utils");
@@ -18,7 +15,9 @@ const LoggingHelper_1 = require("../../Utilities/Helpers/LoggingHelper");
 const useAgGridClassName_1 = tslib_1.__importDefault(require("./useAgGridClassName"));
 const contains_1 = tslib_1.__importDefault(require("../utils/contains"));
 const UIHelper_1 = require("../../View/UIHelper");
-const getConstrainRect = (target, constrainTo) => {
+const InfiniteTable_1 = require("../InfiniteTable");
+const AdaptableContext_1 = require("../../View/AdaptableContext");
+const getConstrainElement = (target, constrainTo) => {
     let el = null;
     if (typeof constrainTo === 'string') {
         el = (0, selectParent_1.default)(constrainTo, target);
@@ -26,6 +25,11 @@ const getConstrainRect = (target, constrainTo) => {
     if (typeof constrainTo === 'function') {
         el = constrainTo(target);
     }
+    return el;
+};
+exports.getConstrainElement = getConstrainElement;
+const getConstrainRect = (target, constrainTo) => {
+    let el = (0, exports.getConstrainElement)(target, constrainTo);
     if (el && el.tagName) {
         return (0, utils_1.getRect)(el);
     }
@@ -41,10 +45,29 @@ const ensurePortalElement = () => {
         return;
     }
     portalElement = document.createElement('div');
+    portalElement.style.position = 'absolute';
+    portalElement.style.zIndex = '999999';
+    portalElement.style.top = '0px';
+    portalElement.style.left = '0px';
     document.body.appendChild(portalElement);
 };
 const OverlayTrigger = React.forwardRef((props, ref) => {
-    let { visible: _, showTriangle, showEvent, hideEvent, render, targetOffset, preventPortalEventPropagation = false, defaultZIndex, anchor, hideDelay = 0, opacityTransitionDuration, onVisibleChange, alignHorizontal, constrainTo, target: targetProp } = props, domProps = tslib_1.__rest(props, ["visible", "showTriangle", "showEvent", "hideEvent", "render", "targetOffset", "preventPortalEventPropagation", "defaultZIndex", "anchor", "hideDelay", "opacityTransitionDuration", "onVisibleChange", "alignHorizontal", "constrainTo", "target"]);
+    const adaptable = (0, AdaptableContext_1.useAdaptable)();
+    let { visible: _, showTriangle, showEvent, hideEvent, render, targetOffset, preventPortalEventPropagation = false, defaultZIndex, anchor, hideDelay = 0, opacityTransitionDuration, onVisibleChange, alignPosition = [
+        // overlay - target
+        ['TopLeft', 'BottomLeft'],
+        ['TopRight', 'BottomRight'],
+        ['TopRight', 'BottomCenter'],
+        ['TopRight', 'BottomLeft'],
+        ['TopRight', 'BottomLeft'],
+        ['BottomLeft', 'TopLeft'],
+        ['BottomRight', 'TopRight'],
+        ['BottomRight', 'TopCenter'],
+        ['BottomRight', 'TopLeft'],
+    ], constrainTo, target: targetProp } = props, domProps = tslib_1.__rest(props, ["visible", "showTriangle", "showEvent", "hideEvent", "render", "targetOffset", "preventPortalEventPropagation", "defaultZIndex", "anchor", "hideDelay", "opacityTransitionDuration", "onVisibleChange", "alignPosition", "constrainTo", "target"]);
+    const { showOverlay, clearAll: clearAllOverlays, hideOverlay, portal, } = (0, InfiniteTable_1.useOverlay)({
+        portalContainer: portalElement,
+    });
     const domRef = (0, react_1.useRef)(null);
     const targetRef = (0, react_1.useRef)(null);
     const overlayRef = (0, react_1.useRef)(null);
@@ -64,8 +87,6 @@ const OverlayTrigger = React.forwardRef((props, ref) => {
         }
         doSetVisible(true);
     }, []);
-    const [targetRect, setTargetRect] = (0, react_1.useState)(null);
-    const [sizeInfo, setSizeInfo] = (0, react_1.useState)(null);
     const prevVisible = (0, usePrevious_1.default)(visible, false);
     ensurePortalElement();
     const onShow = React.useCallback((event) => {
@@ -78,14 +99,6 @@ const OverlayTrigger = React.forwardRef((props, ref) => {
         }
         (0, batchUpdate_1.default)(() => {
             setVisible(true);
-            const target = targetRef.current;
-            const targetRect = target.getBoundingClientRect();
-            const sizeInfo = (0, getAvailableSizeInfo_1.default)({
-                targetRect,
-                constrainRect: (0, exports.getConstrainRect)(target, constrainTo),
-            });
-            setTargetRect(targetRect);
-            setSizeInfo(sizeInfo);
         }).commit();
     }, [constrainTo, preventPortalEventPropagation]);
     const onHide = React.useCallback((_event) => {
@@ -133,41 +146,53 @@ const OverlayTrigger = React.forwardRef((props, ref) => {
             }
         };
     }, [props.visible, showEvent, hideEvent, onShow, onHide]);
-    let overlay;
+    React.useEffect(() => {
+        var _a, _b;
+        const target = targetRef.current;
+        if (!target) {
+            return;
+        }
+        if ((prevVisible && !visible) || visible) {
+            const overlayContent = (React.createElement(Overlay_1.default, Object.assign({}, domProps, { ref: (node) => {
+                    if (overlayRef.current && overlayRef.current != node) {
+                        overlayRef.current.removeEventListener(showEvent, onShow);
+                        overlayRef.current.removeEventListener(hideEvent, onHide);
+                    }
+                    overlayRef.current = node;
+                    if (node) {
+                        node.addEventListener(showEvent, onShow);
+                        node.addEventListener(hideEvent, onHide);
+                    }
+                }, className: (0, join_1.default)('ab-Overlay', showTriangle ? 'ab-Overlay--show-triangle' : '', agGridClassName, domProps.className), style: { transition: `opacity ${opacityTransitionDuration}` }, visible: visible, onTransitionEnd: () => {
+                    if (!visible) {
+                        clearAllOverlays();
+                        hideOverlay('overlay-trigger');
+                    }
+                } }), props.render()));
+            let preparedConstrinTo;
+            if (constrainTo) {
+                preparedConstrinTo = (0, exports.getConstrainElement)(targetRef.current, constrainTo);
+            }
+            else {
+                preparedConstrinTo = adaptable === null || adaptable === void 0 ? void 0 : adaptable.getAgGridContainerElement();
+            }
+            // show only if visible or if it was visible and now it is invisible
+            const alignToRect = (0, utils_1.getRect)(target, targetOffset !== null && targetOffset !== void 0 ? targetOffset : 0);
+            const showOverlayOptions = {
+                id: 'overlay-trigger',
+                alignPosition,
+                constrainTo: (_b = (_a = preparedConstrinTo === null || preparedConstrinTo === void 0 ? void 0 : preparedConstrinTo.getBoundingClientRect) === null || _a === void 0 ? void 0 : _a.call(preparedConstrinTo)) !== null && _b !== void 0 ? _b : true,
+                alignTo: alignToRect,
+            };
+            showOverlay(() => overlayContent, showOverlayOptions);
+        }
+        else {
+            clearAllOverlays();
+        }
+    }, [visible, props.render]);
     const agGridClassName = (0, useAgGridClassName_1.default)([visible]);
-    if (targetRect) {
-        const overlayTarget = targetRef.current;
-        alignHorizontal =
-            alignHorizontal ||
-                getComputedStyle(overlayTarget)
-                    .getPropertyValue('--ab-overlay-horizontal-align')
-                    .trim();
-        let overlayStyle = (0, getOverlayStyle_1.default)({
-            constrainRect: (0, exports.getConstrainRect)(overlayTarget, constrainTo),
-            targetRect,
-            targetOffset,
-            anchor,
-            alignHorizontal,
-        });
-        overlayStyle.transition = `opacity ${opacityTransitionDuration}`;
-        overlayStyle.overflow = `visible`;
-        overlayStyle.zIndex = defaultZIndex;
-        overlayStyle = Object.assign(Object.assign({}, overlayStyle), props.style);
-        const position = anchor === 'vertical' ? sizeInfo.verticalPosition : sizeInfo.horizontalPosition;
-        overlay = (0, react_dom_1.createPortal)(React.createElement(Overlay_1.default, Object.assign({}, domProps, { ref: (node) => {
-                if (overlayRef.current && overlayRef.current != node) {
-                    overlayRef.current.removeEventListener(showEvent, onShow);
-                    overlayRef.current.removeEventListener(hideEvent, onHide);
-                }
-                overlayRef.current = node;
-                if (node) {
-                    node.addEventListener(showEvent, onShow);
-                    node.addEventListener(hideEvent, onHide);
-                }
-            }, className: (0, join_1.default)('ab-Overlay', `ab-Overlay--position-${position}`, showTriangle ? 'ab-Overlay--show-triangle' : '', agGridClassName, domProps.className), visible: visible, style: overlayStyle, anchor: anchor, position: position, getConstrainRect: () => (0, exports.getConstrainRect)(targetRef.current) }), props.render()), portalElement);
-    }
     return (React.createElement(React.Fragment, null,
-        props.children,
+        React.Children.only(props.children),
         React.createElement("div", { "data-name": "OverlayTrigger", "data-visible": visible, ref: domRef, style: {
                 visibility: 'hidden',
                 flex: 'none',
@@ -176,7 +201,7 @@ const OverlayTrigger = React.forwardRef((props, ref) => {
                 pointerEvents: 'none',
                 display: 'inline-flex',
             } }),
-        overlay));
+        portal));
 });
 OverlayTrigger.defaultProps = {
     showEvent: 'mouseenter',

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

@@ -1,4 +1,4 @@
 import { BoundingClientRect } from '../utils/getAvailableSizeInfo';
-export declare const getRect: (node: HTMLElement) => BoundingClientRect;
+export declare const getRect: (node: HTMLElement, offset?: number) => BoundingClientRect;
 export declare const getDocRect: () => BoundingClientRect;
 export declare const getIntersection: (rect1: BoundingClientRect, rect2: BoundingClientRect) => BoundingClientRect;

package/src/components/OverlayTrigger/utils.js

@@ -1,15 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getIntersection = exports.getDocRect = exports.getRect = void 0;
-const getRect = (node) => {
+const getRect = (node, offset = 0) => {
     const rect = node.getBoundingClientRect();
     return {
-        top: rect.top,
+        top: rect.top - offset,
         left: rect.left,
-        bottom: rect.bottom,
+        bottom: rect.bottom + offset,
         right: rect.right,
         width: rect.width,
-        height: rect.height,
+        height: rect.height + offset,
     };
 };
 exports.getRect = getRect;

package/src/components/PopupWithFooter.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { DialogProps } from './Dialog';
+import { DialogProps, DialogRefType } from './Dialog';
 /**
  * This is the main popup that we use - so all function popups will appear here.
  */
@@ -11,4 +11,4 @@ export interface IPopupWithFooterProps extends DialogProps {
     footer: React.ReactNode;
     children: React.ReactNode;
 }
-export declare const PopupWithFooter: React.ForwardRefExoticComponent<Pick<IPopupWithFooterProps, "fixed" | "max" | "required" | "type" | "data" | "default" | "high" | "low" | "key" | "id" | "media" | "height" | "width" | "start" | "open" | "name" | "alignSelf" | "backgroundColor" | "color" | "content" | "flex" | "fontSize" | "margin" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxWidth" | "opacity" | "order" | "padding" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "translate" | "value" | "hidden" | "cite" | "dir" | "footer" | "form" | "label" | "p" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "acceptCharset" | "action" | "method" | "noValidate" | "target" | "accessKey" | "draggable" | "lang" | "className" | "prefix" | "children" | "contentEditable" | "inputMode" | "nonce" | "tabIndex" | "async" | "disabled" | "multiple" | "size" | "manifest" | "m" | "wrap" | "accept" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "dateTime" | "defer" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "list" | "loop" | "marginHeight" | "marginWidth" | "maxLength" | "mediaGroup" | "min" | "minLength" | "muted" | "optimum" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "contextMenu" | "placeholder" | "spellCheck" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "is" | "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" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "step" | "useMap" | "wmode" | "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" | "onClick" | "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" | "modal" | "mt" | "mb" | "ml" | "mr" | "my" | "marginY" | "mx" | "marginX" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "bg" | "css" | "showCloseButton" | "isOpen" | "focusOnBrowserVisible" | "windowModal" | "windowModalProps" | "modalProps" | "defaultIsOpen" | "onDismiss" | "dismissOnClickOutside" | "onHide" | "showModal"> & React.RefAttributes<HTMLElement>>;
+export declare const PopupWithFooter: React.ForwardRefExoticComponent<IPopupWithFooterProps & React.RefAttributes<DialogRefType>>;

package/src/components/ProgressIndicator/ProgressIndicator.d.ts

@@ -1,2 +1,2 @@
 import * as React from 'react';
-export declare const ProgressIndicator: React.FunctionComponent;
+export declare const ProgressIndicator: React.FunctionComponent<unknown>;

package/src/components/SelectList.d.ts

@@ -7,4 +7,4 @@ export interface SelectListProps {
     options: SelectListOption[];
     onChange: (option: SelectListOption) => void;
 }
-export declare const SelectList: React.FunctionComponent<SelectListProps>;
+export declare const SelectList: React.FunctionComponent<React.PropsWithChildren<SelectListProps>>;

package/src/components/SimpleButton/index.d.ts

@@ -2,10 +2,9 @@ import * as React from 'react';
 import { ButtonProps } from 'rebass';
 import { ReactNode } from 'react';
 import { AccessLevel } from '../../PredefinedConfig/Common/Entitlement';
-import { OverlayProps } from '../OverlayTrigger/Overlay';
 import { AdaptableIcon } from '../../PredefinedConfig/Common/AdaptableIcon';
 export declare const baseClassName = "ab-SimpleButton";
-export interface SimpleButtonProps extends ButtonProps {
+export interface SimpleButtonProps extends Omit<ButtonProps, 'ref'> {
     tooltip?: string;
     variant?: 'text' | 'outlined' | 'raised';
     tone?: 'success' | 'error' | 'neutral' | 'none' | 'warning' | 'info' | 'accent';
@@ -14,10 +13,8 @@ export interface SimpleButtonProps extends ButtonProps {
     iconPosition?: 'start' | 'end';
     disabled?: boolean;
     accessLevel?: AccessLevel;
-    children?: ReactNode | ReactNode[];
-    tooltipAnchor?: OverlayProps['anchor'];
 }
-declare const SimpleButton: React.FunctionComponent<SimpleButtonProps> & {
-    ref?: React.Ref<HTMLButtonElement>;
-};
+declare const SimpleButton: React.ForwardRefExoticComponent<SimpleButtonProps & {
+    children?: React.ReactNode;
+} & React.RefAttributes<HTMLButtonElement>>;
 export default SimpleButton;

package/src/components/SimpleButton/index.js

@@ -10,9 +10,9 @@ const Tooltip_1 = tslib_1.__importDefault(require("../Tooltip"));
 const theme_1 = tslib_1.__importDefault(require("../../theme"));
 const AdaptableIconComponent_1 = require("../AdaptableIconComponent");
 exports.baseClassName = 'ab-SimpleButton';
-const SimpleButton = React.forwardRef((props, ref) => {
+const SimpleButton = React.forwardRef((props, theRef) => {
     var _a, _b;
-    let { children, disabled, variant = 'outlined', tone = 'neutral', iconPosition = 'start', iconSize, className, icon, tooltip, tooltipAnchor, accessLevel: accessLevel, type } = props, buttonProps = tslib_1.__rest(props, ["children", "disabled", "variant", "tone", "iconPosition", "iconSize", "className", "icon", "tooltip", "tooltipAnchor", "accessLevel", "type"]);
+    let { children, disabled, variant = 'outlined', tone = 'neutral', iconPosition = 'start', iconSize, className, icon, tooltip, accessLevel: accessLevel, type } = props, buttonProps = tslib_1.__rest(props, ["children", "disabled", "variant", "tone", "iconPosition", "iconSize", "className", "icon", "tooltip", "accessLevel", "type"]);
     let adaptableInternalIcon;
     if ((0, AdaptableIconComponent_1.isAdaptableInternalIcon)(icon)) {
         adaptableInternalIcon = icon;
@@ -76,14 +76,15 @@ const SimpleButton = React.forwardRef((props, ref) => {
     const fontWeight = buttonProps.fontWeight
         ? (_b = (_a = theme_1.default[buttonProps.fontWeight]) !== null && _a !== void 0 ? _a : buttonProps.fontWeight) !== null && _b !== void 0 ? _b : 'normal'
         : 'normal';
-    const btn = (React.createElement(rebass_1.Button, Object.assign({}, buttonProps, { disabled: disabled, className: (0, join_1.default)(className, exports.baseClassName, disabled ? `${exports.baseClassName}--disabled` : '', fontWeight ? `${exports.baseClassName}--font-weight=${fontWeight}` : '', `${exports.baseClassName}--variant-${variant}`, `${exports.baseClassName}--tone-${tone}`), ref: ref }), children));
-    return tooltip ? (React.createElement(Tooltip_1.default, { anchor: tooltipAnchor, label: tooltip }, btn)) : (btn);
+    const btn = (React.createElement(rebass_1.Button, Object.assign({}, buttonProps, { disabled: disabled, className: (0, join_1.default)(className, exports.baseClassName, disabled ? `${exports.baseClassName}--disabled` : '', fontWeight ? `${exports.baseClassName}--font-weight=${fontWeight}` : '', `${exports.baseClassName}--variant-${variant}`, `${exports.baseClassName}--tone-${tone}`), ref: theRef }), children));
+    return tooltip ? React.createElement(Tooltip_1.default, { label: tooltip }, btn) : btn;
 });
 SimpleButton.defaultProps = {
     px: null,
     py: null,
     fontWeight: 'normal',
     m: null,
+    //@ts-ignore
     borderRadius: null,
 };
 exports.default = SimpleButton;

package/src/components/SizedContainer/index.d.ts

@@ -1,6 +1,6 @@
 import { BoxProps } from 'rebass';
 import { ReactNode } from 'react';
-interface SizedContainerProps extends Omit<BoxProps, 'children'> {
+interface SizedContainerProps extends Omit<BoxProps, 'children' | 'onResize'> {
     children: (size: {
         width: number;
         height: number;

package/src/components/StylePreview.d.ts

@@ -4,5 +4,5 @@ import { AdaptableStyle } from '../types';
 interface StylePreviewProps extends BoxProps {
     styleObject: AdaptableStyle;
 }
-export declare const StylePreview: React.FunctionComponent<StylePreviewProps>;
+export declare const StylePreview: React.FunctionComponent<React.PropsWithChildren<StylePreviewProps>>;
 export {};

package/src/components/StylePreview.js

@@ -5,8 +5,9 @@ const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
 const rebass_1 = require("rebass");
 const StyleHelper_1 = require("../Utilities/Helpers/StyleHelper");
+const join_1 = tslib_1.__importDefault(require("./utils/join"));
 const StylePreview = (props) => {
     var _a, _b, _c;
-    return (React.createElement(rebass_1.Box, Object.assign({}, props, { padding: (_a = props.padding) !== null && _a !== void 0 ? _a : 2, mt: (_b = props.mt) !== null && _b !== void 0 ? _b : 2, style: Object.assign(Object.assign({}, (0, StyleHelper_1.toStyle)(props.styleObject)), props.style) }), (_c = props.children) !== null && _c !== void 0 ? _c : 'Preview result'));
+    return (React.createElement(rebass_1.Box, Object.assign({}, props, { className: (0, join_1.default)('ab-StylePreview', props.className), padding: (_a = props.padding) !== null && _a !== void 0 ? _a : 2, mt: (_b = props.mt) !== null && _b !== void 0 ? _b : 2, style: Object.assign(Object.assign({}, (0, StyleHelper_1.toStyle)(props.styleObject)), props.style) }), (_c = props.children) !== null && _c !== void 0 ? _c : 'Preview result'));
 };
 exports.StylePreview = StylePreview;

package/src/components/Tag/Tag.d.ts

@@ -1,3 +1,3 @@
 import * as React from 'react';
 import { FlexProps } from 'rebass';
-export declare const Tag: React.FunctionComponent<FlexProps>;
+export declare const Tag: React.FunctionComponent<React.PropsWithChildren<FlexProps>>;