@lumx/react 3.10.1-alpha.2 → 3.10.1-alpha.3

package/src/hooks/useStopPropagation.ts

@@ -1,4 +1,3 @@
-import isFunction from 'lodash/isFunction';
 import { MouseEventHandler, useCallback } from 'react';
 
 /**
@@ -10,7 +9,7 @@ import { MouseEventHandler, useCallback } from 'react';
 export function useStopPropagation(handler?: MouseEventHandler): MouseEventHandler {
     return useCallback(
         (evt) => {
-            if (!evt || !isFunction(handler)) {
+            if (!evt || !handler) {
                 return;
             }
             handler(evt);

package/src/stories/decorators/withCombinations.tsx

@@ -1,6 +1,6 @@
 /* eslint-disable react/display-name,jsx-a11y/control-has-associated-label,prefer-object-spread */
 import React from 'react';
-import isEmpty from 'lodash/isEmpty';
+import { isEmpty } from '@lumx/react/utils/collection/isEmpty';
 import { Heading, HeadingLevelProvider } from '@lumx/react';
 
 type PropEntry = [key: string, value: unknown];

package/src/testing/utils/commonTestsSuiteRTL.tsx

@@ -1,13 +1,13 @@
-import isEmpty from 'lodash/isEmpty';
+import React from 'react';
 
 import { GenericProps } from '@lumx/react/utils/type';
 import { queryByClassName } from '@lumx/react/testing/utils/queries';
-import React from 'react';
 import { Theme } from '@lumx/react';
 import { RenderOptions } from '@testing-library/react';
 import { ThemeProvider } from '@lumx/react/utils/theme/ThemeContext';
 import castArray from 'lodash/castArray';
 import { invertTheme } from '@lumx/react/utils/theme/invertTheme';
+import { isEmpty } from '@lumx/react/utils/collection/isEmpty';
 
 interface CommonSetup {
     props: GenericProps;

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

@@ -0,0 +1,15 @@
+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

@@ -0,0 +1,3 @@
+/** 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

@@ -0,0 +1,15 @@
+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

@@ -0,0 +1,6 @@
+/** 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

@@ -0,0 +1,20 @@
+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

@@ -0,0 +1,4 @@
+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

@@ -0,0 +1,2 @@
+/** 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

@@ -0,0 +1,35 @@
+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/{partitionMulti.ts → collection/partitionMulti.ts}

@@ -1,9 +1,4 @@
-import concat from 'lodash/concat';
-import dropRight from 'lodash/dropRight';
-import last from 'lodash/last';
-import partition from 'lodash/partition';
-import reduce from 'lodash/reduce';
-import { Predicate } from './type';
+import type { Predicate } from '../type';
 
 /**
  * Similar to lodash `partition` function but working with multiple predicates.
@@ -19,10 +14,16 @@ import { Predicate } from './type';
  * @return partitioned elements by the given predicates
  */
 export function partitionMulti<T>(elements: T[], predicates: Array<Predicate<T>>): T[][] {
-    return reduce(
-        predicates,
-        (partitioned: T[][], predicate: Predicate<T>) =>
-            concat(dropRight(partitioned), partition(last(partitioned), predicate)),
-        [elements],
-    );
+    const others = [] as T[];
+    const groups = predicates.map(() => []) as T[][];
+
+    for (const element of elements) {
+        const index = predicates.findIndex((predicate) => predicate(element));
+        if (index !== -1) {
+            groups[index].push(element);
+        } else {
+            others.push(element);
+        }
+    }
+    return [...groups, others];
 }

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

@@ -0,0 +1,17 @@
+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

@@ -0,0 +1,7 @@
+/** 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

@@ -0,0 +1,9 @@
+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

@@ -0,0 +1,2 @@
+/** 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/date/getMonthCalendar.ts

@@ -1,7 +1,6 @@
-import last from 'lodash/last';
-
 import { getWeekDays, WeekDayInfo } from '@lumx/react/utils/date/getWeekDays';
 import { Locale } from '@lumx/react/utils/locale/types';
+import { last } from '@lumx/react/utils/collection/last';
 
 type AnnotatedDay = { date: Date; isOutOfRange?: boolean };
 type AnnotatedWeek = Partial<Record<number, AnnotatedDay>>;
@@ -29,7 +28,7 @@ export const getMonthCalendar = (
     iterDate.setDate(1);
 
     const weekDays = getWeekDays(locale);
-    const lastDayOfWeek = last(weekDays) as WeekDayInfo;
+    const lastDayOfWeek = last(weekDays);
 
     const weeks: Array<AnnotatedWeek> = [];
     let week: AnnotatedWeek = {};
@@ -47,7 +46,7 @@ export const getMonthCalendar = (
             week[weekDayNumber] = day;
         }
 
-        if (weekDayNumber === lastDayOfWeek.number) {
+        if (weekDayNumber === lastDayOfWeek?.number) {
             weeks.push(week);
             rowCount += 1;
             week = {};

package/src/utils/flattenChildren.ts

@@ -1,5 +1,4 @@
-import get from 'lodash/get';
-import { Children, Key, ReactChild, ReactNode, cloneElement, isValidElement } from 'react';
+import { Children, Key, ReactChild, ReactNode, cloneElement, isValidElement, ReactElement } from 'react';
 import { isFragment } from 'react-is';
 
 /**
@@ -17,7 +16,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(get(node, 'key') ?? index);
+            const nodeKeys = keys.concat((node as ReactElement)?.key ?? index);
             if (isFragment(node)) {
                 acc.push(...recur(node.props.children, nodeKeys));
             } else if (isValidElement(node)) {

package/src/utils/makeListenerTowerContext.ts

@@ -1,5 +1,5 @@
-import last from 'lodash/last';
-import pull from 'lodash/pull';
+import { pull } from '@lumx/react/utils/collection/pull';
+import { last } from '@lumx/react/utils/collection/last';
 
 export type Listener = { enable(): void; disable(): void };
 

package/src/utils/react/forwardRef.ts

@@ -1,10 +1,11 @@
 import React, { type ReactNode, type ForwardedRef } from 'react';
 import type { Comp } from '../type';
 
-type ForwardRef = <P, T = HTMLElement>(render: (props: P, ref: ForwardedRef<T>) => ReactNode) => Comp<P, T>;
+type ForwardRef = <P, T = HTMLElement, A = unknown>(
+    render: (props: P, ref: ForwardedRef<T>) => ReactNode,
+) => Comp<P, T> & A;
 
 /**
  * React.forwardRef but re-typed to attach some custom metadata on our components.
  */
-/*#__NO_SIDE_EFFECTS__*/
 export const forwardRef = React.forwardRef as ForwardRef;

package/src/utils/react/forwardRefPolymorphic.ts

@@ -3,8 +3,7 @@ import type { ComponentRef } from '@lumx/react/utils/type';
 
 type ForwardRefPolymorphic = <E extends ElementType, P extends { as?: E }>(
     render: (props: P, ref: ComponentRef<E>) => React.ReactNode,
-) => (props: P & { ref?: ComponentRef<E> }) => React.ReactNode;
+) => (props: P & React.ComponentProps<E> & { ref?: ComponentRef<E> }) => React.JSX.Element;
 
 /** Same as `React.forwardRef` but inferring Ref type from the `as` prop. */
-/*#__NO_SIDE_EFFECTS__*/
 export const forwardRefPolymorphic = React.forwardRef as ForwardRefPolymorphic;

package/src/utils/utils.test.ts

@@ -1,32 +1,5 @@
-import partition from 'lodash/partition';
-import { partitionMulti } from './partitionMulti';
 import { isInternetExplorer } from './isInternetExplorer';
 
-describe('partitionMulti', () => {
-    it('should act like partition for single predicate', () => {
-        const data = [0, 1, 2, 3, 4, 5];
-        const isEven = (n: number): boolean => n % 2 === 0;
-
-        const expected = partition(data, isEven);
-        const actual = partitionMulti(data, [isEven]);
-
-        expect(actual).toEqual(expected);
-    });
-
-    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 [strings, numbers, others] = partitionMulti(data, [isString, isNumber]);
-
-        expect(strings).toEqual(['a', 'b']);
-        expect(numbers).toEqual([1]);
-        expect(others).toEqual([false, true]);
-    });
-});
-
 describe('isInternetExplorer', () => {
     it('should detect IE 10', () => {
         const userAgentIE10 = 'Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.1; WOW64; Trident/6.0)';

package/utils/index.d.ts

@@ -1,5 +1,5 @@
 import React, { RefObject } from 'react';
-import { F as Falsy } from '../_internal/8d67e1e3.js';
+import { F as Falsy } from '../_internal/index.js';
 
 interface ClickAwayParameters {
     /**

package/utils/index.js

@@ -1,97 +1,2 @@
-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 };
+export { C as ClickAwayProvider } from '../_internal/index.js';
 //# sourceMappingURL=index.js.map

package/utils/index.js.map

@@ -1 +1 @@
-{"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\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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"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/_internal/17c3ea1d.js

@@ -1,137 +0,0 @@
-import { i as forwardRef, j as _objectWithoutProperties, E as Emphasis, T as Theme, C as ColorPalette, k as _objectSpread2, g as classNames, _ as _extends, l as CSS_PREFIX } from './1da25128.js';
-import React__default from 'react';
-import isEmpty from 'lodash/isEmpty';
-import 'lodash/kebabCase';
-import { h as handleBasicClasses } from './f57e1239.js';
-import { r as renderLink } from './2c5dbb03.js';
-
-const _excluded = ["aria-label", "children", "className", "color", "disabled", "emphasis", "hasBackground", "href", "isDisabled", "isSelected", "isActive", "isFocused", "isHovered", "linkAs", "name", "size", "target", "theme", "variant", "type", "fullWidth"];
-
-/**
- * Button size definition.
- */
-
-/**
- * Component display name.
- */
-const COMPONENT_NAME = 'ButtonRoot';
-const BUTTON_WRAPPER_CLASSNAME = `${CSS_PREFIX}-button-wrapper`;
-const BUTTON_CLASSNAME = `${CSS_PREFIX}-button`;
-
-/**
- * Render a button wrapper with the ButtonRoot inside.
- *
- * @param  props Component props.
- * @return React element.
- */
-const renderButtonWrapper = props => {
-  const {
-    color,
-    emphasis,
-    variant,
-    fullWidth
-  } = props;
-  const adaptedColor = emphasis === Emphasis.low && (color === ColorPalette.light ? ColorPalette.dark : ColorPalette.light);
-  const wrapperClassName = classNames(handleBasicClasses({
-    color: adaptedColor,
-    prefix: BUTTON_WRAPPER_CLASSNAME,
-    variant,
-    fullWidth
-  }));
-  const buttonProps = _objectSpread2(_objectSpread2({}, props), {}, {
-    hasBackground: false
-  });
-  return /*#__PURE__*/React__default.createElement("div", {
-    className: wrapperClassName
-  }, /*#__PURE__*/React__default.createElement(ButtonRoot, buttonProps));
-};
-
-/**
- * ButtonRoot component.
- *
- * @param  props Component props.
- * @param  ref   Component ref.
- * @return React element.
- */
-const ButtonRoot = forwardRef((props, ref) => {
-  const {
-      'aria-label': ariaLabel,
-      children,
-      className,
-      color,
-      disabled,
-      emphasis,
-      hasBackground,
-      href,
-      isDisabled = disabled,
-      isSelected,
-      isActive,
-      isFocused,
-      isHovered,
-      linkAs,
-      name,
-      size,
-      target,
-      theme,
-      variant,
-      type = 'button',
-      fullWidth
-    } = props,
-    forwardedProps = _objectWithoutProperties(props, _excluded);
-  const adaptedColor = color || emphasis !== Emphasis.high && theme === Theme.dark && ColorPalette.light || emphasis === Emphasis.high && ColorPalette.primary || ColorPalette.dark;
-  if (hasBackground) {
-    return renderButtonWrapper(_objectSpread2(_objectSpread2({}, props), {}, {
-      ref,
-      variant,
-      color: adaptedColor
-    }));
-  }
-  const buttonClassName = classNames(className, handleBasicClasses({
-    color: adaptedColor,
-    emphasis,
-    isSelected,
-    isDisabled,
-    isActive,
-    isFocused,
-    isHovered,
-    prefix: BUTTON_CLASSNAME,
-    size,
-    theme: emphasis === Emphasis.high && theme,
-    variant,
-    fullWidth
-  }));
-
-  /**
-   * If the linkAs prop is used, we use the linkAs component instead of a <button>.
-   * If there is an href attribute, we display an <a> instead of a <button>.
-   *
-   * However, in any case, if the component is disabled, we returned a <button> since disabled is not compatible with <a>.
-   */
-  if ((linkAs || !isEmpty(props.href)) && !isDisabled) {
-    return renderLink(_objectSpread2(_objectSpread2({
-      linkAs
-    }, forwardedProps), {}, {
-      'aria-label': ariaLabel,
-      href,
-      target,
-      className: buttonClassName,
-      ref: ref
-    }), children);
-  }
-  return /*#__PURE__*/React__default.createElement("button", _extends({}, forwardedProps, {
-    disabled: isDisabled,
-    "aria-disabled": isDisabled,
-    "aria-label": ariaLabel,
-    ref: ref,
-    className: buttonClassName,
-    name: name,
-    type:
-    // eslint-disable-next-line react/button-has-type
-    type
-  }), children);
-});
-ButtonRoot.displayName = COMPONENT_NAME;
-ButtonRoot.defaultProps = {};
-
-export { ButtonRoot as B };
-//# sourceMappingURL=17c3ea1d.js.map

package/_internal/17c3ea1d.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"17c3ea1d.js","sources":["../../src/components/button/ButtonRoot.tsx"],"sourcesContent":["import React, { AriaAttributes, ButtonHTMLAttributes, DetailedHTMLProps, RefObject } from 'react';\n\nimport isEmpty from 'lodash/isEmpty';\n\nimport classNames from 'classnames';\n\nimport { ColorPalette, Emphasis, Size, Theme } from '@lumx/react';\nimport { CSS_PREFIX } from '@lumx/react/constants';\nimport { GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { handleBasicClasses } from '@lumx/react/utils/className';\nimport { renderLink } from '@lumx/react/utils/renderLink';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\ntype HTMLButtonProps = DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>;\n\n/**\n * Button size definition.\n */\nexport type ButtonSize = Extract<Size, 's' | 'm'>;\n\nexport interface BaseButtonProps\n    extends GenericProps,\n        Pick<AriaAttributes, 'aria-expanded' | 'aria-haspopup' | 'aria-pressed' | 'aria-label'>,\n        HasTheme {\n    /** Color variant. */\n    color?: ColorPalette;\n    /** Emphasis variant. */\n    emphasis?: Emphasis;\n    /** Whether or not the button has a background color in low emphasis. */\n    hasBackground?: boolean;\n    /** Native anchor href property. It determines whether the Button will be a <button> or an <a>. */\n    href?: string;\n    /** Whether the component is disabled or not. */\n    isDisabled?: boolean;\n    /** Whether the component is selected or not (unsupported in `high` emphasis). */\n    isSelected?: boolean;\n    /** Native button name property. */\n    name?: string;\n    /** Size variant. */\n    size?: ButtonSize;\n    /** Native anchor target property. */\n    target?: '_self' | '_blank' | '_parent' | '_top';\n    /** Native button type. */\n    type?: HTMLButtonProps['type'];\n    /** Custom react component for the link (can be used to inject react router Link). */\n    linkAs?: 'a' | any;\n}\n\nexport interface ButtonRootProps extends BaseButtonProps {\n    variant: 'button' | 'icon';\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'ButtonRoot';\n\nexport const BUTTON_WRAPPER_CLASSNAME = `${CSS_PREFIX}-button-wrapper`;\nexport const BUTTON_CLASSNAME = `${CSS_PREFIX}-button`;\n\n/**\n * Render a button wrapper with the ButtonRoot inside.\n *\n * @param  props Component props.\n * @return React element.\n */\nconst renderButtonWrapper: React.FC<ButtonRootProps> = (props) => {\n    const { color, emphasis, variant, fullWidth } = props;\n\n    const adaptedColor =\n        emphasis === Emphasis.low && (color === ColorPalette.light ? ColorPalette.dark : ColorPalette.light);\n\n    const wrapperClassName = classNames(\n        handleBasicClasses({\n            color: adaptedColor,\n            prefix: BUTTON_WRAPPER_CLASSNAME,\n            variant,\n            fullWidth,\n        }),\n    );\n    const buttonProps = { ...props, hasBackground: false };\n\n    return (\n        <div className={wrapperClassName}>\n            {/* eslint-disable-next-line @typescript-eslint/no-use-before-define */}\n            <ButtonRoot {...buttonProps} />\n        </div>\n    );\n};\n\n/**\n * ButtonRoot component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const ButtonRoot = forwardRef<ButtonRootProps, HTMLButtonElement | HTMLAnchorElement>((props, ref) => {\n    const {\n        'aria-label': ariaLabel,\n        children,\n        className,\n        color,\n        disabled,\n        emphasis,\n        hasBackground,\n        href,\n        isDisabled = disabled,\n        isSelected,\n        isActive,\n        isFocused,\n        isHovered,\n        linkAs,\n        name,\n        size,\n        target,\n        theme,\n        variant,\n        type = 'button',\n        fullWidth,\n        ...forwardedProps\n    } = props;\n\n    const adaptedColor =\n        color ||\n        (emphasis !== Emphasis.high && theme === Theme.dark && ColorPalette.light) ||\n        (emphasis === Emphasis.high && ColorPalette.primary) ||\n        ColorPalette.dark;\n\n    if (hasBackground) {\n        return renderButtonWrapper({ ...props, ref, variant, color: adaptedColor });\n    }\n\n    const buttonClassName = classNames(\n        className,\n        handleBasicClasses({\n            color: adaptedColor,\n            emphasis,\n            isSelected,\n            isDisabled,\n            isActive,\n            isFocused,\n            isHovered,\n            prefix: BUTTON_CLASSNAME,\n            size,\n            theme: emphasis === Emphasis.high && theme,\n            variant,\n            fullWidth,\n        }),\n    );\n\n    /**\n     * If the linkAs prop is used, we use the linkAs component instead of a <button>.\n     * If there is an href attribute, we display an <a> instead of a <button>.\n     *\n     * However, in any case, if the component is disabled, we returned a <button> since disabled is not compatible with <a>.\n     */\n    if ((linkAs || !isEmpty(props.href)) && !isDisabled) {\n        return renderLink(\n            {\n                linkAs,\n                ...forwardedProps,\n                'aria-label': ariaLabel,\n                href,\n                target,\n                className: buttonClassName,\n                ref: ref as RefObject<HTMLAnchorElement>,\n            },\n            children,\n        );\n    }\n    return (\n        <button\n            {...forwardedProps}\n            disabled={isDisabled}\n            aria-disabled={isDisabled}\n            aria-label={ariaLabel}\n            ref={ref as RefObject<HTMLButtonElement>}\n            className={buttonClassName}\n            name={name}\n            type={\n                // eslint-disable-next-line react/button-has-type\n                type\n            }\n        >\n            {children}\n        </button>\n    );\n});\nButtonRoot.displayName = COMPONENT_NAME;\nButtonRoot.defaultProps = {};\n"],"names":["COMPONENT_NAME","BUTTON_WRAPPER_CLASSNAME","CSS_PREFIX","BUTTON_CLASSNAME","renderButtonWrapper","props","color","emphasis","variant","fullWidth","adaptedColor","Emphasis","low","ColorPalette","light","dark","wrapperClassName","classNames","handleBasicClasses","prefix","buttonProps","_objectSpread","hasBackground","React","createElement","className","ButtonRoot","forwardRef","ref","ariaLabel","children","disabled","href","isDisabled","isSelected","isActive","isFocused","isHovered","linkAs","name","size","target","theme","type","forwardedProps","_objectWithoutProperties","_excluded","high","Theme","primary","buttonClassName","isEmpty","renderLink","_extends","displayName","defaultProps"],"mappings":"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"}