stuff-ui
Version:
This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
1,375 lines (1,227 loc) • 1.7 MB
JavaScript
import * as React from 'react';
import React__default, { useRef, useState, useEffect, useMemo, createRef, useCallback, cloneElement, PureComponent, isValidElement, createElement, Fragment, Component } from 'react';
import capitalize from 'lodash/capitalize';
import Button$1 from '@material-ui/core/Button';
import ToggleButton from '@material-ui/lab/ToggleButton';
import IconButton from '@material-ui/core/IconButton';
import { createMuiTheme, responsiveFontSizes, makeStyles, withStyles, ThemeProvider, MuiThemeProvider } from '@material-ui/core/styles';
import Popper from '@material-ui/core/Popper';
import { makeStyles as makeStyles$1, Box, TextField, InputAdornment as InputAdornment$1 } from '@material-ui/core';
import Paper from '@material-ui/core/Paper';
import List$4 from '@material-ui/core/List';
import ListItem$1 from '@material-ui/core/ListItem';
import ButtonGroup from '@material-ui/core/ButtonGroup';
import Switch from '@material-ui/core/Switch';
import FormControlLabel from '@material-ui/core/FormControlLabel';
import Checkbox from '@material-ui/core/Checkbox';
import Popover from '@material-ui/core/Popover';
import InputAdornment from '@material-ui/core/InputAdornment';
import FormControl from '@material-ui/core/FormControl';
import Input$4 from '@material-ui/core/Input';
import Tabs from '@material-ui/core/Tabs';
import Tab from '@material-ui/core/Tab';
import moment from 'moment';
import InputLabel from '@material-ui/core/InputLabel';
import moment$1 from 'moment-timezone';
import Typography from '@material-ui/core/Typography';
import TextareaAutosize from '@material-ui/core/TextareaAutosize';
import InputMask from 'react-input-mask';
import HeadsetMicOutlinedIcon from '@material-ui/icons/HeadsetMicOutlined';
import find from 'lodash/find';
import ClearIcon from '@material-ui/icons/Clear';
import 'moment-recur';
import _ from 'lodash';
import ToggleButtonGroup from '@material-ui/lab/ToggleButtonGroup';
import ContentEditable from 'react-contenteditable';
import ReactDOMServer from 'react-dom/server';
import { findDOMNode } from 'react-dom';
import debounce from 'lodash/debounce';
import throttle$1 from 'lodash/throttle';
import ReactPlayer from 'react-player';
import Slider from '@material-ui/core/Slider';
import Tooltip from '@material-ui/core/Tooltip';
import isEmpty from 'lodash/isEmpty';
import Dialog from '@material-ui/core/Dialog';
import classnames from 'classnames';
import debounce$1 from 'lodash.debounce';
import PropTypes from 'prop-types';
import Radio from '@material-ui/core/Radio';
import { Document, Page } from 'react-pdf';
import Accordion from '@material-ui/core/Accordion';
import AccordionSummary from '@material-ui/core/AccordionSummary';
import AccordionDetails from '@material-ui/core/AccordionDetails';
import Box$1 from '@material-ui/core/Box';
import copy from 'copy-to-clipboard';
import MenuList from '@material-ui/core/MenuList';
import MenuItem from '@material-ui/core/MenuItem';
import ListItemIcon from '@material-ui/core/ListItemIcon';
import CloseIcon$1 from '@material-ui/icons/Close';
import CallIcon from '@material-ui/icons/Call';
import AudioPlayer from 'material-ui-audio-player';
import PlayCircleOutlineIcon from '@material-ui/icons/PlayCircleOutline';
import PauseCircleOutlineIcon from '@material-ui/icons/PauseCircleOutline';
import CircularProgress from '@material-ui/core/CircularProgress';
function ownKeys$9(object, enumerableOnly) {
var keys = Object.keys(object);
if (Object.getOwnPropertySymbols) {
var symbols = Object.getOwnPropertySymbols(object);
enumerableOnly && (symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
})), keys.push.apply(keys, symbols);
}
return keys;
}
function _objectSpread2(target) {
for (var i = 1; i < arguments.length; i++) {
var source = null != arguments[i] ? arguments[i] : {};
i % 2 ? ownKeys$9(Object(source), !0).forEach(function (key) {
_defineProperty$a(target, key, source[key]);
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$9(Object(source)).forEach(function (key) {
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
});
}
return target;
}
function _regeneratorRuntime() {
/*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */
_regeneratorRuntime = function () {
return exports;
};
var exports = {},
Op = Object.prototype,
hasOwn = Op.hasOwnProperty,
$Symbol = "function" == typeof Symbol ? Symbol : {},
iteratorSymbol = $Symbol.iterator || "@@iterator",
asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator",
toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag";
function define(obj, key, value) {
return Object.defineProperty(obj, key, {
value: value,
enumerable: !0,
configurable: !0,
writable: !0
}), obj[key];
}
try {
define({}, "");
} catch (err) {
define = function (obj, key, value) {
return obj[key] = value;
};
}
function wrap(innerFn, outerFn, self, tryLocsList) {
var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator,
generator = Object.create(protoGenerator.prototype),
context = new Context(tryLocsList || []);
return generator._invoke = function (innerFn, self, context) {
var state = "suspendedStart";
return function (method, arg) {
if ("executing" === state) throw new Error("Generator is already running");
if ("completed" === state) {
if ("throw" === method) throw arg;
return doneResult();
}
for (context.method = method, context.arg = arg;;) {
var delegate = context.delegate;
if (delegate) {
var delegateResult = maybeInvokeDelegate(delegate, context);
if (delegateResult) {
if (delegateResult === ContinueSentinel) continue;
return delegateResult;
}
}
if ("next" === context.method) context.sent = context._sent = context.arg;else if ("throw" === context.method) {
if ("suspendedStart" === state) throw state = "completed", context.arg;
context.dispatchException(context.arg);
} else "return" === context.method && context.abrupt("return", context.arg);
state = "executing";
var record = tryCatch(innerFn, self, context);
if ("normal" === record.type) {
if (state = context.done ? "completed" : "suspendedYield", record.arg === ContinueSentinel) continue;
return {
value: record.arg,
done: context.done
};
}
"throw" === record.type && (state = "completed", context.method = "throw", context.arg = record.arg);
}
};
}(innerFn, self, context), generator;
}
function tryCatch(fn, obj, arg) {
try {
return {
type: "normal",
arg: fn.call(obj, arg)
};
} catch (err) {
return {
type: "throw",
arg: err
};
}
}
exports.wrap = wrap;
var ContinueSentinel = {};
function Generator() {}
function GeneratorFunction() {}
function GeneratorFunctionPrototype() {}
var IteratorPrototype = {};
define(IteratorPrototype, iteratorSymbol, function () {
return this;
});
var getProto = Object.getPrototypeOf,
NativeIteratorPrototype = getProto && getProto(getProto(values([])));
NativeIteratorPrototype && NativeIteratorPrototype !== Op && hasOwn.call(NativeIteratorPrototype, iteratorSymbol) && (IteratorPrototype = NativeIteratorPrototype);
var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(IteratorPrototype);
function defineIteratorMethods(prototype) {
["next", "throw", "return"].forEach(function (method) {
define(prototype, method, function (arg) {
return this._invoke(method, arg);
});
});
}
function AsyncIterator(generator, PromiseImpl) {
function invoke(method, arg, resolve, reject) {
var record = tryCatch(generator[method], generator, arg);
if ("throw" !== record.type) {
var result = record.arg,
value = result.value;
return value && "object" == typeof value && hasOwn.call(value, "__await") ? PromiseImpl.resolve(value.__await).then(function (value) {
invoke("next", value, resolve, reject);
}, function (err) {
invoke("throw", err, resolve, reject);
}) : PromiseImpl.resolve(value).then(function (unwrapped) {
result.value = unwrapped, resolve(result);
}, function (error) {
return invoke("throw", error, resolve, reject);
});
}
reject(record.arg);
}
var previousPromise;
this._invoke = function (method, arg) {
function callInvokeWithMethodAndArg() {
return new PromiseImpl(function (resolve, reject) {
invoke(method, arg, resolve, reject);
});
}
return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg();
};
}
function maybeInvokeDelegate(delegate, context) {
var method = delegate.iterator[context.method];
if (undefined === method) {
if (context.delegate = null, "throw" === context.method) {
if (delegate.iterator.return && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method)) return ContinueSentinel;
context.method = "throw", context.arg = new TypeError("The iterator does not provide a 'throw' method");
}
return ContinueSentinel;
}
var record = tryCatch(method, delegate.iterator, context.arg);
if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel;
var info = record.arg;
return info ? info.done ? (context[delegate.resultName] = info.value, context.next = delegate.nextLoc, "return" !== context.method && (context.method = "next", context.arg = undefined), context.delegate = null, ContinueSentinel) : info : (context.method = "throw", context.arg = new TypeError("iterator result is not an object"), context.delegate = null, ContinueSentinel);
}
function pushTryEntry(locs) {
var entry = {
tryLoc: locs[0]
};
1 in locs && (entry.catchLoc = locs[1]), 2 in locs && (entry.finallyLoc = locs[2], entry.afterLoc = locs[3]), this.tryEntries.push(entry);
}
function resetTryEntry(entry) {
var record = entry.completion || {};
record.type = "normal", delete record.arg, entry.completion = record;
}
function Context(tryLocsList) {
this.tryEntries = [{
tryLoc: "root"
}], tryLocsList.forEach(pushTryEntry, this), this.reset(!0);
}
function values(iterable) {
if (iterable) {
var iteratorMethod = iterable[iteratorSymbol];
if (iteratorMethod) return iteratorMethod.call(iterable);
if ("function" == typeof iterable.next) return iterable;
if (!isNaN(iterable.length)) {
var i = -1,
next = function next() {
for (; ++i < iterable.length;) if (hasOwn.call(iterable, i)) return next.value = iterable[i], next.done = !1, next;
return next.value = undefined, next.done = !0, next;
};
return next.next = next;
}
}
return {
next: doneResult
};
}
function doneResult() {
return {
value: undefined,
done: !0
};
}
return GeneratorFunction.prototype = GeneratorFunctionPrototype, define(Gp, "constructor", GeneratorFunctionPrototype), define(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"), exports.isGeneratorFunction = function (genFun) {
var ctor = "function" == typeof genFun && genFun.constructor;
return !!ctor && (ctor === GeneratorFunction || "GeneratorFunction" === (ctor.displayName || ctor.name));
}, exports.mark = function (genFun) {
return Object.setPrototypeOf ? Object.setPrototypeOf(genFun, GeneratorFunctionPrototype) : (genFun.__proto__ = GeneratorFunctionPrototype, define(genFun, toStringTagSymbol, "GeneratorFunction")), genFun.prototype = Object.create(Gp), genFun;
}, exports.awrap = function (arg) {
return {
__await: arg
};
}, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, asyncIteratorSymbol, function () {
return this;
}), exports.AsyncIterator = AsyncIterator, exports.async = function (innerFn, outerFn, self, tryLocsList, PromiseImpl) {
void 0 === PromiseImpl && (PromiseImpl = Promise);
var iter = new AsyncIterator(wrap(innerFn, outerFn, self, tryLocsList), PromiseImpl);
return exports.isGeneratorFunction(outerFn) ? iter : iter.next().then(function (result) {
return result.done ? result.value : iter.next();
});
}, defineIteratorMethods(Gp), define(Gp, toStringTagSymbol, "Generator"), define(Gp, iteratorSymbol, function () {
return this;
}), define(Gp, "toString", function () {
return "[object Generator]";
}), exports.keys = function (object) {
var keys = [];
for (var key in object) keys.push(key);
return keys.reverse(), function next() {
for (; keys.length;) {
var key = keys.pop();
if (key in object) return next.value = key, next.done = !1, next;
}
return next.done = !0, next;
};
}, exports.values = values, Context.prototype = {
constructor: Context,
reset: function (skipTempReset) {
if (this.prev = 0, this.next = 0, this.sent = this._sent = undefined, this.done = !1, this.delegate = null, this.method = "next", this.arg = undefined, this.tryEntries.forEach(resetTryEntry), !skipTempReset) for (var name in this) "t" === name.charAt(0) && hasOwn.call(this, name) && !isNaN(+name.slice(1)) && (this[name] = undefined);
},
stop: function () {
this.done = !0;
var rootRecord = this.tryEntries[0].completion;
if ("throw" === rootRecord.type) throw rootRecord.arg;
return this.rval;
},
dispatchException: function (exception) {
if (this.done) throw exception;
var context = this;
function handle(loc, caught) {
return record.type = "throw", record.arg = exception, context.next = loc, caught && (context.method = "next", context.arg = undefined), !!caught;
}
for (var i = this.tryEntries.length - 1; i >= 0; --i) {
var entry = this.tryEntries[i],
record = entry.completion;
if ("root" === entry.tryLoc) return handle("end");
if (entry.tryLoc <= this.prev) {
var hasCatch = hasOwn.call(entry, "catchLoc"),
hasFinally = hasOwn.call(entry, "finallyLoc");
if (hasCatch && hasFinally) {
if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0);
if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc);
} else if (hasCatch) {
if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0);
} else {
if (!hasFinally) throw new Error("try statement without catch or finally");
if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc);
}
}
}
},
abrupt: function (type, arg) {
for (var i = this.tryEntries.length - 1; i >= 0; --i) {
var entry = this.tryEntries[i];
if (entry.tryLoc <= this.prev && hasOwn.call(entry, "finallyLoc") && this.prev < entry.finallyLoc) {
var finallyEntry = entry;
break;
}
}
finallyEntry && ("break" === type || "continue" === type) && finallyEntry.tryLoc <= arg && arg <= finallyEntry.finallyLoc && (finallyEntry = null);
var record = finallyEntry ? finallyEntry.completion : {};
return record.type = type, record.arg = arg, finallyEntry ? (this.method = "next", this.next = finallyEntry.finallyLoc, ContinueSentinel) : this.complete(record);
},
complete: function (record, afterLoc) {
if ("throw" === record.type) throw record.arg;
return "break" === record.type || "continue" === record.type ? this.next = record.arg : "return" === record.type ? (this.rval = this.arg = record.arg, this.method = "return", this.next = "end") : "normal" === record.type && afterLoc && (this.next = afterLoc), ContinueSentinel;
},
finish: function (finallyLoc) {
for (var i = this.tryEntries.length - 1; i >= 0; --i) {
var entry = this.tryEntries[i];
if (entry.finallyLoc === finallyLoc) return this.complete(entry.completion, entry.afterLoc), resetTryEntry(entry), ContinueSentinel;
}
},
catch: function (tryLoc) {
for (var i = this.tryEntries.length - 1; i >= 0; --i) {
var entry = this.tryEntries[i];
if (entry.tryLoc === tryLoc) {
var record = entry.completion;
if ("throw" === record.type) {
var thrown = record.arg;
resetTryEntry(entry);
}
return thrown;
}
}
throw new Error("illegal catch attempt");
},
delegateYield: function (iterable, resultName, nextLoc) {
return this.delegate = {
iterator: values(iterable),
resultName: resultName,
nextLoc: nextLoc
}, "next" === this.method && (this.arg = undefined), ContinueSentinel;
}
}, exports;
}
function _typeof$6(obj) {
"@babel/helpers - typeof";
return _typeof$6 = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
return typeof obj;
} : function (obj) {
return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
}, _typeof$6(obj);
}
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
try {
var info = gen[key](arg);
var value = info.value;
} catch (error) {
reject(error);
return;
}
if (info.done) {
resolve(value);
} else {
Promise.resolve(value).then(_next, _throw);
}
}
function _asyncToGenerator(fn) {
return function () {
var self = this,
args = arguments;
return new Promise(function (resolve, reject) {
var gen = fn.apply(self, args);
function _next(value) {
asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
}
function _throw(err) {
asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
}
_next(undefined);
});
};
}
function _defineProperty$a(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
}
function _extends$f() {
_extends$f = Object.assign ? Object.assign.bind() : function (target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i];
for (var key in source) {
if (Object.prototype.hasOwnProperty.call(source, key)) {
target[key] = source[key];
}
}
}
return target;
};
return _extends$f.apply(this, arguments);
}
function _objectWithoutPropertiesLoose$c(source, excluded) {
if (source == null) return {};
var target = {};
var sourceKeys = Object.keys(source);
var key, i;
for (i = 0; i < sourceKeys.length; i++) {
key = sourceKeys[i];
if (excluded.indexOf(key) >= 0) continue;
target[key] = source[key];
}
return target;
}
function _objectWithoutProperties$c(source, excluded) {
if (source == null) return {};
var target = _objectWithoutPropertiesLoose$c(source, excluded);
var key, i;
if (Object.getOwnPropertySymbols) {
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
for (i = 0; i < sourceSymbolKeys.length; i++) {
key = sourceSymbolKeys[i];
if (excluded.indexOf(key) >= 0) continue;
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
target[key] = source[key];
}
}
return target;
}
function _slicedToArray$6(arr, i) {
return _arrayWithHoles$6(arr) || _iterableToArrayLimit$6(arr, i) || _unsupportedIterableToArray$j(arr, i) || _nonIterableRest$6();
}
function _toArray(arr) {
return _arrayWithHoles$6(arr) || _iterableToArray(arr) || _unsupportedIterableToArray$j(arr) || _nonIterableRest$6();
}
function _toConsumableArray(arr) {
return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray$j(arr) || _nonIterableSpread();
}
function _arrayWithoutHoles(arr) {
if (Array.isArray(arr)) return _arrayLikeToArray$j(arr);
}
function _arrayWithHoles$6(arr) {
if (Array.isArray(arr)) return arr;
}
function _iterableToArray(iter) {
if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
}
function _iterableToArrayLimit$6(arr, i) {
var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
if (_i == null) return;
var _arr = [];
var _n = true;
var _d = false;
var _s, _e;
try {
for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
_arr.push(_s.value);
if (i && _arr.length === i) break;
}
} catch (err) {
_d = true;
_e = err;
} finally {
try {
if (!_n && _i["return"] != null) _i["return"]();
} finally {
if (_d) throw _e;
}
}
return _arr;
}
function _unsupportedIterableToArray$j(o, minLen) {
if (!o) return;
if (typeof o === "string") return _arrayLikeToArray$j(o, minLen);
var n = Object.prototype.toString.call(o).slice(8, -1);
if (n === "Object" && o.constructor) n = o.constructor.name;
if (n === "Map" || n === "Set") return Array.from(o);
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$j(o, minLen);
}
function _arrayLikeToArray$j(arr, len) {
if (len == null || len > arr.length) len = arr.length;
for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
return arr2;
}
function _nonIterableSpread() {
throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}
function _nonIterableRest$6() {
throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}
function styleInject(css, ref) {
if ( ref === void 0 ) ref = {};
var insertAt = ref.insertAt;
if (!css || typeof document === 'undefined') { return; }
var head = document.head || document.getElementsByTagName('head')[0];
var style = document.createElement('style');
style.type = 'text/css';
if (insertAt === 'top') {
if (head.firstChild) {
head.insertBefore(style, head.firstChild);
} else {
head.appendChild(style);
}
} else {
head.appendChild(style);
}
if (style.styleSheet) {
style.styleSheet.cssText = css;
} else {
style.appendChild(document.createTextNode(css));
}
}
var css_248z = "/* colors */\n/* shadows */\n/* typography */\n/* font size */\n/* font weight */\n/* line height */\n\n/* colors */\n/* shadows */\n/* typography */\n/* font size */\n/* font weight */\n/* line height */";
var css = {"colorWhite":"#ffffff","colorWhiteOpacity":"rgba(255, 255, 255, 0.9)","colorBlack":"#000","colorBlackOpacity":"rgba(0, 0, 0, 0.4)","colorBlackOverlayOpacity":"rgba(0, 0, 0, 0.3)","colorTurquoise":"#3ebfcf","colorDarkTurquoise":"#119cad","colorLightTurquoise":"#cceaef","colorGray1":"#f7f7f7","colorGray2":"#c2c2c2","colorGray3":"#999999","colorGray4":"#e7e7e7","colorGray5":"#f6f6f6","colorGray6":"#ededed","colorGray7":"#e8e8e8","colorGray8":"#2f2f3e","colorGray9":"#f1f1f1","colorGray10":"#757575","colorGrayLighter":"#eaecec","colorGrayDark":"#2f2f3e","colorGrayDark2":"#0a0a0a","colorRed":"#eb6464","colorRed2":"#ef6c6c","colorYellow":"#fdc468","colorLightYellow":"#fdd368","colorGreen":"#92df46","neutral_100":"#0A0A0A","neutral_90":"#424242","neutral_80":"#616161","neutral_70":"#757575","neutral_60":"#9E9E9E","neutral_50":"#C2C2C2","neutral_40":"#E0E0E0","neutral_30":"#EDEDED","neutral_20":"#F5F5F5","neutral_10":"#FFFFFF","primaryMain":"#3EBFCF","primaryBg":"#EAFFFF","primaryBorder":"#B6E8EE","primaryHover":"#33A5B2","primaryPressed":"#267781","primaryFocus":"#C9E6EA","alternativeMain":"#BB4FD6","alternativeBg":"#FDF5FF","alternativeBorder":"#DDA7EA","alternativeHover":"#9C42B2","alternativePressed":"#5B116D","alternativeFocus":"#F7D9FF","successMain":"#3DCEAB","successBg":"#E7FAF5","successBorder":"#9EE6D5","successHover":"#2D967D","successPressed":"#1D6352","successFocus":"#C8EBE2","warningMain":"#DBC92B","warningBg":"#FEFADC","warningBorder":"#F5EFB9","warningHover":"#BBAC25","warningPressed":"#95891D","warningFocus":"#FDF8CF","dangerMain":"#C20114","dangerBg":"#FFE8E8","dangerBorder":"#E2B6B6","dangerHover":"#A20111","dangerPressed":"#6C0D16","dangerFocus":"#FFDFDF","infoMain":"#0023DD","infoBg":"#EBEEFF","infoBorder":"#AAB6F4","infoHover":"#001DB8","infoPressed":"#001793","infoFocus":"#E2E7FF","themeShadowsMain":"0 2px 81px 0 rgba(39, 39, 39, 0.15)","themeShadowsSecondary":"0 2px 20px 0 rgba(39, 39, 39, 0.1)","themeFontFamily":"Avenir, Helvetica, Arial","themeFontFamilyL":"Avenir-Light, Helvetica, Arial","themeFontFamilyH":"Avenir-Heavy, Helvetica, Arial","themeFontFamilyB":"Avenir-Book, Helvetica, Arial","themeFontFamilyR":"Avenir-Roman, Helvetica, Arial","fontSizeS":"12px","fontSizeSMD":"9.6px","fontSizeM":"14px","fontSizeMMD":"11.2px","fontSizeLMD":"14.4px","fontSizeL":"18px","fontSizeLM":"16px","fontSizeXL":"20px","fontWeightBook":"400","fontWeightMedium":"500","fontWeightHeavy":"700","lineHeightS":"12.8px","lineHeightM":"15.2px","lineHeightL":"17.6px","colorGray11":"#424242","colorGray12":"#9e9e9e","colorDarkRed":"#c20114"};
styleInject(css_248z);
//don't change "createMuiTheme" to "createTheme" due to it broke UI
var CONSTANTS = {
BUTTON_PADDING: 20,
BUTTON_PADDING_MD: 16,
BUTTON_HEIGHT: 40,
BUTTON_HEIGHT_MD: 24,
TIME_FORMAT: 'hh:mm a',
DFAULT_RADIUS: 6,
BUTTON_WIDTH: 220,
BUTTON_WIDTH_MD: 190,
BUTTON_WIDTH_SM: 90,
LG_BTN: 'L',
MD_BTN: 'M',
SM_BTN: 'S'
};
var COLORS = {
WHITE: css.colorWhite,
WHITE_WITH_OPACITY: css.colorWhiteOpacity,
BLACK: css.colorBlack,
BLACK_WITH_OPACITY: css.colorBlackOpacity,
BLACK_OVERLAY_WITH_OPACITY: css.colorBlackOverlayOpacity,
TURQUOISE: css.colorTurquoise,
DARK_TURQUOISE: css.colorDarkTurquoise,
TURQUOISE_LIGHT: css.colorLightTurquoise,
GRAY1: css.colorGray1,
GRAY2: css.colorGray2,
GRAY3: css.colorGray3,
GRAY4: css.colorGray4,
GRAY5: css.colorGray5,
GRAY6: css.colorGray6,
GRAY7: css.colorGray7,
GRAY8: css.colorGray8,
GRAY9: css.colorGray9,
GRAY10: css.colorGray10,
GRAY11: css.colorGray11,
GRAY12: css.colorGray12,
GRAY_LIGHTER: css.colorGrayLighter,
GRAY_DARK: css.colorGrayDark,
GRAY_DARK2: css.colorGrayDark2,
RED: css.colorRed,
RED2: css.colorRed2,
YELLOW: css.colorYellow,
LIGHT_YELLOW: css.colorLightYellow,
GREEN: css.colorGreen,
DARK_RED: css.colorDarkRed,
/* new colors system */
// Neutral Color
NEUTRAL_100: css.neutral_100,
NEUTRAL_90: css.neutral_90,
NEUTRAL_80: css.neutral_80,
NEUTRAL_70: css.neutral_70,
NEUTRAL_60: css.neutral_60,
NEUTRAL_50: css.neutral_50,
NEUTRAL_40: css.neutral_40,
NEUTRAL_30: css.neutral_30,
NEUTRAL_20: css.neutral_20,
NEUTRAL_10: css.neutral_10,
// Primary Color
PRIMARYMAIN: css.primaryMain,
PRIMARYBG: css.primaryBg,
PRIMARYBORDER: css.primaryBorder,
PRIMARYHOVER: css.primaryHover,
PRIMARYPRESSED: css.primaryPressed,
PRIMARYFOCUS: css.primaryFocus,
// Alternative Color
ALTERNATIVEMAIN: css.alternativeMain,
ALTERNATIVEBG: css.alternativeBg,
ALTERNATIVEBORDER: css.alternativeBorder,
ALTERNATIVEHOVER: css.alternativeHover,
ALTERNATIVEPRESSED: css.alternativePressed,
ALTERNATIVEFOCUS: css.alternativeFocus,
// Success Color
SUCCESSMAIN: css.successMain,
SUCCESSBG: css.successBg,
SUCCESSBORDER: css.successBorder,
SUCCESSHOVER: css.successHover,
SUCCESSPRESSED: css.successPressed,
SUCCESSFOCUS: css.successFocus,
// Warning Color
WARNINGMAIN: css.warningMain,
WARNINGBG: css.warningBg,
WARNINGBORDER: css.warningBorder,
WARNINGHOVER: css.warningHover,
WARNINGPRESSED: css.warningPressed,
WARNINGFOCUS: css.warningFocus,
// Danger Color
DANGERMAIN: css.dangerMain,
DANGERBG: css.dangerBg,
DANGERBORDER: css.dangerBorder,
DANGERHOVER: css.dangerHover,
DANGERPRESSED: css.dangerPressed,
DANGERFOCUS: css.dangerFocus,
// Info Color
INFOMAIN: css.infoMain,
INFOBG: css.infoBg,
INFOBORDER: css.infoBorder,
INFOHOVER: css.infoHover,
INFOPRESSED: css.infoPressed,
INFOFOCUS: css.infoFocus
}; //don't change "createMuiTheme" to "createTheme" due to it broke UI
var StuffTheme$1 = createMuiTheme({
palette: {
white: COLORS.WHITE,
whiteOpacity: COLORS.WHITE_WITH_OPACITY,
black: COLORS.BLACK,
blackOpacity: COLORS.BLACK_WITH_OPACITY,
blackOverlayOpacity: COLORS.BLACK_OVERLAY_WITH_OPACITY,
turquoise: COLORS.TURQUOISE,
darkTurquoise: COLORS.DARK_TURQUOISE,
lightTurquoise: COLORS.TURQUOISE_LIGHT,
gray1: COLORS.GRAY1,
gray2: COLORS.GRAY2,
gray3: COLORS.GRAY3,
gray4: COLORS.GRAY4,
gray5: COLORS.GRAY5,
gray6: COLORS.GRAY6,
gray7: COLORS.GRAY7,
gray8: COLORS.GRAY8,
gray9: COLORS.GRAY9,
gray10: COLORS.GRAY10,
gray11: COLORS.GRAY11,
gray12: COLORS.GRAY12,
grayLighter: COLORS.GRAY_LIGHTER,
grayDark: COLORS.GRAY_DARK,
grayDark2: COLORS.GRAY_DARK2,
red: COLORS.RED,
red2: COLORS.RED2,
yellow: COLORS.YELLOW,
lightYellow: COLORS.LIGHT_YELLOW,
primary: {
main: '#3ebfcf'
},
green: COLORS.GREEN,
darkRed: COLORS.DARK_RED
},
themeShadows: {
main: css.themeShadowsMain,
secondary: css.themeShadowsSecondary
},
typography: {
fontFamily: css.themeFontFamily,
fontFamilyH: css.themeFontFamilyH,
fontFamilyB: css.themeFontFamilyB,
fontFamilyR: css.themeFontFamilyR,
lineHeight: 1.65,
themeFontSize: {
s: css.fontSizeS,
sMD: css.fontSizeSMD,
m: css.fontSizeM,
mMD: css.fontSizeMMD,
l: css.fontSizeL,
lMD: css.fontSizeLMD,
lM: css.fontSizeLM
},
themeFontWeight: {
book: css.fontWeightBook,
medium: css.fontWeightMedium,
heavy: css.fontWeightHeavy
},
themeLineHeight: {
s: css.lineHeightS,
sMD: css.lineHeightSMD,
m: css.lineHeightM,
mMD: css.lineHeightMMD,
l: css.lineHeightL,
lMD: css.lineHeightLMD
},
hoveredMedium: {
'-webkit-text-stroke-width': '0.5px',
'-webkit-text-stroke-color': 'currentColor'
},
input: {
label: {
fontSize: 14
},
input: {
fontSize: 17
}
},
button: {
fontFamily: ['Avenir', 'Helvetica', 'Arial'].join(','),
textTransform: 'none',
fontSize: 17
}
}
});
StuffTheme$1 = responsiveFontSizes(StuffTheme$1);
var STTheme = StuffTheme$1;
var arrayToString = function arrayToString(array) {
return array.reduce(function (acc, current, i, arr) {
return acc + (current.label ? current.label : current) + (arr.length - 1 === i ? ' ' : ', ');
}, '');
};
var getPreviousSibling = function getPreviousSibling(elem, selector) {
// Get the next sibling element
var sibling = elem.previousElementSibling; // If there's no selector, return the first sibling
if (!selector) return sibling; // If the sibling matches our selector, use it
// If not, jump to the next sibling and continue the loop
while (sibling) {
if (sibling.matches(selector)) return sibling;
sibling = sibling.previousElementSibling;
}
};
var StuffTheme = STTheme;
function r(e){var t,f,n="";if("string"==typeof e||"number"==typeof e)n+=e;else if("object"==typeof e)if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=" "),n+=f);else for(t in e)e[t]&&(n&&(n+=" "),n+=t);return n}function clsx(){for(var e,t,f=0,n="";f<arguments.length;)(e=arguments[f++])&&(t=r(e))&&(n&&(n+=" "),n+=t);return n}
var useStyles$1l = makeStyles(function (theme) {
return {
wrapper: {
position: function position(_ref) {
var open = _ref.open;
return open ? 'fixed' : 'static';
},
zIndex: 1000,
inset: '0px'
},
container: {
position: 'relative',
display: 'inline-flex',
flexDirection: 'column',
alignItems: 'center',
boxSizing: 'border-box',
background: StuffTheme.palette.white,
boxShadow: "0 2px 10px 0 rgba(173, 173, 173, 0.25)",
borderRadius: 6,
padding: '20px',
maxWidth: function maxWidth(_ref2) {
var width = _ref2.width;
return width ? width : 280;
},
width: '100%',
zIndex: 1
},
withPolygon: {
'&[x-placement=left-start]': {
'&::before': {
top: 15,
right: -6,
left: 'auto',
transform: 'rotate(225deg)'
}
},
'&[x-placement=bottom]': {
'&::before': {
top: -5,
left: 15,
transform: 'rotate(135deg)'
}
},
'&[x-placement=bottom-start]': {
'&::before': {
top: -5,
left: 15,
transform: 'rotate(135deg)'
}
},
'&::before': {
position: 'absolute',
top: 15,
left: -6,
content: '""',
display: 'block',
background: StuffTheme.palette.turquoise,
backgroundColor: StuffTheme.palette.white,
border: 'inherit',
clipPath: 'polygon(0% 0%, 100% 100%, 0% 100%)',
boxShadow: '0px -5px 7px rgba(0,0,0,.1)',
transform: 'rotate(45deg)',
borderRadius: '0 0 0 2.5px',
height: 14,
width: 14
}
},
dialogsPopover: {
zIndex: 1301
},
text: {
fontFamily: StuffTheme.typography.fontFamily,
fontWeight: StuffTheme.typography.themeFontWeight.medium,
color: StuffTheme.palette.grayDark,
fontSize: StuffTheme.typography.themeFontSize.s,
lineHeight: "normal"
},
buttonLabel: {
width: '100%',
textAlign: 'right',
color: StuffTheme.palette.turquoise,
fontWeight: StuffTheme.typography.themeFontWeight.heavy,
fontFamily: StuffTheme.typography.fontFamilyH,
marginTop: 16,
'&:hover': {
cursor: 'pointer'
}
},
footer: {
display: 'flex',
justifyContent: 'space-between',
alignItems: 'center',
marginTop: 14
},
submitWrapper: {
marginLeft: 'auto'
}
};
});
var Note = function Note(_ref3) {
var _clsx;
var classes = _ref3.classes,
text = _ref3.text,
anchorEl = _ref3.anchorEl,
open = _ref3.open,
_ref3$dialogsPopover = _ref3.dialogsPopover,
dialogsPopover = _ref3$dialogsPopover === void 0 ? true : _ref3$dialogsPopover,
hasButton = _ref3.hasButton,
buttonLabel = _ref3.buttonLabel,
_ref3$setOpen = _ref3.setOpen,
setOpen = _ref3$setOpen === void 0 ? function () {} : _ref3$setOpen,
_ref3$position = _ref3.position,
position = _ref3$position === void 0 ? "bottom" : _ref3$position,
_ref3$onChange = _ref3.onChange,
onChange = _ref3$onChange === void 0 ? function () {} : _ref3$onChange,
_ref3$handleNoteClick = _ref3.handleNoteClicked,
handleNoteClicked = _ref3$handleNoteClick === void 0 ? function () {} : _ref3$handleNoteClick,
_ref3$withPolygon = _ref3.withPolygon,
withPolygon = _ref3$withPolygon === void 0 ? true : _ref3$withPolygon,
_ref3$customStyles = _ref3.customStyles,
customStyles = _ref3$customStyles === void 0 ? {} : _ref3$customStyles;
var popperRef = useRef(null);
var _useState = useState(false),
_useState2 = _slicedToArray$6(_useState, 2),
isOpenedBlock = _useState2[0],
setIsOpenedBlock = _useState2[1];
useEffect(function () {
function handleClickOutside(event) {
var _popperRef$current, _anchorEl$current;
if (!(popperRef !== null && popperRef !== void 0 && (_popperRef$current = popperRef.current) !== null && _popperRef$current !== void 0 && _popperRef$current.contains(event.target)) && !(anchorEl !== null && anchorEl !== void 0 && (_anchorEl$current = anchorEl.current) !== null && _anchorEl$current !== void 0 && _anchorEl$current.contains(event.target))) {
setOpen(false);
}
}
document.addEventListener("mousedown", handleClickOutside);
return function () {
document.removeEventListener("mousedown", handleClickOutside);
};
}, [anchorEl]);
var stateClasses = _objectSpread2(_objectSpread2({}, useStyles$1l()), classes);
return /*#__PURE__*/React__default.createElement(Popper, {
ref: popperRef,
open: open && !isOpenedBlock && !!text.length,
anchorEl: anchorEl === null || anchorEl === void 0 ? void 0 : anchorEl.current,
className: clsx(stateClasses.container, (_clsx = {}, _defineProperty$a(_clsx, stateClasses.dialogsPopover, dialogsPopover), _defineProperty$a(_clsx, stateClasses.withPolygon, withPolygon), _clsx)),
style: customStyles,
placement: position,
modifiers: {
offset: {
enabled: true,
offset: "0,8"
}
},
disablePortal: false
}, /*#__PURE__*/React__default.createElement("span", {
className: stateClasses.text
}, text), hasButton && /*#__PURE__*/React__default.createElement("span", {
className: "".concat(stateClasses.text, " ").concat(stateClasses.buttonLabel),
onClick: function onClick() {
onChange(true);
handleNoteClicked(true);
setOpen(false);
setIsOpenedBlock(true);
}
}, buttonLabel));
};
Note.defaultProps = {
open: false,
text: '',
classes: {},
onHide: function onHide() {}
};
var getButtonWidth = function getButtonWidth(size) {
switch (size) {
case CONSTANTS.SM_BTN:
return CONSTANTS.BUTTON_WIDTH_SM;
case CONSTANTS.MD_BTN:
return CONSTANTS.BUTTON_WIDTH_MD;
case CONSTANTS.LG_BTN:
default:
return CONSTANTS.BUTTON_WIDTH;
}
};
var useStyles$1k = makeStyles$1(function () {
return {
buttonTextWrapper: {
display: "inline-block",
"&:first-letter": {
textTransform: "capitalize"
},
"& span": {
display: "inline-block",
"&:first-letter": {
textTransform: "capitalize"
}
}
}
};
});
var _excluded$S = ["classes", "checked"],
_excluded2$a = ["classes", "checked"],
_excluded3$4 = ["classes", "checked"],
_excluded4$1 = ["classes", "selected"],
_excluded5$1 = ["classes", "selected", "rootClass"],
_excluded6$1 = ["openNote", "ref", "color", "text", "icon", "toggle", "value", "onChange", "selected", "children", "popover", "logEventName", "handleOpenNote", "handleNoteClicked", "popoverWidth", "dialogsPopover", "dataTestid", "size", "openNoteOnHover"];
var _commonStyles;
var commonStyles = (_commonStyles = {}, _defineProperty$a(_commonStyles, STTheme.breakpoints.between(0, 1441), {
fontSize: STTheme.typography.themeFontSize.m,
paddingRight: CONSTANTS.BUTTON_PADDING_MD,
paddingLeft: CONSTANTS.BUTTON_PADDING_MD,
minWidth: function minWidth(props) {
return props.size === CONSTANTS.SM_BTN ? CONSTANTS.BUTTON_WIDTH_SM : CONSTANTS.BUTTON_WIDTH_MD;
}
}), _defineProperty$a(_commonStyles, STTheme.breakpoints.up(1441), {
fontSize: STTheme.typography.themeFontSize.lM,
paddingRight: CONSTANTS.BUTTON_PADDING,
paddingLeft: CONSTANTS.BUTTON_PADDING,
height: CONSTANTS.BUTTON_HEIGHT,
minWidth: function minWidth(props) {
return getButtonWidth(props.size);
}
}), _defineProperty$a(_commonStyles, "borderRadius", 6), _defineProperty$a(_commonStyles, "boxSizing", "border-box"), _defineProperty$a(_commonStyles, "display", "flex"), _defineProperty$a(_commonStyles, "justifyContent", "center"), _defineProperty$a(_commonStyles, "alignItems", "center"), _defineProperty$a(_commonStyles, "lineHeight", "normal"), _commonStyles);
var STPrimaryButton = withStyles(function (theme) {
return {
root: _objectSpread2(_objectSpread2({}, commonStyles), {}, {
color: STTheme.palette.white,
backgroundColor: STTheme.palette.turquoise,
"&:hover": {
backgroundColor: STTheme.palette.darkTurquoise
},
"&:disabled": {
backgroundColor: STTheme.palette.gray2,
color: STTheme.palette.white
}
})
};
})(function (_ref) {
var classes = _ref.classes;
_ref.checked;
var props = _objectWithoutProperties$c(_ref, _excluded$S);
return /*#__PURE__*/React__default.createElement(Button$1, _extends$f({
classes: _objectSpread2({}, classes)
}, props));
});
var STSecondaryButton = withStyles(function (theme) {
return {
root: _objectSpread2(_objectSpread2({}, commonStyles), {}, {
color: STTheme.palette.grayDark,
border: "solid 1.5px ".concat(STTheme.palette.grayDark),
backgroundColor: "transparent",
transition: "all 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms",
"&:hover": {
border: "solid 1.5px ".concat(STTheme.palette.turquoise),
color: STTheme.palette.turquoise,
backgroundColor: "transparent"
},
"&:disabled": {
backgroundColor: "transparent",
border: "solid 1.5px ".concat(STTheme.palette.gray3),
color: STTheme.palette.white
}
})
};
})(function (_ref2) {
var classes = _ref2.classes;
_ref2.checked;
var props = _objectWithoutProperties$c(_ref2, _excluded2$a);
return /*#__PURE__*/React__default.createElement(Button$1, _extends$f({
classes: _objectSpread2({}, classes)
}, props));
}); //selectable
var STSelectableButton = withStyles(function (theme) {
var _objectSpread2$1;
return {
root: _objectSpread2(_objectSpread2({}, commonStyles), {}, (_objectSpread2$1 = {
color: STTheme.palette.gray3,
backgroundColor: STTheme.palette.white
}, _defineProperty$a(_objectSpread2$1, STTheme.breakpoints.between(0, 1441), {
height: CONSTANTS.BUTTON_HEIGHT_MD
}), _defineProperty$a(_objectSpread2$1, STTheme.breakpoints.up(1441), {
height: CONSTANTS.BUTTON_HEIGHT
}), _defineProperty$a(_objectSpread2$1, "border", "none"), _defineProperty$a(_objectSpread2$1, "&:hover", {
color: STTheme.palette.turquoise,
backgroundColor: STTheme.palette.white
}), _objectSpread2$1)),
selected: {
"&$selected": {
boxShadow: "0 0 20px 0 rgba(0, 0, 0, 0.05)",
color: STTheme.palette.turquoise,
backgroundColor: STTheme.palette.white,
fontWeight: STTheme.typography.themeFontWeight.medium,
"&:hover": {
backgroundColor: STTheme.palette.white
}
}
}
};
})(function (_ref3) {
var classes = _ref3.classes;
_ref3.checked;
var props = _objectWithoutProperties$c(_ref3, _excluded3$4);
return /*#__PURE__*/React__default.createElement(ToggleButton, _extends$f({
classes: _objectSpread2({}, classes)
}, props));
}); //icon
var SimpleIconButton = withStyles(function (theme) {
return {
root: {
color: STTheme.palette.gray3,
"&:hover": {
color: STTheme.palette.turquoise,
background: "transparent"
}
}
};
})(function (_ref4) {
var classes = _ref4.classes;
_ref4.selected;
var props = _objectWithoutProperties$c(_ref4, _excluded4$1);
return /*#__PURE__*/React__default.createElement(IconButton, _extends$f({
classes: _objectSpread2({}, classes)
}, props));
}); // text button
var TextButton = withStyles(function (theme) {
var _root;
return {
root: (_root = {
color: STTheme.palette.gray3,
background: "transparent",
boxShadow: "none",
fontWeight: STTheme.typography.themeFontWeight.book,
display: "flex",
alignItems: "center"
}, _defineProperty$a(_root, STTheme.breakpoints.up(1441), {
fontSize: STTheme.typography.themeFontSize.lM
}), _defineProperty$a(_root, STTheme.breakpoints.between(0, 1441), {
fontSize: STTheme.typography.themeFontSize.m
}), _defineProperty$a(_root, "&:hover", _objectSpread2({
color: STTheme.palette.turquoise,
background: "transparent",
boxShadow: "none"
}, STTheme.typography.hoveredMedium)), _root),
startIcon: {}
};
})(function (_ref5) {
var classes = _ref5.classes;
_ref5.selected;
_ref5.rootClass;
var props = _objectWithoutProperties$c(_ref5, _excluded5$1);
return /*#__PURE__*/React__default.createElement(Button$1, _extends$f({
classes: _objectSpread2({}, classes)
}, props));
});
var STButton = function STButton(_ref6) {
var openNote = _ref6.openNote,
ref = _ref6.ref,
color = _ref6.color,
text = _ref6.text,
icon = _ref6.icon,
_ref6$toggle = _ref6.toggle,
toggle = _ref6$toggle === void 0 ? false : _ref6$toggle,
_ref6$value = _ref6.value,
value = _ref6$value === void 0 ? "checked" : _ref6$value,
_ref6$onChange = _ref6.onChange,
onChange = _ref6$onChange === void 0 ? function () {} : _ref6$onChange,
_ref6$selected = _ref6.selected,
selected = _ref6$selected === void 0 ? false : _ref6$selected,
children = _ref6.children,
_ref6$popover = _ref6.popover,
popover = _ref6$popover === void 0 ? {} : _ref6$popover;
_ref6.logEventName;
var _ref6$handleOpenNote = _ref6.handleOpenNote,
handleOpenNote = _ref6$handleOpenNote === void 0 ? function () {} : _ref6$handleOpenNote,
handleNoteClicked = _ref6.handleNoteClicked,
popoverWidth = _ref6.popoverWidth,
_ref6$dialogsPopover = _ref6.dialogsPopover,
dialogsPopover = _ref6$dialogsPopover === void 0 ? false : _ref6$dialogsPopover,
_ref6$dataTestid = _ref6.dataTestid,
dataTestid = _ref6$dataTestid === void 0 ? null : _ref6$dataTestid,
size = _ref6.size,
_ref6$openNoteOnHover = _ref6.openNoteOnHover,
openNoteOnHover = _ref6$openNoteOnHover === void 0 ? false : _ref6$openNoteOnHover,
rest = _objectWithoutProperties$c(_ref6, _excluded6$1);
var _useState = useState(false),
_useState2 = _slicedToArray$6(_useState, 2),
stateSelected = _useState2[0],
setSelected = _useState2[1];
var _useState3 = useState(false),
_useState4 = _slicedToArray$6(_useState3, 2),
open = _useState4[0],
setOpenNote = _useState4[1];
var capitalizeText = useMemo(function () {
return capitalize(text);
}, [text]);
var buttonSize = useMemo(function () {
if (!size) {
return (capitalizeText === null || capitalizeText === void 0 ? void 0 : capitalizeText.length) > 8 ? CONSTANTS.LG_BTN : CONSTANTS.SM_BTN;
}
return size;
}, [capitalizeText, size]);
var buttonRef = useRef();
useEffect(function () {
if (buttonRef) {
if (openNote) {
setOpenNote(true);
}
}
}, [openNote]);
useEffect(function () {
if (!openNoteOnHover) {
// reset on change hovering condition
setOpenNote(false);
}
}, [openNoteOnHover]);
useEffect(function () {
setSelected(selected);
}, [selected]);
var styleClasses = useStyles$1k();
var changeSelected = function changeSelected() {
setSelected(!stateSelected);
onChange(!stateSelected);
};
var onHideNote = function onHideNote() {
setOpenNote(false);
handleOpenNote(false);
};
var onMouseEnter = function onMouseEnter() {
if (openNoteOnHover) {
setOpenNote(true);
}
};
var onMouseLeave = function onMouseLeave() {
if (openNoteOnHover) {
setOpenNote(false);
}
};
return /*#__PURE__*/React__default.createElement(ThemeProvider, {
theme: STTheme
}, /*#__PURE__*/React__default.createElement("div", {
ref: buttonRef,
style: {
display: "inline-block"
},
"data-testid": dataTestid ? "".concat(dataTestid, "_button-wrapper") : undefined,
onMouseEnter: onMouseEnter,
onMouseLeave: onMouseLeave
}, !icon ? toggle ? /*#__PURE__*/React__default.createElement(STSelectableButton, _extends$f({
variant: "button",
onChange: changeSelected,
value: value,
selected: stateSelected,
"data-testid": dataTestid ? "".concat(dataTestid, "_button-selectable") : undefined
}, rest), /*#__PURE__*/React__default.createElement("span", {
className: styleClasses.buttonTextWrapper
}, children)) : !color || color === "primary" ? /*#__PURE__*/React__default.createElement(STPrimaryButton, _extends$f({
"data-testid": dataTestid ? "".concat(dataTestid, "_button-primary") : undefined,
size: buttonSize
}, rest), /*#__PURE__*/React__default.createElement("span", {
className: styleClasses.buttonTextWrapper
}, children)) : /*#__PURE__*/React__default.createElement(STSecondaryButton, _extends$f({
"data-testid": dataTestid ? "".concat(dataTestid, "_button-secondary") : undefined,
size: buttonSize
}, rest), /*#__PURE__*/React__default.createElement("span", {
className: styleClasses.buttonTextWrapper
}, children)) : icon && capitalizeText ? /*#__PURE__*/React__default.createElement(TextButton, _extends$f({
variant: "contained",
color: "secondary",
startIcon: icon,
"data-testid": dataTestid ? "".concat(d