@viglet/shio-react-sdk 2026.2.1 → 2026.3.3

package/README.md

@@ -0,0 +1,127 @@
+# @viglet/shio-react-sdk
+
+[![npm](https://img.shields.io/npm/v/@viglet/shio-react-sdk?logo=npm)](https://www.npmjs.com/package/@viglet/shio-react-sdk)
+[![License](https://img.shields.io/npm/l/@viglet/shio-react-sdk)](https://github.com/openviglet/shio/blob/HEAD/LICENSE)
+[![Website](https://img.shields.io/badge/website-0ea5e9?logo=googlechrome&logoColor=white)](https://openviglet.github.io/shio/)
+
+The **React SDK** for **[Viglet Shio](https://openviglet.github.io/shio/)**, the open
+source, **agent-ready CMS**. Hooks and render components for
+consuming Shio content through the **Content Delivery API (CDA)**, built on
+[`@viglet/shio-client`](https://www.npmjs.com/package/@viglet/shio-client).
+
+- **React 18 / 19** — `react` is a peer dependency.
+- Targets the stable, read-only CDA contract (`/api/v2/cda/**`).
+- Everything the core client exports is **re-exported** here, so this is the only
+  package a React app needs.
+
+## Install
+
+```bash
+npm install @viglet/shio-react-sdk react
+```
+
+## Quick start
+
+Wrap your tree once:
+
+```tsx
+import { ShioProvider } from "@viglet/shio-react-sdk";
+
+export function App({ children }: { children: React.ReactNode }) {
+  return (
+    <ShioProvider
+      baseUrl="https://cms.example.com"
+      apiToken={import.meta.env.VITE_SHIO_CDA_TOKEN}
+    >
+      {children}
+    </ShioProvider>
+  );
+}
+```
+
+Then read content anywhere below it:
+
+```tsx
+import { useShioPostByUrl, ShioRichText } from "@viglet/shio-react-sdk";
+
+function Article({ siteId, url }: { siteId: string; url: string }) {
+  const { data: post, loading, error } = useShioPostByUrl(siteId, url);
+
+  if (loading) return <p>Loading…</p>;
+  if (error) return <p>{error.message}</p>;
+  if (!post) return <p>Not found</p>;
+
+  return (
+    <article>
+      <h1>{String(post.attrs.title ?? "")}</h1>
+      <ShioRichText html={String(post.attrs.content ?? "")} />
+    </article>
+  );
+}
+```
+
+`<ShioProvider>` also accepts an already-built client:
+`<ShioProvider client={myClient}>`.
+
+## Hooks
+
+Every hook returns a `ShioAsyncState<T>` — `{ data, loading, error }`.
+
+| Hook | Returns |
+|---|---|
+| `useShioSites()` | Every site the token can see |
+| `useShioSite(siteId)` | One site |
+| `useShioChildren(folderId, params?)` | A folder's children, paged |
+| `useShioBreadcrumb(objectId)` | The path from the site root to an object |
+| `useShioPost(postId)` | One post by id |
+| `useShioPostByUrl(siteId, url)` | One post by its friendly URL — built for `[...slug]` routing |
+| `useShioQuery(params?, enabled?)` | A query across a site / folder / post-type, paged |
+| `useShioClient()` | The `ShioClient` from context, for anything the hooks don't cover |
+
+## Components
+
+| Component | For |
+|---|---|
+| `<ShioRichText html={…} />` | Renders an HTML-editor field safely into a `div` (accepts any `div` props) |
+| `<ShioImage src={…} baseUrl={…} alt={…} />` | Resolves a stored file reference to a URL and renders an `img` |
+| `<ShioRelator items={…}>` | Maps over a Relator (nested repeatable) field |
+| `<ShioField value={…} as={…} />` | Renders one attribute by kind — `text`, `html`, `image`, `list`, `json` |
+
+## Next.js
+
+For **server components**, use
+[`@viglet/shio-client`](https://www.npmjs.com/package/@viglet/shio-client)
+directly — it is zero-dependency and needs no provider. Reach for this package
+in **client components**, where the hooks give you loading and error state.
+
+The fastest way to a working project is the generator, which wires both up for
+you:
+
+```bash
+npm create @viglet/shio-app@latest my-site
+```
+
+## Related packages
+
+| Package | For |
+|---|---|
+| [`@viglet/shio-client`](https://www.npmjs.com/package/@viglet/shio-client) | The framework-agnostic core this is built on |
+| [`@viglet/shio`](https://www.npmjs.com/package/@viglet/shio) | The Shio CLI — content as files, `shio types`, and the MCP bridge for [Claude Code](https://claude.com/claude-code) |
+| [`@viglet/shio-sections`](https://www.npmjs.com/package/@viglet/shio-sections) | The page-section vocabulary and its React components |
+| [`@viglet/shio-model`](https://www.npmjs.com/package/@viglet/shio-model) | Author the content model as typed code |
+| [`@viglet/shio-editor-cors`](https://www.npmjs.com/package/@viglet/shio-editor-cors) | Inline visual editing with the Universal Editor |
+| [`@viglet/create-shio-app`](https://www.npmjs.com/package/@viglet/create-shio-app) | Next.js starter generator |
+
+## Develop
+
+```bash
+npm run build      # vite lib build + .d.ts
+npm run typecheck
+```
+
+## License
+
+Apache-2.0 — [Viglet Shio](https://openviglet.github.io/shio/) ·
+[github.com/openviglet/shio](https://github.com/openviglet/shio) ·
+[docs.viglet.org/shio](https://docs.viglet.org/shio/) ·
+part of the [Viglet](https://www.viglet.org) open source family.

package/dist/components/shio-blocks.d.ts

@@ -0,0 +1,40 @@
+import type { ReactNode } from "react";
+import type { ShioBlock } from "@viglet/shio-client";
+/** A component rendering one block of its kind. */
+export type ShioBlockComponent<T extends ShioBlock = ShioBlock> = (props: {
+    block: T;
+}) => ReactNode;
+/** Block type to component. Every key is optional: a kind with no entry falls back. */
+export type ShioBlockComponents = {
+    [K in ShioBlock["type"]]?: ShioBlockComponent<Extract<ShioBlock, {
+        type: K;
+    }>>;
+};
+export interface ShioBlocksProps {
+    /** The field's blocks — `shioBlocks(post, "BODY")` from the core client. */
+    blocks: ShioBlock[] | null | undefined;
+    /** A component per block type. Anything not named here uses the fallback. */
+    components?: ShioBlockComponents;
+    /**
+     * The rendered HTML the CDA delivers beside the blocks (`post.rendered?.BODY`), used for a
+     * block type this build has no component for.
+     */
+    fallbackHtml?: Record<string, string> | string | null;
+}
+/**
+ * SH1016 — a blocks body rendered with your own components.
+ *
+ * <p>The CDA delivers a body twice: as an array of typed blocks and as HTML. This maps the first
+ * onto components you own, which is the whole reason the body stopped being a string.</p>
+ *
+ * <h2>The fallback is per block, not per document</h2>
+ *
+ * <p>A page with one block type you have no component for should render the seven it knows. Falling
+ * back for the whole document would make adding a block type to the model blank a page that was
+ * working — which is the failure a fallback exists to prevent, arriving by the fallback.</p>
+ *
+ * <p>An unhandled block renders a readable default rather than nothing: a heading is a heading, a
+ * list is a list. Rendering nothing is how content goes missing silently, and "I did not write a
+ * component for `embed`" should not mean "the embed is gone".</p>
+ */
+export declare function ShioBlocks({ blocks, components, fallbackHtml }: ShioBlocksProps): import("react").JSX.Element | null;

package/dist/hooks/use-shio-post.d.ts

@@ -1,8 +1,18 @@
-import type { ShioPost } from "@viglet/shio-client";
-/** Get a published post by id (attributes expanded). `null` when not found. */
-export declare function useShioPost(postId: string | undefined): import("./use-async").ShioAsyncState<ShioPost | null>;
+import type { ShioContentState, ShioPost } from "@viglet/shio-client";
+/**
+ * Get a published post by id (attributes expanded). `null` when not found.
+ *
+ * SH1081 — `state` asks for another version (`"draft"`, `"rev:<n>"`), which needs a preview token.
+ */
+export declare function useShioPost(postId: string | undefined, state?: ShioContentState): import("./use-async").ShioAsyncState<ShioPost | null>;
 /**
  * Resolve a published post by site + friendly URL — the client-side analog of
  * the catch-all route. `null` when unresolved.
+ *
+ * SH1081 — `options.locale` pins a translation and `options.state` asks for another version, as
+ * the client's `getPostByUrl` takes them.
  */
-export declare function useShioPostByUrl(siteId: string | undefined, url: string | undefined): import("./use-async").ShioAsyncState<ShioPost | null>;
+export declare function useShioPostByUrl(siteId: string | undefined, url: string | undefined, options?: {
+    locale?: string;
+    state?: ShioContentState;
+}): import("./use-async").ShioAsyncState<ShioPost | null>;

package/dist/hooks/use-shio-query.d.ts

@@ -1,3 +1,10 @@
 import type { ShioListing, ShioQueryParams } from "@viglet/shio-client";
-/** Query published posts by site / folder / post type (always returns a listing). */
-export declare function useShioQuery(params?: ShioQueryParams): import("./use-async").ShioAsyncState<ShioListing>;
+/**
+ * Query published posts by site / folder / post type (always returns a listing).
+ *
+ * Pass `enabled: false` to defer the request until its inputs are ready — e.g.
+ * while a `siteId` is still being resolved from {@link useShioSites}. While
+ * disabled the hook stays idle (`loading: false`, `data: undefined`) and never
+ * fires a request with half-resolved params.
+ */
+export declare function useShioQuery(params?: ShioQueryParams, enabled?: boolean): import("./use-async").ShioAsyncState<ShioListing>;

package/dist/index.d.ts

@@ -9,6 +9,8 @@ export { useShioBreadcrumb } from "./hooks/use-shio-breadcrumb";
 export { useShioPost, useShioPostByUrl } from "./hooks/use-shio-post";
 export { useShioQuery } from "./hooks/use-shio-query";
 export { ShioRichText } from "./components/shio-rich-text";
+export { ShioBlocks } from "./components/shio-blocks";
+export type { ShioBlocksProps, ShioBlockComponent, ShioBlockComponents } from "./components/shio-blocks";
 export type { ShioRichTextProps } from "./components/shio-rich-text";
 export { ShioImage } from "./components/shio-image";
 export type { ShioImageProps } from "./components/shio-image";
@@ -16,4 +18,4 @@ export { ShioRelator } from "./components/shio-relator";
 export type { ShioRelatorProps } from "./components/shio-relator";
 export { ShioField } from "./components/shio-field";
 export type { ShioFieldProps, ShioFieldKind } from "./components/shio-field";
-export type { ShioClientConfig, ShioRequestOptions, ShioSite, ShioFolder, ShioPostSummary, ShioPost, ShioListing, ShioPath, ShioQueryParams, ShioPageParams, } from "@viglet/shio-client";
+export type { ShioClientConfig, ShioRequestOptions, ShioSite, ShioSiteLocales, ShioFolder, ShioPostSummary, ShioPost, ShioListing, ShioPath, ShioQueryParams, ShioPageParams, } from "@viglet/shio-client";

package/dist/shio-react-sdk.js

@@ -1,154 +1,209 @@
-import { jsx as u, Fragment as s } from "react/jsx-runtime";
-import { createContext as S, useMemo as d, useContext as g, useState as y, useEffect as C, Fragment as A } from "react";
-import { ShioClient as b } from "@viglet/shio-client";
-import { ShioClient as q, ShioHttpError as G, createShioClient as Q } from "@viglet/shio-client";
-const f = S(null);
-function R(t) {
-  const { children: n } = t, i = "client" in t ? t.client : void 0, e = i ? void 0 : t, o = d(
-    () => i ?? new b(e),
-    // Rebuild only when a meaningful connection field changes.
-    [i, e == null ? void 0 : e.baseUrl, e == null ? void 0 : e.apiToken, e == null ? void 0 : e.fetch, e == null ? void 0 : e.credentials]
-  );
-  return /* @__PURE__ */ u(f.Provider, { value: o, children: n });
-}
-function c() {
-  const t = g(f);
-  if (!t)
-    throw new Error("useShioClient must be used within a <ShioProvider>");
-  return t;
-}
-function h(t, n, i = !0) {
-  const [e, o] = y({
-    data: void 0,
-    loading: i,
-    error: null
-  });
-  return C(() => {
-    if (!i) {
-      o({ data: void 0, loading: !1, error: null });
-      return;
-    }
-    const r = new AbortController();
-    return o((l) => ({ ...l, loading: !0, error: null })), t(r.signal).then((l) => {
-      r.signal.aborted || o({ data: l, loading: !1, error: null });
-    }).catch((l) => {
-      r.signal.aborted || o({
-        data: void 0,
-        loading: !1,
-        error: l instanceof Error ? l : new Error(String(l))
-      });
-    }), () => r.abort();
-  }, n), e;
-}
-function _() {
-  const t = c();
-  return h((n) => t.getSites({ signal: n }), [t]);
-}
-function z(t) {
-  const n = c();
-  return h(
-    (i) => n.getSite(t, { signal: i }),
-    [n, t],
-    !!t
-  );
-}
-function B(t, n) {
-  const i = c();
-  return h(
-    (e) => i.listChildren(t, n, { signal: e }),
-    [i, t, n == null ? void 0 : n.page, n == null ? void 0 : n.size],
-    !!t
-  );
-}
-function F(t) {
-  const n = c();
-  return h(
-    (i) => n.getPath(t, { signal: i }),
-    [n, t],
-    !!t
-  );
-}
-function H(t) {
-  const n = c();
-  return h(
-    (i) => n.getPost(t, { signal: i }),
-    [n, t],
-    !!t
-  );
-}
-function k(t, n) {
-  const i = c();
-  return h(
-    (e) => i.getPostByUrl(t, n, { signal: e }),
-    [i, t, n],
-    !!t && !!n
-  );
-}
-function v(t) {
-  const n = c();
-  return h(
-    (i) => n.query(t, { signal: i }),
-    [
-      n,
-      t == null ? void 0 : t.siteId,
-      t == null ? void 0 : t.folderId,
-      t == null ? void 0 : t.postType,
-      t == null ? void 0 : t.page,
-      t == null ? void 0 : t.size
-    ]
-  );
-}
-function w({ html: t, ...n }) {
-  return t ? /* @__PURE__ */ u("div", { ...n, dangerouslySetInnerHTML: { __html: t } }) : null;
-}
-function x({ src: t, baseUrl: n, alt: i = "", ...e }) {
-  if (!t) return null;
-  const r = /^(https?:)?\/\//.test(t) || t.startsWith("data:") || !n ? t : `${n.replace(/\/+$/, "")}/${t.replace(/^\/+/, "")}`;
-  return /* @__PURE__ */ u("img", { src: r, alt: i, ...e });
-}
-function J({
-  items: t,
-  children: n,
-  keyFor: i
-}) {
-  const e = Array.isArray(t) ? t : [];
-  return /* @__PURE__ */ u(s, { children: e.map((o, r) => /* @__PURE__ */ u(A, { children: n(o, r) }, i ? i(o, r) : r)) });
-}
-const E = /<[a-z][\s\S]*>/i, P = /\.(png|jpe?g|gif|webp|svg|avif)$/i;
-function T(t) {
-  return typeof t == "string" ? E.test(t) ? "html" : P.test(t.trim()) ? "image" : "text" : Array.isArray(t) ? "list" : t !== null && typeof t == "object" ? "json" : "text";
-}
-function L({ value: t, as: n, baseUrl: i, className: e }) {
-  if (t == null || t === "") return null;
-  switch (n ?? T(t)) {
-    case "html":
-      return /* @__PURE__ */ u(w, { className: e, html: String(t) });
-    case "image":
-      return /* @__PURE__ */ u(x, { className: e, src: String(t), baseUrl: i });
-    case "list":
-      return /* @__PURE__ */ u("ul", { className: e, children: t.map((r, l) => /* @__PURE__ */ u("li", { children: typeof r == "object" ? JSON.stringify(r) : String(r) }, l)) });
-    case "json":
-      return /* @__PURE__ */ u("pre", { className: e, children: JSON.stringify(t, null, 2) });
-    case "text":
-    default:
-      return /* @__PURE__ */ u("span", { className: e, children: String(t) });
-  }
-}
-export {
-  q as ShioClient,
-  L as ShioField,
-  G as ShioHttpError,
-  x as ShioImage,
-  R as ShioProvider,
-  J as ShioRelator,
-  w as ShioRichText,
-  Q as createShioClient,
-  F as useShioBreadcrumb,
-  B as useShioChildren,
-  c as useShioClient,
-  H as useShioPost,
-  k as useShioPostByUrl,
-  v as useShioQuery,
-  z as useShioSite,
-  _ as useShioSites
-};
+import { Fragment as e, createContext as t, useContext as n, useEffect as r, useMemo as i, useState as a } from "react";
+import { ShioClient as o, ShioClient as s, ShioHttpError as c, createShioClient as l } from "@viglet/shio-client";
+import { Fragment as u, jsx as d } from "react/jsx-runtime";
+// src/provider.tsx
+var f = t(null);
+function p(e) {
+	let { children: t } = e, n = "client" in e ? e.client : void 0, r = n ? void 0 : e, a = i(() => n ?? new s(r), [
+		n,
+		r?.baseUrl,
+		r?.apiToken,
+		r?.fetch,
+		r?.credentials
+	]);
+	return /* @__PURE__ */ d(f.Provider, {
+		value: a,
+		children: t
+	});
+}
+function m() {
+	let e = n(f);
+	if (!e) throw Error("useShioClient must be used within a <ShioProvider>");
+	return e;
+}
+// src/hooks/use-async.ts
+function h(e, t, n = !0) {
+	let [i, o] = a({
+		data: void 0,
+		loading: n,
+		error: null
+	});
+	return r(() => {
+		if (!n) {
+			o({
+				data: void 0,
+				loading: !1,
+				error: null
+			});
+			return;
+		}
+		let t = new AbortController();
+		return o((e) => ({
+			...e,
+			loading: !0,
+			error: null
+		})), e(t.signal).then((e) => {
+			t.signal.aborted || o({
+				data: e,
+				loading: !1,
+				error: null
+			});
+		}).catch((e) => {
+			t.signal.aborted || o({
+				data: void 0,
+				loading: !1,
+				error: e instanceof Error ? e : Error(String(e))
+			});
+		}), () => t.abort();
+	}, t), i;
+}
+// src/hooks/use-shio-sites.ts
+function g() {
+	let e = m();
+	return h((t) => e.getSites({ signal: t }), [e]);
+}
+function _(e) {
+	let t = m();
+	return h((n) => t.getSite(e, { signal: n }), [t, e], !!e);
+}
+// src/hooks/use-shio-children.ts
+function v(e, t) {
+	let n = m();
+	return h((r) => n.listChildren(e, t, { signal: r }), [
+		n,
+		e,
+		t?.page,
+		t?.size,
+		t?.locale,
+		t?.state
+	], !!e);
+}
+// src/hooks/use-shio-breadcrumb.ts
+function y(e) {
+	let t = m();
+	return h((n) => t.getPath(e, { signal: n }), [t, e], !!e);
+}
+// src/hooks/use-shio-post.ts
+function b(e, t) {
+	let n = m();
+	return h((r) => n.getPost(e, {
+		signal: r,
+		state: t
+	}), [
+		n,
+		e,
+		t
+	], !!e);
+}
+function x(e, t, n) {
+	let r = m(), i = n?.locale, a = n?.state;
+	return h((n) => i ? r.getPostByUrl(e, t, i, {
+		signal: n,
+		state: a
+	}) : r.getPostByUrl(e, t, {
+		signal: n,
+		state: a
+	}), [
+		r,
+		e,
+		t,
+		i,
+		a
+	], !!e && !!t);
+}
+// src/hooks/use-shio-query.ts
+function S(e, t = !0) {
+	let n = m();
+	return h((t) => n.query(e, { signal: t }), [
+		n,
+		e?.siteId,
+		e?.folderId,
+		e?.postType,
+		e?.page,
+		e?.size,
+		e?.locale,
+		e?.state
+	], t);
+}
+// src/components/shio-rich-text.tsx
+function C({ html: e, ...t }) {
+	return e ? /* @__PURE__ */ d("div", {
+		...t,
+		dangerouslySetInnerHTML: { __html: e }
+	}) : null;
+}
+// src/components/shio-blocks.tsx
+function w({ blocks: e, components: t, fallbackHtml: n }) {
+	return e?.length ? /* @__PURE__ */ d(u, { children: e.map((e) => {
+		let r = t?.[e.type];
+		return /* @__PURE__ */ d("div", { children: r ? /* @__PURE__ */ d(r, { block: e }) : T(e, n) }, e.key);
+	}) }) : null;
+}
+function T(e, t) {
+	switch (e.type) {
+		case "heading": {
+			let t = `h${Math.min(6, Math.max(1, e.level ?? 2))}`;
+			return /* @__PURE__ */ d(t, { children: e.text });
+		}
+		case "paragraph": return /* @__PURE__ */ d("p", { children: e.text });
+		case "quote": return /* @__PURE__ */ d("blockquote", { children: e.text });
+		case "code": return /* @__PURE__ */ d("pre", { children: /* @__PURE__ */ d("code", { children: e.text }) });
+		case "list": return e.ordered ? /* @__PURE__ */ d("ol", { children: (e.items ?? []).map(E) }) : /* @__PURE__ */ d("ul", { children: (e.items ?? []).map(E) });
+		case "image": return /* @__PURE__ */ d("img", {
+			src: e.src,
+			alt: e.alt ?? ""
+		});
+		case "embed":
+		case "reference": return null;
+		default: return typeof t == "string" && t ? /* @__PURE__ */ d("div", { dangerouslySetInnerHTML: { __html: t } }) : null;
+	}
+}
+function E(e, t) {
+	return /* @__PURE__ */ d("li", { children: e }, `${t}-${e}`);
+}
+// src/components/shio-image.tsx
+function D({ src: e, baseUrl: t, alt: n = "", ...r }) {
+	if (!e) return null;
+	let i = /^(https?:)?\/\//.test(e) || e.startsWith("data:") || !t ? e : `${t.replace(/\/+$/, "")}/${e.replace(/^\/+/, "")}`;
+	return /* @__PURE__ */ d("img", {
+		src: i,
+		alt: n,
+		...r
+	});
+}
+// src/components/shio-relator.tsx
+function O({ items: t, children: n, keyFor: r }) {
+	return /* @__PURE__ */ d(u, { children: (Array.isArray(t) ? t : []).map((t, i) => /* @__PURE__ */ d(e, { children: n(t, i) }, r ? r(t, i) : i)) });
+}
+// src/components/shio-field.tsx
+var k = /<[a-z][\s\S]*>/i, A = /\.(png|jpe?g|gif|webp|svg|avif)$/i;
+function j(e) {
+	return typeof e == "string" ? k.test(e) ? "html" : A.test(e.trim()) ? "image" : "text" : Array.isArray(e) ? "list" : typeof e == "object" && e ? "json" : "text";
+}
+function M({ value: e, as: t, baseUrl: n, className: r }) {
+	if (e == null || e === "") return null;
+	switch (t ?? j(e)) {
+		case "html": return /* @__PURE__ */ d(C, {
+			className: r,
+			html: String(e)
+		});
+		case "image": return /* @__PURE__ */ d(D, {
+			className: r,
+			src: String(e),
+			baseUrl: n
+		});
+		case "list": return /* @__PURE__ */ d("ul", {
+			className: r,
+			children: e.map((e, t) => /* @__PURE__ */ d("li", { children: typeof e == "object" ? JSON.stringify(e) : String(e) }, t))
+		});
+		case "json": return /* @__PURE__ */ d("pre", {
+			className: r,
+			children: JSON.stringify(e, null, 2)
+		});
+		default: return /* @__PURE__ */ d("span", {
+			className: r,
+			children: String(e)
+		});
+	}
+}
+export { w as ShioBlocks, o as ShioClient, M as ShioField, c as ShioHttpError, D as ShioImage, p as ShioProvider, O as ShioRelator, C as ShioRichText, l as createShioClient, y as useShioBreadcrumb, v as useShioChildren, m as useShioClient, b as useShioPost, x as useShioPostByUrl, S as useShioQuery, _ as useShioSite, g as useShioSites };

package/dist/shio-react-sdk.umd.cjs

@@ -1 +1 @@
-(function(r,o){typeof exports=="object"&&typeof module<"u"?o(exports,require("react/jsx-runtime"),require("react"),require("@viglet/shio-client")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react","@viglet/shio-client"],o):(r=typeof globalThis<"u"?globalThis:r||self,o(r.ShioReactSdk={},r.jsxRuntime,r.React,r.ShioClient))})(this,(function(r,o,f,d){"use strict";const s=f.createContext(null);function b(e){const{children:t}=e,i="client"in e?e.client:void 0,n=i?void 0:e,c=f.useMemo(()=>i??new d.ShioClient(n),[i,n==null?void 0:n.baseUrl,n==null?void 0:n.apiToken,n==null?void 0:n.fetch,n==null?void 0:n.credentials]);return o.jsx(s.Provider,{value:c,children:t})}function h(){const e=f.useContext(s);if(!e)throw new Error("useShioClient must be used within a <ShioProvider>");return e}function S(e,t,i=!0){const[n,c]=f.useState({data:void 0,loading:i,error:null});return f.useEffect(()=>{if(!i){c({data:void 0,loading:!1,error:null});return}const u=new AbortController;return c(l=>({...l,loading:!0,error:null})),e(u.signal).then(l=>{u.signal.aborted||c({data:l,loading:!1,error:null})}).catch(l=>{u.signal.aborted||c({data:void 0,loading:!1,error:l instanceof Error?l:new Error(String(l))})}),()=>u.abort()},t),n}function P(){const e=h();return S(t=>e.getSites({signal:t}),[e])}function C(e){const t=h();return S(i=>t.getSite(e,{signal:i}),[t,e],!!e)}function j(e,t){const i=h();return S(n=>i.listChildren(e,t,{signal:n}),[i,e,t==null?void 0:t.page,t==null?void 0:t.size],!!e)}function A(e){const t=h();return S(i=>t.getPath(e,{signal:i}),[t,e],!!e)}function E(e){const t=h();return S(i=>t.getPost(e,{signal:i}),[t,e],!!e)}function T(e,t){const i=h();return S(n=>i.getPostByUrl(e,t,{signal:n}),[i,e,t],!!e&&!!t)}function w(e){const t=h();return S(i=>t.query(e,{signal:i}),[t,e==null?void 0:e.siteId,e==null?void 0:e.folderId,e==null?void 0:e.postType,e==null?void 0:e.page,e==null?void 0:e.size])}function g({html:e,...t}){return e?o.jsx("div",{...t,dangerouslySetInnerHTML:{__html:e}}):null}function y({src:e,baseUrl:t,alt:i="",...n}){if(!e)return null;const u=/^(https?:)?\/\//.test(e)||e.startsWith("data:")||!t?e:`${t.replace(/\/+$/,"")}/${e.replace(/^\/+/,"")}`;return o.jsx("img",{src:u,alt:i,...n})}function v({items:e,children:t,keyFor:i}){const n=Array.isArray(e)?e:[];return o.jsx(o.Fragment,{children:n.map((c,u)=>o.jsx(f.Fragment,{children:t(c,u)},i?i(c,u):u))})}const O=/<[a-z][\s\S]*>/i,B=/\.(png|jpe?g|gif|webp|svg|avif)$/i;function M(e){return typeof e=="string"?O.test(e)?"html":B.test(e.trim())?"image":"text":Array.isArray(e)?"list":e!==null&&typeof e=="object"?"json":"text"}function q({value:e,as:t,baseUrl:i,className:n}){if(e==null||e==="")return null;switch(t??M(e)){case"html":return o.jsx(g,{className:n,html:String(e)});case"image":return o.jsx(y,{className:n,src:String(e),baseUrl:i});case"list":return o.jsx("ul",{className:n,children:e.map((u,l)=>o.jsx("li",{children:typeof u=="object"?JSON.stringify(u):String(u)},l))});case"json":return o.jsx("pre",{className:n,children:JSON.stringify(e,null,2)});case"text":default:return o.jsx("span",{className:n,children:String(e)})}}Object.defineProperty(r,"ShioClient",{enumerable:!0,get:()=>d.ShioClient}),Object.defineProperty(r,"ShioHttpError",{enumerable:!0,get:()=>d.ShioHttpError}),Object.defineProperty(r,"createShioClient",{enumerable:!0,get:()=>d.createShioClient}),r.ShioField=q,r.ShioImage=y,r.ShioProvider=b,r.ShioRelator=v,r.ShioRichText=g,r.useShioBreadcrumb=A,r.useShioChildren=j,r.useShioClient=h,r.useShioPost=E,r.useShioPostByUrl=T,r.useShioQuery=w,r.useShioSite=C,r.useShioSites=P,Object.defineProperty(r,Symbol.toStringTag,{value:"Module"})}));
+(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("react"),require("@viglet/shio-client"),require("react/jsx-runtime")):typeof define==`function`&&define.amd?define([`exports`,`react`,`@viglet/shio-client`,`react/jsx-runtime`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.ShioReactSdk={},e.React,e.ShioClient,e.jsxRuntime))})(this,function(e,t,n,r){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var i=(0,t.createContext)(null);function a(e){let{children:a}=e,o=`client`in e?e.client:void 0,s=o?void 0:e,c=(0,t.useMemo)(()=>o??new n.ShioClient(s),[o,s?.baseUrl,s?.apiToken,s?.fetch,s?.credentials]);return(0,r.jsx)(i.Provider,{value:c,children:a})}function o(){let e=(0,t.useContext)(i);if(!e)throw Error(`useShioClient must be used within a <ShioProvider>`);return e}function s(e,n,r=!0){let[i,a]=(0,t.useState)({data:void 0,loading:r,error:null});return(0,t.useEffect)(()=>{if(!r){a({data:void 0,loading:!1,error:null});return}let t=new AbortController;return a(e=>({...e,loading:!0,error:null})),e(t.signal).then(e=>{t.signal.aborted||a({data:e,loading:!1,error:null})}).catch(e=>{t.signal.aborted||a({data:void 0,loading:!1,error:e instanceof Error?e:Error(String(e))})}),()=>t.abort()},n),i}function c(){let e=o();return s(t=>e.getSites({signal:t}),[e])}function l(e){let t=o();return s(n=>t.getSite(e,{signal:n}),[t,e],!!e)}function u(e,t){let n=o();return s(r=>n.listChildren(e,t,{signal:r}),[n,e,t?.page,t?.size,t?.locale,t?.state],!!e)}function d(e){let t=o();return s(n=>t.getPath(e,{signal:n}),[t,e],!!e)}function f(e,t){let n=o();return s(r=>n.getPost(e,{signal:r,state:t}),[n,e,t],!!e)}function p(e,t,n){let r=o(),i=n?.locale,a=n?.state;return s(n=>i?r.getPostByUrl(e,t,i,{signal:n,state:a}):r.getPostByUrl(e,t,{signal:n,state:a}),[r,e,t,i,a],!!e&&!!t)}function m(e,t=!0){let n=o();return s(t=>n.query(e,{signal:t}),[n,e?.siteId,e?.folderId,e?.postType,e?.page,e?.size,e?.locale,e?.state],t)}function h({html:e,...t}){return e?(0,r.jsx)(`div`,{...t,dangerouslySetInnerHTML:{__html:e}}):null}function g({blocks:e,components:t,fallbackHtml:n}){return e?.length?(0,r.jsx)(r.Fragment,{children:e.map(e=>{let i=t?.[e.type];return(0,r.jsx)(`div`,{children:i?(0,r.jsx)(i,{block:e}):_(e,n)},e.key)})}):null}function _(e,t){switch(e.type){case`heading`:{let t=`h${Math.min(6,Math.max(1,e.level??2))}`;return(0,r.jsx)(t,{children:e.text})}case`paragraph`:return(0,r.jsx)(`p`,{children:e.text});case`quote`:return(0,r.jsx)(`blockquote`,{children:e.text});case`code`:return(0,r.jsx)(`pre`,{children:(0,r.jsx)(`code`,{children:e.text})});case`list`:return e.ordered?(0,r.jsx)(`ol`,{children:(e.items??[]).map(v)}):(0,r.jsx)(`ul`,{children:(e.items??[]).map(v)});case`image`:return(0,r.jsx)(`img`,{src:e.src,alt:e.alt??``});case`embed`:case`reference`:return null;default:return typeof t==`string`&&t?(0,r.jsx)(`div`,{dangerouslySetInnerHTML:{__html:t}}):null}}function v(e,t){return(0,r.jsx)(`li`,{children:e},`${t}-${e}`)}function y({src:e,baseUrl:t,alt:n=``,...i}){if(!e)return null;let a=/^(https?:)?\/\//.test(e)||e.startsWith(`data:`)||!t?e:`${t.replace(/\/+$/,``)}/${e.replace(/^\/+/,``)}`;return(0,r.jsx)(`img`,{src:a,alt:n,...i})}function b({items:e,children:n,keyFor:i}){return(0,r.jsx)(r.Fragment,{children:(Array.isArray(e)?e:[]).map((e,a)=>(0,r.jsx)(t.Fragment,{children:n(e,a)},i?i(e,a):a))})}var x=/<[a-z][\s\S]*>/i,S=/\.(png|jpe?g|gif|webp|svg|avif)$/i;function C(e){return typeof e==`string`?x.test(e)?`html`:S.test(e.trim())?`image`:`text`:Array.isArray(e)?`list`:typeof e==`object`&&e?`json`:`text`}function w({value:e,as:t,baseUrl:n,className:i}){if(e==null||e===``)return null;switch(t??C(e)){case`html`:return(0,r.jsx)(h,{className:i,html:String(e)});case`image`:return(0,r.jsx)(y,{className:i,src:String(e),baseUrl:n});case`list`:return(0,r.jsx)(`ul`,{className:i,children:e.map((e,t)=>(0,r.jsx)(`li`,{children:typeof e==`object`?JSON.stringify(e):String(e)},t))});case`json`:return(0,r.jsx)(`pre`,{className:i,children:JSON.stringify(e,null,2)});default:return(0,r.jsx)(`span`,{className:i,children:String(e)})}}e.ShioBlocks=g,Object.defineProperty(e,"ShioClient",{enumerable:!0,get:function(){return n.ShioClient}}),e.ShioField=w,Object.defineProperty(e,"ShioHttpError",{enumerable:!0,get:function(){return n.ShioHttpError}}),e.ShioImage=y,e.ShioProvider=a,e.ShioRelator=b,e.ShioRichText=h,Object.defineProperty(e,"createShioClient",{enumerable:!0,get:function(){return n.createShioClient}}),e.useShioBreadcrumb=d,e.useShioChildren=u,e.useShioClient=o,e.useShioPost=f,e.useShioPostByUrl=p,e.useShioQuery=m,e.useShioSite=l,e.useShioSites=c});

package/dist/types.d.ts

@@ -3,4 +3,4 @@
  * re-exported here for convenience, so React consumers can import them from a
  * single package.
  */
-export type { ShioClientConfig, ShioRequestOptions, ShioSite, ShioFolder, ShioPostSummary, ShioPost, ShioListing, ShioPath, ShioQueryParams, ShioPageParams, } from "@viglet/shio-client";
+export type { ShioClientConfig, ShioRequestOptions, ShioSite, ShioSiteLocales, ShioFolder, ShioPostSummary, ShioPost, ShioListing, ShioPath, ShioQueryParams, ShioPageParams, } from "@viglet/shio-client";

package/package.json

@@ -1,7 +1,16 @@
 {
   "name": "@viglet/shio-react-sdk",
-  "version": "2026.2.1",
-  "description": "React SDK for consuming Shio CMS content via the Content Delivery API (CDA). Hooks + render components built on @viglet/shio-client.",
+  "version": "2026.3.3",
+  "description": "React SDK for consuming Viglet Shio content via the Content Delivery API (CDA). Hooks + render components built on @viglet/shio-client.",
+  "homepage": "https://openviglet.github.io/shio/",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/openviglet/shio.git",
+    "directory": "shio-react-sdk"
+  },
+  "bugs": {
+    "url": "https://github.com/openviglet/shio/issues"
+  },
   "type": "module",
   "main": "dist/shio-react-sdk.umd.cjs",
   "module": "dist/shio-react-sdk.js",
@@ -17,27 +26,41 @@
     "dist"
   ],
   "dependencies": {
-    "@viglet/shio-client": "2026.2.1"
+    "@viglet/shio-client": "2026.3.3"
   },
   "peerDependencies": {
     "react": ">=18.0.0"
   },
   "devDependencies": {
-    "@types/react": "^19.1.2",
-    "react": "^19.1.0",
+    "@types/react": "^19.3.0",
+    "react": "^19.3.1",
     "typescript": "^5.8.3",
-    "vite": "^6.3.1"
+    "vite": "^8.3.5"
   },
   "keywords": [
     "shio",
+    "viglet",
     "cms",
-    "headless",
+    "headless-cms",
+    "content-management-system",
+    "agent",
+    "ai",
+    "mcp",
+    "model-context-protocol",
+    "claude-code",
     "react",
     "sdk",
-    "cda"
+    "cda",
+    "hooks",
+    "nextjs",
+    "typescript",
+    "headless"
   ],
-  "author": "Viglet Team",
-  "license": "GPL-3.0",
+  "author": {
+    "name": "Viglet Team",
+    "url": "https://www.viglet.org"
+  },
+  "license": "Apache-2.0",
   "scripts": {
     "dev": "vite build --watch",
     "build": "vite build && tsc --emitDeclarationOnly",