@doist/reactist 14.0.0 → 14.1.0

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

@@ -59,6 +59,7 @@ function ColorItem({
   tooltip
 }) {
   const item = /*#__PURE__*/React__default.createElement("span", {
+    "data-testid": "reactist-color-item",
     className: 'reactist color_item' + (isActive ? ' active' : ''),
     style: {
       backgroundColor: color

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 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;;;;"}
+{"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            data-testid=\"reactist-color-item\"\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;mBACgB;IACZI,SAAS,EAAE,yBAAyBY,QAAQ,GAAG,SAAH,GAAe,EAAhD;IACXR,KAAK,EAAE;MAAEF,eAAe,EAAEf;;IAC1B2B,OAAO,EAAE,MAAMA,OAAN,oBAAMA,OAAO,CAAGxB,UAAH;GAJ1B,eAMIM,4BAAA,OAAA;IAAMI,SAAS,EAAC;GAAhB,CANJ,CADJ;EAWA,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

@@ -141,7 +141,8 @@ class Box extends React__default.Component {
       style: {
         display: 'inline-block'
       },
-      className: className
+      className: className,
+      "data-testid": "reactist-dropdown-box"
     }, top && this._getBodyComponent(), this._getTriggerComponent(), !top && this._getBodyComponent());
   }
 
@@ -199,7 +200,8 @@ function Body({
     ref: setPosition,
     style: style,
     className: "body",
-    id: "reactist-dropdown-body"
+    id: "reactist-dropdown-body",
+    "data-testid": "reactist-dropdown-body"
   }, children);
 }
 

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

@@ -1 +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":";;;;;;;;AA2BA,MAAMA,GAAN,SAAkBC,cAAK,CAACC,SAAxB;EAGIC,YAAYC,OAAiBC;IACzB,MAAMD,KAAN,EAAaC,OAAb;SAeJC;;SAEAC,sBAAuBC,KAAD;MAClB,MAAMC,eAAe,GAAGC,QAAQ,CAACC,WAAT,CAAqB,IAArB,CAAxB;MAEA,IAAIF,eAAe,IAAI,CAACA,eAAe,CAACG,QAAhB,CAAyBJ,KAAK,CAACK,MAA/B,CAAxB,EACI,KAAKC,eAAL,GADJ,KAEK,IAAI,CAAC,KAAKV,KAAL,CAAWW,qBAAhB,EAAuC;;QAExC,KAAKT,QAAL,GAAgBU,UAAU,CAAC;UACvB,IAAI,KAAKC,KAAL,CAAWC,QAAf,EAAyB;YACrB,KAAKJ,eAAL;;SAFkB,EAIvB,GAJuB,CAA1B;;;;SAQRA,kBAAkB;MACd,IAAI,CAAC,KAAKG,KAAL,CAAWC,QAAhB,EAA0B;;QAEtB,IAAI,KAAKd,KAAL,CAAWe,UAAf,EAA2B,KAAKf,KAAL,CAAWe,UAAX;QAC3BC,QAAQ,CAACC,gBAAT,CAA0B,OAA1B,EAAmC,KAAKd,mBAAxC,EAA6D,IAA7D;OAHJ,MAIO;;QAEH,IAAI,KAAKH,KAAL,CAAWkB,UAAf,EAA2B,KAAKlB,KAAL,CAAWkB,UAAX;QAC3BF,QAAQ,CAACG,mBAAT,CAA6B,OAA7B,EAAsC,KAAKhB,mBAA3C,EAAgE,IAAhE;;;MAGJ,KAAKiB,QAAL,CAAc;QACVN,QAAQ,EAAE,CAAC,KAAKD,KAAL,CAAWC;OAD1B;;;SAaJO,eAAgBC,IAAD;MACX,IAAIA,IAAJ,EAAU;QACN,MAAMC,eAAe,GAAGP,QAAQ,CAACQ,cAAT,CACpB,KAAKxB,KAAL,CAAWyB,gBAAX,GAA8B,KAAKzB,KAAL,CAAWyB,gBAAzC,GAA4D,EADxC,CAAxB;;QAIA,IAAIF,eAAJ,EAAqB;UACjB,MAAMG,QAAQ,GAAGpB,QAAQ,CAACC,WAAT,CAAqB,IAArB,CAAjB;;UACA,IAAI,CAACmB,QAAL,EAAe;YACX;;;UAEJ,MAAMC,wBAAwB,GAAIrB,QAAQ,CAACC,WAAT,CAAqB,IAArB,EAC7BqB,SADL;UAEA,MAAMC,eAAe,GAAIH,QAAoB,CAACI,aAArB,CAAmC,UAAnC,CAAzB;;UACA,IAAI,CAACD,eAAL,EAAsB;YAClB;;;UAEJ,MAAME,qBAAqB,GAAGF,eAAe,CAACG,YAA9C;UACA,MAAMC,kBAAkB,GAAGX,IAAI,CAACU,YAAhC;UAEA,MAAME,qBAAqB,GAAGX,eAAe,CAACS,YAA9C;UACA,MAAMG,qBAAqB,GAAGZ,eAAe,CAACa,SAA9C;UAEA,MAAMC,YAAY,GACdH,qBAAqB,GACrBC,qBADA,GAEAR,wBAFA,GAGAI,qBAJJ;UAMA,MAAMO,GAAG,GAAGD,YAAY,GAAGJ,kBAA3B;;UAEA,IAAIK,GAAG,KAAK,KAAKzB,KAAL,CAAWyB,GAAvB,EAA4B;YACxB,KAAKlB,QAAL,CAAc;cAAEkB;aAAhB;;;;;;IAvFZ,KAAKzB,KAAL,GAAa;MACTC,QAAQ,EAAE,KADD;MAETwB,GAAG,EAAEtC,KAAK,CAACsC,GAAN,IAAa;KAFtB;IAKA,KAAKpC,QAAL,GAAgBqC,SAAhB;;;EAGJC,oBAAoB;IAChBxB,QAAQ,CAACG,mBAAT,CAA6B,OAA7B,EAAsC,KAAKhB,mBAA3C,EAAgE,IAAhE;;IACA,IAAI,KAAKD,QAAT,EAAmB;MACfuC,YAAY,CAAC,KAAKvC,QAAN,CAAZ;;;;EAoCRwC,oBAAoB;;;IAChB,MAAMC,QAAQ,2BAAG,KAAK3C,KAAL,CAAW4C,QAAd,qBAAG,qBAAsB,CAAtB,CAAjB;;IACA,OAAOD,QAAQ,gBACT9C,cAAK,CAACgD,YAAN,CAAmBF,QAAnB,EAA6B;MAAEG,OAAO,EAAE,KAAKpC;KAA7C,CADS,GAET6B,SAFN;;;;EA4CJQ,iBAAiB;IACb,IAAI,CAAC,KAAKlC,KAAL,CAAWC,QAAhB,EAA0B;MACtB,OAAO,IAAP;;;IAEJ,MAAM;MAAEwB;QAAQ,KAAKzB,KAArB;IACA,MAAM;MAAEmC,KAAK,GAAG,KAAV;MAAiBJ;QAAa,KAAK5C,KAAzC;IACA,MAAMA,KAAK,GAAG;MAAEsC,GAAF;MAAOU,KAAP;MAAcC,WAAW,EAAE,KAAK5B;KAA9C;IAEA,MAAM6B,SAAS,GAAGC,UAAU,CAAC;MACzBC,YAAY,EAAE,IADW;MAEzBC,UAAU,EAAE,IAFa;MAGzBf,GAAG,EAAEA,GAHoB;MAIzBgB,MAAM,EAAE,CAAChB;KAJe,CAA5B;IAOA,MAAMhB,IAAI,GAAGsB,QAAH,oBAAGA,QAAQ,CAAG,CAAH,CAArB;IAEA,MAAMW,aAAa,GACf,OAAOjC,IAAP,KAAgB,UAAhB,GACMA,IAAI,CAACtB,KAAD,CADV,GAEMsB,IAAI,gBACJzB,cAAK,CAACgD,YAAN,CAAmBvB,IAAnB,EAAyBtB,KAAzB,CADI,GAEJuC,SALV;IAMA,oBACI1C,4BAAA,MAAA;MAAKqD,SAAS,EAAEA;MAAWM,KAAK,EAAE;QAAEC,QAAQ,EAAE;;KAA9C,EACKF,aADL,CADJ;;;EAOJG,MAAM;IACF,MAAMR,SAAS,GAAGC,UAAU,CAAC,mBAAD,EAAsB,KAAKnD,KAAL,CAAWkD,SAAjC,CAA5B;IACA,MAAM;MAAEZ;QAAQ,KAAKzB,KAArB;IAEA,oBACIhB,4BAAA,MAAA;MAAK2D,KAAK,EAAE;QAAEG,OAAO,EAAE;;MAAkBT,SAAS,EAAEA;KAApD,EACKZ,GAAG,IAAI,KAAKS,iBAAL,EADZ,EAEK,KAAKL,oBAAL,EAFL,EAGK,CAACJ,GAAD,IAAQ,KAAKS,iBAAL,EAHb,CADJ;;;;;AApIFnD,IACYgE;AA6IlBhE,GAAG,CAACgE,WAAJ,GAAkB,cAAlB;AAWA,MAAMC,OAAO,gBAAGhE,cAAK,CAACiE,UAAN,CAAkD,SAASD,OAAT,OAE9DE,GAF8D;MAC9D;IAAEnB,QAAF;IAAYE,OAAZ;IAAqBkB,OAArB;IAA8Bd;;MAAclD;;EAG5C,SAASiE,WAAT,CAAqB7D,KAArB;IACIA,KAAK,CAAC8D,cAAN;IACA9D,KAAK,CAAC+D,eAAN;IACA,IAAIrB,OAAJ,EAAaA,OAAO,CAAC1C,KAAD,CAAP;;;EAGjB,oBACIP,4BAAA,CAACuE,MAAD,oCACQpE,KADR;IAEIkD,SAAS,EAAEC,UAAU,CAAC,SAAD,EAAYD,SAAZ,CAFzB;IAGIJ,OAAO,EAAEmB,WAHb;IAIID,OAAO,EAAEA,OAJb;IAKID,GAAG,EAAEA;MAEJnB,QAPL,CADJ;AAWH,CArBe,CAAhB;AAuBAiB,OAAO,CAACD,WAAR,GAAsB,kBAAtB;;AASA,SAASS,IAAT,CAAc;EAAE/B,GAAF;EAAOU,KAAP;EAAcJ,QAAd;EAAwBK;AAAxB,CAAd;EACI,MAAMO,KAAK,GAAwB;IAAEC,QAAQ,EAAE,UAAZ;IAAwBT,KAAK,EAAE,CAA/B;IAAkCV,GAAG,EAAE;GAA1E;;EAEA,IAAIA,GAAJ,EAAS;IACLkB,KAAK,CAAClB,GAAN,GAAY,MAAZ;IACAkB,KAAK,CAACF,MAAN,GAAe,CAAf;;;EAGJ,IAAIN,KAAJ,EAAW;IACPQ,KAAK,CAACR,KAAN,GAAc,MAAd;IACAQ,KAAK,CAACc,IAAN,GAAa,CAAb;;;EAGJ,oBACIzE,4BAAA,MAAA;IAAKkE,GAAG,EAAEd;IAAaO,KAAK,EAAEA;IAAON,SAAS,EAAC;IAAOqB,EAAE,EAAC;GAAzD,EACK3B,QADL,CADJ;AAKH;;AAEDyB,IAAI,CAACT,WAAL,GAAmB,eAAnB;MAEMY,QAAQ,GAAG;EACb5E,GADa;EAEbiE,OAFa;EAGbQ;AAHa;;;;"}
+{"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\n                style={{ display: 'inline-block' }}\n                className={className}\n                data-testid=\"reactist-dropdown-box\"\n            >\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' | 'onClick'> & {\n    tooltip?: React.ReactNode\n    /**\n     * @private the onClick prop is not to be used externally\n     */\n    onClick?: NativeButtonProps['onClick']\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\n            ref={setPosition}\n            style={style}\n            className=\"body\"\n            id=\"reactist-dropdown-body\"\n            data-testid=\"reactist-dropdown-body\"\n        >\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/new-components/tabs/tabs.module.css.js

@@ -1,4 +1,4 @@
-var modules_40c67f5b = {"tab":"_76bbcdaa","track":"_531eb92b","tab-neutral":"_13321d47","tab-themed":"_58c4d63d","track-neutral":"_11ef0184","track-themed":"ce590259","track-xsmall":"d8366aff","track-small":"e28fbcf0","track-medium":"_1e1d7d0e","track-large":"_611e18a3","track-xlarge":"_7e083426","track-xxlarge":"_37c54913"};
+var modules_40c67f5b = {"tab":"a1064a3b","track":"_06f1b8a1","tab-neutral":"dabbec7d","tab-themed":"e6f5ae4e","track-neutral":"_43913ce5","track-themed":"_39bdfdde","track-xsmall":"_1c148f4e","track-small":"_2a370df5","track-medium":"_77430437","track-large":"_33db5352","track-xlarge":"_60bf9564","track-xxlarge":"_29a35080"};
 
 export default modules_40c67f5b;
 //# sourceMappingURL=tabs.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 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;
+"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 c=["#606060","#4A90E2","#03B3B2","#008299","#82BA00","#D24726","#AC193D","#DC4FAD","#3BD5FB","#74E8D3","#FFCC00","#FB886E","#CCCCCC"],n=e=>"string"!=typeof e;function a({color:e=0,small:r,onChange:a,colorList:s=c}){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:n(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:n(r)?r.color:r,colorIndex:l,onClick:a,tooltip:n(r)?r.name:null})),o),[]))))}function i({color:e,colorIndex:o,isActive:l,onClick:c,tooltip:n}){const a=t.createElement("span",{"data-testid":"reactist-color-item",className:"reactist color_item"+(l?" active":""),style:{backgroundColor:e},onClick:()=>null==c?void 0:c(o)},t.createElement("span",{className:"color_item--inner_ring"}));return n?t.createElement(r.Tooltip,{content:n},a):a}a.displayName="ColorPicker",i.displayName="ColorItem",exports.COLORS=c,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 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"}
+{"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            data-testid=\"reactist-color-item\"\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,sCACgB,sBACZI,UAAW,uBAAyBe,EAAW,UAAY,IAC3DR,MAAO,CAAEL,gBAAiBX,GAC1B0B,QAAS,UAAMA,SAAAA,EAAUd,IAEzBP,wBAAMI,UAAU,4BAIxB,OAAOkB,EAAUtB,gBAACyB,WAAQC,QAASJ,GAAUE,GAAkBA,EAtBnE5B,EAAY+B,YAAc,cAwB1BT,EAAUS,YAAc"}

package/lib/components/deprecated-dropdown/dropdown.d.ts

@@ -30,8 +30,12 @@ declare class Box extends React.Component<React.PropsWithChildren<BoxProps>, Box
     render(): JSX.Element;
 }
 declare type NativeButtonProps = React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>;
-declare type TriggerProps = Omit<NativeButtonProps, 'title'> & {
+declare type TriggerProps = Omit<NativeButtonProps, 'title' | 'onClick'> & {
     tooltip?: React.ReactNode;
+    /**
+     * @private the onClick prop is not to be used externally
+     */
+    onClick?: NativeButtonProps['onClick'];
 };
 declare type BodyProps = {
     setPosition?: React.Ref<HTMLDivElement>;
@@ -45,7 +49,7 @@ declare namespace Body {
 }
 declare const Dropdown: {
     Box: typeof Box;
-    Trigger: React.ForwardRefExoticComponent<Pick<TriggerProps, "key" | "autoFocus" | "disabled" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "type" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "tooltip"> & React.RefAttributes<HTMLButtonElement>>;
+    Trigger: React.ForwardRefExoticComponent<Pick<TriggerProps, "onClick" | "key" | "autoFocus" | "disabled" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "name" | "type" | "value" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "tooltip"> & React.RefAttributes<HTMLButtonElement>>;
     Body: typeof Body;
 };
 export { Dropdown };

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

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

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

@@ -1 +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":"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"}
+{"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\n                style={{ display: 'inline-block' }}\n                className={className}\n                data-testid=\"reactist-dropdown-box\"\n            >\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' | 'onClick'> & {\n    tooltip?: React.ReactNode\n    /**\n     * @private the onClick prop is not to be used externally\n     */\n    onClick?: NativeButtonProps['onClick']\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\n            ref={setPosition}\n            style={style}\n            className=\"body\"\n            id=\"reactist-dropdown-body\"\n            data-testid=\"reactist-dropdown-body\"\n        >\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,uBACIyD,MAAO,CAAEG,QAAS,gBAClBT,UAAWA,gBACC,yBAEXf,GAAOxB,KAAKoC,oBACZpC,KAAK8B,wBACJN,GAAOxB,KAAKoC,sBA5IxBjD,EACY8D,mBAiJlB9D,EAAI8D,YAAc,eAelB,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,uBACIgE,IAAKd,EACLO,MAAOA,EACPN,UAAU,OACVoB,GAAG,uCACS,0BAEX3B,GA9BbkB,EAAQD,YAAc,mBAmCtBQ,EAAKR,YAAc,iCAEF,CACb9D,IAAAA,EACA+D,QAAAA,EACAO,KAAAA"}

package/lib/new-components/tabs/tabs.module.css.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={tab:"_76bbcdaa",track:"_531eb92b","tab-neutral":"_13321d47","tab-themed":"_58c4d63d","track-neutral":"_11ef0184","track-themed":"ce590259","track-xsmall":"d8366aff","track-small":"e28fbcf0","track-medium":"_1e1d7d0e","track-large":"_611e18a3","track-xlarge":"_7e083426","track-xxlarge":"_37c54913"};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default={tab:"a1064a3b",track:"_06f1b8a1","tab-neutral":"dabbec7d","tab-themed":"e6f5ae4e","track-neutral":"_43913ce5","track-themed":"_39bdfdde","track-xsmall":"_1c148f4e","track-small":"_2a370df5","track-medium":"_77430437","track-large":"_33db5352","track-xlarge":"_60bf9564","track-xxlarge":"_29a35080"};
 //# sourceMappingURL=tabs.module.css.js.map

package/package.json

@@ -2,7 +2,7 @@
     "name": "@doist/reactist",
     "description": "Open source React components by Doist",
     "author": "Henning Muszynski <henning@doist.com> (http://doist.com)",
-    "version": "14.0.0",
+    "version": "14.1.0",
     "license": "MIT",
     "homepage": "https://github.com/Doist/reactist#readme",
     "repository": "git+https://github.com/Doist/reactist.git",
@@ -62,7 +62,7 @@
         "@doist/eslint-config": "^7.1.2",
         "@doist/prettier-config": "^3.0.5",
         "@doist/tsconfig": "^1.0.0",
-        "@geometricpanda/storybook-addon-badges": "^0.0.4",
+        "@geometricpanda/storybook-addon-badges": "^0.2.2",
         "@storybook/addon-actions": "^6.5.3",
         "@storybook/addon-controls": "^6.5.3",
         "@storybook/addon-docs": "^6.5.3",
@@ -89,8 +89,6 @@
         "classnames": "^2.2.5",
         "css-loader": "^4.2.2",
         "cssnano": "^4.1.10",
-        "enzyme": "^3.11.0",
-        "enzyme-to-json": "^3.6.1",
         "eslint": "^8.16.0",
         "eslint-config-prettier": "^8.5.0",
         "eslint-formatter-codeframe": "^7.32.1",

package/styles/reactist.css

@@ -23,7 +23,7 @@
 .ec63c3f1,.ec63c3f1 *{font-family:var(--reactist-font-family);cursor:pointer}.ec63c3f1._7de9c06d,.ec63c3f1._7de9c06d *{cursor:not-allowed}.ec63c3f1._7de9c06d.a37981fc ._2a17ac45,.ec63c3f1._7de9c06d ._68cc9707{opacity:.5}._2a17ac45{--tmp-switch-width:32px;--tmp-switch-height:18px;--tmp-inner-padding:3px;--tmp-handle-size:calc(var(--tmp-switch-height) - 2*var(--tmp-inner-padding));--tmp-slide-length:calc(var(--tmp-switch-width) - var(--tmp-handle-size) - var(--tmp-inner-padding));min-height:auto;border-radius:calc(var(--tmp-switch-height)/2);background-color:var(--reactist-framework-fill-summit);cursor:pointer;position:relative}._2a17ac45,._2a17ac45>div,._2a17ac45 input[type=checkbox]{width:var(--tmp-switch-width);height:var(--tmp-switch-height)}._91409c7f{position:absolute;display:block;padding:0;top:var(--tmp-inner-padding);left:var(--tmp-inner-padding);width:var(--tmp-handle-size);height:var(--tmp-handle-size);border-radius:50%;background:var(--reactist-bg-default);transition:left .28s cubic-bezier(.4,0,.2,1)}.a37981fc ._2a17ac45{background-color:var(--reactist-switch-checked)}.a37981fc ._2a17ac45 ._91409c7f{left:var(--tmp-slide-length)}.ec63c3f1.a6490371 ._2a17ac45:after{border-radius:calc(var(--tmp-switch-height) + 4px);border:2px solid var(--reactist-actionable-primary-idle-fill);bottom:-4px;content:"";left:-4px;position:absolute;right:-4px;top:-4px}
 .d6ec37c5{width:-webkit-min-content;width:-moz-min-content;width:min-content}.d6ec37c5 textarea{outline:none;border:none;padding:0;box-sizing:border-box;font-family:var(--reactist-font-family)}.d6ec37c5:not(.a60d6043) textarea{border-radius:var(--reactist-border-radius-small);padding:var(--reactist-spacing-small)}.d6ec37c5.a60d6043{border-radius:var(--reactist-border-radius-large)}.d6ec37c5.a60d6043,.d6ec37c5:not(.a60d6043) textarea{border:1px solid var(--reactist-divider-secondary)}.d6ec37c5.a60d6043:focus-within,.d6ec37c5:not(.a60d6043) textarea:focus{border-color:var(--reactist-divider-primary)}.d6ec37c5.a60d6043.bef49c61,.d6ec37c5.bef49c61:not(.a60d6043) textarea{border-color:var(--reactist-alert-tone-critical-border)!important}
 ._9d172ece:not(.c59d0239){border-radius:var(--reactist-border-radius-small);border:1px solid var(--reactist-divider-secondary);overflow:clip}._9d172ece.c59d0239 input{padding:0;height:24px}._9d172ece:not(.c59d0239):focus-within{border-color:var(--reactist-divider-primary)}._9d172ece:not(.c59d0239)._7e63ee20{border-color:var(--reactist-alert-tone-critical-border)!important}._9d172ece input{color:var(--reactist-content-primary);flex:1;outline:none;box-sizing:border-box;width:100%;background:transparent;border:none;--tmp-desired-height:30px;--tmp-line-height-increase:4px;--tmp-vertical-padding:calc((var(--tmp-desired-height) - var(--reactist-font-size-body) - var(--tmp-line-height-increase))/2);font-size:var(--reactist-font-size-body);line-height:calc(var(--reactist-font-size-body) + 4px);margin:0}._9d172ece:not(.c59d0239) input{padding:var(--tmp-vertical-padding) 10px}
-:root{--reactist-tab-themed-background:var(--reactist-bg-default);--reactist-tab-themed-foreground:#006f85;--reactist-tab-themed-unselected:#006f85;--reactist-tab-themed-track:#f2f6f7;--reactist-tab-themed-border:var(--reactist-divider-secondary);--reactist-tab-neutral-background:var(--reactist-bg-default);--reactist-tab-neutral-foreground:var(--reactist-content-primary);--reactist-tab-neutral-unselected:var(--reactist-content-tertiary);--reactist-tab-neutral-track:var(--reactist-framework-fill-selected);--reactist-tab-neutral-border:var(--reactist-divider-primary);--reactist-tab-track-border-width:2px;--reactist-tab-border-radius:20px;--reactist-tab-border-width:1px}._76bbcdaa{box-sizing:border-box;padding:0 var(--reactist-spacing-medium);border:none;background:none;cursor:pointer;font-size:var(--reactist-font-size-body);font-weight:var(--reactist-font-weight-medium);line-height:32px;z-index:1;text-decoration:none;border:var(--reactist-tab-border-width) solid transparent;border-radius:var(--reactist-tab-border-radius)}._531eb92b{position:absolute;top:calc(-1*var(--reactist-tab-track-border-width));right:calc(-1*var(--reactist-tab-track-border-width));bottom:calc(-1*var(--reactist-tab-track-border-width));left:calc(-1*var(--reactist-tab-track-border-width));margin-top:var(--reactist-spacing-large);border-radius:var(--reactist-tab-border-radius);border-width:var(--reactist-tab-track-border-width);border-style:solid}._76bbcdaa,._13321d47{color:var(--reactist-tab-neutral-unselected)}._13321d47[aria-selected=true],._76bbcdaa[aria-selected=true]{background-color:var(--reactist-tab-neutral-background);color:var(--reactist-tab-neutral-foreground);border-color:var(--reactist-tab-neutral-border)}._58c4d63d{color:var(--reactist-tab-themed-unselected)}._58c4d63d[aria-selected=true]{background-color:var(--reactist-tab-themed-background);color:var(--reactist-tab-themed-foreground);border-color:var(--reactist-tab-themed-border)}._531eb92b,._11ef0184{background:var(--reactist-tab-neutral-track);border-color:var(--reactist-tab-neutral-track)}.ce590259{background:var(--reactist-tab-themed-track);border-color:var(--reactist-tab-themed-track)}.d8366aff{margin-top:var(--reactist-spacing-xsmall)}.e28fbcf0{margin-top:var(--reactist-spacing-small)}._1e1d7d0e{margin-top:var(--reactist-spacing-medium)}._611e18a3{margin-top:var(--reactist-spacing-large)}._7e083426{margin-top:var(--reactist-spacing-xlarge)}._37c54913{margin-top:var(--reactist-spacing-xxlarge)}
+:root{--reactist-tab-themed-background:var(--reactist-bg-default);--reactist-tab-themed-foreground:#006f85;--reactist-tab-themed-unselected:#006f85;--reactist-tab-themed-track:#f2f6f7;--reactist-tab-themed-border:var(--reactist-divider-secondary);--reactist-tab-neutral-background:var(--reactist-bg-default);--reactist-tab-neutral-foreground:var(--reactist-content-primary);--reactist-tab-neutral-unselected:var(--reactist-content-tertiary);--reactist-tab-neutral-track:var(--reactist-framework-fill-selected);--reactist-tab-neutral-border:var(--reactist-divider-primary);--reactist-tab-track-border-width:2px;--reactist-tab-border-radius:20px;--reactist-tab-border-width:1px;--reactist-tab-height:30px}.a1064a3b{box-sizing:border-box;padding:0 var(--reactist-spacing-medium);border:none;background:none;cursor:pointer;font-size:var(--reactist-font-size-body);font-weight:var(--reactist-font-weight-medium);line-height:var(--reactist-tab-height);z-index:1;text-decoration:none;border:var(--reactist-tab-border-width) solid transparent;border-radius:var(--reactist-tab-border-radius)}._06f1b8a1{position:absolute;top:calc(-1*var(--reactist-tab-track-border-width));right:calc(-1*var(--reactist-tab-track-border-width));bottom:calc(-1*var(--reactist-tab-track-border-width));left:calc(-1*var(--reactist-tab-track-border-width));margin-top:var(--reactist-spacing-large);border-radius:var(--reactist-tab-border-radius);border-width:var(--reactist-tab-track-border-width);border-style:solid}.a1064a3b,.dabbec7d{color:var(--reactist-tab-neutral-unselected)}.dabbec7d[aria-selected=true],.a1064a3b[aria-selected=true]{background-color:var(--reactist-tab-neutral-background);color:var(--reactist-tab-neutral-foreground);border-color:var(--reactist-tab-neutral-border)}.e6f5ae4e{color:var(--reactist-tab-themed-unselected)}.e6f5ae4e[aria-selected=true]{background-color:var(--reactist-tab-themed-background);color:var(--reactist-tab-themed-foreground);border-color:var(--reactist-tab-themed-border)}._06f1b8a1,._43913ce5{background:var(--reactist-tab-neutral-track);border-color:var(--reactist-tab-neutral-track)}._39bdfdde{background:var(--reactist-tab-themed-track);border-color:var(--reactist-tab-themed-track)}._1c148f4e{margin-top:var(--reactist-spacing-xsmall)}._2a370df5{margin-top:var(--reactist-spacing-small)}._77430437{margin-top:var(--reactist-spacing-medium)}._33db5352{margin-top:var(--reactist-spacing-large)}._60bf9564{margin-top:var(--reactist-spacing-xlarge)}._29a35080{margin-top:var(--reactist-spacing-xxlarge)}
 @-webkit-keyframes _77f9687f{0%{opacity:0}to{opacity:1}}@keyframes _77f9687f{0%{opacity:0}to{opacity:1}}:root{--reach-dialog:1;--reactist-modal-overlay-fill:rgba(0,0,0,0.5);--reactist-modal-padding-top:13vh}._37bef8d8{isolation:isolate}[data-reach-dialog-overlay]{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;background-color:var(--reactist-modal-overlay-fill);-webkit-animation:_77f9687f .2s;animation:_77f9687f .2s;-webkit-animation-timing-function:cubic-bezier(.4,0,.2,1);animation-timing-function:cubic-bezier(.4,0,.2,1);transition:background-color .5s;display:flex;align-items:center;justify-content:center;z-index:var(--reactist-stacking-order-modal,1)}[data-reach-dialog-overlay]>[data-focus-lock-disabled]{display:flex;flex-direction:column;align-items:center;width:100%;height:100%;box-sizing:border-box;padding:var(--reactist-spacing-xxlarge)}[data-reach-dialog-overlay].bcc4e0a5>[data-focus-lock-disabled]{padding-top:var(--reactist-modal-padding-top)}[data-reach-dialog-overlay].bcc4e0a5>[data-focus-lock-disabled] .d4832c2d{max-height:calc(100vh - 2*var(--reactist-modal-padding-top))}[data-reach-dialog-content]{background:var(--reactist-bg-default);padding:0;outline:none;transition:box-shadow .5s}.d4832c2d{box-shadow:0 2px 8px 0 rgba(0,0,0,.16);transition:width .2s ease-in-out;max-width:100%}.b0c3b021 .d4832c2d{width:100%}._573d6aa5 .d4832c2d{width:768px}._8550d996 .d4832c2d{width:580px}._43bb18f5 .d4832c2d{width:450px}@media (min-width:992px){._57b4159d .d4832c2d{width:960px}}@media (min-width:1200px){._57b4159d .d4832c2d{width:1060px}}@media (max-width:1000px){._57b4159d .d4832c2d{width:768px}}@media (max-width:580px){.cb63f300:not(._43bb18f5) .d4832c2d{width:100%!important;max-height:none}.cb63f300.e741893e:not(._43bb18f5)>[data-focus-lock-disabled]{padding-left:0;padding-right:0;padding-bottom:0}.cb63f300.e741893e:not(._43bb18f5) .d4832c2d{border-bottom-left-radius:0;border-bottom-right-radius:0}}@media (max-width:400px){.d4832c2d{width:100%!important;max-height:none}.cb63f300.e741893e>[data-focus-lock-disabled]{padding-left:0;padding-right:0;padding-bottom:0}.cb63f300.e741893e .d4832c2d{border-bottom-left-radius:0;border-bottom-right-radius:0}}.bb1ce281{display:flex;align-items:center;height:32px}.c5ef989c{min-height:32px}
 :root{--reactist-avatar-size-xxsmall:16px;--reactist-avatar-size-xsmall:20px;--reactist-avatar-size-small:30px;--reactist-avatar-size-medium:32px;--reactist-avatar-size-large:34px;--reactist-avatar-size-xlarge:48px;--reactist-avatar-size-xxlarge:70px;--reactist-avatar-size-xxxlarge:100px;--reactist-avatar-size:var(--reactist-avatar-size-large)}._38a1be89{flex-shrink:0;background-position:50%;color:#fff;text-align:center;border-radius:50%;width:var(--reactist-avatar-size);height:var(--reactist-avatar-size);line-height:var(--reactist-avatar-size);background-size:var(--reactist-avatar-size);font-size:calc(var(--reactist-avatar-size)/2)}.d32e92ae{--reactist-avatar-size:var(--reactist-avatar-size-xxsmall)}._0667d719{--reactist-avatar-size:var(--reactist-avatar-size-xsmall)}.cf529fcf{--reactist-avatar-size:var(--reactist-avatar-size-small)}._6e268eab{--reactist-avatar-size:var(--reactist-avatar-size-medium)}.d64c62cf{--reactist-avatar-size:var(--reactist-avatar-size-large)}._44fb77de{--reactist-avatar-size:var(--reactist-avatar-size-xlarge)}._01f85e0e{--reactist-avatar-size:var(--reactist-avatar-size-xxlarge)}._41a5fe19{--reactist-avatar-size:var(--reactist-avatar-size-xxxlarge)}@media (min-width:768px){._6ab1577d{--reactist-avatar-size:var(--reactist-avatar-size-xxsmall)}.b52a4963{--reactist-avatar-size:var(--reactist-avatar-size-xsmall)}._714a8419{--reactist-avatar-size:var(--reactist-avatar-size-small)}._81cd4d51{--reactist-avatar-size:var(--reactist-avatar-size-medium)}.bf0a4edb{--reactist-avatar-size:var(--reactist-avatar-size-large)}.e4f0dabd{--reactist-avatar-size:var(--reactist-avatar-size-xlarge)}._67ea065d{--reactist-avatar-size:var(--reactist-avatar-size-xxlarge)}._2af7f76f{--reactist-avatar-size:var(--reactist-avatar-size-xxxlarge)}}@media (min-width:992px){._759081dc{--reactist-avatar-size:var(--reactist-avatar-size-xxsmall)}._8290d1c1{--reactist-avatar-size:var(--reactist-avatar-size-xsmall)}._48ea172d{--reactist-avatar-size:var(--reactist-avatar-size-small)}._758f6641{--reactist-avatar-size:var(--reactist-avatar-size-medium)}.f9ada088{--reactist-avatar-size:var(--reactist-avatar-size-large)}.d3bb7470{--reactist-avatar-size:var(--reactist-avatar-size-xlarge)}._9a312ee3{--reactist-avatar-size:var(--reactist-avatar-size-xxlarge)}.a1d30c23{--reactist-avatar-size:var(--reactist-avatar-size-xxxlarge)}}
 .reactist_color_picker .color_trigger{flex:0 0 auto;display:flex;align-items:center;justify-content:center;height:24px;width:24px;border-radius:50%;cursor:pointer;background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCI+PHBhdGggZmlsbD0iI0ZGRiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNOS4yNSAxMC42NDZsMi42NDYgMi42NDcgMi42NDctMi42NDdhLjUuNSAwIDAxLjcwNy43MDhMMTIuNjA0IDE0YTEgMSAwIDAxLTEuNDE1IDBsLTIuNjQ2LTIuNjQ2YS41LjUgMCAwMS43MDctLjcwOHoiLz48L3N2Zz4=);background-position:50%;background-repeat:no-repeat;background-size:24px}.reactist_color_picker .color_trigger--inner_ring{background-color:rgba(0,0,0,.1);width:14px;height:14px;border-radius:50%;visibility:hidden}.reactist_color_picker .color_trigger:hover .color_trigger--inner_ring{visibility:visible}.reactist_color_picker .color_trigger.small{height:18px;width:18px}.reactist_color_picker .color_trigger.small .color_trigger--inner_ring{width:12px;height:12px}.reactist_color_picker .color_item{flex:0 0 auto;display:flex;align-items:center;justify-content:center;margin:4px;width:32px;height:32px;border-radius:50%;cursor:pointer}.reactist_color_picker .color_item--inner_ring{background-color:transparent;border:2px solid #fff;height:24px;width:24px;border-radius:50%;visibility:hidden}.reactist_color_picker .color_item:hover .color_item--inner_ring{visibility:visible}.reactist_color_picker .color_item.active{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCI+PHBhdGggZmlsbD0iI0ZGRiIgZmlsbC1ydWxlPSJldmVub2RkIiBkPSJNMTAuOTc0IDE0Ljc3MWw0LjE2LTcuMjA0YS40OTkuNDk5IDAgMTEuODYzLjQ5OWwtNC40NyA3Ljc0NGEuNDk5LjQ5OSAwIDAxLS43MzUuMTQ3LjUwMi41MDIgMCAwMS0uMDYxLS4wNDhsLTMuMzY2LTMuMTRhLjQ5OS40OTkgMCAxMS42OC0uNzI5bDIuOTI5IDIuNzMxeiIvPjwvc3ZnPg==);background-position:50%;background-repeat:no-repeat}.reactist_color_picker .color_options{padding:6px;display:flex;flex-wrap:wrap;width:164px;position:relative}.reactist_color_picker .with_arrow:after,.reactist_color_picker .with_arrow:before{visibility:hidden}

package/styles/tabs.css

@@ -1,5 +1,5 @@
 ._6b1279e0{margin:calc(var(--reactist-spacing-xsmall)*-1) 0 0 calc(var(--reactist-spacing-xsmall)*-1)}._6b1279e0>*{margin:var(--reactist-spacing-xsmall) 0 0 var(--reactist-spacing-xsmall)}._0d82c42d{margin:calc(var(--reactist-spacing-small)*-1) 0 0 calc(var(--reactist-spacing-small)*-1)}._0d82c42d>*{margin:var(--reactist-spacing-small) 0 0 var(--reactist-spacing-small)}._556714e1{margin:calc(var(--reactist-spacing-medium)*-1) 0 0 calc(var(--reactist-spacing-medium)*-1)}._556714e1>*{margin:var(--reactist-spacing-medium) 0 0 var(--reactist-spacing-medium)}.e90b43fb{margin:calc(var(--reactist-spacing-large)*-1) 0 0 calc(var(--reactist-spacing-large)*-1)}.e90b43fb>*{margin:var(--reactist-spacing-large) 0 0 var(--reactist-spacing-large)}.a9c34345{margin:calc(var(--reactist-spacing-xlarge)*-1) 0 0 calc(var(--reactist-spacing-xlarge)*-1)}.a9c34345>*{margin:var(--reactist-spacing-xlarge) 0 0 var(--reactist-spacing-xlarge)}.aa102efe{margin:calc(var(--reactist-spacing-xxlarge)*-1) 0 0 calc(var(--reactist-spacing-xxlarge)*-1)}.aa102efe>*{margin:var(--reactist-spacing-xxlarge) 0 0 var(--reactist-spacing-xxlarge)}@media (min-width:768px){._34d16157{margin:calc(var(--reactist-spacing-xsmall)*-1) 0 0 calc(var(--reactist-spacing-xsmall)*-1)}._34d16157>*{margin:var(--reactist-spacing-xsmall) 0 0 var(--reactist-spacing-xsmall)}.c7e0e54f{margin:calc(var(--reactist-spacing-small)*-1) 0 0 calc(var(--reactist-spacing-small)*-1)}.c7e0e54f>*{margin:var(--reactist-spacing-small) 0 0 var(--reactist-spacing-small)}._7f2a4e4b{margin:calc(var(--reactist-spacing-medium)*-1) 0 0 calc(var(--reactist-spacing-medium)*-1)}._7f2a4e4b>*{margin:var(--reactist-spacing-medium) 0 0 var(--reactist-spacing-medium)}.ae256487{margin:calc(var(--reactist-spacing-large)*-1) 0 0 calc(var(--reactist-spacing-large)*-1)}.ae256487>*{margin:var(--reactist-spacing-large) 0 0 var(--reactist-spacing-large)}.e88be0f7{margin:calc(var(--reactist-spacing-xlarge)*-1) 0 0 calc(var(--reactist-spacing-xlarge)*-1)}.e88be0f7>*{margin:var(--reactist-spacing-xlarge) 0 0 var(--reactist-spacing-xlarge)}.dc7bcb18{margin:calc(var(--reactist-spacing-xxlarge)*-1) 0 0 calc(var(--reactist-spacing-xxlarge)*-1)}.dc7bcb18>*{margin:var(--reactist-spacing-xxlarge) 0 0 var(--reactist-spacing-xxlarge)}}@media (min-width:992px){._853f3012{margin:calc(var(--reactist-spacing-xsmall)*-1) 0 0 calc(var(--reactist-spacing-xsmall)*-1)}._853f3012>*{margin:var(--reactist-spacing-xsmall) 0 0 var(--reactist-spacing-xsmall)}._3bfaf758{margin:calc(var(--reactist-spacing-small)*-1) 0 0 calc(var(--reactist-spacing-small)*-1)}._3bfaf758>*{margin:var(--reactist-spacing-small) 0 0 var(--reactist-spacing-small)}._36462a93{margin:calc(var(--reactist-spacing-medium)*-1) 0 0 calc(var(--reactist-spacing-medium)*-1)}._36462a93>*{margin:var(--reactist-spacing-medium) 0 0 var(--reactist-spacing-medium)}.e73081b7{margin:calc(var(--reactist-spacing-large)*-1) 0 0 calc(var(--reactist-spacing-large)*-1)}.e73081b7>*{margin:var(--reactist-spacing-large) 0 0 var(--reactist-spacing-large)}.e22ec9dd{margin:calc(var(--reactist-spacing-xlarge)*-1) 0 0 calc(var(--reactist-spacing-xlarge)*-1)}.e22ec9dd>*{margin:var(--reactist-spacing-xlarge) 0 0 var(--reactist-spacing-xlarge)}._4a20bd12{margin:calc(var(--reactist-spacing-xxlarge)*-1) 0 0 calc(var(--reactist-spacing-xxlarge)*-1)}._4a20bd12>*{margin:var(--reactist-spacing-xxlarge) 0 0 var(--reactist-spacing-xxlarge)}}
-:root{--reactist-tab-themed-background:var(--reactist-bg-default);--reactist-tab-themed-foreground:#006f85;--reactist-tab-themed-unselected:#006f85;--reactist-tab-themed-track:#f2f6f7;--reactist-tab-themed-border:var(--reactist-divider-secondary);--reactist-tab-neutral-background:var(--reactist-bg-default);--reactist-tab-neutral-foreground:var(--reactist-content-primary);--reactist-tab-neutral-unselected:var(--reactist-content-tertiary);--reactist-tab-neutral-track:var(--reactist-framework-fill-selected);--reactist-tab-neutral-border:var(--reactist-divider-primary);--reactist-tab-track-border-width:2px;--reactist-tab-border-radius:20px;--reactist-tab-border-width:1px}._76bbcdaa{box-sizing:border-box;padding:0 var(--reactist-spacing-medium);border:none;background:none;cursor:pointer;font-size:var(--reactist-font-size-body);font-weight:var(--reactist-font-weight-medium);line-height:32px;z-index:1;text-decoration:none;border:var(--reactist-tab-border-width) solid transparent;border-radius:var(--reactist-tab-border-radius)}._531eb92b{position:absolute;top:calc(-1*var(--reactist-tab-track-border-width));right:calc(-1*var(--reactist-tab-track-border-width));bottom:calc(-1*var(--reactist-tab-track-border-width));left:calc(-1*var(--reactist-tab-track-border-width));margin-top:var(--reactist-spacing-large);border-radius:var(--reactist-tab-border-radius);border-width:var(--reactist-tab-track-border-width);border-style:solid}._76bbcdaa,._13321d47{color:var(--reactist-tab-neutral-unselected)}._13321d47[aria-selected=true],._76bbcdaa[aria-selected=true]{background-color:var(--reactist-tab-neutral-background);color:var(--reactist-tab-neutral-foreground);border-color:var(--reactist-tab-neutral-border)}._58c4d63d{color:var(--reactist-tab-themed-unselected)}._58c4d63d[aria-selected=true]{background-color:var(--reactist-tab-themed-background);color:var(--reactist-tab-themed-foreground);border-color:var(--reactist-tab-themed-border)}._531eb92b,._11ef0184{background:var(--reactist-tab-neutral-track);border-color:var(--reactist-tab-neutral-track)}.ce590259{background:var(--reactist-tab-themed-track);border-color:var(--reactist-tab-themed-track)}.d8366aff{margin-top:var(--reactist-spacing-xsmall)}.e28fbcf0{margin-top:var(--reactist-spacing-small)}._1e1d7d0e{margin-top:var(--reactist-spacing-medium)}._611e18a3{margin-top:var(--reactist-spacing-large)}._7e083426{margin-top:var(--reactist-spacing-xlarge)}._37c54913{margin-top:var(--reactist-spacing-xxlarge)}
+:root{--reactist-tab-themed-background:var(--reactist-bg-default);--reactist-tab-themed-foreground:#006f85;--reactist-tab-themed-unselected:#006f85;--reactist-tab-themed-track:#f2f6f7;--reactist-tab-themed-border:var(--reactist-divider-secondary);--reactist-tab-neutral-background:var(--reactist-bg-default);--reactist-tab-neutral-foreground:var(--reactist-content-primary);--reactist-tab-neutral-unselected:var(--reactist-content-tertiary);--reactist-tab-neutral-track:var(--reactist-framework-fill-selected);--reactist-tab-neutral-border:var(--reactist-divider-primary);--reactist-tab-track-border-width:2px;--reactist-tab-border-radius:20px;--reactist-tab-border-width:1px;--reactist-tab-height:30px}.a1064a3b{box-sizing:border-box;padding:0 var(--reactist-spacing-medium);border:none;background:none;cursor:pointer;font-size:var(--reactist-font-size-body);font-weight:var(--reactist-font-weight-medium);line-height:var(--reactist-tab-height);z-index:1;text-decoration:none;border:var(--reactist-tab-border-width) solid transparent;border-radius:var(--reactist-tab-border-radius)}._06f1b8a1{position:absolute;top:calc(-1*var(--reactist-tab-track-border-width));right:calc(-1*var(--reactist-tab-track-border-width));bottom:calc(-1*var(--reactist-tab-track-border-width));left:calc(-1*var(--reactist-tab-track-border-width));margin-top:var(--reactist-spacing-large);border-radius:var(--reactist-tab-border-radius);border-width:var(--reactist-tab-track-border-width);border-style:solid}.a1064a3b,.dabbec7d{color:var(--reactist-tab-neutral-unselected)}.dabbec7d[aria-selected=true],.a1064a3b[aria-selected=true]{background-color:var(--reactist-tab-neutral-background);color:var(--reactist-tab-neutral-foreground);border-color:var(--reactist-tab-neutral-border)}.e6f5ae4e{color:var(--reactist-tab-themed-unselected)}.e6f5ae4e[aria-selected=true]{background-color:var(--reactist-tab-themed-background);color:var(--reactist-tab-themed-foreground);border-color:var(--reactist-tab-themed-border)}._06f1b8a1,._43913ce5{background:var(--reactist-tab-neutral-track);border-color:var(--reactist-tab-neutral-track)}._39bdfdde{background:var(--reactist-tab-themed-track);border-color:var(--reactist-tab-themed-track)}._1c148f4e{margin-top:var(--reactist-spacing-xsmall)}._2a370df5{margin-top:var(--reactist-spacing-small)}._77430437{margin-top:var(--reactist-spacing-medium)}._33db5352{margin-top:var(--reactist-spacing-large)}._60bf9564{margin-top:var(--reactist-spacing-xlarge)}._29a35080{margin-top:var(--reactist-spacing-xxlarge)}
 .f9408a0e{box-sizing:border-box;border:0;margin:0;padding:0;font-size:var(--reactist-font-size-body);font-family:inherit;vertical-align:baseline;background-color:transparent;list-style:none}pre.f9408a0e{font-family:monospace}.f9408a0e[hidden]{display:none!important}._7807dcdd{position:absolute}.dc5f328c{position:fixed}._0e4ff085{position:relative}._4019d94a{position:-webkit-sticky;position:sticky}@media (min-width:768px){.b1865c0f{position:absolute}.af8c5967{position:fixed}.ef2b609f{position:relative}._04935ffd{position:-webkit-sticky;position:sticky}}@media (min-width:992px){.bda94091{position:absolute}._691dfd31{position:fixed}.efda904e{position:relative}.bcf04687{position:-webkit-sticky;position:sticky}}.b5b9f34a{display:block}._6e9db9aa{display:flex}.ece6d246{display:inline}.e5e2223f{display:inline-block}.f344a0e2{display:inline-flex}._9002f8c2{display:none}@media (min-width:768px){.d896f0ff{display:block}._56412665{display:flex}._6b430cc5{display:inline}._4158c5ad{display:inline-block}.c598eaab{display:inline-flex}._5a2a6d3f{display:none}}@media (min-width:992px){._132ef8fb{display:block}._5bd11385{display:flex}.a51c2ec9{display:inline}._93506988{display:inline-block}._385d45a5{display:inline-flex}._921732eb{display:none}}._41ef5755{flex-direction:column}._6cad1a19{flex-direction:row}@media (min-width:768px){.f1c16205{flex-direction:column}._65305ae1{flex-direction:row}}@media (min-width:992px){._4916f0f9{flex-direction:column}._430dfc8e{flex-direction:row}}._3d2d56fe{flex-wrap:wrap}._826e4adf{flex-wrap:nowrap}.f8344e0f{flex-shrink:0}.f117e2ab{flex-grow:0}._1355325c{flex-grow:1}.c5b05c6a{align-items:flex-start}._21b8bafa{align-items:center}._56d73c9b{align-items:flex-end}._052e0707{align-items:baseline}@media (min-width:768px){._90048c98{align-items:flex-start}._7e189a0b{align-items:center}.b8aefb5c{align-items:flex-end}._4c1a5ef9{align-items:baseline}}@media (min-width:992px){.f4d052ef{align-items:flex-start}.e5478926{align-items:center}.b4f5051a{align-items:flex-end}.b21adace{align-items:baseline}}.be6deb6a{justify-content:flex-start}.d8eaf780{justify-content:center}._9212ca89{justify-content:flex-end}._5d2cd095{justify-content:space-around}._00d5fe7e{justify-content:space-between}.ce4f4c2d{justify-content:space-evenly}@media (min-width:768px){._6580dbbc{justify-content:flex-start}._3f689891{justify-content:center}._628df8db{justify-content:flex-end}._3ea88b4f{justify-content:space-around}._4554d93d{justify-content:space-between}.eb13fb50{justify-content:space-evenly}}@media (min-width:992px){._36dc744d{justify-content:flex-start}.ee7077ab{justify-content:center}._4edc8c86{justify-content:flex-end}._3ea88b4f{justify-content:space-around}._7e147696{justify-content:space-between}.eb13fb50{justify-content:space-evenly}}.c0655cd6{align-self:stretch}._11863030{align-self:flex-start}.c6d86139{align-self:center}.c0bd1f82{align-self:flex-end}._95686aec{align-self:baseline}@media (min-width:768px){._9b712cc7{align-self:stretch}.f7b935f7{align-self:flex-start}.bf9ad125{align-self:center}._3b4f8c3c{align-self:flex-end}._49d27079{align-self:baseline}}@media (min-width:992px){._63d27ffa{align-self:stretch}.d45796cc{align-self:flex-start}.c91c7bf7{align-self:center}.f2453212{align-self:flex-end}._3882757c{align-self:baseline}}._473810b4{overflow:hidden}._051c2340{overflow:auto}._14e451d1{overflow:visible}._4d8555f8{overflow:scroll}._867d251e{height:100%}._2d928bf8{background-color:var(--reactist-bg-default)}.db3f5af6{background-color:var(--reactist-bg-aside)}.c990fcc3{background-color:var(--reactist-bg-highlight)}._976a662f{background-color:var(--reactist-bg-selected)}._46b52f05{border-radius:var(--reactist-border-radius-small)}._1c8b326b{border-radius:var(--reactist-border-radius-large)}._0ef8c314{border:1px solid var(--reactist-divider-primary)}._14871605{border:1px solid var(--reactist-divider-secondary)}._36c045c3{border:1px solid var(--reactist-divider-tertiary)}.d745aa1e{text-align:start}._31cf99c5{text-align:center}._10a7a030{text-align:end}._2cfc8b46{text-align:justify}@media (min-width:768px){.e6b7bb40{text-align:start}._47dcb91c{text-align:center}._1d4011ce{text-align:end}._18407499{text-align:justify}}@media (min-width:992px){._565de5cf{text-align:start}._64254ba3{text-align:center}._3cc6a504{text-align:end}._0efec659{text-align:justify}}
 .c4803194{padding-top:var(--reactist-spacing-xsmall)}._4e9ab24b{padding-top:var(--reactist-spacing-small)}._1d226e27{padding-top:var(--reactist-spacing-medium)}.eb6097f1{padding-top:var(--reactist-spacing-large)}.d3229ba4{padding-top:var(--reactist-spacing-xlarge)}._47978ba4{padding-top:var(--reactist-spacing-xxlarge)}@media (min-width:768px){.f987719c{padding-top:var(--reactist-spacing-xsmall)}._8dbc4b4d{padding-top:var(--reactist-spacing-small)}.ae44fe07{padding-top:var(--reactist-spacing-medium)}.ffe9548d{padding-top:var(--reactist-spacing-large)}.f2b76a44{padding-top:var(--reactist-spacing-xlarge)}.c6eb8f43{padding-top:var(--reactist-spacing-xxlarge)}}@media (min-width:992px){._8699b560{padding-top:var(--reactist-spacing-xsmall)}._02c374b7{padding-top:var(--reactist-spacing-small)}._0dd0332f{padding-top:var(--reactist-spacing-medium)}.da55f1f6{padding-top:var(--reactist-spacing-large)}._8ef2a278{padding-top:var(--reactist-spacing-xlarge)}._8b493b28{padding-top:var(--reactist-spacing-xxlarge)}}._211eebc7{padding-right:var(--reactist-spacing-xsmall)}.ad0ccf15{padding-right:var(--reactist-spacing-small)}.a03e39af{padding-right:var(--reactist-spacing-medium)}.f0941ead{padding-right:var(--reactist-spacing-large)}.e47c5a43{padding-right:var(--reactist-spacing-xlarge)}.e849a5cf{padding-right:var(--reactist-spacing-xxlarge)}@media (min-width:768px){._85374228{padding-right:var(--reactist-spacing-xsmall)}._89df37b9{padding-right:var(--reactist-spacing-small)}._1cc50ebe{padding-right:var(--reactist-spacing-medium)}._1060982b{padding-right:var(--reactist-spacing-large)}.be58847d{padding-right:var(--reactist-spacing-xlarge)}._45093484{padding-right:var(--reactist-spacing-xxlarge)}}@media (min-width:992px){.f8d99d6a{padding-right:var(--reactist-spacing-xsmall)}.efa076d9{padding-right:var(--reactist-spacing-small)}.e59caa64{padding-right:var(--reactist-spacing-medium)}.da42f46a{padding-right:var(--reactist-spacing-large)}.b3ee2580{padding-right:var(--reactist-spacing-xlarge)}._3ef94658{padding-right:var(--reactist-spacing-xxlarge)}}.b0e6eab4{padding-bottom:var(--reactist-spacing-xsmall)}._9510d053{padding-bottom:var(--reactist-spacing-small)}.d7af60c9{padding-bottom:var(--reactist-spacing-medium)}.b75f86cd{padding-bottom:var(--reactist-spacing-large)}.fbd4ce29{padding-bottom:var(--reactist-spacing-xlarge)}._33e3ad63{padding-bottom:var(--reactist-spacing-xxlarge)}@media (min-width:768px){.f0302da7{padding-bottom:var(--reactist-spacing-xsmall)}._4f9b8012{padding-bottom:var(--reactist-spacing-small)}._4333e20e{padding-bottom:var(--reactist-spacing-medium)}._30bbc76c{padding-bottom:var(--reactist-spacing-large)}.ba5a4008{padding-bottom:var(--reactist-spacing-xlarge)}._423a3b1a{padding-bottom:var(--reactist-spacing-xxlarge)}}@media (min-width:992px){.b40139b7{padding-bottom:var(--reactist-spacing-xsmall)}.f96071fa{padding-bottom:var(--reactist-spacing-small)}.fe803c9a{padding-bottom:var(--reactist-spacing-medium)}._01686eb9{padding-bottom:var(--reactist-spacing-large)}.afa763d8{padding-bottom:var(--reactist-spacing-xlarge)}.a95785f1{padding-bottom:var(--reactist-spacing-xxlarge)}}.cad4e2ec{padding-left:var(--reactist-spacing-xsmall)}.d70b3c17{padding-left:var(--reactist-spacing-small)}._8c851bd6{padding-left:var(--reactist-spacing-medium)}._078feb3c{padding-left:var(--reactist-spacing-large)}._76ab968c{padding-left:var(--reactist-spacing-xlarge)}.aaca85d7{padding-left:var(--reactist-spacing-xxlarge)}@media (min-width:768px){._5eb0e5aa{padding-left:var(--reactist-spacing-xsmall)}._0384fb4f{padding-left:var(--reactist-spacing-small)}.edffff6f{padding-left:var(--reactist-spacing-medium)}._873b9a46{padding-left:var(--reactist-spacing-large)}._89105db5{padding-left:var(--reactist-spacing-xlarge)}.db1966fe{padding-left:var(--reactist-spacing-xxlarge)}}@media (min-width:992px){.b17f826b{padding-left:var(--reactist-spacing-xsmall)}._6dc83610{padding-left:var(--reactist-spacing-small)}._3421b8b2{padding-left:var(--reactist-spacing-medium)}._68cec7a6{padding-left:var(--reactist-spacing-large)}._94bde020{padding-left:var(--reactist-spacing-xlarge)}.b94ee579{padding-left:var(--reactist-spacing-xxlarge)}}
 .c7813d79{margin-top:var(--reactist-spacing-xsmall)}.d3449da6{margin-top:var(--reactist-spacing-small)}._4ea254c1{margin-top:var(--reactist-spacing-medium)}.c0844f64{margin-top:var(--reactist-spacing-large)}._213145b4{margin-top:var(--reactist-spacing-xlarge)}.df61c84c{margin-top:var(--reactist-spacing-xxlarge)}.efe72b13{margin-top:calc(var(--reactist-spacing-xsmall)*-1)}._870c2768{margin-top:calc(var(--reactist-spacing-small)*-1)}._0b927c57{margin-top:calc(var(--reactist-spacing-medium)*-1)}._461db014{margin-top:calc(var(--reactist-spacing-large)*-1)}._2a3a8cb8{margin-top:calc(var(--reactist-spacing-xlarge)*-1)}._9bcda921{margin-top:calc(var(--reactist-spacing-xxlarge)*-1)}@media (min-width:768px){._6add01e4{margin-top:var(--reactist-spacing-xsmall)}._735ef86b{margin-top:var(--reactist-spacing-small)}._0477d068{margin-top:var(--reactist-spacing-medium)}._2c90af97{margin-top:var(--reactist-spacing-large)}._63a82db6{margin-top:var(--reactist-spacing-xlarge)}._03cd7726{margin-top:var(--reactist-spacing-xxlarge)}.c986a62a{margin-top:calc(var(--reactist-spacing-xsmall)*-1)}.be2bdcdd{margin-top:calc(var(--reactist-spacing-small)*-1)}._47d2686b{margin-top:calc(var(--reactist-spacing-medium)*-1)}._25e5af9d{margin-top:calc(var(--reactist-spacing-large)*-1)}.ee82f441{margin-top:calc(var(--reactist-spacing-xlarge)*-1)}.a6f9d404{margin-top:calc(var(--reactist-spacing-xxlarge)*-1)}}@media (min-width:992px){._4d8d9a36{margin-top:var(--reactist-spacing-xsmall)}.e813cee7{margin-top:var(--reactist-spacing-small)}._56975b7d{margin-top:var(--reactist-spacing-medium)}._53b367f6{margin-top:var(--reactist-spacing-large)}.d69e7311{margin-top:var(--reactist-spacing-xlarge)}._92f57c7e{margin-top:var(--reactist-spacing-xxlarge)}._96880d3e{margin-top:calc(var(--reactist-spacing-xsmall)*-1)}.dc3f3555{margin-top:calc(var(--reactist-spacing-small)*-1)}._86dd06bb{margin-top:calc(var(--reactist-spacing-medium)*-1)}.c93ef12e{margin-top:calc(var(--reactist-spacing-large)*-1)}.bc8fd4a2{margin-top:calc(var(--reactist-spacing-xlarge)*-1)}.b12a9124{margin-top:calc(var(--reactist-spacing-xxlarge)*-1)}}._6016f4fb{margin-right:var(--reactist-spacing-xsmall)}.b85e3dfa{margin-right:var(--reactist-spacing-small)}._297575f4{margin-right:var(--reactist-spacing-medium)}.b401ac6c{margin-right:var(--reactist-spacing-large)}.dc3ec387{margin-right:var(--reactist-spacing-xlarge)}._24694604{margin-right:var(--reactist-spacing-xxlarge)}._8e9bf2ee{margin-right:calc(var(--reactist-spacing-xsmall)*-1)}.ae9d1115{margin-right:calc(var(--reactist-spacing-small)*-1)}._14e46fc3{margin-right:calc(var(--reactist-spacing-medium)*-1)}._3370631b{margin-right:calc(var(--reactist-spacing-large)*-1)}._3f0e9b50{margin-right:calc(var(--reactist-spacing-xlarge)*-1)}.bc13e010{margin-right:calc(var(--reactist-spacing-xxlarge)*-1)}@media (min-width:768px){._6fa1aae3{margin-right:var(--reactist-spacing-xsmall)}._2976c5cb{margin-right:var(--reactist-spacing-small)}._38d94802{margin-right:var(--reactist-spacing-medium)}.db9569b5{margin-right:var(--reactist-spacing-large)}._4a52f06d{margin-right:var(--reactist-spacing-xlarge)}._8a0f0410{margin-right:var(--reactist-spacing-xxlarge)}.e7d40e9d{margin-right:calc(var(--reactist-spacing-xsmall)*-1)}._680fde91{margin-right:calc(var(--reactist-spacing-small)*-1)}._021010ca{margin-right:calc(var(--reactist-spacing-medium)*-1)}._9e52c87c{margin-right:calc(var(--reactist-spacing-large)*-1)}._4d602613{margin-right:calc(var(--reactist-spacing-xlarge)*-1)}._21b1b65a{margin-right:calc(var(--reactist-spacing-xxlarge)*-1)}}@media (min-width:992px){._7321bc07{margin-right:var(--reactist-spacing-xsmall)}.fa1721f4{margin-right:var(--reactist-spacing-small)}._3fd7b4b8{margin-right:var(--reactist-spacing-medium)}._4fdc2f74{margin-right:var(--reactist-spacing-large)}.c0254761{margin-right:var(--reactist-spacing-xlarge)}._710a5f09{margin-right:var(--reactist-spacing-xxlarge)}.e08bee7f{margin-right:calc(var(--reactist-spacing-xsmall)*-1)}.e5ab73d2{margin-right:calc(var(--reactist-spacing-small)*-1)}._5e731477{margin-right:calc(var(--reactist-spacing-medium)*-1)}._0f57a22e{margin-right:calc(var(--reactist-spacing-large)*-1)}._25f26ed3{margin-right:calc(var(--reactist-spacing-xlarge)*-1)}._11a3b4e0{margin-right:calc(var(--reactist-spacing-xxlarge)*-1)}}._6a4f69f7{margin-bottom:var(--reactist-spacing-xsmall)}.db26b033{margin-bottom:var(--reactist-spacing-small)}.c7313022{margin-bottom:var(--reactist-spacing-medium)}.a5885889{margin-bottom:var(--reactist-spacing-large)}._33dfbd8e{margin-bottom:var(--reactist-spacing-xlarge)}._795ad2de{margin-bottom:var(--reactist-spacing-xxlarge)}.a329dbd3{margin-bottom:calc(var(--reactist-spacing-xsmall)*-1)}._85e739fb{margin-bottom:calc(var(--reactist-spacing-small)*-1)}._681f65ff{margin-bottom:calc(var(--reactist-spacing-medium)*-1)}.caf50d8f{margin-bottom:calc(var(--reactist-spacing-large)*-1)}._1e084cbf{margin-bottom:calc(var(--reactist-spacing-xlarge)*-1)}._3dfb1c7e{margin-bottom:calc(var(--reactist-spacing-xxlarge)*-1)}@media (min-width:768px){.ef4735be{margin-bottom:var(--reactist-spacing-xsmall)}.de55afba{margin-bottom:var(--reactist-spacing-small)}._0e33ce88{margin-bottom:var(--reactist-spacing-medium)}._8ca391fc{margin-bottom:var(--reactist-spacing-large)}._3a609d23{margin-bottom:var(--reactist-spacing-xlarge)}._3e1177e4{margin-bottom:var(--reactist-spacing-xxlarge)}.d384884d{margin-bottom:calc(var(--reactist-spacing-xsmall)*-1)}._75254cec{margin-bottom:calc(var(--reactist-spacing-small)*-1)}._5d9f127d{margin-bottom:calc(var(--reactist-spacing-medium)*-1)}._835f1089{margin-bottom:calc(var(--reactist-spacing-large)*-1)}.dad52a72{margin-bottom:calc(var(--reactist-spacing-xlarge)*-1)}._8703a4bf{margin-bottom:calc(var(--reactist-spacing-xxlarge)*-1)}}@media (min-width:992px){._90fd20e9{margin-bottom:var(--reactist-spacing-xsmall)}.f3769191{margin-bottom:var(--reactist-spacing-small)}._156410f8{margin-bottom:var(--reactist-spacing-medium)}._7fed74d0{margin-bottom:var(--reactist-spacing-large)}._477dc10e{margin-bottom:var(--reactist-spacing-xlarge)}._85c82d89{margin-bottom:var(--reactist-spacing-xxlarge)}._4f09c1e0{margin-bottom:calc(var(--reactist-spacing-xsmall)*-1)}._9523e048{margin-bottom:calc(var(--reactist-spacing-small)*-1)}.efe10240{margin-bottom:calc(var(--reactist-spacing-medium)*-1)}.c43971e6{margin-bottom:calc(var(--reactist-spacing-large)*-1)}.f9b4da15{margin-bottom:calc(var(--reactist-spacing-xlarge)*-1)}.a10fdf70{margin-bottom:calc(var(--reactist-spacing-xxlarge)*-1)}}.f9be90b4{margin-left:var(--reactist-spacing-xsmall)}.f53218d5{margin-left:var(--reactist-spacing-small)}.c4a9b3ab{margin-left:var(--reactist-spacing-medium)}._5755e2c3{margin-left:var(--reactist-spacing-large)}._33fc9354{margin-left:var(--reactist-spacing-xlarge)}._4749a3bf{margin-left:var(--reactist-spacing-xxlarge)}.c76cb3c7{margin-left:calc(var(--reactist-spacing-xsmall)*-1)}._96003c07{margin-left:calc(var(--reactist-spacing-small)*-1)}._09988d07{margin-left:calc(var(--reactist-spacing-medium)*-1)}.b4a486f6{margin-left:calc(var(--reactist-spacing-large)*-1)}.f396e75e{margin-left:calc(var(--reactist-spacing-xlarge)*-1)}._81d1f26d{margin-left:calc(var(--reactist-spacing-xxlarge)*-1)}@media (min-width:768px){._0a46e8f1{margin-left:var(--reactist-spacing-xsmall)}._57c970af{margin-left:var(--reactist-spacing-small)}._4b6099d3{margin-left:var(--reactist-spacing-medium)}._378fcff5{margin-left:var(--reactist-spacing-large)}.f8785663{margin-left:var(--reactist-spacing-xlarge)}._72f957ee{margin-left:var(--reactist-spacing-xxlarge)}._2288c7e1{margin-left:calc(var(--reactist-spacing-xsmall)*-1)}.b27c1c05{margin-left:calc(var(--reactist-spacing-small)*-1)}._702cbb13{margin-left:calc(var(--reactist-spacing-medium)*-1)}._1a2748b4{margin-left:calc(var(--reactist-spacing-large)*-1)}.b8c043a5{margin-left:calc(var(--reactist-spacing-xlarge)*-1)}._8dc8ff63{margin-left:calc(var(--reactist-spacing-xxlarge)*-1)}}@media (min-width:992px){.c2af646d{margin-left:var(--reactist-spacing-xsmall)}.c03d07be{margin-left:var(--reactist-spacing-small)}._915fb1d3{margin-left:var(--reactist-spacing-medium)}._64214ee1{margin-left:var(--reactist-spacing-large)}._7be4a22c{margin-left:var(--reactist-spacing-xlarge)}._5ec0a401{margin-left:var(--reactist-spacing-xxlarge)}.ea29f1ee{margin-left:calc(var(--reactist-spacing-xsmall)*-1)}.c26652c7{margin-left:calc(var(--reactist-spacing-small)*-1)}.c24f6af9{margin-left:calc(var(--reactist-spacing-medium)*-1)}.c2671f27{margin-left:calc(var(--reactist-spacing-large)*-1)}.cc51a04e{margin-left:calc(var(--reactist-spacing-xlarge)*-1)}.fd581f54{margin-left:calc(var(--reactist-spacing-xxlarge)*-1)}}

package/styles/tabs.module.css.css

@@ -1 +1 @@
-:root{--reactist-tab-themed-background:var(--reactist-bg-default);--reactist-tab-themed-foreground:#006f85;--reactist-tab-themed-unselected:#006f85;--reactist-tab-themed-track:#f2f6f7;--reactist-tab-themed-border:var(--reactist-divider-secondary);--reactist-tab-neutral-background:var(--reactist-bg-default);--reactist-tab-neutral-foreground:var(--reactist-content-primary);--reactist-tab-neutral-unselected:var(--reactist-content-tertiary);--reactist-tab-neutral-track:var(--reactist-framework-fill-selected);--reactist-tab-neutral-border:var(--reactist-divider-primary);--reactist-tab-track-border-width:2px;--reactist-tab-border-radius:20px;--reactist-tab-border-width:1px}._76bbcdaa{box-sizing:border-box;padding:0 var(--reactist-spacing-medium);border:none;background:none;cursor:pointer;font-size:var(--reactist-font-size-body);font-weight:var(--reactist-font-weight-medium);line-height:32px;z-index:1;text-decoration:none;border:var(--reactist-tab-border-width) solid transparent;border-radius:var(--reactist-tab-border-radius)}._531eb92b{position:absolute;top:calc(-1*var(--reactist-tab-track-border-width));right:calc(-1*var(--reactist-tab-track-border-width));bottom:calc(-1*var(--reactist-tab-track-border-width));left:calc(-1*var(--reactist-tab-track-border-width));margin-top:var(--reactist-spacing-large);border-radius:var(--reactist-tab-border-radius);border-width:var(--reactist-tab-track-border-width);border-style:solid}._76bbcdaa,._13321d47{color:var(--reactist-tab-neutral-unselected)}._13321d47[aria-selected=true],._76bbcdaa[aria-selected=true]{background-color:var(--reactist-tab-neutral-background);color:var(--reactist-tab-neutral-foreground);border-color:var(--reactist-tab-neutral-border)}._58c4d63d{color:var(--reactist-tab-themed-unselected)}._58c4d63d[aria-selected=true]{background-color:var(--reactist-tab-themed-background);color:var(--reactist-tab-themed-foreground);border-color:var(--reactist-tab-themed-border)}._531eb92b,._11ef0184{background:var(--reactist-tab-neutral-track);border-color:var(--reactist-tab-neutral-track)}.ce590259{background:var(--reactist-tab-themed-track);border-color:var(--reactist-tab-themed-track)}.d8366aff{margin-top:var(--reactist-spacing-xsmall)}.e28fbcf0{margin-top:var(--reactist-spacing-small)}._1e1d7d0e{margin-top:var(--reactist-spacing-medium)}._611e18a3{margin-top:var(--reactist-spacing-large)}._7e083426{margin-top:var(--reactist-spacing-xlarge)}._37c54913{margin-top:var(--reactist-spacing-xxlarge)}
+:root{--reactist-tab-themed-background:var(--reactist-bg-default);--reactist-tab-themed-foreground:#006f85;--reactist-tab-themed-unselected:#006f85;--reactist-tab-themed-track:#f2f6f7;--reactist-tab-themed-border:var(--reactist-divider-secondary);--reactist-tab-neutral-background:var(--reactist-bg-default);--reactist-tab-neutral-foreground:var(--reactist-content-primary);--reactist-tab-neutral-unselected:var(--reactist-content-tertiary);--reactist-tab-neutral-track:var(--reactist-framework-fill-selected);--reactist-tab-neutral-border:var(--reactist-divider-primary);--reactist-tab-track-border-width:2px;--reactist-tab-border-radius:20px;--reactist-tab-border-width:1px;--reactist-tab-height:30px}.a1064a3b{box-sizing:border-box;padding:0 var(--reactist-spacing-medium);border:none;background:none;cursor:pointer;font-size:var(--reactist-font-size-body);font-weight:var(--reactist-font-weight-medium);line-height:var(--reactist-tab-height);z-index:1;text-decoration:none;border:var(--reactist-tab-border-width) solid transparent;border-radius:var(--reactist-tab-border-radius)}._06f1b8a1{position:absolute;top:calc(-1*var(--reactist-tab-track-border-width));right:calc(-1*var(--reactist-tab-track-border-width));bottom:calc(-1*var(--reactist-tab-track-border-width));left:calc(-1*var(--reactist-tab-track-border-width));margin-top:var(--reactist-spacing-large);border-radius:var(--reactist-tab-border-radius);border-width:var(--reactist-tab-track-border-width);border-style:solid}.a1064a3b,.dabbec7d{color:var(--reactist-tab-neutral-unselected)}.dabbec7d[aria-selected=true],.a1064a3b[aria-selected=true]{background-color:var(--reactist-tab-neutral-background);color:var(--reactist-tab-neutral-foreground);border-color:var(--reactist-tab-neutral-border)}.e6f5ae4e{color:var(--reactist-tab-themed-unselected)}.e6f5ae4e[aria-selected=true]{background-color:var(--reactist-tab-themed-background);color:var(--reactist-tab-themed-foreground);border-color:var(--reactist-tab-themed-border)}._06f1b8a1,._43913ce5{background:var(--reactist-tab-neutral-track);border-color:var(--reactist-tab-neutral-track)}._39bdfdde{background:var(--reactist-tab-themed-track);border-color:var(--reactist-tab-themed-track)}._1c148f4e{margin-top:var(--reactist-spacing-xsmall)}._2a370df5{margin-top:var(--reactist-spacing-small)}._77430437{margin-top:var(--reactist-spacing-medium)}._33db5352{margin-top:var(--reactist-spacing-large)}._60bf9564{margin-top:var(--reactist-spacing-xlarge)}._29a35080{margin-top:var(--reactist-spacing-xxlarge)}