@cascivo/react 0.6.3 → 0.7.0

package/dist/toc/use-toc-from-region.js

@@ -1,17 +1,18 @@
 "use client";
 
-import { useSignal as e, useSignalEffect as t } from "@cascivo/core";
+import { useSignal as e, useSignalEffect as t, useSignals as n } from "@cascivo/core";
 //#region ../components/src/toc/use-toc-from-region.ts
-function n(n, r = {}) {
-	let i = r.selector ?? "h2, h3, h4", a = e([]);
+function r(r, i = {}) {
+	n();
+	let a = i.selector ?? "h2, h3, h4", o = e([]);
 	return t(() => {
-		let e = n.current;
-		e && (a.value = Array.from(e.querySelectorAll(i)).filter((e) => e.id !== "").map((e) => ({
+		let e = r.current;
+		e && (o.value = Array.from(e.querySelectorAll(a)).filter((e) => e.id !== "").map((e) => ({
 			id: e.id,
 			label: e.textContent?.trim() ?? "",
 			level: Number(e.tagName.slice(1)) || 2
 		})));
-	}), a;
+	}), o;
 }
 //#endregion
-export { n as useTocFromRegion };
+export { r as useTocFromRegion };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cascivo/react",
-  "version": "0.6.3",
+  "version": "0.7.0",
   "private": false,
   "description": "Prebuilt cascivo design system components — use without copying source",
   "keywords": [
@@ -44,8 +44,8 @@
     "provenance": true
   },
   "dependencies": {
-    "@cascivo/core": "^0.3.1",
-    "@cascivo/i18n": "^0.2.6"
+    "@cascivo/core": "^0.4.0",
+    "@cascivo/i18n": "^0.2.7"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.9.1",

package/readme.body.md

@@ -35,9 +35,18 @@ Components ship with `'use client'` preserved in the bundle, so they work inside
 RSC without any extra wrapper.
 
 > **No bundler? (CDN, import maps, plain `<link>`)** Import the aggregate sheet
-> `@cascivo/react/styles.css` — it contains every component's CSS in one file.
-> With a bundler you don't need it; import it only if you prefer one explicit
-> stylesheet over per-component tree-shaking.
+> `@cascivo/react/styles.css` — every component's CSS in one file (~273 KB /
+> ~37 KB gzip, not tree-shaken). With a bundler (CSR) you don't need it; import it
+> only if you prefer one explicit stylesheet over per-component tree-shaking, or
+> for Vite SSR (below), where it is required.
+
+> **Vite SSR / TanStack Start / Remix / workerd?** Those per-component `.css`
+> imports need a bundler to resolve them; a bare server-side ESM loader throws
+> `Unknown file extension ".css"`. Add `ssr: { noExternal: [/^@cascivo\//] }` (or
+> the `cascivoSsr()` plugin from `@cascivo/vite-plugin`) and import
+> `@cascivo/react/styles.css` once in your root entry. Full recipe:
+> [USING-WITH-VITE-SSR.md](https://github.com/cascivo/cascivo/blob/main/docs/USING-WITH-VITE-SSR.md).
+> Next.js App Router needs none of this.
 
 ## Use
 
@@ -335,7 +344,7 @@ routing break after adding one of these, check that the import resolves to
 - **DashboardLayout** — Dashboard page layout with stats strip, main content area, and optional aside.
 - **FeatureGrid** — Feature section — AutoGrid of items with optional title, description, and icon slots. Icons are optional; the grid works text-only. Replace demo content before shipping.
 - **Flex** — Flex layout primitive for vertical or horizontal stacking with gap control.
-- **Grid** — CSS grid layout primitive with responsive column collapsing.
+- **Grid** — CSS grid layout primitive with responsive column collapsing. Establishes its own containment, so responsive `cols` adapt to the grid’s own slot width with no wrapper or container ancestor required.
 - **Hero** — Page hero section — centered or split layout with eyebrow, title, description, actions and media slots. Replace demo content before shipping.
 - **Indicator** — Positions an overlay element (badge, dot, count) at a corner of its child
 - **Join** — Groups adjacent children into a seamless joined element by removing interior borders and radii