@lumx/react 3.20.1-alpha.32 → 3.20.1-alpha.34

package/_internal/a3f2000f.js

@@ -0,0 +1,198 @@
+import { useState, useEffect, useMemo } from 'react';
+import memoize from 'lodash/memoize';
+import { WINDOW, DOCUMENT } from './6af61e2f.js';
+import { usePopper } from './094c811d.js';
+import { ARROW_SIZE, FitAnchorWidth } from './9d063548.js';
+import detectOverflow from './6f0ce1bb.js';
+
+/**
+ * Popper js modifier to fit popover min width to the anchor width.
+ */
+const sameWidth = memoize(anchorWidthOption => ({
+  name: 'sameWidth',
+  enabled: true,
+  phase: 'beforeWrite',
+  requires: ['computeStyles'],
+  fn({
+    state
+  }) {
+    // eslint-disable-next-line no-param-reassign
+    state.styles.popper[anchorWidthOption] = `${state.rects.reference.width}px`;
+  },
+  effect({
+    state
+  }) {
+    // eslint-disable-next-line no-param-reassign
+    state.elements.popper.style[anchorWidthOption] = `${state.elements.reference.offsetWidth}px`;
+  }
+}));
+
+/**
+ * Popper js modifier to compute max size of the popover.
+ */
+const maxSize = {
+  name: 'maxSize',
+  enabled: true,
+  phase: 'main',
+  requiresIfExists: ['offset', 'preventOverflow', 'flip'],
+  fn({
+    state,
+    name,
+    options
+  }) {
+    const overflow = detectOverflow(state, options);
+    const {
+      y = 0,
+      x = 0
+    } = state.modifiersData.preventOverflow;
+    const {
+      width,
+      height
+    } = state.rects.popper;
+    const [basePlacement] = state.placement.split('-');
+    const widthProp = basePlacement === 'left' ? 'left' : 'right';
+    const heightProp = basePlacement === 'top' ? 'top' : 'bottom';
+    // eslint-disable-next-line no-param-reassign
+    state.modifiersData[name] = {
+      width: width - overflow[widthProp] - x,
+      height: height - overflow[heightProp] - y
+    };
+  }
+};
+
+/**
+ * Popper js modifier to apply the max height.
+ */
+const applyMaxHeight = {
+  name: 'applyMaxHeight',
+  enabled: true,
+  phase: 'beforeWrite',
+  requires: ['maxSize'],
+  fn({
+    state
+  }) {
+    const {
+      height
+    } = state.modifiersData.maxSize;
+    // eslint-disable-next-line no-param-reassign
+    state.elements.popper.style.maxHeight = `${height - ARROW_SIZE}px`;
+  }
+};
+function usePopoverStyle({
+  offset,
+  hasArrow,
+  fitToAnchorWidth,
+  fitWithinViewportHeight,
+  boundaryRef,
+  anchorRef,
+  placement,
+  style,
+  zIndex
+}) {
+  const [popperElement, setPopperElement] = useState(null);
+  const [arrowElement, setArrowElement] = useState(null);
+  const actualOffset = [offset?.along ?? 0, (offset?.away ?? 0) + (hasArrow ? ARROW_SIZE : 0)];
+  const modifiers = [{
+    name: 'offset',
+    options: {
+      offset: actualOffset
+    }
+  }];
+  if (hasArrow && arrowElement) {
+    modifiers.push({
+      name: 'arrow',
+      options: {
+        element: arrowElement,
+        padding: ARROW_SIZE / 2
+      }
+    });
+  }
+  if (fitToAnchorWidth) {
+    const fitWidth = typeof fitToAnchorWidth === 'string' ? fitToAnchorWidth : FitAnchorWidth.MIN_WIDTH;
+    modifiers.push(sameWidth(fitWidth));
+  }
+  if (fitWithinViewportHeight) {
+    modifiers.push({
+      ...maxSize,
+      options: {
+        boundary: boundaryRef?.current
+      }
+    }, applyMaxHeight);
+  }
+  if (boundaryRef) {
+    modifiers.push({
+      name: 'flip',
+      options: {
+        boundary: boundaryRef.current
+      }
+    }, {
+      name: 'preventOverflow',
+      options: {
+        boundary: boundaryRef.current
+      }
+    });
+  }
+  const {
+    styles,
+    attributes,
+    state,
+    update
+  } = usePopper(anchorRef.current, popperElement, {
+    placement,
+    modifiers
+  });
+
+  // Auto update popover
+  useEffect(() => {
+    const {
+      current: anchorElement
+    } = anchorRef;
+    if (!update || !popperElement || !anchorElement || !WINDOW?.ResizeObserver) {
+      return undefined;
+    }
+    let running;
+    function updateRateLimited() {
+      if (running) return;
+      update?.();
+      running = setTimeout(() => {
+        running = undefined;
+      }, 100);
+    }
+    updateRateLimited();
+
+    // On anchor or popover resize
+    const resizeObserver = new ResizeObserver(updateRateLimited);
+    resizeObserver.observe(anchorElement);
+    resizeObserver.observe(popperElement);
+    return () => {
+      resizeObserver.disconnect();
+    };
+  }, [anchorRef, popperElement, update]);
+  const position = state?.placement ?? placement;
+  const popoverStyle = useMemo(() => {
+    const newStyles = {
+      ...style,
+      ...styles.popper,
+      zIndex
+    };
+    if (fitWithinViewportHeight && !newStyles.maxHeight) {
+      newStyles.maxHeight = WINDOW?.innerHeight || DOCUMENT?.documentElement.clientHeight;
+    }
+    return newStyles;
+  }, [style, styles.popper, zIndex, fitWithinViewportHeight]);
+  return {
+    styles: {
+      arrow: styles.arrow,
+      popover: popoverStyle
+    },
+    attributes,
+    isPositioned: (state?.rects?.popper?.y ?? -1) >= 0,
+    position,
+    setArrowElement,
+    setPopperElement,
+    popperElement
+  };
+}
+
+export { usePopoverStyle };
+//# sourceMappingURL=a3f2000f.js.map

package/_internal/a3f2000f.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"a3f2000f.js","sources":["../../src/components/popover/usePopoverStyle.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from 'react';\nimport memoize from 'lodash/memoize';\nimport { detectOverflow } from '@popperjs/core';\n\nimport { DOCUMENT, WINDOW } from '@lumx/react/constants';\nimport { PopoverProps } from '@lumx/react/components/popover/Popover';\nimport { usePopper } from '@lumx/react/hooks/usePopper';\nimport { ARROW_SIZE, FitAnchorWidth, Placement } from './constants';\n\n/**\n * Popper js modifier to fit popover min width to the anchor width.\n */\nconst sameWidth = memoize((anchorWidthOption: FitAnchorWidth) => ({\n    name: 'sameWidth',\n    enabled: true,\n    phase: 'beforeWrite',\n    requires: ['computeStyles'],\n    fn({ state }: any) {\n        // eslint-disable-next-line no-param-reassign\n        state.styles.popper[anchorWidthOption] = `${state.rects.reference.width}px`;\n    },\n    effect({ state }: any) {\n        // eslint-disable-next-line no-param-reassign\n        state.elements.popper.style[anchorWidthOption] = `${state.elements.reference.offsetWidth}px`;\n    },\n}));\n\n/**\n * Popper js modifier to compute max size of the popover.\n */\nconst maxSize = {\n    name: 'maxSize',\n    enabled: true,\n    phase: 'main',\n    requiresIfExists: ['offset', 'preventOverflow', 'flip'],\n    fn({ state, name, options }: any) {\n        const overflow = detectOverflow(state, options);\n\n        const { y = 0, x = 0 } = state.modifiersData.preventOverflow;\n        const { width, height } = state.rects.popper;\n\n        const [basePlacement] = state.placement.split('-');\n\n        const widthProp = basePlacement === 'left' ? 'left' : 'right';\n        const heightProp = basePlacement === 'top' ? 'top' : 'bottom';\n        // eslint-disable-next-line no-param-reassign\n        state.modifiersData[name] = {\n            width: width - overflow[widthProp] - x,\n            height: height - overflow[heightProp] - y,\n        };\n    },\n};\n\n/**\n * Popper js modifier to apply the max height.\n */\nconst applyMaxHeight = {\n    name: 'applyMaxHeight',\n    enabled: true,\n    phase: 'beforeWrite',\n    requires: ['maxSize'],\n    fn({ state }: any) {\n        const { height } = state.modifiersData.maxSize;\n        // eslint-disable-next-line no-param-reassign\n        state.elements.popper.style.maxHeight = `${height - ARROW_SIZE}px`;\n    },\n};\n\ntype Options = Pick<\n    PopoverProps,\n    | 'offset'\n    | 'hasArrow'\n    | 'fitToAnchorWidth'\n    | 'fitWithinViewportHeight'\n    | 'boundaryRef'\n    | 'anchorRef'\n    | 'placement'\n    | 'style'\n    | 'zIndex'\n>;\n\ninterface Output {\n    styles: { arrow?: React.CSSProperties; popover?: React.CSSProperties };\n    attributes: any;\n    isPositioned: boolean;\n    position?: Placement;\n    setArrowElement?: React.Ref<HTMLDivElement>;\n    setPopperElement?: React.Ref<HTMLDivElement>;\n    popperElement: HTMLElement | null;\n}\n\nexport function usePopoverStyle({\n    offset,\n    hasArrow,\n    fitToAnchorWidth,\n    fitWithinViewportHeight,\n    boundaryRef,\n    anchorRef,\n    placement,\n    style,\n    zIndex,\n}: Options): Output {\n    const [popperElement, setPopperElement] = useState<null | HTMLElement>(null);\n    const [arrowElement, setArrowElement] = useState<null | HTMLElement>(null);\n\n    const actualOffset: [number, number] = [offset?.along ?? 0, (offset?.away ?? 0) + (hasArrow ? ARROW_SIZE : 0)];\n    const modifiers: any = [\n        {\n            name: 'offset',\n            options: { offset: actualOffset },\n        },\n    ];\n    if (hasArrow && arrowElement) {\n        modifiers.push({\n            name: 'arrow',\n            options: {\n                element: arrowElement,\n                padding: ARROW_SIZE / 2,\n            },\n        });\n    }\n    if (fitToAnchorWidth) {\n        const fitWidth = typeof fitToAnchorWidth === 'string' ? fitToAnchorWidth : FitAnchorWidth.MIN_WIDTH;\n        modifiers.push(sameWidth(fitWidth));\n    }\n    if (fitWithinViewportHeight) {\n        modifiers.push({ ...maxSize, options: { boundary: boundaryRef?.current } }, applyMaxHeight);\n    }\n    if (boundaryRef) {\n        modifiers.push(\n            { name: 'flip', options: { boundary: boundaryRef.current } },\n            { name: 'preventOverflow', options: { boundary: boundaryRef.current } },\n        );\n    }\n\n    const { styles, attributes, state, update } = usePopper(anchorRef.current, popperElement, { placement, modifiers });\n\n    // Auto update popover\n    useEffect(() => {\n        const { current: anchorElement } = anchorRef;\n        if (!update || !popperElement || !anchorElement || !WINDOW?.ResizeObserver) {\n            return undefined;\n        }\n        let running: ReturnType<typeof setTimeout> | undefined;\n        function updateRateLimited() {\n            if (running) return;\n            update?.();\n            running = setTimeout(() => {\n                running = undefined;\n            }, 100);\n        }\n        updateRateLimited();\n\n        // On anchor or popover resize\n        const resizeObserver = new ResizeObserver(updateRateLimited);\n        resizeObserver.observe(anchorElement);\n        resizeObserver.observe(popperElement);\n        return () => {\n            resizeObserver.disconnect();\n        };\n    }, [anchorRef, popperElement, update]);\n\n    const position = state?.placement ?? placement;\n\n    const popoverStyle = useMemo(() => {\n        const newStyles = { ...style, ...styles.popper, zIndex };\n\n        if (fitWithinViewportHeight && !newStyles.maxHeight) {\n            newStyles.maxHeight = WINDOW?.innerHeight || DOCUMENT?.documentElement.clientHeight;\n        }\n\n        return newStyles;\n    }, [style, styles.popper, zIndex, fitWithinViewportHeight]);\n\n    return {\n        styles: { arrow: styles.arrow, popover: popoverStyle },\n        attributes,\n        isPositioned: (state?.rects?.popper?.y ?? -1) >= 0,\n        position,\n        setArrowElement,\n        setPopperElement,\n        popperElement,\n    };\n}\n"],"names":["sameWidth","memoize","anchorWidthOption","name","enabled","phase","requires","fn","state","styles","popper","rects","reference","width","effect","elements","style","offsetWidth","maxSize","requiresIfExists","options","overflow","detectOverflow","y","x","modifiersData","preventOverflow","height","basePlacement","placement","split","widthProp","heightProp","applyMaxHeight","maxHeight","ARROW_SIZE","usePopoverStyle","offset","hasArrow","fitToAnchorWidth","fitWithinViewportHeight","boundaryRef","anchorRef","zIndex","popperElement","setPopperElement","useState","arrowElement","setArrowElement","actualOffset","along","away","modifiers","push","element","padding","fitWidth","FitAnchorWidth","MIN_WIDTH","boundary","current","attributes","update","usePopper","useEffect","anchorElement","WINDOW","ResizeObserver","undefined","running","updateRateLimited","setTimeout","resizeObserver","observe","disconnect","position","popoverStyle","useMemo","newStyles","innerHeight","DOCUMENT","documentElement","clientHeight","arrow","popover","isPositioned"],"mappings":"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"}

package/_internal/a45cc1b9.js

@@ -0,0 +1,128 @@
+import classNames from 'classnames';
+import { useRef, useCallback } from 'react';
+import { Theme, Kind } from '@lumx/core/js/constants';
+import { Dropdown } from './2d1acaa0.js';
+import { InputHelper } from './3119c1fe.js';
+import { useFocusTrap } from './0350c865.js';
+import { useListenFocus } from './bb5fb0f9.js';
+import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
+import { mergeRefs } from './27df0cb6.js';
+import { useId } from './11687649.js';
+import { useTheme } from './d8ee966d.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Placement } from './9d063548.js';
+
+/** The display name of the component. */
+const COMPONENT_NAME = 'Select';
+
+/** The default class name and classes prefix for this component. */
+const CLASSNAME = getRootClassName(COMPONENT_NAME);
+const WithSelectContext = (SelectElement, props, ref) => {
+  const defaultTheme = useTheme() || Theme.light;
+  const {
+    children,
+    className,
+    focusElement,
+    isMultiple,
+    closeOnClick = !isMultiple,
+    disabled,
+    error,
+    hasError,
+    helper,
+    id,
+    isDisabled = disabled,
+    isEmpty,
+    isOpen,
+    isRequired,
+    isValid,
+    label,
+    onClear,
+    onDropdownClose,
+    onInfiniteScroll,
+    onInputClick,
+    placeholder,
+    theme = defaultTheme,
+    value,
+    variant,
+    ...forwardedProps
+  } = props;
+  const generatedSelectId = useId();
+  const selectId = id || generatedSelectId;
+  const anchorRef = useRef(null);
+  const selectRef = useRef(null);
+  const dropdownRef = useRef(null);
+  const isFocus = useListenFocus(anchorRef);
+  const handleKeyboardNav = useCallback(evt => {
+    if ((evt.key === 'Enter' || evt.key === ' ' || evt.key === 'ArrowDown') && onInputClick) {
+      evt.preventDefault();
+      onInputClick();
+    }
+  }, [onInputClick]);
+  const onClose = () => {
+    if (onDropdownClose) {
+      onDropdownClose();
+    }
+    anchorRef?.current?.blur();
+  };
+
+  // Handle focus trap.
+  useFocusTrap(isOpen && dropdownRef.current, focusElement?.current);
+  return /*#__PURE__*/jsxs("div", {
+    ref: mergeRefs(ref, selectRef),
+    className: classNames(className, handleBasicClasses({
+      hasError,
+      hasLabel: Boolean(label),
+      hasPlaceholder: Boolean(placeholder),
+      hasValue: !isEmpty,
+      isDisabled,
+      isEmpty,
+      isFocus,
+      isOpen,
+      isValid,
+      prefix: CLASSNAME,
+      theme: theme === Theme.light ? Theme.light : Theme.dark
+    })),
+    children: [/*#__PURE__*/jsx(SelectElement, {
+      ...forwardedProps,
+      anchorRef: anchorRef,
+      "aria-disabled": isDisabled,
+      handleKeyboardNav: handleKeyboardNav,
+      hasError: hasError,
+      isDisabled: isDisabled,
+      isEmpty: isEmpty,
+      isRequired: isRequired,
+      isValid: isValid,
+      label: label,
+      placeholder: placeholder,
+      id: selectId,
+      theme: theme,
+      value: value,
+      variant: variant,
+      onClear: onClear,
+      onInputClick: onInputClick
+    }), /*#__PURE__*/jsx(Dropdown, {
+      anchorRef: anchorRef,
+      closeOnClick: closeOnClick,
+      closeOnClickAway: true,
+      closeOnEscape: true,
+      isOpen: !!isOpen,
+      placement: Placement.BOTTOM_START,
+      onClose: onClose,
+      onInfiniteScroll: onInfiniteScroll,
+      ref: dropdownRef,
+      children: children
+    }), hasError && error && /*#__PURE__*/jsx(InputHelper, {
+      className: `${CLASSNAME}__helper`,
+      kind: Kind.error,
+      theme: theme,
+      children: error
+    }), helper && /*#__PURE__*/jsx(InputHelper, {
+      className: `${CLASSNAME}__helper`,
+      theme: theme,
+      children: helper
+    })]
+  });
+};
+
+export { WithSelectContext };
+//# sourceMappingURL=a45cc1b9.js.map

package/_internal/a45cc1b9.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"a45cc1b9.js","sources":["../../src/components/select/WithSelectContext.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { Ref, useCallback, useRef } from 'react';\n\nimport { Placement } from '@lumx/react';\nimport { Kind, Theme } from '@lumx/core/js/constants';\nimport { Dropdown } from '@lumx/react/components/dropdown/Dropdown';\nimport { InputHelper } from '@lumx/react/components/input-helper/InputHelper';\nimport { useFocusTrap } from '@lumx/react/hooks/useFocusTrap';\nimport { useListenFocus } from '@lumx/react/hooks/useListenFocus';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { mergeRefs } from '@lumx/react/utils/react/mergeRefs';\n\nimport { useId } from '@lumx/react/hooks/useId';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { CoreSelectProps } from './constants';\n\n/** The display name of the component. */\nconst COMPONENT_NAME = 'Select';\n\n/** The default class name and classes prefix for this component. */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\nexport const WithSelectContext = (\n    SelectElement: React.FC<any>,\n    props: CoreSelectProps,\n    ref: Ref<HTMLDivElement>,\n): React.ReactElement => {\n    const defaultTheme = useTheme() || Theme.light;\n    const {\n        children,\n        className,\n        focusElement,\n        isMultiple,\n        closeOnClick = !isMultiple,\n        disabled,\n        error,\n        hasError,\n        helper,\n        id,\n        isDisabled = disabled,\n        isEmpty,\n        isOpen,\n        isRequired,\n        isValid,\n        label,\n        onClear,\n        onDropdownClose,\n        onInfiniteScroll,\n        onInputClick,\n        placeholder,\n        theme = defaultTheme,\n        value,\n        variant,\n        ...forwardedProps\n    } = props;\n    const generatedSelectId = useId();\n    const selectId = id || generatedSelectId;\n    const anchorRef = useRef<HTMLElement>(null);\n    const selectRef = useRef<HTMLDivElement>(null);\n    const dropdownRef = useRef<HTMLDivElement>(null);\n    const isFocus = useListenFocus(anchorRef);\n\n    const handleKeyboardNav = useCallback(\n        (evt: React.KeyboardEvent<HTMLElement>) => {\n            if ((evt.key === 'Enter' || evt.key === ' ' || evt.key === 'ArrowDown') && onInputClick) {\n                evt.preventDefault();\n                onInputClick();\n            }\n        },\n        [onInputClick],\n    );\n\n    const onClose = () => {\n        if (onDropdownClose) {\n            onDropdownClose();\n        }\n        anchorRef?.current?.blur();\n    };\n\n    // Handle focus trap.\n    useFocusTrap(isOpen && dropdownRef.current, focusElement?.current);\n\n    return (\n        <div\n            ref={mergeRefs(ref, selectRef)}\n            className={classNames(\n                className,\n                handleBasicClasses({\n                    hasError,\n                    hasLabel: Boolean(label),\n                    hasPlaceholder: Boolean(placeholder),\n                    hasValue: !isEmpty,\n                    isDisabled,\n                    isEmpty,\n                    isFocus,\n                    isOpen,\n                    isValid,\n                    prefix: CLASSNAME,\n                    theme: theme === Theme.light ? Theme.light : Theme.dark,\n                }),\n            )}\n        >\n            <SelectElement\n                {...forwardedProps}\n                anchorRef={anchorRef}\n                aria-disabled={isDisabled}\n                handleKeyboardNav={handleKeyboardNav}\n                hasError={hasError}\n                isDisabled={isDisabled}\n                isEmpty={isEmpty}\n                isRequired={isRequired}\n                isValid={isValid}\n                label={label}\n                placeholder={placeholder}\n                id={selectId}\n                theme={theme}\n                value={value}\n                variant={variant}\n                onClear={onClear}\n                onInputClick={onInputClick}\n            />\n            <Dropdown\n                anchorRef={anchorRef}\n                closeOnClick={closeOnClick}\n                closeOnClickAway\n                closeOnEscape\n                isOpen={!!isOpen}\n                placement={Placement.BOTTOM_START}\n                onClose={onClose}\n                onInfiniteScroll={onInfiniteScroll}\n                ref={dropdownRef}\n            >\n                {children}\n            </Dropdown>\n            {hasError && error && (\n                <InputHelper className={`${CLASSNAME}__helper`} kind={Kind.error} theme={theme}>\n                    {error}\n                </InputHelper>\n            )}\n            {helper && (\n                <InputHelper className={`${CLASSNAME}__helper`} theme={theme}>\n                    {helper}\n                </InputHelper>\n            )}\n        </div>\n    );\n};\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","WithSelectContext","SelectElement","props","ref","defaultTheme","useTheme","Theme","light","children","className","focusElement","isMultiple","closeOnClick","disabled","error","hasError","helper","id","isDisabled","isEmpty","isOpen","isRequired","isValid","label","onClear","onDropdownClose","onInfiniteScroll","onInputClick","placeholder","theme","value","variant","forwardedProps","generatedSelectId","useId","selectId","anchorRef","useRef","selectRef","dropdownRef","isFocus","useListenFocus","handleKeyboardNav","useCallback","evt","key","preventDefault","onClose","current","blur","useFocusTrap","_jsxs","mergeRefs","classNames","handleBasicClasses","hasLabel","Boolean","hasPlaceholder","hasValue","prefix","dark","_jsx","Dropdown","closeOnClickAway","closeOnEscape","placement","Placement","BOTTOM_START","InputHelper","kind","Kind"],"mappings":"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"}

package/_internal/a6be9f05.js

@@ -0,0 +1,75 @@
+import { useRef } from 'react';
+import classNames from 'classnames';
+import { useKeyboardListNavigation } from './2040beb8.js';
+import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
+import { mergeRefs } from './27df0cb6.js';
+import { forwardRef } from './bd8b3ec8.js';
+import { useInteractiveList } from './fdcf3942.js';
+import { jsx } from 'react/jsx-runtime';
+import { Size } from '@lumx/core/js/constants';
+
+/**
+ * Component display name.
+ */
+const COMPONENT_NAME = 'List';
+
+/**
+ * Component default class name and class prefix.
+ */
+const CLASSNAME = getRootClassName(COMPONENT_NAME);
+
+/**
+ * Component default props.
+ */
+const DEFAULT_PROPS = {
+  tabIndex: -1
+};
+
+/* eslint-disable jsx-a11y/no-noninteractive-tabindex */
+/**
+ * List component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+const InternalList = forwardRef((props, ref) => {
+  const {
+    children,
+    className,
+    isClickable,
+    itemPadding,
+    onListItemSelected,
+    tabIndex = DEFAULT_PROPS.tabIndex,
+    ...forwardedProps
+  } = props;
+  const listElementRef = useRef(null);
+  const {
+    items,
+    hasClickableItem
+  } = useInteractiveList({
+    items: children,
+    ref: listElementRef,
+    onListItemSelected
+  });
+  const clickable = hasClickableItem || isClickable;
+  return /*#__PURE__*/jsx("ul", {
+    ...forwardedProps,
+    className: classNames(className, handleBasicClasses({
+      prefix: CLASSNAME,
+      itemPadding: itemPadding ?? (clickable ? Size.big : undefined)
+    })),
+    tabIndex: tabIndex,
+    ref: mergeRefs(ref, listElementRef),
+    children: items
+  });
+});
+InternalList.displayName = COMPONENT_NAME;
+InternalList.className = CLASSNAME;
+InternalList.defaultProps = DEFAULT_PROPS;
+const List = Object.assign(InternalList, {
+  useKeyboardListNavigation
+});
+
+export { List };
+//# sourceMappingURL=a6be9f05.js.map

package/_internal/a6be9f05.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"a6be9f05.js","sources":["../../src/components/list/List.tsx"],"sourcesContent":["import { Key, ReactNode, SyntheticEvent, useRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Size } from '@lumx/react';\nimport { useKeyboardListNavigation } from '@lumx/react/hooks/useKeyboardListNavigation';\nimport { GenericProps } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { mergeRefs } from '@lumx/react/utils/react/mergeRefs';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\nimport { useInteractiveList } from './useInteractiveList';\n\n/**\n * Defines the props of the component.\n */\nexport interface ListProps extends GenericProps {\n    /** List content (should be ListItem, ListSubheader or ListDivider). */\n    children: ReactNode;\n    /**\n     * Whether the list items are clickable.\n     * @deprecated not needed anymore.\n     */\n    isClickable?: boolean;\n    /** Item padding size. */\n    itemPadding?: Extract<Size, 'big' | 'huge'>;\n    /** Tab index of the list. Default to -1 */\n    tabIndex?: number;\n    /**\n     * On list item selected callback.\n     *\n     * @param key   React key of the selected item.\n     * @param index Index of the selected item among the sibling items.\n     * @param evt   Source event (either mouse or keyboard event).\n     */\n    onListItemSelected?(key: Key, index: number, evt: SyntheticEvent): void;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'List';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<ListProps> = {\n    tabIndex: -1,\n};\n\n/* eslint-disable jsx-a11y/no-noninteractive-tabindex */\n/**\n * List component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nconst InternalList = forwardRef<ListProps, HTMLUListElement>((props, ref) => {\n    const {\n        children,\n        className,\n        isClickable,\n        itemPadding,\n        onListItemSelected,\n        tabIndex = DEFAULT_PROPS.tabIndex,\n        ...forwardedProps\n    } = props;\n    const listElementRef = useRef<HTMLUListElement>(null);\n\n    const { items, hasClickableItem } = useInteractiveList({\n        items: children,\n        ref: listElementRef,\n        onListItemSelected,\n    });\n    const clickable = hasClickableItem || isClickable;\n\n    return (\n        <ul\n            {...forwardedProps}\n            className={classNames(\n                className,\n                handleBasicClasses({\n                    prefix: CLASSNAME,\n                    itemPadding: itemPadding ?? (clickable ? Size.big : undefined),\n                }),\n            )}\n            tabIndex={tabIndex}\n            ref={mergeRefs(ref, listElementRef)}\n        >\n            {items}\n        </ul>\n    );\n});\nInternalList.displayName = COMPONENT_NAME;\nInternalList.className = CLASSNAME;\nInternalList.defaultProps = DEFAULT_PROPS;\n\nexport const List = Object.assign(InternalList, { useKeyboardListNavigation });\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","tabIndex","InternalList","forwardRef","props","ref","children","className","isClickable","itemPadding","onListItemSelected","forwardedProps","listElementRef","useRef","items","hasClickableItem","useInteractiveList","clickable","_jsx","classNames","handleBasicClasses","prefix","Size","big","undefined","mergeRefs","displayName","defaultProps","List","Object","assign","useKeyboardListNavigation"],"mappings":";;;;;;;;;;AAsCA;AACA;AACA;AACA,MAAMA,cAAc,GAAG,MAAM,CAAA;;AAE7B;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,CAAC,CAAA;;AAElD;AACA;AACA;AACA,MAAMG,aAAiC,GAAG;AACtCC,EAAAA,QAAQ,EAAE,CAAC,CAAA;AACf,CAAC,CAAA;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,YAAY,GAAGC,UAAU,CAA8B,CAACC,KAAK,EAAEC,GAAG,KAAK;EACzE,MAAM;IACFC,QAAQ;IACRC,SAAS;IACTC,WAAW;IACXC,WAAW;IACXC,kBAAkB;IAClBT,QAAQ,GAAGD,aAAa,CAACC,QAAQ;IACjC,GAAGU,cAAAA;AACP,GAAC,GAAGP,KAAK,CAAA;AACT,EAAA,MAAMQ,cAAc,GAAGC,MAAM,CAAmB,IAAI,CAAC,CAAA;EAErD,MAAM;IAAEC,KAAK;AAAEC,IAAAA,gBAAAA;GAAkB,GAAGC,kBAAkB,CAAC;AACnDF,IAAAA,KAAK,EAAER,QAAQ;AACfD,IAAAA,GAAG,EAAEO,cAAc;AACnBF,IAAAA,kBAAAA;AACJ,GAAC,CAAC,CAAA;AACF,EAAA,MAAMO,SAAS,GAAGF,gBAAgB,IAAIP,WAAW,CAAA;AAEjD,EAAA,oBACIU,GAAA,CAAA,IAAA,EAAA;AAAA,IAAA,GACQP,cAAc;AAClBJ,IAAAA,SAAS,EAAEY,UAAU,CACjBZ,SAAS,EACTa,kBAAkB,CAAC;AACfC,MAAAA,MAAM,EAAEvB,SAAS;MACjBW,WAAW,EAAEA,WAAW,KAAKQ,SAAS,GAAGK,IAAI,CAACC,GAAG,GAAGC,SAAS,CAAA;AACjE,KAAC,CACL,CAAE;AACFvB,IAAAA,QAAQ,EAAEA,QAAS;AACnBI,IAAAA,GAAG,EAAEoB,SAAS,CAACpB,GAAG,EAAEO,cAAc,CAAE;AAAAN,IAAAA,QAAA,EAEnCQ,KAAAA;AAAK,GACN,CAAC,CAAA;AAEb,CAAC,CAAC,CAAA;AACFZ,YAAY,CAACwB,WAAW,GAAG7B,cAAc,CAAA;AACzCK,YAAY,CAACK,SAAS,GAAGT,SAAS,CAAA;AAClCI,YAAY,CAACyB,YAAY,GAAG3B,aAAa,CAAA;AAElC,MAAM4B,IAAI,GAAGC,MAAM,CAACC,MAAM,CAAC5B,YAAY,EAAE;AAAE6B,EAAAA,yBAAAA;AAA0B,CAAC;;;;"}

package/_internal/{RawClickable-2c2b6a89.js → a6dc95cd.js}

@@ -1,9 +1,6 @@
-import React__default from 'react';
+import { forwardRefPolymorphic } from './ebd44733.js';
 import { jsx } from 'react/jsx-runtime';
 
-/** Same as `React.forwardRef` but inferring Ref type from the `as` prop. */
-const forwardRefPolymorphic = React__default.forwardRef;
-
 /**
  * Render clickable element (link, button or custom element)
  * (also does some basic disabled state handling)
@@ -48,5 +45,5 @@ const RawClickable = forwardRefPolymorphic((props, ref) => {
   });
 });
 
-export { RawClickable as R, forwardRefPolymorphic as f };
-//# sourceMappingURL=RawClickable-2c2b6a89.js.map
+export { RawClickable };
+//# sourceMappingURL=a6dc95cd.js.map

package/_internal/a6dc95cd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"a6dc95cd.js","sources":["../../src/utils/react/RawClickable.tsx"],"sourcesContent":["import { AriaAttributes, ElementType } from 'react';\nimport { forwardRefPolymorphic } from '@lumx/react/utils/react/forwardRefPolymorphic';\nimport { ComponentRef, HasPolymorphicAs } from '@lumx/react/utils/type';\nimport { HasRequiredLinkHref } from '@lumx/react/utils/type/HasRequiredLinkHref';\n\ntype ClickableElement = 'a' | 'button' | ElementType;\n\ntype BaseClickableProps<E extends ClickableElement> = {\n    children?: React.ReactNode;\n    isDisabled?: boolean;\n    disabled?: boolean;\n    'aria-disabled'?: AriaAttributes['aria-disabled'];\n    onClick?: React.MouseEventHandler<E>;\n};\n\nexport type RawClickableProps<E extends ClickableElement> = HasPolymorphicAs<E> &\n    HasRequiredLinkHref<E> &\n    BaseClickableProps<E>;\n\n/**\n * Render clickable element (link, button or custom element)\n * (also does some basic disabled state handling)\n */\nexport const RawClickable = forwardRefPolymorphic(\n    <E extends ClickableElement>(props: RawClickableProps<E>, ref: ComponentRef<E>) => {\n        const {\n            children,\n            onClick,\n            disabled,\n            isDisabled = disabled,\n            'aria-disabled': ariaDisabled,\n            as,\n            ...forwardedProps\n        } = props;\n\n        const isAnyDisabled = isDisabled || ariaDisabled === 'true' || ariaDisabled === true;\n\n        const Component = as as any;\n        let clickableProps;\n        if (Component === 'button') {\n            clickableProps = { type: forwardedProps.type || 'button', disabled: isDisabled };\n        } else {\n            clickableProps = { tabIndex: isDisabled ? '-1' : forwardedProps.tabIndex };\n        }\n\n        return (\n            <Component\n                ref={ref}\n                aria-disabled={isAnyDisabled || undefined}\n                {...forwardedProps}\n                {...clickableProps}\n                onClick={(event: any) => {\n                    if (isAnyDisabled) {\n                        event.stopPropagation();\n                        event.preventDefault();\n                        return;\n                    }\n                    onClick?.(event);\n                }}\n            >\n                {children}\n            </Component>\n        );\n    },\n);\n"],"names":["RawClickable","forwardRefPolymorphic","props","ref","children","onClick","disabled","isDisabled","ariaDisabled","as","forwardedProps","isAnyDisabled","Component","clickableProps","type","tabIndex","_jsx","undefined","event","stopPropagation","preventDefault"],"mappings":";;;AAmBA;AACA;AACA;AACA;AACO,MAAMA,YAAY,GAAGC,qBAAqB,CAC7C,CAA6BC,KAA2B,EAAEC,GAAoB,KAAK;EAC/E,MAAM;IACFC,QAAQ;IACRC,OAAO;IACPC,QAAQ;AACRC,IAAAA,UAAU,GAAGD,QAAQ;AACrB,IAAA,eAAe,EAAEE,YAAY;IAC7BC,EAAE;IACF,GAAGC,cAAAA;AACP,GAAC,GAAGR,KAAK,CAAA;EAET,MAAMS,aAAa,GAAGJ,UAAU,IAAIC,YAAY,KAAK,MAAM,IAAIA,YAAY,KAAK,IAAI,CAAA;EAEpF,MAAMI,SAAS,GAAGH,EAAS,CAAA;AAC3B,EAAA,IAAII,cAAc,CAAA;EAClB,IAAID,SAAS,KAAK,QAAQ,EAAE;AACxBC,IAAAA,cAAc,GAAG;AAAEC,MAAAA,IAAI,EAAEJ,cAAc,CAACI,IAAI,IAAI,QAAQ;AAAER,MAAAA,QAAQ,EAAEC,UAAAA;KAAY,CAAA;AACpF,GAAC,MAAM;AACHM,IAAAA,cAAc,GAAG;AAAEE,MAAAA,QAAQ,EAAER,UAAU,GAAG,IAAI,GAAGG,cAAc,CAACK,QAAAA;KAAU,CAAA;AAC9E,GAAA;EAEA,oBACIC,GAAA,CAACJ,SAAS,EAAA;AACNT,IAAAA,GAAG,EAAEA,GAAI;IACT,eAAeQ,EAAAA,aAAa,IAAIM,SAAU;AAAA,IAAA,GACtCP,cAAc;AAAA,IAAA,GACdG,cAAc;IAClBR,OAAO,EAAGa,KAAU,IAAK;AACrB,MAAA,IAAIP,aAAa,EAAE;QACfO,KAAK,CAACC,eAAe,EAAE,CAAA;QACvBD,KAAK,CAACE,cAAc,EAAE,CAAA;AACtB,QAAA,OAAA;AACJ,OAAA;MACAf,OAAO,GAAGa,KAAK,CAAC,CAAA;KAClB;AAAAd,IAAAA,QAAA,EAEDA,QAAAA;AAAQ,GACF,CAAC,CAAA;AAEpB,CACJ;;;;"}

package/_internal/a7abe967.js

@@ -0,0 +1,20 @@
+import React__default from 'react';
+
+const useEnhancedEffect = typeof window !== 'undefined' ? React__default.useLayoutEffect : React__default.useEffect;
+
+/**
+ * https://github.com/facebook/react/issues/14099#issuecomment-440013892
+ *
+ * @param fn A function to run
+ * @return A React callback
+ */
+function useEventCallback(fn) {
+  const ref = React__default.useRef(fn);
+  useEnhancedEffect(() => {
+    ref.current = fn;
+  });
+  return React__default.useCallback(event => ref.current(event), []);
+}
+
+export { useEventCallback as default };
+//# sourceMappingURL=a7abe967.js.map

package/_internal/a7abe967.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"a7abe967.js","sources":["../../src/hooks/useEventCallback.tsx"],"sourcesContent":["import React from 'react';\n\nconst useEnhancedEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;\n\n/**\n * https://github.com/facebook/react/issues/14099#issuecomment-440013892\n *\n * @param fn A function to run\n * @return A React callback\n */\nexport default function useEventCallback(fn: (...args: any[]) => any): (event: any) => any {\n    const ref = React.useRef(fn);\n    useEnhancedEffect(() => {\n        ref.current = fn;\n    });\n    return React.useCallback((event: any) => ref.current(event), []);\n}\n"],"names":["useEnhancedEffect","window","React","useLayoutEffect","useEffect","useEventCallback","fn","ref","useRef","current","useCallback","event"],"mappings":";;AAEA,MAAMA,iBAAiB,GAAG,OAAOC,MAAM,KAAK,WAAW,GAAGC,cAAK,CAACC,eAAe,GAAGD,cAAK,CAACE,SAAS,CAAA;;AAEjG;AACA;AACA;AACA;AACA;AACA;AACe,SAASC,gBAAgBA,CAACC,EAA2B,EAAuB;AACvF,EAAA,MAAMC,GAAG,GAAGL,cAAK,CAACM,MAAM,CAACF,EAAE,CAAC,CAAA;AAC5BN,EAAAA,iBAAiB,CAAC,MAAM;IACpBO,GAAG,CAACE,OAAO,GAAGH,EAAE,CAAA;AACpB,GAAC,CAAC,CAAA;AACF,EAAA,OAAOJ,cAAK,CAACQ,WAAW,CAAEC,KAAU,IAAKJ,GAAG,CAACE,OAAO,CAACE,KAAK,CAAC,EAAE,EAAE,CAAC,CAAA;AACpE;;;;"}

package/_internal/{components/expansion-panel-df812318.js → a89bf7bc.js}

@@ -1,17 +1,18 @@
 import React__default, { Children, useRef } from 'react';
 import classNames from 'classnames';
 import isEmpty from 'lodash/isEmpty';
-import { i as isComponent } from '../isComponent-78df9309.js';
+import { isComponent } from './ebe24fd7.js';
 import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
-import { p as partitionMulti } from '../partitionMulti-4daccdd5.js';
-import { u as useTheme } from '../ThemeContext-3181f000.js';
-import { f as forwardRef } from '../forwardRef-8bce732e.js';
-import { I as IS_BROWSER } from '../constants-d0e3f49e.js';
+import { partitionMulti } from './cb19eca6.js';
+import { useTheme } from './d8ee966d.js';
+import { forwardRef } from './bd8b3ec8.js';
+import { IS_BROWSER } from './6af61e2f.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { m as mdiChevronUp, a as mdiChevronDown } from '../chevron-up-0b9c76cb.js';
-import { DragHandle } from './drag-handle-eec23fc2.js';
+import { mdiChevronUp } from './0846b7f3.js';
+import { mdiChevronDown } from './256f8eff.js';
+import { DragHandle } from './840e9690.js';
 import { Theme, ColorPalette, Emphasis } from '@lumx/core/js/constants';
-import { I as IconButton } from '../IconButton-e11b5e74.js';
+import { IconButton } from './5a0207d9.js';
 
 /**
  * Component display name.
@@ -165,4 +166,4 @@ ExpansionPanel.className = CLASSNAME;
 ExpansionPanel.defaultProps = DEFAULT_PROPS;
 
 export { ExpansionPanel };
-//# sourceMappingURL=expansion-panel-df812318.js.map
+//# sourceMappingURL=a89bf7bc.js.map

package/_internal/a89bf7bc.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"a89bf7bc.js","sources":["../../src/components/expansion-panel/ExpansionPanel.tsx"],"sourcesContent":["import React, { Children, PropsWithChildren, ReactNode, useRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { mdiChevronDown, mdiChevronUp } from '@lumx/icons';\n\nimport isEmpty from 'lodash/isEmpty';\n\nimport { ColorPalette, DragHandle, Emphasis, IconButton, IconButtonProps, Theme } from '@lumx/react';\nimport { GenericProps, HasCloseMode, HasTheme, isComponent } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { partitionMulti } from '@lumx/react/utils/partitionMulti';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\nimport { IS_BROWSER } from '@lumx/react/constants';\n\n/**\n * Defines the props of the component.\n */\nexport interface ExpansionPanelProps extends GenericProps, HasCloseMode, HasTheme {\n    /** Whether the expansion panel has a background. */\n    hasBackground?: boolean;\n    /** Whether the header has a divider. */\n    hasHeaderDivider?: boolean;\n    /** Whether the component is open or not. */\n    isOpen?: boolean;\n    /** Label text (overwritten if a `<header>` is provided in the children). */\n    label?: string;\n    /** On open callback. */\n    onOpen?: (event: React.MouseEvent) => void;\n    /** On close callback. */\n    onClose?: (event: React.MouseEvent) => void;\n    /** Props to pass to the toggle button (minus those already set by the ExpansionPanel props). */\n    toggleButtonProps: Pick<IconButtonProps, 'label'> &\n        Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis' | 'color'>;\n    /** On toggle open or close callback. */\n    onToggleOpen?(shouldOpen: boolean, event: React.MouseEvent): void;\n    /** Children */\n    children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'ExpansionPanel';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<ExpansionPanelProps> = {\n    closeMode: 'unmount',\n};\n\nconst isDragHandle = isComponent(DragHandle);\nconst isHeader = isComponent('header');\nconst isFooter = isComponent('footer');\n\n/**\n * ExpansionPanel component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const ExpansionPanel = forwardRef<ExpansionPanelProps, HTMLDivElement>((props, ref) => {\n    const defaultTheme = useTheme() || Theme.light;\n    const {\n        className,\n        closeMode = DEFAULT_PROPS.closeMode,\n        children: anyChildren,\n        hasBackground,\n        hasHeaderDivider,\n        isOpen,\n        label,\n        onClose,\n        onOpen,\n        onToggleOpen,\n        theme = defaultTheme,\n        toggleButtonProps,\n        ...forwardedProps\n    } = props;\n\n    const children: ReactNode[] = Children.toArray(anyChildren);\n\n    // Partition children by types.\n    const [[dragHandle], [header], [footer], content] = partitionMulti(children, [isDragHandle, isHeader, isFooter]);\n\n    // Either take the header in children or create one with the label.\n    const headerProps: PropsWithChildren<any> = React.isValidElement(header) ? header.props : {};\n    const headerContent = !isEmpty(headerProps.children) ? (\n        headerProps.children\n    ) : (\n        <span className={`${CLASSNAME}__label`}>{label}</span>\n    );\n\n    const toggleOpen = (event: React.MouseEvent) => {\n        const shouldOpen = !isOpen;\n\n        if (onOpen && shouldOpen) {\n            onOpen(event);\n        }\n        if (onClose && !shouldOpen) {\n            onClose(event);\n        }\n        if (onToggleOpen) {\n            onToggleOpen(shouldOpen, event);\n        }\n    };\n\n    const color = theme === Theme.dark ? ColorPalette.light : ColorPalette.dark;\n\n    const rootClassName = classNames(\n        className,\n        handleBasicClasses({\n            hasBackground,\n            hasHeader: Boolean(!isEmpty(headerProps.children)),\n            hasHeaderDivider,\n            isClose: !isOpen,\n            isDraggable: Boolean(dragHandle),\n            isOpen,\n            prefix: CLASSNAME,\n            theme,\n        }),\n    );\n\n    const wrapperRef = useRef<HTMLDivElement>(null);\n\n    // Children stay visible while the open/close transition is running\n    const [isChildrenVisible, setChildrenVisible] = React.useState(isOpen);\n\n    const isOpenRef = React.useRef(isOpen);\n    React.useEffect(() => {\n        if (isOpen || closeMode === 'hide') {\n            setChildrenVisible(true);\n        } else if (!IS_BROWSER) {\n            // Outside a browser we can't wait for the transition\n            setChildrenVisible(false);\n        }\n        isOpenRef.current = isOpen;\n    }, [closeMode, isOpen]);\n\n    // Change children's visibility on the transition end\n    React.useEffect(() => {\n        const { current: wrapper } = wrapperRef;\n        if (!IS_BROWSER || !wrapper) {\n            return undefined;\n        }\n        const onTransitionEnd = () => {\n            setChildrenVisible(isOpenRef.current || closeMode === 'hide');\n        };\n        wrapper.addEventListener('transitionend', onTransitionEnd);\n        return () => wrapper.removeEventListener('transitionend', onTransitionEnd);\n    }, [closeMode]);\n\n    return (\n        <section ref={ref} {...forwardedProps} className={rootClassName}>\n            {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions */}\n            <header className={`${CLASSNAME}__header`} onClick={toggleOpen}>\n                {dragHandle && <div className={`${CLASSNAME}__header-drag`}>{dragHandle}</div>}\n\n                <div {...headerProps} className={`${CLASSNAME}__header-content`}>\n                    {headerContent}\n                </div>\n\n                <div className={`${CLASSNAME}__header-toggle`}>\n                    <IconButton\n                        {...toggleButtonProps}\n                        color={color}\n                        emphasis={Emphasis.low}\n                        icon={isOpen ? mdiChevronUp : mdiChevronDown}\n                        aria-expanded={isOpen || 'false'}\n                    />\n                </div>\n            </header>\n\n            <div className={`${CLASSNAME}__wrapper`} ref={wrapperRef}>\n                {(isOpen || isChildrenVisible) && (\n                    <div className={`${CLASSNAME}__container`}>\n                        <div className={`${CLASSNAME}__content`}>{content}</div>\n\n                        {footer && <div className={`${CLASSNAME}__footer`}>{footer}</div>}\n                    </div>\n                )}\n            </div>\n        </section>\n    );\n});\nExpansionPanel.displayName = COMPONENT_NAME;\nExpansionPanel.className = CLASSNAME;\nExpansionPanel.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","closeMode","isDragHandle","isComponent","DragHandle","isHeader","isFooter","ExpansionPanel","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","className","children","anyChildren","hasBackground","hasHeaderDivider","isOpen","label","onClose","onOpen","onToggleOpen","theme","toggleButtonProps","forwardedProps","Children","toArray","dragHandle","header","footer","content","partitionMulti","headerProps","React","isValidElement","headerContent","isEmpty","_jsx","toggleOpen","event","shouldOpen","color","dark","ColorPalette","rootClassName","classNames","handleBasicClasses","hasHeader","Boolean","isClose","isDraggable","prefix","wrapperRef","useRef","isChildrenVisible","setChildrenVisible","useState","isOpenRef","useEffect","IS_BROWSER","current","wrapper","undefined","onTransitionEnd","addEventListener","removeEventListener","_jsxs","onClick","IconButton","emphasis","Emphasis","low","icon","mdiChevronUp","mdiChevronDown","displayName","defaultProps"],"mappings":"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"}

package/_internal/a9d0f94d.js

@@ -0,0 +1,53 @@
+import { useState } from 'react';
+import { addMonthResetDay } from './e429bd82.js';
+import { isDateValid } from './658e09de.js';
+import { forwardRef } from './bd8b3ec8.js';
+import { COMPONENT_NAME, CLASSNAME } from './f8c49b24.js';
+import { DatePickerControlled } from './27a93417.js';
+import { jsx } from 'react/jsx-runtime';
+
+/**
+ * DatePicker component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+const DatePicker = forwardRef((props, ref) => {
+  const {
+    defaultMonth,
+    locale,
+    value,
+    onChange,
+    ...forwardedProps
+  } = props;
+  let referenceDate = value || defaultMonth || new Date();
+  if (!isDateValid(referenceDate)) {
+    // eslint-disable-next-line no-console
+    console.warn(`[@lumx/react/DatePicker] Invalid date provided ${referenceDate}`);
+    referenceDate = new Date();
+  }
+  const [selectedMonth, setSelectedMonth] = useState(referenceDate);
+  const setPrevMonth = () => setSelectedMonth(current => addMonthResetDay(current, -1));
+  const setNextMonth = () => setSelectedMonth(current => addMonthResetDay(current, +1));
+  const onDatePickerChange = newDate => {
+    onChange(newDate);
+  };
+  return /*#__PURE__*/jsx(DatePickerControlled, {
+    ref: ref,
+    ...forwardedProps,
+    defaultMonth: defaultMonth,
+    locale: locale,
+    value: value,
+    onPrevMonthChange: setPrevMonth,
+    onNextMonthChange: setNextMonth,
+    selectedMonth: selectedMonth,
+    onChange: onDatePickerChange,
+    onMonthChange: setSelectedMonth
+  });
+});
+DatePicker.displayName = COMPONENT_NAME;
+DatePicker.className = CLASSNAME;
+
+export { DatePicker };
+//# sourceMappingURL=a9d0f94d.js.map