ywana-core8 0.0.859 → 0.0.861

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ywana-core8",
-  "version": "0.0.859",
+  "version": "0.0.861",
   "description": "ywana-core8",
   "homepage": "https://ywana.github.io/workspace",
   "author": "Ernesto Roldan Garcia",

package/src/domain2/DynamicForm.js

@@ -21,7 +21,7 @@ export const DynamicForm = (props) => {
                 const { id, label, type } = field
                 const value = values[id] || field.default
                 return (
-                    <DynamicFormField key={`${id}_${value}`} field={field} value={value} onChange={change} />
+                    <DynamicFormField key={id} field={field} value={value} onChange={change} />
                 )
             })}
         </div>

package/src/domain2/FORMATS.js

@@ -6,6 +6,7 @@ export const FORMATS = {
     DATE: 'date',
     DATERANGE: 'DATERANGE',
     TIME: 'time',   
+    DATETIME: 'datetime',
     EMAIL: 'email',
     HTML: 'HTML',
     URL: 'URL',

package/src/html/index.js

@@ -17,7 +17,7 @@ export { Text, TEXTFORMATS } from './text'
 export { TextField, DropDown, TextArea, DateRange, PasswordField } from './textfield'
 export { TokenField } from './tokenfield'
 export { Tree, TreeNode, TreeItem } from './tree'
-export { Switch } from './switch'
+export { Switch, Switch2 } from './switch'
 export { Tooltip } from './tooltip'
 export { Thumbnail } from './thumbnail'
 export { ColorField } from './color'

package/src/html/section.js

@@ -16,7 +16,7 @@ export const Section = (props) => {
     }, [open])
 
     const toggle = () => {
-        setOpen(!open)
+        setOpen(!isOpen)
     }
 
     return (

package/src/html/switch.js

@@ -1,5 +1,6 @@
 import React from 'react'
 import RSwitch from 'react-switch'
+import { Icon } from './icon'
 
 export const Switch = (props) => {
 
@@ -20,4 +21,20 @@ export const Switch = (props) => {
             className="react-switch"
         />
     )
+}
+
+export const Switch2 = (props) => {
+
+    const { checked, onChange } = props
+
+    function toggle() {
+        onChange(!checked)
+    }
+
+    const icon = checked ? "toggle_on" : "toggle_off"
+    return (
+        <div className="switch">
+            <Icon icon={icon} clickable action={toggle} />
+        </div>
+    )
 }

package/src/html/table.js

@@ -242,6 +242,9 @@ const EntityCellViewer = ({ id, item, value }) => {
                 case FORMATS.TIME:
                     text = new Date(text).toLocaleString(locale, { year: 'hour', month: 'minute', day: 'second' });
                     break;
+                case FORMATS.DATETIME:
+                    text = new Date(text).toLocaleString(locale, { year: 'numeric', month: 'numeric', day: 'numeric', hour: 'numeric', minute: 'numeric', second: 'numeric' });
+                    break;
             }
         }
 

package/src/html/textfield.js

@@ -12,7 +12,7 @@ import './textarea.css'
 export const TextField = (props) => {
 
     const site = useContext(SiteContext)
-    const { id, type = 'text', label, labelPosition = 'top', placeholder, value, outlined, readOnly = false, canClear = true, onChange, onEnter, onClick, onBlur } = props
+    const { id, type = 'text', label, labelPosition = 'top', placeholder, value, outlined, readOnly = false, canClear = true, onChange, onEnter, onClick, onFocus, onBlur } = props
 
     function onKeyPress(event) {
         var key = event.charCode ? event.charCode : event.keyCode ? event.keyCode : 0;
@@ -29,13 +29,7 @@ export const TextField = (props) => {
     }
 
     function focus() {
-        if (site && site.changeFocus) {
-            site.changeFocus({
-                lose: () => {
-                    // DO NOTHING
-                }
-            })
-        }
+        if (onFocus) onFocus()
     }
 
     function blur() {

package/src/site/site.js

@@ -26,8 +26,7 @@ export const SiteProvider = ({ children, siteLang, siteDictionary }) => {
     const [promptDialog, setPromptDialog] = useState()
     const [preview, setPreview] = useState()
     const [breadcrumb, setBreadcrumb] = useState()
-    const [focused, setFocused] = useState()
-
+    
     const value = {
 
         lang,
@@ -35,17 +34,7 @@ export const SiteProvider = ({ children, siteLang, siteDictionary }) => {
 
         dictionary,
         setDictionary,
-
-        focused,
-        changeFocus: (next) => {
-            if (focused) focused.lose()
-            setFocused(next)
-        },
-        clearFocus: () => {
-            if (focused) focused.lose()
-            setFocused(null)
-        },
-
+        
         sideNav,
         setSideNav,
 

package/src/site/view.css

@@ -8,20 +8,28 @@
 .view>header {
     width: 100%;
     display: flex;
-    align-items: center;
+    align-items: flex-end;
     background-color: rgb(200,200,200);
     min-height: 2rem;
-    padding-left: 1rem;
+    height: 2.5rem;
+    max-height: 2.5rem;
+}
+
+.view>header>.icon {
+    height: 2.4rem;
+    width: 3rem
 }
 
 .view>header>label {
     flex: 1;
+    height: 100%;
+    display: flex;
+    align-items: center;
 }
 
 .view>nav {
     min-height: 2rem;
     display: flex;
-    flex-direction: ;
     align-items: center;
     justify-content: flex-end;
     background-color: rgb(230,230,230);