ywana-core8 0.0.236 → 0.0.240

package/dist/index.umd.js

@@ -896,7 +896,7 @@
 
     var borderStyle = outlined ? "textfield-outlined" : "textfield";
     var labelStyle = label ? "" : "no-label";
-    var style = labelStyle + " " + borderStyle;
+    var style = labelStyle + " " + borderStyle + " textfield-" + type;
     var labelTxt = /*#__PURE__*/React__default["default"].createElement(Text$1, null, label);
     return /*#__PURE__*/React__default["default"].createElement("div", {
       className: "" + style,
@@ -920,6 +920,78 @@
       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
    */
@@ -933,8 +1005,8 @@
         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],
@@ -965,7 +1037,7 @@
     }
 
     function toggle() {
-      if (site) {
+      if (site && site.changeFocus) {
         site.changeFocus({
           lose: function lose() {
             setOpen(false);
@@ -4830,6 +4902,7 @@
 
     function renderGroupLabel(groupName) {
       var grouper = schema[groupBy];
+      if (!groupName || !grouper) return "";
 
       if (grouper.options) {
         var options = CHECK['isFunction'](grouper.options) ? grouper.options() : grouper.options;
@@ -4837,7 +4910,7 @@
           return option.value === groupName;
         });
         console.log(groupName, options, option);
-        return option.label ? option.label : groupName + "LABEL NOT FOUND ";
+        return option ? option.label : groupName;
       } else {
         return groupName;
       }
@@ -4912,8 +4985,8 @@
         return /*#__PURE__*/React__default["default"].createElement(React.Fragment, {
           key: groupName
         }, /*#__PURE__*/React__default["default"].createElement(Header, {
-          title: groupName
-        }, renderGroupLabel(groupName), /*#__PURE__*/React__default["default"].createElement("span", {
+          title: renderGroupLabel(groupName)
+        }, /*#__PURE__*/React__default["default"].createElement("span", {
           className: "size"
         }, groupSize)), /*#__PURE__*/React__default["default"].createElement(DataTable, _extends({}, table, {
           onRowSelection: select,
@@ -5484,6 +5557,7 @@
   exports.TablePage = TablePage;
   exports.Tabs = Tabs;
   exports.Text = Text$1;
+  exports.TextArea = TextArea;
   exports.TextField = TextField;
   exports.Thumbnail = Thumbnail;
   exports.TokenField = TokenField;