@lumx/react 3.20.1-alpha.12 → 3.20.1-alpha.13

package/_internal/{9fdc715b.js → components/uploader-896a1d89.js}

@@ -1,14 +1,17 @@
+import { f as forwardRef, _ as _extends, c as classNames } from '../forwardRef-49d2bb84.js';
 import React__default from 'react';
-import { m as getRootClassName, i as AspectRatio, c as Size, n as forwardRef, b as Theme, l as classNames } from './6589b796.js';
-import { h as handleBasicClasses } from './e2afb13f.js';
-import { u as useBooleanState } from './2a3d237c.js';
-import { u as useId } from './3a1facc0.js';
-import { u as useTheme } from './3181f000.js';
-import { V as VISUALLY_HIDDEN } from './478b5c92.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { u as useDisableStateProps } from './b8667090.js';
-import { I as Icon } from './8ab42752.js';
+import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
+import { u as useBooleanState } from '../useBooleanState-2a3d237c.js';
+import { u as useId } from '../useId-3a1facc0.js';
+import { u as useTheme } from '../ThemeContext-3181f000.js';
+import { V as VISUALLY_HIDDEN } from '../constants-d0e3f49e.js';
+import { u as useDisableStateProps } from '../useDisableStateProps-fffc365f.js';
+import { AspectRatio, Size, Theme } from '@lumx/core/js/constants';
+import { Icon } from './icon-2e7345ad.js';
 
+/**
+ * Uploader variants.
+ */
 const UploaderVariant = {
   square: 'square',
   rounded: 'rounded',
@@ -104,10 +107,9 @@ const Uploader = forwardRef((props, ref) => {
       fileInputProps.onChange(files, evt);
     };
   }, [isAnyDisabled, fileInputProps]);
-  return /*#__PURE__*/jsxs(wrapper.Component, {
-    ref: ref,
-    ...wrapper.props,
-    ...forwardedProps,
+  return /*#__PURE__*/React__default.createElement(wrapper.Component, _extends({
+    ref: ref
+  }, wrapper.props, forwardedProps, {
     onClick: handleClick,
     className: classNames(className, handleBasicClasses({
       aspectRatio: adjustedAspectRatio,
@@ -117,36 +119,32 @@ const Uploader = forwardRef((props, ref) => {
       variant,
       isDragHovering,
       isDisabled: isAnyDisabled
-    })),
-    children: [/*#__PURE__*/jsx("span", {
-      className: `${CLASSNAME}__background`
-    }), /*#__PURE__*/jsxs("span", {
-      className: `${CLASSNAME}__wrapper`,
-      children: [icon && /*#__PURE__*/jsx(Icon, {
-        className: `${CLASSNAME}__icon`,
-        icon: icon,
-        size: Size.s
-      }), label && /*#__PURE__*/jsx("span", {
-        className: `${CLASSNAME}__label`,
-        children: label
-      })]
-    }), fileInputProps && /*#__PURE__*/jsx("input", {
-      type: "file",
-      id: inputId,
-      className: `${CLASSNAME}__input ${VISUALLY_HIDDEN}`,
-      ...disabledStateProps,
-      ...fileInputProps,
-      readOnly: isAnyDisabled,
-      onChange: onChange,
-      onDragEnter: setDragHovering,
-      onDragLeave: unsetDragHovering,
-      onDrop: unsetDragHovering
-    })]
-  });
+    }))
+  }), /*#__PURE__*/React__default.createElement("span", {
+    className: `${CLASSNAME}__background`
+  }), /*#__PURE__*/React__default.createElement("span", {
+    className: `${CLASSNAME}__wrapper`
+  }, icon && /*#__PURE__*/React__default.createElement(Icon, {
+    className: `${CLASSNAME}__icon`,
+    icon: icon,
+    size: Size.s
+  }), label && /*#__PURE__*/React__default.createElement("span", {
+    className: `${CLASSNAME}__label`
+  }, label)), fileInputProps && /*#__PURE__*/React__default.createElement("input", _extends({
+    type: "file",
+    id: inputId,
+    className: `${CLASSNAME}__input ${VISUALLY_HIDDEN}`
+  }, disabledStateProps, fileInputProps, {
+    readOnly: isAnyDisabled,
+    onChange: onChange,
+    onDragEnter: setDragHovering,
+    onDragLeave: unsetDragHovering,
+    onDrop: unsetDragHovering
+  })));
 });
 Uploader.displayName = COMPONENT_NAME;
 Uploader.className = CLASSNAME;
 Uploader.defaultProps = DEFAULT_PROPS;
 
 export { Uploader, UploaderVariant };
-//# sourceMappingURL=9fdc715b.js.map
+//# sourceMappingURL=uploader-896a1d89.js.map

package/_internal/components/uploader-896a1d89.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"uploader-896a1d89.js","sources":["../../../src/components/uploader/Uploader.tsx"],"sourcesContent":["import React, { MouseEventHandler } from 'react';\n\nimport classNames from 'classnames';\n\nimport { AspectRatio, Icon, Size, Theme } from '@lumx/react';\nimport { GenericProps, HasTheme, ValueOf } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { useBooleanState } from '@lumx/react/hooks/useBooleanState';\nimport { useId } from '@lumx/react/hooks/useId';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\nimport { HasAriaDisabled } from '@lumx/react/utils/type/HasAriaDisabled';\nimport { useDisableStateProps } from '@lumx/react/utils/disabled';\nimport { VISUALLY_HIDDEN } from '@lumx/react/constants';\n\n/**\n * Uploader variants.\n */\nexport const UploaderVariant = {\n    square: 'square',\n    rounded: 'rounded',\n    circle: 'circle',\n} as const;\nexport type UploaderVariant = ValueOf<typeof UploaderVariant>;\n\n/**\n * Uploader sizes.\n */\nexport type UploaderSize = Extract<Size, 'xl' | 'xxl'>;\n\n/**\n * Extend native HTML input props with specialized `onChange` providing the a `File` array.\n */\ninterface FileInputProps extends Omit<React.ComponentProps<'input'>, 'onChange'> {\n    onChange(files: File[], evt: React.ChangeEvent<HTMLInputElement>): void;\n}\n\n/**\n * Defines the props of the component.\n */\nexport interface UploaderProps extends GenericProps, HasTheme, HasAriaDisabled {\n    /** Image aspect ratio. */\n    aspectRatio?: AspectRatio;\n    /** Icon (SVG path). */\n    icon?: string;\n    /** Disabled state */\n    isDisabled?: boolean;\n    /** Label text. */\n    label?: string;\n    /** Size variant. */\n    size?: UploaderSize;\n    /** Variant. */\n    variant?: UploaderVariant;\n    /** On click callback. */\n    onClick?: MouseEventHandler;\n    /** Handle file selection with a native input file. */\n    fileInputProps?: FileInputProps;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Uploader';\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<UploaderProps> = {\n    aspectRatio: AspectRatio.horizontal,\n    size: Size.xl,\n    variant: UploaderVariant.square,\n};\n\n/**\n * Uploader component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const Uploader = forwardRef<UploaderProps>((props, ref) => {\n    const { disabledStateProps, otherProps, isAnyDisabled } = useDisableStateProps(props);\n    const defaultTheme = useTheme() || Theme.light;\n    const {\n        aspectRatio = DEFAULT_PROPS.aspectRatio,\n        className,\n        label,\n        icon,\n        size = DEFAULT_PROPS.size,\n        theme = defaultTheme,\n        variant = DEFAULT_PROPS.variant,\n        fileInputProps,\n        onClick,\n        ...forwardedProps\n    } = otherProps;\n    // Adjust to square aspect ratio when using circle variants.\n    const adjustedAspectRatio = variant === UploaderVariant.circle ? AspectRatio.square : aspectRatio;\n\n    const handleClick: React.MouseEventHandler = React.useCallback(\n        (evt) => {\n            if (isAnyDisabled) {\n                evt.preventDefault();\n            } else {\n                onClick?.(evt);\n            }\n        },\n        [isAnyDisabled, onClick],\n    );\n\n    const generatedInputId = useId();\n    const inputId = fileInputProps?.id || generatedInputId;\n    const [isDragHovering, unsetDragHovering, setDragHovering] = useBooleanState(false);\n    const wrapper = fileInputProps\n        ? ({ Component: 'label', props: { htmlFor: inputId } } as const)\n        : ({ Component: 'button', props: { type: 'button', ...disabledStateProps } } as const);\n\n    const onChange = React.useMemo(() => {\n        if (isAnyDisabled || !fileInputProps?.onChange) return undefined;\n        return (evt: React.ChangeEvent<HTMLInputElement>) => {\n            const fileList = evt.target.files;\n            const files = fileList ? Array.from(fileList) : [];\n            fileInputProps.onChange(files, evt);\n        };\n    }, [isAnyDisabled, fileInputProps]);\n\n    return (\n        <wrapper.Component\n            ref={ref as any}\n            {...wrapper.props}\n            {...forwardedProps}\n            onClick={handleClick}\n            className={classNames(\n                className,\n                handleBasicClasses({\n                    aspectRatio: adjustedAspectRatio,\n                    prefix: CLASSNAME,\n                    size,\n                    theme,\n                    variant,\n                    isDragHovering,\n                    isDisabled: isAnyDisabled,\n                }),\n            )}\n        >\n            <span className={`${CLASSNAME}__background`} />\n\n            <span className={`${CLASSNAME}__wrapper`}>\n                {icon && <Icon className={`${CLASSNAME}__icon`} icon={icon} size={Size.s} />}\n\n                {label && <span className={`${CLASSNAME}__label`}>{label}</span>}\n            </span>\n\n            {fileInputProps && (\n                <input\n                    type=\"file\"\n                    id={inputId}\n                    className={`${CLASSNAME}__input ${VISUALLY_HIDDEN}`}\n                    {...disabledStateProps}\n                    {...fileInputProps}\n                    readOnly={isAnyDisabled}\n                    onChange={onChange}\n                    onDragEnter={setDragHovering}\n                    onDragLeave={unsetDragHovering}\n                    onDrop={unsetDragHovering}\n                />\n            )}\n        </wrapper.Component>\n    );\n});\nUploader.displayName = COMPONENT_NAME;\nUploader.className = CLASSNAME;\nUploader.defaultProps = DEFAULT_PROPS;\n"],"names":["UploaderVariant","square","rounded","circle","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","aspectRatio","AspectRatio","horizontal","size","Size","xl","variant","Uploader","forwardRef","props","ref","disabledStateProps","otherProps","isAnyDisabled","useDisableStateProps","defaultTheme","useTheme","Theme","light","className","label","icon","theme","fileInputProps","onClick","forwardedProps","adjustedAspectRatio","handleClick","React","useCallback","evt","preventDefault","generatedInputId","useId","inputId","id","isDragHovering","unsetDragHovering","setDragHovering","useBooleanState","wrapper","Component","htmlFor","type","onChange","useMemo","undefined","fileList","target","files","Array","from","createElement","_extends","classNames","handleBasicClasses","prefix","isDisabled","Icon","s","VISUALLY_HIDDEN","readOnly","onDragEnter","onDragLeave","onDrop","displayName","defaultProps"],"mappings":"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"}

package/_internal/{0d1a078c.js → components/user-block-8fd15895.js}

@@ -1,12 +1,20 @@
+import { f as forwardRef, c as classNames, _ as _extends } from '../forwardRef-49d2bb84.js';
 import React__default from 'react';
-import { m as getRootClassName, O as Orientation, c as Size, n as forwardRef, b as Theme, l as classNames, j as ColorPalette } from './6589b796.js';
 import isEmpty from 'lodash/isEmpty';
 import set from 'lodash/set';
-import { h as handleBasicClasses } from './e2afb13f.js';
-import { u as useTheme } from './3181f000.js';
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { Avatar } from './74a4a214.js';
-import { Link } from './66f691d3.js';
+import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
+import { u as useTheme } from '../ThemeContext-3181f000.js';
+import { Orientation, Size, Theme, ColorPalette } from '@lumx/core/js/constants';
+import { Avatar } from './avatar-6990e3e9.js';
+import { Link } from './link-9637b9e4.js';
+
+/**
+ * User block sizes.
+ */
+
+/**
+ * Defines the props of the component.
+ */
 
 /**
  * Component display name.
@@ -87,22 +95,18 @@ const UserBlock = forwardRef((props, ref) => {
     if (avatarProps) {
       set(avatarProps, ['thumbnailProps', 'tabIndex'], -1);
     }
-    return /*#__PURE__*/jsx(NameComponent, {
-      ...nProps,
-      children: name
-    });
+    return /*#__PURE__*/React__default.createElement(NameComponent, nProps, name);
   }, [avatarProps, isClickable, linkAs, linkProps, name, nameProps, onClick]);
   const shouldDisplayFields = componentSize !== Size.s && componentSize !== Size.xs;
-  const fieldsBlock = fields && shouldDisplayFields && /*#__PURE__*/jsx("div", {
-    className: `${CLASSNAME}__fields`,
-    children: fields.map((field, idx) => /*#__PURE__*/jsx("span", {
-      className: `${CLASSNAME}__field`,
-      children: field
-    }, idx))
-  });
-  return /*#__PURE__*/jsxs("div", {
-    ref: ref,
-    ...forwardedProps,
+  const fieldsBlock = fields && shouldDisplayFields && /*#__PURE__*/React__default.createElement("div", {
+    className: `${CLASSNAME}__fields`
+  }, fields.map((field, idx) => /*#__PURE__*/React__default.createElement("span", {
+    key: idx,
+    className: `${CLASSNAME}__field`
+  }, field)));
+  return /*#__PURE__*/React__default.createElement("div", _extends({
+    ref: ref
+  }, forwardedProps, {
     className: classNames(className, handleBasicClasses({
       prefix: CLASSNAME,
       orientation,
@@ -111,34 +115,29 @@ const UserBlock = forwardRef((props, ref) => {
       isClickable
     })),
     onMouseLeave: onMouseLeave,
-    onMouseEnter: onMouseEnter,
-    children: [avatarProps && /*#__PURE__*/jsx(Avatar, {
-      linkAs: linkAs,
-      linkProps: linkProps,
-      alt: "",
-      ...avatarProps,
-      className: classNames(`${CLASSNAME}__avatar`, avatarProps.className),
-      size: componentSize,
-      onClick: onClick,
-      theme: theme
-    }), (fields || name || children || additionalFields) && /*#__PURE__*/jsxs("div", {
-      className: `${CLASSNAME}__wrapper`,
-      children: [children || nameBlock, fieldsBlock, shouldDisplayFields ? additionalFields : null]
-    }), shouldDisplayActions && simpleAction && /*#__PURE__*/jsx("div", {
-      className: `${CLASSNAME}__action`,
-      children: simpleAction
-    }), shouldDisplayActions && multipleActions && /*#__PURE__*/jsx("div", {
-      className: `${CLASSNAME}__actions`,
-      children: multipleActions
-    }), after ? /*#__PURE__*/jsx("div", {
-      className: `${CLASSNAME}__after`,
-      children: after
-    }) : null]
-  });
+    onMouseEnter: onMouseEnter
+  }), avatarProps && /*#__PURE__*/React__default.createElement(Avatar, _extends({
+    linkAs: linkAs,
+    linkProps: linkProps,
+    alt: ""
+  }, avatarProps, {
+    className: classNames(`${CLASSNAME}__avatar`, avatarProps.className),
+    size: componentSize,
+    onClick: onClick,
+    theme: theme
+  })), (fields || name || children || additionalFields) && /*#__PURE__*/React__default.createElement("div", {
+    className: `${CLASSNAME}__wrapper`
+  }, children || nameBlock, fieldsBlock, shouldDisplayFields ? additionalFields : null), shouldDisplayActions && simpleAction && /*#__PURE__*/React__default.createElement("div", {
+    className: `${CLASSNAME}__action`
+  }, simpleAction), shouldDisplayActions && multipleActions && /*#__PURE__*/React__default.createElement("div", {
+    className: `${CLASSNAME}__actions`
+  }, multipleActions), after ? /*#__PURE__*/React__default.createElement("div", {
+    className: `${CLASSNAME}__after`
+  }, after) : null);
 });
 UserBlock.displayName = COMPONENT_NAME;
 UserBlock.className = CLASSNAME;
 UserBlock.defaultProps = DEFAULT_PROPS;
 
 export { UserBlock };
-//# sourceMappingURL=0d1a078c.js.map
+//# sourceMappingURL=user-block-8fd15895.js.map

package/_internal/components/user-block-8fd15895.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"user-block-8fd15895.js","sources":["../../../src/components/user-block/UserBlock.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\n\nimport classNames from 'classnames';\nimport isEmpty from 'lodash/isEmpty';\nimport set from 'lodash/set';\n\nimport { Avatar, ColorPalette, Link, Orientation, Size, Theme } from '@lumx/react';\nimport { GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { AvatarProps } from '../avatar/Avatar';\n\n/**\n * User block sizes.\n */\nexport type UserBlockSize = Extract<Size, 'xs' | 's' | 'm' | 'l'>;\n\n/**\n * Defines the props of the component.\n */\nexport interface UserBlockProps extends GenericProps, HasTheme {\n    /** Props to pass to the avatar. */\n    avatarProps?: Omit<AvatarProps, 'alt'>;\n    /** Additional fields used to describe the user. */\n    fields?: string[];\n    /** Props to pass to the link wrapping the avatar thumbnail. */\n    linkProps?: React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>;\n    /** Custom react component for the link (can be used to inject react router Link). */\n    linkAs?: 'a' | any;\n    /** Multiple action toolbar content. */\n    multipleActions?: ReactNode;\n    /** User name. */\n    name?: React.ReactNode;\n    /** Props to pass to the name block. */\n    nameProps?: GenericProps;\n    /** Orientation. */\n    orientation?: Orientation;\n    /** Simple action toolbar content. */\n    simpleAction?: ReactNode;\n    /** Size variant. */\n    size?: UserBlockSize;\n    /** On click callback. */\n    onClick?(): void;\n    /** On mouse enter callback. */\n    onMouseEnter?(): void;\n    /** On mouse leave callback. */\n    onMouseLeave?(): void;\n    /** Display additional fields below the original name and fields */\n    additionalFields?: React.ReactNode;\n    /** Display an additional element after the entire component. (to the right if orientation is horizontal, at the bottom if orientation is vertical) */\n    after?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'UserBlock';\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<UserBlockProps> = {\n    orientation: Orientation.horizontal,\n    size: Size.m,\n};\n\n/**\n * UserBlock component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const UserBlock = forwardRef<UserBlockProps, HTMLDivElement>((props, ref) => {\n    const defaultTheme = useTheme() || Theme.light;\n    const {\n        avatarProps,\n        className,\n        fields,\n        linkProps,\n        linkAs,\n        multipleActions,\n        name,\n        nameProps,\n        onClick,\n        onMouseEnter,\n        onMouseLeave,\n        orientation = DEFAULT_PROPS.orientation,\n        simpleAction,\n        size = DEFAULT_PROPS.size,\n        theme = defaultTheme,\n        children,\n        additionalFields,\n        after,\n        ...forwardedProps\n    } = props;\n    let componentSize = size;\n\n    // Special case - When using vertical orientation force the size to be Sizes.l.\n    if (orientation === Orientation.vertical) {\n        componentSize = Size.l;\n    }\n\n    const shouldDisplayActions: boolean = orientation === Orientation.vertical;\n\n    const isLink = Boolean(linkProps?.href || linkAs);\n    const isClickable = !!onClick || isLink;\n\n    const nameBlock: ReactNode = React.useMemo(() => {\n        if (isEmpty(name)) {\n            return null;\n        }\n        let NameComponent: any = 'span';\n        const nProps: any = {\n            ...nameProps,\n            className: classNames(`${CLASSNAME}__name`, linkProps?.className, nameProps?.className),\n        };\n        if (isClickable) {\n            NameComponent = Link;\n            Object.assign(nProps, {\n                ...linkProps,\n                onClick,\n                linkAs,\n                color: ColorPalette.dark,\n            });\n        }\n        // Disable avatar focus since the name block is the same link / same button.\n        if (avatarProps) {\n            set(avatarProps, ['thumbnailProps', 'tabIndex'], -1);\n        }\n        return <NameComponent {...nProps}>{name}</NameComponent>;\n    }, [avatarProps, isClickable, linkAs, linkProps, name, nameProps, onClick]);\n\n    const shouldDisplayFields = componentSize !== Size.s && componentSize !== Size.xs;\n\n    const fieldsBlock: ReactNode = fields && shouldDisplayFields && (\n        <div className={`${CLASSNAME}__fields`}>\n            {fields.map((field: string, idx: number) => (\n                <span key={idx} className={`${CLASSNAME}__field`}>\n                    {field}\n                </span>\n            ))}\n        </div>\n    );\n\n    return (\n        <div\n            ref={ref}\n            {...forwardedProps}\n            className={classNames(\n                className,\n                handleBasicClasses({ prefix: CLASSNAME, orientation, size: componentSize, theme, isClickable }),\n            )}\n            onMouseLeave={onMouseLeave}\n            onMouseEnter={onMouseEnter}\n        >\n            {avatarProps && (\n                <Avatar\n                    linkAs={linkAs}\n                    linkProps={linkProps}\n                    alt=\"\"\n                    {...(avatarProps as any)}\n                    className={classNames(`${CLASSNAME}__avatar`, avatarProps.className)}\n                    size={componentSize}\n                    onClick={onClick}\n                    theme={theme}\n                />\n            )}\n            {(fields || name || children || additionalFields) && (\n                <div className={`${CLASSNAME}__wrapper`}>\n                    {children || nameBlock}\n                    {fieldsBlock}\n                    {shouldDisplayFields ? additionalFields : null}\n                </div>\n            )}\n            {shouldDisplayActions && simpleAction && <div className={`${CLASSNAME}__action`}>{simpleAction}</div>}\n            {shouldDisplayActions && multipleActions && (\n                <div className={`${CLASSNAME}__actions`}>{multipleActions}</div>\n            )}\n            {after ? <div className={`${CLASSNAME}__after`}>{after}</div> : null}\n        </div>\n    );\n});\nUserBlock.displayName = COMPONENT_NAME;\nUserBlock.className = CLASSNAME;\nUserBlock.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","orientation","Orientation","horizontal","size","Size","m","UserBlock","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","avatarProps","className","fields","linkProps","linkAs","multipleActions","name","nameProps","onClick","onMouseEnter","onMouseLeave","simpleAction","theme","children","additionalFields","after","forwardedProps","componentSize","vertical","l","shouldDisplayActions","isLink","Boolean","href","isClickable","nameBlock","React","useMemo","isEmpty","NameComponent","nProps","classNames","Link","Object","assign","color","ColorPalette","dark","set","createElement","shouldDisplayFields","s","xs","fieldsBlock","map","field","idx","key","_extends","handleBasicClasses","prefix","Avatar","alt","displayName","defaultProps"],"mappings":"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"}

package/_internal/{4cd870a5.js → constants-b9e57936.js}

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { I as IS_BROWSER } from './478b5c92.js';
+import { I as IS_BROWSER } from './constants-d0e3f49e.js';
 
 var top = 'top';
 var bottom = 'bottom';
@@ -2152,4 +2152,4 @@ const ARROW_SIZE = 14;
 const POPOVER_ZINDEX = 9999;
 
 export { ARROW_SIZE as A, FitAnchorWidth as F, Placement as P, POPOVER_ZINDEX as a, detectOverflow as d, usePopper as u };
-//# sourceMappingURL=4cd870a5.js.map
+//# sourceMappingURL=constants-b9e57936.js.map