zmp-cli 3.15.5 → 3.15.6-beta.1

package/create/templates/react/pages/index.js

@@ -1,17 +1 @@
-const copyUser = require('./user');
-const copyForm = require('./form');
-const copyDynamicRoute = require('./dynamic-route');
-const copyAbout = require('./about');
-const copy404 = require('./404');
-const copySettings = require('./settings');
-const copyCatalog = require('./catalog');
-
-module.exports = {
-  copyUser,
-  copyForm,
-  copyDynamicRoute,
-  copyAbout,
-  copy404,
-  copySettings,
-  copyCatalog,
-};
+"use strict";const e=require("./user"),r=require("./form"),u=require("./dynamic-route"),i=require("./about"),t=require("./404"),o=require("./settings"),q=require("./catalog");module.exports={copyUser:e,copyForm:r,copyDynamicRoute:u,copyAbout:i,copy404:t,copySettings:o,copyCatalog:q};

package/create/templates/react/pages/settings.js

@@ -1,11 +1,4 @@
-const indent = require('../../../utils/indent');
-
-// eslint-disable-next-line no-unused-vars
-module.exports = (options) => {
-  if (options.stateManagement === 'recoil') {
-    return indent(
-      0,
-      `
+"use strict";const e=require("../../../utils/indent");module.exports=t=>"recoil"===t.stateManagement?e(0,`
       import React from "react";
       import { useRecoilValue } from 'recoil';
       import {
@@ -36,12 +29,7 @@ module.exports = (options) => {
       };
   
       export default SettingsPage;
-      `
-    ).trim();
-  }
-  return indent(
-    0,
-    `
+      `).trim():e(0,`
     import React from "react";
     import {
       Page,
@@ -71,6 +59,4 @@ module.exports = (options) => {
     };
 
     export default SettingsPage;
-  `
-  ).trim();
-};
+  `).trim();

package/create/templates/react/pages/user.js

@@ -1,37 +1,20 @@
-const indent = require('../../../utils/indent');
-
-module.exports = (options) => {
-  const { template, stateManagement } = options;
-  const hideNavBar =
-    template === 'tabs'
-      ? `
+"use strict";const e=require("../../../utils/indent");module.exports=t=>{let{template:r,stateManagement:a}=t,s="tabs"===r?`
           onPageBeforeIn={()=>{
             //hide navbar
             zmp.toolbar.hide('#app-tab-bar')
-          }}`
-      : '';
-  const modules = ['Avatar', 'List', 'ListItem', 'Page', 'Title'];
-  if (stateManagement === 'store') {
-    modules.push('useStore');
-  }
-  if (template === 'tabs') {
-    modules.push('zmp');
-  }
-  return indent(
-    0,
-    `
+          }}`:"",i=["Avatar","List","ListItem","Page","Title"];return"store"===a&&i.push("useStore"),"tabs"===r&&i.push("zmp"),e(0,`
     import React from 'react'
-    import { ${modules.join(', ')} } from 'zmp-framework/react'
-    import NavbarBack from '../components/navbar-back'${stateManagement === 'recoil' ? `
+    import { ${i.join(", ")} } from 'zmp-framework/react'
+    import NavbarBack from '../components/navbar-back'${"recoil"===a?`
     import { useRecoilValue } from 'recoil';
-    import { userState } from '../state';` : ''}
+    import { userState } from '../state';`:""}
 
     const UserPage = () => {
-      ${stateManagement === 'recoil' ? 'const user = useRecoilValue(userState);' : `const user = useStore('user')`}
+      ${"recoil"===a?"const user = useRecoilValue(userState);":"const user = useStore('user')"}
 
       return (
         <Page 
-          name="user"${hideNavBar}
+          name="user"${s}
         >
           <NavbarBack
             title="User info"
@@ -51,6 +34,4 @@ module.exports = (options) => {
     }
 
     export default UserPage;
-  `
-  ).trim();
-};
+  `).trim()};

package/create/templates/react-typescript/components/app-items.js

@@ -1,9 +1,4 @@
-const indent = require('../../../utils/indent');
-
-module.exports = (options) => {
-  return indent(
-    0,
-    `
+"use strict";const o=require("../../../utils/indent");module.exports=e=>o(0,`
     import React from 'react';
     import { Icon, Grid, GridItem, ToastPreloader } from 'zmp-framework/react';
     
@@ -48,6 +43,4 @@ module.exports = (options) => {
     AppItems.displayName = 'zmp-app-items'
     
     export default AppItems
-  `
-  ).trim();
-};
+  `).trim();

package/create/templates/react-typescript/components/index.js

@@ -1,9 +1 @@
-const copyAppItems = require('./app-items');
-const copyNavbarBack = require('./navbar-back');
-const copyUserCard = require('./user-card');
-
-module.exports = {
-  copyAppItems,
-  copyNavbarBack,
-  copyUserCard,
-};
+"use strict";const e=require("./app-items"),r=require("./navbar-back"),s=require("./user-card");module.exports={copyAppItems:e,copyNavbarBack:r,copyUserCard:s};

package/create/templates/react-typescript/components/navbar-back.js

@@ -1,9 +1,4 @@
-const indent = require('../../../utils/indent');
-
-module.exports = (options) => {
-  return indent(
-    0,
-    `
+"use strict";const a=require("../../../utils/indent");module.exports=t=>a(0,`
     import React from 'react';
     import { Link, Navbar, NavLeft, Icon, NavTitle, NavRight } from 'zmp-framework/react';
 
@@ -35,6 +30,4 @@ module.exports = (options) => {
 
 
     export default NavbarBack;
-  `
-  ).trim();
-};
+  `).trim();

package/create/templates/react-typescript/components/user-card.js

@@ -1,9 +1,4 @@
-const indent = require('../../../utils/indent');
-
-module.exports = (options) => {
-  return indent(
-    0,
-    `
+"use strict";const r=require("../../../utils/indent");module.exports=e=>r(0,`
     import React from 'react';
     import { Avatar, Title } from 'zmp-framework/react';
     import { userInfo } from 'zmp-sdk';
@@ -27,6 +22,4 @@ module.exports = (options) => {
     UserCard.displayName = 'zmp-user-card'
 
     export default UserCard;
-  `
-  ).trim();
-};
+  `).trim();

package/create/templates/react-typescript/copy-assets.js

@@ -1,94 +1 @@
-const path = require('path');
-const generateHomePage = require('./generate-home-page');
-const generateRoot = require('./generate-root');
-const generateStore = require('../generate-store');
-const generateRecoil = require('../generate-recoil');
-const copyComponents = require('./components');
-const copyPages = require('./pages');
-const copyViteConfig = require('./vite.config');
-
-module.exports = (options) => {
-  const cwd = options.cwd || process.cwd();
-  const { template, stateManagement } = options;
-  const toCopy = [];
-
-  // Copy Pages
-  let pages = [];
-  if (template !== 'blank')
-    pages.push(
-      ...[
-        { fileName: '404', content: 'copy404' },
-        { fileName: 'about', content: 'copyAbout' },
-        { fileName: 'dynamic-route', content: 'copyDynamicRoute' },
-        { fileName: 'user', content: 'copyUser' },
-        { fileName: 'form', content: 'copyForm' },
-      ]
-    );
-  if (template === 'tabs') {
-    pages.push(
-      ...[
-        { fileName: 'catalog', content: 'copyCatalog' },
-        { fileName: 'settings', content: 'copySettings' },
-      ]
-    );
-  }
-
-  pages.forEach(({ fileName, content }) => {
-    const dest = path.resolve(cwd, 'src', 'pages', `${fileName}.tsx`);
-    toCopy.push({
-      content: copyPages[content](options),
-      to: dest,
-    });
-  });
-  toCopy.push({
-    content: generateHomePage(options),
-    to: path.resolve(cwd, 'src', 'pages', 'index.tsx'),
-  });
-
-  // Copy compoents
-  const components = [
-    ...(template !== 'blank'
-      ? [
-        { fileName: 'app-items', content: 'copyAppItems' },
-        { fileName: 'navbar-back', content: 'copyNavbarBack' },
-        { fileName: 'user-card', content: 'copyUserCard' },
-      ]
-      : []),
-  ];
-  components.forEach(({ fileName, content }) => {
-    const dest = path.resolve(cwd, 'src', 'components', `${fileName}.tsx`);
-    toCopy.push({
-      content: copyComponents[content](options),
-      to: dest,
-    });
-  });
-
-  toCopy.push({
-    content: generateRoot(options),
-    to: path.resolve(cwd, 'src', 'components', 'app.tsx'),
-  });
-
-  if (stateManagement === 'recoil') {
-    toCopy.push({
-      content: generateRecoil(options),
-      to: path.resolve(cwd, 'src', 'state.ts'),
-    });
-  } else {
-    toCopy.push({
-      content: generateStore(options),
-      to: path.resolve(cwd, 'src', 'store.ts'),
-    });
-  }
-
-  toCopy.push({
-    content: copyViteConfig(options),
-    to: path.resolve(cwd, 'vite.config.ts'),
-  });
-
-  toCopy.push({
-    from: path.resolve(__dirname, '_tsconfig.json'),
-    to: path.resolve(cwd, 'tsconfig.json'),
-  });
-
-  return toCopy;
-};
+"use strict";const e=require("path"),t=require("./generate-home-page"),o=require("./generate-root"),n=require("../generate-store"),s=require("../generate-recoil"),r=require("./components"),c=require("./pages"),a=require("./vite.config");module.exports=p=>{let i=p.cwd||process.cwd(),{template:l,stateManagement:u}=p,m=[],f=[];return"blank"!==l&&f.push({fileName:"404",content:"copy404"},{fileName:"about",content:"copyAbout"},{fileName:"dynamic-route",content:"copyDynamicRoute"},{fileName:"user",content:"copyUser"},{fileName:"form",content:"copyForm"}),"tabs"===l&&f.push({fileName:"catalog",content:"copyCatalog"},{fileName:"settings",content:"copySettings"}),f.forEach(({fileName:t,content:o})=>{let n=e.resolve(i,"src","pages",`${t}.tsx`);m.push({content:c[o](p),to:n})}),m.push({content:t(p),to:e.resolve(i,"src","pages","index.tsx")}),[..."blank"!==l?[{fileName:"app-items",content:"copyAppItems"},{fileName:"navbar-back",content:"copyNavbarBack"},{fileName:"user-card",content:"copyUserCard"}]:[]].forEach(({fileName:t,content:o})=>{let n=e.resolve(i,"src","components",`${t}.tsx`);m.push({content:r[o](p),to:n})}),m.push({content:o(p),to:e.resolve(i,"src","components","app.tsx")}),"recoil"===u?m.push({content:s(p),to:e.resolve(i,"src","state.ts")}):m.push({content:n(p),to:e.resolve(i,"src","store.ts")}),m.push({content:a(p),to:e.resolve(i,"vite.config.ts")}),m.push({from:e.resolve(__dirname,"_tsconfig.json"),to:e.resolve(i,"tsconfig.json")}),m};

package/create/templates/react-typescript/generate-home-page.js

@@ -1,44 +1,23 @@
-const indent = require('../../utils/indent');
-module.exports = (options) => {
-  const { name, template, theming, stateManagement } = options;
-  const { fillBars } = theming;
-
-  let description = '';
-  if (template === 'single-view' || template === 'blank') {
-    description = `
+"use strict";const t=require("../../utils/indent");module.exports=e=>{let{name:a,template:i,theming:r,stateManagement:o}=e,{fillBars:s}=r,n="";return("single-view"===i||"blank"===i)&&(n=`
           <p>Here is your blank ZMP app. Let's see what we have here.</p>
-    `;
-  }
-  if (template === 'split-view') {
-    description = `
+    `),"split-view"===i&&(n=`
           <p>This is an example of split view application layout, commonly used on tablets. The main approach of such kind of layout is that you can see different views at the same time.</p>
 
           <p>Each view may have different layout, different navbar type (dynamic, fixed or static) or without navbar.</p>
 
           <p>The fun thing is that you can easily control one view from another without any line of JavaScript just using "data-view" attribute on links.</p>
-    `;
-  }
-  if (template === 'tabs') {
-    description = `
+    `),"tabs"===i&&(n=`
           <p>Here is your blank ZMP app with tabs-layout. Let's see what we have here.</p>
-    `;
-  }
-
-  return indent(
-    0,
-    `
+    `),t(0,`
     import React from 'react';
-    ${
-      template === 'blank'
-        ? `
+    ${"blank"===i?`
     import {
       Page,
       Navbar,
       NavTitleLarge,
       Card
     } from 'zmp-framework/react';
-    `.trim()
-        : `
+    `.trim():`
     import {
       Page,
       Navbar,
@@ -46,32 +25,27 @@ module.exports = (options) => {
       List,
       ListItem,
       Card,
-      ${stateManagement === 'store' ? 'useStore,' : ''}
-    } from 'zmp-framework/react';${stateManagement === 'recoil' ? `
+      ${"store"===o?"useStore,":""}
+    } from 'zmp-framework/react';${"recoil"===o?`
     import { useRecoilValue } from 'recoil';
-    import { userState } from '../state';` : ''}
+    import { userState } from '../state';`:""}
     import AppItems from '../components/app-items';
     import UserCard from '../components/user-card';
-    `.trim()
-    }
+    `.trim()}
 
     const HomePage = () => {
-      ${template !== 'blank' ? (stateManagement === 'recoil' ? "const user = useRecoilValue(userState);" : "const user = useStore('user');") : ''}
+      ${"blank"!==i?"recoil"===o?"const user = useRecoilValue(userState);":"const user = useStore('user');":""}
       return (
-        <Page name="home" ${template === 'tabs' ? '' : 'navbarLarge'}>${template !== 'tabs' ? `
+        <Page name="home" ${"tabs"===i?"":"navbarLarge"}>${"tabs"!==i?`
           {/* Top Navbar */}
-          <Navbar ${fillBars ? 'fill' : ''}>
-            <NavTitleLarge>${name}</NavTitleLarge>
-          </Navbar>`
-              : ''
-          }
+          <Navbar ${s?"fill":""}>
+            <NavTitleLarge>${a}</NavTitleLarge>
+          </Navbar>`:""}
           {/* Page content */}
           <Card inset>
-            ${description.trim()}
+            ${n.trim()}
           </Card>
-          ${
-            template !== 'blank' && template !== 'tabs'
-              ? `
+          ${"blank"!==i&&"tabs"!==i?`
           {/* User info */}
           <List>
             <ListItem link="/user/">
@@ -88,9 +62,7 @@ module.exports = (options) => {
             <ListItem title="Default Route (404)" link="/something-that-doesnt-exist" />
             <ListItem title="About" link="/about/" />
           </List>
-          `.trim()
-              : ''
-          }${template === 'tabs' ? `
+          `.trim():""}${"tabs"===i?`
           {/* Grid apps */}
           <AppItems />
 
@@ -100,14 +72,10 @@ module.exports = (options) => {
             <ListItem title="Default Route (404)" link="/something-that-doesnt-exist" />
             <ListItem title="About" link="/about/" />
           </List>
-          `.trim()
-              : ''
-          }
+          `.trim():""}
         </Page>
       );
     }
     
     export default HomePage;
-  `
-  ).trim();
-};
+  `).trim()};

package/create/templates/react-typescript/generate-root.js

@@ -1,28 +1,7 @@
-const templateIf = require('../../utils/template-if');
-const indent = require('../../utils/indent');
-const appParameters = require('../app-parameters');
-
-module.exports = (options) => {
-  const { theming, template, stateManagement } = options;
-  // Views
-  let views = '';
-  if (
-    template === 'single-view' ||
-    template === 'split-view' ||
-    template === 'blank'
-  ) {
-    views = indent(
-      0,
-      `
+"use strict";const i=require("../../utils/template-if"),e=require("../../utils/indent"),a=require("../app-parameters");module.exports=t=>{let{theming:r,template:o,stateManagement:m}=t,n="";return("single-view"===o||"split-view"===o||"blank"===o)&&(n=e(0,`
       {/* Your main view, should have "view-main" class */}
       <View main className="safe-areas" url="/" />
-      `
-    ).trim();
-  }
-  if (template === 'tabs') {
-    views = indent(
-      0,
-      `
+      `).trim()),"tabs"===o&&(n=e(0,`
       {/* TabView container */}
       <TabView className="safe-areas">
         {/* Tabbar for switching Tab*/}
@@ -42,40 +21,30 @@ module.exports = (options) => {
         <View id="view-catalog" name="catalog" tab url="/catalog/" />
         <View id="view-settings" name="settings" tab url="/settings/" />
       </TabView>
-      `
-    );
-  }
-
-  return indent(
-    0,
-    `
+      `)),e(0,`
     import React from 'react';
-    ${['blank', 'single-view'].indexOf(template) >= 0
-      ? `
+    ${["blank","single-view"].indexOf(o)>=0?`
     import { App, View } from 'zmp-framework/react';
-    `.trim()
-      : `
+    `.trim():`
     import { App, TabView, View, Tabbar, Link } from 'zmp-framework/react';
     `.trim()}
-    ${templateIf(stateManagement === 'recoil', () => `import { RecoilRoot } from 'recoil';`, () => `import store from '../store';`)}
+    ${i("recoil"===m,()=>"import { RecoilRoot } from 'recoil';",()=>"import store from '../store';")}
 
     const MyApp = () => {
       // ZMP Parameters
       const zmpparams = {
-${indent(8, appParameters(options))}
+${e(8,a(t))}
       };
 
       ${`
-      return (${stateManagement === 'recoil' ? `
-        <RecoilRoot>` : ''}
-        ${indent(stateManagement === 'recoil' ? 2 : 0, `<App {...zmpparams} ${theming.darkTheme ? 'themeDark' : ''}>`)}
-${indent(stateManagement === 'recoil' ? 12 : 10, views)}
-        ${indent(stateManagement === 'recoil' ? 2 : 0, `</App>`)}${stateManagement === 'recoil' ? `
-        </RecoilRoot>` : ''}
+      return (${"recoil"===m?`
+        <RecoilRoot>`:""}
+        ${e("recoil"===m?2:0,`<App {...zmpparams} ${r.darkTheme?"themeDark":""}>`)}
+${e("recoil"===m?12:10,n)}
+        ${e("recoil"===m?2:0,"</App>")}${"recoil"===m?`
+        </RecoilRoot>`:""}
       );
       `.trim()}
     }
     export default MyApp;
-    `
-  ).trim();
-};
+    `).trim()};

package/create/templates/react-typescript/generate-routes.js

@@ -1,12 +1 @@
-module.exports = (options) => {
-  const { template } = options;
-
-  if (template === 'blank') {
-    return [];
-  }
-  const routes = ['/user', '/form', '/dynamic-route', '/about', '/404'];
-  if (template === 'tabs') {
-    routes.push(...['/catalog', '/settings']);
-  }
-  return routes;
-};
+"use strict";module.exports=t=>{let{template:e}=t;if("blank"===e)return[];let r=["/user","/form","/dynamic-route","/about","/404"];return"tabs"===e&&r.push("/catalog","/settings"),r};

package/create/templates/react-typescript/generate-scripts.js

@@ -1,50 +1,29 @@
-const templateIf = require('../../utils/template-if');
-const indent = require('../../utils/indent');
-const stylesExtension = require('../../utils/styles-extension');
-
-module.exports = (options) => {
-  const { cssPreProcessor, theming, customBuild, includeTailwind } = options;
-  let scripts = '';
-
-  scripts += indent(
-    0,
-    `
+"use strict";const t=require("../../utils/template-if"),o=require("../../utils/indent"),e=require("../../utils/styles-extension");module.exports=r=>{let{cssPreProcessor:p,theming:m,customBuild:s,includeTailwind:i}=r,n="";return(n+=o(0,`
     // Import React and ReactDOM
     import React from 'react';
     import { createRoot } from 'react-dom/client';
 
     // Import ZMP
-    import ZMP from '${
-      customBuild ? './zmp-custom.js' : 'zmp-framework/core/lite-bundle'
-    }';
+    import ZMP from '${s?"./zmp-custom.js":"zmp-framework/core/lite-bundle"}';
 
     // Import ZMP-React Plugin
-    import ZMPReact from 'zmp-framework/react';${includeTailwind ? `
+    import ZMPReact from 'zmp-framework/react';${i?`
 
     // Import tailwind styles
-    import './css/tailwind.css';` : ''}
+    import './css/tailwind.css';`:""}
 
     // Import ZMP Styles
-    ${templateIf(
-      customBuild,
-      () => `
+    ${t(s,()=>`
     import './css/zmp-custom.less';
-    `,
-      () => `
-    import 'zmp-framework/${
-      theming.useUiKits ? 'zmp-bundle.min.css' : 'zmp.min.css'
-    }';
-    `
-    )}
+    `,()=>`
+    import 'zmp-framework/${m.useUiKits?"zmp-bundle.min.css":"zmp.min.css"}';
+    `)}
 
     // Import Icons and App Custom Styles
-    ${templateIf(
-      theming.iconFonts,
-      () => `
+    ${t(m.iconFonts,()=>`
     import './css/icons.css';
-    `
-    )}
-    import './css/app.${stylesExtension(cssPreProcessor)}';
+    `)}
+    import './css/app.${e(p)}';
 
     // Import App Component
     import App from './components/app';
@@ -60,8 +39,4 @@ module.exports = (options) => {
     // Mount React App
     const root = createRoot(document.getElementById('app')!);
     root.render(React.createElement(App));
-  `
-  );
-
-  return scripts.trim();
-};
+  `)).trim()};

package/create/templates/react-typescript/pages/404.js

@@ -1,10 +1,4 @@
-const indent = require('../../../utils/indent');
-
-// eslint-disable-next-line no-unused-vars
-module.exports = (options) => {
-  return indent(
-    0,
-    `
+"use strict";const t=require("../../../utils/indent");module.exports=e=>t(0,`
     import React from 'react';
     import { Page, Card, Title, Box } from 'zmp-framework/react';
     import NavbarBack from '../components/navbar-back';
@@ -22,6 +16,4 @@ module.exports = (options) => {
     );
     
     export default NotFoundPage;    
-  `
-  ).trim();
-};
+  `).trim();

package/create/templates/react-typescript/pages/about.js

@@ -1,10 +1,4 @@
-const indent = require('../../../utils/indent');
-
-// eslint-disable-next-line no-unused-vars
-module.exports = (options) => {
-  return indent(
-    0,
-    `
+"use strict";const t=require("../../../utils/indent");module.exports=o=>t(0,`
     import React from 'react'
     import { Actions, ActionsButton, ActionsGroup, ActionsLabel, Button, Card, Page, Box } from 'zmp-framework/react';
     import NavbarBack from '../components/navbar-back';
@@ -47,6 +41,4 @@ module.exports = (options) => {
     }
 
     export default AboutPage;
-  `
-  ).trim();
-};
+  `).trim();

package/create/templates/react-typescript/pages/catalog.js

@@ -1,11 +1,4 @@
-const indent = require('../../../utils/indent');
-
-// eslint-disable-next-line no-unused-vars
-module.exports = (options) => {
-  if (options.stateManagement === 'recoil') {
-    return indent(
-      0,
-      `
+"use strict";const t=require("../../../utils/indent");module.exports=e=>"recoil"===e.stateManagement?t(0,`
       import React from "react";
       import { useRecoilState } from 'recoil';
       import { Page, Title, List, ListItem, Box, Button } from 'zmp-framework/react';
@@ -51,12 +44,7 @@ module.exports = (options) => {
       };
   
       export default CatalogPage;
-    `
-    ).trim();
-  }
-  return indent(
-    0,
-    `
+    `).trim():t(0,`
     import React from "react";
     import {
       Page,
@@ -107,6 +95,4 @@ module.exports = (options) => {
     };
 
     export default CatalogPage;
-  `
-  ).trim();
-};
+  `).trim();

package/create/templates/react-typescript/pages/dynamic-route.js

@@ -1,10 +1,4 @@
-const indent = require('../../../utils/indent');
-
-// eslint-disable-next-line no-unused-vars
-module.exports = (options) => {
-  return indent(
-    0,
-    `
+"use strict";const t=require("../../../utils/indent");module.exports=e=>t(0,`
     import React from 'react'
     import { Button, Box, List, ListItem, Page } from 'zmp-framework/react'
     import NavbarBack from '../components/navbar-back';
@@ -75,6 +69,4 @@ module.exports = (options) => {
     }
 
     export default DymanicRoutePage;
-  `
-  ).trim();
-};
+  `).trim();