@banyan_cloud/roots 2.0.5 → 2.0.7

package/dist/esm/src/components/Toggle/Toggle.js

@@ -0,0 +1,205 @@
+import { slicedToArray as _slicedToArray, objectSpread2 as _objectSpread2, toConsumableArray as _toConsumableArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import '../../../node_modules/prop-types/index.js';
+import { useState, useRef, useEffect } from 'react';
+import { classes } from '../../utils/utils.js';
+import '../buttons/baseButton/BaseButton.js';
+import Button from '../buttons/button/Button.js';
+import '../buttons/chip/Chip.js';
+import ChartSkeleton from './Skeleton/Toggle.skeleton.js';
+import Togglev2 from './Togglev2.js';
+import modules_a2cdc77c from './Toggle.module.css.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { exports as propTypesExports } from '../../../_virtual/index.js';
+
+var Toggle = function Toggle(props) {
+  var options = props.options,
+    multi = props.multi,
+    defaultValue = props.defaultValue,
+    theme = props.theme,
+    value = props.value,
+    onChange = props.onChange,
+    loading = props.loading,
+    fallback = props.fallback,
+    className = props.className,
+    smooth = props.smooth,
+    _props$v = props.v2,
+    v2 = _props$v === void 0 ? false : _props$v;
+  var _useState = useState(0),
+    _useState2 = _slicedToArray(_useState, 2),
+    sliderLeft = _useState2[0],
+    setSliderLeft = _useState2[1];
+  var _useState3 = useState(0),
+    _useState4 = _slicedToArray(_useState3, 2),
+    sliderWidth = _useState4[0],
+    setSliderWidth = _useState4[1];
+  var sliderRef = useRef(null);
+  var updateSliderPosition = function updateSliderPosition() {
+    var activeTabElement = sliderRef.current;
+    if (activeTabElement) {
+      setSliderLeft(activeTabElement.offsetLeft);
+      setSliderWidth(activeTabElement.offsetWidth);
+    }
+  };
+
+  // for uncontrolled input
+  var _useState5 = useState(function () {
+      var _options$2;
+      if (multi) {
+        var _ref, _options$;
+        return (_ref = defaultValue !== null && defaultValue !== void 0 ? defaultValue : options === null || options === void 0 || (_options$ = options[0]) === null || _options$ === void 0 ? void 0 : _options$.value) !== null && _ref !== void 0 ? _ref : [];
+      }
+      return defaultValue !== null && defaultValue !== void 0 ? defaultValue : options === null || options === void 0 || (_options$2 = options[0]) === null || _options$2 === void 0 ? void 0 : _options$2.value;
+    }),
+    _useState6 = _slicedToArray(_useState5, 2),
+    uncontrolledValue = _useState6[0],
+    setUncontrolledValue = _useState6[1];
+  var _useRef = useRef(value !== undefined),
+    isControlled = _useRef.current;
+
+  // eslint-disable-next-line no-nested-ternary
+  var inputValue = isControlled ? value !== null && value !== void 0 ? value : '' : uncontrolledValue;
+  var allSelected = multi ? options.length === inputValue.length : false;
+  var onSelectAll = function onSelectAll() {
+    var allValues = options.map(function (option) {
+      return option.value;
+    });
+    if (isControlled) {
+      onChange(allValues);
+    } else {
+      setUncontrolledValue(allValues);
+    }
+  };
+  var onButtonClick = function onButtonClick(newValue, selected) {
+    // if multi select
+    if (multi) {
+      // if it was already selected, remove it
+      if (selected) {
+        var newInputValue = inputValue.filter(function (val) {
+          return val !== newValue;
+        });
+
+        // if total selected after removal is greater than 0, set that
+        // else select all
+        if (newInputValue.length > 0) {
+          if (isControlled) {
+            onChange(newInputValue);
+          } else {
+            setUncontrolledValue(newInputValue);
+          }
+        } else {
+          onSelectAll();
+        }
+      } else {
+        // if all are selected, select only the one being clicked
+        if (allSelected) {
+          var _newInputValue = [newValue];
+          if (isControlled) {
+            onChange(_newInputValue);
+          } else {
+            setUncontrolledValue(_newInputValue);
+          }
+        } else {
+          var _newInputValue2 = [].concat(_toConsumableArray(inputValue), [newValue]);
+          if (isControlled) {
+            onChange(_newInputValue2);
+          } else {
+            setUncontrolledValue(_newInputValue2);
+          }
+        }
+      }
+    } else {
+      // if single select, just select that item
+      if (isControlled) {
+        onChange(newValue);
+      } else {
+        setUncontrolledValue(newValue);
+      }
+    }
+  };
+  var compareSelection = function compareSelection(input, item) {
+    if (Array.isArray(input)) {
+      return input === null || input === void 0 ? void 0 : input.includes(item);
+    }
+    return input === item;
+  };
+  if (loading || fallback) {
+    return /*#__PURE__*/jsx(ChartSkeleton, {
+      theme: theme,
+      fallback: !loading && fallback,
+      v2: true
+    });
+  }
+  useEffect(function () {
+    updateSliderPosition();
+  }, [inputValue, options]);
+  if (v2) {
+    return /*#__PURE__*/jsx(Togglev2, _objectSpread2({}, props));
+  }
+  return /*#__PURE__*/jsx("div", {
+    className: classes(modules_a2cdc77c.root, modules_a2cdc77c[theme], className),
+    children: /*#__PURE__*/jsxs("div", {
+      className: modules_a2cdc77c.toggle,
+      children: [multi && /*#__PURE__*/jsx(Button, {
+        type: "button",
+        size: "auto",
+        "data-elem": "toggle",
+        variant: "text",
+        className: classes(modules_a2cdc77c['toggle-button'], allSelected ? modules_a2cdc77c['all-select'] : ''),
+        onClick: onSelectAll,
+        title: "All"
+      }), options.map(function (tab) {
+        var title = tab.title,
+          leftComponent = tab.leftComponent,
+          rightComponent = tab.rightComponent,
+          disabled = tab.disabled,
+          itemClassName = tab.className;
+        var isActive = compareSelection(inputValue, tab.value) && !allSelected;
+        return /*#__PURE__*/jsx(Button, {
+          ref: isActive ? sliderRef : null,
+          type: "button",
+          onClick: function onClick() {
+            return onButtonClick(tab.value, isActive);
+          },
+          size: "auto",
+          "data-elem": "toggle",
+          disabled: disabled,
+          title: title,
+          className: classes(modules_a2cdc77c['toggle-button'], modules_a2cdc77c[theme], disabled ? modules_a2cdc77c.disabled : '', isActive ? modules_a2cdc77c.active : '', !smooth ? modules_a2cdc77c.highlight : '', itemClassName),
+          leftComponent: leftComponent,
+          rightComponent: rightComponent
+        }, title);
+      }), smooth && !multi && /*#__PURE__*/jsx("div", {
+        className: classes(modules_a2cdc77c.slider, modules_a2cdc77c[theme], smooth ? modules_a2cdc77c.smooth : ''),
+        style: {
+          left: "".concat(sliderLeft, "px"),
+          width: "".concat(sliderWidth, "px")
+        }
+      })]
+    })
+  });
+};
+Toggle.propTypes = {
+  loading: propTypesExports.bool,
+  fallback: propTypesExports.bool,
+  className: propTypesExports.string,
+  theme: propTypesExports.oneOf(['dark', 'light']),
+  options: propTypesExports.arrayOf(propTypesExports.string),
+  value: propTypesExports.string,
+  multi: propTypesExports.bool,
+  smooth: propTypesExports.bool,
+  v2: propTypesExports.bool
+};
+Toggle.defaultProps = {
+  loading: false,
+  fallback: false,
+  className: '',
+  theme: 'light',
+  options: [],
+  value: undefined,
+  multi: false,
+  smooth: false,
+  v2: false
+};
+
+export { Toggle as default };
+//# sourceMappingURL=Toggle.js.map

package/dist/esm/src/components/Toggle/Toggle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle.js","sources":["../../../../../src/components/Toggle/Toggle.jsx"],"sourcesContent":["/* eslint-disable no-lonely-if */\nimport PropTypes from 'prop-types';\nimport { useEffect, useRef, useState } from 'react';\nimport { classes } from '../../utils';\nimport { Button } from '../buttons';\nimport { Skeleton } from './Skeleton';\nimport Togglev2 from './Togglev2';\nimport styles from './Toggle.module.css';\n\nconst Toggle = (props) => {\n\tconst {\n\t\toptions,\n\t\tmulti,\n\t\tdefaultValue,\n\t\ttheme,\n\t\tvalue,\n\t\tonChange,\n\t\tloading,\n\t\tfallback,\n\t\tclassName,\n\t\tsmooth,\n\t\tv2 = false,\n\t} = props;\n\tconst [sliderLeft, setSliderLeft] = useState(0);\n\tconst [sliderWidth, setSliderWidth] = useState(0);\n\n\tconst sliderRef = useRef(null);\n\n\tconst updateSliderPosition = () => {\n\t\tconst activeTabElement = sliderRef.current;\n\t\tif (activeTabElement) {\n\t\t\tsetSliderLeft(activeTabElement.offsetLeft);\n\t\t\tsetSliderWidth(activeTabElement.offsetWidth);\n\t\t}\n\t};\n\n\t// for uncontrolled input\n\tconst [uncontrolledValue, setUncontrolledValue] = useState(() => {\n\t\tif (multi) {\n\t\t\treturn defaultValue ?? options?.[0]?.value ?? [];\n\t\t}\n\t\treturn defaultValue ?? options?.[0]?.value;\n\t});\n\n\tconst { current: isControlled } = useRef(value !== undefined);\n\n\t// eslint-disable-next-line no-nested-ternary\n\tconst inputValue = isControlled ? value ?? '' : uncontrolledValue;\n\n\tconst allSelected = multi ? options.length === inputValue.length : false;\n\n\tconst onSelectAll = () => {\n\t\tconst allValues = options.map((option) => {\n\t\t\treturn option.value;\n\t\t});\n\t\tif (isControlled) {\n\t\t\tonChange(allValues);\n\t\t} else {\n\t\t\tsetUncontrolledValue(allValues);\n\t\t}\n\t};\n\n\tconst onButtonClick = (newValue, selected) => {\n\t\t// if multi select\n\t\tif (multi) {\n\t\t\t// if it was already selected, remove it\n\t\t\tif (selected) {\n\t\t\t\tconst newInputValue = inputValue.filter((val) => {\n\t\t\t\t\treturn val !== newValue;\n\t\t\t\t});\n\n\t\t\t\t// if total selected after removal is greater than 0, set that\n\t\t\t\t// else select all\n\t\t\t\tif (newInputValue.length > 0) {\n\t\t\t\t\tif (isControlled) {\n\t\t\t\t\t\tonChange(newInputValue);\n\t\t\t\t\t} else {\n\t\t\t\t\t\tsetUncontrolledValue(newInputValue);\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\tonSelectAll();\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\t// if all are selected, select only the one being clicked\n\t\t\t\tif (allSelected) {\n\t\t\t\t\tconst newInputValue = [newValue];\n\t\t\t\t\tif (isControlled) {\n\t\t\t\t\t\tonChange(newInputValue);\n\t\t\t\t\t} else {\n\t\t\t\t\t\tsetUncontrolledValue(newInputValue);\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\tconst newInputValue = [...inputValue, newValue];\n\t\t\t\t\tif (isControlled) {\n\t\t\t\t\t\tonChange(newInputValue);\n\t\t\t\t\t} else {\n\t\t\t\t\t\tsetUncontrolledValue(newInputValue);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t} else {\n\t\t\t// if single select, just select that item\n\t\t\tif (isControlled) {\n\t\t\t\tonChange(newValue);\n\t\t\t} else {\n\t\t\t\tsetUncontrolledValue(newValue);\n\t\t\t}\n\t\t}\n\t};\n\n\tconst compareSelection = (input, item) => {\n\t\tif (Array.isArray(input)) {\n\t\t\treturn input?.includes(item);\n\t\t}\n\t\treturn input === item;\n\t};\n\tif (loading || fallback) {\n\t\treturn <Skeleton theme={theme} fallback={!loading && fallback} v2 />;\n\t}\n\n\tuseEffect(() => {\n\t\tupdateSliderPosition();\n\t}, [inputValue, options]);\n\n\tif (v2) {\n\t\treturn <Togglev2 {...props} />;\n\t}\n\n\treturn (\n\t\t<div className={classes(styles.root, styles[theme], className)}>\n\t\t\t<div className={styles.toggle}>\n\t\t\t\t{multi && (\n\t\t\t\t\t<Button\n\t\t\t\t\t\ttype='button'\n\t\t\t\t\t\tsize='auto'\n\t\t\t\t\t\tdata-elem='toggle'\n\t\t\t\t\t\tvariant='text'\n\t\t\t\t\t\tclassName={classes(\n\t\t\t\t\t\t\tstyles['toggle-button'],\n\t\t\t\t\t\t\tallSelected ? styles['all-select'] : ''\n\t\t\t\t\t\t)}\n\t\t\t\t\t\tonClick={onSelectAll}\n\t\t\t\t\t\ttitle='All'\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t\t{options.map((tab) => {\n\t\t\t\t\tconst {\n\t\t\t\t\t\ttitle,\n\t\t\t\t\t\tleftComponent,\n\t\t\t\t\t\trightComponent,\n\t\t\t\t\t\tdisabled,\n\t\t\t\t\t\tclassName: itemClassName,\n\t\t\t\t\t} = tab;\n\t\t\t\t\tconst isActive = compareSelection(inputValue, tab.value) && !allSelected;\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tkey={title}\n\t\t\t\t\t\t\tref={isActive ? sliderRef : null}\n\t\t\t\t\t\t\ttype='button'\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\treturn onButtonClick(tab.value, isActive);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tsize='auto'\n\t\t\t\t\t\t\tdata-elem='toggle'\n\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\ttitle={title}\n\t\t\t\t\t\t\tclassName={classes(\n\t\t\t\t\t\t\t\tstyles['toggle-button'],\n\t\t\t\t\t\t\t\tstyles[theme],\n\t\t\t\t\t\t\t\tdisabled ? styles.disabled : '',\n\t\t\t\t\t\t\t\tisActive ? styles.active : '',\n\t\t\t\t\t\t\t\t!smooth ? styles.highlight : '',\n\t\t\t\t\t\t\t\titemClassName\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\tleftComponent={leftComponent}\n\t\t\t\t\t\t\trightComponent={rightComponent}\n\t\t\t\t\t\t/>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t\t{smooth && !multi && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={classes(\n\t\t\t\t\t\t\tstyles.slider,\n\t\t\t\t\t\t\tstyles[theme],\n\t\t\t\t\t\t\tsmooth ? styles.smooth : ''\n\t\t\t\t\t\t)}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tleft: `${sliderLeft}px`,\n\t\t\t\t\t\t\twidth: `${sliderWidth}px`,\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\nToggle.propTypes = {\n\tloading: PropTypes.bool,\n\tfallback: PropTypes.bool,\n\tclassName: PropTypes.string,\n\ttheme: PropTypes.oneOf(['dark', 'light']),\n\toptions: PropTypes.arrayOf(PropTypes.string),\n\tvalue: PropTypes.string,\n\tmulti: PropTypes.bool,\n\tsmooth: PropTypes.bool,\n\tv2: PropTypes.bool,\n};\n\nToggle.defaultProps = {\n\tloading: false,\n\tfallback: false,\n\tclassName: '',\n\ttheme: 'light',\n\toptions: [],\n\tvalue: undefined,\n\tmulti: false,\n\tsmooth: false,\n\tv2: false,\n};\n\nexport default Toggle;\n"],"names":["Toggle","props","options","multi","defaultValue","theme","value","onChange","loading","fallback","className","smooth","_props$v","v2","_useState","useState","_useState2","_slicedToArray","sliderLeft","setSliderLeft","_useState3","_useState4","sliderWidth","setSliderWidth","sliderRef","useRef","updateSliderPosition","activeTabElement","current","offsetLeft","offsetWidth","_useState5","_options$2","_ref","_options$","_useState6","uncontrolledValue","setUncontrolledValue","_useRef","undefined","isControlled","inputValue","allSelected","length","onSelectAll","allValues","map","option","onButtonClick","newValue","selected","newInputValue","filter","val","concat","_toConsumableArray","compareSelection","input","item","Array","isArray","includes","_jsx","Skeleton","useEffect","Togglev2","_objectSpread","classes","styles","root","children","_jsxs","toggle","Button","type","size","variant","onClick","title","tab","leftComponent","rightComponent","disabled","itemClassName","isActive","ref","active","highlight","slider","style","left","width","propTypes","PropTypes","bool","string","oneOf","arrayOf","defaultProps"],"mappings":"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"}

package/dist/esm/src/components/Toggle/Toggle.module.css.js

@@ -0,0 +1,8 @@
+import n from '../../../node_modules/rollup-plugin-styles/dist/runtime/inject-css.js';
+
+var css = ".Toggle_module_root__9c2184fc {\n  width: -moz-fit-content;\n  width: fit-content;\n  border-radius: 0.3125rem;\n  font-weight: 500;\n  padding: 0.3125rem;\n  background: var(--mono-color3);\n  border: 1px solid var(--mono-color2);\n}\n.Toggle_module_root__9c2184fc .Toggle_module_toggle__9c2184fc {\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-start;\n  align-items: center;\n  position: relative;\n  gap: 0.3375rem;\n  height: 100%;\n}\n.Toggle_module_root__9c2184fc .Toggle_module_toggle__9c2184fc > button[data-elem=base-cell].Toggle_module_toggleButton__9c2184fc {\n  position: relative;\n  z-index: 2;\n  background: transparent;\n  min-width: 5rem;\n  width: auto;\n  height: auto;\n}\n.Toggle_module_root__9c2184fc .Toggle_module_toggle__9c2184fc > button[data-elem=base-cell].Toggle_module_toggleButton__9c2184fc > [data-elem=component2] > [data-elem=title] {\n  color: var(--black);\n}\n.Toggle_module_root__9c2184fc .Toggle_module_toggle__9c2184fc > button[data-elem=base-cell].Toggle_module_toggleButton__9c2184fc.Toggle_module_active__9c2184fc.Toggle_module_highlight__9c2184fc {\n  background-color: var(--mono-color1);\n}\n.Toggle_module_root__9c2184fc .Toggle_module_toggle__9c2184fc > button[data-elem=base-cell].Toggle_module_toggleButton__9c2184fc.Toggle_module_active__9c2184fc > [data-elem=component2] > [data-elem=title] {\n  color: var(--white);\n}\n.Toggle_module_root__9c2184fc .Toggle_module_toggle__9c2184fc > button[data-elem=base-cell].Toggle_module_toggleButton__9c2184fc.Toggle_module_disabled__9c2184fc {\n  cursor: not-allowed;\n}\n.Toggle_module_root__9c2184fc .Toggle_module_toggle__9c2184fc > button[data-elem=base-cell].Toggle_module_toggleButton__9c2184fc.Toggle_module_disabled__9c2184fc > [data-elem=component2] > [data-elem=title] {\n  color: var(--mono-color2);\n}\n.Toggle_module_root__9c2184fc .Toggle_module_toggle__9c2184fc > button[data-elem=base-cell].Toggle_module_toggleButton__9c2184fc.Toggle_module_allSelect__9c2184fc {\n  background-color: var(--mono-color1);\n}\n.Toggle_module_root__9c2184fc .Toggle_module_toggle__9c2184fc > button[data-elem=base-cell].Toggle_module_toggleButton__9c2184fc.Toggle_module_allSelect__9c2184fc > [data-elem=component2] > [data-elem=title] {\n  color: var(--white);\n}\n.Toggle_module_root__9c2184fc .Toggle_module_toggle__9c2184fc .Toggle_module_slider__9c2184fc {\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  height: 100%;\n  border-radius: 0.3125rem;\n  font-weight: 500;\n  background: var(--mono-color1);\n}\n.Toggle_module_root__9c2184fc .Toggle_module_toggle__9c2184fc .Toggle_module_slider__9c2184fc.Toggle_module_smooth__9c2184fc {\n  transition: left 0.2s ease-in-out, width 0.2s ease-in-out;\n}";
+var modules_a2cdc77c = {"root":"Toggle_module_root__9c2184fc","toggle":"Toggle_module_toggle__9c2184fc","toggle-button":"Toggle_module_toggleButton__9c2184fc","active":"Toggle_module_active__9c2184fc","highlight":"Toggle_module_highlight__9c2184fc","disabled":"Toggle_module_disabled__9c2184fc","all-select":"Toggle_module_allSelect__9c2184fc","slider":"Toggle_module_slider__9c2184fc","smooth":"Toggle_module_smooth__9c2184fc"};
+n(css,{});
+
+export { css, modules_a2cdc77c as default };
+//# sourceMappingURL=Toggle.module.css.js.map

package/dist/esm/src/components/Toggle/Toggle.module.css.js.map

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

package/dist/esm/src/components/Toggle/Togglev2.js

@@ -0,0 +1,172 @@
+import { slicedToArray as _slicedToArray, toConsumableArray as _toConsumableArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import '../../../node_modules/prop-types/index.js';
+import { useState, useRef, useEffect } from 'react';
+import { classes } from '../../utils/utils.js';
+import '../buttons/baseButton/BaseButton.js';
+import Button from '../buttons/button/Button.js';
+import '../buttons/chip/Chip.js';
+import ChartSkeleton from './Skeleton/Toggle.skeleton.js';
+import modules_ae2b09c6 from './Togglev2.module.css.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { exports as propTypesExports } from '../../../_virtual/index.js';
+
+var Togglev2 = function Togglev2(props) {
+  var _props$options = props.options,
+    options = _props$options === void 0 ? [] : _props$options,
+    _props$multi = props.multi,
+    multi = _props$multi === void 0 ? false : _props$multi,
+    defaultValue = props.defaultValue,
+    _props$theme = props.theme,
+    theme = _props$theme === void 0 ? 'light' : _props$theme,
+    _props$value = props.value,
+    value = _props$value === void 0 ? undefined : _props$value,
+    onChange = props.onChange,
+    _props$loading = props.loading,
+    loading = _props$loading === void 0 ? false : _props$loading,
+    _props$fallback = props.fallback,
+    fallback = _props$fallback === void 0 ? false : _props$fallback,
+    _props$className = props.className,
+    className = _props$className === void 0 ? '' : _props$className,
+    _props$smooth = props.smooth,
+    smooth = _props$smooth === void 0 ? false : _props$smooth,
+    secondary = props.secondary;
+  var _useState = useState(0),
+    _useState2 = _slicedToArray(_useState, 2),
+    sliderLeft = _useState2[0],
+    setSliderLeft = _useState2[1];
+  var _useState3 = useState(0),
+    _useState4 = _slicedToArray(_useState3, 2),
+    sliderWidth = _useState4[0],
+    setSliderWidth = _useState4[1];
+  var sliderRef = useRef(null);
+  var updateSliderPosition = function updateSliderPosition() {
+    var activeTabElement = sliderRef.current;
+    if (activeTabElement) {
+      setSliderLeft(activeTabElement.offsetLeft);
+      setSliderWidth(activeTabElement.offsetWidth);
+    }
+  };
+
+  // for uncontrolled input
+  var _useState5 = useState(function () {
+      var _options$2;
+      if (multi) {
+        var _ref, _options$;
+        return (_ref = defaultValue !== null && defaultValue !== void 0 ? defaultValue : options === null || options === void 0 || (_options$ = options[0]) === null || _options$ === void 0 ? void 0 : _options$.value) !== null && _ref !== void 0 ? _ref : [];
+      }
+      return defaultValue !== null && defaultValue !== void 0 ? defaultValue : options === null || options === void 0 || (_options$2 = options[0]) === null || _options$2 === void 0 ? void 0 : _options$2.value;
+    }),
+    _useState6 = _slicedToArray(_useState5, 2),
+    uncontrolledValue = _useState6[0],
+    setUncontrolledValue = _useState6[1];
+  var _useRef = useRef(value !== undefined),
+    isControlled = _useRef.current;
+  var inputValue = isControlled ? value !== null && value !== void 0 ? value : '' : uncontrolledValue;
+  var allSelected = multi ? options.length === inputValue.length : false;
+  var onButtonClick = function onButtonClick(newValue, selected) {
+    // if multi select
+    if (multi) {
+      // if it was already selected, remove it
+      if (selected) {
+        var newInputValue = inputValue.filter(function (val) {
+          return val !== newValue;
+        });
+
+        // if total selected after removal is greater than 0, set that
+        // else select all
+        if (isControlled) {
+          onChange(newInputValue);
+        } else {
+          setUncontrolledValue(newInputValue);
+        }
+      } else {
+        // if all are selected, select only the one being clicked
+        if (allSelected) {
+          var _newInputValue = [newValue];
+          if (isControlled) {
+            onChange(_newInputValue);
+          } else {
+            setUncontrolledValue(_newInputValue);
+          }
+        } else {
+          var _newInputValue2 = [].concat(_toConsumableArray(inputValue), [newValue]);
+          if (isControlled) {
+            onChange(_newInputValue2);
+          } else {
+            setUncontrolledValue(_newInputValue2);
+          }
+        }
+      }
+    } else {
+      // if single select, just select that item
+      if (isControlled) {
+        onChange(newValue);
+      } else {
+        setUncontrolledValue(newValue);
+      }
+    }
+  };
+  var compareSelection = function compareSelection(input, item) {
+    if (Array.isArray(input)) {
+      return input === null || input === void 0 ? void 0 : input.includes(item);
+    }
+    return input === item;
+  };
+  if (loading || fallback) {
+    return /*#__PURE__*/jsx(ChartSkeleton, {
+      theme: theme,
+      fallback: !loading && fallback,
+      v2: true
+    });
+  }
+  useEffect(function () {
+    updateSliderPosition();
+  }, [inputValue, options]);
+  return /*#__PURE__*/jsx("div", {
+    className: classes(modules_ae2b09c6.root, modules_ae2b09c6[theme], className),
+    children: /*#__PURE__*/jsxs("div", {
+      className: modules_ae2b09c6.toggle,
+      children: [options.map(function (tab) {
+        var title = tab.title,
+          leftComponent = tab.leftComponent,
+          rightComponent = tab.rightComponent,
+          disabled = tab.disabled,
+          itemClassName = tab.className;
+        var isActive = compareSelection(inputValue, tab.value);
+        return /*#__PURE__*/jsx(Button, {
+          ref: isActive ? sliderRef : null,
+          type: "button",
+          onClick: function onClick() {
+            onButtonClick(tab.value, isActive);
+          },
+          size: "auto",
+          "data-elem": "toggle",
+          disabled: disabled,
+          title: title,
+          className: classes(modules_ae2b09c6['toggle-button'], modules_ae2b09c6[theme], disabled ? modules_ae2b09c6.disabled : '', isActive ? modules_ae2b09c6.active : '', secondary ? modules_ae2b09c6.secondary : '', !smooth ? modules_ae2b09c6.highlight : '', itemClassName),
+          leftComponent: leftComponent,
+          rightComponent: rightComponent
+        }, title);
+      }), smooth && !multi && /*#__PURE__*/jsx("div", {
+        className: classes(modules_ae2b09c6.slider, secondary ? modules_ae2b09c6.secondary : '', modules_ae2b09c6[theme], smooth ? modules_ae2b09c6.smooth : ''),
+        style: {
+          left: "".concat(sliderLeft, "px"),
+          width: "".concat(sliderWidth, "px")
+        }
+      })]
+    })
+  });
+};
+Togglev2.propTypes = {
+  loading: propTypesExports.bool,
+  fallback: propTypesExports.bool,
+  className: propTypesExports.string,
+  theme: propTypesExports.oneOf(['dark', 'light']),
+  options: propTypesExports.arrayOf(propTypesExports.string),
+  value: propTypesExports.string,
+  multi: propTypesExports.bool,
+  smooth: propTypesExports.bool
+};
+
+export { Togglev2 as default };
+//# sourceMappingURL=Togglev2.js.map

package/dist/esm/src/components/Toggle/Togglev2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Togglev2.js","sources":["../../../../../src/components/Toggle/Togglev2.jsx"],"sourcesContent":["/* eslint-disable react/require-default-props */\n/* eslint-disable no-lonely-if */\nimport PropTypes from 'prop-types';\nimport { useEffect, useRef, useState } from 'react';\nimport { classes } from '../../utils';\nimport { Button } from '../buttons';\nimport { Skeleton } from './Skeleton';\nimport styles from './Togglev2.module.css';\n\nconst Togglev2 = (props) => {\n\tconst {\n\t\toptions = [],\n\t\tmulti = false,\n\t\tdefaultValue,\n\t\ttheme = 'light',\n\t\tvalue = undefined,\n\t\tonChange,\n\t\tloading = false,\n\t\tfallback = false,\n\t\tclassName = '',\n\t\tsmooth = false,\n\t\tsecondary,\n\t} = props;\n\tconst [sliderLeft, setSliderLeft] = useState(0);\n\tconst [sliderWidth, setSliderWidth] = useState(0);\n\n\tconst sliderRef = useRef(null);\n\n\tconst updateSliderPosition = () => {\n\t\tconst activeTabElement = sliderRef.current;\n\t\tif (activeTabElement) {\n\t\t\tsetSliderLeft(activeTabElement.offsetLeft);\n\t\t\tsetSliderWidth(activeTabElement.offsetWidth);\n\t\t}\n\t};\n\n\t// for uncontrolled input\n\tconst [uncontrolledValue, setUncontrolledValue] = useState(() => {\n\t\tif (multi) {\n\t\t\treturn defaultValue ?? options?.[0]?.value ?? [];\n\t\t}\n\t\treturn defaultValue ?? options?.[0]?.value;\n\t});\n\n\tconst { current: isControlled } = useRef(value !== undefined);\n\n\tconst inputValue = isControlled ? value ?? '' : uncontrolledValue;\n\n\tconst allSelected = multi ? options.length === inputValue.length : false;\n\n\tconst onButtonClick = (newValue, selected) => {\n\t\t// if multi select\n\t\tif (multi) {\n\t\t\t// if it was already selected, remove it\n\t\t\tif (selected) {\n\t\t\t\tconst newInputValue = inputValue.filter((val) => {\n\t\t\t\t\treturn val !== newValue;\n\t\t\t\t});\n\n\t\t\t\t// if total selected after removal is greater than 0, set that\n\t\t\t\t// else select all\n\t\t\t\tif (isControlled) {\n\t\t\t\t\tonChange(newInputValue);\n\t\t\t\t} else {\n\t\t\t\t\tsetUncontrolledValue(newInputValue);\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\t// if all are selected, select only the one being clicked\n\t\t\t\tif (allSelected) {\n\t\t\t\t\tconst newInputValue = [newValue];\n\t\t\t\t\tif (isControlled) {\n\t\t\t\t\t\tonChange(newInputValue);\n\t\t\t\t\t} else {\n\t\t\t\t\t\tsetUncontrolledValue(newInputValue);\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\tconst newInputValue = [...inputValue, newValue];\n\t\t\t\t\tif (isControlled) {\n\t\t\t\t\t\tonChange(newInputValue);\n\t\t\t\t\t} else {\n\t\t\t\t\t\tsetUncontrolledValue(newInputValue);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t} else {\n\t\t\t// if single select, just select that item\n\t\t\tif (isControlled) {\n\t\t\t\tonChange(newValue);\n\t\t\t} else {\n\t\t\t\tsetUncontrolledValue(newValue);\n\t\t\t}\n\t\t}\n\t};\n\n\tconst compareSelection = (input, item) => {\n\t\tif (Array.isArray(input)) {\n\t\t\treturn input?.includes(item);\n\t\t}\n\t\treturn input === item;\n\t};\n\tif (loading || fallback) {\n\t\treturn <Skeleton theme={theme} fallback={!loading && fallback} v2 />;\n\t}\n\n\tuseEffect(() => {\n\t\tupdateSliderPosition();\n\t}, [inputValue, options]);\n\n\treturn (\n\t\t<div className={classes(styles.root, styles[theme], className)}>\n\t\t\t<div className={styles.toggle}>\n\t\t\t\t{options.map((tab) => {\n\t\t\t\t\tconst {\n\t\t\t\t\t\ttitle,\n\t\t\t\t\t\tleftComponent,\n\t\t\t\t\t\trightComponent,\n\t\t\t\t\t\tdisabled,\n\t\t\t\t\t\tclassName: itemClassName,\n\t\t\t\t\t} = tab;\n\t\t\t\t\tconst isActive = compareSelection(inputValue, tab.value);\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tkey={title}\n\t\t\t\t\t\t\tref={isActive ? sliderRef : null}\n\t\t\t\t\t\t\ttype='button'\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tonButtonClick(tab.value, isActive);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tsize='auto'\n\t\t\t\t\t\t\tdata-elem='toggle'\n\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\ttitle={title}\n\t\t\t\t\t\t\tclassName={classes(\n\t\t\t\t\t\t\t\tstyles['toggle-button'],\n\t\t\t\t\t\t\t\tstyles[theme],\n\t\t\t\t\t\t\t\tdisabled ? styles.disabled : '',\n\t\t\t\t\t\t\t\tisActive ? styles.active : '',\n\t\t\t\t\t\t\t\tsecondary ? styles.secondary : '',\n\t\t\t\t\t\t\t\t!smooth ? styles.highlight : '',\n\t\t\t\t\t\t\t\titemClassName\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\tleftComponent={leftComponent}\n\t\t\t\t\t\t\trightComponent={rightComponent}\n\t\t\t\t\t\t/>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t\t{smooth && !multi && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={classes(\n\t\t\t\t\t\t\tstyles.slider,\n\t\t\t\t\t\t\tsecondary ? styles.secondary : '',\n\t\t\t\t\t\t\tstyles[theme],\n\t\t\t\t\t\t\tsmooth ? styles.smooth : ''\n\t\t\t\t\t\t)}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tleft: `${sliderLeft}px`,\n\t\t\t\t\t\t\twidth: `${sliderWidth}px`,\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\nTogglev2.propTypes = {\n\tloading: PropTypes.bool,\n\tfallback: PropTypes.bool,\n\tclassName: PropTypes.string,\n\ttheme: PropTypes.oneOf(['dark', 'light']),\n\toptions: PropTypes.arrayOf(PropTypes.string),\n\tvalue: PropTypes.string,\n\tmulti: PropTypes.bool,\n\tsmooth: PropTypes.bool,\n};\n\nexport default Togglev2;\n"],"names":["Togglev2","props","_props$options","options","_props$multi","multi","defaultValue","_props$theme","theme","_props$value","value","undefined","onChange","_props$loading","loading","_props$fallback","fallback","_props$className","className","_props$smooth","smooth","secondary","_useState","useState","_useState2","_slicedToArray","sliderLeft","setSliderLeft","_useState3","_useState4","sliderWidth","setSliderWidth","sliderRef","useRef","updateSliderPosition","activeTabElement","current","offsetLeft","offsetWidth","_useState5","_options$2","_ref","_options$","_useState6","uncontrolledValue","setUncontrolledValue","_useRef","isControlled","inputValue","allSelected","length","onButtonClick","newValue","selected","newInputValue","filter","val","concat","_toConsumableArray","compareSelection","input","item","Array","isArray","includes","_jsx","Skeleton","v2","useEffect","classes","styles","root","children","_jsxs","toggle","map","tab","title","leftComponent","rightComponent","disabled","itemClassName","isActive","Button","ref","type","onClick","size","active","highlight","slider","style","left","width","propTypes","PropTypes","bool","string","oneOf","arrayOf"],"mappings":"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"}

package/dist/esm/src/components/Toggle/Togglev2.module.css.js

@@ -0,0 +1,8 @@
+import n from '../../../node_modules/rollup-plugin-styles/dist/runtime/inject-css.js';
+
+var css = ".Togglev2_module_root__69050cd0 {\n  width: -moz-fit-content;\n  width: fit-content;\n  border: 0px !important;\n  font-weight: 500;\n  padding: 0.3125rem;\n  background: transparent !important;\n  background: var(--mono-color3);\n  border: 1px solid var(--mono-color2);\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 {\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-start;\n  align-items: center;\n  position: relative;\n  gap: 0.3375rem;\n  height: 100%;\n  background: var(--light-color2);\n  border-radius: 0.25rem;\n  padding: 0.2188rem 0.1875rem;\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 > button[data-elem=base-cell].Togglev2_module_toggleButton__69050cd0 {\n  position: relative;\n  z-index: 2;\n  background: transparent;\n  min-width: 5rem;\n  width: auto;\n  height: auto;\n  opacity: 1;\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 > button[data-elem=base-cell].Togglev2_module_toggleButton__69050cd0 > [data-elem=component2] > [data-elem=title] {\n  color: var(--black);\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 > button[data-elem=base-cell].Togglev2_module_toggleButton__69050cd0 > [data-elem=component2] > [data-elem=title] {\n  color: var(--mono-color1);\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 > button[data-elem=base-cell].Togglev2_module_toggleButton__69050cd0.Togglev2_module_secondary__69050cd0 {\n  opacity: 0.5;\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 > button[data-elem=base-cell].Togglev2_module_toggleButton__69050cd0.Togglev2_module_secondary__69050cd0:hover {\n  opacity: 1;\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 > button[data-elem=base-cell].Togglev2_module_toggleButton__69050cd0.Togglev2_module_secondary__69050cd0 > [data-elem=component2] > [data-elem=title] {\n  color: var(--secondary-color2);\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 > button[data-elem=base-cell].Togglev2_module_toggleButton__69050cd0.Togglev2_module_active__69050cd0 {\n  opacity: 1;\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 > button[data-elem=base-cell].Togglev2_module_toggleButton__69050cd0.Togglev2_module_active__69050cd0.Togglev2_module_highlight__69050cd0 {\n  background-color: var(--mono-color1);\n  border-radius: 0.25rem;\n  box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.25);\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 > button[data-elem=base-cell].Togglev2_module_toggleButton__69050cd0.Togglev2_module_active__69050cd0.Togglev2_module_highlight__69050cd0.Togglev2_module_secondary__69050cd0 {\n  opacity: 1;\n  border-radius: 0.25rem;\n  background-color: var(--light-color3);\n  box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.25);\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 > button[data-elem=base-cell].Togglev2_module_toggleButton__69050cd0.Togglev2_module_active__69050cd0 > [data-elem=component2] > [data-elem=title] {\n  color: var(--white);\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 > button[data-elem=base-cell].Togglev2_module_toggleButton__69050cd0.Togglev2_module_active__69050cd0.Togglev2_module_secondary__69050cd0 {\n  opacity: 1;\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 > button[data-elem=base-cell].Togglev2_module_toggleButton__69050cd0.Togglev2_module_active__69050cd0.Togglev2_module_secondary__69050cd0 > [data-elem=component2] > [data-elem=title] {\n  color: var(--secondary-color2);\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 > button[data-elem=base-cell].Togglev2_module_toggleButton__69050cd0.Togglev2_module_disabled__69050cd0 {\n  cursor: not-allowed;\n  opacity: 0.7;\n  background-color: transparent;\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 > button[data-elem=base-cell].Togglev2_module_toggleButton__69050cd0.Togglev2_module_disabled__69050cd0 > [data-elem=component2] > [data-elem=title] {\n  color: var(--side-bar-icon2);\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 > button[data-elem=base-cell].Togglev2_module_toggleButton__69050cd0.Togglev2_module_allSelect__69050cd0 {\n  background-color: var(--mono-color1);\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 > button[data-elem=base-cell].Togglev2_module_toggleButton__69050cd0.Togglev2_module_allSelect__69050cd0 > [data-elem=component2] > [data-elem=title] {\n  color: var(--white);\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 > button[data-elem=base-cell].Togglev2_module_toggleButton__69050cd0.Togglev2_module_allSelect__69050cd0.Togglev2_module_secondary__69050cd0 {\n  background-color: var(--light-color1);\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 > button[data-elem=base-cell].Togglev2_module_toggleButton__69050cd0.Togglev2_module_allSelect__69050cd0.Togglev2_module_secondary__69050cd0 > [data-elem=component2] > [data-elem=title] {\n  color: var(--secondary-color2);\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 .Togglev2_module_slider__69050cd0 {\n  position: absolute;\n  bottom: 0.1875rem;\n  left: 0;\n  height: 85%;\n  font-weight: 500;\n  background: var(--mono-color1);\n  border-radius: 0.25rem;\n  box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.25);\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 .Togglev2_module_slider__69050cd0.Togglev2_module_secondary__69050cd0 {\n  border-radius: 0.25rem;\n  background-color: var(--light-color3);\n  box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.251);\n}\n.Togglev2_module_root__69050cd0 .Togglev2_module_toggle__69050cd0 .Togglev2_module_slider__69050cd0.Togglev2_module_smooth__69050cd0 {\n  transition: left 0.2s ease-in-out, width 0.2s ease-in-out;\n}";
+var modules_ae2b09c6 = {"root":"Togglev2_module_root__69050cd0","toggle":"Togglev2_module_toggle__69050cd0","toggle-button":"Togglev2_module_toggleButton__69050cd0","secondary":"Togglev2_module_secondary__69050cd0","active":"Togglev2_module_active__69050cd0","highlight":"Togglev2_module_highlight__69050cd0","disabled":"Togglev2_module_disabled__69050cd0","all-select":"Togglev2_module_allSelect__69050cd0","slider":"Togglev2_module_slider__69050cd0","smooth":"Togglev2_module_smooth__69050cd0"};
+n(css,{});
+
+export { css, modules_ae2b09c6 as default };
+//# sourceMappingURL=Togglev2.module.css.js.map

package/dist/esm/src/components/Toggle/Togglev2.module.css.js.map

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

package/dist/esm/src/components/accordion/Accordion.js

@@ -0,0 +1,141 @@
+import { slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import { motion } from 'framer-motion';
+import '../../../node_modules/prop-types/index.js';
+import { useState, useRef } from 'react';
+import { classes } from '../../utils/utils.js';
+import '../buttons/baseButton/BaseButton.js';
+import Button from '../buttons/button/Button.js';
+import '../buttons/chip/Chip.js';
+import { BaseCell } from '../cell/BaseCell.js';
+import '../cell/BaseCell.types.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import '../icons/AngleDouble/AngleDouble.js';
+import '../icons/Arrow/Arrow.js';
+import '../icons/BreadcrumbSeperator/BreadcrumbSeperator.js';
+import '../icons/Calender/Calender.js';
+import Caret from '../icons/Caret/Caret.js';
+import '../icons/CheckboxIcon/CheckboxIcon.js';
+import '../icons/Chevron/Chevron.js';
+import '../icons/ColumnFilter/ColumnFilter.js';
+import '../icons/Columns/Columns.js';
+import '../icons/Copy/Copy.js';
+import '../icons/Cross/Cross.js';
+import '../icons/Delete/Delete.js';
+import '../icons/Download/Download.js';
+import '../icons/Dropdown/DropdownIcon.js';
+import '../icons/Edit/Edit.js';
+import ExpandArrowAlt from '../icons/ExpandArrowAlt/ExpandArrowAlt.js';
+import '../icons/Filter/Filter.js';
+import '../icons/FlowChart/FlowChart.js';
+import '../icons/fullScreen/FullScreen.js';
+import '../icons/HalfShade/HalfShade.js';
+import '../icons/Home/Home.js';
+import '../icons/MagnifyingGlass/MagnifyingGlass.js';
+import '../icons/Nut/Nut.js';
+import '../icons/Plus/Plus.js';
+import '../icons/RadioIcon/RadioIcon.js';
+import '../icons/Refresh/Refresh.js';
+import '../icons/Reset/Reset.js';
+import '../icons/Server/Server.js';
+import '../icons/Tick/Tick.js';
+import '../icons/View/View.js';
+import modules_8207625f from './Accordion.module.css.js';
+import { exports as propTypesExports } from '../../../_virtual/index.js';
+
+var Accordion = function Accordion(props) {
+  var open = props.open,
+    onToggle = props.onToggle,
+    defaultOpen = props.defaultOpen,
+    _props$leftComponent = props.leftComponent,
+    LeftComponent = _props$leftComponent === void 0 ? Caret : _props$leftComponent,
+    RightComponent = props.rightComponent,
+    title = props.title,
+    description = props.description,
+    children = props.children,
+    _props$onClick = props.onClick,
+    _onClick = _props$onClick === void 0 ? function () {} : _props$onClick,
+    _props$className = props.className,
+    className = _props$className === void 0 ? '' : _props$className,
+    onExpand = props.onExpand;
+  var _useState = useState(defaultOpen),
+    _useState2 = _slicedToArray(_useState, 2),
+    uncontrolledOpen = _useState2[0],
+    setUncontrolledOpen = _useState2[1];
+  var _useRef = useRef(open !== undefined),
+    isControlled = _useRef.current;
+  var isOpen = isControlled ? open : uncontrolledOpen;
+  return /*#__PURE__*/jsxs("div", {
+    className: classes(modules_8207625f.root, isOpen ? modules_8207625f.open : '', className),
+    "data-state-open": isOpen,
+    children: [/*#__PURE__*/jsx(BaseCell, {
+      flexible: true,
+      size: "auto",
+      rootDOM: "button",
+      className: modules_8207625f.header,
+      attrs: {
+        onClick: function onClick() {
+          if (isControlled) {
+            onToggle(open);
+          } else {
+            setUncontrolledOpen(function (prevState) {
+              var newState = !prevState;
+              _onClick(newState);
+              return newState;
+            });
+          }
+        }
+      },
+      component1: LeftComponent && /*#__PURE__*/jsx(LeftComponent, {
+        className: modules_8207625f.icon
+      }),
+      component2: /*#__PURE__*/jsx("span", {
+        className: modules_8207625f.title,
+        children: title
+      }),
+      component3: RightComponent && /*#__PURE__*/jsx(RightComponent, {
+        className: modules_8207625f.icon
+      })
+    }), isOpen && /*#__PURE__*/jsxs(motion.div, {
+      initial: {
+        opacity: 0
+      },
+      animate: {
+        opacity: 1
+      },
+      transition: {
+        duration: 0.2
+      },
+      "data-elem": "body",
+      className: modules_8207625f.body,
+      children: [description && /*#__PURE__*/jsx("p", {
+        children: description
+      }), children, onExpand && /*#__PURE__*/jsx(Button, {
+        size: "auto",
+        variant: "text",
+        onClick: function onClick() {
+          onExpand();
+        },
+        rightComponent: function rightComponent() {
+          return /*#__PURE__*/jsx(ExpandArrowAlt, {
+            className: modules_8207625f.expand
+          });
+        }
+      })]
+    }, title + description)]
+  });
+};
+Accordion.propTypes = {
+  open: propTypesExports.bool,
+  onToggle: propTypesExports.func,
+  leftComponent: propTypesExports.node,
+  rightComponent: propTypesExports.node,
+  title: propTypesExports.node,
+  description: propTypesExports.string,
+  defaultOpen: propTypesExports.bool,
+  onClick: propTypesExports.func,
+  className: propTypesExports.string,
+  onExpand: propTypesExports.func
+};
+
+export { Accordion as default };
+//# sourceMappingURL=Accordion.js.map

package/dist/esm/src/components/accordion/Accordion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.js","sources":["../../../../../src/components/accordion/Accordion.jsx"],"sourcesContent":["import { motion } from 'framer-motion';\nimport PropTypes from 'prop-types';\nimport { useRef, useState } from 'react';\nimport { classes } from '../../utils/utils';\nimport { Button } from '../buttons';\nimport { BaseCell } from '../cell';\nimport { CaretIcon, ExpandArrowAltIcon } from '../icons';\nimport styles from './Accordion.module.css';\n\nconst Accordion = (props) => {\n\tconst {\n\t\topen,\n\t\tonToggle,\n\t\tdefaultOpen,\n\t\tleftComponent: LeftComponent = CaretIcon,\n\t\trightComponent: RightComponent,\n\t\ttitle,\n\t\tdescription,\n\t\tchildren,\n\t\tonClick = () => {},\n\t\tclassName = '',\n\t\tonExpand,\n\t} = props;\n\n\tconst [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);\n\n\tconst { current: isControlled } = useRef(open !== undefined);\n\n\tconst isOpen = isControlled ? open : uncontrolledOpen;\n\n\treturn (\n\t\t<div\n\t\t\tclassName={classes(styles.root, isOpen ? styles.open : '', className)}\n\t\t\tdata-state-open={isOpen}>\n\t\t\t<BaseCell\n\t\t\t\tflexible\n\t\t\t\tsize='auto'\n\t\t\t\trootDOM='button'\n\t\t\t\tclassName={styles.header}\n\t\t\t\tattrs={{\n\t\t\t\t\tonClick: () => {\n\t\t\t\t\t\tif (isControlled) {\n\t\t\t\t\t\t\tonToggle(open);\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tsetUncontrolledOpen((prevState) => {\n\t\t\t\t\t\t\t\tconst newState = !prevState;\n\t\t\t\t\t\t\t\tonClick(newState);\n\t\t\t\t\t\t\t\treturn newState;\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t}\n\t\t\t\t\t},\n\t\t\t\t}}\n\t\t\t\tcomponent1={LeftComponent && <LeftComponent className={styles.icon} />}\n\t\t\t\tcomponent2={<span className={styles.title}>{title}</span>}\n\t\t\t\tcomponent3={RightComponent && <RightComponent className={styles.icon} />}\n\t\t\t/>\n\n\t\t\t{isOpen && (\n\t\t\t\t<motion.div\n\t\t\t\t\tkey={title + description}\n\t\t\t\t\tinitial={{\n\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t}}\n\t\t\t\t\tanimate={{\n\t\t\t\t\t\topacity: 1,\n\t\t\t\t\t}}\n\t\t\t\t\ttransition={{\n\t\t\t\t\t\tduration: 0.2,\n\t\t\t\t\t}}\n\t\t\t\t\tdata-elem='body'\n\t\t\t\t\tclassName={styles.body}>\n\t\t\t\t\t{description && <p>{description}</p>}\n\t\t\t\t\t{children}\n\t\t\t\t\t{onExpand && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tsize='auto'\n\t\t\t\t\t\t\tvariant='text'\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tonExpand();\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\trightComponent={() => {\n\t\t\t\t\t\t\t\treturn <ExpandArrowAltIcon className={styles.expand} />;\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</motion.div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\nAccordion.propTypes = {\n\topen: PropTypes.bool,\n\tonToggle: PropTypes.func,\n\tleftComponent: PropTypes.node,\n\trightComponent: PropTypes.node,\n\ttitle: PropTypes.node,\n\tdescription: PropTypes.string,\n\tdefaultOpen: PropTypes.bool,\n\tonClick: PropTypes.func,\n\tclassName: PropTypes.string,\n\tonExpand: PropTypes.func,\n};\n\nexport default Accordion;\n"],"names":["Accordion","props","open","onToggle","defaultOpen","_props$leftComponent","leftComponent","LeftComponent","CaretIcon","RightComponent","rightComponent","title","description","children","_props$onClick","onClick","_props$className","className","onExpand","_useState","useState","_useState2","_slicedToArray","uncontrolledOpen","setUncontrolledOpen","_useRef","useRef","undefined","isControlled","current","isOpen","_jsxs","classes","styles","root","_jsx","BaseCell","flexible","size","rootDOM","header","attrs","prevState","newState","component1","icon","component2","component3","motion","div","initial","opacity","animate","transition","duration","body","Button","variant","ExpandArrowAltIcon","expand","propTypes","PropTypes","bool","func","node","string"],"mappings":"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"}