ebuilder-js - npm Package Compare versions

Comparing version 0.0.7 to 0.0.8

declarations.d.ts

@@ -40,5 +40,7 @@ declare type AnyObject = {
     isEBuilder: boolean;
-    html?: string;
-    el: Element;
-    element: Element;
+    readonly htmlContent: string;
+    readonly el: Element;
+    readonly element: Element;
+    readonly children: NodeListOf<ChildNode>;
+    readonly count: number;
     referenceMap: ReferenceMap;
@@ -48,3 +50,2 @@ interval?: number;
     getRef: (query: string) => any;
-    setElement: (value: Element) => void;
 }
@@ -51,0 +52,0 @@ declare type RuleMap = Map<string, string>;

modules/EBuilder.d.ts

 declare const EBuilder: (this: any, source: Element | string) => {
-    el: Element;
-    element: Element;
-    getHTML: () => string;
+    readonly el: Element;
+    readonly element: Element;
+    readonly htmlContent: string;
+    readonly count: number;
+    readonly children: NodeListOf<ChildNode>;
     isEBuilder: boolean;
@@ -10,5 +12,7 @@ referenceMap: ReferenceMap;
     given: (...references: ReferencePair[]) => {
-        el: Element;
-        element: Element;
-        getHTML: () => string;
+        readonly el: Element;
+        readonly element: Element;
+        readonly htmlContent: string;
+        readonly count: number;
+        readonly children: NodeListOf<ChildNode>;
         isEBuilder: boolean;
@@ -37,11 +41,11 @@ referenceMap: ReferenceMap;
         setClasses: (...classes: (string | string[])[]) => any;
-        setContent: (input: string | Element | EBObject) => any;
+        setContent: (input: string | Element | EBObject | Function) => any;
         toString: () => string;
-        count: () => number;
-        setElement: (value: Element) => void;
     };
     into: (targetInput: EBTarget, { at, times }?: IntoOptions) => {
-        el: Element;
-        element: Element;
-        getHTML: () => string;
+        readonly el: Element;
+        readonly element: Element;
+        readonly htmlContent: string;
+        readonly count: number;
+        readonly children: NodeListOf<ChildNode>;
         isEBuilder: boolean;
@@ -70,11 +74,11 @@ referenceMap: ReferenceMap;
         setClasses: (...classes: (string | string[])[]) => any;
-        setContent: (input: string | Element | EBObject) => any;
+        setContent: (input: string | Element | EBObject | Function) => any;
         toString: () => string;
-        count: () => number;
-        setElement: (value: Element) => void;
     } | undefined;
     after: (inputTarget: Element | EBObject) => {
-        el: Element;
-        element: Element;
-        getHTML: () => string;
+        readonly el: Element;
+        readonly element: Element;
+        readonly htmlContent: string;
+        readonly count: number;
+        readonly children: NodeListOf<ChildNode>;
         isEBuilder: boolean;
@@ -103,11 +107,11 @@ referenceMap: ReferenceMap;
         setClasses: (...classes: (string | string[])[]) => any;
-        setContent: (input: string | Element | EBObject) => any;
+        setContent: (input: string | Element | EBObject | Function) => any;
         toString: () => string;
-        count: () => number;
-        setElement: (value: Element) => void;
     };
     before: (inputTarget: Element | EBObject) => {
-        el: Element;
-        element: Element;
-        getHTML: () => string;
+        readonly el: Element;
+        readonly element: Element;
+        readonly htmlContent: string;
+        readonly count: number;
+        readonly children: NodeListOf<ChildNode>;
         isEBuilder: boolean;
@@ -136,11 +140,11 @@ referenceMap: ReferenceMap;
         setClasses: (...classes: (string | string[])[]) => any;
-        setContent: (input: string | Element | EBObject) => any;
+        setContent: (input: string | Element | EBObject | Function) => any;
         toString: () => string;
-        count: () => number;
-        setElement: (value: Element) => void;
     };
     replace: (inputTarget: Element | EBObject) => {
-        el: Element;
-        element: Element;
-        getHTML: () => string;
+        readonly el: Element;
+        readonly element: Element;
+        readonly htmlContent: string;
+        readonly count: number;
+        readonly children: NodeListOf<ChildNode>;
         isEBuilder: boolean;
@@ -169,6 +173,4 @@ referenceMap: ReferenceMap;
         setClasses: (...classes: (string | string[])[]) => any;
-        setContent: (input: string | Element | EBObject) => any;
+        setContent: (input: string | Element | EBObject | Function) => any;
         toString: () => string;
-        count: () => number;
-        setElement: (value: Element) => void;
     };
@@ -179,5 +181,7 @@ swap: (swapped: HTMLElement, animate?: boolean | {
     } | undefined) => Promise<{
-        el: Element;
-        element: Element;
-        getHTML: () => string;
+        readonly el: Element;
+        readonly element: Element;
+        readonly htmlContent: string;
+        readonly count: number;
+        readonly children: NodeListOf<ChildNode>;
         isEBuilder: boolean;
@@ -203,11 +207,11 @@ referenceMap: ReferenceMap;
         setClasses: (...classes: (string | string[])[]) => any;
-        setContent: (input: string | Element | EBObject) => any;
+        setContent: (input: string | Element | EBObject | Function) => any;
         toString: () => string;
-        count: () => number;
-        setElement: (value: Element) => void;
     } | undefined>;
     out: (all?: boolean | undefined) => {
-        el: Element;
-        element: Element;
-        getHTML: () => string;
+        readonly el: Element;
+        readonly element: Element;
+        readonly htmlContent: string;
+        readonly count: number;
+        readonly children: NodeListOf<ChildNode>;
         isEBuilder: boolean;
@@ -236,11 +240,11 @@ referenceMap: ReferenceMap;
         setClasses: (...classes: (string | string[])[]) => any;
-        setContent: (input: string | Element | EBObject) => any;
+        setContent: (input: string | Element | EBObject | Function) => any;
         toString: () => string;
-        count: () => number;
-        setElement: (value: Element) => void;
     };
     clearClones: () => {
-        el: Element;
-        element: Element;
-        getHTML: () => string;
+        readonly el: Element;
+        readonly element: Element;
+        readonly htmlContent: string;
+        readonly count: number;
+        readonly children: NodeListOf<ChildNode>;
         isEBuilder: boolean;
@@ -269,11 +273,11 @@ referenceMap: ReferenceMap;
         setClasses: (...classes: (string | string[])[]) => any;
-        setContent: (input: string | Element | EBObject) => any;
+        setContent: (input: string | Element | EBObject | Function) => any;
         toString: () => string;
-        count: () => number;
-        setElement: (value: Element) => void;
     };
     dispatch: (nameInput: string, emitterInput?: any) => {
-        el: Element;
-        element: Element;
-        getHTML: () => string;
+        readonly el: Element;
+        readonly element: Element;
+        readonly htmlContent: string;
+        readonly count: number;
+        readonly children: NodeListOf<ChildNode>;
         isEBuilder: boolean;
@@ -302,11 +306,11 @@ referenceMap: ReferenceMap;
         setClasses: (...classes: (string | string[])[]) => any;
-        setContent: (input: string | Element | EBObject) => any;
+        setContent: (input: string | Element | EBObject | Function) => any;
         toString: () => string;
-        count: () => number;
-        setElement: (value: Element) => void;
     };
     set: (options?: SetOptions) => {
-        el: Element;
-        element: Element;
-        getHTML: () => string;
+        readonly el: Element;
+        readonly element: Element;
+        readonly htmlContent: string;
+        readonly count: number;
+        readonly children: NodeListOf<ChildNode>;
         isEBuilder: boolean;
@@ -335,11 +339,11 @@ referenceMap: ReferenceMap;
         setClasses: (...classes: (string | string[])[]) => any;
-        setContent: (input: string | Element | EBObject) => any;
+        setContent: (input: string | Element | EBObject | Function) => any;
         toString: () => string;
-        count: () => number;
-        setElement: (value: Element) => void;
     };
     setAttributes: (attributes: StringObject | Function) => {
-        el: Element;
-        element: Element;
-        getHTML: () => string;
+        readonly el: Element;
+        readonly element: Element;
+        readonly htmlContent: string;
+        readonly count: number;
+        readonly children: NodeListOf<ChildNode>;
         isEBuilder: boolean;
@@ -368,11 +372,11 @@ referenceMap: ReferenceMap;
         setClasses: (...classes: (string | string[])[]) => any;
-        setContent: (input: string | Element | EBObject) => any;
+        setContent: (input: string | Element | EBObject | Function) => any;
         toString: () => string;
-        count: () => number;
-        setElement: (value: Element) => void;
     };
     setProperties: (properties: AnyObject | Function) => {
-        el: Element;
-        element: Element;
-        getHTML: () => string;
+        readonly el: Element;
+        readonly element: Element;
+        readonly htmlContent: string;
+        readonly count: number;
+        readonly children: NodeListOf<ChildNode>;
         isEBuilder: boolean;
@@ -401,11 +405,11 @@ referenceMap: ReferenceMap;
         setClasses: (...classes: (string | string[])[]) => any;
-        setContent: (input: string | Element | EBObject) => any;
+        setContent: (input: string | Element | EBObject | Function) => any;
         toString: () => string;
-        count: () => number;
-        setElement: (value: Element) => void;
     };
     setListeners: (listeners: EventTuple | EventTuple[] | Function) => {
-        el: Element;
-        element: Element;
-        getHTML: () => string;
+        readonly el: Element;
+        readonly element: Element;
+        readonly htmlContent: string;
+        readonly count: number;
+        readonly children: NodeListOf<ChildNode>;
         isEBuilder: boolean;
@@ -434,11 +438,11 @@ referenceMap: ReferenceMap;
         setClasses: (...classes: (string | string[])[]) => any;
-        setContent: (input: string | Element | EBObject) => any;
+        setContent: (input: string | Element | EBObject | Function) => any;
         toString: () => string;
-        count: () => number;
-        setElement: (value: Element) => void;
     };
     setChildren: (children: EBChild | EBChild[] | Function) => {
-        el: Element;
-        element: Element;
-        getHTML: () => string;
+        readonly el: Element;
+        readonly element: Element;
+        readonly htmlContent: string;
+        readonly count: number;
+        readonly children: NodeListOf<ChildNode>;
         isEBuilder: boolean;
@@ -467,11 +471,11 @@ referenceMap: ReferenceMap;
         setClasses: (...classes: (string | string[])[]) => any;
-        setContent: (input: string | Element | EBObject) => any;
+        setContent: (input: string | Element | EBObject | Function) => any;
         toString: () => string;
-        count: () => number;
-        setElement: (value: Element) => void;
     };
     setStyle: (style: StringObject | Function) => {
-        el: Element;
-        element: Element;
-        getHTML: () => string;
+        readonly el: Element;
+        readonly element: Element;
+        readonly htmlContent: string;
+        readonly count: number;
+        readonly children: NodeListOf<ChildNode>;
         isEBuilder: boolean;
@@ -500,11 +504,11 @@ referenceMap: ReferenceMap;
         setClasses: (...classes: (string | string[])[]) => any;
-        setContent: (input: string | Element | EBObject) => any;
+        setContent: (input: string | Element | EBObject | Function) => any;
         toString: () => string;
-        count: () => number;
-        setElement: (value: Element) => void;
     };
     setClasses: (...classes: (string | string[])[]) => {
-        el: Element;
-        element: Element;
-        getHTML: () => string;
+        readonly el: Element;
+        readonly element: Element;
+        readonly htmlContent: string;
+        readonly count: number;
+        readonly children: NodeListOf<ChildNode>;
         isEBuilder: boolean;
@@ -533,11 +537,11 @@ referenceMap: ReferenceMap;
         setClasses: any;
-        setContent: (input: string | Element | EBObject) => any;
+        setContent: (input: string | Element | EBObject | Function) => any;
         toString: () => string;
-        count: () => number;
-        setElement: (value: Element) => void;
     };
-    setContent: (input: string | Element | EBObject) => {
-        el: Element;
-        element: Element;
-        getHTML: () => string;
+    setContent: (input: string | Element | EBObject | Function) => {
+        readonly el: Element;
+        readonly element: Element;
+        readonly htmlContent: string;
+        readonly count: number;
+        readonly children: NodeListOf<ChildNode>;
         isEBuilder: boolean;
@@ -568,9 +572,5 @@ referenceMap: ReferenceMap;
         toString: () => string;
-        count: () => number;
-        setElement: (value: Element) => void;
     };
     toString: () => string;
-    count: () => number;
-    setElement: (value: Element) => void;
 } | undefined;
 export default EBuilder;

modules/EBuilder.js

@@ -41,7 +41,22 @@ "use strict";
   return {
-    el: element,
-    element: element,
-    getHTML: function getHTML() {
+    get el() {
+      return element;
+    },
+
+    get element() {
+      return element;
+    },
+
+    get htmlContent() {
       return this.element.innerHTML;
     },
+
+    get count() {
+      return this.element.childNodes.length;
+    },
+
+    get children() {
+      return this.element.childNodes;
+    },
+
     isEBuilder: true,
@@ -230,3 +245,4 @@ referenceMap: referenceMap,
     setContent: function setContent(input) {
-      this.element.innerHTML = "".concat(input); // DOM.insert.call(this, input, element, at, 1)
+      var value = Parse.getComputedValue.call(this, input);
+      this.element.innerHTML = "".concat(value); // DOM.insert.call(this, input, element, at, 1)
 
@@ -237,9 +253,2 @@ return this;
       return element.outerHTML;
-    },
-    count: function count() {
-      return this.element.childNodes.length;
-    },
-    setElement: function setElement(value) {
-      this.element = value;
-      this.el = value;
     }
@@ -246,0 +255,0 @@ };

package.json

 {
   "name": "ebuilder-js",
-  "version": "0.0.7",
+  "version": "0.0.8",
   "description": "Highly configurable and easily manipulable elements in a single declaration, with a functionnal touch.",
@@ -8,3 +8,3 @@ "main": "./index.js",
     "type": "git",
-    "url": "git+https://github.com/gregoryalbouy/e-builder.git"
+    "url": "git+https://github.com/gregoryalbouy/ebuilder.git"
   },
@@ -11,0 +11,0 @@ "keywords": [

README.md

 # EBuilder : an HTML element builder
 
-Build and manipulate elements the functionnal way, in a single statement.
+Build and manipulate elements the intuitive way, in a single statement with a touch a functionnal programming.
 
 ```javascript
-const p = EBuilder('p').setContent('Lopsum Irem').into(document.body, { times: 3 })
-
-const title = EBuilder('<h1>Hello <strong>World</strong>!</h1>').before(p)
-
-const button = EBuilder('button').set({
-    style: {
-        'background@interval:500': () => `hsl(360 * Math.random(), 50%, 50%`
-    }
-}).
+const p = EBuilder('p').setContent('Lopsum Irem').into(document.body)
 ```
+```javascript
+EBuilder('<button>click me</button>').setProperties({
+    'textContent@on:click': () => Math.random() < .5 ? 'win!' : 'loose!',
+    'innerHTML@on:mouseleave': 'Hey <strong>come back</strong>!'
+}).into(document.body)
+```
 
-**README in progress!**
-
-## Overview / Main features
-
-* freedom of input
-* chainability, functionnal aspect
-* single declaration
-* this binding
-
 ## Installation
@@ -45,88 +34,150 @@
 
-### EBuilder inputs
+### EBuilder input
 
-* 
+```typescript
+EBuilder(input: string | Element | EBObject)
+```
+| Argument type | Example |
+|---------------|---------|
+| string        | EBuilder(`'p'`) |
+| html string   | EBuilder(`'<p>Hello <span class="italic">World</span></p>!'`) |
+| @rule string  |  EBuilder(`'@select:p.paragraph:nth-child(1)'`) |
+| Element       | Ebuilder(`document.querySelector('p')`) |
+| EBObject      |  EBuilder(`EBuilder('p')`) |
 
-## Properties
 
-* `el`, `element`: the generated HTML element.
-
 ## Methods
 
-### Setter methods
+### DOM methods
 
-#### setAttributes()
-#### setProperties()
-#### setListeners()
-#### setChildren()
-#### setClasses()
-#### setStyles()
-#### set()
+#### into(`target`, `options`?)
+* `target`: a Node or EBObject
+* `options`: { `at`?, `times`? }
+    * `at`: the position in the parent. Accepts a number (`0` is first, `-1` is last, floats are rounded), or `'start'` or `'middle'` or `'end'`. Default value: `-1`
+    * `times`: number of copies. Default value: `1`
 
-### Miscellaneous
-
-* `htmlContent()`: returns the current element's *innerHTML*
-* `count()`: returns the current element's amount of child nodes (might change to child **element** nodes instead)
-* `toString()`: returns the current element's *outerHTML*. It can be handy to add it to the DOM quite quickly
+Example:
 ```javascript
-const elButton = EBuilder('button').set({ ... })
+const list = EBuilder('ul')
+    .setChildren([ '<li>First</li>', '<li>Last</li>' ])
+    .into(document.body)
 
-someElement.innerHTML += elButton
+EBuilder('<li>HERE WE ARE</li>').into(list, { at: 'middle', times: 3 })
+
+/*
+- First
+- HERE WE ARE
+- HERE WE ARE
+- HERE WE ARE
+- Last
+*/
 ```
+#### before(`target`)
+Places the element right before the target
+#### after(`target`)
+Places the element right after the target
+#### replace(`target`)
+Places the element at the target's position and removes the target
+#### swap(`target`, `animate?`)
+If both the element and the target are in the DOM, makes them swap.
+If `animate` is `true`, shows the animation.
+#### out()
+Removes the element from the DOM
 
+
+### Setter methods
+
+#### set()
+
 Signature: 
 ```typescript
-EBuilder(myElement).set({}: {
+EBuilder(x).set({}: {
     attributes?: { [attributeName: string]: string },
     properties?: { [propertyName: string]: any },
-    listeners?: EventTuple | EventTuple[]
-    children?:  ValidChild | ValidChild[],
+    style?: { [styleName: string]: string },
+    listeners?: EventTuple | EventTuple[],
+    children?:  EBChild | EBChild[],
 })
 ```
+with
+* EventTuple: arguments of addEventListener method in an array: `[ eventName: string, callback: Function, options ]`
+* EBChild: html string, Element, EBObject
 
-### DOM methods
+Note that any value can be replaced with a function returning that value, see [Function as value](#function-as-value)
 
-* into()
-* before()
-* after()
-* replace()
-* swap()
+#### setAttributes(`object`)
+#### setProperties(`object`)
+#### setListeners(`array`)
+#### setChildren(`string` | `Element` | `EBObject` | `array`)
+#### setClasses(`string` | `array`)
+#### setStyle(`object`)
+#### setContent(`string | EBObject`)
 
-### Function as value
 
+### Miscellaneous
+
+#### toString()
+Returns the current element's *outerHTML*, allowing a convenient access to that value:
+
+```javascript
+const button = EBuilder('button').set({ ... })
+
+someElement.innerHTML += button
+```
+
+#### dispatch(`string`)
+Emits and event with the input string name from the element.
+See [event-name example](#`:event-name`) for a practical use.
+
+#### given(`ReferencePair` | `ReferencePair[]`)
+ReferencePair: [ `anyReference`, `unique-string-id` ]
+Registers any reference in the EBuilder object, allowing to be accessed with an `@at-rule` followed by `unique-string-id`.  
+Note that if the `anyReference` is a **named function**, the string id can be omitted and the function name will be used as an id in this cas
+
+See [event-emitter example](#`:event-emitter`) or [@if example] for a practical uses.
+
+
+## Properties
+
+* `el` or `element`: the generated HTML element.
+* `htmlContent`: element's innerHTML
+* `count`: number of children
+* `children`: node list of children
+* ... and more to come!
+
+## Function as value
+
 Any value can be replaced with a function to be executed in the process (provided that function returns an appropriate value). This can be useful in many situations:
-* Non-static value
+* Dynamic rendering
 * Conditional value
-* Since value functions are called with the current EBuilder object as `this`, it allows auto-reference
-This can be useful when you want to render a non-static result. Consider the following:
+* Self-reference with `this` or bound argument
+
+### Dynamic rendering
+
 ```javascript
-EBuilder(myElement).setProperties({
-    'innerHTML@on:click': myElement.el.htmlContent() + `<p>I have ${myElement.el.count()} children.</p>`
-})
+// value is fixed
+EBuilder('p').setProperties({ 'textContent@interval:500': Math.random() })
+
+// value is dynamic
+EBuilder('p').setProperties({ 'textContent@interval:500': () => Math.random() })
 ```
-This won't work as expected as the `length` value is calculated once and will always output the value at the moment of declaration.
-Instead, use the following:
 
+### Conditionnal value
+
+### Self-reference
+
+Function expressions are bound to the current EBuilder object through `this` argument, so you can get its reference within the same statement:
+
 ```javascript
-EBuilder(myElement).setProperties({
-    'innerHTML@on:click': () => myElement.el.htmlContent() + `<p>I have ${myElement.el.count()} children.</p>`
+EBuilder('<ul><li>0</li></ul>').setProperties({
+    'innerHTML@on:click': function() { return this.htmlContent + `<li>${this.count}</li>` }
 })
-```
 
-Note that function expressions are called with `this` value as the current EBuilder instance, so you can do instead :
+// also available as the first parameter:
 
-```javascript
-EBuilder(myElement).setProperties({
-    'innerHTML@on:click': function() { return this.htmlContent() + `<p>I have ${this.count()} children.</p>` }
+EBuilder('<ul><li>0</li></ul>').setProperties({
+    'innerHTML@on:click': (self) => self.htmlContent + `<li>${self.count}</li>`
 })
 ```
 
-#### children
-
-Expects an array of / a single value of :
-* HTML string (ex.)
-* EBuilder instance (ex.)
-* An Element (ex)
-* ...?
-
 ## @-rules
@@ -137,3 +188,3 @@
 ```javascript
-const elButton = EBuilder('button').set({
+EBuilder('button').set({
     'properties@on:mouseover': {
@@ -154,6 +205,14 @@ 'textContent@interval:1000': () => new Date().getSeconds()
 
-With `@on` the value will be updated each time the event occurs, and only the first time with `@once`
+This allows to do funny things quite straight-forwardly:
+```javascript
+EBuilder('<button>click me</button>').setProperties({
+    'textContent@on:click': () => Math.random() < .5 ? 'win!' : 'loose!',
+    'innerHTML@on:mouseleave': 'Hey <strong>come back</strong>!'
+}).into(document.body)
+```
 
-#### `:eventName`
+With `@on` the value will be updated each time the event occurs, but only the first time with `@once`
 
+#### `:event-name`
+
 The event name can be any string value:
@@ -192,3 +251,3 @@ * A built-in event: `click`, `keydown`...
 ```
-(More details about `given()` below)
+(More details about `given()` above)
 
@@ -212,14 +271,22 @@ The `window` object is an exception to this rule, as it doesn't need to be pre-indexed.
 
+Note: the interval function is referenced as the `.interval` property, which means you can clear it using `clearInterval(myEBuilderObject.interval)`.
+
 ### `@if`
 
-`'key@if:functionReference: 'value'`
+`'key@if:functionReference: 'value'`  
 The corresponding value is assigned if the specified `:functionReference` function returns `true`.
-See `given()` for more info about references.
+See [given() method](#given()) for more details about references.
 
+```javascript
+EBuilder('<button>click me</button>')
+    .given(isLucky)
+    .set({
+        'properties@on:click': { 'textContent@if:isLucky': 'Bravo!' }
+})
+```
+
 ### `@for`
 
--- EXPERIMENTAL --
+-- NOT YET AVAILABLE --
 
-`'key@for:arrayReference: 'value'`
-The corresponding value is assigned a number of times equal to the length of `:arrayReference`
-See `given()` for more info about references.
+`'key@for:arrayReference: 'value'`  

utils/Check.js

@@ -19,3 +19,3 @@ "use strict";
   return types.map(function (type) {
-    return exports.typeOf(input) === type.toLocaleLowerCase();
+    return exports.typeOf(input) === type.toLowerCase();
   }).reduce(function (a, c) {
@@ -22,0 +22,0 @@ return a || c;

utils/DOM.d.ts

 /**
  * In progress
  */
-export declare function insert(this: EBObject, input: string | Element | EBObject | Function, target: Element, at?: number | string, times?: number): void;
 export declare function insertV1(this: EBObject, input: Element, target: Element, at?: number | string, times?: number): void;

utils/DOM.js

@@ -10,58 +10,54 @@ "use strict";
 });
-exports.insertV1 = exports.insert = void 0;
+exports.insertV1 = void 0;
 
 var Check = require("./Check");
-
-var Parse = require("./Parse");
 /**
  * In progress
  */
+// export function insert(
+//     this: EBObject,
+//     input: string | Element | EBObject | Function,
+//     target: Element,
+//     at?: number | string,
+//     times?: number
+// ) {
+//     const posFromString = (at: string, childList: HTMLCollection) => {
+//         const posMap: NumberObject = {
+//             start: 0,
+//             middle: Math.floor(childList.length / 2),
+//             end: childList.length
+//         }
+//         return at in posMap ? posMap[at] : posMap.end
+//     }
+//     const safePos = (n: number, length: number) => {
+//         return n < 0
+//             ? Math.max(length + (n + 1), 0)
+//             : Math.min(length, n)
+//     }
+//     const safeTimes = times ? Math.abs(Math.floor(times)) : 1
+//     const computedInput = Parse.getComputedValue.call(this, input)
+//     const fragment = Parse.getFragmentFrom(computedInput, safeTimes)
+//     const childList = target.children
+//     const n = Check.isString(at) ? posFromString(at, childList) : Math.floor(at as number)
+//     const p = safePos(n, childList.length)
+//     // console.log(
+//     //     `input: ${input}\n`,
+//     //     `computedInput: ${computedInput}\n`,
+//     //     `targetLength: ${childList.length}\n`,
+//     //     `at: ${at}\n`,
+//     //     `position: ${n}\n`,
+//     //     `safePosition: ${p}\n`,
+//     //     `times: ${times}\n`,
+//     //     `fragment:`, fragment
+//     // )
+//     this.setElement(fragment.firstElementChild!) // needs checks
+//     if (childList.length === 0 || childList.length === p) {
+//         target.appendChild(fragment)
+//     } 
+//     else {
+//         target.insertBefore(fragment, childList[p])
+//     }
+// }
 
 
-function insert(input, target, at, times) {
-  var posFromString = function posFromString(at, childList) {
-    var posMap = {
-      start: 0,
-      middle: Math.floor(childList.length / 2),
-      end: childList.length
-    };
-    return at in posMap ? posMap[at] : posMap.end;
-  };
-
-  var safePos = function safePos(n, length) {
-    return n < 0 ? Math.max(length + (n + 1), 0) : Math.min(length, n);
-  };
-
-  var safeTimes = times ? Math.abs(Math.floor(times)) : 1;
-  var computedInput = Parse.getComputedValue.call(this, input);
-  var fragment = Parse.getFragmentFrom(computedInput, safeTimes);
-  var childList = target.children;
-  var n = Check.isString(at) ? posFromString(at, childList) : Math.floor(at);
-  var p = safePos(n, childList.length); // console.log(
-  //     `input: ${input}\n`,
-  //     `computedInput: ${computedInput}\n`,
-  //     `targetLength: ${childList.length}\n`,
-  //     `at: ${at}\n`,
-  //     `position: ${n}\n`,
-  //     `safePosition: ${p}\n`,
-  //     `times: ${times}\n`,
-  //     `fragment:`, fragment
-  // )
-  // console.log(fragment.firstElementChild)
-
-  this.setElement(fragment.firstElementChild); // needs checks
-
-  if (childList.length === 0 || childList.length === p) {
-    // console.log('cas 1')
-    target.appendChild(fragment);
-  } else {
-    // console.log(childList[p], p)
-    target.insertBefore(fragment, childList[p]);
-  } // console.log(input)
-  // console.log(fragment.firstChild)
-
-}
-
-exports.insert = insert;
-
 function insertV1(input, target, at, times) {
@@ -88,3 +84,3 @@ var _this$cloneList;
   var childList = target.children;
-  var n = Check.isString(at) ? posFromString(at, childList) : Math.floor(at);
+  var n = Check.isString(at) ? posFromString(at, childList) : Math.round(at);
   var p = safePos(n, childList.length);
@@ -91,0 +87,0 @@

utils/Parse.d.ts

@@ -6,3 +6,2 @@ export declare function elementStringSource(source: string): {
 export declare function HTMLToElement(html: string): Element | Node;
-export declare function getFragmentFrom(input: string | Element | EBObject, times?: number): DocumentFragment;
 export declare function getElementFrom(input: string | Element | EBObject): Element;
@@ -9,0 +8,0 @@ export declare function eventInput(this: EBObject, eventInput: string): any[];

utils/Parse.js

@@ -12,3 +12,3 @@ "use strict";
 });
-exports.inputObject = exports.getComputedValue2 = exports.getComputedValue = exports.getTrueElement = exports.eventInput = exports.getElementFrom = exports.getFragmentFrom = exports.HTMLToElement = exports.elementStringSource = void 0;
+exports.inputObject = exports.getComputedValue2 = exports.getComputedValue = exports.getTrueElement = exports.eventInput = exports.getElementFrom = exports.HTMLToElement = exports.elementStringSource = void 0;
 
@@ -41,23 +41,13 @@ var Check = require("./Check");
 
-exports.HTMLToElement = HTMLToElement;
+exports.HTMLToElement = HTMLToElement; // export function getFragmentFrom(input: string | Element | EBObject, times: number = 1) {
+//     const template = document.createElement('template')
+//     let safeTimes = Math.abs(Math.floor(times))
+//     const fillTemplate = (input: string | Element | EBObject) => {
+//         const html = Check.isElement(input) ? input.outerHTML : `${input}`
+//         template.innerHTML += html
+//     }
+//     while (safeTimes--) fillTemplate(input)
+//     return template.content
+// }
 
-function getFragmentFrom(input) {
-  var times = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
-  var template = document.createElement('template');
-  var safeTimes = Math.abs(Math.floor(times));
-
-  var fillTemplate = function fillTemplate(input) {
-    var html = Check.isElement(input) ? input.outerHTML : "".concat(input);
-    template.innerHTML += html;
-  };
-
-  while (safeTimes--) {
-    fillTemplate(input);
-  }
-
-  return template.content;
-}
-
-exports.getFragmentFrom = getFragmentFrom;
-
 function getElementFrom(input) {
@@ -95,3 +85,3 @@ return Check.isString(input) ? HTMLToElement(input) // change this
 function getComputedValue(value) {
-  return Check.isFunction(value) ? value.call(this) : value;
+  return Check.isFunction(value) ? value.call(this, this) : value;
 }
@@ -98,0 +88,0 @@

utils/Setter.js

@@ -248,11 +248,2 @@ "use strict";
 
-    var applyRule2 = function applyRule2(ruleValue, ruleName) {
-      var ruleKey = ruleName.toLowerCase();
-
-      if (ruleKey in Rule.RuleMap) {
-        Rule.RuleMap[ruleKey].call(_this7, ruleValue, callback);
-        ruleApplied = true;
-      }
-    };
-
     rules.forEach(applyRule);
@@ -259,0 +250,0 @@ if (!ruleApplied) callback();

No alert changes

Improved metrics

Total package byte prevSize

76804

increased by3.92%

Number of package files

21

increased by5%

Number of lines in readme file

287

increased by30.45%

Worsened metrics

Lines of code

1530

decreased by-0.33%

No dependency changes