@ringcentral/spring-base 1.12.0 → 1.13.0

package/config.js

@@ -1,15 +1,31 @@
-const SPRING_WARNING_IGNORE_KEY = '__SPRING_WARNING_IGNORE__';
-let rcConfiguration = {};
+// TODO: refactor config
+/* oxlint-disable no-console */ const SPRING_WARNING_IGNORE_KEY = '__SPRING_WARNING_IGNORE__';
+// * use that way to avoid that code be exist in production code base
+/**
+ * config global setting
+ *
+ * ```ts
+ * configure({
+ *   warning: false
+ * })
+ * ```
+ * ## WARNING related method and  only work in `development mode`
+ *
+ * `WARNING_IGNORE`:  only work in `development mode`
+ * `WARNING_FUNCTION` only work in `development mode`
+ */ let rcConfiguration = {};
 if (process.env.NODE_ENV !== 'production') {
     class RcConfig {
-        _WARNING_IGNORE = false;
-        _WARNING_FUNCTION = (message, options) => {
-            console[options?.level || 'warn'](message);
-        };
-        constructor() {
+        constructor(){
+            this._WARNING_IGNORE = false;
+            this._WARNING_FUNCTION = (message, options)=>{
+                console[options?.level || 'warn'](message);
+            };
             if (typeof window !== 'undefined') {
-                this._WARNING_IGNORE =
-                    window?.localStorage?.getItem(SPRING_WARNING_IGNORE_KEY) === 'true';
+                // SSR support
+                // * get value once when init
+                this._WARNING_IGNORE = window?.localStorage?.getItem(SPRING_WARNING_IGNORE_KEY) === 'true';
+                // * also provide user to set variable from window
                 window.__SPRING__ = this;
             }
         }
@@ -28,8 +44,7 @@ if (process.env.NODE_ENV !== 'production') {
         set WARNING_FUNCTION(func) {
             if (typeof func === 'function') {
                 this._WARNING_FUNCTION = func;
-            }
-            else {
+            } else {
                 console.warn('[Spring] config warningFunction is not a function.');
             }
         }
@@ -39,7 +54,11 @@ if (process.env.NODE_ENV !== 'production') {
     }
     rcConfiguration = new RcConfig();
 }
-const configure = (options) => {
+/**
+ * set config with Spring
+ *
+ * ## WARNING method only work in `development mode`
+ */ const configure = (options)=>{
     if (process.env.NODE_ENV !== 'production') {
         const { warning, warningFunction } = options;
         if (warning !== undefined) {
@@ -51,4 +70,5 @@ const configure = (options) => {
     }
 };
 
+
 export { configure, rcConfiguration };

package/contexts.js

@@ -1,70 +1,88 @@
-import { createContext, useContext } from 'react';
+import { createContext, useContext } from "react";
+
+
 
 const WindowContext = createContext({
-    document: typeof window !== 'undefined'
-        ? window.document
-        : globalThis.window?.document
-            ? globalThis.window.document
-            : undefined,
+    document: typeof window !== 'undefined' ? window.document : globalThis.window?.document ? globalThis.window.document : undefined,
     globalThis: globalThis,
-    externalWindow: typeof window !== 'undefined' ? window : globalThis.window,
+    externalWindow: typeof window !== 'undefined' ? window : globalThis.window
 });
-const useWindowContext = () => useContext(WindowContext);
+const useWindowContext = ()=>useContext(WindowContext);
+
+
+/** small to large */ const breakpointList = [
+    'xs',
+    'sm',
+    'md',
+    'lg',
+    'xl'
+];
 
-const breakpointList = ['xs', 'sm', 'md', 'lg', 'xl'];
 
 const matchCache = new Map();
-const getMatchGroups = (breakpoint) => {
+const getMatchGroups = (breakpoint)=>{
     const ltMatchGroup = [];
     const gtMatchGroup = [];
     if (breakpoint === null) {
-        for (let i = 0; i < breakpointList.length; i++) {
+        for(let i = 0; i < breakpointList.length; i++){
             ltMatchGroup.push(`lt-${breakpointList[i]}`);
         }
-    }
-    else {
+    } else {
         const bpIndex = breakpointList.indexOf(breakpoint);
-        for (let i = 0; i < bpIndex; i++) {
+        for(let i = 0; i < bpIndex; i++){
             gtMatchGroup.unshift(`gt-${breakpointList[i]}`);
         }
-        for (let i = bpIndex + 1; i < breakpointList.length; i++) {
+        for(let i = bpIndex + 1; i < breakpointList.length; i++){
             ltMatchGroup.push(`lt-${breakpointList[i]}`);
         }
     }
-    return { ltMatchGroup, gtMatchGroup };
+    return {
+        ltMatchGroup,
+        gtMatchGroup
+    };
 };
-const getMatchMap = ({ ltMatchGroup, gtMatchGroup }, matchBP) => {
+const getMatchMap = ({ ltMatchGroup, gtMatchGroup }, matchBP)=>{
     const matchMap = {};
-    if (matchBP !== null)
-        matchMap[matchBP] = true;
-    for (const ltBP of ltMatchGroup) {
+    if (matchBP !== null) matchMap[matchBP] = true;
+    for (const ltBP of ltMatchGroup){
         const [, bp] = ltBP.split('-');
         matchMap[`lt${bp.toUpperCase()}`] = true;
         matchMap[ltBP] = true;
     }
-    for (const gtBP of gtMatchGroup) {
+    for (const gtBP of gtMatchGroup){
         const [, bp] = gtBP.split('-');
         matchMap[`gt${bp.toUpperCase()}`] = true;
         matchMap[gtBP] = true;
     }
     return matchMap;
 };
-const getMatchDetail = (breakpoint) => {
+const getMatchDetail = (breakpoint)=>{
     if (!matchCache.has(breakpoint)) {
         const matchGroups = getMatchGroups(breakpoint);
         const matchMap = getMatchMap(matchGroups, breakpoint);
         matchCache.set(breakpoint, {
             ...matchGroups,
             matchBP: breakpoint,
-            matchMap,
+            matchMap
         });
     }
     return matchCache.get(breakpoint);
 };
 
+
+
 const RcResponsiveContext = createContext(undefined);
-const useResponsiveContext = () => {
+const useResponsiveContext = ()=>{
     return useContext(RcResponsiveContext);
 };
 
+
+
+
+
+
+
+
+
+
 export { RcResponsiveContext, WindowContext, breakpointList, getMatchDetail, useResponsiveContext, useWindowContext };