108 lines
3.1 KiB
TypeScript
108 lines
3.1 KiB
TypeScript
import type { ImageWidthPresetId } from "./image-display";
|
||
|
||
export type MobileEditorLocale = "zh-CN" | "en-US";
|
||
|
||
export type MobileEditorToolbarActionId =
|
||
| "image"
|
||
| "bold"
|
||
| "bulletList"
|
||
| "taskList"
|
||
| "increaseListIndent"
|
||
| "decreaseListIndent"
|
||
| "blockquote"
|
||
| "horizontalRule";
|
||
|
||
export const MOBILE_EDITOR_ACTIVE_FLAGS = {
|
||
bold: 1,
|
||
taskList: 2,
|
||
bulletList: 8,
|
||
blockquote: 16,
|
||
} as const;
|
||
|
||
export const MOBILE_EDITOR_TOOLBAR_ACTIONS = [
|
||
{ id: "image", activeFlag: 0 },
|
||
{ id: "bold", activeFlag: MOBILE_EDITOR_ACTIVE_FLAGS.bold },
|
||
{ id: "bulletList", activeFlag: MOBILE_EDITOR_ACTIVE_FLAGS.bulletList },
|
||
{ id: "taskList", activeFlag: MOBILE_EDITOR_ACTIVE_FLAGS.taskList },
|
||
{ id: "increaseListIndent", activeFlag: 0 },
|
||
{ id: "decreaseListIndent", activeFlag: 0 },
|
||
{ id: "blockquote", activeFlag: MOBILE_EDITOR_ACTIVE_FLAGS.blockquote },
|
||
{ id: "horizontalRule", activeFlag: 0 },
|
||
] as const satisfies ReadonlyArray<{
|
||
id: MobileEditorToolbarActionId;
|
||
activeFlag: number;
|
||
}>;
|
||
|
||
const MOBILE_EDITOR_COPY = {
|
||
"zh-CN": {
|
||
placeholder: "开始记录...",
|
||
toolbar: "编辑器工具栏",
|
||
actions: {
|
||
image: "上传图片",
|
||
bold: "加粗",
|
||
bulletList: "无序列表",
|
||
taskList: "任务清单",
|
||
increaseListIndent: "增加列表层级（Tab）",
|
||
decreaseListIndent: "减少列表层级（Shift + Tab）",
|
||
blockquote: "引用",
|
||
horizontalRule: "分割线",
|
||
},
|
||
imageScale: "图片显示尺寸",
|
||
imageSizes: {
|
||
small: "较小",
|
||
medium: "适中",
|
||
large: "较大",
|
||
full: "铺满",
|
||
},
|
||
},
|
||
"en-US": {
|
||
placeholder: "Start writing...",
|
||
toolbar: "Editor toolbar",
|
||
actions: {
|
||
image: "Upload image",
|
||
bold: "Bold",
|
||
bulletList: "Bullet list",
|
||
taskList: "Task list",
|
||
increaseListIndent: "Increase list level (Tab)",
|
||
decreaseListIndent: "Decrease list level (Shift + Tab)",
|
||
blockquote: "Quote",
|
||
horizontalRule: "Horizontal rule",
|
||
},
|
||
imageScale: "Image display size",
|
||
imageSizes: {
|
||
small: "Small",
|
||
medium: "Medium",
|
||
large: "Large",
|
||
full: "Full",
|
||
},
|
||
},
|
||
} as const;
|
||
|
||
export const getMobileEditorPlaceholder = (locale: MobileEditorLocale): string =>
|
||
MOBILE_EDITOR_COPY[locale].placeholder;
|
||
|
||
export const getMobileEditorToolbarLabel = (locale: MobileEditorLocale): string =>
|
||
MOBILE_EDITOR_COPY[locale].toolbar;
|
||
|
||
export const getMobileEditorToolbarActionLabel = (
|
||
action: MobileEditorToolbarActionId,
|
||
locale: MobileEditorLocale
|
||
): string => MOBILE_EDITOR_COPY[locale].actions[action];
|
||
|
||
export const getMobileEditorImageScaleLabel = (locale: MobileEditorLocale): string =>
|
||
MOBILE_EDITOR_COPY[locale].imageScale;
|
||
|
||
export const getMobileEditorImageWidthPresetLabel = (
|
||
preset: ImageWidthPresetId,
|
||
locale: MobileEditorLocale
|
||
): string => MOBILE_EDITOR_COPY[locale].imageSizes[preset];
|
||
|
||
export const getMobileEditorInputAttributes = (className: string): Record<string, string> => ({
|
||
autocapitalize: "sentences",
|
||
autocomplete: "on",
|
||
autocorrect: "on",
|
||
class: className,
|
||
inputmode: "text",
|
||
spellcheck: "true",
|
||
});
|