@sprinklrjs/spaceweb 12.33.2 → 14.11.3

package/esm/baseui/helpers/overrides.js

@@ -1,4 +1,4 @@
-import { __assign, __read, __spreadArray } from "tslib";
+import { __assign } from "tslib";
 import { jsx as _jsx } from "react/jsx-runtime";
 /*
 Copyright (c) Uber Technologies, Inc.
@@ -8,13 +8,12 @@ LICENSE file in the root directory of this source tree.
 */
 import * as React from 'react';
 import { isValidElementType } from 'react-is';
-import deepMerge from '../utils/deep-merge';
-import * as process from "process";
+import * as process from 'process';
 var __DEV__ = process.env.NODE_ENV !== 'production';
 /**
  * Given an override argument, returns the component implementation override if it exists
  */
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
+// eslint-disable-next-line @typescript-eslint/no-explicit-any -- baseui migration
 export function getOverride(_override) {
     if (isValidElementType(_override)) {
         return _override;
@@ -23,7 +22,7 @@ export function getOverride(_override) {
     if (_override && typeof _override === 'object') {
         // Remove this 'any' once this flow issue is fixed:
         // https://github.com/facebook/flow/issues/6666
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any -- baseui migration
         return _override.component;
     }
     // null/undefined
@@ -33,49 +32,35 @@ export function getOverride(_override) {
  * Given an override argument, returns the override props that should be passed
  * to the component when rendering it.
  */
-export function getOverrideProps(_override) {
+function getOverrideProps(_override, defaultComponent) {
+    var defaultProps = { $DefaultComponent: defaultComponent };
     if (_override && typeof _override === 'object') {
         if (typeof _override.props === 'object') {
-            //@ts-expect-error
-            return __assign(__assign({}, _override.props), { $style: _override.style });
+            // @ts-expect-error
+            return __assign(__assign(__assign({}, defaultProps), _override.props), { $className: _override.className, $style: _override.style });
         }
         else {
-            //@ts-expect-error
-            return {
-                $style: _override.style,
-            };
+            // @ts-expect-error
+            return __assign(__assign({}, defaultProps), { $className: _override.className, $style: _override.style });
         }
     }
-    //@ts-expect-error
-    return {};
+    // @ts-expect-error
+    return defaultProps;
 }
 /**
  * Coerces an override argument into an override object
  * (sometimes it is just an override component)
  */
-export function toObjectOverride(_override) {
-    if (isValidElementType(_override)) {
-        return {
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            component: _override,
-        };
-    }
-    // Flow can't figure out that typeof 'function' above will
-    // catch React.StatelessFunctionalComponent
-    // (probably related to https://github.com/facebook/flow/issues/6666)
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    return _override || {};
-}
 /**
  * Get a convenient override array that will always have [component, props]
  */
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
+// eslint-disable-next-line @typescript-eslint/no-explicit-any -- baseui migration
 export function getOverrides(
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
+// eslint-disable-next-line @typescript-eslint/no-explicit-any -- baseui migration
 _override, 
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
+// eslint-disable-next-line @typescript-eslint/no-explicit-any -- baseui migration
 defaultComponent
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
+// eslint-disable-next-line @typescript-eslint/no-explicit-any -- baseui migration
 ) {
     var Component = getOverride(_override) || defaultComponent;
     if (_override && typeof _override === 'object' && typeof _override.props === 'function') {
@@ -86,75 +71,13 @@ defaultComponent
         }
         var DynamicOverride = React.forwardRef(function (props, ref) {
             var mappedProps = _override.props(props);
-            var nextProps = getOverrideProps(__assign(__assign({}, _override), { props: mappedProps }));
-            return _jsx(Component, __assign({ ref: ref }, nextProps), void 0);
+            var nextProps = getOverrideProps(__assign(__assign({}, _override), { props: mappedProps }), defaultComponent);
+            return _jsx(Component, __assign({ ref: ref }, nextProps));
         });
         DynamicOverride.displayName = Component.displayName;
-        // @ts-expect-error
+        DynamicOverride.__standard = Component.__standard;
         return [DynamicOverride, {}];
     }
-    var props = getOverrideProps(_override);
+    var props = getOverrideProps(_override, defaultComponent);
     return [Component, props];
 }
-/**
- * Merges two overrides objects – this is useful if you want to inject your own
- * overrides into a child component, but also accept further overrides from
- * from upstream. See `mergeOverride` below.
- */
-export function mergeConfigurationOverrides(target, source) {
-    // Simple case of both objects
-    if (typeof target === 'object' && typeof source === 'object') {
-        return deepMerge({}, target, source);
-    }
-    // At least one is a function, return a new composite function
-    return function () {
-        var args = [];
-        for (var _i = 0; _i < arguments.length; _i++) {
-            args[_i] = arguments[_i];
-        }
-        return deepMerge({}, typeof target === 'function' ? target.apply(void 0, __spreadArray([], __read(args), false)) : target, typeof source === 'function' ? source.apply(void 0, __spreadArray([], __read(args), false)) : source);
-    };
-}
-export function mergeOverride(target, source) {
-    // Shallow merge should handle `component`
-    var merged = __assign(__assign({}, target), source);
-    if (target.props && source.props) {
-        merged.props = mergeConfigurationOverrides(target.props, source.props);
-    }
-    if (target.style && source.style) {
-        merged.style = mergeConfigurationOverrides(target.style, source.style);
-    }
-    return merged;
-}
-export function mergeOverrides(target, source) {
-    if (target === void 0) { target = {}; }
-    if (source === void 0) { source = {}; }
-    var merged = Object.assign({}, target, source);
-    var allIdentifiers = Object.keys(merged);
-    // const allIdentifiers = Object.keys({...target, ...source});
-    return allIdentifiers.reduce(function (acc, name) {
-        // @ts-ignore
-        acc[name] = mergeOverride(toObjectOverride(target[name]), toObjectOverride(source[name]));
-        return acc;
-    }, {});
-}
-/**
- * Merges two override objects using the following behavior:
- * - Component implementation from the source (parent) replaces target
- * - Props and styles are both deep merged
- */
-/**
- * Since style or props overrides can be an object *or* a function, we need to handle
- * the case that one of them is a function. We do this by returning a new
- * function that deep merges the result of each style override
- */
-// Lil' hook for memoized unpacking of overrides
-export function useOverrides(defaults, overrides) {
-    if (overrides === void 0) { overrides = {}; }
-    return React.useMemo(function () {
-        return Object.keys(defaults).reduce(function (obj, key) {
-            obj[key] = getOverrides(overrides[key], defaults[key]);
-            return obj;
-        }, {});
-    }, [overrides]);
-}

package/esm/baseui/helpers/types.d.ts

@@ -1,7 +1,7 @@
-export declare type PageMargins = {
+export type PageMargins = {
     paddingInlineStart: string;
     paddingInlineEnd: string;
 };
-export declare type MediaQueryPageMargins = {
+export type MediaQueryPageMargins = {
     [key: string]: PageMargins;
 };

package/esm/baseui/input/index.d.ts

@@ -1,8 +1,2 @@
-export { default as StatefulInput } from './stateful-input';
-export { default as StatefulContainer } from './stateful-container';
-export { default as Input } from './input';
-export { default as BaseInput } from './base-input';
-export { default as MaskedInput } from './masked-input';
-export { Root as StyledRoot, InputEnhancer as StyledInputEnhancer, InputEnhancer as StyledStartEnhancer, InputEnhancer as StyledEndEnhancer, InputContainer as StyledInputContainer, Input as StyledInput, } from './styled-components';
 export { STATE_CHANGE_TYPE, ADJOINED, SIZE, CUSTOM_INPUT_TYPE } from './constants';
 export * from './types';

package/esm/baseui/input/index.js

@@ -1,9 +1,2 @@
-export { default as StatefulInput } from './stateful-input';
-export { default as StatefulContainer } from './stateful-container';
-export { default as Input } from './input';
-export { default as BaseInput } from './base-input';
-export { default as MaskedInput } from './masked-input';
-// Styled elements
-export { Root as StyledRoot, InputEnhancer as StyledInputEnhancer, InputEnhancer as StyledStartEnhancer, InputEnhancer as StyledEndEnhancer, InputContainer as StyledInputContainer, Input as StyledInput, } from './styled-components';
 export { STATE_CHANGE_TYPE, ADJOINED, SIZE, CUSTOM_INPUT_TYPE } from './constants';
 export * from './types';

package/esm/baseui/input/types.d.ts

@@ -1,25 +1,15 @@
 import type * as React from 'react';
 import type { Properties } from 'csstype';
-import type { Override } from '../helpers/overrides';
+import type { Override } from '../../overrides';
 import type { STATE_CHANGE_TYPE, ADJOINED, SIZE, ENHANCER_POSITION } from './constants';
-export declare type Adjoined = keyof typeof ADJOINED;
-export declare type Size = keyof typeof SIZE;
-export declare type StateType = keyof typeof STATE_CHANGE_TYPE;
-export declare type InternalState = {
-    /** Renders UI in 'focus' state */
-    isFocused?: boolean;
-    /** Renders input in 'masked' state if type equals "password" */
-    isMasked?: boolean;
-    /** Tracks if focus should be visible on the clear button. */
-    isFocusVisibleForClear?: boolean;
-    /** Tracks if focus should be visible on the mask toggle button. */
-    isFocusVisibleForMaskToggle?: boolean;
-};
-export declare type State = {
+export type Adjoined = keyof typeof ADJOINED;
+export type Size = keyof typeof SIZE;
+export type StateType = keyof typeof STATE_CHANGE_TYPE;
+export type State = {
     value?: string | number;
 };
-export declare type StateReducer = (stateType: StateType, nextState: State, currentState: State) => State;
-export declare type SharedProps = {
+export type StateReducer = (stateType: StateType, nextState: State, currentState: State) => State;
+export type SharedProps = {
     /** Renders UI in 'focus' state */
     $isFocused?: boolean;
     /** Renders UI in 'readOnly' state */
@@ -41,23 +31,23 @@ export declare type SharedProps = {
     /** Defines if has a clearable or MaskToggleButton at the end */
     $hasIconTrailing?: boolean;
 };
-export declare type BaseInputOverrides = {
-    InputContainer?: Override;
-    Input?: Override;
-    Before?: Override;
-    After?: Override;
-    ClearIcon?: Override;
-    ClearIconContainer?: Override;
-    MaskToggleButton?: Override;
-    MaskToggleShowIcon?: Override;
-    MaskToggleHideIcon?: Override;
+export type BaseInputOverrides = {
+    InputContainer?: Override<Record<string, any>>;
+    Input?: Override<Record<string, any>>;
+    Before?: Override<Record<string, any>>;
+    After?: Override<Record<string, any>>;
+    ClearIcon?: Override<Record<string, any>>;
+    ClearIconContainer?: Override<Record<string, any>>;
+    MaskToggleButton?: Override<Record<string, any>>;
+    MaskToggleShowIcon?: Override<Record<string, any>>;
+    MaskToggleHideIcon?: Override<Record<string, any>>;
 };
-export declare type InputOverrides = {
-    Root?: Override;
-    StartEnhancer?: Override;
-    EndEnhancer?: Override;
+export type InputOverrides = {
+    Root?: Override<Record<string, any>>;
+    StartEnhancer?: Override<Record<string, any>>;
+    EndEnhancer?: Override<Record<string, any>>;
 } & BaseInputOverrides;
-export declare type BaseInputProps<T> = {
+export type BaseInputProps<T> = {
     'aria-activedescendant'?: string;
     'aria-autocomplete'?: string;
     'aria-controls'?: string;
@@ -124,11 +114,15 @@ export declare type BaseInputProps<T> = {
     /** max value when used as input type=number */
     max?: number;
     /** step value when used as input type=number */
-    step?: number | 'any';
+    step?: number;
     /** Renders component in 'readOnly' state. */
     readOnly?: boolean;
+    /** show maxCharacters allowed for the textarea */
+    maxCharLimit?: number;
+    draggable?: boolean;
+    animate?: boolean;
 };
-export declare type InputProps = {
+export type InputProps = {
     overrides?: InputOverrides;
     /** An input helper rendered before and attached to the input field. */
     startEnhancer?: React.ReactNode | ((props: SharedProps) => React.ReactNode);
@@ -139,18 +133,12 @@ export declare type InputProps = {
     /** Handler for the `blur` event. */
     onBlur?: (e: React.FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
 } & BaseInputProps<HTMLInputElement | HTMLTextAreaElement>;
-export declare type MaskedInputProps = Partial<{
-    /** See mask examples here: https://github.com/sanniassin/react-input-mask */
-    mask?: string;
-    /** Character to render for unfilled mask element. */
-    maskChar?: string;
-} & InputProps>;
-export declare type StatefulContainerChildrenProps<T> = {
+export type StatefulContainerChildrenProps<T> = {
     onChange: (e: React.ChangeEvent<T>) => void;
     /** If true, adds a clear value icon button to the end of the input container. */
     clearable?: boolean;
 } & StatefulInputProps;
-export declare type StatefulContainerProps<T> = {
+export type StatefulContainerProps<T> = {
     children: (props: StatefulContainerChildrenProps<T>) => React.ReactNode;
     /** Initial state of an uncontrolled input component. */
     initialState?: State;
@@ -162,9 +150,9 @@ export declare type StatefulContainerProps<T> = {
 } & {
     overrides?: InputOverrides;
 } & Omit<InputProps, 'overrides' | 'children'>;
-declare type FullStProps = InputProps & StatefulContainerProps<HTMLInputElement | HTMLTextAreaElement>;
-export declare type StInputPropsDiff = Omit<FullStProps, 'overrides' | 'children'>;
-export declare type StatefulInputProps = {
+type FullStProps = InputProps & StatefulContainerProps<HTMLInputElement | HTMLTextAreaElement>;
+export type StInputPropsDiff = Omit<FullStProps, 'overrides' | 'children'>;
+export type StatefulInputProps = {
     overrides?: InputOverrides;
 } & StInputPropsDiff;
 export {};

package/esm/baseui/layer/layer.js

@@ -12,12 +12,7 @@ import ReactDOM from 'react-dom';
 import { styled } from '../../style';
 import { LayersContext, Consumer, isServer } from './layers-manager';
 // import { isServer } from '../../spacewebProvider';
-var Container = styled('div', 'absolute top-0 left-0 right-0', function (_, _a) {
-    var $zIndex = _a.$zIndex;
-    return ({
-        zIndex: $zIndex || null,
-    });
-});
+var Container = styled('div', 'absolute top-0 left-0 right-0 z-[--sw-z-index]');
 var LayerComponent = /** @class */ (function (_super) {
     __extends(LayerComponent, _super);
     function LayerComponent() {
@@ -87,7 +82,7 @@ var LayerComponent = /** @class */ (function (_super) {
         if (host && host !== prevProps.host && prevProps.host === null) {
             this.addContainer(host);
         }
-        if (prevProps.isHoverLayer != this.props.isHoverLayer) {
+        if (prevProps.isHoverLayer !== this.props.isHoverLayer) {
             if (this.props.isHoverLayer) {
                 this.context.removeDocClickHandler(this.onDocumentClick);
             }
@@ -134,9 +129,9 @@ var LayerComponent = /** @class */ (function (_super) {
     };
     LayerComponent.prototype.render = function () {
         var container = this.container;
-        var _a = this.props, children = _a.children, mountNode = _a.mountNode, zIndex = _a.zIndex;
+        var _a = this.props, children = _a.children, mountNode = _a.mountNode, zIndex = _a.zIndex, className = _a.className;
         // Only adding an additional wrapper when a layer has z-index to be set
-        var childrenToRender = zIndex ? _jsx(Container, __assign({ "$zIndex": zIndex }, { children: children }), void 0) : children;
+        var childrenToRender = zIndex ? (_jsx(Container, __assign({ className: className, style: { '--sw-z-index': zIndex } }, { children: children }))) : (children);
         if (!isServer) {
             if (mountNode) {
                 return ReactDOM.createPortal(childrenToRender, mountNode);
@@ -154,6 +149,6 @@ var LayerComponent = /** @class */ (function (_super) {
 export default function Layer(props) {
     return _jsx(Consumer, { children: function (_a) {
             var host = _a.host, zIndex = _a.zIndex;
-            return _jsx(LayerComponent, __assign({}, props, { host: host, zIndex: zIndex }), void 0);
-        } }, void 0);
+            return _jsx(LayerComponent, __assign({}, props, { host: host, zIndex: zIndex }));
+        } });
 }

package/esm/baseui/layer/layers-manager.js

@@ -1,11 +1,14 @@
 import { __assign, __extends, __read, __spreadArray } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
+import { createSingletonContext } from '@sprinklrjs/spaceweb/singleton/createSingletonContext';
 import { styled } from '../../style';
-import { getOverrides } from '../helpers/overrides';
+import { getOverrides } from '../../overrides';
 import { initFocusVisible } from '../utils/focusVisible';
 export var isServer = typeof window === 'undefined';
+// @ts-ignore -- CSS-in-JS -- TS2345: Argument of type '{}' is not assignable to parameter of type 'ClassName'.
 var StyledAppContainer = styled('div', {});
+// @ts-ignore -- CSS-in-JS -- TS2345: Argument of type '{}' is not assignable to parameter of type 'ClassName'.
 var StyledLayersContainer = styled('div', {});
 var __DEV__ = process.env.NODE_ENV !== 'production';
 function defaultEventHandlerFn() {
@@ -13,7 +16,7 @@ function defaultEventHandlerFn() {
         console.warn('`LayersManager` was not found. This occurs if you are attempting to use a component requiring `Layer` without using the `BaseProvider` at the root of your app. Please visit https://baseweb.design/components/base-provider/ for more information');
     }
 }
-export var LayersContext = React.createContext({
+export var LayersContext = createSingletonContext({
     addEscapeHandler: defaultEventHandlerFn,
     removeEscapeHandler: defaultEventHandlerFn,
     addKeyDownHandler: defaultEventHandlerFn,
@@ -26,7 +29,7 @@ export var LayersContext = React.createContext({
     removeDocClickHandler: defaultEventHandlerFn,
     host: undefined,
     zIndex: undefined,
-});
+}, 'LayersContext');
 export var Provider = LayersContext.Provider;
 export var Consumer = LayersContext.Consumer;
 var LayersManager = /** @class */ (function (_super) {
@@ -34,7 +37,7 @@ var LayersManager = /** @class */ (function (_super) {
     function LayersManager(props) {
         var _this = _super.call(this, props) || this;
         _this.host = React.createRef();
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any -- legacy code
         _this.containerRef = React.createRef();
         _this.onDocumentClick = function (event) {
             var docClickHandler = _this.state.docClickHandlers[_this.state.docClickHandlers.length - 1];
@@ -160,8 +163,8 @@ var LayersManager = /** @class */ (function (_super) {
                         removeKeyPressHandler: _this.onRemoveKeyPressHandler,
                         addDocClickHandler: _this.onAddDocClickHandler,
                         removeDocClickHandler: _this.onRemoveDocClickHandler,
-                    } }, { children: [_jsx(AppContainer, __assign({}, appContainerProps, { ref: _this.containerRef }, { children: _this.props.children }), void 0), _jsx(LayersContainer, __assign({}, layersContainerProps, { ref: _this.host }), void 0)] }), void 0));
-            } }, void 0));
+                    } }, { children: [_jsx(AppContainer, __assign({}, appContainerProps, { ref: _this.containerRef }, { children: _this.props.children })), _jsx(LayersContainer, __assign({}, layersContainerProps, { ref: _this.host }))] })));
+            } }));
     };
     return LayersManager;
 }(React.Component));

package/esm/baseui/layer/tether.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import Popper from 'popper.js';
-import type { TetherProps, TetherState, PopperDataObject } from './types';
+import type { PopperDataObject, TetherProps, TetherState } from './types';
 declare class Tether extends React.Component<TetherProps, TetherState> {
     static defaultProps: {
         anchorRef: null;
@@ -8,6 +8,7 @@ declare class Tether extends React.Component<TetherProps, TetherState> {
         placement: "auto";
         popperRef: null;
         popperOptions: {};
+        positionFixed: boolean;
     };
     popper?: Popper;
     popperHeight: number;

package/esm/baseui/layer/tether.js

@@ -7,7 +7,7 @@ LICENSE file in the root directory of this source tree.
 */
 import * as React from 'react';
 import Popper from 'popper.js';
-import { toPopperPlacement, parsePopperOffset } from './utils';
+import { parsePopperOffset, toPopperPlacement } from './utils';
 import { TETHER_PLACEMENT } from './constants';
 var Tether = /** @class */ (function (_super) {
     __extends(Tether, _super);
@@ -95,17 +95,19 @@ var Tether = /** @class */ (function (_super) {
                 }
             }
         }
-        if (this.props.popperRef) {
-            if (this.state.isMounted !== prevState.isMounted) {
-                if (!this.props.anchorRef) {
-                    if (process.env.NODE_ENV !== 'production') {
-                        console.warn("[baseui][TetherBehavior] ref has not been passed to the Popper's anchor element.\n              See how to pass the ref to an anchor element in the Popover example\n              https://baseweb.design/components/popover/#anchor-ref-handling-example");
-                    }
-                }
-                else {
-                    this.initializePopper();
+        if (this.props.popperRef &&
+            (this.state.isMounted !== prevState.isMounted ||
+                (prevProps === null || prevProps === void 0 ? void 0 : prevProps.placement) !== this.props.placement ||
+                (prevProps === null || prevProps === void 0 ? void 0 : prevProps.positionFixed) !== this.props.positionFixed)) {
+            if (!this.props.anchorRef) {
+                if (process.env.NODE_ENV !== 'production') {
+                    console.warn("[baseui][TetherBehavior] ref has not been passed to the Popper's anchor element.\n              See how to pass the ref to an anchor element in the Popover example\n              https://baseweb.design/components/popover/#anchor-ref-handling-example");
                 }
             }
+            else {
+                this.destroyPopover();
+                this.initializePopper();
+            }
         }
     };
     Tether.prototype.componentWillUnmount = function () {
@@ -117,7 +119,7 @@ var Tether = /** @class */ (function (_super) {
         var modifiers = popperOptions.modifiers, restOptions = __rest(popperOptions, ["modifiers"]);
         if (!this.props.anchorRef || !this.props.popperRef)
             return;
-        this.popper = new Popper(this.props.anchorRef, this.props.popperRef, __assign({ 
+        var popperInitOptions = __assign(__assign({ 
             // Recommended placement (popper may ignore if it causes a viewport overflow, etc)
             placement: toPopperPlacement(placement), modifiers: __assign({ 
                 // Passing the arrow ref will measure the arrow when calculating styles
@@ -135,7 +137,8 @@ var Tether = /** @class */ (function (_super) {
                     enabled: true,
                     fn: this.onPopperUpdate,
                     order: 900,
-                }, preventOverflow: { enabled: true } }, modifiers) }, restOptions));
+                }, preventOverflow: { enabled: true } }, modifiers) }, restOptions), { positionFixed: this.props.positionFixed });
+        this.popper = new Popper(this.props.anchorRef, this.props.popperRef, popperInitOptions);
     };
     Tether.prototype.destroyPopover = function () {
         if (this.popper) {
@@ -151,10 +154,12 @@ var Tether = /** @class */ (function (_super) {
         anchorRef: null,
         // @ts-ignore
         onPopperUpdate: function () { return null; },
+        // this placement should only be used only for Popper.js configuration
         placement: TETHER_PLACEMENT.auto,
         // @ts-ignore
         popperRef: null,
         popperOptions: {},
+        positionFixed: false,
     };
     return Tether;
 }(React.Component));

package/esm/baseui/layer/types.d.ts

@@ -1,23 +1,24 @@
 import type * as React from 'react';
 import type { TETHER_PLACEMENT } from './constants';
-import type { Override } from '../helpers/overrides';
+import type { Override } from '../../overrides';
+import { ClassName } from '../../types';
 /** LayersManager */
-export declare type LayersManagerProps = {
+export type LayersManagerProps = {
     children: React.ReactNode;
     overrides?: {
-        AppContainer?: Override;
-        LayersContainer?: Override;
+        AppContainer?: Override<Record<string, any>>;
+        LayersContainer?: Override<Record<string, any>>;
     };
     zIndex?: number;
 };
-export declare type LayersManagerState = {
+export type LayersManagerState = {
     escapeKeyHandlers: Array<() => unknown>;
     keyDownHandlers: Array<(event: KeyboardEvent) => unknown>;
     keyUpHandlers: Array<(event: KeyboardEvent) => unknown>;
     keyPressHandlers: Array<(event: KeyboardEvent) => unknown>;
     docClickHandlers: Array<(event: MouseEvent) => unknown>;
 };
-export declare type LayersContextProps = {
+export type LayersContextProps = {
     host?: HTMLElement | null;
     zIndex?: number;
     addEscapeHandler: (a: () => unknown) => void;
@@ -32,7 +33,7 @@ export declare type LayersContextProps = {
     removeDocClickHandler: (a: (event: MouseEvent) => void) => void;
 };
 /** Layer */
-export declare type LayerProps = {
+export type LayerProps = {
     /** Content to be rendered in the Layer. */
     children: React.ReactNode;
     /** A DOM element where the Layer will be inserted into as a child.
@@ -48,7 +49,7 @@ export declare type LayerProps = {
     isHoverLayer?: boolean;
     /** A custom DOM element where the layer is inserted to as a child.
        Note that the `index` prop does not work with a custom `mountNode`. */
-    mountNode?: HTMLElement;
+    mountNode?: HTMLElement | null;
     /** Handler called when escape key is pressed.
        Only the top most layer's handler is called. */
     onEscape?: () => unknown;
@@ -72,12 +73,12 @@ export declare type LayerProps = {
        The zIndex value comes from the layers context provider. */
     zIndex?: number;
 };
-export declare type LayerComponentProps = {
+export type LayerComponentProps = {
     children: React.ReactNode;
     host: HTMLElement | undefined | null;
     index?: number;
     isHoverLayer?: boolean;
-    mountNode?: HTMLElement;
+    mountNode?: HTMLElement | null;
     onEscape?: () => unknown;
     onKeyDown?: (event: KeyboardEvent) => unknown;
     onKeyUp?: (event: KeyboardEvent) => unknown;
@@ -86,32 +87,33 @@ export declare type LayerComponentProps = {
     onMount?: () => unknown;
     onUnmount?: () => unknown;
     zIndex?: number;
+    className?: ClassName;
 };
-export declare type LayerState = {
+export type LayerState = {
     container: HTMLElement | undefined | null;
 };
 /** TetherBehavior */
-export declare type TetherPlacement = keyof typeof TETHER_PLACEMENT;
-export declare type NormalizedOffset = {
+export type TetherPlacement = keyof typeof TETHER_PLACEMENT;
+export type NormalizedOffset = {
     top: number;
     left: number;
 };
-export declare type NormalizedOffsets = {
+export type NormalizedOffsets = {
     arrow?: NormalizedOffset;
     popper: NormalizedOffset;
 };
-export declare type PopperOffset = {
+export type PopperOffset = {
     top?: number | null;
     left?: number | null;
 };
-export declare type PopperDataObject = {
+export type PopperDataObject = {
     offsets: {
         arrow?: PopperOffset;
         popper: PopperOffset;
     };
     placement: string;
 };
-export declare type PopperOptions = {
+export type PopperOptions = {
     placement: string;
     modifiers: {
         arrow: {};
@@ -122,7 +124,7 @@ export declare type PopperOptions = {
         };
     };
 };
-export declare type TetherProps = {
+export type TetherProps = {
     /** The reference element used to position the popper. */
     anchorRef: HTMLElement | undefined | null;
     /** The arrow element that is passed as an arrow modifier to alter
@@ -142,7 +144,9 @@ export declare type TetherProps = {
     popperOptions: any;
     /** Reposition popover whenever dimension of popup content or targetElement changes. **/
     repositionOnResize?: boolean;
+    /** When true, Popper.js uses fixed positioning math (must match CSS `position: fixed` on the popper). */
+    positionFixed?: boolean;
 };
-export declare type TetherState = {
+export type TetherState = {
     isMounted: boolean;
 };