@jasonshimmy/custom-elements-runtime 0.0.11 → 0.0.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +7 -23
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -12,44 +12,28 @@ Build modern components with strict TypeScript, zero dependencies, and a clean f
|
|
|
12
12
|
## ✨ Why You'll Love It
|
|
13
13
|
|
|
14
14
|
- ⚡ **Blazing Fast:** Minimal runtime, instant updates, zero dependencies.
|
|
15
|
-
- 🎨 **JIT CSS:** On-demand, utility-first styling directly in your HTML.
|
|
15
|
+
- 🎨 **JIT CSS:** On-demand, utility-first styling directly in your HTML at runtime.
|
|
16
|
+
- 💪 **No Build Necessary:** Instant development feedback, no bundling required.
|
|
16
17
|
- 🧑💻 **TypeScript First:** Strict types, intellisense, and safety everywhere.
|
|
17
18
|
- 🧩 **Functional API:** No classes, no boilerplate—just pure functions.
|
|
18
19
|
- 🛠️ **SSR & HMR Ready:** Universal rendering and instant hot reloads.
|
|
19
20
|
- 🔌 **Extensible:** Directives, event bus, store, and more for advanced use cases.
|
|
20
21
|
- 🏆 **Developer Friendly:** Clean docs, examples, and a welcoming community.
|
|
21
22
|
|
|
22
|
-
##
|
|
23
|
-
|
|
24
|
-
### Install
|
|
25
|
-
|
|
26
|
-
```
|
|
27
|
-
npm install @jasonshimmy/custom-elements-runtime
|
|
28
|
-
```
|
|
29
|
-
|
|
30
|
-
### Example Usage
|
|
23
|
+
## ⏱️ Getting Started in 60 Seconds
|
|
31
24
|
|
|
32
|
-
|
|
25
|
+
1. **Install:** `npm install @jasonshimmy/custom-elements-runtime`
|
|
26
|
+
2. **Create a Component:**
|
|
27
|
+
```ts
|
|
33
28
|
import { component, html } from '@jasonshimmy/custom-elements-runtime';
|
|
34
29
|
|
|
35
30
|
component('my-counter', (ctx) => html`
|
|
36
31
|
<button @click="${() => ctx.count++}">Count: ${ctx.count}</button>
|
|
37
32
|
`, { state: { count: 0 } });
|
|
38
|
-
```
|
|
39
|
-
|
|
40
|
-
No config needed — TypeScript support is built-in.
|
|
41
|
-
|
|
42
|
-
## ⏱️ Getting Started in 60 Seconds
|
|
43
|
-
|
|
44
|
-
1. **Install:** `npm install @jasonshimmy/custom-elements-runtime`
|
|
45
|
-
2. **Create a Component:**
|
|
46
|
-
```ts
|
|
47
|
-
import { component, html } from '@jasonshimmy/custom-elements-runtime';
|
|
48
|
-
component('hello-world', () => html`<h1>Hello, World!</h1>`);
|
|
49
33
|
```
|
|
50
34
|
3. **Use in HTML:**
|
|
51
35
|
```html
|
|
52
|
-
<
|
|
36
|
+
<my-counter></my-counter>
|
|
53
37
|
```
|
|
54
38
|
4. **Enjoy instant reactivity and type safety!**
|
|
55
39
|
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@jasonshimmy/custom-elements-runtime",
|
|
3
3
|
"description": "A powerful, modern, and lightweight runtime for creating reactive web components with TypeScript",
|
|
4
|
-
"version": "0.0.
|
|
4
|
+
"version": "0.0.13",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"keywords": [
|
|
7
7
|
"web-components",
|