@tatamicks/core 0.3.2 → 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.
- package/README.md +518 -81
- package/dist/PalettePanel-CtXsH6Cb.js +5137 -0
- package/dist/PalettePanel-CtXsH6Cb.js.map +1 -0
- package/dist/PalettePanel-Dipvtj7D.cjs +9 -0
- package/dist/PalettePanel-Dipvtj7D.cjs.map +1 -0
- package/dist/PalettePanel.css +1 -0
- package/dist/canvas.cjs +1 -0
- package/dist/canvas.cjs.map +1 -0
- package/dist/canvas.mjs +354 -0
- package/dist/canvas.mjs.map +1 -0
- package/dist/index.cjs +5 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.css +3 -1
- package/dist/index.css.d.ts +2 -0
- package/dist/index.mjs +1424 -6891
- package/dist/index.mjs.map +1 -1
- package/dist/paperSettingsWidget-DgDoBA0P.js +5137 -0
- package/dist/paperSettingsWidget-DgDoBA0P.js.map +1 -0
- package/dist/paperSettingsWidget-sLJsIUxS.cjs +2 -0
- package/dist/paperSettingsWidget-sLJsIUxS.cjs.map +1 -0
- package/dist/paperSettingsWidget.css +1 -0
- package/dist/shell.cjs +1 -0
- package/dist/shell.cjs.map +1 -0
- package/dist/shell.mjs +65 -0
- package/dist/shell.mjs.map +1 -0
- package/dist/sidebarPortal-C06y4JSP.js +723 -0
- package/dist/sidebarPortal-C06y4JSP.js.map +1 -0
- package/dist/sidebarPortal-C3HszQyp.cjs +1 -0
- package/dist/sidebarPortal-C3HszQyp.cjs.map +1 -0
- package/dist/src/canvas.d.ts +2523 -0
- package/dist/src/index.d.ts +1801 -2880
- package/dist/src/shell.d.ts +1982 -0
- package/package.json +21 -8
- package/dist/index.js +0 -70
- package/dist/index.js.map +0 -1
|
@@ -0,0 +1,2523 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @tatamicks/core/canvas - キャンバスサブパスエントリポイント
|
|
3
|
+
*
|
|
4
|
+
* ブロックレイヤー・インタラクションレイヤー・ウィジェットなど内部 canvas コンポーネントへのアクセスを提供する Advanced API。
|
|
5
|
+
*
|
|
6
|
+
* @remarks Advanced — これらは内部実装の詳細を公開する低レベル API です。
|
|
7
|
+
*
|
|
8
|
+
* Breaking changes が生じる可能性があります。
|
|
9
|
+
*
|
|
10
|
+
* @packageDocumentation
|
|
11
|
+
*/
|
|
12
|
+
|
|
13
|
+
import { ComponentType } from 'react';
|
|
14
|
+
import { default as default_2 } from 'react';
|
|
15
|
+
import { Dispatch } from 'react';
|
|
16
|
+
import { FC } from 'react';
|
|
17
|
+
import { ForwardRefExoticComponent } from 'react';
|
|
18
|
+
import { JSX } from 'react/jsx-runtime';
|
|
19
|
+
import { MemoExoticComponent } from 'react';
|
|
20
|
+
import { NamedExoticComponent } from 'react';
|
|
21
|
+
import { RefAttributes } from 'react';
|
|
22
|
+
import { SetStateAction } from 'react';
|
|
23
|
+
|
|
24
|
+
/**
|
|
25
|
+
* 登録済みアクションの実行および有効判定インターフェース。
|
|
26
|
+
*
|
|
27
|
+
* @remarks
|
|
28
|
+
* button ブロックのクリック時に呼び出される。
|
|
29
|
+
*/
|
|
30
|
+
declare interface ActionContext {
|
|
31
|
+
/** 指定 ID のアクションを実行する。 */
|
|
32
|
+
execute(actionId: BuiltinActionId | (string & {}), payload?: unknown): void;
|
|
33
|
+
/** 指定 ID のアクションが実行可能か返す。 */
|
|
34
|
+
isEnabled(actionId: BuiltinActionId | (string & {})): boolean;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
/* Excluded from this release type: ActionHandler */
|
|
38
|
+
|
|
39
|
+
/**
|
|
40
|
+
* アクション ID をキーとしたハンドラマップ。
|
|
41
|
+
*
|
|
42
|
+
* `useBookActionContext` に渡すことで {@link ActionContext} として組み立てられる。
|
|
43
|
+
*/
|
|
44
|
+
export declare type ActionHandlers = {
|
|
45
|
+
[K in BuiltinActionId]?: ActionHandler;
|
|
46
|
+
} & {
|
|
47
|
+
[actionId: string]: ActionHandler | undefined;
|
|
48
|
+
};
|
|
49
|
+
|
|
50
|
+
/**
|
|
51
|
+
* 物理的な実寸を表す単位の配列(`fr` / `%` を除く)。
|
|
52
|
+
*/
|
|
53
|
+
export declare const ACTUAL_UNITS: readonly ["mm", "cm", "inch", "pt", "px"];
|
|
54
|
+
|
|
55
|
+
/**
|
|
56
|
+
* 物理的な実寸を表す単位(`fr` / `%` を除く)。
|
|
57
|
+
*/
|
|
58
|
+
export declare type ActualUnit = (typeof ACTUAL_UNITS)[number];
|
|
59
|
+
|
|
60
|
+
/**
|
|
61
|
+
* 配置プロパティの `PropDef`。
|
|
62
|
+
*
|
|
63
|
+
* @remarks
|
|
64
|
+
* **Canvas** — ブロックプラグイン実装時に `plugin.props` へ追加する。
|
|
65
|
+
*/
|
|
66
|
+
export declare const alignmentProp: {
|
|
67
|
+
kind: string;
|
|
68
|
+
defaultProps: {
|
|
69
|
+
horizontal: HorizontalAlign;
|
|
70
|
+
vertical: VerticalAlign;
|
|
71
|
+
};
|
|
72
|
+
};
|
|
73
|
+
|
|
74
|
+
/**
|
|
75
|
+
* ブロック内の水平・垂直配置を保持する Props。
|
|
76
|
+
*/
|
|
77
|
+
export declare interface AlignmentProps {
|
|
78
|
+
/** 水平配置 */
|
|
79
|
+
horizontal?: HorizontalAlign;
|
|
80
|
+
/** 垂直配置 */
|
|
81
|
+
vertical?: VerticalAlign;
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
/**
|
|
85
|
+
* 全単位の配列。
|
|
86
|
+
*/
|
|
87
|
+
export declare const ALL_UNITS: readonly ["mm", "cm", "fr", "inch", "pt", "px", "%"];
|
|
88
|
+
|
|
89
|
+
/* Excluded from this release type: AnyBlockPlugin */
|
|
90
|
+
|
|
91
|
+
/**
|
|
92
|
+
* 全ブロックに共通して存在する基底プロパティ。
|
|
93
|
+
*
|
|
94
|
+
* コンテナが alignment / padding を CSS に変換し、Renderer は意識しない。
|
|
95
|
+
*/
|
|
96
|
+
export declare interface BaseBlockProps extends AlignmentProps, PaddingProps {
|
|
97
|
+
/** 値の読み書き先 `BindingContext` のドットパス。バインディングを使わないブロックは省略可 */
|
|
98
|
+
binding?: string;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
declare type BaseRenderer = ForwardRefExoticComponent<RendererProps<Record<string, Value>, Value> & RefAttributes<BlockRef>>;
|
|
102
|
+
|
|
103
|
+
/**
|
|
104
|
+
* binding パスによる設定値の読み書きインターフェース。
|
|
105
|
+
*
|
|
106
|
+
* @remarks
|
|
107
|
+
* `HiddenBinding` の評価および button ブロックのアクション判定に使用される。
|
|
108
|
+
*/
|
|
109
|
+
declare interface BindingContext {
|
|
110
|
+
/**
|
|
111
|
+
* 指定パスの値を取得する。
|
|
112
|
+
*
|
|
113
|
+
* - パスが存在し値が `null` の場合: `null` を返す。
|
|
114
|
+
* - パスの値が未設定(未登録)の場合: `undefined` を返す。
|
|
115
|
+
*
|
|
116
|
+
* `extra` として渡す実装では、担当外のパスに対して `undefined` を返すことで
|
|
117
|
+
* 組み込みの BindingContext へのフォールバックを指示できる。
|
|
118
|
+
* 有効値として `null` を返す場合はフォールバックしない。
|
|
119
|
+
*/
|
|
120
|
+
get(path: string): Value | undefined;
|
|
121
|
+
/** 指定パスに値を書き込む。 */
|
|
122
|
+
set(path: string, value: Value): void;
|
|
123
|
+
}
|
|
124
|
+
|
|
125
|
+
/**
|
|
126
|
+
* book 内のブロックを表すインターフェース。
|
|
127
|
+
*
|
|
128
|
+
* @remarks
|
|
129
|
+
* - `kind` はプラグインの登録 ID(`createPluginRegistry` に渡した `kind`)と対応する。
|
|
130
|
+
*
|
|
131
|
+
* - `props` の値解決順序: `block.props` → `page.blockDefaults?.[kind]` → `PropDef.defaultProps`
|
|
132
|
+
*
|
|
133
|
+
* - `id` はブック全体でユニークである必要がある。
|
|
134
|
+
*
|
|
135
|
+
* - `P` のジェネリクスは `Page.blocks: Block[]` に格納すると `Record<string, Value>` に消去される。
|
|
136
|
+
*
|
|
137
|
+
* そのため `block.kind === "text"` のように `kind` で条件分岐しても TypeScript は `props` の型を絞り込まない。
|
|
138
|
+
*
|
|
139
|
+
* props に型安全にアクセスするには `pluginRegistry[block.kind]?.validateProps(block.props)` を使用すること。
|
|
140
|
+
*
|
|
141
|
+
* 実行時の型保証は `BlockPlugin.validateProps` が担保している。
|
|
142
|
+
*
|
|
143
|
+
* - `P` に関数・クラスインスタンス・DOM 要素など非シリアライズ可能な値を含めると、JSON 保存時に値が消失する。
|
|
144
|
+
*
|
|
145
|
+
* 型パラメータ `P` は {@link SerializableRecord}(= `Record<string, Value | undefined>`)互換であること。
|
|
146
|
+
*
|
|
147
|
+
* 検証には `satisfies SerializableRecord` を使用すること。
|
|
148
|
+
*/
|
|
149
|
+
declare interface Block<P extends SerializableRecord = Record<string, Value>> {
|
|
150
|
+
/** ブロック ID */
|
|
151
|
+
id: string;
|
|
152
|
+
/** ブロック種別(プラグインの kind) */
|
|
153
|
+
kind: string;
|
|
154
|
+
/** ブロックの位置とサイズ */
|
|
155
|
+
layout: BlockRect;
|
|
156
|
+
/** ブロック固有のプロパティ(プラグインごとに内容が異なる) */
|
|
157
|
+
props: P;
|
|
158
|
+
/** ブロックのスタイル */
|
|
159
|
+
style?: BlockStyle;
|
|
160
|
+
/** ブロックの動作設定 */
|
|
161
|
+
behavior?: BlockBehavior;
|
|
162
|
+
/** ブロックの表示/非表示を制御する条件式 */
|
|
163
|
+
hiddenBinding?: HiddenBinding;
|
|
164
|
+
/**
|
|
165
|
+
* form モードで送信するデフォルト値。
|
|
166
|
+
*
|
|
167
|
+
* 設定されている場合、edit モードで自動で初期値として使用される。
|
|
168
|
+
*/
|
|
169
|
+
initValue?: Value;
|
|
170
|
+
}
|
|
171
|
+
|
|
172
|
+
/**
|
|
173
|
+
* ブロックの動作設定。
|
|
174
|
+
*
|
|
175
|
+
* @remarks
|
|
176
|
+
* キーが存在する(`true`)場合に有効、`undefined` の場合は無効として扱う。
|
|
177
|
+
*/
|
|
178
|
+
declare interface BlockBehavior {
|
|
179
|
+
/**
|
|
180
|
+
* 読み取り専用フラグ。
|
|
181
|
+
*
|
|
182
|
+
* `NoteMode.VIEW` の強制読み取りとは独立して動作し、EDIT モードでも入力をブロックする。
|
|
183
|
+
*/
|
|
184
|
+
readOnly?: true;
|
|
185
|
+
/**
|
|
186
|
+
* コンテンツ実測幅にブロックを伸縮させる。
|
|
187
|
+
*
|
|
188
|
+
* `paper.autoWidth` と組み合わせるとキャンバス幅も追従する。
|
|
189
|
+
*/
|
|
190
|
+
widthFit?: true;
|
|
191
|
+
/**
|
|
192
|
+
* コンテンツ実測高さにブロックを伸縮させる。
|
|
193
|
+
*
|
|
194
|
+
* `paper.autoHeight` と組み合わせるとキャンバス高さも追従する。
|
|
195
|
+
*/
|
|
196
|
+
heightFit?: true;
|
|
197
|
+
}
|
|
198
|
+
|
|
199
|
+
/**
|
|
200
|
+
* ユーザー設定の枠線を SVG で描画するコンポーネント。
|
|
201
|
+
*
|
|
202
|
+
* 枠線スタイルが未設定、または全辺が空の場合は `null` を返します。
|
|
203
|
+
*
|
|
204
|
+
* @remarks
|
|
205
|
+
* **Canvas** — {@link BlockLayer} のブロック枠線描画サブコンポーネント。
|
|
206
|
+
*/
|
|
207
|
+
export declare const BlockBorder: FC<BlockBorderProps>;
|
|
208
|
+
|
|
209
|
+
/**
|
|
210
|
+
* `BlockBorder` コンポーネントへの props。
|
|
211
|
+
*/
|
|
212
|
+
export declare interface BlockBorderProps {
|
|
213
|
+
/** ブロックのサイズ(px)。 */
|
|
214
|
+
blockSizePx: BlockSizePx;
|
|
215
|
+
/** ユーザー設定の枠線スタイル。省略時は描画しない。 */
|
|
216
|
+
borderStyle?: BorderStyle;
|
|
217
|
+
/** z-index のベース値。 */
|
|
218
|
+
blockZIndex: number;
|
|
219
|
+
/** z-index のサブオフセット(既定値: `BLOCK_SUB_INDEX.BORDER`)。 */
|
|
220
|
+
subZIndex?: number;
|
|
221
|
+
/** `false` にすると枠線全体を非表示にする(既定値: `true`)。 */
|
|
222
|
+
visible?: boolean;
|
|
223
|
+
/** DPI 値。線幅の単位変換に使用する(既定値: `DEFAULT_DPI`)。 */
|
|
224
|
+
dpi?: number;
|
|
225
|
+
}
|
|
226
|
+
|
|
227
|
+
/**
|
|
228
|
+
* ブロックの背景を描画するコンポーネント。
|
|
229
|
+
*
|
|
230
|
+
* @remarks
|
|
231
|
+
* **Canvas** — {@link BlockLayer} のブロック背景描画サブコンポーネント。
|
|
232
|
+
*/
|
|
233
|
+
export declare const BlockCanvas: FC<BlockCanvasProps>;
|
|
234
|
+
|
|
235
|
+
/**
|
|
236
|
+
* `BlockCanvas` コンポーネントへの props。
|
|
237
|
+
*/
|
|
238
|
+
export declare interface BlockCanvasProps {
|
|
239
|
+
/** ブロックのサイズ(px)。 */
|
|
240
|
+
blockSizePx: BlockSizePx;
|
|
241
|
+
/** z-index のベース値。 */
|
|
242
|
+
blockZIndex: number;
|
|
243
|
+
/** z-index のサブオフセット(既定値: `BLOCK_SUB_INDEX.BG`)。 */
|
|
244
|
+
subZIndex?: number;
|
|
245
|
+
/** 背景色(既定値: `"transparent"`)。 */
|
|
246
|
+
backgroundColor?: string;
|
|
247
|
+
}
|
|
248
|
+
|
|
249
|
+
/**
|
|
250
|
+
* ブロックの全構成要素を統合するコンテナコンポーネント。
|
|
251
|
+
*
|
|
252
|
+
* `ref` で {@link BlockRef} を取得できます。
|
|
253
|
+
*
|
|
254
|
+
* @remarks
|
|
255
|
+
* **Canvas** — {@link BlockLayer} の1ブロック統合コンテナ。
|
|
256
|
+
*/
|
|
257
|
+
export declare const BlockContainer: NamedExoticComponent<BlockContainerProps & RefAttributes<BlockRef>>;
|
|
258
|
+
|
|
259
|
+
/**
|
|
260
|
+
* 1ブロック全体(背景・レンダラー・枠線・ガイド・バリデーション)をまとめるコンテナコンポーネント。
|
|
261
|
+
*/
|
|
262
|
+
export declare interface BlockContainerProps {
|
|
263
|
+
/** 対象ブロックデータ。 */
|
|
264
|
+
block: Block;
|
|
265
|
+
/** 解決済みプラグイン。 */
|
|
266
|
+
resolvedPlugin: ResolvedPlugin;
|
|
267
|
+
/** ブロックの位置とサイズ(px)。 */
|
|
268
|
+
blockRectPx: BlockRectPx;
|
|
269
|
+
/** z-index のベース値。 */
|
|
270
|
+
blockZIndex: number;
|
|
271
|
+
/** 表示モード(ビュー / フォーム / 編集)。 */
|
|
272
|
+
mode: NoteMode;
|
|
273
|
+
/** ブロックの現在値。 */
|
|
274
|
+
value: Value;
|
|
275
|
+
/** ブロックのデフォルト値設定。 */
|
|
276
|
+
blockDefaults?: BlockDefaults;
|
|
277
|
+
/** 値変更時のコールバック。 */
|
|
278
|
+
onValueChange?: (val: Value) => void;
|
|
279
|
+
/** フォーカス離脱時の値確定通知コールバック。 */
|
|
280
|
+
onBlur?: (value: Value) => void;
|
|
281
|
+
/** ガイド枠線を表示するか(既定値: `true`)。 */
|
|
282
|
+
showGuides?: boolean;
|
|
283
|
+
/** ユーザー設定枠線を表示するか(既定値: `true`)。 */
|
|
284
|
+
showBorder?: boolean;
|
|
285
|
+
/** デフォルトのガイド枠線スタイル。 */
|
|
286
|
+
defaultGuideBorder?: BorderStyle;
|
|
287
|
+
/** DPI 値(既定値: `DEFAULT_DPI`)。 */
|
|
288
|
+
dpi?: number;
|
|
289
|
+
/** ポインターイベントの通過設定(既定値: `"none"`)。 */
|
|
290
|
+
pointerEvents?: "auto" | "none";
|
|
291
|
+
/** バリデーションオーバーレイを表示するか(既定値: `false`)。 */
|
|
292
|
+
showValidation?: boolean;
|
|
293
|
+
/** バリデーションエラー一覧。 */
|
|
294
|
+
validationErrors?: ValidationError[];
|
|
295
|
+
/** ブロックの高さが動的に測定された際のコールバック。 */
|
|
296
|
+
onMeasureHeight?: (blockId: string, heightPx: number) => void;
|
|
297
|
+
/** ブロックの幅が動的に測定された際のコールバック。 */
|
|
298
|
+
onMeasureWidth?: (blockId: string, widthPx: number) => void;
|
|
299
|
+
/** フォーカス中のブロック ID。 */
|
|
300
|
+
focusedBlockId?: string;
|
|
301
|
+
/** 値バインディング用コンテキスト。 */
|
|
302
|
+
bindingContext?: BindingContext;
|
|
303
|
+
/** アクション実行用コンテキスト。 */
|
|
304
|
+
actionContext?: ActionContext;
|
|
305
|
+
}
|
|
306
|
+
|
|
307
|
+
/**
|
|
308
|
+
* ブロック種別ごとの共通デフォルトプロパティ。
|
|
309
|
+
*
|
|
310
|
+
* @remarks
|
|
311
|
+
* - キー: プラグインの kind(例: `"text"`, `"checkbox"`)
|
|
312
|
+
* - 値: プロパティの部分辞書。`block.props` にキーが存在しない場合に参照され、
|
|
313
|
+
* それも存在しない場合は `PropDef.defaultProps` にフォールバックする
|
|
314
|
+
*
|
|
315
|
+
* @example
|
|
316
|
+
* ```ts
|
|
317
|
+
* const defaults: BlockDefaults = {
|
|
318
|
+
* text: { fontFamily: "serif", verticalAlign: "center" },
|
|
319
|
+
* checkbox: { horizontalAlign: "center" },
|
|
320
|
+
* };
|
|
321
|
+
* ```
|
|
322
|
+
*/
|
|
323
|
+
declare type BlockDefaults = Record<string, Record<string, Value>>;
|
|
324
|
+
|
|
325
|
+
/**
|
|
326
|
+
* ブロック挿入 DnD で `dataTransfer` に格納するデータ。
|
|
327
|
+
*/
|
|
328
|
+
export declare interface BlockDragData {
|
|
329
|
+
/** 挿入するブロックの種別 ID。 */
|
|
330
|
+
kind: string;
|
|
331
|
+
/** デフォルトサイズ(グリッドセル数)。 */
|
|
332
|
+
defaultSize?: {
|
|
333
|
+
w: number;
|
|
334
|
+
h: number;
|
|
335
|
+
};
|
|
336
|
+
}
|
|
337
|
+
|
|
338
|
+
/**
|
|
339
|
+
* 編集ガイド用の薄い枠線を SVG で描画するコンポーネント。
|
|
340
|
+
*
|
|
341
|
+
* ユーザー設定枠線がない場合にレイアウト確認用として表示します。
|
|
342
|
+
*
|
|
343
|
+
* @remarks
|
|
344
|
+
* **Canvas** — {@link BlockLayer} のガイド枠線描画サブコンポーネント。
|
|
345
|
+
*/
|
|
346
|
+
export declare const BlockGuideBorder: FC<BlockGuideBorderProps>;
|
|
347
|
+
|
|
348
|
+
/**
|
|
349
|
+
* `BlockGuideBorder` コンポーネントへの props。
|
|
350
|
+
*/
|
|
351
|
+
export declare interface BlockGuideBorderProps {
|
|
352
|
+
/** ブロックのサイズ(px)。 */
|
|
353
|
+
blockSizePx: BlockSizePx;
|
|
354
|
+
/** z-index のベース値。 */
|
|
355
|
+
blockZIndex: number;
|
|
356
|
+
/** z-index のサブオフセット(既定値: `BLOCK_SUB_INDEX.GUIDE`)。 */
|
|
357
|
+
subZIndex?: number;
|
|
358
|
+
/** 表示するガイド枠線スタイル(既定値: `DEFAULT_GUIDE_BORDER`)。 */
|
|
359
|
+
borderStyle?: BorderStyle;
|
|
360
|
+
/** `false` にするとガイド枠線全体を非表示にする(既定値: `true`)。 */
|
|
361
|
+
visible?: boolean;
|
|
362
|
+
}
|
|
363
|
+
|
|
364
|
+
/**
|
|
365
|
+
* ブロック一覧を描画するレイヤーコンポーネント。
|
|
366
|
+
*
|
|
367
|
+
* @remarks
|
|
368
|
+
* **Canvas** — {@link Note} 実装を担う低レベルブロックレンダリングレイヤー。
|
|
369
|
+
*
|
|
370
|
+
* 通常は {@link Note} を使用する。
|
|
371
|
+
*/
|
|
372
|
+
export declare const BlockLayer: MemoExoticComponent<({ blocks, pluginRegistry, mode, values, blockDefaults, selectedBlockIds, getBlockRectPx, onValueChange, onBlur, showGuides, showBorder, defaultGuideBorder, dpi, showValidation, validationErrors, onMeasureHeight, onMeasureWidth, focusedBlockId, bindingContext, actionContext, }: BlockLayerProps) => JSX.Element>;
|
|
373
|
+
|
|
374
|
+
/**
|
|
375
|
+
* `BlockLayer` コンポーネントへの props。
|
|
376
|
+
*/
|
|
377
|
+
export declare interface BlockLayerProps {
|
|
378
|
+
/** 描画対象のブロック一覧。 */
|
|
379
|
+
blocks: Block[];
|
|
380
|
+
/** プラグインレジストリ。 */
|
|
381
|
+
pluginRegistry: PluginRegistry;
|
|
382
|
+
/** 表示モード。 */
|
|
383
|
+
mode: NoteMode;
|
|
384
|
+
/** ブロック ID → 現在値のマップ。 */
|
|
385
|
+
values: Record<string, Value>;
|
|
386
|
+
/** ブロックのデフォルト値設定。 */
|
|
387
|
+
blockDefaults?: BlockDefaults;
|
|
388
|
+
/** 選択中のブロック ID 一覧(既定値: `[]`)。 */
|
|
389
|
+
selectedBlockIds?: string[];
|
|
390
|
+
/** ブロックからキャンバス上の矩形座標(px)を返す関数。 */
|
|
391
|
+
getBlockRectPx: (block: Block) => BlockRectPx;
|
|
392
|
+
/** ブロックの値が変更されたときのコールバック。 */
|
|
393
|
+
onValueChange?: (blockId: string, value: Value) => void;
|
|
394
|
+
/** フォーカス離脱時の値確定通知コールバック。 */
|
|
395
|
+
onBlur?: (blockId: string, value: Value) => void;
|
|
396
|
+
/** ガイド枠線を表示するか(既定値: `true`)。 */
|
|
397
|
+
showGuides?: boolean;
|
|
398
|
+
/** ユーザー設定枠線を表示するか(既定値: `true`)。 */
|
|
399
|
+
showBorder?: boolean;
|
|
400
|
+
/** デフォルトのガイド枠線スタイル。 */
|
|
401
|
+
defaultGuideBorder?: BorderStyle;
|
|
402
|
+
/** DPI 値(既定値: `DEFAULT_DPI`)。 */
|
|
403
|
+
dpi?: number;
|
|
404
|
+
/** バリデーションオーバーレイを表示するか(既定値: `false`)。 */
|
|
405
|
+
showValidation?: boolean;
|
|
406
|
+
/** ブロック ID → バリデーションエラー一覧のマップ。 */
|
|
407
|
+
validationErrors?: Record<string, ValidationError[]>;
|
|
408
|
+
/** ブロックの高さが測定された際のコールバック。 */
|
|
409
|
+
onMeasureHeight?: (blockId: string, heightPx: number) => void;
|
|
410
|
+
/** ブロックの幅が測定された際のコールバック。 */
|
|
411
|
+
onMeasureWidth?: (blockId: string, widthPx: number) => void;
|
|
412
|
+
/** フォーカス中のブロック ID。 */
|
|
413
|
+
focusedBlockId?: string;
|
|
414
|
+
/** 値バインディング用コンテキスト。 */
|
|
415
|
+
bindingContext?: BindingContext;
|
|
416
|
+
/** アクション実行用コンテキスト。 */
|
|
417
|
+
actionContext?: ActionContext;
|
|
418
|
+
}
|
|
419
|
+
|
|
420
|
+
/**
|
|
421
|
+
* ブロックプラグインの定義。
|
|
422
|
+
*
|
|
423
|
+
* @remarks
|
|
424
|
+
* 型パラメータ `P` は JSON シリアライズ可能なプロパティのみを持つこと。
|
|
425
|
+
*
|
|
426
|
+
* 関数・クラスインスタンス・DOM 要素などの非 serializable な値を含めると、`book` を JSON 保存・復元した際に値が消失する。
|
|
427
|
+
*
|
|
428
|
+
* `P extends BaseBlockProps` は TypeScript 上の型エラーとならないため、非シリアライズ型を渡してもコンパイル時には検知されない。
|
|
429
|
+
*
|
|
430
|
+
* `P` の serializable 性を型レベルで検証するには `satisfies SerializableRecord` を使う。
|
|
431
|
+
*
|
|
432
|
+
* @example
|
|
433
|
+
* ```ts
|
|
434
|
+
* import type { SerializableRecord } from "@tatamicks/core";
|
|
435
|
+
*
|
|
436
|
+
* interface MyProps extends BaseBlockProps {
|
|
437
|
+
* label: string;
|
|
438
|
+
* count: number;
|
|
439
|
+
* }
|
|
440
|
+
* // ✅ シリアライズ可能か検証
|
|
441
|
+
* type _check = MyProps satisfies SerializableRecord;
|
|
442
|
+
* ```
|
|
443
|
+
*/
|
|
444
|
+
export declare interface BlockPlugin<P extends BaseBlockProps = BaseBlockProps, V = Value> {
|
|
445
|
+
/** プラグインの一意識別子。`block.kind` と対応する */
|
|
446
|
+
kind: string;
|
|
447
|
+
/** UI表示・アイコン・デフォルトサイズ等のメタ情報 */
|
|
448
|
+
meta: BlockPluginMeta;
|
|
449
|
+
/**
|
|
450
|
+
* ブロックを描画する `forwardRef` コンポーネント。
|
|
451
|
+
*
|
|
452
|
+
* `BlockRef.focus()` を `useImperativeHandle` で公開する必要がある。
|
|
453
|
+
*
|
|
454
|
+
* @example
|
|
455
|
+
* ```tsx
|
|
456
|
+
* const MyRenderer = forwardRef<BlockRef, RendererProps<MyProps, string>>(
|
|
457
|
+
* ({ props, value, onChange, readOnly }, ref) => {
|
|
458
|
+
* const inputRef = useRef<HTMLInputElement>(null);
|
|
459
|
+
* useImperativeHandle(ref, () => ({ focus: () => inputRef.current?.focus() }));
|
|
460
|
+
* return (
|
|
461
|
+
* <input
|
|
462
|
+
* ref={inputRef}
|
|
463
|
+
* value={value ?? ""}
|
|
464
|
+
* readOnly={readOnly}
|
|
465
|
+
* onChange={(e) => onChange(e.target.value)}
|
|
466
|
+
* />
|
|
467
|
+
* );
|
|
468
|
+
* },
|
|
469
|
+
* );
|
|
470
|
+
* ```
|
|
471
|
+
*/
|
|
472
|
+
Renderer: ForwardRefExoticComponent<RendererProps<P, V> & RefAttributes<BlockRef>>;
|
|
473
|
+
/**
|
|
474
|
+
* プロパティパネルに表示するプロパティ定義一覧。
|
|
475
|
+
*
|
|
476
|
+
* `defaultProps` は配列順に合成され、同じキーは後ろの定義が優先される。
|
|
477
|
+
*/
|
|
478
|
+
properties: PropDef[];
|
|
479
|
+
/**
|
|
480
|
+
* ストレージから読み込んだ生の `block.props` をサニタイズして型安全な Props に変換する。
|
|
481
|
+
*
|
|
482
|
+
* 省略時は raw オブジェクトをそのまま使用する。
|
|
483
|
+
*/
|
|
484
|
+
validateProps?: (props: unknown) => P;
|
|
485
|
+
/**
|
|
486
|
+
* 外部 state から読み込んだ生の値をサニタイズする。
|
|
487
|
+
*
|
|
488
|
+
* `undefined` を返した場合は `block.initValue`、それもなければ raw 値にフォールバックする。
|
|
489
|
+
*
|
|
490
|
+
* フォールバックを指示する場合にのみ `undefined` を使い、`null` は正当な値として返せる。
|
|
491
|
+
*
|
|
492
|
+
* 省略時は raw 値をそのまま使用する。
|
|
493
|
+
*
|
|
494
|
+
* 戻り値 `V` は {@link Value} 互換型(JSON serializable)にすること。
|
|
495
|
+
*
|
|
496
|
+
* 日付は `Date` インスタンスではなく ISO 8601 文字列(例: `"2025-01-01"`)で表現する。
|
|
497
|
+
*/
|
|
498
|
+
validateValue?: (value: unknown, props: P) => V | undefined;
|
|
499
|
+
/** 旧バージョンの props を現バージョンにマイグレーションする。`validateProps` の前に呼ばれる */
|
|
500
|
+
migrateProps?: (props: unknown) => Record<string, unknown>;
|
|
501
|
+
}
|
|
502
|
+
|
|
503
|
+
/**
|
|
504
|
+
* pluginのメタ情報(UI表示・アイコン・デフォルトサイズ)。
|
|
505
|
+
*/
|
|
506
|
+
export declare interface BlockPluginMeta {
|
|
507
|
+
/** UIに表示されるブロック名 */
|
|
508
|
+
displayName: string;
|
|
509
|
+
/** ブロックの説明文 */
|
|
510
|
+
description?: string;
|
|
511
|
+
/** ブロックのグリッド上のデフォルトサイズ */
|
|
512
|
+
defaultSize?: BlockSize;
|
|
513
|
+
/** ブロック選択パネルなどで使用するアイコンコンポーネント */
|
|
514
|
+
icon?: ComponentType<{
|
|
515
|
+
className?: string;
|
|
516
|
+
}>;
|
|
517
|
+
}
|
|
518
|
+
|
|
519
|
+
/**
|
|
520
|
+
* ブロックのグリッド上座標。
|
|
521
|
+
*/
|
|
522
|
+
declare interface BlockPos {
|
|
523
|
+
/** グリッド列の開始位置 (0-based) */
|
|
524
|
+
x: number;
|
|
525
|
+
/** グリッド行の開始位置 (0-based) */
|
|
526
|
+
y: number;
|
|
527
|
+
}
|
|
528
|
+
|
|
529
|
+
/**
|
|
530
|
+
* キャンバス上のブロック位置(px 単位)。
|
|
531
|
+
*/
|
|
532
|
+
declare interface BlockPosPx {
|
|
533
|
+
/** 左端の x 座標(px)。 */
|
|
534
|
+
left: number;
|
|
535
|
+
/** 上端の y 座標(px)。 */
|
|
536
|
+
top: number;
|
|
537
|
+
}
|
|
538
|
+
|
|
539
|
+
/**
|
|
540
|
+
* ブロックのグリッド上の位置とサイズを合わせた矩形領域。
|
|
541
|
+
*/
|
|
542
|
+
declare interface BlockRect extends BlockPos, BlockSize {
|
|
543
|
+
}
|
|
544
|
+
|
|
545
|
+
/**
|
|
546
|
+
* キャンバス上のブロック矩形(位置 + サイズ)(px 単位)。
|
|
547
|
+
*/
|
|
548
|
+
declare interface BlockRectPx extends BlockPosPx, BlockSizePx {
|
|
549
|
+
}
|
|
550
|
+
|
|
551
|
+
/**
|
|
552
|
+
* Rendererが forwardRef で外部に公開するインターフェース。
|
|
553
|
+
*/
|
|
554
|
+
export declare interface BlockRef {
|
|
555
|
+
focus: () => void;
|
|
556
|
+
}
|
|
557
|
+
|
|
558
|
+
/**
|
|
559
|
+
* プラグインの `Renderer` を実行し、コンテナ内にマウントするコンポーネント。
|
|
560
|
+
*
|
|
561
|
+
* `ref` で {@link BlockRef} を取得できます。
|
|
562
|
+
*
|
|
563
|
+
* @remarks
|
|
564
|
+
* **Canvas** — {@link BlockLayer} 内でプラグインレンダラーを実行するサブコンポーネント。
|
|
565
|
+
*/
|
|
566
|
+
export declare const BlockRenderer: NamedExoticComponent<BlockRendererProps & RefAttributes<BlockRef>>;
|
|
567
|
+
|
|
568
|
+
/**
|
|
569
|
+
* `BlockRenderer` コンポーネントへの props。
|
|
570
|
+
*/
|
|
571
|
+
export declare interface BlockRendererProps {
|
|
572
|
+
/** ブロックの ID。 */
|
|
573
|
+
id: string;
|
|
574
|
+
/** 解決済みプラグイン。 */
|
|
575
|
+
resolvedPlugin: ResolvedPlugin;
|
|
576
|
+
/** プロパティマップ(プラグインデフォルトとユーザー値をマージ済み)。 */
|
|
577
|
+
props: Record<string, Value>;
|
|
578
|
+
/** ブロックの現在値。 */
|
|
579
|
+
value: Value;
|
|
580
|
+
/** 値変更時のコールバック。読み取り専用の場合は不要。 */
|
|
581
|
+
onChange?: (value: Value) => void;
|
|
582
|
+
/** `true` の場合、レンダラーは読み取り専用で入力を受け付けない。 */
|
|
583
|
+
readOnly: boolean;
|
|
584
|
+
/** 表示モード。 */
|
|
585
|
+
mode: NoteMode;
|
|
586
|
+
/** ブロックのサイズ(px)。 */
|
|
587
|
+
blockSizePx: BlockSizePx;
|
|
588
|
+
/** z-index のベース値。 */
|
|
589
|
+
blockZIndex: number;
|
|
590
|
+
/** z-index のサブオフセット(既定値: `BLOCK_SUB_INDEX.CONTENT`)。 */
|
|
591
|
+
subZIndex?: number;
|
|
592
|
+
/** 高さが動的に測定された際のコールバック。 */
|
|
593
|
+
onMeasureHeight?: (heightPx: number) => void;
|
|
594
|
+
/** 幅が動的に測定された際のコールバック。 */
|
|
595
|
+
onMeasureWidth?: (widthPx: number) => void;
|
|
596
|
+
/** フォーカス離脱時の値確定通知コールバック。 */
|
|
597
|
+
onBlur?: (value: Value) => void;
|
|
598
|
+
/** 値バインディング用コンテキスト。 */
|
|
599
|
+
bindingContext?: BindingContext;
|
|
600
|
+
/** アクション実行用コンテキスト。 */
|
|
601
|
+
actionContext?: ActionContext;
|
|
602
|
+
}
|
|
603
|
+
|
|
604
|
+
/**
|
|
605
|
+
* ブロックのグリッド上サイズ。
|
|
606
|
+
*/
|
|
607
|
+
declare interface BlockSize {
|
|
608
|
+
/** 列方向の幅(列数) */
|
|
609
|
+
w: number;
|
|
610
|
+
/** 行方向の高さ(行数) */
|
|
611
|
+
h: number;
|
|
612
|
+
}
|
|
613
|
+
|
|
614
|
+
/**
|
|
615
|
+
* キャンバス上のブロックサイズ(px 単位)。
|
|
616
|
+
*/
|
|
617
|
+
declare interface BlockSizePx {
|
|
618
|
+
/** 幅(px)。 */
|
|
619
|
+
width: number;
|
|
620
|
+
/** 高さ(px)。 */
|
|
621
|
+
height: number;
|
|
622
|
+
}
|
|
623
|
+
|
|
624
|
+
/**
|
|
625
|
+
* ブロックのスタイル定義。
|
|
626
|
+
*/
|
|
627
|
+
declare interface BlockStyle {
|
|
628
|
+
/** 背景色 (CSS color 値) */
|
|
629
|
+
backgroundColor?: string;
|
|
630
|
+
/** 枠線スタイル */
|
|
631
|
+
border?: BorderStyle;
|
|
632
|
+
}
|
|
633
|
+
|
|
634
|
+
/**
|
|
635
|
+
* 複数ページのフォームを表すスキーマ(Book)。
|
|
636
|
+
*
|
|
637
|
+
* @remarks
|
|
638
|
+
* - `pages` は最低1ページ必須(タプル型で空配列を禁止)
|
|
639
|
+
* - `Page.id` はオプション。index による識別がベースだが、並び替え・外部同期には `id` を利用する
|
|
640
|
+
* - `block.id` はブック全体でユニークであること
|
|
641
|
+
* - `paper` はブック全体で共通(全ページ同一の用紙設定を維持する)
|
|
642
|
+
*/
|
|
643
|
+
declare interface Book {
|
|
644
|
+
/** ブック全体の用紙設定。全ページ共通(PDF の慣習に従いページごとの変更は不可) */
|
|
645
|
+
paper: Paper;
|
|
646
|
+
/** ページ一覧(0-based インデックス順) */
|
|
647
|
+
pages: [Page, ...Page[]];
|
|
648
|
+
/** ブックレベルのメタデータ。例: `{ title: "月次業務報告書", version: "2" }` */
|
|
649
|
+
metaData?: Record<string, Value>;
|
|
650
|
+
}
|
|
651
|
+
|
|
652
|
+
/**
|
|
653
|
+
* {@link useBookBindingContext} のオプション。
|
|
654
|
+
*/
|
|
655
|
+
export declare interface BookBindingContextOptions {
|
|
656
|
+
/**
|
|
657
|
+
* `grid.*` パスの解決対象ページインデックス。デフォルト: 0。
|
|
658
|
+
*/
|
|
659
|
+
pageIdx?: number;
|
|
660
|
+
/**
|
|
661
|
+
* ユーザー定義の追加 BindingContext。
|
|
662
|
+
* 組み込みパスより優先して参照される。
|
|
663
|
+
* `get` が `undefined` を返した場合 / `set` が処理しなかった場合は組み込みにフォールバックする。
|
|
664
|
+
* 注意: `set` のフォールバック判定は `extra.get(path)` が `undefined` かどうかを基準にする。
|
|
665
|
+
*/
|
|
666
|
+
extra?: BindingContext;
|
|
667
|
+
}
|
|
668
|
+
|
|
669
|
+
/**
|
|
670
|
+
* 枠線の幅に使用できる単位の配列。
|
|
671
|
+
*/
|
|
672
|
+
export declare const BORDER_UNITS: readonly ["px", "pt", "mm"];
|
|
673
|
+
|
|
674
|
+
/**
|
|
675
|
+
* 四辺それぞれの枠線スタイル定義。省略した辺は枠線なし。
|
|
676
|
+
*
|
|
677
|
+
* `all` を指定した場合、各辺に個別指定がなければ `all` の値が全辺に適用される。
|
|
678
|
+
*/
|
|
679
|
+
declare interface BorderStyle {
|
|
680
|
+
top?: LineStyle;
|
|
681
|
+
right?: LineStyle;
|
|
682
|
+
bottom?: LineStyle;
|
|
683
|
+
left?: LineStyle;
|
|
684
|
+
/** 全辺共通スタイル。各辺に個別指定がない場合のフォールバック */
|
|
685
|
+
all?: LineStyle;
|
|
686
|
+
}
|
|
687
|
+
|
|
688
|
+
/**
|
|
689
|
+
* 枠線の幅に使用できる単位。
|
|
690
|
+
*/
|
|
691
|
+
declare type BorderUnit = (typeof BORDER_UNITS)[number];
|
|
692
|
+
|
|
693
|
+
/**
|
|
694
|
+
* 組み込みアクション ID のユニオン型。
|
|
695
|
+
*
|
|
696
|
+
* `ActionContext.execute` / `ActionContext.isEnabled` の引数に指定したとき IDE の補完候補として表示される。
|
|
697
|
+
* カスタムアクション ID は任意の `string` として渡せる。
|
|
698
|
+
*/
|
|
699
|
+
declare type BuiltinActionId = "undo" | "redo" | "paste" | "delete" | "copy" | "duplicate" | "addPage" | "deletePage" | "selectBlocks" | "goToPage" | "updateBlocks";
|
|
700
|
+
|
|
701
|
+
/* Excluded from this release type: ButtonAction */
|
|
702
|
+
|
|
703
|
+
/**
|
|
704
|
+
* `buttonAction` prop 定義。
|
|
705
|
+
*
|
|
706
|
+
* @remarks
|
|
707
|
+
* **Canvas** — カスタムプラグイン専用。
|
|
708
|
+
*/
|
|
709
|
+
export declare const buttonActionProp: {
|
|
710
|
+
kind: string;
|
|
711
|
+
defaultProps: {
|
|
712
|
+
action: string;
|
|
713
|
+
};
|
|
714
|
+
};
|
|
715
|
+
|
|
716
|
+
/**
|
|
717
|
+
* ボタンクリック時のアクション設定 props。
|
|
718
|
+
*/
|
|
719
|
+
export declare interface ButtonActionProps {
|
|
720
|
+
/** クリック時のアクション。文字列の場合はパス評価、オブジェクトの場合は指定パスへ値をセットする。 */
|
|
721
|
+
action?: string | {
|
|
722
|
+
path: string;
|
|
723
|
+
value: Value;
|
|
724
|
+
};
|
|
725
|
+
}
|
|
726
|
+
|
|
727
|
+
/**
|
|
728
|
+
* ボタンブロックの props 型。
|
|
729
|
+
*/
|
|
730
|
+
export declare type ButtonBlockProps = BaseBlockProps & ButtonContentProps & ButtonActionProps;
|
|
731
|
+
|
|
732
|
+
/**
|
|
733
|
+
* ボタンブロックの値型。ボタンは値を持たないため常に `null`。
|
|
734
|
+
*
|
|
735
|
+
* @remarks
|
|
736
|
+
* **Canvas** — カスタムプラグイン向けの型。
|
|
737
|
+
*/
|
|
738
|
+
export declare type ButtonBlockValue = null;
|
|
739
|
+
|
|
740
|
+
/**
|
|
741
|
+
* `buttonContent` prop 定義。
|
|
742
|
+
*
|
|
743
|
+
* @remarks
|
|
744
|
+
* **Canvas** — カスタムプラグイン専用。
|
|
745
|
+
*/
|
|
746
|
+
export declare const buttonContentProp: {
|
|
747
|
+
kind: string;
|
|
748
|
+
defaultProps: {
|
|
749
|
+
label: string;
|
|
750
|
+
icon: string;
|
|
751
|
+
iconPath: string;
|
|
752
|
+
title: string;
|
|
753
|
+
};
|
|
754
|
+
};
|
|
755
|
+
|
|
756
|
+
/**
|
|
757
|
+
* ボタンの表示内容(ラベル・アイコン)props。
|
|
758
|
+
*/
|
|
759
|
+
export declare interface ButtonContentProps {
|
|
760
|
+
/** ボタンに表示するテキスト。 */
|
|
761
|
+
label?: string;
|
|
762
|
+
/** アイコン文字列(Unicode 絵文字等を `<span>` テキストとして表示)。 */
|
|
763
|
+
icon?: string;
|
|
764
|
+
/** SVG パスデータ。`icon` より優先される。 */
|
|
765
|
+
iconPath?: string;
|
|
766
|
+
/** ツールチップに表示するテキスト。 */
|
|
767
|
+
title?: string;
|
|
768
|
+
}
|
|
769
|
+
|
|
770
|
+
/**
|
|
771
|
+
* ボタンブロックのプラグイン定義。
|
|
772
|
+
*
|
|
773
|
+
* `kind: "button"` で登録され、クリックで `action` prop に定義したバインディング操作を実行する。
|
|
774
|
+
*
|
|
775
|
+
* @remarks
|
|
776
|
+
* **Canvas** — カスタムプラグインの実装例。
|
|
777
|
+
*
|
|
778
|
+
* 標準フォーム構築では `createPluginRegistry` に渡すだけで使用できる。
|
|
779
|
+
*/
|
|
780
|
+
export declare const ButtonPlugin: BlockPlugin<ButtonBlockProps, ButtonBlockValue>;
|
|
781
|
+
|
|
782
|
+
/**
|
|
783
|
+
* ボタンブロックのレンダラーコンポーネント。
|
|
784
|
+
*
|
|
785
|
+
* `action` props に応じてクリック時にバインディング操作またはアクション実行を行う。
|
|
786
|
+
*
|
|
787
|
+
* @remarks
|
|
788
|
+
* **Canvas** — ButtonPlugin と組み合わせて使用する実装コンポーネント。
|
|
789
|
+
*/
|
|
790
|
+
export declare const ButtonRenderer: ForwardRefExoticComponent<RendererProps<ButtonBlockProps, null> & RefAttributes<BlockRef>>;
|
|
791
|
+
|
|
792
|
+
/**
|
|
793
|
+
* チェックボックスブロックの props 型。
|
|
794
|
+
*/
|
|
795
|
+
export declare type CheckboxBlockProps = BaseBlockProps & RequiredProps & CheckboxStyleProps;
|
|
796
|
+
|
|
797
|
+
/**
|
|
798
|
+
* チェックボックスブロックの値型。
|
|
799
|
+
*/
|
|
800
|
+
export declare type CheckboxBlockValue = boolean;
|
|
801
|
+
|
|
802
|
+
/**
|
|
803
|
+
* チェックボックスブロックのレンダラーコンポーネント。
|
|
804
|
+
*
|
|
805
|
+
* `value`(`boolean`)のトグル操作をし、SVG ビジュアルでチェック状態を表示する。
|
|
806
|
+
*/
|
|
807
|
+
export declare const CheckboxRenderer: ForwardRefExoticComponent<RendererProps<CheckboxBlockProps, boolean> & RefAttributes<BlockRef>>;
|
|
808
|
+
|
|
809
|
+
/**
|
|
810
|
+
* チェックボックスの外観カスタマイズ設定。
|
|
811
|
+
*/
|
|
812
|
+
export declare interface CheckboxStyleConfig {
|
|
813
|
+
/** チェックボックス全体のサイズ。 */
|
|
814
|
+
checkboxSize?: Dimension;
|
|
815
|
+
/** 枠の太さ。 */
|
|
816
|
+
borderWidth?: Dimension;
|
|
817
|
+
/** 枠の色。 */
|
|
818
|
+
borderColor?: string;
|
|
819
|
+
/** チェックマークの線の太さ。 */
|
|
820
|
+
checkWidth?: Dimension;
|
|
821
|
+
/** チェックマークの色。 */
|
|
822
|
+
checkColor?: string;
|
|
823
|
+
/** 未チェック時の背景色。 */
|
|
824
|
+
backgroundColor?: string;
|
|
825
|
+
/** チェック時の背景色。 */
|
|
826
|
+
checkedBackgroundColor?: string;
|
|
827
|
+
}
|
|
828
|
+
|
|
829
|
+
/**
|
|
830
|
+
* `checkboxStyle` prop 定義。チェックボックスの外観デフォルト値を含む。
|
|
831
|
+
*/
|
|
832
|
+
export declare const checkboxStyleProp: {
|
|
833
|
+
kind: string;
|
|
834
|
+
defaultProps: {
|
|
835
|
+
styleConfig: {
|
|
836
|
+
checkboxSize: {
|
|
837
|
+
value: number;
|
|
838
|
+
unit: string;
|
|
839
|
+
};
|
|
840
|
+
borderWidth: {
|
|
841
|
+
value: number;
|
|
842
|
+
unit: string;
|
|
843
|
+
};
|
|
844
|
+
borderColor: string;
|
|
845
|
+
checkWidth: {
|
|
846
|
+
value: number;
|
|
847
|
+
unit: string;
|
|
848
|
+
};
|
|
849
|
+
checkColor: string;
|
|
850
|
+
backgroundColor: string;
|
|
851
|
+
checkedBackgroundColor: string;
|
|
852
|
+
};
|
|
853
|
+
};
|
|
854
|
+
};
|
|
855
|
+
|
|
856
|
+
/**
|
|
857
|
+
* チェックボックスの外観カスタマイズ props。
|
|
858
|
+
*/
|
|
859
|
+
export declare interface CheckboxStyleProps {
|
|
860
|
+
/** 外観カスタマイズ設定。 */
|
|
861
|
+
styleConfig?: CheckboxStyleConfig;
|
|
862
|
+
}
|
|
863
|
+
|
|
864
|
+
/**
|
|
865
|
+
* デフォルトの DPI 値。
|
|
866
|
+
*
|
|
867
|
+
* CSS の基準解像度である 96dpi を採用している。
|
|
868
|
+
*/
|
|
869
|
+
export declare const DEFAULT_DPI = 96;
|
|
870
|
+
|
|
871
|
+
/**
|
|
872
|
+
* ユーザー設定枠線が未設定のブロックに適用するデフォルトのガイド枠線スタイル。
|
|
873
|
+
*
|
|
874
|
+
* @remarks
|
|
875
|
+
* **Canvas** — {@link BlockGuideBorder} のデフォルト枠線スタイル。
|
|
876
|
+
*/
|
|
877
|
+
export declare const DEFAULT_GUIDE_BORDER: BorderStyle;
|
|
878
|
+
|
|
879
|
+
/**
|
|
880
|
+
* 数値と単位の組み合わせ。
|
|
881
|
+
*/
|
|
882
|
+
declare interface Dimension<U extends Unit = Unit> {
|
|
883
|
+
/** 数値 */
|
|
884
|
+
value: number;
|
|
885
|
+
/** 単位 */
|
|
886
|
+
unit: U;
|
|
887
|
+
}
|
|
888
|
+
|
|
889
|
+
/**
|
|
890
|
+
* Dimension<PaperUnit> バインディング用の 2 列入力 atom widget。
|
|
891
|
+
*
|
|
892
|
+
* @remarks
|
|
893
|
+
* **Canvas** — カスタムシェル構築専用。
|
|
894
|
+
*
|
|
895
|
+
* 列 0 (1fr): 数値入力テキストブロック → `{binding}.value`
|
|
896
|
+
*
|
|
897
|
+
* 列 1 (15mm): 単位 select ブロック → `{binding}.unit`
|
|
898
|
+
*
|
|
899
|
+
* binding には Dimension のルートパス(例: "paper.size.width")を渡す。
|
|
900
|
+
*
|
|
901
|
+
* autoWidth: true により widget 自体もコンテナ幅いっぱいに広がる。
|
|
902
|
+
*
|
|
903
|
+
* @example
|
|
904
|
+
* ```ts
|
|
905
|
+
* // NoteBlock として使う場合
|
|
906
|
+
* {
|
|
907
|
+
* id: "width-input",
|
|
908
|
+
* kind: "note",
|
|
909
|
+
* layout: { x: 0, y: 0, w: 5, h: 2 },
|
|
910
|
+
* props: dimensionInputWidget("paper.size.width"),
|
|
911
|
+
* }
|
|
912
|
+
* ```
|
|
913
|
+
*/
|
|
914
|
+
export declare function dimensionInputWidget(binding: string): NoteBlockProps;
|
|
915
|
+
|
|
916
|
+
/**
|
|
917
|
+
* {@link Dimension} オブジェクトを寸法文字列(例: `"210mm"`)に変換する。
|
|
918
|
+
*/
|
|
919
|
+
export declare function dimensionToString<U extends Unit>(dim: Dimension<U>): string;
|
|
920
|
+
|
|
921
|
+
/**
|
|
922
|
+
* ドラッグ中の詳細状態
|
|
923
|
+
*
|
|
924
|
+
* @remarks
|
|
925
|
+
* **Canvas** — {@link InteractionLayer} のドラッグ中状態型。
|
|
926
|
+
*/
|
|
927
|
+
export declare interface DraggingState {
|
|
928
|
+
type: DragType;
|
|
929
|
+
blockIds: string[];
|
|
930
|
+
startGrid: {
|
|
931
|
+
col: number;
|
|
932
|
+
row: number;
|
|
933
|
+
};
|
|
934
|
+
currentGrid: {
|
|
935
|
+
col: number;
|
|
936
|
+
row: number;
|
|
937
|
+
};
|
|
938
|
+
/** マウスの現在座標 (px, キャンバス相対)。キャンバス外ゴースト表示用 */
|
|
939
|
+
currentMousePx?: {
|
|
940
|
+
x: number;
|
|
941
|
+
y: number;
|
|
942
|
+
};
|
|
943
|
+
/** リサイズ用ハンドル方向 */
|
|
944
|
+
handle?: ResizeHandle;
|
|
945
|
+
/** 挿入用: プラグイン種別 */
|
|
946
|
+
pluginKind?: string;
|
|
947
|
+
/** 挿入用: デフォルトサイズ */
|
|
948
|
+
defaultSize?: {
|
|
949
|
+
w: number;
|
|
950
|
+
h: number;
|
|
951
|
+
};
|
|
952
|
+
/** キャンバス外フラグ */
|
|
953
|
+
isOutside?: boolean;
|
|
954
|
+
}
|
|
955
|
+
|
|
956
|
+
/**
|
|
957
|
+
* ドラッグ種別
|
|
958
|
+
*
|
|
959
|
+
* @remarks
|
|
960
|
+
* **Canvas** — {@link InteractionLayer} のドラッグ種別。
|
|
961
|
+
*/
|
|
962
|
+
export declare enum DragType {
|
|
963
|
+
MOVE = "move",
|
|
964
|
+
RESIZE = "resize",
|
|
965
|
+
INSERT = "insert"
|
|
966
|
+
}
|
|
967
|
+
|
|
968
|
+
/**
|
|
969
|
+
* チェックボックス用バリデーション。
|
|
970
|
+
*
|
|
971
|
+
* エラーがなければ空配列を返す。
|
|
972
|
+
*/
|
|
973
|
+
export declare function evaluateCheckboxValidation(schema: RequiredSchema, value: boolean | undefined): ValidationError[];
|
|
974
|
+
|
|
975
|
+
/**
|
|
976
|
+
* `ValidationSchema` の設定値と実際の値を照合し、違反しているエラーを返す。
|
|
977
|
+
*
|
|
978
|
+
* エラーがなければ空配列を返す。
|
|
979
|
+
*/
|
|
980
|
+
export declare function evaluateValidation(schema: ValidationSchema, value: string | undefined): ValidationError[];
|
|
981
|
+
|
|
982
|
+
/**
|
|
983
|
+
* ボタンの `action` 設定に応じてクリック時の処理を実行する。
|
|
984
|
+
*
|
|
985
|
+
* - 文字列 action: `actionContext.execute` を呼び出す
|
|
986
|
+
* - オブジェクト action: `bindingContext.set` で指定パスに値をセットする
|
|
987
|
+
* - どちらでもない場合: `onChange(null)` を呼び出す
|
|
988
|
+
*
|
|
989
|
+
* @remarks
|
|
990
|
+
* **Canvas** — カスタムプラグイン実装者向け
|
|
991
|
+
*/
|
|
992
|
+
export declare function executeButtonAction(action: ButtonAction, { actionContext, bindingContext, onChange }: ExecuteContext): void;
|
|
993
|
+
|
|
994
|
+
/* Excluded from this release type: ExecuteContext */
|
|
995
|
+
|
|
996
|
+
/**
|
|
997
|
+
* フォントサイズに使用できる単位の配列。
|
|
998
|
+
*/
|
|
999
|
+
export declare const FONT_UNITS: readonly ["pt", "px", "mm"];
|
|
1000
|
+
|
|
1001
|
+
/**
|
|
1002
|
+
* フォントスタイルプロパティの `PropDef`。
|
|
1003
|
+
*
|
|
1004
|
+
* @remarks
|
|
1005
|
+
* **Canvas** — ブロックプラグイン実装時に `plugin.props` へ追加する。
|
|
1006
|
+
*/
|
|
1007
|
+
export declare const fontStyleProp: {
|
|
1008
|
+
kind: string;
|
|
1009
|
+
defaultProps: {
|
|
1010
|
+
fontFamily: string;
|
|
1011
|
+
fontSize: {
|
|
1012
|
+
value: number;
|
|
1013
|
+
unit: string;
|
|
1014
|
+
};
|
|
1015
|
+
color: string;
|
|
1016
|
+
fontWeight: false;
|
|
1017
|
+
italic: false;
|
|
1018
|
+
underline: false;
|
|
1019
|
+
lineThrough: false;
|
|
1020
|
+
};
|
|
1021
|
+
};
|
|
1022
|
+
|
|
1023
|
+
/**
|
|
1024
|
+
* ブロック内のフォントスタイルを保持する Props。
|
|
1025
|
+
*/
|
|
1026
|
+
export declare interface FontStyleProps {
|
|
1027
|
+
/** フォントファミリー */
|
|
1028
|
+
fontFamily?: string;
|
|
1029
|
+
/** フォントサイズ */
|
|
1030
|
+
fontSize?: Dimension<FontUnit>;
|
|
1031
|
+
/** 文字色(CSS カラー値) */
|
|
1032
|
+
color?: string;
|
|
1033
|
+
/** `true` のとき太字 */
|
|
1034
|
+
fontWeight?: boolean;
|
|
1035
|
+
/** `true` のときイタリック */
|
|
1036
|
+
italic?: boolean;
|
|
1037
|
+
/** `true` のとき下線 */
|
|
1038
|
+
underline?: boolean;
|
|
1039
|
+
/** `true` のとき取り消し線 */
|
|
1040
|
+
lineThrough?: boolean;
|
|
1041
|
+
}
|
|
1042
|
+
|
|
1043
|
+
/**
|
|
1044
|
+
* フォントサイズに使用できる単位。
|
|
1045
|
+
*/
|
|
1046
|
+
export declare type FontUnit = (typeof FONT_UNITS)[number];
|
|
1047
|
+
|
|
1048
|
+
/**
|
|
1049
|
+
* ボタンの `action` がアクティブ状態か(トグル選択中か)を返す。
|
|
1050
|
+
*
|
|
1051
|
+
* オブジェクト形式の action でバインディング値と一致する場合に `true` を返す。
|
|
1052
|
+
*
|
|
1053
|
+
* @remarks
|
|
1054
|
+
* **Canvas** — カスタムプラグイン実装者向け
|
|
1055
|
+
*/
|
|
1056
|
+
export declare function getButtonActionActive(action: ButtonAction, bindingContext: BindingContext | undefined): boolean;
|
|
1057
|
+
|
|
1058
|
+
/**
|
|
1059
|
+
* `InteractionState` から現在モードを導出する
|
|
1060
|
+
*
|
|
1061
|
+
* @remarks
|
|
1062
|
+
* **Canvas** — {@link InteractionState} から動作モードを導出するユーティリティ。
|
|
1063
|
+
*/
|
|
1064
|
+
export declare function getInteractionMode(state: InteractionState): InteractionMode;
|
|
1065
|
+
|
|
1066
|
+
/**
|
|
1067
|
+
* プリセット用紙サイズの対応寸法を mm 単位で返す。
|
|
1068
|
+
*
|
|
1069
|
+
* `orientation` が `true` のとき横向き(幅と高さを入れ替え)。
|
|
1070
|
+
*/
|
|
1071
|
+
export declare function getPaperSize(preset: Exclude<PaperSizePreset, PaperSizePreset.CUSTOM>, orientation: boolean): {
|
|
1072
|
+
width: number;
|
|
1073
|
+
height: number;
|
|
1074
|
+
};
|
|
1075
|
+
|
|
1076
|
+
/**
|
|
1077
|
+
* ページのグリッド定義。
|
|
1078
|
+
*
|
|
1079
|
+
* @remarks
|
|
1080
|
+
* `cols` / `rows` を省略した列/行は全て 1fr 等分割として扱われる。
|
|
1081
|
+
*/
|
|
1082
|
+
declare interface Grid {
|
|
1083
|
+
/** 列数 */
|
|
1084
|
+
colCount: number;
|
|
1085
|
+
/** 行数 */
|
|
1086
|
+
rowCount: number;
|
|
1087
|
+
/** 列のサイズ定義マップ(インデックス → Dimension)。省略時は全列 1fr。 */
|
|
1088
|
+
cols?: Record<number, Dimension<GridUnit>>;
|
|
1089
|
+
/** 行のサイズ定義マップ(インデックス → Dimension)。省略時は全行 1fr。 */
|
|
1090
|
+
rows?: Record<number, Dimension<GridUnit>>;
|
|
1091
|
+
}
|
|
1092
|
+
|
|
1093
|
+
/**
|
|
1094
|
+
* グリッドの列・行サイズに使用できる単位の配列。
|
|
1095
|
+
*/
|
|
1096
|
+
export declare const GRID_UNITS: readonly ["mm", "cm", "fr", "inch", "pt", "px"];
|
|
1097
|
+
|
|
1098
|
+
/**
|
|
1099
|
+
* グリッド列数 atom widget。
|
|
1100
|
+
*
|
|
1101
|
+
* @remarks
|
|
1102
|
+
* **Canvas** — カスタムシェル構築専用。
|
|
1103
|
+
*
|
|
1104
|
+
* 3 列 × 1 行: [列数ラベル][数値入力][stepper]
|
|
1105
|
+
*
|
|
1106
|
+
* binding: `grid.colCount`
|
|
1107
|
+
*/
|
|
1108
|
+
export declare const gridColCountWidget: WidgetDef;
|
|
1109
|
+
|
|
1110
|
+
/**
|
|
1111
|
+
* グリッド行数 atom widget。
|
|
1112
|
+
*
|
|
1113
|
+
* @remarks
|
|
1114
|
+
* **Canvas** — カスタムシェル構築専用。
|
|
1115
|
+
*
|
|
1116
|
+
* 3 列 × 1 行: [行数ラベル][数値入力][stepper]
|
|
1117
|
+
*
|
|
1118
|
+
* binding: `grid.rowCount`
|
|
1119
|
+
*/
|
|
1120
|
+
export declare const gridRowCountWidget: WidgetDef;
|
|
1121
|
+
|
|
1122
|
+
/**
|
|
1123
|
+
* グリッドの列・行サイズに使用できる単位(`fr` を含む)。
|
|
1124
|
+
*/
|
|
1125
|
+
declare type GridUnit = (typeof GRID_UNITS)[number];
|
|
1126
|
+
|
|
1127
|
+
/**
|
|
1128
|
+
* `block.props` がバリデーションルールを持つかどうかを判定する型ガード。
|
|
1129
|
+
*/
|
|
1130
|
+
export declare function hasValidationRule(props: unknown): props is ValidationSchema;
|
|
1131
|
+
|
|
1132
|
+
/**
|
|
1133
|
+
* ブロックの表示/非表示を binding 値で制御する条件式。
|
|
1134
|
+
*
|
|
1135
|
+
* - `string` — 指定パスの値が truthy のとき非表示
|
|
1136
|
+
*
|
|
1137
|
+
* - `{ path, eq }` — 指定パスの値が `eq` と等しいとき非表示
|
|
1138
|
+
*
|
|
1139
|
+
* - `{ path, neq }` — 指定パスの値が `neq` と等しくないとき非表示
|
|
1140
|
+
*
|
|
1141
|
+
* `eq` / `neq` は `===` による参照比較を行うため、オブジェクト・配列を指定しても期待通りに動作しない。
|
|
1142
|
+
*
|
|
1143
|
+
* そのため `Value` からオブジェクト・配列変形を除いた `Exclude<Value, Value[] | readonly Value[] | { [key: string]: Value }>` に制限している。
|
|
1144
|
+
*/
|
|
1145
|
+
export declare type HiddenBinding = string | {
|
|
1146
|
+
path: string;
|
|
1147
|
+
/**
|
|
1148
|
+
* `===` で比較するためプリミティブ値のみ有効。
|
|
1149
|
+
*
|
|
1150
|
+
* `Value` からオブジェクト・配列を除いた型。
|
|
1151
|
+
*/
|
|
1152
|
+
eq: Exclude<Value, Value[] | readonly Value[] | {
|
|
1153
|
+
[key: string]: Value;
|
|
1154
|
+
}>;
|
|
1155
|
+
/** `eq` と同時指定不可 */
|
|
1156
|
+
neq?: never;
|
|
1157
|
+
} | {
|
|
1158
|
+
path: string;
|
|
1159
|
+
/**
|
|
1160
|
+
* `===` で比較するためプリミティブ値のみ有効。
|
|
1161
|
+
*
|
|
1162
|
+
* `Value` からオブジェクト・配列を除いた型。
|
|
1163
|
+
*/
|
|
1164
|
+
neq: Exclude<Value, Value[] | readonly Value[] | {
|
|
1165
|
+
[key: string]: Value;
|
|
1166
|
+
}>;
|
|
1167
|
+
/** `neq` と同時指定不可 */
|
|
1168
|
+
eq?: never;
|
|
1169
|
+
};
|
|
1170
|
+
|
|
1171
|
+
/**
|
|
1172
|
+
* ブロック内の水平配置。
|
|
1173
|
+
*/
|
|
1174
|
+
export declare enum HorizontalAlign {
|
|
1175
|
+
left = "left",
|
|
1176
|
+
center = "center",
|
|
1177
|
+
right = "right"
|
|
1178
|
+
}
|
|
1179
|
+
|
|
1180
|
+
/**
|
|
1181
|
+
* テキスト入力の HTML `input[type]` 属性値。バリデーション・キーボードの振る舞いに影響する。
|
|
1182
|
+
*/
|
|
1183
|
+
export declare enum InputType {
|
|
1184
|
+
text = "text",
|
|
1185
|
+
number = "number",
|
|
1186
|
+
email = "email",
|
|
1187
|
+
tel = "tel",
|
|
1188
|
+
url = "url",
|
|
1189
|
+
date = "date",
|
|
1190
|
+
password = "password"
|
|
1191
|
+
}
|
|
1192
|
+
|
|
1193
|
+
/**
|
|
1194
|
+
* ブロックの移動・リサイズ・挿入・編集のインタラクションを集約した全体制御レイヤーコンポーネント。
|
|
1195
|
+
*
|
|
1196
|
+
* @remarks
|
|
1197
|
+
* **Canvas** — {@link Note} 実装を担う低レベルインタラクションレイヤー。
|
|
1198
|
+
*
|
|
1199
|
+
* 通常は {@link Note} を使用する。
|
|
1200
|
+
*/
|
|
1201
|
+
export declare const InteractionLayer: MemoExoticComponent<({ page, pluginRegistry, gridLength, blockDefaults, getBlockRectPx, getColIndex, getRowIndex, state, onStateChange, selectedBlockIds, onSelectionChange, onPageChange, actionContext, bindingContext, scale, className, selectionStyle, }: InteractionLayerProps) => JSX.Element>;
|
|
1202
|
+
|
|
1203
|
+
/**
|
|
1204
|
+
* `InteractionLayer` コンポーネントへの props。
|
|
1205
|
+
*/
|
|
1206
|
+
export declare interface InteractionLayerProps {
|
|
1207
|
+
/** 描画対象のページデータ。 */
|
|
1208
|
+
page: Page;
|
|
1209
|
+
/** プラグインレジストリ。 */
|
|
1210
|
+
pluginRegistry: PluginRegistry;
|
|
1211
|
+
/** グリッドの列数・行数。 */
|
|
1212
|
+
gridLength: {
|
|
1213
|
+
cols: number;
|
|
1214
|
+
rows: number;
|
|
1215
|
+
};
|
|
1216
|
+
/** ブロックのデフォルト値設定。 */
|
|
1217
|
+
blockDefaults?: BlockDefaults;
|
|
1218
|
+
/** ブロックからキャンバス上の矩形座標(px)を返す関数。 */
|
|
1219
|
+
getBlockRectPx: (block: Block) => BlockRectPx;
|
|
1220
|
+
/** x 座標(px)からグリッド列インデックスを返す関数。 */
|
|
1221
|
+
getColIndex: (px: number) => number;
|
|
1222
|
+
/** y 座標(px)からグリッド行インデックスを返す関数。 */
|
|
1223
|
+
getRowIndex: (px: number) => number;
|
|
1224
|
+
/** インタラクション状態(controlled)。 */
|
|
1225
|
+
state: InteractionState;
|
|
1226
|
+
/** 状態変更時のコールバック。 */
|
|
1227
|
+
onStateChange: (state: InteractionState) => void;
|
|
1228
|
+
/** 選択中のブロック ID 一覧(controlled)。 */
|
|
1229
|
+
selectedBlockIds: string[];
|
|
1230
|
+
/** 選択変更時のコールバック。 */
|
|
1231
|
+
onSelectionChange: OnSelectionChange;
|
|
1232
|
+
/** ページ変更(ブロック追加・削除・移動など)時のコールバック。 */
|
|
1233
|
+
onPageChange: (page: Page, options?: {
|
|
1234
|
+
mergeKey?: string;
|
|
1235
|
+
noTimeWindow?: boolean;
|
|
1236
|
+
}) => void;
|
|
1237
|
+
/** アクション実行用コンテキスト(undo/redo など)。 */
|
|
1238
|
+
actionContext: ActionContext;
|
|
1239
|
+
/** 値バインディング用コンテキスト。 */
|
|
1240
|
+
bindingContext?: BindingContext;
|
|
1241
|
+
/** キャンバスのスケール倍率(既定値: `1.0`)。 */
|
|
1242
|
+
scale?: number;
|
|
1243
|
+
/** ルート要素の CSS クラス名。 */
|
|
1244
|
+
className?: string;
|
|
1245
|
+
/** 選択枠線のスタイル。 */
|
|
1246
|
+
selectionStyle?: BorderStyle;
|
|
1247
|
+
}
|
|
1248
|
+
|
|
1249
|
+
/**
|
|
1250
|
+
* インタラクションモード(dragging/editingBlockId から導出)
|
|
1251
|
+
*
|
|
1252
|
+
* @remarks
|
|
1253
|
+
* **Canvas** — {@link InteractionLayer} の動作モード列挙型。
|
|
1254
|
+
*/
|
|
1255
|
+
export declare enum InteractionMode {
|
|
1256
|
+
IDLE = "idle",
|
|
1257
|
+
PRESSING = "pressing",
|
|
1258
|
+
DRAGGING = "dragging",
|
|
1259
|
+
INSERT = "insert",
|
|
1260
|
+
EDITING = "editing"
|
|
1261
|
+
}
|
|
1262
|
+
|
|
1263
|
+
/**
|
|
1264
|
+
* インタラクション状態(外部で管理する controlled state)
|
|
1265
|
+
*
|
|
1266
|
+
* - 選択状態 (`selectedBlockIds`) は外部で管理されるため含まない
|
|
1267
|
+
* - モード (`InteractionMode`) は `editingBlockId` と `dragging` から導出する
|
|
1268
|
+
*
|
|
1269
|
+
* @remarks
|
|
1270
|
+
* **Canvas** — {@link InteractionLayer} に渡す制御状態型。
|
|
1271
|
+
*/
|
|
1272
|
+
export declare interface InteractionState {
|
|
1273
|
+
/** 編集中ブロックID。null = 非編集 */
|
|
1274
|
+
editingBlockId: string | null;
|
|
1275
|
+
/** ドラッグ中状態 */
|
|
1276
|
+
dragging?: DraggingState;
|
|
1277
|
+
}
|
|
1278
|
+
|
|
1279
|
+
/**
|
|
1280
|
+
* ボタンの `action` が現在有効か(クリック可能状態か)を返す。
|
|
1281
|
+
*
|
|
1282
|
+
* @remarks
|
|
1283
|
+
* **Canvas** — カスタムプラグイン実装者向け
|
|
1284
|
+
*/
|
|
1285
|
+
export declare function isButtonActionEnabled(action: ButtonAction, actionContext: ActionContext | undefined): boolean;
|
|
1286
|
+
|
|
1287
|
+
/**
|
|
1288
|
+
* 値が {@link Value} 型かどうかを判定する型ガード。
|
|
1289
|
+
*
|
|
1290
|
+
* `null`・プリミティブ(文字列・数値・ブールアン)・プレインオブジェクト・配列を再帰的に認め、
|
|
1291
|
+
* それ以外は `false` を返す。
|
|
1292
|
+
*/
|
|
1293
|
+
export declare function isValue(v: unknown): v is Value;
|
|
1294
|
+
|
|
1295
|
+
/**
|
|
1296
|
+
* 線のスタイル定義(色・幅・種別)。
|
|
1297
|
+
*/
|
|
1298
|
+
declare interface LineStyle {
|
|
1299
|
+
/** CSS カラー値 */
|
|
1300
|
+
color: string;
|
|
1301
|
+
/** 線の幅 */
|
|
1302
|
+
width: Dimension<BorderUnit>;
|
|
1303
|
+
/** 線の種別 */
|
|
1304
|
+
type: LineType;
|
|
1305
|
+
}
|
|
1306
|
+
|
|
1307
|
+
/**
|
|
1308
|
+
* 枠線・区切り線に適用するスタイル種別。
|
|
1309
|
+
*/
|
|
1310
|
+
declare enum LineType {
|
|
1311
|
+
/** 実線 */
|
|
1312
|
+
SOLID = "solid",
|
|
1313
|
+
/** 破線 */
|
|
1314
|
+
DASHED = "dashed",
|
|
1315
|
+
/** 点線 */
|
|
1316
|
+
DOTTED = "dotted"
|
|
1317
|
+
}
|
|
1318
|
+
|
|
1319
|
+
/**
|
|
1320
|
+
* マージン設定 compound widget(3 行・行 widget 構成)。
|
|
1321
|
+
*
|
|
1322
|
+
* @remarks
|
|
1323
|
+
* **Canvas** — カスタムシェル構築専用。
|
|
1324
|
+
*
|
|
1325
|
+
* - 行 0(常に表示): 一括 checkbox
|
|
1326
|
+
* + 上マージン入力(個別時) ← hiddenBinding: "margin.bulk"
|
|
1327
|
+
* + 全辺共通マージン入力(一括時) ← hiddenBinding: { path: "margin.bulk", neq: true }
|
|
1328
|
+
* - 行 1(個別時): 左・右マージン ← hiddenBinding: "margin.bulk"
|
|
1329
|
+
* - 行 2(個別時・末尾): 下マージン ← hiddenBinding: "margin.bulk"
|
|
1330
|
+
*
|
|
1331
|
+
* binding:
|
|
1332
|
+
* - `margin.bulk` / `margin.all` / `margin.top` / `margin.left` / `margin.right` / `margin.bottom`
|
|
1333
|
+
*/
|
|
1334
|
+
export declare const marginSettingsWidget: WidgetDef;
|
|
1335
|
+
|
|
1336
|
+
/**
|
|
1337
|
+
* ノートブロックのプラグイン定義。
|
|
1338
|
+
*
|
|
1339
|
+
* `kind: "note"` で登録され、Book を内包して別のグリッドをブロック内にレンダリングする。
|
|
1340
|
+
*
|
|
1341
|
+
* @remarks
|
|
1342
|
+
* **Canvas** — 入れ子グリッドユースケース向けのプラグイン。
|
|
1343
|
+
*
|
|
1344
|
+
* 標準フォーム構築では `createPluginRegistry` に渡すだけで使用できる。
|
|
1345
|
+
*/
|
|
1346
|
+
export declare const NoteBlockPlugin: BlockPlugin<NoteBlockProps, NoteBlockValue>;
|
|
1347
|
+
|
|
1348
|
+
/**
|
|
1349
|
+
* ノートブロックの props 型。Book を内包して入れ子グリッドを実現する。
|
|
1350
|
+
*
|
|
1351
|
+
* @remarks
|
|
1352
|
+
* **Canvas** — 入れ子グリッド構築向けの型。
|
|
1353
|
+
*
|
|
1354
|
+
* 一般的なフォーム構築では直接参照することは少ない。
|
|
1355
|
+
*/
|
|
1356
|
+
export declare interface NoteBlockProps extends BaseBlockProps {
|
|
1357
|
+
/** ネストして表示する内包 Book。 */
|
|
1358
|
+
book: Book;
|
|
1359
|
+
/** 内包 Book で表示するページインデックス。省略時は 0。 */
|
|
1360
|
+
pageIdx?: number;
|
|
1361
|
+
}
|
|
1362
|
+
|
|
1363
|
+
/**
|
|
1364
|
+
* ノートブロックのレンダラーコンポーネント。
|
|
1365
|
+
*
|
|
1366
|
+
* Book を内包し、ブロックのサイズに合わせてスケールしてグリッドをレンダリングする。
|
|
1367
|
+
*
|
|
1368
|
+
* @remarks
|
|
1369
|
+
* **Canvas** — `NoteBlockPlugin` と組み合わせて使用する実装コンポーネント。
|
|
1370
|
+
*/
|
|
1371
|
+
export declare const NoteBlockRenderer: ForwardRefExoticComponent<RendererProps<NoteBlockProps, null> & RefAttributes<BlockRef>>;
|
|
1372
|
+
|
|
1373
|
+
/**
|
|
1374
|
+
* ノートブロックの値型。ノートブロックは値を持たないため常に `null`。
|
|
1375
|
+
*
|
|
1376
|
+
* @remarks
|
|
1377
|
+
* **Canvas** — 入れ子グリッド構築向けの型。
|
|
1378
|
+
*/
|
|
1379
|
+
export declare type NoteBlockValue = null;
|
|
1380
|
+
|
|
1381
|
+
/**
|
|
1382
|
+
* Note の表示・編集モード。
|
|
1383
|
+
*/
|
|
1384
|
+
declare enum NoteMode {
|
|
1385
|
+
/**
|
|
1386
|
+
* ブロックの配置・サイズ変更、グリッド設定、`initValue`(初期値)の設定が可能。
|
|
1387
|
+
*
|
|
1388
|
+
* 入力コントロールは動作するが、値はセッション内のみ保持される(永続化されない)。
|
|
1389
|
+
*/
|
|
1390
|
+
FORM = "Form",
|
|
1391
|
+
/**
|
|
1392
|
+
* ブロックの値を入力・編集できる。
|
|
1393
|
+
*
|
|
1394
|
+
* レイアウトや `initValue` は変更不可。
|
|
1395
|
+
*/
|
|
1396
|
+
EDIT = "Edit",
|
|
1397
|
+
/**
|
|
1398
|
+
* すべて読み取り専用。入力コントロールは無効。
|
|
1399
|
+
*
|
|
1400
|
+
* `showValidation` によるバリデーション結果の表示が有効。
|
|
1401
|
+
*/
|
|
1402
|
+
VIEW = "View"
|
|
1403
|
+
}
|
|
1404
|
+
|
|
1405
|
+
/**
|
|
1406
|
+
* TextBlock を数値入力専用設定にしたブロック定義ヘルパー。
|
|
1407
|
+
*
|
|
1408
|
+
* @remarks
|
|
1409
|
+
* **Canvas** — カスタムシェル構築向レイアウトヘルパー。
|
|
1410
|
+
*
|
|
1411
|
+
* binding には数値を保持するパス(例: "paper.size.width.value")を渡す。
|
|
1412
|
+
*
|
|
1413
|
+
* 返り値のレイアウトはデフォルト `{ x:0, y:0, w:1, h:1 }` のため、
|
|
1414
|
+
* 複合 widget 内で spread して上書きすること。
|
|
1415
|
+
*
|
|
1416
|
+
* @example
|
|
1417
|
+
* ```ts
|
|
1418
|
+
* {
|
|
1419
|
+
* ...numberInputBlock("width-value", "paper.size.width.value"),
|
|
1420
|
+
* layout: { x: 0, y: 0, w: 2, h: 1 },
|
|
1421
|
+
* }
|
|
1422
|
+
* ```
|
|
1423
|
+
*/
|
|
1424
|
+
export declare function numberInputBlock(id: string, binding: string): Block;
|
|
1425
|
+
|
|
1426
|
+
/**
|
|
1427
|
+
* Book 全体の変更通知(ブロック・グリッド・用紙変更を一本で扱う)。
|
|
1428
|
+
*
|
|
1429
|
+
* @remarks
|
|
1430
|
+
* `options.mergeKey` を指定すると、同一キーの連続変更が履歴上でマージされる。
|
|
1431
|
+
* `options.noTimeWindow` を `true` にすると 500ms の時間窓制限なしにマージされる(セッション型用)。
|
|
1432
|
+
* ドラッグ中の連続更新やパネルのキー入力など、Undo を細分化したくない場面で使用する。
|
|
1433
|
+
*/
|
|
1434
|
+
export declare type OnBookChange = (book: Book, options?: {
|
|
1435
|
+
mergeKey?: string;
|
|
1436
|
+
noTimeWindow?: boolean;
|
|
1437
|
+
}) => void;
|
|
1438
|
+
|
|
1439
|
+
/**
|
|
1440
|
+
* ブロック選択状態の変更通知(FORM モードでの選択操作)。
|
|
1441
|
+
*/
|
|
1442
|
+
export declare type OnSelectionChange = (selectedIds: string[]) => void;
|
|
1443
|
+
|
|
1444
|
+
/**
|
|
1445
|
+
* values の変更通知(EDIT モードでの入力値変更)。
|
|
1446
|
+
*
|
|
1447
|
+
* 差分リスト形式で渡される。1 ブロック編集 → 1 要素の配列。
|
|
1448
|
+
* `value` が `undefined` の場合はそのブロックの値を削除する。
|
|
1449
|
+
*
|
|
1450
|
+
* @example
|
|
1451
|
+
* ```tsx
|
|
1452
|
+
* onValuesChange={(changes) => {
|
|
1453
|
+
* setValues(prev => {
|
|
1454
|
+
* const next = { ...prev };
|
|
1455
|
+
* for (const { id, value } of changes) {
|
|
1456
|
+
* if (value === undefined) delete next[id];
|
|
1457
|
+
* else next[id] = value;
|
|
1458
|
+
* }
|
|
1459
|
+
* return next;
|
|
1460
|
+
* });
|
|
1461
|
+
* }}
|
|
1462
|
+
* ```
|
|
1463
|
+
*/
|
|
1464
|
+
export declare type OnValuesChange = (changes: ValueChange[]) => void;
|
|
1465
|
+
|
|
1466
|
+
/**
|
|
1467
|
+
* パディングに使用できる単位の配列。
|
|
1468
|
+
*/
|
|
1469
|
+
export declare const PADDING_UNITS: readonly ["mm", "pt", "px", "%"];
|
|
1470
|
+
|
|
1471
|
+
/**
|
|
1472
|
+
* 余白プロパティの `PropDef`。
|
|
1473
|
+
*
|
|
1474
|
+
* @remarks
|
|
1475
|
+
* **Canvas** — ブロックプラグイン実装時に `plugin.props` へ追加する。
|
|
1476
|
+
*/
|
|
1477
|
+
export declare const paddingProp: {
|
|
1478
|
+
kind: string;
|
|
1479
|
+
defaultProps: {
|
|
1480
|
+
top: {
|
|
1481
|
+
value: number;
|
|
1482
|
+
unit: string;
|
|
1483
|
+
};
|
|
1484
|
+
right: {
|
|
1485
|
+
value: number;
|
|
1486
|
+
unit: string;
|
|
1487
|
+
};
|
|
1488
|
+
bottom: {
|
|
1489
|
+
value: number;
|
|
1490
|
+
unit: string;
|
|
1491
|
+
};
|
|
1492
|
+
left: {
|
|
1493
|
+
value: number;
|
|
1494
|
+
unit: string;
|
|
1495
|
+
};
|
|
1496
|
+
};
|
|
1497
|
+
};
|
|
1498
|
+
|
|
1499
|
+
/**
|
|
1500
|
+
* ブロック内の上下左右の余白を保持する Props。
|
|
1501
|
+
*/
|
|
1502
|
+
export declare interface PaddingProps {
|
|
1503
|
+
top?: Dimension<PaddingUnit>;
|
|
1504
|
+
right?: Dimension<PaddingUnit>;
|
|
1505
|
+
bottom?: Dimension<PaddingUnit>;
|
|
1506
|
+
left?: Dimension<PaddingUnit>;
|
|
1507
|
+
/** 全辺一括モード。`true` のとき `all` が全辺に適用される */
|
|
1508
|
+
bulk?: boolean;
|
|
1509
|
+
/** 全辺共通パディング(`bulk: true` のとき有効) */
|
|
1510
|
+
all?: Dimension<PaddingUnit>;
|
|
1511
|
+
}
|
|
1512
|
+
|
|
1513
|
+
/**
|
|
1514
|
+
* パディングに使用できる単位(`%` を含む)。
|
|
1515
|
+
*/
|
|
1516
|
+
export declare type PaddingUnit = (typeof PADDING_UNITS)[number];
|
|
1517
|
+
|
|
1518
|
+
/**
|
|
1519
|
+
* 1ページ分のフォームスキーマ。
|
|
1520
|
+
*/
|
|
1521
|
+
declare interface Page {
|
|
1522
|
+
/** ページの一意 ID。保存済み Book に ID がない場合は {@link ensurePageIds} で付与できる */
|
|
1523
|
+
id?: string;
|
|
1524
|
+
/** グリッド設定(スパース形式)。全列・全行が 1fr の場合は colCount / rowCount のみ */
|
|
1525
|
+
grid: Grid;
|
|
1526
|
+
/** 配置されているブロック一覧 */
|
|
1527
|
+
blocks: Block[];
|
|
1528
|
+
/** ブロック種別ごとの共通デフォルト設定。値解決順序は `Block` の @remarks を参照 */
|
|
1529
|
+
blockDefaults?: BlockDefaults;
|
|
1530
|
+
/** ページ固有のメタデータ(バージョン・タイトルなど) */
|
|
1531
|
+
metaData?: Record<string, Value>;
|
|
1532
|
+
}
|
|
1533
|
+
|
|
1534
|
+
/**
|
|
1535
|
+
* ページに適用する用紙設定(サイズ・マージン・向き)。
|
|
1536
|
+
*/
|
|
1537
|
+
declare interface Paper {
|
|
1538
|
+
/** 用紙サイズ */
|
|
1539
|
+
size: PaperSize;
|
|
1540
|
+
/** 用紙マージン */
|
|
1541
|
+
margin: PaperMargin;
|
|
1542
|
+
/** 用紙の向き。true = 横向き (landscape)、省略/false = 縦向き (portrait) */
|
|
1543
|
+
orientation?: boolean;
|
|
1544
|
+
/**
|
|
1545
|
+
* 幅自動リサイズ。
|
|
1546
|
+
*
|
|
1547
|
+
* `true` のとき、`widthFit` ブロックの実測幅に合わせてキャンバス幅を広げる。
|
|
1548
|
+
*/
|
|
1549
|
+
autoWidth?: boolean;
|
|
1550
|
+
/**
|
|
1551
|
+
* 高さ自動リサイズ。
|
|
1552
|
+
*
|
|
1553
|
+
* `true` のとき、`heightFit` ブロックの実測高さに合わせてキャンバス高さを広げる。
|
|
1554
|
+
*/
|
|
1555
|
+
autoHeight?: boolean;
|
|
1556
|
+
}
|
|
1557
|
+
|
|
1558
|
+
/**
|
|
1559
|
+
* `paperSizeWidget` 内のブロック定義(再利用可能)。
|
|
1560
|
+
*
|
|
1561
|
+
* @remarks
|
|
1562
|
+
* **Canvas** — カスタムシェル構築専用。
|
|
1563
|
+
*
|
|
1564
|
+
* 4列×2行グリッド想定:
|
|
1565
|
+
* - 行 0: プリセット select(colspan: 4)
|
|
1566
|
+
* - 行 1: 幅value / 幅unit / 高さvalue / 高さunit(Custom 選択時のみ)
|
|
1567
|
+
*/
|
|
1568
|
+
export declare const PAPER_SIZE_BLOCKS: Block[];
|
|
1569
|
+
|
|
1570
|
+
/**
|
|
1571
|
+
* 用紙サイズに使用できる単位の配列。
|
|
1572
|
+
*/
|
|
1573
|
+
export declare const PAPER_UNITS: readonly ["mm", "cm", "inch"];
|
|
1574
|
+
|
|
1575
|
+
/**
|
|
1576
|
+
* 用紙四辺のマージン設定。
|
|
1577
|
+
*/
|
|
1578
|
+
declare interface PaperMargin {
|
|
1579
|
+
top: Dimension<PaperUnit>;
|
|
1580
|
+
right: Dimension<PaperUnit>;
|
|
1581
|
+
bottom: Dimension<PaperUnit>;
|
|
1582
|
+
left: Dimension<PaperUnit>;
|
|
1583
|
+
/**
|
|
1584
|
+
* 一括編集フラグ。`true` のとき、`all` フィールドが四辺の共通値として使われる。
|
|
1585
|
+
*
|
|
1586
|
+
* Book に保存されるため、通常の binding パス `margin.bulk` で読み書きできる。
|
|
1587
|
+
*/
|
|
1588
|
+
bulk?: boolean;
|
|
1589
|
+
/**
|
|
1590
|
+
* 一括モード時の四辺共通マージン値。`bulk` が `true` のときのみ描画・印刷に使用される。
|
|
1591
|
+
*
|
|
1592
|
+
* binding パス `margin.all.value` / `margin.all.unit` で読み書きできる。
|
|
1593
|
+
*/
|
|
1594
|
+
all?: Dimension<PaperUnit>;
|
|
1595
|
+
}
|
|
1596
|
+
|
|
1597
|
+
/**
|
|
1598
|
+
* 横向き checkbox atom widget。
|
|
1599
|
+
*
|
|
1600
|
+
* @remarks
|
|
1601
|
+
* **Canvas** — カスタムシェル構築専用。
|
|
1602
|
+
*
|
|
1603
|
+
* binding: `paper.orientation`(true = landscape, false = portrait)
|
|
1604
|
+
*/
|
|
1605
|
+
export declare const paperOrientationWidget: WidgetDef;
|
|
1606
|
+
|
|
1607
|
+
/**
|
|
1608
|
+
* 用紙プリセット選択 atom widget。
|
|
1609
|
+
*
|
|
1610
|
+
* @remarks
|
|
1611
|
+
* **Canvas** — カスタムシェル構築専用。
|
|
1612
|
+
*
|
|
1613
|
+
* binding: `paper.size.preset`
|
|
1614
|
+
*/
|
|
1615
|
+
export declare const paperPresetSelectWidget: WidgetDef;
|
|
1616
|
+
|
|
1617
|
+
/**
|
|
1618
|
+
* 用紙サイズ設定。
|
|
1619
|
+
*
|
|
1620
|
+
* @remarks
|
|
1621
|
+
* `preset` が `CUSTOM` 以外の場合も `width` / `height` には実寸が格納される。
|
|
1622
|
+
*/
|
|
1623
|
+
declare interface PaperSize {
|
|
1624
|
+
/** 選択中のプリセット */
|
|
1625
|
+
preset: PaperSizePreset;
|
|
1626
|
+
/** 幅(物理単位)。`CUSTOM` 時はユーザー指定値。 */
|
|
1627
|
+
width: Dimension<PaperUnit>;
|
|
1628
|
+
/** 高さ(物理単位)。`CUSTOM` 時はユーザー指定値。 */
|
|
1629
|
+
height: Dimension<PaperUnit>;
|
|
1630
|
+
}
|
|
1631
|
+
|
|
1632
|
+
/**
|
|
1633
|
+
* 用紙サイズのプリセット種別。`CUSTOM` 選択時は `PaperSize.width` / `height` が有効になる。
|
|
1634
|
+
*/
|
|
1635
|
+
declare enum PaperSizePreset {
|
|
1636
|
+
A4 = "A4",
|
|
1637
|
+
B5 = "B5",
|
|
1638
|
+
A3 = "A3",
|
|
1639
|
+
LETTER = "Letter",
|
|
1640
|
+
LEGAL = "Legal",
|
|
1641
|
+
CUSTOM = "Custom"
|
|
1642
|
+
}
|
|
1643
|
+
|
|
1644
|
+
/**
|
|
1645
|
+
* 用紙サイズ設定 compound widget。
|
|
1646
|
+
*
|
|
1647
|
+
* @remarks
|
|
1648
|
+
* **Canvas** — カスタムシェル構築専用。
|
|
1649
|
+
*
|
|
1650
|
+
* グリッド: 4列×2行
|
|
1651
|
+
* - 列 1 (15mm): 幅単位 select
|
|
1652
|
+
* - 列 3 (15mm): 高さ単位 select
|
|
1653
|
+
* - その他: 1fr
|
|
1654
|
+
*
|
|
1655
|
+
* 行 0: プリセット select(常に表示)
|
|
1656
|
+
*
|
|
1657
|
+
* 行 1: 幅・高さ dimension 入力(Custom 選択時のみ表示)
|
|
1658
|
+
*/
|
|
1659
|
+
export declare const paperSizeWidget: WidgetDef;
|
|
1660
|
+
|
|
1661
|
+
/**
|
|
1662
|
+
* 用紙サイズに使用できる単位。
|
|
1663
|
+
*/
|
|
1664
|
+
declare type PaperUnit = (typeof PAPER_UNITS)[number];
|
|
1665
|
+
|
|
1666
|
+
/**
|
|
1667
|
+
* プレースホルダープロパティの `PropDef`。
|
|
1668
|
+
*
|
|
1669
|
+
* @remarks
|
|
1670
|
+
* **Canvas** — ブロックプラグイン実装時に `plugin.props` へ追加する。
|
|
1671
|
+
*/
|
|
1672
|
+
export declare const placeholderProp: {
|
|
1673
|
+
kind: string;
|
|
1674
|
+
defaultProps: {
|
|
1675
|
+
placeholder: string;
|
|
1676
|
+
};
|
|
1677
|
+
};
|
|
1678
|
+
|
|
1679
|
+
/**
|
|
1680
|
+
* ブロックのプレースホルダーテキストを保持する Props。
|
|
1681
|
+
*/
|
|
1682
|
+
export declare interface PlaceholderProps {
|
|
1683
|
+
/** 未入力時に表示するプレースホルダー文字列 */
|
|
1684
|
+
placeholder?: string;
|
|
1685
|
+
}
|
|
1686
|
+
|
|
1687
|
+
/**
|
|
1688
|
+
* `createPluginRegistry` が返す、`block.kind` をキーにしたプラグインレジストリ。
|
|
1689
|
+
*
|
|
1690
|
+
* 未登録の `kind` は `undefined` になるため、アクセス前に存在確認が必要。
|
|
1691
|
+
*/
|
|
1692
|
+
declare type PluginRegistry = Record<string, ResolvedPlugin | undefined>;
|
|
1693
|
+
|
|
1694
|
+
/**
|
|
1695
|
+
* 印刷時の余白設定。各辺に CSS の長さ値(例: `"10mm"`)を指定する。
|
|
1696
|
+
* 省略した辺はブラウザのデフォルト余白が適用される。
|
|
1697
|
+
*/
|
|
1698
|
+
declare interface PrintMargin {
|
|
1699
|
+
top?: string;
|
|
1700
|
+
right?: string;
|
|
1701
|
+
bottom?: string;
|
|
1702
|
+
left?: string;
|
|
1703
|
+
}
|
|
1704
|
+
|
|
1705
|
+
/**
|
|
1706
|
+
* 印刷ダイアログへ渡す設定。
|
|
1707
|
+
*
|
|
1708
|
+
* @remarks
|
|
1709
|
+
* - 省略したフィールドはブラウザのデフォルト値に従う。
|
|
1710
|
+
* - `paperSize` に `"Custom"` は指定不可(型レベルで `Exclude` により除外済み)。
|
|
1711
|
+
*/
|
|
1712
|
+
declare interface PrintSettings {
|
|
1713
|
+
/** 印刷する用紙サイズ。省略時は `book.paper.size` を使用。 */
|
|
1714
|
+
paperSize?: Exclude<PaperSizePreset, "Custom">;
|
|
1715
|
+
/** 用紙の向き。true = 横向き (landscape)。省略時は `book.paper.orientation` を使用。 */
|
|
1716
|
+
orientation?: boolean;
|
|
1717
|
+
/** 印刷余白。省略時はブラウザのデフォルト余白。 */
|
|
1718
|
+
margin?: PrintMargin;
|
|
1719
|
+
}
|
|
1720
|
+
|
|
1721
|
+
/**
|
|
1722
|
+
* coreのプロパティカタログに登録する1機能の定義。
|
|
1723
|
+
*
|
|
1724
|
+
* @remarks
|
|
1725
|
+
* `defaultProps` は `createPluginRegistry` でプラグイン単位に合成され、実際のブロック描画時は `PropDef.defaultProps` → `page.blockDefaults[kind]` → `block.props` の順でマージされる。
|
|
1726
|
+
*
|
|
1727
|
+
* 後段の値ほど優先される。
|
|
1728
|
+
*/
|
|
1729
|
+
export declare interface PropDef {
|
|
1730
|
+
/** プロパティの種別 ID。`BlockPlugin.properties` 内で一意になるよう設定する */
|
|
1731
|
+
kind: string;
|
|
1732
|
+
/** このプロパティを持つブロック種別のデフォルト props */
|
|
1733
|
+
defaultProps: Record<string, Value>;
|
|
1734
|
+
/**
|
|
1735
|
+
* カスタム編集UIコンポーネント(省略時はPropertyFieldのビルトインUIにフォールバック)。
|
|
1736
|
+
*
|
|
1737
|
+
* 外部プラグインは独自のエディタUIをここに渡すことができる。 * * `PropertyComponentProps<Value>` を実装することで `readOnly` が正しく受け取れる。
|
|
1738
|
+
*/
|
|
1739
|
+
component?: ComponentType<PropertyComponentProps<Value>>;
|
|
1740
|
+
}
|
|
1741
|
+
|
|
1742
|
+
/**
|
|
1743
|
+
* UI コンポーネント(Checkbox, NumberInput 等)の共通 Props 基底型。
|
|
1744
|
+
*/
|
|
1745
|
+
export declare interface PropertyComponentProps<T> {
|
|
1746
|
+
/** このコンポーネントが編集対象とする現在の値 */
|
|
1747
|
+
value: T;
|
|
1748
|
+
/** 値が変更されたときに呼ばれるコールバック */
|
|
1749
|
+
onChange: (value: T) => void;
|
|
1750
|
+
/**
|
|
1751
|
+
* `true` のとき、ユーザーによる値変更を禁止する。
|
|
1752
|
+
*
|
|
1753
|
+
* カスタムコンポーネントを実装する際は必ずこのフラグを参照してインタラクションを無効化すること。
|
|
1754
|
+
*/
|
|
1755
|
+
readOnly?: boolean;
|
|
1756
|
+
}
|
|
1757
|
+
|
|
1758
|
+
/**
|
|
1759
|
+
* Renderer コンポーネントが受け取る props。
|
|
1760
|
+
*/
|
|
1761
|
+
export declare interface RendererProps<P = Record<string, Value>, V = Value> {
|
|
1762
|
+
/** ブロック ID */
|
|
1763
|
+
id: string;
|
|
1764
|
+
/** ブロックのプロパティ(プラグイン固有型) */
|
|
1765
|
+
props: P;
|
|
1766
|
+
/** ブロックの値 */
|
|
1767
|
+
value: V;
|
|
1768
|
+
/** 値の変更通知コールバック */
|
|
1769
|
+
onChange: (value: V) => void;
|
|
1770
|
+
/** フォーカス離脱時の値確定通知コールバック(オプション) */
|
|
1771
|
+
onBlur?: (value: V) => void;
|
|
1772
|
+
/**
|
|
1773
|
+
* 読み取り専用フラグ。
|
|
1774
|
+
*
|
|
1775
|
+
* `BlockContainer` が以下のロジックで計算して渡す。
|
|
1776
|
+
*
|
|
1777
|
+
* - EDIT モード: `block.behavior?.readOnly ?? false`
|
|
1778
|
+
*
|
|
1779
|
+
* - FORM / VIEW モード: 常に `true`
|
|
1780
|
+
*/
|
|
1781
|
+
readOnly: boolean;
|
|
1782
|
+
/** Note のモード(`EDIT` / `VIEW` / `FORM`) */
|
|
1783
|
+
mode: NoteMode;
|
|
1784
|
+
/** ブロックの描画領域(px)。未設定時は auto として扱う */
|
|
1785
|
+
dimensions?: {
|
|
1786
|
+
widthPx: number;
|
|
1787
|
+
heightPx: number;
|
|
1788
|
+
};
|
|
1789
|
+
/**
|
|
1790
|
+
* ブロック幅の実測値(px)を通知するコールバック。
|
|
1791
|
+
*
|
|
1792
|
+
* `block.behavior.widthFit === true` のブロックに限り `BlockContainer` から渡される。
|
|
1793
|
+
*/
|
|
1794
|
+
onMeasureWidth?: (widthPx: number) => void;
|
|
1795
|
+
/**
|
|
1796
|
+
* ブロック高さの実測値(px)を通知するコールバック。
|
|
1797
|
+
*
|
|
1798
|
+
* `block.behavior.heightFit === true` のブロックに限り `BlockContainer` から渡される。
|
|
1799
|
+
*/
|
|
1800
|
+
onMeasureHeight?: (heightPx: number) => void;
|
|
1801
|
+
/** `BindingContext`(値の読み書きパス解決)。必要なブロックのみ参照する */
|
|
1802
|
+
bindingContext?: BindingContext;
|
|
1803
|
+
/** `ActionContext`(undo/redo 等のアクション実行)。必要なブロックのみ参照する */
|
|
1804
|
+
actionContext?: ActionContext;
|
|
1805
|
+
/** アクセシビリティラベル。`BlockRenderer` が `resolvedPlugin.meta.displayName` を自動セットする */
|
|
1806
|
+
ariaLabel?: string;
|
|
1807
|
+
}
|
|
1808
|
+
|
|
1809
|
+
/**
|
|
1810
|
+
* 必須入力プロパティの `PropDef`。
|
|
1811
|
+
*
|
|
1812
|
+
* @remarks
|
|
1813
|
+
* **Canvas** — ブロックプラグイン実装時に `plugin.props` へ追加する。
|
|
1814
|
+
*/
|
|
1815
|
+
export declare const requiredProp: {
|
|
1816
|
+
kind: string;
|
|
1817
|
+
defaultProps: {
|
|
1818
|
+
required: false;
|
|
1819
|
+
};
|
|
1820
|
+
};
|
|
1821
|
+
|
|
1822
|
+
/**
|
|
1823
|
+
* ブロックの必須入力設定を保持する Props。
|
|
1824
|
+
*/
|
|
1825
|
+
export declare interface RequiredProps {
|
|
1826
|
+
/** `true` のとき、値が空の場合にバリデーションエラーとなる */
|
|
1827
|
+
required?: boolean;
|
|
1828
|
+
}
|
|
1829
|
+
|
|
1830
|
+
/**
|
|
1831
|
+
* 必須バリデーションのみのスキーマ(Select・Checkbox で使用)。
|
|
1832
|
+
*/
|
|
1833
|
+
export declare interface RequiredSchema {
|
|
1834
|
+
/** `true` のとき、未入力または空値でエラーとなる。省略時はバリデーションしない */
|
|
1835
|
+
required?: boolean;
|
|
1836
|
+
}
|
|
1837
|
+
|
|
1838
|
+
/**
|
|
1839
|
+
* リサイズハンドル方向(8方向)
|
|
1840
|
+
*
|
|
1841
|
+
* @remarks
|
|
1842
|
+
* **Canvas** — {@link InteractionLayer} のリサイズハンドル方向。
|
|
1843
|
+
*/
|
|
1844
|
+
export declare enum ResizeHandle {
|
|
1845
|
+
N = "n",
|
|
1846
|
+
NE = "ne",
|
|
1847
|
+
E = "e",
|
|
1848
|
+
SE = "se",
|
|
1849
|
+
S = "s",
|
|
1850
|
+
SW = "sw",
|
|
1851
|
+
W = "w",
|
|
1852
|
+
NW = "nw"
|
|
1853
|
+
}
|
|
1854
|
+
|
|
1855
|
+
/**
|
|
1856
|
+
* レジストリに登録された解決済みプラグイン。
|
|
1857
|
+
*
|
|
1858
|
+
* @remarks
|
|
1859
|
+
* BlockPlugin<P,V> のジェネリクスを型消去し、Shell/Canvas 層が any なしで扱えるフラットな構造にまとめたもの。
|
|
1860
|
+
*
|
|
1861
|
+
* Renderer の P/V variance 問題は BaseRenderer 型への単一キャストで解決。
|
|
1862
|
+
*/
|
|
1863
|
+
export declare interface ResolvedPlugin {
|
|
1864
|
+
/** `block.kind` と対応するプラグインの一意識別子 */
|
|
1865
|
+
kind: string;
|
|
1866
|
+
/** UI 表示・アイコン・デフォルトサイズ等のメタ情報 */
|
|
1867
|
+
meta: BlockPluginMeta;
|
|
1868
|
+
/** プロパティパネルに表示するプロパティ定義一覧 */
|
|
1869
|
+
properties: PropDef[];
|
|
1870
|
+
/** プラグインの全 `PropDef.defaultProps` を合成した、このブロック種別のデフォルト props */
|
|
1871
|
+
defaultProps: Record<string, Value>;
|
|
1872
|
+
/**
|
|
1873
|
+
* ブロックを描画する Renderer コンポーネント。
|
|
1874
|
+
*
|
|
1875
|
+
* BlockPlugin<P,V>.Renderer を格納する際、P/V の variance 問題を回避するためベース型にキャストしている。
|
|
1876
|
+
*
|
|
1877
|
+
* 実行時には block.props(解決済み)と value が渡されるため安全。
|
|
1878
|
+
*/
|
|
1879
|
+
Renderer: BaseRenderer;
|
|
1880
|
+
/** 旧バージョンの props を現バージョンに変換する。`validateProps` の前に呼ばれる */
|
|
1881
|
+
migrateProps?: (props: unknown) => Record<string, unknown>;
|
|
1882
|
+
/**
|
|
1883
|
+
* ストレージから読み込んだ生の `block.props` をサニタイズして型安全な Props に変換する。
|
|
1884
|
+
*
|
|
1885
|
+
* 省略時は raw オブジェクトをそのまま使用する。
|
|
1886
|
+
*/
|
|
1887
|
+
validateProps?: (props: unknown) => Record<string, Value>;
|
|
1888
|
+
/**
|
|
1889
|
+
* 外部 state から読み込んだ生の値をサニタイズする。
|
|
1890
|
+
*
|
|
1891
|
+
* `undefined` を返した場合は `block.initValue`、それもなければ raw 値にフォールバックする。
|
|
1892
|
+
*
|
|
1893
|
+
* フォールバックを指示する場合にのみ `undefined` を使い、`null` は正当な値として返せる。
|
|
1894
|
+
*
|
|
1895
|
+
* 省略時は raw 値をそのまま使用する。
|
|
1896
|
+
*/
|
|
1897
|
+
validateValue?: (value: unknown, props: Record<string, Value>) => Value | undefined;
|
|
1898
|
+
}
|
|
1899
|
+
|
|
1900
|
+
/**
|
|
1901
|
+
* `book.paper` に `printSettings` のサイズ・向きをマージした実効用紙設定を返す。
|
|
1902
|
+
*
|
|
1903
|
+
* `printSettings` を省略した場合は `book.paper` をそのまま返す。
|
|
1904
|
+
*/
|
|
1905
|
+
export declare function resolveEffectivePaper(book: Book, printSettings?: PrintSettings): Paper;
|
|
1906
|
+
|
|
1907
|
+
/**
|
|
1908
|
+
* セレクトボックスブロックの props 型。
|
|
1909
|
+
*/
|
|
1910
|
+
export declare type SelectBlockProps = BaseBlockProps & FontStyleProps & PlaceholderProps & RequiredProps & SelectConfigProps;
|
|
1911
|
+
|
|
1912
|
+
/**
|
|
1913
|
+
* セレクトボックスブロックの値型。`null` は未選択状態を表す。
|
|
1914
|
+
*/
|
|
1915
|
+
export declare type SelectBlockValue = string | null;
|
|
1916
|
+
|
|
1917
|
+
/**
|
|
1918
|
+
* `selectConfig` prop 定義。セレクトボックスの選択肢デフォルト値を含む。
|
|
1919
|
+
*/
|
|
1920
|
+
export declare const selectConfigProp: {
|
|
1921
|
+
kind: string;
|
|
1922
|
+
defaultProps: {
|
|
1923
|
+
selectConfig: {
|
|
1924
|
+
options: {
|
|
1925
|
+
label: string;
|
|
1926
|
+
value: string;
|
|
1927
|
+
}[];
|
|
1928
|
+
};
|
|
1929
|
+
};
|
|
1930
|
+
};
|
|
1931
|
+
|
|
1932
|
+
/**
|
|
1933
|
+
* セレクトボックスの選択肢設定 props。
|
|
1934
|
+
*/
|
|
1935
|
+
export declare interface SelectConfigProps {
|
|
1936
|
+
/** 選択肢と機能設定。 */
|
|
1937
|
+
selectConfig: SelectOptionsConfig;
|
|
1938
|
+
}
|
|
1939
|
+
|
|
1940
|
+
/**
|
|
1941
|
+
* セレクトボックスの個々の選択肢。
|
|
1942
|
+
*/
|
|
1943
|
+
export declare interface SelectOption {
|
|
1944
|
+
/** ユーザーに表示するラベル。 */
|
|
1945
|
+
label: string;
|
|
1946
|
+
/** 選択時にブロック値として記録される内部値。 */
|
|
1947
|
+
value: string;
|
|
1948
|
+
/** ラベルに適用する文字色(任意)。 */
|
|
1949
|
+
color?: string;
|
|
1950
|
+
}
|
|
1951
|
+
|
|
1952
|
+
/**
|
|
1953
|
+
* セレクトボックスの選択肢一覧と機能設定。
|
|
1954
|
+
*/
|
|
1955
|
+
export declare interface SelectOptionsConfig {
|
|
1956
|
+
/** 選択肢の配列。 */
|
|
1957
|
+
options: SelectOption[];
|
|
1958
|
+
/** `true` のとき空白選択(未選択)を許可する。 */
|
|
1959
|
+
allowEmpty?: boolean;
|
|
1960
|
+
}
|
|
1961
|
+
|
|
1962
|
+
/**
|
|
1963
|
+
* セレクトボックスブロックのレンダラーコンポーネント。
|
|
1964
|
+
*
|
|
1965
|
+
* 選択肢一覧からユーザーが 1 つを選択し、`string | null` 値を管理する。
|
|
1966
|
+
*
|
|
1967
|
+
* `mode === NoteMode.VIEW` のときは選択ラベルをテキストとして表示する。
|
|
1968
|
+
*/
|
|
1969
|
+
export declare const SelectRenderer: ForwardRefExoticComponent<RendererProps<SelectBlockProps, SelectBlockValue> & RefAttributes<BlockRef>>;
|
|
1970
|
+
|
|
1971
|
+
/**
|
|
1972
|
+
* JSON シリアライズ可能なプロパティのみを持つオブジェクト型の境界。
|
|
1973
|
+
*
|
|
1974
|
+
* `BlockPlugin<P>` / `Block<P>` の型引数制約として使用し、`P` に関数・クラスインスタンス・DOM 要素など非 serializable な型が混入した場合に型エラーとして検出する。
|
|
1975
|
+
*
|
|
1976
|
+
* オプショナルフィールド(`?`)は `undefined` を許容するため `Value | undefined` としている。
|
|
1977
|
+
*/
|
|
1978
|
+
declare type SerializableRecord = Record<string, Value | undefined>;
|
|
1979
|
+
|
|
1980
|
+
/**
|
|
1981
|
+
* ブロックの幅・高さに使用できる単位の配列。
|
|
1982
|
+
*/
|
|
1983
|
+
export declare const SIZE_UNITS: readonly ["mm", "cm", "inch", "pt", "px", "%"];
|
|
1984
|
+
|
|
1985
|
+
/**
|
|
1986
|
+
* ブロックの幅・高さに使用できる単位(`%` を含む)。
|
|
1987
|
+
*/
|
|
1988
|
+
export declare type SizeUnit = (typeof SIZE_UNITS)[number];
|
|
1989
|
+
|
|
1990
|
+
/**
|
|
1991
|
+
* ブロック挿入 DnD を開始する。
|
|
1992
|
+
*
|
|
1993
|
+
* `dragstart` イベントハンドラ内で呼ぶ。
|
|
1994
|
+
*
|
|
1995
|
+
* ドロップ先は自動的に `NoteForm` がハンドルする。
|
|
1996
|
+
*
|
|
1997
|
+
* @example
|
|
1998
|
+
* ```tsx
|
|
1999
|
+
* <div
|
|
2000
|
+
* draggable
|
|
2001
|
+
* onDragStart={(e) => startBlockDrag(e, plugin.kind, plugin.meta.defaultSize)}
|
|
2002
|
+
* >
|
|
2003
|
+
* {plugin.meta.displayName}
|
|
2004
|
+
* </div>
|
|
2005
|
+
* ```
|
|
2006
|
+
*/
|
|
2007
|
+
export declare function startBlockDrag(e: default_2.DragEvent | DragEvent, kind: string, defaultSize?: {
|
|
2008
|
+
w: number;
|
|
2009
|
+
h: number;
|
|
2010
|
+
}): void;
|
|
2011
|
+
|
|
2012
|
+
/**
|
|
2013
|
+
* `stepperBehavior` prop 定義。
|
|
2014
|
+
*
|
|
2015
|
+
* @remarks
|
|
2016
|
+
* **Canvas** — カスタムプラグイン実装時に利用する。
|
|
2017
|
+
*/
|
|
2018
|
+
export declare const stepperBehaviorProp: {
|
|
2019
|
+
kind: string;
|
|
2020
|
+
defaultProps: {
|
|
2021
|
+
step: number;
|
|
2022
|
+
};
|
|
2023
|
+
};
|
|
2024
|
+
|
|
2025
|
+
/**
|
|
2026
|
+
* ステッパーの数値範囲・ステップ幅の振る舞い props。
|
|
2027
|
+
*
|
|
2028
|
+
* @remarks
|
|
2029
|
+
* **Canvas** — カスタムプラグイン実装時に利用する。
|
|
2030
|
+
*/
|
|
2031
|
+
export declare interface StepperBehaviorProps {
|
|
2032
|
+
/** 1ステップ当たりの増減幅。デフォルト: 1。 */
|
|
2033
|
+
step?: number;
|
|
2034
|
+
/** 入力可能な最小値。 */
|
|
2035
|
+
min?: number;
|
|
2036
|
+
/** 入力可能な最大値。 */
|
|
2037
|
+
max?: number;
|
|
2038
|
+
}
|
|
2039
|
+
|
|
2040
|
+
/**
|
|
2041
|
+
* ステッパーブロックの props 型。
|
|
2042
|
+
*
|
|
2043
|
+
* @remarks
|
|
2044
|
+
* **Canvas** — カスタムプラグイン向けの型。
|
|
2045
|
+
*
|
|
2046
|
+
* 一般的なフォーム構築では直接参照することはない。
|
|
2047
|
+
*/
|
|
2048
|
+
export declare type StepperBlockProps = BaseBlockProps & StepperBehaviorProps & StepperStyleProps;
|
|
2049
|
+
|
|
2050
|
+
/**
|
|
2051
|
+
* ステッパーブロックの値型。`null` は未入力状態を表す。
|
|
2052
|
+
*
|
|
2053
|
+
* @remarks
|
|
2054
|
+
* **Canvas** — カスタムプラグイン向けの型。
|
|
2055
|
+
*/
|
|
2056
|
+
export declare type StepperBlockValue = number | null;
|
|
2057
|
+
|
|
2058
|
+
/**
|
|
2059
|
+
* ステッパーブロックのプラグイン定義。
|
|
2060
|
+
*
|
|
2061
|
+
* `kind: "stepper"` で登録され、数値を±ボタンで増減する UI ブロック。
|
|
2062
|
+
*
|
|
2063
|
+
* @remarks
|
|
2064
|
+
* **Canvas** — カスタムプラグインの実装例。
|
|
2065
|
+
*
|
|
2066
|
+
* ステッパー機能が必要なフォームに `createPluginRegistry` に渡す。
|
|
2067
|
+
*
|
|
2068
|
+
* 標準フォーム構築では `createPluginRegistry` に渡すだけで使用できる。
|
|
2069
|
+
*/
|
|
2070
|
+
export declare const StepperPlugin: BlockPlugin<StepperBlockProps, StepperBlockValue>;
|
|
2071
|
+
|
|
2072
|
+
/**
|
|
2073
|
+
* ステッパーブロックのレンダラーコンポーネント。
|
|
2074
|
+
*
|
|
2075
|
+
* 上下のボタンで数値を `step` 幅分増減し、`min`/`max` でクランプする。
|
|
2076
|
+
*
|
|
2077
|
+
* @remarks
|
|
2078
|
+
* **Canvas** — `StepperPlugin` と組み合わせて使用する実装コンポーネント。
|
|
2079
|
+
*/
|
|
2080
|
+
export declare const StepperRenderer: ForwardRefExoticComponent<RendererProps<StepperBlockProps, StepperBlockValue> & RefAttributes<BlockRef>>;
|
|
2081
|
+
|
|
2082
|
+
/**
|
|
2083
|
+
* ステッパーの矢印外観カスタマイズ設定。
|
|
2084
|
+
*
|
|
2085
|
+
* @remarks
|
|
2086
|
+
* **Canvas** — カスタムプラグイン実装時に利用すること。
|
|
2087
|
+
*/
|
|
2088
|
+
export declare interface StepperStyleConfig {
|
|
2089
|
+
/** 矢印の色(CSS 値 / `currentColor` も可)。 */
|
|
2090
|
+
arrowColor?: string;
|
|
2091
|
+
/** 矢印の幅(px)。 */
|
|
2092
|
+
arrowWidth?: number;
|
|
2093
|
+
/** 矢印の高さ(px)。 */
|
|
2094
|
+
arrowHeight?: number;
|
|
2095
|
+
/** 矢印と値表示領域の間距(px)。 */
|
|
2096
|
+
arrowGap?: number;
|
|
2097
|
+
}
|
|
2098
|
+
|
|
2099
|
+
/**
|
|
2100
|
+
* `stepperStyle` prop 定義。
|
|
2101
|
+
*
|
|
2102
|
+
* @remarks
|
|
2103
|
+
* **Canvas** — カスタムプラグイン実装時に利用する。
|
|
2104
|
+
*/
|
|
2105
|
+
export declare const stepperStyleProp: {
|
|
2106
|
+
kind: string;
|
|
2107
|
+
defaultProps: {
|
|
2108
|
+
styleConfig: {
|
|
2109
|
+
arrowWidth: number;
|
|
2110
|
+
arrowHeight: number;
|
|
2111
|
+
arrowColor: string;
|
|
2112
|
+
arrowGap: number;
|
|
2113
|
+
};
|
|
2114
|
+
};
|
|
2115
|
+
};
|
|
2116
|
+
|
|
2117
|
+
/**
|
|
2118
|
+
* ステッパーブロックの外観カスタマイズ props。
|
|
2119
|
+
*
|
|
2120
|
+
* @remarks
|
|
2121
|
+
* **Canvas** — カスタムプラグイン実装時に利用する。
|
|
2122
|
+
*/
|
|
2123
|
+
export declare interface StepperStyleProps {
|
|
2124
|
+
/** 矢印外観カスタマイズ設定。 */
|
|
2125
|
+
styleConfig?: StepperStyleConfig;
|
|
2126
|
+
}
|
|
2127
|
+
|
|
2128
|
+
/**
|
|
2129
|
+
* 寸法文字列(例: `"210mm"`)を {@link Dimension} オブジェクトに変換する。
|
|
2130
|
+
*
|
|
2131
|
+
* @throws {@link Error} 文字列が `<数値><単位>` の形式でない場合、または単位が `allowedUnits` 外の場合
|
|
2132
|
+
*/
|
|
2133
|
+
export declare function stringToDimension<U extends Unit>(str: string, allowedUnits: readonly U[]): Dimension<U>;
|
|
2134
|
+
|
|
2135
|
+
/**
|
|
2136
|
+
* `textBehavior` prop 定義。テキストブロックのレイアウト挙動のデフォルト値を含む。
|
|
2137
|
+
*/
|
|
2138
|
+
export declare const textBehaviorProp: {
|
|
2139
|
+
kind: string;
|
|
2140
|
+
defaultProps: {
|
|
2141
|
+
lineHeight: number;
|
|
2142
|
+
multiline: true;
|
|
2143
|
+
wordWrap: WordWrap;
|
|
2144
|
+
whiteSpace: WhiteSpace;
|
|
2145
|
+
};
|
|
2146
|
+
};
|
|
2147
|
+
|
|
2148
|
+
/**
|
|
2149
|
+
* テキスト入力の改行・折り返し・行間隔などのレイアウト挙動 props。
|
|
2150
|
+
*/
|
|
2151
|
+
export declare interface TextBehaviorProps {
|
|
2152
|
+
/** 行間隔(CSS `line-height` 相当)。デフォルト: 1.2。 */
|
|
2153
|
+
lineHeight?: number;
|
|
2154
|
+
/** `true` のとき複数行入力を許可する。デフォルト: true。 */
|
|
2155
|
+
multiline?: boolean;
|
|
2156
|
+
/** 折り返しの振る舞い(CSS `overflow-wrap` 相当)。 */
|
|
2157
|
+
wordWrap?: WordWrap;
|
|
2158
|
+
/** スペース・改行のレンダリング模式(CSS `white-space` 相当)。 */
|
|
2159
|
+
whiteSpace?: WhiteSpace;
|
|
2160
|
+
}
|
|
2161
|
+
|
|
2162
|
+
/**
|
|
2163
|
+
* テキストブロックの props 型。
|
|
2164
|
+
*
|
|
2165
|
+
* フォント・文字幅返・入力バリデーション・プレースホルダーなどの属性群の共和型。
|
|
2166
|
+
*/
|
|
2167
|
+
export declare type TextBlockProps = BaseBlockProps & FontStyleProps & PlaceholderProps & RequiredProps & TextBehaviorProps & TextValidationProps;
|
|
2168
|
+
|
|
2169
|
+
/**
|
|
2170
|
+
* テキストブロックの値型。`null` は未入力状態を表す。
|
|
2171
|
+
*/
|
|
2172
|
+
export declare type TextBlockValue = string | null;
|
|
2173
|
+
|
|
2174
|
+
/**
|
|
2175
|
+
* テキストブロックのレンダラーコンポーネント。
|
|
2176
|
+
*
|
|
2177
|
+
* `multiline` prop に応じて `<input>` と `<textarea>` を切り替える。
|
|
2178
|
+
*
|
|
2179
|
+
* `onMeasureHeight` / `onMeasureWidth` を通じてコンテンツ高さ・幅を外部に通知する。
|
|
2180
|
+
*/
|
|
2181
|
+
export declare const TextRenderer: ForwardRefExoticComponent<RendererProps<TextBlockProps, TextBlockValue> & RefAttributes<BlockRef>>;
|
|
2182
|
+
|
|
2183
|
+
/**
|
|
2184
|
+
* `textValidation` prop 定義。テキスト入力のバリデーションルールのデフォルト値を含む。
|
|
2185
|
+
*/
|
|
2186
|
+
export declare const textValidationProp: {
|
|
2187
|
+
kind: string;
|
|
2188
|
+
defaultProps: {
|
|
2189
|
+
inputType: InputType;
|
|
2190
|
+
};
|
|
2191
|
+
};
|
|
2192
|
+
|
|
2193
|
+
/**
|
|
2194
|
+
* テキスト入力の入力タイプ・数値範囲・文字数・パターンなどのバリデーション props。
|
|
2195
|
+
*/
|
|
2196
|
+
export declare interface TextValidationProps {
|
|
2197
|
+
/** 入力タイプ(`<input type>` 属性)。デフォルト: `text`。 */
|
|
2198
|
+
inputType?: InputType;
|
|
2199
|
+
/** 数値入力の最小値。 */
|
|
2200
|
+
min?: number;
|
|
2201
|
+
/** 数値入力の最大値。 */
|
|
2202
|
+
max?: number;
|
|
2203
|
+
/** 数値入力のステップ幅。 */
|
|
2204
|
+
step?: number;
|
|
2205
|
+
/** 最小文字数。 */
|
|
2206
|
+
minLength?: number;
|
|
2207
|
+
/** 最大文字数。 */
|
|
2208
|
+
maxLength?: number;
|
|
2209
|
+
/** 入力値を検証する正規表現パターン。 */
|
|
2210
|
+
pattern?: string;
|
|
2211
|
+
}
|
|
2212
|
+
|
|
2213
|
+
/**
|
|
2214
|
+
* 各種単位の値を mm に変換するユーティリティオブジェクト。
|
|
2215
|
+
*
|
|
2216
|
+
* `fr` と `%` のような相対単位は物理長に変換できないため、`fromDim` でこれらを指定すると `Error` をスローする。
|
|
2217
|
+
*/
|
|
2218
|
+
export declare const toMm: {
|
|
2219
|
+
fromCm: (cm: number) => number;
|
|
2220
|
+
fromInch: (inch: number) => number;
|
|
2221
|
+
fromPt: (pt: number) => number;
|
|
2222
|
+
fromPx: (px: number) => number;
|
|
2223
|
+
fromDim<U extends Unit>(dim: Dimension<U>): number;
|
|
2224
|
+
};
|
|
2225
|
+
|
|
2226
|
+
/**
|
|
2227
|
+
* 各種単位の値を px に変換するユーティリティオブジェクト。
|
|
2228
|
+
*
|
|
2229
|
+
* `%` を変換する際は `fromDim` の `baseSizePx` が必要。`fr` の変換はサポートしていないため `Error` をスローする。
|
|
2230
|
+
*/
|
|
2231
|
+
export declare const toPx: {
|
|
2232
|
+
fromMm: (mm: number, dpi?: number) => number;
|
|
2233
|
+
fromCm: (cm: number, dpi?: number) => number;
|
|
2234
|
+
fromInch: (inch: number, dpi?: number) => number;
|
|
2235
|
+
fromPt: (pt: number, dpi?: number) => number;
|
|
2236
|
+
fromPx: (px: number, dpi?: number) => number;
|
|
2237
|
+
fromDim<U extends Unit>(dim: Dimension<U>, dpi?: number, baseSizePx?: number): number;
|
|
2238
|
+
};
|
|
2239
|
+
|
|
2240
|
+
/**
|
|
2241
|
+
* このパッケージで使用できる全単位。
|
|
2242
|
+
*/
|
|
2243
|
+
declare type Unit = (typeof ALL_UNITS)[number];
|
|
2244
|
+
|
|
2245
|
+
/**
|
|
2246
|
+
* このパッケージで扱う全単位の列挙。
|
|
2247
|
+
*/
|
|
2248
|
+
export declare const Units: {
|
|
2249
|
+
readonly MM: "mm";
|
|
2250
|
+
readonly CM: "cm";
|
|
2251
|
+
readonly FR: "fr";
|
|
2252
|
+
readonly INCH: "inch";
|
|
2253
|
+
readonly PT: "pt";
|
|
2254
|
+
readonly PX: "px";
|
|
2255
|
+
readonly PERCENT: "%";
|
|
2256
|
+
};
|
|
2257
|
+
|
|
2258
|
+
/**
|
|
2259
|
+
* SelectBlock を PaperUnit (mm / cm / inch) 選択専用設定にしたブロック定義ヘルパー。
|
|
2260
|
+
*
|
|
2261
|
+
* @remarks
|
|
2262
|
+
* **Canvas** — カスタムシェル構築向レイアウトヘルパー。
|
|
2263
|
+
*
|
|
2264
|
+
* binding には単位を保持するパス(例: "paper.size.width.unit")を渡す。
|
|
2265
|
+
*
|
|
2266
|
+
* 返り値のレイアウトはデフォルト `{ x:0, y:0, w:1, h:1 }` のため、
|
|
2267
|
+
* 複合 widget 内で spread して上書きすること。
|
|
2268
|
+
*
|
|
2269
|
+
* @example
|
|
2270
|
+
* ```ts
|
|
2271
|
+
* {
|
|
2272
|
+
* ...unitSelectBlock("width-unit", "paper.size.width.unit"),
|
|
2273
|
+
* layout: { x: 2, y: 0, w: 1, h: 1 },
|
|
2274
|
+
* }
|
|
2275
|
+
* ```
|
|
2276
|
+
*/
|
|
2277
|
+
export declare function unitSelectBlock(id: string, binding: string): Block;
|
|
2278
|
+
|
|
2279
|
+
/**
|
|
2280
|
+
* `ActionHandlers` から {@link ActionContext} を組み立てるフック。
|
|
2281
|
+
*
|
|
2282
|
+
* @remarks
|
|
2283
|
+
* **Canvas** — 通常は {@link useNoteContext} 経由で利用してください。
|
|
2284
|
+
*
|
|
2285
|
+
* 直接使用する場合はアクションの有効/無効判定を自前で実装する必要があります。
|
|
2286
|
+
*/
|
|
2287
|
+
export declare function useBookActionContext(handlers: ActionHandlers): ActionContext;
|
|
2288
|
+
|
|
2289
|
+
/**
|
|
2290
|
+
* book 全体の読み書きを担う BindingContext を生成するフック。
|
|
2291
|
+
*
|
|
2292
|
+
* @remarks
|
|
2293
|
+
* **Canvas** — 通常は {@link useNoteContext} 経由で自動生成される。
|
|
2294
|
+
*
|
|
2295
|
+
* 直接呼ぶのは独自の BindingContext レイヤーを構築する場合のみとすること。
|
|
2296
|
+
*
|
|
2297
|
+
* 以下のパス名前空間を組み込みで処理する:
|
|
2298
|
+
* - `paper.*` — `book.paper.*` に対応
|
|
2299
|
+
* - `margin.*` — `book.paper.margin.*` に対応(`margin.bulk` / `margin.all.*` も通常パスとして解決)
|
|
2300
|
+
* - `grid.*` — `book.pages[pageIdx].grid.*` に対応(`options.pageIdx` で制御)
|
|
2301
|
+
* - 上記以外 — `book` のルートから直接解決(後方互換)
|
|
2302
|
+
*
|
|
2303
|
+
* @example
|
|
2304
|
+
* ```tsx
|
|
2305
|
+
* const bindingContext = useBookBindingContext(book, onBookChange, { pageIdx });
|
|
2306
|
+
*
|
|
2307
|
+
* // 全ての widget に同じ bindingContext を渡すだけ
|
|
2308
|
+
* <FloatingWidget bindingContext={bindingContext} ... />
|
|
2309
|
+
* ```
|
|
2310
|
+
*/
|
|
2311
|
+
export declare function useBookBindingContext(book: Book, onBookChange: OnBookChange, options?: BookBindingContextOptions): BindingContext;
|
|
2312
|
+
|
|
2313
|
+
/**
|
|
2314
|
+
* `useReducer` ベースの Undo/Redo 履歴管理フック。
|
|
2315
|
+
*
|
|
2316
|
+
* 同じ `mergeKey` かつ {@link MERGE_WINDOW_MS} ms 以内の変更は履歴エントリをマージする。
|
|
2317
|
+
*
|
|
2318
|
+
* @remarks
|
|
2319
|
+
* **Canvas** — 通常は {@link useNoteContext} から自動利用される。
|
|
2320
|
+
*
|
|
2321
|
+
* 直接呼ぶのは独自の履歴層を構築する場合のみとすること。
|
|
2322
|
+
*/
|
|
2323
|
+
export declare function useBookHistory({ initialBook, maxHistory, }: UseBookHistoryOptions): UseBookHistoryResult;
|
|
2324
|
+
|
|
2325
|
+
/**
|
|
2326
|
+
* {@link useBookHistory} のオプション。
|
|
2327
|
+
*/
|
|
2328
|
+
export declare interface UseBookHistoryOptions {
|
|
2329
|
+
/** 履歴の初期 Book。 */
|
|
2330
|
+
initialBook: Book;
|
|
2331
|
+
/**
|
|
2332
|
+
* 保持する最大履歴件数。`null` または省略時は `100` が使われる。
|
|
2333
|
+
*
|
|
2334
|
+
* 超過した古いエントリは末尾追加時に先頭から切り捨てられる。
|
|
2335
|
+
*/
|
|
2336
|
+
maxHistory?: number | null;
|
|
2337
|
+
}
|
|
2338
|
+
|
|
2339
|
+
/**
|
|
2340
|
+
* {@link useBookHistory} の戻り値。
|
|
2341
|
+
*/
|
|
2342
|
+
export declare interface UseBookHistoryResult {
|
|
2343
|
+
/** 現在の Book(履歴上のカレントポインタ側)。 */
|
|
2344
|
+
book: Book;
|
|
2345
|
+
/** Book の変更を履歴に追加するコールバック。`mergeKey` が同じ変更はマージされる(`noTimeWindow: true` で時間窓なし)。 */
|
|
2346
|
+
handleBookChange: (book: Book, options?: {
|
|
2347
|
+
mergeKey?: string;
|
|
2348
|
+
noTimeWindow?: boolean;
|
|
2349
|
+
}) => void;
|
|
2350
|
+
/** Undo 可能かどうか。 */
|
|
2351
|
+
canUndo: boolean;
|
|
2352
|
+
/** Redo 可能かどうか。 */
|
|
2353
|
+
canRedo: boolean;
|
|
2354
|
+
/** Undo 実行関数。 */
|
|
2355
|
+
undo: () => void;
|
|
2356
|
+
/** Redo 実行関数。 */
|
|
2357
|
+
redo: () => void;
|
|
2358
|
+
/** `useBookActionContext` にそのまま渡せる undo/redo の ActionHandlers。 */
|
|
2359
|
+
historyActionHandlers: ActionHandlers;
|
|
2360
|
+
}
|
|
2361
|
+
|
|
2362
|
+
/**
|
|
2363
|
+
* `InteractionLayer` に渡す `state` と `onStateChange` を提供する。
|
|
2364
|
+
*
|
|
2365
|
+
* @example
|
|
2366
|
+
* ```tsx
|
|
2367
|
+
* const [state, onStateChange] = useInteractionState();
|
|
2368
|
+
* return <InteractionLayer state={state} onStateChange={onStateChange} ... />;
|
|
2369
|
+
* ```
|
|
2370
|
+
*
|
|
2371
|
+
* @remarks
|
|
2372
|
+
* **Canvas** — {@link InteractionLayer} の `state` / `onStateChange` を提供するシンプルなフック。
|
|
2373
|
+
*/
|
|
2374
|
+
export declare function useInteractionState(initialState?: Partial<InteractionState>): [InteractionState, Dispatch<SetStateAction<InteractionState>>];
|
|
2375
|
+
|
|
2376
|
+
/**
|
|
2377
|
+
* 未検証の値を {@link Page} として検証する。
|
|
2378
|
+
*
|
|
2379
|
+
* @throws {@link Error} ページの構造(`grid` / `blocks` / `metaData`)が不正な場合
|
|
2380
|
+
*/
|
|
2381
|
+
export declare function validatePage(value: unknown): Page;
|
|
2382
|
+
|
|
2383
|
+
/**
|
|
2384
|
+
* 未検証の値を `Record<string, Value>` として検証する。
|
|
2385
|
+
*
|
|
2386
|
+
* @throws {@link Error} 値がプレインオブジェクトでない場合、またはいずれかのプロパティが無効な {@link Value} の場合
|
|
2387
|
+
*/
|
|
2388
|
+
export declare function validateValues(data: unknown): Record<string, Value>;
|
|
2389
|
+
|
|
2390
|
+
/**
|
|
2391
|
+
* バリデーション結果の1件分。プラグインのバリデーター関数が返す配列の要素型。
|
|
2392
|
+
*
|
|
2393
|
+
* @remarks
|
|
2394
|
+
* `useNoteLayout` が `Record<blockId, ValidationError[]>` として管理する。
|
|
2395
|
+
*/
|
|
2396
|
+
declare interface ValidationError {
|
|
2397
|
+
/** ユーザーに表示するエラーメッセージ */
|
|
2398
|
+
message: string;
|
|
2399
|
+
/** エラー種別を識別するコード(例: `"required"`, `"min_length"`) */
|
|
2400
|
+
code: string;
|
|
2401
|
+
/** エラーに関連するフィールド名。ブロック内の特定フィールドを示す場合に使用。 */
|
|
2402
|
+
field?: string;
|
|
2403
|
+
/** 重大度レベル */
|
|
2404
|
+
severity: ValidationSeverity;
|
|
2405
|
+
/** プラグインが付加する任意のメタデータ */
|
|
2406
|
+
metadata?: Record<string, Value>;
|
|
2407
|
+
}
|
|
2408
|
+
|
|
2409
|
+
/**
|
|
2410
|
+
* バリデーションエラーを示すオーバーレイコンポーネント。
|
|
2411
|
+
*
|
|
2412
|
+
* エラーがある場合は黒黄の縞模様を表示し、ホバー時にエラーメッセージをツールチップが示します。
|
|
2413
|
+
*
|
|
2414
|
+
* @remarks
|
|
2415
|
+
* **Canvas** — {@link BlockLayer} のバリデーションオーバーレイサブコンポーネント。
|
|
2416
|
+
*
|
|
2417
|
+
* 通常は {@link BlockLayer} の `showValidation` prop で制御する。
|
|
2418
|
+
*/
|
|
2419
|
+
export declare const ValidationOverlay: FC<ValidationOverlayProps>;
|
|
2420
|
+
|
|
2421
|
+
/**
|
|
2422
|
+
* `ValidationOverlay` コンポーネントへの props。
|
|
2423
|
+
*/
|
|
2424
|
+
export declare interface ValidationOverlayProps {
|
|
2425
|
+
/** ブロックのサイズ(px)。 */
|
|
2426
|
+
blockSizePx: BlockSizePx;
|
|
2427
|
+
/** z-index のベース値。 */
|
|
2428
|
+
blockZIndex: number;
|
|
2429
|
+
/** 表示するバリデーションエラー一覧。空配列の場合は描画しない。 */
|
|
2430
|
+
errors: ValidationError[];
|
|
2431
|
+
}
|
|
2432
|
+
|
|
2433
|
+
/**
|
|
2434
|
+
* バリデーションプロパティのスキーマ(Text で使用)。
|
|
2435
|
+
*/
|
|
2436
|
+
export declare interface ValidationSchema extends RequiredSchema {
|
|
2437
|
+
/** 入力文字数の最小値。省略時はチェックしない */
|
|
2438
|
+
minLength?: number;
|
|
2439
|
+
/** 入力文字数の最大値。省略時はチェックしない */
|
|
2440
|
+
maxLength?: number;
|
|
2441
|
+
/** 入力値にマッチさせる正規表現パターン。省略時はチェックしない */
|
|
2442
|
+
pattern?: string;
|
|
2443
|
+
}
|
|
2444
|
+
|
|
2445
|
+
/**
|
|
2446
|
+
* バリデーション結果の重大度レベル。
|
|
2447
|
+
*/
|
|
2448
|
+
declare enum ValidationSeverity {
|
|
2449
|
+
/** 修正が必要なエラー */
|
|
2450
|
+
ERROR = "error",
|
|
2451
|
+
/** 推奨される修正があるが続行可能な警告 */
|
|
2452
|
+
WARNING = "warning",
|
|
2453
|
+
/** 参考情報 */
|
|
2454
|
+
INFO = "info"
|
|
2455
|
+
}
|
|
2456
|
+
|
|
2457
|
+
/**
|
|
2458
|
+
* このパッケージで扱う値の型。JSON シリアライズ可能な値のみを表す再帰型。
|
|
2459
|
+
*
|
|
2460
|
+
* ブロックの入力値・バインディング値・スキーマのデフォルト値などに共通して使用される。
|
|
2461
|
+
*/
|
|
2462
|
+
declare type Value = string | number | boolean | null | Value[] | readonly Value[] | {
|
|
2463
|
+
[key: string]: Value;
|
|
2464
|
+
};
|
|
2465
|
+
|
|
2466
|
+
/**
|
|
2467
|
+
* 1 件の値変更を表す。
|
|
2468
|
+
*
|
|
2469
|
+
* @remarks
|
|
2470
|
+
* `value` が `undefined` の場合はそのブロックの値を削除する。
|
|
2471
|
+
*/
|
|
2472
|
+
export declare type ValueChange = {
|
|
2473
|
+
id: string;
|
|
2474
|
+
value: Value | undefined;
|
|
2475
|
+
};
|
|
2476
|
+
|
|
2477
|
+
/**
|
|
2478
|
+
* ブロック内の垂直配置。
|
|
2479
|
+
*/
|
|
2480
|
+
export declare enum VerticalAlign {
|
|
2481
|
+
top = "top",
|
|
2482
|
+
center = "center",
|
|
2483
|
+
bottom = "bottom"
|
|
2484
|
+
}
|
|
2485
|
+
|
|
2486
|
+
/**
|
|
2487
|
+
* テキストの改行・スペースのレンダリング模式(CSS `white-space` 相当)。
|
|
2488
|
+
*/
|
|
2489
|
+
export declare enum WhiteSpace {
|
|
2490
|
+
normal = "normal",
|
|
2491
|
+
nowrap = "nowrap",
|
|
2492
|
+
pre = "pre",
|
|
2493
|
+
preWrap = "pre-wrap",
|
|
2494
|
+
preLine = "pre-line"
|
|
2495
|
+
}
|
|
2496
|
+
|
|
2497
|
+
/**
|
|
2498
|
+
* ウィジェット定義。NoteBlockProps と必要プラグインを一体化した型。
|
|
2499
|
+
*
|
|
2500
|
+
* @remarks
|
|
2501
|
+
* {@link FloatingWidget} に渡すことで、`pluginRegistry` を別途用意する必要がなくなる。
|
|
2502
|
+
*
|
|
2503
|
+
* `plugins` には、このウィジェットを描画するために必要なプラグインをすべて列挙する。
|
|
2504
|
+
*
|
|
2505
|
+
* `FloatingWidget` はこれを元に内部で `PluginRegistry` を構築する。
|
|
2506
|
+
*/
|
|
2507
|
+
declare interface WidgetDef {
|
|
2508
|
+
/** Widget として表示する NoteBlock の初期データ */
|
|
2509
|
+
props: NoteBlockProps;
|
|
2510
|
+
/** このウィジェットを描画するために必要なプラグイン */
|
|
2511
|
+
plugins: readonly AnyBlockPlugin[];
|
|
2512
|
+
}
|
|
2513
|
+
|
|
2514
|
+
/**
|
|
2515
|
+
* テキストの折り返し・改行插入の振る舞い。
|
|
2516
|
+
*/
|
|
2517
|
+
export declare enum WordWrap {
|
|
2518
|
+
normal = "normal",
|
|
2519
|
+
breakWord = "break-word",
|
|
2520
|
+
breakAll = "break-all"
|
|
2521
|
+
}
|
|
2522
|
+
|
|
2523
|
+
export { }
|