@broxus/react-uikit 0.14.1 → 0.15.1

package/dist/cjs/components/Nav/context/IdContext.js

@@ -24,7 +24,9 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useNavId = exports.getNavId = exports.IdContext = void 0;
+exports.IdContext = void 0;
+exports.getNavId = getNavId;
+exports.useNavId = useNavId;
 const React = __importStar(require("react"));
 exports.IdContext = React.createContext(undefined);
 function getNavId(uuid, eventKey) {
@@ -33,7 +35,6 @@ function getNavId(uuid, eventKey) {
     }
     return `${uuid}-${eventKey}`;
 }
-exports.getNavId = getNavId;
 function useNavId(eventKey) {
     const id = React.useContext(exports.IdContext);
     if (eventKey === undefined || id == null) {
@@ -41,7 +42,6 @@ function useNavId(eventKey) {
     }
     return getNavId(id, eventKey);
 }
-exports.useNavId = useNavId;
 if (process.env.NODE_ENV !== 'production') {
     exports.IdContext.displayName = 'IdContext';
 }

package/dist/cjs/components/Nav/context/NavContext.js

@@ -27,7 +27,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.NavContextProvider = exports.NavContext = void 0;
+exports.NavContext = void 0;
+exports.NavContextProvider = NavContextProvider;
 const useMemo_1 = __importDefault(require("rc-util/lib/hooks/useMemo"));
 const React = __importStar(require("react"));
 const shallowequal_1 = __importDefault(require("shallowequal"));
@@ -61,7 +62,6 @@ function NavContextProvider(props) {
     [context, restProps], (prev, next) => !locked && (prev[0] !== next[0] || !(0, shallowequal_1.default)(prev[1], next[1])));
     return React.createElement(exports.NavContext.Provider, { value: inheritableContext }, children);
 }
-exports.NavContextProvider = NavContextProvider;
 if (process.env.NODE_ENV !== 'production') {
     exports.NavContext.displayName = 'NavContext';
 }

package/dist/cjs/components/Nav/context/PathContext.js

@@ -24,20 +24,20 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.PathUserContext = exports.useFullPath = exports.PathTrackerContext = exports.useMeasure = exports.PathRegisterContext = void 0;
+exports.PathUserContext = exports.PathTrackerContext = exports.PathRegisterContext = void 0;
+exports.useMeasure = useMeasure;
+exports.useFullPath = useFullPath;
 const React = __importStar(require("react"));
 const EmptyList = [];
 exports.PathRegisterContext = React.createContext(null);
 function useMeasure() {
     return React.useContext(exports.PathRegisterContext);
 }
-exports.useMeasure = useMeasure;
 exports.PathTrackerContext = React.createContext(EmptyList);
 function useFullPath(eventKey) {
     const parentKeyPath = React.useContext(exports.PathTrackerContext);
     return React.useMemo(() => (eventKey !== undefined ? [...parentKeyPath, eventKey] : parentKeyPath), [parentKeyPath, eventKey]);
 }
-exports.useFullPath = useFullPath;
 exports.PathUserContext = React.createContext(null);
 if (process.env.NODE_ENV !== 'production') {
     exports.PathRegisterContext.displayName = 'PathRegisterContext';

package/dist/cjs/components/Nav/hooks/useAccessibility.js

@@ -26,7 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useAccessibility = void 0;
+exports.useAccessibility = useAccessibility;
 const focus_1 = require("rc-util/lib/Dom/focus");
 const KeyCode_1 = __importDefault(require("rc-util/lib/KeyCode"));
 const raf_1 = __importDefault(require("rc-util/lib/raf"));
@@ -295,4 +295,3 @@ function useAccessibility(mode, activeKey, isRtl, id, containerRef, getKeys, get
         originOnKeyDown?.(event);
     };
 }
-exports.useAccessibility = useAccessibility;

package/dist/cjs/components/Nav/hooks/useActive.js

@@ -23,7 +23,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useActive = void 0;
+exports.useActive = useActive;
 const React = __importStar(require("react"));
 const NavContext_1 = require("../../../components/Nav/context/NavContext");
 function useActive(eventKey, disabled, onMouseEnter, onMouseLeave) {
@@ -55,4 +55,3 @@ function useActive(eventKey, disabled, onMouseEnter, onMouseLeave) {
     }
     return ret;
 }
-exports.useActive = useActive;

package/dist/cjs/components/Nav/hooks/useDirectionStyle.js

@@ -23,7 +23,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useDirectionStyle = void 0;
+exports.useDirectionStyle = useDirectionStyle;
 const React = __importStar(require("react"));
 const NavContext_1 = require("../../../components/Nav/context/NavContext");
 function useDirectionStyle(level) {
@@ -34,4 +34,3 @@ function useDirectionStyle(level) {
     const len = level;
     return rtl ? { paddingRight: len * (inlineIndent ?? 0) } : { paddingLeft: len * (inlineIndent ?? 0) };
 }
-exports.useDirectionStyle = useDirectionStyle;

package/dist/cjs/components/Nav/hooks/useKeyRecords.js

@@ -26,7 +26,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useKeyRecords = exports.OVERFLOW_KEY = void 0;
+exports.OVERFLOW_KEY = void 0;
+exports.useKeyRecords = useKeyRecords;
 const warning_1 = __importDefault(require("rc-util/lib/warning"));
 const React = __importStar(require("react"));
 const timeUtil_1 = require("../../../components/Nav/utils/timeUtil");
@@ -114,4 +115,3 @@ function useKeyRecords() {
         unregisterPath,
     };
 }
-exports.useKeyRecords = useKeyRecords;

package/dist/cjs/components/Nav/hooks/useMemoCallback.js

@@ -23,7 +23,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useMemoCallback = void 0;
+exports.useMemoCallback = useMemoCallback;
 const React = __importStar(require("react"));
 /**
  * Cache callback function that always return same ref instead.
@@ -36,4 +36,3 @@ function useMemoCallback(func) {
     const callback = React.useCallback(((...args) => funRef.current?.(...args)), []);
     return typeof func === 'function' ? callback : undefined;
 }
-exports.useMemoCallback = useMemoCallback;

package/dist/cjs/components/Nav/hooks/useUUID.js

@@ -26,7 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useUUID = void 0;
+exports.useUUID = useUUID;
 const useMergedState_1 = __importDefault(require("rc-util/lib/hooks/useMergedState"));
 const React = __importStar(require("react"));
 const uniquePrefix = Math.random().toFixed(5).toString().slice(2);
@@ -44,4 +44,3 @@ function useUUID(id) {
     }, [setUUID]);
     return uuid;
 }
-exports.useUUID = useUUID;

package/dist/cjs/components/Nav/utils/alignUtil.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getAlignPopupClassName = exports.getAlignFromPlacement = void 0;
+exports.getAlignFromPlacement = getAlignFromPlacement;
+exports.getAlignPopupClassName = getAlignPopupClassName;
 function isPointsEq(a1, a2, isAlignPoint) {
     if (isAlignPoint) {
         return a1[0] === a2[0];
@@ -14,7 +15,6 @@ function getAlignFromPlacement(builtinPlacements, placementStr, align) {
         ...align,
     };
 }
-exports.getAlignFromPlacement = getAlignFromPlacement;
 function getAlignPopupClassName(builtinPlacements, prefixCls, align, isAlignPoint) {
     const { points } = align;
     const placements = Object.keys(builtinPlacements);
@@ -27,4 +27,3 @@ function getAlignPopupClassName(builtinPlacements, prefixCls, align, isAlignPoin
     }
     return '';
 }
-exports.getAlignPopupClassName = getAlignPopupClassName;

package/dist/cjs/components/Nav/utils/motionUtil.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getMotion = void 0;
+exports.getMotion = getMotion;
 function getMotion(mode, motion, defaultMotions) {
     if (motion) {
         return motion;
@@ -10,4 +10,3 @@ function getMotion(mode, motion, defaultMotions) {
     }
     return undefined;
 }
-exports.getMotion = getMotion;

package/dist/cjs/components/Nav/utils/nodeUtil.js

@@ -26,7 +26,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.parseItems = exports.parseChildren = void 0;
+exports.parseChildren = parseChildren;
+exports.parseItems = parseItems;
 const toArray_1 = __importDefault(require("rc-util/lib/Children/toArray"));
 const React = __importStar(require("react"));
 const Divider_1 = require("../../../components/Nav/Divider");
@@ -54,7 +55,6 @@ function parseChildren(children, keyPath) {
         return child;
     });
 }
-exports.parseChildren = parseChildren;
 function convertItemsToNodes(list) {
     return (list || [])
         .map((opt, index) => {
@@ -87,4 +87,3 @@ function parseItems(children, items, keyPath) {
     }
     return parseChildren(childNodes, keyPath);
 }
-exports.parseItems = parseItems;

package/dist/cjs/components/Nav/utils/timeUtil.js

@@ -1,7 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.nextSlice = void 0;
+exports.nextSlice = nextSlice;
 function nextSlice(callback) {
     Promise.resolve().then(callback);
 }
-exports.nextSlice = nextSlice;

package/dist/cjs/components/Nav/utils/warnUtil.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.warnItemProp = void 0;
+exports.warnItemProp = warnItemProp;
 const warning_1 = __importDefault(require("rc-util/lib/warning"));
 /**
  * `onClick` event return `info.item` which point to react node directly.
@@ -18,4 +18,3 @@ function warnItemProp({ item, ...restInfo }) {
     });
     return restInfo;
 }
-exports.warnItemProp = warnItemProp;

package/dist/cjs/components/Navbar/Center.js

@@ -26,7 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Center = void 0;
+exports.Center = Center;
 const classnames_1 = __importDefault(require("classnames"));
 const React = __importStar(require("react"));
 const Component_1 = require("../../components/Component");
@@ -38,7 +38,6 @@ function Center(props) {
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'navbar-center'), [config, prefixCls]);
     return React.createElement(Component_1.Component, { className: (0, classnames_1.default)(rootCls, className), component: defaultElement, ...restProps });
 }
-exports.Center = Center;
 if (process.env.NODE_ENV !== 'production') {
     Center.displayName = 'Navbar.Center';
 }

package/dist/cjs/components/Navbar/Container.js

@@ -26,7 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Container = void 0;
+exports.Container = Container;
 const classnames_1 = __importDefault(require("classnames"));
 const React = __importStar(require("react"));
 const Component_1 = require("../../components/Component");
@@ -40,7 +40,6 @@ function Container(props) {
             [`${rootCls}-transparent`]: transparent,
         }, className), component: defaultElement, ...restProps }));
 }
-exports.Container = Container;
 if (process.env.NODE_ENV !== 'production') {
     Container.displayName = 'Navbar.Container';
 }

package/dist/cjs/components/Navbar/Item.js

@@ -26,7 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Item = void 0;
+exports.Item = Item;
 const classnames_1 = __importDefault(require("classnames"));
 const React = __importStar(require("react"));
 const Component_1 = require("../../components/Component");
@@ -38,7 +38,6 @@ function Item(props) {
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'navbar-item'), [config, prefixCls]);
     return React.createElement(Component_1.Component, { className: (0, classnames_1.default)(rootCls, className), component: defaultElement, ...restProps });
 }
-exports.Item = Item;
 if (process.env.NODE_ENV !== 'production') {
     Item.displayName = 'Navbar.Item';
 }

package/dist/cjs/components/Navbar/Left.js

@@ -26,7 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Left = void 0;
+exports.Left = Left;
 const classnames_1 = __importDefault(require("classnames"));
 const React = __importStar(require("react"));
 const Component_1 = require("../../components/Component");
@@ -38,7 +38,6 @@ function Left(props) {
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'navbar-left'), [config, prefixCls]);
     return React.createElement(Component_1.Component, { className: (0, classnames_1.default)(rootCls, className), component: defaultElement, ...restProps });
 }
-exports.Left = Left;
 if (process.env.NODE_ENV !== 'production') {
     Left.displayName = 'Navbar.Left';
 }

package/dist/cjs/components/Navbar/Nav.js

@@ -26,7 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Nav = void 0;
+exports.Nav = Nav;
 const classnames_1 = __importDefault(require("classnames"));
 const React = __importStar(require("react"));
 const ConfigProvider_1 = require("../../components/ConfigProvider");
@@ -37,7 +37,6 @@ function Nav(props) {
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'navbar'), [config, prefixCls]);
     return (React.createElement(Nav_1.Nav, { className: (0, classnames_1.default)(`${rootCls}-nav`, className), popupPrefixCls: `${rootCls}-dropdown`, mode: "horizontal", ...restProps }));
 }
-exports.Nav = Nav;
 if (process.env.NODE_ENV !== 'production') {
     Nav.displayName = 'Navbar.Nav';
 }

package/dist/cjs/components/Navbar/Navbar.js

@@ -26,7 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Navbar = void 0;
+exports.Navbar = Navbar;
 const classnames_1 = __importDefault(require("classnames"));
 const React = __importStar(require("react"));
 const ConfigProvider_1 = require("../../components/ConfigProvider");
@@ -39,4 +39,3 @@ function Navbar(props) {
             [`${rootCls}-transparent`]: transparent,
         }, className), ...restProps }));
 }
-exports.Navbar = Navbar;

package/dist/cjs/components/Navbar/Right.js

@@ -26,7 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Right = void 0;
+exports.Right = Right;
 const classnames_1 = __importDefault(require("classnames"));
 const React = __importStar(require("react"));
 const Component_1 = require("../../components/Component");
@@ -38,7 +38,6 @@ function Right(props) {
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'navbar'), [config, prefixCls]);
     return React.createElement(Component_1.Component, { className: (0, classnames_1.default)(`${rootCls}-right`, className), component: defaultElement, ...restProps });
 }
-exports.Right = Right;
 if (process.env.NODE_ENV !== 'production') {
     Right.displayName = 'Navbar.Right';
 }

package/dist/cjs/components/Navbar/Toggle.js

@@ -26,7 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Toggle = void 0;
+exports.Toggle = Toggle;
 const classnames_1 = __importDefault(require("classnames"));
 const React = __importStar(require("react"));
 const Component_1 = require("../../components/Component");
@@ -40,7 +40,6 @@ function Toggle(props) {
             [`${rootCls}-icon`]: icon,
         }, className), component: defaultElement, ...restProps }));
 }
-exports.Toggle = Toggle;
 if (process.env.NODE_ENV !== 'production') {
     Toggle.displayName = 'Navbar.Toggle';
 }

package/dist/cjs/components/Navbar/index.scss

@@ -49,6 +49,7 @@
  */
 
 .uk-navbar {
+    --uk-inverse: #{$navbar-color-mode};
     display: flex;
 
     /* 1 */

package/dist/cjs/components/Overlay/index.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import { type PolymorphicProps } from '../../components/Component';
+import './index.scss';
+export interface OverlayOwnProps {
+    icon?: boolean;
+    overlay?: React.ReactNode;
+    position?: 'top' | 'bottom' | 'left' | 'right' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'center' | 'cover';
+    type?: 'default' | 'primary';
+}
+export type OverlayProps<E extends React.ElementType = React.ElementType> = OverlayOwnProps & PolymorphicProps<E> & PolymorphicProps<E, OverlayOwnProps>;
+declare const defaultElement = "div";
+export declare function Overlay<E extends React.ElementType = typeof defaultElement>(props: React.PropsWithChildren<OverlayProps<E>>): React.JSX.Element;
+export {};

package/dist/cjs/components/Overlay/index.js

@@ -0,0 +1,58 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Overlay = Overlay;
+const classnames_1 = __importDefault(require("classnames"));
+const React = __importStar(require("react"));
+const Component_1 = require("../../components/Component");
+const ConfigProvider_1 = require("../../components/ConfigProvider");
+require("./index.scss");
+const defaultElement = 'div';
+const positions = [
+    'top',
+    'bottom',
+    'left',
+    'right',
+    'top-left',
+    'top-right',
+    'bottom-left',
+    'bottom-right',
+    'center',
+    'cover',
+];
+function Overlay(props) {
+    const config = (0, ConfigProvider_1.useConfig)();
+    const { className, icon, position = 'bottom', prefixCls = config.prefixCls, type = 'default', ...restProps } = props;
+    const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'overlay'), [config, prefixCls]);
+    const positionRootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'position'), [config, prefixCls]);
+    return (React.createElement(Component_1.Component, { className: (0, classnames_1.default)(rootCls, {
+            [`${rootCls}-${type}`]: type && ['default', 'primary'].includes(type),
+            [`${rootCls}-icon`]: icon,
+            [`${positionRootCls}-${position}`]: position && positions.includes(position),
+        }, className), component: defaultElement, ...restProps }));
+}

package/dist/cjs/components/Overlay/index.scss

@@ -0,0 +1,105 @@
+// Name:            Overlay
+// Description:     Component to create content areas overlaying an image
+//
+// Component:       `uk-overlay`
+//
+// Adopted:         `uk-overlay-icon`
+//
+// Modifier:        `uk-overlay-default`
+//                  `uk-overlay-primary`
+//
+// ========================================================================
+
+
+// Variables
+// ========================================================================
+
+@import '../../styles/variables.scss';
+
+
+/* ========================================================================
+   Component: Overlay
+ ========================================================================== */
+
+.uk-overlay {
+    padding: var(--overlay-padding-vertical) var(--overlay-padding-horizontal);
+    @if mixin-exists(hook-overlay) {
+        @include hook-overlay;
+    }
+}
+
+/*
+ * Remove margin from the last-child
+ */
+
+.uk-overlay > :last-child {
+    margin-bottom: 0;
+}
+
+
+/* Icon
+ ========================================================================== */
+
+.uk-overlay-icon {
+    @if mixin-exists(hook-overlay-icon) {
+        @include hook-overlay-icon;
+    }
+}
+
+
+/* Style modifiers
+ ========================================================================== */
+
+/*
+ * Default
+ */
+
+.uk-overlay-default {
+    background: var(--overlay-default-background);
+    @if mixin-exists(hook-overlay-default) {
+        @include hook-overlay-default;
+    }
+}
+
+/*
+ * Primary
+ */
+
+.uk-overlay-primary {
+    background: var(--overlay-primary-background);
+    @if mixin-exists(hook-overlay-primary) {
+        @include hook-overlay-primary;
+    }
+}
+
+// Color Mode
+@if $overlay-primary-color-mode == light {
+    .uk-overlay-primary {
+        @extend .uk-light !optional;
+    }
+}
+
+@if $overlay-primary-color-mode == dark {
+    .uk-overlay-primary {
+        @extend .uk-dark !optional;
+    }
+}
+
+
+// Hooks
+// ========================================================================
+
+@if mixin-exists(hook-overlay-misc) {
+    @include hook-overlay-misc;
+}
+
+
+// Vars
+// ========================================================================
+
+:root {
+    --overlay-padding-horizontal: var(--global-gutter);
+    --overlay-padding-vertical: var(--global-gutter);
+    --overlay-default-background: #{$overlay-default-background};
+    --overlay-primary-background: #{$overlay-primary-background};
+}

package/dist/cjs/components/Progress/index.js

@@ -26,7 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Progress = void 0;
+exports.Progress = Progress;
 const classnames_1 = __importDefault(require("classnames"));
 const React = __importStar(require("react"));
 const ConfigProvider_1 = require("../../components/ConfigProvider");
@@ -37,4 +37,3 @@ function Progress(props) {
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'progress'), [config, prefixCls]);
     return React.createElement("progress", { className: (0, classnames_1.default)(rootCls, className), ...restProps });
 }
-exports.Progress = Progress;

package/dist/cjs/components/Section/index.js

@@ -26,7 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Section = void 0;
+exports.Section = Section;
 const classnames_1 = __importDefault(require("classnames"));
 const React = __importStar(require("react"));
 const Component_1 = require("../../components/Component");
@@ -43,4 +43,3 @@ function Section(props) {
             [`${prefixCls || config.prefixCls}-preserve-color`]: preserveColor,
         }, className), component: defaultElement, ...restProps }));
 }
-exports.Section = Section;