ywana-core8 0.0.289 → 0.0.290

package/package.json

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

package/src/domain/TablePage.js

@@ -318,7 +318,6 @@ export const TableEditor = (props) => {
         if (grouper.options) {
             const options = CHECK['isFunction'](grouper.options) ? grouper.options() : grouper.options
             const option = options.find(option => option.value === groupName)
-            console.log(groupName, options, option)
             return option ? option.label : groupName
         } else {
             return groupName

package/src/site/site.css

@@ -48,6 +48,10 @@
     width: 20rem;
 }
 
+.site6>menu>main {
+    padding: .1rem;
+}
+
 .site6>menu>main>.site-menu-item {
     width: 100%;
     display: flex;
@@ -59,6 +63,12 @@
     cursor: pointer;
 }
 
+.site6>menu>main>.site-menu-item.selected {
+    color: rgb(255, 255, 255);
+    background-color: rgb(60, 60, 60);
+    border-radius: .5rem;
+}
+
 .site6>menu>main {
     flex: 1;
     overflow-x: hidden;

package/src/site/site.js

@@ -166,7 +166,7 @@ const SiteAside = () => {
 const SiteMenu = ({ logo, title, children, min }) => {
 
     const context = useContext(SiteContext)
-    const { sideNav, setSideNav, showNav } = context
+    const { page, sideNav, setSideNav, showNav } = context
 
     useEffect(() => {
         if (min) context.setSideNav('min')
@@ -191,7 +191,6 @@ const SiteMenu = ({ logo, title, children, min }) => {
             return sections
         }, {}) : {}
 
-
     const style = sideNav === 'max' ? 'max' : 'min'
     const toggleIcon = sideNav === 'max' ? 'chevron_left' : 'chevron_right'
     return (
@@ -200,9 +199,10 @@ const SiteMenu = ({ logo, title, children, min }) => {
                 {Object.keys(sections).map(title => (
                     <Fragment key={title}>
                         {sections[title].map(({ id, icon = 'info', title }) => {
+                            const styleItem = id === page ? 'selected' : ''
                             return (
-                                <div className="site-menu-item" key={id} onClick={() => goto(id)}>
-                                    <Icon key={id} icon={icon} clickable checked={id === context.page} action={() => goto(id)} />
+                                <div className={`site-menu-item ${styleItem}`} key={id} onClick={() => goto(id)}>
+                                    <Icon key={id} icon={icon} clickable action={() => goto(id)} />
                                     { sideNav === 'max' ? <label>{title}</label> : null }
                                 </div>
                             )

package/src/site/site.test.js

@@ -1,19 +1,18 @@
-import React, { useContext, useEffect, useState } from 'react'
+import React, { Fragment, useContext, useEffect, useState } from 'react'
+import { SiteContext } from './siteContext'
 import { Site } from './site'
 import { Page } from './page'
 import './site.css'
 import './page.css'
-import { Fragment } from 'react/cjs/react.production.min'
-import { SiteContext } from './siteContext'
 
 const SiteTest = (prop) => {
     return (
-        <Site icon="star" title="Site Test" init={"PAGE1"}>
+        <Site icon="star" title="Site Test" init={"PAGE2"}>
             <Page id="PAGE1" section="SECTION1" icon="description" title="Page 1" layout="workspace">
                 <Page1 />
             </Page>
             <Page id="PAGE2" section="SECTION1" icon="description" title="Page 2" layout="workspace">
-                222
+                <Page2 />
             </Page>
         </Site>
     )
@@ -23,15 +22,24 @@ const Page1 = (props) => {
 
     const site = useContext(SiteContext)
     useEffect(() => {
-
         site.notify({ title: "Notification 1", body: "Lorem ipsum dolor sit amet"})
     }, [])
 
     return (
         <Fragment>
             <header>Page 1</header>
-            <main>1</main>
+            <main></main>
             <footer>f1</footer>
         </Fragment>
     )
+}
+
+const Page2 = (props) => {
+    return (
+        <Fragment>
+            <header>Page 2</header>
+            <main></main>
+            <footer>f2</footer>
+        </Fragment>
+    )
 }