@doist/reactist 10.0.0-beta.10 → 10.0.0-beta.12

package/lib/components/deprecated-modal/deprecated-modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"deprecated-modal.js","sources":["../../../src/components/deprecated-modal/deprecated-modal.tsx"],"sourcesContent":["import React from 'react'\nimport ReactDOM from 'react-dom'\nimport classnames from 'classnames'\n\nimport CloseIcon from '../icons/CloseIcon.svg'\n\nimport './deprecated-modal.less'\n\ntype Props = {\n    /** Additional css class applied to the Modal.Box. */\n    className?: string\n    /** Sometimes a class name is not enough so you can use this to set the style directly. */\n    style?: React.CSSProperties\n    /** Large style. */\n    large: boolean\n    /** Medium size syle. */\n    medium?: boolean\n    /** Close the Modal when clicking on the overlay. */\n    closeOnOverlayClick: boolean\n}\n\n/** @deprecated */\nclass Box extends React.Component<React.PropsWithChildren<Props>> {\n    public static displayName: string\n    public static defaultProps: Props\n\n    componentDidMount() {\n        window.addEventListener('keydown', this._handleKeyDown)\n    }\n\n    componentWillUnmount() {\n        window.removeEventListener('keydown', this._handleKeyDown)\n    }\n\n    _closeModal = () => {\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n        const modalElement = document.getElementById('modal_box')!\n        ReactDOM.unmountComponentAtNode(modalElement)\n    }\n\n    _handleKeyDown = (event: Partial<KeyboardEvent>) => {\n        if (event.keyCode === 27) {\n            // ESC\n            this._closeModal()\n            if (event.preventDefault) event.preventDefault()\n        }\n    }\n\n    _handleOverlayClick = (event: React.MouseEvent<Element>) => {\n        if (\n            event.target instanceof Element &&\n            (event.target.id === 'reactist-overlay' || event.target.id === 'reactist-overlay-inner')\n        ) {\n            this._closeModal()\n        }\n    }\n\n    render() {\n        const { large, medium, style, children, closeOnOverlayClick } = this.props\n\n        const className = classnames('reactist_modal_box', { large, medium }, this.props.className)\n\n        return (\n            <div\n                className=\"reactist_overlay\"\n                id=\"reactist-overlay\"\n                onClick={closeOnOverlayClick ? this._handleOverlayClick : undefined}\n            >\n                <div className=\"reactist_overlay_inner\" id=\"reactist-overlay-inner\">\n                    <div style={style} className={className}>\n                        {children}\n                    </div>\n                </div>\n            </div>\n        )\n    }\n}\nBox.displayName = 'Modal.Box'\nBox.defaultProps = {\n    large: false,\n    closeOnOverlayClick: false,\n}\n\ntype HeaderProps = {\n    /** Title of the Modal.Header. */\n    title?: string | React.ReactNode\n    /** Subtitle of the Modal.Header. */\n    subtitle?: string | React.ReactNode\n    /** Function that is called right before the Modal unmounts itself. */\n    beforeClose?: () => void\n}\n\n/** @deprecated */\nclass Header extends React.Component<HeaderProps> {\n    public static displayName: string\n    public static defaultProps: HeaderProps\n\n    _closeModal(event: React.MouseEvent) {\n        event.preventDefault()\n        if (typeof this.props.beforeClose === 'function') {\n            this.props.beforeClose()\n        }\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n        const modalElement = document.getElementById('modal_box')!\n        ReactDOM.unmountComponentAtNode(modalElement)\n    }\n\n    render() {\n        return (\n            /* eslint-disable jsx-a11y/anchor-is-valid */\n            <div className=\"reactist_modal_box__header\">\n                <p>\n                    {this.props.title && <span className=\"title\">{this.props.title}</span>}\n                    {this.props.subtitle && <span className=\"subtitle\">{this.props.subtitle}</span>}\n                    {this.props.children}\n                </p>\n                <a className=\"close\" onClick={this._closeModal.bind(this)} href=\"#\">\n                    <CloseIcon />\n                </a>\n            </div>\n            /* eslint-enable jsx-a11y/anchor-is-valid */\n        )\n    }\n}\nHeader.displayName = 'Modal.Header'\n\ntype BodyProps = {\n    /** Display an icon (or basically any component) on the right hand side of the Modal.Body. */\n    icon?: React.ReactNode\n    /** Applies less styles on the body (e.g. no padding) */\n    plain?: boolean\n    /** Sometimes a class name is not enough so you can use this to set the style directly. */\n    style?: React.CSSProperties\n    /** Additionall css class applied to the Modal.Body. */\n    className?: string\n    /**\n     * Render a close icon in the top right corner of the Modal.Body.\n     * Recommended to use when no Modal.Header is used.\n     */\n    showCloseIcon?: boolean\n}\n\n/** @deprecated */\nclass Body extends React.Component<BodyProps> {\n    public static displayName: string\n    public static defaultProps: BodyProps\n\n    _closeModal(event: React.MouseEvent) {\n        event.preventDefault()\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n        const modalElement = document.getElementById('modal_box')!\n        ReactDOM.unmountComponentAtNode(modalElement)\n    }\n\n    render() {\n        const { icon, plain, children, style, showCloseIcon } = this.props\n        const className = classnames('reactist_modal_box__body', { plain }, this.props.className)\n\n        return (\n            /* eslint-disable jsx-a11y/anchor-is-valid */\n            <div className={className} style={style}>\n                {showCloseIcon && (\n                    <a className=\"close\" onClick={this._closeModal.bind(this)} href=\"#\">\n                        <CloseIcon />\n                    </a>\n                )}\n                {icon ? (\n                    <div className=\"dialog\">\n                        <div className=\"reactist_icon\">{icon}</div>\n                        <div className=\"content\">{children}</div>\n                    </div>\n                ) : (\n                    children\n                )}\n            </div>\n            /* eslint-enable jsx-a11y/anchor-is-valid */\n        )\n    }\n}\nBody.displayName = 'Modal.Body'\nBody.defaultProps = {\n    showCloseIcon: false,\n}\n\ntype ActionProps = {\n    /**\n     * Children to render inside the Modal.Actions. They can have an optional `close` property (boolean).\n     * When that is supplied and set to true it will close the modal after the onClick function\n     */\n    children?: React.ReactNode\n}\n\ntype ActionChildrenProps = {\n    close?: boolean\n    onClick?: () => void\n}\n\n/** @deprecated */\nclass Actions extends React.Component<ActionProps> {\n    public static displayName: string\n\n    _onClick(onClick: ActionChildrenProps['onClick']) {\n        if (onClick) {\n            onClick()\n        }\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n        const modalElement = document.getElementById('modal_box')!\n        ReactDOM.unmountComponentAtNode(modalElement)\n    }\n\n    render() {\n        const children = React.Children.map(\n            // see: https://github.com/microsoft/TypeScript/issues/21699\n            // @ts-expect-error Children cannot be typed properly yet in React\n            this.props.children,\n            (child: React.ReactElement<ActionChildrenProps>) => {\n                if (child?.props?.close) {\n                    return React.cloneElement(child, {\n                        onClick: () => this._onClick(child.props.onClick),\n                    })\n                } else {\n                    return child ? React.cloneElement(child) : <></>\n                }\n            },\n        )\n\n        return <div className=\"reactist_modal_box__actions\">{children}</div>\n    }\n}\n\nActions.displayName = 'Modal.Actions'\n\n/** @deprecated */\ntype Modal = {\n    Box: Box\n    Header: Header\n    Body: Body\n    Actions: Actions\n}\n\nexport type { Modal }\n\nexport { Box, Header, Body, Actions }\n"],"names":["Box","modalElement","document","getElementById","ReactDOM","unmountComponentAtNode","event","keyCode","_closeModal","preventDefault","target","Element","id","componentDidMount","window","addEventListener","this","_handleKeyDown","componentWillUnmount","removeEventListener","render","props","style","children","closeOnOverlayClick","className","classnames","large","medium","React","onClick","_handleOverlayClick","undefined","Component","displayName","defaultProps","Header","beforeClose","title","subtitle","bind","href","CloseIcon","Body","icon","showCloseIcon","plain","Actions","_onClick","Children","map","child","_child$props","close","cloneElement","_this2"],"mappings":"yTAsBMA,qFAYY,eAEJC,EAAeC,SAASC,eAAe,aAC7CC,EAASC,uBAAuBJ,qBAGnB,SAACK,GACQ,KAAlBA,EAAMC,YAEDC,cACDF,EAAMG,gBAAgBH,EAAMG,yCAIlB,SAACH,GAEfA,EAAMI,kBAAkBC,UACH,qBAApBL,EAAMI,OAAOE,IAAiD,2BAApBN,EAAMI,OAAOE,OAEnDJ,iEA3BbK,kBAAA,WACIC,OAAOC,iBAAiB,UAAWC,KAAKC,mBAG5CC,qBAAA,WACIJ,OAAOK,oBAAoB,UAAWH,KAAKC,mBA0B/CG,OAAA,iBACoEJ,KAAKK,MAA9CC,IAAAA,MAAOC,IAAAA,SAAUC,IAAAA,oBAElCC,EAAYC,EAAW,qBAAsB,CAAEC,QAF7CA,MAEoDC,SAF7CA,QAEuDZ,KAAKK,MAAMI,kBAG7EI,uBACIJ,UAAU,mBACVb,GAAG,mBACHkB,QAASN,EAAsBR,KAAKe,yBAAsBC,GAE1DH,uBAAKJ,UAAU,yBAAyBb,GAAG,0BACvCiB,uBAAKP,MAAOA,EAAOG,UAAWA,GACzBF,SAhDPM,EAAMI,WAuDxBjC,EAAIkC,YAAc,YAClBlC,EAAImC,aAAe,CACfR,OAAO,EACPH,qBAAqB,OAanBY,gHAIF5B,YAAA,SAAYF,GACRA,EAAMG,iBACgC,mBAA3BO,KAAKK,MAAMgB,kBACbhB,MAAMgB,kBAGTpC,EAAeC,SAASC,eAAe,aAC7CC,EAASC,uBAAuBJ,MAGpCmB,OAAA,kBAGQS,uBAAKJ,UAAU,8BACXI,yBACKb,KAAKK,MAAMiB,OAAST,wBAAMJ,UAAU,SAAST,KAAKK,MAAMiB,OACxDtB,KAAKK,MAAMkB,UAAYV,wBAAMJ,UAAU,YAAYT,KAAKK,MAAMkB,UAC9DvB,KAAKK,MAAME,UAEhBM,qBAAGJ,UAAU,QAAQK,QAASd,KAAKR,YAAYgC,KAAKxB,MAAOyB,KAAK,KAC5DZ,gBAACa,sBAxBAb,EAAMI,WA+B3BG,EAAOF,YAAc,mBAmBfS,gHAIFnC,YAAA,SAAYF,GACRA,EAAMG,qBAEAR,EAAeC,SAASC,eAAe,aAC7CC,EAASC,uBAAuBJ,MAGpCmB,OAAA,iBAC4DJ,KAAKK,MAArDuB,IAAAA,KAAarB,IAAAA,SAAUD,IAAAA,MAAOuB,IAAAA,cAChCpB,EAAYC,EAAW,2BAA4B,CAAEoB,QAD7CA,OACsD9B,KAAKK,MAAMI,kBAI3EI,uBAAKJ,UAAWA,EAAWH,MAAOA,GAC7BuB,GACGhB,qBAAGJ,UAAU,QAAQK,QAASd,KAAKR,YAAYgC,KAAKxB,MAAOyB,KAAK,KAC5DZ,gBAACa,iBAGRE,EACGf,uBAAKJ,UAAU,UACXI,uBAAKJ,UAAU,iBAAiBmB,GAChCf,uBAAKJ,UAAU,WAAWF,IAG9BA,OA7BDM,EAAMI,WAoCzBU,EAAKT,YAAc,aACnBS,EAAKR,aAAe,CAChBU,eAAe,OAiBbE,gHAGFC,SAAA,SAASlB,GACDA,GACAA,QAGE7B,EAAeC,SAASC,eAAe,aAC7CC,EAASC,uBAAuBJ,MAGpCmB,OAAA,sBACUG,EAAWM,EAAMoB,SAASC,SAGvB7B,MAAME,UACX,SAAC4B,gBACOA,MAAAA,aAAAA,EAAO9B,0BAAP+B,EAAcC,OACPxB,EAAMyB,aAAaH,EAAO,CAC7BrB,QAAS,kBAAMyB,EAAKP,SAASG,EAAM9B,MAAMS,YAGtCqB,EAAQtB,EAAMyB,aAAaH,GAAStB,2CAKhDA,uBAAKJ,UAAU,+BAA+BF,OA5BvCM,EAAMI,WAgC5Bc,EAAQb,YAAc"}
+{"version":3,"file":"deprecated-modal.js","sources":["../../../src/components/deprecated-modal/deprecated-modal.tsx"],"sourcesContent":["import React from 'react'\nimport ReactDOM from 'react-dom'\nimport classnames from 'classnames'\n\nimport CloseIcon from '../icons/CloseIcon.svg'\n\nimport './deprecated-modal.less'\n\ntype Props = {\n    /** Additional css class applied to the Modal.Box. */\n    className?: string\n    /** Sometimes a class name is not enough so you can use this to set the style directly. */\n    style?: React.CSSProperties\n    /** Large style. */\n    large: boolean\n    /** Medium size syle. */\n    medium?: boolean\n    /** Close the Modal when clicking on the overlay. */\n    closeOnOverlayClick: boolean\n}\n\n/** @deprecated */\nclass Box extends React.Component<React.PropsWithChildren<Props>> {\n    public static displayName: string\n    public static defaultProps: Props\n\n    componentDidMount() {\n        window.addEventListener('keydown', this._handleKeyDown)\n    }\n\n    componentWillUnmount() {\n        window.removeEventListener('keydown', this._handleKeyDown)\n    }\n\n    _closeModal = () => {\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n        const modalElement = document.getElementById('modal_box')!\n        ReactDOM.unmountComponentAtNode(modalElement)\n    }\n\n    _handleKeyDown = (event: Partial<KeyboardEvent>) => {\n        if (event.keyCode === 27) {\n            // ESC\n            this._closeModal()\n            if (event.preventDefault) event.preventDefault()\n        }\n    }\n\n    _handleOverlayClick = (event: React.MouseEvent<Element>) => {\n        if (\n            event.target instanceof Element &&\n            (event.target.id === 'reactist-overlay' || event.target.id === 'reactist-overlay-inner')\n        ) {\n            this._closeModal()\n        }\n    }\n\n    render() {\n        const { large, medium, style, children, closeOnOverlayClick } = this.props\n\n        const className = classnames('reactist_modal_box', { large, medium }, this.props.className)\n\n        return (\n            <div\n                className=\"reactist_overlay\"\n                id=\"reactist-overlay\"\n                onClick={closeOnOverlayClick ? this._handleOverlayClick : undefined}\n            >\n                <div className=\"reactist_overlay_inner\" id=\"reactist-overlay-inner\">\n                    <div style={style} className={className}>\n                        {children}\n                    </div>\n                </div>\n            </div>\n        )\n    }\n}\nBox.displayName = 'Modal.Box'\nBox.defaultProps = {\n    large: false,\n    closeOnOverlayClick: false,\n}\n\ntype HeaderProps = {\n    /** Title of the Modal.Header. */\n    title?: string | React.ReactNode\n    /** Subtitle of the Modal.Header. */\n    subtitle?: string | React.ReactNode\n    /** Function that is called right before the Modal unmounts itself. */\n    beforeClose?: () => void\n}\n\n/** @deprecated */\nclass Header extends React.Component<HeaderProps> {\n    public static displayName: string\n    public static defaultProps: HeaderProps\n\n    _closeModal(event: React.MouseEvent) {\n        event.preventDefault()\n        if (typeof this.props.beforeClose === 'function') {\n            this.props.beforeClose()\n        }\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n        const modalElement = document.getElementById('modal_box')!\n        ReactDOM.unmountComponentAtNode(modalElement)\n    }\n\n    render() {\n        return (\n            /* eslint-disable jsx-a11y/anchor-is-valid */\n            <div className=\"reactist_modal_box__header\">\n                <p>\n                    {this.props.title && <span className=\"title\">{this.props.title}</span>}\n                    {this.props.subtitle && <span className=\"subtitle\">{this.props.subtitle}</span>}\n                    {this.props.children}\n                </p>\n                <a className=\"close\" onClick={this._closeModal.bind(this)} href=\"#\">\n                    <CloseIcon />\n                </a>\n            </div>\n            /* eslint-enable jsx-a11y/anchor-is-valid */\n        )\n    }\n}\nHeader.displayName = 'Modal.Header'\n\ntype BodyProps = {\n    /** Display an icon (or basically any component) on the right hand side of the Modal.Body. */\n    icon?: React.ReactNode\n    /** Applies less styles on the body (e.g. no padding) */\n    plain?: boolean\n    /** Sometimes a class name is not enough so you can use this to set the style directly. */\n    style?: React.CSSProperties\n    /** Additionall css class applied to the Modal.Body. */\n    className?: string\n    /**\n     * Render a close icon in the top right corner of the Modal.Body.\n     * Recommended to use when no Modal.Header is used.\n     */\n    showCloseIcon?: boolean\n}\n\n/** @deprecated */\nclass Body extends React.Component<BodyProps> {\n    public static displayName: string\n    public static defaultProps: BodyProps\n\n    _closeModal(event: React.MouseEvent) {\n        event.preventDefault()\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n        const modalElement = document.getElementById('modal_box')!\n        ReactDOM.unmountComponentAtNode(modalElement)\n    }\n\n    render() {\n        const { icon, plain, children, style, showCloseIcon } = this.props\n        const className = classnames('reactist_modal_box__body', { plain }, this.props.className)\n\n        return (\n            /* eslint-disable jsx-a11y/anchor-is-valid */\n            <div className={className} style={style}>\n                {showCloseIcon && (\n                    <a className=\"close\" onClick={this._closeModal.bind(this)} href=\"#\">\n                        <CloseIcon />\n                    </a>\n                )}\n                {icon ? (\n                    <div className=\"dialog\">\n                        <div className=\"reactist_icon\">{icon}</div>\n                        <div className=\"content\">{children}</div>\n                    </div>\n                ) : (\n                    children\n                )}\n            </div>\n            /* eslint-enable jsx-a11y/anchor-is-valid */\n        )\n    }\n}\nBody.displayName = 'Modal.Body'\nBody.defaultProps = {\n    showCloseIcon: false,\n}\n\ntype ActionProps = {\n    /**\n     * Children to render inside the Modal.Actions. They can have an optional `close` property (boolean).\n     * When that is supplied and set to true it will close the modal after the onClick function\n     */\n    children?: React.ReactNode\n}\n\ntype ActionChildrenProps = {\n    close?: boolean\n    onClick?: () => void\n}\n\n/** @deprecated */\nclass Actions extends React.Component<ActionProps> {\n    public static displayName: string\n\n    _onClick(onClick: ActionChildrenProps['onClick']) {\n        if (onClick) {\n            onClick()\n        }\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n        const modalElement = document.getElementById('modal_box')!\n        ReactDOM.unmountComponentAtNode(modalElement)\n    }\n\n    render() {\n        const children = React.Children.map(\n            // see: https://github.com/microsoft/TypeScript/issues/21699\n            // @ts-expect-error Children cannot be typed properly yet in React\n            this.props.children,\n            (child: React.ReactElement<ActionChildrenProps>) => {\n                if (child?.props?.close) {\n                    return React.cloneElement(child, {\n                        onClick: () => this._onClick(child.props.onClick),\n                    })\n                } else {\n                    return child ? React.cloneElement(child) : <></>\n                }\n            },\n        )\n\n        return <div className=\"reactist_modal_box__actions\">{children}</div>\n    }\n}\n\nActions.displayName = 'Modal.Actions'\n\n/** @deprecated */\ntype Modal = {\n    Box: Box\n    Header: Header\n    Body: Body\n    Actions: Actions\n}\n\nexport type { Modal }\n\nexport { Box, Header, Body, Actions }\n"],"names":["Box","modalElement","document","getElementById","ReactDOM","unmountComponentAtNode","event","keyCode","_closeModal","preventDefault","target","Element","id","componentDidMount","window","addEventListener","this","_handleKeyDown","componentWillUnmount","removeEventListener","render","props","style","children","closeOnOverlayClick","className","classnames","large","medium","React","onClick","_handleOverlayClick","undefined","Component","displayName","defaultProps","Header","beforeClose","title","subtitle","bind","href","CloseIcon","Body","icon","showCloseIcon","plain","Actions","_onClick","Children","map","child","_child$props","close","cloneElement","_this2"],"mappings":"yTAsBMA,qFAYY,eAEJC,EAAeC,SAASC,eAAe,aAC7CC,EAASC,uBAAuBJ,qBAGnB,SAACK,GACQ,KAAlBA,EAAMC,YAEDC,cACDF,EAAMG,gBAAgBH,EAAMG,yCAIlB,SAACH,GAEfA,EAAMI,kBAAkBC,UACH,qBAApBL,EAAMI,OAAOE,IAAiD,2BAApBN,EAAMI,OAAOE,OAEnDJ,iEA3BbK,kBAAA,WACIC,OAAOC,iBAAiB,UAAWC,KAAKC,mBAG5CC,qBAAA,WACIJ,OAAOK,oBAAoB,UAAWH,KAAKC,mBA0B/CG,OAAA,iBACoEJ,KAAKK,MAA9CC,IAAAA,MAAOC,IAAAA,SAAUC,IAAAA,oBAElCC,EAAYC,EAAW,qBAAsB,CAAEC,QAF7CA,MAEoDC,SAF7CA,QAEuDZ,KAAKK,MAAMI,kBAG7EI,uBACIJ,UAAU,mBACVb,GAAG,mBACHkB,QAASN,EAAsBR,KAAKe,yBAAsBC,GAE1DH,uBAAKJ,UAAU,yBAAyBb,GAAG,0BACvCiB,uBAAKP,MAAOA,EAAOG,UAAWA,GACzBF,SAhDPM,EAAMI,WAuDxBjC,EAAIkC,YAAc,YAClBlC,EAAImC,aAAe,CACfR,OAAO,EACPH,qBAAqB,OAanBY,gHAIF5B,YAAA,SAAYF,GACRA,EAAMG,iBACgC,mBAA3BO,KAAKK,MAAMgB,kBACbhB,MAAMgB,kBAGTpC,EAAeC,SAASC,eAAe,aAC7CC,EAASC,uBAAuBJ,MAGpCmB,OAAA,kBAGQS,uBAAKJ,UAAU,8BACXI,yBACKb,KAAKK,MAAMiB,OAAST,wBAAMJ,UAAU,SAAST,KAAKK,MAAMiB,OACxDtB,KAAKK,MAAMkB,UAAYV,wBAAMJ,UAAU,YAAYT,KAAKK,MAAMkB,UAC9DvB,KAAKK,MAAME,UAEhBM,qBAAGJ,UAAU,QAAQK,QAASd,KAAKR,YAAYgC,KAAKxB,MAAOyB,KAAK,KAC5DZ,gBAACa,sBAxBAb,EAAMI,WA+B3BG,EAAOF,YAAc,mBAmBfS,gHAIFnC,YAAA,SAAYF,GACRA,EAAMG,qBAEAR,EAAeC,SAASC,eAAe,aAC7CC,EAASC,uBAAuBJ,MAGpCmB,OAAA,iBAC4DJ,KAAKK,MAArDuB,IAAAA,KAAarB,IAAAA,SAAUD,IAAAA,MAAOuB,IAAAA,cAChCpB,EAAYC,EAAW,2BAA4B,CAAEoB,QAD7CA,OACsD9B,KAAKK,MAAMI,kBAI3EI,uBAAKJ,UAAWA,EAAWH,MAAOA,GAC7BuB,GACGhB,qBAAGJ,UAAU,QAAQK,QAASd,KAAKR,YAAYgC,KAAKxB,MAAOyB,KAAK,KAC5DZ,gBAACa,iBAGRE,EACGf,uBAAKJ,UAAU,UACXI,uBAAKJ,UAAU,iBAAiBmB,GAChCf,uBAAKJ,UAAU,WAAWF,IAG9BA,OA7BDM,EAAMI,WAoCzBU,EAAKT,YAAc,aACnBS,EAAKR,aAAe,CAChBU,eAAe,OAiBbE,gHAGFC,SAAA,SAASlB,GACDA,GACAA,QAGE7B,EAAeC,SAASC,eAAe,aAC7CC,EAASC,uBAAuBJ,MAGpCmB,OAAA,sBACUG,EAAWM,EAAMoB,SAASC,SAGvB7B,MAAME,UACX,SAAC4B,gBACOA,MAAAA,aAAAA,EAAO9B,oBAAP+B,EAAcC,MACPxB,EAAMyB,aAAaH,EAAO,CAC7BrB,QAAS,kBAAMyB,EAAKP,SAASG,EAAM9B,MAAMS,YAGtCqB,EAAQtB,EAAMyB,aAAaH,GAAStB,2CAKhDA,uBAAKJ,UAAU,+BAA+BF,OA5BvCM,EAAMI,WAgC5Bc,EAAQb,YAAc"}

package/lib/components/dropdown/dropdown.js

@@ -1,2 +1,2 @@
-"use strict";function t(t){return t&&"object"==typeof t&&"default"in t?t.default:t}Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_rollupPluginBabelHelpers.js"),o=t(require("react")),i=t(require("classnames")),n=t(require("react-dom")),r=require("../deprecated-button/index.js"),s=function(t){function r(o,i){var r;return(r=t.call(this,o,i)||this)._handleClickOutside=function(t){var o=n.findDOMNode(e.assertThisInitialized(r));o&&!o.contains(t.target)?r._toggleShowBody():r.props.allowBodyInteractions||(r._timeout=setTimeout((function(){r.state.showBody&&r._toggleShowBody()}),100))},r._toggleShowBody=function(){r.state.showBody?(r.props.onHideBody&&r.props.onHideBody(),document.removeEventListener("click",r._handleClickOutside,!0)):(r.props.onShowBody&&r.props.onShowBody(),document.addEventListener("click",r._handleClickOutside,!0)),r.setState({showBody:!r.state.showBody})},r._setPosition=function(t){if(t){var o=document.getElementById(r.props.scrolling_parent?r.props.scrolling_parent:"");if(o){var i=n.findDOMNode(e.assertThisInitialized(r));if(!i)return;var s=n.findDOMNode(e.assertThisInitialized(r)).offsetTop,l=i.querySelector(".trigger");if(!l)return;var a=o.clientHeight+o.scrollTop-s-l.clientHeight<t.clientHeight;a!==r.state.top&&r.setState({top:a})}}},r.state={showBody:!1,top:o.top||!1},r._timeout=void 0,r}e.inheritsLoose(r,t);var s=r.prototype;return s.componentWillUnmount=function(){document.removeEventListener("click",this._handleClickOutside,!0),this._timeout&&clearTimeout(this._timeout)},s._getTriggerComponent=function(){var t,e=null===(t=this.props.children)||void 0===t?void 0:t[0];return e?o.cloneElement(e,{onClick:this._toggleShowBody}):void 0},s._getBodyComponent=function(){if(!this.state.showBody)return null;var t=this.state.top,e=this.props,n=e.right,r=e.children,s={top:t,right:void 0!==n&&n,setPosition:this._setPosition},l=i({body_wrapper:!0,with_arrow:!0,top:t,bottom:!t}),a=null==r?void 0:r[1],d="function"==typeof a?a(s):a?o.cloneElement(a,s):void 0;return o.createElement("div",{className:l,style:{position:"relative"}},d)},s.render=function(){var t=i("reactist_dropdown",this.props.className),e=this.state.top;return o.createElement("div",{style:{display:"inline-block"},className:t},e&&this._getBodyComponent(),this._getTriggerComponent(),!e&&this._getBodyComponent())},r}(o.Component);s.displayName="Dropdown.Box";var l=o.forwardRef((function(t,n){var s=t.children,l=t.onClick,a=t.tooltip,d=t.className,c=e.objectWithoutPropertiesLoose(t,["children","onClick","tooltip","className"]);return o.createElement(r.default,Object.assign({},c,{className:i("trigger",d),onClick:function(t){t.preventDefault(),t.stopPropagation(),l&&l(t)},tooltip:a,ref:n}),s)}));function a(t){var e=t.right,i=t.children,n=t.setPosition,r={position:"absolute",right:0,top:0};return t.top&&(r.top="auto",r.bottom=0),e&&(r.right="auto",r.left=0),o.createElement("div",{ref:n,style:r,className:"body",id:"reactist-dropdown-body"},i)}l.displayName="Dropdown.Trigger",a.displayName="Dropdown.Body",exports.Dropdown={Box:s,Trigger:l,Body:a};
+"use strict";function t(t){return t&&"object"==typeof t&&"default"in t?t.default:t}Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_rollupPluginBabelHelpers.js"),o=t(require("react")),i=t(require("classnames")),n=t(require("react-dom")),r=require("../deprecated-button/index.js"),s=["children","onClick","tooltip","className"],l=function(t){function r(o,i){var r;return(r=t.call(this,o,i)||this)._handleClickOutside=function(t){var o=n.findDOMNode(e.assertThisInitialized(r));o&&!o.contains(t.target)?r._toggleShowBody():r.props.allowBodyInteractions||(r._timeout=setTimeout((function(){r.state.showBody&&r._toggleShowBody()}),100))},r._toggleShowBody=function(){r.state.showBody?(r.props.onHideBody&&r.props.onHideBody(),document.removeEventListener("click",r._handleClickOutside,!0)):(r.props.onShowBody&&r.props.onShowBody(),document.addEventListener("click",r._handleClickOutside,!0)),r.setState({showBody:!r.state.showBody})},r._setPosition=function(t){if(t){var o=document.getElementById(r.props.scrolling_parent?r.props.scrolling_parent:"");if(o){var i=n.findDOMNode(e.assertThisInitialized(r));if(!i)return;var s=n.findDOMNode(e.assertThisInitialized(r)).offsetTop,l=i.querySelector(".trigger");if(!l)return;var a=o.clientHeight+o.scrollTop-s-l.clientHeight<t.clientHeight;a!==r.state.top&&r.setState({top:a})}}},r.state={showBody:!1,top:o.top||!1},r._timeout=void 0,r}e.inheritsLoose(r,t);var s=r.prototype;return s.componentWillUnmount=function(){document.removeEventListener("click",this._handleClickOutside,!0),this._timeout&&clearTimeout(this._timeout)},s._getTriggerComponent=function(){var t,e=null===(t=this.props.children)||void 0===t?void 0:t[0];return e?o.cloneElement(e,{onClick:this._toggleShowBody}):void 0},s._getBodyComponent=function(){if(!this.state.showBody)return null;var t=this.state.top,e=this.props,n=e.right,r=e.children,s={top:t,right:void 0!==n&&n,setPosition:this._setPosition},l=i({body_wrapper:!0,with_arrow:!0,top:t,bottom:!t}),a=null==r?void 0:r[1],d="function"==typeof a?a(s):a?o.cloneElement(a,s):void 0;return o.createElement("div",{className:l,style:{position:"relative"}},d)},s.render=function(){var t=i("reactist_dropdown",this.props.className),e=this.state.top;return o.createElement("div",{style:{display:"inline-block"},className:t},e&&this._getBodyComponent(),this._getTriggerComponent(),!e&&this._getBodyComponent())},r}(o.Component);l.displayName="Dropdown.Box";var a=o.forwardRef((function(t,n){var l=t.children,a=t.onClick,d=t.tooltip,c=t.className,p=e.objectWithoutPropertiesLoose(t,s);return o.createElement(r.default,Object.assign({},p,{className:i("trigger",c),onClick:function(t){t.preventDefault(),t.stopPropagation(),a&&a(t)},tooltip:d,ref:n}),l)}));function d(t){var e=t.right,i=t.children,n=t.setPosition,r={position:"absolute",right:0,top:0};return t.top&&(r.top="auto",r.bottom=0),e&&(r.right="auto",r.left=0),o.createElement("div",{ref:n,style:r,className:"body",id:"reactist-dropdown-body"},i)}a.displayName="Dropdown.Trigger",d.displayName="Dropdown.Body",exports.Dropdown={Box:l,Trigger:a,Body:d};
 //# sourceMappingURL=dropdown.js.map

package/lib/components/dropdown/dropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown.js","sources":["../../../src/components/dropdown/dropdown.tsx"],"sourcesContent":["import React from 'react'\nimport ReactDOM from 'react-dom'\nimport classNames from 'classnames'\n\nimport Button from '../deprecated-button'\n\nimport './dropdown.less'\n\ntype BoxProps = {\n    onShowBody?: () => void\n    onHideBody?: () => void\n    allowBodyInteractions?: boolean\n    top?: boolean\n    right?: boolean\n    scrolling_parent?: string\n    children?: [\n        React.ReactElement<TriggerProps>,\n        React.ReactElement<BodyProps> | ((props: BodyProps) => JSX.Element),\n    ]\n    className?: string\n}\n\ntype BoxState = {\n    top: boolean\n    showBody: boolean\n}\n\nclass Box extends React.Component<React.PropsWithChildren<BoxProps>, BoxState> {\n    public static displayName: string\n\n    constructor(props: BoxProps, context: React.Context<unknown>) {\n        super(props, context)\n        this.state = {\n            showBody: false,\n            top: props.top || false,\n        }\n\n        this._timeout = undefined\n    }\n\n    componentWillUnmount() {\n        document.removeEventListener('click', this._handleClickOutside, true)\n        if (this._timeout) {\n            clearTimeout(this._timeout)\n        }\n    }\n    _timeout?: ReturnType<typeof setTimeout>\n\n    _handleClickOutside = (event: MouseEvent) => {\n        const dropdownDOMNode = ReactDOM.findDOMNode(this)\n\n        if (dropdownDOMNode && !dropdownDOMNode.contains(event.target as Node))\n            this._toggleShowBody()\n        else if (!this.props.allowBodyInteractions) {\n            // won't close when body interactions are allowed\n            this._timeout = setTimeout(() => {\n                if (this.state.showBody) {\n                    this._toggleShowBody()\n                }\n            }, 100)\n        }\n    }\n\n    _toggleShowBody = () => {\n        if (!this.state.showBody) {\n            // will show\n            if (this.props.onShowBody) this.props.onShowBody()\n            document.addEventListener('click', this._handleClickOutside, true)\n        } else {\n            // will hide\n            if (this.props.onHideBody) this.props.onHideBody()\n            document.removeEventListener('click', this._handleClickOutside, true)\n        }\n\n        this.setState({\n            showBody: !this.state.showBody,\n        })\n    }\n\n    _getTriggerComponent() {\n        const _trigger = this.props.children?.[0]\n        return _trigger\n            ? React.cloneElement(_trigger, { onClick: this._toggleShowBody })\n            : undefined\n    }\n\n    // https://facebook.github.io/react/docs/refs-and-the-dom.html#exposing-dom-refs-to-parent-components\n    _setPosition = (body: HTMLElement | null) => {\n        if (body) {\n            const scrollingParent = document.getElementById(\n                this.props.scrolling_parent ? this.props.scrolling_parent : '',\n            )\n\n            if (scrollingParent) {\n                const dropdown = ReactDOM.findDOMNode(this)\n                if (!dropdown) {\n                    return\n                }\n                const dropdownVerticalPosition = (ReactDOM.findDOMNode(this) as HTMLElement)\n                    .offsetTop\n                const dropdownTrigger = (dropdown as Element).querySelector('.trigger')\n                if (!dropdownTrigger) {\n                    return\n                }\n                const dropdownTriggerHeight = dropdownTrigger.clientHeight\n                const dropdownBodyHeight = body.clientHeight\n\n                const scrollingParentHeight = scrollingParent.clientHeight\n                const scrollingParentOffset = scrollingParent.scrollTop\n\n                const bottomOffset =\n                    scrollingParentHeight +\n                    scrollingParentOffset -\n                    dropdownVerticalPosition -\n                    dropdownTriggerHeight\n\n                const top = bottomOffset < dropdownBodyHeight\n\n                if (top !== this.state.top) {\n                    this.setState({ top })\n                }\n            }\n        }\n    }\n\n    _getBodyComponent() {\n        if (!this.state.showBody) {\n            return null\n        }\n        const { top } = this.state\n        const { right = false, children } = this.props\n        const props = { top, right, setPosition: this._setPosition }\n\n        const className = classNames({\n            body_wrapper: true,\n            with_arrow: true,\n            top: top,\n            bottom: !top,\n        })\n\n        const body = children?.[1]\n\n        const contentMarkup =\n            typeof body === 'function'\n                ? body(props)\n                : body\n                ? React.cloneElement(body, props)\n                : undefined\n        return (\n            <div className={className} style={{ position: 'relative' }}>\n                {contentMarkup}\n            </div>\n        )\n    }\n\n    render() {\n        const className = classNames('reactist_dropdown', this.props.className)\n        const { top } = this.state\n\n        return (\n            <div style={{ display: 'inline-block' }} className={className}>\n                {top && this._getBodyComponent()}\n                {this._getTriggerComponent()}\n                {!top && this._getBodyComponent()}\n            </div>\n        )\n    }\n}\n\nBox.displayName = 'Dropdown.Box'\n\ntype NativeButtonProps = React.DetailedHTMLProps<\n    React.ButtonHTMLAttributes<HTMLButtonElement>,\n    HTMLButtonElement\n>\n\ntype TriggerProps = Omit<NativeButtonProps, 'title'> & {\n    tooltip?: React.ReactNode\n}\n\nconst Trigger = React.forwardRef<HTMLButtonElement, TriggerProps>(function Trigger(\n    { children, onClick, tooltip, className, ...props },\n    ref,\n) {\n    function handleClick(event: React.MouseEvent<HTMLButtonElement, MouseEvent>) {\n        event.preventDefault()\n        event.stopPropagation()\n        if (onClick) onClick(event)\n    }\n\n    return (\n        <Button\n            {...props}\n            className={classNames('trigger', className)}\n            onClick={handleClick}\n            tooltip={tooltip}\n            ref={ref}\n        >\n            {children}\n        </Button>\n    )\n})\n\nTrigger.displayName = 'Dropdown.Trigger'\n\ntype BodyProps = {\n    setPosition?: React.Ref<HTMLDivElement>\n    children?: React.ReactNode\n    top?: boolean\n    right?: boolean\n}\n\nfunction Body({ top, right, children, setPosition }: BodyProps) {\n    const style: React.CSSProperties = { position: 'absolute', right: 0, top: 0 }\n\n    if (top) {\n        style.top = 'auto'\n        style.bottom = 0\n    }\n\n    if (right) {\n        style.right = 'auto'\n        style.left = 0\n    }\n\n    return (\n        <div ref={setPosition} style={style} className=\"body\" id=\"reactist-dropdown-body\">\n            {children}\n        </div>\n    )\n}\n\nBody.displayName = 'Dropdown.Body'\n\nconst Dropdown = {\n    Box,\n    Trigger,\n    Body,\n}\n\nexport { Dropdown }\n"],"names":["Box","props","context","event","dropdownDOMNode","ReactDOM","findDOMNode","contains","target","_this","_toggleShowBody","allowBodyInteractions","_timeout","setTimeout","state","showBody","onHideBody","document","removeEventListener","_handleClickOutside","onShowBody","addEventListener","setState","body","scrollingParent","getElementById","scrolling_parent","dropdown","dropdownVerticalPosition","offsetTop","dropdownTrigger","querySelector","top","clientHeight","scrollTop","undefined","componentWillUnmount","this","clearTimeout","_getTriggerComponent","_trigger","children","_this$props$children","React","cloneElement","onClick","_getBodyComponent","right","setPosition","_setPosition","className","classNames","body_wrapper","with_arrow","bottom","contentMarkup","style","position","render","display","Component","displayName","Trigger","forwardRef","ref","tooltip","Button","preventDefault","stopPropagation","Body","left","id"],"mappings":"6TA2BMA,yBAGUC,EAAiBC,8BACnBD,EAAOC,8BAiBK,SAACC,OACbC,EAAkBC,EAASC,wCAE7BF,IAAoBA,EAAgBG,SAASJ,EAAMK,QACnDC,EAAKC,kBACCD,EAAKR,MAAMU,0BAEZC,SAAWC,YAAW,WACnBJ,EAAKK,MAAMC,YACNL,oBAEV,yBAIO,WACTD,EAAKK,MAAMC,UAMRN,EAAKR,MAAMe,YAAYP,EAAKR,MAAMe,aACtCC,SAASC,oBAAoB,QAAST,EAAKU,qBAAqB,KAL5DV,EAAKR,MAAMmB,YAAYX,EAAKR,MAAMmB,aACtCH,SAASI,iBAAiB,QAASZ,EAAKU,qBAAqB,MAO5DG,SAAS,CACVP,UAAWN,EAAKK,MAAMC,2BAYf,SAACQ,MACRA,EAAM,KACAC,EAAkBP,SAASQ,eAC7BhB,EAAKR,MAAMyB,iBAAmBjB,EAAKR,MAAMyB,iBAAmB,OAG5DF,EAAiB,KACXG,EAAWtB,EAASC,4CACrBqB,aAGCC,EAA4BvB,EAASC,wCACtCuB,UACCC,EAAmBH,EAAqBI,cAAc,gBACvDD,aAeCE,EATwBR,EAAgBS,aAChBT,EAAgBU,UAK1CN,EAT0BE,EAAgBG,aACnBV,EAAKU,aAa5BD,IAAQvB,EAAKK,MAAMkB,OACdV,SAAS,CAAEU,IAAAA,SAvFvBlB,MAAQ,CACTC,UAAU,EACViB,IAAK/B,EAAM+B,MAAO,KAGjBpB,cAAWuB,oDAGpBC,qBAAA,WACInB,SAASC,oBAAoB,QAASmB,KAAKlB,qBAAqB,GAC5DkB,KAAKzB,UACL0B,aAAaD,KAAKzB,aAoC1B2B,qBAAA,iBACUC,YAAWH,KAAKpC,MAAMwC,6BAAXC,EAAsB,UAChCF,EACDG,EAAMC,aAAaJ,EAAU,CAAEK,QAASR,KAAK3B,uBAC7CyB,KA0CVW,kBAAA,eACST,KAAKvB,MAAMC,gBACL,SAEHiB,EAAQK,KAAKvB,MAAbkB,MAC4BK,KAAKpC,UAAjC8C,MAAeN,IAAAA,SACjBxC,EAAQ,CAAE+B,IAAAA,EAAKe,oBAAOC,YAAaX,KAAKY,cAExCC,EAAYC,EAAW,CACzBC,cAAc,EACdC,YAAY,EACZrB,IAAKA,EACLsB,QAAStB,IAGPT,EAAOkB,MAAAA,SAAAA,EAAW,GAElBc,EACc,mBAAThC,EACDA,EAAKtB,GACLsB,EACAoB,EAAMC,aAAarB,EAAMtB,QACzBkC,SAENQ,uBAAKO,UAAWA,EAAWM,MAAO,CAAEC,SAAU,aACzCF,MAKbG,OAAA,eACUR,EAAYC,EAAW,oBAAqBd,KAAKpC,MAAMiD,WACrDlB,EAAQK,KAAKvB,MAAbkB,WAGJW,uBAAKa,MAAO,CAAEG,QAAS,gBAAkBT,UAAWA,GAC/ClB,GAAOK,KAAKS,oBACZT,KAAKE,wBACJP,GAAOK,KAAKS,yBAxIZH,EAAMiB,WA8IxB5D,EAAI6D,YAAc,eAWlB,IAAMC,EAAUnB,EAAMoB,YAA4C,WAE9DC,OADEvB,IAAAA,SAAUI,IAAAA,QAASoB,IAAAA,QAASf,IAAAA,UAAcjD,wFAUxC0C,gBAACuB,2BACOjE,GACJiD,UAAWC,EAAW,UAAWD,GACjCL,iBAVa1C,GACjBA,EAAMgE,iBACNhE,EAAMiE,kBACFvB,GAASA,EAAQ1C,IAQjB8D,QAASA,EACTD,IAAKA,IAEJvB,MAcb,SAAS4B,SAAYtB,IAAAA,MAAON,IAAAA,SAAUO,IAAAA,YAC5BQ,EAA6B,CAAEC,SAAU,WAAYV,MAAO,EAAGf,IAAK,YAD9DA,MAIRwB,EAAMxB,IAAM,OACZwB,EAAMF,OAAS,GAGfP,IACAS,EAAMT,MAAQ,OACdS,EAAMc,KAAO,GAIb3B,uBAAKqB,IAAKhB,EAAaQ,MAAOA,EAAON,UAAU,OAAOqB,GAAG,0BACpD9B,GAxBbqB,EAAQD,YAAc,mBA6BtBQ,EAAKR,YAAc,iCAEF,CACb7D,IAAAA,EACA8D,QAAAA,EACAO,KAAAA"}
+{"version":3,"file":"dropdown.js","sources":["../../../src/components/dropdown/dropdown.tsx"],"sourcesContent":["import React from 'react'\nimport ReactDOM from 'react-dom'\nimport classNames from 'classnames'\n\nimport Button from '../deprecated-button'\n\nimport './dropdown.less'\n\ntype BoxProps = {\n    onShowBody?: () => void\n    onHideBody?: () => void\n    allowBodyInteractions?: boolean\n    top?: boolean\n    right?: boolean\n    scrolling_parent?: string\n    children?: [\n        React.ReactElement<TriggerProps>,\n        React.ReactElement<BodyProps> | ((props: BodyProps) => JSX.Element),\n    ]\n    className?: string\n}\n\ntype BoxState = {\n    top: boolean\n    showBody: boolean\n}\n\nclass Box extends React.Component<React.PropsWithChildren<BoxProps>, BoxState> {\n    public static displayName: string\n\n    constructor(props: BoxProps, context: React.Context<unknown>) {\n        super(props, context)\n        this.state = {\n            showBody: false,\n            top: props.top || false,\n        }\n\n        this._timeout = undefined\n    }\n\n    componentWillUnmount() {\n        document.removeEventListener('click', this._handleClickOutside, true)\n        if (this._timeout) {\n            clearTimeout(this._timeout)\n        }\n    }\n    _timeout?: ReturnType<typeof setTimeout>\n\n    _handleClickOutside = (event: MouseEvent) => {\n        const dropdownDOMNode = ReactDOM.findDOMNode(this)\n\n        if (dropdownDOMNode && !dropdownDOMNode.contains(event.target as Node))\n            this._toggleShowBody()\n        else if (!this.props.allowBodyInteractions) {\n            // won't close when body interactions are allowed\n            this._timeout = setTimeout(() => {\n                if (this.state.showBody) {\n                    this._toggleShowBody()\n                }\n            }, 100)\n        }\n    }\n\n    _toggleShowBody = () => {\n        if (!this.state.showBody) {\n            // will show\n            if (this.props.onShowBody) this.props.onShowBody()\n            document.addEventListener('click', this._handleClickOutside, true)\n        } else {\n            // will hide\n            if (this.props.onHideBody) this.props.onHideBody()\n            document.removeEventListener('click', this._handleClickOutside, true)\n        }\n\n        this.setState({\n            showBody: !this.state.showBody,\n        })\n    }\n\n    _getTriggerComponent() {\n        const _trigger = this.props.children?.[0]\n        return _trigger\n            ? React.cloneElement(_trigger, { onClick: this._toggleShowBody })\n            : undefined\n    }\n\n    // https://facebook.github.io/react/docs/refs-and-the-dom.html#exposing-dom-refs-to-parent-components\n    _setPosition = (body: HTMLElement | null) => {\n        if (body) {\n            const scrollingParent = document.getElementById(\n                this.props.scrolling_parent ? this.props.scrolling_parent : '',\n            )\n\n            if (scrollingParent) {\n                const dropdown = ReactDOM.findDOMNode(this)\n                if (!dropdown) {\n                    return\n                }\n                const dropdownVerticalPosition = (ReactDOM.findDOMNode(this) as HTMLElement)\n                    .offsetTop\n                const dropdownTrigger = (dropdown as Element).querySelector('.trigger')\n                if (!dropdownTrigger) {\n                    return\n                }\n                const dropdownTriggerHeight = dropdownTrigger.clientHeight\n                const dropdownBodyHeight = body.clientHeight\n\n                const scrollingParentHeight = scrollingParent.clientHeight\n                const scrollingParentOffset = scrollingParent.scrollTop\n\n                const bottomOffset =\n                    scrollingParentHeight +\n                    scrollingParentOffset -\n                    dropdownVerticalPosition -\n                    dropdownTriggerHeight\n\n                const top = bottomOffset < dropdownBodyHeight\n\n                if (top !== this.state.top) {\n                    this.setState({ top })\n                }\n            }\n        }\n    }\n\n    _getBodyComponent() {\n        if (!this.state.showBody) {\n            return null\n        }\n        const { top } = this.state\n        const { right = false, children } = this.props\n        const props = { top, right, setPosition: this._setPosition }\n\n        const className = classNames({\n            body_wrapper: true,\n            with_arrow: true,\n            top: top,\n            bottom: !top,\n        })\n\n        const body = children?.[1]\n\n        const contentMarkup =\n            typeof body === 'function'\n                ? body(props)\n                : body\n                ? React.cloneElement(body, props)\n                : undefined\n        return (\n            <div className={className} style={{ position: 'relative' }}>\n                {contentMarkup}\n            </div>\n        )\n    }\n\n    render() {\n        const className = classNames('reactist_dropdown', this.props.className)\n        const { top } = this.state\n\n        return (\n            <div style={{ display: 'inline-block' }} className={className}>\n                {top && this._getBodyComponent()}\n                {this._getTriggerComponent()}\n                {!top && this._getBodyComponent()}\n            </div>\n        )\n    }\n}\n\nBox.displayName = 'Dropdown.Box'\n\ntype NativeButtonProps = React.DetailedHTMLProps<\n    React.ButtonHTMLAttributes<HTMLButtonElement>,\n    HTMLButtonElement\n>\n\ntype TriggerProps = Omit<NativeButtonProps, 'title'> & {\n    tooltip?: React.ReactNode\n}\n\nconst Trigger = React.forwardRef<HTMLButtonElement, TriggerProps>(function Trigger(\n    { children, onClick, tooltip, className, ...props },\n    ref,\n) {\n    function handleClick(event: React.MouseEvent<HTMLButtonElement, MouseEvent>) {\n        event.preventDefault()\n        event.stopPropagation()\n        if (onClick) onClick(event)\n    }\n\n    return (\n        <Button\n            {...props}\n            className={classNames('trigger', className)}\n            onClick={handleClick}\n            tooltip={tooltip}\n            ref={ref}\n        >\n            {children}\n        </Button>\n    )\n})\n\nTrigger.displayName = 'Dropdown.Trigger'\n\ntype BodyProps = {\n    setPosition?: React.Ref<HTMLDivElement>\n    children?: React.ReactNode\n    top?: boolean\n    right?: boolean\n}\n\nfunction Body({ top, right, children, setPosition }: BodyProps) {\n    const style: React.CSSProperties = { position: 'absolute', right: 0, top: 0 }\n\n    if (top) {\n        style.top = 'auto'\n        style.bottom = 0\n    }\n\n    if (right) {\n        style.right = 'auto'\n        style.left = 0\n    }\n\n    return (\n        <div ref={setPosition} style={style} className=\"body\" id=\"reactist-dropdown-body\">\n            {children}\n        </div>\n    )\n}\n\nBody.displayName = 'Dropdown.Body'\n\nconst Dropdown = {\n    Box,\n    Trigger,\n    Body,\n}\n\nexport { Dropdown }\n"],"names":["Box","props","context","event","dropdownDOMNode","ReactDOM","findDOMNode","contains","target","_this","_toggleShowBody","allowBodyInteractions","_timeout","setTimeout","state","showBody","onHideBody","document","removeEventListener","_handleClickOutside","onShowBody","addEventListener","setState","body","scrollingParent","getElementById","scrolling_parent","dropdown","dropdownVerticalPosition","offsetTop","dropdownTrigger","querySelector","top","clientHeight","scrollTop","undefined","componentWillUnmount","this","clearTimeout","_getTriggerComponent","_trigger","children","_this$props$children","React","cloneElement","onClick","_getBodyComponent","right","setPosition","_setPosition","className","classNames","body_wrapper","with_arrow","bottom","contentMarkup","style","position","render","display","Component","displayName","Trigger","forwardRef","ref","tooltip","Button","preventDefault","stopPropagation","Body","left","id"],"mappings":"4WA2BMA,yBAGUC,EAAiBC,8BACnBD,EAAOC,8BAiBK,SAACC,OACbC,EAAkBC,EAASC,wCAE7BF,IAAoBA,EAAgBG,SAASJ,EAAMK,QACnDC,EAAKC,kBACCD,EAAKR,MAAMU,0BAEZC,SAAWC,YAAW,WACnBJ,EAAKK,MAAMC,YACNL,oBAEV,yBAIO,WACTD,EAAKK,MAAMC,UAMRN,EAAKR,MAAMe,YAAYP,EAAKR,MAAMe,aACtCC,SAASC,oBAAoB,QAAST,EAAKU,qBAAqB,KAL5DV,EAAKR,MAAMmB,YAAYX,EAAKR,MAAMmB,aACtCH,SAASI,iBAAiB,QAASZ,EAAKU,qBAAqB,MAO5DG,SAAS,CACVP,UAAWN,EAAKK,MAAMC,2BAYf,SAACQ,MACRA,EAAM,KACAC,EAAkBP,SAASQ,eAC7BhB,EAAKR,MAAMyB,iBAAmBjB,EAAKR,MAAMyB,iBAAmB,OAG5DF,EAAiB,KACXG,EAAWtB,EAASC,4CACrBqB,aAGCC,EAA4BvB,EAASC,wCACtCuB,UACCC,EAAmBH,EAAqBI,cAAc,gBACvDD,aAeCE,EATwBR,EAAgBS,aAChBT,EAAgBU,UAK1CN,EAT0BE,EAAgBG,aACnBV,EAAKU,aAa5BD,IAAQvB,EAAKK,MAAMkB,OACdV,SAAS,CAAEU,IAAAA,SAvFvBlB,MAAQ,CACTC,UAAU,EACViB,IAAK/B,EAAM+B,MAAO,KAGjBpB,cAAWuB,oDAGpBC,qBAAA,WACInB,SAASC,oBAAoB,QAASmB,KAAKlB,qBAAqB,GAC5DkB,KAAKzB,UACL0B,aAAaD,KAAKzB,aAoC1B2B,qBAAA,iBACUC,YAAWH,KAAKpC,MAAMwC,6BAAXC,EAAsB,UAChCF,EACDG,EAAMC,aAAaJ,EAAU,CAAEK,QAASR,KAAK3B,uBAC7CyB,KA0CVW,kBAAA,eACST,KAAKvB,MAAMC,gBACL,SAEHiB,EAAQK,KAAKvB,MAAbkB,MAC4BK,KAAKpC,UAAjC8C,MAAeN,IAAAA,SACjBxC,EAAQ,CAAE+B,IAAAA,EAAKe,oBAAOC,YAAaX,KAAKY,cAExCC,EAAYC,EAAW,CACzBC,cAAc,EACdC,YAAY,EACZrB,IAAKA,EACLsB,QAAStB,IAGPT,EAAOkB,MAAAA,SAAAA,EAAW,GAElBc,EACc,mBAAThC,EACDA,EAAKtB,GACLsB,EACAoB,EAAMC,aAAarB,EAAMtB,QACzBkC,SAENQ,uBAAKO,UAAWA,EAAWM,MAAO,CAAEC,SAAU,aACzCF,MAKbG,OAAA,eACUR,EAAYC,EAAW,oBAAqBd,KAAKpC,MAAMiD,WACrDlB,EAAQK,KAAKvB,MAAbkB,WAGJW,uBAAKa,MAAO,CAAEG,QAAS,gBAAkBT,UAAWA,GAC/ClB,GAAOK,KAAKS,oBACZT,KAAKE,wBACJP,GAAOK,KAAKS,yBAxIZH,EAAMiB,WA8IxB5D,EAAI6D,YAAc,eAWlB,IAAMC,EAAUnB,EAAMoB,YAA4C,WAE9DC,OADEvB,IAAAA,SAAUI,IAAAA,QAASoB,IAAAA,QAASf,IAAAA,UAAcjD,6CAUxC0C,gBAACuB,2BACOjE,GACJiD,UAAWC,EAAW,UAAWD,GACjCL,iBAVa1C,GACjBA,EAAMgE,iBACNhE,EAAMiE,kBACFvB,GAASA,EAAQ1C,IAQjB8D,QAASA,EACTD,IAAKA,IAEJvB,MAcb,SAAS4B,SAAYtB,IAAAA,MAAON,IAAAA,SAAUO,IAAAA,YAC5BQ,EAA6B,CAAEC,SAAU,WAAYV,MAAO,EAAGf,IAAK,YAD9DA,MAIRwB,EAAMxB,IAAM,OACZwB,EAAMF,OAAS,GAGfP,IACAS,EAAMT,MAAQ,OACdS,EAAMc,KAAO,GAIb3B,uBAAKqB,IAAKhB,EAAaQ,MAAOA,EAAON,UAAU,OAAOqB,GAAG,0BACpD9B,GAxBbqB,EAAQD,YAAc,mBA6BtBQ,EAAKR,YAAc,iCAEF,CACb7D,IAAAA,EACA8D,QAAAA,EACAO,KAAAA"}

package/lib/components/error-message/error-message.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("../../_virtual/_rollupPluginBabelHelpers.js"),i=(e=require("react"))&&"object"==typeof e&&"default"in e?e.default:e,s=function(e){function s(t,i){var s;(s=e.call(this,t,i)||this)._clearTimeout=function(){s.timeout&&clearTimeout(s.timeout)},s._triggerDelayedHide=function(){s._clearTimeout(),s.timeout=setTimeout(s._hide,s.props.timeout)},s._hide=function(){var e,t;s._clearTimeout(),s.setState((function(){return{visible:!1}})),null===(e=(t=s.props).onHide)||void 0===e||e.call(t)};var r=s._isValidMessage(t.message);return r&&s._triggerDelayedHide(),s.state={visible:r},s}t.inheritsLoose(s,e);var r=s.prototype;return r.UNSAFE_componentWillReceiveProps=function(e){this._isValidMessage(e.message)&&(this.setState((function(){return{visible:!0}})),this._triggerDelayedHide())},r._isValidMessage=function(e){return"string"==typeof e&&e.length>0},r.render=function(){var e=this.props.message;return!(!this.state.visible||!this._isValidMessage(e))&&i.createElement("div",{className:"reactist_error_message"},i.createElement("p",null,e),i.createElement("div",{onClick:this._hide,className:"dismiss_icon"}))},s}(i.Component);s.displayName="ErrorMessage",s.defaultProps={timeout:2500},exports.ErrorMessage=s;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("../../_virtual/_rollupPluginBabelHelpers.js"),i=(e=require("react"))&&"object"==typeof e&&"default"in e?e.default:e,s=function(e){function s(t,i){var s;(s=e.call(this,t,i)||this)._clearTimeout=function(){s.timeout&&clearTimeout(s.timeout)},s._triggerDelayedHide=function(){s._clearTimeout(),setTimeout(s._hide,s.props.timeout)},s._hide=function(){var e,t;s._clearTimeout(),s.setState((function(){return{visible:!1}})),null===(e=(t=s.props).onHide)||void 0===e||e.call(t)};var r=s._isValidMessage(t.message);return r&&s._triggerDelayedHide(),s.state={visible:r},s}t.inheritsLoose(s,e);var r=s.prototype;return r.UNSAFE_componentWillReceiveProps=function(e){this._isValidMessage(e.message)&&(this.setState((function(){return{visible:!0}})),this._triggerDelayedHide())},r._isValidMessage=function(e){return"string"==typeof e&&e.length>0},r.render=function(){var e=this.props.message;return!(!this.state.visible||!this._isValidMessage(e))&&i.createElement("div",{className:"reactist_error_message"},i.createElement("p",null,e),i.createElement("div",{onClick:this._hide,className:"dismiss_icon"}))},s}(i.Component);s.displayName="ErrorMessage",s.defaultProps={timeout:2500},exports.ErrorMessage=s;
 //# sourceMappingURL=error-message.js.map

package/lib/components/error-message/error-message.js.map

@@ -1 +1 @@
-{"version":3,"file":"error-message.js","sources":["../../../src/components/error-message/error-message.tsx"],"sourcesContent":["import React from 'react'\n\nimport './error-message.less'\n\ntype Props = {\n    timeout?: number\n    onHide?: () => void\n    message?: string\n}\n\ntype State = {\n    visible: boolean\n}\n\nclass ErrorMessage extends React.Component<Props, State> {\n    public static displayName: string\n    public static defaultProps: Props\n\n    constructor(props: Props, context: unknown) {\n        super(props, context)\n\n        const isValidMessage = this._isValidMessage(props.message)\n        if (isValidMessage) {\n            this._triggerDelayedHide()\n        }\n        this.state = { visible: isValidMessage }\n    }\n\n    UNSAFE_componentWillReceiveProps(nextProps: Props) {\n        if (this._isValidMessage(nextProps.message)) {\n            this.setState(() => ({ visible: true }))\n            this._triggerDelayedHide()\n        }\n    }\n\n    timeout?: number\n\n    _isValidMessage(message?: string) {\n        return typeof message === 'string' && message.length > 0\n    }\n\n    _clearTimeout = () => {\n        this.timeout && clearTimeout(this.timeout)\n    }\n\n    _triggerDelayedHide = () => {\n        this._clearTimeout()\n        this.timeout = setTimeout(this._hide, this.props.timeout)\n    }\n\n    _hide = () => {\n        this._clearTimeout()\n        this.setState(() => ({ visible: false }))\n        this.props.onHide?.()\n    }\n\n    render() {\n        const { message } = this.props\n        if (!this.state.visible || !this._isValidMessage(message)) {\n            return false\n        }\n\n        return (\n            <div className=\"reactist_error_message\">\n                <p>{message}</p>\n                <div onClick={this._hide} className=\"dismiss_icon\" />\n            </div>\n        )\n    }\n}\nErrorMessage.displayName = 'ErrorMessage'\nErrorMessage.defaultProps = {\n    timeout: 2500,\n}\n\nexport { ErrorMessage }\n"],"names":["ErrorMessage","props","context","timeout","clearTimeout","_this","_clearTimeout","setTimeout","_hide","setState","visible","onHide","isValidMessage","_isValidMessage","message","_triggerDelayedHide","state","UNSAFE_componentWillReceiveProps","nextProps","this","length","render","React","className","onClick","Component","displayName","defaultProps"],"mappings":"yMAcMA,yBAIUC,EAAcC,wBAChBD,EAAOC,wBAsBD,aACPC,SAAWC,aAAaC,EAAKF,gCAGhB,aACbG,kBACAH,QAAUI,WAAWF,EAAKG,MAAOH,EAAKJ,MAAME,kBAG7C,qBACCG,kBACAG,UAAS,iBAAO,CAAEC,SAAS,qBAC3BT,OAAMU,oCAhCLC,EAAiBP,EAAKQ,gBAAgBZ,EAAMa,gBAC9CF,KACKG,wBAEJC,MAAQ,CAAEN,QAASE,qDAG5BK,iCAAA,SAAiCC,GACzBC,KAAKN,gBAAgBK,EAAUJ,gBAC1BL,UAAS,iBAAO,CAAEC,SAAS,WAC3BK,0BAMbF,gBAAA,SAAgBC,SACc,iBAAZA,GAAwBA,EAAQM,OAAS,KAkB3DC,OAAA,eACYP,EAAYK,KAAKlB,MAAjBa,iBACHK,KAAKH,MAAMN,UAAYS,KAAKN,gBAAgBC,KAK7CQ,uBAAKC,UAAU,0BACXD,yBAAIR,GACJQ,uBAAKE,QAASL,KAAKX,MAAOe,UAAU,sBAnDzBD,EAAMG,WAwDjCzB,EAAa0B,YAAc,eAC3B1B,EAAa2B,aAAe,CACxBxB,QAAS"}
+{"version":3,"file":"error-message.js","sources":["../../../src/components/error-message/error-message.tsx"],"sourcesContent":["import React from 'react'\n\nimport './error-message.less'\n\ntype Props = {\n    timeout?: number\n    onHide?: () => void\n    message?: string\n}\n\ntype State = {\n    visible: boolean\n}\n\nclass ErrorMessage extends React.Component<Props, State> {\n    public static displayName: string\n    public static defaultProps: Props\n\n    constructor(props: Props, context: unknown) {\n        super(props, context)\n\n        const isValidMessage = this._isValidMessage(props.message)\n        if (isValidMessage) {\n            this._triggerDelayedHide()\n        }\n        this.state = { visible: isValidMessage }\n    }\n\n    UNSAFE_componentWillReceiveProps(nextProps: Props) {\n        if (this._isValidMessage(nextProps.message)) {\n            this.setState(() => ({ visible: true }))\n            this._triggerDelayedHide()\n        }\n    }\n\n    timeout?: number\n\n    _isValidMessage(message?: string) {\n        return typeof message === 'string' && message.length > 0\n    }\n\n    _clearTimeout = () => {\n        this.timeout && clearTimeout(this.timeout)\n    }\n\n    _triggerDelayedHide = () => {\n        this._clearTimeout()\n        setTimeout(this._hide, this.props.timeout)\n    }\n\n    _hide = () => {\n        this._clearTimeout()\n        this.setState(() => ({ visible: false }))\n        this.props.onHide?.()\n    }\n\n    render() {\n        const { message } = this.props\n        if (!this.state.visible || !this._isValidMessage(message)) {\n            return false\n        }\n\n        return (\n            <div className=\"reactist_error_message\">\n                <p>{message}</p>\n                <div onClick={this._hide} className=\"dismiss_icon\" />\n            </div>\n        )\n    }\n}\nErrorMessage.displayName = 'ErrorMessage'\nErrorMessage.defaultProps = {\n    timeout: 2500,\n}\n\nexport { ErrorMessage }\n"],"names":["ErrorMessage","props","context","timeout","clearTimeout","_this","_clearTimeout","setTimeout","_hide","setState","visible","onHide","isValidMessage","_isValidMessage","message","_triggerDelayedHide","state","UNSAFE_componentWillReceiveProps","nextProps","this","length","render","React","className","onClick","Component","displayName","defaultProps"],"mappings":"yMAcMA,yBAIUC,EAAcC,wBAChBD,EAAOC,wBAsBD,aACPC,SAAWC,aAAaC,EAAKF,gCAGhB,aACbG,gBACLC,WAAWF,EAAKG,MAAOH,EAAKJ,MAAME,kBAG9B,qBACCG,kBACAG,UAAS,iBAAO,CAAEC,SAAS,qBAC3BT,OAAMU,oCAhCLC,EAAiBP,EAAKQ,gBAAgBZ,EAAMa,gBAC9CF,KACKG,wBAEJC,MAAQ,CAAEN,QAASE,qDAG5BK,iCAAA,SAAiCC,GACzBC,KAAKN,gBAAgBK,EAAUJ,gBAC1BL,UAAS,iBAAO,CAAEC,SAAS,WAC3BK,0BAMbF,gBAAA,SAAgBC,SACc,iBAAZA,GAAwBA,EAAQM,OAAS,KAkB3DC,OAAA,eACYP,EAAYK,KAAKlB,MAAjBa,iBACHK,KAAKH,MAAMN,UAAYS,KAAKN,gBAAgBC,KAK7CQ,uBAAKC,UAAU,0BACXD,yBAAIR,GACJQ,uBAAKE,QAASL,KAAKX,MAAOe,UAAU,sBAnDzBD,EAAMG,WAwDjCzB,EAAa0B,YAAc,eAC3B1B,EAAa2B,aAAe,CACxBxB,QAAS"}

package/lib/components/keyboard-shortcut/keyboard-shortcut.js

@@ -1,2 +1,2 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../_virtual/_rollupPluginBabelHelpers.js"),r=require("react"),a=(e(r),e(require("classnames"))),n=function(e){return e};function c(e){switch(e.toLowerCase()){case"cmd":case"mod":return"⌘";case"control":case"ctrl":return"⌃";case"alt":return"⌥";case"shift":return"⇧";case"space":return"␣";default:return e}}function s(e){var s,o,l=e.children,u=e.className,i=e.translateKey,d=void 0===i?n:i,p=e.isMac,m=void 0===p?null!==(s=null===(o=navigator.platform)||void 0===o?void 0:o.toUpperCase().includes("MAC"))&&void 0!==s&&s:p,f=t.objectWithoutPropertiesLoose(e,["children","className","translateKey","isMac"]),b="string"==typeof l?[l]:l;return r.createElement("span",Object.assign({className:a("reactist_keyboard_shortcut",u,{"reactist_keyboard_shortcut--macos":m})},f),b.map((function(e,t){return r.createElement(r.Fragment,{key:t},0===t?null:", ",r.createElement("kbd",null,function(e,t,r){var a=t?c:r,n=/\b(mod|cmd|ctrl|control|alt|shift)\b/i.test(e);return t||(e=e.replace(/\b(mod|cmd)\b/i,"ctrl")),e.split(/\s*\+\s*/).map((function(e){return function(e){return/^(mod|cmd|ctrl|control|alt|shift|space|super)$/i.test(e)}(e)?function(e){return e.charAt(0).toUpperCase()+e.slice(1).toLowerCase()}(a(e)):n&&1===e.length?e.toUpperCase():e}))}(e,m,d).map((function(e,t){return r.createElement("kbd",{key:t},e)}))))})))}s.setTranslateKey=function(e){n=e},exports.KeyboardShortcut=s;
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../_virtual/_rollupPluginBabelHelpers.js"),r=require("react"),a=(e(r),e(require("classnames"))),n=["children","className","translateKey","isMac"],c=function(e){return e};function s(e){switch(e.toLowerCase()){case"cmd":case"mod":return"⌘";case"control":case"ctrl":return"⌃";case"alt":return"⌥";case"shift":return"⇧";case"space":return"␣";default:return e}}function o(e){var o,l,u=e.children,i=e.className,d=e.translateKey,p=void 0===d?c:d,m=e.isMac,f=void 0===m?null!==(o=null===(l=navigator.platform)||void 0===l?void 0:l.toUpperCase().includes("MAC"))&&void 0!==o&&o:m,b=t.objectWithoutPropertiesLoose(e,n),h="string"==typeof u?[u]:u;return r.createElement("span",Object.assign({className:a("reactist_keyboard_shortcut",i,{"reactist_keyboard_shortcut--macos":f})},b),h.map((function(e,t){return r.createElement(r.Fragment,{key:t},0===t?null:", ",r.createElement("kbd",null,function(e,t,r){var a=t?s:r,n=/\b(mod|cmd|ctrl|control|alt|shift)\b/i.test(e);return t||(e=e.replace(/\b(mod|cmd)\b/i,"ctrl")),e.split(/\s*\+\s*/).map((function(e){return function(e){return/^(mod|cmd|ctrl|control|alt|shift|space|super)$/i.test(e)}(e)?function(e){return e.charAt(0).toUpperCase()+e.slice(1).toLowerCase()}(a(e)):n&&1===e.length?e.toUpperCase():e}))}(e,f,p).map((function(e,t){return r.createElement("kbd",{key:t},e)}))))})))}o.setTranslateKey=function(e){c=e},exports.KeyboardShortcut=o;
 //# sourceMappingURL=keyboard-shortcut.js.map

package/lib/components/keyboard-shortcut/keyboard-shortcut.js.map

@@ -1 +1 @@
-{"version":3,"file":"keyboard-shortcut.js","sources":["../../../src/components/keyboard-shortcut/keyboard-shortcut.tsx"],"sourcesContent":["import * as React from 'react'\nimport classNames from 'classnames'\n\n//\n// Support for setting up how to translate modifiers globally.\n//\n\nlet globalTranslateKey = (key: string) => key\n\ntype TranslateKey = typeof globalTranslateKey\n\nKeyboardShortcut.setTranslateKey = (tr: TranslateKey) => {\n    globalTranslateKey = tr\n}\n\nfunction translateKeyMac(key: string) {\n    switch (key.toLowerCase()) {\n        case 'cmd':\n        case 'mod':\n            return '⌘'\n        case 'control':\n        case 'ctrl':\n            return '⌃'\n        case 'alt':\n            return '⌥'\n        case 'shift':\n            return '⇧'\n        case 'space':\n            return '␣'\n        default:\n            return key\n    }\n}\n\n//\n// Some helpers\n//\n\nfunction capitalize(str: string) {\n    return str.charAt(0).toUpperCase() + str.slice(1).toLowerCase()\n}\n\nfunction hasModifiers(str: string) {\n    return /\\b(mod|cmd|ctrl|control|alt|shift)\\b/i.test(str)\n}\n\nfunction isSpecialKey(str: string) {\n    return /^(mod|cmd|ctrl|control|alt|shift|space|super)$/i.test(str)\n}\n\nfunction parseKeys(shortcut: string, isMac: boolean, translateKey: TranslateKey) {\n    const t = isMac ? translateKeyMac : translateKey\n    const _hasModifiers = hasModifiers(shortcut)\n\n    function mapIndividualKey(str: string) {\n        if (isSpecialKey(str)) {\n            return capitalize(t(str))\n        }\n        if (_hasModifiers && str.length === 1) {\n            return str.toUpperCase()\n        }\n        return str\n    }\n\n    if (!isMac) {\n        shortcut = shortcut.replace(/\\b(mod|cmd)\\b/i, 'ctrl')\n    }\n\n    return shortcut.split(/\\s*\\+\\s*/).map(mapIndividualKey)\n}\n\n//\n// The KeyboardShortcut component\n//\n\ntype NativeSpanProps = React.DetailedHTMLProps<\n    React.HTMLAttributes<HTMLSpanElement>,\n    HTMLSpanElement\n>\n\ntype Props = Omit<NativeSpanProps, 'children'> & {\n    /**\n     * The shortcut to be represented as markup. It supports an intuitive syntax where you can\n     * combine modifiers (cmd, ctrl, shift, alt) with single keys all concatenated with plus signs.\n     * You can also pass various shortcuts as an array, which will be depicted separated by commas.\n     */\n    children: string | string[]\n    /**\n     * A function that allows you to change how some key names are represented. This may be useful,\n     * for instance, to translate modifier names that are expressed differently in other languages\n     * (e.g. `Ctrl` is named `Strg` in German).\n     *\n     * It defaults to a global version that leaves the key as is. You can pass your version as a\n     * prop, or you can also set your own version of this global default one, so you don't need to\n     * pass your own on each invocation of this component.\n     *\n     * ```js\n     * import { KeyboardShortcut } from '@doist/reactist'\n     * KeyboardShortcut.setTranslateKey = key => { ... }\n     * ```\n     *\n     * Note: When the component detects the macOS operating system it bypasses key translation for\n     * most modifiers and uses macOS-specific symbols. See the `isMac` prop for details.\n     */\n    translateKey?: TranslateKey\n    /**\n     * This prop is not meant to be passed. The component will automatically initialize it to `true`\n     * if it detects that the current browser / operating system is on macOS, in which case modifier\n     * keys are represented using macOS' notation (e.g. ⌘ ⌃ ⌥ ⇧).\n     *\n     * Though it is discouraged, if you don't want this special treatment in macOS, you can pass\n     * `isMac={false}` in all invocations of this component.\n     */\n    isMac?: boolean\n}\n\nfunction KeyboardShortcut({\n    children,\n    className,\n    translateKey = globalTranslateKey,\n    isMac = navigator.platform?.toUpperCase().includes('MAC') ?? false,\n    ...props\n}: Props) {\n    const shortcuts = typeof children === 'string' ? [children] : children\n    return (\n        <span\n            className={classNames('reactist_keyboard_shortcut', className, {\n                'reactist_keyboard_shortcut--macos': isMac,\n            })}\n            {...props}\n        >\n            {shortcuts.map((shortcut, i) => (\n                <React.Fragment key={i}>\n                    {i === 0 ? null : ', '}\n                    <kbd>\n                        {parseKeys(shortcut, isMac, translateKey).map((key, j) => (\n                            <kbd key={j}>{key}</kbd>\n                        ))}\n                    </kbd>\n                </React.Fragment>\n            ))}\n        </span>\n    )\n}\n\nexport { KeyboardShortcut }\n"],"names":["globalTranslateKey","key","translateKeyMac","toLowerCase","KeyboardShortcut","children","className","translateKey","isMac","navigator","platform","_navigator$platform","toUpperCase","includes","props","shortcuts","React","classNames","map","shortcut","i","t","_hasModifiers","test","replace","split","str","isSpecialKey","charAt","slice","capitalize","length","parseKeys","j","setTranslateKey","tr"],"mappings":"4PAOIA,EAAqB,SAACC,UAAgBA,GAQ1C,SAASC,EAAgBD,UACbA,EAAIE,mBACH,UACA,YACM,QACN,cACA,aACM,QACN,YACM,QACN,cACM,QACN,cACM,mBAEAF,GAsFnB,SAASG,aACLC,IAAAA,SACAC,IAAAA,cACAC,aAAAA,aAAeP,QACfQ,MAAAA,iCAAQC,UAAUC,6BAAVC,EAAoBC,cAAcC,SAAS,yBAChDC,oFAEGC,EAAgC,iBAAbV,EAAwB,CAACA,GAAYA,SAE1DW,sCACIV,UAAWW,EAAW,6BAA8BX,EAAW,qCACtBE,KAErCM,GAEHC,EAAUG,KAAI,SAACC,EAAUC,UACtBJ,gBAACA,YAAef,IAAKmB,GACV,IAANA,EAAU,KAAO,KAClBJ,2BApFpB,SAAmBG,EAAkBX,EAAgBD,OAC3Cc,EAAIb,EAAQN,EAAkBK,EAC9Be,EATC,wCAAwCC,KASZJ,UAY9BX,IACDW,EAAWA,EAASK,QAAQ,iBAAkB,SAG3CL,EAASM,MAAM,YAAYP,cAdRQ,UAR9B,SAAsBA,SACX,kDAAkDH,KAAKG,GAQtDC,CAAaD,GAjBzB,SAAoBA,UACTA,EAAIE,OAAO,GAAGhB,cAAgBc,EAAIG,MAAM,GAAG1B,cAiBnC2B,CAAWT,EAAEK,IAEpBJ,GAAgC,IAAfI,EAAIK,OACdL,EAAId,cAERc,KA0EUM,CAAUb,EAAUX,EAAOD,GAAcW,KAAI,SAACjB,EAAKgC,UAChDjB,uBAAKf,IAAKgC,GAAIhC,YA7H1CG,EAAiB8B,gBAAkB,SAACC,GAChCnC,EAAqBmC"}
+{"version":3,"file":"keyboard-shortcut.js","sources":["../../../src/components/keyboard-shortcut/keyboard-shortcut.tsx"],"sourcesContent":["import * as React from 'react'\nimport classNames from 'classnames'\n\n//\n// Support for setting up how to translate modifiers globally.\n//\n\nlet globalTranslateKey = (key: string) => key\n\ntype TranslateKey = typeof globalTranslateKey\n\nKeyboardShortcut.setTranslateKey = (tr: TranslateKey) => {\n    globalTranslateKey = tr\n}\n\nfunction translateKeyMac(key: string) {\n    switch (key.toLowerCase()) {\n        case 'cmd':\n        case 'mod':\n            return '⌘'\n        case 'control':\n        case 'ctrl':\n            return '⌃'\n        case 'alt':\n            return '⌥'\n        case 'shift':\n            return '⇧'\n        case 'space':\n            return '␣'\n        default:\n            return key\n    }\n}\n\n//\n// Some helpers\n//\n\nfunction capitalize(str: string) {\n    return str.charAt(0).toUpperCase() + str.slice(1).toLowerCase()\n}\n\nfunction hasModifiers(str: string) {\n    return /\\b(mod|cmd|ctrl|control|alt|shift)\\b/i.test(str)\n}\n\nfunction isSpecialKey(str: string) {\n    return /^(mod|cmd|ctrl|control|alt|shift|space|super)$/i.test(str)\n}\n\nfunction parseKeys(shortcut: string, isMac: boolean, translateKey: TranslateKey) {\n    const t = isMac ? translateKeyMac : translateKey\n    const _hasModifiers = hasModifiers(shortcut)\n\n    function mapIndividualKey(str: string) {\n        if (isSpecialKey(str)) {\n            return capitalize(t(str))\n        }\n        if (_hasModifiers && str.length === 1) {\n            return str.toUpperCase()\n        }\n        return str\n    }\n\n    if (!isMac) {\n        shortcut = shortcut.replace(/\\b(mod|cmd)\\b/i, 'ctrl')\n    }\n\n    return shortcut.split(/\\s*\\+\\s*/).map(mapIndividualKey)\n}\n\n//\n// The KeyboardShortcut component\n//\n\ntype NativeSpanProps = React.DetailedHTMLProps<\n    React.HTMLAttributes<HTMLSpanElement>,\n    HTMLSpanElement\n>\n\ntype Props = Omit<NativeSpanProps, 'children'> & {\n    /**\n     * The shortcut to be represented as markup. It supports an intuitive syntax where you can\n     * combine modifiers (cmd, ctrl, shift, alt) with single keys all concatenated with plus signs.\n     * You can also pass various shortcuts as an array, which will be depicted separated by commas.\n     */\n    children: string | string[]\n    /**\n     * A function that allows you to change how some key names are represented. This may be useful,\n     * for instance, to translate modifier names that are expressed differently in other languages\n     * (e.g. `Ctrl` is named `Strg` in German).\n     *\n     * It defaults to a global version that leaves the key as is. You can pass your version as a\n     * prop, or you can also set your own version of this global default one, so you don't need to\n     * pass your own on each invocation of this component.\n     *\n     * ```js\n     * import { KeyboardShortcut } from '@doist/reactist'\n     * KeyboardShortcut.setTranslateKey = key => { ... }\n     * ```\n     *\n     * Note: When the component detects the macOS operating system it bypasses key translation for\n     * most modifiers and uses macOS-specific symbols. See the `isMac` prop for details.\n     */\n    translateKey?: TranslateKey\n    /**\n     * This prop is not meant to be passed. The component will automatically initialize it to `true`\n     * if it detects that the current browser / operating system is on macOS, in which case modifier\n     * keys are represented using macOS' notation (e.g. ⌘ ⌃ ⌥ ⇧).\n     *\n     * Though it is discouraged, if you don't want this special treatment in macOS, you can pass\n     * `isMac={false}` in all invocations of this component.\n     */\n    isMac?: boolean\n}\n\nfunction KeyboardShortcut({\n    children,\n    className,\n    translateKey = globalTranslateKey,\n    isMac = navigator.platform?.toUpperCase().includes('MAC') ?? false,\n    ...props\n}: Props) {\n    const shortcuts = typeof children === 'string' ? [children] : children\n    return (\n        <span\n            className={classNames('reactist_keyboard_shortcut', className, {\n                'reactist_keyboard_shortcut--macos': isMac,\n            })}\n            {...props}\n        >\n            {shortcuts.map((shortcut, i) => (\n                <React.Fragment key={i}>\n                    {i === 0 ? null : ', '}\n                    <kbd>\n                        {parseKeys(shortcut, isMac, translateKey).map((key, j) => (\n                            <kbd key={j}>{key}</kbd>\n                        ))}\n                    </kbd>\n                </React.Fragment>\n            ))}\n        </span>\n    )\n}\n\nexport { KeyboardShortcut }\n"],"names":["globalTranslateKey","key","translateKeyMac","toLowerCase","KeyboardShortcut","children","className","translateKey","isMac","navigator","platform","_navigator$platform","toUpperCase","includes","props","shortcuts","React","classNames","map","shortcut","i","t","_hasModifiers","test","replace","split","str","isSpecialKey","charAt","slice","capitalize","length","parseKeys","j","setTranslateKey","tr"],"mappings":"8SAOIA,EAAqB,SAACC,UAAgBA,GAQ1C,SAASC,EAAgBD,UACbA,EAAIE,mBACH,UACA,YACM,QACN,cACA,aACM,QACN,YACM,QACN,cACM,QACN,cACM,mBAEAF,GAsFnB,SAASG,aACLC,IAAAA,SACAC,IAAAA,cACAC,aAAAA,aAAeP,QACfQ,MAAAA,iCAAQC,UAAUC,6BAAVC,EAAoBC,cAAcC,SAAS,yBAChDC,sCAEGC,EAAgC,iBAAbV,EAAwB,CAACA,GAAYA,SAE1DW,sCACIV,UAAWW,EAAW,6BAA8BX,EAAW,qCACtBE,KAErCM,GAEHC,EAAUG,KAAI,SAACC,EAAUC,UACtBJ,gBAACA,YAAef,IAAKmB,GACV,IAANA,EAAU,KAAO,KAClBJ,2BApFpB,SAAmBG,EAAkBX,EAAgBD,OAC3Cc,EAAIb,EAAQN,EAAkBK,EAC9Be,EATC,wCAAwCC,KASZJ,UAY9BX,IACDW,EAAWA,EAASK,QAAQ,iBAAkB,SAG3CL,EAASM,MAAM,YAAYP,cAdRQ,UAR9B,SAAsBA,SACX,kDAAkDH,KAAKG,GAQtDC,CAAaD,GAjBzB,SAAoBA,UACTA,EAAIE,OAAO,GAAGhB,cAAgBc,EAAIG,MAAM,GAAG1B,cAiBnC2B,CAAWT,EAAEK,IAEpBJ,GAAgC,IAAfI,EAAIK,OACdL,EAAId,cAERc,KA0EUM,CAAUb,EAAUX,EAAOD,GAAcW,KAAI,SAACjB,EAAKgC,UAChDjB,uBAAKf,IAAKgC,GAAIhC,YA7H1CG,EAAiB8B,gBAAkB,SAACC,GAChCnC,EAAqBmC"}

package/lib/components/menu/menu.js

@@ -1,2 +1,2 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../_virtual/_rollupPluginBabelHelpers.js"),o=require("react"),n=(e(o),e(require("classnames"))),r=require("../../utils/polymorphism.js"),l=require("reakit/Menu"),a=require("reakit/Popover"),i=o.createContext({});function s(e){var n=e.children,r=e.onItemSelect,a=t.objectWithoutPropertiesLoose(e,["children","onItemSelect"]),s=l.useMenuState(t.objectSpread2({loop:!0},a)),c=o.useCallback((function(e){r&&r(e)}),[r]),u=o.useMemo((function(){return t.objectSpread2(t.objectSpread2({},s),{},{handleItemSelect:c})}),[s,c]);return o.createElement(i.Provider,{value:u},n)}var c=r.polymorphicComponent((function(e,r){var a=e.exceptionallySetClassName,s=t.objectWithoutPropertiesLoose(e,["exceptionallySetClassName"]),c=o.useContext(i),u=t.objectWithoutPropertiesLoose(c,["handleItemSelect"]);return o.createElement(l.MenuButton,Object.assign({},s,u,{ref:r,className:n("reactist_menubutton",a)}))})),u={width:"100%",height:"100%",position:"fixed",top:0,left:0};function m(e){return o.createElement(a.PopoverBackdrop,{baseId:e.baseId,visible:e.visible,animated:e.animated,animating:e.animating,stopAnimation:e.stopAnimation,modal:e.modal,style:u},e.children)}var p=r.polymorphicComponent((function(e,r){var a=e.exceptionallySetClassName,s=t.objectWithoutPropertiesLoose(e,["exceptionallySetClassName"]),c=o.useContext(i),u=t.objectWithoutPropertiesLoose(c,["handleItemSelect"]);return u.visible?o.createElement(m,Object.assign({},u),o.createElement(l.Menu,Object.assign({},s,u,{ref:r,className:n("reactist_menulist",a)}))):null})),d=r.polymorphicComponent((function(e,n){var r=e.value,a=e.children,s=e.onSelect,c=e.hideOnSelect,u=void 0===c||c,m=e.onClick,p=e.exceptionallySetClassName,d=t.objectWithoutPropertiesLoose(e,["value","children","onSelect","hideOnSelect","onClick","exceptionallySetClassName"]),h=o.useContext(i),b=h.handleItemSelect,S=t.objectWithoutPropertiesLoose(h,["handleItemSelect"]),f=S.hide,j=o.useCallback((function(e){null==m||m(e);var t=!1!==(s&&!e.defaultPrevented?s():void 0)&&u;b(r),t&&f()}),[s,m,b,u,f,r]);return o.createElement(l.MenuItem,Object.assign({},d,S,{ref:n,onClick:j,className:p}),a)})),h=o.forwardRef((function(e,r){var a=e.children,c=e.onItemSelect,u=t.objectWithoutPropertiesLoose(e,["children","onItemSelect"]),m=o.useContext(i),p=m.handleItemSelect,d=t.objectWithoutPropertiesLoose(m,["handleItemSelect"]),h=d.hide,b=o.useCallback((function(e){c&&c(e),p(e),h()}),[h,p,c]),S=o.Children.toArray(a),f=S[0],j=S[1];return o.createElement(l.MenuItem,Object.assign({},d,u,{ref:r}),(function(e){return o.createElement(s,{onItemSelect:b},o.cloneElement(f,t.objectSpread2(t.objectSpread2({},e),{},{className:n(e.className,"reactist_submenu_button")})),j)}))})),b=r.polymorphicComponent((function(e,n){var r=e.label,a=e.children,s=e.exceptionallySetClassName,c=t.objectWithoutPropertiesLoose(e,["label","children","exceptionallySetClassName"]),u=o.useContext(i),m=t.objectWithoutPropertiesLoose(u,["handleItemSelect"]);return o.createElement(l.MenuGroup,Object.assign({ref:n},c,m,{className:s}),r?o.createElement("div",{role:"presentation",className:"reactist_menugroup__label"},r):null,a)}));exports.Menu=s,exports.MenuButton=c,exports.MenuGroup=b,exports.MenuItem=d,exports.MenuList=p,exports.SubMenu=h;
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../_virtual/_rollupPluginBabelHelpers.js"),o=require("react"),n=(e(o),e(require("classnames"))),r=require("../../utils/polymorphism.js"),l=require("reakit/Menu"),a=require("reakit/Popover"),i=["children","onItemSelect"],s=["exceptionallySetClassName"],c=["handleItemSelect"],u=["exceptionallySetClassName"],m=["handleItemSelect"],p=["value","children","onSelect","hideOnSelect","onClick","exceptionallySetClassName"],d=["handleItemSelect"],h=["children","onItemSelect"],b=["handleItemSelect"],S=["label","children","exceptionallySetClassName"],f=["handleItemSelect"],j=o.createContext({});function v(e){var n=e.children,r=e.onItemSelect,a=t.objectWithoutPropertiesLoose(e,i),s=l.useMenuState(t.objectSpread2({loop:!0},a)),c=o.useCallback((function(e){r&&r(e)}),[r]),u=o.useMemo((function(){return t.objectSpread2(t.objectSpread2({},s),{},{handleItemSelect:c})}),[s,c]);return o.createElement(j.Provider,{value:u},n)}var C=r.polymorphicComponent((function(e,r){var a=e.exceptionallySetClassName,i=t.objectWithoutPropertiesLoose(e,s),u=o.useContext(j),m=t.objectWithoutPropertiesLoose(u,c);return o.createElement(l.MenuButton,Object.assign({},i,m,{ref:r,className:n("reactist_menubutton",a)}))})),x={width:"100%",height:"100%",position:"fixed",top:0,left:0};function I(e){return o.createElement(a.PopoverBackdrop,{baseId:e.baseId,visible:e.visible,animated:e.animated,animating:e.animating,stopAnimation:e.stopAnimation,modal:e.modal,style:x},e.children)}var y=r.polymorphicComponent((function(e,r){var a=e.exceptionallySetClassName,i=t.objectWithoutPropertiesLoose(e,u),s=o.useContext(j),c=t.objectWithoutPropertiesLoose(s,m);return c.visible?o.createElement(I,Object.assign({},c),o.createElement(l.Menu,Object.assign({},i,c,{ref:r,className:n("reactist_menulist",a)}))):null})),P=r.polymorphicComponent((function(e,n){var r=e.value,a=e.children,i=e.onSelect,s=e.hideOnSelect,c=void 0===s||s,u=e.onClick,m=e.exceptionallySetClassName,h=t.objectWithoutPropertiesLoose(e,p),b=o.useContext(j),S=b.handleItemSelect,f=t.objectWithoutPropertiesLoose(b,d),v=f.hide,C=o.useCallback((function(e){null==u||u(e);var t=!1!==(i&&!e.defaultPrevented?i():void 0)&&c;S(r),t&&v()}),[i,u,S,c,v,r]);return o.createElement(l.MenuItem,Object.assign({},h,f,{ref:n,onClick:C,className:m}),a)})),M=o.forwardRef((function(e,r){var a=e.children,i=e.onItemSelect,s=t.objectWithoutPropertiesLoose(e,h),c=o.useContext(j),u=c.handleItemSelect,m=t.objectWithoutPropertiesLoose(c,b),p=m.hide,d=o.useCallback((function(e){i&&i(e),u(e),p()}),[p,u,i]),S=o.Children.toArray(a),f=S[0],C=S[1];return o.createElement(l.MenuItem,Object.assign({},m,s,{ref:r}),(function(e){return o.createElement(v,{onItemSelect:d},o.cloneElement(f,t.objectSpread2(t.objectSpread2({},e),{},{className:n(e.className,"reactist_submenu_button")})),C)}))})),N=r.polymorphicComponent((function(e,n){var r=e.label,a=e.children,i=e.exceptionallySetClassName,s=t.objectWithoutPropertiesLoose(e,S),c=o.useContext(j),u=t.objectWithoutPropertiesLoose(c,f);return o.createElement(l.MenuGroup,Object.assign({ref:n},s,u,{className:i}),r?o.createElement("div",{role:"presentation",className:"reactist_menugroup__label"},r):null,a)}));exports.Menu=v,exports.MenuButton=C,exports.MenuGroup=N,exports.MenuItem=P,exports.MenuList=y,exports.SubMenu=M;
 //# sourceMappingURL=menu.js.map

package/lib/components/menu/menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu.js","sources":["../../../src/components/menu/menu.tsx"],"sourcesContent":["import * as React from 'react'\nimport classNames from 'classnames'\nimport { polymorphicComponent } from '../../utils/polymorphism'\n\n//\n// Reactist menu is a thin wrapper around Reakit's menu components. This may or may not be\n// temporary. Our goal is to make it transparent for the users of Reactist of this implementation\n// detail. We may change in the future the external lib we use, or even implement it all internally,\n// as long as we keep the same outer interface as intact as possible.\n//\n// Around the heavy lifting of the external lib we just add some features to better integrate the\n// menu to Reactist's more opinionated approach (e.g. using our button with its custom variants and\n// other features, easily show keyboard shortcuts in menu items, etc.)\n//\nimport * as Reakit from 'reakit/Menu'\nimport { PopoverBackdrop } from 'reakit/Popover'\n\nimport './menu.less'\n\ntype NativeProps<E extends HTMLElement> = React.DetailedHTMLProps<React.HTMLAttributes<E>, E>\n\ntype MenuContextState = Reakit.MenuStateReturn & {\n    handleItemSelect: (value: string | null | undefined) => void\n}\n\nconst MenuContext = React.createContext<MenuContextState>(\n    // Reakit gives us no means to obtain a valid initial/default value of type MenuStateReturn\n    // (it is normally obtained by calling useMenuState but we can't call hooks outside components).\n    // This is however of little consequence since this value is only used if some of the components\n    // are used outside Menu, something that should not happen and we do not support.\n    // @ts-expect-error\n    {},\n)\n\n//\n// Menu\n//\n\ntype MenuProps = Omit<Reakit.MenuInitialState, 'visible'> & {\n    /**\n     * The `Menu` must contain a `MenuList` that defines the menu options. It must also contain a\n     * `MenuButton` that triggers the menu to be opened or closed.\n     */\n    children: React.ReactNode\n\n    /**\n     * An optional callback that will be called back whenever a menu item is selected. It receives\n     * the `value` of the selected `MenuItem`.\n     *\n     * If you pass down this callback, it is recommended that you properly memoize it so it does not\n     * change on every render.\n     */\n    onItemSelect?: (value: string | null | undefined) => void\n}\n\n/**\n * Wrapper component to control a menu. It does not render anything, only providing the state\n * management for the menu components inside it.\n */\nfunction Menu({ children, onItemSelect, ...props }: MenuProps) {\n    const state = Reakit.useMenuState({ loop: true, ...props })\n\n    const handleItemSelect = React.useCallback(\n        function handleItemSelect(value: string | null | undefined) {\n            if (onItemSelect) onItemSelect(value)\n        },\n        [onItemSelect],\n    )\n\n    const value: MenuContextState = React.useMemo(\n        () => ({\n            ...state,\n            handleItemSelect,\n        }),\n        [state, handleItemSelect],\n    )\n\n    return <MenuContext.Provider value={value}>{children}</MenuContext.Provider>\n}\n\n//\n// MenuButton\n//\n\ntype MenuButtonProps = Omit<Reakit.MenuButtonProps, keyof Reakit.MenuStateReturn | 'className'>\n\n/**\n * A button to toggle a dropdown menu open or closed.\n */\nconst MenuButton = polymorphicComponent<'button', MenuButtonProps>(function MenuButton(\n    { exceptionallySetClassName, ...props },\n    ref,\n) {\n    const { handleItemSelect, ...state } = React.useContext(MenuContext)\n    return (\n        <Reakit.MenuButton\n            {...props}\n            {...state}\n            ref={ref}\n            className={classNames('reactist_menubutton', exceptionallySetClassName)}\n        />\n    )\n})\n\n//\n// MenuList\n//\n\ntype MenuBackdropProps = Reakit.MenuStateReturn & {\n    children: React.ReactNode\n}\n\nconst BACKDROP_STYLE: React.CSSProperties = {\n    width: '100%',\n    height: '100%',\n    position: 'fixed',\n    top: 0,\n    left: 0,\n}\n\n/**\n * Internal component to provide a backdrop/overlay to all menus. This is needed because reakit's\n * menus do not show an overlay by default.\n */\nfunction MenuBackdrop({\n    baseId,\n    visible,\n    animated,\n    animating,\n    stopAnimation,\n    modal,\n    children,\n}: MenuBackdropProps) {\n    return (\n        <PopoverBackdrop\n            baseId={baseId}\n            visible={visible}\n            animated={animated}\n            animating={animating}\n            stopAnimation={stopAnimation}\n            modal={modal}\n            style={BACKDROP_STYLE}\n        >\n            {children}\n        </PopoverBackdrop>\n    )\n}\n\ntype MenuListProps = Omit<Reakit.MenuProps, keyof Reakit.MenuStateReturn | 'className'>\n\n/**\n * The dropdown menu itself, containing a list of menu items.\n */\nconst MenuList = polymorphicComponent<'div', MenuListProps>(function MenuList(\n    { exceptionallySetClassName, ...props },\n    ref,\n) {\n    const { handleItemSelect, ...state } = React.useContext(MenuContext)\n    return state.visible ? (\n        <MenuBackdrop {...state}>\n            <Reakit.Menu\n                {...props}\n                {...state}\n                ref={ref}\n                className={classNames('reactist_menulist', exceptionallySetClassName)}\n            />\n        </MenuBackdrop>\n    ) : null\n})\n\n//\n// MenuItem\n//\n\ntype MenuItemProps = {\n    /**\n     * An optional value given to this menu item. It is passed on to the parent `Menu`'s\n     * `onItemSelect` when you provide that instead of (or alongside) providing individual\n     * `onSelect` callbacks to each menu item.\n     */\n    value?: string\n    /**\n     * The content inside the menu item.\n     */\n    children: React.ReactNode\n    /**\n     * When `true` the menu item is disabled and won't be selectable or be part of the keyboard\n     * navigation across the menu options.\n     *\n     * @default true\n     */\n    disabled?: boolean\n    /**\n     * When `true` the menu will close when the menu item is selected, in addition to performing the\n     * action that the menu item is set out to do.\n     *\n     * Set this to `false` to make sure that a given menu item does not auto-closes the menu when\n     * selected. This should be the exception and not the norm, as the default is to auto-close.\n     *\n     * @default true\n     */\n    hideOnSelect?: boolean\n    /**\n     * The action to perform when the menu item is selected.\n     *\n     * If you return `false` from this function, the menu will not auto-close when this menu item\n     * is selected. Though you should use `hideOnSelect` for this purpose, this allows you to\n     * achieve the same effect conditionally and dynamically deciding at run time.\n     */\n    onSelect?: () => unknown\n    /**\n     * The event handler called when the menu item is clicked.\n     *\n     * This is similar to `onSelect`, but a bit different. You can certainly use it to trigger the\n     * action that the menu item represents. But in general you should prefer `onSelect` for that.\n     *\n     * The main use for this handler is to get access to the click event. This can be used, for\n     * example, to call `event.preventDefault()`, which will effectively prevent the rest of the\n     * consequences of the click, including preventing `onSelect` from being called. In particular,\n     * this is useful in menu items that are links, and you want the click to not trigger navigation\n     * under some circumstances.\n     */\n    onClick?: (event: React.MouseEvent) => void\n}\n\n/**\n * A menu item inside a menu list. It can be selected by the user, triggering the `onSelect`\n * callback.\n */\nconst MenuItem = polymorphicComponent<'button', MenuItemProps>(function MenuItem(\n    {\n        value,\n        children,\n        onSelect,\n        hideOnSelect = true,\n        onClick,\n        exceptionallySetClassName,\n        ...props\n    },\n    ref,\n) {\n    const { handleItemSelect, ...state } = React.useContext(MenuContext)\n    const { hide } = state\n\n    const handleClick = React.useCallback(\n        function handleClick(event: React.MouseEvent<HTMLButtonElement>) {\n            onClick?.(event)\n            const onSelectResult: unknown =\n                onSelect && !event.defaultPrevented ? onSelect() : undefined\n            const shouldClose = onSelectResult !== false && hideOnSelect\n            handleItemSelect(value)\n            if (shouldClose) hide()\n        },\n        [onSelect, onClick, handleItemSelect, hideOnSelect, hide, value],\n    )\n\n    return (\n        <Reakit.MenuItem\n            {...props}\n            {...state}\n            ref={ref}\n            onClick={handleClick}\n            className={exceptionallySetClassName}\n        >\n            {children}\n        </Reakit.MenuItem>\n    )\n})\n\n//\n// SubMenu\n//\n\ntype SubMenuProps = Pick<MenuProps, 'children' | 'onItemSelect'>\n\n/**\n * This component can be rendered alongside other `MenuItem` inside a `MenuList` in order to have\n * a sub-menu.\n *\n * Its children are expected to have the structure of a first level menu (a `MenuButton` and a\n * `MenuList`).\n *\n * ```jsx\n * <MenuItem label=\"Edit profile\" />\n * <SubMenu>\n *   <MenuButton>More options</MenuButton>\n *   <MenuList>\n *     <MenuItem label=\"Preferences\" />\n *     <MenuItem label=\"Sign out\" />\n *   </MenuList>\n * </SubMenu>\n * ```\n *\n * The `MenuButton` will become a menu item in the current menu items list, and it will lead to\n * opening a sub-menu with the menu items list below it.\n */\nconst SubMenu = React.forwardRef<HTMLButtonElement, SubMenuProps>(function SubMenu(\n    { children, onItemSelect, ...props },\n    ref,\n) {\n    const { handleItemSelect: parentMenuItemSelect, ...state } = React.useContext(MenuContext)\n    const { hide: parentMenuHide } = state\n\n    const handleSubItemSelect = React.useCallback(\n        function handleSubItemSelect(value) {\n            if (onItemSelect) onItemSelect(value)\n            parentMenuItemSelect(value)\n            parentMenuHide()\n        },\n        [parentMenuHide, parentMenuItemSelect, onItemSelect],\n    )\n\n    const [button, list] = React.Children.toArray(children)\n\n    return (\n        <Reakit.MenuItem {...state} {...props} ref={ref}>\n            {(buttonProps) => (\n                <Menu onItemSelect={handleSubItemSelect}>\n                    {React.cloneElement(button as React.ReactElement, {\n                        ...buttonProps,\n                        className: classNames(buttonProps.className, 'reactist_submenu_button'),\n                    })}\n                    {list}\n                </Menu>\n            )}\n        </Reakit.MenuItem>\n    )\n})\n\n//\n// MenuGroup\n//\n\ntype MenuGroupProps = Omit<NativeProps<HTMLDivElement>, 'className'> & {\n    /**\n     * A label to be shown visually and also used to semantically label the group.\n     */\n    label: string\n}\n\n/**\n * A way to semantically group some menu items.\n *\n * This group does not add any visual separator. You can do that yourself adding `<hr />` elements\n * before and/or after the group if you so wish.\n */\nconst MenuGroup = polymorphicComponent<'div', MenuGroupProps>(function MenuGroud(\n    { label, children, exceptionallySetClassName, ...props },\n    ref,\n) {\n    const { handleItemSelect, ...state } = React.useContext(MenuContext)\n    return (\n        <Reakit.MenuGroup ref={ref} {...props} {...state} className={exceptionallySetClassName}>\n            {label ? (\n                <div role=\"presentation\" className=\"reactist_menugroup__label\">\n                    {label}\n                </div>\n            ) : null}\n            {children}\n        </Reakit.MenuGroup>\n    )\n})\n\nexport { Menu, MenuButton, MenuList, MenuItem, SubMenu, MenuGroup }\nexport type { MenuButtonProps, MenuListProps, MenuItemProps, SubMenuProps, MenuGroupProps }\n"],"names":["MenuContext","React","Menu","children","onItemSelect","props","state","Reakit","loop","handleItemSelect","value","Provider","MenuButton","polymorphicComponent","ref","exceptionallySetClassName","className","classNames","BACKDROP_STYLE","width","height","position","top","left","MenuBackdrop","PopoverBackdrop","baseId","visible","animated","animating","stopAnimation","modal","style","MenuList","MenuItem","onSelect","hideOnSelect","onClick","hide","handleClick","event","shouldClose","defaultPrevented","undefined","SubMenu","parentMenuItemSelect","parentMenuHide","handleSubItemSelect","toArray","button","list","buttonProps","MenuGroup","label","role"],"mappings":"0VAyBMA,EAAcC,gBAMhB,IA4BJ,SAASC,SAAOC,IAAAA,SAAUC,IAAAA,aAAiBC,gEACjCC,EAAQC,gCAAsBC,MAAM,GAASH,IAE7CI,EAAmBR,eACrB,SAA0BS,GAClBN,GAAcA,EAAaM,KAEnC,CAACN,IAGCM,EAA0BT,WAC5B,qDACOK,OACHG,iBAAAA,MAEJ,CAACH,EAAOG,WAGLR,gBAACD,EAAYW,UAASD,MAAOA,GAAQP,OAY1CS,EAAaC,wBAAgD,WAE/DC,OADEC,IAAAA,0BAA8BV,oEAGOJ,aAAiBD,GAA3BM,gEAEzBL,gBAACM,8BACOF,EACAC,GACJQ,IAAKA,EACLE,UAAWC,EAAW,sBAAuBF,SAanDG,EAAsC,CACxCC,MAAO,OACPC,OAAQ,OACRC,SAAU,QACVC,IAAK,EACLC,KAAM,GAOV,SAASC,YAUDvB,gBAACwB,mBACGC,SAVRA,OAWQC,UAVRA,QAWQC,WAVRA,SAWQC,YAVRA,UAWQC,gBAVRA,cAWQC,QAVRA,MAWQC,MAAOd,KAVff,cAsBE8B,EAAWpB,wBAA2C,WAExDC,OADEC,IAAAA,0BAA8BV,oEAGOJ,aAAiBD,GAA3BM,gEACtBA,EAAMqB,QACT1B,gBAACuB,mBAAiBlB,GACdL,gBAACM,wBACOF,EACAC,GACJQ,IAAKA,EACLE,UAAWC,EAAW,oBAAqBF,OAGnD,QA8DFmB,EAAWrB,wBAA8C,WAU3DC,OARIJ,IAAAA,MACAP,IAAAA,SACAgC,IAAAA,aACAC,aAAAA,gBACAC,IAAAA,QACAtB,IAAAA,0BACGV,2HAIgCJ,aAAiBD,GAAhDS,IAAAA,iBAAqBH,yDACrBgC,EAAShC,EAATgC,KAEFC,EAActC,eAChB,SAAqBuC,GACjBH,MAAAA,GAAAA,EAAUG,OAGJC,GAAiC,KADnCN,IAAaK,EAAME,iBAAmBP,SAAaQ,IACPP,EAChD3B,EAAiBC,GACb+B,GAAaH,MAErB,CAACH,EAAUE,EAAS5B,EAAkB2B,EAAcE,EAAM5B,WAI1DT,gBAACM,4BACOF,EACAC,GACJQ,IAAKA,EACLuB,QAASE,EACTvB,UAAWD,IAEVZ,MAgCPyC,EAAU3C,cAAkD,WAE9Da,OADEX,IAAAA,SAAUC,IAAAA,aAAiBC,kEAGgCJ,aAAiBD,GAApD6C,IAAlBpC,iBAA2CH,yDACrCwC,EAAmBxC,EAAzBgC,KAEFS,EAAsB9C,eACxB,SAA6BS,GACrBN,GAAcA,EAAaM,GAC/BmC,EAAqBnC,GACrBoC,MAEJ,CAACA,EAAgBD,EAAsBzC,MAGpBH,WAAe+C,QAAQ7C,GAAvC8C,OAAQC,cAGXjD,gBAACM,4BAAoBD,EAAWD,GAAOS,IAAKA,KACvC,SAACqC,UACElD,gBAACC,GAAKE,aAAc2C,GACf9C,eAAmBgD,qCACbE,OACHnC,UAAWC,EAAWkC,EAAYnC,UAAW,8BAEhDkC,SAwBfE,EAAYvC,wBAA4C,WAE1DC,OADEuC,IAAAA,MAAOlD,IAAAA,SAAUY,IAAAA,0BAA8BV,uFAGVJ,aAAiBD,GAA3BM,gEAEzBL,gBAACM,2BAAiBO,IAAKA,GAAST,EAAWC,GAAOU,UAAWD,IACxDsC,EACGpD,uBAAKqD,KAAK,eAAetC,UAAU,6BAC9BqC,GAEL,KACHlD"}
+{"version":3,"file":"menu.js","sources":["../../../src/components/menu/menu.tsx"],"sourcesContent":["import * as React from 'react'\nimport classNames from 'classnames'\nimport { polymorphicComponent } from '../../utils/polymorphism'\n\n//\n// Reactist menu is a thin wrapper around Reakit's menu components. This may or may not be\n// temporary. Our goal is to make it transparent for the users of Reactist of this implementation\n// detail. We may change in the future the external lib we use, or even implement it all internally,\n// as long as we keep the same outer interface as intact as possible.\n//\n// Around the heavy lifting of the external lib we just add some features to better integrate the\n// menu to Reactist's more opinionated approach (e.g. using our button with its custom variants and\n// other features, easily show keyboard shortcuts in menu items, etc.)\n//\nimport * as Reakit from 'reakit/Menu'\nimport { PopoverBackdrop } from 'reakit/Popover'\n\nimport './menu.less'\n\ntype NativeProps<E extends HTMLElement> = React.DetailedHTMLProps<React.HTMLAttributes<E>, E>\n\ntype MenuContextState = Reakit.MenuStateReturn & {\n    handleItemSelect: (value: string | null | undefined) => void\n}\n\nconst MenuContext = React.createContext<MenuContextState>(\n    // Reakit gives us no means to obtain a valid initial/default value of type MenuStateReturn\n    // (it is normally obtained by calling useMenuState but we can't call hooks outside components).\n    // This is however of little consequence since this value is only used if some of the components\n    // are used outside Menu, something that should not happen and we do not support.\n    // @ts-expect-error\n    {},\n)\n\n//\n// Menu\n//\n\ntype MenuProps = Omit<Reakit.MenuInitialState, 'visible'> & {\n    /**\n     * The `Menu` must contain a `MenuList` that defines the menu options. It must also contain a\n     * `MenuButton` that triggers the menu to be opened or closed.\n     */\n    children: React.ReactNode\n\n    /**\n     * An optional callback that will be called back whenever a menu item is selected. It receives\n     * the `value` of the selected `MenuItem`.\n     *\n     * If you pass down this callback, it is recommended that you properly memoize it so it does not\n     * change on every render.\n     */\n    onItemSelect?: (value: string | null | undefined) => void\n}\n\n/**\n * Wrapper component to control a menu. It does not render anything, only providing the state\n * management for the menu components inside it.\n */\nfunction Menu({ children, onItemSelect, ...props }: MenuProps) {\n    const state = Reakit.useMenuState({ loop: true, ...props })\n\n    const handleItemSelect = React.useCallback(\n        function handleItemSelect(value: string | null | undefined) {\n            if (onItemSelect) onItemSelect(value)\n        },\n        [onItemSelect],\n    )\n\n    const value: MenuContextState = React.useMemo(\n        () => ({\n            ...state,\n            handleItemSelect,\n        }),\n        [state, handleItemSelect],\n    )\n\n    return <MenuContext.Provider value={value}>{children}</MenuContext.Provider>\n}\n\n//\n// MenuButton\n//\n\ntype MenuButtonProps = Omit<Reakit.MenuButtonProps, keyof Reakit.MenuStateReturn | 'className'>\n\n/**\n * A button to toggle a dropdown menu open or closed.\n */\nconst MenuButton = polymorphicComponent<'button', MenuButtonProps>(function MenuButton(\n    { exceptionallySetClassName, ...props },\n    ref,\n) {\n    const { handleItemSelect, ...state } = React.useContext(MenuContext)\n    return (\n        <Reakit.MenuButton\n            {...props}\n            {...state}\n            ref={ref}\n            className={classNames('reactist_menubutton', exceptionallySetClassName)}\n        />\n    )\n})\n\n//\n// MenuList\n//\n\ntype MenuBackdropProps = Reakit.MenuStateReturn & {\n    children: React.ReactNode\n}\n\nconst BACKDROP_STYLE: React.CSSProperties = {\n    width: '100%',\n    height: '100%',\n    position: 'fixed',\n    top: 0,\n    left: 0,\n}\n\n/**\n * Internal component to provide a backdrop/overlay to all menus. This is needed because reakit's\n * menus do not show an overlay by default.\n */\nfunction MenuBackdrop({\n    baseId,\n    visible,\n    animated,\n    animating,\n    stopAnimation,\n    modal,\n    children,\n}: MenuBackdropProps) {\n    return (\n        <PopoverBackdrop\n            baseId={baseId}\n            visible={visible}\n            animated={animated}\n            animating={animating}\n            stopAnimation={stopAnimation}\n            modal={modal}\n            style={BACKDROP_STYLE}\n        >\n            {children}\n        </PopoverBackdrop>\n    )\n}\n\ntype MenuListProps = Omit<Reakit.MenuProps, keyof Reakit.MenuStateReturn | 'className'>\n\n/**\n * The dropdown menu itself, containing a list of menu items.\n */\nconst MenuList = polymorphicComponent<'div', MenuListProps>(function MenuList(\n    { exceptionallySetClassName, ...props },\n    ref,\n) {\n    const { handleItemSelect, ...state } = React.useContext(MenuContext)\n    return state.visible ? (\n        <MenuBackdrop {...state}>\n            <Reakit.Menu\n                {...props}\n                {...state}\n                ref={ref}\n                className={classNames('reactist_menulist', exceptionallySetClassName)}\n            />\n        </MenuBackdrop>\n    ) : null\n})\n\n//\n// MenuItem\n//\n\ntype MenuItemProps = {\n    /**\n     * An optional value given to this menu item. It is passed on to the parent `Menu`'s\n     * `onItemSelect` when you provide that instead of (or alongside) providing individual\n     * `onSelect` callbacks to each menu item.\n     */\n    value?: string\n    /**\n     * The content inside the menu item.\n     */\n    children: React.ReactNode\n    /**\n     * When `true` the menu item is disabled and won't be selectable or be part of the keyboard\n     * navigation across the menu options.\n     *\n     * @default true\n     */\n    disabled?: boolean\n    /**\n     * When `true` the menu will close when the menu item is selected, in addition to performing the\n     * action that the menu item is set out to do.\n     *\n     * Set this to `false` to make sure that a given menu item does not auto-closes the menu when\n     * selected. This should be the exception and not the norm, as the default is to auto-close.\n     *\n     * @default true\n     */\n    hideOnSelect?: boolean\n    /**\n     * The action to perform when the menu item is selected.\n     *\n     * If you return `false` from this function, the menu will not auto-close when this menu item\n     * is selected. Though you should use `hideOnSelect` for this purpose, this allows you to\n     * achieve the same effect conditionally and dynamically deciding at run time.\n     */\n    onSelect?: () => unknown\n    /**\n     * The event handler called when the menu item is clicked.\n     *\n     * This is similar to `onSelect`, but a bit different. You can certainly use it to trigger the\n     * action that the menu item represents. But in general you should prefer `onSelect` for that.\n     *\n     * The main use for this handler is to get access to the click event. This can be used, for\n     * example, to call `event.preventDefault()`, which will effectively prevent the rest of the\n     * consequences of the click, including preventing `onSelect` from being called. In particular,\n     * this is useful in menu items that are links, and you want the click to not trigger navigation\n     * under some circumstances.\n     */\n    onClick?: (event: React.MouseEvent) => void\n}\n\n/**\n * A menu item inside a menu list. It can be selected by the user, triggering the `onSelect`\n * callback.\n */\nconst MenuItem = polymorphicComponent<'button', MenuItemProps>(function MenuItem(\n    {\n        value,\n        children,\n        onSelect,\n        hideOnSelect = true,\n        onClick,\n        exceptionallySetClassName,\n        ...props\n    },\n    ref,\n) {\n    const { handleItemSelect, ...state } = React.useContext(MenuContext)\n    const { hide } = state\n\n    const handleClick = React.useCallback(\n        function handleClick(event: React.MouseEvent<HTMLButtonElement>) {\n            onClick?.(event)\n            const onSelectResult: unknown =\n                onSelect && !event.defaultPrevented ? onSelect() : undefined\n            const shouldClose = onSelectResult !== false && hideOnSelect\n            handleItemSelect(value)\n            if (shouldClose) hide()\n        },\n        [onSelect, onClick, handleItemSelect, hideOnSelect, hide, value],\n    )\n\n    return (\n        <Reakit.MenuItem\n            {...props}\n            {...state}\n            ref={ref}\n            onClick={handleClick}\n            className={exceptionallySetClassName}\n        >\n            {children}\n        </Reakit.MenuItem>\n    )\n})\n\n//\n// SubMenu\n//\n\ntype SubMenuProps = Pick<MenuProps, 'children' | 'onItemSelect'>\n\n/**\n * This component can be rendered alongside other `MenuItem` inside a `MenuList` in order to have\n * a sub-menu.\n *\n * Its children are expected to have the structure of a first level menu (a `MenuButton` and a\n * `MenuList`).\n *\n * ```jsx\n * <MenuItem label=\"Edit profile\" />\n * <SubMenu>\n *   <MenuButton>More options</MenuButton>\n *   <MenuList>\n *     <MenuItem label=\"Preferences\" />\n *     <MenuItem label=\"Sign out\" />\n *   </MenuList>\n * </SubMenu>\n * ```\n *\n * The `MenuButton` will become a menu item in the current menu items list, and it will lead to\n * opening a sub-menu with the menu items list below it.\n */\nconst SubMenu = React.forwardRef<HTMLButtonElement, SubMenuProps>(function SubMenu(\n    { children, onItemSelect, ...props },\n    ref,\n) {\n    const { handleItemSelect: parentMenuItemSelect, ...state } = React.useContext(MenuContext)\n    const { hide: parentMenuHide } = state\n\n    const handleSubItemSelect = React.useCallback(\n        function handleSubItemSelect(value) {\n            if (onItemSelect) onItemSelect(value)\n            parentMenuItemSelect(value)\n            parentMenuHide()\n        },\n        [parentMenuHide, parentMenuItemSelect, onItemSelect],\n    )\n\n    const [button, list] = React.Children.toArray(children)\n\n    return (\n        <Reakit.MenuItem {...state} {...props} ref={ref}>\n            {(buttonProps) => (\n                <Menu onItemSelect={handleSubItemSelect}>\n                    {React.cloneElement(button as React.ReactElement, {\n                        ...buttonProps,\n                        className: classNames(buttonProps.className, 'reactist_submenu_button'),\n                    })}\n                    {list}\n                </Menu>\n            )}\n        </Reakit.MenuItem>\n    )\n})\n\n//\n// MenuGroup\n//\n\ntype MenuGroupProps = Omit<NativeProps<HTMLDivElement>, 'className'> & {\n    /**\n     * A label to be shown visually and also used to semantically label the group.\n     */\n    label: string\n}\n\n/**\n * A way to semantically group some menu items.\n *\n * This group does not add any visual separator. You can do that yourself adding `<hr />` elements\n * before and/or after the group if you so wish.\n */\nconst MenuGroup = polymorphicComponent<'div', MenuGroupProps>(function MenuGroud(\n    { label, children, exceptionallySetClassName, ...props },\n    ref,\n) {\n    const { handleItemSelect, ...state } = React.useContext(MenuContext)\n    return (\n        <Reakit.MenuGroup ref={ref} {...props} {...state} className={exceptionallySetClassName}>\n            {label ? (\n                <div role=\"presentation\" className=\"reactist_menugroup__label\">\n                    {label}\n                </div>\n            ) : null}\n            {children}\n        </Reakit.MenuGroup>\n    )\n})\n\nexport { Menu, MenuButton, MenuList, MenuItem, SubMenu, MenuGroup }\nexport type { MenuButtonProps, MenuListProps, MenuItemProps, SubMenuProps, MenuGroupProps }\n"],"names":["MenuContext","React","Menu","children","onItemSelect","props","state","Reakit","loop","handleItemSelect","value","Provider","MenuButton","polymorphicComponent","ref","exceptionallySetClassName","className","classNames","BACKDROP_STYLE","width","height","position","top","left","MenuBackdrop","PopoverBackdrop","baseId","visible","animated","animating","stopAnimation","modal","style","MenuList","MenuItem","onSelect","hideOnSelect","onClick","hide","handleClick","event","shouldClose","defaultPrevented","undefined","SubMenu","parentMenuItemSelect","parentMenuHide","handleSubItemSelect","toArray","button","list","buttonProps","MenuGroup","label","role"],"mappings":"mtBAyBMA,EAAcC,gBAMhB,IA4BJ,SAASC,SAAOC,IAAAA,SAAUC,IAAAA,aAAiBC,sCACjCC,EAAQC,gCAAsBC,MAAM,GAASH,IAE7CI,EAAmBR,eACrB,SAA0BS,GAClBN,GAAcA,EAAaM,KAEnC,CAACN,IAGCM,EAA0BT,WAC5B,qDACOK,OACHG,iBAAAA,MAEJ,CAACH,EAAOG,WAGLR,gBAACD,EAAYW,UAASD,MAAOA,GAAQP,OAY1CS,EAAaC,wBAAgD,WAE/DC,OADEC,IAAAA,0BAA8BV,wCAGOJ,aAAiBD,GAA3BM,6CAEzBL,gBAACM,8BACOF,EACAC,GACJQ,IAAKA,EACLE,UAAWC,EAAW,sBAAuBF,SAanDG,EAAsC,CACxCC,MAAO,OACPC,OAAQ,OACRC,SAAU,QACVC,IAAK,EACLC,KAAM,GAOV,SAASC,YAUDvB,gBAACwB,mBACGC,SAVRA,OAWQC,UAVRA,QAWQC,WAVRA,SAWQC,YAVRA,UAWQC,gBAVRA,cAWQC,QAVRA,MAWQC,MAAOd,KAVff,cAsBE8B,EAAWpB,wBAA2C,WAExDC,OADEC,IAAAA,0BAA8BV,wCAGOJ,aAAiBD,GAA3BM,6CACtBA,EAAMqB,QACT1B,gBAACuB,mBAAiBlB,GACdL,gBAACM,wBACOF,EACAC,GACJQ,IAAKA,EACLE,UAAWC,EAAW,oBAAqBF,OAGnD,QA8DFmB,EAAWrB,wBAA8C,WAU3DC,OARIJ,IAAAA,MACAP,IAAAA,SACAgC,IAAAA,aACAC,aAAAA,gBACAC,IAAAA,QACAtB,IAAAA,0BACGV,wCAIgCJ,aAAiBD,GAAhDS,IAAAA,iBAAqBH,sCACrBgC,EAAShC,EAATgC,KAEFC,EAActC,eAChB,SAAqBuC,GACjBH,MAAAA,GAAAA,EAAUG,OAGJC,GAAiC,KADnCN,IAAaK,EAAME,iBAAmBP,SAAaQ,IACPP,EAChD3B,EAAiBC,GACb+B,GAAaH,MAErB,CAACH,EAAUE,EAAS5B,EAAkB2B,EAAcE,EAAM5B,WAI1DT,gBAACM,4BACOF,EACAC,GACJQ,IAAKA,EACLuB,QAASE,EACTvB,UAAWD,IAEVZ,MAgCPyC,EAAU3C,cAAkD,WAE9Da,OADEX,IAAAA,SAAUC,IAAAA,aAAiBC,wCAGgCJ,aAAiBD,GAApD6C,IAAlBpC,iBAA2CH,sCACrCwC,EAAmBxC,EAAzBgC,KAEFS,EAAsB9C,eACxB,SAA6BS,GACrBN,GAAcA,EAAaM,GAC/BmC,EAAqBnC,GACrBoC,MAEJ,CAACA,EAAgBD,EAAsBzC,MAGpBH,WAAe+C,QAAQ7C,GAAvC8C,OAAQC,cAGXjD,gBAACM,4BAAoBD,EAAWD,GAAOS,IAAKA,KACvC,SAACqC,UACElD,gBAACC,GAAKE,aAAc2C,GACf9C,eAAmBgD,qCACbE,OACHnC,UAAWC,EAAWkC,EAAYnC,UAAW,8BAEhDkC,SAwBfE,EAAYvC,wBAA4C,WAE1DC,OADEuC,IAAAA,MAAOlD,IAAAA,SAAUY,IAAAA,0BAA8BV,wCAGVJ,aAAiBD,GAA3BM,6CAEzBL,gBAACM,2BAAiBO,IAAKA,GAAST,EAAWC,GAAOU,UAAWD,IACxDsC,EACGpD,uBAAKqD,KAAK,eAAetC,UAAU,6BAC9BqC,GAEL,KACHlD"}

package/lib/components/notification/notification.js

@@ -1,2 +1,2 @@
-"use strict";function t(t){return t&&"object"==typeof t&&"default"in t?t.default:t}Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_rollupPluginBabelHelpers.js"),l=t(require("react")),i=t(require("classnames")),n=require("../icons/CloseIcon.svg.js");exports.Notification=function(t){var o=t.id,a=t.icon,c=t.title,s=t.subtitle,r=t.children,u=t.customCloseButton,b=t.onClick,d=t.onClose,m=t.closeAltText,f=void 0===m?"Close":m,_=t.className,C=e.objectWithoutPropertiesLoose(t,["id","icon","title","subtitle","children","customCloseButton","onClick","onClose","closeAltText","className"]),N=c?o+"-title":null,g=N?{id:N}:null,j=s?o+"-subtitle":null,p=j?{id:j}:null,v=r?o+"-content":null,E=v?{"aria-labelledby":v}:N?{"aria-labelledby":N}:null,h=j&&!r?{"aria-describedby":j}:null,y=l.createElement("div",Object.assign({className:"reactist-notification__content"},r?{id:o+"-content"}:null),null!=r?r:l.createElement(l.Fragment,null,c?l.createElement("h3",Object.assign({className:"reactist-notification__title"},g),c):null,s?l.createElement("p",Object.assign({className:"reactist-notification__subtitle"},p),s):null)),B=l.createElement("div",{className:"reactist-notification__icon-content-group"},null!=a?a:null,y);return l.createElement("div",Object.assign({id:o,role:"dialog",className:i("reactist-notification",_,{"reactist-notification--with-button":Boolean(b),"reactist-notification--with-close-button":Boolean(d)})},E,h,C),b?l.createElement("button",{className:"reactist-notification__button",onClick:b},B):B,d?l.createElement("button",{className:"reactist-notification__close-button",onClick:d,"aria-label":f},null!=u?u:l.createElement(n.default,null)):null)};
+"use strict";function t(t){return t&&"object"==typeof t&&"default"in t?t.default:t}Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_rollupPluginBabelHelpers.js"),l=t(require("react")),i=t(require("classnames")),n=require("../icons/CloseIcon.svg.js"),o=["id","icon","title","subtitle","children","customCloseButton","onClick","onClose","closeAltText","className"];exports.Notification=function(t){var a=t.id,c=t.icon,s=t.title,r=t.subtitle,u=t.children,b=t.customCloseButton,d=t.onClick,m=t.onClose,f=t.closeAltText,_=void 0===f?"Close":f,C=t.className,N=e.objectWithoutPropertiesLoose(t,o),g=s?a+"-title":null,j=g?{id:g}:null,p=r?a+"-subtitle":null,v=p?{id:p}:null,E=u?a+"-content":null,h=E?{"aria-labelledby":E}:g?{"aria-labelledby":g}:null,y=p&&!u?{"aria-describedby":p}:null,B=l.createElement("div",Object.assign({className:"reactist-notification__content"},u?{id:a+"-content"}:null),null!=u?u:l.createElement(l.Fragment,null,s?l.createElement("h3",Object.assign({className:"reactist-notification__title"},j),s):null,r?l.createElement("p",Object.assign({className:"reactist-notification__subtitle"},v),r):null)),O=l.createElement("div",{className:"reactist-notification__icon-content-group"},null!=c?c:null,B);return l.createElement("div",Object.assign({id:a,role:"dialog",className:i("reactist-notification",C,{"reactist-notification--with-button":Boolean(d),"reactist-notification--with-close-button":Boolean(m)})},h,y,N),d?l.createElement("button",{className:"reactist-notification__button",onClick:d},O):O,m?l.createElement("button",{className:"reactist-notification__close-button",onClick:m,"aria-label":_},null!=b?b:l.createElement(n.default,null)):null)};
 //# sourceMappingURL=notification.js.map

package/lib/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":["id","icon","title","subtitle","children","customCloseButton","onClick","onClose","closeAltText","className","rest","titleId","titleIdAttribute","subtitleId","subtitleIdAttribute","contentId","ariaLabelledBy","ariaDescribedBy","notificationContent","React","notificationBody","role","classNames","Boolean","CloseIcon"],"mappings":"oTAkBA,gBACIA,IAAAA,GACAC,IAAAA,KACAC,IAAAA,MACAC,IAAAA,SACAC,IAAAA,SACAC,IAAAA,kBACAC,IAAAA,QACAC,IAAAA,YACAC,aAAAA,aAAe,UACfC,IAAAA,UACGC,mJAEGC,EAAUT,EAAWF,WAAa,KAClCY,EAAmBD,EAAU,CAAEX,GAAIW,GAAY,KAC/CE,EAAaV,EAAcH,cAAgB,KAC3Cc,EAAsBD,EAAa,CAAEb,GAAIa,GAAe,KACxDE,EAAYX,EAAcJ,aAAe,KAEzCgB,EAAiBD,EACjB,mBAAqBA,GACrBJ,EACA,mBAAqBA,GACrB,KACAM,EAAkBJ,IAAeT,EAAW,oBAAsBS,GAAe,KAEjFK,EACFC,qCAAKV,UAAU,kCATQL,EAAW,CAAEJ,GAAOA,cAAiB,MAUvDI,MAAAA,EAAAA,EACGe,gCACKjB,EACGiB,oCAAIV,UAAU,gCAAmCG,GAC5CV,GAEL,KACHC,EACGgB,mCAAGV,UAAU,mCAAsCK,GAC9CX,GAEL,OAKdiB,EACFD,uBAAKV,UAAU,6CACVR,MAAAA,EAAAA,EAAQ,KACRiB,UAKLC,qCACInB,GAAIA,EACJqB,KAAK,SACLZ,UAAWa,EAAW,wBAAyBb,EAAW,sCAChBc,QAAQjB,8CACFiB,QAAQhB,MAEpDS,EACAC,EACAP,GAEHJ,EACGa,0BAAQV,UAAU,gCAAgCH,QAASA,GACtDc,GAGLA,EAGHb,EACGY,0BACIV,UAAU,sCACVH,QAASC,eACGC,GAEXH,MAAAA,EAAAA,EAAqBc,gBAACK,iBAE3B"}
+{"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":["id","icon","title","subtitle","children","customCloseButton","onClick","onClose","closeAltText","className","rest","titleId","titleIdAttribute","subtitleId","subtitleIdAttribute","contentId","ariaLabelledBy","ariaDescribedBy","notificationContent","React","notificationBody","role","classNames","Boolean","CloseIcon"],"mappings":"qaAkBA,gBACIA,IAAAA,GACAC,IAAAA,KACAC,IAAAA,MACAC,IAAAA,SACAC,IAAAA,SACAC,IAAAA,kBACAC,IAAAA,QACAC,IAAAA,YACAC,aAAAA,aAAe,UACfC,IAAAA,UACGC,sCAEGC,EAAUT,EAAWF,WAAa,KAClCY,EAAmBD,EAAU,CAAEX,GAAIW,GAAY,KAC/CE,EAAaV,EAAcH,cAAgB,KAC3Cc,EAAsBD,EAAa,CAAEb,GAAIa,GAAe,KACxDE,EAAYX,EAAcJ,aAAe,KAEzCgB,EAAiBD,EACjB,mBAAqBA,GACrBJ,EACA,mBAAqBA,GACrB,KACAM,EAAkBJ,IAAeT,EAAW,oBAAsBS,GAAe,KAEjFK,EACFC,qCAAKV,UAAU,kCATQL,EAAW,CAAEJ,GAAOA,cAAiB,MAUvDI,MAAAA,EAAAA,EACGe,gCACKjB,EACGiB,oCAAIV,UAAU,gCAAmCG,GAC5CV,GAEL,KACHC,EACGgB,mCAAGV,UAAU,mCAAsCK,GAC9CX,GAEL,OAKdiB,EACFD,uBAAKV,UAAU,6CACVR,MAAAA,EAAAA,EAAQ,KACRiB,UAKLC,qCACInB,GAAIA,EACJqB,KAAK,SACLZ,UAAWa,EAAW,wBAAyBb,EAAW,sCAChBc,QAAQjB,8CACFiB,QAAQhB,MAEpDS,EACAC,EACAP,GAEHJ,EACGa,0BAAQV,UAAU,gCAAgCH,QAASA,GACtDc,GAGLA,EAGHb,EACGY,0BACIV,UAAU,sCACVH,QAASC,eACGC,GAEXH,MAAAA,EAAAA,EAAqBc,gBAACK,iBAE3B"}

package/lib/components/select/select.js

@@ -1,2 +1,2 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var a=require("../../_virtual/_rollupPluginBabelHelpers.js"),t=e(require("react")),l=e(require("classnames"));function s(e){var s=e.value,u=e.options,i=void 0===u?[]:u,o=e.onChange,r=e.disabled,n=void 0===r||r,d=e.className,c=void 0===d?"":d,v=e.defaultValue,p=a.objectWithoutPropertiesLoose(e,["value","options","onChange","disabled","className","defaultValue"]),b=l("reactist_select",{disabled:n},c);return t.createElement("select",Object.assign({className:b,value:s,onChange:function(e){return o?o(e.target.value):void 0},disabled:n,defaultValue:v},p),null==i?void 0:i.map((function(e){return t.createElement("option",{key:e.key||e.value,value:e.value,disabled:e.disabled},e.text)})))}s.displayName="Select",s.defaultProps={options:[],disabled:!1},exports.Select=s;
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var a=require("../../_virtual/_rollupPluginBabelHelpers.js"),t=e(require("react")),l=e(require("classnames")),s=["value","options","onChange","disabled","className","defaultValue"];function u(e){var u=e.value,i=e.options,o=void 0===i?[]:i,r=e.onChange,n=e.disabled,d=void 0===n||n,c=e.className,v=void 0===c?"":c,p=e.defaultValue,b=a.objectWithoutPropertiesLoose(e,s),f=l("reactist_select",{disabled:d},v);return t.createElement("select",Object.assign({className:f,value:u,onChange:function(e){return r?r(e.target.value):void 0},disabled:d,defaultValue:p},b),null==o?void 0:o.map((function(e){return t.createElement("option",{key:e.key||e.value,value:e.value,disabled:e.disabled},e.text)})))}u.displayName="Select",u.defaultProps={options:[],disabled:!1},exports.Select=u;
 //# sourceMappingURL=select.js.map

package/lib/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":"wPA6BA,SAASA,SACLC,IAAAA,UACAC,QAAAA,aAAU,KACVC,IAAAA,aACAC,SAAAA,oBACAC,UAAAA,aAAY,KACZC,IAAAA,aACGC,yGAEGC,EAAkBC,EAAW,kBAAmB,CAAEL,SAAAA,GAAYC,UAEhEK,wCACIL,UAAWG,EACXP,MAAOA,EACPE,SAAU,SAACQ,UAAWR,EAAWA,EAASQ,EAAMC,OAAOX,YAASY,GAChET,SAAUA,EACVE,aAAcA,GACVC,GAEHL,MAAAA,SAAAA,EAASY,KAAI,SAACC,UACXL,0BACIM,IAAKD,EAAOC,KAAOD,EAAOd,MAC1BA,MAAOc,EAAOd,MACdG,SAAUW,EAAOX,UAEhBW,EAAOE,UAM5BjB,EAAOkB,YAAc,SACrBlB,EAAOmB,aAAe,CAClBjB,QAAS,GACTE,UAAU"}
+{"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":"+TA6BA,SAASA,SACLC,IAAAA,UACAC,QAAAA,aAAU,KACVC,IAAAA,aACAC,SAAAA,oBACAC,UAAAA,aAAY,KACZC,IAAAA,aACGC,sCAEGC,EAAkBC,EAAW,kBAAmB,CAAEL,SAAAA,GAAYC,UAEhEK,wCACIL,UAAWG,EACXP,MAAOA,EACPE,SAAU,SAACQ,UAAWR,EAAWA,EAASQ,EAAMC,OAAOX,YAASY,GAChET,SAAUA,EACVE,aAAcA,GACVC,GAEHL,MAAAA,SAAAA,EAASY,KAAI,SAACC,UACXL,0BACIM,IAAKD,EAAOC,KAAOD,EAAOd,MAC1BA,MAAOc,EAAOd,MACdG,SAAUW,EAAOX,UAEhBW,EAAOE,UAM5BjB,EAAOkB,YAAc,SACrBlB,EAAOmB,aAAe,CAClBjB,QAAS,GACTE,UAAU"}

package/lib/components/tooltip/tooltip.js

@@ -1,2 +1,2 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../_virtual/_rollupPluginBabelHelpers.js"),n=e(require("react")),o=e(require("classnames")),r=require("reakit/Tooltip");exports.HIDE_DELAY=100,exports.SHOW_DELAY=500,exports.Tooltip=function(e){var u,i,c,s,l=e.children,a=e.content,p=e.position,f=void 0===p?"top":p,d=e.gapSize,m=void 0===d?3:d,b=e.className,E=t.objectWithoutPropertiesLoose(e,["children","content","position","gapSize","className"]),v=(c=r.useTooltipState({placement:f,gutter:m}),u=n.useRef(),i=n.useCallback((function(){null!=u.current&&clearTimeout(u.current)}),[]),n.useEffect((function(){return i}),[i]),s=n.useCallback((function(e,t){return function(){i(),u.current=setTimeout(e,t)}}),[i]),n.useMemo((function(){return t.objectSpread2(t.objectSpread2({},c),{},{show:s((function(){return c.show()}),500),hide:s((function(){return c.hide()}),100)})}),[s,c])),h=n.Children.only(l);return a?n.createElement(n.Fragment,null,n.createElement(r.TooltipReference,Object.assign({},v,{ref:h.ref},h.props,{onFocus:function(e){e.currentTarget.addEventListener("keyup",(function(e){var t=e.key;"Escape"!==t&&"Enter"!==t&&"Space"!==t&&v.show()}),{once:!0}),e.preventDefault(),"function"==typeof h.props.onFocus&&h.props.onFocus(e)}}),(function(e){return n.cloneElement(h,e)})),v.visible?n.createElement(r.Tooltip,Object.assign({},v,E,{className:o("reactist_tooltip",b)}),"function"==typeof a?a():a):null):h};
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../_virtual/_rollupPluginBabelHelpers.js"),n=e(require("react")),o=e(require("classnames")),r=require("reakit/Tooltip"),u=["children","content","position","gapSize","className"];exports.HIDE_DELAY=100,exports.SHOW_DELAY=500,exports.Tooltip=function(e){var i,c,s,l,a=e.children,p=e.content,f=e.position,d=void 0===f?"top":f,m=e.gapSize,b=void 0===m?3:m,E=e.className,v=t.objectWithoutPropertiesLoose(e,u),h=(s=r.useTooltipState({placement:d,gutter:b}),i=n.useRef(),c=n.useCallback((function(){null!=i.current&&clearTimeout(i.current)}),[]),n.useEffect((function(){return c}),[c]),l=n.useCallback((function(e,t){return function(){c(),i.current=setTimeout(e,t)}}),[c]),n.useMemo((function(){return t.objectSpread2(t.objectSpread2({},s),{},{show:l((function(){return s.show()}),500),hide:l((function(){return s.hide()}),100)})}),[l,s])),g=n.Children.only(a);return p?n.createElement(n.Fragment,null,n.createElement(r.TooltipReference,Object.assign({},h,{ref:g.ref},g.props,{onFocus:function(e){e.currentTarget.addEventListener("keyup",(function(e){var t=e.key;"Escape"!==t&&"Enter"!==t&&"Space"!==t&&h.show()}),{once:!0}),e.preventDefault(),"function"==typeof g.props.onFocus&&g.props.onFocus(e)}}),(function(e){return n.cloneElement(g,e)})),h.visible?n.createElement(r.Tooltip,Object.assign({},h,v,{className:o("reactist_tooltip",E)}),"function"==typeof p?p():p):null):g};
 //# sourceMappingURL=tooltip.js.map

package/lib/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":["timeoutRef","clearTimeouts","tooltipState","delay","children","content","position","gapSize","className","props","tooltip","useTooltipState","placement","gutter","React","useRef","useCallback","current","clearTimeout","useEffect","fn","setTimeout","useMemo","show","hide","child","Children","only","TooltipReference","ref","onFocus","event","currentTarget","addEventListener","e","eventKey","key","once","preventDefault","referenceProps","cloneElement","visible","ReakitTooltip","classNames"],"mappings":"uSAuB0B,uBADA,oBAgB1B,gBAiFUA,EAEAC,EA/FAC,EACAC,EAYNC,IAAAA,SACAC,IAAAA,YACAC,SAAAA,aAAW,YACXC,QAAAA,aAAU,IACVC,IAAAA,UACGC,4FAEGC,GApBAR,EAAeS,kBAoBkB,CAAEC,UAAWN,EAAUO,OAAQN,IAyEhEP,EAAac,EAAMC,SAEnBd,EAAgBa,EAAME,aAAY,WACV,MAAtBhB,EAAWiB,SACXC,aAAalB,EAAWiB,WAE7B,IAGHH,EAAMK,WAAU,kBAAMlB,IAAe,CAACA,IArGhCE,EAuGCW,EAAME,aACT,SAAeI,EAAgBjB,UACpB,WACHF,IACAD,EAAWiB,QAAUI,WAAWD,EAAIjB,MAG5C,CAACF,IA7GEa,EAAMQ,SACT,qDACOpB,OACHqB,KAAMpB,GAAM,kBAAMD,EAAaqB,SATjB,KAUdC,KAAMrB,GAAM,kBAAMD,EAAasB,SATjB,SAWlB,CAACrB,EAAOD,KAcNuB,EAAQX,EAAMY,SAASC,KAAyBvB,UACjDC,EA6BDS,gCACIA,gBAACc,oCACOlB,GAEJmB,IAAMJ,EAAcI,KAChBJ,EAAMhB,OACVqB,iBAzBSC,GAWjBA,EAAMC,cAAcC,iBAAiB,kBANhBC,OACXC,EAAYD,EAAoBE,IACrB,WAAbD,GAAsC,UAAbA,GAAqC,UAAbA,GACjDzB,EAAQa,SAG2C,CAAEc,MAAM,IAEnEN,EAAMO,iBAE6B,mBAAxBb,EAAMhB,MAAMqB,SAAwBL,EAAMhB,MAAMqB,QAAQC,OAY1D,SAACQ,UAAmBzB,EAAM0B,aAAaf,EAAOc,MAElD7B,EAAQ+B,QACL3B,gBAAC4B,2BACOhC,EACAD,GACJD,UAAWmC,EAAW,mBAAoBnC,KAEtB,mBAAZH,EAAyBA,IAAYA,GAEjD,MA9CDoB"}
+{"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":["timeoutRef","clearTimeouts","tooltipState","delay","children","content","position","gapSize","className","props","tooltip","useTooltipState","placement","gutter","React","useRef","useCallback","current","clearTimeout","useEffect","fn","setTimeout","useMemo","show","hide","child","Children","only","TooltipReference","ref","onFocus","event","currentTarget","addEventListener","e","eventKey","key","once","preventDefault","referenceProps","cloneElement","visible","ReakitTooltip","classNames"],"mappings":"iWAuB0B,uBADA,oBAgB1B,gBAiFUA,EAEAC,EA/FAC,EACAC,EAYNC,IAAAA,SACAC,IAAAA,YACAC,SAAAA,aAAW,YACXC,QAAAA,aAAU,IACVC,IAAAA,UACGC,sCAEGC,GApBAR,EAAeS,kBAoBkB,CAAEC,UAAWN,EAAUO,OAAQN,IAyEhEP,EAAac,EAAMC,SAEnBd,EAAgBa,EAAME,aAAY,WACV,MAAtBhB,EAAWiB,SACXC,aAAalB,EAAWiB,WAE7B,IAGHH,EAAMK,WAAU,kBAAMlB,IAAe,CAACA,IArGhCE,EAuGCW,EAAME,aACT,SAAeI,EAAgBjB,UACpB,WACHF,IACAD,EAAWiB,QAAUI,WAAWD,EAAIjB,MAG5C,CAACF,IA7GEa,EAAMQ,SACT,qDACOpB,OACHqB,KAAMpB,GAAM,kBAAMD,EAAaqB,SATjB,KAUdC,KAAMrB,GAAM,kBAAMD,EAAasB,SATjB,SAWlB,CAACrB,EAAOD,KAcNuB,EAAQX,EAAMY,SAASC,KAAyBvB,UACjDC,EA6BDS,gCACIA,gBAACc,oCACOlB,GAEJmB,IAAMJ,EAAcI,KAChBJ,EAAMhB,OACVqB,iBAzBSC,GAWjBA,EAAMC,cAAcC,iBAAiB,kBANhBC,OACXC,EAAYD,EAAoBE,IACrB,WAAbD,GAAsC,UAAbA,GAAqC,UAAbA,GACjDzB,EAAQa,SAG2C,CAAEc,MAAM,IAEnEN,EAAMO,iBAE6B,mBAAxBb,EAAMhB,MAAMqB,SAAwBL,EAAMhB,MAAMqB,QAAQC,OAY1D,SAACQ,UAAmBzB,EAAM0B,aAAaf,EAAOc,MAElD7B,EAAQ+B,QACL3B,gBAAC4B,2BACOhC,EACAD,GACJD,UAAWmC,EAAW,mBAAoBnC,KAEtB,mBAAZH,EAAyBA,IAAYA,GAEjD,MA9CDoB"}

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_rollupPluginBabelHelpers.js"),l=require("react"),t=require("../../utils/polymorphism.js"),n=require("../box/box.js"),a=require("../spinner/spinner.js"),o=require("../../components/tooltip/tooltip.js"),i=require("./base-button.module.css.js");function r(e){e.preventDefault()}exports.BaseButton=t.polymorphicComponent((function(t,s){var u=t.as,c=void 0===u?"div":u,d=t.variant,p=t.tone,m=void 0===p?"normal":p,f=t.size,b=void 0===f?"normal":f,v=t.disabled,x=void 0!==v&&v,j=t.loading,E=void 0!==j&&j,B=t.tooltip,h=t.onClick,q=t.exceptionallySetClassName,y=t.children,C=t.startIcon,I=t.endIcon,N=t.icon,g=e.objectWithoutPropertiesLoose(t,["as","variant","tone","size","disabled","loading","tooltip","onClick","exceptionallySetClassName","children","startIcon","endIcon","icon"]),S=E||x,_=l.createElement(n.Box,Object.assign({},g,{as:c,ref:s,"aria-disabled":S,onClick:S?r:h,className:[q,i.default.baseButton,i.default["variant-"+d],i.default["tone-"+m],i.default["size-"+b],N?i.default.iconButton:null,x?i.default.disabled:null]}),N?E&&l.createElement(a.Spinner,null)||N:l.createElement(l.Fragment,null,C?l.createElement(n.Box,{display:"flex",className:i.default.startIcon,"aria-hidden":!0},E&&!I?l.createElement(a.Spinner,null):C):null,y?l.createElement("span",{className:i.default.label},y):null,I||E&&!C?l.createElement(n.Box,{display:"flex",className:i.default.endIcon,"aria-hidden":!0},E?l.createElement(a.Spinner,null):I):null)),k=N?null!=B?B:g["aria-label"]:B;return k?l.createElement(o.Tooltip,{content:k},_):_}));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_rollupPluginBabelHelpers.js"),l=require("react"),t=require("../../utils/polymorphism.js"),n=require("../box/box.js"),a=require("../spinner/spinner.js"),o=require("../../components/tooltip/tooltip.js"),i=require("./base-button.module.css.js"),r=["as","variant","tone","size","disabled","loading","tooltip","onClick","exceptionallySetClassName","children","startIcon","endIcon","icon"];function s(e){e.preventDefault()}exports.BaseButton=t.polymorphicComponent((function(t,u){var c=t.as,d=void 0===c?"div":c,p=t.variant,m=t.tone,f=void 0===m?"normal":m,b=t.size,v=void 0===b?"normal":b,x=t.disabled,j=void 0!==x&&x,E=t.loading,B=void 0!==E&&E,h=t.tooltip,q=t.onClick,y=t.exceptionallySetClassName,C=t.children,I=t.startIcon,N=t.endIcon,g=t.icon,S=e.objectWithoutPropertiesLoose(t,r),_=B||j,k=l.createElement(n.Box,Object.assign({},S,{as:d,ref:u,"aria-disabled":_,onClick:_?s:q,className:[y,i.default.baseButton,i.default["variant-"+p],i.default["tone-"+f],i.default["size-"+v],g?i.default.iconButton:null,j?i.default.disabled:null]}),g?B&&l.createElement(a.Spinner,null)||g:l.createElement(l.Fragment,null,I?l.createElement(n.Box,{display:"flex",className:i.default.startIcon,"aria-hidden":!0},B&&!N?l.createElement(a.Spinner,null):I):null,C?l.createElement("span",{className:i.default.label},C):null,N||B&&!I?l.createElement(n.Box,{display:"flex",className:i.default.endIcon,"aria-hidden":!0},B?l.createElement(a.Spinner,null):N):null)),z=g?null!=h?h:S["aria-label"]:h;return z?l.createElement(o.Tooltip,{content:z},k):k}));
 //# sourceMappingURL=base-button.js.map

package/lib/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","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":"qVAOA,SAASA,EAAeC,GACpBA,EAAMD,oCAqEgBE,wBAA6C,WAiBnEC,WAfIC,GAAAA,aAAK,QACLC,IAAAA,YACAC,KAAAA,aAAO,eACPC,KAAAA,aAAO,eACPC,SAAAA,oBACAC,QAAAA,gBACAC,IAAAA,QACAC,IAAAA,QACAC,IAAAA,0BACAC,IAAAA,SACAC,IAAAA,UACAC,IAAAA,QACAC,IAAAA,KACGC,gLAIDC,EAAaT,GAAWD,EACxBW,EACFC,gBAACC,uBACOJ,GACJb,GAAIA,EACJD,IAAKA,kBACUe,EACfP,QAASO,EAAalB,EAAiBW,EACvCW,UAAW,CACPV,EACAW,UAAOC,WACPD,qBAAkBlB,GAClBkB,kBAAejB,GACfiB,kBAAehB,GACfS,EAAOO,UAAOE,WAAa,KAC3BjB,EAAWe,UAAOf,SAAW,QAGhCQ,EACIP,GAAWW,gBAACM,iBAAeV,EAE5BI,gCACKN,EACGM,gBAACC,OAAIM,QAAQ,OAAOL,UAAWC,UAAOT,4BACjCL,IAAYM,EAAUK,gBAACM,gBAAaZ,GAEzC,KACHD,EAAWO,wBAAME,UAAWC,UAAOK,OAAQf,GAAmB,KAC9DE,GAAYN,IAAYK,EACrBM,gBAACC,OAAIM,QAAQ,OAAOL,UAAWC,UAAOR,0BACjCN,EAAUW,gBAACM,gBAAaX,GAE7B,OAOdc,EAAiBb,EAAON,MAAAA,EAAAA,EAAWO,EAAM,cAAgBP,SACxDmB,EACHT,gBAACU,WAAQC,QAASF,GAAiBV,GAEnCA"}
+{"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","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":"meAOA,SAASA,EAAeC,GACpBA,EAAMD,oCAqEgBE,wBAA6C,WAiBnEC,WAfIC,GAAAA,aAAK,QACLC,IAAAA,YACAC,KAAAA,aAAO,eACPC,KAAAA,aAAO,eACPC,SAAAA,oBACAC,QAAAA,gBACAC,IAAAA,QACAC,IAAAA,QACAC,IAAAA,0BACAC,IAAAA,SACAC,IAAAA,UACAC,IAAAA,QACAC,IAAAA,KACGC,sCAIDC,EAAaT,GAAWD,EACxBW,EACFC,gBAACC,uBACOJ,GACJb,GAAIA,EACJD,IAAKA,kBACUe,EACfP,QAASO,EAAalB,EAAiBW,EACvCW,UAAW,CACPV,EACAW,UAAOC,WACPD,qBAAkBlB,GAClBkB,kBAAejB,GACfiB,kBAAehB,GACfS,EAAOO,UAAOE,WAAa,KAC3BjB,EAAWe,UAAOf,SAAW,QAGhCQ,EACIP,GAAWW,gBAACM,iBAAeV,EAE5BI,gCACKN,EACGM,gBAACC,OAAIM,QAAQ,OAAOL,UAAWC,UAAOT,4BACjCL,IAAYM,EAAUK,gBAACM,gBAAaZ,GAEzC,KACHD,EAAWO,wBAAME,UAAWC,UAAOK,OAAQf,GAAmB,KAC9DE,GAAYN,IAAYK,EACrBM,gBAACC,OAAIM,QAAQ,OAAOL,UAAWC,UAAOR,0BACjCN,EAAUW,gBAACM,gBAAaX,GAE7B,OAOdc,EAAiBb,EAAON,MAAAA,EAAAA,EAAWO,EAAM,cAAgBP,SACxDmB,EACHT,gBAACU,WAAQC,QAASF,GAAiBV,GAEnCA"}

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

@@ -1,2 +1,2 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var l=require("../../_virtual/_rollupPluginBabelHelpers.js"),a=require("react"),t=(e(a),e(require("classnames"))),i=require("../../utils/polymorphism.js"),s=require("../responsive-props.js"),n=require("./box.module.css.js"),d=require("./padding.module.css.js"),r=require("./margin.module.css.js");exports.Box=i.polymorphicComponent((function(e,i){var o,u,g,m,f,p,h,C,N=e.as,c=void 0===N?"div":N,x=e.position,v=void 0===x?"static":x,b=e.display,j=e.flexDirection,y=void 0===j?"row":j,w=e.flexWrap,W=e.flexGrow,R=e.flexShrink,q=e.alignItems,B=e.justifyContent,S=e.overflow,L=e.width,T=e.height,k=e.background,X=e.border,Y=e.borderRadius,_=e.minWidth,A=e.maxWidth,D=e.textAlign,G=void 0===D?"start":D,I=e.padding,P=e.paddingY,E=e.paddingX,F=e.paddingTop,H=e.paddingRight,M=e.paddingBottom,O=e.paddingLeft,z=e.margin,J=e.marginY,K=e.marginX,Q=e.marginTop,U=e.marginRight,V=e.marginBottom,Z=e.marginLeft,$=e.className,ee=e.children,le=l.objectWithoutPropertiesLoose(e,["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"]),ae=null!==(o=null!=F?F:P)&&void 0!==o?o:I,te=null!==(u=null!=H?H:E)&&void 0!==u?u:I,ie=null!==(g=null!=M?M:P)&&void 0!==g?g:I,se=null!==(m=null!=O?O:E)&&void 0!==m?m:I,ne=null!==(f=null!=Q?Q:J)&&void 0!==f?f:z,de=null!==(p=null!=U?U:K)&&void 0!==p?p:z,re=null!==(h=null!=V?V:J)&&void 0!==h?h:z,oe=null!==(C=null!=Z?Z:K)&&void 0!==C?C:z,ue=!b||"string"==typeof b&&"flex"!==b&&"inlineFlex"!==b;return a.createElement(c,l.objectSpread2(l.objectSpread2({},le),{},{className:t($,n.default.box,b?s.getClassNames(n.default,"display",b):null,"static"!==v?s.getClassNames(n.default,"position",v):null,null!=_?s.getClassNames(n.default,"minWidth",String(_)):null,s.getClassNames(n.default,"maxWidth",A),"start"!==G?s.getClassNames(n.default,"textAlign",G):null,s.getClassNames(d.default,"paddingTop",ae),s.getClassNames(d.default,"paddingRight",te),s.getClassNames(d.default,"paddingBottom",ie),s.getClassNames(d.default,"paddingLeft",se),s.getClassNames(r.default,"marginTop",ne),s.getClassNames(r.default,"marginRight",de),s.getClassNames(r.default,"marginBottom",re),s.getClassNames(r.default,"marginLeft",oe),ue?null:s.getClassNames(n.default,"flexDirection",y),ue?null:s.getClassNames(n.default,"flexWrap",w),ue?null:s.getClassNames(n.default,"alignItems",q),ue?null:s.getClassNames(n.default,"justifyContent",B),null!=R?s.getClassNames(n.default,"flexShrink",String(R)):null,null!=W?s.getClassNames(n.default,"flexGrow",String(W)):null,s.getClassNames(n.default,"overflow",S),s.getClassNames(n.default,"width",L),s.getClassNames(n.default,"height",T),s.getClassNames(n.default,"bg",k),"none"!==Y?s.getClassNames(n.default,"borderRadius",Y):null,"none"!==X?s.getClassNames(n.default,"border",X):null)||void 0,ref:i}),ee)}));
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var l=require("../../_virtual/_rollupPluginBabelHelpers.js"),a=require("react"),t=(e(a),e(require("classnames"))),i=require("../../utils/polymorphism.js"),s=require("../responsive-props.js"),n=require("./box.module.css.js"),d=require("./padding.module.css.js"),r=require("./margin.module.css.js"),o=["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"];exports.Box=i.polymorphicComponent((function(e,i){var u,g,m,f,p,h,C,N,c=e.as,x=void 0===c?"div":c,v=e.position,b=void 0===v?"static":v,j=e.display,y=e.flexDirection,w=void 0===y?"row":y,W=e.flexWrap,R=e.flexGrow,q=e.flexShrink,B=e.alignItems,S=e.justifyContent,L=e.overflow,T=e.width,k=e.height,X=e.background,Y=e.border,_=e.borderRadius,A=e.minWidth,D=e.maxWidth,G=e.textAlign,I=void 0===G?"start":G,P=e.padding,E=e.paddingY,F=e.paddingX,H=e.paddingTop,M=e.paddingRight,O=e.paddingBottom,z=e.paddingLeft,J=e.margin,K=e.marginY,Q=e.marginX,U=e.marginTop,V=e.marginRight,Z=e.marginBottom,$=e.marginLeft,ee=e.className,le=e.children,ae=l.objectWithoutPropertiesLoose(e,o),te=null!==(u=null!=H?H:E)&&void 0!==u?u:P,ie=null!==(g=null!=M?M:F)&&void 0!==g?g:P,se=null!==(m=null!=O?O:E)&&void 0!==m?m:P,ne=null!==(f=null!=z?z:F)&&void 0!==f?f:P,de=null!==(p=null!=U?U:K)&&void 0!==p?p:J,re=null!==(h=null!=V?V:Q)&&void 0!==h?h:J,oe=null!==(C=null!=Z?Z:K)&&void 0!==C?C:J,ue=null!==(N=null!=$?$:Q)&&void 0!==N?N:J,ge=!j||"string"==typeof j&&"flex"!==j&&"inlineFlex"!==j;return a.createElement(x,l.objectSpread2(l.objectSpread2({},ae),{},{className:t(ee,n.default.box,j?s.getClassNames(n.default,"display",j):null,"static"!==b?s.getClassNames(n.default,"position",b):null,null!=A?s.getClassNames(n.default,"minWidth",String(A)):null,s.getClassNames(n.default,"maxWidth",D),"start"!==I?s.getClassNames(n.default,"textAlign",I):null,s.getClassNames(d.default,"paddingTop",te),s.getClassNames(d.default,"paddingRight",ie),s.getClassNames(d.default,"paddingBottom",se),s.getClassNames(d.default,"paddingLeft",ne),s.getClassNames(r.default,"marginTop",de),s.getClassNames(r.default,"marginRight",re),s.getClassNames(r.default,"marginBottom",oe),s.getClassNames(r.default,"marginLeft",ue),ge?null:s.getClassNames(n.default,"flexDirection",w),ge?null:s.getClassNames(n.default,"flexWrap",W),ge?null:s.getClassNames(n.default,"alignItems",B),ge?null:s.getClassNames(n.default,"justifyContent",S),null!=q?s.getClassNames(n.default,"flexShrink",String(q)):null,null!=R?s.getClassNames(n.default,"flexGrow",String(R)):null,s.getClassNames(n.default,"overflow",L),s.getClassNames(n.default,"width",T),s.getClassNames(n.default,"height",k),s.getClassNames(n.default,"bg",X),"none"!==_?s.getClassNames(n.default,"borderRadius",_):null,"none"!==Y?s.getClassNames(n.default,"border",Y):null)||void 0,ref:i}),le)}));
 //# sourceMappingURL=box.js.map