@lumx/react 3.20.1-alpha.31 → 3.20.1-alpha.33

package/_internal/packages/lumx-react/src/components/popover/Popover-341f65fb.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Popover-341f65fb.js","sources":["../../../../../../../src/components/popover/Popover.tsx"],"sourcesContent":["import { ReactNode, RefObject, useRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { useCallbackOnEscape } from '@lumx/react/hooks/useCallbackOnEscape';\nimport { useFocus } from '@lumx/react/hooks/useFocus';\nimport { ClickAwayProvider } from '@lumx/react/utils/ClickAwayProvider';\nimport { DOCUMENT } from '@lumx/react/constants';\nimport { Comp, GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { useMergeRefs } from '@lumx/react/utils/react/mergeRefs';\nimport { useFocusTrap } from '@lumx/react/hooks/useFocusTrap';\nimport { skipRender } from '@lumx/react/utils/react/skipRender';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\nimport { ThemeProvider } from '@lumx/react/utils/theme/ThemeContext';\nimport { Portal } from '@lumx/react/utils';\nimport { useRestoreFocusOnClose } from './useRestoreFocusOnClose';\nimport { usePopoverStyle } from './usePopoverStyle';\nimport { Elevation, FitAnchorWidth, Offset, Placement, POPOVER_ZINDEX } from './constants';\n\n/**\n * Defines the props of the component.\n */\nexport interface PopoverProps extends GenericProps, HasTheme {\n    /** Reference to the DOM element used to set the position of the popover. */\n    anchorRef: React.RefObject<HTMLElement>;\n    /** Customize the root element. (Must accept ref forwarding and props forwarding!). */\n    as?: React.ElementType;\n    /** Element which will act as boundary when opening the popover. */\n    boundaryRef?: RefObject<HTMLElement>;\n    /** Content. */\n    children: ReactNode;\n    /** Whether a click anywhere out of the popover would close it. */\n    closeOnClickAway?: boolean;\n    /** Whether an escape key press would close the popover. */\n    closeOnEscape?: boolean;\n    /** Shadow elevation. */\n    elevation?: Elevation;\n    /**\n     * Manage popover width:\n     *   - `maxWidth`: popover not bigger than anchor\n     *   - `minWidth` or `true`: popover not smaller than anchor\n     *   - `width`: popover equal to the anchor.\n     */\n    fitToAnchorWidth?: FitAnchorWidth | boolean;\n    /** Shrink popover if even after flipping there is not enough space. */\n    fitWithinViewportHeight?: boolean;\n    /** Element to focus when opening the popover. */\n    focusElement?: RefObject<HTMLElement>;\n    /** Whether the focus should go back on the anchor when popover closes and focus is within. */\n    focusAnchorOnClose?: boolean;\n    /** Whether we put an arrow or not. */\n    hasArrow?: boolean;\n    /** Whether the popover is open or not. */\n    isOpen: boolean;\n    /** Offset placement relative to anchor. */\n    offset?: Offset;\n    /** Reference to the parent element that triggered the popover (will get back focus on close or else fallback on the anchor element). */\n    parentElement?: RefObject<HTMLElement>;\n    /** Placement relative to anchor. */\n    placement?: Placement;\n    /** Whether the popover should be rendered into a DOM node that exists outside the DOM hierarchy of the parent component. */\n    usePortal?: boolean;\n    /** The element in which the focus trap should be set. Default to popover. */\n    focusTrapZoneElement?: RefObject<HTMLElement>;\n    /** Z-axis position. */\n    zIndex?: number;\n    /** On close callback (on click away or Escape pressed). */\n    onClose?(): void;\n    /** Whether the popover should trap the focus within itself. Default to false. */\n    withFocusTrap?: boolean;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Popover';\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<PopoverProps> = {\n    elevation: 3,\n    placement: Placement.AUTO,\n    focusAnchorOnClose: true,\n    usePortal: true,\n    zIndex: POPOVER_ZINDEX,\n};\n\n// Inner component (must be wrapped before export)\nconst _InnerPopover = forwardRef<PopoverProps, HTMLDivElement>((props, ref) => {\n    const {\n        anchorRef,\n        as: Component = 'div',\n        children,\n        className,\n        closeOnClickAway,\n        closeOnEscape,\n        elevation = DEFAULT_PROPS.elevation,\n        focusElement,\n        hasArrow,\n        isOpen,\n        onClose,\n        parentElement,\n        usePortal = DEFAULT_PROPS.usePortal,\n        focusAnchorOnClose = DEFAULT_PROPS.focusAnchorOnClose,\n        withFocusTrap,\n        boundaryRef,\n        fitToAnchorWidth,\n        fitWithinViewportHeight,\n        focusTrapZoneElement,\n        offset,\n        placement = DEFAULT_PROPS.placement,\n        style,\n        theme,\n        zIndex = DEFAULT_PROPS.zIndex,\n        ...forwardedProps\n    } = props;\n    const popoverRef = useRef<HTMLDivElement>(null);\n\n    const { styles, attributes, isPositioned, position, setArrowElement, setPopperElement, popperElement } =\n        usePopoverStyle({\n            offset,\n            hasArrow,\n            fitToAnchorWidth,\n            fitWithinViewportHeight,\n            boundaryRef,\n            anchorRef,\n            placement,\n            style,\n            zIndex,\n        });\n\n    const unmountSentinel = useRestoreFocusOnClose({ focusAnchorOnClose, anchorRef, parentElement }, popperElement);\n    const focusZoneElement = focusTrapZoneElement?.current || popoverRef?.current;\n\n    useCallbackOnEscape(onClose, isOpen && closeOnEscape);\n\n    /** Only set focus within if the focus trap is disabled as they interfere with one another. */\n    useFocus(focusElement?.current, !withFocusTrap && isOpen && isPositioned);\n    useFocusTrap(withFocusTrap && isOpen && focusZoneElement, focusElement?.current);\n\n    const clickAwayRefs = useRef([popoverRef, anchorRef]);\n    const mergedRefs = useMergeRefs<HTMLDivElement>(setPopperElement, ref, popoverRef);\n\n    return isOpen ? (\n        <Portal enabled={usePortal}>\n            <Component\n                {...forwardedProps}\n                ref={mergedRefs}\n                className={classNames(\n                    className,\n                    handleBasicClasses({\n                        prefix: CLASSNAME,\n                        theme,\n                        elevation: Math.min(elevation || 0, 5),\n                        position,\n                        isInitializing: !styles.popover?.transform,\n                    }),\n                )}\n                style={styles.popover}\n                {...attributes.popper}\n            >\n                {unmountSentinel}\n                <ClickAwayProvider callback={closeOnClickAway && onClose} childrenRefs={clickAwayRefs}>\n                    {hasArrow && (\n                        <div ref={setArrowElement} className={`${CLASSNAME}__arrow`} style={styles.arrow}>\n                            <svg viewBox=\"0 0 14 14\" aria-hidden>\n                                <path d=\"M8 3.49C7.62 2.82 6.66 2.82 6.27 3.48L.04 14 14.04 14 8 3.49Z\" />\n                            </svg>\n                        </div>\n                    )}\n                    <ThemeProvider value={theme}>{children}</ThemeProvider>\n                </ClickAwayProvider>\n            </Component>\n        </Portal>\n    ) : null;\n});\n_InnerPopover.displayName = COMPONENT_NAME;\n\n/**\n * Popover component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const Popover: Comp<PopoverProps, HTMLDivElement> = skipRender(\n    // Skip render in SSR\n    () => Boolean(DOCUMENT),\n    _InnerPopover,\n);\nPopover.displayName = COMPONENT_NAME;\nPopover.className = CLASSNAME;\nPopover.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","elevation","placement","Placement","AUTO","focusAnchorOnClose","usePortal","zIndex","POPOVER_ZINDEX","_InnerPopover","forwardRef","props","ref","anchorRef","as","Component","children","className","closeOnClickAway","closeOnEscape","focusElement","hasArrow","isOpen","onClose","parentElement","withFocusTrap","boundaryRef","fitToAnchorWidth","fitWithinViewportHeight","focusTrapZoneElement","offset","style","theme","forwardedProps","popoverRef","useRef","styles","attributes","isPositioned","position","setArrowElement","setPopperElement","popperElement","usePopoverStyle","unmountSentinel","useRestoreFocusOnClose","focusZoneElement","current","useCallbackOnEscape","useFocus","useFocusTrap","clickAwayRefs","mergedRefs","useMergeRefs","_jsx","Portal","enabled","_jsxs","classNames","handleBasicClasses","prefix","Math","min","isInitializing","popover","transform","popper","ClickAwayProvider","callback","childrenRefs","arrow","viewBox","d","ThemeProvider","value","displayName","Popover","skipRender","Boolean","DOCUMENT","defaultProps"],"mappings":"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"}

package/_internal/packages/lumx-react/src/components/popover/constants-9d063548.js

@@ -0,0 +1,49 @@
+/**
+ * Different possible placements for the popover.
+ */
+const Placement = {
+  AUTO: 'auto',
+  AUTO_END: 'auto-end',
+  AUTO_START: 'auto-start',
+  TOP: 'top',
+  TOP_END: 'top-end',
+  TOP_START: 'top-start',
+  RIGHT: 'right',
+  RIGHT_END: 'right-end',
+  RIGHT_START: 'right-start',
+  BOTTOM: 'bottom',
+  BOTTOM_END: 'bottom-end',
+  BOTTOM_START: 'bottom-start',
+  LEFT: 'left',
+  LEFT_END: 'left-end',
+  LEFT_START: 'left-start'
+};
+
+/**
+ * Offset of the popover.
+ */
+
+/**
+ * Popover elevation index.
+ */
+
+/**
+ * Popover fit anchor width options.
+ */
+const FitAnchorWidth = {
+  MAX_WIDTH: 'maxWidth',
+  MIN_WIDTH: 'minWidth',
+  WIDTH: 'width'
+};
+/**
+ * Arrow size (in pixel).
+ */
+const ARROW_SIZE = 14;
+
+/**
+ * Popover default z-index
+ */
+const POPOVER_ZINDEX = 9999;
+
+export { ARROW_SIZE, FitAnchorWidth, POPOVER_ZINDEX, Placement };
+//# sourceMappingURL=constants-9d063548.js.map

package/_internal/packages/lumx-react/src/components/popover/constants-9d063548.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants-9d063548.js","sources":["../../../../../../../src/components/popover/constants.ts"],"sourcesContent":["import { ValueOf } from '@lumx/react/utils/type';\n\n/**\n * Different possible placements for the popover.\n */\nexport const Placement = {\n    AUTO: 'auto',\n    AUTO_END: 'auto-end',\n    AUTO_START: 'auto-start',\n\n    TOP: 'top',\n    TOP_END: 'top-end',\n    TOP_START: 'top-start',\n\n    RIGHT: 'right',\n    RIGHT_END: 'right-end',\n    RIGHT_START: 'right-start',\n\n    BOTTOM: 'bottom',\n    BOTTOM_END: 'bottom-end',\n    BOTTOM_START: 'bottom-start',\n\n    LEFT: 'left',\n    LEFT_END: 'left-end',\n    LEFT_START: 'left-start',\n} as const;\nexport type Placement = ValueOf<typeof Placement>;\n\n/**\n * Offset of the popover.\n */\nexport interface Offset {\n    /** Offset size along the reference. */\n    along?: number;\n    /** Offset size away from the reference. */\n    away?: number;\n}\n\n/**\n * Popover elevation index.\n */\nexport type Elevation = 1 | 2 | 3 | 4 | 5;\n\n/**\n * Popover fit anchor width options.\n */\nexport const FitAnchorWidth = {\n    MAX_WIDTH: 'maxWidth',\n    MIN_WIDTH: 'minWidth',\n    WIDTH: 'width',\n} as const;\nexport type FitAnchorWidth = ValueOf<typeof FitAnchorWidth>;\n\n/**\n * Arrow size (in pixel).\n */\nexport const ARROW_SIZE = 14;\n\n/**\n * Popover default z-index\n */\nexport const POPOVER_ZINDEX = 9999;\n"],"names":["Placement","AUTO","AUTO_END","AUTO_START","TOP","TOP_END","TOP_START","RIGHT","RIGHT_END","RIGHT_START","BOTTOM","BOTTOM_END","BOTTOM_START","LEFT","LEFT_END","LEFT_START","FitAnchorWidth","MAX_WIDTH","MIN_WIDTH","WIDTH","ARROW_SIZE","POPOVER_ZINDEX"],"mappings":"AAEA;AACA;AACA;AACO,MAAMA,SAAS,GAAG;AACrBC,EAAAA,IAAI,EAAE,MAAM;AACZC,EAAAA,QAAQ,EAAE,UAAU;AACpBC,EAAAA,UAAU,EAAE,YAAY;AAExBC,EAAAA,GAAG,EAAE,KAAK;AACVC,EAAAA,OAAO,EAAE,SAAS;AAClBC,EAAAA,SAAS,EAAE,WAAW;AAEtBC,EAAAA,KAAK,EAAE,OAAO;AACdC,EAAAA,SAAS,EAAE,WAAW;AACtBC,EAAAA,WAAW,EAAE,aAAa;AAE1BC,EAAAA,MAAM,EAAE,QAAQ;AAChBC,EAAAA,UAAU,EAAE,YAAY;AACxBC,EAAAA,YAAY,EAAE,cAAc;AAE5BC,EAAAA,IAAI,EAAE,MAAM;AACZC,EAAAA,QAAQ,EAAE,UAAU;AACpBC,EAAAA,UAAU,EAAE,YAAA;AAChB,EAAU;;AAGV;AACA;AACA;;AAQA;AACA;AACA;;AAGA;AACA;AACA;AACO,MAAMC,cAAc,GAAG;AAC1BC,EAAAA,SAAS,EAAE,UAAU;AACrBC,EAAAA,SAAS,EAAE,UAAU;AACrBC,EAAAA,KAAK,EAAE,OAAA;AACX,EAAU;AAGV;AACA;AACA;AACO,MAAMC,UAAU,GAAG,GAAE;;AAE5B;AACA;AACA;AACO,MAAMC,cAAc,GAAG;;;;"}

package/_internal/packages/lumx-react/src/components/popover/usePopoverStyle-e067fbfc.js

@@ -0,0 +1,198 @@
+import { useState, useEffect, useMemo } from 'react';
+import memoize from 'lodash/memoize';
+import { WINDOW, DOCUMENT } from '../../constants-6af61e2f.js';
+import { usePopper } from '../../hooks/usePopper-3e9a7aa1.js';
+import { ARROW_SIZE, FitAnchorWidth } from './constants-9d063548.js';
+import detectOverflow from '../../../../../node_modules/@popperjs/core/lib/utils/detectOverflow-70184010.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=usePopoverStyle-e067fbfc.js.map

package/_internal/packages/lumx-react/src/components/popover/usePopoverStyle-e067fbfc.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePopoverStyle-e067fbfc.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/packages/lumx-react/src/components/popover/useRestoreFocusOnClose-36ed4d2a.js

@@ -0,0 +1,47 @@
+import React__default from 'react';
+import { getFirstAndLastFocusable } from '../../utils/browser/focus/getFirstAndLastFocusable-394b48f4.js';
+import { OnBeforeUnmount } from '../../utils/react/OnBeforeUnmount-6417ddb1.js';
+import { jsx } from 'react/jsx-runtime';
+
+/**
+ * Provides an unmount sentinel to inject in the popover to detect when it closes and restore the focus to the
+ * anchor if needed.
+ */
+function useRestoreFocusOnClose({
+  focusAnchorOnClose,
+  anchorRef,
+  parentElement
+}, popoverElement) {
+  const onBeforeUnmountRef = React__default.useRef();
+  React__default.useEffect(() => {
+    if (!popoverElement || !focusAnchorOnClose) {
+      onBeforeUnmountRef.current = undefined;
+      return;
+    }
+    onBeforeUnmountRef.current = () => {
+      const isFocusWithin = popoverElement?.contains(document.activeElement);
+      if (!isFocusWithin) return;
+
+      // On next render
+      setTimeout(() => {
+        const anchor = anchorRef.current;
+        const elementToFocus =
+        // Provided parent element
+        parentElement?.current || (
+        // Or first focusable element in anchor
+        anchor ? getFirstAndLastFocusable(anchor).first : undefined) ||
+        // Fallback to anchor
+        anchor;
+        elementToFocus?.focus({
+          preventScroll: true
+        });
+      }, 0);
+    };
+  }, [anchorRef, focusAnchorOnClose, parentElement, popoverElement]);
+  return /*#__PURE__*/jsx(OnBeforeUnmount, {
+    callbackRef: onBeforeUnmountRef
+  });
+}
+
+export { useRestoreFocusOnClose };
+//# sourceMappingURL=useRestoreFocusOnClose-36ed4d2a.js.map

package/_internal/packages/lumx-react/src/components/popover/useRestoreFocusOnClose-36ed4d2a.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRestoreFocusOnClose-36ed4d2a.js","sources":["../../../../../../../src/components/popover/useRestoreFocusOnClose.tsx"],"sourcesContent":["import React from 'react';\nimport { getFirstAndLastFocusable } from '@lumx/react/utils/browser/focus/getFirstAndLastFocusable';\nimport { OnBeforeUnmount } from '@lumx/react/utils/react/OnBeforeUnmount';\nimport type { PopoverProps } from './Popover';\n\n/**\n * Provides an unmount sentinel to inject in the popover to detect when it closes and restore the focus to the\n * anchor if needed.\n */\nexport function useRestoreFocusOnClose(\n    {\n        focusAnchorOnClose,\n        anchorRef,\n        parentElement,\n    }: Pick<PopoverProps, 'focusAnchorOnClose' | 'anchorRef' | 'parentElement'>,\n    popoverElement?: HTMLElement | null,\n) {\n    const onBeforeUnmountRef = React.useRef<(() => void) | undefined>();\n\n    React.useEffect(() => {\n        if (!popoverElement || !focusAnchorOnClose) {\n            onBeforeUnmountRef.current = undefined;\n            return;\n        }\n\n        onBeforeUnmountRef.current = () => {\n            const isFocusWithin = popoverElement?.contains(document.activeElement);\n            if (!isFocusWithin) return;\n\n            // On next render\n            setTimeout(() => {\n                const anchor = anchorRef.current;\n                const elementToFocus =\n                    // Provided parent element\n                    parentElement?.current ||\n                    // Or first focusable element in anchor\n                    (anchor ? getFirstAndLastFocusable(anchor).first : undefined) ||\n                    // Fallback to anchor\n                    anchor;\n\n                elementToFocus?.focus({ preventScroll: true });\n            }, 0);\n        };\n    }, [anchorRef, focusAnchorOnClose, parentElement, popoverElement]);\n\n    return <OnBeforeUnmount callbackRef={onBeforeUnmountRef} />;\n}\n"],"names":["useRestoreFocusOnClose","focusAnchorOnClose","anchorRef","parentElement","popoverElement","onBeforeUnmountRef","React","useRef","useEffect","current","undefined","isFocusWithin","contains","document","activeElement","setTimeout","anchor","elementToFocus","getFirstAndLastFocusable","first","focus","preventScroll","_jsx","OnBeforeUnmount","callbackRef"],"mappings":";;;;;AAKA;AACA;AACA;AACA;AACO,SAASA,sBAAsBA,CAClC;EACIC,kBAAkB;EAClBC,SAAS;AACTC,EAAAA,aAAAA;AACsE,CAAC,EAC3EC,cAAmC,EACrC;AACE,EAAA,MAAMC,kBAAkB,GAAGC,cAAK,CAACC,MAAM,EAA4B,CAAA;EAEnED,cAAK,CAACE,SAAS,CAAC,MAAM;AAClB,IAAA,IAAI,CAACJ,cAAc,IAAI,CAACH,kBAAkB,EAAE;MACxCI,kBAAkB,CAACI,OAAO,GAAGC,SAAS,CAAA;AACtC,MAAA,OAAA;AACJ,KAAA;IAEAL,kBAAkB,CAACI,OAAO,GAAG,MAAM;MAC/B,MAAME,aAAa,GAAGP,cAAc,EAAEQ,QAAQ,CAACC,QAAQ,CAACC,aAAa,CAAC,CAAA;MACtE,IAAI,CAACH,aAAa,EAAE,OAAA;;AAEpB;AACAI,MAAAA,UAAU,CAAC,MAAM;AACb,QAAA,MAAMC,MAAM,GAAGd,SAAS,CAACO,OAAO,CAAA;AAChC,QAAA,MAAMQ,cAAc;AAChB;AACAd,QAAAA,aAAa,EAAEM,OAAO;AACtB;QACCO,MAAM,GAAGE,wBAAwB,CAACF,MAAM,CAAC,CAACG,KAAK,GAAGT,SAAS,CAAC;AAC7D;QACAM,MAAM,CAAA;QAEVC,cAAc,EAAEG,KAAK,CAAC;AAAEC,UAAAA,aAAa,EAAE,IAAA;AAAK,SAAC,CAAC,CAAA;OACjD,EAAE,CAAC,CAAC,CAAA;KACR,CAAA;GACJ,EAAE,CAACnB,SAAS,EAAED,kBAAkB,EAAEE,aAAa,EAAEC,cAAc,CAAC,CAAC,CAAA;EAElE,oBAAOkB,GAAA,CAACC,eAAe,EAAA;AAACC,IAAAA,WAAW,EAAEnB,kBAAAA;AAAmB,GAAE,CAAC,CAAA;AAC/D;;;;"}

package/_internal/packages/lumx-react/src/components/popover-dialog/PopoverDialog-ffd6c5a1.js

@@ -0,0 +1,67 @@
+import classNames from 'classnames';
+import { getRootClassName } from '@lumx/core/js/utils/className';
+import { forwardRef } from '../../utils/react/forwardRef-bd8b3ec8.js';
+import { Popover } from '../popover/Popover-341f65fb.js';
+import { jsx } from 'react/jsx-runtime';
+import { HeadingLevelProvider } from '../heading/HeadingLevelProvider-7bd8f886.js';
+
+/**
+ * Component display name.
+ */
+const COMPONENT_NAME = 'PopoverDialog';
+
+/**
+ * Component default class name and class prefix.
+ */
+const CLASSNAME = getRootClassName(COMPONENT_NAME);
+
+/**
+ * Component default props.
+ */
+const DEFAULT_PROPS = {};
+
+/**
+ * PopoverDialog component.
+ * Defines a popover that acts like a dialog
+ * * Has a dialog aria role
+ * * Sets a focus trap within the popover
+ * * Closes on click away and escape.
+ */
+const PopoverDialog = forwardRef((props, ref) => {
+  const {
+    children,
+    isOpen,
+    focusElement,
+    'aria-label': ariaLabel,
+    label = ariaLabel,
+    className,
+    ...forwardedProps
+  } = props;
+  return /*#__PURE__*/jsx(Popover, {
+    ...forwardedProps,
+    ref: ref,
+    className: classNames(className, CLASSNAME),
+    role: "dialog",
+    "aria-modal": "true"
+    /**
+     * If a label is set, set as aria-label.
+     * If it is undefined, the label can be set using the `aria-label` and `aria-labelledby` props
+     */,
+    "aria-label": label,
+    isOpen: isOpen,
+    focusElement: focusElement,
+    closeOnClickAway: true,
+    closeOnEscape: true,
+    withFocusTrap: true,
+    children: /*#__PURE__*/jsx(HeadingLevelProvider, {
+      level: 2,
+      children: children
+    })
+  });
+});
+PopoverDialog.displayName = COMPONENT_NAME;
+PopoverDialog.className = CLASSNAME;
+PopoverDialog.defaultProps = DEFAULT_PROPS;
+
+export { PopoverDialog };
+//# sourceMappingURL=PopoverDialog-ffd6c5a1.js.map

package/_internal/packages/lumx-react/src/components/popover-dialog/PopoverDialog-ffd6c5a1.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PopoverDialog-ffd6c5a1.js","sources":["../../../../../../../src/components/popover-dialog/PopoverDialog.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { HasAriaLabelOrLabelledBy } from '@lumx/react/utils/type';\nimport { getRootClassName } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\nimport { HeadingLevelProvider } from '@lumx/react/components/heading';\nimport { Popover, PopoverProps } from '../popover/Popover';\n\n/**\n * PopoverDialog props.\n * The PopoverDialog has the same props as the Popover but requires an accessible label.\n */\nexport type PopoverDialogProps = PopoverProps & HasAriaLabelOrLabelledBy;\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'PopoverDialog';\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<PopoverDialogProps> = {};\n\n/**\n * PopoverDialog component.\n * Defines a popover that acts like a dialog\n * * Has a dialog aria role\n * * Sets a focus trap within the popover\n * * Closes on click away and escape.\n */\nexport const PopoverDialog = forwardRef<PopoverDialogProps, HTMLDivElement>((props, ref) => {\n    const {\n        children,\n        isOpen,\n        focusElement,\n        'aria-label': ariaLabel,\n        label = ariaLabel,\n        className,\n        ...forwardedProps\n    } = props;\n\n    return (\n        <Popover\n            {...forwardedProps}\n            ref={ref}\n            className={classNames(className, CLASSNAME)}\n            role=\"dialog\"\n            aria-modal=\"true\"\n            /**\n             * If a label is set, set as aria-label.\n             * If it is undefined, the label can be set using the `aria-label` and `aria-labelledby` props\n             */\n            aria-label={label}\n            isOpen={isOpen}\n            focusElement={focusElement}\n            closeOnClickAway\n            closeOnEscape\n            withFocusTrap\n        >\n            <HeadingLevelProvider level={2}>{children}</HeadingLevelProvider>\n        </Popover>\n    );\n});\n\nPopoverDialog.displayName = COMPONENT_NAME;\nPopoverDialog.className = CLASSNAME;\nPopoverDialog.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","PopoverDialog","forwardRef","props","ref","children","isOpen","focusElement","ariaLabel","label","className","forwardedProps","_jsx","Popover","classNames","role","closeOnClickAway","closeOnEscape","withFocusTrap","HeadingLevelProvider","level","displayName","defaultProps"],"mappings":";;;;;;;AAeA;AACA;AACA;AACA,MAAMA,cAAc,GAAG,eAAe,CAAA;;AAEtC;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,CAAC,CAAA;;AAElD;AACA;AACA;AACA,MAAMG,aAA0C,GAAG,EAAE,CAAA;;AAErD;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMC,aAAa,GAAGC,UAAU,CAAqC,CAACC,KAAK,EAAEC,GAAG,KAAK;EACxF,MAAM;IACFC,QAAQ;IACRC,MAAM;IACNC,YAAY;AACZ,IAAA,YAAY,EAAEC,SAAS;AACvBC,IAAAA,KAAK,GAAGD,SAAS;IACjBE,SAAS;IACT,GAAGC,cAAAA;AACP,GAAC,GAAGR,KAAK,CAAA;EAET,oBACIS,GAAA,CAACC,OAAO,EAAA;AAAA,IAAA,GACAF,cAAc;AAClBP,IAAAA,GAAG,EAAEA,GAAI;AACTM,IAAAA,SAAS,EAAEI,UAAU,CAACJ,SAAS,EAAEZ,SAAS,CAAE;AAC5CiB,IAAAA,IAAI,EAAC,QAAQ;IACb,YAAW,EAAA,MAAA;AACX;AACZ;AACA;AACA;AACY,IAAA,YAAA,EAAYN,KAAM;AAClBH,IAAAA,MAAM,EAAEA,MAAO;AACfC,IAAAA,YAAY,EAAEA,YAAa;IAC3BS,gBAAgB,EAAA,IAAA;IAChBC,aAAa,EAAA,IAAA;IACbC,aAAa,EAAA,IAAA;IAAAb,QAAA,eAEbO,GAAA,CAACO,oBAAoB,EAAA;AAACC,MAAAA,KAAK,EAAE,CAAE;AAAAf,MAAAA,QAAA,EAAEA,QAAAA;KAA+B,CAAA;AAAC,GAC5D,CAAC,CAAA;AAElB,CAAC,EAAC;AAEFJ,aAAa,CAACoB,WAAW,GAAGxB,cAAc,CAAA;AAC1CI,aAAa,CAACS,SAAS,GAAGZ,SAAS,CAAA;AACnCG,aAAa,CAACqB,YAAY,GAAGtB,aAAa;;;;"}

package/_internal/{components/post-block-478bc3b8.js → packages/lumx-react/src/components/post-block/PostBlock-91fd05ab.js}

@@ -1,11 +1,12 @@
 import classNames from 'classnames';
+import isObject from 'lodash/isObject';
 import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
-import { u as useTheme } from '../ThemeContext-3181f000.js';
-import { f as forwardRef } from '../forwardRef-8bce732e.js';
+import { useTheme } from '../../utils/theme/ThemeContext-d8ee966d.js';
+import { forwardRef } from '../../utils/react/forwardRef-bd8b3ec8.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { ThumbnailVariant } from './thumbnail-cb55b26c.js';
+import { ThumbnailVariant } from '../thumbnail/types-58418448.js';
 import { Orientation, Theme } from '@lumx/core/js/constants';
-import { T as Thumbnail } from '../Thumbnail-d2001ccb.js';
+import { Thumbnail } from '../thumbnail/Thumbnail-49bab66c.js';
 
 /**
  * Component display name.
@@ -48,13 +49,6 @@ const PostBlock = forwardRef((props, ref) => {
     title,
     ...forwardedProps
   } = props;
-
-  // Display text as string or HTML
-  const textContent = typeof text === 'string' ? {
-    children: text
-  } : {
-    dangerouslySetInnerHTML: text
-  };
   return /*#__PURE__*/jsxs("div", {
     ref: ref,
     className: classNames(className, handleBasicClasses({
@@ -83,9 +77,15 @@ const PostBlock = forwardRef((props, ref) => {
       }), meta && /*#__PURE__*/jsx("span", {
         className: `${CLASSNAME}__meta`,
         children: meta
-      }), /*#__PURE__*/jsx("p", {
+      }), isObject(text) && text.__html ?
+      /*#__PURE__*/
+      // eslint-disable-next-line react/no-danger
+      jsx("p", {
+        dangerouslySetInnerHTML: text,
+        className: `${CLASSNAME}__text`
+      }) : /*#__PURE__*/jsx("p", {
         className: `${CLASSNAME}__text`,
-        ...textContent
+        children: text
       }), attachments && /*#__PURE__*/jsx("div", {
         className: `${CLASSNAME}__attachments`,
         children: attachments
@@ -107,4 +107,4 @@ PostBlock.className = CLASSNAME;
 PostBlock.defaultProps = DEFAULT_PROPS;
 
 export { PostBlock };
-//# sourceMappingURL=post-block-478bc3b8.js.map
+//# sourceMappingURL=PostBlock-91fd05ab.js.map

package/_internal/packages/lumx-react/src/components/post-block/PostBlock-91fd05ab.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PostBlock-91fd05ab.js","sources":["../../../../../../../src/components/post-block/PostBlock.tsx"],"sourcesContent":["import { ReactNode } from 'react';\n\nimport classNames from 'classnames';\nimport isObject from 'lodash/isObject';\n\nimport { Orientation, Theme, Thumbnail, ThumbnailProps, ThumbnailVariant } from '@lumx/react';\nimport { GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\n/**\n * Defines the props of the component.\n */\nexport interface PostBlockProps extends GenericProps, HasTheme {\n    /** Action toolbar content. */\n    actions?: ReactNode;\n    /** Attachment content. */\n    attachments?: ReactNode;\n    /** Author content. */\n    author?: ReactNode;\n    /** Metadata content. */\n    meta?: ReactNode;\n    /** Orientation. */\n    orientation?: Orientation;\n    /** Tag content. */\n    tags?: ReactNode;\n    /** Content (string, or sanitized html). */\n    text?: string | { __html: string };\n    /** Thumbnail. */\n    thumbnailProps?: ThumbnailProps;\n    /** Title. */\n    title: string;\n    /** On click callback. */\n    onClick?(): void;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'PostBlock';\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<PostBlockProps> = {\n    orientation: Orientation.horizontal,\n};\n\n/**\n * PostBlock component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const PostBlock = forwardRef<PostBlockProps, HTMLDivElement>((props, ref) => {\n    const defaultTheme = useTheme() || Theme.light;\n    const {\n        actions,\n        attachments,\n        author,\n        className,\n        meta,\n        onClick,\n        orientation = DEFAULT_PROPS.orientation,\n        tags,\n        text,\n        theme = defaultTheme,\n        thumbnailProps,\n        title,\n        ...forwardedProps\n    } = props;\n\n    return (\n        <div\n            ref={ref}\n            className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, orientation, theme }))}\n            {...forwardedProps}\n        >\n            {thumbnailProps && (\n                <div className={`${CLASSNAME}__thumbnail`}>\n                    <Thumbnail {...thumbnailProps} theme={theme} variant={ThumbnailVariant.rounded} />\n                </div>\n            )}\n            <div className={`${CLASSNAME}__wrapper`}>\n                {author && <div className={`${CLASSNAME}__author`}>{author}</div>}\n\n                {title && (\n                    <button type=\"button\" className={`${CLASSNAME}__title`} onClick={onClick}>\n                        {title}\n                    </button>\n                )}\n\n                {meta && <span className={`${CLASSNAME}__meta`}>{meta}</span>}\n\n                {isObject(text) && text.__html ? (\n                    // eslint-disable-next-line react/no-danger\n                    <p dangerouslySetInnerHTML={text} className={`${CLASSNAME}__text`} />\n                ) : (\n                    <p className={`${CLASSNAME}__text`}>{text}</p>\n                )}\n\n                {attachments && <div className={`${CLASSNAME}__attachments`}>{attachments}</div>}\n                {(tags || actions) && (\n                    <div className={`${CLASSNAME}__toolbar`}>\n                        {tags && <div className={`${CLASSNAME}__tags`}>{tags}</div>}\n                        {actions && <div className={`${CLASSNAME}__actions`}>{actions}</div>}\n                    </div>\n                )}\n            </div>\n        </div>\n    );\n});\nPostBlock.displayName = COMPONENT_NAME;\nPostBlock.className = CLASSNAME;\nPostBlock.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","orientation","Orientation","horizontal","PostBlock","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","actions","attachments","author","className","meta","onClick","tags","text","theme","thumbnailProps","title","forwardedProps","_jsxs","classNames","handleBasicClasses","prefix","children","_jsx","Thumbnail","variant","ThumbnailVariant","rounded","type","isObject","__html","dangerouslySetInnerHTML","displayName","defaultProps"],"mappings":";;;;;;;;;;AAqCA;AACA;AACA;AACA,MAAMA,cAAc,GAAG,WAAW,CAAA;;AAElC;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,CAAC,CAAA;;AAElD;AACA;AACA;AACA,MAAMG,aAAsC,GAAG;EAC3CC,WAAW,EAAEC,WAAW,CAACC,UAAAA;AAC7B,CAAC,CAAA;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMC,SAAS,GAAGC,UAAU,CAAiC,CAACC,KAAK,EAAEC,GAAG,KAAK;EAChF,MAAMC,YAAY,GAAGC,QAAQ,EAAE,IAAIC,KAAK,CAACC,KAAK,CAAA;EAC9C,MAAM;IACFC,OAAO;IACPC,WAAW;IACXC,MAAM;IACNC,SAAS;IACTC,IAAI;IACJC,OAAO;IACPhB,WAAW,GAAGD,aAAa,CAACC,WAAW;IACvCiB,IAAI;IACJC,IAAI;AACJC,IAAAA,KAAK,GAAGZ,YAAY;IACpBa,cAAc;IACdC,KAAK;IACL,GAAGC,cAAAA;AACP,GAAC,GAAGjB,KAAK,CAAA;AAET,EAAA,oBACIkB,IAAA,CAAA,KAAA,EAAA;AACIjB,IAAAA,GAAG,EAAEA,GAAI;AACTQ,IAAAA,SAAS,EAAEU,UAAU,CAACV,SAAS,EAAEW,kBAAkB,CAAC;AAAEC,MAAAA,MAAM,EAAE7B,SAAS;MAAEG,WAAW;AAAEmB,MAAAA,KAAAA;AAAM,KAAC,CAAC,CAAE;AAAA,IAAA,GAC5FG,cAAc;IAAAK,QAAA,EAAA,CAEjBP,cAAc,iBACXQ,GAAA,CAAA,KAAA,EAAA;MAAKd,SAAS,EAAE,CAAGjB,EAAAA,SAAS,CAAc,WAAA,CAAA;MAAA8B,QAAA,eACtCC,GAAA,CAACC,SAAS,EAAA;AAAA,QAAA,GAAKT,cAAc;AAAED,QAAAA,KAAK,EAAEA,KAAM;QAACW,OAAO,EAAEC,gBAAgB,CAACC,OAAAA;OAAU,CAAA;KAChF,CACR,eACDT,IAAA,CAAA,KAAA,EAAA;MAAKT,SAAS,EAAE,CAAGjB,EAAAA,SAAS,CAAY,SAAA,CAAA;MAAA8B,QAAA,EAAA,CACnCd,MAAM,iBAAIe,GAAA,CAAA,KAAA,EAAA;QAAKd,SAAS,EAAE,CAAGjB,EAAAA,SAAS,CAAW,QAAA,CAAA;AAAA8B,QAAAA,QAAA,EAAEd,MAAAA;AAAM,OAAM,CAAC,EAEhEQ,KAAK,iBACFO,GAAA,CAAA,QAAA,EAAA;AAAQK,QAAAA,IAAI,EAAC,QAAQ;QAACnB,SAAS,EAAE,CAAGjB,EAAAA,SAAS,CAAU,OAAA,CAAA;AAACmB,QAAAA,OAAO,EAAEA,OAAQ;AAAAW,QAAAA,QAAA,EACpEN,KAAAA;AAAK,OACF,CACX,EAEAN,IAAI,iBAAIa,GAAA,CAAA,MAAA,EAAA;QAAMd,SAAS,EAAE,CAAGjB,EAAAA,SAAS,CAAS,MAAA,CAAA;AAAA8B,QAAAA,QAAA,EAAEZ,IAAAA;OAAW,CAAC,EAE5DmB,QAAQ,CAAChB,IAAI,CAAC,IAAIA,IAAI,CAACiB,MAAM;AAAA;AAC1B;MACAP,GAAA,CAAA,GAAA,EAAA;AAAGQ,QAAAA,uBAAuB,EAAElB,IAAK;QAACJ,SAAS,EAAE,GAAGjB,SAAS,CAAA,MAAA,CAAA;OAAW,CAAC,gBAErE+B,GAAA,CAAA,GAAA,EAAA;QAAGd,SAAS,EAAE,CAAGjB,EAAAA,SAAS,CAAS,MAAA,CAAA;AAAA8B,QAAAA,QAAA,EAAET,IAAAA;AAAI,OAAI,CAChD,EAEAN,WAAW,iBAAIgB,GAAA,CAAA,KAAA,EAAA;QAAKd,SAAS,EAAE,CAAGjB,EAAAA,SAAS,CAAgB,aAAA,CAAA;AAAA8B,QAAAA,QAAA,EAAEf,WAAAA;AAAW,OAAM,CAAC,EAC/E,CAACK,IAAI,IAAIN,OAAO,kBACbY,IAAA,CAAA,KAAA,EAAA;QAAKT,SAAS,EAAE,CAAGjB,EAAAA,SAAS,CAAY,SAAA,CAAA;QAAA8B,QAAA,EAAA,CACnCV,IAAI,iBAAIW,GAAA,CAAA,KAAA,EAAA;UAAKd,SAAS,EAAE,CAAGjB,EAAAA,SAAS,CAAS,MAAA,CAAA;AAAA8B,UAAAA,QAAA,EAAEV,IAAAA;AAAI,SAAM,CAAC,EAC1DN,OAAO,iBAAIiB,GAAA,CAAA,KAAA,EAAA;UAAKd,SAAS,EAAE,CAAGjB,EAAAA,SAAS,CAAY,SAAA,CAAA;AAAA8B,UAAAA,QAAA,EAAEhB,OAAAA;AAAO,SAAM,CAAC,CAAA;AAAA,OACnE,CACR,CAAA;AAAA,KACA,CAAC,CAAA;AAAA,GACL,CAAC,CAAA;AAEd,CAAC,EAAC;AACFR,SAAS,CAACkC,WAAW,GAAGzC,cAAc,CAAA;AACtCO,SAAS,CAACW,SAAS,GAAGjB,SAAS,CAAA;AAC/BM,SAAS,CAACmC,YAAY,GAAGvC,aAAa;;;;"}

package/_internal/packages/lumx-react/src/components/progress/Progress-73bac34d.js

@@ -0,0 +1,72 @@
+import classNames from 'classnames';
+import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
+import { useTheme } from '../../utils/theme/ThemeContext-d8ee966d.js';
+import { forwardRef } from '../../utils/react/forwardRef-bd8b3ec8.js';
+import { ProgressLinear } from './ProgressLinear-db03319f.js';
+import { ProgressCircular } from './ProgressCircular-e997908d.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Theme } from '@lumx/core/js/constants';
+
+const ProgressVariant = {
+  linear: 'linear',
+  circular: 'circular'
+};
+
+/**
+ * Defines the props of the component.
+ */
+
+/**
+ * Component display name.
+ */
+const COMPONENT_NAME = 'Progress';
+
+/**
+ * Component default class name and class prefix.
+ */
+const CLASSNAME = getRootClassName(COMPONENT_NAME);
+
+/**
+ * Component default props.
+ */
+const DEFAULT_PROPS = {
+  variant: ProgressVariant.circular
+};
+
+/**
+ * Progress component.
+ *
+ * @deprecated use `ProgressLinear` and `ProgressCircular` instead.
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+const Progress = forwardRef((props, ref) => {
+  const defaultTheme = useTheme() || Theme.light;
+  const {
+    className,
+    theme = defaultTheme,
+    variant = DEFAULT_PROPS.variant,
+    ...forwardedProps
+  } = props;
+  return /*#__PURE__*/jsxs("div", {
+    ref: ref,
+    ...forwardedProps,
+    className: classNames(className, handleBasicClasses({
+      prefix: CLASSNAME,
+      theme,
+      variant
+    })),
+    children: [variant === ProgressVariant.circular && /*#__PURE__*/jsx(ProgressCircular, {
+      theme: theme
+    }), variant === ProgressVariant.linear && /*#__PURE__*/jsx(ProgressLinear, {
+      theme: theme
+    })]
+  });
+});
+Progress.displayName = COMPONENT_NAME;
+Progress.className = CLASSNAME;
+Progress.defaultProps = DEFAULT_PROPS;
+
+export { Progress, ProgressVariant };
+//# sourceMappingURL=Progress-73bac34d.js.map

package/_internal/packages/lumx-react/src/components/progress/Progress-73bac34d.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Progress-73bac34d.js","sources":["../../../../../../../src/components/progress/Progress.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { Theme } from '@lumx/react';\nimport { GenericProps, HasTheme, ValueOf } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\nimport { ProgressLinear } from './ProgressLinear';\nimport { ProgressCircular } from './ProgressCircular';\n\n/**\n * Progress variants.\n */\nexport const ProgressVariant = { linear: 'linear', circular: 'circular' } as const;\nexport type ProgressVariant = ValueOf<typeof ProgressVariant>;\n\n/**\n * Defines the props of the component.\n */\nexport interface ProgressProps extends GenericProps, HasTheme {\n    /** Progress variant. */\n    variant?: ProgressVariant;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Progress';\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<ProgressProps> = {\n    variant: ProgressVariant.circular,\n};\n\n/**\n * Progress component.\n *\n * @deprecated use `ProgressLinear` and `ProgressCircular` instead.\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const Progress = forwardRef<ProgressProps, HTMLDivElement>((props, ref) => {\n    const defaultTheme = useTheme() || Theme.light;\n    const { className, theme = defaultTheme, variant = DEFAULT_PROPS.variant, ...forwardedProps } = props;\n\n    return (\n        <div\n            ref={ref}\n            {...forwardedProps}\n            className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, theme, variant }))}\n        >\n            {variant === ProgressVariant.circular && <ProgressCircular theme={theme} />}\n            {variant === ProgressVariant.linear && <ProgressLinear theme={theme} />}\n        </div>\n    );\n});\nProgress.displayName = COMPONENT_NAME;\nProgress.className = CLASSNAME;\nProgress.defaultProps = DEFAULT_PROPS;\n"],"names":["ProgressVariant","linear","circular","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","variant","Progress","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","className","theme","forwardedProps","_jsxs","classNames","handleBasicClasses","prefix","children","_jsx","ProgressCircular","ProgressLinear","displayName","defaultProps"],"mappings":";;;;;;;;;AAcO,MAAMA,eAAe,GAAG;AAAEC,EAAAA,MAAM,EAAE,QAAQ;AAAEC,EAAAA,QAAQ,EAAE,UAAA;AAAW,EAAU;;AAGlF;AACA;AACA;;AAMA;AACA;AACA;AACA,MAAMC,cAAc,GAAG,UAAU,CAAA;;AAEjC;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,CAAC,CAAA;;AAElD;AACA;AACA;AACA,MAAMG,aAAqC,GAAG;EAC1CC,OAAO,EAAEP,eAAe,CAACE,QAAAA;AAC7B,CAAC,CAAA;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMM,QAAQ,GAAGC,UAAU,CAAgC,CAACC,KAAK,EAAEC,GAAG,KAAK;EAC9E,MAAMC,YAAY,GAAGC,QAAQ,EAAE,IAAIC,KAAK,CAACC,KAAK,CAAA;EAC9C,MAAM;IAAEC,SAAS;AAAEC,IAAAA,KAAK,GAAGL,YAAY;IAAEL,OAAO,GAAGD,aAAa,CAACC,OAAO;IAAE,GAAGW,cAAAA;AAAe,GAAC,GAAGR,KAAK,CAAA;AAErG,EAAA,oBACIS,IAAA,CAAA,KAAA,EAAA;AACIR,IAAAA,GAAG,EAAEA,GAAI;AAAA,IAAA,GACLO,cAAc;AAClBF,IAAAA,SAAS,EAAEI,UAAU,CAACJ,SAAS,EAAEK,kBAAkB,CAAC;AAAEC,MAAAA,MAAM,EAAElB,SAAS;MAAEa,KAAK;AAAEV,MAAAA,OAAAA;AAAQ,KAAC,CAAC,CAAE;IAAAgB,QAAA,EAAA,CAE3FhB,OAAO,KAAKP,eAAe,CAACE,QAAQ,iBAAIsB,GAAA,CAACC,gBAAgB,EAAA;AAACR,MAAAA,KAAK,EAAEA,KAAAA;KAAQ,CAAC,EAC1EV,OAAO,KAAKP,eAAe,CAACC,MAAM,iBAAIuB,GAAA,CAACE,cAAc,EAAA;AAACT,MAAAA,KAAK,EAAEA,KAAAA;AAAM,KAAE,CAAC,CAAA;AAAA,GACtE,CAAC,CAAA;AAEd,CAAC,EAAC;AACFT,QAAQ,CAACmB,WAAW,GAAGxB,cAAc,CAAA;AACrCK,QAAQ,CAACQ,SAAS,GAAGZ,SAAS,CAAA;AAC9BI,QAAQ,CAACoB,YAAY,GAAGtB,aAAa;;;;"}