ziko 0.37.0 → 0.38.0

package/src/ui/elements/io/Inputs/input-email-password/input-password.js

@@ -1,14 +0,0 @@
-import { ZikoUIInput } from "../input";
-class ZikoUIInputPassword extends ZikoUIInput {
-    constructor() {
-      super("password", "inputPassword");
-    }
-    get isInputPassword(){
-      return true;
-    }
-  }
-  const inputPassword = () => new ZikoUIInputPassword();
-export{
-    ZikoUIInputPassword,
-    inputPassword
-}

package/src/ui/elements/io/Inputs/input-file/index.js

@@ -1 +0,0 @@
-export * from "./input-image"

package/src/ui/elements/io/Inputs/input-file/input-image.js

@@ -1,43 +0,0 @@
-import ZikoUIElement from "../../../../constructors/ziko-ui-element.js";
-import { btn } from "../../../misc";
-class ZikoUIInputImage extends ZikoUIElement {
-    constructor(text = "File") {
-      super("inputImage");
-      this._aux_element = btn(text).setTarget(this.target);
-      this.element = document?.createElement("input");
-      this.element?.setAttribute("type", "file");
-      this.element?.setAttribute("accept", "image");
-      this._aux_element.onClick(() => this.element.click());
-      this.element.onChange = this.handleImage.bind(this);
-    }
-    get isInputImage(){
-      return true;
-    }
-    handleImage(e) {
-      const reader = new FileReader();
-      const img = new Image();
-      reader.onload = function (event) {
-        img.src = event.target.result;
-        console.log(img.src);
-      };
-      reader.readAsDataURL(e.target.files[0]);
-      this.img = img;
-    }
-    get value() {
-      return this.img;
-    }
-    render(bool = true) {
-      if (bool) this.target.appendChild(this._aux_element.element);
-      else this.remove();
-      return this;
-    }
-    remove() {
-      if (this.target.children.length) this.target.removeChild(this._aux_element.element);
-      return this;
-    }
-}
-const inputImage = (text) => new ZikoUIInputImage(text);
-export{
-    ZikoUIInputImage,
-    inputImage
-}

package/src/ui/elements/io/Inputs/input-number/index.js

@@ -1,37 +0,0 @@
-import { ZikoUIInput } from "../input";
-class ZikoUIInputNumber extends ZikoUIInput {
-    constructor(min, max, step = 1) {
-      super("number", "inpuNumber");
-      this.setMin(min).setMax(max).setStep(step);
-    }
-    get isInputNumber() {
-      return true;
-    }
-    get value() {
-      return +this.element.value;
-    }
-    setMin(min) {
-      this.element.min = min;
-      return this;
-    }
-    setMax(max) {
-      this.element.max = max;
-      return this;
-    }
-    setStep(step) {
-      this.element.step = step;
-      return this;
-    }
-  }
-  const inputNumber = (min, max, step) => {
-    if (min instanceof Object) {
-      const { value, max = 10, step = 1, placeholder = "" } = min;
-      min = min?.min ?? 0;
-      return new ZikoUIInputSlider(min, max, step)
-        .setValue(value)
-        .setPlaceholder(placeholder);
-    }
-    return new ZikoUIInputNumber(min, max, step);
-  };
-  export { inputNumber, ZikoUIInputNumber };
-  

package/src/ui/elements/io/Inputs/input-radio/index.js

@@ -1,26 +0,0 @@
-import { ZikoUIInput } from "../input";
-class ZikoUIInputRadio extends ZikoUIInput {
-    constructor() {
-      super("radio", "inputRadio");
-      this.cursor("pointer");
-    }
-    get isInputRadio(){
-      return true;
-    }
-    get checked() {
-      return this.element.checked;
-    }
-    check(checked = true) {
-      this.element.checked = checked;
-      return this;
-    }
-    color(color) {
-      this.element.style.accentColor = color;
-      return this;
-    }
-}
-const radio = () => new ZikoUIInputRadio();
-export{
-  ZikoUIInputRadio,
-  radio
-}

package/src/ui/elements/io/Inputs/input-search/index.js

@@ -1,45 +0,0 @@
-import { ZikoUIInput } from "../input";
-class ZikoUIInputSearch extends ZikoUIInput {
-  constructor() {
-    super("search", "inputSearch");
-    this.Length = 0;
-  }
-  get isInputSearch() {
-    return true;
-  }
-  onsearch(callback) {
-    this.element?.addEventListener("search", () => callback());
-    return this;
-  }
-  connect(...UIElement) {
-    /* 
-      let memory = new Array(UIElement.length).fill([]);
-      UIElement.map((n, i) => {
-        //console.log(n)
-        n.items.map((m, j) => {
-          memory[i][j] = m.element.style.display;
-        });
-      });
-      UIElement.map((n, i) =>
-        this.onInput(() => {
-          n.filterByTextContent(this.value, memory[i]);
-          this.Length = n.children.filter(
-            (n) => n.style.display != "none"
-          ).length;
-        })
-      );
-      */
-    return this;
-  }
-  displayLength(UIElement) {
-    this.element?.addEventListener("keyup", () =>
-      UIElement.setValue(this.Length),
-    );
-    return this;
-  }
-}
-const search = (...a) => new ZikoUIInputSearch().connect(...a);
-export { 
-    ZikoUIInputSearch, 
-    search 
-};

package/src/ui/elements/io/Inputs/input-slider/index.js

@@ -1,34 +0,0 @@
-import { ZikoUIInput } from "../input";
-class ZikoUIInputSlider extends ZikoUIInput {
-    constructor(val = 0, min = 0, max = 10, step = 1) {
-      super("range", "inputSlider");
-      this.setMin(min).setMax(max).setValue(val).setStep(step);
-    }
-    get isInputSlider(){
-      return true;
-    }
-    setMin(min) {
-      this.element.min = min;
-      return this;
-    }
-    setMax(max) {
-      this.element.max = max;
-      return this;
-    }
-    setStep(step) {
-      this.element.step = step;
-      return this;
-    }
-}
-const slider = (value, min, max, step) =>{
-    if(value instanceof Object){
-      const {min=0,max=10,step=1}=value;
-      value=value?.value??5;
-      return new ZikoUIInputSlider(value, min, max, step);
-    }
-    return new ZikoUIInputSlider(value, min, max, step);
-}
-export{
-    ZikoUIInputSlider,
-    slider
-}

package/src/ui/elements/io/Select/index.js

@@ -1,20 +0,0 @@
-import ZikoUIElement from "../../../constructors/ziko-ui-element.js";
-import { ZikoUIInputOption } from "../Inputs/__helpers__";
-class ZikoUISelect extends ZikoUIElement {
-    constructor(){
-      super();
-      this.element=document?.createElement("select");
-    }
-    addOptions(...options) {
-      options.map(n => this.append(new ZikoUIInputOption(n)));
-      return this;
-    }
-    get isSelect(){
-      return true;
-    }
-  }
-const select=()=>new ZikoUISelect()
-export{
-    select,
-    ZikoUISelect
-}

package/src/ui/elements/io/Textarea/index.js

@@ -1,18 +0,0 @@
-import ZikoUIElement from "../../../constructors/ziko-ui-element.js";
-class ZikoUITextArea extends ZikoUIElement {
-    constructor() {
-      super();
-      this.element = document?.createElement("textarea");
-    }
-    get value(){
-      return this.element.textContent;
-    }
-    get isTextArea(){
-      return true;
-    }
-}
-const textarea =()=> new ZikoUITextArea();
-export {
-    ZikoUITextArea,
-    textarea
-}

package/src/ui/elements/io/index.js

@@ -1,4 +0,0 @@
-export * from "./Inputs";
-export * from "./Select";
-export * from "./Textarea";
-export * from "./Form";

package/src/ui/elements/list/index.js

@@ -1,138 +0,0 @@
-import ZikoUIElement from "../../constructors/ziko-ui-element.js";
-import {text} from "../text/index.js";
-class ZikoUILI extends ZikoUIElement{
-  constructor(UI){
-    super("li","li");
-    this.append(UI);
-  }
-  get isLi(){
-    return true;
-  }
-}
-class ZikoUIList extends ZikoUIElement {
-    constructor(element,name) {
-      super(element,name);
-      delete this.append;
-      this.style({ listStylePosition: "inside" });
-    }
-    get isList(){
-      return true;
-    }
-    append(...arr){
-      for (let i = 0; i < arr.length; i++) {
-        let li = null;
-        if(["string","number"].includes(typeof arr[i]))arr[i]=text(arr[i])
-        if (arr[i] instanceof ZikoUIElement)li=new ZikoUILI(arr[i]);
-        li.setTarget(this.element)
-        this.items.push(li[0]);
-        this.maintain();
-      }
-    }
-    remove(...ele) {
-      if(ele.length==0){
-        if(this.target.children.length) this.target.removeChild(this.element);
-      }
-      else {
-        const remove = (ele) => {
-          if(typeof ele === "number") ele=this.items[ele];
-          if(ele instanceof ZikoUIElement)this.element?.removeChild(ele.parent.element);
-            this.items=this.items.filter(n=>n!==ele);
-        };
-        for (let i = 0; i < ele.length; i++) remove(ele[i]);
-        for (let i = 0; i < this.items.length; i++)
-          Object.assign(this, { [[i]]: this.items[i] });
-      }
-      return this;
-    }
-    insertAt(index, ...ele) {
-      if (index >= this.element.children.length) this.append(...ele);
-      else
-        for (let i = 0; i < ele.length; i++) {
-          let li = null;
-          if(["number","string"].includes(typeof ele[i]))ele[i]=text(ele[i]);
-          if (ele[i] instanceof ZikoUIElement)li=new ZikoUILI(ele[i]);
-          this.element?.insertBefore(li.element, this.items[index].parent.element);
-          this.items.splice(index, 0, ele[i][0]);
-        }
-      return this;
-    }
-    filterByTextContent(text,exactMatch=false){
-      this.items.map(n=>n.parent.render());
-      this.items.filter(n=>{
-        const content=n.element.textContent
-        return !(exactMatch?content===text:content.includes(text))
-      }).map(n=>n.parent.render(false));
-       return this;
-    }
-    sortByTextContent(order=1){
-      this.items.map(n=>n.parent.render(false));
-      // To Fix
-      this.sortedItems=this.items.sort((a,b)=>order*a.element.textContent.localeCompare(b.element.textContent))
-      this.append(...this.sortedItems);
-      return this;
-    }
-    filterByClass(value) {
-      this.items.map(n=>n.parent.render(true));
-      this.items.filter(n=>!n.Classes.includes(value)).map(n=>n.parent.render(false));
-      return this; 
-    }
-    delete(value) {
-      const valueIndex = [...this.element.children].indexOf(value);
-      return valueIndex;
-      /*if(valueIndex >= 0) {
-        return this.list.splice(valueIndex, 1);
-      }*/
-    }
-    push(){
-
-    }
-    pop(){
-
-    }
-    unshift(){
-
-    }
-    shift(){
-
-    }
-    sort(){
-
-    }
-    filter(){
-
-    }
-    slice(){
-      
-    }
-  }
-class ZikoUIOList extends ZikoUIList{
-  constructor(...arr){
-    super("ol","ol");
-    this.append(...arr);
-  }
-  get isOl(){
-    return true;
-  }
-  type(tp = 1) {
-    this.element?.setAttribute("type", tp);
-    return this;
-  }
-  start(st = 1) {
-    this.element?.setAttribute("start", st);
-    return this;
-  }
-}
-class ZikoUIUList extends ZikoUIList{
-  constructor(...arr){
-    super("ul","ul");
-    this.append(...arr);
-  }
-  get isUl(){
-    return true;
-  }
-}
-const li=UI=>new ZikoUILI(UI)
-const ol = (...arr) => new ZikoUIOList(...arr);
-const ul = (...arr) => new ZikoUIUList(...arr);
-
-export{ol,ul,li}

package/src/ui/elements/media/Audio/index.js

@@ -1,17 +0,0 @@
-import { __ZikoUIDynamicMediaElement__ } from "../__ZikoUIDynamicMediaELement__.js";
-class ZikoUIAudio extends __ZikoUIDynamicMediaElement__ {
-    constructor(src) {
-      super("audio","audio");
-      this.element?.setAttribute("src", src);
-      this.size("150px","30px")
-      // this.useControls();
-    }
-    get isAudio(){
-      return true;
-    }
-  }
-const audio = (src) => new ZikoUIAudio(src);
-export {
-    audio,
-    ZikoUIAudio
-}

package/src/ui/elements/media/Image/figure.js

@@ -1,19 +0,0 @@
-import ZikoUIElement from "../../../constructors/ziko-ui-element.js";
-class ZikoUIFigure extends ZikoUIElement{
-    constructor(src,caption){
-      super("figure","figure")
-      this.img=src.width("100%").element;
-      this.caption=document?.createElement("figcaption");
-      this.caption.append(caption.element)
-      this.element?.append(this.img);
-      this.element?.append(this.caption);
-    }
-    get isFigure(){
-      return true;
-    }
-}
-const figure =(image,caption) =>new ZikoUIFigure(image,caption);
-export{
-    figure,
-    ZikoUIFigure
-}

package/src/ui/elements/media/Image/image.js

@@ -1,37 +0,0 @@
-import ZikoUIElement from "../../../constructors/ziko-ui-element.js";
-class ZikoUIImage extends ZikoUIElement {
-    constructor(src,alt, w, h) {
-      super("img","image");
-      this.value=src;
-      if (src.nodeName === "IMG")this.element.setAttribute("src", src.src);
-      else this.element?.setAttribute("src", src);
-      if (typeof w == "number") w += "%";
-      if (typeof h == "number") h += "%";
-      this.setAttr("alt", alt)
-      this.style({ border: "1px solid black", width: w, height: h });
-    }
-    get isImg(){
-      return true;
-    }
-     updateSrc(url){
-      this.value=url;
-      this.element.src=url;
-     return this;
-    }
-    toggleSrc(...values){
-      values=values.map(n=>""+n);
-      let index=values.indexOf(""+this.value);
-      if(index!=-1&&index!=(values.length-1))this.updateSrc(values[index+1]);
-      else this.updateSrc(values[0]);
-      return this;
-    }
-    alt(alt){
-      this.element.alt=alt;
-      return this;
-    }
-  }
-const image = (src,alt, width, height) => new ZikoUIImage(src,alt, width, height);
-export{
-    image,
-    ZikoUIImage
-}

package/src/ui/elements/media/Image/index.js

@@ -1,2 +0,0 @@
-export * from "./image";
-export * from "./figure";

package/src/ui/elements/media/Video/index.js

@@ -1,27 +0,0 @@
-import { __ZikoUIDynamicMediaElement__ } from "../__ZikoUIDynamicMediaELement__.js";
-class ZikoUIVideo extends __ZikoUIDynamicMediaElement__ {
-    constructor(src="", w = "100%", h = "50vh") {
-      super("video","video");
-      if (src.nodeName === "VIDEO") this.element?.setAttribute("src", src.src);
-      else this.element?.setAttribute("src", src);
-      if (typeof w == "number") w += "%";
-      if (typeof h == "number") h += "%";
-      this.style({ width: w, height: h });
-    }
-    get isVideo(){
-      return true;
-    }
-    usePoster(src=""){
-      this.element.poster=src;
-      return this;
-    }
-    usePIP(e){
-      this.element.requestPictureInPicture(e);
-      return this;
-    }
-  }
-const video = (src, width, height) => new ZikoUIVideo(src, width, height);
-export {
-  video,
-  ZikoUIVideo
-}

package/src/ui/elements/media/__ZikoUIDynamicMediaELement__.js

@@ -1,47 +0,0 @@
-import ZikoUIElement from "../../constructors/ziko-ui-element.js";
-class __ZikoUIDynamicMediaElement__ extends ZikoUIElement {
-    constructor(element, name) {
-      super(element, name);
-      this.useControls();
-    }
-    get t(){
-      return this.element.currentTime;  
-    }
-    useControls(enabled = true) {
-      this.element.controls = enabled;
-      return this;
-    }
-    enableControls(){
-      this.element.controls = true;
-      return this;
-    }
-    disableControls(){
-      this.element.controls = true;
-      return this;
-    }
-    toggleControls(){
-      this.element.controls = !this.element.controls;
-      return this;
-    }
-    play() {
-      this.element.play();
-      return this;
-    }
-    pause() {
-      this.element.pause();
-      return this;
-    }
-    seekTo(time) {
-      this.element.currentTime = time;
-      return this;
-    }
-    onPlay(){
-
-    }
-    onPause(){
-
-    }
-  }
-export {
-  __ZikoUIDynamicMediaElement__
-}

package/src/ui/elements/media/index.js

@@ -1,3 +0,0 @@
-export * from "./image";
-export * from "./video";
-export * from "./audio";