skull-dom 1.0.0 → 1.0.1

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.
Files changed (2) hide show
  1. package/README.md +7 -7
  2. package/package.json +2 -2
package/README.md CHANGED
@@ -1,12 +1,12 @@
1
- # 💀 AutoSkeleton
1
+ # 💀 SkullDOM
2
2
  > **Automagic skeleton screens for any framework.**
3
3
  > Zero config. Zero manual styles. Just robust, layout-aware loading states.
4
4
 
5
- ## Why AutoSkeleton?
5
+ ## Why SkullDOM?
6
6
 
7
7
  Most skeleton libraries require you to manually build "skeleton versions" of your components. You end up maintaining two UIs: the real one and the fake one.
8
8
 
9
- **AutoSkeleton is different.**
9
+ **SkullDOM is different.**
10
10
  It looks at your **existing DOM**, infers its layout (text, images, grids, flex), and overlays a pixel-perfect skeleton on top of it.
11
11
 
12
12
  - **Framework Agnostic:** First-class adapters for React, Vue, Svelte, Solid, and Vanilla.
@@ -39,7 +39,7 @@ Add attributes to your HTML. No JS required.
39
39
  <!-- 2. Toggle the attribute when loading -->
40
40
  <div data-skeleton="loading">
41
41
  <h1>My Content</h1>
42
- <p>AutoSkeleton will infer this text structure and cover it.</p>
42
+ <p>SkullDOM will infer this text structure and cover it.</p>
43
43
  </div>
44
44
  ```
45
45
 
@@ -110,7 +110,7 @@ import { skeleton } from 'skull-dom/solid';
110
110
 
111
111
  ## 🧠 How it Works
112
112
 
113
- AutoSkeleton operates on a simple "Overlay" mental model:
113
+ SkullDOM operates on a simple "Overlay" mental model:
114
114
 
115
115
  1. **Probe:** It scans your target DOM element and measures computed styles (width, height, margin, padding, line-height, etc.).
116
116
  2. **Infer:** It creates a lightweight tree representation of what matters (Text lines? Block? Flex group?).
@@ -118,7 +118,7 @@ AutoSkeleton operates on a simple "Overlay" mental model:
118
118
  4. **Overlay:** It sets your original element to `visibility: hidden` and absolutely positions the skeleton layer directly on top of it.
119
119
 
120
120
  ### Important: You need content!
121
- Because AutoSkeleton **infers** from your DOM, your elements need to exist in the DOM (even if empty).
121
+ Because SkullDOM **infers** from your DOM, your elements need to exist in the DOM (even if empty).
122
122
  * ✅ **Good:** Render your component with empty strings or optional chaining.
123
123
  * ❌ **Bad:** `if (loading) return null;` (There is nothing to infer!)
124
124
 
@@ -156,7 +156,7 @@ cleanup();
156
156
  ```
157
157
 
158
158
  ### Styling
159
- Currently, AutoSkeleton injects a default gray theme (`#d1d5db` base, `#9ca3af` text lines) with a modest border radius.
159
+ Currently, SkullDOM injects a default gray theme (`#d1d5db` base, `#9ca3af` text lines) with a modest border radius.
160
160
  Future versions will expose CSS variables for theming.
161
161
 
162
162
  ---
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "skull-dom",
3
- "version": "1.0.0",
3
+ "version": "1.0.1",
4
4
  "main": "dist/index.js",
5
5
  "types": "dist/index.d.ts",
6
6
  "files": [
@@ -61,4 +61,4 @@
61
61
  "vitest": "^4.0.16",
62
62
  "vue": "^3.5.26"
63
63
  }
64
- }
64
+ }