@pedidopago/ui 1.1.4 → 1.1.5

package/dist/components/TextAreaInput/index.d.ts

@@ -1,5 +1,5 @@
-import { FC } from 'react';
+/// <reference types="react" />
 import { ITextAreaInputProps } from './types';
-declare const TextAreaInput: FC<ITextAreaInputProps>;
+declare const TextAreaInput: import("react").ForwardRefExoticComponent<ITextAreaInputProps & import("react").RefAttributes<HTMLTextAreaElement>>;
 export default TextAreaInput;
 //# sourceMappingURL=index.d.ts.map

package/dist/components/TextAreaInput/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/TextAreaInput/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAY,MAAM,OAAO,CAAC;AAGrC,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAE9C,QAAA,MAAM,aAAa,EAAE,EAAE,CAAC,mBAAmB,CA2B1C,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/TextAreaInput/index.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAE9C,QAAA,MAAM,aAAa,qHA0ClB,CAAC;AAGF,eAAe,aAAa,CAAC"}

package/dist/components/TextAreaInput/index.js

@@ -11,7 +11,7 @@ var _styles = require("./styles");
 
 var _jsxRuntime = require("react/jsx-runtime");
 
-var _excluded = ["label", "isInvalid", "alertType", "isDisabled", "helpText", "maxWidth", "height"];
+var _excluded = ["label", "isInvalid", "alertType", "isDisabled", "helpText", "maxWidth", "height", "value", "onChange"];
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -35,7 +35,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
-var TextAreaInput = function TextAreaInput(_ref) {
+var TextAreaInput = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var label = _ref.label,
       isInvalid = _ref.isInvalid,
       alertType = _ref.alertType,
@@ -43,33 +43,41 @@ var TextAreaInput = function TextAreaInput(_ref) {
       helpText = _ref.helpText,
       maxWidth = _ref.maxWidth,
       height = _ref.height,
+      value = _ref.value,
+      onChange = _ref.onChange,
       args = _objectWithoutProperties(_ref, _excluded);
 
-  var _useState = (0, _react.useState)(''),
+  var _useState = (0, _react.useState)(),
       _useState2 = _slicedToArray(_useState, 2),
       textValue = _useState2[0],
       setTextValue = _useState2[1];
 
+  (0, _react.useEffect)(function () {
+    setTextValue(value);
+  }, [value]);
+
+  function handleOnChange(event) {
+    setTextValue(event.target.value);
+  }
+
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Wrapper, {
     maxWidth: maxWidth,
     height: height,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.TextArea, _objectSpread(_objectSpread({
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.TextArea, _objectSpread({
       isInvalid: isInvalid,
       alertType: alertType,
       disabled: isDisabled,
       value: textValue,
-      onChange: function onChange(_ref2) {
-        var target = _ref2.target;
-        return setTextValue(target.value);
-      }
-    }, args), args.formRegister)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Label, {
+      onChange: onChange !== null && onChange !== void 0 ? onChange : handleOnChange,
+      ref: ref
+    }, args)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Label, {
       children: label
     }), isInvalid && helpText && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.HelpText, {
       alertType: alertType,
       children: helpText
     })]
   });
-};
-
+});
+TextAreaInput.displayName = 'TextAreaInput';
 var _default = TextAreaInput;
 exports.default = _default;

package/dist/components/TextAreaInput/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/TextAreaInput/styles.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAE/C,eAAO,MAAM,OAAO;;;gIAOnB,CAAC;AAEF,eAAO,MAAM,KAAK;;;yIAYjB,CAAC;AAEF,eAAO,MAAM,QAAQ;;;kJAyIpB,CAAC;AAEF,eAAO,MAAM,QAAQ;;;kIAKpB,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/TextAreaInput/styles.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAE/C,eAAO,MAAM,OAAO;;;gIAOnB,CAAC;AAEF,eAAO,MAAM,KAAK;;;yIAYjB,CAAC;AAEF,eAAO,MAAM,QAAQ;;;kJA0IpB,CAAC;AAEF,eAAO,MAAM,QAAQ;;;kIAKpB,CAAC"}

package/dist/components/TextAreaInput/styles.js

@@ -43,7 +43,10 @@ var TextArea = _styled.default.textarea(_templateObject5 || (_templateObject5 =
   var placeholder = _ref5.placeholder,
       value = _ref5.value,
       theme = _ref5.theme;
-  return !placeholder && !value ? (0, _react.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n          &:focus + label {\n            padding: 0px 8px;\n            background-color: ", ";\n            top: -10px;\n            left: 16px;\n            color: ", ";\n          }\n        "])), theme.colorMode === 'light' ? theme.colors.neutral.white : theme.colors.neutral.black, theme.colorMode === 'light' ? theme.colors.neutral.neutral5 : theme.colors.neutral.neutral3) : (0, _react.css)(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n          & + label {\n            padding: 0px 8px;\n            background-color: ", ";\n            top: -10px;\n            left: 16px;\n            bottom: auto;\n            color: ", ";\n          }\n        "])), theme.colorMode === 'light' ? theme.colors.neutral.white : theme.colors.neutral.black, theme.colorMode === 'light' ? theme.colors.neutral.neutral5 : theme.colors.neutral.neutral3);
+  return !placeholder && !value ? (0, _react.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n          &:focus + label {\n            padding: 0px 8px;\n            background-color: ", ";\n            top: -10px;\n            left: 16px;\n            color: ", ";\n          }\n        "])), theme.colorMode === 'light' ? theme.colors.neutral.white : theme.colors.neutral.black, theme.colorMode === 'light' ? theme.colors.neutral.neutral5 : theme.colors.neutral.neutral3) : (0, _react.css)(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n          & + label {\n            padding: 0px 8px;\n            background-color: ", ";\n             top: -6px;\n            left: 16px;\n            bottom: auto;\n            color: ", ";\n        "])), theme.colorMode === 'light' ? theme.colors.neutral.white : theme.colors.neutral.black, {
+    dark: theme.colors.neutral.neutral1,
+    light: theme.colors.neutral.neutral4
+  }[theme.colorMode]);
 });
 
 exports.TextArea = TextArea;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pedidopago/ui",
-  "version": "1.1.4",
+  "version": "1.1.5",
   "description": "Quick build beatiful Pedido Pago apps",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",