@doist/reactist 12.1.1 → 13.0.0

package/es/components/color-picker/color-picker.js

@@ -1,7 +1,7 @@
 import React__default from 'react';
 import classNames from 'classnames';
 import { Tooltip } from '../tooltip/tooltip.js';
-import Dropdown from '../dropdown/index.js';
+import DeprecatedDropdown from '../deprecated-dropdown/index.js';
 
 const COLORS = ['#606060', '#4A90E2', '#03B3B2', '#008299', '#82BA00', '#D24726', '#AC193D', '#DC4FAD', '#3BD5FB', '#74E8D3', '#FFCC00', '#FB886E', '#CCCCCC'];
 
@@ -18,10 +18,10 @@ function ColorPicker({
   onChange,
   colorList = COLORS
 }) {
-  return /*#__PURE__*/React__default.createElement(Dropdown.Box, {
+  return /*#__PURE__*/React__default.createElement(DeprecatedDropdown.Box, {
     right: true,
     className: "reactist_color_picker"
-  }, /*#__PURE__*/React__default.createElement(Dropdown.Trigger, null, (() => {
+  }, /*#__PURE__*/React__default.createElement(DeprecatedDropdown.Trigger, null, (() => {
     const backgroundColor = _getColor(colorList, color);
 
     return /*#__PURE__*/React__default.createElement("span", {
@@ -34,7 +34,7 @@ function ColorPicker({
     }, /*#__PURE__*/React__default.createElement("span", {
       className: "color_trigger--inner_ring"
     }));
-  })()), /*#__PURE__*/React__default.createElement(Dropdown.Body, null, /*#__PURE__*/React__default.createElement("div", {
+  })()), /*#__PURE__*/React__default.createElement(DeprecatedDropdown.Body, null, /*#__PURE__*/React__default.createElement("div", {
     className: "color_options"
   }, colorList.reduce((items, currentColor, currentIndex) => {
     items.push( /*#__PURE__*/React__default.createElement(ColorItem, {

package/es/components/color-picker/color-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"color-picker.js","sources":["../../../src/components/color-picker/color-picker.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\n\nimport Dropdown from '../dropdown'\nimport { Tooltip } from '../tooltip'\n\nimport './color-picker.less'\n\ntype NamedColor = { name: string; color: string }\n\nconst COLORS = [\n    '#606060',\n    '#4A90E2',\n    '#03B3B2',\n    '#008299',\n    '#82BA00',\n    '#D24726',\n    '#AC193D',\n    '#DC4FAD',\n    '#3BD5FB',\n    '#74E8D3',\n    '#FFCC00',\n    '#FB886E',\n    '#CCCCCC',\n]\n\nconst _isNamedColor = (color: string | NamedColor | undefined): color is NamedColor =>\n    typeof color !== 'string'\n\nconst _getColor = (colorList: (string | NamedColor)[], colorIndex: number) => {\n    const index = colorIndex >= colorList.length ? 0 : colorIndex\n    return colorList[index]\n}\n\ntype Props = {\n    small?: boolean\n    color?: number\n    onChange?: (color: number) => void\n    colorList?: (string | NamedColor)[]\n}\n\nfunction ColorPicker({ color = 0, small, onChange, colorList = COLORS }: Props) {\n    return (\n        <Dropdown.Box right className=\"reactist_color_picker\">\n            <Dropdown.Trigger>\n                {(() => {\n                    const backgroundColor = _getColor(colorList, color)\n\n                    return (\n                        <span\n                            className={classnames('color_trigger', { small })}\n                            style={{\n                                backgroundColor: _isNamedColor(backgroundColor)\n                                    ? backgroundColor.color\n                                    : backgroundColor,\n                            }}\n                        >\n                            <span className=\"color_trigger--inner_ring\" />\n                        </span>\n                    )\n                })()}\n            </Dropdown.Trigger>\n            <Dropdown.Body>\n                <div className=\"color_options\">\n                    {colorList.reduce<React.ReactNode[]>((items, currentColor, currentIndex) => {\n                        items.push(\n                            <ColorItem\n                                isActive={\n                                    color >= colorList.length\n                                        ? currentIndex === 0\n                                        : currentIndex === color\n                                }\n                                key={currentIndex}\n                                color={\n                                    _isNamedColor(currentColor) ? currentColor.color : currentColor\n                                }\n                                colorIndex={currentIndex}\n                                onClick={onChange}\n                                tooltip={_isNamedColor(currentColor) ? currentColor.name : null}\n                            />,\n                        )\n                        return items\n                    }, [])}\n                </div>\n            </Dropdown.Body>\n        </Dropdown.Box>\n    )\n}\nColorPicker.displayName = 'ColorPicker'\n\ntype ColorItemProps = {\n    color: string\n    colorIndex: number\n    isActive?: boolean\n    onClick?: (colorIndex: number) => void\n    tooltip?: React.ReactNode\n}\n\nfunction ColorItem({ color, colorIndex, isActive, onClick, tooltip }: ColorItemProps) {\n    const item = (\n        <span\n            className={'reactist color_item' + (isActive ? ' active' : '')}\n            style={{ backgroundColor: color }}\n            onClick={() => onClick?.(colorIndex)}\n        >\n            <span className=\"color_item--inner_ring\" />\n        </span>\n    )\n\n    return tooltip ? <Tooltip content={tooltip}>{item}</Tooltip> : item\n}\nColorItem.displayName = 'ColorItem'\n\nexport { ColorPicker, ColorItem, COLORS }\n"],"names":["COLORS","_isNamedColor","color","_getColor","colorList","colorIndex","index","length","ColorPicker","small","onChange","React","Dropdown","Box","right","className","Trigger","backgroundColor","classnames","style","Body","reduce","items","currentColor","currentIndex","push","ColorItem","isActive","key","onClick","tooltip","name","displayName","item","Tooltip","content"],"mappings":";;;;;MAUMA,MAAM,GAAG,CACX,SADW,EAEX,SAFW,EAGX,SAHW,EAIX,SAJW,EAKX,SALW,EAMX,SANW,EAOX,SAPW,EAQX,SARW,EASX,SATW,EAUX,SAVW,EAWX,SAXW,EAYX,SAZW,EAaX,SAbW;;AAgBf,MAAMC,aAAa,GAAIC,KAAD,IAClB,OAAOA,KAAP,KAAiB,QADrB;;AAGA,MAAMC,SAAS,GAAG,CAACC,SAAD,EAAqCC,UAArC;EACd,MAAMC,KAAK,GAAGD,UAAU,IAAID,SAAS,CAACG,MAAxB,GAAiC,CAAjC,GAAqCF,UAAnD;EACA,OAAOD,SAAS,CAACE,KAAD,CAAhB;AACH,CAHD;;AAYA,SAASE,WAAT,CAAqB;EAAEN,KAAK,GAAG,CAAV;EAAaO,KAAb;EAAoBC,QAApB;EAA8BN,SAAS,GAAGJ;AAA1C,CAArB;EACI,oBACIW,4BAAA,CAACC,QAAQ,CAACC,GAAV;IAAcC,KAAK;IAACC,SAAS,EAAC;GAA9B,eACIJ,4BAAA,CAACC,QAAQ,CAACI,OAAV,MAAA,EACK,CAAC;IACE,MAAMC,eAAe,GAAGd,SAAS,CAACC,SAAD,EAAYF,KAAZ,CAAjC;;IAEA,oBACIS,4BAAA,OAAA;MACII,SAAS,EAAEG,UAAU,CAAC,eAAD,EAAkB;QAAET;OAApB;MACrBU,KAAK,EAAE;QACHF,eAAe,EAAEhB,aAAa,CAACgB,eAAD,CAAb,GACXA,eAAe,CAACf,KADL,GAEXe;;KALd,eAQIN,4BAAA,OAAA;MAAMI,SAAS,EAAC;KAAhB,CARJ,CADJ;GAHH,GADL,CADJ,eAmBIJ,4BAAA,CAACC,QAAQ,CAACQ,IAAV,MAAA,eACIT,4BAAA,MAAA;IAAKI,SAAS,EAAC;GAAf,EACKX,SAAS,CAACiB,MAAV,CAAoC,CAACC,KAAD,EAAQC,YAAR,EAAsBC,YAAtB;IACjCF,KAAK,CAACG,IAAN,eACId,4BAAA,CAACe,SAAD;MACIC,QAAQ,EACJzB,KAAK,IAAIE,SAAS,CAACG,MAAnB,GACMiB,YAAY,KAAK,CADvB,GAEMA,YAAY,KAAKtB;MAE3B0B,GAAG,EAAEJ;MACLtB,KAAK,EACDD,aAAa,CAACsB,YAAD,CAAb,GAA8BA,YAAY,CAACrB,KAA3C,GAAmDqB;MAEvDlB,UAAU,EAAEmB;MACZK,OAAO,EAAEnB;MACToB,OAAO,EAAE7B,aAAa,CAACsB,YAAD,CAAb,GAA8BA,YAAY,CAACQ,IAA3C,GAAkD;KAZ/D,CADJ;IAgBA,OAAOT,KAAP;GAjBH,EAkBE,EAlBF,CADL,CADJ,CAnBJ,CADJ;AA6CH;;AACDd,WAAW,CAACwB,WAAZ,GAA0B,aAA1B;;AAUA,SAASN,SAAT,CAAmB;EAAExB,KAAF;EAASG,UAAT;EAAqBsB,QAArB;EAA+BE,OAA/B;EAAwCC;AAAxC,CAAnB;EACI,MAAMG,IAAI,gBACNtB,4BAAA,OAAA;IACII,SAAS,EAAE,yBAAyBY,QAAQ,GAAG,SAAH,GAAe,EAAhD;IACXR,KAAK,EAAE;MAAEF,eAAe,EAAEf;;IAC1B2B,OAAO,EAAE,MAAMA,OAAN,oBAAMA,OAAO,CAAGxB,UAAH;GAH1B,eAKIM,4BAAA,OAAA;IAAMI,SAAS,EAAC;GAAhB,CALJ,CADJ;EAUA,OAAOe,OAAO,gBAAGnB,4BAAA,CAACuB,OAAD;IAASC,OAAO,EAAEL;GAAlB,EAA4BG,IAA5B,CAAH,GAAiDA,IAA/D;AACH;;AACDP,SAAS,CAACM,WAAV,GAAwB,WAAxB;;;;"}
+{"version":3,"file":"color-picker.js","sources":["../../../src/components/color-picker/color-picker.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\n\nimport DeprecatedDropdown from '../deprecated-dropdown'\nimport { Tooltip } from '../tooltip'\n\nimport './color-picker.less'\n\ntype NamedColor = { name: string; color: string }\n\nconst COLORS = [\n    '#606060',\n    '#4A90E2',\n    '#03B3B2',\n    '#008299',\n    '#82BA00',\n    '#D24726',\n    '#AC193D',\n    '#DC4FAD',\n    '#3BD5FB',\n    '#74E8D3',\n    '#FFCC00',\n    '#FB886E',\n    '#CCCCCC',\n]\n\nconst _isNamedColor = (color: string | NamedColor | undefined): color is NamedColor =>\n    typeof color !== 'string'\n\nconst _getColor = (colorList: (string | NamedColor)[], colorIndex: number) => {\n    const index = colorIndex >= colorList.length ? 0 : colorIndex\n    return colorList[index]\n}\n\ntype Props = {\n    small?: boolean\n    color?: number\n    onChange?: (color: number) => void\n    colorList?: (string | NamedColor)[]\n}\n\nfunction ColorPicker({ color = 0, small, onChange, colorList = COLORS }: Props) {\n    return (\n        <DeprecatedDropdown.Box right className=\"reactist_color_picker\">\n            <DeprecatedDropdown.Trigger>\n                {(() => {\n                    const backgroundColor = _getColor(colorList, color)\n\n                    return (\n                        <span\n                            className={classnames('color_trigger', { small })}\n                            style={{\n                                backgroundColor: _isNamedColor(backgroundColor)\n                                    ? backgroundColor.color\n                                    : backgroundColor,\n                            }}\n                        >\n                            <span className=\"color_trigger--inner_ring\" />\n                        </span>\n                    )\n                })()}\n            </DeprecatedDropdown.Trigger>\n            <DeprecatedDropdown.Body>\n                <div className=\"color_options\">\n                    {colorList.reduce<React.ReactNode[]>((items, currentColor, currentIndex) => {\n                        items.push(\n                            <ColorItem\n                                isActive={\n                                    color >= colorList.length\n                                        ? currentIndex === 0\n                                        : currentIndex === color\n                                }\n                                key={currentIndex}\n                                color={\n                                    _isNamedColor(currentColor) ? currentColor.color : currentColor\n                                }\n                                colorIndex={currentIndex}\n                                onClick={onChange}\n                                tooltip={_isNamedColor(currentColor) ? currentColor.name : null}\n                            />,\n                        )\n                        return items\n                    }, [])}\n                </div>\n            </DeprecatedDropdown.Body>\n        </DeprecatedDropdown.Box>\n    )\n}\nColorPicker.displayName = 'ColorPicker'\n\ntype ColorItemProps = {\n    color: string\n    colorIndex: number\n    isActive?: boolean\n    onClick?: (colorIndex: number) => void\n    tooltip?: React.ReactNode\n}\n\nfunction ColorItem({ color, colorIndex, isActive, onClick, tooltip }: ColorItemProps) {\n    const item = (\n        <span\n            className={'reactist color_item' + (isActive ? ' active' : '')}\n            style={{ backgroundColor: color }}\n            onClick={() => onClick?.(colorIndex)}\n        >\n            <span className=\"color_item--inner_ring\" />\n        </span>\n    )\n\n    return tooltip ? <Tooltip content={tooltip}>{item}</Tooltip> : item\n}\nColorItem.displayName = 'ColorItem'\n\nexport { ColorPicker, ColorItem, COLORS }\n"],"names":["COLORS","_isNamedColor","color","_getColor","colorList","colorIndex","index","length","ColorPicker","small","onChange","React","DeprecatedDropdown","Box","right","className","Trigger","backgroundColor","classnames","style","Body","reduce","items","currentColor","currentIndex","push","ColorItem","isActive","key","onClick","tooltip","name","displayName","item","Tooltip","content"],"mappings":";;;;;MAUMA,MAAM,GAAG,CACX,SADW,EAEX,SAFW,EAGX,SAHW,EAIX,SAJW,EAKX,SALW,EAMX,SANW,EAOX,SAPW,EAQX,SARW,EASX,SATW,EAUX,SAVW,EAWX,SAXW,EAYX,SAZW,EAaX,SAbW;;AAgBf,MAAMC,aAAa,GAAIC,KAAD,IAClB,OAAOA,KAAP,KAAiB,QADrB;;AAGA,MAAMC,SAAS,GAAG,CAACC,SAAD,EAAqCC,UAArC;EACd,MAAMC,KAAK,GAAGD,UAAU,IAAID,SAAS,CAACG,MAAxB,GAAiC,CAAjC,GAAqCF,UAAnD;EACA,OAAOD,SAAS,CAACE,KAAD,CAAhB;AACH,CAHD;;AAYA,SAASE,WAAT,CAAqB;EAAEN,KAAK,GAAG,CAAV;EAAaO,KAAb;EAAoBC,QAApB;EAA8BN,SAAS,GAAGJ;AAA1C,CAArB;EACI,oBACIW,4BAAA,CAACC,kBAAkB,CAACC,GAApB;IAAwBC,KAAK;IAACC,SAAS,EAAC;GAAxC,eACIJ,4BAAA,CAACC,kBAAkB,CAACI,OAApB,MAAA,EACK,CAAC;IACE,MAAMC,eAAe,GAAGd,SAAS,CAACC,SAAD,EAAYF,KAAZ,CAAjC;;IAEA,oBACIS,4BAAA,OAAA;MACII,SAAS,EAAEG,UAAU,CAAC,eAAD,EAAkB;QAAET;OAApB;MACrBU,KAAK,EAAE;QACHF,eAAe,EAAEhB,aAAa,CAACgB,eAAD,CAAb,GACXA,eAAe,CAACf,KADL,GAEXe;;KALd,eAQIN,4BAAA,OAAA;MAAMI,SAAS,EAAC;KAAhB,CARJ,CADJ;GAHH,GADL,CADJ,eAmBIJ,4BAAA,CAACC,kBAAkB,CAACQ,IAApB,MAAA,eACIT,4BAAA,MAAA;IAAKI,SAAS,EAAC;GAAf,EACKX,SAAS,CAACiB,MAAV,CAAoC,CAACC,KAAD,EAAQC,YAAR,EAAsBC,YAAtB;IACjCF,KAAK,CAACG,IAAN,eACId,4BAAA,CAACe,SAAD;MACIC,QAAQ,EACJzB,KAAK,IAAIE,SAAS,CAACG,MAAnB,GACMiB,YAAY,KAAK,CADvB,GAEMA,YAAY,KAAKtB;MAE3B0B,GAAG,EAAEJ;MACLtB,KAAK,EACDD,aAAa,CAACsB,YAAD,CAAb,GAA8BA,YAAY,CAACrB,KAA3C,GAAmDqB;MAEvDlB,UAAU,EAAEmB;MACZK,OAAO,EAAEnB;MACToB,OAAO,EAAE7B,aAAa,CAACsB,YAAD,CAAb,GAA8BA,YAAY,CAACQ,IAA3C,GAAkD;KAZ/D,CADJ;IAgBA,OAAOT,KAAP;GAjBH,EAkBE,EAlBF,CADL,CADJ,CAnBJ,CADJ;AA6CH;;AACDd,WAAW,CAACwB,WAAZ,GAA0B,aAA1B;;AAUA,SAASN,SAAT,CAAmB;EAAExB,KAAF;EAASG,UAAT;EAAqBsB,QAArB;EAA+BE,OAA/B;EAAwCC;AAAxC,CAAnB;EACI,MAAMG,IAAI,gBACNtB,4BAAA,OAAA;IACII,SAAS,EAAE,yBAAyBY,QAAQ,GAAG,SAAH,GAAe,EAAhD;IACXR,KAAK,EAAE;MAAEF,eAAe,EAAEf;;IAC1B2B,OAAO,EAAE,MAAMA,OAAN,oBAAMA,OAAO,CAAGxB,UAAH;GAH1B,eAKIM,4BAAA,OAAA;IAAMI,SAAS,EAAC;GAAhB,CALJ,CADJ;EAUA,OAAOe,OAAO,gBAAGnB,4BAAA,CAACuB,OAAD;IAASC,OAAO,EAAEL;GAAlB,EAA4BG,IAA5B,CAAH,GAAiDA,IAA/D;AACH;;AACDP,SAAS,CAACM,WAAV,GAAwB,WAAxB;;;;"}

package/es/components/deprecated-dropdown/dropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown.js","sources":["../../../src/components/deprecated-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","React","Component","constructor","props","context","_timeout","_handleClickOutside","event","dropdownDOMNode","ReactDOM","findDOMNode","contains","target","_toggleShowBody","allowBodyInteractions","setTimeout","state","showBody","onShowBody","document","addEventListener","onHideBody","removeEventListener","setState","_setPosition","body","scrollingParent","getElementById","scrolling_parent","dropdown","dropdownVerticalPosition","offsetTop","dropdownTrigger","querySelector","dropdownTriggerHeight","clientHeight","dropdownBodyHeight","scrollingParentHeight","scrollingParentOffset","scrollTop","bottomOffset","top","undefined","componentWillUnmount","clearTimeout","_getTriggerComponent","_trigger","children","cloneElement","onClick","_getBodyComponent","right","setPosition","className","classNames","body_wrapper","with_arrow","bottom","contentMarkup","style","position","render","display","displayName","Trigger","forwardRef","ref","tooltip","handleClick","preventDefault","stopPropagation","Button","Body","left","id","Dropdown"],"mappings":"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"}

package/es/components/deprecated-input/input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.js","sources":["../../../src/components/deprecated-input/input.tsx"],"sourcesContent":["import React from 'react'\nimport classNames from 'classnames'\n\nimport './input.less'\n\ntype InputProps = {\n    /** Additional css class applied to the input. */\n    className?: string\n    ref?: React.Ref<HTMLInputElement>\n}\n\ntype Props = InputProps & React.InputHTMLAttributes<HTMLInputElement>\n\nconst Input: React.FC<React.PropsWithRef<Props>> = React.forwardRef(\n    (props: Props, ref: React.Ref<HTMLInputElement>) => {\n        const className = classNames('reactist_input', props.className)\n        return <input {...props} className={className} ref={ref} />\n    },\n)\nInput.displayName = 'Input'\n\nexport { Input }\n"],"names":["Input","React","forwardRef","props","ref","className","classNames","displayName"],"mappings":";;;;MAaMA,KAAK,gBAAwCC,cAAK,CAACC,UAAN,CAC/C,CAACC,KAAD,EAAeC,GAAf;EACI,MAAMC,SAAS,GAAGC,UAAU,CAAC,gBAAD,EAAmBH,KAAK,CAACE,SAAzB,CAA5B;EACA,oBAAOJ,4BAAA,QAAA,oCAAWE,KAAX;IAAkBE,SAAS,EAAEA,SAA7B;IAAwCD,GAAG,EAAEA;KAApD;AACH,CAJ8C;AAMnDJ,KAAK,CAACO,WAAN,GAAoB,OAApB;;;;"}

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

@@ -0,0 +1 @@
+{"version":3,"file":"select.js","sources":["../../../src/components/deprecated-select/select.tsx"],"sourcesContent":["import React from 'react'\nimport classNames from 'classnames'\n\nimport './select.less'\n\ntype Option = {\n    /** Optional key for each option. If not provided `value` is used. */\n    key?: string | number\n    /** Value of the option. */\n    value: string | number\n    /** Text to display for the option. */\n    text?: string | number\n    /** Whether the options is disabled or not. */\n    disabled?: boolean\n}\n\ntype Props = {\n    className?: string\n    disabled?: boolean\n    /** Currently selected value. */\n    value?: string | number\n    /** Callback for the change event. Will be called with the next value (not the full event). */\n    onChange?: (value: string) => void\n    /** Options that are rendered in the select. */\n    options?: Option[]\n    /** Value to initially be set */\n    defaultValue?: string | number\n}\n\nfunction Select({\n    value,\n    options = [],\n    onChange,\n    disabled = true,\n    className = '',\n    defaultValue,\n    ...otherProps\n}: Props) {\n    const selectClassName = classNames('reactist_select', { disabled }, className)\n    return (\n        <select\n            className={selectClassName}\n            value={value}\n            onChange={(event) => (onChange ? onChange(event.target.value) : undefined)}\n            disabled={disabled}\n            defaultValue={defaultValue}\n            {...otherProps}\n        >\n            {options?.map((option) => (\n                <option\n                    key={option.key || option.value}\n                    value={option.value}\n                    disabled={option.disabled}\n                >\n                    {option.text}\n                </option>\n            ))}\n        </select>\n    )\n}\nSelect.displayName = 'Select'\nSelect.defaultProps = {\n    options: [],\n    disabled: false,\n}\n\nexport { Select }\n"],"names":["Select","value","options","onChange","disabled","className","defaultValue","otherProps","selectClassName","classNames","React","event","target","undefined","map","option","key","text","displayName","defaultProps"],"mappings":";;;;;;AA6BA,SAASA,MAAT;MAAgB;IACZC,KADY;IAEZC,OAAO,GAAG,EAFE;IAGZC,QAHY;IAIZC,QAAQ,GAAG,IAJC;IAKZC,SAAS,GAAG,EALA;IAMZC;;MACGC;;EAEH,MAAMC,eAAe,GAAGC,UAAU,CAAC,iBAAD,EAAoB;IAAEL;GAAtB,EAAkCC,SAAlC,CAAlC;EACA,oBACIK,4BAAA,SAAA;IACIL,SAAS,EAAEG,eADf;IAEIP,KAAK,EAAEA,KAFX;IAGIE,QAAQ,EAAGQ,KAAD,IAAYR,QAAQ,GAAGA,QAAQ,CAACQ,KAAK,CAACC,MAAN,CAAaX,KAAd,CAAX,GAAkCY,SAHpE;IAIIT,QAAQ,EAAEA,QAJd;IAKIE,YAAY,EAAEA;KACVC,UANR,GAQKL,OARL,oBAQKA,OAAO,CAAEY,GAAT,CAAcC,MAAD,iBACVL,4BAAA,SAAA;IACIM,GAAG,EAAED,MAAM,CAACC,GAAP,IAAcD,MAAM,CAACd;IAC1BA,KAAK,EAAEc,MAAM,CAACd;IACdG,QAAQ,EAAEW,MAAM,CAACX;GAHrB,EAKKW,MAAM,CAACE,IALZ,CADH,CARL,CADJ;AAoBH;;AACDjB,MAAM,CAACkB,WAAP,GAAqB,QAArB;AACAlB,MAAM,CAACmB,YAAP,GAAsB;EAClBjB,OAAO,EAAE,EADS;EAElBE,QAAQ,EAAE;AAFQ,CAAtB;;;;"}

package/es/index.js

@@ -24,21 +24,17 @@ export { usePrevious } from './hooks/use-previous/use-previous.js';
 export { Tab, TabAwareSlot, TabList, TabPanel, Tabs } from './new-components/tabs/tabs.js';
 export { Modal, ModalActions, ModalBody, ModalCloseButton, ModalFooter, ModalHeader } from './new-components/modal/modal.js';
 export { Avatar } from './new-components/avatar/avatar.js';
-export { default as Checkbox } from './components/checkbox/index.js';
 export { default as DeprecatedButton } from './components/deprecated-button/index.js';
-export { default as Dropdown } from './components/dropdown/index.js';
+export { default as DeprecatedDropdown } from './components/deprecated-dropdown/index.js';
 export { COLORS } from './components/color-picker/color-picker.js';
 export { default as ColorPicker } from './components/color-picker/index.js';
-export { default as Input } from './components/input/index.js';
 export { default as KeyboardShortcut } from './components/keyboard-shortcut/index.js';
 export { SUPPORTED_KEYS } from './components/key-capturer/key-capturer.js';
 export { default as KeyCapturer } from './components/key-capturer/index.js';
-export { default as Popover } from './components/popover/index.js';
 export { default as ProgressBar } from './components/progress-bar/index.js';
-export { default as Select } from './components/select/index.js';
 export { default as Time } from './components/time/index.js';
 export { Notification } from './components/notification/notification.js';
 export { Menu, MenuButton, MenuGroup, MenuItem, MenuList, SubMenu } from './components/menu/menu.js';
-export { default as DeprecatedModal } from './components/deprecated-modal/index.js';
-export { Loading as DeprecatedLoading } from './components/deprecated-loading/deprecated-loading.js';
+export { default as DeprecatedInput } from './components/deprecated-input/index.js';
+export { default as DeprecatedSelect } from './components/deprecated-select/index.js';
 //# sourceMappingURL=index.js.map

package/es/index.js.map

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

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

@@ -6,7 +6,7 @@ import { Tooltip } from '../../components/tooltip/tooltip.js';
 import { Spinner } from '../spinner/spinner.js';
 import styles from './base-button.module.css.js';
 
-const _excluded = ["as", "variant", "tone", "size", "disabled", "loading", "tooltip", "tooltipGapSize", "onClick", "exceptionallySetClassName", "children", "startIcon", "endIcon", "icon", "width", "align"];
+const _excluded = ["as", "variant", "tone", "size", "shape", "disabled", "loading", "tooltip", "onClick", "exceptionallySetClassName", "children", "startIcon", "endIcon", "icon", "width", "align"];
 
 function preventDefault(event) {
   event.preventDefault();
@@ -26,10 +26,10 @@ const BaseButton = /*#__PURE__*/polymorphicComponent(function BaseButton(_ref, r
     variant,
     tone = 'normal',
     size = 'normal',
+    shape = 'normal',
     disabled = false,
     loading = false,
     tooltip,
-    tooltipGapSize,
     onClick,
     exceptionallySetClassName,
     children,
@@ -37,7 +37,7 @@ const BaseButton = /*#__PURE__*/polymorphicComponent(function BaseButton(_ref, r
     endIcon,
     icon,
     width = 'auto',
-    align
+    align = 'center'
   } = _ref,
       props = _objectWithoutProperties(_ref, _excluded);
 
@@ -48,23 +48,26 @@ const BaseButton = /*#__PURE__*/polymorphicComponent(function BaseButton(_ref, r
     "aria-disabled": isDisabled,
     onClick: isDisabled ? preventDefault : onClick,
     width: icon ? undefined : width,
-    className: [exceptionallySetClassName, styles.baseButton, styles["variant-" + variant], styles["tone-" + tone], styles["size-" + size], width !== 'auto' && icon == null && align != null ? styles["align-" + align] : null, icon ? styles.iconButton : null, disabled ? styles.disabled : null]
+    className: [exceptionallySetClassName, styles.baseButton, styles["variant-" + variant], styles["tone-" + tone], styles["size-" + size], shape === 'rounded' ? styles['shape-rounded'] : null, icon ? styles.iconButton : null, disabled ? styles.disabled : null]
   }), icon ? loading && /*#__PURE__*/createElement(Spinner, null) || icon : /*#__PURE__*/createElement(Fragment, null, startIcon ? /*#__PURE__*/createElement(Box, {
     display: "flex",
     className: styles.startIcon,
     "aria-hidden": true
-  }, loading && !endIcon ? /*#__PURE__*/createElement(Spinner, null) : startIcon) : null, children ? /*#__PURE__*/createElement("span", {
-    className: styles.label
+  }, loading && !endIcon ? /*#__PURE__*/createElement(Spinner, null) : startIcon) : null, children ? /*#__PURE__*/createElement(Box, {
+    as: "span",
+    className: styles.label,
+    overflow: "hidden",
+    width: width === 'full' ? 'full' : undefined,
+    textAlign: width === 'auto' ? 'center' : align
   }, children) : null, endIcon || loading && !startIcon ? /*#__PURE__*/createElement(Box, {
     display: "flex",
     className: styles.endIcon,
     "aria-hidden": true
   }, loading ? /*#__PURE__*/createElement(Spinner, null) : endIcon) : null)); // If it's an icon-only button, make sure it uses the aria-label as tooltip if no tooltip was provided
 
-  const tooltipContent = icon ? tooltip != null ? tooltip : props['aria-label'] : tooltip;
+  const tooltipContent = icon && tooltip === undefined ? props['aria-label'] : tooltip;
   return tooltipContent ? /*#__PURE__*/createElement(Tooltip, {
-    content: tooltipContent,
-    gapSize: tooltipGapSize
+    content: tooltipContent
   }, buttonElement) : buttonElement;
 });
 

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

@@ -1 +1 @@
-{"version":3,"file":"base-button.js","sources":["../../../src/new-components/base-button/base-button.tsx"],"sourcesContent":["import * as React from 'react'\nimport { Tooltip, TooltipProps } from '../../components/tooltip'\nimport { polymorphicComponent } from '../../utils/polymorphism'\nimport { Box } from '../box'\nimport { Spinner } from '../spinner'\nimport styles from './base-button.module.css'\n\nfunction preventDefault(event: React.SyntheticEvent) {\n    event.preventDefault()\n}\n\ntype ButtonVariant = 'primary' | 'secondary' | 'tertiary' | 'quaternary'\ntype ButtonTone = 'normal' | 'destructive'\ntype ButtonSize = 'small' | 'normal' | 'large'\ntype IconElement = React.ReactChild\n\ntype CommonProps = {\n    /**\n     * The button's variant.\n     */\n    variant: ButtonVariant\n    /**\n     * The button's tone.\n     * @default 'normal'\n     */\n    tone?: ButtonTone\n    /**\n     * The button's size.\n     * @default 'normal'\n     */\n    size?: ButtonSize\n    /**\n     * Whether the button is disabled or not.\n     * @default false\n     */\n    disabled?: boolean\n    /**\n     * Whether the button is busy/loading.\n     *\n     * A button in this state is functionally and semantically disabled. Visually is does not look\n     * dimmed (as disabled buttons normally do), but it shows a loading spinner instead.\n     *\n     * @default false\n     */\n    loading?: boolean\n    /**\n     * A tooltip linked to the button element.\n     */\n    tooltip?: TooltipProps['content']\n    /**\n     * The distance between the button element and the linked tooltip.\n     */\n    tooltipGapSize?: TooltipProps['gapSize']\n}\n\ntype AlignmentProps = {\n    width: 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'full'\n    align?: 'start' | 'center' | 'end'\n}\n\ntype AutoWidthProps = {\n    width?: 'auto'\n    align?: never\n}\n\ntype IconButtonProps = {\n    icon: IconElement\n    'aria-label': string\n    children?: never\n    startIcon?: never\n    endIcon?: never\n    width?: never\n    align?: never\n}\n\ntype LabelledButtonProps = {\n    children: NonNullable<React.ReactNode>\n    startIcon?: IconElement\n    endIcon?: IconElement\n    icon?: never\n} & (AutoWidthProps | AlignmentProps)\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 * @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        tooltipGapSize,\n        onClick,\n        exceptionallySetClassName,\n        children,\n        startIcon,\n        endIcon,\n        icon,\n        width = 'auto',\n        align,\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            width={icon ? undefined : width}\n            className={[\n                exceptionallySetClassName,\n                styles.baseButton,\n                styles[`variant-${variant}`],\n                styles[`tone-${tone}`],\n                styles[`size-${size}`],\n                width !== 'auto' && icon == null && align != null ? styles[`align-${align}`] : null,\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} gapSize={tooltipGapSize}>\n            {buttonElement}\n        </Tooltip>\n    ) : (\n        buttonElement\n    )\n})\n"],"names":["preventDefault","event","BaseButton","polymorphicComponent","ref","as","variant","tone","size","disabled","loading","tooltip","tooltipGapSize","onClick","exceptionallySetClassName","children","startIcon","endIcon","icon","width","align","props","isDisabled","buttonElement","React","Box","undefined","className","styles","baseButton","iconButton","Spinner","display","label","tooltipContent","Tooltip","content","gapSize"],"mappings":";;;;;;;;;;AAOA,SAASA,cAAT,CAAwBC,KAAxB;EACIA,KAAK,CAACD,cAAN;AACH;AA2ED;;;;;;;;;MAOaE,UAAU,gBAAGC,oBAAoB,CAAyB,SAASD,UAAT,OAoBnEE,GApBmE;MACnE;IACIC,EAAE,GAAG,KADT;IAEIC,OAFJ;IAGIC,IAAI,GAAG,QAHX;IAIIC,IAAI,GAAG,QAJX;IAKIC,QAAQ,GAAG,KALf;IAMIC,OAAO,GAAG,KANd;IAOIC,OAPJ;IAQIC,cARJ;IASIC,OATJ;IAUIC,yBAVJ;IAWIC,QAXJ;IAYIC,SAZJ;IAaIC,OAbJ;IAcIC,IAdJ;IAeIC,KAAK,GAAG,MAfZ;IAgBIC;;MACGC;;EAIP,MAAMC,UAAU,GAAGZ,OAAO,IAAID,QAA9B;EACA,MAAMc,aAAa,gBACfC,aAAA,CAACC,GAAD,oCACQJ,KADR;IAEIhB,EAAE,EAAEA,EAFR;IAGID,GAAG,EAAEA,GAHT;qBAImBkB,UAJnB;IAKIT,OAAO,EAAES,UAAU,GAAGtB,cAAH,GAAoBa,OAL3C;IAMIM,KAAK,EAAED,IAAI,GAAGQ,SAAH,GAAeP,KAN9B;IAOIQ,SAAS,EAAE,CACPb,yBADO,EAEPc,MAAM,CAACC,UAFA,EAGPD,MAAM,cAAYtB,OAAZ,CAHC,EAIPsB,MAAM,WAASrB,IAAT,CAJC,EAKPqB,MAAM,WAASpB,IAAT,CALC,EAMPW,KAAK,KAAK,MAAV,IAAoBD,IAAI,IAAI,IAA5B,IAAoCE,KAAK,IAAI,IAA7C,GAAoDQ,MAAM,YAAUR,KAAV,CAA1D,GAA+E,IANxE,EAOPF,IAAI,GAAGU,MAAM,CAACE,UAAV,GAAuB,IAPpB,EAQPrB,QAAQ,GAAGmB,MAAM,CAACnB,QAAV,GAAqB,IARtB;MAWVS,IAAI,GACAR,OAAO,iBAAIc,aAAA,CAACO,OAAD,MAAA,CAAZ,IAA4Bb,IAD3B,gBAGDM,aAAA,SAAA,MAAA,EACKR,SAAS,gBACNQ,aAAA,CAACC,GAAD;IAAKO,OAAO,EAAC;IAAOL,SAAS,EAAEC,MAAM,CAACZ;;GAAtC,EACKN,OAAO,IAAI,CAACO,OAAZ,gBAAsBO,aAAA,CAACO,OAAD,MAAA,CAAtB,GAAoCf,SADzC,CADM,GAIN,IALR,EAMKD,QAAQ,gBAAGS,aAAA,OAAA;IAAMG,SAAS,EAAEC,MAAM,CAACK;GAAxB,EAAgClB,QAAhC,CAAH,GAAsD,IANnE,EAOKE,OAAO,IAAKP,OAAO,IAAI,CAACM,SAAxB,gBACGQ,aAAA,CAACC,GAAD;IAAKO,OAAO,EAAC;IAAOL,SAAS,EAAEC,MAAM,CAACX;;GAAtC,EACKP,OAAO,gBAAGc,aAAA,CAACO,OAAD,MAAA,CAAH,GAAiBd,OAD7B,CADH,GAIG,IAXR,CArBR,CADJ;;EAwCA,MAAMiB,cAAc,GAAGhB,IAAI,GAAGP,OAAH,WAAGA,OAAH,GAAcU,KAAK,CAAC,YAAD,CAAnB,GAAoCV,OAA/D;EACA,OAAOuB,cAAc,gBACjBV,aAAA,CAACW,OAAD;IAASC,OAAO,EAAEF;IAAgBG,OAAO,EAAEzB;GAA3C,EACKW,aADL,CADiB,GAKjBA,aALJ;AAOH,CAvE6C;;;;"}
+{"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    /**\n     * The button's tone.\n     * @default 'normal'\n     */\n    tone?: ButtonTone\n\n    /**\n     * The button's size.\n     * @default 'normal'\n     */\n    size?: ButtonSize\n\n    /**\n     * Controls the shape of the button. Specifically, it allows to make it have slightly curved\n     * corners (the default) vs. having them fully curved to the point that they are as round as\n     * possible. In icon-only buttons this allows to have the button be circular.\n     * @default 'normal'\n     */\n    shape?: 'normal' | 'rounded'\n\n    /**\n     * Whether the button is disabled or not.\n     * @default false\n     */\n    disabled?: boolean\n\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    /**\n     * A tooltip linked to the button element.\n     */\n    tooltip?: TooltipProps['content']\n}\n\ntype AlignmentProps = {\n    width: 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'full'\n    align?: 'start' | 'center' | 'end'\n}\n\ntype AutoWidthProps = {\n    width?: 'auto'\n    align?: never\n}\n\ntype IconButtonProps = {\n    icon: IconElement\n    'aria-label': string\n    children?: never\n    startIcon?: never\n    endIcon?: never\n    width?: never\n    align?: never\n}\n\ntype LabelledButtonProps = {\n    children: NonNullable<React.ReactNode>\n    startIcon?: IconElement\n    endIcon?: IconElement\n    icon?: never\n} & (AutoWidthProps | AlignmentProps)\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 * @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        shape = 'normal',\n        disabled = false,\n        loading = false,\n        tooltip,\n        onClick,\n        exceptionallySetClassName,\n        children,\n        startIcon,\n        endIcon,\n        icon,\n        width = 'auto',\n        align = 'center',\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            width={icon ? undefined : width}\n            className={[\n                exceptionallySetClassName,\n                styles.baseButton,\n                styles[`variant-${variant}`],\n                styles[`tone-${tone}`],\n                styles[`size-${size}`],\n                shape === 'rounded' ? styles['shape-rounded'] : null,\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 ? (\n                        <Box\n                            as=\"span\"\n                            className={styles.label}\n                            overflow=\"hidden\"\n                            width={width === 'full' ? 'full' : undefined}\n                            textAlign={width === 'auto' ? 'center' : align}\n                        >\n                            {children}\n                        </Box>\n                    ) : 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 === undefined ? props['aria-label'] : tooltip\n    return tooltipContent ? (\n        <Tooltip content={tooltipContent}>{buttonElement}</Tooltip>\n    ) : (\n        buttonElement\n    )\n})\n"],"names":["preventDefault","event","BaseButton","polymorphicComponent","ref","as","variant","tone","size","shape","disabled","loading","tooltip","onClick","exceptionallySetClassName","children","startIcon","endIcon","icon","width","align","props","isDisabled","buttonElement","React","Box","undefined","className","styles","baseButton","iconButton","Spinner","display","label","overflow","textAlign","tooltipContent","Tooltip","content"],"mappings":";;;;;;;;;;AAOA,SAASA,cAAT,CAAwBC,KAAxB;EACIA,KAAK,CAACD,cAAN;AACH;AAoFD;;;;;;;;;MAOaE,UAAU,gBAAGC,oBAAoB,CAAyB,SAASD,UAAT,OAoBnEE,GApBmE;MACnE;IACIC,EAAE,GAAG,KADT;IAEIC,OAFJ;IAGIC,IAAI,GAAG,QAHX;IAIIC,IAAI,GAAG,QAJX;IAKIC,KAAK,GAAG,QALZ;IAMIC,QAAQ,GAAG,KANf;IAOIC,OAAO,GAAG,KAPd;IAQIC,OARJ;IASIC,OATJ;IAUIC,yBAVJ;IAWIC,QAXJ;IAYIC,SAZJ;IAaIC,OAbJ;IAcIC,IAdJ;IAeIC,KAAK,GAAG,MAfZ;IAgBIC,KAAK,GAAG;;MACLC;;EAIP,MAAMC,UAAU,GAAGX,OAAO,IAAID,QAA9B;EACA,MAAMa,aAAa,gBACfC,aAAA,CAACC,GAAD,oCACQJ,KADR;IAEIhB,EAAE,EAAEA,EAFR;IAGID,GAAG,EAAEA,GAHT;qBAImBkB,UAJnB;IAKIT,OAAO,EAAES,UAAU,GAAGtB,cAAH,GAAoBa,OAL3C;IAMIM,KAAK,EAAED,IAAI,GAAGQ,SAAH,GAAeP,KAN9B;IAOIQ,SAAS,EAAE,CACPb,yBADO,EAEPc,MAAM,CAACC,UAFA,EAGPD,MAAM,cAAYtB,OAAZ,CAHC,EAIPsB,MAAM,WAASrB,IAAT,CAJC,EAKPqB,MAAM,WAASpB,IAAT,CALC,EAMPC,KAAK,KAAK,SAAV,GAAsBmB,MAAM,CAAC,eAAD,CAA5B,GAAgD,IANzC,EAOPV,IAAI,GAAGU,MAAM,CAACE,UAAV,GAAuB,IAPpB,EAQPpB,QAAQ,GAAGkB,MAAM,CAAClB,QAAV,GAAqB,IARtB;MAWVQ,IAAI,GACAP,OAAO,iBAAIa,aAAA,CAACO,OAAD,MAAA,CAAZ,IAA4Bb,IAD3B,gBAGDM,aAAA,SAAA,MAAA,EACKR,SAAS,gBACNQ,aAAA,CAACC,GAAD;IAAKO,OAAO,EAAC;IAAOL,SAAS,EAAEC,MAAM,CAACZ;;GAAtC,EACKL,OAAO,IAAI,CAACM,OAAZ,gBAAsBO,aAAA,CAACO,OAAD,MAAA,CAAtB,GAAoCf,SADzC,CADM,GAIN,IALR,EAMKD,QAAQ,gBACLS,aAAA,CAACC,GAAD;IACIpB,EAAE,EAAC;IACHsB,SAAS,EAAEC,MAAM,CAACK;IAClBC,QAAQ,EAAC;IACTf,KAAK,EAAEA,KAAK,KAAK,MAAV,GAAmB,MAAnB,GAA4BO;IACnCS,SAAS,EAAEhB,KAAK,KAAK,MAAV,GAAmB,QAAnB,GAA8BC;GAL7C,EAOKL,QAPL,CADK,GAUL,IAhBR,EAiBKE,OAAO,IAAKN,OAAO,IAAI,CAACK,SAAxB,gBACGQ,aAAA,CAACC,GAAD;IAAKO,OAAO,EAAC;IAAOL,SAAS,EAAEC,MAAM,CAACX;;GAAtC,EACKN,OAAO,gBAAGa,aAAA,CAACO,OAAD,MAAA,CAAH,GAAiBd,OAD7B,CADH,GAIG,IArBR,CArBR,CADJ;;EAkDA,MAAMmB,cAAc,GAAGlB,IAAI,IAAIN,OAAO,KAAKc,SAApB,GAAgCL,KAAK,CAAC,YAAD,CAArC,GAAsDT,OAA7E;EACA,OAAOwB,cAAc,gBACjBZ,aAAA,CAACa,OAAD;IAASC,OAAO,EAAEF;GAAlB,EAAmCb,aAAnC,CADiB,GAGjBA,aAHJ;AAKH,CA/E6C;;;;"}

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

@@ -1,4 +1,4 @@
-var modules_b9569bce = {"baseButton":"_7a2031d6","label":"_09c23660","align-start":"dd82f17a","align-center":"_8a9315ae","align-end":"_6acb4219","size-small":"_1e48abcb","size-normal":"_949f7858","size-large":"_34ac3da9","disabled":"_7e5800ce","iconButton":"_1bdc5d38","startIcon":"_270d7bdf","endIcon":"_471c6e23","variant-primary":"a878a9a4","variant-secondary":"_81c213d2","variant-tertiary":"_12f96f70","variant-quaternary":"_8c546508","tone-destructive":"_441a7e3a"};
+var modules_b9569bce = {"baseButton":"a8af2163","label":"bbdb467b","shape-rounded":"ca02fc07","size-small":"_45ffe137","size-normal":"_352995bd","size-large":"_3991076f","disabled":"f82232b7","iconButton":"ef4c88db","startIcon":"a08c25c7","endIcon":"_2f6adc11","variant-primary":"_3d1243b2","variant-secondary":"_16b6b062","variant-tertiary":"cffaea5e","variant-quaternary":"_98cd5c3f","tone-destructive":"_99cb1c4d"};
 
 export default modules_b9569bce;
 //# sourceMappingURL=base-button.module.css.js.map

package/lib/components/color-picker/color-picker.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 o=e(require("react")),t=e(require("classnames")),r=require("../tooltip/tooltip.js"),l=require("../dropdown/index.js");const n=["#606060","#4A90E2","#03B3B2","#008299","#82BA00","#D24726","#AC193D","#DC4FAD","#3BD5FB","#74E8D3","#FFCC00","#FB886E","#CCCCCC"],c=e=>"string"!=typeof e;function a({color:e=0,small:r,onChange:a,colorList:s=n}){return o.createElement(l.default.Box,{right:!0,className:"reactist_color_picker"},o.createElement(l.default.Trigger,null,(()=>{const l=((e,o)=>e[o>=e.length?0:o])(s,e);return o.createElement("span",{className:t("color_trigger",{small:r}),style:{backgroundColor:c(l)?l.color:l}},o.createElement("span",{className:"color_trigger--inner_ring"}))})()),o.createElement(l.default.Body,null,o.createElement("div",{className:"color_options"},s.reduce((t,r,l)=>(t.push(o.createElement(i,{isActive:e>=s.length?0===l:l===e,key:l,color:c(r)?r.color:r,colorIndex:l,onClick:a,tooltip:c(r)?r.name:null})),t),[]))))}function i({color:e,colorIndex:t,isActive:l,onClick:n,tooltip:c}){const a=o.createElement("span",{className:"reactist color_item"+(l?" active":""),style:{backgroundColor:e},onClick:()=>null==n?void 0:n(t)},o.createElement("span",{className:"color_item--inner_ring"}));return c?o.createElement(r.Tooltip,{content:c},a):a}a.displayName="ColorPicker",i.displayName="ColorItem",exports.COLORS=n,exports.ColorItem=i,exports.ColorPicker=a;
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("react")),o=e(require("classnames")),r=require("../tooltip/tooltip.js"),l=require("../deprecated-dropdown/index.js");const n=["#606060","#4A90E2","#03B3B2","#008299","#82BA00","#D24726","#AC193D","#DC4FAD","#3BD5FB","#74E8D3","#FFCC00","#FB886E","#CCCCCC"],c=e=>"string"!=typeof e;function a({color:e=0,small:r,onChange:a,colorList:s=n}){return t.createElement(l.default.Box,{right:!0,className:"reactist_color_picker"},t.createElement(l.default.Trigger,null,(()=>{const l=((e,t)=>e[t>=e.length?0:t])(s,e);return t.createElement("span",{className:o("color_trigger",{small:r}),style:{backgroundColor:c(l)?l.color:l}},t.createElement("span",{className:"color_trigger--inner_ring"}))})()),t.createElement(l.default.Body,null,t.createElement("div",{className:"color_options"},s.reduce((o,r,l)=>(o.push(t.createElement(i,{isActive:e>=s.length?0===l:l===e,key:l,color:c(r)?r.color:r,colorIndex:l,onClick:a,tooltip:c(r)?r.name:null})),o),[]))))}function i({color:e,colorIndex:o,isActive:l,onClick:n,tooltip:c}){const a=t.createElement("span",{className:"reactist color_item"+(l?" active":""),style:{backgroundColor:e},onClick:()=>null==n?void 0:n(o)},t.createElement("span",{className:"color_item--inner_ring"}));return c?t.createElement(r.Tooltip,{content:c},a):a}a.displayName="ColorPicker",i.displayName="ColorItem",exports.COLORS=n,exports.ColorItem=i,exports.ColorPicker=a;
 //# sourceMappingURL=color-picker.js.map

package/lib/components/color-picker/color-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"color-picker.js","sources":["../../../src/components/color-picker/color-picker.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\n\nimport Dropdown from '../dropdown'\nimport { Tooltip } from '../tooltip'\n\nimport './color-picker.less'\n\ntype NamedColor = { name: string; color: string }\n\nconst COLORS = [\n    '#606060',\n    '#4A90E2',\n    '#03B3B2',\n    '#008299',\n    '#82BA00',\n    '#D24726',\n    '#AC193D',\n    '#DC4FAD',\n    '#3BD5FB',\n    '#74E8D3',\n    '#FFCC00',\n    '#FB886E',\n    '#CCCCCC',\n]\n\nconst _isNamedColor = (color: string | NamedColor | undefined): color is NamedColor =>\n    typeof color !== 'string'\n\nconst _getColor = (colorList: (string | NamedColor)[], colorIndex: number) => {\n    const index = colorIndex >= colorList.length ? 0 : colorIndex\n    return colorList[index]\n}\n\ntype Props = {\n    small?: boolean\n    color?: number\n    onChange?: (color: number) => void\n    colorList?: (string | NamedColor)[]\n}\n\nfunction ColorPicker({ color = 0, small, onChange, colorList = COLORS }: Props) {\n    return (\n        <Dropdown.Box right className=\"reactist_color_picker\">\n            <Dropdown.Trigger>\n                {(() => {\n                    const backgroundColor = _getColor(colorList, color)\n\n                    return (\n                        <span\n                            className={classnames('color_trigger', { small })}\n                            style={{\n                                backgroundColor: _isNamedColor(backgroundColor)\n                                    ? backgroundColor.color\n                                    : backgroundColor,\n                            }}\n                        >\n                            <span className=\"color_trigger--inner_ring\" />\n                        </span>\n                    )\n                })()}\n            </Dropdown.Trigger>\n            <Dropdown.Body>\n                <div className=\"color_options\">\n                    {colorList.reduce<React.ReactNode[]>((items, currentColor, currentIndex) => {\n                        items.push(\n                            <ColorItem\n                                isActive={\n                                    color >= colorList.length\n                                        ? currentIndex === 0\n                                        : currentIndex === color\n                                }\n                                key={currentIndex}\n                                color={\n                                    _isNamedColor(currentColor) ? currentColor.color : currentColor\n                                }\n                                colorIndex={currentIndex}\n                                onClick={onChange}\n                                tooltip={_isNamedColor(currentColor) ? currentColor.name : null}\n                            />,\n                        )\n                        return items\n                    }, [])}\n                </div>\n            </Dropdown.Body>\n        </Dropdown.Box>\n    )\n}\nColorPicker.displayName = 'ColorPicker'\n\ntype ColorItemProps = {\n    color: string\n    colorIndex: number\n    isActive?: boolean\n    onClick?: (colorIndex: number) => void\n    tooltip?: React.ReactNode\n}\n\nfunction ColorItem({ color, colorIndex, isActive, onClick, tooltip }: ColorItemProps) {\n    const item = (\n        <span\n            className={'reactist color_item' + (isActive ? ' active' : '')}\n            style={{ backgroundColor: color }}\n            onClick={() => onClick?.(colorIndex)}\n        >\n            <span className=\"color_item--inner_ring\" />\n        </span>\n    )\n\n    return tooltip ? <Tooltip content={tooltip}>{item}</Tooltip> : item\n}\nColorItem.displayName = 'ColorItem'\n\nexport { ColorPicker, ColorItem, COLORS }\n"],"names":["COLORS","_isNamedColor","color","ColorPicker","small","onChange","colorList","React","Dropdown","Box","right","className","Trigger","backgroundColor","colorIndex","length","_getColor","classnames","style","Body","reduce","items","currentColor","currentIndex","push","ColorItem","isActive","key","onClick","tooltip","name","item","Tooltip","content","displayName"],"mappings":"0QAUMA,EAAS,CACX,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,WAGEC,EAAiBC,GACF,iBAAVA,EAcX,SAASC,GAAYD,MAAEA,EAAQ,EAAVE,MAAaA,EAAbC,SAAoBA,EAApBC,UAA8BA,EAAYN,IAC3D,OACIO,gBAACC,UAASC,KAAIC,SAAMC,UAAU,yBAC1BJ,gBAACC,UAASI,aACL,MACG,MAAMC,EAjBR,EAACP,EAAoCQ,IAE5CR,EADOQ,GAAcR,EAAUS,OAAS,EAAID,GAgBXE,CAAUV,EAAWJ,GAE7C,OACIK,wBACII,UAAWM,EAAW,gBAAiB,CAAEb,MAAAA,IACzCc,MAAO,CACHL,gBAAiBZ,EAAcY,GACzBA,EAAgBX,MAChBW,IAGVN,wBAAMI,UAAU,gCAZ3B,IAiBLJ,gBAACC,UAASW,UACNZ,uBAAKI,UAAU,iBACVL,EAAUc,OAA0B,CAACC,EAAOC,EAAcC,KACvDF,EAAMG,KACFjB,gBAACkB,GACGC,SACIxB,GAASI,EAAUS,OACI,IAAjBQ,EACAA,IAAiBrB,EAE3ByB,IAAKJ,EACLrB,MACID,EAAcqB,GAAgBA,EAAapB,MAAQoB,EAEvDR,WAAYS,EACZK,QAASvB,EACTwB,QAAS5B,EAAcqB,GAAgBA,EAAaQ,KAAO,QAG5DT,GACR,OAgBvB,SAASI,GAAUvB,MAAEA,EAAFY,WAASA,EAATY,SAAqBA,EAArBE,QAA+BA,UAASC,IACvD,MAAME,EACFxB,wBACII,UAAW,uBAAyBe,EAAW,UAAY,IAC3DR,MAAO,CAAEL,gBAAiBX,GAC1B0B,QAAS,UAAMA,SAAAA,EAAUd,IAEzBP,wBAAMI,UAAU,4BAIxB,OAAOkB,EAAUtB,gBAACyB,WAAQC,QAASJ,GAAUE,GAAkBA,EArBnE5B,EAAY+B,YAAc,cAuB1BT,EAAUS,YAAc"}
+{"version":3,"file":"color-picker.js","sources":["../../../src/components/color-picker/color-picker.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\n\nimport DeprecatedDropdown from '../deprecated-dropdown'\nimport { Tooltip } from '../tooltip'\n\nimport './color-picker.less'\n\ntype NamedColor = { name: string; color: string }\n\nconst COLORS = [\n    '#606060',\n    '#4A90E2',\n    '#03B3B2',\n    '#008299',\n    '#82BA00',\n    '#D24726',\n    '#AC193D',\n    '#DC4FAD',\n    '#3BD5FB',\n    '#74E8D3',\n    '#FFCC00',\n    '#FB886E',\n    '#CCCCCC',\n]\n\nconst _isNamedColor = (color: string | NamedColor | undefined): color is NamedColor =>\n    typeof color !== 'string'\n\nconst _getColor = (colorList: (string | NamedColor)[], colorIndex: number) => {\n    const index = colorIndex >= colorList.length ? 0 : colorIndex\n    return colorList[index]\n}\n\ntype Props = {\n    small?: boolean\n    color?: number\n    onChange?: (color: number) => void\n    colorList?: (string | NamedColor)[]\n}\n\nfunction ColorPicker({ color = 0, small, onChange, colorList = COLORS }: Props) {\n    return (\n        <DeprecatedDropdown.Box right className=\"reactist_color_picker\">\n            <DeprecatedDropdown.Trigger>\n                {(() => {\n                    const backgroundColor = _getColor(colorList, color)\n\n                    return (\n                        <span\n                            className={classnames('color_trigger', { small })}\n                            style={{\n                                backgroundColor: _isNamedColor(backgroundColor)\n                                    ? backgroundColor.color\n                                    : backgroundColor,\n                            }}\n                        >\n                            <span className=\"color_trigger--inner_ring\" />\n                        </span>\n                    )\n                })()}\n            </DeprecatedDropdown.Trigger>\n            <DeprecatedDropdown.Body>\n                <div className=\"color_options\">\n                    {colorList.reduce<React.ReactNode[]>((items, currentColor, currentIndex) => {\n                        items.push(\n                            <ColorItem\n                                isActive={\n                                    color >= colorList.length\n                                        ? currentIndex === 0\n                                        : currentIndex === color\n                                }\n                                key={currentIndex}\n                                color={\n                                    _isNamedColor(currentColor) ? currentColor.color : currentColor\n                                }\n                                colorIndex={currentIndex}\n                                onClick={onChange}\n                                tooltip={_isNamedColor(currentColor) ? currentColor.name : null}\n                            />,\n                        )\n                        return items\n                    }, [])}\n                </div>\n            </DeprecatedDropdown.Body>\n        </DeprecatedDropdown.Box>\n    )\n}\nColorPicker.displayName = 'ColorPicker'\n\ntype ColorItemProps = {\n    color: string\n    colorIndex: number\n    isActive?: boolean\n    onClick?: (colorIndex: number) => void\n    tooltip?: React.ReactNode\n}\n\nfunction ColorItem({ color, colorIndex, isActive, onClick, tooltip }: ColorItemProps) {\n    const item = (\n        <span\n            className={'reactist color_item' + (isActive ? ' active' : '')}\n            style={{ backgroundColor: color }}\n            onClick={() => onClick?.(colorIndex)}\n        >\n            <span className=\"color_item--inner_ring\" />\n        </span>\n    )\n\n    return tooltip ? <Tooltip content={tooltip}>{item}</Tooltip> : item\n}\nColorItem.displayName = 'ColorItem'\n\nexport { ColorPicker, ColorItem, COLORS }\n"],"names":["COLORS","_isNamedColor","color","ColorPicker","small","onChange","colorList","React","DeprecatedDropdown","Box","right","className","Trigger","backgroundColor","colorIndex","length","_getColor","classnames","style","Body","reduce","items","currentColor","currentIndex","push","ColorItem","isActive","key","onClick","tooltip","name","item","Tooltip","content","displayName"],"mappings":"qRAUMA,EAAS,CACX,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,WAGEC,EAAiBC,GACF,iBAAVA,EAcX,SAASC,GAAYD,MAAEA,EAAQ,EAAVE,MAAaA,EAAbC,SAAoBA,EAApBC,UAA8BA,EAAYN,IAC3D,OACIO,gBAACC,UAAmBC,KAAIC,SAAMC,UAAU,yBACpCJ,gBAACC,UAAmBI,aACf,MACG,MAAMC,EAjBR,EAACP,EAAoCQ,IAE5CR,EADOQ,GAAcR,EAAUS,OAAS,EAAID,GAgBXE,CAAUV,EAAWJ,GAE7C,OACIK,wBACII,UAAWM,EAAW,gBAAiB,CAAEb,MAAAA,IACzCc,MAAO,CACHL,gBAAiBZ,EAAcY,GACzBA,EAAgBX,MAChBW,IAGVN,wBAAMI,UAAU,gCAZ3B,IAiBLJ,gBAACC,UAAmBW,UAChBZ,uBAAKI,UAAU,iBACVL,EAAUc,OAA0B,CAACC,EAAOC,EAAcC,KACvDF,EAAMG,KACFjB,gBAACkB,GACGC,SACIxB,GAASI,EAAUS,OACI,IAAjBQ,EACAA,IAAiBrB,EAE3ByB,IAAKJ,EACLrB,MACID,EAAcqB,GAAgBA,EAAapB,MAAQoB,EAEvDR,WAAYS,EACZK,QAASvB,EACTwB,QAAS5B,EAAcqB,GAAgBA,EAAaQ,KAAO,QAG5DT,GACR,OAgBvB,SAASI,GAAUvB,MAAEA,EAAFY,WAASA,EAATY,SAAqBA,EAArBE,QAA+BA,UAASC,IACvD,MAAME,EACFxB,wBACII,UAAW,uBAAyBe,EAAW,UAAY,IAC3DR,MAAO,CAAEL,gBAAiBX,GAC1B0B,QAAS,UAAMA,SAAAA,EAAUd,IAEzBP,wBAAMI,UAAU,4BAIxB,OAAOkB,EAAUtB,gBAACyB,WAAQC,QAASJ,GAAUE,GAAkBA,EArBnE5B,EAAY+B,YAAc,cAuB1BT,EAAUS,YAAc"}

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

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown.js","sources":["../../../src/components/deprecated-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","React","Component","constructor","props","context","super","_timeout","_handleClickOutside","event","dropdownDOMNode","ReactDOM","findDOMNode","this","contains","target","_toggleShowBody","allowBodyInteractions","setTimeout","state","showBody","onHideBody","document","removeEventListener","onShowBody","addEventListener","setState","_setPosition","body","scrollingParent","getElementById","scrolling_parent","dropdown","dropdownVerticalPosition","offsetTop","dropdownTrigger","querySelector","top","clientHeight","scrollTop","undefined","componentWillUnmount","clearTimeout","_getTriggerComponent","_trigger","children","_this$props$children","cloneElement","onClick","_getBodyComponent","right","setPosition","className","classNames","body_wrapper","with_arrow","bottom","contentMarkup","style","position","render","display","displayName","Trigger","forwardRef","ref","tooltip","Button","preventDefault","stopPropagation","Body","left","id"],"mappings":"kXA2BA,MAAMA,UAAYC,EAAMC,UAGpBC,YAAYC,EAAiBC,GACzBC,MAAMF,EAAOC,QAejBE,qBAEAC,oBAAuBC,IACnB,MAAMC,EAAkBC,EAASC,YAAYC,MAEzCH,IAAoBA,EAAgBI,SAASL,EAAMM,QACnDF,KAAKG,kBACCH,KAAKT,MAAMa,wBAEjBJ,KAAKN,SAAWW,WAAW,KACnBL,KAAKM,MAAMC,UACXP,KAAKG,mBAEV,YAIXA,gBAAkB,KACTH,KAAKM,MAAMC,UAMRP,KAAKT,MAAMiB,YAAYR,KAAKT,MAAMiB,aACtCC,SAASC,oBAAoB,QAASV,KAAKL,qBAAqB,KAL5DK,KAAKT,MAAMoB,YAAYX,KAAKT,MAAMoB,aACtCF,SAASG,iBAAiB,QAASZ,KAAKL,qBAAqB,IAOjEK,KAAKa,SAAS,CACVN,UAAWP,KAAKM,MAAMC,iBAY9BO,aAAgBC,IACZ,GAAIA,EAAM,CACN,MAAMC,EAAkBP,SAASQ,eAC7BjB,KAAKT,MAAM2B,iBAAmBlB,KAAKT,MAAM2B,iBAAmB,IAGhE,GAAIF,EAAiB,CACjB,MAAMG,EAAWrB,EAASC,YAAYC,MACtC,IAAKmB,EACD,OAEJ,MAAMC,EAA4BtB,EAASC,YAAYC,MAClDqB,UACCC,EAAmBH,EAAqBI,cAAc,YAC5D,IAAKD,EACD,OAEJ,MAYME,EATwBR,EAAgBS,aAChBT,EAAgBU,UAK1CN,EAT0BE,EAAgBG,aACnBV,EAAKU,aAa5BD,IAAQxB,KAAKM,MAAMkB,KACnBxB,KAAKa,SAAS,CAAEW,IAAAA,OAvF5BxB,KAAKM,MAAQ,CACTC,UAAU,EACViB,IAAKjC,EAAMiC,MAAO,GAGtBxB,KAAKN,cAAWiC,EAGpBC,uBACInB,SAASC,oBAAoB,QAASV,KAAKL,qBAAqB,GAC5DK,KAAKN,UACLmC,aAAa7B,KAAKN,UAoC1BoC,6BACI,MAAMC,WAAW/B,KAAKT,MAAMyC,iBAAXC,EAAsB,GACvC,OAAOF,EACD3C,EAAM8C,aAAaH,EAAU,CAAEI,QAASnC,KAAKG,uBAC7CwB,EA0CVS,oBACI,IAAKpC,KAAKM,MAAMC,SACZ,OAAO,KAEX,MAAMiB,IAAEA,GAAQxB,KAAKM,OACf+B,MAAEA,GAAQ,EAAVL,SAAiBA,GAAahC,KAAKT,MACnCA,EAAQ,CAAEiC,IAAAA,EAAKa,MAAAA,EAAOC,YAAatC,KAAKc,cAExCyB,EAAYC,EAAW,CACzBC,cAAc,EACdC,YAAY,EACZlB,IAAKA,EACLmB,QAASnB,IAGPT,QAAOiB,SAAAA,EAAW,GAElBY,EACc,mBAAT7B,EACDA,EAAKxB,GACLwB,EACA3B,EAAM8C,aAAanB,EAAMxB,QACzBoC,EACV,OACIvC,uBAAKmD,UAAWA,EAAWM,MAAO,CAAEC,SAAU,aACzCF,GAKbG,SACI,MAAMR,EAAYC,EAAW,oBAAqBxC,KAAKT,MAAMgD,YACvDf,IAAEA,GAAQxB,KAAKM,MAErB,OACIlB,uBAAKyD,MAAO,CAAEG,QAAS,gBAAkBT,UAAWA,GAC/Cf,GAAOxB,KAAKoC,oBACZpC,KAAK8B,wBACJN,GAAOxB,KAAKoC,sBAxIxBjD,EACY8D,mBA6IlB9D,EAAI8D,YAAc,eAWlB,MAAMC,EAAU9D,EAAM+D,YAA4C,WAE9DC,OADApB,SAAEA,EAAFG,QAAYA,EAAZkB,QAAqBA,EAArBd,UAA8BA,KAAchD,iCAS5C,OACIH,gBAACkE,6CACO/D,OACJgD,UAAWC,EAAW,UAAWD,GACjCJ,QAVR,SAAqBvC,GACjBA,EAAM2D,iBACN3D,EAAM4D,kBACFrB,GAASA,EAAQvC,IAQjByD,QAASA,EACTD,IAAKA,IAEJpB,MAcb,SAASyB,GAAKjC,IAAEA,EAAFa,MAAOA,EAAPL,SAAcA,EAAdM,YAAwBA,IAClC,MAAMO,EAA6B,CAAEC,SAAU,WAAYT,MAAO,EAAGb,IAAK,GAY1E,OAVIA,IACAqB,EAAMrB,IAAM,OACZqB,EAAMF,OAAS,GAGfN,IACAQ,EAAMR,MAAQ,OACdQ,EAAMa,KAAO,GAIbtE,uBAAKgE,IAAKd,EAAaO,MAAOA,EAAON,UAAU,OAAOoB,GAAG,0BACpD3B,GAxBbkB,EAAQD,YAAc,mBA6BtBQ,EAAKR,YAAc,iCAEF,CACb9D,IAAAA,EACA+D,QAAAA,EACAO,KAAAA"}

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

@@ -0,0 +1 @@
+{"version":3,"file":"input.js","sources":["../../../src/components/deprecated-input/input.tsx"],"sourcesContent":["import React from 'react'\nimport classNames from 'classnames'\n\nimport './input.less'\n\ntype InputProps = {\n    /** Additional css class applied to the input. */\n    className?: string\n    ref?: React.Ref<HTMLInputElement>\n}\n\ntype Props = InputProps & React.InputHTMLAttributes<HTMLInputElement>\n\nconst Input: React.FC<React.PropsWithRef<Props>> = React.forwardRef(\n    (props: Props, ref: React.Ref<HTMLInputElement>) => {\n        const className = classNames('reactist_input', props.className)\n        return <input {...props} className={className} ref={ref} />\n    },\n)\nInput.displayName = 'Input'\n\nexport { Input }\n"],"names":["Input","React","forwardRef","props","ref","className","classNames","displayName"],"mappings":"8PAaMA,EAA6CC,EAAMC,WACrD,CAACC,EAAcC,KACX,MAAMC,EAAYC,EAAW,iBAAkBH,EAAME,WACrD,OAAOJ,2DAAWE,OAAOE,UAAWA,EAAWD,IAAKA,OAG5DJ,EAAMO,YAAc"}

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

@@ -0,0 +1 @@
+{"version":3,"file":"select.js","sources":["../../../src/components/deprecated-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":"qUA6BA,SAASA,SAAOC,MACZA,EADYC,QAEZA,EAAU,GAFEC,SAGZA,EAHYC,SAIZA,GAAW,EAJCC,UAKZA,EAAY,GALAC,aAMZA,KACGC,iCAEH,MAAMC,EAAkBC,EAAW,kBAAmB,CAAEL,SAAAA,GAAYC,GACpE,OACIK,0CACIL,UAAWG,EACXP,MAAOA,EACPE,SAAWQ,GAAWR,EAAWA,EAASQ,EAAMC,OAAOX,YAASY,EAChET,SAAUA,EACVE,aAAcA,GACVC,SAEHL,SAAAA,EAASY,IAAKC,GACXL,0BACIM,IAAKD,EAAOC,KAAOD,EAAOd,MAC1BA,MAAOc,EAAOd,MACdG,SAAUW,EAAOX,UAEhBW,EAAOE,QAM5BjB,EAAOkB,YAAc,SACrBlB,EAAOmB,aAAe,CAClBjB,QAAS,GACTE,UAAU"}

package/lib/index.d.ts

@@ -24,20 +24,16 @@ export * from './new-components/tabs';
 export * from './new-components/modal';
 export * from './new-components/avatar';
 export * from './hooks/use-previous';
-export { default as Checkbox } from './components/checkbox';
 export { default as ColorPicker, COLORS } from './components/color-picker';
-export { default as Dropdown } from './components/dropdown';
-export { default as Input } from './components/input';
 export { default as KeyboardShortcut } from './components/keyboard-shortcut';
 export { default as KeyCapturer, SUPPORTED_KEYS } from './components/key-capturer';
-export { default as Popover } from './components/popover';
 export { default as ProgressBar } from './components/progress-bar';
-export { default as Select } from './components/select';
 export { default as Time } from './components/time';
 export { Notification } from './components/notification/notification';
 export { Tooltip } from './components/tooltip';
 export type { TooltipProps } from './components/tooltip';
 export * from './components/menu';
 export { default as DeprecatedButton } from './components/deprecated-button';
-export { default as DeprecatedModal } from './components/deprecated-modal';
-export { DeprecatedLoading } from './components/deprecated-loading';
+export { default as DeprecatedDropdown } from './components/deprecated-dropdown';
+export { default as DeprecatedInput } from './components/deprecated-input';
+export { default as DeprecatedSelect } from './components/deprecated-select';

package/lib/index.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./new-components/box/box.js"),o=require("./new-components/columns/columns.js"),t=require("./new-components/divider/divider.js"),r=require("./new-components/inline/inline.js"),n=require("./new-components/stack/stack.js"),s=require("./new-components/hidden/hidden.js"),i=require("./new-components/hidden-visually/hidden-visually.js"),p=require("./components/tooltip/tooltip.js"),d=require("./new-components/button/button.js"),u=require("./new-components/alert/alert.js"),a=require("./new-components/loading/loading.js"),l=require("./new-components/notice/notice.js"),c=require("./new-components/heading/heading.js"),x=require("./new-components/text/text.js"),m=require("./new-components/button-link/button-link.js"),j=require("./new-components/text-link/text-link.js"),q=require("./new-components/checkbox-field/checkbox-field.js"),w=require("./new-components/password-field/password-field.js"),b=require("./new-components/select-field/select-field.js"),f=require("./new-components/switch-field/switch-field.js"),k=require("./new-components/text-area/text-area.js"),M=require("./new-components/text-field/text-field.js"),T=require("./hooks/use-previous/use-previous.js"),h=require("./new-components/tabs/tabs.js"),v=require("./new-components/modal/modal.js"),S=require("./new-components/avatar/avatar.js"),g=require("./components/checkbox/index.js"),B=require("./components/deprecated-button/index.js"),L=require("./components/dropdown/index.js"),P=require("./components/color-picker/color-picker.js"),y=require("./components/color-picker/index.js"),C=require("./components/input/index.js"),F=require("./components/keyboard-shortcut/index.js"),A=require("./components/key-capturer/key-capturer.js"),D=require("./components/key-capturer/index.js"),H=require("./components/popover/index.js"),O=require("./components/progress-bar/index.js"),I=require("./components/select/index.js"),E=require("./components/time/index.js"),K=require("./components/notification/notification.js"),N=require("./components/menu/menu.js"),R=require("./components/deprecated-modal/index.js"),_=require("./components/deprecated-loading/deprecated-loading.js");exports.Box=e.Box,exports.Column=o.Column,exports.Columns=o.Columns,exports.Divider=t.Divider,exports.Inline=r.Inline,exports.Stack=n.Stack,exports.Hidden=s.Hidden,exports.HiddenVisually=i.HiddenVisually,exports.Tooltip=p.Tooltip,exports.Button=d.Button,exports.Alert=u.Alert,exports.Loading=a.Loading,exports.Notice=l.Notice,exports.Heading=c.Heading,exports.Text=x.Text,exports.ButtonLink=m.ButtonLink,exports.TextLink=j.TextLink,exports.CheckboxField=q.CheckboxField,exports.PasswordField=w.PasswordField,exports.SelectField=b.SelectField,exports.SwitchField=f.SwitchField,exports.TextArea=k.TextArea,exports.TextField=M.TextField,exports.usePrevious=T.usePrevious,exports.Tab=h.Tab,exports.TabAwareSlot=h.TabAwareSlot,exports.TabList=h.TabList,exports.TabPanel=h.TabPanel,exports.Tabs=h.Tabs,exports.Modal=v.Modal,exports.ModalActions=v.ModalActions,exports.ModalBody=v.ModalBody,exports.ModalCloseButton=v.ModalCloseButton,exports.ModalFooter=v.ModalFooter,exports.ModalHeader=v.ModalHeader,exports.Avatar=S.Avatar,exports.Checkbox=g.default,exports.DeprecatedButton=B.default,exports.Dropdown=L.default,exports.COLORS=P.COLORS,exports.ColorPicker=y.default,exports.Input=C.default,exports.KeyboardShortcut=F.default,exports.SUPPORTED_KEYS=A.SUPPORTED_KEYS,exports.KeyCapturer=D.default,exports.Popover=H.default,exports.ProgressBar=O.default,exports.Select=I.default,exports.Time=E.default,exports.Notification=K.Notification,exports.Menu=N.Menu,exports.MenuButton=N.MenuButton,exports.MenuGroup=N.MenuGroup,exports.MenuItem=N.MenuItem,exports.MenuList=N.MenuList,exports.SubMenu=N.SubMenu,exports.DeprecatedModal=R.default,exports.DeprecatedLoading=_.Loading;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("./new-components/box/box.js"),o=require("./new-components/columns/columns.js"),t=require("./new-components/divider/divider.js"),r=require("./new-components/inline/inline.js"),n=require("./new-components/stack/stack.js"),s=require("./new-components/hidden/hidden.js"),i=require("./new-components/hidden-visually/hidden-visually.js"),p=require("./components/tooltip/tooltip.js"),d=require("./new-components/button/button.js"),u=require("./new-components/alert/alert.js"),a=require("./new-components/loading/loading.js"),l=require("./new-components/notice/notice.js"),c=require("./new-components/heading/heading.js"),x=require("./new-components/text/text.js"),m=require("./new-components/button-link/button-link.js"),j=require("./new-components/text-link/text-link.js"),q=require("./new-components/checkbox-field/checkbox-field.js"),w=require("./new-components/password-field/password-field.js"),b=require("./new-components/select-field/select-field.js"),k=require("./new-components/switch-field/switch-field.js"),M=require("./new-components/text-area/text-area.js"),f=require("./new-components/text-field/text-field.js"),T=require("./hooks/use-previous/use-previous.js"),S=require("./new-components/tabs/tabs.js"),h=require("./new-components/modal/modal.js"),v=require("./new-components/avatar/avatar.js"),B=require("./components/deprecated-button/index.js"),y=require("./components/deprecated-dropdown/index.js"),P=require("./components/color-picker/color-picker.js"),C=require("./components/color-picker/index.js"),F=require("./components/keyboard-shortcut/index.js"),L=require("./components/key-capturer/key-capturer.js"),g=require("./components/key-capturer/index.js"),A=require("./components/progress-bar/index.js"),D=require("./components/time/index.js"),H=require("./components/notification/notification.js"),O=require("./components/menu/menu.js"),I=require("./components/deprecated-input/index.js"),E=require("./components/deprecated-select/index.js");exports.Box=e.Box,exports.Column=o.Column,exports.Columns=o.Columns,exports.Divider=t.Divider,exports.Inline=r.Inline,exports.Stack=n.Stack,exports.Hidden=s.Hidden,exports.HiddenVisually=i.HiddenVisually,exports.Tooltip=p.Tooltip,exports.Button=d.Button,exports.Alert=u.Alert,exports.Loading=a.Loading,exports.Notice=l.Notice,exports.Heading=c.Heading,exports.Text=x.Text,exports.ButtonLink=m.ButtonLink,exports.TextLink=j.TextLink,exports.CheckboxField=q.CheckboxField,exports.PasswordField=w.PasswordField,exports.SelectField=b.SelectField,exports.SwitchField=k.SwitchField,exports.TextArea=M.TextArea,exports.TextField=f.TextField,exports.usePrevious=T.usePrevious,exports.Tab=S.Tab,exports.TabAwareSlot=S.TabAwareSlot,exports.TabList=S.TabList,exports.TabPanel=S.TabPanel,exports.Tabs=S.Tabs,exports.Modal=h.Modal,exports.ModalActions=h.ModalActions,exports.ModalBody=h.ModalBody,exports.ModalCloseButton=h.ModalCloseButton,exports.ModalFooter=h.ModalFooter,exports.ModalHeader=h.ModalHeader,exports.Avatar=v.Avatar,exports.DeprecatedButton=B.default,exports.DeprecatedDropdown=y.default,exports.COLORS=P.COLORS,exports.ColorPicker=C.default,exports.KeyboardShortcut=F.default,exports.SUPPORTED_KEYS=L.SUPPORTED_KEYS,exports.KeyCapturer=g.default,exports.ProgressBar=A.default,exports.Time=D.default,exports.Notification=H.Notification,exports.Menu=O.Menu,exports.MenuButton=O.MenuButton,exports.MenuGroup=O.MenuGroup,exports.MenuItem=O.MenuItem,exports.MenuList=O.MenuList,exports.SubMenu=O.SubMenu,exports.DeprecatedInput=I.default,exports.DeprecatedSelect=E.default;
 //# sourceMappingURL=index.js.map

package/lib/new-components/base-button/base-button.d.ts

@@ -19,6 +19,13 @@ declare type CommonProps = {
      * @default 'normal'
      */
     size?: ButtonSize;
+    /**
+     * Controls the shape of the button. Specifically, it allows to make it have slightly curved
+     * corners (the default) vs. having them fully curved to the point that they are as round as
+     * possible. In icon-only buttons this allows to have the button be circular.
+     * @default 'normal'
+     */
+    shape?: 'normal' | 'rounded';
     /**
      * Whether the button is disabled or not.
      * @default false
@@ -37,10 +44,6 @@ declare type CommonProps = {
      * A tooltip linked to the button element.
      */
     tooltip?: TooltipProps['content'];
-    /**
-     * The distance between the button element and the linked tooltip.
-     */
-    tooltipGapSize?: TooltipProps['gapSize'];
 };
 declare type AlignmentProps = {
     width: 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'full';

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("../../components/tooltip/tooltip.js"),i=require("../spinner/spinner.js"),o=require("./base-button.module.css.js");const r=["as","variant","tone","size","disabled","loading","tooltip","tooltipGapSize","onClick","exceptionallySetClassName","children","startIcon","endIcon","icon","width","align"];function s(e){e.preventDefault()}exports.BaseButton=t.polymorphicComponent((function(t,u){let{as:c="div",variant:d,tone:p="normal",size:m="normal",disabled:f=!1,loading:b=!1,tooltip:x,tooltipGapSize:h,onClick:j,exceptionallySetClassName:S,children:v,startIcon:E,endIcon:g,icon:B,width:q="auto",align:y}=t,z=e.objectWithoutProperties(t,r);const C=b||f,I=l.createElement(n.Box,e.objectSpread2(e.objectSpread2({},z),{},{as:c,ref:u,"aria-disabled":C,onClick:C?s:j,width:B?void 0:q,className:[S,o.default.baseButton,o.default["variant-"+d],o.default["tone-"+p],o.default["size-"+m],"auto"!==q&&null==B&&null!=y?o.default["align-"+y]:null,B?o.default.iconButton:null,f?o.default.disabled:null]}),B?b&&l.createElement(i.Spinner,null)||B:l.createElement(l.Fragment,null,E?l.createElement(n.Box,{display:"flex",className:o.default.startIcon,"aria-hidden":!0},b&&!g?l.createElement(i.Spinner,null):E):null,v?l.createElement("span",{className:o.default.label},v):null,g||b&&!E?l.createElement(n.Box,{display:"flex",className:o.default.endIcon,"aria-hidden":!0},b?l.createElement(i.Spinner,null):g):null)),N=B?null!=x?x:z["aria-label"]:x;return N?l.createElement(a.Tooltip,{content:N,gapSize:h},I):I}));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_rollupPluginBabelHelpers.js"),t=require("react"),l=require("../../utils/polymorphism.js"),n=require("../box/box.js"),a=require("../../components/tooltip/tooltip.js"),o=require("../spinner/spinner.js"),i=require("./base-button.module.css.js");const r=["as","variant","tone","size","shape","disabled","loading","tooltip","onClick","exceptionallySetClassName","children","startIcon","endIcon","icon","width","align"];function s(e){e.preventDefault()}exports.BaseButton=l.polymorphicComponent((function(l,d){let{as:u="div",variant:c,tone:p="normal",size:m="normal",shape:f="normal",disabled:b=!1,loading:h=!1,tooltip:x,onClick:v,exceptionallySetClassName:j,children:B,startIcon:E,endIcon:g,icon:q,width:y="auto",align:S="center"}=l,C=e.objectWithoutProperties(l,r);const I=h||b,N=t.createElement(n.Box,e.objectSpread2(e.objectSpread2({},C),{},{as:u,ref:d,"aria-disabled":I,onClick:I?s:v,width:q?void 0:y,className:[j,i.default.baseButton,i.default["variant-"+c],i.default["tone-"+p],i.default["size-"+m],"rounded"===f?i.default["shape-rounded"]:null,q?i.default.iconButton:null,b?i.default.disabled:null]}),q?h&&t.createElement(o.Spinner,null)||q:t.createElement(t.Fragment,null,E?t.createElement(n.Box,{display:"flex",className:i.default.startIcon,"aria-hidden":!0},h&&!g?t.createElement(o.Spinner,null):E):null,B?t.createElement(n.Box,{as:"span",className:i.default.label,overflow:"hidden",width:"full"===y?"full":void 0,textAlign:"auto"===y?"center":S},B):null,g||h&&!E?t.createElement(n.Box,{display:"flex",className:i.default.endIcon,"aria-hidden":!0},h?t.createElement(o.Spinner,null):g):null)),w=q&&void 0===x?C["aria-label"]:x;return w?t.createElement(a.Tooltip,{content:w},N):N}));
 //# 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     * The distance between the button element and the linked tooltip.\n     */\n    tooltipGapSize?: TooltipProps['gapSize']\n}\n\ntype AlignmentProps = {\n    width: 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'full'\n    align?: 'start' | 'center' | 'end'\n}\n\ntype AutoWidthProps = {\n    width?: 'auto'\n    align?: never\n}\n\ntype IconButtonProps = {\n    icon: IconElement\n    'aria-label': string\n    children?: never\n    startIcon?: never\n    endIcon?: never\n    width?: never\n    align?: never\n}\n\ntype LabelledButtonProps = {\n    children: NonNullable<React.ReactNode>\n    startIcon?: IconElement\n    endIcon?: IconElement\n    icon?: never\n} & (AutoWidthProps | AlignmentProps)\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 * @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        tooltipGapSize,\n        onClick,\n        exceptionallySetClassName,\n        children,\n        startIcon,\n        endIcon,\n        icon,\n        width = 'auto',\n        align,\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            width={icon ? undefined : width}\n            className={[\n                exceptionallySetClassName,\n                styles.baseButton,\n                styles[`variant-${variant}`],\n                styles[`tone-${tone}`],\n                styles[`size-${size}`],\n                width !== 'auto' && icon == null && align != null ? styles[`align-${align}`] : null,\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} gapSize={tooltipGapSize}>\n            {buttonElement}\n        </Tooltip>\n    ) : (\n        buttonElement\n    )\n})\n"],"names":["preventDefault","event","polymorphicComponent","ref","as","variant","tone","size","disabled","loading","tooltip","tooltipGapSize","onClick","exceptionallySetClassName","children","startIcon","endIcon","icon","width","align","props","isDisabled","buttonElement","React","Box","undefined","className","styles","baseButton","iconButton","Spinner","display","label","tooltipContent","Tooltip","content","gapSize"],"mappings":"0gBAOA,SAASA,EAAeC,GACpBA,EAAMD,oCAmFgBE,wBAA6C,WAoBnEC,OAnBAC,GACIA,EAAK,MADTC,QAEIA,EAFJC,KAGIA,EAAO,SAHXC,KAIIA,EAAO,SAJXC,SAKIA,GAAW,EALfC,QAMIA,GAAU,UACVC,EAPJC,eAQIA,EARJC,QASIA,EATJC,0BAUIA,EAVJC,SAWIA,EAXJC,UAYIA,EAZJC,QAaIA,EAbJC,KAcIA,EAdJC,MAeIA,EAAQ,OAfZC,MAgBIA,KACGC,iCAIP,MAAMC,EAAaZ,GAAWD,EACxBc,EACFC,gBAACC,yCACOJ,OACJhB,GAAIA,EACJD,IAAKA,kBACUkB,EACfT,QAASS,EAAarB,EAAiBY,EACvCM,MAAOD,OAAOQ,EAAYP,EAC1BQ,UAAW,CACPb,EACAc,UAAOC,WACPD,qBAAkBtB,GAClBsB,kBAAerB,GACfqB,kBAAepB,GACL,SAAVW,GAA4B,MAARD,GAAyB,MAATE,EAAgBQ,mBAAgBR,GAAW,KAC/EF,EAAOU,UAAOE,WAAa,KAC3BrB,EAAWmB,UAAOnB,SAAW,QAGhCS,EACIR,GAAWc,gBAACO,iBAAeb,EAE5BM,gCACKR,EACGQ,gBAACC,OAAIO,QAAQ,OAAOL,UAAWC,UAAOZ,4BACjCN,IAAYO,EAAUO,gBAACO,gBAAaf,GAEzC,KACHD,EAAWS,wBAAMG,UAAWC,UAAOK,OAAQlB,GAAmB,KAC9DE,GAAYP,IAAYM,EACrBQ,gBAACC,OAAIO,QAAQ,OAAOL,UAAWC,UAAOX,0BACjCP,EAAUc,gBAACO,gBAAad,GAE7B,OAOdiB,EAAiBhB,QAAOP,EAAAA,EAAWU,EAAM,cAAgBV,EAC/D,OAAOuB,EACHV,gBAACW,WAAQC,QAASF,EAAgBG,QAASzB,GACtCW,GAGLA"}
+{"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    /**\n     * The button's tone.\n     * @default 'normal'\n     */\n    tone?: ButtonTone\n\n    /**\n     * The button's size.\n     * @default 'normal'\n     */\n    size?: ButtonSize\n\n    /**\n     * Controls the shape of the button. Specifically, it allows to make it have slightly curved\n     * corners (the default) vs. having them fully curved to the point that they are as round as\n     * possible. In icon-only buttons this allows to have the button be circular.\n     * @default 'normal'\n     */\n    shape?: 'normal' | 'rounded'\n\n    /**\n     * Whether the button is disabled or not.\n     * @default false\n     */\n    disabled?: boolean\n\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    /**\n     * A tooltip linked to the button element.\n     */\n    tooltip?: TooltipProps['content']\n}\n\ntype AlignmentProps = {\n    width: 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'full'\n    align?: 'start' | 'center' | 'end'\n}\n\ntype AutoWidthProps = {\n    width?: 'auto'\n    align?: never\n}\n\ntype IconButtonProps = {\n    icon: IconElement\n    'aria-label': string\n    children?: never\n    startIcon?: never\n    endIcon?: never\n    width?: never\n    align?: never\n}\n\ntype LabelledButtonProps = {\n    children: NonNullable<React.ReactNode>\n    startIcon?: IconElement\n    endIcon?: IconElement\n    icon?: never\n} & (AutoWidthProps | AlignmentProps)\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 * @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        shape = 'normal',\n        disabled = false,\n        loading = false,\n        tooltip,\n        onClick,\n        exceptionallySetClassName,\n        children,\n        startIcon,\n        endIcon,\n        icon,\n        width = 'auto',\n        align = 'center',\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            width={icon ? undefined : width}\n            className={[\n                exceptionallySetClassName,\n                styles.baseButton,\n                styles[`variant-${variant}`],\n                styles[`tone-${tone}`],\n                styles[`size-${size}`],\n                shape === 'rounded' ? styles['shape-rounded'] : null,\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 ? (\n                        <Box\n                            as=\"span\"\n                            className={styles.label}\n                            overflow=\"hidden\"\n                            width={width === 'full' ? 'full' : undefined}\n                            textAlign={width === 'auto' ? 'center' : align}\n                        >\n                            {children}\n                        </Box>\n                    ) : 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 === undefined ? 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","shape","disabled","loading","tooltip","onClick","exceptionallySetClassName","children","startIcon","endIcon","icon","width","align","props","isDisabled","buttonElement","React","Box","undefined","className","styles","baseButton","iconButton","Spinner","display","label","overflow","textAlign","tooltipContent","Tooltip","content"],"mappings":"igBAOA,SAASA,EAAeC,GACpBA,EAAMD,oCA4FgBE,wBAA6C,WAoBnEC,OAnBAC,GACIA,EAAK,MADTC,QAEIA,EAFJC,KAGIA,EAAO,SAHXC,KAIIA,EAAO,SAJXC,MAKIA,EAAQ,SALZC,SAMIA,GAAW,EANfC,QAOIA,GAAU,UACVC,EARJC,QASIA,EATJC,0BAUIA,EAVJC,SAWIA,EAXJC,UAYIA,EAZJC,QAaIA,EAbJC,KAcIA,EAdJC,MAeIA,EAAQ,OAfZC,MAgBIA,EAAQ,YACLC,iCAIP,MAAMC,EAAaX,GAAWD,EACxBa,EACFC,gBAACC,yCACOJ,OACJhB,GAAIA,EACJD,IAAKA,kBACUkB,EACfT,QAASS,EAAarB,EAAiBY,EACvCM,MAAOD,OAAOQ,EAAYP,EAC1BQ,UAAW,CACPb,EACAc,UAAOC,WACPD,qBAAkBtB,GAClBsB,kBAAerB,GACfqB,kBAAepB,GACL,YAAVC,EAAsBmB,UAAO,iBAAmB,KAChDV,EAAOU,UAAOE,WAAa,KAC3BpB,EAAWkB,UAAOlB,SAAW,QAGhCQ,EACIP,GAAWa,gBAACO,iBAAeb,EAE5BM,gCACKR,EACGQ,gBAACC,OAAIO,QAAQ,OAAOL,UAAWC,UAAOZ,4BACjCL,IAAYM,EAAUO,gBAACO,gBAAaf,GAEzC,KACHD,EACGS,gBAACC,OACGpB,GAAG,OACHsB,UAAWC,UAAOK,MAClBC,SAAS,SACTf,MAAiB,SAAVA,EAAmB,YAASO,EACnCS,UAAqB,SAAVhB,EAAmB,SAAWC,GAExCL,GAEL,KACHE,GAAYN,IAAYK,EACrBQ,gBAACC,OAAIO,QAAQ,OAAOL,UAAWC,UAAOX,0BACjCN,EAAUa,gBAACO,gBAAad,GAE7B,OAOdmB,EAAiBlB,QAAoBQ,IAAZd,EAAwBS,EAAM,cAAgBT,EAC7E,OAAOwB,EACHZ,gBAACa,WAAQC,QAASF,GAAiBb,GAEnCA"}

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={baseButton:"_7a2031d6",label:"_09c23660","align-start":"dd82f17a","align-center":"_8a9315ae","align-end":"_6acb4219","size-small":"_1e48abcb","size-normal":"_949f7858","size-large":"_34ac3da9",disabled:"_7e5800ce",iconButton:"_1bdc5d38",startIcon:"_270d7bdf",endIcon:"_471c6e23","variant-primary":"a878a9a4","variant-secondary":"_81c213d2","variant-tertiary":"_12f96f70","variant-quaternary":"_8c546508","tone-destructive":"_441a7e3a"};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={baseButton:"a8af2163",label:"bbdb467b","shape-rounded":"ca02fc07","size-small":"_45ffe137","size-normal":"_352995bd","size-large":"_3991076f",disabled:"f82232b7",iconButton:"ef4c88db",startIcon:"a08c25c7",endIcon:"_2f6adc11","variant-primary":"_3d1243b2","variant-secondary":"_16b6b062","variant-tertiary":"cffaea5e","variant-quaternary":"_98cd5c3f","tone-destructive":"_99cb1c4d"};
 //# sourceMappingURL=base-button.module.css.js.map