mirror of
				https://github.com/jaandrle/deka-dom-el
				synced 2025-10-31 05:49:15 +01:00 
			
		
		
		
	Compare commits
	
		
			5 Commits
		
	
	
		
			v0.9.3-alp
			...
			330f702409
		
	
	| Author | SHA1 | Date | |
|---|---|---|---|
| 330f702409 | |||
| 2f57f115a0 | |||
| d1b017c1a1 | |||
| 992370b4e3 | |||
| 3301a6600c | 
							
								
								
									
										18
									
								
								.github/workflows/npm-publish.yml
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										18
									
								
								.github/workflows/npm-publish.yml
									
									
									
									
										vendored
									
									
								
							| @@ -1,18 +0,0 @@ | |||||||
| name: Publish Package to npmjs |  | ||||||
| on: |  | ||||||
|   workflow_dispatch: |  | ||||||
|   release: |  | ||||||
|     types: [created] |  | ||||||
| jobs: |  | ||||||
|   build: |  | ||||||
|     runs-on: ubuntu-latest |  | ||||||
|     steps: |  | ||||||
|       - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2 |  | ||||||
|       - uses: actions/setup-node@cdca7365b2dadb8aad0a33bc7601856ffabcc48e # v4.3.0 |  | ||||||
|         with: |  | ||||||
|           node-version: '20.16' |  | ||||||
|           registry-url: 'https://registry.npmjs.org' |  | ||||||
|       - run: npm ci |  | ||||||
|       - run: npm publish |  | ||||||
|         env: |  | ||||||
|           NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }} |  | ||||||
							
								
								
									
										3
									
								
								.npmrc
									
									
									
									
									
								
							
							
						
						
									
										3
									
								
								.npmrc
									
									
									
									
									
								
							| @@ -1,3 +0,0 @@ | |||||||
| //registry.npmjs.org/:_authToken=${NODE_AUTH_TOKEN} |  | ||||||
| registry=https://registry.npmjs.org/ |  | ||||||
| always-auth=true |  | ||||||
| @@ -1,134 +0,0 @@ | |||||||
|  |  | ||||||
| # Contributor Covenant Code of Conduct |  | ||||||
|  |  | ||||||
| ## Our Pledge |  | ||||||
|  |  | ||||||
| We as members, contributors, and leaders pledge to make participation in our |  | ||||||
| community a harassment-free experience for everyone, regardless of age, body |  | ||||||
| size, visible or invisible disability, ethnicity, sex characteristics, gender |  | ||||||
| identity and expression, level of experience, education, socio-economic status, |  | ||||||
| nationality, personal appearance, race, caste, color, religion, or sexual |  | ||||||
| identity and orientation. |  | ||||||
|  |  | ||||||
| We pledge to act and interact in ways that contribute to an open, welcoming, |  | ||||||
| diverse, inclusive, and healthy community. |  | ||||||
|  |  | ||||||
| ## Our Standards |  | ||||||
|  |  | ||||||
| Examples of behavior that contributes to a positive environment for our |  | ||||||
| community include: |  | ||||||
|  |  | ||||||
| * Demonstrating empathy and kindness toward other people |  | ||||||
| * Being respectful of differing opinions, viewpoints, and experiences |  | ||||||
| * Giving and gracefully accepting constructive feedback |  | ||||||
| * Accepting responsibility and apologizing to those affected by our mistakes, |  | ||||||
| 	and learning from the experience |  | ||||||
| * Focusing on what is best not just for us as individuals, but for the overall |  | ||||||
| 	community |  | ||||||
|  |  | ||||||
| Examples of unacceptable behavior include: |  | ||||||
|  |  | ||||||
| * The use of sexualized language or imagery, and sexual attention or advances of |  | ||||||
| 	any kind |  | ||||||
| * Trolling, insulting or derogatory comments, and personal or political attacks |  | ||||||
| * Public or private harassment |  | ||||||
| * Publishing others' private information, such as a physical or email address, |  | ||||||
| 	without their explicit permission |  | ||||||
| * Other conduct which could reasonably be considered inappropriate in a |  | ||||||
| 	professional setting |  | ||||||
|  |  | ||||||
| ## Enforcement Responsibilities |  | ||||||
|  |  | ||||||
| Community leaders are responsible for clarifying and enforcing our standards of |  | ||||||
| acceptable behavior and will take appropriate and fair corrective action in |  | ||||||
| response to any behavior that they deem inappropriate, threatening, offensive, |  | ||||||
| or harmful. |  | ||||||
|  |  | ||||||
| Community leaders have the right and responsibility to remove, edit, or reject |  | ||||||
| comments, commits, code, wiki edits, issues, and other contributions that are |  | ||||||
| not aligned to this Code of Conduct, and will communicate reasons for moderation |  | ||||||
| decisions when appropriate. |  | ||||||
|  |  | ||||||
| ## Scope |  | ||||||
|  |  | ||||||
| This Code of Conduct applies within all community spaces, and also applies when |  | ||||||
| an individual is officially representing the community in public spaces. |  | ||||||
| Examples of representing our community include using an official e-mail address, |  | ||||||
| posting via an official social media account, or acting as an appointed |  | ||||||
| representative at an online or offline event. |  | ||||||
|  |  | ||||||
| ## Enforcement |  | ||||||
|  |  | ||||||
| Instances of abusive, harassing, or otherwise unacceptable behavior may be |  | ||||||
| reported to the community leaders responsible for enforcement at |  | ||||||
| andrle.jan@centrum.cz. |  | ||||||
| All complaints will be reviewed and investigated promptly and fairly. |  | ||||||
|  |  | ||||||
| All community leaders are obligated to respect the privacy and security of the |  | ||||||
| reporter of any incident. |  | ||||||
|  |  | ||||||
| ## Enforcement Guidelines |  | ||||||
|  |  | ||||||
| Community leaders will follow these Community Impact Guidelines in determining |  | ||||||
| the consequences for any action they deem in violation of this Code of Conduct: |  | ||||||
|  |  | ||||||
| ### 1. Correction |  | ||||||
|  |  | ||||||
| **Community Impact**: Use of inappropriate language or other behavior deemed |  | ||||||
| unprofessional or unwelcome in the community. |  | ||||||
|  |  | ||||||
| **Consequence**: A private, written warning from community leaders, providing |  | ||||||
| clarity around the nature of the violation and an explanation of why the |  | ||||||
| behavior was inappropriate. A public apology may be requested. |  | ||||||
|  |  | ||||||
| ### 2. Warning |  | ||||||
|  |  | ||||||
| **Community Impact**: A violation through a single incident or series of |  | ||||||
| actions. |  | ||||||
|  |  | ||||||
| **Consequence**: A warning with consequences for continued behavior. No |  | ||||||
| interaction with the people involved, including unsolicited interaction with |  | ||||||
| those enforcing the Code of Conduct, for a specified period of time. This |  | ||||||
| includes avoiding interactions in community spaces as well as external channels |  | ||||||
| like social media. Violating these terms may lead to a temporary or permanent |  | ||||||
| ban. |  | ||||||
|  |  | ||||||
| ### 3. Temporary Ban |  | ||||||
|  |  | ||||||
| **Community Impact**: A serious violation of community standards, including |  | ||||||
| sustained inappropriate behavior. |  | ||||||
|  |  | ||||||
| **Consequence**: A temporary ban from any sort of interaction or public |  | ||||||
| communication with the community for a specified period of time. No public or |  | ||||||
| private interaction with the people involved, including unsolicited interaction |  | ||||||
| with those enforcing the Code of Conduct, is allowed during this period. |  | ||||||
| Violating these terms may lead to a permanent ban. |  | ||||||
|  |  | ||||||
| ### 4. Permanent Ban |  | ||||||
|  |  | ||||||
| **Community Impact**: Demonstrating a pattern of violation of community |  | ||||||
| standards, including sustained inappropriate behavior, harassment of an |  | ||||||
| individual, or aggression toward or disparagement of classes of individuals. |  | ||||||
|  |  | ||||||
| **Consequence**: A permanent ban from any sort of public interaction within the |  | ||||||
| community. |  | ||||||
|  |  | ||||||
| ## Attribution |  | ||||||
|  |  | ||||||
| This Code of Conduct is adapted from the [Contributor Covenant][homepage], |  | ||||||
| version 2.1, available at |  | ||||||
| [https://www.contributor-covenant.org/version/2/1/code_of_conduct.html][v2.1]. |  | ||||||
|  |  | ||||||
| Community Impact Guidelines were inspired by |  | ||||||
| [Mozilla's code of conduct enforcement ladder][Mozilla CoC]. |  | ||||||
|  |  | ||||||
| For answers to common questions about this code of conduct, see the FAQ at |  | ||||||
| [https://www.contributor-covenant.org/faq][FAQ]. Translations are available at |  | ||||||
| [https://www.contributor-covenant.org/translations][translations]. |  | ||||||
|  |  | ||||||
| [homepage]: https://www.contributor-covenant.org |  | ||||||
| [v2.1]: https://www.contributor-covenant.org/version/2/1/code_of_conduct.html |  | ||||||
| [Mozilla CoC]: https://github.com/mozilla/diversity |  | ||||||
| [FAQ]: https://www.contributor-covenant.org/faq |  | ||||||
| [translations]: https://www.contributor-covenant.org/translations |  | ||||||
|  |  | ||||||
							
								
								
									
										50
									
								
								README.md
									
									
									
									
									
								
							
							
						
						
									
										50
									
								
								README.md
									
									
									
									
									
								
							| @@ -1,4 +1,4 @@ | |||||||
| **Alpha** | **WIP** (the experimentation phase) | ||||||
| | [source code on GitHub](https://github.com/jaandrle/deka-dom-el) | | [source code on GitHub](https://github.com/jaandrle/deka-dom-el) | ||||||
| | [*mirrored* on Gitea](https://gitea.jaandrle.cz/jaandrle/deka-dom-el) | | [*mirrored* on Gitea](https://gitea.jaandrle.cz/jaandrle/deka-dom-el) | ||||||
| | [](https://robinpokorny.github.io/git3moji/) <!-- editorconfig-checker-disable-line --> | | [](https://robinpokorny.github.io/git3moji/) <!-- editorconfig-checker-disable-line --> | ||||||
| @@ -40,7 +40,7 @@ function EmojiCounter({ initial }) { | |||||||
| 			on("click", () => count.set(count.get() + 1)) | 			on("click", () => count.set(count.get() + 1)) | ||||||
| 		), | 		), | ||||||
|  |  | ||||||
| 		el("select", null, on.defer(el=> el.value= initial), | 		el("select", null, on.host(el=> el.value= initial), | ||||||
| 			on("change", e => emoji.set(e.target.value)) | 			on("change", e => emoji.set(e.target.value)) | ||||||
| 		).append( | 		).append( | ||||||
| 			el(Option, "🎉"), | 			el(Option, "🎉"), | ||||||
| @@ -61,30 +61,40 @@ Creating reactive elements, components, and Web Components using the native | |||||||
| ## Features at a Glance | ## Features at a Glance | ||||||
|  |  | ||||||
| - ✅ **No build step required** — use directly in browsers or Node.js | - ✅ **No build step required** — use directly in browsers or Node.js | ||||||
| - ☑️ **Lightweight** — ~10-15kB minified (original goal 10kB) with **zero**/minimal dependencies | - ☑️ **Lightweight** — ~10-15kB minified (original goal 10kB) with zero/minimal dependencies | ||||||
| - ✅ **Declarative & functional approach** for clean, maintainable code | - ✅ **Declarative & functional approach** for clean, maintainable code | ||||||
| - ✅ **Signals and events** for reactive UI | - ✅ **Signals and events** for reactive UI | ||||||
| - ✅ **Memoization for performance** — optimize rendering with intelligent caching | - ✅ **Memoization for performance** — optimize rendering with intelligent caching | ||||||
| - ✅ **Optional build-in signals** with support for custom reactive implementations (#39) | - ✅ **Optional build-in signals** with support for custom reactive implementations | ||||||
| - ✅ **Server-side rendering** support via [jsdom](https://github.com/jsdom/jsdom) | - ✅ **Server-side rendering** support via [jsdom](https://github.com/jsdom/jsdom) | ||||||
| - ✅ **TypeScript support** | - ✅ **TypeScript support** (work in progress) | ||||||
| - ☑️ **Support for debugging with browser DevTools** without extensions | - ☑️ **Support for debugging with browser DevTools** without extensions | ||||||
| - ☑️ **Enhanced Web Components** support | - ☑️ **Enhanced Web Components** support (work in progress) | ||||||
|  |  | ||||||
|  | ## Why Another Library? | ||||||
|  |  | ||||||
|  | This library bridges the gap between minimal solutions like van/hyperscript and more comprehensive frameworks like | ||||||
|  | [solid-js](https://github.com/solidjs/solid), offering a balanced trade-off between size, complexity, and usability. | ||||||
|  |  | ||||||
|  | Following functional programming principles, dd\<el\> starts with pure JavaScript (DOM API) and gradually adds | ||||||
|  | auxiliary functions. These range from minor improvements to advanced features for building complete declarative | ||||||
|  | reactive UI templates. | ||||||
|  |  | ||||||
|  | A key advantage: any internal function (`assign`, `classListDeclarative`, `on`, `dispatchEvent`, `S`, etc.) can be used | ||||||
|  | independently while also working seamlessly together. This modular approach makes it easier to integrate the library | ||||||
|  | into existing projects. | ||||||
|  |  | ||||||
| ## Getting Started | ## Getting Started | ||||||
|  |  | ||||||
| ### Documentation |  | ||||||
|  |  | ||||||
| - [**Documentation and Guide**](https://jaandrle.github.io/deka-dom-el) |  | ||||||
| - [**Examples**](https://jaandrle.github.io/deka-dom-el/p15-examples.html) |  | ||||||
|  |  | ||||||
| ### Installation | ### Installation | ||||||
|  |  | ||||||
|  | #### npm | ||||||
| ```bash | ```bash | ||||||
| npm install deka-dom-el --save | # TBD | ||||||
|  | # npm install deka-dom-el | ||||||
| ``` | ``` | ||||||
|  |  | ||||||
| …or via CDN / Direct Script: | #### CDN / Direct Script | ||||||
|  |  | ||||||
| For CDN links and various build formats (ESM/IIFE, with/without signals, minified/unminified), see the [interactive | For CDN links and various build formats (ESM/IIFE, with/without signals, minified/unminified), see the [interactive | ||||||
| format selector](https://jaandrle.github.io/deka-dom-el/) on the documentation site. | format selector](https://jaandrle.github.io/deka-dom-el/) on the documentation site. | ||||||
| @@ -104,18 +114,10 @@ format selector](https://jaandrle.github.io/deka-dom-el/) on the documentation s | |||||||
| </script> | </script> | ||||||
| ``` | ``` | ||||||
|  |  | ||||||
| ## Why Another Library? | ### Documentation | ||||||
|  |  | ||||||
| This library bridges the gap between minimal solutions like van/hyperscript and more comprehensive frameworks like | - [**Interactive Guide**](https://jaandrle.github.io/deka-dom-el) | ||||||
| [solid-js](https://github.com/solidjs/solid), offering a balanced trade-off between size, complexity, and usability. | - [**Examples**](https://jaandrle.github.io/deka-dom-el/p15-examples.html) | ||||||
|  |  | ||||||
| Following functional programming principles, dd\<el\> starts with pure JavaScript (DOM API) and gradually adds |  | ||||||
| auxiliary functions. These range from minor improvements to advanced features for building complete declarative |  | ||||||
| reactive UI templates. |  | ||||||
|  |  | ||||||
| A key advantage: any internal function (`assign`, `classListDeclarative`, `on`, `dispatchEvent`, `S`, etc.) can be used |  | ||||||
| independently while also working seamlessly together. This modular approach makes it easier to integrate the library |  | ||||||
| into existing projects. |  | ||||||
|  |  | ||||||
| ## Understanding Signals | ## Understanding Signals | ||||||
|  |  | ||||||
|   | |||||||
| @@ -105,7 +105,7 @@ export function page({ pkg, info }){ | |||||||
| 			or directly include it from a CDN for quick prototyping. | 			or directly include it from a CDN for quick prototyping. | ||||||
| 		`), | 		`), | ||||||
| 		el("h4", "npm installation"), | 		el("h4", "npm installation"), | ||||||
| 		el(code, { content: "npm install deka-dom-el --save", language: "shell", page_id }), | 		el(code, { content: "npm install deka-dom-el # Coming soon", language: "shell", page_id }), | ||||||
| 		el("h4", "CDN / Direct Script Usage"), | 		el("h4", "CDN / Direct Script Usage"), | ||||||
| 		el("p").append(T` | 		el("p").append(T` | ||||||
| 			Use the interactive selector below to choose your preferred format: | 			Use the interactive selector below to choose your preferred format: | ||||||
| @@ -164,4 +164,4 @@ export function page({ pkg, info }){ | |||||||
| 			Let’s get started with the basics of creating elements! | 			Let’s get started with the basics of creating elements! | ||||||
| 		`), | 		`), | ||||||
| 	); | 	); | ||||||
| } | } | ||||||
| @@ -89,7 +89,7 @@ | |||||||
| 		"test": "echo \"Error: no tests yet\"", | 		"test": "echo \"Error: no tests yet\"", | ||||||
| 		"build": "bs/build.js", | 		"build": "bs/build.js", | ||||||
| 		"lint": "bs/lint.sh", | 		"lint": "bs/lint.sh", | ||||||
| 		"docs": "bs/docs.js" | 		"docs": "bs/docs.sh" | ||||||
| 	}, | 	}, | ||||||
| 	"keywords": [ | 	"keywords": [ | ||||||
| 		"dom", | 		"dom", | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user