yandel 1.2.0 → 1.2.2

package/dist/index.d.ts

@@ -1,2 +1,3 @@
-export { Component, createContext, createRoot, EffectHandler, Element, ElementRef, HTMLProps, HTMLTags, Portal, StateHandler, Stores, Styles, ValidNode, ValidNodeChild, ValidTemplateReturn, FutureNode, } from "./node";
+/// <reference path="../types/index.d.ts" preserve="true" />
+export { Component, createContext, createRoot, EffectHandler, Portal, Stores, ValidNode, ValidNodeChild, ValidTemplateReturn, FutureNode, } from "./node";
 export * from "./tags";

package/dist/index.js

@@ -1,2 +1,10 @@
-export { Component, createContext, createRoot, Portal, Stores, } from "./node";
+/// <reference path="../types/index.d.ts" preserve="true"/>
+export { Component, createContext, createRoot, 
+// Element,
+// ElementRef,
+// HTMLProps,
+// HTMLTags,
+Portal, 
+// StateHandler,
+Stores, } from "./node";
 export * from "./tags";

package/dist/node.d.ts

@@ -1,62 +1,12 @@
-type HTMLExcludedProperties = `aria${string}` | "tagName" | "shadowRoot" | "slot" | "classList" | "style" | "attributes" | "attributeStyleMap" | "ATTRIBUTE_NODE" | "CDATA_SECTION_NODE" | "COMMENT_NODE" | "childElementCount" | "childNodes" | "children" | "isConnected" | "ownerDocument" | "lastChild" | "lastElement" | "nextElementSibling" | "nextSibling" | "previousElementSibling" | "previousSibling" | "parentElement" | "parent" | "outerContent" | "firstChild" | "firstElementChild" | "lastChild" | "lastElementChild" | "innerHTML" | "outerHTML" | "innerContent" | "textContent" | `DOCUMENT_${string}` | "NOTATION_NODE" | "PROCESSING_INSTRUCTION_NODE" | "CONTENT_NODE" | "ELEMENT_NODE" | "TEXT_NODE" | `ENTITY_${string}`;
-type AriaWidgetProperties = "aria-autocomplete" | "aria-checked" | "aria-disabled" | "aria-errormessage" | "aria-expanded" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-label" | "aria-level" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-placeholder" | "aria-pressed" | "aria-readonly" | "aria-required" | "aria-selected" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext";
-type AriaLiveRegionProperties = "aria-busy" | "aria-live" | "aria-relevant" | "aria-atomic";
-type AriaDragAndDropProperties = "aria-dropeffect" | "aria-grabbed";
-type AriaRelatonshipProperties = "aria-activedescendant" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-describedby" | "aria-description" | "aria-details" | "aria-errormessage" | "aria-flowto" | "aria-labelledby" | "aria-owns" | "aria-posinset" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-setsize";
-type AriaGlobalProperties = "aria-atomic" | "aria-busy" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-live" | "aria-owns" | "aria-relevant" | "aria-roledescription";
-type AriaProps = AriaWidgetProperties | AriaDragAndDropProperties | AriaLiveRegionProperties | AriaRelatonshipProperties | AriaGlobalProperties;
-type AriaBoolean = "true" | "false";
-type AriaValue = Exclude<string, AriaBoolean>;
-type AriaValueMap = Partial<Record<AriaProps, AriaBoolean | AriaValue>>;
-type KeyedObject = Record<string | symbol | number, any>;
-type HTMLTags = keyof HTMLElementTagNameMap;
-type HTMLSVGTags = keyof SVGElementTagNameMap;
-type Element<K extends HTMLTags = HTMLTags> = HTMLElementTagNameMap[K];
-type SVGElement<K extends HTMLSVGTags = HTMLSVGTags> = SVGElementTagNameMap[K];
-interface SwitchableNode<T extends Node> {
-    switch(t: T): boolean;
-}
-type FutureNode = () => ValidNodeChild;
 type ValidNode = Node | Component | Component<KeyedObject> | FutureNode;
 type ValidNodeChild = ValidNode | null | string;
 type ValidTemplateReturn = ValidNodeChild | ValidNodeChild[];
+type FutureNode = () => ValidNodeChild;
 type EffectHandler = (() => void) | (() => () => void);
-type ExcludeFunctions<T> = {
-    [K in keyof T as T[K] extends Function ? never : K]: T[K];
-};
-type Styles = Partial<CSSStyleDeclaration>;
-interface ElementOverridedProperties extends AriaValueMap {
-    style?: Styles;
-}
-type AnyElement<T extends HTMLTags | HTMLSVGTags = HTMLTags> = T extends HTMLTags ? Element<T> : T extends HTMLSVGTags ? SVGElement<T> : never;
-type AnyProps<T extends HTMLTags | HTMLSVGTags = HTMLTags> = T extends HTMLTags ? HTMLProps<T> : T extends HTMLSVGTags ? SVGProps<T> : never;
-type ElementRef<T extends HTMLTags | HTMLSVGTags = HTMLTags> = Stores<(T extends HTMLTags ? HTMLElementTagNameMap[T] : T extends HTMLSVGTags ? SVGElementTagNameMap[T] : never) | undefined>;
-interface ElementProps<T extends HTMLTags | HTMLSVGTags = HTMLTags> {
-    ref?: ElementRef<T>;
-    key?: string | number | symbol;
-}
-type ExcludeProperties<T> = {
-    [K in keyof T as K extends HTMLExcludedProperties ? never : K]: T[K];
-};
-type HTMLProps<T extends HTMLTags> = Partial<ExcludeProperties<ExcludeFunctions<Element<T>>>> & ElementProps<T> & ElementOverridedProperties;
-type SVGAttributeValue = string | number;
-type NormalizeSVGProp<T> = T extends SVGAnimatedLength ? SVGAttributeValue : T extends SVGAnimatedAngle ? SVGAttributeValue : T extends SVGAnimatedBoolean ? SVGAttributeValue : T extends SVGAnimatedEnumeration ? SVGAttributeValue : T extends SVGAnimatedInteger ? SVGAttributeValue : T extends SVGAnimatedNumber ? SVGAttributeValue : T extends SVGAnimatedPreserveAspectRatio ? SVGAttributeValue : T extends SVGAnimatedRect ? SVGAttributeValue : T extends SVGAnimatedString ? SVGAttributeValue : T extends SVGAnimatedTransformList ? SVGAttributeValue : T extends SVGPointList ? SVGAttributeValue : T;
-type SVGRawProps<T extends HTMLSVGTags> = ExcludeProperties<ExcludeFunctions<SVGElementTagNameMap[T]>>;
-interface SVGOverridedProperties {
-    fill?: string;
-    "fill-opacity"?: string;
-    stroke?: string;
-    "stroke-width"?: SVGAttributeValue;
-    "stroke-linecap"?: "butt" | "round" | "square";
-    "stroke-linejoin"?: "miter" | "round" | "bevel";
-    d?: string;
-    "stroke-dasharray"?: SVGAttributeValue;
+interface SwitchableNode<T extends Node> {
+    switch(t: T): boolean;
 }
-type SVGProps<T extends HTMLSVGTags> = Partial<{
-    [K in keyof SVGRawProps<T>]: NormalizeSVGProp<SVGRawProps<T>[K]>;
-}> & ElementProps<T> & ElementOverridedProperties & SVGOverridedProperties;
-type StateHandler<S extends KeyedObject | undefined = undefined> = S | ((l: S) => S);
-declare const enum NodeType {
+declare enum NodeType {
     Tag = 0,
     Content = 1,
     Parent = 2,
@@ -138,4 +88,4 @@ declare function createRoot<T extends HTMLElement>(root: T): {
     render: (...children: ValidNodeChild[]) => void;
 };
 declare function createContext<T extends KeyedObject>(): Context<T>;
-export { Component, createContext, createRoot, EffectHandler, Element, ElementRef, HTMLProps, HTMLTags, HTMLSVGTags, SVGProps, Node, Portal, StateHandler, Stores, Styles, TagNode, ValidNode, ValidNodeChild, ValidTemplateReturn, FutureNode, };
+export { Component, createContext, createRoot, EffectHandler, Node, Portal, Stores, TagNode, ValidNode, ValidNodeChild, ValidTemplateReturn, FutureNode, };

package/dist/node.js

@@ -64,6 +64,13 @@ const SVG_TAGS = new Set([
     "use",
     "view",
 ]);
+var NodeType;
+(function (NodeType) {
+    NodeType[NodeType["Tag"] = 0] = "Tag";
+    NodeType[NodeType["Content"] = 1] = "Content";
+    NodeType[NodeType["Parent"] = 2] = "Parent";
+    NodeType[NodeType["Component"] = 3] = "Component";
+})(NodeType || (NodeType = {}));
 class Stores {
     #_stores;
     constructor(s) {
@@ -147,16 +154,16 @@ class Node {
         this.$typeof = t;
     }
     get isTag() {
-        return this.$typeof === 0 /* NodeType.Tag */;
+        return this.$typeof === NodeType.Tag;
     }
     get isContent() {
-        return this.$typeof === 1 /* NodeType.Content */;
+        return this.$typeof === NodeType.Content;
     }
     get isParent() {
-        return this.$typeof === 2 /* NodeType.Parent */;
+        return this.$typeof === NodeType.Parent;
     }
     get isComponent() {
-        return this.$typeof === 3 /* NodeType.Component */;
+        return this.$typeof === NodeType.Component;
     }
     get deleted() {
         return this._deleted;
@@ -181,7 +188,7 @@ class ContentNode extends Node {
     _content;
     _dom = undefined;
     constructor(content) {
-        super(1 /* NodeType.Content */);
+        super(NodeType.Content);
         this._content = content;
         this.needs_update = true;
     }
@@ -334,7 +341,8 @@ function _remove_html_prop(dom, props, prop) {
             }
             catch (error) { }
     }
-    dom.removeAttribute(prop);
+    else
+        dom.removeAttribute(prop);
 }
 function _get_props_diff(a, b) {
     const _to_remove = {};
@@ -410,7 +418,7 @@ class TagNode extends Node {
     key = undefined;
     index_length = 0;
     constructor(tag, props, children) {
-        super(0 /* NodeType.Tag */);
+        super(NodeType.Tag);
         this.tag = tag;
         this._props = props;
         if (this._props && "key" in this._props) {
@@ -431,6 +439,10 @@ class TagNode extends Node {
                 _clear_props(this._dom, diff.remove);
                 _apply_props(this._dom, diff.apply);
                 this._props = nprops;
+                if (this.tag === "input" &&
+                    !("value" in diff.apply && "value" in diff.remove)) {
+                    this._dom.value = "";
+                }
             }
             else {
                 this._props = nprops;
@@ -516,8 +528,17 @@ class TagNode extends Node {
                     _apply_props(this._dom, this._props);
                 }
             }
-            else if (t.props)
-                this._props = t.props;
+            else {
+                // DOM not created yet
+                if (this._props) {
+                    if (t.props)
+                        this._diff_dom_props(t.props);
+                }
+                else {
+                    this._props = t.props ? t.props : undefined;
+                }
+                this.create();
+            }
         }
         else {
             // Tag has changed
@@ -550,7 +571,7 @@ class ParentNode extends Node {
     _children = undefined;
     child_length = 0;
     constructor(root, children) {
-        super(2 /* NodeType.Parent */);
+        super(NodeType.Parent);
         this.dom = root;
         this._children = children;
     }
@@ -615,7 +636,7 @@ class ComponentNode extends Node {
     _children = undefined;
     child_length = 0;
     constructor(template) {
-        super(3 /* NodeType.Component */);
+        super(NodeType.Component);
         this._template = template;
         getInternals(this._template).switch(this);
         this.needs_update = true;
@@ -1264,4 +1285,15 @@ function createRoot(root) {
 function createContext() {
     return new Context();
 }
-export { Component, createContext, createRoot, Node, Portal, Stores, TagNode, };
+export { Component, createContext, createRoot, 
+// Element,
+// ElementRef,
+// HTMLProps,
+// HTMLTags,
+// HTMLSVGTags,
+// SVGProps,
+Node, Portal, 
+// StateHandler,
+Stores, 
+// Styles,
+TagNode, };

package/dist/tags.d.ts

@@ -1,4 +1,4 @@
-import { HTMLProps, SVGProps, TagNode, ValidNodeChild } from "./node";
+import { TagNode, ValidNodeChild } from "./node";
 export declare function _is_valid_node(n: any): n is ValidNodeChild;
 /**
  * h1 - Creates h1 Tag node

package/dist/tags.js

@@ -1,4 +1,4 @@
-import { Component, Node, TagNode, } from "./node";
+import { Component, Node, TagNode } from "./node";
 import { _is_string } from "./utils";
 export function _is_valid_node(n) {
     return (n == null || _is_string(n) || n instanceof Node || n instanceof Component);

package/package.json

@@ -1,11 +1,12 @@
 {
   "name": "yandel",
   "description": "A reactive lightweight TS frontend framework",
-  "version": "1.2.0",
+  "version": "1.2.2",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "files": [
-    "dist"
+    "dist",
+    "types"
   ],
   "scripts": {
     "build": "tsc",

package/types/index.d.ts

@@ -0,0 +1,225 @@
+type HTMLExcludedProperties =
+  | `aria${string}`
+  | "tagName"
+  | "shadowRoot"
+  | "slot"
+  | "classList"
+  | "style"
+  | "attributes"
+  | "attributeStyleMap"
+  | "ATTRIBUTE_NODE"
+  | "CDATA_SECTION_NODE"
+  | "COMMENT_NODE"
+  | "childElementCount"
+  | "childNodes"
+  | "children"
+  | "isConnected"
+  | "ownerDocument"
+  | "lastChild"
+  | "lastElement"
+  | "nextElementSibling"
+  | "nextSibling"
+  | "previousElementSibling"
+  | "previousSibling"
+  | "parentElement"
+  | "parent"
+  | "outerContent"
+  | "firstChild"
+  | "firstElementChild"
+  | "lastChild"
+  | "lastElementChild"
+  | "innerHTML"
+  | "outerHTML"
+  | "innerContent"
+  | "textContent"
+  | `DOCUMENT_${string}`
+  | "NOTATION_NODE"
+  | "PROCESSING_INSTRUCTION_NODE"
+  | "CONTENT_NODE"
+  | "ELEMENT_NODE"
+  | "TEXT_NODE"
+  | `ENTITY_${string}`;
+type AriaWidgetProperties =
+  | "aria-autocomplete"
+  | "aria-checked"
+  | "aria-disabled"
+  | "aria-errormessage"
+  | "aria-expanded"
+  | "aria-haspopup"
+  | "aria-hidden"
+  | "aria-invalid"
+  | "aria-label"
+  | "aria-level"
+  | "aria-modal"
+  | "aria-multiline"
+  | "aria-multiselectable"
+  | "aria-orientation"
+  | "aria-placeholder"
+  | "aria-pressed"
+  | "aria-readonly"
+  | "aria-required"
+  | "aria-selected"
+  | "aria-sort"
+  | "aria-valuemax"
+  | "aria-valuemin"
+  | "aria-valuenow"
+  | "aria-valuetext";
+type AriaLiveRegionProperties =
+  | "aria-busy"
+  | "aria-live"
+  | "aria-relevant"
+  | "aria-atomic";
+type AriaDragAndDropProperties = "aria-dropeffect" | "aria-grabbed";
+type AriaRelatonshipProperties =
+  | "aria-activedescendant"
+  | "aria-colcount"
+  | "aria-colindex"
+  | "aria-colspan"
+  | "aria-controls"
+  | "aria-describedby"
+  | "aria-description"
+  | "aria-details"
+  | "aria-errormessage"
+  | "aria-flowto"
+  | "aria-labelledby"
+  | "aria-owns"
+  | "aria-posinset"
+  | "aria-rowcount"
+  | "aria-rowindex"
+  | "aria-rowspan"
+  | "aria-setsize";
+type AriaGlobalProperties =
+  | "aria-atomic"
+  | "aria-busy"
+  | "aria-controls"
+  | "aria-current"
+  | "aria-describedby"
+  | "aria-description"
+  | "aria-details"
+  | "aria-disabled"
+  | "aria-dropeffect"
+  | "aria-errormessage"
+  | "aria-flowto"
+  | "aria-grabbed"
+  | "aria-haspopup"
+  | "aria-hidden"
+  | "aria-invalid"
+  | "aria-keyshortcuts"
+  | "aria-label"
+  | "aria-labelledby"
+  | "aria-live"
+  | "aria-owns"
+  | "aria-relevant"
+  | "aria-roledescription";
+type AriaProps =
+  | AriaWidgetProperties
+  | AriaDragAndDropProperties
+  | AriaLiveRegionProperties
+  | AriaRelatonshipProperties
+  | AriaGlobalProperties;
+type AriaBoolean = "true" | "false";
+type AriaValue = Exclude<string, AriaBoolean>;
+type AriaValueMap = Partial<Record<AriaProps, AriaBoolean | AriaValue>>;
+type KeyedObject = Record<string | symbol | number, any>;
+type HTMLTags = keyof HTMLElementTagNameMap;
+type HTMLSVGTags = keyof SVGElementTagNameMap;
+type YElement<K extends HTMLTags = HTMLTags> = HTMLElementTagNameMap[K];
+type YSVGElement<K extends HTMLSVGTags = HTMLSVGTags> = SVGElementTagNameMap[K];
+
+type ExcludeFunctions<T> = {
+  [K in keyof T as T[K] extends Function ? never : K]: T[K];
+};
+type Styles = Partial<CSSStyleDeclaration>;
+interface ElementOverridedProperties extends AriaValueMap {
+  style?: Styles;
+}
+type AnyElement<T extends HTMLTags | HTMLSVGTags = HTMLTags> =
+  T extends HTMLTags
+    ? YElement<T>
+    : T extends HTMLSVGTags
+    ? YSVGElement<T>
+    : never;
+type AnyProps<T extends HTMLTags | HTMLSVGTags = HTMLTags> = T extends HTMLTags
+  ? HTMLProps<T>
+  : T extends HTMLSVGTags
+  ? SVGProps<T>
+  : never;
+interface Stores<T> {
+  get stores(): T;
+}
+type ElementRef<T extends HTMLTags | HTMLSVGTags = HTMLTags> = Stores<
+  | (T extends HTMLTags
+      ? HTMLElementTagNameMap[T]
+      : T extends HTMLSVGTags
+      ? SVGElementTagNameMap[T]
+      : never)
+  | undefined
+>;
+interface ElementProps<T extends HTMLTags | HTMLSVGTags = HTMLTags> {
+  ref?: ElementRef<T>;
+  key?: string | number | symbol;
+}
+type ExcludeProperties<T> = {
+  [K in keyof T as K extends HTMLExcludedProperties ? never : K]: T[K];
+};
+type HTMLProps<T extends HTMLTags> = Partial<
+  ExcludeProperties<ExcludeFunctions<YElement<T>>>
+> &
+  ElementProps<T> &
+  ElementOverridedProperties;
+
+type SVGAttributeValue = string | number;
+
+type NormalizeSVGProp<T> = T extends SVGAnimatedLength
+  ? SVGAttributeValue
+  : T extends SVGAnimatedAngle
+  ? SVGAttributeValue
+  : T extends SVGAnimatedBoolean
+  ? SVGAttributeValue
+  : T extends SVGAnimatedEnumeration
+  ? SVGAttributeValue
+  : T extends SVGAnimatedInteger
+  ? SVGAttributeValue
+  : T extends SVGAnimatedNumber
+  ? SVGAttributeValue
+  : T extends SVGAnimatedPreserveAspectRatio
+  ? SVGAttributeValue
+  : T extends SVGAnimatedRect
+  ? SVGAttributeValue
+  : T extends SVGAnimatedString
+  ? SVGAttributeValue
+  : T extends SVGAnimatedTransformList
+  ? SVGAttributeValue
+  : T extends SVGPointList
+  ? SVGAttributeValue
+  : T;
+
+type SVGRawProps<T extends HTMLSVGTags> = ExcludeProperties<
+  ExcludeFunctions<SVGElementTagNameMap[T]>
+>;
+interface SVGOverridedProperties {
+  fill?: string;
+  "fill-opacity"?: string;
+  stroke?: string;
+  "stroke-width"?: SVGAttributeValue;
+  "stroke-linecap"?: "butt" | "round" | "square";
+  "stroke-linejoin"?: "miter" | "round" | "bevel";
+  d?: string;
+  "stroke-dasharray"?: SVGAttributeValue;
+}
+type SVGProps<T extends HTMLSVGTags> = Partial<{
+  [K in keyof SVGRawProps<T>]: NormalizeSVGProp<SVGRawProps<T>[K]>;
+}> &
+  ElementProps<T> &
+  ElementOverridedProperties &
+  SVGOverridedProperties;
+type StateHandler<S extends KeyedObject | undefined = undefined> =
+  | S
+  | ((l: S) => S);
+
+// declare abstract class Component<S extends KeyedObject | void = void> {
+//   protected get state(): S;
+//   protected setState(h: StateHandler<S extends void ? undefined : S>): void;
+//   public render(): ValidTemplateReturn;
+//   public delete(): void;
+// }