@rio-cloud/rio-uikit 1.13.2 → 2.0.0-beta.2

package/components/sidebars/SidebarFooter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidebarFooter.js","sources":["../../../src/components/sidebars/SidebarFooter.tsx"],"sourcesContent":["import type React from 'react';\nimport classNames from 'classnames';\n\nexport type SidebarFooterProps = {\n    footer?: React.ReactNode;\n    className?: string;\n};\n\nconst SidebarFooter = ({ footer, className = '' }: SidebarFooterProps) => {\n    if (!footer) {\n        return null;\n    }\n\n    const footerClassNames = classNames('SidebarFooter', className);\n\n    return <div className={footerClassNames}>{footer}</div>;\n};\n\nexport default SidebarFooter;\n"],"names":["SidebarFooter","footer","className","footerClassNames","classNames","jsx"],"mappings":";;AAQA,MAAMA,IAAgB,CAAC,EAAE,QAAAC,GAAQ,WAAAC,IAAY,SAA6B;AACtE,MAAI,CAACD;AACD,WAAO;AAGX,QAAME,IAAmBC,EAAW,iBAAiBF,CAAS;AAE9D,SAAO,gBAAAG,EAAC,OAAA,EAAI,WAAWF,GAAmB,UAAAF,GAAO;AACrD;"}

package/components/sidebars/SidebarFullscreenToggle.js

@@ -1,14 +1,16 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import classNames from 'classnames';
-import noop from 'lodash/fp/noop';
-import Button from '../button/Button';
-import SimpleTooltip from '../tooltip/SimpleTooltip';
-const SidebarFullscreenToggle = ({ isFullscreen, tooltip, onClick = noop }) => {
-    const fullscreenIconClasses = classNames('rioglyph', isFullscreen ? 'rioglyph-resize-small' : 'rioglyph-resize-full');
-    const button = (_jsx(Button, { bsStyle: Button.MUTED, iconOnly: true, onClick: onClick, "data-testid": 'sidebarFullscreenToggle', children: _jsx("span", { className: fullscreenIconClasses }) }));
-    if (tooltip) {
-        return (_jsx(SimpleTooltip, { content: tooltip, placement: 'bottom', children: button }));
-    }
-    return button;
+import { jsx as e } from "react/jsx-runtime";
+import i from "classnames";
+import { noop as m } from "es-toolkit/function";
+import l from "../button/Button.js";
+import a from "../tooltip/SimpleTooltip.js";
+const g = ({ isFullscreen: t, tooltip: o, onClick: s = m }) => {
+  const n = i(
+    "rioglyph",
+    t ? "rioglyph-resize-small" : "rioglyph-resize-full"
+  ), r = /* @__PURE__ */ e(l, { bsStyle: l.MUTED, iconOnly: !0, onClick: s, "data-testid": "sidebarFullscreenToggle", children: /* @__PURE__ */ e("span", { className: n }) });
+  return o ? /* @__PURE__ */ e(a, { content: o, placement: "bottom", children: r }) : r;
 };
-export default SidebarFullscreenToggle;
+export {
+  g as default
+};
+//# sourceMappingURL=SidebarFullscreenToggle.js.map

package/components/sidebars/SidebarFullscreenToggle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidebarFullscreenToggle.js","sources":["../../../src/components/sidebars/SidebarFullscreenToggle.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { noop } from 'es-toolkit/function';\n\nimport Button from '../button/Button';\nimport SimpleTooltip from '../tooltip/SimpleTooltip';\n\nexport type SidebarFullscreenToggleProps = {\n    isFullscreen?: boolean;\n    tooltip?: string;\n    onClick?: VoidFunction;\n};\n\nconst SidebarFullscreenToggle = ({ isFullscreen, tooltip, onClick = noop }: SidebarFullscreenToggleProps) => {\n    const fullscreenIconClasses = classNames(\n        'rioglyph',\n        isFullscreen ? 'rioglyph-resize-small' : 'rioglyph-resize-full'\n    );\n\n    const button = (\n        <Button bsStyle={Button.MUTED} iconOnly onClick={onClick} data-testid='sidebarFullscreenToggle'>\n            <span className={fullscreenIconClasses} />\n        </Button>\n    );\n\n    if (tooltip) {\n        return (\n            <SimpleTooltip content={tooltip} placement='bottom'>\n                {button}\n            </SimpleTooltip>\n        );\n    }\n\n    return button;\n};\n\nexport default SidebarFullscreenToggle;\n"],"names":["SidebarFullscreenToggle","isFullscreen","tooltip","onClick","noop","fullscreenIconClasses","classNames","button","jsx","Button","SimpleTooltip"],"mappings":";;;;;AAYA,MAAMA,IAA0B,CAAC,EAAE,cAAAC,GAAc,SAAAC,GAAS,SAAAC,IAAUC,QAAyC;AACzG,QAAMC,IAAwBC;AAAA,IAC1B;AAAA,IACAL,IAAe,0BAA0B;AAAA,EAAA,GAGvCM,IACF,gBAAAC,EAACC,GAAA,EAAO,SAASA,EAAO,OAAO,UAAQ,IAAC,SAAAN,GAAkB,eAAY,2BAClE,UAAA,gBAAAK,EAAC,QAAA,EAAK,WAAWH,GAAuB,GAC5C;AAGJ,SAAIH,sBAEKQ,GAAA,EAAc,SAASR,GAAS,WAAU,UACtC,UAAAK,GACL,IAIDA;AACX;"}

package/components/slider/RangeSlider.d.ts

@@ -1,5 +1,5 @@
-import React, { type HTMLAttributes } from 'react';
-import { type CurrentColor } from '../../utils/currentColors';
+import { default as React, HTMLAttributes } from 'react';
+import { CurrentColor } from '../../utils/currentColors';
 export type RangeSliderProps = {
     /**
      * The current left value of the selected range.

package/components/slider/RangeSlider.js

@@ -1,108 +1,113 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useState } from 'react';
-import classNames from 'classnames';
-import noop from 'lodash/noop';
-import { getCurrentBackgroundColor } from '../../utils/currentColors';
-const getRangeValues = (valueLeft, valueRight) => {
-    const finalLeftValue = valueRight <= valueLeft ? valueRight : valueLeft;
-    const finalRightValue = valueLeft >= valueRight ? valueLeft : valueRight;
-    return [finalLeftValue, finalRightValue];
+import { jsxs as W, jsx as c } from "react/jsx-runtime";
+import { useState as u, useEffect as Z } from "react";
+import ee from "classnames";
+import { noop as A } from "es-toolkit/compat";
+import { getCurrentBackgroundColor as te } from "../../utils/currentColors.js";
+const M = (r, t) => {
+  const o = t <= r ? t : r, m = r >= t ? r : t;
+  return [o, m];
+}, ie = (r) => {
+  const {
+    minValue: t = 0,
+    maxValue: o = Number.MAX_VALUE,
+    valueLabels: m = !1,
+    valueLabelUnit: v,
+    step: C = 1,
+    color: B = "primary",
+    leftValue: N,
+    rightValue: k,
+    className: w,
+    disabled: P = !1,
+    onChange: E = A,
+    onDragEnd: b = A,
+    ...X
+  } = r, [j, R] = u(!1), [z, p] = u(!1), [a, x] = u(N || t), [n, $] = u(k || o), [y, g] = u(!1), [I, f] = u(!1);
+  Z(() => {
+    a >= t && a <= o && n >= t && n <= o && (x(a), $(n));
+  }, [a, n, t, o]);
+  const U = (e) => {
+    const s = e.valueLeft ? e.valueLeft : a, l = e.valueRight ? e.valueRight : n;
+    x(s), $(l), g(!!e.valueLeft), f(!!e.valueRight);
+    const [i, h] = M(s, l);
+    E(i, h);
+  }, H = (e) => {
+    U({ valueLeft: Number.parseInt(e.target.value, 10) });
+  }, S = (e) => {
+    U({ valueRight: Number.parseInt(e.target.value, 10) });
+  }, T = () => {
+    g(!0), f(!1);
+  }, _ = () => {
+    g(!1), f(!0);
+  }, D = (e) => {
+    const s = (a - t) / (o - t), l = (n - t) / (o - t);
+    return (s + l) / 2 * e;
+  }, q = (e) => {
+    const s = e.target;
+    if (!y) {
+      const l = s.getBoundingClientRect(), i = e.clientX - l.left, h = s.offsetWidth, d = D(h);
+      n > a && i > d && (R(!1), p(!0)), n < a && i < d && (R(!1), p(!0));
+    }
+  }, F = (e) => {
+    const s = e.target;
+    if (!I) {
+      const l = s.getBoundingClientRect(), i = e.clientX - l.left, h = s.offsetWidth, d = D(h);
+      n > a && i < d && (R(!0), p(!1)), n < a && i > d && (R(!0), p(!1));
+    }
+  }, G = () => {
+    g(!1), f(!1);
+    const [e, s] = M(a, n);
+    b(e, s);
+  }, J = () => {
+    g(!1), f(!1);
+    const [e, s] = M(a, n);
+    b(e, s);
+  }, [L, V] = M(a, n), K = 100 * (V - L) / (o - t), O = 100 * (L - t) / (o - t), Q = ee(
+    "range-slider",
+    P && "disabled",
+    m && "show-value-labels",
+    w && w
+  ), Y = te(B);
+  return /* @__PURE__ */ W("div", { ...X, className: Q, style: { color: Y }, children: [
+    /* @__PURE__ */ c("div", { className: "range-whole-track" }),
+    /* @__PURE__ */ c("div", { className: "range-track", style: { width: `${K}%`, left: `${O}%` }, children: m && /* @__PURE__ */ W("div", { className: "user-select-none", children: [
+      /* @__PURE__ */ c("div", { className: "range-value", children: /* @__PURE__ */ c("span", { children: v ? `${L} ${v}` : L }) }),
+      /* @__PURE__ */ c("div", { className: "range-value", children: /* @__PURE__ */ c("span", { children: v ? `${V} ${v}` : V }) })
+    ] }) }),
+    /* @__PURE__ */ c(
+      "input",
+      {
+        className: `${y ? "changing" : ""}`,
+        style: { zIndex: j ? "6" : "5" },
+        value: a,
+        min: t,
+        max: o,
+        step: C,
+        type: "range",
+        onChange: H,
+        onMouseDown: T,
+        onMouseMove: q,
+        onMouseUp: G
+      }
+    ),
+    /* @__PURE__ */ c(
+      "input",
+      {
+        className: `${I ? "changing" : ""}`,
+        style: { zIndex: z ? "6" : "5" },
+        value: n,
+        min: t,
+        max: o,
+        step: C,
+        type: "range",
+        onChange: S,
+        onMouseDown: _,
+        onMouseMove: F,
+        onMouseUp: J
+      }
+    )
+  ] });
 };
-const RangeSlider = (props) => {
-    const { minValue = 0, maxValue = Number.MAX_VALUE, valueLabels = false, valueLabelUnit, step = 1, color = 'primary', leftValue, rightValue, className, disabled = false, onChange = noop, onDragEnd = noop, ...remainingProps } = props;
-    const [activeLeft, setActiveLeft] = useState(false);
-    const [activeRight, setActiveRight] = useState(false);
-    const [valueLeft, setValueLeft] = useState(leftValue ? leftValue : minValue);
-    const [valueRight, setValueRight] = useState(rightValue ? rightValue : maxValue);
-    const [isChangingLeft, setIsChangingLeft] = useState(false);
-    const [isChangingRight, setIsChangingRight] = useState(false);
-    useEffect(() => {
-        if (valueLeft >= minValue && valueLeft <= maxValue && valueRight >= minValue && valueRight <= maxValue) {
-            setValueLeft(valueLeft);
-            setValueRight(valueRight);
-        }
-    }, [valueLeft, valueRight, minValue, maxValue]);
-    const changeValues = (newValues) => {
-        const newValueLeft = newValues.valueLeft ? newValues.valueLeft : valueLeft;
-        const newValueRight = newValues.valueRight ? newValues.valueRight : valueRight;
-        setValueLeft(newValueLeft);
-        setValueRight(newValueRight);
-        setIsChangingLeft(!!newValues.valueLeft);
-        setIsChangingRight(!!newValues.valueRight);
-        const [newLeftValue, newRightValue] = getRangeValues(newValueLeft, newValueRight);
-        onChange(newLeftValue, newRightValue);
-    };
-    const handleChangeValueLeft = (event) => {
-        changeValues({ valueLeft: Number.parseInt(event.target.value, 10) });
-    };
-    const handleChangeValueRight = (event) => {
-        changeValues({ valueRight: Number.parseInt(event.target.value, 10) });
-    };
-    const onMouseDownLeft = () => {
-        setIsChangingLeft(true);
-        setIsChangingRight(false);
-    };
-    const onMouseDownRight = () => {
-        setIsChangingLeft(false);
-        setIsChangingRight(true);
-    };
-    const getTrackMiddlePosition = (targetWidth) => {
-        const trackValueLeftRelative = (valueLeft - minValue) / (maxValue - minValue);
-        const trackValueRightRelative = (valueRight - minValue) / (maxValue - minValue);
-        const trackMiddleRelative = (trackValueLeftRelative + trackValueRightRelative) / 2;
-        return trackMiddleRelative * targetWidth;
-    };
-    const onMouseMoveLeft = (event) => {
-        const target = event.target;
-        if (!isChangingLeft) {
-            const clientRect = target.getBoundingClientRect();
-            const mouseHover = event.clientX - clientRect.left;
-            const targetWidth = target.offsetWidth;
-            const trackMiddlePosition = getTrackMiddlePosition(targetWidth);
-            if (valueRight > valueLeft && mouseHover > trackMiddlePosition) {
-                setActiveLeft(false);
-                setActiveRight(true);
-            }
-            if (valueRight < valueLeft && mouseHover < trackMiddlePosition) {
-                setActiveLeft(false);
-                setActiveRight(true);
-            }
-        }
-    };
-    const onMouseMoveRight = (event) => {
-        const target = event.target;
-        if (!isChangingRight) {
-            const clientRect = target.getBoundingClientRect();
-            const mouseHover = event.clientX - clientRect.left;
-            const targetWidth = target.offsetWidth;
-            const trackMiddlePosition = getTrackMiddlePosition(targetWidth);
-            if (valueRight > valueLeft && mouseHover < trackMiddlePosition) {
-                setActiveLeft(true);
-                setActiveRight(false);
-            }
-            if (valueRight < valueLeft && mouseHover > trackMiddlePosition) {
-                setActiveLeft(true);
-                setActiveRight(false);
-            }
-        }
-    };
-    const onMouseUpLeft = () => {
-        setIsChangingLeft(false);
-        setIsChangingRight(false);
-        const [newLeftValue, newRightValue] = getRangeValues(valueLeft, valueRight);
-        onDragEnd(newLeftValue, newRightValue);
-    };
-    const onMouseUpRight = () => {
-        setIsChangingLeft(false);
-        setIsChangingRight(false);
-        const [newLeftValue, newRightValue] = getRangeValues(valueLeft, valueRight);
-        onDragEnd(newLeftValue, newRightValue);
-    };
-    const [finalLeftValue, finalRightValue] = getRangeValues(valueLeft, valueRight);
-    const trackWidth = (100 * (finalRightValue - finalLeftValue)) / (maxValue - minValue);
-    const trackLeft = (100 * (finalLeftValue - minValue)) / (maxValue - minValue);
-    const wrapperClassNames = classNames('range-slider', disabled && 'disabled', valueLabels && 'show-value-labels', className && className);
-    const sliderBackgroundColor = getCurrentBackgroundColor(color);
-    return (_jsxs("div", { ...remainingProps, className: wrapperClassNames, style: { color: sliderBackgroundColor }, children: [_jsx("div", { className: 'range-whole-track' }), _jsx("div", { className: 'range-track', style: { width: `${trackWidth}%`, left: `${trackLeft}%` }, children: valueLabels && (_jsxs("div", { className: 'user-select-none', children: [_jsx("div", { className: 'range-value', children: _jsx("span", { children: valueLabelUnit ? `${finalLeftValue} ${valueLabelUnit}` : finalLeftValue }) }), _jsx("div", { className: 'range-value', children: _jsx("span", { children: valueLabelUnit ? `${finalRightValue} ${valueLabelUnit}` : finalRightValue }) })] })) }), _jsx("input", { className: `${isChangingLeft ? 'changing' : ''}`, style: { zIndex: activeLeft ? '6' : '5' }, value: valueLeft, min: minValue, max: maxValue, step: step, type: 'range', onChange: handleChangeValueLeft, onMouseDown: onMouseDownLeft, onMouseMove: onMouseMoveLeft, onMouseUp: onMouseUpLeft }), _jsx("input", { className: `${isChangingRight ? 'changing' : ''}`, style: { zIndex: activeRight ? '6' : '5' }, value: valueRight, min: minValue, max: maxValue, step: step, type: 'range', onChange: handleChangeValueRight, onMouseDown: onMouseDownRight, onMouseMove: onMouseMoveRight, onMouseUp: onMouseUpRight })] }));
+export {
+  ie as default
 };
-export default RangeSlider;
+//# sourceMappingURL=RangeSlider.js.map

package/components/slider/RangeSlider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RangeSlider.js","sources":["../../../src/components/slider/RangeSlider.tsx"],"sourcesContent":["import React, { type ChangeEvent, type HTMLAttributes, type MouseEvent, useEffect, useState } from 'react';\nimport classNames from 'classnames';\nimport { noop } from 'es-toolkit/compat';\n\nimport { getCurrentBackgroundColor, type CurrentColor } from '../../utils/currentColors';\n\nconst getRangeValues = (valueLeft: number, valueRight: number) => {\n    const finalLeftValue = valueRight <= valueLeft ? valueRight : valueLeft;\n    const finalRightValue = valueLeft >= valueRight ? valueLeft : valueRight;\n    return [finalLeftValue, finalRightValue];\n};\n\nexport type RangeSliderProps = {\n    /**\n     * The current left value of the selected range.\n     */\n    leftValue?: number;\n\n    /**\n     * The current right value of the selected range.\n     */\n    rightValue?: number;\n\n    /**\n     * The lower limit.\n     *\n     * @default 0\n     */\n    minValue: number;\n\n    /**\n     * The upper limit.\n     *\n     * @default Number.MAX_VALUE\n     */\n    maxValue: number;\n\n    /**\n     * Whether to show the value labels.\n     *\n     * @default false\n     */\n    valueLabels?: boolean;\n\n    /**\n     * Additional unit used for the slider value labels.\n     */\n    valueLabelUnit?: string | React.ReactNode;\n\n    /**\n     * Selector step value.\n     *\n     * @default 1\n     */\n    step?: number;\n\n    /**\n     * Defines the color of the slider.\n     *\n     * @default 'primary'\n     */\n    color?: CurrentColor;\n\n    /**\n     * Disables all pointer events.\n     *\n     * @default false\n     */\n    disabled?: boolean;\n\n    onChange?: (newLeftValue: number, newRightValue: number) => void;\n\n    onDragEnd?: (newLeftValue: number, newRightValue: number) => void;\n\n    /**\n     * Additional classes to be set on the wrapper element.\n     */\n    className?: string;\n} & Omit<HTMLAttributes<HTMLDivElement>, 'disabled' | 'onChange' | 'onDragEnd' | 'className'>;\n\nconst RangeSlider = (props: RangeSliderProps) => {\n    const {\n        minValue = 0,\n        maxValue = Number.MAX_VALUE,\n        valueLabels = false,\n        valueLabelUnit,\n        step = 1,\n        color = 'primary',\n        leftValue,\n        rightValue,\n        className,\n        disabled = false,\n        onChange = noop,\n        onDragEnd = noop,\n        ...remainingProps\n    } = props;\n\n    const [activeLeft, setActiveLeft] = useState(false);\n    const [activeRight, setActiveRight] = useState(false);\n    const [valueLeft, setValueLeft] = useState(leftValue ? leftValue : minValue);\n    const [valueRight, setValueRight] = useState(rightValue ? rightValue : maxValue);\n    const [isChangingLeft, setIsChangingLeft] = useState(false);\n    const [isChangingRight, setIsChangingRight] = useState(false);\n\n    useEffect(() => {\n        if (valueLeft >= minValue && valueLeft <= maxValue && valueRight >= minValue && valueRight <= maxValue) {\n            setValueLeft(valueLeft);\n            setValueRight(valueRight);\n        }\n    }, [valueLeft, valueRight, minValue, maxValue]);\n\n    const changeValues = (newValues: { valueLeft?: number; valueRight?: number }) => {\n        const newValueLeft = newValues.valueLeft ? newValues.valueLeft : valueLeft;\n        const newValueRight = newValues.valueRight ? newValues.valueRight : valueRight;\n\n        setValueLeft(newValueLeft);\n        setValueRight(newValueRight);\n\n        setIsChangingLeft(!!newValues.valueLeft);\n        setIsChangingRight(!!newValues.valueRight);\n\n        const [newLeftValue, newRightValue] = getRangeValues(newValueLeft, newValueRight);\n        onChange(newLeftValue, newRightValue);\n    };\n\n    const handleChangeValueLeft = (event: ChangeEvent<HTMLInputElement>) => {\n        changeValues({ valueLeft: Number.parseInt(event.target.value, 10) });\n    };\n\n    const handleChangeValueRight = (event: ChangeEvent<HTMLInputElement>) => {\n        changeValues({ valueRight: Number.parseInt(event.target.value, 10) });\n    };\n\n    const onMouseDownLeft = () => {\n        setIsChangingLeft(true);\n        setIsChangingRight(false);\n    };\n\n    const onMouseDownRight = () => {\n        setIsChangingLeft(false);\n        setIsChangingRight(true);\n    };\n\n    const getTrackMiddlePosition = (targetWidth: number) => {\n        const trackValueLeftRelative = (valueLeft - minValue) / (maxValue - minValue);\n        const trackValueRightRelative = (valueRight - minValue) / (maxValue - minValue);\n        const trackMiddleRelative = (trackValueLeftRelative + trackValueRightRelative) / 2;\n\n        return trackMiddleRelative * targetWidth;\n    };\n\n    const onMouseMoveLeft = (event: MouseEvent<HTMLInputElement>) => {\n        const target = event.target as HTMLInputElement;\n        if (!isChangingLeft) {\n            const clientRect = target.getBoundingClientRect();\n            const mouseHover = event.clientX - clientRect.left;\n            const targetWidth = target.offsetWidth;\n\n            const trackMiddlePosition = getTrackMiddlePosition(targetWidth);\n\n            if (valueRight > valueLeft && mouseHover > trackMiddlePosition) {\n                setActiveLeft(false);\n                setActiveRight(true);\n            }\n\n            if (valueRight < valueLeft && mouseHover < trackMiddlePosition) {\n                setActiveLeft(false);\n                setActiveRight(true);\n            }\n        }\n    };\n\n    const onMouseMoveRight = (event: MouseEvent<HTMLInputElement>) => {\n        const target = event.target as HTMLInputElement;\n        if (!isChangingRight) {\n            const clientRect = target.getBoundingClientRect();\n            const mouseHover = event.clientX - clientRect.left;\n            const targetWidth = target.offsetWidth;\n\n            const trackMiddlePosition = getTrackMiddlePosition(targetWidth);\n\n            if (valueRight > valueLeft && mouseHover < trackMiddlePosition) {\n                setActiveLeft(true);\n                setActiveRight(false);\n            }\n\n            if (valueRight < valueLeft && mouseHover > trackMiddlePosition) {\n                setActiveLeft(true);\n                setActiveRight(false);\n            }\n        }\n    };\n\n    const onMouseUpLeft = () => {\n        setIsChangingLeft(false);\n        setIsChangingRight(false);\n\n        const [newLeftValue, newRightValue] = getRangeValues(valueLeft, valueRight);\n        onDragEnd(newLeftValue, newRightValue);\n    };\n\n    const onMouseUpRight = () => {\n        setIsChangingLeft(false);\n        setIsChangingRight(false);\n\n        const [newLeftValue, newRightValue] = getRangeValues(valueLeft, valueRight);\n        onDragEnd(newLeftValue, newRightValue);\n    };\n\n    const [finalLeftValue, finalRightValue] = getRangeValues(valueLeft, valueRight);\n\n    const trackWidth = (100 * (finalRightValue - finalLeftValue)) / (maxValue - minValue);\n    const trackLeft = (100 * (finalLeftValue - minValue)) / (maxValue - minValue);\n\n    const wrapperClassNames = classNames(\n        'range-slider',\n        disabled && 'disabled',\n        valueLabels && 'show-value-labels',\n        className && className\n    );\n\n    const sliderBackgroundColor = getCurrentBackgroundColor(color);\n\n    return (\n        <div {...remainingProps} className={wrapperClassNames} style={{ color: sliderBackgroundColor }}>\n            <div className='range-whole-track' />\n            <div className='range-track' style={{ width: `${trackWidth}%`, left: `${trackLeft}%` }}>\n                {valueLabels && (\n                    <div className='user-select-none'>\n                        <div className='range-value'>\n                            <span>{valueLabelUnit ? `${finalLeftValue} ${valueLabelUnit}` : finalLeftValue}</span>\n                        </div>\n                        <div className='range-value'>\n                            <span>{valueLabelUnit ? `${finalRightValue} ${valueLabelUnit}` : finalRightValue}</span>\n                        </div>\n                    </div>\n                )}\n            </div>\n            <input\n                className={`${isChangingLeft ? 'changing' : ''}`}\n                style={{ zIndex: activeLeft ? '6' : '5' }}\n                value={valueLeft}\n                min={minValue}\n                max={maxValue}\n                step={step}\n                type='range'\n                onChange={handleChangeValueLeft}\n                onMouseDown={onMouseDownLeft}\n                onMouseMove={onMouseMoveLeft}\n                onMouseUp={onMouseUpLeft}\n            />\n            <input\n                className={`${isChangingRight ? 'changing' : ''}`}\n                style={{ zIndex: activeRight ? '6' : '5' }}\n                value={valueRight}\n                min={minValue}\n                max={maxValue}\n                step={step}\n                type='range'\n                onChange={handleChangeValueRight}\n                onMouseDown={onMouseDownRight}\n                onMouseMove={onMouseMoveRight}\n                onMouseUp={onMouseUpRight}\n            />\n        </div>\n    );\n};\n\nexport default RangeSlider;\n"],"names":["getRangeValues","valueLeft","valueRight","finalLeftValue","finalRightValue","RangeSlider","props","minValue","maxValue","valueLabels","valueLabelUnit","step","color","leftValue","rightValue","className","disabled","onChange","noop","onDragEnd","remainingProps","activeLeft","setActiveLeft","useState","activeRight","setActiveRight","setValueLeft","setValueRight","isChangingLeft","setIsChangingLeft","isChangingRight","setIsChangingRight","useEffect","changeValues","newValues","newValueLeft","newValueRight","newLeftValue","newRightValue","handleChangeValueLeft","event","handleChangeValueRight","onMouseDownLeft","onMouseDownRight","getTrackMiddlePosition","targetWidth","trackValueLeftRelative","trackValueRightRelative","onMouseMoveLeft","target","clientRect","mouseHover","trackMiddlePosition","onMouseMoveRight","onMouseUpLeft","onMouseUpRight","trackWidth","trackLeft","wrapperClassNames","classNames","sliderBackgroundColor","getCurrentBackgroundColor","jsxs","jsx"],"mappings":"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"}

package/components/slider/Slider.d.ts

@@ -1,5 +1,5 @@
-import React, { type HTMLAttributes } from 'react';
-import { type CurrentColor } from '../../utils/currentColors';
+import { default as React, HTMLAttributes } from 'react';
+import { CurrentColor } from '../../utils/currentColors';
 export type SliderProps = {
     /**
      * The current value.

package/components/slider/Slider.js

@@ -1,33 +1,63 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useState } from 'react';
-import classNames from 'classnames';
-import noop from 'lodash/noop';
-import { getCurrentBackgroundColor } from '../../utils/currentColors';
-const Slider = (props) => {
-    const { value = 0, minValue = 0, maxValue = Number.MAX_VALUE, valueLabels = false, valueLabelUnit, largeValueLabels = false, hideValueBar = false, color = 'primary', step = 1, onChange = noop, onDragEnd = noop, className, disabled = false, ...remainingProps } = props;
-    const [currentValue, setCurrentValue] = useState(value ? value : minValue);
-    const [isChanging, setIsChanging] = useState(false);
-    useEffect(() => {
-        if (value >= minValue && value <= maxValue) {
-            setCurrentValue(value);
-        }
-    }, [value, minValue, maxValue]);
-    const handleChange = (event) => {
-        const newValue = Number.parseInt(event.target.value, 10);
-        setCurrentValue(newValue);
-        setIsChanging(true);
-        onChange(newValue);
-    };
-    const onMouseUp = () => {
-        setIsChanging(false);
-        onDragEnd(currentValue);
-    };
-    const onMouseDown = () => {
-        setIsChanging(true);
-    };
-    const wrapperClassNames = classNames('range-slider', disabled && 'disabled', valueLabels && 'show-value-labels', hideValueBar && 'hide-value-bar', largeValueLabels && 'large-value-labels', className && className);
-    const trackWidth = (100 * (currentValue - minValue)) / (maxValue - minValue);
-    const sliderBackgroundColor = getCurrentBackgroundColor(color);
-    return (_jsxs("div", { ...remainingProps, className: wrapperClassNames, style: { color: sliderBackgroundColor }, children: [_jsx("div", { className: 'range-whole-track' }), _jsx("div", { className: 'range-track', style: { width: `${trackWidth}%` }, children: valueLabels && (_jsx("div", { className: 'range-value', children: _jsx("span", { children: valueLabelUnit ? `${currentValue} ${valueLabelUnit}` : currentValue }) })) }), _jsx("input", { className: `${isChanging ? 'changing' : ''}`, value: currentValue, min: minValue, max: maxValue, step: step, type: 'range', onChange: handleChange, onMouseDown: onMouseDown, onMouseUp: onMouseUp })] }));
+import { jsxs as M, jsx as l } from "react/jsx-runtime";
+import { useState as m, useEffect as U } from "react";
+import j from "classnames";
+import { noop as d } from "es-toolkit/compat";
+import { getCurrentBackgroundColor as A } from "../../utils/currentColors.js";
+const X = (g) => {
+  const {
+    value: e = 0,
+    minValue: a = 0,
+    maxValue: r = Number.MAX_VALUE,
+    valueLabels: o = !1,
+    valueLabelUnit: t,
+    largeValueLabels: h = !1,
+    hideValueBar: p = !1,
+    color: f = "primary",
+    step: v = 1,
+    onChange: b = d,
+    onDragEnd: C = d,
+    className: i,
+    disabled: N = !1,
+    ...V
+  } = g, [s, c] = m(e || a), [w, n] = m(!1);
+  U(() => {
+    e >= a && e <= r && c(e);
+  }, [e, a, r]);
+  const k = (E) => {
+    const u = Number.parseInt(E.target.value, 10);
+    c(u), n(!0), b(u);
+  }, x = () => {
+    n(!1), C(s);
+  }, y = () => {
+    n(!0);
+  }, L = j(
+    "range-slider",
+    N && "disabled",
+    o && "show-value-labels",
+    p && "hide-value-bar",
+    h && "large-value-labels",
+    i && i
+  ), $ = 100 * (s - a) / (r - a), B = A(f);
+  return /* @__PURE__ */ M("div", { ...V, className: L, style: { color: B }, children: [
+    /* @__PURE__ */ l("div", { className: "range-whole-track" }),
+    /* @__PURE__ */ l("div", { className: "range-track", style: { width: `${$}%` }, children: o && /* @__PURE__ */ l("div", { className: "range-value", children: /* @__PURE__ */ l("span", { children: t ? `${s} ${t}` : s }) }) }),
+    /* @__PURE__ */ l(
+      "input",
+      {
+        className: `${w ? "changing" : ""}`,
+        value: s,
+        min: a,
+        max: r,
+        step: v,
+        type: "range",
+        onChange: k,
+        onMouseDown: y,
+        onMouseUp: x
+      }
+    )
+  ] });
 };
-export default Slider;
+export {
+  X as default
+};
+//# sourceMappingURL=Slider.js.map

package/components/slider/Slider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slider.js","sources":["../../../src/components/slider/Slider.tsx"],"sourcesContent":["import React, { type ChangeEvent, type HTMLAttributes, useEffect, useState } from 'react';\nimport classNames from 'classnames';\nimport { noop } from 'es-toolkit/compat';\n\nimport { getCurrentBackgroundColor, type CurrentColor } from '../../utils/currentColors';\n\nexport type SliderProps = {\n    /**\n     * The current value.\n     *\n     * @default 0\n     */\n    value?: number;\n\n    /**\n     * The lower limit.\n     *\n     * @default 0\n     */\n    minValue?: number;\n\n    /**\n     * The upper limit.\n     *\n     * @default Number.MAX_VALUE\n     */\n    maxValue?: number;\n\n    /**\n     * Whether to show the value labels.\n     *\n     * @default false\n     */\n    valueLabels?: boolean;\n\n    /**\n     * Additional unit used for the slider value label.\n     */\n    valueLabelUnit?: string | React.ReactNode;\n\n    /**\n     * Whether to hide the dark-colored value bar.\n     *\n     * @default false\n     */\n    hideValueBar?: boolean;\n\n    /**\n     * Whether to show larger value labels instead of the normal ones.\n     *\n     * @default false\n     */\n    largeValueLabels?: boolean;\n\n    /**\n     * Selector step value.\n     *\n     * @default 1\n     */\n    step?: number;\n\n    /**\n     * Defines the color of the slider.\n     *\n     * @default 'primary'\n     */\n    color?: CurrentColor;\n\n    /**\n     * Disables all pointer events.\n     *\n     * @default false\n     */\n    disabled?: boolean;\n\n    /**\n     * Callback to get the new value every time it changes.\n     */\n    onChange?: (newValue: number) => void;\n\n    /**\n     * Callback to get the value after the slider ended dragging.\n     */\n    onDragEnd?: (newValue: number) => void;\n\n    /**\n     * Additional classes to be set on the wrapper element.\n     */\n    className?: string;\n} & Omit<HTMLAttributes<HTMLDivElement>, 'disabled' | 'onChange' | 'onDragEnd' | 'className'>;\n\nconst Slider = (props: SliderProps) => {\n    const {\n        value = 0,\n        minValue = 0,\n        maxValue = Number.MAX_VALUE,\n        valueLabels = false,\n        valueLabelUnit,\n        largeValueLabels = false,\n        hideValueBar = false,\n        color = 'primary',\n        step = 1,\n        onChange = noop,\n        onDragEnd = noop,\n        className,\n        disabled = false,\n        ...remainingProps\n    } = props;\n\n    const [currentValue, setCurrentValue] = useState(value ? value : minValue);\n    const [isChanging, setIsChanging] = useState(false);\n\n    useEffect(() => {\n        if (value >= minValue && value <= maxValue) {\n            setCurrentValue(value);\n        }\n    }, [value, minValue, maxValue]);\n\n    const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n        const newValue = Number.parseInt(event.target.value, 10);\n        setCurrentValue(newValue);\n        setIsChanging(true);\n        onChange(newValue);\n    };\n\n    const onMouseUp = () => {\n        setIsChanging(false);\n        onDragEnd(currentValue);\n    };\n\n    const onMouseDown = () => {\n        setIsChanging(true);\n    };\n\n    const wrapperClassNames = classNames(\n        'range-slider',\n        disabled && 'disabled',\n        valueLabels && 'show-value-labels',\n        hideValueBar && 'hide-value-bar',\n        largeValueLabels && 'large-value-labels',\n        className && className\n    );\n\n    const trackWidth = (100 * (currentValue - minValue)) / (maxValue - minValue);\n\n    const sliderBackgroundColor = getCurrentBackgroundColor(color);\n\n    return (\n        <div {...remainingProps} className={wrapperClassNames} style={{ color: sliderBackgroundColor }}>\n            <div className='range-whole-track' />\n            <div className='range-track' style={{ width: `${trackWidth}%` }}>\n                {valueLabels && (\n                    <div className='range-value'>\n                        <span>{valueLabelUnit ? `${currentValue} ${valueLabelUnit}` : currentValue}</span>\n                    </div>\n                )}\n            </div>\n            <input\n                className={`${isChanging ? 'changing' : ''}`}\n                value={currentValue}\n                min={minValue}\n                max={maxValue}\n                step={step}\n                type='range'\n                onChange={handleChange}\n                onMouseDown={onMouseDown}\n                onMouseUp={onMouseUp}\n            />\n        </div>\n    );\n};\n\nexport default Slider;\n"],"names":["Slider","props","value","minValue","maxValue","valueLabels","valueLabelUnit","largeValueLabels","hideValueBar","color","step","onChange","noop","onDragEnd","className","disabled","remainingProps","currentValue","setCurrentValue","useState","isChanging","setIsChanging","useEffect","handleChange","event","newValue","onMouseUp","onMouseDown","wrapperClassNames","classNames","trackWidth","sliderBackgroundColor","getCurrentBackgroundColor","jsxs","jsx"],"mappings":";;;;;AA2FA,MAAMA,IAAS,CAACC,MAAuB;AACnC,QAAM;AAAA,IACF,OAAAC,IAAQ;AAAA,IACR,UAAAC,IAAW;AAAA,IACX,UAAAC,IAAW,OAAO;AAAA,IAClB,aAAAC,IAAc;AAAA,IACd,gBAAAC;AAAA,IACA,kBAAAC,IAAmB;AAAA,IACnB,cAAAC,IAAe;AAAA,IACf,OAAAC,IAAQ;AAAA,IACR,MAAAC,IAAO;AAAA,IACP,UAAAC,IAAWC;AAAA,IACX,WAAAC,IAAYD;AAAA,IACZ,WAAAE;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,GAAGC;AAAA,EAAA,IACHf,GAEE,CAACgB,GAAcC,CAAe,IAAIC,EAASjB,KAAgBC,CAAQ,GACnE,CAACiB,GAAYC,CAAa,IAAIF,EAAS,EAAK;AAElD,EAAAG,EAAU,MAAM;AACZ,IAAIpB,KAASC,KAAYD,KAASE,KAC9Bc,EAAgBhB,CAAK;AAAA,EAE7B,GAAG,CAACA,GAAOC,GAAUC,CAAQ,CAAC;AAE9B,QAAMmB,IAAe,CAACC,MAAyC;AAC3D,UAAMC,IAAW,OAAO,SAASD,EAAM,OAAO,OAAO,EAAE;AACvD,IAAAN,EAAgBO,CAAQ,GACxBJ,EAAc,EAAI,GAClBV,EAASc,CAAQ;AAAA,EACrB,GAEMC,IAAY,MAAM;AACpB,IAAAL,EAAc,EAAK,GACnBR,EAAUI,CAAY;AAAA,EAC1B,GAEMU,IAAc,MAAM;AACtB,IAAAN,EAAc,EAAI;AAAA,EACtB,GAEMO,IAAoBC;AAAA,IACtB;AAAA,IACAd,KAAY;AAAA,IACZV,KAAe;AAAA,IACfG,KAAgB;AAAA,IAChBD,KAAoB;AAAA,IACpBO,KAAaA;AAAA,EAAA,GAGXgB,IAAc,OAAOb,IAAed,MAAcC,IAAWD,IAE7D4B,IAAwBC,EAA0BvB,CAAK;AAE7D,SACI,gBAAAwB,EAAC,OAAA,EAAK,GAAGjB,GAAgB,WAAWY,GAAmB,OAAO,EAAE,OAAOG,EAAA,GACnE,UAAA;AAAA,IAAA,gBAAAG,EAAC,OAAA,EAAI,WAAU,oBAAA,CAAoB;AAAA,IACnC,gBAAAA,EAAC,OAAA,EAAI,WAAU,eAAc,OAAO,EAAE,OAAO,GAAGJ,CAAU,IAAA,GACrD,UAAAzB,KACG,gBAAA6B,EAAC,SAAI,WAAU,eACX,UAAA,gBAAAA,EAAC,QAAA,EAAM,UAAA5B,IAAiB,GAAGW,CAAY,IAAIX,CAAc,KAAKW,EAAA,CAAa,EAAA,CAC/E,GAER;AAAA,IACA,gBAAAiB;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAW,GAAGd,IAAa,aAAa,EAAE;AAAA,QAC1C,OAAOH;AAAA,QACP,KAAKd;AAAA,QACL,KAAKC;AAAA,QACL,MAAAM;AAAA,QACA,MAAK;AAAA,QACL,UAAUa;AAAA,QACV,aAAAI;AAAA,QACA,WAAAD;AAAA,MAAA;AAAA,IAAA;AAAA,EACJ,GACJ;AAER;"}

package/components/smoothScrollbars/SmoothScrollbars.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { default as React } from 'react';
 export type SmoothScrollbarsProps = {
     slideIn?: boolean;
     largeTrack?: boolean;

package/components/smoothScrollbars/SmoothScrollbars.js

@@ -1,51 +1,72 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-// biome-ignore lint/style/useImportType: required for JSX runtime compatibility with older toolchains
-import { forwardRef, useEffect, useImperativeHandle, useRef, } from 'react';
-import { Scrollbars } from 'react-custom-scrollbars-4';
-import classNames from 'classnames';
-import noop from 'lodash/fp/noop';
-import debounce from 'lodash/fp/debounce';
-const RESIZE_THROTTLING = 100;
-const SmoothScrollbars = forwardRef((componentProps, ref) => {
-    const { slideIn = false, largeTrack = false, trackOffset = false, className = '', onScroll = noop, tagName = 'div', autoHeight = false, autoHeightMin = 0, autoHeightMax = 200, children, style, ...remainingProps } = componentProps;
-    const scrollbarsRef = useRef(null);
-    const contentRef = useRef(null);
-    useImperativeHandle(ref, () => scrollbarsRef.current);
-    useEffect(() => {
-        if (!contentRef.current || !scrollbarsRef.current) {
-            return;
-        }
-        const updateScrollbars = debounce(RESIZE_THROTTLING)(() => {
-            if (scrollbarsRef.current) {
-                // Trigger a update for the scrollbars.
-                // This is needed since the lib does not automatically update on content height changes
-                // See: https://github.com/RobPethick/react-custom-scrollbars-2/issues/12
-                // Use type assertion to tell TypeScript that 'update' exists
-                scrollbarsRef.current.update();
-            }
-        });
-        const resizeObserver = new ResizeObserver(updateScrollbars);
-        resizeObserver.observe(contentRef.current);
-        return () => {
-            resizeObserver.disconnect();
-            updateScrollbars.cancel();
-        };
+import { jsx as e } from "react/jsx-runtime";
+import { forwardRef as R, useRef as n, useImperativeHandle as S, useEffect as V } from "react";
+import { Scrollbars as I } from "react-custom-scrollbars-4";
+import s from "classnames";
+import { noop as O, debounce as x } from "es-toolkit/function";
+const E = 100, P = R(
+  (i, m) => {
+    const {
+      slideIn: u = !1,
+      largeTrack: l = !1,
+      trackOffset: c = !1,
+      className: b = "",
+      onScroll: d = O,
+      tagName: f = "div",
+      autoHeight: h = !1,
+      autoHeightMin: N = 0,
+      autoHeightMax: p = 200,
+      children: v,
+      style: y,
+      ...k
+    } = i, a = n(null), t = n(null);
+    S(m, () => a.current), V(() => {
+      if (!t.current || !a.current)
+        return;
+      const r = x(() => {
+        a.current && a.current.update();
+      }, E), o = new ResizeObserver(r);
+      return o.observe(t.current), () => {
+        o.disconnect(), r.cancel();
+      };
     }, []);
-    const wrapperClassNames = classNames(className, slideIn && 'scrollbar-fly-in', 'smooth-scrollbar-wrapper');
-    const renderTrackVerticalNames = classNames('scrollbar-track-vertical', largeTrack && 'scrollbar-track-size-large', trackOffset && 'scrollbar-track-offset');
-    const renderThumbVerticalNames = classNames('scrollbar-thumb-vertical', largeTrack && 'scrollbar-thumb-size-large');
-    const renderTrackHorizontalNames = classNames('scrollbar-track-horizontal', largeTrack && 'scrollbar-track-size-large', trackOffset && 'scrollbar-track-offset');
-    const renderThumbHorizontalNames = classNames('scrollbar-thumb-horizontal', largeTrack && 'scrollbar-thumb-size-large');
-    return (_jsx(Scrollbars, { ...remainingProps, ref: scrollbarsRef, tagName: tagName, onScroll: onScroll, className: wrapperClassNames, hideTracksWhenNotNeeded: true, autoHeight: autoHeight, autoHeightMin: autoHeightMin, autoHeightMax: autoHeightMax, renderView: props => {
-            return _jsx("div", { ...props, className: 'scrollbar-view' });
-        }, renderTrackVertical: props => {
-            return _jsx("div", { ...props, className: renderTrackVerticalNames });
-        }, renderThumbVertical: props => {
-            return _jsx("div", { ...props, className: renderThumbVerticalNames });
-        }, renderTrackHorizontal: props => {
-            return _jsx("div", { ...props, className: renderTrackHorizontalNames });
-        }, renderThumbHorizontal: props => {
-            return _jsx("div", { ...props, className: renderThumbHorizontalNames });
-        }, children: _jsx("div", { className: 'scrollbar-content-wrapper', ref: contentRef, children: children }) }));
-});
-export default SmoothScrollbars;
+    const T = s(b, u && "scrollbar-fly-in", "smooth-scrollbar-wrapper"), z = s(
+      "scrollbar-track-vertical",
+      l && "scrollbar-track-size-large",
+      c && "scrollbar-track-offset"
+    ), g = s(
+      "scrollbar-thumb-vertical",
+      l && "scrollbar-thumb-size-large"
+    ), H = s(
+      "scrollbar-track-horizontal",
+      l && "scrollbar-track-size-large",
+      c && "scrollbar-track-offset"
+    ), w = s(
+      "scrollbar-thumb-horizontal",
+      l && "scrollbar-thumb-size-large"
+    );
+    return /* @__PURE__ */ e(
+      I,
+      {
+        ...k,
+        ref: a,
+        tagName: f,
+        onScroll: d,
+        className: T,
+        hideTracksWhenNotNeeded: !0,
+        autoHeight: h,
+        autoHeightMin: N,
+        autoHeightMax: p,
+        renderView: (r) => /* @__PURE__ */ e("div", { ...r, className: "scrollbar-view" }),
+        renderTrackVertical: (r) => /* @__PURE__ */ e("div", { ...r, className: z }),
+        renderThumbVertical: (r) => /* @__PURE__ */ e("div", { ...r, className: g }),
+        renderTrackHorizontal: (r) => /* @__PURE__ */ e("div", { ...r, className: H }),
+        renderThumbHorizontal: (r) => /* @__PURE__ */ e("div", { ...r, className: w }),
+        children: /* @__PURE__ */ e("div", { className: "scrollbar-content-wrapper", ref: t, children: v })
+      }
+    );
+  }
+);
+export {
+  P as default
+};
+//# sourceMappingURL=SmoothScrollbars.js.map

package/components/smoothScrollbars/SmoothScrollbars.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SmoothScrollbars.js","sources":["../../../src/components/smoothScrollbars/SmoothScrollbars.tsx"],"sourcesContent":["import React, {\n    forwardRef,\n    useEffect,\n    useImperativeHandle,\n    useRef,\n    type ForwardedRef,\n    type PropsWithChildren,\n} from 'react';\nimport { Scrollbars } from 'react-custom-scrollbars-4';\nimport classNames from 'classnames';\nimport { debounce, noop } from 'es-toolkit/function';\n\nexport type SmoothScrollbarsProps = {\n    slideIn?: boolean;\n    largeTrack?: boolean;\n    trackOffset?: boolean;\n    className?: string;\n    tagName?: string;\n    autoHeight?: boolean;\n    autoHeightMin?: number;\n    autoHeightMax?: number;\n    onScroll?: (event: React.UIEvent<any> | undefined) => void;\n    style?: React.CSSProperties;\n};\n\ntype ScrollbarsWithUpdate = Scrollbars & {\n    update: () => void;\n};\n\nconst RESIZE_THROTTLING = 100;\n\nconst SmoothScrollbars = forwardRef(\n    (componentProps: PropsWithChildren<SmoothScrollbarsProps>, ref: ForwardedRef<any>) => {\n        const {\n            slideIn = false,\n            largeTrack = false,\n            trackOffset = false,\n            className = '',\n            onScroll = noop,\n            tagName = 'div',\n            autoHeight = false,\n            autoHeightMin = 0,\n            autoHeightMax = 200,\n            children,\n            style,\n            ...remainingProps\n        } = componentProps;\n\n        const scrollbarsRef = useRef<Scrollbars>(null);\n        const contentRef = useRef<HTMLDivElement>(null);\n\n        useImperativeHandle(ref, () => scrollbarsRef.current as Scrollbars);\n\n        useEffect(() => {\n            if (!contentRef.current || !scrollbarsRef.current) {\n                return;\n            }\n\n            const updateScrollbars = debounce(() => {\n                if (scrollbarsRef.current) {\n                    // Trigger a update for the scrollbars.\n                    // This is needed since the lib does not automatically update on content height changes\n                    // See: https://github.com/RobPethick/react-custom-scrollbars-2/issues/12\n\n                    // Use type assertion to tell TypeScript that 'update' exists\n                    (scrollbarsRef.current as ScrollbarsWithUpdate).update();\n                }\n            }, RESIZE_THROTTLING);\n\n            const resizeObserver = new ResizeObserver(updateScrollbars);\n            resizeObserver.observe(contentRef.current);\n\n            return () => {\n                resizeObserver.disconnect();\n                updateScrollbars.cancel();\n            };\n        }, []);\n\n        const wrapperClassNames = classNames(className, slideIn && 'scrollbar-fly-in', 'smooth-scrollbar-wrapper');\n\n        const renderTrackVerticalNames = classNames(\n            'scrollbar-track-vertical',\n            largeTrack && 'scrollbar-track-size-large',\n            trackOffset && 'scrollbar-track-offset'\n        );\n\n        const renderThumbVerticalNames = classNames(\n            'scrollbar-thumb-vertical',\n            largeTrack && 'scrollbar-thumb-size-large'\n        );\n\n        const renderTrackHorizontalNames = classNames(\n            'scrollbar-track-horizontal',\n            largeTrack && 'scrollbar-track-size-large',\n            trackOffset && 'scrollbar-track-offset'\n        );\n\n        const renderThumbHorizontalNames = classNames(\n            'scrollbar-thumb-horizontal',\n            largeTrack && 'scrollbar-thumb-size-large'\n        );\n\n        return (\n            <Scrollbars\n                {...remainingProps}\n                ref={scrollbarsRef}\n                tagName={tagName}\n                onScroll={onScroll}\n                className={wrapperClassNames}\n                hideTracksWhenNotNeeded\n                autoHeight={autoHeight}\n                autoHeightMin={autoHeightMin}\n                autoHeightMax={autoHeightMax}\n                renderView={props => {\n                    return <div {...props} className='scrollbar-view' />;\n                }}\n                renderTrackVertical={props => {\n                    return <div {...props} className={renderTrackVerticalNames} />;\n                }}\n                renderThumbVertical={props => {\n                    return <div {...props} className={renderThumbVerticalNames} />;\n                }}\n                renderTrackHorizontal={props => {\n                    return <div {...props} className={renderTrackHorizontalNames} />;\n                }}\n                renderThumbHorizontal={props => {\n                    return <div {...props} className={renderThumbHorizontalNames} />;\n                }}\n            >\n                <div className='scrollbar-content-wrapper' ref={contentRef}>\n                    {children}\n                </div>\n            </Scrollbars>\n        );\n    }\n);\n\nexport default SmoothScrollbars;\n"],"names":["RESIZE_THROTTLING","SmoothScrollbars","forwardRef","componentProps","ref","slideIn","largeTrack","trackOffset","className","onScroll","noop","tagName","autoHeight","autoHeightMin","autoHeightMax","children","style","remainingProps","scrollbarsRef","useRef","contentRef","useImperativeHandle","useEffect","updateScrollbars","debounce","resizeObserver","wrapperClassNames","classNames","renderTrackVerticalNames","renderThumbVerticalNames","renderTrackHorizontalNames","renderThumbHorizontalNames","jsx","Scrollbars","props"],"mappings":";;;;;AA6BA,MAAMA,IAAoB,KAEpBC,IAAmBC;AAAA,EACrB,CAACC,GAA0DC,MAA2B;AAClF,UAAM;AAAA,MACF,SAAAC,IAAU;AAAA,MACV,YAAAC,IAAa;AAAA,MACb,aAAAC,IAAc;AAAA,MACd,WAAAC,IAAY;AAAA,MACZ,UAAAC,IAAWC;AAAA,MACX,SAAAC,IAAU;AAAA,MACV,YAAAC,IAAa;AAAA,MACb,eAAAC,IAAgB;AAAA,MAChB,eAAAC,IAAgB;AAAA,MAChB,UAAAC;AAAA,MACA,OAAAC;AAAA,MACA,GAAGC;AAAA,IAAA,IACHd,GAEEe,IAAgBC,EAAmB,IAAI,GACvCC,IAAaD,EAAuB,IAAI;AAE9C,IAAAE,EAAoBjB,GAAK,MAAMc,EAAc,OAAqB,GAElEI,EAAU,MAAM;AACZ,UAAI,CAACF,EAAW,WAAW,CAACF,EAAc;AACtC;AAGJ,YAAMK,IAAmBC,EAAS,MAAM;AACpC,QAAIN,EAAc,WAMbA,EAAc,QAAiC,OAAA;AAAA,MAExD,GAAGlB,CAAiB,GAEdyB,IAAiB,IAAI,eAAeF,CAAgB;AAC1D,aAAAE,EAAe,QAAQL,EAAW,OAAO,GAElC,MAAM;AACT,QAAAK,EAAe,WAAA,GACfF,EAAiB,OAAA;AAAA,MACrB;AAAA,IACJ,GAAG,CAAA,CAAE;AAEL,UAAMG,IAAoBC,EAAWnB,GAAWH,KAAW,oBAAoB,0BAA0B,GAEnGuB,IAA2BD;AAAA,MAC7B;AAAA,MACArB,KAAc;AAAA,MACdC,KAAe;AAAA,IAAA,GAGbsB,IAA2BF;AAAA,MAC7B;AAAA,MACArB,KAAc;AAAA,IAAA,GAGZwB,IAA6BH;AAAA,MAC/B;AAAA,MACArB,KAAc;AAAA,MACdC,KAAe;AAAA,IAAA,GAGbwB,IAA6BJ;AAAA,MAC/B;AAAA,MACArB,KAAc;AAAA,IAAA;AAGlB,WACI,gBAAA0B;AAAA,MAACC;AAAA,MAAA;AAAA,QACI,GAAGhB;AAAA,QACJ,KAAKC;AAAA,QACL,SAAAP;AAAA,QACA,UAAAF;AAAA,QACA,WAAWiB;AAAA,QACX,yBAAuB;AAAA,QACvB,YAAAd;AAAA,QACA,eAAAC;AAAA,QACA,eAAAC;AAAA,QACA,YAAY,CAAAoB,MACD,gBAAAF,EAAC,OAAA,EAAK,GAAGE,GAAO,WAAU,kBAAiB;AAAA,QAEtD,qBAAqB,CAAAA,MACV,gBAAAF,EAAC,OAAA,EAAK,GAAGE,GAAO,WAAWN,GAA0B;AAAA,QAEhE,qBAAqB,CAAAM,MACV,gBAAAF,EAAC,OAAA,EAAK,GAAGE,GAAO,WAAWL,GAA0B;AAAA,QAEhE,uBAAuB,CAAAK,MACZ,gBAAAF,EAAC,OAAA,EAAK,GAAGE,GAAO,WAAWJ,GAA4B;AAAA,QAElE,uBAAuB,CAAAI,MACZ,gBAAAF,EAAC,OAAA,EAAK,GAAGE,GAAO,WAAWH,GAA4B;AAAA,QAGlE,4BAAC,OAAA,EAAI,WAAU,6BAA4B,KAAKX,GAC3C,UAAAL,EAAA,CACL;AAAA,MAAA;AAAA,IAAA;AAAA,EAGZ;AACJ;"}

package/components/spinner/Spinner.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { default as React } from 'react';
 export interface SpinnerProps {
     /**
      * Defines whether the spinner is shown on bright or dark background.