圆柱形
SVG 自动转换为 TSX 使用 图像
添加/更新图标
- 添加或更新 svg 在
src/svgs - 确保它有
fill="currentColor或者说stroke="currentColor" - 确保它有一个取景框( 宽度, 高度将被去除)
- 如果图标是方向性的(它指向左或右,例如箭头、chevron或日志出图标),则添加
data-bfx-rtl="flip"转到根<svg>故以RTL为镜. 见 RTL 支持。 。 。 .
版本
使用 语义版本数字 :
major当您做出不兼容的 API 更改时的版本minor当您以向后兼容的方式添加功能时的版本patch当您使反相兼容的错误修正时的版本
所有最新版本的部署均由 语义释放 在 CircleCI 中被触发 main 输油管. 语义释放 将查看您的承诺信息,并确定如何根据其格式增加该版本。 见 这里 详细了解如何运作. 承诺 钩子用于确保您的承诺信息在推进前正确无误.
总结:
feat是一个小版本的凸起fix是一个补丁版本的凸起perf是一个补丁版本的凸起- 承诺
!在类型(或范围)后是一个主要版本的凸起. 缩写:feat!: add image或者说feat(new)!: add image - 所有其他类型都不会造成任何版本的出错
* 这是完全定制的,因此可以更新,以更好地满足我们的需要
当拉出请求被合并为主时,CircleCI主工作流程运行,将进行所有必要的npm发布和git标记,同时创建包含发布注释的Github发布.
Beta 部署
所有牵引请求都将部署一个β版本作为公关管道的一部分. 这样就可以轻松进行测试,而无需合并您的PR. 版本将部署 {CURRENT_MAJOR_VERSION}.0.0-PR${PULL_REQUEST_NUMBER}-BN${BUILD_NUM}。例如: 7.0.0-PR100-BN150
检查您的分支所使用的版本
我们没有跟踪当前版本的软件包为什么没有必要?) (中文(简体) ).
然而,要打印您的分支使用的软件包版本, 请运行 npm run check-version
使用量
通过 npm 安装 :
pnpm install --save @benefex/icons
导入图标 :
您可以通过可选标题道具 - https://developer.mozilla.org/en-US/docs/Web/SVG/Element/title (中文(简体) )
import { IconName } from '@benefex/icons';
import { Icon } from '@benefex/components';
<Icon svg={IconName} title="Icon Label" />;
动画图标
导入动画样式表一次, 然后添加 bfx-icon--animated 到支持图标的父目录。 目前,火花和上传图标支持动画.
import '@benefex/icons/animations.css';
import { SparklesLight } from '@benefex/icons';
<span className="bfx-icon--animated">
<SparklesLight aria-hidden="true" />
</span>;
RTL 支持
方向图标在从右到左的背景中镜像 。 导入一次 RTL 样式表, 当它们坐在元素内时会翻转 dir="rtl" (或 direction: rtl:
import '@benefex/icons/rtl.css';
import { ArrowRightLight } from '@benefex/icons';
<div dir="rtl">
<ArrowRightLight aria-hidden="true" />
</div>;
除非样式表被导入,否则不会翻转 .
选择一个表示物理方向的图标(例如地图或指南针箭头),将其用 dir="ltr"图标尾随最近的 dir,因此只有图标受到影响:
<span dir="ltr">
<ArrowRightLight aria-hidden="true" />
</span>
如果无法加包装,请添加 bfx-icon--rtl-fixed 改为图标或其父母之一:
<ArrowRightLight className="bfx-icon--rtl-fixed" aria-hidden="true" />
将图标标记为 RTL
添加 data-bfx-rtl="flip" 转到根 <svg> 内 src/svgs。只有当镜像复制品是正确的RTL图标时,即艺术品是平面镜像。 不要把它添加到带有文字,标志的图标上,或者每个语言读取相同方式的符号上.
属性通过生成器时不变. 检查结果在 Icons/RTL 童话故事.