ywana-core8 0.0.353 → 0.0.356

package/dist/index.cjs

@@ -639,7 +639,9 @@ var MenuIcon = function MenuIcon(props) {
   var _props$icon = props.icon,
       icon = _props$icon === void 0 ? "more_vert" : _props$icon,
       children = props.children,
-      align = props.align;
+      align = props.align,
+      _props$size = props.size,
+      size = _props$size === void 0 ? "normal" : _props$size;
 
   var _useState = React.useState(false),
       open = _useState[0],
@@ -655,6 +657,7 @@ var MenuIcon = function MenuIcon(props) {
     className: "menu-icon"
   }, /*#__PURE__*/React__default["default"].createElement(Icon, {
     icon: icon,
+    size: size,
     clickable: true,
     action: toggle
   }), open ? /*#__PURE__*/React__default["default"].createElement("menu", {
@@ -3105,6 +3108,7 @@ var Site = function Site(_ref3) {
       logo = _ref3.logo,
       title = _ref3.title,
       toolbar = _ref3.toolbar,
+      footer = _ref3.footer,
       children = _ref3.children,
       init = _ref3.init,
       min = _ref3.min,
@@ -3126,7 +3130,7 @@ var Site = function Site(_ref3) {
     init: init
   }, children, /*#__PURE__*/React__default["default"].createElement(Page, {
     id: "EMPTY"
-  }, "EMPTY")), /*#__PURE__*/React__default["default"].createElement(SiteAside, null), /*#__PURE__*/React__default["default"].createElement(SiteConsole, null), /*#__PURE__*/React__default["default"].createElement(SiteDialog, null), /*#__PURE__*/React__default["default"].createElement(SitePromptDialog, null), /*#__PURE__*/React__default["default"].createElement(SitePreview, null), /*#__PURE__*/React__default["default"].createElement(SiteNotifications, null)));
+  }, "EMPTY")), /*#__PURE__*/React__default["default"].createElement(SiteAside, null), /*#__PURE__*/React__default["default"].createElement(SiteConsole, null), /*#__PURE__*/React__default["default"].createElement(SiteDialog, null), /*#__PURE__*/React__default["default"].createElement(SitePromptDialog, null), /*#__PURE__*/React__default["default"].createElement(SitePreview, null), /*#__PURE__*/React__default["default"].createElement(SiteNotifications, null), /*#__PURE__*/React__default["default"].createElement(SiteFooter, null, footer)));
 };
 
 var SiteNotifications = function SiteNotifications() {
@@ -3156,6 +3160,16 @@ var SiteToolBar = function SiteToolBar(_ref4) {
   React.useContext(SiteContext);
   return /*#__PURE__*/React__default["default"].createElement("nav", null, children);
 };
+/**
+ * Site Footer
+ */
+
+
+var SiteFooter = function SiteFooter(_ref5) {
+  var children = _ref5.children;
+  React.useContext(SiteContext);
+  return /*#__PURE__*/React__default["default"].createElement("footer", null, children);
+};
 /**
  * Site Aside
  */
@@ -3170,10 +3184,10 @@ var SiteAside = function SiteAside() {
  */
 
 
-var SiteMenu = function SiteMenu(_ref5) {
-  var title = _ref5.title,
-      children = _ref5.children,
-      min = _ref5.min;
+var SiteMenu = function SiteMenu(_ref6) {
+  var title = _ref6.title,
+      children = _ref6.children,
+      min = _ref6.min;
   var context = React.useContext(SiteContext);
   var page = context.page,
       sideNav = context.sideNav,
@@ -3219,11 +3233,11 @@ var SiteMenu = function SiteMenu(_ref5) {
       key: title
     }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: "section-title " + style
-    }, sideNav === "max" ? title : ''), sections[title].map(function (_ref6) {
-      var id = _ref6.id,
-          _ref6$icon = _ref6.icon,
-          icon = _ref6$icon === void 0 ? 'info' : _ref6$icon,
-          title = _ref6.title;
+    }, sideNav === "max" ? title : ''), sections[title].map(function (_ref7) {
+      var id = _ref7.id,
+          _ref7$icon = _ref7.icon,
+          icon = _ref7$icon === void 0 ? 'info' : _ref7$icon,
+          title = _ref7.title;
       var styleItem = id === page ? 'selected' : '';
       return /*#__PURE__*/React__default["default"].createElement("div", {
         className: "site-menu-item " + styleItem,
@@ -3253,9 +3267,9 @@ var SiteMenu = function SiteMenu(_ref5) {
  */
 
 
-var SitePage = function SitePage(_ref7) {
-  var children = _ref7.children,
-      init = _ref7.init;
+var SitePage = function SitePage(_ref8) {
+  var children = _ref8.children,
+      init = _ref8.init;
   var context = React.useContext(SiteContext);
   var page = context.page;
   React.useEffect(function () {
@@ -3453,6 +3467,94 @@ var UploadDialog = function UploadDialog(_ref) {
   }));
 };
 
+/**
+ * File Explorer
+ */
+
+var FileExplorer = function FileExplorer(props) {
+  var _props$files = props.files,
+      files = _props$files === void 0 ? [] : _props$files;
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "file-explorer"
+  }, /*#__PURE__*/React__default["default"].createElement("header", null, "header"), /*#__PURE__*/React__default["default"].createElement("nav", null, "nav"), /*#__PURE__*/React__default["default"].createElement("menu", null, "menu"), /*#__PURE__*/React__default["default"].createElement("main", null, /*#__PURE__*/React__default["default"].createElement(FileIconsView, {
+    files: files
+  })), /*#__PURE__*/React__default["default"].createElement("aside", null), /*#__PURE__*/React__default["default"].createElement("footer", null, "footer"));
+};
+/**
+ * File Icons View
+ */
+
+var FileIconsView = function FileIconsView(props) {
+  var _props$files2 = props.files,
+      files = _props$files2 === void 0 ? [] : _props$files2,
+      onSelect = props.onSelect;
+
+  var _useState = React.useState(),
+      selected = _useState[0],
+      setSelected = _useState[1];
+
+  function select(id) {
+    setSelected(id);
+    if (onSelect) onSelect(id);
+  }
+
+  function isSelected(id) {
+    return selected === id;
+  }
+
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "file-view file-view--icons"
+  }, files.map(function (file) {
+    return /*#__PURE__*/React__default["default"].createElement(FileIcon, {
+      file: file,
+      onSelect: select,
+      selected: isSelected(file.id)
+    });
+  }));
+};
+/**
+ * File Icon
+ */
+
+var FileIcon = function FileIcon(props) {
+  var _props$file = props.file,
+      file = _props$file === void 0 ? {} : _props$file,
+      _props$selected = props.selected,
+      selected = _props$selected === void 0 ? false : _props$selected,
+      onSelect = props.onSelect;
+  var id = file.id,
+      icon = file.icon,
+      label = file.label,
+      _file$actions = file.actions,
+      actions = _file$actions === void 0 ? [] : _file$actions,
+      _file$src = file.src,
+      src = _file$src === void 0 ? "https://findicons.com/files/icons/2813/flat_jewels/256/file.png" : _file$src,
+      footer = file.footer;
+
+  function select() {
+    if (onSelect && !selected) onSelect(id);
+  }
+
+  var style = selected ? 'file-icon--selected' : '';
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "file-icon " + style,
+    onClick: select
+  }, /*#__PURE__*/React__default["default"].createElement("header", null, icon ? /*#__PURE__*/React__default["default"].createElement(Icon, {
+    size: "small",
+    icon: icon
+  }) : null, /*#__PURE__*/React__default["default"].createElement(MenuIcon, {
+    size: "small"
+  }, actions.map(function (action) {
+    return /*#__PURE__*/React__default["default"].createElement(MenuItem, {
+      icon: action.icon,
+      label: action.label,
+      onSelect: action.execute
+    });
+  }))), /*#__PURE__*/React__default["default"].createElement("picture", null, /*#__PURE__*/React__default["default"].createElement("img", {
+    src: src
+  })), /*#__PURE__*/React__default["default"].createElement("main", null, /*#__PURE__*/React__default["default"].createElement("label", null, label)), footer ? /*#__PURE__*/React__default["default"].createElement("footer", null, footer) : null);
+};
+
 /**
  * Content Form 
  */
@@ -6085,6 +6187,8 @@ exports.DropDown = DropDown;
 exports.EditContentDialog = EditContentDialog;
 exports.FORMATS = FORMATS;
 exports.FieldEditor = FieldEditor;
+exports.FileExplorer = FileExplorer;
+exports.FileIconsView = FileIconsView;
 exports.Form = Form;
 exports.HTTPClient = HTTPClient;
 exports.Header = Header;