ywana-core8 0.0.191 → 0.0.192

package/package.json

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

package/src/domain/ContentViewer.js

@@ -0,0 +1,51 @@
+import React from 'react'
+import { Property } from '../html'
+import { TYPES } from './ContentType'
+
+/**
+ * Content Viewer
+ * 
+ * @param {*} props 
+ * @returns 
+ */
+export const ContentViewer = (props) => {
+
+    const { content, field } = props
+
+    if (!content) return <div>No Content...</div>
+
+    const sections = content.sections()
+
+    return (
+        <div className="content-viewer">
+            {sections.map(section => {
+                const { title, fields } = section
+                return (
+                    <section key={title}>
+                        <header>
+                            {title}
+                        </header>
+                        <main>
+                            { fields.map( field => <FieldViewer key={field.id} field={field} value={content[field.id]} />)}
+                        </main>
+                    </section>
+                )
+            })}
+        </div>
+    )
+}
+
+const FieldViewer = (props) => {
+
+    const { field, value } = props
+    const { id, type, item, label } = field
+
+    console.log('FieldViewer', field, value)
+    
+    switch(type) {
+        case TYPES.STRING:
+            return <Property label={label} value={value} />
+        default:
+            return <div>{label}</div>
+    }
+}

package/src/domain/TablePage.js

@@ -145,7 +145,7 @@ const TableRowEditor = (props) => {
                 <Icon icon="close" clickable action={onClose} />
             </Header>
             <main>
-                { editable ? <ContentEditor content={content} onChange={onChange} filter={filter} /> : <ContentViewer content={content} />
+                { editable ? <ContentEditor content={content} onChange={onChange} filter={filter} /> : <ContentViewer content={content} /> }
             </main>
         </div>
     )