doriansmiley

import {ComponentEvent} from '../..';
import {Component, mixin} from './AbstractComponent';
import {createComponent as createAbstractComponent} from './AbstractComponent';

// export interfaces
export interface ButtonComponent extends Component {
    onClick: (event: Event) => void;
};

export const createComponent = (): ButtonComponent => {

doriansmiley

import {Binder, UuidUtils, EventDispatcher, IEventDispatcher, IEvent} from 'lavenderjs/lib';
import { List } from 'immutable';
// interfaces
export interface Component extends IEventDispatcher {
    ready: boolean;
    id: string;
    element: HTMLElement;
    binder: Binder;
    destroy(): void;
    init(): void;

doriansmiley

import {AbstractComponent} from './AbstractComponent';
import {SkinPart} from './SkinPart';
import {ComponentEvent} from '../control/events/ComponentEvent';

/**
 * Created by dsmiley on 7/26/17.
 */
export class Button extends AbstractComponent {
    public buttonSkinPart: HTMLElement;

doriansmiley

export const mixin = <T>(target, sub, params = null): T => {
    // IMPORTANT: mixin is designed to function like Object.assign, just respects accessors
    // grab enumerable properties of the target object
    const keys = Object.keys(sub);
    keys.forEach((prop) => {
        const methodDef = Object.getOwnPropertyDescriptor(sub, prop);
        // check if this property uses accessor methods (Object.assign can't do this!)
        if (methodDef && (methodDef.get || methodDef.set)) {
            // yep
            addProperty(target, prop, Object.getOwnPropertyDescriptor(sub, prop).get,

doriansmiley

import {ButtonComponent, createComponent as createButtonComponent} from './Button';
import {mixin} from './AbstractComponent';

// export interfaces
export interface SuperButton extends ButtonComponent {
    onMouseOverLabel: (event: Event) => void;
};

export const createComponent = (): SuperButton => {
    const clone =  mixin<SuperButton>(createButtonComponent(), {

doriansmiley

import React, { useEffect, useRef } from 'react';
import logo from './logo.svg';
import './App.css';
import * as Button from 'lotusjs-components/lib/view/functional/Button';
import * as AbstractComponent from 'lotusjs-components/lib/view/functional/AbstractComponent';
import * as ComponentRegistry from 'lotusjs-components/lib/context/functional/ComponentRegistry';

function App() {
  const template = document.createElement('div');
  template.innerHTML = '<template id="app">\n' +

doriansmiley

/*
* Below is an example of using a builder pattern to distill a declerative function to add/remove event listeners
*/
function callback (event) {
    console.log(event);
}

function addEventListeners1 () {
    this.element.addEventListener('click', callback);
}

doriansmiley

{
  "$schema": "../node_modules/@angular-devkit/schematics/collection-schema.json",
  "schematics": {
    "create": {
      "description": "Creates a stub TypeScript project.",
      "factory": "./create/index#create",
      "schema": "./create/schema.json"
    }
  }
}

doriansmiley

{
  _a: "x",
  _b: "z",
  a: "x",
  b: "z",
  log: log() {
      console.log(`hellow world, I am and isntance of vo2 and my values are a: ${this.a} b: ${this.b}`);
    }
}
"hellow world, I am and isntance of vo2 and my values are a: x b: z"

doriansmiley

// eslint-disable-next-line @typescript-eslint/no-var-requires
const express = require('express');
// eslint-disable-next-line @typescript-eslint/no-var-requires
const path = require('path');
const app = express();
// eslint-disable-next-line @typescript-eslint/no-var-requires
const cors = require('cors');
const port = process.argv[2] || 3000;
// eslint-disable-next-line @typescript-eslint/no-var-requires
const ssr = require('./ssr/ssr');