jaandrle/deka-dom-el
1
0
Fork 0
mirror of https://github.com/jaandrle/deka-dom-el synced 2024-11-25 09:49:36 +01:00
Code Packages Releases Activity

💥 WC

Browse Source
This commit is contained in:
Jan Andrle 2023-11-08 19:09:39 +01:00
parent 5c038f0427
commit 4d3a513713
Signed by: jaandrle
GPG Key ID: B3A25AED155AFFAB
10 changed files with 39 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
dist/dde-with-signals.js vendored
View File

File diff suppressed because one or more lines are too long

6
dist/dde.js vendored
View File

File diff suppressed because one or more lines are too long

6
dist/esm-with-signals.d.ts vendored
View File

@ -121,7 +121,7 @@ interface On{
) : EE; ) : EE;
} }
export const on: On; export const on: On;
type Scope= { scope: Node | Function | Object, host: ddeElementModifier<any>, prevent: boolean } type Scope= { scope: Node | Function | Object, host: ddeElementModifier<any>, prevent: boolean, inherit_host: boolean, }
/** Current scope created last time the `el(Function)` was invoke. (Or {@link scope.push}) */ /** Current scope created last time the `el(Function)` was invoke. (Or {@link scope.push}) */
export const scope: { export const scope: {
current: Scope, current: Scope,
@ -138,9 +138,9 @@ export const scope: {
state: Scope[], state: Scope[],
/** Adds new child scope. All attributes are inherited by default. */ /** Adds new child scope. All attributes are inherited by default. */
push(scope: Partial<Scope>): ReturnType<Array<Scope>["push"]> push(scope: Partial<Scope>): ReturnType<Array<Scope>["push"]>,
/** Removes last/current child scope. */ /** Removes last/current child scope. */
pop(): ReturnType<Array<Scope>["pop"]> pop(): ReturnType<Array<Scope>["pop"]>,
}; };
/* /*
* TODO TypeScript HACK (better way?) * TODO TypeScript HACK (better way?)

8
dist/esm-with-signals.js vendored
View File

File diff suppressed because one or more lines are too long

6
dist/esm.d.ts vendored
View File

@ -121,7 +121,7 @@ interface On{
) : EE; ) : EE;
} }
export const on: On; export const on: On;
type Scope= { scope: Node | Function | Object, host: ddeElementModifier<any>, prevent: boolean } type Scope= { scope: Node | Function | Object, host: ddeElementModifier<any>, prevent: boolean, inherit_host: boolean, }
/** Current scope created last time the `el(Function)` was invoke. (Or {@link scope.push}) */ /** Current scope created last time the `el(Function)` was invoke. (Or {@link scope.push}) */
export const scope: { export const scope: {
current: Scope, current: Scope,
@ -138,9 +138,9 @@ export const scope: {
state: Scope[], state: Scope[],
/** Adds new child scope. All attributes are inherited by default. */ /** Adds new child scope. All attributes are inherited by default. */
push(scope: Partial<Scope>): ReturnType<Array<Scope>["push"]> push(scope: Partial<Scope>): ReturnType<Array<Scope>["push"]>,
/** Removes last/current child scope. */ /** Removes last/current child scope. */
pop(): ReturnType<Array<Scope>["pop"]> pop(): ReturnType<Array<Scope>["pop"]>,
}; };
/* /*
* TODO TypeScript HACK (better way?) * TODO TypeScript HACK (better way?)

2
dist/esm.js vendored
View File

File diff suppressed because one or more lines are too long

2
examples/components/webComponent.js
View File

@ -48,7 +48,7 @@ lifecycleToEvents(CustomHTMLTestElement)
customElements.define(CustomHTMLTestElement.tagName, CustomHTMLTestElement); customElements.define(CustomHTMLTestElement.tagName, CustomHTMLTestElement);
function customElementRender(_this, render){ function customElementRender(_this, render){
scope.push({ scope: _this, host: (...a)=> a.length ? a[0](_this) : _this }); scope.push({ scope: _this, host: (...a)=> a.length ? a[0](_this) : _this, inherit_host: true });
const out= render(_this); const out= render(_this);
scope.pop(); scope.pop();
return out; return out;

6
index.d.ts vendored
View File

@ -127,7 +127,7 @@ interface On{
} }
export const on: On; export const on: On;
type Scope= { scope: Node | Function | Object, host: ddeElementModifier<any>, prevent: boolean } type Scope= { scope: Node | Function | Object, host: ddeElementModifier<any>, prevent: boolean, inherit_host: boolean, }
/** Current scope created last time the `el(Function)` was invoke. (Or {@link scope.push}) */ /** Current scope created last time the `el(Function)` was invoke. (Or {@link scope.push}) */
export const scope: { export const scope: {
current: Scope, current: Scope,
@ -144,9 +144,9 @@ export const scope: {
state: Scope[], state: Scope[],
/** Adds new child scope. All attributes are inherited by default. */ /** Adds new child scope. All attributes are inherited by default. */
push(scope: Partial<Scope>): ReturnType<Array<Scope>["push"]> push(scope: Partial<Scope>): ReturnType<Array<Scope>["push"]>,
/** Removes last/current child scope. */ /** Removes last/current child scope. */
pop(): ReturnType<Array<Scope>["pop"]> pop(): ReturnType<Array<Scope>["pop"]>,
}; };
/* /*

7
package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "deka-dom-el", "name": "deka-dom-el",
"version": "0.6.1", "version": "0.7.0",
"description": "A low-code library that simplifies the creation of native DOM elements/components using small wrappers and tweaks.", "description": "A low-code library that simplifies the creation of native DOM elements/components using small wrappers and tweaks.",
"author": "Jan Andrle <andrle.jan@centrum.cz>", "author": "Jan Andrle <andrle.jan@centrum.cz>",
"license": "MIT", "license": "MIT",
@ -75,6 +75,11 @@
"path": "./examples/components/webComponent.js", "path": "./examples/components/webComponent.js",
"limit": "12.5 kB", "limit": "12.5 kB",
"gzip": false "gzip": false
},
{
"path": "./examples/components/webComponent.js",
"limit": "5 kB",
"gzip": true
} }
], ],
"modifyEsbuildConfig": { "modifyEsbuildConfig": {

9
src/dom.js
View File

@ -4,7 +4,8 @@ import { signals } from "./signals-common.js";
const scopes= [ { const scopes= [ {
scope: document.body, scope: document.body,
host: c=> c ? c(document.body) : document.body, host: c=> c ? c(document.body) : document.body,
prevent: true prevent: true,
inherit_host: false,
} ]; } ];
export const scope= { export const scope= {
get current(){ return scopes[scopes.length-1]; }, get current(){ return scopes[scopes.length-1]; },
@ -24,7 +25,7 @@ export const scope= {
}; };
let namespace; let namespace;
export function createElement(tag, attributes, ...modifiers){ export function createElement(tag, attributes, ...modifiers){
/* jshint maxcomplexity: 15 */ /* jshint maxcomplexity: 16 */
const s= signals(this); const s= signals(this);
let scoped= 0; let scoped= 0;
let el, el_host; let el, el_host;
@ -34,7 +35,9 @@ export function createElement(tag, attributes, ...modifiers){
switch(true){ switch(true){
case typeof tag==="function": { case typeof tag==="function": {
scoped= 1; scoped= 1;
scope.push({ scope: tag, host: c=> c ? (scoped===1 ? modifiers.unshift(c) : c(el_host), undefined) : el_host }); const { inherit_host, host: hostParent }= scope.current;
const host= inherit_host ? hostParent : c=> c ? (scoped===1 ? modifiers.unshift(c) : c(el_host), undefined) : el_host;
scope.push({ scope: tag, host, inherit_host });
el= tag(attributes || undefined); el= tag(attributes || undefined);
const is_fragment= el instanceof DocumentFragment; const is_fragment= el instanceof DocumentFragment;
const el_mark= createElement.mark({ const el_mark= createElement.mark({