@ainias42/react-bootstrap-mobile 0.2.16 → 1.0.0

package/dist/bootstrapReactMobile.js

@@ -1,6 +1,6 @@
 /*!
  * 
- *   @ainias42/react-bootstrap-mobile v0.2.15
+ *   @ainias42/react-bootstrap-mobile v0.2.16
  *   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
@@ -3973,22 +3973,45 @@ if (true) {
 
 /***/ }),
 
-/***/ 1020:
-/***/ ((__unused_webpack_module, exports, __webpack_require__) => {
+/***/ 9698:
+/***/ ((__unused_webpack_module, exports) => {
 
 "use strict";
 var __webpack_unused_export__;
 /**
  * @license React
- * react-jsx-runtime.production.min.js
+ * react-jsx-runtime.production.js
  *
- * Copyright (c) Facebook, Inc. and its affiliates.
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-var f=__webpack_require__(2015),k=Symbol.for("react.element"),l=Symbol.for("react.fragment"),m=Object.prototype.hasOwnProperty,n=f.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,p={key:!0,ref:!0,__self:!0,__source:!0};
-function q(c,a,g){var b,d={},e=null,h=null;void 0!==g&&(e=""+g);void 0!==a.key&&(e=""+a.key);void 0!==a.ref&&(h=a.ref);for(b in a)m.call(a,b)&&!p.hasOwnProperty(b)&&(d[b]=a[b]);if(c&&c.defaultProps)for(b in a=c.defaultProps,a)void 0===d[b]&&(d[b]=a[b]);return{$$typeof:k,type:c,key:e,ref:h,props:d,_owner:n.current}}__webpack_unused_export__=l;exports.jsx=q;exports.jsxs=q;
+
+
+var REACT_ELEMENT_TYPE = Symbol.for("react.transitional.element"),
+  REACT_FRAGMENT_TYPE = Symbol.for("react.fragment");
+function jsxProd(type, config, maybeKey) {
+  var key = null;
+  void 0 !== maybeKey && (key = "" + maybeKey);
+  void 0 !== config.key && (key = "" + config.key);
+  if ("key" in config) {
+    maybeKey = {};
+    for (var propName in config)
+      "key" !== propName && (maybeKey[propName] = config[propName]);
+  } else maybeKey = config;
+  config = maybeKey.ref;
+  return {
+    $$typeof: REACT_ELEMENT_TYPE,
+    type: type,
+    key: key,
+    ref: void 0 !== config ? config : null,
+    props: maybeKey
+  };
+}
+__webpack_unused_export__ = REACT_FRAGMENT_TYPE;
+exports.jsx = jsxProd;
+exports.jsxs = jsxProd;
 
 
 /***/ }),
@@ -4000,7 +4023,7 @@ function q(c,a,g){var b,d={},e=null,h=null;void 0!==g&&(e=""+g);void 0!==a.key&&
 
 
 if (true) {
-  module.exports = __webpack_require__(1020);
+  module.exports = __webpack_require__(9698);
 } else {}
 
 
@@ -4186,9 +4209,9 @@ __webpack_require__.r(__webpack_exports__);
 
 // EXPORTS
 __webpack_require__.d(__webpack_exports__, {
-  ActionSheet: () => (/* reexport */ ActionSheetMemo),
+  ActionSheet: () => (/* reexport */ ActionSheet),
   AlertDialog: () => (/* reexport */ AlertDialogMemo),
-  Block: () => (/* reexport */ BlockMemo),
+  Block: () => (/* reexport */ Block),
   BreakpointNames: () => (/* reexport */ BreakpointNames),
   Breakpoints: () => (/* reexport */ Breakpoints),
   BulletList: () => (/* reexport */ BulletListMemo),
@@ -4199,7 +4222,7 @@ __webpack_require__.d(__webpack_exports__, {
   Card: () => (/* reexport */ CardMemo),
   Characters: () => (/* reexport */ Characters),
   Checkbox: () => (/* reexport */ Checkbox_tmp),
-  Clickable: () => (/* reexport */ ClickableMemo),
+  Clickable: () => (/* reexport */ Clickable),
   ColorInput: () => (/* reexport */ ColorInputMemo),
   ColorInputController: () => (/* reexport */ ColorInputController),
   ConfirmDialog: () => (/* reexport */ ConfirmDialogMemo),
@@ -4214,10 +4237,10 @@ __webpack_require__.d(__webpack_exports__, {
   FileInput: () => (/* reexport */ FileInput),
   FileInputController: () => (/* reexport */ FileInputController),
   Flavor: () => (/* reexport */ Flavor),
-  Flex: () => (/* reexport */ Flex_tmp),
+  Flex: () => (/* reexport */ Flex),
   FormError: () => (/* reexport */ FormError),
   FullScreen: () => (/* reexport */ FullScreen),
-  Grid: () => (/* reexport */ GridMemo),
+  Grid: () => (/* reexport */ Grid),
   GridItem: () => (/* reexport */ GridItemMemo),
   Grow: () => (/* reexport */ Grow),
   Heading: () => (/* reexport */ HeadingMemo),
@@ -4228,8 +4251,8 @@ __webpack_require__.d(__webpack_exports__, {
   Image: () => (/* reexport */ ImageMemo),
   InViewport: () => (/* reexport */ InViewportMemo),
   InfiniteList: () => (/* reexport */ InfiniteList),
-  Inline: () => (/* reexport */ InlineMemo),
-  InlineBlock: () => (/* reexport */ InlineBlockMemo),
+  Inline: () => (/* reexport */ Inline),
+  InlineBlock: () => (/* reexport */ InlineBlock),
   Input: () => (/* reexport */ Input),
   InputController: () => (/* reexport */ InputController),
   List: () => (/* reexport */ List),
@@ -4312,7 +4335,6 @@ __webpack_require__.d(__webpack_exports__, {
   useWindow: () => (/* reexport */ useWindow),
   useWindowDimensions: () => (/* reexport */ useWindowDimensions),
   useYupResolver: () => (/* reexport */ useYupResolver),
-  withForwardRef: () => (/* reexport */ withForwardRef),
   withHookController: () => (/* reexport */ withHookController),
   withMemo: () => (/* reexport */ withMemo),
   withRenderBrowserOnly: () => (/* reexport */ withRenderBrowserOnly),
@@ -4363,6 +4385,20 @@ var clickable_default = /*#__PURE__*/__webpack_require__.n(clickable);
 // EXTERNAL MODULE: ./node_modules/classnames/index.js
 var classnames = __webpack_require__(6942);
 var classnames_default = /*#__PURE__*/__webpack_require__.n(classnames);
+;// CONCATENATED MODULE: ./src/Components/Hooks/useComposedRef.ts
+
+function useComposedRef(...refs) {
+  return (0,external_react_.useCallback)(val => {
+    for (const ref of refs) {
+      if (typeof ref === 'function') {
+        ref(val);
+      } else if (ref) {
+        ref.current = val;
+      }
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, refs);
+}
 // EXTERNAL MODULE: ./node_modules/isomorphic-style-loader/withStyles.js
 var withStyles = __webpack_require__(3100);
 var withStyles_default = /*#__PURE__*/__webpack_require__.n(withStyles);
@@ -4449,35 +4485,18 @@ function memoComparator(prevProps, nextProps) {
     return prevProps[key] === nextProps[key];
   });
 }
-;// CONCATENATED MODULE: ./src/helper/withForwardRef.ts
+;// CONCATENATED MODULE: ./src/helper/withMemo.ts
 
 
 
 
-function withForwardRef(component, styles, defaultAllowChildren) {
-  var _a;
-  const forwarded = /*#__PURE__*/external_react_default().forwardRef(component);
-  forwarded.displayName = (_a = component.displayName) !== null && _a !== void 0 ? _a : component.name;
-  const forwardedComp = /*#__PURE__*/external_react_default().forwardRef(withRestrictedChildren(forwarded, defaultAllowChildren));
-  const c = styles ? withStyles_default()(styles)(forwardedComp) : forwardedComp;
+function withMemo(component, styles, defaultAllowChildren) {
+  const withNoStrings = withRestrictedChildren(component, defaultAllowChildren);
+  const c = styles ? withStyles_default()(styles)(withNoStrings) : withNoStrings;
   const memoizedComponent = /*#__PURE__*/external_react_default().memo(c, memoComparator);
-  memoizedComponent.displayName = `Memoized-Forwarded(${component.displayName || component.name})`;
+  memoizedComponent.displayName = `Memoized(${component.displayName || component.name})`;
   return memoizedComponent;
 }
-;// CONCATENATED MODULE: ./src/Components/Hooks/useComposedRef.ts
-
-function useComposedRef(...refs) {
-  return (0,external_react_.useCallback)(val => {
-    for (const ref of refs) {
-      if (typeof ref === 'function') {
-        ref(val);
-      } else if (ref) {
-        ref.current = val;
-      }
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, refs);
-}
 ;// CONCATENATED MODULE: ./src/Components/Clickable/Clickable.tsx
 function Clickable_extends() { return Clickable_extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, Clickable_extends.apply(null, arguments); }
 var Clickable_rest = undefined && undefined.__rest || function (s, e) {
@@ -4495,7 +4514,7 @@ var Clickable_rest = undefined && undefined.__rest || function (s, e) {
 
 
 
-function Clickable(_a, ref) {
+const Clickable = withMemo(function Clickable(_a) {
   // Variables
   var {
       className,
@@ -4510,9 +4529,10 @@ function Clickable(_a, ref) {
       useReactOnMouseLeave = false,
       tabIndex,
       draggable,
-      title
+      title,
+      ref
     } = _a,
-    clickData = Clickable_rest(_a, ["className", "children", "style", "href", "target", "id", "interactable", "preventDefault", "stopPropagation", "useReactOnMouseLeave", "tabIndex", "draggable", "title"]);
+    clickData = Clickable_rest(_a, ["className", "children", "style", "href", "target", "id", "interactable", "preventDefault", "stopPropagation", "useReactOnMouseLeave", "tabIndex", "draggable", "title", "ref"]);
   // States
   // Refs
   const clickableRef = (0,external_react_.useRef)(null);
@@ -4695,21 +4715,7 @@ function Clickable(_a, ref) {
   return /*#__PURE__*/external_react_.createElement("span", Clickable_extends({}, props, {
     ref: refSetter
   }), children);
-}
-const ClickableMemo = withForwardRef(Clickable, (clickable_default()));
-
-;// CONCATENATED MODULE: ./src/helper/withMemo.ts
-
-
-
-
-function withMemo(component, styles, defaultAllowChildren) {
-  const withNoStrings = withRestrictedChildren(component, defaultAllowChildren);
-  const c = styles ? withStyles_default()(styles)(withNoStrings) : withNoStrings;
-  const memoizedComponent = /*#__PURE__*/external_react_default().memo(c, memoComparator);
-  memoizedComponent.displayName = `Memoized(${component.displayName || component.name})`;
-  return memoizedComponent;
-}
+}, (clickable_default()));
 // EXTERNAL MODULE: ./src/Components/Layout/container.scss
 var container = __webpack_require__(2776);
 var container_default = /*#__PURE__*/__webpack_require__.n(container);
@@ -4827,14 +4833,15 @@ var View_rest = undefined && undefined.__rest || function (s, e) {
 };
 
 
-const View = withForwardRef(function View(_a, ref) {
+const View = withMemo(function View(_a) {
   // Variables
   var _b;
   var {
       children,
-      as
+      as,
+      ref
     } = _a,
-    otherProps = View_rest(_a, ["children", "as"]);
+    otherProps = View_rest(_a, ["children", "as", "ref"]);
   // Refs
   // States
   // Selectors
@@ -4861,12 +4868,13 @@ var ViewWithoutListeners_rest = undefined && undefined.__rest || function (s, e)
 
 
 
-const ViewWithoutListeners = withForwardRef(function ViewWithoutListeners(_a, ref) {
+const ViewWithoutListeners = withMemo(function ViewWithoutListeners(_a) {
   // Variables
   var {
-      children
+      children,
+      ref
     } = _a,
-    props = ViewWithoutListeners_rest(_a, ["children"]);
+    props = ViewWithoutListeners_rest(_a, ["children", "ref"]);
   // Refs
   // States
   // Selectors
@@ -4893,7 +4901,7 @@ var InlineBlock_rest = undefined && undefined.__rest || function (s, e) {
 
 
 
-function InlineBlock(_a, ref) {
+const InlineBlock = withMemo(function InlineBlock(_a) {
   // Variables
   var {
       children,
@@ -4910,13 +4918,9 @@ function InlineBlock(_a, ref) {
   // Render Functions
   return /*#__PURE__*/external_react_.createElement(ViewWithoutListeners, InlineBlock_extends({}, props, {
     className: classnames_default()((layout_default()).inlineBlock, className),
-    as: as,
-    ref: ref
+    as: as
   }), children);
-}
-// Need InlineMemo for autocompletion of phpstorm
-const InlineBlockMemo = withForwardRef(InlineBlock, (layout_default()));
-
+}, (layout_default()));
 // EXTERNAL MODULE: ./src/Components/Text/text.scss
 var Text_text = __webpack_require__(9521);
 var text_default = /*#__PURE__*/__webpack_require__.n(Text_text);
@@ -4935,7 +4939,7 @@ var Inline_rest = undefined && undefined.__rest || function (s, e) {
 
 
 
-function Inline(_a, ref) {
+const Inline = withMemo(function Inline(_a) {
   // Variables
   var {
       children,
@@ -4953,13 +4957,8 @@ function Inline(_a, ref) {
   return /*#__PURE__*/external_react_.createElement(ViewWithoutListeners, Inline_extends({
     className: classnames_default()((layout_default()).inline, className),
     as: as
-  }, props, {
-    ref: ref
-  }), children);
-}
-// Need InlineMemo for autocompletion of phpstorm
-const InlineMemo = withForwardRef(Inline, (layout_default()));
-
+  }, props), children);
+}, (layout_default()));
 ;// CONCATENATED MODULE: ./src/Components/Text/Text.tsx
 function Text_extends() { return Text_extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, Text_extends.apply(null, arguments); }
 var Text_rest = undefined && undefined.__rest || function (s, e) {
@@ -5015,7 +5014,7 @@ function Text(_a) {
     }
   });
   // Render Functions
-  return /*#__PURE__*/external_react_.createElement(InlineMemo, Text_extends({
+  return /*#__PURE__*/external_react_.createElement(Inline, Text_extends({
     __allowChildren: "text",
     as: as
   }, props, {
@@ -5042,16 +5041,17 @@ var Flex_rest = undefined && undefined.__rest || function (s, e) {
 
 
 
-function Flex(_a, ref) {
+const Flex = withMemo(function Flex(_a) {
   // Variables
   var {
       children,
       as = 'div',
       className,
       horizontal = false,
+      ref,
       grow = false
     } = _a,
-    props = Flex_rest(_a, ["children", "as", "className", "horizontal", "grow"]);
+    props = Flex_rest(_a, ["children", "as", "className", "horizontal", "ref", "grow"]);
   // States
   // Refs
   // Callbacks
@@ -5067,9 +5067,7 @@ function Flex(_a, ref) {
     as: as,
     ref: ref
   }, props), children);
-}
-const Flex_tmp = withForwardRef(Flex, (layout_default()));
-
+}, (layout_default()));
 ;// CONCATENATED MODULE: ./src/Components/Layout/Block.tsx
 function Block_extends() { return Block_extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, Block_extends.apply(null, arguments); }
 var Block_rest = undefined && undefined.__rest || function (s, e) {
@@ -5085,14 +5083,15 @@ var Block_rest = undefined && undefined.__rest || function (s, e) {
 
 
 
-function Block(_a, ref) {
+const Block = withMemo(function Block(_a) {
   // Variables
   var {
       children,
       as = 'div',
-      className
+      className,
+      ref
     } = _a,
-    props = Block_rest(_a, ["children", "as", "className"]);
+    props = Block_rest(_a, ["children", "as", "className", "ref"]);
   // Refs
   // States
   // Selectors
@@ -5105,10 +5104,7 @@ function Block(_a, ref) {
     as: as,
     ref: ref
   }, props), children);
-}
-// Need BlockMemo for autocompletion of phpstorm
-const BlockMemo = withForwardRef(Block, (layout_default()));
-
+}, (layout_default()));
 ;// CONCATENATED MODULE: ./src/Components/ActionSheet/ActionSheet.tsx
 
 
@@ -5123,14 +5119,15 @@ const BlockMemo = withForwardRef(Block, (layout_default()));
 
 
 
-function ActionSheet({
+const ActionSheet = withMemo(function ActionSheet({
   title,
   actions,
   cancelText = 'Cancel',
   className,
   onClose,
-  style
-}, ref) {
+  style,
+  ref
+}) {
   const [isOpen, setIsOpen] = (0,external_react_.useState)(false);
   // Variables
   // States
@@ -5152,17 +5149,17 @@ function ActionSheet({
   }), [setIsOpen, close]);
   // Effects
   // Other
-  const renderAction = action => /*#__PURE__*/external_react_.createElement(ClickableMemo, {
+  const renderAction = action => /*#__PURE__*/external_react_.createElement(Clickable, {
     key: action.name,
     className: (actionSheet_default()).action,
     onClick: onActionClick,
     onClickData: action
-  }, /*#__PURE__*/external_react_.createElement(InlineBlockMemo, {
+  }, /*#__PURE__*/external_react_.createElement(InlineBlock, {
     className: (actionSheet_default()).actionIcon
   }, action.icon ? /*#__PURE__*/external_react_.createElement(Icon, {
     icon: action.icon
   }) : null), /*#__PURE__*/external_react_.createElement(tmp, null, action.name));
-  return /*#__PURE__*/external_react_.createElement(ClickableMemo, {
+  return /*#__PURE__*/external_react_.createElement(Clickable, {
     className: classnames_default()((actionSheet_default()).actionSheet, {
       [(actionSheet_default()).open]: actions.length > 0 && isOpen
     }, className),
@@ -5171,20 +5168,18 @@ function ActionSheet({
   }, /*#__PURE__*/external_react_.createElement(Container, {
     fluid: "xxl",
     className: "full-height"
-  }, /*#__PURE__*/external_react_.createElement(Flex_tmp, {
+  }, /*#__PURE__*/external_react_.createElement(Flex, {
     className: (actionSheet_default()).content
-  }, title ? /*#__PURE__*/external_react_.createElement(BlockMemo, null, /*#__PURE__*/external_react_.createElement(tmp, null, title)) : null, actions.map(renderAction), /*#__PURE__*/external_react_.createElement(ClickableMemo, {
+  }, title ? /*#__PURE__*/external_react_.createElement(Block, null, /*#__PURE__*/external_react_.createElement(tmp, null, title)) : null, actions.map(renderAction), /*#__PURE__*/external_react_.createElement(Clickable, {
     className: (actionSheet_default()).cancel,
     onClick: () => console.log('Cancel clicked'),
     __allowChildren: "all"
-  }, /*#__PURE__*/external_react_.createElement(InlineBlockMemo, {
+  }, /*#__PURE__*/external_react_.createElement(InlineBlock, {
     className: (actionSheet_default()).actionIcon
   }, /*#__PURE__*/external_react_.createElement(Icon, {
     icon: free_solid_svg_icons_namespaceObject.faTimes
   })), cancelText))));
-}
-const ActionSheetMemo = withForwardRef(ActionSheet, (actionSheet_default()));
-
+}, (actionSheet_default()));
 // EXTERNAL MODULE: ./src/Components/Card/card.scss
 var card = __webpack_require__(3579);
 var card_default = /*#__PURE__*/__webpack_require__.n(card);
@@ -5267,22 +5262,22 @@ function ButtonDialog({
   // Effects
   // Other
   // Render Functions
-  return /*#__PURE__*/external_react_.createElement(BlockMemo, {
+  return /*#__PURE__*/external_react_.createElement(Block, {
     className: classnames_default()((buttonDialog_default()).buttonDialog, className),
     style: style
-  }, !!title && /*#__PURE__*/external_react_.createElement(BlockMemo, null, /*#__PURE__*/external_react_.createElement(tmp, {
+  }, !!title && /*#__PURE__*/external_react_.createElement(Block, null, /*#__PURE__*/external_react_.createElement(tmp, {
     size: TEXT_SIZE.large,
     className: (buttonDialog_default()).title
-  }, title)), /*#__PURE__*/external_react_.createElement(BlockMemo, null, /*#__PURE__*/external_react_.createElement(tmp, {
+  }, title)), /*#__PURE__*/external_react_.createElement(Block, null, /*#__PURE__*/external_react_.createElement(tmp, {
     className: (buttonDialog_default()).message
-  }, message)), extraContent, /*#__PURE__*/external_react_.createElement(BlockMemo, {
+  }, message)), extraContent, /*#__PURE__*/external_react_.createElement(Block, {
     className: (buttonDialog_default()).buttonContainer
   }, buttons.map((b, i) => {
     var _a;
     return (
       /*#__PURE__*/
       // eslint-disable-next-line react/no-array-index-key
-      external_react_.createElement(ClickableMemo, {
+      external_react_.createElement(Clickable, {
         onClick: b.callback,
         className: classnames_default()((buttonDialog_default()).button),
         key: i + b.text
@@ -5406,15 +5401,15 @@ function Dialog({
   if (isClosed) {
     return null;
   }
-  return /*#__PURE__*/external_react_.createElement(BlockMemo, {
+  return /*#__PURE__*/external_react_.createElement(Block, {
     className: classnames_default()((dialog_default()).dialogContainer, className),
     __allowChildren: "all",
     style: style
-  }, /*#__PURE__*/external_react_.createElement(ClickableMemo, {
+  }, /*#__PURE__*/external_react_.createElement(Clickable, {
     onClick: onCurtainClick,
     className: (dialog_default()).closeCurtain,
     interactable: closable
-  }), /*#__PURE__*/external_react_.createElement(InlineBlockMemo, {
+  }), /*#__PURE__*/external_react_.createElement(InlineBlock, {
     __allowChildren: "all",
     className: (dialog_default()).dialog
   }, external_react_.Children.map(children, child => {
@@ -5470,13 +5465,14 @@ const HeadingMemo = withMemo(Heading, (heading_default()), 'text');
 
 
 
-const Grow = withForwardRef(function Grow({
+const Grow = withMemo(function Grow({
   className,
   children,
   center = false,
   style,
-  weight = 1
-}, ref) {
+  weight = 1,
+  ref
+}) {
   // Variables
   // States
   // Refs
@@ -5526,14 +5522,14 @@ const DialogBackground = withMemo(function DialogBackground({
   // Effects
   // Other
   // Render Functions
-  return /*#__PURE__*/external_react_.createElement(BlockMemo, {
+  return /*#__PURE__*/external_react_.createElement(Block, {
     __allowChildren: "all",
     className: classnames_default()((dialogBackground_default()).dialogBackground, className),
     style: style
-  }, (!!title || !!onClose) && /*#__PURE__*/external_react_.createElement(Flex_tmp, {
+  }, (!!title || !!onClose) && /*#__PURE__*/external_react_.createElement(Flex, {
     horizontal: true,
     className: (dialogBackground_default()).title
-  }, !!title && /*#__PURE__*/external_react_.createElement(Grow, null, /*#__PURE__*/external_react_.createElement(HeadingMemo, null, title)), !!onClose && /*#__PURE__*/external_react_.createElement(ClickableMemo, {
+  }, !!title && /*#__PURE__*/external_react_.createElement(Grow, null, /*#__PURE__*/external_react_.createElement(HeadingMemo, null, title)), !!onClose && /*#__PURE__*/external_react_.createElement(Clickable, {
     onClick: onClose
   }, /*#__PURE__*/external_react_.createElement(Icon, {
     size: "lg",
@@ -5559,10 +5555,11 @@ function DialogContainer_extends() { return DialogContainer_extends = Object.ass
 
 
 
-const DialogContainer = withForwardRef(function DialogContainer({
+const DialogContainer = withMemo(function DialogContainer({
   children,
-  dialogClassName
-}, ref) {
+  dialogClassName,
+  ref
+}) {
   // Variables
   const [dialogs, setDialogs] = (0,external_react_.useState)([]);
   const [, setLastId] = (0,external_react_.useState)(0);
@@ -5603,7 +5600,7 @@ const DialogContainer = withForwardRef(function DialogContainer({
   // Render Functions
   return /*#__PURE__*/external_react_.createElement(DialogProvider, {
     value: showDialog
-  }, children, /*#__PURE__*/external_react_.createElement(BlockMemo, {
+  }, children, /*#__PURE__*/external_react_.createElement(Block, {
     className: dialogClassName
   }, dialogs.map(d => {
     const DialogComponent = d.component;
@@ -5839,7 +5836,7 @@ const FormError = withMemo(function FormError({
   if (!error) {
     return null;
   }
-  return /*#__PURE__*/external_react_default().createElement(BlockMemo, {
+  return /*#__PURE__*/external_react_default().createElement(Block, {
     className: (formError_default()).error
   }, /*#__PURE__*/external_react_default().createElement(tmp, null, error));
 }, (formError_default()));
@@ -7478,7 +7475,7 @@ const MenuItem = withMemo(function MenuItem(_a) {
   // 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({
+  return /*#__PURE__*/external_react_default().createElement(Clickable, MenuItem_extends({
     className: classnames_default()((menu_default()).item, {
       [(menu_default()).disabled]: disabled,
       [(menu_default()).active]: active
@@ -7488,7 +7485,7 @@ const MenuItem = withMemo(function MenuItem(_a) {
     onMouseEnter: onMouseEnterInner,
     onMouseLeave: onMouseLeaveInner,
     __allowChildren: "all"
-  }), /*#__PURE__*/external_react_default().createElement(BlockMemo, {
+  }), /*#__PURE__*/external_react_default().createElement(Block, {
     className: classnames_default()((menu_default()).itemChildren)
   }, !!icon && /*#__PURE__*/external_react_default().createElement(Icon, {
     icon: icon,
@@ -7617,7 +7614,7 @@ const Menu = withMemo(withRenderBrowserOnly(function Menu({
   }
   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, {
+  }, /*#__PURE__*/external_react_.createElement(Block, {
     className: classnames_default()(className, (menu_default()).menu),
     style: Object.assign(Object.assign({}, style), {
       top: innerY,
@@ -7792,12 +7789,13 @@ var withHookController_rest = undefined && undefined.__rest || function (s, e) {
 
 
 function withHookController(Comp, onChangeProp, emptyValue = null) {
-  function WithHookComponent(_a, ref) {
+  function WithHookComponent(_a) {
     var _b, _c, _d;
     var {
-        name
+        name,
+        ref
       } = _a,
-      otherProps = withHookController_rest(_a, ["name"]);
+      otherProps = withHookController_rest(_a, ["name", "ref"]);
     const children = "children" in otherProps ? otherProps.children : undefined;
     const {
       field,
@@ -7832,7 +7830,7 @@ function withHookController(Comp, onChangeProp, emptyValue = null) {
       }), children)
     );
   }
-  return withForwardRef(WithHookComponent);
+  return withMemo(WithHookComponent);
 }
 ;// CONCATENATED MODULE: ./src/Components/FormElements/Controller/ColorInputController.ts
 
@@ -8067,7 +8065,7 @@ const MultipleFileInput = withMemo(function MultipleImageInput(_a) {
       });
     }
     // TODO style
-    return /*#__PURE__*/external_react_.createElement(BlockMemo, {
+    return /*#__PURE__*/external_react_.createElement(Block, {
       className: (fileInput_default()).previewText
     }, /*#__PURE__*/external_react_.createElement(Icon, {
       icon: free_solid_svg_icons_namespaceObject.faFile,
@@ -8081,9 +8079,9 @@ const MultipleFileInput = withMemo(function MultipleImageInput(_a) {
     className: classnames_default()((fileInput_default()).fileInput, className),
     style: style,
     "data-test-id": testId
-  }, /*#__PURE__*/external_react_.createElement(Flex_tmp, {
+  }, /*#__PURE__*/external_react_.createElement(Flex, {
     horizontal: true
-  }, !!label && /*#__PURE__*/external_react_.createElement(Grow, null, /*#__PURE__*/external_react_.createElement(tmp, null, label)), maxFiles > 1 && /*#__PURE__*/external_react_.createElement(InlineMemo, null, /*#__PURE__*/external_react_.createElement(tmp, null, value.length, "/", maxFiles))), /*#__PURE__*/external_react_.createElement(Flex_tmp, {
+  }, !!label && /*#__PURE__*/external_react_.createElement(Grow, null, /*#__PURE__*/external_react_.createElement(tmp, null, label)), maxFiles > 1 && /*#__PURE__*/external_react_.createElement(Inline, null, /*#__PURE__*/external_react_.createElement(tmp, null, value.length, "/", maxFiles))), /*#__PURE__*/external_react_.createElement(Flex, {
     horizontal: true,
     className: (fileInput_default()).previewContainer
   }, value === null || value === void 0 ? void 0 : value.map((file, index) => {
@@ -8091,13 +8089,13 @@ const MultipleFileInput = withMemo(function MultipleImageInput(_a) {
       className: (fileInput_default()).preview,
       center: true,
       key: file.src
-    }, /*#__PURE__*/external_react_.createElement(ClickableMemo, {
+    }, /*#__PURE__*/external_react_.createElement(Clickable, {
       onDrop: onDrop,
       onDragOver: onDragOver,
       onDropData: index,
       onClick: clickOnFile,
       onClickData: index
-    }, renderFile(file), showDeleteButton && /*#__PURE__*/external_react_.createElement(ClickableMemo, {
+    }, renderFile(file), showDeleteButton && /*#__PURE__*/external_react_.createElement(Clickable, {
       className: (fileInput_default()).previewRemove,
       onClick: removeFile,
       onClickData: index
@@ -8109,7 +8107,7 @@ const MultipleFileInput = withMemo(function MultipleImageInput(_a) {
       [(fileInput_default()).hidden]: value.length >= maxFiles
     }),
     center: true
-  }, /*#__PURE__*/external_react_.createElement(ClickableMemo, {
+  }, /*#__PURE__*/external_react_.createElement(Clickable, {
     className: (fileInput_default()).addFileButton,
     onDrop: onDrop,
     onDragOver: onDragOver,
@@ -8407,7 +8405,7 @@ var Input_rest = undefined && undefined.__rest || function (s, e) {
 
 
 
-const Input = withForwardRef(function Input(_a, ref) {
+const Input = withMemo(function Input(_a) {
   // Variables
   var {
       label,
@@ -8418,9 +8416,10 @@ const Input = withForwardRef(function Input(_a, ref) {
       value,
       error,
       onChangeText,
-      onEnter
+      onEnter,
+      ref
     } = _a,
-    otherProps = Input_rest(_a, ["label", "className", "style", "onKeyDown", "inline", "value", "error", "onChangeText", "onEnter"]);
+    otherProps = Input_rest(_a, ["label", "className", "style", "onKeyDown", "inline", "value", "error", "onChangeText", "onEnter", "ref"]);
   // States
   const usedValue = (0,external_react_.useMemo)(() => {
     if (otherProps.type !== "number" || typeof value === "number") {
@@ -8572,12 +8571,13 @@ var PasswordInput_rest = undefined && undefined.__rest || function (s, e) {
 
 
 
-const PasswordInput = withForwardRef(function PasswordInput(_a, ref) {
+const PasswordInput = withMemo(function PasswordInput(_a) {
   var {
       className,
-      style
+      style,
+      ref
     } = _a,
-    props = PasswordInput_rest(_a, ["className", "style"]);
+    props = PasswordInput_rest(_a, ["className", "style", "ref"]);
   // Variables
   const [isVisible, setIsVisible] = (0,external_react_.useState)(false);
   // Refs
@@ -8588,14 +8588,14 @@ const PasswordInput = withForwardRef(function PasswordInput(_a, ref) {
   // Effects
   // Other
   // Render Functions
-  return /*#__PURE__*/external_react_default().createElement(Flex_tmp, {
+  return /*#__PURE__*/external_react_default().createElement(Flex, {
     horizontal: true,
     className: classnames_default()((passwordInput_default()).passwordInput, className),
     style: style
   }, /*#__PURE__*/external_react_default().createElement(Grow, null, /*#__PURE__*/external_react_default().createElement(Input, PasswordInput_extends({}, props, {
     type: isVisible ? 'text' : 'password',
     ref: ref
-  }))), /*#__PURE__*/external_react_default().createElement(ClickableMemo, {
+  }))), /*#__PURE__*/external_react_default().createElement(Clickable, {
     onClick: toggleVisible,
     className: (passwordInput_default()).showButton,
     interactable: false
@@ -8678,7 +8678,7 @@ const Select = withMemo(function Select(_a) {
         value: option.value,
         key: (_a = option.key) !== null && _a !== void 0 ? _a : option.value
       }, option.label);
-    })), error && /*#__PURE__*/external_react_.createElement(InlineBlockMemo, {
+    })), error && /*#__PURE__*/external_react_.createElement(InlineBlock, {
       className: (select_default()).error
     }, /*#__PURE__*/external_react_.createElement(tmp, null, error)))
   );
@@ -8803,7 +8803,7 @@ var Textarea_rest = undefined && undefined.__rest || function (s, e) {
 
 
 
-const Textarea = withForwardRef(function Textarea(_a, ref) {
+const Textarea = withMemo(function Textarea(_a) {
   var {
       label,
       className,
@@ -8814,9 +8814,10 @@ const Textarea = withForwardRef(function Textarea(_a, ref) {
       onEscape,
       textareaStyles,
       containerRef,
+      ref,
       error
     } = _a,
-    otherProps = Textarea_rest(_a, ["label", "className", "style", "onKeyUp", "onChangeText", "onEnter", "onEscape", "textareaStyles", "containerRef", "error"]);
+    otherProps = Textarea_rest(_a, ["label", "className", "style", "onKeyUp", "onChangeText", "onEnter", "onEscape", "textareaStyles", "containerRef", "ref", "error"]);
   // Refs
   const innerRef = (0,external_react_.useRef)(null);
   const refSetter = useComposedRef(ref, innerRef);
@@ -8858,7 +8859,7 @@ const Textarea = withForwardRef(function Textarea(_a, ref) {
     className: (textarea_default()).textarea,
     onChange: onChange,
     ref: refSetter
-  })), error && /*#__PURE__*/external_react_.createElement(InlineBlockMemo, {
+  })), error && /*#__PURE__*/external_react_.createElement(InlineBlock, {
     className: (textarea_default()).error
   }, /*#__PURE__*/external_react_.createElement(tmp, null, error)));
 }, (textarea_default()));
@@ -9093,7 +9094,7 @@ const SearchSelectInput = withMemo(function SearchSelectInput({
     if (!option) {
       return null;
     }
-    const element = (_a = renderSelectedOption === null || renderSelectedOption === void 0 ? void 0 : renderSelectedOption(option)) !== null && _a !== void 0 ? _a : /*#__PURE__*/external_react_.createElement(InlineBlockMemo, {
+    const element = (_a = renderSelectedOption === null || renderSelectedOption === void 0 ? void 0 : renderSelectedOption(option)) !== null && _a !== void 0 ? _a : /*#__PURE__*/external_react_.createElement(InlineBlock, {
       className: (seachSelectInput_default()).tag
     }, /*#__PURE__*/external_react_.createElement(tmp, {
       size: TEXT_SIZE.xSmall
@@ -9102,7 +9103,7 @@ const SearchSelectInput = withMemo(function SearchSelectInput({
       onClick: toggleOption,
       onClickData: value
     } : {};
-    return /*#__PURE__*/external_react_.createElement(ClickableMemo, SearchSelectInput_extends({}, onClickProps, {
+    return /*#__PURE__*/external_react_.createElement(Clickable, SearchSelectInput_extends({}, onClickProps, {
       key: option.key,
       __allowChildren: "all"
     }), element);
@@ -9110,12 +9111,12 @@ const SearchSelectInput = withMemo(function SearchSelectInput({
   const renderSelectableOption = (opt, index) => {
     var _a;
     const isActive = index === selectedIndex;
-    const element = (_a = renderSelectableOptions === null || renderSelectableOptions === void 0 ? void 0 : renderSelectableOptions(opt, isActive, index, selectedIndex)) !== null && _a !== void 0 ? _a : /*#__PURE__*/external_react_.createElement(BlockMemo, {
+    const element = (_a = renderSelectableOptions === null || renderSelectableOptions === void 0 ? void 0 : renderSelectableOptions(opt, isActive, index, selectedIndex)) !== null && _a !== void 0 ? _a : /*#__PURE__*/external_react_.createElement(Block, {
       className: classnames_default()((seachSelectInput_default()).selectableOption, {
         [(seachSelectInput_default()).active]: index === selectedIndex
       })
     }, /*#__PURE__*/external_react_.createElement(tmp, null, opt.label));
-    return /*#__PURE__*/external_react_.createElement(ClickableMemo, {
+    return /*#__PURE__*/external_react_.createElement(Clickable, {
       onClick: toggleOption,
       onClickData: opt.value,
       key: opt.key,
@@ -9131,10 +9132,10 @@ const SearchSelectInput = withMemo(function SearchSelectInput({
       ref: containerRef
     }, label ? /*#__PURE__*/external_react_.createElement("span", {
       className: (seachSelectInput_default()).label
-    }, label) : null, /*#__PURE__*/external_react_.createElement(Flex_tmp, {
+    }, label) : null, /*#__PURE__*/external_react_.createElement(Flex, {
       className: (seachSelectInput_default()).inputContainer,
       horizontal: true
-    }, /*#__PURE__*/external_react_.createElement(InlineBlockMemo, null, values.map(renderOption)), /*#__PURE__*/external_react_.createElement(Grow, {
+    }, /*#__PURE__*/external_react_.createElement(InlineBlock, null, values.map(renderOption)), /*#__PURE__*/external_react_.createElement(Grow, {
       __allowChildren: "html"
     }, /*#__PURE__*/external_react_.createElement("input", {
       ref: inputRef,
@@ -9145,7 +9146,7 @@ const SearchSelectInput = withMemo(function SearchSelectInput({
       onChange: onChange,
       onKeyDown: onKeyPress,
       onFocus: onFocus
-    }))), /*#__PURE__*/external_react_.createElement(InlineBlockMemo, {
+    }))), /*#__PURE__*/external_react_.createElement(InlineBlock, {
       className: (seachSelectInput_default()).selectableOptionContainer,
       style: suggestionsPosition
     }, selectableOptions.map(renderSelectableOption)))
@@ -9253,15 +9254,13 @@ const FullScreen = withMemo(function FullScreen(_a) {
       if ('exitFullscreen' in document) {
         document.exitFullscreen();
       } else {
-        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-        // @ts-ignore
+        // @ts-expect-error this is not in the types but it exists
         document.webkitCancelFullScreen();
       }
       return;
     }
     if ('webkitRequestFullscreen' in document.body) {
-      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-      // @ts-ignore
+      // @ts-expect-error this is not in the types but it exists
       (_a = containerRef.current) === null || _a === void 0 ? void 0 : _a.webkitRequestFullscreen();
     } else {
       (_b = containerRef.current) === null || _b === void 0 ? void 0 : _b.requestFullscreen();
@@ -9380,6 +9379,7 @@ function useDelayed(callback, dependencies, delay = 100, maxDelay = undefined) {
   const argsRef = (0,external_react_.useRef)(undefined);
   const timeoutRef = (0,external_react_.useRef)(undefined);
   const mayDelayTimeoutRef = (0,external_react_.useRef)(undefined);
+  const maxDelayTimeout = (0,external_react_.useRef)(undefined);
   // eslint-disable-next-line react-hooks/exhaustive-deps
   const realCB = (0,external_react_.useCallback)(callback, dependencies);
   const func = (0,external_react_.useCallback)((...newArgs) => {
@@ -9403,7 +9403,6 @@ function useDelayed(callback, dependencies, delay = 100, maxDelay = undefined) {
       }, maxDelay);
     }
   }, [delay, maxDelay, realCB]);
-  const maxDelayTimeout = (0,external_react_.useRef)();
   return func;
 }
 ;// CONCATENATED MODULE: ./src/Components/Hooks/useDelayedEffect.ts
@@ -9533,7 +9532,7 @@ function useMousePosition() {
 function useOnMount(cb) {
   const called = (0,external_react_.useRef)(false);
   const unmountTimeout = (0,external_react_.useRef)(undefined);
-  const unmountFunc = (0,external_react_.useRef)();
+  const unmountFunc = (0,external_react_.useRef)(undefined);
   (0,external_react_.useEffect)(() => {
     clearTimeout(unmountTimeout.current);
     unmountTimeout.current = undefined;
@@ -9571,7 +9570,7 @@ function useOnce(cb, condition) {
 ;// CONCATENATED MODULE: ./src/Components/Hooks/useRerender.ts
 
 function useRerender(defaultDelay = 0) {
-  const timeoutRef = (0,external_react_.useRef)();
+  const timeoutRef = (0,external_react_.useRef)(undefined);
   const [renderCounter, updateRenderCounter] = (0,external_react_.useState)(0);
   const update = (0,external_react_.useCallback)((delay = defaultDelay) => {
     if (delay === 0) {
@@ -9635,7 +9634,7 @@ const DoubleIcon = withMemo(function DoubleIcon(_a) {
   // Effects
   // Other
   // RenderFunctions
-  return /*#__PURE__*/external_react_default().createElement(InlineBlockMemo, {
+  return /*#__PURE__*/external_react_default().createElement(InlineBlock, {
     className: (icon_default()).doubleIconContainer
   }, /*#__PURE__*/external_react_default().createElement(Icon, DoubleIcon_extends({}, otherProps, {
     color: color
@@ -9708,15 +9707,16 @@ var grid_default = /*#__PURE__*/__webpack_require__.n(grid);
 
 
 
-function Grid({
+const Grid = withMemo(function Grid({
   style,
   children,
   columns = 12,
   rows = 1,
   useContainerWidth = false,
+  ref,
   className,
   __allowChildren
-}, ref) {
+}) {
   // Variables
   const appliedStyle = (0,external_react_.useMemo)(() => Object.assign(Object.assign({}, style), {
     '--grid-columns': columns,
@@ -9729,7 +9729,7 @@ function Grid({
   // Effects
   // Other
   // Render Functions
-  return /*#__PURE__*/external_react_.createElement(BlockMemo, {
+  return /*#__PURE__*/external_react_.createElement(Block, {
     ref: ref,
     style: appliedStyle,
     className: classnames_default()((grid_default()).grid, className, {
@@ -9737,10 +9737,7 @@ function Grid({
     }),
     __allowChildren: __allowChildren
   }, children);
-}
-// Need RowMemo for autocompletion of phpstorm
-const GridMemo = withForwardRef(Grid, (grid_default()));
-
+}, (grid_default()));
 ;// CONCATENATED MODULE: ./src/Components/Layout/Grid/GridItem.tsx
 
 
@@ -9855,7 +9852,7 @@ function GridItem({
   // Effects
   // Other
   // Render Functions
-  return /*#__PURE__*/external_react_.createElement(InlineBlockMemo, {
+  return /*#__PURE__*/external_react_.createElement(InlineBlock, {
     style: style,
     className: classnames_default()(...classes.map(name => (grid_default())[name]), (grid_default()).item, className),
     __allowChildren: __allowChildren
@@ -12626,7 +12623,7 @@ function SizeCalculator({
   }, [onSize]);
   // Other
   // Render Functions
-  return /*#__PURE__*/external_react_.createElement(InlineBlockMemo, {
+  return /*#__PURE__*/external_react_.createElement(InlineBlock, {
     ref: ref,
     __allowChildren: "all",
     style: {
@@ -12645,15 +12642,16 @@ const SizeCalculatorMemo = withMemo(SizeCalculator);
 
 
 
-const List = withForwardRef(function List({
+const List = withMemo(function List({
   items,
   renderItem,
   itemHeight: initialItemHeight = 0,
   className,
   style,
   onItemsRendered,
-  autoSizeClassName
-}, ref) {
+  autoSizeClassName,
+  ref
+}) {
   // Variables
   // States
   const [itemHeight, setItemHeight] = (0,external_react_.useState)(initialItemHeight);
@@ -12856,7 +12854,7 @@ const HoverMenu = withMemo(function HoverMenu({
   // Effects
   // Other
   // RenderFunctions
-  return /*#__PURE__*/external_react_default().createElement(ClickableMemo, {
+  return /*#__PURE__*/external_react_default().createElement(Clickable, {
     onMouseEnter: open,
     onMouseLeave: close,
     useReactOnMouseLeave: true,
@@ -12892,7 +12890,7 @@ const MenuDivider = withMemo(function MenuDivider() {
   // Effects
   // Other
   // RenderFunctions
-  return /*#__PURE__*/external_react_default().createElement(BlockMemo, {
+  return /*#__PURE__*/external_react_default().createElement(Block, {
     className: (menu_default()).divider
   });
 }, (menu_default()));
@@ -12963,7 +12961,7 @@ const Submenu = withMemo(function Submenu({
   // RenderFunctions
   return /*#__PURE__*/external_react_default().createElement(MenuCloseContextProvider, {
     value: closeAllMenus
-  }, /*#__PURE__*/external_react_default().createElement(ClickableMemo, {
+  }, /*#__PURE__*/external_react_default().createElement(Clickable, {
     onMouseEnter: recalculateSubmenuPosition,
     onMouseLeave: closeSubmenu,
     className: classnames_default()((menu_default()).item, (menu_default()).submenu, {
@@ -12973,7 +12971,7 @@ const Submenu = withMemo(function Submenu({
       [(menu_default()).disabled]: disabled
     }, className),
     style: style
-  }, /*#__PURE__*/external_react_default().createElement(Flex_tmp, {
+  }, /*#__PURE__*/external_react_default().createElement(Flex, {
     ref: submenuRef,
     className: classnames_default()((menu_default()).itemChildren),
     horizontal: true
@@ -12983,7 +12981,7 @@ const Submenu = withMemo(function Submenu({
     className: (menu_default()).icon
   }), /*#__PURE__*/external_react_default().createElement(Grow, null, /*#__PURE__*/external_react_default().createElement(tmp, null, label)), /*#__PURE__*/external_react_default().createElement(Icon, {
     icon: free_solid_svg_icons_namespaceObject.faChevronRight
-  })), /*#__PURE__*/external_react_default().createElement(BlockMemo, {
+  })), /*#__PURE__*/external_react_default().createElement(Block, {
     className: (menu_default()).container,
     __allowChildren: "all",
     ref: containerRef
@@ -13086,7 +13084,7 @@ function Spoiler(_a) {
   }, title) : title;
   // Render Functions
   const icon = (open !== null && open !== void 0 ? open : isOpen) ? closeIcon : openIcon;
-  return /*#__PURE__*/external_react_.createElement(ClickableMemo, {
+  return /*#__PURE__*/external_react_.createElement(Clickable, {
     onClick: onlyTitleToggles ? undefined : toggleOpen,
     className: classnames_default()(className, (spoiler_default()).spoiler, {
       [(spoiler_default()).open]: open !== null && open !== void 0 ? open : isOpen,
@@ -13094,18 +13092,18 @@ function Spoiler(_a) {
       [(spoiler_default()).noClosingAnimation]: noClosingAnimation
     }),
     style: style
-  }, /*#__PURE__*/external_react_.createElement(ClickableMemo, {
+  }, /*#__PURE__*/external_react_.createElement(Clickable, {
     onClick: toggleOpen
-  }, /*#__PURE__*/external_react_.createElement(Flex_tmp, {
+  }, /*#__PURE__*/external_react_.createElement(Flex, {
     horizontal: true
   }, /*#__PURE__*/external_react_.createElement(Grow, {
     __allowChildren: "all"
   }, titleComponent), icon ? /*#__PURE__*/external_react_.createElement(Icon, {
     icon: icon,
     className: (spoiler_default()).icon
-  }) : null)), /*#__PURE__*/external_react_.createElement(BlockMemo, {
+  }) : null)), /*#__PURE__*/external_react_.createElement(Block, {
     className: (spoiler_default()).bodyContainer
-  }, /*#__PURE__*/external_react_.createElement(BlockMemo, {
+  }, /*#__PURE__*/external_react_.createElement(Block, {
     __allowChildren: "all",
     className: (spoiler_default()).body
   }, children)));
@@ -13163,7 +13161,7 @@ function SpoilerList({
   // Effects
   // Other
   // Render Functions
-  return /*#__PURE__*/external_react_.createElement(BlockMemo, {
+  return /*#__PURE__*/external_react_.createElement(Block, {
     className: classnames_default()(className),
     style: style
   }, data.map(item => /*#__PURE__*/external_react_.createElement(SpoilerMemo, SpoilerList_extends({
@@ -13254,7 +13252,7 @@ function getButtonComponents(buttons, activeTab, onSelect) {
       active: isActive,
       onClickData: index,
       onClick: onSelect
-    }, /*#__PURE__*/external_react_.createElement(InlineMemo, null, button.icon ? /*#__PURE__*/external_react_.createElement(Icon, {
+    }, /*#__PURE__*/external_react_.createElement(Inline, null, button.icon ? /*#__PURE__*/external_react_.createElement(Icon, {
       icon: button.icon,
       className: (tabBar_default()).buttonIcon
     }) : null, button.title ? /*#__PURE__*/external_react_.createElement(tmp, {
@@ -13480,13 +13478,13 @@ function Toast(_a) {
   }
   let actionElement = null;
   if ('onClick' in otherProps) {
-    actionElement = /*#__PURE__*/external_react_.createElement(ClickableMemo, Toast_extends({
+    actionElement = /*#__PURE__*/external_react_.createElement(Clickable, Toast_extends({
       className: (toast_default()).action
     }, otherProps, {
       __allowChildren: "all"
     }), otherProps.actionName);
   }
-  return /*#__PURE__*/external_react_.createElement(ClickableMemo, {
+  return /*#__PURE__*/external_react_.createElement(Clickable, {
     style: style,
     className: classnames_default()((toast_default()).toast, {
       [(toast_default()).hiding]: hidingStart > 0
@@ -13773,19 +13771,19 @@ function TopBar(_a) {
   }), /*#__PURE__*/external_react_.createElement(Container, {
     fluid: "xxl",
     className: (topBar_default()).container
-  }, /*#__PURE__*/external_react_.createElement(Flex_tmp, {
+  }, /*#__PURE__*/external_react_.createElement(Flex, {
     grow: true,
     className: classnames_default()((topBar_default()).buttonContainer, (topBar_default()).left),
     horizontal: true
-  }, leftButtonComponents), /*#__PURE__*/external_react_.createElement(BlockMemo, {
+  }, leftButtonComponents), /*#__PURE__*/external_react_.createElement(Block, {
     className: (topBar_default()).titleContainer
   }, /*#__PURE__*/external_react_.createElement(tmp, {
     className: (topBar_default()).title
-  }, title)), /*#__PURE__*/external_react_.createElement(Flex_tmp, {
+  }, title)), /*#__PURE__*/external_react_.createElement(Flex, {
     grow: true,
     className: classnames_default()((topBar_default()).buttonContainer, (topBar_default()).right),
     horizontal: true
-  }, rightButtonComponents), hiddenButtons.length > 0 && isHiddenMenuOpen ? /*#__PURE__*/external_react_.createElement(InlineMemo, {
+  }, rightButtonComponents), hiddenButtons.length > 0 && isHiddenMenuOpen ? /*#__PURE__*/external_react_.createElement(Inline, {
     className: (topBar_default()).hiddenContainer
   }, /*#__PURE__*/external_react_.createElement(View, {
     "aria-hidden": true,
@@ -13793,7 +13791,7 @@ function TopBar(_a) {
     onClick: toggleHiddenMenu
   }), /*#__PURE__*/external_react_.createElement(View, {
     className: (topBar_default()).hiddenMenu
-  }, hiddenButtonComponents)) : null, /*#__PURE__*/external_react_.createElement(ActionSheetMemo, {
+  }, hiddenButtonComponents)) : null, /*#__PURE__*/external_react_.createElement(ActionSheet, {
     actions: actions,
     ref: actionSheetRef,
     className: (topBar_default()).hiddenActionMenu,
@@ -13953,7 +13951,6 @@ function nonEmptyString(str, other = Characters.NBSP) {
 
 
 
-
 
 
 })();
@@ -14084,7 +14081,6 @@ exports.useToast = __webpack_exports__.useToast;
 exports.useWindow = __webpack_exports__.useWindow;
 exports.useWindowDimensions = __webpack_exports__.useWindowDimensions;
 exports.useYupResolver = __webpack_exports__.useYupResolver;
-exports.withForwardRef = __webpack_exports__.withForwardRef;
 exports.withHookController = __webpack_exports__.withHookController;
 exports.withMemo = __webpack_exports__.withMemo;
 exports.withRenderBrowserOnly = __webpack_exports__.withRenderBrowserOnly;