@lumx/react 3.20.1-alpha.15 → 3.20.1-alpha.16

package/utils/index.js

@@ -1,4 +1,4 @@
-export { C as ClickAwayProvider } from '../_internal/ClickAwayProvider-bcce6ceb.js';
-export { P as Portal, a as PortalProvider } from '../_internal/Portal-c43d098b.js';
-export { D as DisabledStateProvider, u as useDisabledStateContext } from '../_internal/DisabledStateContext-077b7bef.js';
+export { C as ClickAwayProvider } from '../_internal/ClickAwayProvider-7093ba23.js';
+export { P as Portal, a as PortalProvider } from '../_internal/Portal-3f86608e.js';
+export { D as DisabledStateProvider, u as useDisabledStateContext } from '../_internal/DisabledStateContext-ea04260d.js';
 //# sourceMappingURL=index.js.map

package/_internal/ImageCaption-4279b2b6.js

@@ -1,65 +0,0 @@
-import { c as classNames, _ as _extends } from './forwardRef-49d2bb84.js';
-import { u as useTheme } from './ThemeContext-3181f000.js';
-import { FlexBox } from './components/flex-box-c8701a85.js';
-import { T as Text } from './index-b4d256e7.js';
-
-/** Internal component used to render image captions */
-const ImageCaption = props => {
-  const defaultTheme = useTheme();
-  const {
-    baseClassName,
-    theme = defaultTheme,
-    as = 'figcaption',
-    title,
-    titleProps,
-    description,
-    descriptionProps,
-    tags,
-    captionStyle,
-    align,
-    truncate
-  } = props;
-  if (!title && !description && !tags) return null;
-  const titleColor = {
-    color: theme === 'dark' ? 'light' : 'dark'
-  };
-  const baseColor = {
-    color: theme === 'dark' ? 'light' : 'dark',
-    colorVariant: 'L2'
-  };
-
-  // Display description as string or HTML
-  const descriptionContent = typeof description === 'string' ? {
-    children: description
-  } : {
-    dangerouslySetInnerHTML: description
-  };
-  return /*#__PURE__*/React.createElement(FlexBox, {
-    as: as,
-    className: classNames(baseClassName && `${baseClassName}__wrapper`),
-    style: captionStyle,
-    orientation: "vertical",
-    vAlign: align,
-    hAlign: align === 'center' ? align : undefined,
-    gap: "regular"
-  }, (title || description) && /*#__PURE__*/React.createElement(Text, _extends({
-    as: "p",
-    className: classNames(baseClassName && `${baseClassName}__caption`),
-    truncate: truncate
-  }, baseColor), title && /*#__PURE__*/React.createElement(Text, _extends({}, titleProps, {
-    as: "span",
-    className: classNames(titleProps?.className, baseClassName && `${baseClassName}__title`),
-    typography: "subtitle1"
-  }, titleColor), title), ' ', description && /*#__PURE__*/React.createElement(Text, _extends({}, descriptionProps, {
-    as: "span",
-    className: classNames(descriptionProps?.className, baseClassName && `${baseClassName}__description`),
-    typography: "body1"
-  }, descriptionContent))), tags && /*#__PURE__*/React.createElement(FlexBox, {
-    className: classNames(baseClassName && `${baseClassName}__tags`),
-    orientation: "horizontal",
-    vAlign: align
-  }, tags));
-};
-
-export { ImageCaption as I };
-//# sourceMappingURL=ImageCaption-4279b2b6.js.map

package/_internal/components/comment-block-b84c4694.js

@@ -1,121 +0,0 @@
-import { f as forwardRef, _ as _extends, c as classNames } from '../forwardRef-49d2bb84.js';
-import { Children } from 'react';
-import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
-import { u as useTheme } from '../ThemeContext-3181f000.js';
-import { Avatar } from './avatar-6990e3e9.js';
-import { Theme, Size } from '@lumx/core/js/constants';
-import { Tooltip } from './tooltip-84ffb4f9.js';
-
-/**
- * Comment block variants.
- */
-const CommentBlockVariant = {
-  indented: 'indented',
-  linear: 'linear'
-};
-
-/**
- * Defines the props of the component.
- */
-
-/**
- * Component display name.
- */
-const COMPONENT_NAME = 'CommentBlock';
-
-/**
- * Component default class name and class prefix.
- */
-const CLASSNAME = getRootClassName(COMPONENT_NAME);
-
-/**
- * Component default props.
- */
-const DEFAULT_PROPS = {
-  variant: CommentBlockVariant.indented
-};
-
-/**
- * CommentBlock component.
- *
- * @param  props Component props.
- * @param  ref   Component ref.
- * @return React element.
- */
-const CommentBlock = forwardRef((props, ref) => {
-  const defaultTheme = useTheme() || Theme.light;
-  const {
-    actions,
-    avatarProps,
-    children,
-    className,
-    date,
-    fullDate,
-    hasActions,
-    headerActions,
-    isOpen,
-    isRelevant,
-    name,
-    onClick,
-    onMouseEnter,
-    onMouseLeave,
-    text,
-    theme = defaultTheme,
-    variant = DEFAULT_PROPS.variant,
-    ...forwardedProps
-  } = props;
-  const hasChildren = Children.count(children) > 0;
-  return /*#__PURE__*/React.createElement("div", _extends({
-    ref: ref,
-    className: classNames(className, handleBasicClasses({
-      hasChildren: hasChildren && isOpen,
-      hasIndentedChildren: hasChildren && variant === CommentBlockVariant.indented,
-      hasLinearChildren: hasChildren && variant === CommentBlockVariant.linear,
-      isRelevant,
-      prefix: CLASSNAME,
-      theme
-    }))
-  }, forwardedProps), /*#__PURE__*/React.createElement("div", {
-    className: `${CLASSNAME}__wrapper`
-  }, /*#__PURE__*/React.createElement("div", {
-    className: `${CLASSNAME}__avatar`
-  }, /*#__PURE__*/React.createElement(Avatar, _extends({}, avatarProps, {
-    size: Size.m,
-    onClick: onClick
-  }))), /*#__PURE__*/React.createElement("div", {
-    className: `${CLASSNAME}__container`
-  }, /*#__PURE__*/React.createElement("div", {
-    className: `${CLASSNAME}__content`
-  }, /*#__PURE__*/React.createElement("div", {
-    className: `${CLASSNAME}__meta`
-  }, name &&
-  /*#__PURE__*/
-  // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions
-  React.createElement("span", {
-    className: `${CLASSNAME}__name`,
-    onClick: onClick,
-    onMouseEnter: onMouseEnter,
-    onMouseLeave: onMouseLeave
-  }, name), headerActions && /*#__PURE__*/React.createElement("span", {
-    className: `${CLASSNAME}__header-actions`
-  }, headerActions)), /*#__PURE__*/React.createElement("div", {
-    className: `${CLASSNAME}__text`
-  }, text), date && (fullDate ? /*#__PURE__*/React.createElement(Tooltip, {
-    label: fullDate,
-    placement: "top"
-  }, /*#__PURE__*/React.createElement("span", {
-    className: `${CLASSNAME}__date`
-  }, date)) : /*#__PURE__*/React.createElement("span", {
-    className: `${CLASSNAME}__date`
-  }, date))), hasActions && /*#__PURE__*/React.createElement("div", {
-    className: `${CLASSNAME}__actions`
-  }, actions))), hasChildren && isOpen && /*#__PURE__*/React.createElement("div", {
-    className: `${CLASSNAME}__children`
-  }, children));
-});
-CommentBlock.displayName = COMPONENT_NAME;
-CommentBlock.className = CLASSNAME;
-CommentBlock.defaultProps = DEFAULT_PROPS;
-
-export { CommentBlock, CommentBlockVariant };
-//# sourceMappingURL=comment-block-b84c4694.js.map

package/_internal/components/date-picker-a425534c.js

@@ -1,2 +0,0 @@
-export { D as DatePicker, a as DatePickerControlled, b as DatePickerField } from '../PopoverDialog-21e5c9dd.js';
-//# sourceMappingURL=date-picker-a425534c.js.map

package/_internal/components/date-picker-a425534c.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"date-picker-a425534c.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/_internal/components/link-preview-7a4a6e4b.js

@@ -1,108 +0,0 @@
-import { f as forwardRef, _ as _extends, c as classNames } from '../forwardRef-49d2bb84.js';
-import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
-import { u as useTheme } from '../ThemeContext-3181f000.js';
-import { Link } from './link-9637b9e4.js';
-import { Size, Theme, AspectRatio, ColorPalette, ColorVariant } from '@lumx/core/js/constants';
-import { T as Thumbnail } from '../Thumbnail-30d2a781.js';
-
-/**
- * Defines the props of the component.
- */
-
-/**
- * Component display name.
- */
-const COMPONENT_NAME = 'LinkPreview';
-
-/**
- * Component default class name and class prefix.
- */
-const CLASSNAME = getRootClassName(COMPONENT_NAME);
-
-/**
- * Component default props.
- */
-const DEFAULT_PROPS = {
-  size: Size.regular,
-  titleHeading: 'h2'
-};
-
-/**
- * LinkPreview component.
- *
- * @param  props Component props.
- * @param  ref   Component ref.
- * @return React element.
- */
-const LinkPreview = forwardRef((props, ref) => {
-  const defaultTheme = useTheme() || Theme.light;
-  const {
-    className,
-    description,
-    link,
-    linkAs,
-    linkProps,
-    size = DEFAULT_PROPS.size,
-    theme = defaultTheme,
-    thumbnailProps,
-    title,
-    titleHeading = DEFAULT_PROPS.titleHeading,
-    ...forwardedProps
-  } = props;
-  // Use title heading as title wrapper (see DEFAULT_PROPS for the default value).
-  const TitleHeading = titleHeading;
-  return /*#__PURE__*/React.createElement("article", _extends({
-    ref: ref
-  }, forwardedProps, {
-    className: classNames(className, handleBasicClasses({
-      prefix: CLASSNAME,
-      size: size === Size.big && thumbnailProps ? Size.big : Size.regular,
-      theme
-    }))
-  }), /*#__PURE__*/React.createElement("div", {
-    className: `${CLASSNAME}__wrapper`
-  }, thumbnailProps && /*#__PURE__*/React.createElement("div", {
-    className: `${CLASSNAME}__thumbnail`
-  }, /*#__PURE__*/React.createElement(Thumbnail, _extends({}, thumbnailProps, {
-    linkAs: linkAs,
-    linkProps: {
-      ...linkProps,
-      href: link,
-      target: '_blank',
-      // Avoid redundant links in focus order
-      tabIndex: -1
-    },
-    aspectRatio: AspectRatio.free,
-    fillHeight: true
-  }))), /*#__PURE__*/React.createElement("div", {
-    className: `${CLASSNAME}__container`
-  }, title && /*#__PURE__*/React.createElement(TitleHeading, {
-    className: `${CLASSNAME}__title`
-  }, /*#__PURE__*/React.createElement(Link, _extends({}, linkProps, {
-    linkAs: linkAs,
-    target: "_blank",
-    href: link,
-    color: theme === Theme.light ? ColorPalette.dark : ColorPalette.light,
-    colorVariant: ColorVariant.N
-  }), title)), description && /*#__PURE__*/React.createElement("p", {
-    className: `${CLASSNAME}__description`
-  }, description), /*#__PURE__*/React.createElement("div", {
-    className: `${CLASSNAME}__link`
-  }, /*#__PURE__*/React.createElement(Link, _extends({}, linkProps, {
-    linkAs: linkAs,
-    className: classNames(`${CLASSNAME}__link`, linkProps?.className),
-    target: "_blank",
-    href: link,
-    color: theme === Theme.light ? ColorPalette.primary : ColorPalette.light,
-    colorVariant: ColorVariant.N
-    // Avoid redundant links in focus order
-    ,
-    tabIndex: title ? '-1' : undefined
-  }), link)))));
-});
-LinkPreview.displayName = COMPONENT_NAME;
-LinkPreview.className = CLASSNAME;
-LinkPreview.defaultProps = DEFAULT_PROPS;
-
-export { LinkPreview };
-//# sourceMappingURL=link-preview-7a4a6e4b.js.map

package/_internal/components/navigation-4fd3917d.js

@@ -1,210 +0,0 @@
-import { c as classNames, _ as _extends, f as forwardRef } from '../forwardRef-49d2bb84.js';
-import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
-import { u as useTheme, T as ThemeProvider } from '../ThemeContext-3181f000.js';
-import { createContext, useState, useRef, useContext } from 'react';
-import { mdiChevronUp, mdiChevronDown } from '@lumx/icons';
-import { u as useId } from '../useId-3a1facc0.js';
-import { f as forwardRefPolymorphic, R as RawClickable } from '../RawClickable-c76bbc4c.js';
-import { u as useOverflowTooltipLabel, T as Text } from '../index-b4d256e7.js';
-import { Tooltip } from './tooltip-84ffb4f9.js';
-import { P as Placement } from '../constants-b9e57936.js';
-import { Icon } from './icon-2e7345ad.js';
-import { Size, Orientation, Theme } from '@lumx/core/js/constants';
-import { P as Popover } from '../index-f415b08e.js';
-
-/**
- * Navigation item props
- */
-
-/**
- * Component display name.
- */
-const COMPONENT_NAME$2 = 'NavigationItem';
-
-/**
- * Component default class name and class prefix.
- */
-const CLASSNAME$2 = getRootClassName(COMPONENT_NAME$2);
-const NavigationItem = Object.assign(forwardRefPolymorphic((props, ref) => {
-  const {
-    className,
-    icon,
-    label,
-    isCurrentPage,
-    as: Element = 'a',
-    ...forwardedProps
-  } = props;
-  const theme = useTheme();
-  const {
-    tooltipLabel,
-    labelRef
-  } = useOverflowTooltipLabel(label);
-  return /*#__PURE__*/React.createElement("li", {
-    className: classNames(className, handleBasicClasses({
-      prefix: CLASSNAME$2,
-      theme
-    }))
-  }, /*#__PURE__*/React.createElement(Tooltip, {
-    label: tooltipLabel,
-    placement: Placement.TOP
-  }, /*#__PURE__*/React.createElement(RawClickable, _extends({
-    as: Element,
-    className: handleBasicClasses({
-      prefix: `${CLASSNAME$2}__link`,
-      isSelected: isCurrentPage
-    }),
-    ref: ref,
-    "aria-current": isCurrentPage ? 'page' : undefined
-  }, forwardedProps), icon ? /*#__PURE__*/React.createElement(Icon, {
-    className: `${CLASSNAME$2}__icon`,
-    icon: icon,
-    size: Size.xs,
-    theme: theme
-  }) : null, /*#__PURE__*/React.createElement(Text, {
-    as: "span",
-    truncate: true,
-    className: `${CLASSNAME$2}__label`,
-    ref: labelRef
-  }, label))));
-}), {
-  displayName: COMPONENT_NAME$2,
-  className: CLASSNAME$2
-});
-
-const NavigationContext = /*#__PURE__*/createContext({
-  orientation: Orientation.vertical
-});
-
-/**
- * Component display name.
- */
-const COMPONENT_NAME$1 = 'NavigationSection';
-
-/**
- * Component default class name and class prefix.
- */
-const CLASSNAME$1 = getRootClassName(COMPONENT_NAME$1);
-const NavigationSection = forwardRef((props, ref) => {
-  const {
-    children,
-    className,
-    label,
-    icon,
-    ...forwardedProps
-  } = props;
-  const [isOpen, setIsOpen] = useState(false);
-  const buttonRef = useRef(null);
-  const sectionId = useId();
-  const {
-    orientation
-  } = useContext(NavigationContext) || {};
-  const theme = useTheme();
-  const isDropdown = orientation === Orientation.horizontal;
-  return /*#__PURE__*/React.createElement("li", {
-    className: classNames(className, CLASSNAME$1, CLASSNAME$2, handleBasicClasses({
-      prefix: CLASSNAME$2,
-      theme
-    })),
-    ref: ref
-  }, /*#__PURE__*/React.createElement(RawClickable, _extends({
-    as: "button"
-  }, forwardedProps, {
-    "aria-controls": sectionId,
-    "aria-expanded": isOpen,
-    className: classNames(`${CLASSNAME$2}__link`),
-    ref: buttonRef,
-    onClick: event => {
-      setIsOpen(!isOpen);
-      event.stopPropagation();
-    }
-  }), icon ? /*#__PURE__*/React.createElement(Icon, {
-    className: `${CLASSNAME$2}__icon`,
-    icon: icon,
-    size: Size.xs
-  }) : null, /*#__PURE__*/React.createElement(Text, {
-    as: "span",
-    truncate: true,
-    className: `${CLASSNAME$2}__label`,
-    ref: ref
-  }, label), /*#__PURE__*/React.createElement(Icon, {
-    className: classNames(`${CLASSNAME$2}__icon`, `${CLASSNAME$1}__chevron`),
-    icon: isOpen ? mdiChevronUp : mdiChevronDown
-  })), isOpen && (isDropdown ? /*#__PURE__*/React.createElement(Popover, {
-    anchorRef: buttonRef,
-    isOpen: isOpen,
-    placement: Placement.BOTTOM_START,
-    usePortal: false,
-    closeOnClickAway: true,
-    closeOnEscape: true,
-    onClick: () => setIsOpen(false),
-    onClose: () => setIsOpen(false),
-    zIndex: 996
-  }, /*#__PURE__*/React.createElement(ThemeProvider, {
-    value: Theme.light
-  }, /*#__PURE__*/React.createElement("ul", {
-    className: `${CLASSNAME$1}__drawer--popover`,
-    id: sectionId
-  }, /*#__PURE__*/React.createElement(NavigationContext.Provider, {
-    value: {
-      orientation: Orientation.vertical
-    }
-  }, children)))) : /*#__PURE__*/React.createElement("ul", {
-    className: `${CLASSNAME$1}__drawer`,
-    id: sectionId
-  }, children)));
-});
-NavigationSection.displayName = COMPONENT_NAME$1;
-NavigationSection.className = CLASSNAME$1;
-
-/**
- * Component display name.
- */
-const COMPONENT_NAME = 'Navigation';
-
-/**
- * Component default class name and class prefix.
- */
-const CLASSNAME = getRootClassName(COMPONENT_NAME);
-
-/**
- * Component default props
- */
-const DEFAULT_PROPS = {
-  orientation: Orientation.vertical
-};
-const Navigation = forwardRef((props, ref) => {
-  const defaultTheme = useTheme() || Theme.light;
-  const {
-    children,
-    className,
-    theme = defaultTheme,
-    orientation = DEFAULT_PROPS.orientation,
-    ...forwardedProps
-  } = props;
-  return /*#__PURE__*/React.createElement(ThemeProvider, {
-    value: theme
-  }, /*#__PURE__*/React.createElement("nav", _extends({
-    className: classNames(className, handleBasicClasses({
-      prefix: CLASSNAME,
-      theme,
-      orientation
-    })),
-    ref: ref
-  }, forwardedProps), /*#__PURE__*/React.createElement(NavigationContext.Provider, {
-    value: {
-      orientation
-    }
-  }, /*#__PURE__*/React.createElement("ul", {
-    className: `${CLASSNAME}__list`
-  }, children))));
-});
-Navigation.displayName = COMPONENT_NAME;
-Navigation.className = CLASSNAME;
-Navigation.defaultProps = DEFAULT_PROPS;
-
-// Sub components
-Navigation.Section = NavigationSection;
-Navigation.Item = NavigationItem;
-
-export { Navigation };
-//# sourceMappingURL=navigation-4fd3917d.js.map

package/_internal/components/popover-3c4c54bd.js

@@ -1,3 +0,0 @@
-export { P as Popover } from '../index-f415b08e.js';
-export { P as Placement } from '../constants-b9e57936.js';
-//# sourceMappingURL=popover-3c4c54bd.js.map

package/_internal/components/popover-3c4c54bd.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"popover-3c4c54bd.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/_internal/components/post-block-0cfc2206.js

@@ -1,99 +0,0 @@
-import { f as forwardRef, _ as _extends, c as classNames } from '../forwardRef-49d2bb84.js';
-import isObject from 'lodash/isObject';
-import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
-import { u as useTheme } from '../ThemeContext-3181f000.js';
-import { ThumbnailVariant } from './thumbnail-e3acff82.js';
-import { Orientation, Theme } from '@lumx/core/js/constants';
-import { T as Thumbnail } from '../Thumbnail-30d2a781.js';
-
-/**
- * Defines the props of the component.
- */
-
-/**
- * Component display name.
- */
-const COMPONENT_NAME = 'PostBlock';
-
-/**
- * Component default class name and class prefix.
- */
-const CLASSNAME = getRootClassName(COMPONENT_NAME);
-
-/**
- * Component default props.
- */
-const DEFAULT_PROPS = {
-  orientation: Orientation.horizontal
-};
-
-/**
- * PostBlock component.
- *
- * @param  props Component props.
- * @param  ref   Component ref.
- * @return React element.
- */
-const PostBlock = forwardRef((props, ref) => {
-  const defaultTheme = useTheme() || Theme.light;
-  const {
-    actions,
-    attachments,
-    author,
-    className,
-    meta,
-    onClick,
-    orientation = DEFAULT_PROPS.orientation,
-    tags,
-    text,
-    theme = defaultTheme,
-    thumbnailProps,
-    title,
-    ...forwardedProps
-  } = props;
-  return /*#__PURE__*/React.createElement("div", _extends({
-    ref: ref,
-    className: classNames(className, handleBasicClasses({
-      prefix: CLASSNAME,
-      orientation,
-      theme
-    }))
-  }, forwardedProps), thumbnailProps && /*#__PURE__*/React.createElement("div", {
-    className: `${CLASSNAME}__thumbnail`
-  }, /*#__PURE__*/React.createElement(Thumbnail, _extends({}, thumbnailProps, {
-    theme: theme,
-    variant: ThumbnailVariant.rounded
-  }))), /*#__PURE__*/React.createElement("div", {
-    className: `${CLASSNAME}__wrapper`
-  }, author && /*#__PURE__*/React.createElement("div", {
-    className: `${CLASSNAME}__author`
-  }, author), title && /*#__PURE__*/React.createElement("button", {
-    type: "button",
-    className: `${CLASSNAME}__title`,
-    onClick: onClick
-  }, title), meta && /*#__PURE__*/React.createElement("span", {
-    className: `${CLASSNAME}__meta`
-  }, meta), isObject(text) && text.__html ?
-  /*#__PURE__*/
-  // eslint-disable-next-line react/no-danger
-  React.createElement("p", {
-    dangerouslySetInnerHTML: text,
-    className: `${CLASSNAME}__text`
-  }) : /*#__PURE__*/React.createElement("p", {
-    className: `${CLASSNAME}__text`
-  }, text), attachments && /*#__PURE__*/React.createElement("div", {
-    className: `${CLASSNAME}__attachments`
-  }, attachments), (tags || actions) && /*#__PURE__*/React.createElement("div", {
-    className: `${CLASSNAME}__toolbar`
-  }, tags && /*#__PURE__*/React.createElement("div", {
-    className: `${CLASSNAME}__tags`
-  }, tags), actions && /*#__PURE__*/React.createElement("div", {
-    className: `${CLASSNAME}__actions`
-  }, actions))));
-});
-PostBlock.displayName = COMPONENT_NAME;
-PostBlock.className = CLASSNAME;
-PostBlock.defaultProps = DEFAULT_PROPS;
-
-export { PostBlock };
-//# sourceMappingURL=post-block-0cfc2206.js.map