@commercetools-uikit/localized-multiline-text-input 13.0.2 → 13.0.3

package/dist/commercetools-uikit-localized-multiline-text-input.cjs.prod.js

@@ -9,17 +9,13 @@ var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/in
 var _Object$getOwnPropertyDescriptors = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors');
 var _Object$defineProperties = require('@babel/runtime-corejs3/core-js-stable/object/define-properties');
 var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/object/define-property');
-require('@babel/runtime-corejs3/helpers/taggedTemplateLiteral');
 var _slicedToArray = require('@babel/runtime-corejs3/helpers/slicedToArray');
 var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
+require('prop-types');
 var _reduceInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/reduce');
 var _Object$keys = require('@babel/runtime-corejs3/core-js-stable/object/keys');
 var _mapInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/map');
-require('@babel/runtime-corejs3/core-js-stable/instance/concat');
 var react$1 = require('react');
-require('prop-types');
-require('react-required-if');
-require('common-tags');
 var reactIntl = require('react-intl');
 var react = require('@emotion/react');
 var hooks = require('@commercetools-uikit/hooks');
@@ -76,14 +72,14 @@ var getTextareaStyles = function getTextareaStyles(props) {
   return baseStyles;
 };
 
-var getLanguageLabelStyles = function getLanguageLabelStyles(props, theme) {
+var getLanguageLabelStyles = function getLanguageLabelStyles(_props, theme) {
   var overwrittenVars = _objectSpread$3(_objectSpread$3({}, designSystem.customProperties), theme);
 
   return /*#__PURE__*/react.css("flex:1 0 auto;color:", overwrittenVars[designSystem.designTokens.fontColorForInputWhenDisabled], ";line-height:calc(", designSystem.customProperties.sizeHeightInput, " - 2 * ", designSystem.customProperties.borderRadius1, ");background-color:", overwrittenVars[designSystem.designTokens.backgroundColorForInputWhenDisabled], ";border-top-left-radius:", overwrittenVars[designSystem.designTokens.borderRadiusForInput], ";border-bottom-left-radius:", overwrittenVars[designSystem.designTokens.borderRadiusForInput], ";border:1px ", overwrittenVars[designSystem.designTokens.borderColorForInputWhenDisabled], " solid;padding:0 ", designSystem.customProperties.spacingS, ";transition:border-color ", designSystem.customProperties.transitionStandard, ",background-color ", designSystem.customProperties.transitionStandard, ",color ", designSystem.customProperties.transitionStandard, ";border-right:0;box-shadow:none;appearance:none;" + ("" ), "" );
 };
 
 var ToggleButtonWrapper = _styled__default["default"]("div", {
-  target: "ed3jgad0"
+  target: "e1yehb270"
 } )({
   name: "ejz79s",
   styles: "flex:0;display:flex"
@@ -94,21 +90,21 @@ function ownKeys$2(object, enumerableOnly) { var keys = _Object$keys__default["d
 function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$2(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$2(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } return target; }
 
 var LeftColumn = _styled__default["default"]("div", {
-  target: "ecub1e22"
+  target: "eepo5hu2"
 } )({
   name: "82a6rk",
   styles: "flex:1"
 } );
 
 var RightColumn = _styled__default["default"]("div", {
-  target: "ecub1e21"
+  target: "eepo5hu1"
 } )({
   name: "1m04uhl",
   styles: "position:relative;flex:0;display:flex;align-items:flex-start"
 } );
 
 var Row = _styled__default["default"]("div", {
-  target: "ecub1e20"
+  target: "eepo5hu0"
 } )({
   name: "skgbeu",
   styles: "display:flex;justify-content:flex-end"
@@ -143,13 +139,13 @@ var TranslationInput = function TranslationInput(props) {
     //
     // eslint-disable-next-line no-param-reassign
     event.target.language = props.language;
-    onChange(event);
+    onChange === null || onChange === void 0 ? void 0 : onChange(event);
   }, [onChange, props.language]);
   var onFocus = props.onFocus,
       onToggle = props.onToggle;
   var handleFocus = react$1.useCallback(function () {
     // Expand the input on focus
-    if (props.isCollapsed) onToggle();
+    if (props.isCollapsed) onToggle === null || onToggle === void 0 ? void 0 : onToggle();
     if (onFocus) onFocus();
   }, [props.isCollapsed, onFocus, onToggle]); // This checks if the content in the textarea overflows the minimum
   // amount of lines it should have when collapsed
@@ -166,6 +162,9 @@ var TranslationInput = function TranslationInput(props) {
   */
   !props.isCollapsed && contentExceedsShownRows && !props.hasLanguagesControl || props.error || props.warning;
   var theme = react.useTheme();
+
+  if (!props.isReadOnly) ;
+
   return jsxRuntime.jsxs(Stack__default["default"], {
     scale: "xs",
     children: [jsxRuntime.jsxs("div", {
@@ -178,7 +177,6 @@ var TranslationInput = function TranslationInput(props) {
           children: props.language.toUpperCase()
         })
       }), jsxRuntime.jsx(inputUtils.MultilineInput, _objectSpread$2({
-        theme: theme,
         id: props.id,
         name: props.name,
         autoComplete: props.autoComplete,
@@ -236,8 +234,8 @@ var TranslationInput = function TranslationInput(props) {
   });
 };
 
-TranslationInput.displayName = 'TranslationInput';
-TranslationInput.propTypes = {}; // The minimum ammount of rows the MultilineTextInput will show.
+TranslationInput.propTypes = {};
+TranslationInput.displayName = 'TranslationInput'; // The minimum ammount of rows the MultilineTextInput will show.
 // When the input is closed, this is used as the maximum row count as well
 // so that the input "collapses".
 
@@ -259,7 +257,7 @@ var RequiredValueErrorMessage$1 = RequiredValueErrorMessage;
 
 function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); enumerableOnly && (symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context4, _context5; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty__default["default"](_context4 = ownKeys(Object(source), !0)).call(_context4, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)) : _forEachInstanceProperty__default["default"](_context5 = ownKeys(Object(source))).call(_context5, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context3, _context4; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty__default["default"](_context3 = ownKeys(Object(source), !0)).call(_context3, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)) : _forEachInstanceProperty__default["default"](_context4 = ownKeys(Object(source))).call(_context4, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } return target; }
 
 var expandedTranslationsReducer = function expandedTranslationsReducer(state, action) {
   switch (action.type) {
@@ -333,7 +331,15 @@ var LocalizedMultilineTextInput = function LocalizedMultilineTextInput(props) {
     }
   }
 
+  var onLocalizedInputToggle = react$1.useCallback(function () {
+    return toggleLanguages();
+  }, [toggleLanguages]);
   var shouldRenderLanguagesButton = languages.length > 1 && !props.hideLanguageExpansionControls;
+
+  if (!props.isReadOnly) ;
+
+  if (props.hideLanguageExpansionControls) ;
+
   return jsxRuntime.jsx(Constraints__default["default"].Horizontal, {
     max: props.horizontalConstraint,
     children: jsxRuntime.jsxs(Stack__default["default"], {
@@ -374,7 +380,7 @@ var LocalizedMultilineTextInput = function LocalizedMultilineTextInput(props) {
         css: _ref,
         children: jsxRuntime.jsx(inputUtils.LocalizedInputToggle, {
           isOpen: areLanguagesOpened,
-          onClick: toggleLanguages,
+          onClick: onLocalizedInputToggle,
           isDisabled: areLanguagesOpened && Boolean(hasErrorInRemainingLanguages || hasWarningInRemainingLanguages),
           remainingLocalizations: languages.length - 1
         })
@@ -383,9 +389,9 @@ var LocalizedMultilineTextInput = function LocalizedMultilineTextInput(props) {
   });
 };
 
+LocalizedMultilineTextInput.propTypes = {};
 LocalizedMultilineTextInput.displayName = 'LocalizedMultilineTextInput';
 LocalizedMultilineTextInput.RequiredValueErrorMessage = RequiredValueErrorMessage$1;
-LocalizedMultilineTextInput.propTypes = {};
 LocalizedMultilineTextInput.getId = localizedUtils.getId;
 LocalizedMultilineTextInput.getName = localizedUtils.getName;
 LocalizedMultilineTextInput.defaultProps = {
@@ -398,7 +404,7 @@ LocalizedMultilineTextInput.isTouched = localizedUtils.isTouched;
 var LocalizedMultilineTextInput$1 = LocalizedMultilineTextInput;
 
 // NOTE: This string will be replaced on build time with the package version.
-var version = "13.0.2";
+var version = "13.0.3";
 
 exports["default"] = LocalizedMultilineTextInput$1;
 exports.version = version;