@djangocfg/ widget-media (英语)
对话或文件预览的媒体查看器:缩放/泛图像灯盒, 美人鱼图,一个读取器的标记,和只读代码列表.
安装
pnpm add @djangocfg/widget-media @djangocfg/ui-core streamdown
出口
每个观众都是自己的子路 这就是合同. 根枪管 仅携带图像取景器;其他三个取出解析器或突出显示器, 一个装有灯盒的宿主 不得为其中任何一台付费.
| 子路径 | 这是什么 | 付出的代价 |
|---|---|---|
. | ImageLightbox, (中文(简体) ), LazyImageLightbox, (中文(简体) ), ImageViewer, (中文(简体) ), LazyImageViewer、钩子、类型、常数 | yet-another-react-lightbox (灯盒), react-zoom-pan-pinch (观众) |
./diagram | LazyDiagram, (中文(简体) ), DiagramSource, (中文(简体) ), diagramPlugin | 美人鱼 (~2.5 MB) - 总是推迟 |
./markdown | Markdown 为了读者,任何谈话之外 | 流出 |
./code | Code ——只读列表 | 下流 + shiki |
./i18n | MediaCopy, (中文(简体) ), DEFAULT_MEDIA_COPY, (中文(简体) ), MEDIA_DICTIONARIES, (中文(简体) ), useMediaCopy | —— 说 |
import { ImageViewer } from '@djangocfg/widget-media';
import { LazyDiagram } from '@djangocfg/widget-media/diagram';
<ImageViewer images={[{ name: 'chart.png', src }]} lightbox />
<LazyDiagram chart={source} streaming={isStreaming} />
复制
包拥有副本, 打印, 在17 @djangocfg/i18n 当地人。 这个
语言来自 @djangocfg/i18n 提供者(英文无一)。 过
copy 以覆盖任意子集;您省略了字典的文本,所以
更改一个标签不会将其余的空白.
<ImageViewer images={images} copy={{ zoomIn: 'Приблизить', close: 'Закрыть' }} />
MediaCopy 是记录的图谋——拼错的密钥是 tsc 错误, 不
undefined 变成工具栏按钮.
图像灯盒
模式画廊点击图片打开,打开
另一种反应灯盒数字 :
焦点陷阱,刷新,预装邻居,键盘,轮子/平克缩放,
拇指和计数器 双击在指针和下个指针上放大
缩放后退;光标在休息时是放大器,只在缩放时是手.
皮肤是 src/image-viewer/lightbox/lightbox.css{\fn黑体\fs22\bord1\shad0\3aHBE\4aH00\fscx67\fscy66\2cHFFFFFF\3cH808080}YARL的音乐 --yarl__*
变量映射到ui-core符号,所以它跟随光/暗以及每一个预设.
import { LazyImageLightbox } from '@djangocfg/widget-media';
<LazyImageLightbox
images={[{ name: 'a.jpg', src, downloadSrc }]}
open={index !== null}
index={index ?? 0}
onIndexChange={setIndex}
onClose={() => setIndex(null)}
/>
它需要地址(LightboxImage),从不生字节;内映像去
结束 ImageViewer。 。 。 . LazyImageLightbox 直到 open。 。 。 .
图像查看器
嵌入式编辑器: 缩放( 轮子 + 预设) 25/50/100/200/400%),用拖取法制成锅,
旋转 90°,翻转 H/V,全屏对话框,键盘快捷键(+编号 :-, (中文(简体) ), 0
重设, r 旋转、 逐步加载 LQIP、 检查板透明
地面,缓存尺寸显示。 双击将缩放到指针上
从别的地方回来 这个 lightbox 道具是旧的全屏
列报,取而代之 ImageLightbox 并保持这样现有的主机编译.
校验
pnpm --filter @djangocfg/widget-media check-types test