@doist/reactist 10.0.0-beta.7 → 11.0.0

package/es/components/notification/notification.js

@@ -3,6 +3,8 @@ import React__default from 'react';
 import classNames from 'classnames';
 import CloseIcon from '../icons/CloseIcon.svg.js';
 
+var _excluded = ["id", "icon", "title", "subtitle", "children", "customCloseButton", "onClick", "onClose", "closeAltText", "className", "aria-live"];
+
 function Notification(_ref) {
   var id = _ref.id,
       icon = _ref.icon,
@@ -15,7 +17,9 @@ function Notification(_ref) {
       _ref$closeAltText = _ref.closeAltText,
       closeAltText = _ref$closeAltText === void 0 ? 'Close' : _ref$closeAltText,
       className = _ref.className,
-      rest = _objectWithoutPropertiesLoose(_ref, ["id", "icon", "title", "subtitle", "children", "customCloseButton", "onClick", "onClose", "closeAltText", "className"]);
+      _ref$ariaLive = _ref['aria-live'],
+      ariaLive = _ref$ariaLive === void 0 ? 'polite' : _ref$ariaLive,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   var titleId = title ? id + "-title" : null;
   var titleIdAttribute = titleId ? {
@@ -49,11 +53,12 @@ function Notification(_ref) {
   }, icon !== null && icon !== void 0 ? icon : null, notificationContent);
   return /*#__PURE__*/React__default.createElement("div", Object.assign({
     id: id,
-    role: "dialog",
+    role: "alert",
     className: classNames('reactist-notification', className, {
       'reactist-notification--with-button': Boolean(onClick),
       'reactist-notification--with-close-button': Boolean(onClose)
-    })
+    }),
+    "aria-live": ariaLive
   }, ariaLabelledBy, ariaDescribedBy, rest), onClick ? /*#__PURE__*/React__default.createElement("button", {
     className: "reactist-notification__button",
     onClick: onClick

package/es/components/notification/notification.js.map

@@ -1 +1 @@
-{"version":3,"file":"notification.js","sources":["../../../src/components/notification/notification.tsx"],"sourcesContent":["import React from 'react'\nimport classNames from 'classnames'\nimport CloseIcon from '../icons/CloseIcon.svg'\nimport './notification.less'\n\ntype NotificationProps = {\n    id: string\n    icon?: React.ReactNode\n    title?: React.ReactNode\n    subtitle?: React.ReactNode\n    children?: React.ReactNode\n    customCloseButton?: React.ReactNode\n    onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void\n    onClose?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void\n    closeAltText?: string\n    className?: string\n} & JSX.IntrinsicElements['div']\n\nfunction Notification({\n    id,\n    icon,\n    title,\n    subtitle,\n    children,\n    customCloseButton,\n    onClick,\n    onClose,\n    closeAltText = 'Close',\n    className,\n    ...rest\n}: NotificationProps) {\n    const titleId = title ? `${id}-title` : null\n    const titleIdAttribute = titleId ? { id: titleId } : null\n    const subtitleId = subtitle ? `${id}-subtitle` : null\n    const subtitleIdAttribute = subtitleId ? { id: subtitleId } : null\n    const contentId = children ? `${id}-content` : null\n    const contentIdAttribute = children ? { id: `${id}-content` } : null\n    const ariaLabelledBy = contentId\n        ? { 'aria-labelledby': contentId }\n        : titleId\n        ? { 'aria-labelledby': titleId }\n        : null\n    const ariaDescribedBy = subtitleId && !children ? { 'aria-describedby': subtitleId } : null\n\n    const notificationContent = (\n        <div className=\"reactist-notification__content\" {...contentIdAttribute}>\n            {children ?? (\n                <>\n                    {title ? (\n                        <h3 className=\"reactist-notification__title\" {...titleIdAttribute}>\n                            {title}\n                        </h3>\n                    ) : null}\n                    {subtitle ? (\n                        <p className=\"reactist-notification__subtitle\" {...subtitleIdAttribute}>\n                            {subtitle}\n                        </p>\n                    ) : null}\n                </>\n            )}\n        </div>\n    )\n    const notificationBody = (\n        <div className=\"reactist-notification__icon-content-group\">\n            {icon ?? null}\n            {notificationContent}\n        </div>\n    )\n\n    return (\n        <div\n            id={id}\n            role=\"dialog\"\n            className={classNames('reactist-notification', className, {\n                'reactist-notification--with-button': Boolean(onClick),\n                'reactist-notification--with-close-button': Boolean(onClose),\n            })}\n            {...ariaLabelledBy}\n            {...ariaDescribedBy}\n            {...rest}\n        >\n            {onClick ? (\n                <button className=\"reactist-notification__button\" onClick={onClick}>\n                    {notificationBody}\n                </button>\n            ) : (\n                notificationBody\n            )}\n\n            {onClose ? (\n                <button\n                    className=\"reactist-notification__close-button\"\n                    onClick={onClose}\n                    aria-label={closeAltText}\n                >\n                    {customCloseButton ?? <CloseIcon />}\n                </button>\n            ) : null}\n        </div>\n    )\n}\n\nexport { Notification }\n"],"names":["Notification","id","icon","title","subtitle","children","customCloseButton","onClick","onClose","closeAltText","className","rest","titleId","titleIdAttribute","subtitleId","subtitleIdAttribute","contentId","contentIdAttribute","ariaLabelledBy","ariaDescribedBy","notificationContent","React","notificationBody","role","classNames","Boolean","CloseIcon"],"mappings":";;;;;AAkBA,SAASA,YAAT;MACIC,UAAAA;MACAC,YAAAA;MACAC,aAAAA;MACAC,gBAAAA;MACAC,gBAAAA;MACAC,yBAAAA;MACAC,eAAAA;MACAC,eAAAA;+BACAC;MAAAA,8CAAe;MACfC,iBAAAA;MACGC;;AAEH,MAAMC,OAAO,GAAGT,KAAK,GAAMF,EAAN,cAAmB,IAAxC;AACA,MAAMY,gBAAgB,GAAGD,OAAO,GAAG;AAAEX,IAAAA,EAAE,EAAEW;AAAN,GAAH,GAAqB,IAArD;AACA,MAAME,UAAU,GAAGV,QAAQ,GAAMH,EAAN,iBAAsB,IAAjD;AACA,MAAMc,mBAAmB,GAAGD,UAAU,GAAG;AAAEb,IAAAA,EAAE,EAAEa;AAAN,GAAH,GAAwB,IAA9D;AACA,MAAME,SAAS,GAAGX,QAAQ,GAAMJ,EAAN,gBAAqB,IAA/C;AACA,MAAMgB,kBAAkB,GAAGZ,QAAQ,GAAG;AAAEJ,IAAAA,EAAE,EAAKA,EAAL;AAAJ,GAAH,GAA6B,IAAhE;AACA,MAAMiB,cAAc,GAAGF,SAAS,GAC1B;AAAE,uBAAmBA;AAArB,GAD0B,GAE1BJ,OAAO,GACP;AAAE,uBAAmBA;AAArB,GADO,GAEP,IAJN;AAKA,MAAMO,eAAe,GAAGL,UAAU,IAAI,CAACT,QAAf,GAA0B;AAAE,wBAAoBS;AAAtB,GAA1B,GAA+D,IAAvF;AAEA,MAAMM,mBAAmB,gBACrBC,4BAAA,MAAA;AAAKX,IAAAA,SAAS,EAAC;KAAqCO,mBAApD,EACKZ,QADL,aACKA,QADL,cACKA,QADL,gBAEQgB,4BAAA,wBAAA,MAAA,EACKlB,KAAK,gBACFkB,4BAAA,KAAA;AAAIX,IAAAA,SAAS,EAAC;KAAmCG,iBAAjD,EACKV,KADL,CADE,GAIF,IALR,EAMKC,QAAQ,gBACLiB,4BAAA,IAAA;AAAGX,IAAAA,SAAS,EAAC;KAAsCK,oBAAnD,EACKX,QADL,CADK,GAIL,IAVR,CAFR,CADJ;AAkBA,MAAMkB,gBAAgB,gBAClBD,4BAAA,MAAA;AAAKX,IAAAA,SAAS,EAAC;GAAf,EACKR,IADL,aACKA,IADL,cACKA,IADL,GACa,IADb,EAEKkB,mBAFL,CADJ;AAOA,sBACIC,4BAAA,MAAA;AACIpB,IAAAA,EAAE,EAAEA;AACJsB,IAAAA,IAAI,EAAC;AACLb,IAAAA,SAAS,EAAEc,UAAU,CAAC,uBAAD,EAA0Bd,SAA1B,EAAqC;AACtD,4CAAsCe,OAAO,CAAClB,OAAD,CADS;AAEtD,kDAA4CkB,OAAO,CAACjB,OAAD;AAFG,KAArC;KAIjBU,gBACAC,iBACAR,KATR,EAWKJ,OAAO,gBACJc,4BAAA,SAAA;AAAQX,IAAAA,SAAS,EAAC;AAAgCH,IAAAA,OAAO,EAAEA;GAA3D,EACKe,gBADL,CADI,GAKJA,gBAhBR,EAmBKd,OAAO,gBACJa,4BAAA,SAAA;AACIX,IAAAA,SAAS,EAAC;AACVH,IAAAA,OAAO,EAAEC;kBACGC;GAHhB,EAKKH,iBALL,aAKKA,iBALL,cAKKA,iBALL,gBAK0Be,4BAAA,CAACK,SAAD,MAAA,CAL1B,CADI,GAQJ,IA3BR,CADJ;AA+BH;;;;"}
+{"version":3,"file":"notification.js","sources":["../../../src/components/notification/notification.tsx"],"sourcesContent":["import React from 'react'\nimport classNames from 'classnames'\nimport CloseIcon from '../icons/CloseIcon.svg'\nimport './notification.less'\n\ntype NotificationProps = {\n    id: string\n    icon?: React.ReactNode\n    title?: React.ReactNode\n    subtitle?: React.ReactNode\n    children?: React.ReactNode\n    customCloseButton?: React.ReactNode\n    onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void\n    onClose?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void\n    closeAltText?: string\n    className?: string\n    /** Indicates that the notification will be updated, and describes the types of updates the user agents, assistive technologies, and user can expect from the live region. */\n    'aria-live'?: 'off' | 'polite' | 'assertive'\n} & Omit<JSX.IntrinsicElements['div'], 'aria-live'>\n\nfunction Notification({\n    id,\n    icon,\n    title,\n    subtitle,\n    children,\n    customCloseButton,\n    onClick,\n    onClose,\n    closeAltText = 'Close',\n    className,\n    'aria-live': ariaLive = 'polite',\n    ...rest\n}: NotificationProps) {\n    const titleId = title ? `${id}-title` : null\n    const titleIdAttribute = titleId ? { id: titleId } : null\n    const subtitleId = subtitle ? `${id}-subtitle` : null\n    const subtitleIdAttribute = subtitleId ? { id: subtitleId } : null\n    const contentId = children ? `${id}-content` : null\n    const contentIdAttribute = children ? { id: `${id}-content` } : null\n    const ariaLabelledBy = contentId\n        ? { 'aria-labelledby': contentId }\n        : titleId\n        ? { 'aria-labelledby': titleId }\n        : null\n    const ariaDescribedBy = subtitleId && !children ? { 'aria-describedby': subtitleId } : null\n\n    const notificationContent = (\n        <div className=\"reactist-notification__content\" {...contentIdAttribute}>\n            {children ?? (\n                <>\n                    {title ? (\n                        <h3 className=\"reactist-notification__title\" {...titleIdAttribute}>\n                            {title}\n                        </h3>\n                    ) : null}\n                    {subtitle ? (\n                        <p className=\"reactist-notification__subtitle\" {...subtitleIdAttribute}>\n                            {subtitle}\n                        </p>\n                    ) : null}\n                </>\n            )}\n        </div>\n    )\n    const notificationBody = (\n        <div className=\"reactist-notification__icon-content-group\">\n            {icon ?? null}\n            {notificationContent}\n        </div>\n    )\n\n    return (\n        <div\n            id={id}\n            role=\"alert\"\n            className={classNames('reactist-notification', className, {\n                'reactist-notification--with-button': Boolean(onClick),\n                'reactist-notification--with-close-button': Boolean(onClose),\n            })}\n            aria-live={ariaLive}\n            {...ariaLabelledBy}\n            {...ariaDescribedBy}\n            {...rest}\n        >\n            {onClick ? (\n                <button className=\"reactist-notification__button\" onClick={onClick}>\n                    {notificationBody}\n                </button>\n            ) : (\n                notificationBody\n            )}\n\n            {onClose ? (\n                <button\n                    className=\"reactist-notification__close-button\"\n                    onClick={onClose}\n                    aria-label={closeAltText}\n                >\n                    {customCloseButton ?? <CloseIcon />}\n                </button>\n            ) : null}\n        </div>\n    )\n}\n\nexport { Notification }\n"],"names":["Notification","id","icon","title","subtitle","children","customCloseButton","onClick","onClose","closeAltText","className","ariaLive","rest","titleId","titleIdAttribute","subtitleId","subtitleIdAttribute","contentId","contentIdAttribute","ariaLabelledBy","ariaDescribedBy","notificationContent","React","notificationBody","role","classNames","Boolean","CloseIcon"],"mappings":";;;;;;;AAoBA,SAASA,YAAT;MACIC,UAAAA;MACAC,YAAAA;MACAC,aAAAA;MACAC,gBAAAA;MACAC,gBAAAA;MACAC,yBAAAA;MACAC,eAAAA;MACAC,eAAAA;+BACAC;MAAAA,8CAAe;MACfC,iBAAAA;2BACA;MAAaC,sCAAW;MACrBC;;AAEH,MAAMC,OAAO,GAAGV,KAAK,GAAMF,EAAN,cAAmB,IAAxC;AACA,MAAMa,gBAAgB,GAAGD,OAAO,GAAG;AAAEZ,IAAAA,EAAE,EAAEY;AAAN,GAAH,GAAqB,IAArD;AACA,MAAME,UAAU,GAAGX,QAAQ,GAAMH,EAAN,iBAAsB,IAAjD;AACA,MAAMe,mBAAmB,GAAGD,UAAU,GAAG;AAAEd,IAAAA,EAAE,EAAEc;AAAN,GAAH,GAAwB,IAA9D;AACA,MAAME,SAAS,GAAGZ,QAAQ,GAAMJ,EAAN,gBAAqB,IAA/C;AACA,MAAMiB,kBAAkB,GAAGb,QAAQ,GAAG;AAAEJ,IAAAA,EAAE,EAAKA,EAAL;AAAJ,GAAH,GAA6B,IAAhE;AACA,MAAMkB,cAAc,GAAGF,SAAS,GAC1B;AAAE,uBAAmBA;AAArB,GAD0B,GAE1BJ,OAAO,GACP;AAAE,uBAAmBA;AAArB,GADO,GAEP,IAJN;AAKA,MAAMO,eAAe,GAAGL,UAAU,IAAI,CAACV,QAAf,GAA0B;AAAE,wBAAoBU;AAAtB,GAA1B,GAA+D,IAAvF;AAEA,MAAMM,mBAAmB,gBACrBC,4BAAA,MAAA;AAAKZ,IAAAA,SAAS,EAAC;KAAqCQ,mBAApD,EACKb,QADL,aACKA,QADL,cACKA,QADL,gBAEQiB,4BAAA,wBAAA,MAAA,EACKnB,KAAK,gBACFmB,4BAAA,KAAA;AAAIZ,IAAAA,SAAS,EAAC;KAAmCI,iBAAjD,EACKX,KADL,CADE,GAIF,IALR,EAMKC,QAAQ,gBACLkB,4BAAA,IAAA;AAAGZ,IAAAA,SAAS,EAAC;KAAsCM,oBAAnD,EACKZ,QADL,CADK,GAIL,IAVR,CAFR,CADJ;AAkBA,MAAMmB,gBAAgB,gBAClBD,4BAAA,MAAA;AAAKZ,IAAAA,SAAS,EAAC;GAAf,EACKR,IADL,aACKA,IADL,cACKA,IADL,GACa,IADb,EAEKmB,mBAFL,CADJ;AAOA,sBACIC,4BAAA,MAAA;AACIrB,IAAAA,EAAE,EAAEA;AACJuB,IAAAA,IAAI,EAAC;AACLd,IAAAA,SAAS,EAAEe,UAAU,CAAC,uBAAD,EAA0Bf,SAA1B,EAAqC;AACtD,4CAAsCgB,OAAO,CAACnB,OAAD,CADS;AAEtD,kDAA4CmB,OAAO,CAAClB,OAAD;AAFG,KAArC;iBAIVG;KACPQ,gBACAC,iBACAR,KAVR,EAYKL,OAAO,gBACJe,4BAAA,SAAA;AAAQZ,IAAAA,SAAS,EAAC;AAAgCH,IAAAA,OAAO,EAAEA;GAA3D,EACKgB,gBADL,CADI,GAKJA,gBAjBR,EAoBKf,OAAO,gBACJc,4BAAA,SAAA;AACIZ,IAAAA,SAAS,EAAC;AACVH,IAAAA,OAAO,EAAEC;kBACGC;GAHhB,EAKKH,iBALL,aAKKA,iBALL,cAKKA,iBALL,gBAK0BgB,4BAAA,CAACK,SAAD,MAAA,CAL1B,CADI,GAQJ,IA5BR,CADJ;AAgCH;;;;"}

package/es/components/popover/popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"popover.js","sources":["../../../src/components/popover/popover.tsx"],"sourcesContent":["import React from 'react'\nimport classNames from 'classnames'\n\nimport { hasEnoughSpace, calculatePosition, RelativePosition } from './positioning-utils'\n\nimport './popover.less'\n\n/**\n * Position of the popover. Defaults to `auto`.\n * `auto` tries to position the tooltip to the top,\n * if there's not enough space it tries to position the tooltip clockwise (right, bottom, left).\n * Setting a distinct value like `right` will always position the popover right, regardless of available space.\n * Specifying `horizontal` will only try to position the tooltip left and right in that order.\n * Specifying `vertical` will only try to position the tooltip top and bottom in that order.\n */\ntype Position = 'left' | 'right' | 'top' | 'bottom' | 'vertical' | 'horizontal' | 'auto'\n\ntype Props = {\n    visible?: boolean\n    /** ref of the popover in case you need to manipulate it. */\n    popoverRef?: React.Ref<HTMLElement>\n    /** ref of the wrapper in case you need to manipulate it. */\n    wrapperRef?: React.Ref<HTMLElement>\n    /** Function to be called when the mouse enters the trigger. */\n    onMouseEnter?: React.MouseEventHandler\n    /** Function to be called when the mouse leaves the trigger. */\n    onMouseLeave?: React.MouseEventHandler\n    onClick?: React.MouseEventHandler\n    /** Additional css class that is applied to the wrapper element. */\n    wrapperClassName?: string\n    /** Additional css class that is applied to the popover element. */\n    popoverClassName?: string\n    /** Additional css class that is applied to style the arrow. Not applied when `withArrow` is false. */\n    arrowClassName?: string\n    /** Content prop of the popover. */\n    content?: (() => React.ReactNode) | React.ReactNode\n    trigger?: React.ReactNode\n    position: Position\n    withArrow?: boolean\n    /**\n     * Whether vague positioning is allowed. When set to true the popover prefers to be fully visible over being correctly centered.\n     */\n    allowVaguePositioning?: boolean\n    /** Gap between the popover wrapper and the arrow. */\n    gapSize: number\n}\n\nclass Popover extends React.Component<Props> {\n    public static displayName: string\n    public static defaultProps: Props\n\n    componentDidMount() {\n        if (this.props.visible) {\n            this._updatePopoverPosition()\n        }\n    }\n\n    componentDidUpdate(prevProps: Props) {\n        if (this.wrapper && this.props.visible) {\n            const positionChanged = prevProps.position !== this.props.position\n            const vaguePositioningChanged =\n                prevProps.allowVaguePositioning !== this.props.allowVaguePositioning\n            const visibilityChanged = prevProps.visible !== this.props.visible\n            const arrowChanged = prevProps.withArrow !== this.props.withArrow\n            const gapSizeChanged = prevProps.gapSize !== this.props.gapSize\n            const contentChanged = prevProps.content !== this.props.content\n            if (\n                positionChanged ||\n                vaguePositioningChanged ||\n                visibilityChanged ||\n                arrowChanged ||\n                gapSizeChanged ||\n                contentChanged\n            ) {\n                this._updatePopoverPosition()\n            }\n        }\n    }\n\n    popover!: HTMLElement\n    wrapper!: HTMLElement\n\n    _updatePopoverPosition = () => {\n        const { position, allowVaguePositioning, gapSize } = this.props\n        const wrapperRect = this.wrapper.getBoundingClientRect()\n        const popoverRect = this.popover.getBoundingClientRect()\n\n        // Instead of using the documentElement find the nearest absolutely positioned element\n        const documentEl = document.documentElement\n        let node = this.wrapper\n        let foundParent = false\n        while (!foundParent) {\n            const styles = getComputedStyle(node)\n            const position = styles.getPropertyValue('position')\n            if (position === 'absolute' || node === documentEl || !node.parentElement) {\n                foundParent = true\n            } else {\n                node = node.parentElement\n            }\n        }\n        const nodeRect = node.getBoundingClientRect()\n        const windowDimensions = {\n            height: nodeRect.height,\n            width: nodeRect.width,\n        }\n\n        const popoverDimensions = {\n            height: popoverRect.height,\n            width: popoverRect.width,\n        }\n        const wrapperDimensions = {\n            height: wrapperRect.height,\n            width: wrapperRect.width,\n        }\n        const wrapperPositionRelative = {\n            x: wrapperRect.left - nodeRect.left,\n            y: wrapperRect.top - nodeRect.top,\n        }\n        const wrapperPositionAbsolute = {\n            x: wrapperRect.left,\n            y: wrapperRect.top,\n        }\n\n        const positionsToTry: RelativePosition[] =\n            position === 'auto'\n                ? ['top', 'right', 'bottom', 'left', 'top']\n                : position === 'vertical'\n                ? ['top', 'bottom']\n                : position === 'horizontal'\n                ? ['left', 'right']\n                : [position]\n\n        for (let index = 0; index < positionsToTry.length; index++) {\n            const currentPosition = positionsToTry[index]\n            const enoughSpaceAtPosition = hasEnoughSpace(\n                windowDimensions,\n                popoverDimensions,\n                wrapperDimensions,\n                wrapperPositionRelative,\n                currentPosition,\n                gapSize,\n            )\n\n            if (enoughSpaceAtPosition || index === positionsToTry.length - 1) {\n                const popoverPosition = calculatePosition(\n                    currentPosition,\n                    wrapperDimensions,\n                    wrapperPositionAbsolute,\n                    popoverDimensions,\n                    gapSize,\n                )\n                this.popover.style.top = `${popoverPosition.y}px`\n                this.popover.style.left = `${popoverPosition.x}px`\n\n                /**\n                 * Correct placement if vague positioning is allowed.\n                 * When it's not allowed we \"cut off\" popovers and display them\n                 * out of the viewport to maintain their centered position.\n                 */\n                if (allowVaguePositioning) {\n                    // correct horizontally\n                    if (popoverPosition.x < 0) {\n                        this.popover.style.left = `${2 * gapSize}px`\n                    }\n                    // correct vertically\n                    if (popoverPosition.y + popoverDimensions.height > windowDimensions.height) {\n                        this.popover.style.top = `${\n                            windowDimensions.height - popoverDimensions.height - 2 * gapSize\n                        }px`\n                    }\n                }\n\n                if (currentPosition !== position) {\n                    this.popover.className = this._getClassNameForPosition(currentPosition)\n                }\n                break\n            }\n        }\n    }\n\n    _getClassNameForPosition = (position: Position) => {\n        const { visible, withArrow, arrowClassName } = this.props\n        const className = classNames('reactist_popover', { visible })\n\n        if (visible && withArrow) {\n            return classNames(className, arrowClassName, {\n                arrow_top: position === 'bottom',\n                arrow_right: position === 'left',\n                arrow_bottom: position === 'auto' || position === 'top',\n                arrow_left: position === 'right',\n            })\n        }\n        return className\n    }\n\n    _updatePopoverRef = (popover: HTMLElement) => {\n        this.popover = popover\n        if (typeof this.props.popoverRef === 'function') {\n            this.props.popoverRef(popover)\n        }\n    }\n\n    _updateWrapperRef = (wrapper: HTMLElement) => {\n        this.wrapper = wrapper\n        if (typeof this.props.wrapperRef === 'function') {\n            this.props.wrapperRef(wrapper)\n        }\n    }\n\n    render() {\n        const {\n            position,\n            wrapperClassName,\n            popoverClassName,\n            onMouseEnter,\n            onMouseLeave,\n            onClick,\n            trigger,\n            content,\n        } = this.props\n        const popoverClass = position ? this._getClassNameForPosition(position) : ''\n        const popoverContentClass = classNames('reactist_popover__content', popoverClassName)\n        const wrapperClass = classNames('reactist_popover__wrapper', wrapperClassName)\n        const triggerElement = React.Children.only<React.ReactElement>(\n            trigger as React.ReactElement,\n        )\n\n        function handleTriggerClick(event: React.SyntheticEvent) {\n            // @ts-expect-error This is temporary while we revisit the Popover interface\n            if (onClick) onClick(event)\n            // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n            if (typeof triggerElement.props.onClick === 'function') {\n                // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access,@typescript-eslint/no-unsafe-call\n                triggerElement.props.onClick(event)\n            }\n        }\n\n        return (\n            <span\n                className={wrapperClass}\n                onMouseEnter={onMouseEnter}\n                onMouseLeave={onMouseLeave}\n                ref={this._updateWrapperRef}\n            >\n                {React.cloneElement(triggerElement, { onClick: handleTriggerClick })}\n                <span className={popoverClass} ref={this._updatePopoverRef}>\n                    {this.props.visible ? (\n                        <span className={popoverContentClass}>\n                            {typeof content === 'function' ? content() : content}\n                        </span>\n                    ) : null}\n                </span>\n            </span>\n        )\n    }\n}\nPopover.displayName = 'Popover'\nPopover.defaultProps = {\n    position: 'auto',\n    gapSize: 5, // default size of the arrow (see `tooltip.less`)\n}\n\nexport { Popover }\n"],"names":["Popover","props","position","allowVaguePositioning","gapSize","wrapperRect","wrapper","getBoundingClientRect","popoverRect","popover","documentEl","document","documentElement","node","foundParent","styles","getComputedStyle","getPropertyValue","parentElement","nodeRect","windowDimensions","height","width","popoverDimensions","wrapperDimensions","wrapperPositionRelative","x","left","y","top","wrapperPositionAbsolute","positionsToTry","index","length","currentPosition","enoughSpaceAtPosition","hasEnoughSpace","popoverPosition","calculatePosition","style","className","_getClassNameForPosition","visible","withArrow","arrowClassName","classNames","arrow_top","arrow_right","arrow_bottom","arrow_left","popoverRef","wrapperRef","componentDidMount","_updatePopoverPosition","componentDidUpdate","prevProps","positionChanged","vaguePositioningChanged","visibilityChanged","arrowChanged","gapSizeChanged","contentChanged","content","render","wrapperClassName","popoverClassName","onMouseEnter","onMouseLeave","onClick","trigger","popoverClass","popoverContentClass","wrapperClass","triggerElement","React","Children","only","handleTriggerClick","event","ref","_updateWrapperRef","cloneElement","_updatePopoverRef","Component","displayName","defaultProps"],"mappings":"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"}
+{"version":3,"file":"popover.js","sources":["../../../src/components/popover/popover.tsx"],"sourcesContent":["import React from 'react'\nimport classNames from 'classnames'\n\nimport { hasEnoughSpace, calculatePosition, RelativePosition } from './positioning-utils'\n\nimport './popover.less'\n\n/**\n * Position of the popover. Defaults to `auto`.\n * `auto` tries to position the tooltip to the top,\n * if there's not enough space it tries to position the tooltip clockwise (right, bottom, left).\n * Setting a distinct value like `right` will always position the popover right, regardless of available space.\n * Specifying `horizontal` will only try to position the tooltip left and right in that order.\n * Specifying `vertical` will only try to position the tooltip top and bottom in that order.\n */\ntype Position = 'left' | 'right' | 'top' | 'bottom' | 'vertical' | 'horizontal' | 'auto'\n\ntype Props = {\n    visible?: boolean\n    /** ref of the popover in case you need to manipulate it. */\n    popoverRef?: React.Ref<HTMLElement>\n    /** ref of the wrapper in case you need to manipulate it. */\n    wrapperRef?: React.Ref<HTMLElement>\n    /** Function to be called when the mouse enters the trigger. */\n    onMouseEnter?: React.MouseEventHandler\n    /** Function to be called when the mouse leaves the trigger. */\n    onMouseLeave?: React.MouseEventHandler\n    onClick?: React.MouseEventHandler\n    /** Additional css class that is applied to the wrapper element. */\n    wrapperClassName?: string\n    /** Additional css class that is applied to the popover element. */\n    popoverClassName?: string\n    /** Additional css class that is applied to style the arrow. Not applied when `withArrow` is false. */\n    arrowClassName?: string\n    /** Content prop of the popover. */\n    content?: (() => React.ReactNode) | React.ReactNode\n    trigger?: React.ReactNode\n    position: Position\n    withArrow?: boolean\n    /**\n     * Whether vague positioning is allowed. When set to true the popover prefers to be fully visible over being correctly centered.\n     */\n    allowVaguePositioning?: boolean\n    /** Gap between the popover wrapper and the arrow. */\n    gapSize: number\n}\n\nclass Popover extends React.Component<Props> {\n    public static displayName: string\n    public static defaultProps: Props\n\n    componentDidMount() {\n        if (this.props.visible) {\n            this._updatePopoverPosition()\n        }\n    }\n\n    componentDidUpdate(prevProps: Props) {\n        if (this.wrapper && this.props.visible) {\n            const positionChanged = prevProps.position !== this.props.position\n            const vaguePositioningChanged =\n                prevProps.allowVaguePositioning !== this.props.allowVaguePositioning\n            const visibilityChanged = prevProps.visible !== this.props.visible\n            const arrowChanged = prevProps.withArrow !== this.props.withArrow\n            const gapSizeChanged = prevProps.gapSize !== this.props.gapSize\n            const contentChanged = prevProps.content !== this.props.content\n            if (\n                positionChanged ||\n                vaguePositioningChanged ||\n                visibilityChanged ||\n                arrowChanged ||\n                gapSizeChanged ||\n                contentChanged\n            ) {\n                this._updatePopoverPosition()\n            }\n        }\n    }\n\n    popover!: HTMLElement\n    wrapper!: HTMLElement\n\n    _updatePopoverPosition = () => {\n        const { position, allowVaguePositioning, gapSize } = this.props\n        const wrapperRect = this.wrapper.getBoundingClientRect()\n        const popoverRect = this.popover.getBoundingClientRect()\n\n        // Instead of using the documentElement find the nearest absolutely positioned element\n        const documentEl = document.documentElement\n        let node = this.wrapper\n        let foundParent = false\n        while (!foundParent) {\n            const styles = getComputedStyle(node)\n            const position = styles.getPropertyValue('position')\n            if (position === 'absolute' || node === documentEl || !node.parentElement) {\n                foundParent = true\n            } else {\n                node = node.parentElement\n            }\n        }\n        const nodeRect = node.getBoundingClientRect()\n        const windowDimensions = {\n            height: nodeRect.height,\n            width: nodeRect.width,\n        }\n\n        const popoverDimensions = {\n            height: popoverRect.height,\n            width: popoverRect.width,\n        }\n        const wrapperDimensions = {\n            height: wrapperRect.height,\n            width: wrapperRect.width,\n        }\n        const wrapperPositionRelative = {\n            x: wrapperRect.left - nodeRect.left,\n            y: wrapperRect.top - nodeRect.top,\n        }\n        const wrapperPositionAbsolute = {\n            x: wrapperRect.left,\n            y: wrapperRect.top,\n        }\n\n        const positionsToTry: RelativePosition[] =\n            position === 'auto'\n                ? ['top', 'right', 'bottom', 'left', 'top']\n                : position === 'vertical'\n                ? ['top', 'bottom']\n                : position === 'horizontal'\n                ? ['left', 'right']\n                : [position]\n\n        for (let index = 0; index < positionsToTry.length; index++) {\n            const currentPosition = positionsToTry[index]\n            const enoughSpaceAtPosition = hasEnoughSpace(\n                windowDimensions,\n                popoverDimensions,\n                wrapperDimensions,\n                wrapperPositionRelative,\n                currentPosition,\n                gapSize,\n            )\n\n            if (enoughSpaceAtPosition || index === positionsToTry.length - 1) {\n                const popoverPosition = calculatePosition(\n                    currentPosition,\n                    wrapperDimensions,\n                    wrapperPositionAbsolute,\n                    popoverDimensions,\n                    gapSize,\n                )\n                this.popover.style.top = `${popoverPosition.y}px`\n                this.popover.style.left = `${popoverPosition.x}px`\n\n                /**\n                 * Correct placement if vague positioning is allowed.\n                 * When it's not allowed we \"cut off\" popovers and display them\n                 * out of the viewport to maintain their centered position.\n                 */\n                if (allowVaguePositioning) {\n                    // correct horizontally\n                    if (popoverPosition.x < 0) {\n                        this.popover.style.left = `${2 * gapSize}px`\n                    }\n                    // correct vertically\n                    if (popoverPosition.y + popoverDimensions.height > windowDimensions.height) {\n                        this.popover.style.top = `${\n                            windowDimensions.height - popoverDimensions.height - 2 * gapSize\n                        }px`\n                    }\n                }\n\n                if (currentPosition !== position) {\n                    this.popover.className = this._getClassNameForPosition(currentPosition)\n                }\n                break\n            }\n        }\n    }\n\n    _getClassNameForPosition = (position: Position) => {\n        const { visible, withArrow, arrowClassName } = this.props\n        const className = classNames('reactist_popover', { visible })\n\n        if (visible && withArrow) {\n            return classNames(className, arrowClassName, {\n                arrow_top: position === 'bottom',\n                arrow_right: position === 'left',\n                arrow_bottom: position === 'auto' || position === 'top',\n                arrow_left: position === 'right',\n            })\n        }\n        return className\n    }\n\n    _updatePopoverRef = (popover: HTMLElement) => {\n        this.popover = popover\n        if (typeof this.props.popoverRef === 'function') {\n            this.props.popoverRef(popover)\n        }\n    }\n\n    _updateWrapperRef = (wrapper: HTMLElement) => {\n        this.wrapper = wrapper\n        if (typeof this.props.wrapperRef === 'function') {\n            this.props.wrapperRef(wrapper)\n        }\n    }\n\n    render() {\n        const {\n            position,\n            wrapperClassName,\n            popoverClassName,\n            onMouseEnter,\n            onMouseLeave,\n            onClick,\n            trigger,\n            content,\n        } = this.props\n        const popoverClass = position ? this._getClassNameForPosition(position) : ''\n        const popoverContentClass = classNames('reactist_popover__content', popoverClassName)\n        const wrapperClass = classNames('reactist_popover__wrapper', wrapperClassName)\n        const triggerElement = React.Children.only<React.ReactElement>(\n            trigger as React.ReactElement,\n        )\n\n        function handleTriggerClick(event: React.SyntheticEvent) {\n            // @ts-expect-error This is temporary while we revisit the Popover interface\n            if (onClick) onClick(event)\n            // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n            if (typeof triggerElement.props.onClick === 'function') {\n                // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access,@typescript-eslint/no-unsafe-call\n                triggerElement.props.onClick(event)\n            }\n        }\n\n        return (\n            <span\n                className={wrapperClass}\n                onMouseEnter={onMouseEnter}\n                onMouseLeave={onMouseLeave}\n                ref={this._updateWrapperRef}\n            >\n                {React.cloneElement(triggerElement, { onClick: handleTriggerClick })}\n                <span className={popoverClass} ref={this._updatePopoverRef}>\n                    {this.props.visible ? (\n                        <span className={popoverContentClass}>\n                            {typeof content === 'function' ? content() : content}\n                        </span>\n                    ) : null}\n                </span>\n            </span>\n        )\n    }\n}\nPopover.displayName = 'Popover'\nPopover.defaultProps = {\n    position: 'auto',\n    gapSize: 5, // default size of the arrow (see `tooltip.less`)\n}\n\nexport { Popover }\n"],"names":["Popover","props","position","allowVaguePositioning","gapSize","wrapperRect","wrapper","getBoundingClientRect","popoverRect","popover","documentEl","document","documentElement","node","foundParent","styles","getComputedStyle","getPropertyValue","parentElement","nodeRect","windowDimensions","height","width","popoverDimensions","wrapperDimensions","wrapperPositionRelative","x","left","y","top","wrapperPositionAbsolute","positionsToTry","index","length","currentPosition","enoughSpaceAtPosition","hasEnoughSpace","popoverPosition","calculatePosition","style","className","_getClassNameForPosition","visible","withArrow","arrowClassName","classNames","arrow_top","arrow_right","arrow_bottom","arrow_left","popoverRef","wrapperRef","componentDidMount","_updatePopoverPosition","componentDidUpdate","prevProps","positionChanged","vaguePositioningChanged","visibilityChanged","arrowChanged","gapSizeChanged","contentChanged","content","render","wrapperClassName","popoverClassName","onMouseEnter","onMouseLeave","onClick","trigger","popoverClass","popoverContentClass","wrapperClass","triggerElement","React","Children","only","handleTriggerClick","event","ref","_updateWrapperRef","cloneElement","_updatePopoverRef","Component","displayName","defaultProps"],"mappings":"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"}

package/es/components/popover/positioning-utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"positioning-utils.js","sources":["../../../src/components/popover/positioning-utils.ts"],"sourcesContent":["type Dimensions = { width: number; height: number }\ntype AbsolutePosition = { x: number; y: number }\ntype RelativePosition = 'top' | 'right' | 'bottom' | 'left'\n\ntype HasEnoughSpaceFn = (\n    windowDimensions: Dimensions,\n    elementDimensions: Dimensions,\n    wrapperDimensions: Dimensions,\n    wrapperPosition: AbsolutePosition,\n    position: RelativePosition,\n    gap: number,\n) => boolean\n\nconst hasEnoughSpace: HasEnoughSpaceFn = (\n    windowDimensions,\n    elementDimensions,\n    wrapperDimensions,\n    wrapperPosition,\n    position,\n    gap = 0,\n) => {\n    const { height: windowHeight, width: windowWidth } = windowDimensions\n    const { height: elementHeight, width: elementWidth } = elementDimensions\n    const { height: wrapperHeight, width: wrapperWidth } = wrapperDimensions\n    const { x: wrapperX, y: wrapperY } = wrapperPosition\n\n    const verticalPosition = _calculateVerticalPosition(\n        wrapperPosition,\n        wrapperDimensions,\n        elementDimensions,\n    )\n    const horizontalPosition = _calculateHorizontalPosition(\n        wrapperPosition,\n        wrapperDimensions,\n        elementDimensions,\n    )\n    const canPlaceVertically =\n        verticalPosition >= 0 && verticalPosition + elementWidth <= windowWidth\n    const canPlaceHorizontally =\n        horizontalPosition >= 0 && horizontalPosition + elementHeight <= windowHeight\n\n    if (position === 'top') {\n        return canPlaceVertically && wrapperY - elementHeight - gap >= 0\n    } else if (position === 'right') {\n        return canPlaceHorizontally && wrapperX + wrapperWidth + elementWidth + gap <= windowWidth\n    } else if (position === 'left') {\n        return canPlaceHorizontally && wrapperX - elementWidth - gap >= 0\n    } else if (position === 'bottom') {\n        return canPlaceVertically && wrapperY + wrapperHeight + elementHeight + gap <= windowHeight\n    }\n    return false\n}\n\ntype VerticalHorizontalPositionFn = (\n    wrapperPosition: AbsolutePosition,\n    wrapperDimensions: Dimensions,\n    elementDimensions: Dimensions,\n) => number\n\nconst _calculateVerticalPosition: VerticalHorizontalPositionFn = (\n    wrapperPosition,\n    wrapperDimensions,\n    elementDimensions,\n) => {\n    return wrapperPosition.x + (wrapperDimensions.width - elementDimensions.width) / 2\n}\n\nconst _calculateHorizontalPosition: VerticalHorizontalPositionFn = (\n    wrapperPosition,\n    wrapperDimensions,\n    elementDimensions,\n) => {\n    return wrapperPosition.y + (wrapperDimensions.height - elementDimensions.height) / 2\n}\n\ntype CenterPositionFn = (\n    wrapperDimensions: Dimensions,\n    wrapperPosition: AbsolutePosition,\n    elementDimensions: Dimensions,\n    gap?: number,\n) => AbsolutePosition\n\nconst calculateTopCenterPosition: CenterPositionFn = (\n    wrapperDimensions,\n    wrapperPosition,\n    elementDimensions,\n    gap = 0,\n) => {\n    const x = _calculateVerticalPosition(wrapperPosition, wrapperDimensions, elementDimensions)\n    const y = wrapperPosition.y - elementDimensions.height - gap\n    return { x, y }\n}\n\nconst calculateBottomCenterPosition: CenterPositionFn = (\n    wrapperDimensions,\n    wrapperPosition,\n    elementDimensions,\n    gap = 0,\n) => {\n    const x = _calculateVerticalPosition(wrapperPosition, wrapperDimensions, elementDimensions)\n    const y = wrapperPosition.y + wrapperDimensions.height + gap\n    return { x, y }\n}\n\nconst calculateRightCenterPosition: CenterPositionFn = (\n    wrapperDimensions,\n    wrapperPosition,\n    elementDimensions,\n    gap = 0,\n) => {\n    const x = wrapperPosition.x + wrapperDimensions.width + gap\n    const y = _calculateHorizontalPosition(wrapperPosition, wrapperDimensions, elementDimensions)\n    return { x, y }\n}\n\nconst calculateLeftCenterPosition: CenterPositionFn = (\n    wrapperDimensions,\n    wrapperPosition,\n    elementDimensions,\n    gap = 0,\n) => {\n    const x = wrapperPosition.x - elementDimensions.width - gap\n    const y = _calculateHorizontalPosition(wrapperPosition, wrapperDimensions, elementDimensions)\n    return { x, y }\n}\n\ntype PositionFn = (\n    position: 'top' | 'right' | 'bottom' | 'left',\n    wrapperDimensions: Dimensions,\n    wrapperPosition: AbsolutePosition,\n    elementDimensions: Dimensions,\n    gap?: number,\n) => AbsolutePosition\n\nconst calculatePosition: PositionFn = (\n    position,\n    wrapperDimensions,\n    wrapperPosition,\n    elementDimensions,\n    gap = 0,\n) => {\n    if (position === 'top') {\n        return calculateTopCenterPosition(\n            wrapperDimensions,\n            wrapperPosition,\n            elementDimensions,\n            gap,\n        )\n    } else if (position === 'right') {\n        return calculateRightCenterPosition(\n            wrapperDimensions,\n            wrapperPosition,\n            elementDimensions,\n            gap,\n        )\n    } else if (position === 'bottom') {\n        return calculateBottomCenterPosition(\n            wrapperDimensions,\n            wrapperPosition,\n            elementDimensions,\n            gap,\n        )\n    } else if (position === 'left') {\n        return calculateLeftCenterPosition(\n            wrapperDimensions,\n            wrapperPosition,\n            elementDimensions,\n            gap,\n        )\n    }\n    return wrapperPosition\n}\n\nexport {\n    hasEnoughSpace,\n    calculatePosition,\n    calculateTopCenterPosition,\n    calculateBottomCenterPosition,\n    calculateRightCenterPosition,\n    calculateLeftCenterPosition,\n    RelativePosition,\n}\n"],"names":["hasEnoughSpace","windowDimensions","elementDimensions","wrapperDimensions","wrapperPosition","position","gap","windowHeight","height","windowWidth","width","elementHeight","elementWidth","wrapperHeight","wrapperWidth","wrapperX","x","wrapperY","y","verticalPosition","_calculateVerticalPosition","horizontalPosition","_calculateHorizontalPosition","canPlaceVertically","canPlaceHorizontally","calculateTopCenterPosition","calculateBottomCenterPosition","calculateRightCenterPosition","calculateLeftCenterPosition","calculatePosition"],"mappings":"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"}
+{"version":3,"file":"positioning-utils.js","sources":["../../../src/components/popover/positioning-utils.ts"],"sourcesContent":["type Dimensions = { width: number; height: number }\ntype AbsolutePosition = { x: number; y: number }\ntype RelativePosition = 'top' | 'right' | 'bottom' | 'left'\n\ntype HasEnoughSpaceFn = (\n    windowDimensions: Dimensions,\n    elementDimensions: Dimensions,\n    wrapperDimensions: Dimensions,\n    wrapperPosition: AbsolutePosition,\n    position: RelativePosition,\n    gap: number,\n) => boolean\n\nconst hasEnoughSpace: HasEnoughSpaceFn = (\n    windowDimensions,\n    elementDimensions,\n    wrapperDimensions,\n    wrapperPosition,\n    position,\n    gap = 0,\n) => {\n    const { height: windowHeight, width: windowWidth } = windowDimensions\n    const { height: elementHeight, width: elementWidth } = elementDimensions\n    const { height: wrapperHeight, width: wrapperWidth } = wrapperDimensions\n    const { x: wrapperX, y: wrapperY } = wrapperPosition\n\n    const verticalPosition = _calculateVerticalPosition(\n        wrapperPosition,\n        wrapperDimensions,\n        elementDimensions,\n    )\n    const horizontalPosition = _calculateHorizontalPosition(\n        wrapperPosition,\n        wrapperDimensions,\n        elementDimensions,\n    )\n    const canPlaceVertically =\n        verticalPosition >= 0 && verticalPosition + elementWidth <= windowWidth\n    const canPlaceHorizontally =\n        horizontalPosition >= 0 && horizontalPosition + elementHeight <= windowHeight\n\n    if (position === 'top') {\n        return canPlaceVertically && wrapperY - elementHeight - gap >= 0\n    } else if (position === 'right') {\n        return canPlaceHorizontally && wrapperX + wrapperWidth + elementWidth + gap <= windowWidth\n    } else if (position === 'left') {\n        return canPlaceHorizontally && wrapperX - elementWidth - gap >= 0\n    } else if (position === 'bottom') {\n        return canPlaceVertically && wrapperY + wrapperHeight + elementHeight + gap <= windowHeight\n    }\n    return false\n}\n\ntype VerticalHorizontalPositionFn = (\n    wrapperPosition: AbsolutePosition,\n    wrapperDimensions: Dimensions,\n    elementDimensions: Dimensions,\n) => number\n\nconst _calculateVerticalPosition: VerticalHorizontalPositionFn = (\n    wrapperPosition,\n    wrapperDimensions,\n    elementDimensions,\n) => {\n    return wrapperPosition.x + (wrapperDimensions.width - elementDimensions.width) / 2\n}\n\nconst _calculateHorizontalPosition: VerticalHorizontalPositionFn = (\n    wrapperPosition,\n    wrapperDimensions,\n    elementDimensions,\n) => {\n    return wrapperPosition.y + (wrapperDimensions.height - elementDimensions.height) / 2\n}\n\ntype CenterPositionFn = (\n    wrapperDimensions: Dimensions,\n    wrapperPosition: AbsolutePosition,\n    elementDimensions: Dimensions,\n    gap?: number,\n) => AbsolutePosition\n\nconst calculateTopCenterPosition: CenterPositionFn = (\n    wrapperDimensions,\n    wrapperPosition,\n    elementDimensions,\n    gap = 0,\n) => {\n    const x = _calculateVerticalPosition(wrapperPosition, wrapperDimensions, elementDimensions)\n    const y = wrapperPosition.y - elementDimensions.height - gap\n    return { x, y }\n}\n\nconst calculateBottomCenterPosition: CenterPositionFn = (\n    wrapperDimensions,\n    wrapperPosition,\n    elementDimensions,\n    gap = 0,\n) => {\n    const x = _calculateVerticalPosition(wrapperPosition, wrapperDimensions, elementDimensions)\n    const y = wrapperPosition.y + wrapperDimensions.height + gap\n    return { x, y }\n}\n\nconst calculateRightCenterPosition: CenterPositionFn = (\n    wrapperDimensions,\n    wrapperPosition,\n    elementDimensions,\n    gap = 0,\n) => {\n    const x = wrapperPosition.x + wrapperDimensions.width + gap\n    const y = _calculateHorizontalPosition(wrapperPosition, wrapperDimensions, elementDimensions)\n    return { x, y }\n}\n\nconst calculateLeftCenterPosition: CenterPositionFn = (\n    wrapperDimensions,\n    wrapperPosition,\n    elementDimensions,\n    gap = 0,\n) => {\n    const x = wrapperPosition.x - elementDimensions.width - gap\n    const y = _calculateHorizontalPosition(wrapperPosition, wrapperDimensions, elementDimensions)\n    return { x, y }\n}\n\ntype PositionFn = (\n    position: 'top' | 'right' | 'bottom' | 'left',\n    wrapperDimensions: Dimensions,\n    wrapperPosition: AbsolutePosition,\n    elementDimensions: Dimensions,\n    gap?: number,\n) => AbsolutePosition\n\nconst calculatePosition: PositionFn = (\n    position,\n    wrapperDimensions,\n    wrapperPosition,\n    elementDimensions,\n    gap = 0,\n) => {\n    if (position === 'top') {\n        return calculateTopCenterPosition(\n            wrapperDimensions,\n            wrapperPosition,\n            elementDimensions,\n            gap,\n        )\n    } else if (position === 'right') {\n        return calculateRightCenterPosition(\n            wrapperDimensions,\n            wrapperPosition,\n            elementDimensions,\n            gap,\n        )\n    } else if (position === 'bottom') {\n        return calculateBottomCenterPosition(\n            wrapperDimensions,\n            wrapperPosition,\n            elementDimensions,\n            gap,\n        )\n    } else if (position === 'left') {\n        return calculateLeftCenterPosition(\n            wrapperDimensions,\n            wrapperPosition,\n            elementDimensions,\n            gap,\n        )\n    }\n    return wrapperPosition\n}\n\nexport {\n    hasEnoughSpace,\n    calculatePosition,\n    calculateTopCenterPosition,\n    calculateBottomCenterPosition,\n    calculateRightCenterPosition,\n    calculateLeftCenterPosition,\n    RelativePosition,\n}\n"],"names":["hasEnoughSpace","windowDimensions","elementDimensions","wrapperDimensions","wrapperPosition","position","gap","windowHeight","height","windowWidth","width","elementHeight","elementWidth","wrapperHeight","wrapperWidth","wrapperX","x","wrapperY","y","verticalPosition","_calculateVerticalPosition","horizontalPosition","_calculateHorizontalPosition","canPlaceVertically","canPlaceHorizontally","calculateTopCenterPosition","calculateBottomCenterPosition","calculateRightCenterPosition","calculateLeftCenterPosition","calculatePosition"],"mappings":"IAaMA,cAAc,GAAqB,SAAnCA,cAAmC,CACrCC,gBADqC,EAErCC,iBAFqC,EAGrCC,iBAHqC,EAIrCC,eAJqC,EAKrCC,QALqC,EAMrCC,GANqC;MAMrCA;AAAAA,IAAAA,MAAM;;;AAEN,MAAgBC,YAAhB,GAAqDN,gBAArD,CAAQO,MAAR;AAAA,MAAqCC,WAArC,GAAqDR,gBAArD,CAA8BS,KAA9B;AACA,MAAgBC,aAAhB,GAAuDT,iBAAvD,CAAQM,MAAR;AAAA,MAAsCI,YAAtC,GAAuDV,iBAAvD,CAA+BQ,KAA/B;AACA,MAAgBG,aAAhB,GAAuDV,iBAAvD,CAAQK,MAAR;AAAA,MAAsCM,YAAtC,GAAuDX,iBAAvD,CAA+BO,KAA/B;AACA,MAAWK,QAAX,GAAqCX,eAArC,CAAQY,CAAR;AAAA,MAAwBC,QAAxB,GAAqCb,eAArC,CAAqBc,CAArB;;AAEA,MAAMC,gBAAgB,GAAGC,0BAA0B,CAC/ChB,eAD+C,EAE/CD,iBAF+C,EAG/CD,iBAH+C,CAAnD;;AAKA,MAAMmB,kBAAkB,GAAGC,4BAA4B,CACnDlB,eADmD,EAEnDD,iBAFmD,EAGnDD,iBAHmD,CAAvD;;AAKA,MAAMqB,kBAAkB,GACpBJ,gBAAgB,IAAI,CAApB,IAAyBA,gBAAgB,GAAGP,YAAnB,IAAmCH,WADhE;AAEA,MAAMe,oBAAoB,GACtBH,kBAAkB,IAAI,CAAtB,IAA2BA,kBAAkB,GAAGV,aAArB,IAAsCJ,YADrE;;AAGA,MAAIF,QAAQ,KAAK,KAAjB,EAAwB;AACpB,WAAOkB,kBAAkB,IAAIN,QAAQ,GAAGN,aAAX,GAA2BL,GAA3B,IAAkC,CAA/D;AACH,GAFD,MAEO,IAAID,QAAQ,KAAK,OAAjB,EAA0B;AAC7B,WAAOmB,oBAAoB,IAAIT,QAAQ,GAAGD,YAAX,GAA0BF,YAA1B,GAAyCN,GAAzC,IAAgDG,WAA/E;AACH,GAFM,MAEA,IAAIJ,QAAQ,KAAK,MAAjB,EAAyB;AAC5B,WAAOmB,oBAAoB,IAAIT,QAAQ,GAAGH,YAAX,GAA0BN,GAA1B,IAAiC,CAAhE;AACH,GAFM,MAEA,IAAID,QAAQ,KAAK,QAAjB,EAA2B;AAC9B,WAAOkB,kBAAkB,IAAIN,QAAQ,GAAGJ,aAAX,GAA2BF,aAA3B,GAA2CL,GAA3C,IAAkDC,YAA/E;AACH;;AACD,SAAO,KAAP;AACH;;AAQD,IAAMa,0BAA0B,GAAiC,SAA3DA,0BAA2D,CAC7DhB,eAD6D,EAE7DD,iBAF6D,EAG7DD,iBAH6D;AAK7D,SAAOE,eAAe,CAACY,CAAhB,GAAoB,CAACb,iBAAiB,CAACO,KAAlB,GAA0BR,iBAAiB,CAACQ,KAA7C,IAAsD,CAAjF;AACH,CAND;;AAQA,IAAMY,4BAA4B,GAAiC,SAA7DA,4BAA6D,CAC/DlB,eAD+D,EAE/DD,iBAF+D,EAG/DD,iBAH+D;AAK/D,SAAOE,eAAe,CAACc,CAAhB,GAAoB,CAACf,iBAAiB,CAACK,MAAlB,GAA2BN,iBAAiB,CAACM,MAA9C,IAAwD,CAAnF;AACH,CAND;;IAeMiB,0BAA0B,GAAqB,SAA/CA,0BAA+C,CACjDtB,iBADiD,EAEjDC,eAFiD,EAGjDF,iBAHiD,EAIjDI,GAJiD;MAIjDA;AAAAA,IAAAA,MAAM;;;AAEN,MAAMU,CAAC,GAAGI,0BAA0B,CAAChB,eAAD,EAAkBD,iBAAlB,EAAqCD,iBAArC,CAApC;;AACA,MAAMgB,CAAC,GAAGd,eAAe,CAACc,CAAhB,GAAoBhB,iBAAiB,CAACM,MAAtC,GAA+CF,GAAzD;AACA,SAAO;AAAEU,IAAAA,CAAC,EAADA,CAAF;AAAKE,IAAAA,CAAC,EAADA;AAAL,GAAP;AACH;;IAEKQ,6BAA6B,GAAqB,SAAlDA,6BAAkD,CACpDvB,iBADoD,EAEpDC,eAFoD,EAGpDF,iBAHoD,EAIpDI,GAJoD;MAIpDA;AAAAA,IAAAA,MAAM;;;AAEN,MAAMU,CAAC,GAAGI,0BAA0B,CAAChB,eAAD,EAAkBD,iBAAlB,EAAqCD,iBAArC,CAApC;;AACA,MAAMgB,CAAC,GAAGd,eAAe,CAACc,CAAhB,GAAoBf,iBAAiB,CAACK,MAAtC,GAA+CF,GAAzD;AACA,SAAO;AAAEU,IAAAA,CAAC,EAADA,CAAF;AAAKE,IAAAA,CAAC,EAADA;AAAL,GAAP;AACH;;IAEKS,4BAA4B,GAAqB,SAAjDA,4BAAiD,CACnDxB,iBADmD,EAEnDC,eAFmD,EAGnDF,iBAHmD,EAInDI,GAJmD;MAInDA;AAAAA,IAAAA,MAAM;;;AAEN,MAAMU,CAAC,GAAGZ,eAAe,CAACY,CAAhB,GAAoBb,iBAAiB,CAACO,KAAtC,GAA8CJ,GAAxD;;AACA,MAAMY,CAAC,GAAGI,4BAA4B,CAAClB,eAAD,EAAkBD,iBAAlB,EAAqCD,iBAArC,CAAtC;;AACA,SAAO;AAAEc,IAAAA,CAAC,EAADA,CAAF;AAAKE,IAAAA,CAAC,EAADA;AAAL,GAAP;AACH;;IAEKU,2BAA2B,GAAqB,SAAhDA,2BAAgD,CAClDzB,iBADkD,EAElDC,eAFkD,EAGlDF,iBAHkD,EAIlDI,GAJkD;MAIlDA;AAAAA,IAAAA,MAAM;;;AAEN,MAAMU,CAAC,GAAGZ,eAAe,CAACY,CAAhB,GAAoBd,iBAAiB,CAACQ,KAAtC,GAA8CJ,GAAxD;;AACA,MAAMY,CAAC,GAAGI,4BAA4B,CAAClB,eAAD,EAAkBD,iBAAlB,EAAqCD,iBAArC,CAAtC;;AACA,SAAO;AAAEc,IAAAA,CAAC,EAADA,CAAF;AAAKE,IAAAA,CAAC,EAADA;AAAL,GAAP;AACH;;IAUKW,iBAAiB,GAAe,SAAhCA,iBAAgC,CAClCxB,QADkC,EAElCF,iBAFkC,EAGlCC,eAHkC,EAIlCF,iBAJkC,EAKlCI,GALkC;MAKlCA;AAAAA,IAAAA,MAAM;;;AAEN,MAAID,QAAQ,KAAK,KAAjB,EAAwB;AACpB,WAAOoB,0BAA0B,CAC7BtB,iBAD6B,EAE7BC,eAF6B,EAG7BF,iBAH6B,EAI7BI,GAJ6B,CAAjC;AAMH,GAPD,MAOO,IAAID,QAAQ,KAAK,OAAjB,EAA0B;AAC7B,WAAOsB,4BAA4B,CAC/BxB,iBAD+B,EAE/BC,eAF+B,EAG/BF,iBAH+B,EAI/BI,GAJ+B,CAAnC;AAMH,GAPM,MAOA,IAAID,QAAQ,KAAK,QAAjB,EAA2B;AAC9B,WAAOqB,6BAA6B,CAChCvB,iBADgC,EAEhCC,eAFgC,EAGhCF,iBAHgC,EAIhCI,GAJgC,CAApC;AAMH,GAPM,MAOA,IAAID,QAAQ,KAAK,MAAjB,EAAyB;AAC5B,WAAOuB,2BAA2B,CAC9BzB,iBAD8B,EAE9BC,eAF8B,EAG9BF,iBAH8B,EAI9BI,GAJ8B,CAAlC;AAMH;;AACD,SAAOF,eAAP;AACH;;;;"}

package/es/components/progress-bar/progress-bar.js

@@ -1,10 +1,12 @@
 import React__default from 'react';
 import classNames from 'classnames';
+import { HiddenVisually } from '../../new-components/hidden-visually/hidden-visually.js';
 
 function ProgressBar(_ref) {
   var _ref$fillPercentage = _ref.fillPercentage,
       fillPercentage = _ref$fillPercentage === void 0 ? 0 : _ref$fillPercentage,
-      className = _ref.className;
+      className = _ref.className,
+      ariaValuetext = _ref['aria-valuetext'];
   var finalClassName = classNames('reactist_progress_bar', className);
   var width = fillPercentage < 0 ? 0 : fillPercentage > 100 ? 100 : fillPercentage;
   return /*#__PURE__*/React__default.createElement("div", {
@@ -14,7 +16,11 @@ function ProgressBar(_ref) {
     style: {
       width: width + "%"
     }
-  }));
+  }), /*#__PURE__*/React__default.createElement(HiddenVisually, null, /*#__PURE__*/React__default.createElement("progress", {
+    value: width,
+    max: 100,
+    "aria-valuetext": ariaValuetext !== null && ariaValuetext !== void 0 ? ariaValuetext : undefined
+  })));
 }
 
 ProgressBar.displayName = 'ProgressBar';

package/es/components/progress-bar/progress-bar.js.map

@@ -1 +1 @@
-{"version":3,"file":"progress-bar.js","sources":["../../../src/components/progress-bar/progress-bar.tsx"],"sourcesContent":["import React from 'react'\nimport classNames from 'classnames'\n\nimport './progress-bar.less'\n\ntype Props = {\n    /** Additional css class applied to the progress bar. */\n    className?: string\n    /** How much of the progress bar should be filled. Number between 0 and 100 inclusive. */\n    fillPercentage?: number\n}\nfunction ProgressBar({ fillPercentage = 0, className }: Props) {\n    const finalClassName = classNames('reactist_progress_bar', className)\n    const width = fillPercentage < 0 ? 0 : fillPercentage > 100 ? 100 : fillPercentage\n    return (\n        <div className={finalClassName}>\n            <div className=\"inner\" style={{ width: `${width}%` }} />\n        </div>\n    )\n}\nProgressBar.displayName = 'ProgressBar'\n\nexport { ProgressBar }\n"],"names":["ProgressBar","fillPercentage","className","finalClassName","classNames","width","React","style","displayName"],"mappings":";;;AAWA,SAASA,WAAT;iCAAuBC;MAAAA,kDAAiB;MAAGC,iBAAAA;AACvC,MAAMC,cAAc,GAAGC,UAAU,CAAC,uBAAD,EAA0BF,SAA1B,CAAjC;AACA,MAAMG,KAAK,GAAGJ,cAAc,GAAG,CAAjB,GAAqB,CAArB,GAAyBA,cAAc,GAAG,GAAjB,GAAuB,GAAvB,GAA6BA,cAApE;AACA,sBACIK,4BAAA,MAAA;AAAKJ,IAAAA,SAAS,EAAEC;GAAhB,eACIG,4BAAA,MAAA;AAAKJ,IAAAA,SAAS,EAAC;AAAQK,IAAAA,KAAK,EAAE;AAAEF,MAAAA,KAAK,EAAKA,KAAL;AAAP;GAA9B,CADJ,CADJ;AAKH;;AACDL,WAAW,CAACQ,WAAZ,GAA0B,aAA1B;;;;"}
+{"version":3,"file":"progress-bar.js","sources":["../../../src/components/progress-bar/progress-bar.tsx"],"sourcesContent":["import React from 'react'\nimport { HiddenVisually } from '../../new-components/hidden-visually'\nimport classNames from 'classnames'\n\nimport './progress-bar.less'\n\ntype Props = {\n    /** Additional css class applied to the progress bar. */\n    className?: string\n    /** How much of the progress bar should be filled. Number between 0 and 100 inclusive. */\n    fillPercentage?: number\n    /** Defines the human readable text alternative for assitive technologies. */\n    'aria-valuetext'?: string\n}\nfunction ProgressBar({ fillPercentage = 0, className, 'aria-valuetext': ariaValuetext }: Props) {\n    const finalClassName = classNames('reactist_progress_bar', className)\n    const width = fillPercentage < 0 ? 0 : fillPercentage > 100 ? 100 : fillPercentage\n    return (\n        <div className={finalClassName}>\n            <div className=\"inner\" style={{ width: `${width}%` }} />\n            <HiddenVisually>\n                <progress value={width} max={100} aria-valuetext={ariaValuetext ?? undefined} />\n            </HiddenVisually>\n        </div>\n    )\n}\nProgressBar.displayName = 'ProgressBar'\n\nexport { ProgressBar }\n"],"names":["ProgressBar","fillPercentage","className","ariaValuetext","finalClassName","classNames","width","React","style","HiddenVisually","value","max","undefined","displayName"],"mappings":";;;;AAcA,SAASA,WAAT;iCAAuBC;MAAAA,kDAAiB;MAAGC,iBAAAA;MAA6BC,qBAAlB;AAClD,MAAMC,cAAc,GAAGC,UAAU,CAAC,uBAAD,EAA0BH,SAA1B,CAAjC;AACA,MAAMI,KAAK,GAAGL,cAAc,GAAG,CAAjB,GAAqB,CAArB,GAAyBA,cAAc,GAAG,GAAjB,GAAuB,GAAvB,GAA6BA,cAApE;AACA,sBACIM,4BAAA,MAAA;AAAKL,IAAAA,SAAS,EAAEE;GAAhB,eACIG,4BAAA,MAAA;AAAKL,IAAAA,SAAS,EAAC;AAAQM,IAAAA,KAAK,EAAE;AAAEF,MAAAA,KAAK,EAAKA,KAAL;AAAP;GAA9B,CADJ,eAEIC,4BAAA,CAACE,cAAD,MAAA,eACIF,4BAAA,WAAA;AAAUG,IAAAA,KAAK,EAAEJ;AAAOK,IAAAA,GAAG,EAAE;sBAAqBR,0BAAAA,2BAAAA,gBAAiBS;GAAnE,CADJ,CAFJ,CADJ;AAQH;;AACDZ,WAAW,CAACa,WAAZ,GAA0B,aAA1B;;;;"}

package/es/components/select/select.js

@@ -2,6 +2,8 @@ import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '.
 import React__default from 'react';
 import classNames from 'classnames';
 
+var _excluded = ["value", "options", "onChange", "disabled", "className", "defaultValue"];
+
 function Select(_ref) {
   var value = _ref.value,
       _ref$options = _ref.options,
@@ -12,7 +14,7 @@ function Select(_ref) {
       _ref$className = _ref.className,
       className = _ref$className === void 0 ? '' : _ref$className,
       defaultValue = _ref.defaultValue,
-      otherProps = _objectWithoutPropertiesLoose(_ref, ["value", "options", "onChange", "disabled", "className", "defaultValue"]);
+      otherProps = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   var selectClassName = classNames('reactist_select', {
     disabled: disabled

package/es/components/select/select.js.map

@@ -1 +1 @@
-{"version":3,"file":"select.js","sources":["../../../src/components/select/select.tsx"],"sourcesContent":["import React from 'react'\nimport classNames from 'classnames'\n\nimport './select.less'\n\ntype Option = {\n    /** Optional key for each option. If not provided `value` is used. */\n    key?: string | number\n    /** Value of the option. */\n    value: string | number\n    /** Text to display for the option. */\n    text?: string | number\n    /** Whether the options is disabled or not. */\n    disabled?: boolean\n}\n\ntype Props = {\n    className?: string\n    disabled?: boolean\n    /** Currently selected value. */\n    value?: string | number\n    /** Callback for the change event. Will be called with the next value (not the full event). */\n    onChange?: (value: string) => void\n    /** Options that are rendered in the select. */\n    options?: Option[]\n    /** Value to initially be set */\n    defaultValue?: string | number\n}\n\nfunction Select({\n    value,\n    options = [],\n    onChange,\n    disabled = true,\n    className = '',\n    defaultValue,\n    ...otherProps\n}: Props) {\n    const selectClassName = classNames('reactist_select', { disabled }, className)\n    return (\n        <select\n            className={selectClassName}\n            value={value}\n            onChange={(event) => (onChange ? onChange(event.target.value) : undefined)}\n            disabled={disabled}\n            defaultValue={defaultValue}\n            {...otherProps}\n        >\n            {options?.map((option) => (\n                <option\n                    key={option.key || option.value}\n                    value={option.value}\n                    disabled={option.disabled}\n                >\n                    {option.text}\n                </option>\n            ))}\n        </select>\n    )\n}\nSelect.displayName = 'Select'\nSelect.defaultProps = {\n    options: [],\n    disabled: false,\n}\n\nexport { Select }\n"],"names":["Select","value","options","onChange","disabled","className","defaultValue","otherProps","selectClassName","classNames","React","event","target","undefined","map","option","key","text","displayName","defaultProps"],"mappings":";;;;AA6BA,SAASA,MAAT;MACIC,aAAAA;0BACAC;MAAAA,oCAAU;MACVC,iBAAAA;2BACAC;MAAAA,sCAAW;4BACXC;MAAAA,wCAAY;MACZC,oBAAAA;MACGC;;AAEH,MAAMC,eAAe,GAAGC,UAAU,CAAC,iBAAD,EAAoB;AAAEL,IAAAA,QAAQ,EAARA;AAAF,GAApB,EAAkCC,SAAlC,CAAlC;AACA,sBACIK,4BAAA,SAAA;AACIL,IAAAA,SAAS,EAAEG;AACXP,IAAAA,KAAK,EAAEA;AACPE,IAAAA,QAAQ,EAAE,kBAACQ,KAAD;AAAA,aAAYR,SAAQ,GAAGA,SAAQ,CAACQ,KAAK,CAACC,MAAN,CAAaX,KAAd,CAAX,GAAkCY,SAAtD;AAAA;AACVT,IAAAA,QAAQ,EAAEA;AACVE,IAAAA,YAAY,EAAEA;KACVC,WANR,EAQKL,OARL,aAQKA,OARL,uBAQKA,OAAO,CAAEY,GAAT,CAAa,UAACC,MAAD;AAAA,wBACVL,4BAAA,SAAA;AACIM,MAAAA,GAAG,EAAED,MAAM,CAACC,GAAP,IAAcD,MAAM,CAACd;AAC1BA,MAAAA,KAAK,EAAEc,MAAM,CAACd;AACdG,MAAAA,QAAQ,EAAEW,MAAM,CAACX;KAHrB,EAKKW,MAAM,CAACE,IALZ,CADU;AAAA,GAAb,CARL,CADJ;AAoBH;;AACDjB,MAAM,CAACkB,WAAP,GAAqB,QAArB;AACAlB,MAAM,CAACmB,YAAP,GAAsB;AAClBjB,EAAAA,OAAO,EAAE,EADS;AAElBE,EAAAA,QAAQ,EAAE;AAFQ,CAAtB;;;;"}
+{"version":3,"file":"select.js","sources":["../../../src/components/select/select.tsx"],"sourcesContent":["import React from 'react'\nimport classNames from 'classnames'\n\nimport './select.less'\n\ntype Option = {\n    /** Optional key for each option. If not provided `value` is used. */\n    key?: string | number\n    /** Value of the option. */\n    value: string | number\n    /** Text to display for the option. */\n    text?: string | number\n    /** Whether the options is disabled or not. */\n    disabled?: boolean\n}\n\ntype Props = {\n    className?: string\n    disabled?: boolean\n    /** Currently selected value. */\n    value?: string | number\n    /** Callback for the change event. Will be called with the next value (not the full event). */\n    onChange?: (value: string) => void\n    /** Options that are rendered in the select. */\n    options?: Option[]\n    /** Value to initially be set */\n    defaultValue?: string | number\n}\n\nfunction Select({\n    value,\n    options = [],\n    onChange,\n    disabled = true,\n    className = '',\n    defaultValue,\n    ...otherProps\n}: Props) {\n    const selectClassName = classNames('reactist_select', { disabled }, className)\n    return (\n        <select\n            className={selectClassName}\n            value={value}\n            onChange={(event) => (onChange ? onChange(event.target.value) : undefined)}\n            disabled={disabled}\n            defaultValue={defaultValue}\n            {...otherProps}\n        >\n            {options?.map((option) => (\n                <option\n                    key={option.key || option.value}\n                    value={option.value}\n                    disabled={option.disabled}\n                >\n                    {option.text}\n                </option>\n            ))}\n        </select>\n    )\n}\nSelect.displayName = 'Select'\nSelect.defaultProps = {\n    options: [],\n    disabled: false,\n}\n\nexport { Select }\n"],"names":["Select","value","options","onChange","disabled","className","defaultValue","otherProps","selectClassName","classNames","React","event","target","undefined","map","option","key","text","displayName","defaultProps"],"mappings":";;;;;;AA6BA,SAASA,MAAT;MACIC,aAAAA;0BACAC;MAAAA,oCAAU;MACVC,iBAAAA;2BACAC;MAAAA,sCAAW;4BACXC;MAAAA,wCAAY;MACZC,oBAAAA;MACGC;;AAEH,MAAMC,eAAe,GAAGC,UAAU,CAAC,iBAAD,EAAoB;AAAEL,IAAAA,QAAQ,EAARA;AAAF,GAApB,EAAkCC,SAAlC,CAAlC;AACA,sBACIK,4BAAA,SAAA;AACIL,IAAAA,SAAS,EAAEG;AACXP,IAAAA,KAAK,EAAEA;AACPE,IAAAA,QAAQ,EAAE,kBAACQ,KAAD;AAAA,aAAYR,SAAQ,GAAGA,SAAQ,CAACQ,KAAK,CAACC,MAAN,CAAaX,KAAd,CAAX,GAAkCY,SAAtD;AAAA;AACVT,IAAAA,QAAQ,EAAEA;AACVE,IAAAA,YAAY,EAAEA;KACVC,WANR,EAQKL,OARL,aAQKA,OARL,uBAQKA,OAAO,CAAEY,GAAT,CAAa,UAACC,MAAD;AAAA,wBACVL,4BAAA,SAAA;AACIM,MAAAA,GAAG,EAAED,MAAM,CAACC,GAAP,IAAcD,MAAM,CAACd;AAC1BA,MAAAA,KAAK,EAAEc,MAAM,CAACd;AACdG,MAAAA,QAAQ,EAAEW,MAAM,CAACX;KAHrB,EAKKW,MAAM,CAACE,IALZ,CADU;AAAA,GAAb,CARL,CADJ;AAoBH;;AACDjB,MAAM,CAACkB,WAAP,GAAqB,QAArB;AACAlB,MAAM,CAACmB,YAAP,GAAsB;AAClBjB,EAAAA,OAAO,EAAE,EADS;AAElBE,EAAAA,QAAQ,EAAE;AAFQ,CAAtB;;;;"}

package/es/components/time/time-utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"time-utils.js","sources":["../../../src/components/time/time-utils.ts"],"sourcesContent":["import dayjs from 'dayjs'\n/**\n * There's a problem with our setup where the default export from\n * localizedFormat (and likely every other dayjs plugin) isn't properly\n * recognized. The proposed workarounds (importing with `.js` ending, or adding\n * `allowSyntheticDefaultImports` to the tsconfig) either broke linting or type\n * checking. After spending some time on this it was decided that further\n * investigations are not worth it, the code works and the eslint ignore is fine.\n * ref: https://github.com/iamkun/dayjs/issues/593\n * ref: https://day.js.org/docs/en/installation/typescript\n */\n// eslint-disable-next-line import/default\nimport LocalizedFormat from 'dayjs/plugin/localizedFormat'\n\ndayjs.extend(LocalizedFormat)\n\ntype TimeConfig = {\n    locale?: string\n    longFormat?: string\n    shortFormatCurrentYear?: string\n    shortFormatPastYear?: string\n    daysSuffix?: string\n    hoursSuffix?: string\n    minutesSuffix?: string\n    momentsAgo?: string\n}\n\nconst TimeUtils = {\n    SHORT_FORMAT_CURRENT_YEAR: 'L',\n    SHORT_FORMAT_PAST_YEAR: 'LL',\n    LONG_FORMAT: 'LL, LT',\n\n    timeAgo(timestamp: number, config: TimeConfig = {}) {\n        const {\n            locale = 'en',\n            shortFormatCurrentYear = this.SHORT_FORMAT_CURRENT_YEAR,\n            shortFormatPastYear = this.SHORT_FORMAT_PAST_YEAR,\n            daysSuffix = 'd',\n            hoursSuffix = 'h',\n            minutesSuffix = 'm',\n            momentsAgo = 'moments ago',\n        } = config\n        const now = dayjs()\n        const date = dayjs(timestamp * 1000)\n        date.locale(locale)\n        const diffMinutes = now.diff(date, 'minute')\n        const diffHours = now.diff(date, 'hour')\n        const diffDays = now.diff(date, 'day')\n\n        if (diffDays > 1) {\n            if (date.isSame(now, 'year')) {\n                return date.format(shortFormatCurrentYear)\n            } else {\n                return date.format(shortFormatPastYear)\n            }\n        } else if (diffDays === 1) {\n            return `${diffDays}${daysSuffix}`\n        } else if (diffHours > 0 && diffHours <= 23) {\n            return `${diffHours}${hoursSuffix}`\n        } else if (diffMinutes > 0 && diffMinutes <= 59) {\n            return `${diffMinutes}${minutesSuffix}`\n        } else {\n            return momentsAgo\n        }\n    },\n\n    formatTime(timestamp: number, config: TimeConfig = {}) {\n        const {\n            locale = 'en',\n            shortFormatCurrentYear = this.SHORT_FORMAT_CURRENT_YEAR,\n            shortFormatPastYear = this.SHORT_FORMAT_PAST_YEAR,\n        } = config\n        const date = dayjs(timestamp * 1000)\n        date.locale(locale)\n        if (date.isSame(dayjs(), 'year')) {\n            return date.format(shortFormatCurrentYear)\n        } else {\n            return date.format(shortFormatPastYear)\n        }\n    },\n\n    formatTimeLong(timestamp: number, config: TimeConfig = {}) {\n        const { locale = 'en', longFormat = this.LONG_FORMAT } = config\n        const date = dayjs(timestamp * 1000)\n        date.locale(locale)\n        return date.format(longFormat)\n    },\n}\n\nexport { TimeUtils, TimeConfig }\n"],"names":["dayjs","extend","LocalizedFormat","TimeUtils","SHORT_FORMAT_CURRENT_YEAR","SHORT_FORMAT_PAST_YEAR","LONG_FORMAT","timeAgo","timestamp","config","locale","shortFormatCurrentYear","shortFormatPastYear","daysSuffix","hoursSuffix","minutesSuffix","momentsAgo","now","date","diffMinutes","diff","diffHours","diffDays","isSame","format","formatTime","formatTimeLong","longFormat"],"mappings":";;;AAcAA,KAAK,CAACC,MAAN,CAAaC,eAAb;IAaMC,SAAS,GAAG;AACdC,EAAAA,yBAAyB,EAAE,GADb;AAEdC,EAAAA,sBAAsB,EAAE,IAFV;AAGdC,EAAAA,WAAW,EAAE,QAHC;AAKdC,EAAAA,OALc,mBAKNC,SALM,EAKaC,MALb;QAKaA;AAAAA,MAAAA,SAAqB;;;kBASxCA;iCAPAC;QAAAA,qCAAS;wCACTC;QAAAA,4DAAyB,KAAKP;wCAC9BQ;QAAAA,yDAAsB,KAAKP;qCAC3BQ;QAAAA,6CAAa;sCACbC;QAAAA,+CAAc;wCACdC;QAAAA,mDAAgB;qCAChBC;QAAAA,6CAAa;AAEjB,QAAMC,GAAG,GAAGjB,KAAK,EAAjB;AACA,QAAMkB,IAAI,GAAGlB,KAAK,CAACQ,SAAS,GAAG,IAAb,CAAlB;AACAU,IAAAA,IAAI,CAACR,MAAL,CAAYA,MAAZ;AACA,QAAMS,WAAW,GAAGF,GAAG,CAACG,IAAJ,CAASF,IAAT,EAAe,QAAf,CAApB;AACA,QAAMG,SAAS,GAAGJ,GAAG,CAACG,IAAJ,CAASF,IAAT,EAAe,MAAf,CAAlB;AACA,QAAMI,QAAQ,GAAGL,GAAG,CAACG,IAAJ,CAASF,IAAT,EAAe,KAAf,CAAjB;;AAEA,QAAII,QAAQ,GAAG,CAAf,EAAkB;AACd,UAAIJ,IAAI,CAACK,MAAL,CAAYN,GAAZ,EAAiB,MAAjB,CAAJ,EAA8B;AAC1B,eAAOC,IAAI,CAACM,MAAL,CAAYb,sBAAZ,CAAP;AACH,OAFD,MAEO;AACH,eAAOO,IAAI,CAACM,MAAL,CAAYZ,mBAAZ,CAAP;AACH;AACJ,KAND,MAMO,IAAIU,QAAQ,KAAK,CAAjB,EAAoB;AACvB,kBAAUA,QAAV,GAAqBT,UAArB;AACH,KAFM,MAEA,IAAIQ,SAAS,GAAG,CAAZ,IAAiBA,SAAS,IAAI,EAAlC,EAAsC;AACzC,kBAAUA,SAAV,GAAsBP,WAAtB;AACH,KAFM,MAEA,IAAIK,WAAW,GAAG,CAAd,IAAmBA,WAAW,IAAI,EAAtC,EAA0C;AAC7C,kBAAUA,WAAV,GAAwBJ,aAAxB;AACH,KAFM,MAEA;AACH,aAAOC,UAAP;AACH;AACJ,GArCa;AAuCdS,EAAAA,UAvCc,sBAuCHjB,SAvCG,EAuCgBC,MAvChB;QAuCgBA;AAAAA,MAAAA,SAAqB;;;mBAK3CA;mCAHAC;QAAAA,sCAAS;yCACTC;QAAAA,4DAAyB,KAAKP;yCAC9BQ;QAAAA,yDAAsB,KAAKP;AAE/B,QAAMa,IAAI,GAAGlB,KAAK,CAACQ,SAAS,GAAG,IAAb,CAAlB;AACAU,IAAAA,IAAI,CAACR,MAAL,CAAYA,MAAZ;;AACA,QAAIQ,IAAI,CAACK,MAAL,CAAYvB,KAAK,EAAjB,EAAqB,MAArB,CAAJ,EAAkC;AAC9B,aAAOkB,IAAI,CAACM,MAAL,CAAYb,sBAAZ,CAAP;AACH,KAFD,MAEO;AACH,aAAOO,IAAI,CAACM,MAAL,CAAYZ,mBAAZ,CAAP;AACH;AACJ,GApDa;AAsDdc,EAAAA,cAtDc,0BAsDClB,SAtDD,EAsDoBC,MAtDpB;QAsDoBA;AAAAA,MAAAA,SAAqB;;;mBACMA;mCAAjDC;QAAAA,sCAAS;uCAAMiB;QAAAA,8CAAa,KAAKrB;AACzC,QAAMY,IAAI,GAAGlB,KAAK,CAACQ,SAAS,GAAG,IAAb,CAAlB;AACAU,IAAAA,IAAI,CAACR,MAAL,CAAYA,MAAZ;AACA,WAAOQ,IAAI,CAACM,MAAL,CAAYG,UAAZ,CAAP;AACH;AA3Da;;;;"}
+{"version":3,"file":"time-utils.js","sources":["../../../src/components/time/time-utils.ts"],"sourcesContent":["import dayjs from 'dayjs'\n/**\n * There's a problem with our setup where the default export from\n * localizedFormat (and likely every other dayjs plugin) isn't properly\n * recognized. The proposed workarounds (importing with `.js` ending, or adding\n * `allowSyntheticDefaultImports` to the tsconfig) either broke linting or type\n * checking. After spending some time on this it was decided that further\n * investigations are not worth it, the code works and the eslint ignore is fine.\n * ref: https://github.com/iamkun/dayjs/issues/593\n * ref: https://day.js.org/docs/en/installation/typescript\n */\n// eslint-disable-next-line import/default\nimport LocalizedFormat from 'dayjs/plugin/localizedFormat'\n\ndayjs.extend(LocalizedFormat)\n\ntype TimeConfig = {\n    locale?: string\n    longFormat?: string\n    shortFormatCurrentYear?: string\n    shortFormatPastYear?: string\n    daysSuffix?: string\n    hoursSuffix?: string\n    minutesSuffix?: string\n    momentsAgo?: string\n}\n\nconst TimeUtils = {\n    SHORT_FORMAT_CURRENT_YEAR: 'L',\n    SHORT_FORMAT_PAST_YEAR: 'LL',\n    LONG_FORMAT: 'LL, LT',\n\n    timeAgo(timestamp: number, config: TimeConfig = {}) {\n        const {\n            locale = 'en',\n            shortFormatCurrentYear = this.SHORT_FORMAT_CURRENT_YEAR,\n            shortFormatPastYear = this.SHORT_FORMAT_PAST_YEAR,\n            daysSuffix = 'd',\n            hoursSuffix = 'h',\n            minutesSuffix = 'm',\n            momentsAgo = 'moments ago',\n        } = config\n        const now = dayjs()\n        const date = dayjs(timestamp * 1000)\n        date.locale(locale)\n        const diffMinutes = now.diff(date, 'minute')\n        const diffHours = now.diff(date, 'hour')\n        const diffDays = now.diff(date, 'day')\n\n        if (diffDays > 1) {\n            if (date.isSame(now, 'year')) {\n                return date.format(shortFormatCurrentYear)\n            } else {\n                return date.format(shortFormatPastYear)\n            }\n        } else if (diffDays === 1) {\n            return `${diffDays}${daysSuffix}`\n        } else if (diffHours > 0 && diffHours <= 23) {\n            return `${diffHours}${hoursSuffix}`\n        } else if (diffMinutes > 0 && diffMinutes <= 59) {\n            return `${diffMinutes}${minutesSuffix}`\n        } else {\n            return momentsAgo\n        }\n    },\n\n    formatTime(timestamp: number, config: TimeConfig = {}) {\n        const {\n            locale = 'en',\n            shortFormatCurrentYear = this.SHORT_FORMAT_CURRENT_YEAR,\n            shortFormatPastYear = this.SHORT_FORMAT_PAST_YEAR,\n        } = config\n        const date = dayjs(timestamp * 1000)\n        date.locale(locale)\n        if (date.isSame(dayjs(), 'year')) {\n            return date.format(shortFormatCurrentYear)\n        } else {\n            return date.format(shortFormatPastYear)\n        }\n    },\n\n    formatTimeLong(timestamp: number, config: TimeConfig = {}) {\n        const { locale = 'en', longFormat = this.LONG_FORMAT } = config\n        const date = dayjs(timestamp * 1000)\n        date.locale(locale)\n        return date.format(longFormat)\n    },\n}\n\nexport { TimeUtils, TimeConfig }\n"],"names":["dayjs","extend","LocalizedFormat","TimeUtils","SHORT_FORMAT_CURRENT_YEAR","SHORT_FORMAT_PAST_YEAR","LONG_FORMAT","timeAgo","timestamp","config","locale","shortFormatCurrentYear","shortFormatPastYear","daysSuffix","hoursSuffix","minutesSuffix","momentsAgo","now","date","diffMinutes","diff","diffHours","diffDays","isSame","format","formatTime","formatTimeLong","longFormat"],"mappings":"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"}

package/es/components/time/time.js.map

@@ -1 +1 @@
-{"version":3,"file":"time.js","sources":["../../../src/components/time/time.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Tooltip } from '../tooltip'\nimport { TimeUtils, TimeConfig } from './time-utils'\n\nimport './time.less'\n\nconst DELAY = 60000\n\ntype Props = {\n    /** UNIX timestamp of the time to display. */\n    time?: number\n    /** Configuration for localization. */\n    config?: TimeConfig\n    /** Additional css class applied to the time element. */\n    className?: string\n    tooltipOnHover?: boolean\n    /** Refresh the component every DELAY seconds. */\n    refresh?: boolean\n    /** If you don't want to use the default time format on the tooltip use this prop to supply a custom text */\n    tooltip?: React.ReactNode\n    /** When hovering over time it expands to short absolute version. */\n    expandOnHover?: boolean\n    /** When hovering over time it expands to the full absolute version. */\n    expandFullyOnHover?: boolean\n}\n\ntype State = {\n    hovered: boolean\n    mouseX?: number\n    mouseY?: number\n}\n\nclass Time extends React.Component<Props, State> {\n    public static displayName: string\n    public static defaultProps: Props\n\n    constructor(props: Props) {\n        super(props)\n        this.refreshInterval = undefined\n\n        this.state = {\n            hovered: false,\n            mouseX: undefined,\n            mouseY: undefined,\n        }\n    }\n\n    componentDidMount() {\n        if (this.props.refresh) {\n            this._refresh()\n        }\n    }\n\n    componentDidUpdate(prevProps: Props) {\n        if (!prevProps.refresh && this.props.refresh) {\n            this._refresh()\n        }\n\n        if (prevProps.refresh && !this.props.refresh) {\n            if (this.refreshInterval) {\n                clearTimeout(this.refreshInterval)\n            }\n        }\n    }\n\n    componentWillUnmount() {\n        if (this.refreshInterval) {\n            clearTimeout(this.refreshInterval)\n        }\n    }\n\n    refreshInterval?: ReturnType<typeof setTimeout>\n\n    _setHovered(hovered: boolean, event: React.MouseEvent) {\n        const { mouseX, mouseY } = this.state\n        const { clientX, clientY } = event\n        if (clientX !== mouseX || clientY !== mouseY) {\n            // mouse has moved\n            this.setState(() => ({\n                hovered,\n                mouseX: clientX,\n                mouseY: clientY,\n            }))\n        }\n    }\n\n    _renderTime(config: Props['config']) {\n        if (!this.props.time) {\n            return\n        }\n        if (this.state.hovered) {\n            if (this.props.expandFullyOnHover && !this.props.tooltipOnHover) {\n                return TimeUtils.formatTimeLong(this.props.time, config)\n            }\n            if (this.props.expandOnHover && !this.props.tooltipOnHover) {\n                return TimeUtils.formatTime(this.props.time, config)\n            }\n        }\n        return TimeUtils.timeAgo(this.props.time, config)\n    }\n\n    _refresh() {\n        this.refreshInterval = setInterval(() => {\n            this.forceUpdate()\n        }, DELAY)\n    }\n\n    render() {\n        let className = 'reactist_time'\n        if (this.props.className) {\n            className = this.props.className\n        }\n\n        const timeComponent = this._renderTime(this.props.config)\n\n        return (\n            <time\n                className={className}\n                onMouseEnter={(event) => this._setHovered(true, event)}\n                onMouseLeave={(event) => this._setHovered(false, event)}\n            >\n                {this.props.tooltipOnHover ? (\n                    <Tooltip\n                        content={\n                            this.props.tooltip ||\n                            (this.props.time &&\n                                TimeUtils.formatTimeLong(this.props.time, this.props.config))\n                        }\n                    >\n                        <span>{timeComponent}</span>\n                    </Tooltip>\n                ) : (\n                    timeComponent\n                )}\n            </time>\n        )\n    }\n}\nTime.displayName = 'Time'\n\nTime.defaultProps = {\n    expandOnHover: false,\n    expandFullyOnHover: false,\n    tooltipOnHover: false,\n    refresh: true,\n    config: {\n        locale: 'en',\n        daysSuffix: 'd',\n        hoursSuffix: 'h',\n        minutesSuffix: 'm',\n        momentsAgo: 'moments ago',\n    },\n}\n\nexport { Time }\n"],"names":["DELAY","Time","props","refreshInterval","undefined","state","hovered","mouseX","mouseY","componentDidMount","refresh","_refresh","componentDidUpdate","prevProps","clearTimeout","componentWillUnmount","_setHovered","event","clientX","clientY","setState","_renderTime","config","time","expandFullyOnHover","tooltipOnHover","TimeUtils","formatTimeLong","expandOnHover","formatTime","timeAgo","setInterval","forceUpdate","render","className","timeComponent","React","onMouseEnter","onMouseLeave","Tooltip","content","tooltip","Component","displayName","defaultProps","locale","daysSuffix","hoursSuffix","minutesSuffix","momentsAgo"],"mappings":"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"}
+{"version":3,"file":"time.js","sources":["../../../src/components/time/time.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Tooltip } from '../tooltip'\nimport { TimeUtils, TimeConfig } from './time-utils'\n\nimport './time.less'\n\nconst DELAY = 60000\n\ntype Props = {\n    /** UNIX timestamp of the time to display. */\n    time?: number\n    /** Configuration for localization. */\n    config?: TimeConfig\n    /** Additional css class applied to the time element. */\n    className?: string\n    tooltipOnHover?: boolean\n    /** Refresh the component every DELAY seconds. */\n    refresh?: boolean\n    /** If you don't want to use the default time format on the tooltip use this prop to supply a custom text */\n    tooltip?: React.ReactNode\n    /** When hovering over time it expands to short absolute version. */\n    expandOnHover?: boolean\n    /** When hovering over time it expands to the full absolute version. */\n    expandFullyOnHover?: boolean\n}\n\ntype State = {\n    hovered: boolean\n    mouseX?: number\n    mouseY?: number\n}\n\nclass Time extends React.Component<Props, State> {\n    public static displayName: string\n    public static defaultProps: Props\n\n    constructor(props: Props) {\n        super(props)\n        this.refreshInterval = undefined\n\n        this.state = {\n            hovered: false,\n            mouseX: undefined,\n            mouseY: undefined,\n        }\n    }\n\n    componentDidMount() {\n        if (this.props.refresh) {\n            this._refresh()\n        }\n    }\n\n    componentDidUpdate(prevProps: Props) {\n        if (!prevProps.refresh && this.props.refresh) {\n            this._refresh()\n        }\n\n        if (prevProps.refresh && !this.props.refresh) {\n            if (this.refreshInterval) {\n                clearTimeout(this.refreshInterval)\n            }\n        }\n    }\n\n    componentWillUnmount() {\n        if (this.refreshInterval) {\n            clearTimeout(this.refreshInterval)\n        }\n    }\n\n    refreshInterval?: ReturnType<typeof setTimeout>\n\n    _setHovered(hovered: boolean, event: React.MouseEvent) {\n        const { mouseX, mouseY } = this.state\n        const { clientX, clientY } = event\n        if (clientX !== mouseX || clientY !== mouseY) {\n            // mouse has moved\n            this.setState(() => ({\n                hovered,\n                mouseX: clientX,\n                mouseY: clientY,\n            }))\n        }\n    }\n\n    _renderTime(config: Props['config']) {\n        if (!this.props.time) {\n            return\n        }\n        if (this.state.hovered) {\n            if (this.props.expandFullyOnHover && !this.props.tooltipOnHover) {\n                return TimeUtils.formatTimeLong(this.props.time, config)\n            }\n            if (this.props.expandOnHover && !this.props.tooltipOnHover) {\n                return TimeUtils.formatTime(this.props.time, config)\n            }\n        }\n        return TimeUtils.timeAgo(this.props.time, config)\n    }\n\n    _refresh() {\n        this.refreshInterval = setInterval(() => {\n            this.forceUpdate()\n        }, DELAY)\n    }\n\n    render() {\n        let className = 'reactist_time'\n        if (this.props.className) {\n            className = this.props.className\n        }\n\n        const timeComponent = this._renderTime(this.props.config)\n\n        return (\n            <time\n                className={className}\n                onMouseEnter={(event) => this._setHovered(true, event)}\n                onMouseLeave={(event) => this._setHovered(false, event)}\n            >\n                {this.props.tooltipOnHover ? (\n                    <Tooltip\n                        content={\n                            this.props.tooltip ||\n                            (this.props.time &&\n                                TimeUtils.formatTimeLong(this.props.time, this.props.config))\n                        }\n                    >\n                        <span>{timeComponent}</span>\n                    </Tooltip>\n                ) : (\n                    timeComponent\n                )}\n            </time>\n        )\n    }\n}\nTime.displayName = 'Time'\n\nTime.defaultProps = {\n    expandOnHover: false,\n    expandFullyOnHover: false,\n    tooltipOnHover: false,\n    refresh: true,\n    config: {\n        locale: 'en',\n        daysSuffix: 'd',\n        hoursSuffix: 'h',\n        minutesSuffix: 'm',\n        momentsAgo: 'moments ago',\n    },\n}\n\nexport { Time }\n"],"names":["DELAY","Time","props","refreshInterval","undefined","state","hovered","mouseX","mouseY","componentDidMount","refresh","_refresh","componentDidUpdate","prevProps","clearTimeout","componentWillUnmount","_setHovered","event","clientX","clientY","setState","_renderTime","config","time","expandFullyOnHover","tooltipOnHover","TimeUtils","formatTimeLong","expandOnHover","formatTime","timeAgo","setInterval","forceUpdate","render","className","timeComponent","React","onMouseEnter","onMouseLeave","Tooltip","content","tooltip","Component","displayName","defaultProps","locale","daysSuffix","hoursSuffix","minutesSuffix","momentsAgo"],"mappings":"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"}

package/es/components/tooltip/tooltip.js

@@ -3,6 +3,8 @@ import React__default from 'react';
 import classNames from 'classnames';
 import { TooltipReference, Tooltip as Tooltip$1, useTooltipState } from 'reakit/Tooltip';
 
+var _excluded = ["children", "content", "position", "gapSize", "className"];
+
 var SHOW_DELAY = 500;
 var HIDE_DELAY = 100;
 
@@ -29,7 +31,7 @@ function Tooltip(_ref) {
       _ref$gapSize = _ref.gapSize,
       gapSize = _ref$gapSize === void 0 ? 3 : _ref$gapSize,
       className = _ref.className,
-      props = _objectWithoutPropertiesLoose(_ref, ["children", "content", "position", "gapSize", "className"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   var tooltip = useDelayedTooltipState({
     placement: position,

package/es/components/tooltip/tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.js","sources":["../../../src/components/tooltip/tooltip.tsx"],"sourcesContent":["import React from 'react'\nimport classNames from 'classnames'\n\nimport {\n    useTooltipState,\n    TooltipInitialState,\n    Tooltip as ReakitTooltip,\n    TooltipReference,\n    TooltipProps as ReakitTooltipProps,\n} from 'reakit/Tooltip'\nimport { PopoverState } from 'reakit/Popover'\n\nimport './tooltip.less'\n\ntype TooltipProps = Omit<ReakitTooltipProps, 'children'> & {\n    children: React.ReactNode\n    content: React.ReactNode | (() => React.ReactNode)\n    position?: PopoverState['placement']\n    gapSize?: number\n}\n\n// These are exported to be used in the tests, they are not meant to be exported publicly\nexport const SHOW_DELAY = 500\nexport const HIDE_DELAY = 100\n\nfunction useDelayedTooltipState(initialState: TooltipInitialState) {\n    const tooltipState = useTooltipState(initialState)\n    const delay = useDelay()\n    return React.useMemo(\n        () => ({\n            ...tooltipState,\n            show: delay(() => tooltipState.show(), SHOW_DELAY),\n            hide: delay(() => tooltipState.hide(), HIDE_DELAY),\n        }),\n        [delay, tooltipState],\n    )\n}\n\nfunction Tooltip({\n    children,\n    content,\n    position = 'top',\n    gapSize = 3,\n    className,\n    ...props\n}: TooltipProps) {\n    const tooltip = useDelayedTooltipState({ placement: position, gutter: gapSize })\n\n    const child = React.Children.only<React.ReactElement>(children as React.ReactElement)\n    if (!content) {\n        return child\n    }\n\n    /**\n     * Prevents the tooltip from automatically firing on focus all the time. This is to prevent\n     * tooltips from showing when the trigger element is focused back after a popover or dialog that\n     * it opened was closed. See link below for more details.\n     * @see https://github.com/reakit/reakit/discussions/749\n     */\n    function handleFocus(event: React.FocusEvent) {\n        // If focus is not followed by a key up event, does it mean that it's not\n        // an intentional keyboard focus? Not sure but it seems to work.\n        // This may be resolved soon in an upcoming version of reakit:\n        // https://github.com/reakit/reakit/issues/750\n        function handleKeyUp(e: Event) {\n            const eventKey = (e as KeyboardEvent).key\n            if (eventKey !== 'Escape' && eventKey !== 'Enter' && eventKey !== 'Space') {\n                tooltip.show()\n            }\n        }\n        event.currentTarget.addEventListener('keyup', handleKeyUp, { once: true })\n        // Prevent tooltip.show from being called by TooltipReference\n        event.preventDefault()\n        // eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-member-access\n        if (typeof child.props.onFocus === 'function') child.props.onFocus(event)\n    }\n\n    return (\n        <>\n            <TooltipReference\n                {...tooltip}\n                // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-assignment\n                ref={(child as any).ref}\n                {...child.props}\n                onFocus={handleFocus}\n            >\n                {(referenceProps) => React.cloneElement(child, referenceProps)}\n            </TooltipReference>\n            {tooltip.visible ? (\n                <ReakitTooltip\n                    {...tooltip}\n                    {...props}\n                    className={classNames('reactist_tooltip', className)}\n                >\n                    {typeof content === 'function' ? content() : content}\n                </ReakitTooltip>\n            ) : null}\n        </>\n    )\n}\n\nexport type { TooltipProps }\nexport { Tooltip }\n\n//\n// Internal helpers\n//\n\n/**\n * Returns a function offering the same interface as setTimeout, but cleans up on unmount.\n *\n * The timeout state is shared, and only one delayed function can be active at any given time. If\n * a new delayed function is called while another one was waiting for its time to run, that older\n * invocation is cleared and it never runs.\n *\n * This is suitable for our use case here, but probably not the most intuitive thing in general.\n * That's why this is not made a shared util or something like it.\n */\nfunction useDelay() {\n    const timeoutRef = React.useRef<ReturnType<typeof setTimeout>>()\n\n    const clearTimeouts = React.useCallback(function clearTimeouts() {\n        if (timeoutRef.current != null) {\n            clearTimeout(timeoutRef.current)\n        }\n    }, [])\n\n    // Runs clearTimeouts when the component is unmounted\n    React.useEffect(() => clearTimeouts, [clearTimeouts])\n\n    return React.useCallback(\n        function delay(fn: () => void, delay: number) {\n            return () => {\n                clearTimeouts()\n                timeoutRef.current = setTimeout(fn, delay)\n            }\n        },\n        [clearTimeouts],\n    )\n}\n"],"names":["SHOW_DELAY","HIDE_DELAY","useDelayedTooltipState","initialState","tooltipState","useTooltipState","delay","useDelay","React","useMemo","show","hide","Tooltip","children","content","position","gapSize","className","props","tooltip","placement","gutter","child","Children","only","handleFocus","event","handleKeyUp","e","eventKey","key","currentTarget","addEventListener","once","preventDefault","onFocus","TooltipReference","ref","referenceProps","cloneElement","visible","ReakitTooltip","classNames","timeoutRef","useRef","clearTimeouts","useCallback","current","clearTimeout","useEffect","fn","setTimeout"],"mappings":"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"}
+{"version":3,"file":"tooltip.js","sources":["../../../src/components/tooltip/tooltip.tsx"],"sourcesContent":["import React from 'react'\nimport classNames from 'classnames'\n\nimport {\n    useTooltipState,\n    TooltipInitialState,\n    Tooltip as ReakitTooltip,\n    TooltipReference,\n    TooltipProps as ReakitTooltipProps,\n} from 'reakit/Tooltip'\nimport { PopoverState } from 'reakit/Popover'\n\nimport './tooltip.less'\n\ntype TooltipProps = Omit<ReakitTooltipProps, 'children'> & {\n    children: React.ReactNode\n    content: React.ReactNode | (() => React.ReactNode)\n    position?: PopoverState['placement']\n    gapSize?: number\n}\n\n// These are exported to be used in the tests, they are not meant to be exported publicly\nexport const SHOW_DELAY = 500\nexport const HIDE_DELAY = 100\n\nfunction useDelayedTooltipState(initialState: TooltipInitialState) {\n    const tooltipState = useTooltipState(initialState)\n    const delay = useDelay()\n    return React.useMemo(\n        () => ({\n            ...tooltipState,\n            show: delay(() => tooltipState.show(), SHOW_DELAY),\n            hide: delay(() => tooltipState.hide(), HIDE_DELAY),\n        }),\n        [delay, tooltipState],\n    )\n}\n\nfunction Tooltip({\n    children,\n    content,\n    position = 'top',\n    gapSize = 3,\n    className,\n    ...props\n}: TooltipProps) {\n    const tooltip = useDelayedTooltipState({ placement: position, gutter: gapSize })\n\n    const child = React.Children.only<React.ReactElement>(children as React.ReactElement)\n    if (!content) {\n        return child\n    }\n\n    /**\n     * Prevents the tooltip from automatically firing on focus all the time. This is to prevent\n     * tooltips from showing when the trigger element is focused back after a popover or dialog that\n     * it opened was closed. See link below for more details.\n     * @see https://github.com/reakit/reakit/discussions/749\n     */\n    function handleFocus(event: React.FocusEvent) {\n        // If focus is not followed by a key up event, does it mean that it's not\n        // an intentional keyboard focus? Not sure but it seems to work.\n        // This may be resolved soon in an upcoming version of reakit:\n        // https://github.com/reakit/reakit/issues/750\n        function handleKeyUp(e: Event) {\n            const eventKey = (e as KeyboardEvent).key\n            if (eventKey !== 'Escape' && eventKey !== 'Enter' && eventKey !== 'Space') {\n                tooltip.show()\n            }\n        }\n        event.currentTarget.addEventListener('keyup', handleKeyUp, { once: true })\n        // Prevent tooltip.show from being called by TooltipReference\n        event.preventDefault()\n        // eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-member-access\n        if (typeof child.props.onFocus === 'function') child.props.onFocus(event)\n    }\n\n    return (\n        <>\n            <TooltipReference\n                {...tooltip}\n                // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-assignment\n                ref={(child as any).ref}\n                {...child.props}\n                onFocus={handleFocus}\n            >\n                {(referenceProps) => React.cloneElement(child, referenceProps)}\n            </TooltipReference>\n            {tooltip.visible ? (\n                <ReakitTooltip\n                    {...tooltip}\n                    {...props}\n                    className={classNames('reactist_tooltip', className)}\n                >\n                    {typeof content === 'function' ? content() : content}\n                </ReakitTooltip>\n            ) : null}\n        </>\n    )\n}\n\nexport type { TooltipProps }\nexport { Tooltip }\n\n//\n// Internal helpers\n//\n\n/**\n * Returns a function offering the same interface as setTimeout, but cleans up on unmount.\n *\n * The timeout state is shared, and only one delayed function can be active at any given time. If\n * a new delayed function is called while another one was waiting for its time to run, that older\n * invocation is cleared and it never runs.\n *\n * This is suitable for our use case here, but probably not the most intuitive thing in general.\n * That's why this is not made a shared util or something like it.\n */\nfunction useDelay() {\n    const timeoutRef = React.useRef<ReturnType<typeof setTimeout>>()\n\n    const clearTimeouts = React.useCallback(function clearTimeouts() {\n        if (timeoutRef.current != null) {\n            clearTimeout(timeoutRef.current)\n        }\n    }, [])\n\n    // Runs clearTimeouts when the component is unmounted\n    React.useEffect(() => clearTimeouts, [clearTimeouts])\n\n    return React.useCallback(\n        function delay(fn: () => void, delay: number) {\n            return () => {\n                clearTimeouts()\n                timeoutRef.current = setTimeout(fn, delay)\n            }\n        },\n        [clearTimeouts],\n    )\n}\n"],"names":["SHOW_DELAY","HIDE_DELAY","useDelayedTooltipState","initialState","tooltipState","useTooltipState","delay","useDelay","React","useMemo","show","hide","Tooltip","children","content","position","gapSize","className","props","tooltip","placement","gutter","child","Children","only","handleFocus","event","handleKeyUp","e","eventKey","key","currentTarget","addEventListener","once","preventDefault","onFocus","TooltipReference","ref","referenceProps","cloneElement","visible","ReakitTooltip","classNames","timeoutRef","useRef","clearTimeouts","useCallback","current","clearTimeout","useEffect","fn","setTimeout"],"mappings":"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"}

package/es/index.js

@@ -29,18 +29,14 @@ export { default as DeprecatedButton } from './components/deprecated-button/inde
 export { default as Dropdown } from './components/dropdown/index.js';
 export { COLORS } from './components/color-picker/color-picker.js';
 export { default as ColorPicker } from './components/color-picker/index.js';
-export { default as ErrorMessage } from './components/error-message/index.js';
-export { default as Icon } from './components/icon/index.js';
 export { default as Input } from './components/input/index.js';
 export { default as KeyboardShortcut } from './components/keyboard-shortcut/index.js';
 export { SUPPORTED_KEYS } from './components/key-capturer/key-capturer.js';
 export { default as KeyCapturer } from './components/key-capturer/index.js';
 export { default as Popover } from './components/popover/index.js';
 export { default as ProgressBar } from './components/progress-bar/index.js';
-export { default as RangeInput } from './components/range-input/index.js';
 export { default as Select } from './components/select/index.js';
 export { default as Time } from './components/time/index.js';
-export { default as Tip } from './components/tip/index.js';
 export { Notification } from './components/notification/notification.js';
 export { Menu, MenuButton, MenuGroup, MenuItem, MenuList, SubMenu } from './components/menu/menu.js';
 export { default as DeprecatedModal } from './components/deprecated-modal/index.js';

package/es/index.js.map

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

package/es/new-components/base-button/base-button.js

@@ -6,6 +6,8 @@ import { Spinner } from '../spinner/spinner.js';
 import { Tooltip } from '../../components/tooltip/tooltip.js';
 import styles from './base-button.module.css.js';
 
+var _excluded = ["as", "variant", "tone", "size", "disabled", "loading", "tooltip", "onClick", "exceptionallySetClassName", "children", "startIcon", "endIcon", "icon"];
+
 function preventDefault(event) {
   event.preventDefault();
 }
@@ -39,7 +41,7 @@ var BaseButton = /*#__PURE__*/polymorphicComponent(function BaseButton(_ref, ref
       startIcon = _ref.startIcon,
       endIcon = _ref.endIcon,
       icon = _ref.icon,
-      props = _objectWithoutPropertiesLoose(_ref, ["as", "variant", "tone", "size", "disabled", "loading", "tooltip", "onClick", "exceptionallySetClassName", "children", "startIcon", "endIcon", "icon"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   var isDisabled = loading || disabled;
   var buttonElement = /*#__PURE__*/createElement(Box, Object.assign({}, props, {

package/es/new-components/base-button/base-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"base-button.js","sources":["../../../src/new-components/base-button/base-button.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Tooltip, TooltipProps } from '../../components/tooltip'\nimport { polymorphicComponent } from '../../utils/polymorphism'\nimport { Box } from '../box'\nimport { Spinner } from '../spinner'\nimport styles from './base-button.module.css'\n\nfunction preventDefault(event: React.SyntheticEvent) {\n    event.preventDefault()\n}\n\ntype ButtonVariant = 'primary' | 'secondary' | 'tertiary' | 'quaternary'\ntype ButtonTone = 'normal' | 'destructive'\ntype ButtonSize = 'small' | 'normal' | 'large'\ntype IconElement = React.ReactChild\n\ntype CommonProps = {\n    /**\n     * The button's variant.\n     */\n    variant: ButtonVariant\n    /**\n     * The button's tone.\n     * @default 'normal'\n     */\n    tone?: ButtonTone\n    /**\n     * The button's size.\n     * @default 'normal'\n     */\n    size?: ButtonSize\n    /**\n     * Whether the button is disabled or not.\n     * @default false\n     */\n    disabled?: boolean\n    /**\n     * Whether the button is busy/loading.\n     *\n     * A button in this state is functionally and semantically disabled. Visually is does not look\n     * dimmed (as disabled buttons normally do), but it shows a loading spinner instead.\n     *\n     * @default false\n     */\n    loading?: boolean\n    /**\n     * A tooltip linked to the button element.\n     */\n    tooltip?: TooltipProps['content']\n}\n\ntype IconButtonProps = {\n    icon: IconElement\n    'aria-label': string\n    children?: never\n    startIcon?: never\n    endIcon?: never\n}\n\ntype LabelledButtonProps = {\n    children: NonNullable<React.ReactNode>\n    startIcon?: IconElement\n    endIcon?: IconElement\n    icon?: never\n}\n\nexport type BaseButtonProps = CommonProps & (IconButtonProps | LabelledButtonProps)\n\n/**\n * The component that powers `Button` and `ButtonLink`, where the button styling logic and some\n * common functionality resides. This component is internal to Reactist.\n *\n * 🎨 [Figma](https://www.figma.com/file/LYlWNzvhMDh907l07mPPQk/Product-Web?node-id=4693%3A175143)\n *\n * @see Button\n * @see ButtonLink\n */\nexport const BaseButton = polymorphicComponent<'div', BaseButtonProps>(function BaseButton(\n    {\n        as = 'div',\n        variant,\n        tone = 'normal',\n        size = 'normal',\n        disabled = false,\n        loading = false,\n        tooltip,\n        onClick,\n        exceptionallySetClassName,\n        children,\n        startIcon,\n        endIcon,\n        icon,\n        ...props\n    },\n    ref,\n) {\n    const isDisabled = loading || disabled\n    const buttonElement = (\n        <Box\n            {...props}\n            as={as}\n            ref={ref}\n            aria-disabled={isDisabled}\n            onClick={isDisabled ? preventDefault : onClick}\n            className={[\n                exceptionallySetClassName,\n                styles.baseButton,\n                styles[`variant-${variant}`],\n                styles[`tone-${tone}`],\n                styles[`size-${size}`],\n                icon ? styles.iconButton : null,\n                disabled ? styles.disabled : null,\n            ]}\n        >\n            {icon ? (\n                (loading && <Spinner />) || icon\n            ) : (\n                <>\n                    {startIcon ? (\n                        <Box display=\"flex\" className={styles.startIcon} aria-hidden>\n                            {loading && !endIcon ? <Spinner /> : startIcon}\n                        </Box>\n                    ) : null}\n                    {children ? <span className={styles.label}>{children}</span> : null}\n                    {endIcon || (loading && !startIcon) ? (\n                        <Box display=\"flex\" className={styles.endIcon} aria-hidden>\n                            {loading ? <Spinner /> : endIcon}\n                        </Box>\n                    ) : null}\n                </>\n            )}\n        </Box>\n    )\n\n    // If it's an icon-only button, make sure it uses the aria-label as tooltip if no tooltip was provided\n    const tooltipContent = icon ? tooltip ?? props['aria-label'] : tooltip\n    return tooltipContent ? (\n        <Tooltip content={tooltipContent}>{buttonElement}</Tooltip>\n    ) : (\n        buttonElement\n    )\n})\n"],"names":["preventDefault","event","BaseButton","polymorphicComponent","ref","as","variant","tone","size","disabled","loading","tooltip","onClick","exceptionallySetClassName","children","startIcon","endIcon","icon","props","isDisabled","buttonElement","React","Box","className","styles","baseButton","iconButton","Spinner","display","label","tooltipContent","Tooltip","content"],"mappings":";;;;;;;;AAOA,SAASA,cAAT,CAAwBC,KAAxB;AACIA,EAAAA,KAAK,CAACD,cAAN;AACH;AA2DD;;;;;;;;;;;IASaE,UAAU,gBAAGC,oBAAoB,CAAyB,SAASD,UAAT,OAiBnEE,GAjBmE;qBAE/DC;MAAAA,0BAAK;MACLC,eAAAA;uBACAC;MAAAA,8BAAO;uBACPC;MAAAA,8BAAO;2BACPC;MAAAA,sCAAW;0BACXC;MAAAA,oCAAU;MACVC,eAAAA;MACAC,eAAAA;MACAC,iCAAAA;MACAC,gBAAAA;MACAC,iBAAAA;MACAC,eAAAA;MACAC,YAAAA;MACGC;;AAIP,MAAMC,UAAU,GAAGT,OAAO,IAAID,QAA9B;AACA,MAAMW,aAAa,gBACfC,aAAA,CAACC,GAAD,oBACQJ;AACJb,IAAAA,EAAE,EAAEA;AACJD,IAAAA,GAAG,EAAEA;qBACUe;AACfP,IAAAA,OAAO,EAAEO,UAAU,GAAGnB,cAAH,GAAoBY;AACvCW,IAAAA,SAAS,EAAE,CACPV,yBADO,EAEPW,MAAM,CAACC,UAFA,EAGPD,MAAM,cAAYlB,OAAZ,CAHC,EAIPkB,MAAM,WAASjB,IAAT,CAJC,EAKPiB,MAAM,WAAShB,IAAT,CALC,EAMPS,IAAI,GAAGO,MAAM,CAACE,UAAV,GAAuB,IANpB,EAOPjB,QAAQ,GAAGe,MAAM,CAACf,QAAV,GAAqB,IAPtB;IANf,EAgBKQ,IAAI,GACAP,OAAO,iBAAIW,aAAA,CAACM,OAAD,MAAA,CAAZ,IAA4BV,IAD3B,gBAGDI,aAAA,SAAA,MAAA,EACKN,SAAS,gBACNM,aAAA,CAACC,GAAD;AAAKM,IAAAA,OAAO,EAAC;AAAOL,IAAAA,SAAS,EAAEC,MAAM,CAACT;;GAAtC,EACKL,OAAO,IAAI,CAACM,OAAZ,gBAAsBK,aAAA,CAACM,OAAD,MAAA,CAAtB,GAAoCZ,SADzC,CADM,GAIN,IALR,EAMKD,QAAQ,gBAAGO,aAAA,OAAA;AAAME,IAAAA,SAAS,EAAEC,MAAM,CAACK;GAAxB,EAAgCf,QAAhC,CAAH,GAAsD,IANnE,EAOKE,OAAO,IAAKN,OAAO,IAAI,CAACK,SAAxB,gBACGM,aAAA,CAACC,GAAD;AAAKM,IAAAA,OAAO,EAAC;AAAOL,IAAAA,SAAS,EAAEC,MAAM,CAACR;;GAAtC,EACKN,OAAO,gBAAGW,aAAA,CAACM,OAAD,MAAA,CAAH,GAAiBX,OAD7B,CADH,GAIG,IAXR,CAnBR,CADJ;;AAsCA,MAAMc,cAAc,GAAGb,IAAI,GAAGN,OAAH,aAAGA,OAAH,cAAGA,OAAH,GAAcO,KAAK,CAAC,YAAD,CAAnB,GAAoCP,OAA/D;AACA,SAAOmB,cAAc,gBACjBT,aAAA,CAACU,OAAD;AAASC,IAAAA,OAAO,EAAEF;GAAlB,EAAmCV,aAAnC,CADiB,GAGjBA,aAHJ;AAKH,CAhE6C;;;;"}
+{"version":3,"file":"base-button.js","sources":["../../../src/new-components/base-button/base-button.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Tooltip, TooltipProps } from '../../components/tooltip'\nimport { polymorphicComponent } from '../../utils/polymorphism'\nimport { Box } from '../box'\nimport { Spinner } from '../spinner'\nimport styles from './base-button.module.css'\n\nfunction preventDefault(event: React.SyntheticEvent) {\n    event.preventDefault()\n}\n\ntype ButtonVariant = 'primary' | 'secondary' | 'tertiary' | 'quaternary'\ntype ButtonTone = 'normal' | 'destructive'\ntype ButtonSize = 'small' | 'normal' | 'large'\ntype IconElement = React.ReactChild\n\ntype CommonProps = {\n    /**\n     * The button's variant.\n     */\n    variant: ButtonVariant\n    /**\n     * The button's tone.\n     * @default 'normal'\n     */\n    tone?: ButtonTone\n    /**\n     * The button's size.\n     * @default 'normal'\n     */\n    size?: ButtonSize\n    /**\n     * Whether the button is disabled or not.\n     * @default false\n     */\n    disabled?: boolean\n    /**\n     * Whether the button is busy/loading.\n     *\n     * A button in this state is functionally and semantically disabled. Visually is does not look\n     * dimmed (as disabled buttons normally do), but it shows a loading spinner instead.\n     *\n     * @default false\n     */\n    loading?: boolean\n    /**\n     * A tooltip linked to the button element.\n     */\n    tooltip?: TooltipProps['content']\n}\n\ntype IconButtonProps = {\n    icon: IconElement\n    'aria-label': string\n    children?: never\n    startIcon?: never\n    endIcon?: never\n}\n\ntype LabelledButtonProps = {\n    children: NonNullable<React.ReactNode>\n    startIcon?: IconElement\n    endIcon?: IconElement\n    icon?: never\n}\n\nexport type BaseButtonProps = CommonProps & (IconButtonProps | LabelledButtonProps)\n\n/**\n * The component that powers `Button` and `ButtonLink`, where the button styling logic and some\n * common functionality resides. This component is internal to Reactist.\n *\n * 🎨 [Figma](https://www.figma.com/file/LYlWNzvhMDh907l07mPPQk/Product-Web?node-id=4693%3A175143)\n *\n * @see Button\n * @see ButtonLink\n */\nexport const BaseButton = polymorphicComponent<'div', BaseButtonProps>(function BaseButton(\n    {\n        as = 'div',\n        variant,\n        tone = 'normal',\n        size = 'normal',\n        disabled = false,\n        loading = false,\n        tooltip,\n        onClick,\n        exceptionallySetClassName,\n        children,\n        startIcon,\n        endIcon,\n        icon,\n        ...props\n    },\n    ref,\n) {\n    const isDisabled = loading || disabled\n    const buttonElement = (\n        <Box\n            {...props}\n            as={as}\n            ref={ref}\n            aria-disabled={isDisabled}\n            onClick={isDisabled ? preventDefault : onClick}\n            className={[\n                exceptionallySetClassName,\n                styles.baseButton,\n                styles[`variant-${variant}`],\n                styles[`tone-${tone}`],\n                styles[`size-${size}`],\n                icon ? styles.iconButton : null,\n                disabled ? styles.disabled : null,\n            ]}\n        >\n            {icon ? (\n                (loading && <Spinner />) || icon\n            ) : (\n                <>\n                    {startIcon ? (\n                        <Box display=\"flex\" className={styles.startIcon} aria-hidden>\n                            {loading && !endIcon ? <Spinner /> : startIcon}\n                        </Box>\n                    ) : null}\n                    {children ? <span className={styles.label}>{children}</span> : null}\n                    {endIcon || (loading && !startIcon) ? (\n                        <Box display=\"flex\" className={styles.endIcon} aria-hidden>\n                            {loading ? <Spinner /> : endIcon}\n                        </Box>\n                    ) : null}\n                </>\n            )}\n        </Box>\n    )\n\n    // If it's an icon-only button, make sure it uses the aria-label as tooltip if no tooltip was provided\n    const tooltipContent = icon ? tooltip ?? props['aria-label'] : tooltip\n    return tooltipContent ? (\n        <Tooltip content={tooltipContent}>{buttonElement}</Tooltip>\n    ) : (\n        buttonElement\n    )\n})\n"],"names":["preventDefault","event","BaseButton","polymorphicComponent","ref","as","variant","tone","size","disabled","loading","tooltip","onClick","exceptionallySetClassName","children","startIcon","endIcon","icon","props","isDisabled","buttonElement","React","Box","className","styles","baseButton","iconButton","Spinner","display","label","tooltipContent","Tooltip","content"],"mappings":";;;;;;;;;;AAOA,SAASA,cAAT,CAAwBC,KAAxB;AACIA,EAAAA,KAAK,CAACD,cAAN;AACH;AA2DD;;;;;;;;;;;IASaE,UAAU,gBAAGC,oBAAoB,CAAyB,SAASD,UAAT,OAiBnEE,GAjBmE;qBAE/DC;MAAAA,0BAAK;MACLC,eAAAA;uBACAC;MAAAA,8BAAO;uBACPC;MAAAA,8BAAO;2BACPC;MAAAA,sCAAW;0BACXC;MAAAA,oCAAU;MACVC,eAAAA;MACAC,eAAAA;MACAC,iCAAAA;MACAC,gBAAAA;MACAC,iBAAAA;MACAC,eAAAA;MACAC,YAAAA;MACGC;;AAIP,MAAMC,UAAU,GAAGT,OAAO,IAAID,QAA9B;AACA,MAAMW,aAAa,gBACfC,aAAA,CAACC,GAAD,oBACQJ;AACJb,IAAAA,EAAE,EAAEA;AACJD,IAAAA,GAAG,EAAEA;qBACUe;AACfP,IAAAA,OAAO,EAAEO,UAAU,GAAGnB,cAAH,GAAoBY;AACvCW,IAAAA,SAAS,EAAE,CACPV,yBADO,EAEPW,MAAM,CAACC,UAFA,EAGPD,MAAM,cAAYlB,OAAZ,CAHC,EAIPkB,MAAM,WAASjB,IAAT,CAJC,EAKPiB,MAAM,WAAShB,IAAT,CALC,EAMPS,IAAI,GAAGO,MAAM,CAACE,UAAV,GAAuB,IANpB,EAOPjB,QAAQ,GAAGe,MAAM,CAACf,QAAV,GAAqB,IAPtB;IANf,EAgBKQ,IAAI,GACAP,OAAO,iBAAIW,aAAA,CAACM,OAAD,MAAA,CAAZ,IAA4BV,IAD3B,gBAGDI,aAAA,SAAA,MAAA,EACKN,SAAS,gBACNM,aAAA,CAACC,GAAD;AAAKM,IAAAA,OAAO,EAAC;AAAOL,IAAAA,SAAS,EAAEC,MAAM,CAACT;;GAAtC,EACKL,OAAO,IAAI,CAACM,OAAZ,gBAAsBK,aAAA,CAACM,OAAD,MAAA,CAAtB,GAAoCZ,SADzC,CADM,GAIN,IALR,EAMKD,QAAQ,gBAAGO,aAAA,OAAA;AAAME,IAAAA,SAAS,EAAEC,MAAM,CAACK;GAAxB,EAAgCf,QAAhC,CAAH,GAAsD,IANnE,EAOKE,OAAO,IAAKN,OAAO,IAAI,CAACK,SAAxB,gBACGM,aAAA,CAACC,GAAD;AAAKM,IAAAA,OAAO,EAAC;AAAOL,IAAAA,SAAS,EAAEC,MAAM,CAACR;;GAAtC,EACKN,OAAO,gBAAGW,aAAA,CAACM,OAAD,MAAA,CAAH,GAAiBX,OAD7B,CADH,GAIG,IAXR,CAnBR,CADJ;;AAsCA,MAAMc,cAAc,GAAGb,IAAI,GAAGN,OAAH,aAAGA,OAAH,cAAGA,OAAH,GAAcO,KAAK,CAAC,YAAD,CAAnB,GAAoCP,OAA/D;AACA,SAAOmB,cAAc,gBACjBT,aAAA,CAACU,OAAD;AAASC,IAAAA,OAAO,EAAEF;GAAlB,EAAmCV,aAAnC,CADiB,GAGjBA,aAHJ;AAKH,CAhE6C;;;;"}

package/es/new-components/base-button/base-button.module.css.js

@@ -1,4 +1,4 @@
-var modules_b9569bce = {"label":"_7b1ce450","baseButton":"f965f9b1","size-small":"f3be2031","size-normal":"d4949176","size-large":"d5280734","disabled":"e68f590f","iconButton":"cf7da434","startIcon":"_670452f3","endIcon":"_9e9147ff","variant-primary":"e862434a","variant-secondary":"feec851f","variant-tertiary":"bf0a371f","variant-quaternary":"_5c9816d1","tone-destructive":"_8eac7f47"};
+var modules_b9569bce = {"label":"_1f20c88a","baseButton":"_623015f3","size-small":"_062de645","size-normal":"_55e2a6a9","size-large":"cab32a7c","disabled":"e71c191a","iconButton":"_368efc16","startIcon":"d35389c1","endIcon":"_900d41d8","variant-primary":"_7c95e162","variant-secondary":"_9cb889aa","variant-tertiary":"_611b5b28","variant-quaternary":"_80c2bb84","tone-destructive":"ee13c455"};
 
 export default modules_b9569bce;
 //# sourceMappingURL=base-button.module.css.js.map

package/es/new-components/box/box.js

@@ -6,7 +6,9 @@ import { getClassNames } from '../responsive-props.js';
 import styles from './box.module.css.js';
 import paddingStyles from './padding.module.css.js';
 import marginStyles from './margin.module.css.js';
+import widthStyles from './width.module.css.js';
 
+var _excluded = ["as", "position", "display", "flexDirection", "flexWrap", "flexGrow", "flexShrink", "alignItems", "justifyContent", "overflow", "width", "height", "background", "border", "borderRadius", "minWidth", "maxWidth", "textAlign", "padding", "paddingY", "paddingX", "paddingTop", "paddingRight", "paddingBottom", "paddingLeft", "margin", "marginY", "marginX", "marginTop", "marginRight", "marginBottom", "marginLeft", "className", "children"];
 var Box = /*#__PURE__*/polymorphicComponent(function Box(_ref, ref) {
   var _ref2, _ref3, _ref4, _ref5, _ref6, _ref7, _ref8, _ref9;
 
@@ -48,7 +50,7 @@ var Box = /*#__PURE__*/polymorphicComponent(function Box(_ref, ref) {
       marginLeft = _ref.marginLeft,
       className = _ref.className,
       children = _ref.children,
-      props = _objectWithoutPropertiesLoose(_ref, ["as", "position", "display", "flexDirection", "flexWrap", "flexGrow", "flexShrink", "alignItems", "justifyContent", "overflow", "width", "height", "background", "border", "borderRadius", "minWidth", "maxWidth", "textAlign", "padding", "paddingY", "paddingX", "paddingTop", "paddingRight", "paddingBottom", "paddingLeft", "margin", "marginY", "marginX", "marginTop", "marginRight", "marginBottom", "marginLeft", "className", "children"]);
+      props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   var resolvedPaddingTop = (_ref2 = paddingTop !== null && paddingTop !== void 0 ? paddingTop : paddingY) !== null && _ref2 !== void 0 ? _ref2 : padding;
   var resolvedPaddingRight = (_ref3 = paddingRight !== null && paddingRight !== void 0 ? paddingRight : paddingX) !== null && _ref3 !== void 0 ? _ref3 : padding;
@@ -60,11 +62,11 @@ var Box = /*#__PURE__*/polymorphicComponent(function Box(_ref, ref) {
   var resolvedMarginLeft = (_ref9 = marginLeft !== null && marginLeft !== void 0 ? marginLeft : marginX) !== null && _ref9 !== void 0 ? _ref9 : margin;
   var omitFlex = !display || typeof display === 'string' && display !== 'flex' && display !== 'inlineFlex';
   return /*#__PURE__*/createElement(component, _objectSpread2(_objectSpread2({}, props), {}, {
-    className: classNames(className, styles.box, display ? getClassNames(styles, 'display', display) : null, position !== 'static' ? getClassNames(styles, 'position', position) : null, minWidth != null ? getClassNames(styles, 'minWidth', String(minWidth)) : null, getClassNames(styles, 'maxWidth', maxWidth), textAlign !== 'start' ? getClassNames(styles, 'textAlign', textAlign) : null, // padding
+    className: classNames(className, styles.box, display ? getClassNames(styles, 'display', display) : null, position !== 'static' ? getClassNames(styles, 'position', position) : null, minWidth != null ? getClassNames(widthStyles, 'minWidth', String(minWidth)) : null, getClassNames(widthStyles, 'maxWidth', maxWidth), textAlign !== 'start' ? getClassNames(styles, 'textAlign', textAlign) : null, // padding
     getClassNames(paddingStyles, 'paddingTop', resolvedPaddingTop), getClassNames(paddingStyles, 'paddingRight', resolvedPaddingRight), getClassNames(paddingStyles, 'paddingBottom', resolvedPaddingBottom), getClassNames(paddingStyles, 'paddingLeft', resolvedPaddingLeft), // margin
     getClassNames(marginStyles, 'marginTop', resolvedMarginTop), getClassNames(marginStyles, 'marginRight', resolvedMarginRight), getClassNames(marginStyles, 'marginBottom', resolvedMarginBottom), getClassNames(marginStyles, 'marginLeft', resolvedMarginLeft), // flex props
     omitFlex ? null : getClassNames(styles, 'flexDirection', flexDirection), omitFlex ? null : getClassNames(styles, 'flexWrap', flexWrap), omitFlex ? null : getClassNames(styles, 'alignItems', alignItems), omitFlex ? null : getClassNames(styles, 'justifyContent', justifyContent), flexShrink != null ? getClassNames(styles, 'flexShrink', String(flexShrink)) : null, flexGrow != null ? getClassNames(styles, 'flexGrow', String(flexGrow)) : null, // other props
-    getClassNames(styles, 'overflow', overflow), getClassNames(styles, 'width', width), getClassNames(styles, 'height', height), getClassNames(styles, 'bg', background), borderRadius !== 'none' ? getClassNames(styles, 'borderRadius', borderRadius) : null, border !== 'none' ? getClassNames(styles, 'border', border) : null) || undefined,
+    getClassNames(styles, 'overflow', overflow), width != null ? getClassNames(widthStyles, 'width', String(width)) : null, getClassNames(styles, 'height', height), getClassNames(styles, 'bg', background), borderRadius !== 'none' ? getClassNames(styles, 'borderRadius', borderRadius) : null, border !== 'none' ? getClassNames(styles, 'border', border) : null) || undefined,
     ref: ref
   }), children);
 });