ywana-core8 0.0.905 → 0.0.907

package/dist/index.cjs

@@ -3020,29 +3020,120 @@ var Viewer = function Viewer(_ref) {
  */
 var Kanban = function Kanban(_ref) {
   var children = _ref.children;
+  React.useMemo(function () {
+    var found = React__default["default"].Children.map(children, function (child) {
+      if (child.type.name === KanbanSwimlane.name) {
+        return child;
+      }
+    });
+    return found.length > 0;
+  });
   return /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "kanban"
+    className: "kanban with-swimlanes"
   }, children);
 };
+var KanbanHeader = function KanbanHeader(props) {
+  var columns = props.columns;
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "kanban-header"
+  }, columns.map(function (column, index) {
+    var icon = column.icon,
+      title = column.title,
+      subtitle = column.subtitle,
+      badge = column.badge;
+    return /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "kanban-column",
+      key: index
+    }, /*#__PURE__*/React__default["default"].createElement("header", null, /*#__PURE__*/React__default["default"].createElement(Icon, {
+      icon: icon
+    }), /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "title"
+    }, /*#__PURE__*/React__default["default"].createElement(Text, {
+      use: "headline6"
+    }, title), /*#__PURE__*/React__default["default"].createElement(Text, {
+      className: "secondary-text",
+      use: "body2"
+    }, subtitle)), /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "badge"
+    }, badge)));
+  }));
+};
+var KanbanSwimlane = function KanbanSwimlane(_ref2) {
+  var icon = _ref2.icon,
+    title = _ref2.title,
+    subtitle = _ref2.subtitle,
+    badge = _ref2.badge,
+    children = _ref2.children;
+  var _useState = React.useState(true),
+    unfold = _useState[0],
+    setUnfold = _useState[1];
+
+  // cahnge all children headless prop to true
+  // if there is only one child
+  if (children.length === 1) {
+    children = React__default["default"].cloneElement(children, {
+      headless: true
+    });
+  } else {
+    children = React__default["default"].Children.map(children, function (child) {
+      return React__default["default"].cloneElement(child, {
+        headless: true
+      });
+    });
+  }
+
+  // log al children headless prop
+  children.forEach(function (child) {
+    console.log(child.props.headless);
+  });
+  function toggle() {
+    setUnfold(!unfold);
+  }
+  var toggleIcon = unfold ? "unfold_less" : "unfold_more";
+  var toggleStyle = unfold ? "unfold" : "fold";
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "kanban-swimlane"
+  }, /*#__PURE__*/React__default["default"].createElement("header", null, /*#__PURE__*/React__default["default"].createElement(Icon, {
+    icon: icon,
+    size: "small"
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "title"
+  }, /*#__PURE__*/React__default["default"].createElement(Text, {
+    use: "headline6"
+  }, title, ":"), /*#__PURE__*/React__default["default"].createElement(Text, {
+    className: "secondary-text",
+    use: "body2"
+  }, subtitle)), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "badge"
+  }, badge), /*#__PURE__*/React__default["default"].createElement(Icon, {
+    icon: toggleIcon,
+    clickable: true,
+    action: toggle
+  })), /*#__PURE__*/React__default["default"].createElement("main", {
+    className: toggleStyle
+  }, children));
+};
 
 /**
  * Kanban Column
  */
-var KanbanColumn = function KanbanColumn(_ref2) {
-  var id = _ref2.id,
-    actions = _ref2.actions,
-    icon = _ref2.icon,
-    title = _ref2.title,
-    subtitle = _ref2.subtitle,
-    badge = _ref2.badge,
-    children = _ref2.children,
-    _ref2$minified = _ref2.minified,
-    minified = _ref2$minified === void 0 ? false : _ref2$minified,
-    _ref2$disabled = _ref2.disabled,
-    disabled = _ref2$disabled === void 0 ? false : _ref2$disabled;
-  var _useState = React.useState(minified),
-    min = _useState[0],
-    setMin = _useState[1];
+var KanbanColumn = function KanbanColumn(_ref3) {
+  var id = _ref3.id,
+    actions = _ref3.actions,
+    _ref3$headless = _ref3.headless,
+    headless = _ref3$headless === void 0 ? false : _ref3$headless,
+    icon = _ref3.icon,
+    title = _ref3.title,
+    subtitle = _ref3.subtitle,
+    badge = _ref3.badge,
+    children = _ref3.children,
+    _ref3$minified = _ref3.minified,
+    minified = _ref3$minified === void 0 ? false : _ref3$minified,
+    _ref3$disabled = _ref3.disabled,
+    disabled = _ref3$disabled === void 0 ? false : _ref3$disabled;
+  var _useState2 = React.useState(minified),
+    min = _useState2[0],
+    setMin = _useState2[1];
   function toggle() {
     setMin(!min);
   }
@@ -3055,7 +3146,7 @@ var KanbanColumn = function KanbanColumn(_ref2) {
     action: toggle
   }))) : /*#__PURE__*/React__default["default"].createElement("div", {
     className: "kanban-column " + id + " " + (disabled ? 'disabled' : '')
-  }, /*#__PURE__*/React__default["default"].createElement("header", null, /*#__PURE__*/React__default["default"].createElement(Icon, {
+  }, headless ? "" : /*#__PURE__*/React__default["default"].createElement("header", null, /*#__PURE__*/React__default["default"].createElement(Icon, {
     icon: icon
   }), /*#__PURE__*/React__default["default"].createElement("div", {
     className: "title"
@@ -3077,10 +3168,10 @@ var KanbanColumn = function KanbanColumn(_ref2) {
 /**
  * Kanban Card
  */
-var KanbanCard = function KanbanCard(_ref3) {
-  var className = _ref3.className,
-    color = _ref3.color,
-    children = _ref3.children;
+var KanbanCard = function KanbanCard(_ref4) {
+  var className = _ref4.className,
+    color = _ref4.color,
+    children = _ref4.children;
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "kanban-card " + className + " " + color
   }, children);
@@ -4450,7 +4541,7 @@ var FileExplorerView = function FileExplorerView(props) {
   var folder = folders.find(function (folder) {
     return folder.id === selectedFolder;
   });
-  var folderTitle = folder ? /*#__PURE__*/React__default["default"].createElement(Text, null, "folder.title") : '';
+  var folderTitle = folder ? /*#__PURE__*/React__default["default"].createElement(Text, null, folder.title) : '';
   function switchView() {
     setView(view === 'grid' ? 'list' : 'grid');
   }
@@ -4555,7 +4646,6 @@ var FilesGridView = function FilesGridView(props) {
     label: "Delete",
     action: onDelete
   });
-  console.log(actions);
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: "files-grid"
   }, files.map(function (file) {
@@ -11269,6 +11359,8 @@ exports.ImageViewer = ImageViewer;
 exports.Kanban = Kanban;
 exports.KanbanCard = KanbanCard;
 exports.KanbanColumn = KanbanColumn;
+exports.KanbanHeader = KanbanHeader;
+exports.KanbanSwimlane = KanbanSwimlane;
 exports.LinearProgress = LinearProgress;
 exports.List = List;
 exports.ListEditor = ListEditor;