@yadeck/slide-components-basic 0.0.0-stage → 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 onfi
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,17 @@
-# Temporary Holding Version
+# @yadeck/slide-components-basic
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+標準の Layout 一式(basic プラグイン)。表紙、章扉、自動レイアウト、2 列、カード、コード、画像、流れの図など。
+
+YADECK は、AI が schema 付きの YAML に内容を書き、作り込みたいページだけを JSX で作るスライドジェネレータです。
+
+```ts
+import basic from "@yadeck/slide-components-basic";
+export default defineConfig({ plugins: [basic] });
+```
+
+- ドキュメント: https://onfi.github.io/yadeck/
+- リポジトリ: https://github.com/onfi/yadeck
+
+## License
+
+MIT

package/dist/chrome.d.ts

@@ -0,0 +1,8 @@
+import { type BlockNode } from "@yadeck/slide-core";
+/** スライド枠いっぱいに広げる共通のパディング付きコンテナ */
+export declare const PAGE = "absolute inset-0 flex flex-col gap-6 px-20 py-14";
+export declare const SlideHeading: ({ block, description }: {
+    block: BlockNode;
+    description?: string;
+}) => import("react").JSX.Element;
+//# sourceMappingURL=chrome.d.ts.map

package/dist/chrome.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chrome.d.ts","sourceRoot":"","sources":["../src/chrome.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAmB,KAAK,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAErE,kCAAkC;AAClC,eAAO,MAAM,IAAI,qDAAqD,CAAC;AAavE,eAAO,MAAM,YAAY,GAAI,wBAAwB;IAAE,KAAK,EAAE,SAAS,CAAC;IAAC,WAAW,CAAC,EAAE,MAAM,CAAA;CAAE,gCAY9F,CAAC"}

package/dist/chrome.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Block, RichText } from "@yadeck/slide-core";
+/** スライド枠いっぱいに広げる共通のパディング付きコンテナ */
+export const PAGE = "absolute inset-0 flex flex-col gap-6 px-20 py-14";
+/**
+ * スライド上部の見出し。accent の縦バーと primary の細い下線で、表紙と同じ文法にする。
+ * slide の description があれば見出しの下に 1 行添える
+ */
+/** 見出しの表示幅(全角 2、半角 1)。長い見出しは 1 段小さくして 1 行に収める */
+function headingWidth(text) {
+    let w = 0;
+    for (const ch of text.replace(/[`*_]/g, ""))
+        w += (ch.codePointAt(0) ?? 0) > 0x2e7f ? 2 : 1;
+    return w;
+}
+export const SlideHeading = ({ block, description }) => (_jsxs("header", { className: "flex flex-col gap-2", children: [_jsxs("div", { className: `flex items-center gap-4 border-b-2 border-primary/30 pb-3 ${headingWidth(block.text ?? "") > 44 ? "[&_.b-heading]:text-h3" : "[&_.b-heading]:text-h2"}`, children: [_jsx("span", { className: "h-10 w-2 shrink-0 rounded-sm bg-accent" }), _jsx(Block, { data: block })] }), description && _jsx(RichText, { as: "p", className: "m-0 pl-6 text-small leading-snug text-muted", text: description })] }));
+//# sourceMappingURL=chrome.js.map

package/dist/chrome.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chrome.js","sourceRoot":"","sources":["../src/chrome.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAkB,MAAM,oBAAoB,CAAC;AAErE,kCAAkC;AAClC,MAAM,CAAC,MAAM,IAAI,GAAG,kDAAkD,CAAC;AAEvE;;;GAGG;AACH,iDAAiD;AACjD,SAAS,YAAY,CAAC,IAAY;IAChC,IAAI,CAAC,GAAG,CAAC,CAAC;IACV,KAAK,MAAM,EAAE,IAAI,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE,EAAE,CAAC;QAAE,CAAC,IAAI,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,GAAG,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAC5F,OAAO,CAAC,CAAC;AACX,CAAC;AAED,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,EAAE,KAAK,EAAE,WAAW,EAA8C,EAAE,EAAE,CAAC,CAClG,kBAAQ,SAAS,EAAC,qBAAqB,aACrC,eACE,SAAS,EAAE,6DACT,YAAY,CAAC,KAAK,CAAC,IAAI,IAAI,EAAE,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,wBAAwB,CAAC,CAAC,CAAC,wBACnE,EAAE,aAEF,eAAM,SAAS,EAAC,wCAAwC,GAAG,EAC3D,KAAC,KAAK,IAAC,IAAI,EAAE,KAAK,GAAI,IAClB,EACL,WAAW,IAAI,KAAC,QAAQ,IAAC,EAAE,EAAC,GAAG,EAAC,SAAS,EAAC,6CAA6C,EAAC,IAAI,EAAE,WAAW,GAAI,IACvG,CACV,CAAC"}

package/dist/flow.d.ts

@@ -0,0 +1,26 @@
+import { z } from "zod";
+import { type BlockOf } from "@yadeck/slide-core";
+export declare const flowType: z.ZodObject<{
+    steps: z.ZodArray<z.ZodObject<{
+        label: z.ZodString;
+        via: z.ZodOptional<z.ZodString>;
+        phase: z.ZodOptional<z.ZodString>;
+        detail: z.ZodOptional<z.ZodString>;
+    }, z.core.$strip>>;
+    focus: z.ZodOptional<z.ZodUnion<readonly [z.ZodNumber, z.ZodArray<z.ZodNumber>]>>;
+    direction: z.ZodOptional<z.ZodEnum<{
+        row: "row";
+        column: "column";
+    }>>;
+}, z.core.$strip>;
+type FlowProps = BlockOf<typeof flowType>;
+/** `flow`: 縦は 1 カラム構成(STEP ピル + レール + 点線)、横(direction: row)はポップ(吹き出し番号 + 枠カード + ›) */
+export declare const FlowBlock: (block: FlowProps) => import("react").JSX.Element;
+/** `flow boxed`: 枠線を使ったデザイン。角丸の枠を縦に積み、点線と ▽ でつなぐ */
+export declare const FlowBoxed: (block: FlowProps) => import("react").JSX.Element;
+/** `flow framed`: スタイリッシュ。全体を 1 つの枠で囲み、区切り線に ▽ の切り込み */
+export declare const FlowFramed: (block: FlowProps) => import("react").JSX.Element;
+/** `flow grid`: 2 カラム構成。右端が矢印の枠を 2 列に */
+export declare const FlowGrid: (block: FlowProps) => import("react").JSX.Element;
+export {};
+//# sourceMappingURL=flow.d.ts.map

package/dist/flow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"flow.d.ts","sourceRoot":"","sources":["../src/flow.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AACxB,OAAO,EAAY,KAAK,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAE5D,eAAO,MAAM,QAAQ;;;;;;;;;;;;iBAoBnB,CAAC;AAEH,KAAK,SAAS,GAAG,OAAO,CAAC,OAAO,QAAQ,CAAC,CAAC;AAoD1C,sFAAsF;AACtF,eAAO,MAAM,SAAS,GAAI,OAAO,SAAS,gCACyG,CAAC;AAEpJ,oDAAoD;AACpD,eAAO,MAAM,SAAS,GAAI,OAAO,SAAS,gCAA+D,CAAC;AAE1G,wDAAwD;AACxD,eAAO,MAAM,UAAU,GAAI,OAAO,SAAS,gCAAgE,CAAC;AAE5G,yCAAyC;AACzC,eAAO,MAAM,QAAQ,GAAI,OAAO,SAAS,gCAA8D,CAAC"}

package/dist/flow.js

@@ -0,0 +1,46 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { z } from "zod";
+import { RichText } from "@yadeck/slide-core";
+export const flowType = z.object({
+    steps: z
+        .array(z.object({
+        label: z.string().describe("段の名前。見出しとして出す"),
+        via: z.string().optional().describe("この段に入ってくる矢印のラベル(変換や処理の名前)"),
+        phase: z.string().optional().describe("この段が属する段階の名前。見出しの横に小さく出す"),
+        detail: z.string().optional().describe("この段で起きることの一言。説明として出す"),
+    }))
+        .min(2)
+        .describe("流れの各段。順番どおり"),
+    focus: z
+        .union([z.number().int().min(1), z.array(z.number().int().min(1))])
+        .optional()
+        .describe("焦点にする段の番号(1 始まり)。配列で複数可。他の段は薄くなる"),
+    direction: z
+        .enum(["row", "column"])
+        .optional()
+        .describe("row: 左から右、column: 上から下(既定)。見せ方の種類は block の tags(flow / flow boxed / flow framed / flow grid)で選ぶ"),
+});
+/**
+ * 流れ(手順)。マークアップと CSS は https://www.ameamelog.com/css-flow/ の 5 パターンを移植したもので、
+ * 色をテーマトークンに、寸法をスライド向けに直している(CSS は styles.ts の .b-flow-*)。
+ * 構造は共通: ul.b-flow > li > .icon(番号) + dl > dt(見出し) / dd(説明)
+ */
+function FlowList({ block, variant, numbered }) {
+    const focus = new Set(block.focus === undefined ? [] : Array.isArray(block.focus) ? block.focus : [block.focus]);
+    // boxed / framed は原型どおり番号を dt の中(見出しの上)に置く
+    const iconInTitle = variant === "boxed" || variant === "framed";
+    return (_jsx("ul", { className: `b-flow b-flow-${variant} ${focus.size > 0 ? "has-focus" : ""}`, children: block.steps.map((st, i) => {
+            const num = String(i + 1).padStart(2, "0");
+            const icon = _jsx("span", { className: "icon", children: numbered === "step" ? `STEP.${num}` : num });
+            return (_jsxs("li", { className: focus.has(i + 1) ? "is-focus" : "", children: [!iconInTitle && icon, st.via && (_jsx("span", { className: "via", children: _jsx(RichText, { text: st.via }) })), _jsxs("dl", { children: [_jsxs("dt", { children: [iconInTitle && icon, _jsx(RichText, { text: st.label }), st.phase && !iconInTitle && (_jsx("span", { className: "phase", children: _jsx(RichText, { text: st.phase }) }))] }), (st.detail || (st.phase && iconInTitle)) && (_jsxs("dd", { children: [st.phase && iconInTitle && (_jsx("span", { className: "phase", children: _jsx(RichText, { text: st.phase }) })), st.detail && _jsx(RichText, { text: st.detail })] }))] })] }, i));
+        }) }));
+}
+/** `flow`: 縦は 1 カラム構成(STEP ピル + レール + 点線)、横(direction: row)はポップ(吹き出し番号 + 枠カード + ›) */
+export const FlowBlock = (block) => block.direction === "row" ? _jsx(FlowList, { block: block, variant: "pop", numbered: "plain" }) : _jsx(FlowList, { block: block, variant: "rail", numbered: "step" });
+/** `flow boxed`: 枠線を使ったデザイン。角丸の枠を縦に積み、点線と ▽ でつなぐ */
+export const FlowBoxed = (block) => _jsx(FlowList, { block: block, variant: "boxed", numbered: "step" });
+/** `flow framed`: スタイリッシュ。全体を 1 つの枠で囲み、区切り線に ▽ の切り込み */
+export const FlowFramed = (block) => _jsx(FlowList, { block: block, variant: "framed", numbered: "step" });
+/** `flow grid`: 2 カラム構成。右端が矢印の枠を 2 列に */
+export const FlowGrid = (block) => _jsx(FlowList, { block: block, variant: "grid", numbered: "step" });
+//# sourceMappingURL=flow.js.map

package/dist/flow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"flow.js","sourceRoot":"","sources":["../src/flow.tsx"],"names":[],"mappings":"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"}

package/dist/index.d.ts

@@ -0,0 +1,12 @@
+export * from "./layouts.js";
+export * from "./panes.js";
+export * from "./flow.js";
+export * from "./chrome.js";
+export { BASIC_CSS, DEFAULT_THEME } from "./styles.js";
+/**
+ * 最小 tag セット。全 Interface に tags: [] の fallback を持つので、
+ * これを先頭に置けばどんな tags でも必ず何かが描画される。
+ */
+export declare const basic: import("@yadeck/slide-core").Plugin;
+export default basic;
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAmCA,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAEvD;;;GAGG;AACH,eAAO,MAAM,KAAK,qCA2ChB,CAAC;AAEH,eAAe,KAAK,CAAC"}

package/dist/index.js

@@ -0,0 +1,57 @@
+import { BlockLayout, DeckLayout, SlideLayout, definePlugin } from "@yadeck/slide-core";
+import { BodyBlock, CardSlide, CodeBlock, DefaultBlock, DefaultDeck, HeaderSlide, HeadingBlock, ImageBlock, ItemBlock, ListBlock, NoteBlock, ProfileSlide, QuoteBlock, SectionHeaderSlide, StatBlock, TwoColumnSlide, VideoBlock, codeType, headerType, headingType, imageType, itemType, listType, profileType, quoteType, sectionHeaderType, statType, videoType, } from "./layouts.js";
+import { FlowBlock, FlowBoxed, FlowFramed, FlowGrid, flowType } from "./flow.js";
+import { ColumnsSlide, DefaultSlide } from "./panes.js";
+import { BASIC_CSS, DEFAULT_THEME } from "./styles.js";
+export * from "./layouts.js";
+export * from "./panes.js";
+export * from "./flow.js";
+export * from "./chrome.js";
+export { BASIC_CSS, DEFAULT_THEME } from "./styles.js";
+/**
+ * 最小 tag セット。全 Interface に tags: [] の fallback を持つので、
+ * これを先頭に置けばどんな tags でも必ず何かが描画される。
+ */
+export const basic = definePlugin((c) => {
+    c.addStyle(DEFAULT_THEME);
+    c.addStyle(BASIC_CSS);
+    c.bind(DeckLayout, [], DefaultDeck, { description: "スライドを縦に並べる" });
+    c.bind(SlideLayout, [], DefaultSlide, {
+        description: "汎用。テキスト(tags なし / body / list / quote / stat / item)は全部で 1 pane、code / image / video は 1 つずつ 1 pane に数え、1: 全面、2: 左右、3: ト型、4: 十字、5 以上: 左右 2 列に自動配置。テキストは 1 行なら中央に大きく、2 行以上なら箇条書き",
+    });
+    c.bind(SlideLayout, ["header"], HeaderSlide, { type: headerType, description: "表紙。title / subtitle を大きく、発表者情報を左下、イベント情報を右下、logo を右上" });
+    c.bind(SlideLayout, ["profile"], ProfileSlide, { type: profileType, description: "自己紹介。左に名前・肩書き・写真・アカウント、右に items" });
+    c.bind(SlideLayout, ["section-header"], SectionHeaderSlide, { type: sectionHeaderType, description: "章扉。number と heading、body だけを描く" });
+    c.bind(SlideLayout, ["two-column"], TwoColumnSlide, { description: "2 列の対比。left を付けた block を左列、right を右列、どちらも無い block は前置きとして列の上に置く。列の見出しは heading left / heading right" });
+    c.bind(SlideLayout, ["card"], CardSlide, { description: "item をカードにして並べる(3 枚までは 1 行、4 枚は 2×2、5 枚以上は 3 列)。他の block は前置きとして上に置く" });
+    c.bind(SlideLayout, ["columns"], ColumnsSlide, { description: "pane を横一列に等分する(4 まで。5 以上は 3 列 × 2 行)" });
+    c.bind(BlockLayout, [], DefaultBlock, { description: "本文 1 行。markdown 可" });
+    c.bind(BlockLayout, ["heading"], HeadingBlock, { type: headingType, description: "見出し。slide の上部に置かれる" });
+    c.bind(BlockLayout, ["body"], BodyBlock, { description: "本文。markdown 可。複数行は段落になる" });
+    c.bind(BlockLayout, ["list"], ListBlock, { type: listType, description: "行ごとの箇条書き" });
+    c.bind(BlockLayout, ["code"], CodeBlock, { type: codeType, description: "コード。highlight.js で色付けし、pane に収まるよう縮小する" });
+    c.bind(BlockLayout, ["image"], ImageBlock, { type: imageType, description: "画像。pane にアスペクト比維持で収める。text はキャプション" });
+    c.bind(BlockLayout, ["video"], VideoBlock, { type: videoType, description: "動画。YouTube の URL は embed に変換して iframe で埋め込む" });
+    c.bind(BlockLayout, ["flow"], FlowBlock, {
+        type: flowType,
+        description: "流れ(手順)。縦は STEP ピル + 縦レール + 見出しと説明(1 カラム構成)、横(direction: row)は吹き出し番号付きの枠カードを › でつなぐ。via / phase / detail / focus。1 つで 1 pane",
+    });
+    c.bind(BlockLayout, ["flow", "boxed"], FlowBoxed, {
+        type: flowType,
+        description: "流れ(手順)の別の見せ方。角丸の枠を縦に積み、点線と ▽ でつなぐ。左に STEP と見出し、右に説明",
+    });
+    c.bind(BlockLayout, ["flow", "framed"], FlowFramed, {
+        type: flowType,
+        description: "流れ(手順)の別の見せ方。全体を 1 つの枠で囲み、区切り線に ▽ の切り込み。左に STEP と見出し、右に説明",
+    });
+    c.bind(BlockLayout, ["flow", "grid"], FlowGrid, {
+        type: flowType,
+        description: "流れ(手順)の別の見せ方。右端が矢印形のカードを 2 列に並べる。段数が多いときに高さを取らない",
+    });
+    c.bind(BlockLayout, ["quote"], QuoteBlock, { type: quoteType, description: "引用" });
+    c.bind(BlockLayout, ["stat"], StatBlock, { type: statType, description: "数字や固有名詞を大きく見せる。label と補足の text" });
+    c.bind(BlockLayout, ["item"], ItemBlock, { type: itemType, description: "並列の項目(title + 説明の text)。card slide でカードになる" });
+    c.bind(BlockLayout, ["note"], NoteBlock, { description: "発表者ノート。画面にも印刷にも出ず、presenter モードに出る" });
+});
+export default basic;
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/dist/layouts.d.ts

@@ -0,0 +1,114 @@
+import { z } from "zod";
+import { type BlockNode, type BlockOf, type DeckNode, type SlideNode, type SlideOf } from "@yadeck/slide-core";
+export declare const DefaultDeck: (deck: DeckNode) => import("react").JSX.Element;
+/**
+ * `card` を付けた slide。item をカードで横並びにし、それ以外の block は前置きとして上に置く。
+ * この bind が無い構成では tags 無しの slide に fallback して縦に並ぶ。
+ */
+/** カードの列数。3 枚までは 1 行、4 枚は 2×2、5 枚以上は 3 列で折り返す(1 枚に見出しと説明が入る分、columns より早く折り返す) */
+export declare function cardColumns(n: number): number;
+export declare const CardSlide: (slide: SlideNode) => import("react").JSX.Element;
+export declare const headerType: z.ZodObject<{
+    title: z.ZodString;
+    subtitle: z.ZodOptional<z.ZodString>;
+    author: z.ZodOptional<z.ZodString>;
+    affiliation: z.ZodOptional<z.ZodString>;
+    event: z.ZodOptional<z.ZodString>;
+    date: z.ZodOptional<z.ZodString>;
+    logo: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>;
+/**
+ * 表紙。title / subtitle を中央左寄せで大きく、発表者情報を左下、イベント情報を右下に置く。
+ * items は title の下に補足として並ぶ(通常は空)。
+ */
+export declare const HeaderSlide: (slide: SlideOf<typeof headerType>) => import("react").JSX.Element;
+export declare const profileType: z.ZodObject<{
+    name: z.ZodString;
+    role: z.ZodOptional<z.ZodString>;
+    affiliation: z.ZodOptional<z.ZodString>;
+    photo: z.ZodOptional<z.ZodString>;
+    accounts: z.ZodOptional<z.ZodRecord<z.ZodString, z.ZodString>>;
+}, z.core.$strip>;
+/**
+ * 自己紹介。左に名前・肩書き・写真、右に items(heading があれば右上の見出しに)。
+ */
+export declare const ProfileSlide: (slide: SlideOf<typeof profileType>) => import("react").JSX.Element;
+export declare const sectionHeaderType: z.ZodObject<{
+    number: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>;
+/**
+ * 章扉。表紙と同じ primary の地と accent の縦バーで、本文ページとの切り替わりを見せる。
+ * number は左上に accent で大きく、右下に透かしでもう一度出す
+ */
+export declare const SectionHeaderSlide: (slide: SlideOf<typeof sectionHeaderType>) => import("react").JSX.Element;
+/** 見出し + 前置き + left / right の 2 列。left / right の無い block は前置きとして列の上に置く */
+export declare const TwoColumnSlide: (slide: SlideNode) => import("react").JSX.Element;
+export declare const DefaultBlock: (block: BlockNode) => import("react").JSX.Element;
+export declare const headingType: z.ZodObject<{
+    level: z.ZodOptional<z.ZodNumber>;
+}, z.core.$strip>;
+/** 見出し。文字サイズは level で決まるが、slide 側が `[&_.b-heading]:text-*` で上書きできる */
+export declare const HeadingBlock: (block: BlockOf<typeof headingType>) => import("react").JSX.Element;
+export declare const BodyBlock: (block: BlockNode) => import("react").JSX.Element;
+export declare const listType: z.ZodObject<{
+    ordered: z.ZodOptional<z.ZodBoolean>;
+    focus: z.ZodOptional<z.ZodNumber>;
+}, z.core.$strip>;
+/** text の各行を項目にする。markdown の箇条書きは body でも書けるので、こちらは行区切りの簡易記法 */
+export declare const ListBlock: (block: BlockOf<typeof listType>) => import("react").JSX.Element;
+export declare const codeType: z.ZodObject<{
+    lang: z.ZodOptional<z.ZodString>;
+    caption: z.ZodOptional<z.ZodString>;
+    focus: z.ZodOptional<z.ZodUnion<readonly [z.ZodString, z.ZodNumber, z.ZodArray<z.ZodUnion<readonly [z.ZodString, z.ZodNumber]>>]>>;
+}, z.core.$strip>;
+/** focus の指定を行番号(0 始まり)の集合にする */
+export declare function focusLines(lines: string[], focus: z.infer<typeof codeType>["focus"]): Set<number>;
+/**
+ * ハイライト済み HTML を行ごとに分ける。行をまたぐ span(複数行コメントなど)は
+ * 行末で閉じて次の行頭で開き直す。
+ */
+export declare function splitHighlighted(html: string): string[];
+/**
+ * コード。highlight.js で SSG 時に色付けする。
+ * 行数と最大行長を CSS 変数で渡し、pane に収まるフォントサイズを CSS の calc で決める(styles.ts)。
+ */
+/** コードの最大行幅(全角 2)と行数。フォントサイズの計算に使う */
+export declare function codeSize(text: string | undefined): {
+    cols: number;
+    rows: number;
+};
+/** 箱の上下余白(40px)と、caption があればその 1 行分(40px)。高さからこの分を引いた残りに行を収める */
+export declare function codeChrome(caption: string | undefined): number;
+export declare const CodeBlock: (block: BlockOf<typeof codeType>) => import("react").JSX.Element;
+export declare const imageType: z.ZodObject<{
+    src: z.ZodString;
+    alt: z.ZodOptional<z.ZodString>;
+    width: z.ZodOptional<z.ZodUnion<readonly [z.ZodString, z.ZodNumber]>>;
+}, z.core.$strip>;
+/** 画像。pane いっぱいにアスペクト比を保って収める。width 指定があればその幅にする */
+export declare const ImageBlock: (block: BlockOf<typeof imageType>) => import("react").JSX.Element;
+export declare const videoType: z.ZodObject<{
+    url: z.ZodString;
+}, z.core.$strip>;
+/** 動画。YouTube は embed URL に変換して iframe で埋め込む。text はキャプション */
+export declare const VideoBlock: (block: BlockOf<typeof videoType>) => import("react").JSX.Element;
+export declare function toEmbedUrl(url: string): string;
+export declare const statType: z.ZodObject<{
+    value: z.ZodString;
+    label: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>;
+/** 数字や固有名詞を主役にする block。text は補足として小さく出す */
+export declare const StatBlock: (block: BlockOf<typeof statType>) => import("react").JSX.Element;
+export declare const itemType: z.ZodObject<{
+    title: z.ZodString;
+    logo: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>;
+/** 並列の項目。タイトルと説明を持つ。見せ方(カードにするか等)は slide の Layout が決める */
+export declare const ItemBlock: (block: BlockOf<typeof itemType>) => import("react").JSX.Element;
+export declare const quoteType: z.ZodObject<{
+    cite: z.ZodOptional<z.ZodString>;
+}, z.core.$strip>;
+export declare const QuoteBlock: (block: BlockOf<typeof quoteType>) => import("react").JSX.Element;
+/** 発表者ノート。画面・印刷には出さず、presenter モードが `.yd-notes` を拾って表示する */
+export declare const NoteBlock: (block: BlockNode) => import("react").JSX.Element;
+//# sourceMappingURL=layouts.d.ts.map

package/dist/layouts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"layouts.d.ts","sourceRoot":"","sources":["../src/layouts.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AACxB,OAAO,EAML,KAAK,SAAS,EACd,KAAK,OAAO,EACZ,KAAK,QAAQ,EACb,KAAK,SAAS,EACd,KAAK,OAAO,EACb,MAAM,oBAAoB,CAAC;AAK5B,eAAO,MAAM,WAAW,GAAI,MAAM,QAAQ,gCAMzC,CAAC;AAIF;;;GAGG;AACH,kFAAkF;AAClF,wBAAgB,WAAW,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,CAG7C;AAED,eAAO,MAAM,SAAS,GAAI,OAAO,SAAS,gCAsBzC,CAAC;AAEF,eAAO,MAAM,UAAU;;;;;;;;iBAQrB,CAAC;AAEH;;;GAGG;AACH,eAAO,MAAM,WAAW,GAAI,OAAO,OAAO,CAAC,OAAO,UAAU,CAAC,gCAoC5D,CAAC;AAEF,eAAO,MAAM,WAAW;;;;;;iBAMtB,CAAC;AAIH;;GAEG;AACH,eAAO,MAAM,YAAY,GAAI,OAAO,OAAO,CAAC,OAAO,WAAW,CAAC,gCAwC9D,CAAC;AAEF,eAAO,MAAM,iBAAiB;;iBAE5B,CAAC;AAEH;;;GAGG;AACH,eAAO,MAAM,kBAAkB,GAAI,OAAO,OAAO,CAAC,OAAO,iBAAiB,CAAC,gCAsB1E,CAAC;AAEF,0EAA0E;AAC1E,eAAO,MAAM,cAAc,GAAI,OAAO,SAAS,gCA+B9C,CAAC;AAIF,eAAO,MAAM,YAAY,GAAI,OAAO,SAAS,gCAA+D,CAAC;AAE7G,eAAO,MAAM,WAAW;;iBAEtB,CAAC;AAIH,sEAAsE;AACtE,eAAO,MAAM,YAAY,GAAI,OAAO,OAAO,CAAC,OAAO,WAAW,CAAC,gCAQ9D,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,OAAO,SAAS,gCAA+D,CAAC;AAE1G,eAAO,MAAM,QAAQ;;;iBAGnB,CAAC;AAEH,gEAAgE;AAChE,eAAO,MAAM,SAAS,GAAI,OAAO,OAAO,CAAC,OAAO,QAAQ,CAAC,gCAYxD,CAAC;AAEF,eAAO,MAAM,QAAQ;;;;iBAOnB,CAAC;AAEH,iCAAiC;AACjC,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,KAAK,CAAC,OAAO,QAAQ,CAAC,CAAC,OAAO,CAAC,GAAG,GAAG,CAAC,MAAM,CAAC,CAkBjG;AAED;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,EAAE,CAavD;AAED;;;GAGG;AACH,sCAAsC;AACtC,wBAAgB,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAGjF;AAED,kEAAkE;AAClE,wBAAgB,UAAU,CAAC,OAAO,EAAE,MAAM,GAAG,SAAS,GAAG,MAAM,CAE9D;AAED,eAAO,MAAM,SAAS,GAAI,OAAO,OAAO,CAAC,OAAO,QAAQ,CAAC,gCAqCxD,CAAC;AAEF,eAAO,MAAM,SAAS;;;;iBAIpB,CAAC;AAEH,oDAAoD;AACpD,eAAO,MAAM,UAAU,GAAI,OAAO,OAAO,CAAC,OAAO,SAAS,CAAC,gCAc1D,CAAC;AAEF,eAAO,MAAM,SAAS;;iBAEpB,CAAC;AAEH,6DAA6D;AAC7D,eAAO,MAAM,UAAU,GAAI,OAAO,OAAO,CAAC,OAAO,SAAS,CAAC,gCAc1D,CAAC;AAgBF,wBAAgB,UAAU,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAG9C;AAED,eAAO,MAAM,QAAQ;;;iBAGnB,CAAC;AAEH,2CAA2C;AAC3C,eAAO,MAAM,SAAS,GAAI,OAAO,OAAO,CAAC,OAAO,QAAQ,CAAC,gCAkBxD,CAAC;AAEF,eAAO,MAAM,QAAQ;;;iBAGnB,CAAC;AAEH,0DAA0D;AAC1D,eAAO,MAAM,SAAS,GAAI,OAAO,OAAO,CAAC,OAAO,QAAQ,CAAC,gCAYxD,CAAC;AAEF,eAAO,MAAM,SAAS;;iBAEpB,CAAC;AAEH,eAAO,MAAM,UAAU,GAAI,OAAO,OAAO,CAAC,OAAO,SAAS,CAAC,gCAK1D,CAAC;AAEF,4DAA4D;AAC5D,eAAO,MAAM,SAAS,GAAI,OAAO,SAAS,gCAIzC,CAAC"}

package/dist/layouts.js

@@ -0,0 +1,220 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import hljs from "highlight.js";
+import { z } from "zod";
+import { Block, RichText, Slide, pick, pickAll, } from "@yadeck/slide-core";
+import { PAGE, SlideHeading } from "./chrome.js";
+// ---- deck ----
+export const DefaultDeck = (deck) => (_jsx("main", { className: "yd-deck", children: deck.slides.map((s) => (_jsx(Slide, { data: s }, s.id))) }));
+// ---- slide ----
+/**
+ * `card` を付けた slide。item をカードで横並びにし、それ以外の block は前置きとして上に置く。
+ * この bind が無い構成では tags 無しの slide に fallback して縦に並ぶ。
+ */
+/** カードの列数。3 枚までは 1 行、4 枚は 2×2、5 枚以上は 3 列で折り返す(1 枚に見出しと説明が入る分、columns より早く折り返す) */
+export function cardColumns(n) {
+    if (n <= 3)
+        return Math.max(1, n);
+    return n === 4 ? 2 : 3;
+}
+export const CardSlide = (slide) => {
+    const [heading, rest] = pick(slide.items, ["heading"]);
+    const [entries, lead] = pickAll(rest, ["item"]);
+    return (_jsxs("div", { className: `${PAGE} b-card`, children: [heading && _jsx(SlideHeading, { block: heading, description: slide.description }), lead.length > 0 && (_jsx("div", { className: "flex flex-col gap-3", children: lead.map((b) => (_jsx(Block, { data: b }, b.id))) })), _jsx("div", { className: "grid min-h-0 flex-1 auto-rows-[minmax(0,1fr)] gap-6", style: { gridTemplateColumns: `repeat(${cardColumns(entries.length)}, minmax(0, 1fr))` }, children: entries.map((b) => (_jsx("div", { className: "flex min-h-0 flex-col justify-center rounded-2xl bg-ink/5 px-8 py-5 [&_.b-item]:items-center [&_.b-item]:text-center", children: _jsx(Block, { data: b }) }, b.id))) })] }));
+};
+export const headerType = z.object({
+    title: z.string().describe("発表タイトル"),
+    subtitle: z.string().optional().describe("副題"),
+    author: z.string().optional().describe("発表者名"),
+    affiliation: z.string().optional().describe("所属。author の下に小さく出す"),
+    event: z.string().optional().describe("イベント名。右下に date と並べる"),
+    date: z.string().optional().describe("日付"),
+    logo: z.string().optional().describe("ロゴ画像。public/ のファイルは ./logo.svg、外部は URL。右上に白抜きで出す"),
+});
+/**
+ * 表紙。title / subtitle を中央左寄せで大きく、発表者情報を左下、イベント情報を右下に置く。
+ * items は title の下に補足として並ぶ(通常は空)。
+ */
+export const HeaderSlide = (slide) => (_jsxs("div", { className: "b-header absolute inset-0 flex flex-col overflow-hidden bg-linear-to-br from-primary to-primary-deep px-20 py-14 text-surface", children: [_jsx("div", { "aria-hidden": "true", className: "pointer-events-none absolute -right-40 -bottom-64 size-[640px] rounded-full bg-accent/10" }), _jsx("div", { "aria-hidden": "true", className: "absolute inset-x-0 bottom-0 h-3 bg-accent" }), slide.logo && _jsx("img", { className: "absolute top-14 right-20 h-12 w-auto brightness-0 invert", src: slide.logo, alt: "" }), _jsxs("div", { className: "relative flex flex-1 flex-col justify-center", children: [_jsxs("div", { className: "flex flex-col gap-5 border-l-[10px] border-accent pl-8", children: [_jsx("h1", { className: "m-0 text-h1 leading-[1.25] font-bold", children: _jsx(RichText, { text: slide.title }) }), slide.subtitle && (_jsx("p", { className: "m-0 text-h3 leading-snug font-normal text-accent", children: _jsx(RichText, { text: slide.subtitle }) }))] }), slide.items.length > 0 && (_jsx("div", { className: "mt-8 flex flex-col gap-3", children: slide.items.map((b) => (_jsx(Block, { data: b }, b.id))) }))] }), _jsxs("div", { className: "relative flex items-end justify-between gap-6 text-small leading-snug", children: [_jsxs("div", { className: "flex flex-col gap-1", children: [slide.author && _jsx("span", { className: "text-h4 font-bold", children: slide.author }), slide.affiliation && _jsx("span", { className: "opacity-85", children: slide.affiliation })] }), _jsxs("div", { className: "flex flex-col items-end gap-1 opacity-85", children: [slide.event && _jsx("span", { children: slide.event }), slide.date && _jsx("span", { children: slide.date })] })] })] }));
+export const profileType = z.object({
+    name: z.string().describe("名前"),
+    role: z.string().optional().describe("肩書き・役割"),
+    affiliation: z.string().optional().describe("所属"),
+    photo: z.string().optional().describe("顔写真。無ければ name の頭文字を accent の円で出す"),
+    accounts: z.record(z.string(), z.string()).optional().describe("SNS や GitHub の ID。{ x: id, github: id } の形"),
+});
+const ACCOUNT_LABEL = { x: "X", twitter: "X", github: "GitHub", bluesky: "Bluesky", mastodon: "Mastodon", zenn: "Zenn", qiita: "Qiita" };
+/**
+ * 自己紹介。左に名前・肩書き・写真、右に items(heading があれば右上の見出しに)。
+ */
+export const ProfileSlide = (slide) => {
+    const [heading, rest] = pick(slide.items, ["heading"]);
+    return (_jsxs("div", { className: `${PAGE} b-profile`, children: [heading && (_jsx(SlideHeading, { block: heading, description: slide.description })), _jsxs("div", { className: "grid min-h-0 flex-1 grid-cols-[380px_1fr] gap-12", children: [_jsxs("div", { className: "relative flex flex-col items-center justify-center gap-6 overflow-hidden rounded-2xl bg-linear-to-br from-primary to-primary-deep px-8 py-10 text-center text-surface", children: [_jsx("div", { "aria-hidden": "true", className: "pointer-events-none absolute -right-20 -bottom-24 size-72 rounded-full bg-accent/15" }), slide.photo ? (_jsx("img", { className: "relative size-52 rounded-full object-cover ring-6 ring-accent", src: slide.photo, alt: "" })) : (_jsx("div", { className: "relative flex size-52 items-center justify-center rounded-full bg-surface/10 text-display font-extrabold text-accent ring-6 ring-accent", children: Array.from(slide.name)[0] })), _jsxs("div", { className: "relative flex flex-col gap-1", children: [_jsx("span", { className: "text-h3 font-bold", children: slide.name }), slide.role && _jsx("span", { className: "text-body text-accent", children: slide.role }), slide.affiliation && _jsx("span", { className: "text-small opacity-85", children: slide.affiliation })] }), slide.accounts && (_jsx("div", { className: "relative flex flex-col gap-1 text-small", children: Object.entries(slide.accounts).map(([service, id]) => (_jsxs("span", { children: [_jsx("span", { className: "mr-2 text-accent", children: ACCOUNT_LABEL[service.toLowerCase()] ?? service }), "@", id] }, service))) }))] }), _jsx("div", { className: "flex min-w-0 flex-col justify-center gap-6", children: rest.map((b) => (_jsx(Block, { data: b }, b.id))) })] })] }));
+};
+export const sectionHeaderType = z.object({
+    number: z.string().optional().describe("章番号。\"01\" のように表示したい文字列"),
+});
+/**
+ * 章扉。表紙と同じ primary の地と accent の縦バーで、本文ページとの切り替わりを見せる。
+ * number は左上に accent で大きく、右下に透かしでもう一度出す
+ */
+export const SectionHeaderSlide = (slide) => {
+    const [heading, rest] = pick(slide.items, ["heading"]);
+    const [bodies] = pickAll(rest, ["body"]);
+    return (_jsxs("div", { className: "b-section absolute inset-0 flex flex-col justify-center overflow-hidden bg-linear-to-br from-primary to-primary-deep px-20 py-14 text-surface [&_.b-heading]:m-0 [&_.b-heading]:text-[64px] [&_.b-heading]:leading-tight [&_.b-heading]:text-surface [&_.b-body]:m-0 [&_.b-body]:text-h3 [&_.b-body]:text-accent", children: [slide.number && (_jsx("div", { "aria-hidden": "true", className: "pointer-events-none absolute -right-6 -bottom-28 text-[420px] leading-none font-extrabold text-surface/5 select-none", children: slide.number })), _jsx("div", { "aria-hidden": "true", className: "absolute inset-x-0 bottom-0 h-3 bg-accent" }), _jsxs("div", { className: "relative flex flex-col gap-6", children: [slide.number && _jsx("div", { className: "text-display leading-none font-extrabold text-accent", children: slide.number }), _jsxs("div", { className: "flex flex-col gap-4 border-l-[10px] border-accent pl-8", children: [heading && _jsx(Block, { data: heading }), bodies.map((b) => (_jsx(Block, { data: b }, b.id)))] })] })] }));
+};
+/** 見出し + 前置き + left / right の 2 列。left / right の無い block は前置きとして列の上に置く */
+export const TwoColumnSlide = (slide) => {
+    const [heading, rest] = pick(slide.items, ["heading"]);
+    const [right, rest2] = pickAll(rest, ["right"]);
+    const [left, lead] = pickAll(rest2, ["left"]);
+    // 列の中の code が収まるよう、pane 相当の寸法を渡す(幅は列幅、高さは列の半分程度を上限とみなす)
+    const column = (blocks) => (_jsx("div", { className: "flex min-w-0 flex-col gap-5 [&_.b-heading]:text-h3 [&_.b-heading]:text-primary", style: { "--pane-w": "540px", "--pane-h": "260px" }, children: blocks.map((b) => (_jsx(Block, { data: b }, b.id))) }));
+    return (_jsxs("div", { className: `${PAGE} b-two-column`, children: [heading && _jsx(SlideHeading, { block: heading, description: slide.description }), lead.length > 0 && (_jsx("div", { className: "flex flex-col gap-3", children: lead.map((b) => (_jsx(Block, { data: b }, b.id))) })), _jsxs("div", { className: "grid min-h-0 flex-1 grid-cols-2 gap-10", children: [column(left), column(right)] })] }));
+};
+// ---- block ----
+export const DefaultBlock = (block) => _jsx(RichText, { as: "div", className: "b-body", text: block.text });
+export const headingType = z.object({
+    level: z.number().int().min(1).max(4).optional().describe("見出しレベル 1〜4。既定 2"),
+});
+const HEADING_SIZE = { 1: "text-h1", 2: "text-h2", 3: "text-h3", 4: "text-h4" };
+/** 見出し。文字サイズは level で決まるが、slide 側が `[&_.b-heading]:text-*` で上書きできる */
+export const HeadingBlock = (block) => {
+    const level = (block.level ?? 2);
+    const Tag = `h${level}`;
+    return (_jsx(Tag, { className: `b-heading m-0 leading-tight font-bold ${HEADING_SIZE[level]}`, children: _jsx(RichText, { text: block.text }) }));
+};
+export const BodyBlock = (block) => _jsx(RichText, { as: "div", className: "b-body", text: block.text });
+export const listType = z.object({
+    ordered: z.boolean().optional().describe("番号付きにする"),
+    focus: z.number().int().min(1).optional().describe("焦点にする項目の番号(1 始まり)。他の項目は薄くなる"),
+});
+/** text の各行を項目にする。markdown の箇条書きは body でも書けるので、こちらは行区切りの簡易記法 */
+export const ListBlock = (block) => {
+    const lines = (block.text ?? "").split("\n").filter((l) => l.trim().length > 0);
+    const Tag = block.ordered ? "ol" : "ul";
+    return (_jsx(Tag, { className: `b-list m-0 pl-[1.2em] marker:text-accent ${block.ordered ? "list-decimal" : "list-disc"}`, children: lines.map((line, i) => (_jsx("li", { className: `my-1 ${block.focus ? (block.focus === i + 1 ? "font-bold text-primary" : "opacity-50") : ""}`, children: _jsx(RichText, { text: line }) }, i))) }));
+};
+export const codeType = z.object({
+    lang: z.string().optional().describe("言語。省略で自動判定、text でログなどを無色表示"),
+    caption: z.string().optional().describe("コードの下に添える 1 行"),
+    focus: z
+        .union([z.string(), z.number().int().min(1), z.array(z.union([z.string(), z.number().int().min(1)]))])
+        .optional()
+        .describe('焦点にする行。行番号(1 始まり)、"6-8" の範囲、または行に含まれる文字列。配列で複数可。他の行は薄くなる'),
+});
+/** focus の指定を行番号(0 始まり)の集合にする */
+export function focusLines(lines, focus) {
+    const set = new Set();
+    if (focus === undefined)
+        return set;
+    for (const f of Array.isArray(focus) ? focus : [focus]) {
+        if (typeof f === "number") {
+            set.add(f - 1);
+            continue;
+        }
+        const range = f.match(/^(\d+)-(\d+)$/);
+        if (range) {
+            for (let i = Number(range[1]); i <= Number(range[2]); i++)
+                set.add(i - 1);
+            continue;
+        }
+        lines.forEach((l, i) => {
+            if (l.includes(f))
+                set.add(i);
+        });
+    }
+    return set;
+}
+/**
+ * ハイライト済み HTML を行ごとに分ける。行をまたぐ span(複数行コメントなど)は
+ * 行末で閉じて次の行頭で開き直す。
+ */
+export function splitHighlighted(html) {
+    const out = [];
+    const open = [];
+    for (const raw of html.split("\n")) {
+        let line = open.join("");
+        for (const m of raw.matchAll(/<span[^>]*>|<\/span>/g)) {
+            if (m[0] === "</span>")
+                open.pop();
+            else
+                open.push(m[0]);
+        }
+        line += raw + "</span>".repeat(open.length);
+        out.push(line);
+    }
+    return out;
+}
+/**
+ * コード。highlight.js で SSG 時に色付けする。
+ * 行数と最大行長を CSS 変数で渡し、pane に収まるフォントサイズを CSS の calc で決める(styles.ts)。
+ */
+/** コードの最大行幅(全角 2)と行数。フォントサイズの計算に使う */
+export function codeSize(text) {
+    const lines = (text ?? "").replace(/\n$/, "").split("\n");
+    return { cols: Math.max(1, ...lines.map(displayWidth)), rows: lines.length };
+}
+/** 箱の上下余白(40px)と、caption があればその 1 行分(40px)。高さからこの分を引いた残りに行を収める */
+export function codeChrome(caption) {
+    return caption ? 80 : 40;
+}
+export const CodeBlock = (block) => {
+    const code = (block.text ?? "").replace(/\n$/, "");
+    const lines = code.split("\n");
+    const { cols } = codeSize(code);
+    // lang 無しは自動判定、text / plain はログなどの無色表示
+    const plain = block.lang === "text" || block.lang === "plain" || block.lang === "plaintext";
+    const lang = block.lang && hljs.getLanguage(block.lang) ? block.lang : undefined;
+    const html = plain ? escapeHtml(code) : lang ? hljs.highlight(code, { language: lang }).value : hljs.highlightAuto(code).value;
+    const focus = focusLines(lines, block.focus);
+    const rows = splitHighlighted(html);
+    // 箱は内容の高さで止め、pane の中では縦中央に置く(短いコードで黒い箱が間延びしない)
+    return (_jsxs("figure", { className: "m-0 flex min-h-0 flex-1 flex-col justify-center gap-2", children: [_jsx("pre", { className: "b-code m-0 max-h-full min-h-0 overflow-hidden rounded-lg bg-code py-5 font-mono leading-snug text-code-ink", "data-lang": block.lang, style: { "--code-cols": cols, "--code-rows": lines.length, "--code-chrome": `${codeChrome(block.caption)}px` }, children: _jsx("code", { className: "hljs block", children: rows.map((row, i) => (_jsx("span", { className: `block border-l-4 px-5 ${focus.size === 0 ? "border-transparent" : focus.has(i) ? "border-accent bg-accent/15" : "border-transparent opacity-40"}`, dangerouslySetInnerHTML: { __html: row || " " } }, i))) }) }), block.caption && (_jsx("figcaption", { className: "shrink-0 text-small text-muted", children: _jsx(RichText, { text: block.caption }) }))] }));
+};
+export const imageType = z.object({
+    src: z.string().describe("画像のパス(public/ なら ./name.png)か URL"),
+    alt: z.string().optional().describe("代替テキスト"),
+    width: z.union([z.string(), z.number()]).optional().describe("幅を固定したいときだけ。既定は pane いっぱい"),
+});
+/** 画像。pane いっぱいにアスペクト比を保って収める。width 指定があればその幅にする */
+export const ImageBlock = (block) => (_jsxs("figure", { className: "b-image m-0 flex min-h-0 flex-1 flex-col items-center gap-2", children: [_jsx("img", { className: block.width ? "max-h-full" : "min-h-0 w-full flex-1 object-contain", src: block.src, alt: block.alt ?? "", style: block.width ? { width: block.width } : undefined }), block.text && (_jsx("figcaption", { className: "shrink-0 text-small text-muted", children: _jsx(RichText, { text: block.text }) }))] }));
+export const videoType = z.object({
+    url: z.string().describe("YouTube の watch / youtu.be / shorts の URL、または iframe で開ける URL"),
+});
+/** 動画。YouTube は embed URL に変換して iframe で埋め込む。text はキャプション */
+export const VideoBlock = (block) => (_jsxs("figure", { className: "b-video m-0 flex min-h-0 flex-1 flex-col items-center gap-2", children: [_jsx("iframe", { className: "min-h-0 w-full flex-1 rounded-lg border-0 bg-code", src: toEmbedUrl(block.url), allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture", allowFullScreen: true }), block.text && (_jsx("figcaption", { className: "shrink-0 text-small text-muted", children: _jsx(RichText, { text: block.text }) }))] }));
+/** 等幅フォントでの表示幅。全角(CJK や全角記号)は半角 2 つ分として数える */
+function displayWidth(line) {
+    let w = 0;
+    for (const ch of line) {
+        const cp = ch.codePointAt(0);
+        w += cp >= 0x1100 && (cp <= 0x115f || (cp >= 0x2e80 && cp <= 0xa4cf) || (cp >= 0xac00 && cp <= 0xd7a3) || (cp >= 0xf900 && cp <= 0xfaff) || (cp >= 0xfe30 && cp <= 0xfe4f) || (cp >= 0xff00 && cp <= 0xff60) || (cp >= 0xffe0 && cp <= 0xffe6) || cp >= 0x20000) ? 2 : 1;
+    }
+    return w;
+}
+function escapeHtml(s) {
+    return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+}
+export function toEmbedUrl(url) {
+    const m = url.match(/(?:youtube\.com\/(?:watch\?v=|shorts\/)|youtu\.be\/)([\w-]{11})/);
+    return m ? `https://www.youtube.com/embed/${m[1]}` : url;
+}
+export const statType = z.object({
+    value: z.string().describe("大きく出す値。数字や固有名詞"),
+    label: z.string().optional().describe("値の説明。1 行"),
+});
+/** 数字や固有名詞を主役にする block。text は補足として小さく出す */
+export const StatBlock = (block) => (_jsxs("div", { className: "b-stat flex items-baseline gap-5", children: [_jsx("span", { className: "w-[240px] shrink-0 text-right text-h1 leading-none font-extrabold text-primary", children: _jsx(RichText, { text: block.value }) }), _jsxs("div", { className: "flex min-w-0 flex-col gap-1", children: [block.label && (_jsx("span", { className: "text-h4 leading-tight font-bold", children: _jsx(RichText, { text: block.label }) })), block.text && (_jsx("span", { className: "text-small leading-snug text-muted", children: _jsx(RichText, { text: block.text }) }))] })] }));
+export const itemType = z.object({
+    title: z.string().describe("項目名"),
+    logo: z.string().optional().describe("項目のロゴ画像"),
+});
+/** 並列の項目。タイトルと説明を持つ。見せ方(カードにするか等)は slide の Layout が決める */
+export const ItemBlock = (block) => (_jsxs("div", { className: "b-item flex flex-col gap-2", children: [block.logo && _jsx("img", { className: "h-14 w-auto", src: block.logo, alt: "" }), _jsx("span", { className: "text-h4 leading-tight font-bold [word-break:keep-all]", children: _jsx(RichText, { text: block.title }) }), block.text && (_jsx("span", { className: "text-body leading-snug text-muted", children: _jsx(RichText, { text: block.text }) }))] }));
+export const quoteType = z.object({
+    cite: z.string().optional().describe("出典"),
+});
+export const QuoteBlock = (block) => (_jsxs("blockquote", { className: "b-quote m-0 border-l-[6px] border-primary px-6 py-2 text-muted", children: [_jsx(RichText, { as: "div", className: "b-body", text: block.text }), block.cite && _jsx("cite", { className: "mt-2 block text-small text-faint", children: block.cite })] }));
+/** 発表者ノート。画面・印刷には出さず、presenter モードが `.yd-notes` を拾って表示する */
+export const NoteBlock = (block) => (_jsx("div", { className: "yd-notes b-note", hidden: true, children: _jsx(RichText, { as: "div", text: block.text }) }));
+//# sourceMappingURL=layouts.js.map