@lumx/react 3.20.1-alpha.36 → 3.20.1-alpha.38

package/_internal/de24f857.js

@@ -1,3 +0,0 @@
-const mdiCheckCircle = 'M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10 10-4.5 10-10S17.5 2 12 2m-2 15-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8z';
-
-export { mdiCheckCircle as m };

package/_internal/e806b848.js

@@ -1,8 +0,0 @@
-import React__default from 'react';
-
-/**
- * Similar to `isComponent` but more precise as it's not based on the component `displayName` but on the component function reference.
- */
-const isComponentType = type => node => /*#__PURE__*/React__default.isValidElement(node) && node.type === type;
-
-export { isComponentType as i };

package/_internal/e913a3af.js

@@ -1,117 +0,0 @@
-import classNames from 'classnames';
-import { getRootClassName, getTypographyClassName, handleBasicClasses, fontColorClass } from '@lumx/core/js/utils/className';
-import React__default from 'react';
-import { u as useTooltipContext } from './9d1336a1.js';
-import { V as VISUALLY_HIDDEN } from './d0e3f49e.js';
-import { u as useMergeRefs } from './f0d7d6ea.js';
-import { f as forwardRef } from './8bce732e.js';
-import { w as wrapChildrenIconWithSpaces } from './7b293665.js';
-import { jsx } from 'react/jsx-runtime';
-
-/**
- * Compute a tooltip label based on a label element `innerText` if the text overflows.
- * Updates dynamically on content changes (but not on resize!)
- */
-const useOverflowTooltipLabel = content => {
-  const parentTooltip = useTooltipContext();
-  const [tooltipLabel, setTooltipLabel] = React__default.useState(undefined);
-  const [labelElement, setLabelElement] = React__default.useState(null);
-  React__default.useLayoutEffect(() => {
-    if (
-    // Not inside a tooltip
-    !parentTooltip && labelElement &&
-    // Not inside a visually hidden
-    !labelElement?.closest(`.${VISUALLY_HIDDEN}`) &&
-    // Text overflows
-    labelElement.offsetWidth < labelElement.scrollWidth) {
-      // Set tooltip label
-      setTooltipLabel(labelElement.innerText);
-    } else {
-      setTooltipLabel(undefined);
-    }
-  }, [labelElement, parentTooltip, content]);
-  return {
-    labelRef: setLabelElement,
-    tooltipLabel
-  };
-};
-
-/**
- * Component display name.
- */
-const COMPONENT_NAME = 'Text';
-
-/**
- * Component default class name and class prefix.
- */
-const CLASSNAME = getRootClassName(COMPONENT_NAME);
-
-/**
- * Component default props.
- */
-const DEFAULT_PROPS = {};
-
-/**
- * Text component.
- *
- * @param  props Component props.
- * @param  ref   Component ref.
- * @return React element.
- */
-const Text = forwardRef((props, ref) => {
-  const {
-    as: Component,
-    children,
-    className,
-    color,
-    colorVariant,
-    noWrap,
-    typography,
-    truncate,
-    whiteSpace,
-    style,
-    ...forwardedProps
-  } = props;
-  const typographyClass = typography && getTypographyClassName(typography);
-
-  // Truncate mode
-  const truncateLinesStyle = typeof truncate === 'object' && truncate.lines > 1 && {
-    '--lumx-text-truncate-lines': truncate.lines
-  };
-  const isTruncatedMultiline = !!truncateLinesStyle;
-  const isTruncated = !!truncate;
-
-  /**
-   * Add custom white-space style if specified
-   * Disabled if noWrap is specified
-   * Disabled if truncated on one-line
-   * */
-  const whiteSpaceStyle = !noWrap && !(isTruncated && !isTruncatedMultiline) && whiteSpace && {
-    '--lumx-text-white-space': whiteSpace
-  };
-  const {
-    tooltipLabel,
-    labelRef
-  } = useOverflowTooltipLabel(children);
-  return /*#__PURE__*/jsx(Component, {
-    ref: useMergeRefs(ref, labelRef),
-    className: classNames(className, handleBasicClasses({
-      prefix: CLASSNAME,
-      isTruncated: isTruncated && !isTruncatedMultiline,
-      isTruncatedMultiline
-    }), typographyClass, fontColorClass(color, colorVariant), noWrap && `${CLASSNAME}--no-wrap`),
-    title: tooltipLabel,
-    style: {
-      ...truncateLinesStyle,
-      ...whiteSpaceStyle,
-      ...style
-    },
-    ...forwardedProps,
-    children: wrapChildrenIconWithSpaces(children)
-  });
-});
-Text.displayName = COMPONENT_NAME;
-Text.className = CLASSNAME;
-Text.defaultProps = DEFAULT_PROPS;
-
-export { Text as T, useOverflowTooltipLabel as u };

package/_internal/ea04260d.js

@@ -1,28 +0,0 @@
-import React__default, { useContext } from 'react';
-import { jsx } from 'react/jsx-runtime';
-
-const DisabledStateContext = /*#__PURE__*/React__default.createContext({
-  state: null
-});
-/**
- * Disabled state provider.
- * All nested LumX Design System components inherit this disabled state.
- */
-function DisabledStateProvider({
-  children,
-  ...value
-}) {
-  return /*#__PURE__*/jsx(DisabledStateContext.Provider, {
-    value: value,
-    children: children
-  });
-}
-
-/**
- * Get DisabledState context value
- */
-function useDisabledStateContext() {
-  return useContext(DisabledStateContext);
-}
-
-export { DisabledStateProvider as D, useDisabledStateContext as u };

package/_internal/eaf6c45a.js

@@ -1,3 +0,0 @@
-const mdiClose = 'M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z';
-
-export { mdiClose as m };

package/_internal/ebdcb0c7.js

@@ -1,60 +0,0 @@
-import { Typography } from '@lumx/core/js/constants';
-import React__default, { createContext } from 'react';
-import { jsx } from 'react/jsx-runtime';
-
-/** The maximum authorized heading level. */
-const MAX_HEADING_LEVEL = 6;
-
-/**
- * Typography to use by default depending on the heading level.
- */
-const DEFAULT_TYPOGRAPHY_BY_LEVEL = {
-  h1: Typography.display1,
-  h2: Typography.headline,
-  h3: Typography.title,
-  h4: Typography.subtitle2,
-  h5: Typography.subtitle1,
-  h6: Typography.body2
-};
-
-const defaultContext = {
-  level: 1,
-  headingElement: 'h1'
-};
-const HeadingLevelContext = /*#__PURE__*/createContext(defaultContext);
-
-const useHeadingLevel = () => {
-  const {
-    level = 1,
-    headingElement = 'h1'
-  } = React__default.useContext(HeadingLevelContext);
-  return {
-    level,
-    headingElement
-  };
-};
-
-/**
- * Provide a new heading level context.
- */
-const HeadingLevelProvider = ({
-  children,
-  level
-}) => {
-  const {
-    level: contextLevel
-  } = useHeadingLevel();
-  const incrementedLevel = level || contextLevel + 1;
-  /** Don't allow a level beyond the maximum level. */
-  const nextLevel = incrementedLevel > MAX_HEADING_LEVEL ? MAX_HEADING_LEVEL : incrementedLevel;
-  const headingElement = `h${nextLevel}`;
-  return /*#__PURE__*/jsx(HeadingLevelContext.Provider, {
-    value: {
-      level: nextLevel,
-      headingElement
-    },
-    children: children
-  });
-};
-
-export { DEFAULT_TYPOGRAPHY_BY_LEVEL as D, HeadingLevelProvider as H, useHeadingLevel as u };

package/_internal/ef5d1aac.js

@@ -1,3 +0,0 @@
-const mdiCloseCircle = 'M12 2a10 10 0 1 1 0 20 10 10 0 1 1 0-20m3.59 5L12 10.59 8.41 7 7 8.41 10.59 12 7 15.59 8.41 17 12 13.41 15.59 17 17 15.59 13.41 12 17 8.41z';
-
-export { mdiCloseCircle as m };

package/_internal/f0d7d6ea.js

@@ -1,29 +0,0 @@
-import { useMemo } from 'react';
-
-/**
- * Merge refs into a single function ref.
- *
- * @param  refs React references to merge.
- * @return the merged ref.
- */
-function mergeRefs(...refs) {
-  return value => refs.forEach(ref => {
-    if (typeof ref === 'function') {
-      ref(value);
-    } else if (ref) {
-      // eslint-disable-next-line no-param-reassign
-      ref.current = value;
-    }
-  });
-}
-
-/**
- * Same as `mergeRefs` but memoized
- */
-const useMergeRefs = (...refs) => {
-  return useMemo(() => mergeRefs(...refs),
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  refs);
-};
-
-export { mergeRefs as m, useMergeRefs as u };

package/_internal/utils/ClickAwayProvider/index-1234ce76.js

@@ -1,94 +0,0 @@
-import { useEffect, useContext, useMemo, useRef, createContext } from 'react';
-import isEmpty from 'lodash/isEmpty';
-import { jsx } from 'react/jsx-runtime';
-
-const EVENT_TYPES = ['mousedown', 'touchstart'];
-function isClickAway(targets, refs) {
-  // The targets elements are not contained in any of the listed element references.
-  return !refs.some(ref => targets.some(target => ref?.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({
-  callback,
-  childrenRefs
-}) {
-  useEffect(() => {
-    const {
-      current: currentRefs
-    } = childrenRefs;
-    if (!callback || !currentRefs || isEmpty(currentRefs)) {
-      return undefined;
-    }
-    const listener = evt => {
-      const targets = [evt.composedPath?.()[0], evt.target];
-      if (isClickAway(targets, 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 = ({
-  children,
-  callback,
-  childrenRefs,
-  parentRef
-}) => {
-  const parentContext = useContext(ClickAwayAncestorContext);
-  const currentContext = useMemo(() => {
-    const context = {
-      childrenRefs: [],
-      /**
-       * Add element refs to the current context and propagate to the parent context.
-       */
-      addRefs(...newChildrenRefs) {
-        // Add element refs that should be considered as inside the click away context.
-        context.childrenRefs.push(...newChildrenRefs);
-        if (parentContext) {
-          // Also add then to the parent context
-          parentContext.addRefs(...newChildrenRefs);
-          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__*/jsx(ClickAwayAncestorContext.Provider, {
-    value: currentContext,
-    children: children
-  });
-};
-ClickAwayProvider.displayName = 'ClickAwayProvider';
-
-export { ClickAwayProvider };

package/_internal/utils/MaterialThemeSwitcher/index-8d22de5a.js

@@ -1,48 +0,0 @@
-import { useState, useCallback } from 'react';
-import { jsx } from 'react/jsx-runtime';
-import { Switch } from '../../components/switch/index-58fe0f0c.js';
-import { Alignment } from '@lumx/core/js/constants';
-
-const globalState = {
-  isEnabled: false,
-  styleSheet: null
-};
-
-/** Toggle apply the material CSS override. */
-async function toggleMaterialTheme(wasEnabled) {
-  globalState.isEnabled = !wasEnabled;
-
-  // Inject the material theme CSS file.
-  if (!globalState.styleSheet) {
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    // @ts-ignore
-    const cssCode = await import('!!raw-loader!@lumx/core/css/material.css');
-
-    // Inject CSS override in a <style> node in <head>
-    const style = document.createElement('style');
-    style.textContent = cssCode.default;
-    document.head.appendChild(style);
-    globalState.styleSheet = style.sheet;
-  }
-  // Disable/Enable stylesheet
-  globalState.styleSheet.disabled = !globalState.isEnabled;
-}
-const MaterialThemeSwitcher = ({
-  theme
-}) => {
-  const [isEnabled, setEnabled] = useState(globalState.isEnabled);
-  const toggleTheme = useCallback(() => setEnabled(wasEnabled => {
-    toggleMaterialTheme(wasEnabled);
-    return !wasEnabled;
-  }), []);
-  return /*#__PURE__*/jsx(Switch, {
-    className: "material-theme-switcher",
-    isChecked: isEnabled,
-    onChange: toggleTheme,
-    position: Alignment.right,
-    theme: theme,
-    children: "Material theme"
-  });
-};
-
-export { MaterialThemeSwitcher, toggleMaterialTheme };

package/_internal/utils/Portal/index-6e0a7404.js

@@ -1,44 +0,0 @@
-import React__default from 'react';
-import { createPortal } from 'react-dom';
-import { jsx, Fragment } from 'react/jsx-runtime';
-
-/**
- * Portal initializing function.
- * If it does not provide a container, the Portal children will render in classic React tree and not in a portal.
- */
-
-const PortalContext = /*#__PURE__*/React__default.createContext(() => ({
-  container: document.body
-}));
-/**
- * Customize where <Portal> wrapped elements render (tooltip, popover, dialog, etc.)
- */
-const PortalProvider = PortalContext.Provider;
-
-/**
- * Render children in a portal outside the current DOM position
- * (defaults to `document.body` but can be customized with the PortalContextProvider)
- */
-const Portal = ({
-  children,
-  enabled = true
-}) => {
-  const init = React__default.useContext(PortalContext);
-  const context = React__default.useMemo(() => {
-    return enabled ? init() : null;
-  },
-  // Only update on 'enabled'
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  [enabled]);
-  React__default.useLayoutEffect(() => {
-    return context?.teardown;
-  }, [context?.teardown, enabled]);
-  if (!context?.container) {
-    return /*#__PURE__*/jsx(Fragment, {
-      children: children
-    });
-  }
-  return /*#__PURE__*/createPortal(children, context.container);
-};
-
-export { Portal, PortalProvider };

package/_internal/utils/disabled/index-075b99c3.js

@@ -1,36 +0,0 @@
-import { u as useDisabledStateContext } from '../../ea04260d.js';
-export { D as DisabledStateProvider } from '../../ea04260d.js';
-
-/**
- * Resolve disabled state from props.
- * (handles `disabled`, `isDisabled` and `aria-disabled`)
- *
- * @params component props
- */
-function useDisableStateProps(props) {
-  const {
-    disabled,
-    isDisabled = disabled,
-    'aria-disabled': ariaDisabled,
-    onClick,
-    onChange,
-    ...otherProps
-  } = props;
-  const disabledStateContext = useDisabledStateContext();
-  const disabledStateProps = {
-    disabled: disabledStateContext?.state === 'disabled' || isDisabled,
-    'aria-disabled': ariaDisabled === true || ariaDisabled === 'true'
-  };
-  const isAnyDisabled = disabledStateProps['aria-disabled'] || disabledStateProps.disabled;
-  if (!isAnyDisabled) {
-    otherProps.onClick = onClick;
-    otherProps.onChange = onChange;
-  }
-  return {
-    disabledStateProps,
-    otherProps: otherProps,
-    isAnyDisabled
-  };
-}
-
-export { useDisableStateProps, useDisabledStateContext };

package/_internal/utils/type/index-ea9fc197.js

@@ -1,2 +0,0 @@
-export { i as isComponent } from '../../78df9309.js';
-export { i as isComponentType } from '../../e806b848.js';