@fullstackunicorn/create-root 1.0.22 → 1.0.24

package/assets/root.fullstackunicorn.dev/assets/package.md

@@ -1,13 +1,20 @@
-
+yarn cmd website workspace-cleanup
+yarn cmd website develop-cleanup
 
 yarn cmd website local-config
+yarn cmd website local-push
+yarn cmd website local-pull
 yarn cmd website local-assets
 yarn cmd website local-workers
 
 yarn cmd website sv1-config
+yarn cmd website sv1-push
+yarn cmd website sv1-pull
 yarn cmd website sv1-assets
 yarn cmd website sv1-workers
 
 yarn cmd website stage-config
+yarn cmd website stage-push
+yarn cmd website stage-pull
 yarn cmd website stage-assets
-yarn cmd website stage-workers
+yarn cmd website stage-workers

package/assets/root.fullstackunicorn.dev/assets/webapp.runner.js

@@ -8,12 +8,33 @@ class Runner {
         this.sync = new Sync({ def })
     }
 
+    // yarn cmd website workspace-cleanup
+    ['workspace-cleanup'] = async () => {
+        try { return await this.sync.runCleanup('workspace') }
+        catch (e) { F3.logs(e) }
+    }
+    // yarn cmd website develop-cleanup
+    ['develop-cleanup'] = async () => {
+        try { return await this.sync.runCleanup('develop') }
+        catch (e) { F3.logs(e) }
+    }
+
     
     // yarn cmd website local-config
     ['local-config'] = async () => {
         try { return await this.sync.runConfig('local') } 
         catch (e) { F3.logs(e) }
     }
+    // yarn cmd website local-push
+    ['local-push'] = async () => {
+        try { return await this.sync.runWorkspacePush('local') }
+        catch (e) { F3.logs(e) }
+    }
+    // yarn cmd website local-pull
+    ['local-pull'] = async () => {
+        try { return await this.sync.runWorkspacePull('local') }
+        catch (e) { F3.logs(e) }
+    }
     // yarn cmd website local-assets
     ['local-assets'] = async () => {
         try { return await this.sync.runAssets('local') } 
@@ -31,6 +52,16 @@ class Runner {
         try { return await this.sync.runConfig('sv1') } 
         catch (e) { F3.logs(e) }
     }
+    // yarn cmd website sv1-push
+    ['sv1-push'] = async () => {
+        try { return await this.sync.runWorkspacePush('sv1') }
+        catch (e) { F3.logs(e) }
+    }
+    // yarn cmd website sv1-pull
+    ['sv1-pull'] = async () => {
+        try { return await this.sync.runWorkspacePull('sv1') }
+        catch (e) { F3.logs(e) }
+    }
     // yarn cmd website sv1-assets
     ['sv1-assets'] = async () => {
         try { return await this.sync.runAssets('sv1') } 
@@ -48,6 +79,16 @@ class Runner {
         try { return await this.sync.runConfig('stage') } 
         catch (e) { F3.logs(e) }
     }
+    // yarn cmd website stage-push
+    ['stage-push'] = async () => {
+        try { return await this.sync.runWorkspacePush('stage') }
+        catch (e) { F3.logs(e) }
+    }
+    // yarn cmd website stage-pull
+    ['stage-pull'] = async () => {
+        try { return await this.sync.runWorkspacePull('stage') }
+        catch (e) { F3.logs(e) }
+    }
     // yarn cmd website stage-assets
     ['stage-assets'] = async () => {
         try { return await this.sync.runAssets('stage') } 
@@ -60,4 +101,4 @@ class Runner {
     }
 }
 
-export const runner = new Runner()
+export const runner = new Runner()

package/assets/root.fullstackunicorn.dev/frontend/base/account/AccountCard.js

@@ -1,6 +1,6 @@
 import { useGetUser, useAuthLogin, useAuthLogout, useAuthAccount } from '#@/base/account/@use.js'
 import { useGetStatics } from '#@/base/statics/@use.js'
-import { Account } from '#@/panels/cards/Account.js'
+import { Account } from '#@/modules/cards/Account.js'
 
 export const AccountCard = ({ api }) => {
 

package/assets/root.fullstackunicorn.dev/frontend/base/cookies/@use.js

@@ -4,11 +4,9 @@ import { storage } from '#@/imports/storage.js'
 import { api } from '#@/client/@api.js'
 import { constants } from '#@/root/constants.js'
 import { useUrl } from '#@/base/router/@use.js'
-import { alerts, useSetAlerts } from '#@/base/alerts/@use.js'
-import { useGetStatics } from '#@/base/statics/@use.js'
-import { useModals, useSetModals, useModalClose } from '#@/base/modals/@use.js'
+import { alerts } from '#@/base/alerts/@use.js'
+import { useModals, useSetModals } from '#@/base/modals/@use.js'
 import { useGetLanguage } from '#@/base/language/@use.js'
-import { useGetLookups } from '#@/base/lookups/@use.js'
 import { tools } from '#@/base/cookies/@tools.js'
 
 export const device = atom()
@@ -102,99 +100,20 @@ export const useGetAgreement = () => {
     return getAgreement
 }
 
-export const useGetCookiesData = () => {
-
-    const statics = useGetStatics()
-    const lookups = useGetLookups()
-
-    const setAlerts = useSetAlerts()
-    const setCookies = useSetCookies()
-    const setConsent = useSetConsent()
-
-    const modalClose = useModalClose()
-
-    const getAgreement = useGetAgreement()
-
-    const getCookiesData = ({ formResult, id, isCloseDisabled, isLanguageButton }) => {
-
-        const onSetValue = async () => {
-
-            const device = storage.get('device')
-            const agreement = getAgreement({
-                agreement_type: statics.logic.cookies.type,
-                agreement_version: statics.logic.cookies.version,
-                agreement_subject_id: device,
-                agreement_subject_type: 'device_id',
-                agreement_agreed: formResult.current,
-            })
-
-            const agreements = { [statics.logic.cookies.type]: agreement }
-            const submit = await tools.getSubmit(device)
-
-            const consent = [{ agreements, submit }]
-            const response = await api.cookies.set(consent)
-
-            if (response.isOffline) setAlerts({ id: 'offline' })
-            else if (response.isError) setAlerts({ id: 'error-cookies-set' })
-            else if (response.isValid) {
-                setCookies(response.data)
-                setConsent(response.consent_id)
-                void api.cookies.get() //@NOTE no await is for caching
-            }
-            modalClose(id)
-        }
-
-        const itemVisual = {}
-        for (const key of Object.keys(statics.logic.cookies.data)) {
-            itemVisual[key] = { svg: statics.visual.svg.cookies }
-        }
-
-        const data = {}
-        data.isCloseDisabled = isCloseDisabled
-        data.isLanguageButton = isLanguageButton
-        data.onSetValue = onSetValue
-        data.formResult = formResult
-        data.itemLogic = statics.logic.cookies
-        data.itemVisual = itemVisual
-        data.svg = statics.visual.svg.cookies
-        data.itemVerbal = { 
-            title: lookups.cookies.verbal.modal.title,
-            description: lookups.cookies.verbal.modal.description,
-            action: lookups.cookies.verbal.modal.action,
-            data: lookups.cookies.verbal.data
-        }
-
-        return data
-    }
-    return getCookiesData
-}
-
 export const useWelcome = () => {
 
     const { lang } = useUrl()
-
     const setModals = useSetModals()
     const modalRef = useRef('')
-
     const consent = useGetConsent()
 
-    const cookies = useGetCookies()
-    const formResult = useRef({})
-    formResult.current = cookies
-
-    const getCookiesData = useGetCookiesData()
-
-    const isCloseDisabled = true
-    const isLanguageButton = constants.services.IS_CARD_LANGUAGE_OFF ? false : true
-
     useEffect(() => {
 
         if (constants.services.IS_CARD_COOKIES_OFF) return
         if (consent) return
 
         if (!modalRef.current) modalRef.current = makeId()
-        const data = getCookiesData({ formResult, id: modalRef.current, isCloseDisabled, isLanguageButton })
-        setModals([{ id: modalRef.current, name: 'sliders', data }])
+        setModals([{ id: modalRef.current, name: 'cookies' }])
 
     }, [consent, lang])
 }
@@ -202,17 +121,10 @@ export const useWelcome = () => {
 export const useCookiesEdit = () => {
 
     const [modals, setModals] = useModals()
-    const cookies = useGetCookies()
-
-    const formResult = useRef({})
-    formResult.current = cookies
-
-    const getCookiesData = useGetCookiesData()
 
-    const onPress = async () => {
+    const onPress = () => {
         const id = makeId()
-        const data = getCookiesData({ formResult, id })
-        setModals([...modals, { id, name: 'sliders', data }])
+        setModals([...modals, { id, name: 'cookies' }])
     }
     return onPress
 }

package/assets/root.fullstackunicorn.dev/frontend/base/cookies/CookiesCard.js

@@ -1,6 +1,6 @@
 import { useGetStatics } from '#@/base/statics/@use.js'
 import { useCookiesEdit } from '#@/base/cookies/@use.js'
-import { Launcher } from '#@/panels/cards/Launcher.js'
+import { Launcher } from '#@/modules/cards/Launcher.js'
 
 export const CookiesCard = ({ api }) => {
 

package/assets/root.fullstackunicorn.dev/frontend/base/language/@use.js

@@ -1,16 +1,9 @@
 import { useEffect, useState } from 'react'
-import { atom, useAtom, useSetAtom, useGetAtom } from '#@/imports/npm.js'
-import { useNavigate } from '#@/imports/router.js'
-import { makeId } from '#@/imports/npm.js'
-import { api } from '#@/client/@api.js'
-import { uri } from '#@/App.uri.js'
+import { atom, useAtom, useSetAtom, useGetAtom, makeId } from '#@/imports/npm.js'
 import { storage } from '#@/imports/storage.js'
-import { useUrl } from '#@/base/router/@use.js'
-import { useGetStatics, useSetVerbal } from '#@/base/statics/@use.js'
-import { useHistory } from '#@/base/router/@use.js'
+import { useGetStatics } from '#@/base/statics/@use.js'
 import { useModals } from '#@/base/modals/@use.js'
 import { useGetLookups } from '#@/base/lookups/@use.js'
-import { useSetAlerts } from '#@/base/alerts/@use.js'
 import { tools } from '#@/base/language/@tools.js'
 
 export const language = atom({})
@@ -75,69 +68,11 @@ export const useLanguageLabel = () => {
 
 export const useLanguageEdit = () => {
 
-    const { path } = useUrl()
-    const navigate = useNavigate()
-
-    const label = useLanguageLabel()
-    const lookups = useGetLookups()
-
-    const statics = useGetStatics()
-    const setVerbal = useSetVerbal()
-
-    const [history, setHistory] = useHistory()
-
-    const languages = [statics.logic['@lang'], ...F3.arr.safe(statics.logic['@langs'])]
-
-    const [language, setLanguage] = useLanguage()
     const [modals, setModals] = useModals()
-    const setAlerts = useSetAlerts({})
-
-    const onPress = async () => {
-
-        const languagesVerbal = lookups.languages.verbal.data.items
-        const languagesDefault = lookups.languages.logic
-
-        const data = {}
-
-        data.onSetValue = async newValue => {
-
-            if (newValue.slug === language.slug) return
-            if (!languages.includes(newValue.slug)) return
-
-            const localVerbal = await api.statics.get(uri.data.root.verbal, { lang: newValue.slug })
-
-            const result = {}
-            result.verbal = localVerbal['@data']
-            result.language = tools.getLanguage(newValue.slug, statics.logic)
-
-            if (!result.language || !result.verbal) {
-                const alert = {}
-                alert.id = 'no-language'
-                alert.params = { language: tools.getLanguageLabel(lookups, newValue.slug) }
-                return setAlerts(alert)
-            }
-
-            const newHistory = tools.getNewHistory(history, newValue.slug)
-
-            setHistory(newHistory)
-            setVerbal(result.verbal)
-            setLanguage(result.language)
-            navigate(`/${newValue.slug}/${path}`)
-        }
-
-        data.value = {}
-        data.value.slug = language.slug
-        data.value.value = label
-
-        data.itemLogic = {}
-        data.itemLogic.options = languages
-
-        data.itemVerbal = {}
-        data.itemVerbal.options = tools.getLanguages(lookups, languages)
-        data.itemVerbal.title = lookups.languages.verbal.views.modal.title
 
+    const onPress = () => {
         const id = makeId()
-        setModals([...modals, { id, name: 'selects', data }])
+        setModals([...modals, { id, name: 'languages' }])
     }
 
     return onPress

package/assets/root.fullstackunicorn.dev/frontend/base/language/LanguageCard.js

@@ -1,6 +1,6 @@
 import { useLanguageLabel, useLanguageEdit } from '#@/base/language/@use.js'
 import { useGetStatics } from '#@/base/statics/@use.js'
-import { Launcher } from '#@/panels/cards/Launcher.js'
+import { Launcher } from '#@/modules/cards/Launcher.js'
 
 export const LanguageCard = ({ api={} }) => {
 

package/assets/root.fullstackunicorn.dev/frontend/base/layout/Layout.pod.js

@@ -7,8 +7,8 @@ export const LayoutPod = ({ sidebarTwo, iconTwo,
 
     const { s, c, f, t, F, B, S, I, H } = useStyle()
 
-    S.root = [s.col, s.Ymin0,s.XY]
-    S.layout = [s.col, s.Ymin0, s.XY]
+    S.root = [s.col, s.X, s.Yc, s.Ymin0]
+    S.layout = [s.col, s.X, s.Yc, s.Ymin0]
     S.body = [s.col_cX, s.X, s.Yc, s.Ymin0, s.overflowXh, c.base_NN_W750]
 
     return (

package/assets/root.fullstackunicorn.dev/frontend/base/legals/LegalCard.js

@@ -1,5 +1,5 @@
 import { useGetStatics } from '#@/base/statics/@use.js'
-import { Linker } from '#@/panels/cards/Linker.js'
+import { Linker } from '#@/modules/cards/Linker.js'
 
 export const LegalCard = ({ title, description, label, linkTo }) => {
 

package/assets/root.fullstackunicorn.dev/frontend/base/legals/LegalsCard.js

@@ -1,7 +1,7 @@
 import { routes } from '#@/root/routes.js'
 import { useUrl } from '#@/base/router/@use.js'
 import { useGetStatics } from '#@/base/statics/@use.js'
-import { Linker } from '#@/panels/cards/Linker.js'
+import { Linker } from '#@/modules/cards/Linker.js'
 
 export const LegalsCard = ({ api={} }) => {
 

package/assets/root.fullstackunicorn.dev/frontend/base/resources/@use.js

@@ -0,0 +1,15 @@
+import { atom, useGetAtom, useSetAtom } from '#@/imports/npm.js'
+
+const store = new Map()
+const resourceAtom = key => {
+    if (!store.has(key)) store.set(key, atom({ data: undefined, meta: undefined }))
+    return store.get(key)
+}
+
+const writeAtom = atom(null, (get, set, { key, ...rest }) => {
+    if (!key) return
+    set(resourceAtom(key), { ...get(resourceAtom(key)), ...rest })
+})
+
+export const useGetResource = key => useGetAtom(resourceAtom(key))
+export const useSetResource = () => useSetAtom(writeAtom)

package/assets/root.fullstackunicorn.dev/frontend/base/router/@use.js

@@ -45,6 +45,7 @@ export const useUrl = () => {
 }
 
 const replaceParents = (match) => {
+    if (!match?.route || !F3.arr.isGood(match.route.parent)) return []
     const { route, params } = match;
     return route.parent.map(parentPath => {
         let result = parentPath;
@@ -209,4 +210,4 @@ export const useChronology = () => {
 // useEffect(() => {
 //     if (!api?.group) return
 //     setDynamic({ group: api.group })
-// }, [api])
+// }, [api])

package/assets/root.fullstackunicorn.dev/frontend/base/theme/ThemeCard.js

@@ -1,6 +1,6 @@
 import { useIsDark } from '#@/base/theme/@use.js'
 import { useGetStatics } from '#@/base/statics/@use.js'
-import { Slider } from '#@/panels/cards/Slider.js'
+import { Slider } from '#@/modules/cards/Slider.js'
 
 export const ThemeCard = ({ api }) => {
 

package/assets/root.fullstackunicorn.dev/frontend/config.style.js

@@ -55,14 +55,26 @@ setup.defaultSass = `* {
     // user-select: none;
 };
 
-html, body, #root {
-    overflow:hidden;
-    height: 100vh;
-    max-height: 100vh;
-    min-height: 100vh;
-    width: 100vw;
-    max-width: 100vw;
-    min-width: 100vw;
+:root {
+    --app-viewport-height: 100vh;
+}
+
+@supports (height: 100dvh) {
+    :root {
+        --app-viewport-height: 100dvh;
+    }
+}
+
+html {
+    height: 100%;
+    width: 100%;
+    overscroll-behavior: none;
+}
+
+body, #root {
+    min-height: 100%;
+    width: 100%;
+    overscroll-behavior: none;
 }
 
 body { margin:0; padding:0 }
@@ -83,4 +95,4 @@ h1, h2, h3, h4, h5, h6, p, a, span, input, textarea, option, button {
     margin-inline-end: 0;
 };`
 
-export default setup
+export default setup

package/assets/root.fullstackunicorn.dev/frontend/features/legal/Legal.js

@@ -1,4 +1,4 @@
-import { Prose } from '#@/panels/prose/Prose.js'
+import { Prose } from '#@/modules/prose/Prose.js'
 import { BlockPod } from './Legal.pod.js'
 
 export const Legal = ({ api }) => {

package/assets/root.fullstackunicorn.dev/frontend/imports/animated/Root.js

@@ -1,10 +1,8 @@
 import { useState, useEffect } from 'react'
-import { useStyle } from '#@/style/@use.js'
+import { Viewport } from '#@/imports/core/Viewport.js'
 
 export const Root = ({ children, isLoaded }) => {
 
-    const { s, c, f, t, F, B, S, I, H } = useStyle()
-
     const [isOff, setIsOff] = useState(true)
 
     useEffect(() => {
@@ -16,11 +14,9 @@ export const Root = ({ children, isLoaded }) => {
         opacity: isOff ? 0 : 1,
     }
 
-    const className = [s.XY]
-
     return (
-        <div className={className.join(' ')} style={style}>
+        <Viewport inline={style}>
             {children}
-        </div>
+        </Viewport>
     )
-}
+}

package/assets/root.fullstackunicorn.dev/frontend/imports/core/Scrollable.js

@@ -14,14 +14,19 @@ export const Scrollable = ({
         ? { paddingBottom: 'env(safe-area-inset-bottom, 0px)' }
         : {}
 
+    const scrollInline = {
+        overscrollBehavior: 'none',
+        overscrollBehaviorY: 'none',
+    }
+
     return (
         <div
             ref={scrollRef}
             className={[...classes, s.overflowYs].join(' ')}
-            style={{ ...inline, ...pageInline }}
+            style={{ ...scrollInline, ...inline, ...pageInline }}
             onScroll={onScroll}
         >
             {children}
         </div>
     )
-}
+}

package/assets/root.fullstackunicorn.dev/frontend/imports/core/Viewport.js

@@ -0,0 +1,29 @@
+export const Viewport = ({
+    classes = [],
+    inline = {},
+    children,
+}) => {
+    const style = {
+        position: 'fixed',
+        top: 0,
+        right: 0,
+        bottom: 0,
+        left: 0,
+        width: '100%',
+        height: 'var(--app-viewport-height, 100vh)',
+        overflow: 'hidden',
+        overscrollBehavior: 'none',
+        overscrollBehaviorY: 'none',
+        display: 'flex',
+        flexDirection: 'column',
+        paddingTop: 'env(safe-area-inset-top, 0px)',
+        paddingBottom: 'env(safe-area-inset-bottom, 0px)',
+        ...inline,
+    }
+
+    return (
+        <div className={classes.join(' ')} style={style}>
+            {children}
+        </div>
+    )
+}

package/assets/root.fullstackunicorn.dev/frontend/imports/head/Head.js

@@ -5,35 +5,25 @@ export const Head = () => {
 
     const meta = useGetMeta()
 
-    if (!F3.obj.isGood(meta)) return null;
+    if (!F3.obj.isGood(meta)) return null
 
-    const { metadata, opengraph, twitter, schema } = meta
+    const { title, description, cover } = meta
+    const image = cover ? `${window.location.origin}/${cover}` : undefined
 
     return (
         <Helmet>
 
-            {metadata?.title && <title>{metadata.title}</title>}
-            {metadata?.description && <meta name="description" content={metadata.description} />}
-            {metadata?.keywords && <meta name="keywords" content={metadata.keywords} />}
-
-            {opengraph?.title && <meta property="og:title" content={opengraph.title} />}
-            {opengraph?.description && <meta property="og:description" content={opengraph.description} />}
-            {opengraph?.type && <meta property="og:type" content={opengraph.type} />}
-            {opengraph?.url && <meta property="og:url" content={opengraph.url} />}
-            {opengraph?.site_name && <meta property="og:site_name" content={opengraph.site_name} />}
-            {opengraph?.image && <meta property="og:image" content={opengraph.image} />}
-
-            {twitter?.card && <meta name="twitter:card" content={twitter.card} />}
-            {twitter?.title && <meta name="twitter:title" content={twitter.title} />}
-            {twitter?.description && <meta name="twitter:description" content={twitter.description} />}
-            {twitter?.image && <meta name="twitter:image" content={twitter.image} />}
-            {twitter?.site && <meta name="twitter:site" content={twitter.site} />}
-
-            {schema?.schema && (
-                <script type="application/ld+json">
-                    {JSON.stringify(schema.schema)}
-                </script>
-            )}
+            {title && <title>{title}</title>}
+            {description && <meta name="description" content={description} />}
+
+            {title && <meta property="og:title" content={title} />}
+            {description && <meta property="og:description" content={description} />}
+            {image && <meta property="og:image" content={image} />}
+
+            {title && <meta name="twitter:title" content={title} />}
+            {description && <meta name="twitter:description" content={description} />}
+            {image && <meta name="twitter:image" content={image} />}
+
         </Helmet>
-    );
-}
+    )
+}

package/assets/root.fullstackunicorn.dev/frontend/modals/cookies/cookies.api.js

@@ -0,0 +1,25 @@
+import { useGetStatics } from '#@/base/statics/@use.js'
+import { useGetLookups } from '#@/base/lookups/@use.js'
+
+export const useCookiesData = () => {
+
+    const statics = useGetStatics()
+    const lookups = useGetLookups()
+
+    const itemVisual = {}
+    for (const key of Object.keys(statics.logic.cookies.data)) {
+        itemVisual[key] = { svg: statics.visual.svg.cookies }
+    }
+
+    return {
+        svg: statics.visual.svg.cookies,
+        itemLogic: statics.logic.cookies,
+        itemVisual,
+        itemVerbal: {
+            title: lookups.cookies.verbal.modal.title,
+            description: lookups.cookies.verbal.modal.description,
+            action: lookups.cookies.verbal.modal.action,
+            data: lookups.cookies.verbal.data
+        }
+    }
+}