ziko 0.68.2 → 1.0.0

package/README.md

@@ -81,7 +81,7 @@ const Hello = name => p(
 ```
 - 🔄 Built in State Mangement : 
 ```js
-import { tags } from 'ziko/ui'
+import { tags } from 'ziko/dom'
 import {useState, useDerived} from 'ziko/hooks'
 const [timer, setTimer] = useState(0);
 const converToHMS = seconds => `${Math.floor(seconds / 3600)} : ${Math.floor((seconds % 3600) / 60)} : ${seconds % 60} `

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ziko",
-  "version": "0.68.2",
+  "version": "1.0.0",
   "description": "A versatile JavaScript library offering a rich set of Hyperscript Based UI components, advanced mathematical utilities, interactivity ,animations, client side routing and more ...",
   "keywords": [
     "front-end",

package/src/dom/tags/index.d.ts

@@ -0,0 +1,28 @@
+import { UIElement } from "../constructors/UIElement.js";
+import { UINode } from "../constructors/UINode.js";
+
+/**
+ * All valid DOM tag names (HTML + SVG + MathML)
+ */
+type NativeTagNames =
+  | keyof HTMLElementTagNameMap
+  | keyof SVGElementTagNameMap
+  | keyof MathMLElementTagNameMap;
+
+/**
+ * Tags that should return UINode instead of UIElement
+ */
+type NodeTags = "html" | "head" | "body" | "style" | "title" | "meta" | "link" | "base";
+
+/**
+ * Map native tags:
+ * - html | body | style → UINode
+ * - everything else → UIElement
+ */
+export type Tags = {
+  [K in NativeTagNames]: K extends NodeTags ? UINode : UIElement;
+} & {
+  [key: `${string}-${string}` | `${string}_${string}`]: UIElement; // custom elements default to UIElement
+};
+
+export declare const tags: Tags;

package/src/{ui → dom}/tags/index.js

@@ -1,16 +1,5 @@
 import {UIElement} from "../constructors/UIElement.js";
 import { HTMLTags, SVGTags, MathMLTags } from "./tags-list.js";
-// import { isStateGetter } from "../../hooks/use-state.js";
-const _h=(tag, type, attributes, ...children)=>{
-    const { name, style, ...attrs } = attributes;
-    let element = new UIElement(tag, name, type);
-    style && element.style(style);
-    attrs && element.setAttr(attrs);
-    children && element.append(...children);
-    return element; 
-}
-// const h=(tag, attributes = {}, ...children)=> _h(tag, "html", attributes, ...children);
-// const s=(tag, attributes = {}, ...children)=> _h(tag, "svg", attributes, ...children);
 
 const tags = new Proxy({}, {
   get(target, prop) {

package/src/ui/tags/index.d.ts.txt

@@ -1,144 +0,0 @@
-import {UIElement} from "../elements/UIElement.js";
-interface HtmlTags {
-    a: UIElement;
-    abbr: UIElement;
-    address: UIElement;
-    area: UIElement;
-    article: UIElement;
-    aside: UIElement;
-    audio: UIElement;
-    b: UIElement;
-    base: UIElement;
-    bdi: UIElement;
-    bdo: UIElement;
-    blockquote: UIElement;
-    body: UIElement;
-    br: UIElement;
-    button: UIElement;
-    canvas: UIElement;
-    caption: UIElement;
-    cite: UIElement;
-    code: UIElement;
-    col: UIElement;
-    colgroup: UIElement;
-    data: UIElement;
-    datalist: UIElement;
-    dd: UIElement;
-    del: UIElement;
-    details: UIElement;
-    dfn: UIElement;
-    dialog: UIElement;
-    div: UIElement;
-    dl: UIElement;
-    dt: UIElement;
-    em: UIElement;
-    embed: UIElement;
-    fieldset: UIElement;
-    figcaption: UIElement;
-    figure: UIElement;
-    footer: UIElement;
-    form: UIElement;
-    h1: UIElement;
-    h2: UIElement;
-    h3: UIElement;
-    h4: UIElement;
-    h5: UIElement;
-    h6: UIElement;
-    head: UIElement;
-    header: UIElement;
-    hgroup: UIElement;
-    hr: UIElement;
-    html: UIElement;
-    i: UIElement;
-    iframe: UIElement;
-    img: UIElement;
-    input: UIElement;
-    ins: UIElement;
-    kbd: UIElement;
-    label: UIElement;
-    legend: UIElement;
-    li: UIElement;
-    link: UIElement;
-    main: UIElement;
-    map: UIElement;
-    mark: UIElement;
-    meta: UIElement;
-    meter: UIElement;
-    nav: UIElement;
-    noscript: UIElement;
-    object: UIElement;
-    ol: UIElement;
-    optgroup: UIElement;
-    option: UIElement;
-    output: UIElement;
-    p: UIElement;
-    param: UIElement;
-    picture: UIElement;
-    pre: UIElement;
-    progress: UIElement;
-    q: UIElement;
-    rp: UIElement;
-    rt: UIElement;
-    ruby: UIElement;
-    s: UIElement;
-    samp: UIElement;
-    script: UIElement;
-    section: UIElement;
-    select: UIElement;
-    small: UIElement;
-    source: UIElement;
-    span: UIElement;
-    strong: UIElement;
-    style: UIElement;
-    sub: UIElement;
-    summary: UIElement;
-    sup: UIElement;
-    table: UIElement;
-    tbody: UIElement;
-    td: UIElement;
-    template: UIElement;
-    textarea: UIElement;
-    tfoot: UIElement;
-    th: UIElement;
-    thead: UIElement;
-    time: UIElement;
-    title: UIElement;
-    tr: UIElement;
-    track: UIElement;
-    u: UIElement;
-    ul: UIElement;
-    var: UIElement;
-    video: UIElement;
-    wbr: UIElement;
-}
-
-interface SvgTags {
-    svg: UIElement;
-    circle: UIElement;
-    rect: UIElement;
-    line: UIElement;
-    path: UIElement;
-    g: UIElement;
-    text: UIElement;
-    //...
-}
-
-interface MathTags {
-    math: UIElement;
-    mrow: UIElement;
-    mi: UIElement;
-    mo: UIElement;
-    mn: UIElement;
-    ms: UIElement;
-    //...
-}
-
-export type Tags = HtmlTags & SvgTags & MathTags & {
-  [key: string]: UIElement;
-};
-
-declare const tags: Tags;
-
-export {
-    tags
-};