@ainias42/react-bootstrap-mobile 0.1.17 → 0.1.19

package/dist/bootstrapReactMobile.js

@@ -1,6 +1,6 @@
 /*!
  * 
- *   @ainias42/react-bootstrap-mobile v0.1.16
+ *   @ainias42/react-bootstrap-mobile v0.1.18
  *   git+https://github.com/Ainias/Bootstrap-React-Mobile.git
  *   Copyright (c) Silas Günther and project contributors.
  *   This source code is licensed under the MIT license found in the
@@ -1518,7 +1518,7 @@ var ___CSS_LOADER_API_SOURCEMAP_IMPORT___ = __webpack_require__(7537);
 var ___CSS_LOADER_API_IMPORT___ = __webpack_require__(3645);
 var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_SOURCEMAP_IMPORT___);
 // Module
-___CSS_LOADER_EXPORT___.push([module.id, `.input__sEopK{display:inline-block;width:100%;position:relative;padding-bottom:.1rem}.input__sEopK:focus-within .selectableOptionContainer__kutkQ{display:inherit}.material-design .input__sEopK{background-image:linear-gradient(to top, transparent 1px, #afafaf 1px);background-size:100% 2px;background-repeat:no-repeat;background-position:center bottom;padding-bottom:2px}.material-design .input__sEopK:focus{background-image:linear-gradient(var(--flavor-accent), var(--flavor-accent)),linear-gradient(to top, transparent 1px, #afafaf 1px)}.flat-design .input__sEopK,.flat-design .input__sEopK:focus{border-bottom:1px solid var(--border-light)}.input__sEopK .label__jJsSu{display:block;font-weight:bold}.input__sEopK .text__v0KcT{width:100%;background-color:rgba(0,0,0,0);border:0;outline:none;padding:0;background-image:none}.material-design .input__sEopK .text__v0KcT{color:#212121}.flat-design .input__sEopK .text__v0KcT{color:#1f1f21}.inputContainer__R_CDq{display:flex}.tag__BTX7E{color:#fff;background-color:var(--flavor-accent);padding:.1rem .2rem;margin-right:.1rem;margin-bottom:.1rem;border-radius:4px}.selectableOptionContainer__kutkQ{display:none;position:fixed;background-color:#fff;z-index:1100;border:1px solid var(--border-light)}.selectableOptionContainer__kutkQ .selectableOption__HHU91{padding-left:.2rem;padding-right:.2rem;cursor:pointer}.selectableOptionContainer__kutkQ .selectableOption__HHU91.active__JedWZ{color:#fff;background-color:var(--flavor-accent)}`, "",{"version":3,"sources":["webpack://./src/Components/FormElements/SearchSelectInput/seachSelectInput.scss","webpack://./src/scss/_designMixin.scss"],"names":[],"mappings":"AAGA,cACE,oBAAA,CACA,UAAA,CACA,iBAAA,CACA,oBAAA,CAGE,6DACE,eAAA,CCPO,+BDYT,sEAAA,CACA,wBAAA,CACA,2BAAA,CACA,iCAAA,CACA,kBAAA,CAEA,qCACE,kIAAA,CAMF,4DACE,2CAAA,CAIJ,4BACE,aAAA,CACA,gBAAA,CAGF,2BACE,UAAA,CACA,8BAAA,CACA,QAAA,CACA,YAAA,CACA,SAAA,CACA,qBAAA,CCzCS,4CD4CP,aAAA,CC5CO,wCDgDP,aAAA,CAKN,uBACE,YAAA,CAIF,YACE,UAAA,CACA,qCAAA,CACA,mBAAA,CACA,kBAAA,CACA,mBAAA,CACA,iBAAA,CAGF,kCACE,YAAA,CACA,cAAA,CACA,qBAAA,CACA,YAAA,CACA,oCAAA,CAGA,2DACE,kBAAA,CACA,mBAAA,CACA,cAAA,CAEA,yEACE,UAAA,CACA,qCAAA","sourcesContent":["@import \"../../../scss/variables\";\n@import \"../../../scss/designMixin\";\n\n.input {\n  display: inline-block;\n  width: 100%;\n  position: relative;\n  padding-bottom: 0.1rem;\n\n  &:focus-within {\n    .selectableOptionContainer {\n      display: inherit;\n    }\n  }\n\n  @include design($material) {\n    background-image: linear-gradient(to top, transparent 1px, #afafaf 1px);\n    background-size: 100% 2px;\n    background-repeat: no-repeat;\n    background-position: center bottom;\n    padding-bottom: 2px;\n\n    &:focus {\n      background-image: linear-gradient(var(--flavor-accent), var(--flavor-accent)),\n      linear-gradient(to top, transparent 1px, #afafaf 1px);\n    }\n  }\n\n  @include design($flat) {\n    &, &:focus {\n      border-bottom: 1px solid var(--border-light);\n    }\n  }\n\n  .label {\n    display: block;\n    font-weight: bold;\n  }\n\n  .text {\n    width: 100%;\n    background-color: transparent;\n    border: 0;\n    outline: none;\n    padding: 0;\n    background-image: none;\n\n    @include design($material) {\n      color: #212121;\n    }\n\n    @include design($flat) {\n      color: #1f1f21;\n    }\n  }\n}\n\n.inputContainer {\n  display: flex;\n\n}\n\n.tag {\n  color: white;\n  background-color: var(--flavor-accent);\n  padding: 0.1rem 0.2rem;\n  margin-right: 0.1rem;\n  margin-bottom: 0.1rem;\n  border-radius: 4px;\n}\n\n.selectableOptionContainer {\n  display: none;\n  position: fixed;\n  background-color: white;\n  z-index: 1100;\n  border: 1px solid var(--border-light);\n\n\n  .selectableOption {\n    padding-left: 0.2rem;\n    padding-right: 0.2rem;\n    cursor: pointer;\n\n    &.active {\n      color: white;\n      background-color: var(--flavor-accent);\n    }\n  }\n}\n","@use 'sass:selector';\n\n@mixin design($designName) {\n  @if & {\n    @at-root #{selector.nest(':global(.'+$designName+\")\", &)} {\n      @content\n    }\n  } @else {\n    :global(.#{$designName}) {\n      @content\n    }\n  }\n}\n"],"sourceRoot":""}]);
+___CSS_LOADER_EXPORT___.push([module.id, `.input__sEopK{display:inline-block;width:100%;position:relative;padding-bottom:.1rem}.input__sEopK:focus-within .selectableOptionContainer__kutkQ{display:inherit}.material-design .input__sEopK{background-image:linear-gradient(to top, transparent 1px, #afafaf 1px);background-size:100% 2px;background-repeat:no-repeat;background-position:center bottom;padding-bottom:2px}.material-design .input__sEopK:focus{background-image:linear-gradient(var(--flavor-accent), var(--flavor-accent)),linear-gradient(to top, transparent 1px, #afafaf 1px)}.flat-design .input__sEopK,.flat-design .input__sEopK:focus{border-bottom:1px solid var(--border-light)}.input__sEopK .label__jJsSu{display:block;font-weight:bold}.input__sEopK .text__v0KcT{width:100%;background-color:rgba(0,0,0,0);border:0;outline:none;padding:0;background-image:none}.material-design .input__sEopK .text__v0KcT{color:#212121}.flat-design .input__sEopK .text__v0KcT{color:#1f1f21}.inputContainer__R_CDq{display:flex}.tag__BTX7E{--text-primary-default-color: white;color:#fff;background-color:var(--flavor-accent);padding:.1rem .2rem;margin-right:.1rem;margin-bottom:.1rem;border-radius:4px}.selectableOptionContainer__kutkQ{display:none;position:fixed;background-color:#fff;z-index:1100;border:1px solid var(--border-light)}.selectableOptionContainer__kutkQ .selectableOption__HHU91{padding-left:.2rem;padding-right:.2rem;cursor:pointer}.selectableOptionContainer__kutkQ .selectableOption__HHU91.active__JedWZ{--text-primary-default-color: white;color:#fff;background-color:var(--flavor-accent)}`, "",{"version":3,"sources":["webpack://./src/Components/FormElements/SearchSelectInput/seachSelectInput.scss","webpack://./src/scss/_designMixin.scss"],"names":[],"mappings":"AAGA,cACE,oBAAA,CACA,UAAA,CACA,iBAAA,CACA,oBAAA,CAGE,6DACE,eAAA,CCPO,+BDYT,sEAAA,CACA,wBAAA,CACA,2BAAA,CACA,iCAAA,CACA,kBAAA,CAEA,qCACE,kIAAA,CAMF,4DACE,2CAAA,CAIJ,4BACE,aAAA,CACA,gBAAA,CAGF,2BACE,UAAA,CACA,8BAAA,CACA,QAAA,CACA,YAAA,CACA,SAAA,CACA,qBAAA,CCzCS,4CD4CP,aAAA,CC5CO,wCDgDP,aAAA,CAKN,uBACE,YAAA,CAIF,YACE,mCAAA,CACA,UAAA,CACA,qCAAA,CACA,mBAAA,CACA,kBAAA,CACA,mBAAA,CACA,iBAAA,CAGF,kCACE,YAAA,CACA,cAAA,CACA,qBAAA,CACA,YAAA,CACA,oCAAA,CAGA,2DACE,kBAAA,CACA,mBAAA,CACA,cAAA,CAEA,yEACE,mCAAA,CACA,UAAA,CACA,qCAAA","sourcesContent":["@import \"../../../scss/variables\";\n@import \"../../../scss/designMixin\";\n\n.input {\n  display: inline-block;\n  width: 100%;\n  position: relative;\n  padding-bottom: 0.1rem;\n\n  &:focus-within {\n    .selectableOptionContainer {\n      display: inherit;\n    }\n  }\n\n  @include design($material) {\n    background-image: linear-gradient(to top, transparent 1px, #afafaf 1px);\n    background-size: 100% 2px;\n    background-repeat: no-repeat;\n    background-position: center bottom;\n    padding-bottom: 2px;\n\n    &:focus {\n      background-image: linear-gradient(var(--flavor-accent), var(--flavor-accent)),\n      linear-gradient(to top, transparent 1px, #afafaf 1px);\n    }\n  }\n\n  @include design($flat) {\n    &, &:focus {\n      border-bottom: 1px solid var(--border-light);\n    }\n  }\n\n  .label {\n    display: block;\n    font-weight: bold;\n  }\n\n  .text {\n    width: 100%;\n    background-color: transparent;\n    border: 0;\n    outline: none;\n    padding: 0;\n    background-image: none;\n\n    @include design($material) {\n      color: #212121;\n    }\n\n    @include design($flat) {\n      color: #1f1f21;\n    }\n  }\n}\n\n.inputContainer {\n  display: flex;\n\n}\n\n.tag {\n  --text-primary-default-color: white;\n  color: white;\n  background-color: var(--flavor-accent);\n  padding: 0.1rem 0.2rem;\n  margin-right: 0.1rem;\n  margin-bottom: 0.1rem;\n  border-radius: 4px;\n}\n\n.selectableOptionContainer {\n  display: none;\n  position: fixed;\n  background-color: white;\n  z-index: 1100;\n  border: 1px solid var(--border-light);\n\n\n  .selectableOption {\n    padding-left: 0.2rem;\n    padding-right: 0.2rem;\n    cursor: pointer;\n\n    &.active {\n      --text-primary-default-color: white;\n      color: white;\n      background-color: var(--flavor-accent);\n    }\n  }\n}\n","@use 'sass:selector';\n\n@mixin design($designName) {\n  @if & {\n    @at-root #{selector.nest(':global(.'+$designName+\")\", &)} {\n      @content\n    }\n  } @else {\n    :global(.#{$designName}) {\n      @content\n    }\n  }\n}\n"],"sourceRoot":""}]);
 // Exports
 ___CSS_LOADER_EXPORT___.locals = {
 	"input": `input__sEopK`,
@@ -1625,11 +1625,13 @@ var ___CSS_LOADER_API_SOURCEMAP_IMPORT___ = __webpack_require__(7537);
 var ___CSS_LOADER_API_IMPORT___ = __webpack_require__(3645);
 var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_SOURCEMAP_IMPORT___);
 // Module
-___CSS_LOADER_EXPORT___.push([module.id, `.margin__TTRt0{margin-left:.3rem;margin-right:.3rem}.imgIcon__eyCWg{width:calc(1em + 4px);height:calc(1em + 4px);object-fit:contain}`, "",{"version":3,"sources":["webpack://./src/Components/Icon/icon.scss"],"names":[],"mappings":"AAAA,eACE,iBAAA,CACA,kBAAA,CAEF,gBACE,qBAAA,CACA,sBAAA,CACA,kBAAA","sourcesContent":[".margin {\n  margin-left: 0.3rem;\n  margin-right: 0.3rem;\n}\n.imgIcon {\n  width: calc(1em + 4px);\n  height: calc(1em + 4px);\n  object-fit: contain;\n}\n"],"sourceRoot":""}]);
+___CSS_LOADER_EXPORT___.push([module.id, `.margin__TTRt0{margin-left:.3rem;margin-right:.3rem}.imgIcon__eyCWg{width:calc(1em + 4px);height:calc(1em + 4px);object-fit:contain}.doubleIconContainer__Lj1vi{position:relative;padding:3px}.doubleIconContainer__Lj1vi .secondIcon__pYOc7{position:absolute;right:3px;bottom:3px;pointer-events:none}`, "",{"version":3,"sources":["webpack://./src/Components/Icon/icon.scss"],"names":[],"mappings":"AAAA,eACE,iBAAA,CACA,kBAAA,CAEF,gBACE,qBAAA,CACA,sBAAA,CACA,kBAAA,CAGF,4BACE,iBAAA,CACA,WAAA,CACA,+CACE,iBAAA,CACA,SAAA,CACA,UAAA,CACA,mBAAA","sourcesContent":[".margin {\n  margin-left: 0.3rem;\n  margin-right: 0.3rem;\n}\n.imgIcon {\n  width: calc(1em + 4px);\n  height: calc(1em + 4px);\n  object-fit: contain;\n}\n\n.doubleIconContainer {\n  position: relative;\n  padding: 3px;\n  .secondIcon {\n    position: absolute;\n    right: 3px;\n    bottom: 3px;\n    pointer-events: none;\n  }\n}\n"],"sourceRoot":""}]);
 // Exports
 ___CSS_LOADER_EXPORT___.locals = {
 	"margin": `margin__TTRt0`,
-	"imgIcon": `imgIcon__eyCWg`
+	"imgIcon": `imgIcon__eyCWg`,
+	"doubleIconContainer": `doubleIconContainer__Lj1vi`,
+	"secondIcon": `secondIcon__pYOc7`
 };
 module.exports = ___CSS_LOADER_EXPORT___;
 
@@ -2298,7 +2300,7 @@ var ___CSS_LOADER_API_SOURCEMAP_IMPORT___ = __webpack_require__(7537);
 var ___CSS_LOADER_API_IMPORT___ = __webpack_require__(3645);
 var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_SOURCEMAP_IMPORT___);
 // Module
-___CSS_LOADER_EXPORT___.push([module.id, `.toastContainer__Cr4Pc{position:fixed;left:0;right:0;bottom:3rem;margin:auto;max-width:576px;z-index:1;display:flex;align-items:center;flex-direction:column}.toast__sXrim{background-color:rgba(0,0,0,.8);min-height:48px;line-height:1.5;color:#fff;font-size:.77rem;letter-spacing:normal;transition-duration:.25s;margin:8px}.toast__sXrim.hiding__VMWIu{opacity:0}.material-design .toast__sXrim{padding:16px 24px}.flat-design .toast__sXrim{border-radius:.5rem;padding:16px}.toast__sXrim .action__WbNF_{text-transform:uppercase;margin-left:24px}.material-design .toast__sXrim .action__WbNF_{color:#bbdefb}.flat-design .toast__sXrim .action__WbNF_{color:#fff}`, "",{"version":3,"sources":["webpack://./src/Components/Toast/toast.scss","webpack://./src/scss/_designMixin.scss"],"names":[],"mappings":"AAGA,uBACE,cAAA,CACA,MAAA,CACA,OAAA,CACA,WAAA,CACA,WAAA,CACA,eAAA,CACA,SAAA,CACA,YAAA,CACA,kBAAA,CACA,qBAAA,CAGF,cACE,+BAAA,CACA,eAAA,CACA,eAAA,CACA,UAAA,CACA,gBAAA,CACA,qBAAA,CACA,wBAAA,CACA,UAAA,CAEA,4BACE,SAAA,CCvBS,+BD2BT,iBAAA,CC3BS,2BD+BT,mBAAA,CACA,YAAA,CAGF,6BACE,wBAAA,CACA,gBAAA,CCrCS,8CDwCP,aAAA,CCxCO,0CD2CP,UAAA","sourcesContent":["@import \"../../scss/variables\";\n@import \"../../scss/designMixin\";\n\n.toastContainer {\n  position: fixed;\n  left: 0;\n  right: 0;\n  bottom: 3rem;\n  margin: auto;\n  max-width: map-get($grid-breakpoints, \"sm\");\n  z-index: 1;\n  display: flex;\n  align-items: center;\n  flex-direction: column;\n}\n\n.toast {\n  background-color: rgba(0, 0, 0, 0.8);\n  min-height: 48px;\n  line-height: 1.5;\n  color: white;\n  font-size: 0.77rem;\n  letter-spacing: normal;\n  transition-duration: 0.25s;\n  margin: 8px;\n\n  &.hiding {\n    opacity: 0;\n  }\n\n  @include design($material) {\n    padding: 16px 24px;\n  }\n\n  @include design($flat) {\n    border-radius: 0.5rem;\n    padding: 16px;\n  }\n\n  .action {\n    text-transform: uppercase;\n    margin-left: 24px;\n\n    @include design($material) {\n      color: #bbdefb\n    }\n    @include design($flat) {\n      color: #ffffff;\n    }\n  }\n\n}\n","@use 'sass:selector';\n\n@mixin design($designName) {\n  @if & {\n    @at-root #{selector.nest(':global(.'+$designName+\")\", &)} {\n      @content\n    }\n  } @else {\n    :global(.#{$designName}) {\n      @content\n    }\n  }\n}\n"],"sourceRoot":""}]);
+___CSS_LOADER_EXPORT___.push([module.id, `.toastContainer__Cr4Pc{position:fixed;left:0;right:0;bottom:3rem;margin:auto;max-width:576px;z-index:1;display:flex;align-items:center;flex-direction:column}.toast__sXrim{background-color:rgba(0,0,0,.8);min-height:48px;line-height:1.5;--text-primary-default-color: white;color:#fff;font-size:.77rem;letter-spacing:normal;transition-duration:.25s;margin:8px}.toast__sXrim.hiding__VMWIu{opacity:0}.material-design .toast__sXrim{padding:16px 24px}.flat-design .toast__sXrim{border-radius:.5rem;padding:16px}.toast__sXrim .action__WbNF_{text-transform:uppercase;margin-left:24px}.material-design .toast__sXrim .action__WbNF_{color:#bbdefb}.flat-design .toast__sXrim .action__WbNF_{color:#fff}`, "",{"version":3,"sources":["webpack://./src/Components/Toast/toast.scss","webpack://./src/scss/_designMixin.scss"],"names":[],"mappings":"AAGA,uBACE,cAAA,CACA,MAAA,CACA,OAAA,CACA,WAAA,CACA,WAAA,CACA,eAAA,CACA,SAAA,CACA,YAAA,CACA,kBAAA,CACA,qBAAA,CAGF,cACE,+BAAA,CACA,eAAA,CACA,eAAA,CACA,mCAAA,CACA,UAAA,CACA,gBAAA,CACA,qBAAA,CACA,wBAAA,CACA,UAAA,CAEA,4BACE,SAAA,CCxBS,+BD4BT,iBAAA,CC5BS,2BDgCT,mBAAA,CACA,YAAA,CAGF,6BACE,wBAAA,CACA,gBAAA,CCtCS,8CDyCP,aAAA,CCzCO,0CD4CP,UAAA","sourcesContent":["@import \"../../scss/variables\";\n@import \"../../scss/designMixin\";\n\n.toastContainer {\n  position: fixed;\n  left: 0;\n  right: 0;\n  bottom: 3rem;\n  margin: auto;\n  max-width: map-get($grid-breakpoints, \"sm\");\n  z-index: 1;\n  display: flex;\n  align-items: center;\n  flex-direction: column;\n}\n\n.toast {\n  background-color: rgba(0, 0, 0, 0.8);\n  min-height: 48px;\n  line-height: 1.5;\n  --text-primary-default-color: white;\n  color: white;\n  font-size: 0.77rem;\n  letter-spacing: normal;\n  transition-duration: 0.25s;\n  margin: 8px;\n\n  &.hiding {\n    opacity: 0;\n  }\n\n  @include design($material) {\n    padding: 16px 24px;\n  }\n\n  @include design($flat) {\n    border-radius: 0.5rem;\n    padding: 16px;\n  }\n\n  .action {\n    text-transform: uppercase;\n    margin-left: 24px;\n\n    @include design($material) {\n      color: #bbdefb\n    }\n    @include design($flat) {\n      color: #ffffff;\n    }\n  }\n\n}\n","@use 'sass:selector';\n\n@mixin design($designName) {\n  @if & {\n    @at-root #{selector.nest(':global(.'+$designName+\")\", &)} {\n      @content\n    }\n  } @else {\n    :global(.#{$designName}) {\n      @content\n    }\n  }\n}\n"],"sourceRoot":""}]);
 // Exports
 ___CSS_LOADER_EXPORT___.locals = {
 	"toastContainer": `toastContainer__Cr4Pc`,
@@ -9619,6 +9621,7 @@ __webpack_require__.d(__webpack_exports__, {
   DialogBackground: () => (/* reexport */ DialogBackground),
   DialogContainer: () => (/* reexport */ DialogContainer),
   DialogProvider: () => (/* reexport */ DialogProvider),
+  DoubleIcon: () => (/* reexport */ DoubleIcon),
   DragItem: () => (/* reexport */ DragItemMemo),
   DropArea: () => (/* reexport */ DropAreaMemo),
   FileInput: () => (/* reexport */ FileInput),
@@ -22274,6 +22277,266 @@ function useSharedSelectedColor(key, numberSavedColors = 15) {
     addColor
   };
 }
+// EXTERNAL MODULE: ./src/Components/Menu/menu.scss
+var menu = __webpack_require__(1266);
+var menu_default = /*#__PURE__*/__webpack_require__.n(menu);
+;// CONCATENATED MODULE: ./src/helper/withRenderBrowserOnly.tsx
+var withRenderBrowserOnly_rest = undefined && undefined.__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+function withRenderBrowserOnly(Component) {
+  const displayName = `WithRenderBrowserOnly(${Component.displayName || Component.name})`;
+  const HocComponent = (_a, ref) => {
+    var {
+        children
+      } = _a,
+      props = withRenderBrowserOnly_rest(_a, ["children"]);
+    const [isBrowser, setIsBrowser] = (0,external_react_.useState)(false);
+    (0,external_react_.useEffect)(() => setIsBrowser(true), []);
+    if (!isBrowser) {
+      return null;
+    }
+    const newProps = props;
+    if (ref && Object.keys(ref).length > 0) {
+      newProps.ref = ref;
+    }
+    return (
+      /*#__PURE__*/
+      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+      // @ts-ignore
+      external_react_default().createElement(Component, newProps, children)
+    );
+  };
+  HocComponent.displayName = displayName;
+  return HocComponent;
+}
+;// CONCATENATED MODULE: ./src/WindowContext/WindowContext.ts
+
+const WindowContext = /*#__PURE__*/external_react_default().createContext(undefined);
+WindowContext.displayName = 'WindowContext';
+function useWindow() {
+  var _a;
+  return (_a = (0,external_react_.useContext)(WindowContext)) !== null && _a !== void 0 ? _a : typeof window !== 'undefined' ? window : undefined;
+}
+;// CONCATENATED MODULE: ./src/Components/Menu/MenuCloseContext.ts
+
+// eslint-disable-next-line @typescript-eslint/no-empty-function
+const MenuCloseContext = /*#__PURE__*/external_react_default().createContext(() => {});
+const MenuCloseContextProvider = MenuCloseContext.Provider;
+function useMenuClose() {
+  return (0,external_react_.useContext)(MenuCloseContext);
+}
+;// CONCATENATED MODULE: ./src/Components/Menu/MenuItem.tsx
+function MenuItem_extends() { MenuItem_extends = 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 MenuItem_extends.apply(this, arguments); }
+var MenuItem_rest = undefined && undefined.__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+
+
+
+
+
+
+
+
+const MenuItem = withMemo(function MenuItem(_a) {
+  // Refs
+  var {
+      children,
+      icon,
+      iconColor,
+      className,
+      onClick,
+      onMouseEnter,
+      onMouseLeave,
+      active,
+      item,
+      disabled = false
+    } = _a,
+    props = MenuItem_rest(_a, ["children", "icon", "iconColor", "className", "onClick", "onMouseEnter", "onMouseLeave", "active", "item", "disabled"]);
+  // States/Variables/Selectors
+  const close = useMenuClose();
+  // Dispatch
+  // Callbacks
+  const onClickInner = (0,external_react_.useCallback)(() => {
+    if (disabled) {
+      return;
+    }
+    onClick(item);
+    close();
+  }, [close, disabled, item, onClick]);
+  const onMouseEnterInner = (0,external_react_.useCallback)(() => {
+    if (disabled) {
+      return;
+    }
+    onMouseEnter === null || onMouseEnter === void 0 ? void 0 : onMouseEnter(item);
+  }, [disabled, item, onMouseEnter]);
+  const onMouseLeaveInner = (0,external_react_.useCallback)(() => {
+    if (disabled) {
+      return;
+    }
+    onMouseLeave === null || onMouseLeave === void 0 ? void 0 : onMouseLeave(item);
+  }, [disabled, item, onMouseLeave]);
+  // Effects
+  // Other
+  const childElements = typeof children === "string" ? /*#__PURE__*/external_react_default().createElement(tmp, null, children) : children;
+  // RenderFunctions
+  return /*#__PURE__*/external_react_default().createElement(ClickableMemo, MenuItem_extends({
+    className: classnames_default()((menu_default()).item, {
+      [(menu_default()).disabled]: disabled,
+      [(menu_default()).active]: active
+    }, className)
+  }, props, {
+    onClick: onClickInner,
+    onMouseEnter: onMouseEnterInner,
+    onMouseLeave: onMouseLeaveInner,
+    __allowChildren: "all"
+  }), /*#__PURE__*/external_react_default().createElement(BlockMemo, {
+    className: classnames_default()((menu_default()).itemChildren)
+  }, !!icon && /*#__PURE__*/external_react_default().createElement(Icon, {
+    icon: icon,
+    color: iconColor,
+    className: (menu_default()).icon
+  }), childElements));
+}, (menu_default()), "text");
+;// CONCATENATED MODULE: external "react-dom"
+const external_react_dom_namespaceObject = require("react-dom");
+;// CONCATENATED MODULE: ./src/Components/Menu/Menu.tsx
+
+
+
+
+
+
+
+
+
+
+
+const MENU_CONTAINER_CLASS = "rbm-menu-container";
+const Menu = withMemo(withRenderBrowserOnly(function Menu({
+  className,
+  style,
+  items,
+  y,
+  x,
+  isOpen,
+  onClose,
+  children,
+  offsetY = 0,
+  offsetX = 0
+}) {
+  // Variables
+  // Refs
+  const menuRef = (0,external_react_.useRef)(null);
+  const window = useWindow();
+  // States
+  const [portalContainer] = (0,external_react_.useState)(() => {
+    return document.createElement('div');
+  });
+  const [innerX, setInnerX] = (0,external_react_.useState)(x);
+  const [innerY, setInnerY] = (0,external_react_.useState)(y);
+  // Selectors
+  // Callbacks
+  // Effects
+  (0,external_react_.useEffect)(() => {
+    if (isOpen) {
+      const listener = e => {
+        var _a;
+        if (!((_a = menuRef.current) === null || _a === void 0 ? void 0 : _a.contains(e.target))) {
+          onClose();
+        }
+      };
+      window === null || window === void 0 ? void 0 : window.addEventListener('mousedown', listener, {
+        capture: true
+      });
+      return () => window === null || window === void 0 ? void 0 : window.removeEventListener('mousedown', listener, {
+        capture: true
+      });
+    }
+    return undefined;
+  }, [isOpen, onClose, window]);
+  (0,external_react_.useLayoutEffect)(() => {
+    if (!isOpen) {
+      return;
+    }
+    let elem = window === null || window === void 0 ? void 0 : window.document.body.querySelector("." + MENU_CONTAINER_CLASS);
+    if (!elem) {
+      elem = window === null || window === void 0 ? void 0 : window.document.body;
+    }
+    elem === null || elem === void 0 ? void 0 : elem.appendChild(portalContainer);
+  }, [isOpen, portalContainer, window === null || window === void 0 ? void 0 : window.document.body]);
+  (0,external_react_.useLayoutEffect)(() => {
+    var _a;
+    if (!menuRef.current) {
+      return;
+    }
+    const width = parseFloat(getComputedStyle(menuRef.current).width);
+    let newX = x;
+    if (newX > ((_a = window === null || window === void 0 ? void 0 : window.innerWidth) !== null && _a !== void 0 ? _a : 0) - width) {
+      newX -= width + offsetX;
+    }
+    if (newX < 0) {
+      newX = 0;
+    }
+    setInnerX(newX);
+  }, [offsetX, window === null || window === void 0 ? void 0 : window.innerWidth, x]);
+  (0,external_react_.useLayoutEffect)(() => {
+    var _a;
+    if (!menuRef.current) {
+      return;
+    }
+    const height = parseFloat(getComputedStyle(menuRef.current).height);
+    let newY = y;
+    if (newY > ((_a = window === null || window === void 0 ? void 0 : window.innerHeight) !== null && _a !== void 0 ? _a : 0) - height) {
+      newY -= height + offsetY;
+    }
+    if (newY < 0) {
+      newY = 0;
+    }
+    setInnerY(newY);
+  }, [offsetY, window === null || window === void 0 ? void 0 : window.innerHeight, y]);
+  // Other
+  // Render Functions
+  if (!isOpen) {
+    return null;
+  }
+  return /*#__PURE__*/external_react_.createElement(external_react_.Fragment, null, /*#__PURE__*/(0,external_react_dom_namespaceObject.createPortal)( /*#__PURE__*/external_react_.createElement(MenuCloseContextProvider, {
+    value: onClose
+  }, /*#__PURE__*/external_react_.createElement(BlockMemo, {
+    className: classnames_default()(className, (menu_default()).menu),
+    style: Object.assign(Object.assign({}, style), {
+      top: innerY,
+      left: innerX
+    }),
+    ref: menuRef,
+    __allowChildren: "all"
+  }, items === null || items === void 0 ? void 0 : items.map(item => {
+    const icon = !!item.icon && typeof item.icon === "object" && "color" in item.icon ? item.icon.icon : item.icon;
+    const iconColor = !!item.icon && typeof item.icon === "object" && "color" in item.icon ? item.icon.color : undefined;
+    return /*#__PURE__*/external_react_.createElement(MenuItem, {
+      key: item.key,
+      onClick: item.callback,
+      className: classnames_default()((menu_default()).item, item.className),
+      onMouseEnter: item.onMouseEnter,
+      icon: icon,
+      iconColor: iconColor,
+      onMouseLeave: item.onMouseLeave
+    }, item.label);
+  }), children)), portalContainer));
+}), (menu_default()));
 ;// CONCATENATED MODULE: ./src/Components/FormElements/ColorInput/ColorInput.tsx
 var ColorInput_rest = undefined && undefined.__rest || function (s, e) {
   var t = {};
@@ -22290,6 +22553,7 @@ var ColorInput_rest = undefined && undefined.__rest || function (s, e) {
 
 
 
+
 function convertToHex(color, disableAlpha) {
   let newColor = `#${color.r.toString(16).padStart(2, '0')}${color.g.toString(16).padStart(2, '0')}${color.b.toString(16).padStart(2, '0')}`;
   if (color.a !== undefined && !disableAlpha) {
@@ -22311,11 +22575,11 @@ function ColorInput(_a) {
       onClose,
       disableAlpha,
       presetColors,
-      sharedColorKey
+      sharedColorKey = "default",
+      disabled
     } = _a,
-    otherProps = ColorInput_rest(_a, ["defaultValue", "value", "label", "onChangeColor", "onChangeColorComplete", "onOpen", "onClose", "disableAlpha", "presetColors", "sharedColorKey"]);
+    otherProps = ColorInput_rest(_a, ["defaultValue", "value", "label", "onChangeColor", "onChangeColorComplete", "onOpen", "onClose", "disableAlpha", "presetColors", "sharedColorKey", "disabled"]);
   // Refs
-  const containerRef = (0,external_react_.useRef)(null);
   const modalRef = (0,external_react_.useRef)(null);
   // States
   const [color, setColor] = (0,external_react_.useState)((_b = value !== null && value !== void 0 ? value : defaultValue) !== null && _b !== void 0 ? _b : '#000000FF');
@@ -22328,6 +22592,7 @@ function ColorInput(_a) {
     colors,
     addColor
   } = useSharedSelectedColor(sharedColorKey);
+  const realIsOpen = disabled !== true && isOpen;
   const colVal = value !== null && value !== void 0 ? value : color;
   // Selectors
   // Callbacks
@@ -22347,21 +22612,22 @@ function ColorInput(_a) {
       onChangeColorComplete(hexColor);
     }
   }, [disableAlpha, onChangeColorComplete]);
-  const onContainerClick = (0,external_react_.useCallback)(e => {
-    if (e.target === (containerRef === null || containerRef === void 0 ? void 0 : containerRef.current)) {
-      setIsOpen(false);
-      addColor(colVal);
-      onClose === null || onClose === void 0 ? void 0 : onClose(colVal);
-    }
+  const onMenuClose = (0,external_react_.useCallback)(() => {
+    setIsOpen(false);
+    addColor(colVal);
+    onClose === null || onClose === void 0 ? void 0 : onClose(colVal);
   }, [addColor, colVal, onClose]);
   const openElement = (0,external_react_.useCallback)(e => {
+    if (disabled) {
+      return;
+    }
     setIsOpen(true);
     setPosition({
       x: e.clientX,
       y: e.clientY
     });
     onOpen === null || onOpen === void 0 ? void 0 : onOpen(colVal);
-  }, [colVal, onOpen]);
+  }, [colVal, disabled, onOpen]);
   // Effects
   (0,external_react_.useLayoutEffect)(() => {
     if (!modalRef.current) {
@@ -22370,34 +22636,30 @@ function ColorInput(_a) {
     const dimension = modalRef.current.getBoundingClientRect();
     if (dimension.right > window.innerWidth || dimension.bottom > window.innerHeight) {
       const newPosition = {
-        x: Math.max(0, Math.min(window.innerWidth - dimension.width, position.x)),
-        y: Math.max(0, Math.min(window.innerHeight - dimension.height, position.y))
+        x: Math.max(0, Math.min(window.innerWidth - dimension.width - 3, position.x)),
+        y: Math.max(0, Math.min(window.innerHeight - dimension.height - 3, position.y))
       };
-      setPosition(newPosition);
+      if (newPosition.x !== position.x || newPosition.y !== position.y) {
+        setPosition(newPosition);
+      }
     }
   }, [position]);
   // Other
   // Render Functions
   return /*#__PURE__*/external_react_.createElement("span", {
     className: (colorInput_default()).colorInput
-  }, isOpen ? /*#__PURE__*/external_react_.createElement("div", {
-    onClick: onContainerClick,
-    className: (colorInput_default()).modalContainer,
-    ref: containerRef
-  }, /*#__PURE__*/external_react_.createElement("div", {
-    className: (colorInput_default()).modal,
-    style: {
-      top: position.y,
-      left: position.x
-    },
-    ref: modalRef
+  }, /*#__PURE__*/external_react_.createElement(Menu, {
+    x: position.x,
+    y: position.y,
+    isOpen: realIsOpen,
+    onClose: onMenuClose
   }, /*#__PURE__*/external_react_.createElement(sketch_Sketch, {
     color: colVal,
     onChange: onChange,
     onChangeComplete: onChangeComplete,
     disableAlpha: disableAlpha,
     presetColors: presetColors !== null && presetColors !== void 0 ? presetColors : colors
-  }))) : null, /*#__PURE__*/external_react_.createElement("span", {
+  })), /*#__PURE__*/external_react_.createElement("span", {
     onClick: openElement,
     className: (colorInput_default()).label
   }, label), /*#__PURE__*/external_react_.createElement("span", {
@@ -22956,14 +23218,6 @@ const PasswordInput = withForwardRef(function PasswordInput(_a, ref) {
 // EXTERNAL MODULE: ./src/Components/FormElements/SearchSelectInput/seachSelectInput.scss
 var seachSelectInput = __webpack_require__(2399);
 var seachSelectInput_default = /*#__PURE__*/__webpack_require__.n(seachSelectInput);
-;// CONCATENATED MODULE: ./src/WindowContext/WindowContext.ts
-
-const WindowContext = /*#__PURE__*/external_react_default().createContext(undefined);
-WindowContext.displayName = 'WindowContext';
-function useWindow() {
-  var _a;
-  return (_a = (0,external_react_.useContext)(WindowContext)) !== null && _a !== void 0 ? _a : typeof window !== 'undefined' ? window : undefined;
-}
 ;// CONCATENATED MODULE: ./src/Components/FormElements/SearchSelectInput/SearchSelectInput.tsx
 
 
@@ -23146,7 +23400,7 @@ const Select = withMemo(function Select(_a) {
   // States
   // Selectors
   // Callbacks
-  const onChangeWithData = useListener('onChange', otherProps);
+  const [onChangeWithData, propsWithoutData] = useListenerWithExtractedProps('onChange', otherProps);
   const onChange = (0,external_react_.useCallback)(e => {
     onChangeValue === null || onChangeValue === void 0 ? void 0 : onChangeValue(e.target.value);
     onChangeWithData(e);
@@ -23165,7 +23419,7 @@ const Select = withMemo(function Select(_a) {
       style: style
     }, label ? /*#__PURE__*/external_react_.createElement("span", {
       className: (select_default()).label
-    }, label) : null, /*#__PURE__*/external_react_.createElement("select", Select_extends({}, otherProps, {
+    }, label) : null, /*#__PURE__*/external_react_.createElement("select", Select_extends({}, propsWithoutData, {
       className: (select_default()).input,
       onChange: onChange
     }), options.map(option => {
@@ -23606,7 +23860,7 @@ function useKeyUpListener(key, listener, dependencies = [], ignoreFormElements =
   (0,external_react_.useEffect)(() => {
     const lowercaseKey = key.toLowerCase();
     const keyListener = e => {
-      if (e.key.toLowerCase() === lowercaseKey && (!ignoreFormElements || !isFormElement(e.target))) {
+      if ((e.key === "Meta" || e.key.toLowerCase() === lowercaseKey) && (!ignoreFormElements || !isFormElement(e.target))) {
         listener(e);
       }
     };
@@ -23708,6 +23962,46 @@ function useWindowDimensions() {
     y: (_b = window === null || window === void 0 ? void 0 : window.innerHeight) !== null && _b !== void 0 ? _b : 0
   };
 }
+;// CONCATENATED MODULE: ./src/Components/Icon/DoubleIcon.tsx
+function DoubleIcon_extends() { DoubleIcon_extends = 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 DoubleIcon_extends.apply(this, arguments); }
+var DoubleIcon_rest = undefined && undefined.__rest || function (s, e) {
+  var t = {};
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+
+
+
+
+const DoubleIcon = withMemo(function DoubleIcon(_a) {
+  // Refs
+  var {
+      secondIcon,
+      secondIconColor,
+      color
+    } = _a,
+    otherProps = DoubleIcon_rest(_a, ["secondIcon", "secondIconColor", "color"]);
+  // States/Variables/Selectors
+  // Dispatch
+  // Callbacks
+  // Effects
+  // Other
+  // RenderFunctions
+  return /*#__PURE__*/external_react_default().createElement(InlineBlockMemo, {
+    className: (icon_default()).doubleIconContainer
+  }, /*#__PURE__*/external_react_default().createElement(Icon, DoubleIcon_extends({}, otherProps, {
+    color: color
+  })), /*#__PURE__*/external_react_default().createElement(Icon, {
+    icon: secondIcon,
+    size: "xs",
+    className: (icon_default()).secondIcon,
+    color: secondIconColor !== null && secondIconColor !== void 0 ? secondIconColor : color
+  }));
+}, (icon_default()));
 // EXTERNAL MODULE: ./src/Components/InViewport/inViewport.scss
 var inViewport = __webpack_require__(4283);
 var inViewport_default = /*#__PURE__*/__webpack_require__.n(inViewport);
@@ -26472,367 +26766,115 @@ const List = withMemo(function List({
     index,
     style: itemStyle
   }) => renderItem(items[index], itemStyle, index), [items, renderItem]);
-  const setHeight = (0,external_react_.useCallback)((_, height) => setItemHeight(height), []);
-  // Effects
-  // Other
-  // Render Functions
-  return /*#__PURE__*/external_react_.createElement(AutoSizer, null, ({
-    height,
-    width
-  }) => {
-    return /*#__PURE__*/external_react_.createElement(external_react_.Fragment, null, initialItemHeight === 0 && items.length > 0 && /*#__PURE__*/external_react_.createElement(SizeCalculatorMemo, {
-      onSize: setHeight,
-      absolute: true
-    }, renderItem(items[0], {
-      position: 'relative',
-      top: '0px',
-      left: '0px',
-      width: '100%',
-      zIndex: -1
-    }, 0)), height !== undefined && width !== undefined && /*#__PURE__*/external_react_.createElement(FixedSizeList, {
-      height: height,
-      itemCount: items.length,
-      width: width,
-      itemSize: itemHeight,
-      style: style,
-      className: className,
-      itemData: items
-    }, renderItemInner));
-  });
-}, (list_default()));
-// EXTERNAL MODULE: ./src/Components/LoadingCircle/loadingCircle.scss
-var loadingCircle = __webpack_require__(5191);
-var loadingCircle_default = /*#__PURE__*/__webpack_require__.n(loadingCircle);
-;// CONCATENATED MODULE: ./src/Components/LoadingCircle/LoadingCircle.tsx
-
-
-
-
-function LoadingCircle({
-  size = 32,
-  className,
-  style
-}) {
-  // Variables
-  // States
-  // Refs
-  // Callbacks
-  // Effects
-  // Other
-  // Render Functions
-  return /*#__PURE__*/external_react_.createElement("svg", {
-    className: classnames_default()((loadingCircle_default()).loadingCircle, className),
-    viewBox: `0 0 ${size} ${size}`,
-    width: size,
-    height: size,
-    style: style
-  }, /*#__PURE__*/external_react_.createElement("circle", {
-    cx: "50%",
-    cy: "50%",
-    r: "40%",
-    fill: "none",
-    className: (loadingCircle_default()).spinner
-  }));
-}
-const LoadingCircleMemo = withMemo(LoadingCircle, (loadingCircle_default()));
-
-// EXTERNAL MODULE: ./src/Components/LoadingArea/loadingArea.scss
-var loadingArea = __webpack_require__(7150);
-var loadingArea_default = /*#__PURE__*/__webpack_require__.n(loadingArea);
-;// CONCATENATED MODULE: ./src/Components/LoadingArea/LoadingArea.tsx
-
-
-
-
-
-function LoadingArea({
-  loading,
-  fullWidth = false,
-  fullSize = false,
-  fullHeight = false,
-  opacity = 0.65,
-  className,
-  style,
-  children
-}) {
-  // Variables
-  if (fullSize) {
-    fullHeight = true;
-    fullWidth = true;
-  }
-  // States
-  // Refs
-  // Callbacks
-  // Effects
-  // Other
-  // Render Functions
-  return /*#__PURE__*/external_react_.createElement("span", {
-    className: classnames_default()((loadingArea_default()).loadingArea, className, {
-      'full-height': fullHeight,
-      'full-width': fullWidth
-    }),
-    style: style
-  }, children, loading ? /*#__PURE__*/external_react_.createElement("span", {
-    className: (loadingArea_default()).curtain,
-    style: {
-      opacity
-    }
-  }, /*#__PURE__*/external_react_.createElement(LoadingCircleMemo, null)) : null);
-}
-const LoadingAreaMemo = withMemo(LoadingArea, (loadingArea_default()));
-
-// EXTERNAL MODULE: ./src/Components/Menu/menu.scss
-var menu = __webpack_require__(1266);
-var menu_default = /*#__PURE__*/__webpack_require__.n(menu);
-;// CONCATENATED MODULE: ./src/helper/withRenderBrowserOnly.tsx
-var withRenderBrowserOnly_rest = undefined && undefined.__rest || function (s, e) {
-  var t = {};
-  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
-  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
-  }
-  return t;
-};
-
-function withRenderBrowserOnly(Component) {
-  const displayName = `WithRenderBrowserOnly(${Component.displayName || Component.name})`;
-  const HocComponent = (_a, ref) => {
-    var {
-        children
-      } = _a,
-      props = withRenderBrowserOnly_rest(_a, ["children"]);
-    const [isBrowser, setIsBrowser] = (0,external_react_.useState)(false);
-    (0,external_react_.useEffect)(() => setIsBrowser(true), []);
-    if (!isBrowser) {
-      return null;
-    }
-    const newProps = props;
-    if (ref && Object.keys(ref).length > 0) {
-      newProps.ref = ref;
-    }
-    return (
-      /*#__PURE__*/
-      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-      // @ts-ignore
-      external_react_default().createElement(Component, newProps, children)
-    );
-  };
-  HocComponent.displayName = displayName;
-  return HocComponent;
-}
-;// CONCATENATED MODULE: ./src/Components/Menu/MenuCloseContext.ts
-
-// eslint-disable-next-line @typescript-eslint/no-empty-function
-const MenuCloseContext = /*#__PURE__*/external_react_default().createContext(() => {});
-const MenuCloseContextProvider = MenuCloseContext.Provider;
-function useMenuClose() {
-  return (0,external_react_.useContext)(MenuCloseContext);
-}
-;// CONCATENATED MODULE: ./src/Components/Menu/MenuItem.tsx
-function MenuItem_extends() { MenuItem_extends = 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 MenuItem_extends.apply(this, arguments); }
-var MenuItem_rest = undefined && undefined.__rest || function (s, e) {
-  var t = {};
-  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
-  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
-  }
-  return t;
-};
-
-
-
-
-
+  const setHeight = (0,external_react_.useCallback)((_, height) => setItemHeight(height), []);
+  // Effects
+  // Other
+  // Render Functions
+  return /*#__PURE__*/external_react_.createElement(AutoSizer, null, ({
+    height,
+    width
+  }) => {
+    return /*#__PURE__*/external_react_.createElement(external_react_.Fragment, null, initialItemHeight === 0 && items.length > 0 && /*#__PURE__*/external_react_.createElement(SizeCalculatorMemo, {
+      onSize: setHeight,
+      absolute: true
+    }, renderItem(items[0], {
+      position: 'relative',
+      top: '0px',
+      left: '0px',
+      width: '100%',
+      zIndex: -1
+    }, 0)), height !== undefined && width !== undefined && /*#__PURE__*/external_react_.createElement(FixedSizeList, {
+      height: height,
+      itemCount: items.length,
+      width: width,
+      itemSize: itemHeight,
+      style: style,
+      className: className,
+      itemData: items
+    }, renderItemInner));
+  });
+}, (list_default()));
+// EXTERNAL MODULE: ./src/Components/LoadingCircle/loadingCircle.scss
+var loadingCircle = __webpack_require__(5191);
+var loadingCircle_default = /*#__PURE__*/__webpack_require__.n(loadingCircle);
+;// CONCATENATED MODULE: ./src/Components/LoadingCircle/LoadingCircle.tsx
 
 
 
 
-const MenuItem = withMemo(function MenuItem(_a) {
+function LoadingCircle({
+  size = 32,
+  className,
+  style
+}) {
+  // Variables
+  // States
   // Refs
-  var {
-      children,
-      icon,
-      iconColor,
-      className,
-      onClick,
-      onMouseEnter,
-      onMouseLeave,
-      active,
-      item,
-      disabled = false
-    } = _a,
-    props = MenuItem_rest(_a, ["children", "icon", "iconColor", "className", "onClick", "onMouseEnter", "onMouseLeave", "active", "item", "disabled"]);
-  // States/Variables/Selectors
-  const close = useMenuClose();
-  // Dispatch
   // Callbacks
-  const onClickInner = (0,external_react_.useCallback)(() => {
-    if (disabled) {
-      return;
-    }
-    onClick(item);
-    close();
-  }, [close, disabled, item, onClick]);
-  const onMouseEnterInner = (0,external_react_.useCallback)(() => {
-    if (disabled) {
-      return;
-    }
-    onMouseEnter === null || onMouseEnter === void 0 ? void 0 : onMouseEnter(item);
-  }, [disabled, item, onMouseEnter]);
-  const onMouseLeaveInner = (0,external_react_.useCallback)(() => {
-    if (disabled) {
-      return;
-    }
-    onMouseLeave === null || onMouseLeave === void 0 ? void 0 : onMouseLeave(item);
-  }, [disabled, item, onMouseLeave]);
   // Effects
   // Other
-  const childElements = typeof children === "string" ? /*#__PURE__*/external_react_default().createElement(tmp, null, children) : children;
-  // RenderFunctions
-  return /*#__PURE__*/external_react_default().createElement(ClickableMemo, MenuItem_extends({
-    className: classnames_default()((menu_default()).item, {
-      [(menu_default()).disabled]: disabled,
-      [(menu_default()).active]: active
-    }, className)
-  }, props, {
-    onClick: onClickInner,
-    onMouseEnter: onMouseEnterInner,
-    onMouseLeave: onMouseLeaveInner,
-    __allowChildren: "all"
-  }), /*#__PURE__*/external_react_default().createElement(BlockMemo, {
-    className: classnames_default()((menu_default()).itemChildren)
-  }, !!icon && /*#__PURE__*/external_react_default().createElement(Icon, {
-    icon: icon,
-    color: iconColor,
-    className: (menu_default()).icon
-  }), childElements));
-}, (menu_default()), "text");
-;// CONCATENATED MODULE: external "react-dom"
-const external_react_dom_namespaceObject = require("react-dom");
-;// CONCATENATED MODULE: ./src/Components/Menu/Menu.tsx
-
-
-
-
-
+  // Render Functions
+  return /*#__PURE__*/external_react_.createElement("svg", {
+    className: classnames_default()((loadingCircle_default()).loadingCircle, className),
+    viewBox: `0 0 ${size} ${size}`,
+    width: size,
+    height: size,
+    style: style
+  }, /*#__PURE__*/external_react_.createElement("circle", {
+    cx: "50%",
+    cy: "50%",
+    r: "40%",
+    fill: "none",
+    className: (loadingCircle_default()).spinner
+  }));
+}
+const LoadingCircleMemo = withMemo(LoadingCircle, (loadingCircle_default()));
 
+// EXTERNAL MODULE: ./src/Components/LoadingArea/loadingArea.scss
+var loadingArea = __webpack_require__(7150);
+var loadingArea_default = /*#__PURE__*/__webpack_require__.n(loadingArea);
+;// CONCATENATED MODULE: ./src/Components/LoadingArea/LoadingArea.tsx
 
 
 
 
 
-const MENU_CONTAINER_CLASS = "rbm-menu-container";
-const Menu = withMemo(withRenderBrowserOnly(function Menu({
+function LoadingArea({
+  loading,
+  fullWidth = false,
+  fullSize = false,
+  fullHeight = false,
+  opacity = 0.65,
   className,
   style,
-  items,
-  y,
-  x,
-  isOpen,
-  onClose,
-  children,
-  offsetY = 0,
-  offsetX = 0
+  children
 }) {
   // Variables
-  // Refs
-  const menuRef = (0,external_react_.useRef)(null);
-  const window = useWindow();
+  if (fullSize) {
+    fullHeight = true;
+    fullWidth = true;
+  }
   // States
-  const [portalContainer] = (0,external_react_.useState)(() => {
-    return document.createElement('div');
-  });
-  const [innerX, setInnerX] = (0,external_react_.useState)(x);
-  const [innerY, setInnerY] = (0,external_react_.useState)(y);
-  // Selectors
+  // Refs
   // Callbacks
   // Effects
-  (0,external_react_.useEffect)(() => {
-    if (isOpen) {
-      const listener = e => {
-        var _a;
-        if (!((_a = menuRef.current) === null || _a === void 0 ? void 0 : _a.contains(e.target))) {
-          onClose();
-        }
-      };
-      window === null || window === void 0 ? void 0 : window.addEventListener('mousedown', listener, {
-        capture: true
-      });
-      return () => window === null || window === void 0 ? void 0 : window.removeEventListener('mousedown', listener, {
-        capture: true
-      });
-    }
-    return undefined;
-  }, [isOpen, onClose, window]);
-  (0,external_react_.useLayoutEffect)(() => {
-    if (!isOpen) {
-      return;
-    }
-    let elem = window === null || window === void 0 ? void 0 : window.document.body.querySelector("." + MENU_CONTAINER_CLASS);
-    if (!elem) {
-      elem = window === null || window === void 0 ? void 0 : window.document.body;
-    }
-    elem === null || elem === void 0 ? void 0 : elem.appendChild(portalContainer);
-  }, [isOpen, portalContainer, window === null || window === void 0 ? void 0 : window.document.body]);
-  (0,external_react_.useLayoutEffect)(() => {
-    var _a;
-    if (!menuRef.current) {
-      return;
-    }
-    const width = parseFloat(getComputedStyle(menuRef.current).width);
-    let newX = x;
-    if (newX > ((_a = window === null || window === void 0 ? void 0 : window.innerWidth) !== null && _a !== void 0 ? _a : 0) - width) {
-      newX -= width + offsetX;
-    }
-    if (newX < 0) {
-      newX = 0;
-    }
-    setInnerX(newX);
-  }, [offsetX, window === null || window === void 0 ? void 0 : window.innerWidth, x]);
-  (0,external_react_.useLayoutEffect)(() => {
-    var _a;
-    if (!menuRef.current) {
-      return;
-    }
-    const height = parseFloat(getComputedStyle(menuRef.current).height);
-    let newY = y;
-    if (newY > ((_a = window === null || window === void 0 ? void 0 : window.innerHeight) !== null && _a !== void 0 ? _a : 0) - height) {
-      newY -= height + offsetY;
-    }
-    if (newY < 0) {
-      newY = 0;
-    }
-    setInnerY(newY);
-  }, [offsetY, window === null || window === void 0 ? void 0 : window.innerHeight, y]);
   // Other
   // Render Functions
-  if (!isOpen) {
-    return null;
-  }
-  return /*#__PURE__*/external_react_.createElement(external_react_.Fragment, null, /*#__PURE__*/(0,external_react_dom_namespaceObject.createPortal)( /*#__PURE__*/external_react_.createElement(MenuCloseContextProvider, {
-    value: onClose
-  }, /*#__PURE__*/external_react_.createElement(BlockMemo, {
-    className: classnames_default()(className, (menu_default()).menu),
-    style: Object.assign(Object.assign({}, style), {
-      top: innerY,
-      left: innerX
+  return /*#__PURE__*/external_react_.createElement("span", {
+    className: classnames_default()((loadingArea_default()).loadingArea, className, {
+      'full-height': fullHeight,
+      'full-width': fullWidth
     }),
-    ref: menuRef,
-    __allowChildren: "all"
-  }, items === null || items === void 0 ? void 0 : items.map(item => {
-    const icon = !!item.icon && typeof item.icon === "object" && "color" in item.icon ? item.icon.icon : item.icon;
-    const iconColor = !!item.icon && typeof item.icon === "object" && "color" in item.icon ? item.icon.color : undefined;
-    return /*#__PURE__*/external_react_.createElement(MenuItem, {
-      key: item.key,
-      onClick: item.callback,
-      className: classnames_default()((menu_default()).item, item.className),
-      onMouseEnter: item.onMouseEnter,
-      icon: icon,
-      iconColor: iconColor,
-      onMouseLeave: item.onMouseLeave
-    }, item.label);
-  }), children)), portalContainer));
-}), (menu_default()));
+    style: style
+  }, children, loading ? /*#__PURE__*/external_react_.createElement("span", {
+    className: (loadingArea_default()).curtain,
+    style: {
+      opacity
+    }
+  }, /*#__PURE__*/external_react_.createElement(LoadingCircleMemo, null)) : null);
+}
+const LoadingAreaMemo = withMemo(LoadingArea, (loadingArea_default()));
+
 ;// CONCATENATED MODULE: ./src/Components/Menu/HoverMenu.tsx
 
 
@@ -26903,6 +26945,11 @@ const HoverMenu = withMemo(function HoverMenu({
     recalculatePosition();
     setIsOpen(true);
   }, [recalculatePosition]);
+  const onClickInner = (0,external_react_.useCallback)(() => {
+    if ((onClick === null || onClick === void 0 ? void 0 : onClick()) !== false) {
+      open();
+    }
+  }, [onClick, open]);
   // Effects
   // Other
   // RenderFunctions
@@ -26910,7 +26957,7 @@ const HoverMenu = withMemo(function HoverMenu({
     onMouseEnter: open,
     onMouseLeave: close,
     useReactOnMouseLeave: true,
-    onClick: onClick,
+    onClick: onClickInner,
     className: classnames_default()((menu_default()).hoverMenu, {
       [(menu_default()).open]: isOpen
     }, className),
@@ -27917,6 +27964,7 @@ function nonEmptyString(str, other = Characters.NBSP) {
 
 
 
+
 
 
 })();