@lumx/react 3.10.1-alpha.6 → 3.10.1-alpha.8

package/src/utils/{flattenChildren.ts → react/flattenChildren.ts}

@@ -1,4 +1,5 @@
-import { Children, Key, ReactChild, ReactNode, cloneElement, isValidElement, ReactElement } from 'react';
+import get from 'lodash/get';
+import { Children, Key, ReactChild, ReactNode, cloneElement, isValidElement } from 'react';
 import { isFragment } from 'react-is';
 
 /**
@@ -16,7 +17,7 @@ import { isFragment } from 'react-is';
 export function flattenChildren(children: ReactNode) {
     function recur(nodes: ReactNode, keys: Key[] = []) {
         return Children.toArray(nodes).reduce((acc: ReactChild[], node, index) => {
-            const nodeKeys = keys.concat((node as ReactElement)?.key ?? index);
+            const nodeKeys = keys.concat(get(node, 'key') ?? index);
             if (isFragment(node)) {
                 acc.push(...recur(node.props.children, nodeKeys));
             } else if (isValidElement(node)) {

package/src/utils/{renderButtonOrLink.tsx → react/renderButtonOrLink.tsx}

@@ -1,5 +1,5 @@
 import React, { ReactElement, ReactNode } from 'react';
-import { renderLink } from '@lumx/react/utils/renderLink';
+import { renderLink } from './renderLink';
 
 interface Props {
     linkAs?: any;

package/src/utils/{skipRender.tsx → react/skipRender.tsx}

@@ -1,5 +1,5 @@
 import { DOCUMENT } from '@lumx/react/constants';
-import { Comp } from '@lumx/react/utils/type';
+import type { Comp } from '@lumx/react/utils/type';
 import React from 'react';
 
 /**

package/src/utils/type/index.ts

@@ -1,19 +1,19 @@
-export { Callback } from './Callback';
-export { Comp } from './Comp';
-export { ComponentRef } from './ComponentRef';
-export { Falsy } from './Falsy';
-export { GenericProps } from './GenericProps';
-export { HasAriaLabelOrLabelledBy } from './HasAriaLabelOrLabelledBy';
-export { HasClassName } from './HasClassName';
-export { HasCloseMode } from './HasCloseMode';
-export { HasPolymorphicAs } from './HasPolymorphicAs';
-export { HasTheme } from './HasTheme';
-export { HeadingElement } from './HeadingElement';
+export type { Callback } from './Callback';
+export type { Comp } from './Comp';
+export type { ComponentRef } from './ComponentRef';
+export type { Falsy } from './Falsy';
+export type { GenericProps } from './GenericProps';
+export type { HasAriaLabelOrLabelledBy } from './HasAriaLabelOrLabelledBy';
+export type { HasClassName } from './HasClassName';
+export type { HasCloseMode } from './HasCloseMode';
+export type { HasPolymorphicAs } from './HasPolymorphicAs';
+export type { HasTheme } from './HasTheme';
+export type { HeadingElement } from './HeadingElement';
+export { isComponent } from './isComponent';
 export { isComponentType } from './isComponentType';
-export { MaybeElementOrRef } from './MaybeElementOrRef';
-export { Point } from './Point';
-export { Predicate } from './Predicate';
-export { RectSize } from './RectSize';
-export { TextElement } from './TextElement';
-export { ValueOf } from './ValueOf';
-export { ComponentClassName } from './ComponentClassName';
+export type { MaybeElementOrRef } from './MaybeElementOrRef';
+export type { Point } from './Point';
+export type { Predicate } from './Predicate';
+export type { RectSize } from './RectSize';
+export type { TextElement } from './TextElement';
+export type { ValueOf } from './ValueOf';

package/src/utils/type/isComponent.ts

@@ -0,0 +1,33 @@
+import type { ReactElement, ReactNode } from 'react';
+import get from 'lodash/get';
+import type { Comp } from './Comp';
+
+/**
+ * Properties of a component to use to determine it's name.
+ * In the order of preference.
+ */
+const NAME_PROPERTIES: string[] = [
+    'type',
+    'type.displayName',
+    'displayName',
+    'name',
+    'type.name',
+    'props.mdxType',
+    '_reactInternalFiber.elementType.name',
+];
+/**
+ * Create a predicate function that checks if a ReactNode is a react element from the given component.
+ *
+ * @param  component React function component or the component name
+ * @return predicate returning true if value is instance of the component
+ */
+export const isComponent =
+    <C>(component: Comp<C, any> | string) =>
+    (instance: ReactNode): instance is ReactElement => {
+        const componentName = typeof component === 'string' ? component : component.displayName;
+
+        return (
+            !!get(instance, '$$typeof') &&
+            NAME_PROPERTIES.some((nameProperty: string): boolean => get(instance, nameProperty) === componentName)
+        );
+    };

package/utils/index.d.ts

@@ -17,6 +17,10 @@ interface ClickAwayProviderProps extends ClickAwayParameters {
      * (Optional) Element that should be considered as part of the parent
      */
     parentRef?: RefObject<HTMLElement>;
+    /**
+     * Children
+     */
+    children?: React.ReactNode;
 }
 /**
  * Component combining the `useClickAway` hook with a React context to hook into the React component tree and make sure

package/utils/index.js

@@ -1,2 +1,97 @@
-export { C as ClickAwayProvider } from '../_internal/index.js';
+import React__default, { useEffect, useContext, useMemo, useRef, createContext } from 'react';
+import isEmpty from 'lodash/isEmpty';
+
+const EVENT_TYPES = ['mousedown', 'touchstart'];
+function isClickAway(target, refs) {
+  // The target element is not contained in any of the listed element references.
+  return !refs.some(e => {
+    var _e$current;
+    return e === null || e === void 0 ? void 0 : (_e$current = e.current) === null || _e$current === void 0 ? void 0 : _e$current.contains(target);
+  });
+}
+/**
+ * Listen to clicks away from the given elements and callback the passed in function.
+ *
+ * Warning: If you need to detect click away on nested React portals, please use the `ClickAwayProvider` component.
+ */
+function useClickAway(_ref) {
+  let {
+    callback,
+    childrenRefs
+  } = _ref;
+  useEffect(() => {
+    const {
+      current: currentRefs
+    } = childrenRefs;
+    if (!callback || !currentRefs || isEmpty(currentRefs)) {
+      return undefined;
+    }
+    const listener = evt => {
+      if (isClickAway(evt.target, currentRefs)) {
+        callback(evt);
+      }
+    };
+    EVENT_TYPES.forEach(evtType => document.addEventListener(evtType, listener));
+    return () => {
+      EVENT_TYPES.forEach(evtType => document.removeEventListener(evtType, listener));
+    };
+  }, [callback, childrenRefs]);
+}
+
+const ClickAwayAncestorContext = /*#__PURE__*/createContext(null);
+/**
+ * Component combining the `useClickAway` hook with a React context to hook into the React component tree and make sure
+ * we take into account both the DOM tree and the React tree to detect click away.
+ *
+ * @return the react component.
+ */
+const ClickAwayProvider = _ref => {
+  let {
+    children,
+    callback,
+    childrenRefs,
+    parentRef
+  } = _ref;
+  const parentContext = useContext(ClickAwayAncestorContext);
+  const currentContext = useMemo(() => {
+    const context = {
+      childrenRefs: [],
+      /**
+       * Add element refs to the current context and propagate to the parent context.
+       */
+      addRefs() {
+        // Add element refs that should be considered as inside the click away context.
+        context.childrenRefs.push(...arguments);
+        if (parentContext) {
+          // Also add then to the parent context
+          parentContext.addRefs(...arguments);
+          if (parentRef) {
+            // The parent element is also considered as inside the parent click away context but not inside the current context
+            parentContext.addRefs(parentRef);
+          }
+        }
+      }
+    };
+    return context;
+  }, [parentContext, parentRef]);
+  useEffect(() => {
+    const {
+      current: currentRefs
+    } = childrenRefs;
+    if (!currentRefs) {
+      return;
+    }
+    currentContext.addRefs(...currentRefs);
+  }, [currentContext, childrenRefs]);
+  useClickAway({
+    callback,
+    childrenRefs: useRef(currentContext.childrenRefs)
+  });
+  return /*#__PURE__*/React__default.createElement(ClickAwayAncestorContext.Provider, {
+    value: currentContext
+  }, children);
+};
+ClickAwayProvider.displayName = 'ClickAwayProvider';
+
+export { ClickAwayProvider };
 //# sourceMappingURL=index.js.map

package/utils/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
+{"version":3,"file":"index.js","sources":["../../src/hooks/useClickAway.tsx","../../src/utils/ClickAwayProvider/ClickAwayProvider.tsx"],"sourcesContent":["import { RefObject, useEffect } from 'react';\n\nimport { Falsy } from '@lumx/react/utils/type';\n\nimport isEmpty from 'lodash/isEmpty';\n\nconst EVENT_TYPES = ['mousedown', 'touchstart'];\n\nfunction isClickAway(target: HTMLElement, refs: Array<RefObject<HTMLElement>>): boolean {\n    // The target element is not contained in any of the listed element references.\n    return !refs.some((e) => e?.current?.contains(target));\n}\n\nexport interface ClickAwayParameters {\n    /**\n     * A callback function to call when the user clicks away from the elements.\n     */\n    callback: EventListener | Falsy;\n    /**\n     * Elements considered within the click away context (clicking outside them will trigger the click away callback).\n     */\n    childrenRefs: RefObject<Array<RefObject<HTMLElement>>>;\n}\n\n/**\n * Listen to clicks away from the given elements and callback the passed in function.\n *\n * Warning: If you need to detect click away on nested React portals, please use the `ClickAwayProvider` component.\n */\nexport function useClickAway({ callback, childrenRefs }: ClickAwayParameters): void {\n    useEffect(() => {\n        const { current: currentRefs } = childrenRefs;\n        if (!callback || !currentRefs || isEmpty(currentRefs)) {\n            return undefined;\n        }\n        const listener: EventListener = (evt) => {\n            if (isClickAway(evt.target as HTMLElement, currentRefs)) {\n                callback(evt);\n            }\n        };\n\n        EVENT_TYPES.forEach((evtType) => document.addEventListener(evtType, listener));\n        return () => {\n            EVENT_TYPES.forEach((evtType) => document.removeEventListener(evtType, listener));\n        };\n    }, [callback, childrenRefs]);\n}\n","import React, { createContext, RefObject, useContext, useEffect, useMemo, useRef } from 'react';\nimport { ClickAwayParameters, useClickAway } from '@lumx/react/hooks/useClickAway';\n\ninterface ContextValue {\n    childrenRefs: Array<RefObject<HTMLElement>>;\n    addRefs(...newChildrenRefs: Array<RefObject<HTMLElement>>): void;\n}\n\nconst ClickAwayAncestorContext = createContext<ContextValue | null>(null);\n\ninterface ClickAwayProviderProps extends ClickAwayParameters {\n    /**\n     * (Optional) Element that should be considered as part of the parent\n     */\n    parentRef?: RefObject<HTMLElement>;\n    /**\n     * Children\n     */\n    children?: React.ReactNode;\n}\n\n/**\n * Component combining the `useClickAway` hook with a React context to hook into the React component tree and make sure\n * we take into account both the DOM tree and the React tree to detect click away.\n *\n * @return the react component.\n */\nexport const ClickAwayProvider: React.FC<ClickAwayProviderProps> = ({\n    children,\n    callback,\n    childrenRefs,\n    parentRef,\n}) => {\n    const parentContext = useContext(ClickAwayAncestorContext);\n    const currentContext = useMemo(() => {\n        const context: ContextValue = {\n            childrenRefs: [],\n            /**\n             * Add element refs to the current context and propagate to the parent context.\n             */\n            addRefs(...newChildrenRefs) {\n                // Add element refs that should be considered as inside the click away context.\n                context.childrenRefs.push(...newChildrenRefs);\n\n                if (parentContext) {\n                    // Also add then to the parent context\n                    parentContext.addRefs(...newChildrenRefs);\n                    if (parentRef) {\n                        // The parent element is also considered as inside the parent click away context but not inside the current context\n                        parentContext.addRefs(parentRef);\n                    }\n                }\n            },\n        };\n        return context;\n    }, [parentContext, parentRef]);\n\n    useEffect(() => {\n        const { current: currentRefs } = childrenRefs;\n        if (!currentRefs) {\n            return;\n        }\n        currentContext.addRefs(...currentRefs);\n    }, [currentContext, childrenRefs]);\n\n    useClickAway({ callback, childrenRefs: useRef(currentContext.childrenRefs) });\n    return <ClickAwayAncestorContext.Provider value={currentContext}>{children}</ClickAwayAncestorContext.Provider>;\n};\nClickAwayProvider.displayName = 'ClickAwayProvider';\n"],"names":["EVENT_TYPES","isClickAway","target","refs","some","e","_e$current","current","contains","useClickAway","_ref","callback","childrenRefs","useEffect","currentRefs","isEmpty","undefined","listener","evt","forEach","evtType","document","addEventListener","removeEventListener","ClickAwayAncestorContext","createContext","ClickAwayProvider","children","parentRef","parentContext","useContext","currentContext","useMemo","context","addRefs","push","arguments","useRef","React","createElement","Provider","value","displayName"],"mappings":"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"}

package/_internal/index.js

@@ -1,99 +0,0 @@
-import React__default, { useEffect, useContext, useMemo, useRef, createContext } from 'react';
-
-/** Check if object or array is empty (true on falsy values) */
-const isEmpty = obj => !obj || Object.entries(obj).length === 0;
-
-const EVENT_TYPES = ['mousedown', 'touchstart'];
-function isClickAway(target, refs) {
-  // The target element is not contained in any of the listed element references.
-  return !refs.some(e => {
-    var _e$current;
-    return e === null || e === void 0 ? void 0 : (_e$current = e.current) === null || _e$current === void 0 ? void 0 : _e$current.contains(target);
-  });
-}
-/**
- * Listen to clicks away from the given elements and callback the passed in function.
- *
- * Warning: If you need to detect click away on nested React portals, please use the `ClickAwayProvider` component.
- */
-function useClickAway(_ref) {
-  let {
-    callback,
-    childrenRefs
-  } = _ref;
-  useEffect(() => {
-    const {
-      current: currentRefs
-    } = childrenRefs;
-    if (!callback || !currentRefs || isEmpty(currentRefs)) {
-      return undefined;
-    }
-    const listener = evt => {
-      if (isClickAway(evt.target, currentRefs)) {
-        callback(evt);
-      }
-    };
-    EVENT_TYPES.forEach(evtType => document.addEventListener(evtType, listener));
-    return () => {
-      EVENT_TYPES.forEach(evtType => document.removeEventListener(evtType, listener));
-    };
-  }, [callback, childrenRefs]);
-}
-
-const ClickAwayAncestorContext = /*#__PURE__*/createContext(null);
-/**
- * Component combining the `useClickAway` hook with a React context to hook into the React component tree and make sure
- * we take into account both the DOM tree and the React tree to detect click away.
- *
- * @return the react component.
- */
-const ClickAwayProvider = _ref => {
-  let {
-    children,
-    callback,
-    childrenRefs,
-    parentRef
-  } = _ref;
-  const parentContext = useContext(ClickAwayAncestorContext);
-  const currentContext = useMemo(() => {
-    const context = {
-      childrenRefs: [],
-      /**
-       * Add element refs to the current context and propagate to the parent context.
-       */
-      addRefs() {
-        // Add element refs that should be considered as inside the click away context.
-        context.childrenRefs.push(...arguments);
-        if (parentContext) {
-          // Also add then to the parent context
-          parentContext.addRefs(...arguments);
-          if (parentRef) {
-            // The parent element is also considered as inside the parent click away context but not inside the current context
-            parentContext.addRefs(parentRef);
-          }
-        }
-      }
-    };
-    return context;
-  }, [parentContext, parentRef]);
-  useEffect(() => {
-    const {
-      current: currentRefs
-    } = childrenRefs;
-    if (!currentRefs) {
-      return;
-    }
-    currentContext.addRefs(...currentRefs);
-  }, [currentContext, childrenRefs]);
-  useClickAway({
-    callback,
-    childrenRefs: useRef(currentContext.childrenRefs)
-  });
-  return /*#__PURE__*/React__default.createElement(ClickAwayAncestorContext.Provider, {
-    value: currentContext
-  }, children);
-};
-ClickAwayProvider.displayName = 'ClickAwayProvider';
-
-export { ClickAwayProvider as C, isEmpty as i };
-//# sourceMappingURL=index.js.map

package/_internal/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":["../../src/utils/collection/isEmpty.ts","../../src/hooks/useClickAway.tsx","../../src/utils/ClickAwayProvider/ClickAwayProvider.tsx"],"sourcesContent":["import { Falsy } from '../type';\n\n/** Check if object or array is empty (true on falsy values) */\nexport const isEmpty = (obj: object | Falsy) => !obj || Object.entries(obj).length === 0;\n","import { RefObject, useEffect } from 'react';\n\nimport { Falsy } from '@lumx/react/utils/type';\nimport { isEmpty } from '@lumx/react/utils/collection/isEmpty';\n\nconst EVENT_TYPES = ['mousedown', 'touchstart'];\n\nfunction isClickAway(target: HTMLElement, refs: Array<RefObject<HTMLElement>>): boolean {\n    // The target element is not contained in any of the listed element references.\n    return !refs.some((e) => e?.current?.contains(target));\n}\n\nexport interface ClickAwayParameters {\n    /**\n     * A callback function to call when the user clicks away from the elements.\n     */\n    callback: EventListener | Falsy;\n    /**\n     * Elements considered within the click away context (clicking outside them will trigger the click away callback).\n     */\n    childrenRefs: RefObject<Array<RefObject<HTMLElement>>>;\n}\n\n/**\n * Listen to clicks away from the given elements and callback the passed in function.\n *\n * Warning: If you need to detect click away on nested React portals, please use the `ClickAwayProvider` component.\n */\nexport function useClickAway({ callback, childrenRefs }: ClickAwayParameters): void {\n    useEffect(() => {\n        const { current: currentRefs } = childrenRefs;\n        if (!callback || !currentRefs || isEmpty(currentRefs)) {\n            return undefined;\n        }\n        const listener: EventListener = (evt) => {\n            if (isClickAway(evt.target as HTMLElement, currentRefs)) {\n                callback(evt);\n            }\n        };\n\n        EVENT_TYPES.forEach((evtType) => document.addEventListener(evtType, listener));\n        return () => {\n            EVENT_TYPES.forEach((evtType) => document.removeEventListener(evtType, listener));\n        };\n    }, [callback, childrenRefs]);\n}\n","import React, { createContext, RefObject, useContext, useEffect, useMemo, useRef } from 'react';\nimport { ClickAwayParameters, useClickAway } from '@lumx/react/hooks/useClickAway';\n\ninterface ContextValue {\n    childrenRefs: Array<RefObject<HTMLElement>>;\n    addRefs(...newChildrenRefs: Array<RefObject<HTMLElement>>): void;\n}\n\nconst ClickAwayAncestorContext = createContext<ContextValue | null>(null);\n\ninterface ClickAwayProviderProps extends ClickAwayParameters {\n    /**\n     * (Optional) Element that should be considered as part of the parent\n     */\n    parentRef?: RefObject<HTMLElement>;\n}\n\n/**\n * Component combining the `useClickAway` hook with a React context to hook into the React component tree and make sure\n * we take into account both the DOM tree and the React tree to detect click away.\n *\n * @return the react component.\n */\nexport const ClickAwayProvider: React.FC<ClickAwayProviderProps> = ({\n    children,\n    callback,\n    childrenRefs,\n    parentRef,\n}) => {\n    const parentContext = useContext(ClickAwayAncestorContext);\n    const currentContext = useMemo(() => {\n        const context: ContextValue = {\n            childrenRefs: [],\n            /**\n             * Add element refs to the current context and propagate to the parent context.\n             */\n            addRefs(...newChildrenRefs) {\n                // Add element refs that should be considered as inside the click away context.\n                context.childrenRefs.push(...newChildrenRefs);\n\n                if (parentContext) {\n                    // Also add then to the parent context\n                    parentContext.addRefs(...newChildrenRefs);\n                    if (parentRef) {\n                        // The parent element is also considered as inside the parent click away context but not inside the current context\n                        parentContext.addRefs(parentRef);\n                    }\n                }\n            },\n        };\n        return context;\n    }, [parentContext, parentRef]);\n\n    useEffect(() => {\n        const { current: currentRefs } = childrenRefs;\n        if (!currentRefs) {\n            return;\n        }\n        currentContext.addRefs(...currentRefs);\n    }, [currentContext, childrenRefs]);\n\n    useClickAway({ callback, childrenRefs: useRef(currentContext.childrenRefs) });\n    return <ClickAwayAncestorContext.Provider value={currentContext}>{children}</ClickAwayAncestorContext.Provider>;\n};\nClickAwayProvider.displayName = 'ClickAwayProvider';\n"],"names":["isEmpty","obj","Object","entries","length","EVENT_TYPES","isClickAway","target","refs","some","e","_e$current","current","contains","useClickAway","_ref","callback","childrenRefs","useEffect","currentRefs","undefined","listener","evt","forEach","evtType","document","addEventListener","removeEventListener","ClickAwayAncestorContext","createContext","ClickAwayProvider","children","parentRef","parentContext","useContext","currentContext","useMemo","context","addRefs","push","arguments","useRef","React","createElement","Provider","value","displayName"],"mappings":"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"}

package/src/utils/collection/castArray.test.ts

@@ -1,15 +0,0 @@
-import { castArray } from '@lumx/react/utils/collection/castArray';
-
-describe(castArray, () => {
-    it('should keep existing array', () => {
-        const input = [1, 2];
-        const output = castArray(input);
-        expect(output).toEqual([1, 2]);
-        expect(output).toBe(input);
-    });
-    it('should cast item to array', () => {
-        const input = 1;
-        const output = castArray(input);
-        expect(output).toEqual([1]);
-    });
-});

package/src/utils/collection/castArray.ts

@@ -1,3 +0,0 @@
-/** Cast a value into an array if needed */
-export const castArray = <T>(arrayOrElement: T[] | T) =>
-    Array.isArray(arrayOrElement) ? arrayOrElement : [arrayOrElement];

package/src/utils/collection/chunk.test.ts

@@ -1,15 +0,0 @@
-import { chunk } from '@lumx/react/utils/collection/chunk';
-
-describe(chunk, () => {
-    it('should do nothing on empty array', () => {
-        expect(chunk([], 2)).toEqual([]);
-    });
-
-    it('should work with size larger than input array', () => {
-        expect(chunk([1, 2], 4)).toEqual([[1, 2]]);
-    });
-
-    it('should chunk array with size not perfectly dividing the array length', () => {
-        expect(chunk([1, 2, 3, 4, 5], 2)).toEqual([[1, 2], [3, 4], [5]]);
-    });
-});

package/src/utils/collection/chunk.ts

@@ -1,6 +0,0 @@
-/** Chunk array in slices of given size */
-export function chunk<T>(input: Array<T>, size: number): T[][] {
-    return input.reduce((arr, item, idx) => {
-        return idx % size === 0 ? [...arr, [item]] : [...arr.slice(0, -1), [...arr.slice(-1)[0], item]];
-    }, [] as T[][]);
-}

package/src/utils/collection/isEmpty.test.js

@@ -1,20 +0,0 @@
-import { isEmpty } from './isEmpty';
-
-describe(isEmpty, () => {
-    it('should return true for falsy values', () => {
-        expect(isEmpty(undefined)).toBe(true);
-        expect(isEmpty(null)).toBe(true);
-        expect(isEmpty(0)).toBe(true);
-        expect(isEmpty('')).toBe(true);
-    });
-
-    it('should return true for empty object or array', () => {
-        expect(isEmpty([])).toBe(true);
-        expect(isEmpty({})).toBe(true);
-    });
-
-    it('should return false for non empty object or array', () => {
-        expect(isEmpty([''])).toBe(false);
-        expect(isEmpty({ foo: false })).toBe(false);
-    });
-});

package/src/utils/collection/isEmpty.ts

@@ -1,4 +0,0 @@
-import { Falsy } from '../type';
-
-/** Check if object or array is empty (true on falsy values) */
-export const isEmpty = (obj: object | Falsy) => !obj || Object.entries(obj).length === 0;

package/src/utils/collection/last.ts

@@ -1,2 +0,0 @@
-/** Get last item from array */
-export const last = <T>(array: Array<T>): T | undefined => array[array.length - 1];

package/src/utils/collection/partitionMulti.test.ts

@@ -1,35 +0,0 @@
-import { partitionMulti } from './partitionMulti';
-
-describe('partitionMulti', () => {
-    it('should partition with single predicate', () => {
-        const data = [0, 1, 2, 3, 4, 5];
-        const isEven = (n: number): boolean => n % 2 === 0;
-
-        const actual = partitionMulti(data, [isEven]);
-
-        expect(actual).toEqual([
-            [0, 2, 4],
-            [1, 3, 5],
-        ]);
-    });
-
-    it('should partition on multiple predicates', () => {
-        type T = string | number | boolean;
-        const data: T[] = ['a', 1, 'b', false, true];
-        const isString = (s: T): boolean => typeof s === 'string';
-        const isNumber = (s: T): boolean => typeof s === 'number';
-        const isNull = (s: T): boolean => s === null;
-
-        const partitions = partitionMulti(data, [isString, isNumber, isNull]);
-        expect(partitions).toEqual([
-            // strings
-            ['a', 'b'],
-            // numbers
-            [1],
-            // nulls
-            [],
-            // others
-            [false, true],
-        ]);
-    });
-});

package/src/utils/collection/pull.test.ts

@@ -1,17 +0,0 @@
-import { pull } from '@lumx/react/utils/collection/pull';
-
-describe(pull, () => {
-    it('should do nothing if element does not exist', () => {
-        const a = [1, 2];
-        pull(a, 0);
-        expect(a).toBe(a);
-        expect(a).toEqual([1, 2]);
-    });
-
-    it('should pull an element from the array', () => {
-        const a = [1, 2];
-        pull(a, 1);
-        expect(a).toBe(a);
-        expect(a).toEqual([2]);
-    });
-});

package/src/utils/collection/pull.ts

@@ -1,7 +0,0 @@
-/** Pull an element from an array (inverse of array.push) */
-export const pull = <T>(array: Array<T>, element: T) => {
-    const index = array.indexOf(element);
-    if (index > -1) {
-        array.splice(index, 1);
-    }
-};

package/src/utils/collection/range.test.js

@@ -1,9 +0,0 @@
-import { range } from './range';
-
-describe(range, () => {
-    it('should generate a number range', () => {
-        expect(range(0)).toEqual([]);
-        expect(range(1)).toEqual([0]);
-        expect(range(5)).toEqual([0, 1, 2, 3, 4]);
-    });
-});

package/src/utils/collection/range.ts

@@ -1,2 +0,0 @@
-/** Generate a range of number starting at 0 and ending before the given number */
-export const range = (end: number) => Array.from({ length: end }, (_, i) => i);

package/src/utils/function/memoize.test.ts

@@ -1,36 +0,0 @@
-import { memoize } from '@lumx/react/utils/function/memoize';
-
-describe(memoize, () => {
-    it('should memoize a function returning nothing', () => {
-        const fn = jest.fn();
-        const memoized = memoize(fn);
-
-        expect(memoized()).toEqual(undefined);
-        expect(memoized()).toEqual(undefined);
-        expect(fn).toHaveBeenCalledTimes(1);
-    });
-
-    it('should memoize a function with no args', () => {
-        const fn = jest.fn((i) => i);
-        const memoized = memoize(fn);
-
-        expect(memoized('value')).toEqual('value');
-        expect(memoized('value')).toEqual('value');
-        expect(fn).toHaveBeenCalledTimes(1);
-
-        expect(memoized('another value')).toEqual('another value');
-        expect(fn).toHaveBeenCalledTimes(2);
-    });
-
-    it('should memoize a function with multiple args', () => {
-        const fn = jest.fn((a, b) => `${a} ${b}`);
-        const memoized = memoize(fn);
-
-        expect(memoized(1, true)).toEqual('1 true');
-        expect(memoized(1, true)).toEqual('1 true');
-        expect(fn).toHaveBeenCalledTimes(1);
-
-        expect(memoized('foo', 4)).toEqual('foo 4');
-        expect(fn).toHaveBeenCalledTimes(2);
-    });
-});

package/src/utils/function/memoize.ts

@@ -1,13 +0,0 @@
-/** Memoize a function based on the serialization of its args */
-export function memoize<A extends Array<unknown>, R>(fn: (...args: A) => R): (...args: A) => R {
-    const cache = new Map<string, R>();
-
-    return (...args) => {
-        const serializedArgs = JSON.stringify(args);
-        if (cache.has(serializedArgs)) return cache.get(serializedArgs) as R;
-
-        const value = fn(...args);
-        cache.set(serializedArgs, value);
-        return value;
-    };
-}

package/src/utils/type/ComponentClassName.ts

@@ -1,7 +0,0 @@
-import type { KebabCase } from './KebabCase';
-
-/** Transform the component name into the lumx class name. */
-export type ComponentClassName<
-    TComponentName extends string,
-    TSubComponentName extends string = '',
-> = `lumx-${KebabCase<TComponentName>}${TSubComponentName extends `${TComponentName}${infer TSubName}` ? `__${KebabCase<TSubName>}` : ''}`;

package/src/utils/type/KebabCase.ts

@@ -1,6 +0,0 @@
-/** Transform a string literal into kebab case */
-export type KebabCase<S> = S extends `${infer C}${infer T}`
-    ? T extends Uncapitalize<T>
-        ? `${Uncapitalize<C>}${KebabCase<T>}`
-        : `${Uncapitalize<C>}-${KebabCase<T>}`
-    : S;