@ainias42/react-bootstrap-mobile 0.1.20 → 0.1.22

package/dist/bootstrapReactMobile.js

@@ -1,6 +1,6 @@
 /*!
  * 
- *   @ainias42/react-bootstrap-mobile v0.1.19
+ *   @ainias42/react-bootstrap-mobile v0.1.21
  *   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
@@ -271,7 +271,7 @@ class DateHelper {
 exports.DateHelper = DateHelper;
 DateHelper.FORMAT = {
     ISO_TIME: "%Y-%m-%dT%H:%M:%S",
-    GERMAN: "%d.%m-%y %H:%M:%S"
+    GERMAN: "%d.%m.%y %H:%M:%S"
 };
 //# sourceMappingURL=DateHelper.js.map
 
@@ -1496,10 +1496,11 @@ 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__ylsuY{width:100%}.input__ylsuY .label__Uty0i{display:block;font-weight:bold}.input__ylsuY .text__OJDZ5{width:100%;background-color:rgba(0,0,0,0);border:0;outline:none;padding:0;font-size:1rem}.material-design .input__ylsuY .text__OJDZ5{color:#212121;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__ylsuY .text__OJDZ5:read-only,.material-design .input__ylsuY .text__OJDZ5:read-only:focus{background-image:none;border-bottom:1px solid rgba(0,0,0,0)}.material-design .input__ylsuY .text__OJDZ5:focus{background-image:linear-gradient(var(--flavor-accent), var(--flavor-accent)),linear-gradient(to top, transparent 1px, #afafaf 1px)}.flat-design .input__ylsuY .text__OJDZ5{color:#1f1f21}.flat-design .input__ylsuY .text__OJDZ5,.flat-design .input__ylsuY .text__OJDZ5:focus{border-bottom:1px solid var(--border-light)}.input__ylsuY.hiddenInput__KSMQB .text__OJDZ5{background-image:none;border-bottom:1px solid rgba(0,0,0,0)}.input__ylsuY.hiddenInput__KSMQB.noFocusHint__bBtc8 .text__OJDZ5:focus{background-image:none;border-bottom:1px solid rgba(0,0,0,0)}`, "",{"version":3,"sources":["webpack://./src/Components/FormElements/Input/input.scss","webpack://./src/scss/_designMixin.scss"],"names":[],"mappings":"AAGA,cACE,UAAA,CAEA,4BACE,aAAA,CACA,gBAAA,CAGF,2BACE,UAAA,CACA,8BAAA,CACA,QAAA,CACA,YAAA,CACA,SAAA,CACA,cAAA,CCbS,4CDgBP,aAAA,CACA,sEAAA,CACA,wBAAA,CACA,2BAAA,CACA,iCAAA,CACA,kBAAA,CAEA,kHACE,qBAAA,CACA,qCAAA,CAGF,kDACE,kIAAA,CC7BK,wCDmCP,aAAA,CACA,sFACE,2CAAA,CAMJ,8CACE,qBAAA,CACA,qCAAA,CAKE,uEACE,qBAAA,CACA,qCAAA","sourcesContent":["@import \"../../../scss/variables\";\n@import \"../../../scss/designMixin\";\n\n.input {\n  width: 100%;\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    font-size: 1rem;\n\n    @include design($material) {\n      color: #212121;\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      &:read-only, &:read-only:focus {\n        background-image: none;\n        border-bottom: 1px solid transparent;\n      }\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      color: #1f1f21;\n      &, &:focus {\n        border-bottom: 1px solid var(--border-light);\n      }\n    }\n  }\n\n  &.hiddenInput {\n    .text {\n      background-image: none;\n      border-bottom: 1px solid transparent;\n    }\n\n    &.noFocusHint {\n      .text {\n        &:focus {\n          background-image: none;\n          border-bottom: 1px solid transparent;\n        }\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, `.input__ylsuY{width:100%}.input__ylsuY.inline__CuO0B{--basis: 50%;display:flex}.input__ylsuY.inline__CuO0B .label__Uty0i{display:inline-block;flex-grow:1;flex-shrink:0;flex-basis:var(--basis);font-weight:normal}.input__ylsuY.inline__CuO0B .text__OJDZ5{min-width:41px}.input__ylsuY .label__Uty0i{display:block;font-weight:bold}.input__ylsuY .text__OJDZ5{width:100%;background-color:rgba(0,0,0,0);border:0;outline:none;padding:0;font-size:1rem}.material-design .input__ylsuY .text__OJDZ5{color:#212121;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__ylsuY .text__OJDZ5:read-only,.material-design .input__ylsuY .text__OJDZ5:read-only:focus{background-image:none;border-bottom:1px solid rgba(0,0,0,0)}.material-design .input__ylsuY .text__OJDZ5:focus{background-image:linear-gradient(var(--flavor-accent), var(--flavor-accent)),linear-gradient(to top, transparent 1px, #afafaf 1px)}.flat-design .input__ylsuY .text__OJDZ5{color:#1f1f21}.flat-design .input__ylsuY .text__OJDZ5,.flat-design .input__ylsuY .text__OJDZ5:focus{border-bottom:1px solid var(--border-light)}.input__ylsuY.hiddenInput__KSMQB .text__OJDZ5{background-image:none;border-bottom:1px solid rgba(0,0,0,0)}.input__ylsuY.hiddenInput__KSMQB.noFocusHint__bBtc8 .text__OJDZ5:focus{background-image:none;border-bottom:1px solid rgba(0,0,0,0)}`, "",{"version":3,"sources":["webpack://./src/Components/FormElements/Input/input.scss","webpack://./src/scss/_designMixin.scss"],"names":[],"mappings":"AAGA,cACE,UAAA,CAEA,4BACE,YAAA,CACA,YAAA,CACA,0CACE,oBAAA,CACA,WAAA,CACA,aAAA,CACA,uBAAA,CACA,kBAAA,CAEF,yCAEE,cAAA,CAIJ,4BACE,aAAA,CACA,gBAAA,CAGF,2BACE,UAAA,CACA,8BAAA,CACA,QAAA,CACA,YAAA,CACA,SAAA,CACA,cAAA,CC7BS,4CDgCP,aAAA,CACA,sEAAA,CACA,wBAAA,CACA,2BAAA,CACA,iCAAA,CACA,kBAAA,CAEA,kHACE,qBAAA,CACA,qCAAA,CAGF,kDACE,kIAAA,CC7CK,wCDmDP,aAAA,CACA,sFACE,2CAAA,CAMJ,8CACE,qBAAA,CACA,qCAAA,CAKE,uEACE,qBAAA,CACA,qCAAA","sourcesContent":["@import \"../../../scss/variables\";\n@import \"../../../scss/designMixin\";\n\n.input {\n  width: 100%;\n\n  &.inline {\n    --basis: 50%;\n    display: flex;\n    .label {\n      display: inline-block;\n      flex-grow: 1;\n      flex-shrink: 0;\n      flex-basis: var(--basis);\n      font-weight: normal;\n    }\n    .text {\n      // 3 numbers\n      min-width: 41px;\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    font-size: 1rem;\n\n    @include design($material) {\n      color: #212121;\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      &:read-only, &:read-only:focus {\n        background-image: none;\n        border-bottom: 1px solid transparent;\n      }\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      color: #1f1f21;\n      &, &:focus {\n        border-bottom: 1px solid var(--border-light);\n      }\n    }\n  }\n\n  &.hiddenInput {\n    .text {\n      background-image: none;\n      border-bottom: 1px solid transparent;\n    }\n\n    &.noFocusHint {\n      .text {\n        &:focus {\n          background-image: none;\n          border-bottom: 1px solid transparent;\n        }\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 = {
 	"input": `input__ylsuY`,
+	"inline": `inline__CuO0B`,
 	"label": `label__Uty0i`,
 	"text": `text__OJDZ5`,
 	"hiddenInput": `hiddenInput__KSMQB`,
@@ -9669,7 +9670,7 @@ __webpack_require__.d(__webpack_exports__, {
   TabBarButton: () => (/* reexport */ TabBarButtonMemo),
   Table: () => (/* reexport */ Table_tmp),
   Text: () => (/* reexport */ tmp),
-  Textarea: () => (/* reexport */ TextareaMemo),
+  Textarea: () => (/* reexport */ Textarea),
   Toast: () => (/* reexport */ ToastMemo),
   ToastContainer: () => (/* reexport */ ToastContainerMemo),
   TopBar: () => (/* reexport */ TopBarMemo),
@@ -9894,12 +9895,13 @@ function Clickable(_a, ref) {
       children,
       style,
       href,
+      target,
       interactable = true,
       preventDefault = false,
       stopPropagation = true,
       useReactOnMouseLeave = false
     } = _a,
-    clickData = Clickable_rest(_a, ["className", "children", "style", "href", "interactable", "preventDefault", "stopPropagation", "useReactOnMouseLeave"]);
+    clickData = Clickable_rest(_a, ["className", "children", "style", "href", "target", "interactable", "preventDefault", "stopPropagation", "useReactOnMouseLeave"]);
   // States
   // Refs
   const clickableRef = useComposedRef(ref);
@@ -10039,6 +10041,7 @@ function Clickable(_a, ref) {
   // Render Functions
   const props = {
     style,
+    target,
     role: interactable ? 'button' : undefined,
     'aria-hidden': interactable ? undefined : true,
     className: classnames_default()((clickable_default()).clickable, className),
@@ -22915,10 +22918,11 @@ const MultipleFileInput = withMemo(function MultipleImageInput(_a) {
   }), [onNewFiles]);
   const onDragOver = (0,external_react_.useCallback)(e => e.preventDefault(), []);
   const clickOnFile = (0,external_react_.useCallback)((_, index) => {
-    if (!allowOverride || !inputRef.current) {
+    if (index !== undefined && !allowOverride || !inputRef.current) {
       return;
     }
     indexRef.current = index;
+    console.log("LOG-d inputRef dispatch", inputRef.current);
     inputRef.current.dispatchEvent(new MouseEvent("click"));
   }, [allowOverride]);
   // Effects
@@ -23080,9 +23084,10 @@ const Input = withForwardRef(function Input(_a, ref) {
       style,
       onEnter,
       onKeyDown,
+      inline = false,
       onChangeText
     } = _a,
-    otherProps = Input_rest(_a, ["label", "className", "style", "onEnter", "onKeyDown", "onChangeText"]);
+    otherProps = Input_rest(_a, ["label", "className", "style", "onEnter", "onKeyDown", "inline", "onChangeText"]);
   // States
   // Refs
   const innerRef = useComposedRef(ref);
@@ -23110,7 +23115,9 @@ const Input = withForwardRef(function Input(_a, ref) {
     /*#__PURE__*/
     // eslint-disable-next-line jsx-a11y/label-has-associated-control
     external_react_.createElement("label", {
-      className: classnames_default()((input_default()).input, className),
+      className: classnames_default()((input_default()).input, {
+        [(input_default()).inline]: inline
+      }, className),
       style: style
     }, label ? /*#__PURE__*/external_react_.createElement("span", {
       className: (input_default()).label
@@ -23582,21 +23589,28 @@ var Textarea_rest = undefined && undefined.__rest || function (s, e) {
 
 
 
-function Textarea(_a) {
-  // Variables
+
+
+const Textarea = withForwardRef(function Textarea(_a, ref) {
   var {
       label,
       className,
       style,
       onKeyUp,
       onChangeText,
-      onEnter
+      onEnter,
+      onEscape,
+      textareaStyles,
+      containerRef
     } = _a,
-    otherProps = Textarea_rest(_a, ["label", "className", "style", "onKeyUp", "onChangeText", "onEnter"]);
-  // States
+    otherProps = Textarea_rest(_a, ["label", "className", "style", "onKeyUp", "onChangeText", "onEnter", "onEscape", "textareaStyles", "containerRef"]);
   // Refs
+  const innerRef = useComposedRef(ref);
+  // Variables
+  // States
   // Callbacks
-  const onChangeWithData = useListener('onChange', otherProps);
+  const [onChangeWithData, otherPropsWithoutOnchange] = useListenerWithExtractedProps('onChange', otherProps);
+  const [onChangeDone, otherPropsWithoutData] = useListenerWithExtractedProps('onChangeDone', otherPropsWithoutOnchange);
   const onChange = (0,external_react_.useCallback)(e => {
     if (onChangeText) {
       onChangeText(e.target.value);
@@ -23610,24 +23624,28 @@ function Textarea(_a) {
     if (onEnter && e.key === 'Enter' && !e.defaultPrevented) {
       onEnter(e.target.value);
     }
-  }, [onEnter, onKeyUp]);
+    if (onEscape && e.key === 'Escape' && !e.defaultPrevented) {
+      onEscape(e.target.value);
+    }
+  }, [onEnter, onEscape, onKeyUp]);
   // Effects
+  useOnChangeDone(onChangeDone, innerRef);
   // Other
   // Render Functions
   return /*#__PURE__*/external_react_.createElement("label", {
     className: classnames_default()((textarea_default()).container, className),
-    style: style
+    style: style,
+    ref: containerRef
   }, label ? /*#__PURE__*/external_react_.createElement("span", {
     className: (textarea_default()).label
-  }, label) : null, /*#__PURE__*/external_react_.createElement("textarea", Textarea_extends({}, otherProps, {
+  }, label) : null, /*#__PURE__*/external_react_.createElement("textarea", Textarea_extends({}, otherPropsWithoutData, {
+    style: textareaStyles,
     onKeyUp: realOnKeyPress,
     className: (textarea_default()).textarea,
-    onChange: onChange
+    onChange: onChange,
+    ref: innerRef
   })));
-}
-// Need TextareaMemo for autocompletion of phpstorm
-const TextareaMemo = withMemo(Textarea, (textarea_default()));
-
+}, (textarea_default()));
 ;// CONCATENATED MODULE: ./src/Components/FullScreen/FullScreen.tsx
 var FullScreen_rest = undefined && undefined.__rest || function (s, e) {
   var t = {};