@htmlplus/element 0.1.9 → 0.3.1

package/dist/client/helpers/styles.js

@@ -1,16 +0,0 @@
-import { paramCase } from 'change-case';
-import { typeOf } from '../utils/index.js';
-export const styles = (input) => {
-    switch (typeOf(input)) {
-        case 'array':
-            return input.join('; ');
-        case 'object':
-            return Object.keys(input)
-                .map((key) => `${paramCase(key)}: ${input[key]}`)
-                .join('; ');
-        case 'string':
-            return input;
-        default:
-            return '';
-    }
-};

package/dist/client/helpers/to-unit.d.ts

@@ -1 +0,0 @@
-export declare const toUnit: (input: string | number, unit?: string) => string | undefined;

package/dist/client/helpers/to-unit.js

@@ -1,7 +0,0 @@
-export const toUnit = (input, unit = 'px') => {
-    if (input == null || input === '')
-        return undefined;
-    if (isNaN(+input))
-        return String(input);
-    return `${Number(input)}${unit}`;
-};

package/dist/client/index.d.ts

@@ -1,3 +0,0 @@
-export * from './decorators/index.js';
-export * from './helpers/index.js';
-export * from './services/index.js';

package/dist/client/index.js

@@ -1,3 +0,0 @@
-export * from './decorators/index.js';
-export * from './helpers/index.js';
-export * from './services/index.js';

package/dist/client/services/index.d.ts

@@ -1 +0,0 @@
-export * from './link.js';

package/dist/client/services/index.js

@@ -1 +0,0 @@
-export * from './link.js';

package/dist/client/services/link.d.ts

@@ -1,4 +0,0 @@
-export declare type LinkConfig = {
-    scope?: Function;
-};
-export declare const createLink: (namespace: string) => any;

package/dist/client/services/link.js

@@ -1,196 +0,0 @@
-import { defineProperty, host } from '../utils/index.js';
-const links = new Map();
-// TODO: return type
-export const createLink = (namespace) => {
-    if (links.has(namespace))
-        return links.get(namespace);
-    const config = {
-        scope: (i) => i.connector
-    };
-    let disconnecting = false;
-    const children = new Map();
-    const parents = new Map();
-    const properties = [];
-    const find = (source) => {
-        return properties.find((destination) => destination.instance === source.instance && destination.name === source.name);
-    };
-    const register = (source) => {
-        properties.push(source);
-        if (!children.has(source.instance))
-            children.set(source.instance, new Set());
-        // TODO: any
-        const siblings = children.get(source.instance);
-        siblings.add(source);
-    };
-    const unregister = (source) => {
-        // TODO: any
-        source = find(source);
-        const index = properties.findIndex((property) => property === source);
-        if (index === -1)
-            return;
-        properties.splice(index, 1);
-        // TODO: any
-        const siblings = children.get(source.instance);
-        siblings.delete(source);
-        if (siblings.size)
-            return;
-        children.delete(source.instance);
-        parents.delete(source.instance);
-    };
-    const get = (source) => {
-        // TODO: any
-        return source.instance[source.name];
-    };
-    const set = (source, value) => {
-        // TODO: any
-        source.instance[source.name] = value;
-    };
-    const reset = (source) => {
-        if (source.type === 'action')
-            return;
-        if (source.type === 'inject')
-            return set(source, source.value /* TODO */);
-        // TODO: any
-        defineProperty(source.instance, source.name, {
-            value: get(source) /* TODO */,
-            enumerable: true,
-            configurable: true
-        });
-    };
-    const map = (source, destination) => {
-        let value = get(source);
-        if (typeof value === 'function')
-            value = value.bind(source.instance);
-        set(destination, value);
-    };
-    const proxy = (source) => {
-        let value = get(source);
-        // TODO: any
-        defineProperty(source.instance, source.name, {
-            enumerable: true,
-            configurable: true,
-            get() {
-                return value;
-            },
-            set(input) {
-                if (input === value)
-                    return;
-                value = input;
-                siblings(source, ['inject']).map((destination) => set(destination, value));
-            }
-        });
-    };
-    const parent = (source) => {
-        var _a;
-        const cache = parents.get(source.instance);
-        if (cache)
-            return cache;
-        // TODO: element? and any
-        let parent = (_a = source.element) === null || _a === void 0 ? void 0 : _a.parentElement;
-        while (parent) {
-            if (parent.shadowRoot) {
-                const item = properties.find((property) => property.element === parent && property.name === source.name);
-                if (item) {
-                    parents.set(source.instance, item);
-                    return item;
-                }
-            }
-            parent = parent.parentElement;
-        }
-    };
-    const scope = (source) => {
-        var _a, _b;
-        if (!source)
-            return;
-        // TODO
-        if (disconnecting)
-            return source.instance['$scope-prev'];
-        // TODO: &&
-        let input = config.scope && config.scope(source.instance);
-        if (typeof input !== 'undefined')
-            return input;
-        // TODO: any
-        return ((_b = (_a = scope(parent(source))) !== null && _a !== void 0 ? _a : source.instance['$scope-auto']) !== null && _b !== void 0 ? _b : (source.instance['$scope-auto'] = Math.random()));
-    };
-    const siblings = (source, types) => {
-        return properties.filter((destination) => {
-            // TODO: any
-            if (!types.includes(destination.type))
-                return false;
-            if (source === destination)
-                return false;
-            if (source.name !== destination.name)
-                return false;
-            if (scope(source) !== scope(destination))
-                return false;
-            return true;
-        });
-    };
-    const connect = (source) => {
-        // TODO
-        source.instance['$scope-prev'] = scope(source);
-        register(source);
-        switch (source.type) {
-            case 'action':
-                siblings(source, ['inject']).forEach((destination) => map(source, destination));
-                break;
-            case 'observable':
-                proxy(source);
-                siblings(source, ['inject']).forEach((destination) => map(source, destination));
-                break;
-            case 'inject':
-                siblings(source, ['action', 'observable']).forEach((destination) => map(destination, source));
-                break;
-        }
-    };
-    const disconnect = (source) => {
-        reset(source);
-        if (source.type === 'inject')
-            return unregister(source);
-        siblings(source, ['inject']).forEach(reset);
-        unregister(source);
-    };
-    const reconnect = (instance) => {
-        const p = properties.filter((property) => property.instance === instance);
-        disconnecting = true;
-        p.forEach(disconnect);
-        disconnecting = false;
-        p.forEach(connect);
-    };
-    const decorator = (type) => () => (target, name) => {
-        const connected = target.connectedCallback;
-        target.connectedCallback = function () {
-            connected && connected.bind(this)();
-            const property = {
-                element: host(this),
-                instance: this,
-                name,
-                type,
-                value: this[name]
-            };
-            if (find(property))
-                console.error('TODO: Error log');
-            connect(property);
-        };
-        const disconnected = target.disconnectedCallback;
-        target.disconnectedCallback = function () {
-            disconnected && disconnected.bind(this)();
-            const property = find({ instance: this, name });
-            if (!property)
-                console.error('TODO: Error log');
-            // TODO: any
-            disconnect(property);
-        };
-    };
-    const Action = decorator('action');
-    const Inject = decorator('inject');
-    const Observable = decorator('observable');
-    const result = {
-        Action,
-        Inject,
-        Observable,
-        reconnect
-    };
-    links.set(namespace, result);
-    return result;
-};

package/dist/client/utils/append-to-method.d.ts

@@ -1,2 +0,0 @@
-import { PlusElement } from '../../types/index.js';
-export declare const appendToMethod: (target: PlusElement, propertyKey: PropertyKey, handler: (this: any, args: Array<any>) => void) => void;

package/dist/client/utils/append-to-method.js

@@ -1,7 +0,0 @@
-export const appendToMethod = (target, propertyKey, handler) => {
-    const callback = target[propertyKey];
-    target[propertyKey] = function () {
-        handler.bind(this)(Array.from(arguments));
-        return callback === null || callback === void 0 ? void 0 : callback.bind(this)(arguments);
-    };
-};

package/dist/client/utils/call.d.ts

@@ -1,2 +0,0 @@
-import { PlusElement } from '../../types/index.js';
-export declare const call: (target: PlusElement, key: string, ...args: Array<any>) => any;

package/dist/client/utils/call.js

@@ -1,4 +0,0 @@
-export const call = (target, key, ...args) => {
-    var _a;
-    return (_a = target[key]) === null || _a === void 0 ? void 0 : _a.call(target, ...args);
-};

package/dist/client/utils/define-property.d.ts

@@ -1 +0,0 @@
-export declare const defineProperty: <T>(o: T, p: PropertyKey, attributes: PropertyDescriptor & ThisType<any>) => T;

package/dist/client/utils/define-property.js

@@ -1 +0,0 @@
-export const defineProperty = Object.defineProperty;

package/dist/client/utils/event.d.ts

@@ -1,2 +0,0 @@
-export declare const on: (target: Window | Document | Element, event: string, handler: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined) => void;
-export declare const off: (target: Window | Document | Element, event: string, handler: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions | undefined) => void;

package/dist/client/utils/event.js

@@ -1,6 +0,0 @@
-export const on = (target, event, handler, options) => {
-    target.addEventListener(event, handler, options);
-};
-export const off = (target, event, handler, options) => {
-    target.removeEventListener(event, handler, options);
-};

package/dist/client/utils/get-members.d.ts

@@ -1,2 +0,0 @@
-import { PlusElement } from '../../types/index.js';
-export declare const getMembers: (target: PlusElement) => any;

package/dist/client/utils/get-members.js

@@ -1,5 +0,0 @@
-import * as CONSTANTS from '../../configs/constants.js';
-export const getMembers = (target) => {
-    var _a;
-    return (_a = target.constructor[CONSTANTS.STATIC_MEMBERS]) !== null && _a !== void 0 ? _a : target[CONSTANTS.STATIC_MEMBERS];
-};

package/dist/client/utils/get-styles.d.ts

@@ -1,2 +0,0 @@
-import { PlusElement } from '../../types/index.js';
-export declare const getStyles: (target: PlusElement) => string | undefined;

package/dist/client/utils/get-styles.js

@@ -1,5 +0,0 @@
-import * as CONSTANTS from '../../configs/constants.js';
-export const getStyles = (target) => {
-    var _a;
-    return (_a = target.constructor[CONSTANTS.STATIC_STYLES]) !== null && _a !== void 0 ? _a : target[CONSTANTS.STATIC_STYLES];
-};

package/dist/client/utils/host.d.ts

@@ -1,2 +0,0 @@
-import { PlusElement } from '../../types/index.js';
-export declare const host: (target: PlusElement) => HTMLElement;

package/dist/client/utils/host.js

@@ -1,4 +0,0 @@
-import * as CONSTANTS from '../../configs/constants.js';
-export const host = (target) => {
-    return target[CONSTANTS.API_HOST]();
-};

package/dist/client/utils/index.d.ts

@@ -1,20 +0,0 @@
-export * from './append-to-method.js';
-export * from './call.js';
-export * from './define-property.js';
-export * from './event.js';
-export * from './get-members.js';
-export * from './get-styles.js';
-export * from './host.js';
-export * from './is-event.js';
-export * from './is-ready.js';
-export * from './is-server.js';
-export * from './on-ready.js';
-export * from './parse-value.js';
-export * from './render.js';
-export * from './request.js';
-export * from './sync.js';
-export * from './task.js';
-export * from './to-boolean.js';
-export * from './to-event.js';
-export * from './type-of.js';
-export * from './update-attribute.js';

package/dist/client/utils/index.js

@@ -1,20 +0,0 @@
-export * from './append-to-method.js';
-export * from './call.js';
-export * from './define-property.js';
-export * from './event.js';
-export * from './get-members.js';
-export * from './get-styles.js';
-export * from './host.js';
-export * from './is-event.js';
-export * from './is-ready.js';
-export * from './is-server.js';
-export * from './on-ready.js';
-export * from './parse-value.js';
-export * from './render.js';
-export * from './request.js';
-export * from './sync.js';
-export * from './task.js';
-export * from './to-boolean.js';
-export * from './to-event.js';
-export * from './type-of.js';
-export * from './update-attribute.js';

package/dist/client/utils/is-event.d.ts

@@ -1 +0,0 @@
-export declare const isEvent: (input: string) => boolean;

package/dist/client/utils/is-event.js

@@ -1,3 +0,0 @@
-export const isEvent = (input) => {
-    return !!(input === null || input === void 0 ? void 0 : input.match(/on[A-Z]\w+/g));
-};

package/dist/client/utils/is-ready.d.ts

@@ -1,2 +0,0 @@
-import { PlusElement } from '../../types/index.js';
-export declare const isReady: (target: PlusElement) => boolean;

package/dist/client/utils/is-ready.js

@@ -1,4 +0,0 @@
-import * as CONSTANTS from '../../configs/constants.js';
-export const isReady = (target) => {
-    return target[CONSTANTS.API_READY];
-};

package/dist/client/utils/is-server.d.ts

@@ -1 +0,0 @@
-export declare const isServer: () => boolean;

package/dist/client/utils/is-server.js

@@ -1,3 +0,0 @@
-export const isServer = () => {
-    return !(typeof window != 'undefined' && window.document);
-};

package/dist/client/utils/on-ready.d.ts

@@ -1,2 +0,0 @@
-import { PlusElement } from '../../types/index.js';
-export declare function onReady(target: PlusElement, callback: (this: any) => void): void;

package/dist/client/utils/on-ready.js

@@ -1,6 +0,0 @@
-import * as CONSTANTS from '../../configs/constants.js';
-export function onReady(target, callback) {
-    var _a;
-    var _b;
-    ((_a = target[_b = CONSTANTS.API_SETUP]) !== null && _a !== void 0 ? _a : (target[_b] = [])).push(callback);
-}

package/dist/client/utils/parse-value.d.ts

@@ -1 +0,0 @@
-export declare const parseValue: (value: any, type: any) => any;

package/dist/client/utils/parse-value.js

@@ -1,15 +0,0 @@
-import * as CONSTANTS from '../../configs/constants.js';
-import { toBoolean } from './to-boolean.js';
-// TODO: input type & validate date
-export const parseValue = (value, type) => {
-    switch (type) {
-        case CONSTANTS.TYPE_BOOLEAN:
-            return toBoolean(value);
-        case CONSTANTS.TYPE_DATE:
-            return new Date(value);
-        case CONSTANTS.TYPE_NUMBER:
-            return parseFloat(value);
-        default:
-            return value;
-    }
-};

package/dist/client/utils/render.d.ts

@@ -1,2 +0,0 @@
-import { PlusElement } from '../../types/index.js';
-export declare const render: (target: PlusElement) => void;

package/dist/client/utils/render.js

@@ -1,17 +0,0 @@
-import { html, render as renderer } from 'uhtml';
-import * as CONSTANTS from '../../configs/constants.js';
-import { call, getStyles, host } from '../utils/index.js';
-export const render = (target) => {
-    const element = host(target);
-    renderer(element.shadowRoot, () => {
-        const markup = call(target, CONSTANTS.METHOD_RENDER);
-        const styles = getStyles(target);
-        if (!styles && !markup)
-            return html ``;
-        if (!styles)
-            return markup;
-        if (!markup)
-            return html `<style>${styles}</style>`;
-        return html `<style>${styles}</style>${markup}`;
-    });
-};

package/dist/client/utils/request.d.ts

@@ -1,2 +0,0 @@
-import { PlusElement } from '../../types/index.js';
-export declare const request: (target: PlusElement, state?: any) => Promise<boolean>;

package/dist/client/utils/request.js

@@ -1,25 +0,0 @@
-import * as CONSTANTS from '../../configs/constants.js';
-import { call, isReady, render, task } from '../utils/index.js';
-const targets = new Map();
-export const request = (target, state) => {
-    if (!isReady(target))
-        return Promise.resolve(false);
-    let run = targets.get(target);
-    if (run)
-        return run(state);
-    run = task({
-        canStart: (states, state) => {
-            return /* hasChange */ true;
-        },
-        canRun: (states) => {
-            return /* shouldUpdate */ true;
-        },
-        run: (states) => {
-            call(target, CONSTANTS.LIFECYCLE_UPDATE, states);
-            render(target);
-            call(target, CONSTANTS.LIFECYCLE_UPDATED, states);
-        }
-    });
-    targets.set(target, run);
-    return run(state);
-};

package/dist/client/utils/sync.d.ts

@@ -1 +0,0 @@
-export declare const sync: (node: HTMLElement) => (next?: any) => void;

package/dist/client/utils/sync.js

@@ -1,31 +0,0 @@
-import { on, off } from './event.js';
-import { isEvent } from './is-event.js';
-import { toEvent } from './to-event.js';
-import { updateAttribute } from './update-attribute.js';
-export const sync = (node) => {
-    let prev = {};
-    return (next = {}) => {
-        const prevClass = (prev.class || '').split(' ');
-        const nextClass = (next.class || '').split(' ');
-        const newClass = node.className
-            .split(' ')
-            .filter((key) => !prevClass.includes(key) && !nextClass.includes(key))
-            .concat(nextClass)
-            .filter((key) => key)
-            .join(' ');
-        updateAttribute(node, 'class', newClass || undefined);
-        if (prev.style || next.style)
-            node.setAttribute('style', next.style || '');
-        for (const key in prev)
-            isEvent(key) && off(node, toEvent(key), prev[key]);
-        for (const key in next) {
-            if (['class', 'style'].includes(key))
-                continue;
-            if (isEvent(key))
-                on(node, toEvent(key), next[key]);
-            else
-                updateAttribute(node, key, next[key]);
-        }
-        prev = Object.assign({}, next);
-    };
-};

package/dist/client/utils/task.d.ts

@@ -1,6 +0,0 @@
-export interface QueueOptions {
-    canStart?: (states: any, state: any) => boolean;
-    canRun?: (states: any) => boolean;
-    run: (states: any) => void;
-}
-export declare const task: (options: QueueOptions) => (state?: any) => Promise<boolean>;

package/dist/client/utils/task.js

@@ -1,46 +0,0 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-export const task = (options) => {
-    let states, isPending, updatePromise;
-    const run = (state) => {
-        const newStates = Object.assign({}, states, state);
-        if (options.canStart && !options.canStart(newStates, state))
-            return Promise.resolve(false);
-        states = newStates;
-        if (!isPending)
-            updatePromise = enqueue();
-        return updatePromise;
-    };
-    const enqueue = () => __awaiter(void 0, void 0, void 0, function* () {
-        isPending = true;
-        try {
-            yield updatePromise;
-        }
-        catch (error) {
-            Promise.reject(error);
-        }
-        // TODO: maybe is optional
-        if (!isPending)
-            return updatePromise;
-        try {
-            if (options.canRun && !options.canRun(states))
-                return (isPending = false);
-            options.run(states);
-            states = undefined;
-            isPending = false;
-            return true;
-        }
-        catch (error) {
-            isPending = false;
-            throw error;
-        }
-    });
-    return run;
-};

package/dist/client/utils/to-boolean.d.ts

@@ -1 +0,0 @@
-export declare const toBoolean: (input: any) => boolean;

package/dist/client/utils/to-boolean.js

@@ -1,3 +0,0 @@
-export const toBoolean = (input) => {
-    return ![undefined, null, false, 'false'].includes(input);
-};

package/dist/client/utils/to-event.d.ts

@@ -1 +0,0 @@
-export declare const toEvent: (input: string) => string;

package/dist/client/utils/to-event.js

@@ -1,3 +0,0 @@
-export const toEvent = (input) => {
-    return input === null || input === void 0 ? void 0 : input.slice(2).toLowerCase();
-};

package/dist/client/utils/type-of.d.ts

@@ -1,3 +0,0 @@
-declare type Types = 'array' | 'boolean' | 'function' | 'number' | 'object' | 'string';
-export declare const typeOf: (input: any) => Types;
-export {};

package/dist/client/utils/type-of.js

@@ -1,6 +0,0 @@
-export const typeOf = (input) => {
-    return Object.prototype.toString
-        .call(input)
-        .replace(/\[|\]|object| /g, '')
-        .toLowerCase();
-};

package/dist/client/utils/update-attribute.d.ts

@@ -1 +0,0 @@
-export declare const updateAttribute: (node: Element, key: string, value: any) => void;

package/dist/client/utils/update-attribute.js

@@ -1,7 +0,0 @@
-import { paramCase } from 'change-case';
-export const updateAttribute = (node, key, value) => {
-    const name = paramCase(key);
-    if ([undefined, null, false].includes(value))
-        return node.removeAttribute(name);
-    node.setAttribute(name, value === true ? '' : value);
-};

package/dist/compiler/compiler.d.ts

@@ -1,7 +0,0 @@
-import { Context, Plugin } from '../types/index.js';
-declare const _default: (...plugins: Array<Plugin>) => {
-    start: () => Promise<void>;
-    next: (filePath: string) => Promise<Context>;
-    finish: () => Promise<void>;
-};
-export default _default;