@ringcentral/spring-base 1.7.0 → 1.8.0

package/chunks/twMerge.js

@@ -6,27 +6,19 @@ import { extendTailwindMerge } from 'tailwind-merge';
 
 const ownerWindow = unstable_ownerWindow;
 
-// Copy from https://github.com/adobe/react-spectrum/blob/main/packages/%40react-aria/overlays/src/ariaHideOutside.ts
-// And support multiple window
 const ARIA_HIDDEN = 'aria-hidden';
 const REF_COUNT_MAP = '__SUI_ARIA_HIDE_OUTSIDE_REF_COUNT_MAP__';
 const getRefCountMap = (window) => {
-    // @ts-ignore
     if (!window[REF_COUNT_MAP]) {
-        // @ts-ignore
         window[REF_COUNT_MAP] = new WeakMap();
     }
-    // @ts-ignore
     return window[REF_COUNT_MAP];
 };
 const OBSERVER_STACK = '__SUI_ARIA_HIDE_OUTSIDE_OBSERVER_STACK__';
 const getObserverStack = (window) => {
-    // @ts-ignore
     if (!window[OBSERVER_STACK]) {
-        // @ts-ignore
         window[OBSERVER_STACK] = [];
     }
-    // @ts-ignore
     return window[OBSERVER_STACK];
 };
 const isHTMLOrSVGElement = (node) => {
@@ -35,45 +27,27 @@ const isHTMLOrSVGElement = (node) => {
 const isElement = (node) => {
     return node.nodeType === Node.ELEMENT_NODE;
 };
-/**
- * Hides all elements in the DOM outside the given targets from screen readers using aria-hidden,
- * and returns a function to revert these changes. In addition, changes to the DOM are watched
- * and new elements outside the targets are automatically hidden.
- * @param targets - The elements that should remain visible.
- * @param root - Nothing will be hidden above this element.
- * @returns - A function to restore all hidden elements.
- */
 const ariaHideOutside = (targets, root = document.body) => {
     const currentWindow = ownerWindow(root);
     if (!currentWindow) {
-        // Current JS environment doesn't have a window object, do nothing.
-        // eslint-disable-next-line @typescript-eslint/no-empty-function
         return () => { };
     }
     const visibleNodes = new Set(targets);
     const hiddenNodes = new Set();
-    // Keeps a ref count of all hidden elements. Added to when hiding an element, and
-    // subtracted from when showing it again. When it reaches zero, aria-hidden is removed.
     const refCountMap = getRefCountMap(currentWindow);
     const observerStack = getObserverStack(currentWindow);
     const walker = currentWindow.document.createTreeWalker(root, NodeFilter.SHOW_ELEMENT, {
         acceptNode(node) {
-            // If this node is a live announcer, add it to the set of nodes to keep visible.
             if (isHTMLOrSVGElement(node) &&
                 node.dataset['liveAnnouncer'] === 'true') {
                 visibleNodes.add(node);
             }
-            // Skip this node and its children if it is one of the target nodes, or a live announcer.
-            // Also skip children of already hidden nodes, as aria-hidden is recursive. An exception is
-            // made for elements with role="row" since VoiceOver on iOS has issues hiding elements with role="row".
-            // For that case we want to hide the cells inside as well (https://bugs.webkit.org/show_bug.cgi?id=222623).
             if (visibleNodes.has(node) ||
                 (node.parentElement &&
                     hiddenNodes.has(node.parentElement) &&
                     node.parentElement.getAttribute('role') !== 'row')) {
                 return NodeFilter.FILTER_REJECT;
             }
-            // Skip this node but continue to children if one of the targets is inside the node.
             if (targets.some((target) => node.contains(target))) {
                 return NodeFilter.FILTER_SKIP;
             }
@@ -82,8 +56,6 @@ const ariaHideOutside = (targets, root = document.body) => {
     });
     const hide = (node) => {
         const refCount = refCountMap.get(node) ?? 0;
-        // If already aria-hidden, and the ref count is zero, then this element
-        // was already hidden and there's nothing for us to do.
         if (node.getAttribute(ARIA_HIDDEN) === 'true' && refCount === 0) {
             return;
         }
@@ -93,8 +65,6 @@ const ariaHideOutside = (targets, root = document.body) => {
         hiddenNodes.add(node);
         refCountMap.set(node, refCount + 1);
     };
-    // If there is already a MutationObserver listening from a previous call,
-    // disconnect it so the new on takes over.
     if (observerStack.length) {
         observerStack[observerStack.length - 1].disconnect();
     }
@@ -108,8 +78,6 @@ const ariaHideOutside = (targets, root = document.body) => {
             if (change.type !== 'childList' || change.addedNodes.length === 0) {
                 continue;
             }
-            // If the parent element of the added nodes is not within one of the targets,
-            // and not already inside a hidden node, hide all of the new children.
             if (![...visibleNodes, ...hiddenNodes].some((node) => node.contains(change.target))) {
                 for (const node of change.addedNodes) {
                     if (isHTMLOrSVGElement(node) &&
@@ -145,7 +113,6 @@ const ariaHideOutside = (targets, root = document.body) => {
                 refCountMap.set(node, count - 1);
             }
         }
-        // Remove this observer from the stack, and start the previous one.
         if (observerWrapper === observerStack[observerStack.length - 1]) {
             observerStack.pop();
             if (observerStack.length) {
@@ -158,99 +125,11 @@ const ariaHideOutside = (targets, root = document.body) => {
     };
 };
 
-/**
- * Combine props object together
- *
- * that will group className, classes together
- * function will auto combine together,
- * trigger order is `intoProps.someFn(e) => defaultProps.someFn(e)`
- *
- * @param baseProps base props you want to combine together
- * @param newProps want to combine in to props
- * @param coverPropKeys some prop key you want to cover, not combine when type is function, ex. `ComponentType`
- *
- *
- * @example
- * ```tsx
- * combineProps(
-    {
-      children: <A />,
-      value: '1',
-      className: 'a1',
-      classes: {
-        root: 'root1'
-      },
-      count: 1,
-      size: 'large',
-      onClick: fn1
-    },
-    {
-      children: <B />,
-      value: '2',
-      className: 'a2',
-      classes: {
-        root: 'root2'
-      },
-      count: 2,
-      size: undefined,
-      onClick: fn2
-    },
-  )
-  // output result:
-  {
-    children: <B />,
-    value: '2',
-    className: 'a1 a2',
-    classes: {
-      root: 'root1 root2'
-    },
-    count: 2,
-    size: 'large',
-    onClick: (e) => {
-      fn2(e);
-      fn1(e);
-    }
-  }
- * ```
- */
 const combineProps = (baseProps, newProps, coverPropKeys) => innerCombineProps({
     baseProps,
     newProps,
     coverPropKeys,
 });
-/**
- * Combine two classes
- *
- * @param baseClasses base classes you want to combine together
- * @param newClasses new classes want to combine in to props
- *
- * @example
- * ```ts
- * combineClasses(
-    {
-      root: 'a1',
-      input: 'a1',
-      un1: undefined,
-      un2: 'a4',
-    },
-    {
-      root: 'a1',
-      input: 'a2',
-      un1: 'a3',
-      un2: undefined,
-      un3: 'a5',
-    },
-  )
-  // output result:
-  {
-    root: 'a1 a1',
-    input: 'a1 a2',
-    un1: 'a3',
-    un2: 'a4',
-    un3: 'a5',
-  }
- * ```
- */
 const combineClasses = (baseClasses, newClasses) => innerCombineProps({
     baseProps: baseClasses,
     newProps: newClasses,
@@ -272,8 +151,6 @@ function mergeChildProps({ baseProps, newProps, combineAllString, coverPropKeys,
         const prop = baseProps[curr];
         const propTo = newProps[curr];
         if (propTo !== undefined) {
-            // * all typeof type below
-            // "string" | "number" | "bigint" | "boolean" | "symbol" | "undefined" | "object" | "function"
             switch (typeof prop) {
                 case 'undefined':
                     output[curr] = propTo;
@@ -316,7 +193,6 @@ function mergeChildProps({ baseProps, newProps, combineAllString, coverPropKeys,
                     }
                     else {
                         output[curr] = (...args) => {
-                            // * exec outside first
                             propTo?.(...args);
                             prop?.(...args);
                         };
@@ -329,7 +205,6 @@ function mergeChildProps({ baseProps, newProps, combineAllString, coverPropKeys,
         }
         return output;
     }, {});
-    // if result is an empty {} reset that to undefined
     if (Object.keys(result).length === 0) {
         return undefined;
     }
@@ -339,7 +214,6 @@ function mergeChildProps({ baseProps, newProps, combineAllString, coverPropKeys,
     };
 }
 
-/* eslint-disable no-console */
 function logInDev({ scope, message, level = 'warn', condition = true, }) {
     if (process.env.NODE_ENV !== 'production' &&
         condition &&
@@ -356,9 +230,6 @@ const isRef = (obj) => {
     return obj && 'current' in obj;
 };
 
-/**
- * get element from React ref or callback
- */
 const getRefElement = (ref) => {
     if (typeof ref === 'function') {
         return ref();
@@ -366,13 +237,9 @@ const getRefElement = (ref) => {
     if (typeof ref === 'object' && isRef(ref)) {
         return ref.current;
     }
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     return ref;
 };
 
-/**
- * Merge tailwind classes with additional class groups for spring-ui
- */
 const twMerge = extendTailwindMerge({
     extend: {
         classGroups: {

package/config.js

@@ -1,20 +1,4 @@
-// TODO: refactor config
-/* eslint-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 {
@@ -24,11 +8,8 @@ if (process.env.NODE_ENV !== 'production') {
         };
         constructor() {
             if (typeof window !== 'undefined') {
-                // 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;
             }
         }
@@ -58,11 +39,6 @@ if (process.env.NODE_ENV !== 'production') {
     }
     rcConfiguration = new RcConfig();
 }
-/**
- * set config with Spring
- *
- * ## WARNING method only work in `development mode`
- */
 const configure = (options) => {
     if (process.env.NODE_ENV !== 'production') {
         const { warning, warningFunction } = options;

package/contexts.js

@@ -11,7 +11,6 @@ const WindowContext = createContext({
 });
 const useWindowContext = () => useContext(WindowContext);
 
-/** small to large */
 const breakpointList = ['xs', 'sm', 'md', 'lg', 'xl'];
 
 const matchCache = new Map();