@broxus/react-uikit 0.19.1 → 0.19.3

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

@@ -14,9 +14,10 @@ export interface InverseProviderProps {
     globalLightClassName?: string;
     primaryColorDark?: string;
     primaryColorLight?: string;
+    storageKey?: string;
 }
 export declare const lib: Record<ColorMode, () => React.JSX.Element>;
 export declare const InverseContext: React.Context<InverseConfig | null>;
 export declare function useInverse(): InverseConfig;
 export declare const INVERSE_STORAGE_KEY = "colorMode";
-export declare const InverseProvider: React.MemoExoticComponent<({ children, defaultColorMode, globalDarkClassName, globalLightClassName, primaryColorDark, primaryColorLight, }: React.PropsWithChildren<InverseProviderProps>) => React.JSX.Element>;
+export declare const InverseProvider: React.MemoExoticComponent<({ children, defaultColorMode, globalDarkClassName, globalLightClassName, primaryColorDark, primaryColorLight, storageKey, }: React.PropsWithChildren<InverseProviderProps>) => React.JSX.Element>;

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

@@ -56,9 +56,9 @@ function useInverse() {
     return (0, hooks_1.useContext)(exports.InverseContext);
 }
 exports.INVERSE_STORAGE_KEY = 'colorMode';
-exports.InverseProvider = React.memo(({ children, defaultColorMode = ColorMode.Dark, globalDarkClassName = 'tm-dark', globalLightClassName = 'tm-light', primaryColorDark, primaryColorLight, }) => {
+exports.InverseProvider = React.memo(({ children, defaultColorMode = ColorMode.Dark, globalDarkClassName = 'tm-dark', globalLightClassName = 'tm-light', primaryColorDark, primaryColorLight, storageKey = exports.INVERSE_STORAGE_KEY, }) => {
     const [colorMode, setColorMode] = React.useState(() => {
-        const stored = js_utils_1.storage.get(exports.INVERSE_STORAGE_KEY);
+        const stored = js_utils_1.storage.get(storageKey);
         return stored ? stored : defaultColorMode ?? ColorMode.Dark;
     });
     const context = React.useMemo(() => ({
@@ -66,14 +66,14 @@ exports.InverseProvider = React.memo(({ children, defaultColorMode = ColorMode.D
         logoColor: colorMode === ColorMode.Dark ? primaryColorLight : primaryColorDark,
         setColorMode: (value) => {
             setColorMode(value);
-            js_utils_1.storage.set(exports.INVERSE_STORAGE_KEY, value);
+            js_utils_1.storage.set(storageKey, value);
         },
-    }), [colorMode, primaryColorDark, primaryColorLight]);
+    }), [colorMode, primaryColorDark, primaryColorLight, storageKey]);
     const onChangeStorageValue = React.useCallback((event) => {
-        if (event.key === exports.INVERSE_STORAGE_KEY && event.newValue != null) {
+        if (event.key === storageKey && event.newValue != null) {
             setColorMode(event.newValue);
         }
-    }, []);
+    }, [storageKey]);
     React.useEffect(() => {
         (0, js_utils_1.removeClass)(document.documentElement, globalLightClassName, globalDarkClassName);
         (0, js_utils_1.addClass)(document.documentElement, colorMode === ColorMode.Dark ? globalLightClassName : globalDarkClassName);

package/dist/cjs/components/Nav/Header.d.ts

@@ -1,9 +1,13 @@
 import * as React from 'react';
-export type HeaderProps = {
+export interface HeaderProps {
     children: React.ReactNode;
     className?: string;
     style?: React.CSSProperties;
-};
+    /** @private Internal filled key. Do not set it directly */
+    eventKey?: string;
+    /** @private Do not use. Private warning empty usage */
+    warnKey?: boolean;
+}
 export declare function Header(props: HeaderProps): React.JSX.Element;
 export declare namespace Header {
     var displayName: string;

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

@@ -37,13 +37,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Header = Header;
+const omit_1 = __importDefault(require("@rc-component/util/lib/omit"));
 const classnames_1 = __importDefault(require("classnames"));
 const React = __importStar(require("react"));
 const NavContext_1 = require("../../components/Nav/context/NavContext");
 function Header(props) {
     const { className, ...restProps } = props;
     const { prefixCls } = React.useContext(NavContext_1.NavContext);
-    return React.createElement("li", { className: (0, classnames_1.default)(`${prefixCls}-header`, className), ...restProps });
+    return React.createElement("li", { className: (0, classnames_1.default)(`${prefixCls}-header`, className), ...(0, omit_1.default)(restProps, ['eventKey', 'warnKey']) });
 }
 if (process.env.NODE_ENV !== 'production') {
     Header.displayName = 'Nav.Header';

package/dist/cjs/components/Nav/Item/index.js

@@ -53,7 +53,7 @@ exports.Item = React.memo(({ eventKey, ...restProps }) => {
     if (measure) {
         return null;
     }
-    return React.createElement(InternalNavItem_1.InternalNavItem, { ...restProps });
+    return React.createElement(InternalNavItem_1.InternalNavItem, { eventKey: eventKey, ...restProps });
 });
 if (process.env.NODE_ENV !== 'production') {
     exports.Item.displayName = 'Nav.Item';

package/dist/esm/components/Inverse/index.d.ts

@@ -14,9 +14,10 @@ export interface InverseProviderProps {
     globalLightClassName?: string;
     primaryColorDark?: string;
     primaryColorLight?: string;
+    storageKey?: string;
 }
 export declare const lib: Record<ColorMode, () => React.JSX.Element>;
 export declare const InverseContext: React.Context<InverseConfig | null>;
 export declare function useInverse(): InverseConfig;
 export declare const INVERSE_STORAGE_KEY = "colorMode";
-export declare const InverseProvider: React.MemoExoticComponent<({ children, defaultColorMode, globalDarkClassName, globalLightClassName, primaryColorDark, primaryColorLight, }: React.PropsWithChildren<InverseProviderProps>) => React.JSX.Element>;
+export declare const InverseProvider: React.MemoExoticComponent<({ children, defaultColorMode, globalDarkClassName, globalLightClassName, primaryColorDark, primaryColorLight, storageKey, }: React.PropsWithChildren<InverseProviderProps>) => React.JSX.Element>;

package/dist/esm/components/Inverse/index.js

@@ -19,9 +19,9 @@ export function useInverse() {
     return useContext(InverseContext);
 }
 export const INVERSE_STORAGE_KEY = 'colorMode';
-export const InverseProvider = React.memo(({ children, defaultColorMode = ColorMode.Dark, globalDarkClassName = 'tm-dark', globalLightClassName = 'tm-light', primaryColorDark, primaryColorLight, }) => {
+export const InverseProvider = React.memo(({ children, defaultColorMode = ColorMode.Dark, globalDarkClassName = 'tm-dark', globalLightClassName = 'tm-light', primaryColorDark, primaryColorLight, storageKey = INVERSE_STORAGE_KEY, }) => {
     const [colorMode, setColorMode] = React.useState(() => {
-        const stored = storage.get(INVERSE_STORAGE_KEY);
+        const stored = storage.get(storageKey);
         return stored ? stored : defaultColorMode ?? ColorMode.Dark;
     });
     const context = React.useMemo(() => ({
@@ -29,14 +29,14 @@ export const InverseProvider = React.memo(({ children, defaultColorMode = ColorM
         logoColor: colorMode === ColorMode.Dark ? primaryColorLight : primaryColorDark,
         setColorMode: (value) => {
             setColorMode(value);
-            storage.set(INVERSE_STORAGE_KEY, value);
+            storage.set(storageKey, value);
         },
-    }), [colorMode, primaryColorDark, primaryColorLight]);
+    }), [colorMode, primaryColorDark, primaryColorLight, storageKey]);
     const onChangeStorageValue = React.useCallback((event) => {
-        if (event.key === INVERSE_STORAGE_KEY && event.newValue != null) {
+        if (event.key === storageKey && event.newValue != null) {
             setColorMode(event.newValue);
         }
-    }, []);
+    }, [storageKey]);
     React.useEffect(() => {
         removeClass(document.documentElement, globalLightClassName, globalDarkClassName);
         addClass(document.documentElement, colorMode === ColorMode.Dark ? globalLightClassName : globalDarkClassName);

package/dist/esm/components/Nav/Header.d.ts

@@ -1,9 +1,13 @@
 import * as React from 'react';
-export type HeaderProps = {
+export interface HeaderProps {
     children: React.ReactNode;
     className?: string;
     style?: React.CSSProperties;
-};
+    /** @private Internal filled key. Do not set it directly */
+    eventKey?: string;
+    /** @private Do not use. Private warning empty usage */
+    warnKey?: boolean;
+}
 export declare function Header(props: HeaderProps): React.JSX.Element;
 export declare namespace Header {
     var displayName: string;

package/dist/esm/components/Nav/Header.js

@@ -1,10 +1,11 @@
+import omit from '@rc-component/util/lib/omit';
 import classNames from 'classnames';
 import * as React from 'react';
 import { NavContext } from '../../components/Nav/context/NavContext';
 export function Header(props) {
     const { className, ...restProps } = props;
     const { prefixCls } = React.useContext(NavContext);
-    return React.createElement("li", { className: classNames(`${prefixCls}-header`, className), ...restProps });
+    return React.createElement("li", { className: classNames(`${prefixCls}-header`, className), ...omit(restProps, ['eventKey', 'warnKey']) });
 }
 if (process.env.NODE_ENV !== 'production') {
     Header.displayName = 'Nav.Header';

package/dist/esm/components/Nav/Item/index.js

@@ -17,7 +17,7 @@ export const Item = React.memo(({ eventKey, ...restProps }) => {
     if (measure) {
         return null;
     }
-    return React.createElement(InternalNavItem, { ...restProps });
+    return React.createElement(InternalNavItem, { eventKey: eventKey, ...restProps });
 });
 if (process.env.NODE_ENV !== 'production') {
     Item.displayName = 'Nav.Item';

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@broxus/react-uikit",
-    "version": "0.19.1",
+    "version": "0.19.3",
     "description": "React-based UIkit library",
     "license": "AGPL-3.0",
     "keywords": [
@@ -86,5 +86,5 @@
         "react": "^16.8.0 || ^17.x || ^18.x || ^19.x",
         "react-dom": "^16.8.0 || ^17.x || ^18.x || ^19.x"
     },
-    "gitHead": "d091e088f131687948aefc881707b5df1c3890d9"
+    "gitHead": "a22b1ebc71b696ca5d2a3caa114b0926805baf5c"
 }