feat(creator-studio): 公众号式插入面板与封面条
- 新增常驻「添加内容」按钮与插入面板：分组网格列出正文/标题/列表/引用、 图片/视频/嵌入、代码/分隔线/表格/付费内容；条目不满足能力时不出现在面板里 - 面板支持方向键在网格内移动焦点、Esc 关闭；桌面居中浮层，移动端贴底抽屉并 留出安全区 - 空文档插入区块时替换初始空白段落，不留空行 - 新增封面条：无封面时给低调入口，有封面时显示 2.35:1 缩略图，悬停出现 「更换封面」，右上角可移除 - 补充契约测试：头部/页脚/挂件区开关、插入面板真实区块名与能力过滤、 中文字数口径 Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
kate522andClaude Opus 5 committed
1 parent
d07cffe99e
commit
79909f449e
10 files changed
+678
-7
No files matched your search
@@ -0,0 +1,56 @@
|
||||
/**
|
||||
* 封面预览条（公众号式）。
|
||||
*
|
||||
* 位于标题上方一行：有封面时显示缩略图，点击回到发布抽屉的封面区；
|
||||
* 无封面时给一个低调的入口。封面能力由服务端 bootstrap 决定，前端不放大权限。
|
||||
*
|
||||
* @package Jio
|
||||
*/
|
||||
|
||||
import { __ } from '@wordpress/i18n';
|
||||
|
||||
type Featured = { type: string; data: Record<string, any>; mediaId?: number };
|
||||
|
||||
type Props = {
|
||||
featured: Featured;
|
||||
canEdit: boolean;
|
||||
onOpen: () => void;
|
||||
onClear: () => void;
|
||||
};
|
||||
|
||||
export function CoverStrip({ featured, canEdit, onOpen, onClear }: Props) {
|
||||
const url = typeof featured?.data?.url === 'string' ? featured.data.url : '';
|
||||
|
||||
if (!canEdit) {
|
||||
return null;
|
||||
}
|
||||
|
||||
if (!url) {
|
||||
return (
|
||||
<button type="button" className="jio-creator__cover is-empty" onClick={onOpen}>
|
||||
<i className="fa far fa-image" aria-hidden="true" />
|
||||
<span>{__('添加封面', 'jio')}</span>
|
||||
</button>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="jio-creator__cover">
|
||||
<button type="button" className="jio-creator__cover-thumb" onClick={onOpen}>
|
||||
<img src={url} alt="" />
|
||||
<span className="jio-creator__cover-edit">
|
||||
<i className="fa fas fa-pen" aria-hidden="true" />
|
||||
{__('更换封面', 'jio')}
|
||||
</span>
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
className="jio-creator__cover-clear"
|
||||
onClick={onClear}
|
||||
aria-label={__('移除封面', 'jio')}
|
||||
>
|
||||
<i className="fa fas fa-times" aria-hidden="true" />
|
||||
</button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -9,9 +9,9 @@
|
||||
*/
|
||||
|
||||
import { createRoot, useCallback, useEffect, useMemo, useRef, useState } from '@wordpress/element';
|
||||
import { parse, serialize } from '@wordpress/blocks';
|
||||
import { createBlock, parse, serialize } from '@wordpress/blocks';
|
||||
import { registerCoreBlocks } from '@wordpress/block-library';
|
||||
import { useSelect } from '@wordpress/data';
|
||||
import { useDispatch, useSelect } from '@wordpress/data';
|
||||
import { BlockEditorProvider, BlockList, BlockTools } from '@wordpress/block-editor';
|
||||
import { count as countWords } from '@wordpress/wordcount';
|
||||
import { __ } from '@wordpress/i18n';
|
||||
@@ -20,6 +20,9 @@ import { apiPost } from './services/api';
|
||||
import { installApiFetchNonce } from './services/api-fetch';
|
||||
import { installMediaUploadBridge } from './services/media';
|
||||
import { PublishDrawer } from './panels/publish-drawer';
|
||||
import { CoverStrip } from './components/cover-strip';
|
||||
import { InsertPanel, type InsertItem } from './panels/insert-panel';
|
||||
import { buildInsertGroups } from './utils/insert-items';
|
||||
import { SaveState, type SaveStateValue } from './components/save-state';
|
||||
import { useAutosave } from './hooks/use-autosave';
|
||||
import { useLocalRecovery } from './hooks/use-local-recovery';
|
||||
@@ -106,6 +109,7 @@ function Studio(): JSX.Element {
|
||||
const [blocks, setBlocks] = useState(() => parse(draft.content || ''));
|
||||
const [saveState, setSaveState] = useState<SaveStateValue>({ state: 'ready', at: '' });
|
||||
const [drawerOpen, setDrawerOpen] = useState(false);
|
||||
const [insertOpen, setInsertOpen] = useState(false);
|
||||
const [notice, setNotice] = useState<{ tone: 'ok' | 'error'; text: string } | null>(null);
|
||||
const [recovery, setRecovery] = useState<null | { savedAt: string }>(null);
|
||||
const dirtyRef = useRef(false);
|
||||
@@ -328,9 +332,26 @@ function Studio(): JSX.Element {
|
||||
[]
|
||||
);
|
||||
|
||||
const insertGroups = useMemo(() => buildInsertGroups(capabilities), [capabilities]);
|
||||
|
||||
const insertBlock = useCallback(
|
||||
(item: InsertItem) => {
|
||||
setInsertOpen(false);
|
||||
dirtyRef.current = true;
|
||||
setBlocks((current: any[]) => {
|
||||
// 空文档时直接替换初始的空白段落，避免留下一个空行。
|
||||
const next = [...current];
|
||||
if (next.length === 1 && next[0].name === 'core/paragraph' && !next[0].attributes?.content) {
|
||||
return [createBlock(item.name, item.attributes || {})];
|
||||
}
|
||||
return [...next, createBlock(item.name, item.attributes || {})];
|
||||
});
|
||||
},
|
||||
[]
|
||||
);
|
||||
|
||||
return (
|
||||
<div className="jio-creator" data-status={bootstrap.status || ''} data-blocks={selectedBlockCount}>
|
||||
<header className="jio-creator__bar">
|
||||
<div className="jio-creator" data-status={bootstrap.status || ''} data-blocks={selectedBlockCount}> <header className="jio-creator__bar">
|
||||
<a className="jio-creator__back" href={bootstrap.urls?.center || '/'}>
|
||||
<i className="fa fas fa-angle-left" aria-hidden="true" />
|
||||
<span>{__('返回', 'jio')}</span>
|
||||
@@ -371,6 +392,13 @@ function Studio(): JSX.Element {
|
||||
)}
|
||||
|
||||
<main className="jio-creator__canvas">
|
||||
<CoverStrip
|
||||
featured={draft.featured}
|
||||
canEdit={!!capabilities.canUploadImage}
|
||||
onOpen={() => setDrawerOpen(true)}
|
||||
onClear={() => patchDraft({ featured: { type: '', data: {} } })}
|
||||
/>
|
||||
|
||||
<label className="jio-creator__title">
|
||||
<span className="screen-reader-text">{__('文章标题', 'jio')}</span>
|
||||
<textarea
|
||||
@@ -407,6 +435,18 @@ function Studio(): JSX.Element {
|
||||
<BlockList />
|
||||
</BlockTools>
|
||||
</BlockEditorProvider>
|
||||
|
||||
{/* 公众号式常驻插入按钮：始终停在正文末尾，点击打开内容面板。 */}
|
||||
<button
|
||||
type="button"
|
||||
className="jio-creator__insert"
|
||||
onClick={() => setInsertOpen(true)}
|
||||
aria-haspopup="dialog"
|
||||
aria-expanded={insertOpen}
|
||||
>
|
||||
<i className="fa fas fa-plus" aria-hidden="true" />
|
||||
<span>{__('添加内容', 'jio')}</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<footer className="jio-creator__footer">
|
||||
@@ -417,6 +457,14 @@ function Studio(): JSX.Element {
|
||||
</footer>
|
||||
</main>
|
||||
|
||||
{insertOpen && (
|
||||
<InsertPanel
|
||||
groups={insertGroups}
|
||||
onInsert={insertBlock}
|
||||
onClose={() => setInsertOpen(false)}
|
||||
/>
|
||||
)}
|
||||
|
||||
{drawerOpen && (
|
||||
<PublishDrawer
|
||||
draft={draft}
|
||||
|
||||
@@ -0,0 +1,122 @@
|
||||
/**
|
||||
* 悬浮插入面板（公众号式）。
|
||||
*
|
||||
* 正文底部常驻一个「+」，点开是分组网格：常用文本、媒体、样式。
|
||||
* 桌面端为居中浮层，移动端贴底弹出；键盘可操作，Esc 关闭。
|
||||
*
|
||||
* @package Jio
|
||||
*/
|
||||
|
||||
import { useEffect, useMemo, useRef } from '@wordpress/element';
|
||||
import { __ } from '@wordpress/i18n';
|
||||
|
||||
export type InsertItem = {
|
||||
name: string;
|
||||
title: string;
|
||||
icon: string;
|
||||
attributes?: Record<string, any>;
|
||||
};
|
||||
|
||||
export type InsertGroup = {
|
||||
label: string;
|
||||
items: InsertItem[];
|
||||
};
|
||||
|
||||
type Props = {
|
||||
groups: InsertGroup[];
|
||||
onInsert: (item: InsertItem) => void;
|
||||
onClose: () => void;
|
||||
};
|
||||
|
||||
export function InsertPanel({ groups, onInsert, onClose }: Props) {
|
||||
const panelRef = useRef<HTMLDivElement | null>(null);
|
||||
const closeRef = useRef<HTMLButtonElement | null>(null);
|
||||
|
||||
const items = useMemo(() => groups.flatMap((group) => group.items), [groups]);
|
||||
|
||||
useEffect(() => {
|
||||
closeRef.current?.focus();
|
||||
|
||||
const onKeyDown = (event: KeyboardEvent) => {
|
||||
if (event.key === 'Escape') {
|
||||
event.preventDefault();
|
||||
onClose();
|
||||
return;
|
||||
}
|
||||
if (!['ArrowRight', 'ArrowLeft', 'ArrowDown', 'ArrowUp'].includes(event.key)) {
|
||||
return;
|
||||
}
|
||||
// 在网格内用方向键移动焦点，避免必须用鼠标。
|
||||
const buttons = Array.from(
|
||||
panelRef.current?.querySelectorAll<HTMLButtonElement>('.jio-insert-item') || []
|
||||
);
|
||||
const index = buttons.indexOf(document.activeElement as HTMLButtonElement);
|
||||
if (index === -1) {
|
||||
return;
|
||||
}
|
||||
event.preventDefault();
|
||||
const columns = window.innerWidth <= 767 ? 4 : 6;
|
||||
const delta =
|
||||
event.key === 'ArrowRight' ? 1 : event.key === 'ArrowLeft' ? -1 : event.key === 'ArrowDown' ? columns : -columns;
|
||||
const next = Math.min(buttons.length - 1, Math.max(0, index + delta));
|
||||
buttons[next]?.focus();
|
||||
};
|
||||
|
||||
document.addEventListener('keydown', onKeyDown);
|
||||
return () => document.removeEventListener('keydown', onKeyDown);
|
||||
}, [onClose]);
|
||||
|
||||
return (
|
||||
<div className="jio-insert" role="dialog" aria-modal="true" aria-label={__('添加内容', 'jio')}>
|
||||
<button
|
||||
type="button"
|
||||
className="jio-insert__backdrop"
|
||||
aria-label={__('关闭', 'jio')}
|
||||
onClick={onClose}
|
||||
/>
|
||||
<div className="jio-insert__panel" ref={panelRef}>
|
||||
<header className="jio-insert__head">
|
||||
<h2>{__('添加内容', 'jio')}</h2>
|
||||
<button
|
||||
type="button"
|
||||
className="jio-insert__close"
|
||||
onClick={onClose}
|
||||
ref={closeRef}
|
||||
aria-label={__('关闭', 'jio')}
|
||||
>
|
||||
<i className="fa fas fa-times" aria-hidden="true" />
|
||||
</button>
|
||||
</header>
|
||||
|
||||
<div className="jio-insert__body">
|
||||
{groups.map((group) =>
|
||||
group.items.length === 0 ? null : (
|
||||
<section className="jio-insert__group" key={group.label}>
|
||||
<h3>{group.label}</h3>
|
||||
<div className="jio-insert__grid">
|
||||
{group.items.map((item) => (
|
||||
<button
|
||||
key={item.name}
|
||||
type="button"
|
||||
className="jio-insert-item"
|
||||
onClick={() => onInsert(item)}
|
||||
>
|
||||
<span className="jio-insert-item__icon" aria-hidden="true">
|
||||
<i className={item.icon} />
|
||||
</span>
|
||||
<span className="jio-insert-item__label">{item.title}</span>
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
)}
|
||||
|
||||
{items.length === 0 && (
|
||||
<p className="jio-creator-muted">{__('当前账号没有可插入的内容类型。', 'jio')}</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -364,6 +364,255 @@ $warn: #b4573f;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
/* ---------- 封面预览条 ---------- */
|
||||
|
||||
.jio-creator__cover {
|
||||
position: relative;
|
||||
margin-bottom: 18px;
|
||||
|
||||
&.is-empty {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 7px;
|
||||
min-height: 32px;
|
||||
padding: 0 12px;
|
||||
border: 1px dashed #d3ded8;
|
||||
border-radius: 8px;
|
||||
background: transparent;
|
||||
color: #8c9a94;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
transition: border-color 0.16s ease, color 0.16s ease;
|
||||
|
||||
&:hover,
|
||||
&:focus-visible {
|
||||
border-color: var(--jc-accent);
|
||||
color: var(--jc-accent-strong);
|
||||
outline: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.jio-creator__cover-thumb {
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
border: 0;
|
||||
border-radius: 10px;
|
||||
background: #eef3f0;
|
||||
cursor: pointer;
|
||||
|
||||
img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
aspect-ratio: 2.35 / 1;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
&:focus-visible {
|
||||
outline: 2px solid var(--jc-accent);
|
||||
outline-offset: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.jio-creator__cover-edit {
|
||||
position: absolute;
|
||||
inset: auto 0 0 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 6px;
|
||||
padding: 8px;
|
||||
background: linear-gradient(to top, rgba(15, 25, 22, 0.62), rgba(15, 25, 22, 0));
|
||||
color: #fff;
|
||||
font-size: 12px;
|
||||
opacity: 0;
|
||||
transition: opacity 0.16s ease;
|
||||
}
|
||||
|
||||
.jio-creator__cover-thumb:hover .jio-creator__cover-edit,
|
||||
.jio-creator__cover-thumb:focus-visible .jio-creator__cover-edit {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.jio-creator__cover-clear {
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
right: 8px;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
border: 0;
|
||||
border-radius: 50%;
|
||||
background: rgba(15, 25, 22, 0.55);
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover,
|
||||
&:focus-visible {
|
||||
background: rgba(15, 25, 22, 0.78);
|
||||
outline: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* ---------- 常驻插入按钮 ---------- */
|
||||
|
||||
.jio-creator__insert {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 8px;
|
||||
min-height: 46px;
|
||||
margin: 8px 0 26px;
|
||||
border: 1px dashed #d3ded8;
|
||||
border-radius: 10px;
|
||||
background: transparent;
|
||||
color: #7c8c86;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
transition: border-color 0.18s ease, color 0.18s ease, background 0.18s ease;
|
||||
|
||||
i {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:focus-visible {
|
||||
border-color: var(--jc-accent);
|
||||
background: #f1f7f4;
|
||||
color: var(--jc-accent-strong);
|
||||
outline: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* ---------- 插入面板 ---------- */
|
||||
|
||||
.jio-insert {
|
||||
position: fixed;
|
||||
z-index: 520;
|
||||
inset: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.jio-insert__backdrop {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
border: 0;
|
||||
background: rgba(23, 34, 31, 0.34);
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.jio-insert__panel {
|
||||
position: relative;
|
||||
width: min(560px, 100%);
|
||||
max-height: min(78vh, 640px);
|
||||
overflow: hidden auto;
|
||||
border-radius: 16px;
|
||||
background: #fff;
|
||||
box-shadow: 0 24px 70px rgba(20, 32, 28, 0.22);
|
||||
}
|
||||
|
||||
.jio-insert__head {
|
||||
position: sticky;
|
||||
z-index: 1;
|
||||
top: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 18px 22px 12px;
|
||||
border-bottom: 1px solid $line;
|
||||
background: #fff;
|
||||
|
||||
h2 {
|
||||
margin: 0;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
.jio-insert__close {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border: 0;
|
||||
border-radius: 50%;
|
||||
background: transparent;
|
||||
color: $ink-soft;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover,
|
||||
&:focus-visible {
|
||||
background: #eef3f0;
|
||||
outline: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.jio-insert__body {
|
||||
padding: 16px 22px 24px;
|
||||
}
|
||||
|
||||
.jio-insert__group {
|
||||
margin-bottom: 20px;
|
||||
|
||||
h3 {
|
||||
margin: 0 0 12px;
|
||||
color: #9aa8a2;
|
||||
font-size: 12px;
|
||||
font-weight: 500;
|
||||
letter-spacing: 0.04em;
|
||||
}
|
||||
}
|
||||
|
||||
.jio-insert__grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(6, minmax(0, 1fr));
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.jio-insert-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
padding: 14px 4px 10px;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 10px;
|
||||
background: #f7f9f8;
|
||||
color: $ink;
|
||||
cursor: pointer;
|
||||
transition: background 0.16s ease, color 0.16s ease, border-color 0.16s ease;
|
||||
|
||||
&:hover,
|
||||
&:focus-visible {
|
||||
border-color: var(--jc-accent);
|
||||
background: #eef5f2;
|
||||
color: var(--jc-accent-strong);
|
||||
outline: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.jio-insert-item__icon {
|
||||
display: flex;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 8px;
|
||||
background: #fff;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.jio-insert-item__label {
|
||||
font-size: 12px;
|
||||
line-height: 1.3;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* ---------- 发布抽屉 ---------- */
|
||||
|
||||
.jio-creator-drawer {
|
||||
@@ -852,6 +1101,27 @@ $warn: #b4573f;
|
||||
bottom: 0;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
/* 插入面板改为贴底抽屉，贴合手机拇指操作区。 */
|
||||
.jio-insert {
|
||||
align-items: flex-end;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.jio-insert__panel {
|
||||
width: 100%;
|
||||
max-height: 76dvh;
|
||||
border-radius: 16px 16px 0 0;
|
||||
padding-bottom: env(safe-area-inset-bottom);
|
||||
}
|
||||
|
||||
.jio-insert__grid {
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.jio-creator__insert {
|
||||
margin-bottom: calc(26px + env(safe-area-inset-bottom));
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
|
||||
@@ -0,0 +1,65 @@
|
||||
/**
|
||||
* 插入面板的可插入条目。
|
||||
*
|
||||
* 只列出当前账号真正能用的类型：图片/视频依赖上传能力，付费片段依赖付费能力。
|
||||
* 区块名用 WordPress 核心与 Jio 自有区块的真实注册名，避免插入时报
|
||||
* "Block type is not registered"。
|
||||
*
|
||||
* @package Jio
|
||||
*/
|
||||
|
||||
import { __ } from '@wordpress/i18n';
|
||||
|
||||
import type { InsertGroup } from '../panels/insert-panel';
|
||||
|
||||
type Capabilities = {
|
||||
canUploadImage?: boolean;
|
||||
canUploadVideo?: boolean;
|
||||
canPay?: boolean;
|
||||
canEmbed?: boolean;
|
||||
};
|
||||
|
||||
export function buildInsertGroups(capabilities: Capabilities): InsertGroup[] {
|
||||
const text: InsertGroup = {
|
||||
label: __('文字', 'jio'),
|
||||
items: [
|
||||
{ name: 'core/paragraph', title: __('正文', 'jio'), icon: 'fa fas fa-align-left' },
|
||||
{ name: 'core/heading', title: __('标题', 'jio'), icon: 'fa fas fa-heading', attributes: { level: 2 } },
|
||||
{ name: 'core/list', title: __('列表', 'jio'), icon: 'fa fas fa-list-ul' },
|
||||
{ name: 'core/quote', title: __('引用', 'jio'), icon: 'fa fas fa-quote-left' },
|
||||
],
|
||||
};
|
||||
|
||||
const media: InsertGroup = {
|
||||
label: __('媒体', 'jio'),
|
||||
items: [],
|
||||
};
|
||||
if (capabilities.canUploadImage) {
|
||||
media.items.push({ name: 'core/image', title: __('图片', 'jio'), icon: 'fa far fa-image' });
|
||||
}
|
||||
if (capabilities.canUploadVideo) {
|
||||
media.items.push({ name: 'core/video', title: __('视频', 'jio'), icon: 'fa fas fa-video' });
|
||||
}
|
||||
if (capabilities.canEmbed) {
|
||||
media.items.push({ name: 'core/embed', title: __('嵌入', 'jio'), icon: 'fa fas fa-code' });
|
||||
}
|
||||
|
||||
const blocks: InsertGroup = {
|
||||
label: __('组件', 'jio'),
|
||||
items: [
|
||||
{ name: 'core/code', title: __('代码', 'jio'), icon: 'fa fas fa-terminal' },
|
||||
{ name: 'core/separator', title: __('分隔线', 'jio'), icon: 'fa fas fa-minus' },
|
||||
{ name: 'core/table', title: __('表格', 'jio'), icon: 'fa fas fa-table' },
|
||||
],
|
||||
};
|
||||
|
||||
if (capabilities.canPay) {
|
||||
blocks.items.push({
|
||||
name: 'jio/paid-fragment',
|
||||
title: __('付费内容', 'jio'),
|
||||
icon: 'fa fas fa-lock',
|
||||
});
|
||||
}
|
||||
|
||||
return [text, media, blocks];
|
||||
}
|
||||
Reference in new issue
Block a user