ywana-core8 0.0.67 → 0.0.71

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ywana-core8",
-  "version": "0.0.67",
+  "version": "0.0.71",
   "description": "ywana-core8",
   "author": "Ernesto Roldan Garcia",
   "license": "MIT",

package/src/domain/ContentEditor.js

@@ -143,7 +143,7 @@ export const TreededContentEditor = ({ content, filter, onChange }) => {
         </header>
         <Tree>
           {nodes.map((node, index) => (
-            <TreeNode icon="folder" label={node.label} actions={[<Icon small icon="add" clickable action={add} />]}>
+            <TreeNode icon="folder" label={node.label} actions={[<Icon size="small" icon="add" clickable action={add} />]}>
               {
                 value[node.id] ? value[node.id].map((field, index) => <TreeItem icon={field.icon || "description"} label={field.name || field.label} onSelect={() => select(index, field, node)} />) : null
               }
@@ -362,7 +362,7 @@ export const CollectionEditor = ({ field, value = [], onChange }) => {
     ...item,
     id: index,
     actions: [
-      <Icon icon='delete' clickable action={() => remove(index)} small />
+      <Icon icon='delete' clickable action={() => remove(index)} size="small" />
     ]
   }))
 

package/src/domain/TablePage.js

@@ -376,7 +376,6 @@ const TableAPI = (url) => {
                             param = param.concat(`${key}=${item}&`)
                             return param
                         }, "")
-                        console.log(param)
                         return query.concat(param)
                     } else {
                         return query.concat(`${key}=%${filters[key]}%&`)

package/src/html/list.css

@@ -13,7 +13,6 @@
 }
 
 .list > ul {
-  flex: 1;
   overflow: auto;
   list-style: none;
   margin: 0;
@@ -24,7 +23,7 @@
 }
 
 .list > ul li {
-  flex: 1;
+  flex: 0;
   overflow: hidden;
   min-height: 3rem;
   padding: .3rem 0.5rem;

package/src/html/tab.js

@@ -22,7 +22,7 @@ export const Tabs = (props) => {
   })
 
   return (
-    <div class="tabs">
+    <div className="tabs">
       {tabs}
       <div className="tab-filler" />
     </div>

package/src/html/tree.css

@@ -10,7 +10,6 @@
 
 .tree-item{
     margin: 0;
-    padding: .5rem 0;
     display: flex;
     align-items: center;
     font: 1rem;

package/src/widgets/avatar/Avatar.css

@@ -0,0 +1,11 @@
+.avatar {
+    background-color: rgba(200,200,200,.1);
+    border: solid 3px transparent;
+    border-radius: 100%;
+    overflow: hidden;
+}
+
+.avatar.small {
+    width: 3rem;
+    height: 3rem;
+}

package/src/widgets/avatar/Avatar.js

@@ -0,0 +1,24 @@
+import React from 'react'
+import './Avatar.css'
+
+/**
+ * Avatar
+ */
+export const Avatar = (props) => {
+
+    const { id, name, className, src, size="small", clickable=false, action} = props
+
+    function click() {
+        if (clickable) {
+            action(id)
+        }
+    }
+
+    const clickableStyle = clickable ? 'clickable' : ''
+    const style = `avatar ${size} ${clickableStyle} ${className}`
+    return (
+        <div className={style} onClick={click}>
+            { src ? <img src={src} /> : <span>{name}</span>}
+        </div>
+    )
+}

package/src/widgets/index.js

@@ -1,4 +1,5 @@
 export * from './login/LoginBox'
 export * from './login/ResetPasswordBox'
 export * from './viewer/Viewer'
-export * from './kanban/Kanban'
+export * from './kanban/Kanban'
+export * from './avatar/avatar'