apprun 3.28.8 → 3.28.11

package/esm/web-component.js.map

@@ -1 +1 @@
-{"version":3,"file":"web-component.js","sourceRoot":"","sources":["../src/web-component.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"web-component.js","sourceRoot":"","sources":["../src/web-component.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,10 +1,11 @@
 {
   "name": "apprun",
-  "version": "3.28.8",
+  "version": "3.28.11",
   "description": "JavaScript library that has Elm inspired architecture, event pub-sub and components",
   "main": "dist/apprun.js",
   "module": "dist/apprun.esm.js",
   "types": "apprun.d.ts",
+  "type": "module",
   "bin": {
     "apprun": "apprun-cli.js"
   },
@@ -37,26 +38,23 @@
     "url": "https://github.com/yysun/apprun/issues"
   },
   "homepage": "https://github.com/yysun/apprun#readme",
-  "dependencies": {
-    "commander": "^7.2.0"
-  },
   "devDependencies": {
-    "@rollup/plugin-commonjs": "^21.0.1",
+    "@rollup/plugin-commonjs": "^21.0.2",
     "@rollup/plugin-node-resolve": "^13.1.3",
-    "@types/jest": "^27.4.0",
+    "@types/jest": "^27.4.1",
     "jest": "^27.5.1",
     "json-loader": "^0.5.7",
-    "lit-html": "^2.1.3",
+    "lit-html": "^2.2.1",
     "marked": "^4.0.12",
-    "rollup": "^2.67.2",
+    "rollup": "^2.70.1",
     "rollup-plugin-filesize": "^9.1.2",
     "rollup-plugin-node-resolve": "^5.2.0",
     "rollup-plugin-sourcemaps": "^0.6.3",
     "rollup-plugin-terser": "^7.0.2",
     "ts-jest": "^27.1.3",
-    "ts-loader": "^9.2.6",
-    "typescript": "^4.5.5",
-    "webpack": "^5.68.0",
+    "ts-loader": "^9.2.8",
+    "typescript": "^4.6.2",
+    "webpack": "^5.70.0",
     "webpack-cli": "^4.9.2",
     "webpack-dev-server": "^4.7.4"
   },

package/src/component.ts

@@ -144,7 +144,7 @@ export class Component<T = any, E = any> {
 
     if (options.route) {
       this.update = this.update || {};
-      this.update[options.route] = REFRESH;
+      if (!this.update[options.route]) this.update[options.route] = REFRESH;
     }
 
     this.add_actions();

package/src/directive.ts

@@ -19,15 +19,15 @@ const apply_directive = (key: string, props: {}, tag, component) => {
     const event = props[key];
     key = key.substring(1)
     if (typeof event === 'boolean') {
-      props[key] = e => component.run(key, e);
+      props[key] = e => component.run ? component.run(key, e) : app.run(key, e);
     } else if (typeof event === 'string') {
-      props[key] = e => component.run(event, e);
+      props[key] = e => component.run ? component.run(event, e) : app.run(event, e);
     } else if (typeof event === 'function') {
       props[key] = e => component.setState(event(component.state, e));
     } else if (Array.isArray(event)) {
       const [handler, ...p] = event;
       if (typeof handler === 'string') {
-        props[key] = e => component.run(handler, ...p, e);
+        props[key] = e => component.run ? component.run(handler, ...p, e) : app.run(handler, ...p, e);
       } else if (typeof handler === 'function') {
         props[key] = e => component.setState(handler(component.state, ...p, e));
       }

package/src/vdom-lit-html.ts

@@ -4,10 +4,12 @@ import { createElement, updateElement, Fragment } from './vdom-my';
 import { render, svg, html, noChange, nothing } from 'lit-html';
 import { directive, Directive, Part, PartInfo, PartType, EventPart } from 'lit-html/directive.js';
 import { unsafeHTML } from 'lit-html/directives/unsafe-html.js';
+import app from './apprun';
 
 function _render(element, vdom, parent?) {
   if (!vdom) return;
   if (typeof vdom === 'string') {
+    if (!element['_$litPart$']) element.replaceChildren();
     render(html`${unsafeHTML(vdom)}`, element);
   } else if ('_$litType$' in vdom) {
     if (!element['_$litPart$']) element.replaceChildren();
@@ -44,7 +46,10 @@ export class RunDirective extends Directive {
     }
     const [event, ...args] = params;
     if (typeof event === 'string') {
-      element[`on${name}`] = e => getComponent().run(event, ...args, e);
+      element[`on${name}`] = e => {
+        const component = getComponent();
+        component ? component.run(event, ...args, e) : app.run(event, ...args, e)
+      }
     } else if (typeof event === 'function') {
       element[`on${name}`] = e => getComponent().setState(event(getComponent().state, ...args, e));
     }

package/src/vdom-my.ts

@@ -1,4 +1,5 @@
 import { VDOM, VNode } from './types';
+import directive from './directive';
 export type Element = any; //HTMLElement | SVGSVGElement | SVGElement;
 
 export function Fragment(props, ...children): any[] {
@@ -36,10 +37,14 @@ export function createElement(tag: string | Function | [], props?: {}, ...childr
 
 const keyCache = new WeakMap();
 
-export const updateElement = render;
+export const updateElement = (element: Element, nodes: VDOM, component = {}) => {
+  // tslint:disable-next-line
+  if (nodes == null || nodes === false) return;
+  nodes = directive(nodes, component);
+  render(element, nodes, component);
+}
 
-export function render(element: Element, nodes: VDOM, parent = {}) {
-  // console.log('render', element, node);
+function render(element: Element, nodes: VDOM, parent = {}) {
   // tslint:disable-next-line
   if (nodes == null || nodes === false) return;
 

package/src/vdom.ts

@@ -1,7 +1,4 @@
 import { createElement, updateElement, Fragment } from './vdom-my';
-export function render(element, html, parent?) {
-  updateElement(element, html, parent);
-}
-export { createElement, Fragment };
+export { createElement, Fragment, updateElement as render};
 
 

package/src/web-component.ts

@@ -59,20 +59,22 @@ export const customElement = (componentClass, options: CustomElementOptions = {}
         });
       })
 
-      const children = this.children ? Array.from(this.children) : [];
-      children.forEach(el => el.parentElement.removeChild(el));
-      this._component = new componentClass({ ...props, children }).mount(this._shadowRoot, opts);
-      // attach props to component
-      this._component._props = props;
-      // expose dispatchEvent
-      this._component.dispatchEvent = this.dispatchEvent.bind(this)
-      if (this._component.mounted) {
-        const new_state = this._component.mounted(props, children, this._component.state);
-        if (typeof new_state !== 'undefined') this._component.state = new_state;
-      }
-      this.on = this._component.on.bind(this._component);
-      this.run = this._component.run.bind(this._component);
-      if (!(opts.render===false)) this._component.run('.');
+      requestAnimationFrame(() => {
+        const children = this.children ? Array.from(this.children) : [];
+        children.forEach(el => el.parentElement.removeChild(el));
+        this._component = new componentClass({ ...props, children }).mount(this._shadowRoot, opts);
+        // attach props to component
+        this._component._props = props;
+        // expose dispatchEvent
+        this._component.dispatchEvent = this.dispatchEvent.bind(this)
+        if (this._component.mounted) {
+          const new_state = this._component.mounted(props, children, this._component.state);
+          if (typeof new_state !== 'undefined') this._component.state = new_state;
+        }
+        this.on = this._component.on.bind(this._component);
+        this.run = this._component.run.bind(this._component);
+        if (!(opts.render === false)) this._component.run('.');
+      });
     }
   }
 

package/cli-templates/Layout.ts_

@@ -1,35 +0,0 @@
-
-import app from 'apprun';
-
-app.on('//', (route) => {
-  const menus = document.querySelectorAll('.navbar-nav li');
-  for (let i = 0; i < menus.length; ++i) {menus[i].classList.remove('active');}
-  const item = document.querySelector(`[href='${route}']`);
-  item && item.parentElement.classList.add('active');
-});
-
-export default () => <div class="container">
-  <nav class="navbar navbar-expand-lg navbar-light bg-light">
-    <a class="navbar-brand" href="#">Project Name</a>
-    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
-      aria-expanded="false" aria-label="Toggle navigation">
-      <span class="navbar-toggler-icon"></span>
-    </button>
-    <div class="collapse navbar-collapse" id="navbarSupportedContent">
-      <ul class="navbar-nav mr-auto">
-        <li class="nav-item active">
-          <a class="nav-link" href="#Home">Home
-            <span class="sr-only">(current)</span>
-          </a>
-        </li>
-        <li class="nav-item">
-          <a class="nav-link" href="#About">About</a>
-        </li>
-        <li class="nav-item">
-          <a class="nav-link" href="#Contact">Contact</a>
-        </li>
-      </ul>
-    </div>
-  </nav>
-  <div class="container" id="my-app"></div>
-</div>;

package/cli-templates/_build.js

@@ -1,27 +0,0 @@
-#!/usr/bin/env node
-const builder = require('esbuild');
-const server = require('apprun-dev-server');
-
-const build = (watch = false) => builder.build({
-  entryPoints: ['src/main.tsx'],
-  outfile: 'dist/main.js',
-  bundle: true,
-  minify: true,
-  sourcemap: true,
-  watch
-});
-
-const start = () => {
-  server.start({
-    host: 'localhost',
-    port: process.env.PORT || 8080,
-    watch: 'src'
-  });
-}
-
-if (!process.argv[2]) {
-  build();
-} else {
-  build(true);
-  start();
-}

package/cli-templates/_eslintrc.js

@@ -1,40 +0,0 @@
-/* eslint-disable no-undef */
-module.exports = {
-  env: {
-    browser: true,
-    es2021: true,
-  },
-  extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended'],
-  parser: '@typescript-eslint/parser',
-  parserOptions: {
-    ecmaVersion: 12,
-    sourceType: 'module',
-  },
-
-  plugins: ['@typescript-eslint'],
-
-  /// https://devstephen.medium.com/style-guides-for-linting-ecmascript-2015-eslint-common-google-airbnb-6c25fd3dff0
-  rules: {
-    indent: ['error', 2],
-    quotes: ['error', 'single'],
-    semi: ['error', 'always'],
-    'no-trailing-spaces': 'error',
-    'no-multiple-empty-lines': ['error', { 'max': 1, 'maxEOF': 0 }],
-    '@typescript-eslint/explicit-module-boundary-types': 'off',
-    'no-case-declarations': 'off',
-    'eqeqeq': 'error',
-    'curly': ['error', 'all'],
-    'brace-style': ['error', '1tbs', { 'allowSingleLine': true }],
-    'no-extra-parens': ['error', 'functions'],
-    'no-useless-catch': 'error',
-    'no-console': 'error',
-    'space-before-function-paren': ['error', { 'anonymous': 'always', 'named': 'never', 'asyncArrow': 'always' }],
-    'object-curly-spacing': ['error', 'always'],
-    'array-bracket-spacing': ['error', 'never'],
-    'no-unused-expressions': ['error', { allowShortCircuit: true }],
-    'arrow-parens': ['error', 'as-needed', { 'requireForBlockBody': true }],
-    '@typescript-eslint/no-unused-vars': ['error', { varsIgnorePattern: 'app' }],
-    'no-invalid-this': 'off',
-    '@typescript-eslint/no-invalid-this': ['error']
-  },
-};

package/cli-templates/_gitignore

@@ -1,6 +0,0 @@
-.DS_Store
-Thumbs.db
-*.log
-node_modules
-coverage
-.cache

package/cli-templates/component.ts_

@@ -1,14 +0,0 @@
-import { app, Component } from 'apprun';
-
-export default class #nameComponent extends Component {
-  state = '#name';
-
-  view = state => <div>
-    <h1>{state}</h1>
-  </div>;
-
-  update = {
-    '##name': state => state,
-  };
-}
-

package/cli-templates/index.html

@@ -1,10 +0,0 @@
-<!doctype html>
-<html>
-<head>
-  <meta charset="utf-8">
-  <title>AppRun App</title>
-</head>
-<body>
-  <script type="module" src="./dist/main.js"></script>
-</body>
-</html>

package/cli-templates/jest.config.js

@@ -1,19 +0,0 @@
-module.exports = {
-  "transform": {
-    "^.+\\.tsx?$": "ts-jest"
-  },
-  "testRegex": "(/__tests__/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$",
-  "moduleFileExtensions": [
-    "ts",
-    "tsx",
-    "js",
-    "jsx",
-    "json",
-    "node"
-  ],
-  "globals": {
-    "ts-jest": {
-      "diagnostics": true
-    }
-  },
-}

package/cli-templates/karma.conf.js

@@ -1,24 +0,0 @@
-var webpackConfig = require('./webpack.config');
-module.exports = function (config) {
-  config.set({
-    basePath: '',
-    frameworks: ["jasmine"],
-    files: [
-      { pattern: "tests/*.spec.*" }
-    ],
-    exclude: [
-    ],
-    preprocessors: {
-      'tests/*.spec.*': ['webpack'],
-    },
-    webpack: webpackConfig,
-    reporters: ["progress"],
-    colors: true,
-    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
-    logLevel: config.LOG_INFO,
-    browsers: ['Chrome'],
-    mime: {
-      'text/x-typescript': ['ts', 'tsx']
-    }
-  })
-}

package/cli-templates/main.ts_

@@ -1,13 +0,0 @@
-import app from 'apprun';
-
-const state = 'Hello world - AppRun !';
-
-const view = (state) => <div>
-  <h1>{state}</h1>
-</div>;
-
-const update = {
-
-};
-
-app.start(document.body, state, view, update);

package/cli-templates/readme.md

@@ -1,7 +0,0 @@
-##
-
-* Use _npm start_ to start the dev server
-* Use _npm test_ to run unit tests
-* Use _npm run build_ to build for production
-
-This is an application built with [AppRun](https://github.com/yysun/apprun).

package/cli-templates/spa_index.html

@@ -1,14 +0,0 @@
-<!doctype html>
-<html>
-<head>
-  <meta charset="utf-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-  <title>AppRun SPA</title>
-  <link rel="stylesheet" href="https://unpkg.com/bootstrap@4.4.1/dist/css/bootstrap.min.css">
-  <script src="https://unpkg.com/jquery@3.4.1/dist/jquery.slim.min.js"></script>
-  <script src="https://unpkg.com/popper.js@1.16.1/dist/umd/popper.min.js"></script>
-  <script src="https://unpkg.com/bootstrap@4.4.1/dist/js/bootstrap.min.js"></script>
-<body>
-  <script type="module" src="./dist/main.js"></script>
-</body>
-</html>

package/cli-templates/spa_main.ts_

@@ -1,12 +0,0 @@
-import app from 'apprun';
-import Home from './Home';
-import About from './About';
-import Contact from './Contact';
-import Layout from './Layout';
-
-app.render(document.body, <Layout />);
-
-const element = 'my-app';
-new Home().start(element);
-new About().mount(element);
-new Contact().mount(element);

package/cli-templates/spec.ts_

@@ -1,12 +0,0 @@
-import app from 'apprun';
-import #name from '../src/#name';
-
-describe('component', () => {
-  it('should render state upon route event', () => {
-    const element = document.createElement('div');
-    const component = new #name().mount(element);
-    app.run('##name');
-    expect(element.textContent).toBe('#name');
-    expect(component.state).toBe('#name');
-  });
-});

package/cli-templates/stories.js_

@@ -1,47 +0,0 @@
-import #name from '../#name';
-
-export default {
-  title: '#name',
-  argTypes: {
-    event: {
-      name: 'event',
-      type: { name: 'string', required: false },
-      description: 'event',
-      control: {
-        type: 'text'
-      }
-    },
-
-    route: {
-      name: 'route',
-      type: { name: 'string', required: false },
-      description: 'route',
-      control: {
-        type: 'text'
-      }
-    }
-  },
-};
-
-export const #name_Event = ({ event }) => {
-  const div = document.createElement('div');
-  const component = new #name().mount(div);
-  const e = JSON.parse(event);
-  const [name, ...params] = e;
-  component.run(name, ...params);
-  return div;
-};
-#name_Event.args = {
-  event: '["."]',
-};
-
-export const #name_Route = ({ route }) => {
-  const div = document.createElement('div');
-  new #name().mount(div);
-  app.route(route);
-  return div;
-};
-
-#name_Route.args = {
-  route: '##name',
-};

package/cli-templates/tsconfig.es5.json

@@ -1,15 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "es5",
-    "module": "es2015",
-    "moduleResolution": "node",
-    "jsx": "react",
-    "jsxFactory": "app.h",
-    "jsxFragmentFactory": "app.Fragment",
-    "lib": ["dom", "es2015", "es5"],
-    "experimentalDecorators": true,
-    "sourceMap": true,
-    "esModuleInterop": true,
-    "outDir": "dist"
-  }
-}

package/cli-templates/tsconfig.es6.json

@@ -1,15 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "es2015",
-    "module": "es2015",
-    "moduleResolution": "node",
-    "jsx": "react",
-    "jsxFactory": "app.h",
-    "jsxFragmentFactory": "app.Fragment",
-    "lib": ["dom", "es2015", "es5"],
-    "experimentalDecorators": true,
-    "sourceMap": true,
-    "esModuleInterop": true,
-    "outDir": "dist"
-  }
-}

package/cli-templates/webpack.config.js

@@ -1,24 +0,0 @@
-const path = require('path');
-module.exports = {
-  entry: {
-    'dist/main': './src/main.tsx',
-  },
-  output: {
-    filename: '[name].js',
-    path: path.resolve(__dirname)
-  },
-  resolve: {
-    extensions: ['.ts', '.tsx', '.js']
-  },
-  module: {
-    rules: [
-      { test: /\.tsx?$/, loader: 'ts-loader' },
-      { test: /\.js$/, use: ["source-map-loader"], enforce: "pre" }
-    ]
-  },
-  devServer: {
-    open: true,
-    static: path.join(__dirname),
-  },
-  devtool: 'source-map'
-}

package/index-apprun-play.html

@@ -1,46 +0,0 @@
-<!doctype html>
-<html>
-<head>
-  <meta charset="utf-8">
-  <title>AppRun Play</title>
-  <link rel="stylesheet" href="demo/lib/codemirror.css">
-  <script src="demo/lib/codemirror.js"></script>
-  <script src="demo/mode/javascript/javascript.js"></script>
-  <script src="demo/mode/xml/xml.js"></script>
-  <script src="demo/mode/jsx/jsx.js"></script>
-  <script src="dist/apprun-play.js"></script>
-</head>
-<body>
-  <textarea style="width:100%; height:300px">
-      const state = 0;
-      const view = state => {
-        return `<div>
-          <h1>${state}</h1>
-          <button onclick='app.run("-1")'>-1</button>
-          <button onclick='app.run("+1")'>+1</button>
-        </div>`;
-      };
-      const update = {
-        '+1': state => state + 1,
-        '-1': state => state - 1
-      };
-      app.start(document.body, state, view, update);
-    </textarea>
-<apprun-play></apprun-play>
-
-<textarea>
-<html>
-<body>
-<script src="https://unpkg.com/apprun/dist/apprun-html.js"></script>
-<script>
-  const view = state => `<div>${state}</div>`;
-  app.start(document.body, 'hello world', view);
-</script>
-</body>
-</html>
-</textarea>
-<p>
-  <apprun-play></apprun-play>
-</p>
-</body>
-</html>