ywana-core8 0.0.16 → 0.0.20

package/package.json

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

package/publish.sh

@@ -1,3 +1,4 @@
+npm run build
 git add --all
 git commit -m $0
 git push

package/src/domain/CollectionPage.js

@@ -5,7 +5,7 @@ import { PageContext } from '../site'
 import { Button, Header, Icon, List, Menu, MenuIcon, MenuItem, Text, Tree, TreeItem, TreeNode } from '../html'
 import { Content } from './ContentType'
 import { ContentEditor, TabbedContentEditor, TreededContentEditor } from './ContentEditor'
-import { EditContentDialog } from './EditContentDialog'
+import { CreateContentDialog } from './CreateContentDialog_old'
 import { SiteContext } from '../site/siteContext'
 import "./CollectionPage.css"
 
@@ -37,7 +37,7 @@ export const CollectionPage = (props) => {
             await pageContext.create(form);
             setPageContext(Object.assign({}, pageContext))
         }
-        site.openDialog(<EditContentDialog label={`Crear ${name}`} type={schema} onOK={onOK} />);
+        site.openDialog(<CreateContentDialog label={`${name}`} type={schema} onOK={onOK} />);
     }
 
     return (

package/src/domain/CreateContentDialog.js

@@ -1,59 +1,55 @@
-import React, { Fragment, useContext, useMemo, useState } from 'react';
-import { Button, Text } from '../html';
-import { Dialog } from '../site/dialog'
-import { SiteContext } from '../site/siteContext';
-import { ContentForm } from './ContentForm';
-import { Content } from './ContentType';
+import React, { Fragment, useState, useContext, useMemo } from 'react';
+import { Dialog } from '../site'
+import { SiteContext } from '../site/siteContext'
+import { Text, Button } from '../html';
+import { Content } from './ContentType'
+import { ContentEditor } from './ContentEditor'
 
 /**
  * Create Content Dialog
  */
-export const CreateContentDialog = ({ label, type, validator, onOK, onError, onActionClose = true }) => {
+export const CreateContentDialog = ({ label, type, value = {}, filter, validator, onOK, onError }) => {
 
     const site = useContext(SiteContext);
-    const [form, setForm] = useState({})
+    const [form, setForm] = useState(value)
     const [isValid, setValid] = useState(false)
     const [errors, setErrors] = useState([])
 
-    function change(form, validForm) {
+    function change(form) {
         setForm(form)
         if (validator) {
             const { validation, errors = [] } = validator(form)
-            setValid(validForm && validation)
-            setErrors(errors) 
+            setValid(validation)
+            setErrors(errors)
         } else {
-            setValid(validForm)
+            setValid(true)
         }
     }
-    
+
     function onAction(action) {
-        if (action === 'OK' && onOK) onOK(form)
-        if (action === 'CLOSE' || onActionClose === true) site.closeDialog();
-    }
-    
-    function isRequired(field) {
-        const { required = false } = field
-        return required 
+        if (action === 'OK' && onOK) onOK(Object.assign({}, value, form))
+        site.closeDialog();
     }
 
-    function isOptional(field) {
-        const { creation = false } = field
-        return creation
+    function createFilter(field, content) {
+        return field.required === true || field.optional === true
+        // TODO: execute props.filter
     }
-    
+
     const actions = (
         <Fragment>
-            <Button label="CLOSE" action={() => onAction("CLOSE")}/>
+            <Button label="CLOSE" action={() => onAction("CLOSE")} />
+            <div className="expand" />
             <Button label="OK" action={() => onAction("OK")} disabled={!isValid} raised />
         </Fragment>
     )
-    
-   const title = <Text use="headline6">{label}</Text>
-   const content = new Content(type, form)
+
+    const title = <Text use="headline6">{label}</Text>
+    const content = new Content(type, form)
     return (
         <Dialog title={title} open={true} onAction={onAction} actions={actions}>
-            <ContentForm content={content} filter={(field) => isRequired(field) || isOptional(field)} onChange={change} />
-            { errors.map ( error => <Text use="overline" tag="div" className="error">{error}</Text> )}
+            <ContentEditor content={content} onChange={change} filter={createFilter} />
+            {errors.map(error => <Text use="overline" tag="div" className="error">{error}</Text>)}
         </Dialog>
     )
 }

package/src/domain/CreateContentDialog_old.js

@@ -0,0 +1,59 @@
+import React, { Fragment, useContext, useMemo, useState } from 'react';
+import { Button, Text } from '../html';
+import { Dialog } from '../site/dialog'
+import { SiteContext } from '../site/siteContext';
+import { ContentForm } from './ContentForm';
+import { Content } from './ContentType';
+
+/**
+ * Create Content Dialog
+ */
+export const CreateContentDialog = ({ label, type, validator, onOK, onError, onActionClose = true }) => {
+
+    const site = useContext(SiteContext);
+    const [form, setForm] = useState({})
+    const [isValid, setValid] = useState(false)
+    const [errors, setErrors] = useState([])
+
+    function change(form, validForm) {
+        setForm(form)
+        if (validator) {
+            const { validation, errors = [] } = validator(form)
+            setValid(validForm && validation)
+            setErrors(errors) 
+        } else {
+            setValid(validForm)
+        }
+    }
+    
+    function onAction(action) {
+        if (action === 'OK' && onOK) onOK(form)
+        if (action === 'CLOSE' || onActionClose === true) site.closeDialog();
+    }
+    
+    function isRequired(field) {
+        const { required = false } = field
+        return required 
+    }
+
+    function isOptional(field) {
+        const { creation = false } = field
+        return creation
+    }
+    
+    const actions = (
+        <Fragment>
+            <Button label="CLOSE" action={() => onAction("CLOSE")}/>
+            <Button label="OK" action={() => onAction("OK")} disabled={!isValid} raised />
+        </Fragment>
+    )
+    
+   const title = <Text use="headline6">{label}</Text>
+   const content = new Content(type, form)
+    return (
+        <Dialog title={title} open={true} onAction={onAction} actions={actions}>
+            <ContentForm content={content} filter={(field) => isRequired(field) || isOptional(field)} onChange={change} />
+            { errors.map ( error => <Text use="overline" tag="div" className="error">{error}</Text> )}
+        </Dialog>
+    )
+}

package/src/domain/TablePage.js

@@ -2,8 +2,6 @@ import equal from 'deep-equal'
 import React, { Fragment, useContext, useEffect, useMemo, useRef, useState } from 'react'
 import { EditContentDialog } from '.'
 import { Content, ContentEditor, HTTPClient, PageContext, Session, SiteContext } from '..'
-import { SCENARIO1 } from '../../dev/scenario1'
-import { BuildGroupOptions } from '../../pages/kinds/options'
 import { Button, DataTable, DropDown, Header, Icon, MenuIcon, MenuItem, Text } from '../html'
 import "./TablePage.css"
 
@@ -15,7 +13,7 @@ const http = HTTPClient(window.API || process.env.REACT_APP_API, Session);
 export const TablePage = (props) => {
 
     const site = useContext(SiteContext)
-    const { id = "table", icon, title, name = "table 1", schema, url, field, delay = 1000, actions, editable, canAdd = true, dev = true, autosave = true, groupBy, validator, scenario } = props
+    const { id = "table", icon, title, name = "table 1", schema, url, field, delay = 1000, actions, editable, canAdd = true, dev = false, autosave = true, groupBy, validator, scenario } = props
     const [pageContext, setPageContext] = useContext(PageContext)
     const { selected } = pageContext
     const timer = useRef(null)
@@ -66,7 +64,7 @@ export const TablePage = (props) => {
     async function playScenario() {
         const promises1 = pageContext.all.map(async item => await pageContext.remove(item.id))
         Promise.all(promises1).then(async () => {
-            const promises2 = SCENARIO1.map(async (item) => await pageContext.create(item))
+            const promises2 = scenario.map(async (item) => await pageContext.create(item))
             Promise.all(promises2).then(async () => {
                 await pageContext.load()
                 setPageContext(Object.assign({}, pageContext))
@@ -266,10 +264,16 @@ const TableEditor = (props) => {
 
     table.columns.push({ id: "actions" })
 
+    function buildGroupOptions(schema) {
+        return Object.values(schema)
+            .filter(field => field.grouper === true)
+            .map(field => ({ label: field.label, value: field.id }))
+    }
+
     return (
         <Fragment>
             <Header icon={icon} title={<Text>{title}</Text>}>
-                <DropDown id="groupBy" label="Agrupar Por" value={groupBy} options={BuildGroupOptions(schema)} onChange={changeGroup} />
+                <DropDown id="groupBy" label="Agrupar Por" value={groupBy} options={buildGroupOptions(schema)} onChange={changeGroup} />
             </Header>
             <main className="table-editor">
                 {renderGroups()}

package/src/domain/index.js

@@ -4,3 +4,4 @@ export { ContentEditor, TabbedContentEditor, CollectionEditor, TreededContentEdi
 export { CreateContentDialog } from './CreateContentDialog'
 export { EditContentDialog } from './EditContentDialog'
 export { CollectionPage, CollectionContext } from './CollectionPage'
+export { TablePage } from './TablePage'

package/src/css/fonts.css

@@ -1,162 +0,0 @@
-/* hebrew */
-@font-face {
-  font-family: 'Assistant';
-  font-style: normal;
-  font-weight: 200;
-  font-display: swap;
-  src: url(../fonts/Assistant-ExtraLight.ttf) format('woff2');
-  unicode-range: U+0590-05FF, U+20AA, U+25CC, U+FB1D-FB4F;
-}
-/* latin-ext */
-@font-face {
-  font-family: 'Assistant';
-  font-style: normal;
-  font-weight: 200;
-  font-display: swap;
-  src: url(../fonts/Assistant-ExtraLight.ttf) format('woff2');
-  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-/* latin */
-@font-face {
-  font-family: 'Assistant';
-  font-style: normal;
-  font-weight: 200;
-  font-display: swap;
-  src: url(../fonts/Assistant-ExtraLight.ttf) format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-/* hebrew */
-@font-face {
-  font-family: 'Assistant';
-  font-style: normal;
-  font-weight: 300;
-  font-display: swap;
-  src: url(../fonts/Assistant-Light.ttf) format('woff2');
-  unicode-range: U+0590-05FF, U+20AA, U+25CC, U+FB1D-FB4F;
-}
-/* latin-ext */
-@font-face {
-  font-family: 'Assistant';
-  font-style: normal;
-  font-weight: 300;
-  font-display: swap;
-  src: url(../fonts/Assistant-Light.ttf) format('woff2');
-  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-/* latin */
-@font-face {
-  font-family: 'Assistant';
-  font-style: normal;
-  font-weight: 300;
-  font-display: swap;
-  src: url(../fonts/Assistant-Light.ttf) format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-/* hebrew */
-@font-face {
-  font-family: 'Assistant';
-  font-style: normal;
-  font-weight: 400;
-  font-display: swap;
-  src: url(../fonts/Assistant-Medium.ttf) format('woff2');
-  unicode-range: U+0590-05FF, U+20AA, U+25CC, U+FB1D-FB4F;
-}
-/* latin-ext */
-@font-face {
-  font-family: 'Assistant';
-  font-style: normal;
-  font-weight: 400;
-  font-display: swap;
-  src: url(../fonts/Assistant-Medium.ttf) format('woff2');
-  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-/* latin */
-@font-face {
-  font-family: 'Assistant';
-  font-style: normal;
-  font-weight: 400;
-  font-display: swap;
-  src: url(../fonts/Assistant-Medium.ttf) format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-/* hebrew */
-@font-face {
-  font-family: 'Assistant';
-  font-style: normal;
-  font-weight: 500;
-  font-display: swap;
-  src: url(../fonts/Assistant-SemiBold.ttf) format('woff2');
-  unicode-range: U+0590-05FF, U+20AA, U+25CC, U+FB1D-FB4F;
-}
-/* latin-ext */
-@font-face {
-  font-family: 'Assistant';
-  font-style: normal;
-  font-weight: 500;
-  font-display: swap;
-  src: url(../fonts/Assistant-SemiBold.ttf) format('woff2');
-  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-/* latin */
-@font-face {
-  font-family: 'Assistant';
-  font-style: normal;
-  font-weight: 500;
-  font-display: swap;
-  src: url(../fonts/Assistant-SemiBold.ttf) format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-/* hebrew */
-@font-face {
-  font-family: 'Assistant';
-  font-style: normal;
-  font-weight: 600;
-  font-display: swap;
-  src: url(../fonts/Assistant-Bold.ttf) format('woff2');
-  unicode-range: U+0590-05FF, U+20AA, U+25CC, U+FB1D-FB4F;
-}
-/* latin-ext */
-@font-face {
-  font-family: 'Assistant';
-  font-style: normal;
-  font-weight: 600;
-  font-display: swap;
-  src: url(../fonts/Assistant-Bold.ttf) format('woff2');
-  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-/* latin */
-@font-face {
-  font-family: 'Assistant';
-  font-style: normal;
-  font-weight: 600;
-  font-display: swap;
-  src: url(../fonts/Assistant-Bold.ttf) format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}
-/* hebrew */
-@font-face {
-  font-family: 'Assistant';
-  font-style: normal;
-  font-weight: 700;
-  font-display: swap;
-  src: url(../fonts/Assistant-ExtraBold.ttf) format('woff2');
-  unicode-range: U+0590-05FF, U+20AA, U+25CC, U+FB1D-FB4F;
-}
-/* latin-ext */
-@font-face {
-  font-family: 'Assistant';
-  font-style: normal;
-  font-weight: 700;
-  font-display: swap;
-  src: url(../fonts/Assistant-ExtraBold.ttf) format('woff2');
-  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
-}
-/* latin */
-@font-face {
-  font-family: 'Assistant';
-  font-style: normal;
-  font-weight: 700;
-  font-display: swap;
-  src: url(../fonts/Assistant-ExtraBold.ttf) format('woff2');
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
-}