npm - @lukas_holdings/castdom - Versions diffs - 1.0.0 → 1.0.2 - Mend

@lukas_holdings/castdom 1.0.0 → 1.0.2

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

package/README.md +32 -22
package/package.json +10 -1

package/README.md CHANGED Viewed

@@ -1,9 +1,9 @@
 <p align="center">
-  <img src="https://img.shields.io/npm/v/castdom?style=flat-square&color=000" alt="npm version" />
+  <a href="https://www.npmjs.com/package/@lukas_holdings/castdom"><img src="https://img.shields.io/npm/v/@lukas_holdings/castdom?style=flat-square&color=000" alt="npm version" /></a>
+  <a href="https://www.npmjs.com/package/@lukas_holdings/castdom"><img src="https://img.shields.io/npm/dm/@lukas_holdings/castdom?style=flat-square&color=000" alt="npm downloads" /></a>
   <img src="https://img.shields.io/badge/license-MIT-000?style=flat-square" alt="license" />
   <img src="https://img.shields.io/badge/runtime-CSS%20only-000?style=flat-square" alt="CSS only runtime" />
   <img src="https://img.shields.io/badge/bundle-~14KB-000?style=flat-square" alt="bundle size" />
-  <img src="https://img.shields.io/badge/tests-71%20passed-000?style=flat-square" alt="tests" />
 </p>
 <h1 align="center">CastDOM</h1>
@@ -13,6 +13,10 @@
   No manual measurement. No hand-tuned placeholders. Zero-config, SSR-first, CSS-only runtime.
 </p>
+<p align="center">
+  <code>npm install @lukas_holdings/castdom</code>
+</p>
 <p align="center">
   <a href="#quick-start">Quick Start</a> &bull;
   <a href="#how-it-works">How It Works</a> &bull;
@@ -65,7 +69,7 @@ Your Component                          CastDOM Skeleton
 ### 1. Install
 ```bash
-npm install castdom
+npm install @lukas_holdings/castdom
 ```
 ### 2. Mark your components
@@ -138,7 +142,7 @@ CastDOM Build
 import ".castdom/loader.js";
 // Use anywhere
-import { CastDOM } from "castdom/react";
+import { CastDOM } from "@lukas_holdings/castdom/react";
 function UserProfile({ userId }) {
   const { data, isLoading } = useFetch(`/api/users/${userId}`);
@@ -237,7 +241,7 @@ The compression pipeline:
 ### `<CastDOM>` Component
 ```tsx
-import { CastDOM } from "castdom/react";
+import { CastDOM } from "@lukas_holdings/castdom/react";
 <CastDOM
   name="user-card"        // Registered skeleton name
@@ -260,7 +264,7 @@ import { CastDOM } from "castdom/react";
 Add to your `<head>` for critical CSS:
 ```tsx
-import { CastDOMStyle } from "castdom/react";
+import { CastDOMStyle } from "@lukas_holdings/castdom/react";
 function Layout({ children }) {
   return (
@@ -277,7 +281,7 @@ function Layout({ children }) {
 ### `useCastDOM` Hook
 ```tsx
-import { useCastDOM } from "castdom/react";
+import { useCastDOM } from "@lukas_holdings/castdom/react";
 function CustomSkeleton() {
   const { exists, data, breakpoint, css, html } = useCastDOM("user-card");
@@ -296,7 +300,7 @@ function CustomSkeleton() {
 ```tsx
 // app/layout.tsx
-import { initCastDOM } from "castdom/next";
+import { initCastDOM } from "@lukas_holdings/castdom/next";
 import manifest from "../.castdom/manifest.json";
 initCastDOM(manifest);
@@ -312,7 +316,7 @@ export default function RootLayout({ children }) {
 ```tsx
 // app/dashboard/page.tsx
-import { CastDOM } from "castdom/next";
+import { CastDOM } from "@lukas_holdings/castdom/next";
 export default async function Dashboard() {
   const data = await fetchDashboard();
@@ -329,7 +333,7 @@ export default async function Dashboard() {
 ```tsx
 // pages/_app.tsx
-import { initCastDOM } from "castdom/next";
+import { initCastDOM } from "@lukas_holdings/castdom/next";
 import manifest from "../.castdom/manifest.json";
 initCastDOM(manifest);
@@ -342,7 +346,7 @@ export default function App({ Component, pageProps }) {
 ### Server-Side Props
 ```tsx
-import { getSkeletonProps } from "castdom/next";
+import { getSkeletonProps } from "@lukas_holdings/castdom/next";
 export async function getServerSideProps() {
   const { skeletonHTML, skeletonCSS } = getSkeletonProps(["user-card"]);
@@ -367,7 +371,7 @@ cp .castdom/nextjs-loading.tsx app/dashboard/loading.tsx
 ```js
 // astro.config.mjs
 import { defineConfig } from "astro/config";
-import { castdomIntegration } from "castdom/astro";
+import { castdomIntegration } from "@lukas_holdings/castdom/astro";
 export default defineConfig({
   integrations: [castdomIntegration()],
@@ -378,7 +382,7 @@ export default defineConfig({
 ```astro
 ---
-import { skeleton } from "castdom/astro";
+import { skeleton } from "@lukas_holdings/castdom/astro";
 const { html, css } = skeleton("user-card");
 ---
@@ -393,7 +397,7 @@ const { html, css } = skeleton("user-card");
 ```astro
 ---
-import { skeleton, viewTransitionProps } from "castdom/astro";
+import { skeleton, viewTransitionProps } from "@lukas_holdings/castdom/astro";
 const { html } = skeleton("sidebar");
 const transitionProps = viewTransitionProps("sidebar");
 ---
@@ -410,7 +414,7 @@ const transitionProps = viewTransitionProps("sidebar");
 ```ts
 // vite.config.ts
 import { defineConfig } from "vite";
-import { castdom } from "castdom/vite";
+import { castdom } from "@lukas_holdings/castdom/vite";
 export default defineConfig({
   plugins: [castdom()],
@@ -435,7 +439,7 @@ The plugin provides:
 For non-framework usage:
 ```js
-import { createCastDOM } from "castdom";
+import { createCastDOM } from "@lukas_holdings/castdom";
 import manifest from ".castdom/manifest.json";
 const castdom = createCastDOM();
@@ -468,7 +472,7 @@ CastDOM is SSR-first. Skeletons render as server-side HTML with zero JavaScript.
 ### Server-Side Rendering
 ```ts
-import { renderSkeleton, renderSSRFragment } from "castdom/ssr";
+import { renderSkeleton, renderSSRFragment } from "@lukas_holdings/castdom/ssr";
 // Single skeleton
 const html = renderSkeleton(skeletonData);
@@ -485,7 +489,7 @@ const { head, body } = renderSSRFragment([skeleton1, skeleton2]);
 SSR skeletons include `data-castdom-ssr` attributes. A tiny (~200 byte) inline hydration script automatically removes them once real content renders:
 ```ts
-import { renderHydrationScript } from "castdom/ssr";
+import { renderHydrationScript } from "@lukas_holdings/castdom/ssr";
 const script = renderHydrationScript();
 // <script data-castdom="hydration">(...)</script>
@@ -494,7 +498,7 @@ const script = renderHydrationScript();
 ### Critical CSS
 ```ts
-import { renderCriticalStyleTag } from "castdom/ssr";
+import { renderCriticalStyleTag } from "@lukas_holdings/castdom/ssr";
 const styleTag = renderCriticalStyleTag([skeleton1, skeleton2]);
 // <style data-castdom="critical">@keyframes castdom-shimmer{...}...</style>
@@ -630,7 +634,7 @@ import {
   extractBones,     // Extract bones from a DOM element (browser-side)
   compressBones,    // Compress bone data for storage
   decompressBones,  // Decompress bone data
-} from "castdom";
+} from "@lukas_holdings/castdom";
 ```
 ### React
@@ -640,7 +644,7 @@ import {
   CastDOM,          // Wrapper component
   CastDOMStyle,     // Critical CSS component for <head>
   useCastDOM,       // Hook for programmatic access
-} from "castdom/react";
+} from "@lukas_holdings/castdom/react";
 ```
 ### SSR
@@ -652,7 +656,7 @@ import {
   renderCriticalStyleTag,  // Generate <style> tag
   renderHydrationScript,   // Generate hydration <script>
   renderSSRFragment,       // Complete head + body fragments
-} from "castdom/ssr";
+} from "@lukas_holdings/castdom/ssr";
 ```
 ---
@@ -689,6 +693,12 @@ export type SkeletonName = "user-card" | "feed-item";
 ---
+## AI-Friendly
+CastDOM ships [`CASTDOM.md`](CASTDOM.md) — a comprehensive context file for AI coding assistants (Claude, Gemini, GPT, Cursor, Copilot, Windsurf, etc.). It contains every type, API, integration pattern, and CLI command so any AI can help you integrate CastDOM correctly.
+---
 ## Browser Support
 CastDOM's runtime is pure CSS — it works everywhere CSS animations work:

package/package.json CHANGED Viewed

@@ -1,7 +1,16 @@
 {
   "name": "@lukas_holdings/castdom",
-  "version": "1.0.0",
+  "version": "1.0.2",
   "description": "Pixel-perfect skeleton loading screens, extracted from your real DOM. Zero-config, SSR-first, CSS-only runtime.",
+  "homepage": "https://kameeleonn.github.io/CastDOM/",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/Kameeleonn/CastDOM.git"
+  },
+  "bugs": {
+    "url": "https://github.com/Kameeleonn/CastDOM/issues"
+  },
+  "author": "Lukas Holdings",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",