ywana-core8 0.0.239 → 0.0.240

package/dist/index.cjs

@@ -923,6 +923,78 @@ var TextField = function TextField(props) {
     className: "bar"
   }), label ? /*#__PURE__*/React__default["default"].createElement("label", null, labelTxt) : null);
 };
+/**
+ * Text Area
+ */
+
+var TextArea = function TextArea(props) {
+  var site = React.useContext(SiteContext);
+  var id = props.id,
+      _props$type2 = props.type,
+      type = _props$type2 === void 0 ? 'text' : _props$type2,
+      label = props.label,
+      placeholder = props.placeholder,
+      value = props.value,
+      _props$readOnly2 = props.readOnly,
+      readOnly = _props$readOnly2 === void 0 ? false : _props$readOnly2,
+      _props$canClear2 = props.canClear,
+      canClear = _props$canClear2 === void 0 ? true : _props$canClear2,
+      onChange = props.onChange,
+      onEnter = props.onEnter,
+      onClick = props.onClick;
+
+  function onKeyPress(event) {
+    var key = event.charCode ? event.charCode : event.keyCode ? event.keyCode : 0;
+
+    if (key == 13) {
+      if (onEnter) onEnter();
+    }
+  }
+
+  function change(event) {
+    event.stopPropagation();
+    event.preventDefault();
+    var value = event.target.value;
+    if (onChange) onChange(id, value);
+  }
+
+  function focus() {
+    if (site) {
+      site.changeFocus({
+        lose: function lose() {// DO NOTHING
+        }
+      });
+    }
+  }
+
+  function clear() {
+    if (onChange) onChange(id, "");
+  }
+
+  var labelStyle = label ? "" : "no-label";
+  var style = "textarea " + labelStyle + " textarea-" + type;
+  var labelTxt = /*#__PURE__*/React__default["default"].createElement(Text$1, null, label);
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "" + style,
+    onClick: onClick
+  }, /*#__PURE__*/React__default["default"].createElement("textarea", {
+    id: id,
+    placeholder: placeholder,
+    value: value,
+    required: true,
+    onChange: change,
+    onKeyDown: onKeyPress,
+    onFocus: focus,
+    readOnly: readOnly
+  }), !readOnly && canClear && value && value.length > 0 ? /*#__PURE__*/React__default["default"].createElement(Icon, {
+    icon: "close",
+    clickable: true,
+    size: "small",
+    action: clear
+  }) : null, /*#__PURE__*/React__default["default"].createElement("span", {
+    className: "bar"
+  }), label ? /*#__PURE__*/React__default["default"].createElement("label", null, labelTxt) : null);
+};
 /**
  * Dropdown
  */
@@ -936,8 +1008,8 @@ var DropDown = function DropDown(props) {
       onChange = props.onChange,
       _props$canFilter = props.canFilter,
       canFilter = _props$canFilter === void 0 ? false : _props$canFilter,
-      _props$readOnly2 = props.readOnly,
-      readOnly = _props$readOnly2 === void 0 ? false : _props$readOnly2;
+      _props$readOnly3 = props.readOnly,
+      readOnly = _props$readOnly3 === void 0 ? false : _props$readOnly3;
 
   var _useState = React.useState(false),
       open = _useState[0],
@@ -5488,6 +5560,7 @@ exports.TabbedContentEditor = TabbedContentEditor;
 exports.TablePage = TablePage;
 exports.Tabs = Tabs;
 exports.Text = Text$1;
+exports.TextArea = TextArea;
 exports.TextField = TextField;
 exports.Thumbnail = Thumbnail;
 exports.TokenField = TokenField;