astro-openmoji 0.1.0 → 0.1.2

package/README.md

@@ -1,5 +1,8 @@
 # astro-openmoji
 
+[![npm version](https://img.shields.io/npm/v/astro-openmoji.svg)](https://www.npmjs.com/package/astro-openmoji)
+[![Publish to npm](https://github.com/xjn2005/astro-openmoji/actions/workflows/publish.yml/badge.svg)](https://github.com/xjn2005/astro-openmoji/actions/workflows/publish.yml)
+
 在 Astro 构建 Markdown 时，把源码中的原生 Unicode Emoji 转换为本地 [OpenMoji](https://openmoji.org/) SVG。
 
 - Markdown 源文件保持不变
@@ -39,13 +42,13 @@ export default defineConfig({
 ```html
 <p>
   今天学 CMake 学得有些
-  <img class="openmoji" src="/openmoji/1F635-200D-1F4AB.svg" alt="😵‍💫" style="width:1em;height:1em;vertical-align:-0.125em;display:inline-block">
+  <img class="openmoji" src="/openmoji/1F635-200D-1F4AB.svg" alt="😵‍💫" style="width:var(--openmoji-size,1.25em);height:var(--openmoji-size,1.25em);vertical-align:var(--openmoji-vertical-align,-0.22em);display:inline-block">
   ，但总算跑通了
-  <img class="openmoji" src="/openmoji/1F680.svg" alt="🚀" style="width:1em;height:1em;vertical-align:-0.125em;display:inline-block">
+  <img class="openmoji" src="/openmoji/1F680.svg" alt="🚀" style="width:var(--openmoji-size,1.25em);height:var(--openmoji-size,1.25em);vertical-align:var(--openmoji-vertical-align,-0.22em);display:inline-block">
 </p>
 ```
 
-`alt` 始终保留原 Emoji。内联样式只负责把一 em 大小的图片与文字基线自然对齐。
+`alt` 始终保留原 Emoji。内联样式默认以 `1.25em` 渲染图片并对齐文字基线；尺寸仍跟随当前字体缩放，不会引入客户端 JavaScript。
 
 ## 配置项
 
@@ -63,6 +66,24 @@ openmoji({
 | `assetDir` | `string` | `"openmoji"` | 输出目录和公共 URL 路径，可使用 `emoji/assets` 这样的相对路径 |
 | `className` | `string` | `"openmoji"` | 生成的 `<img>` 使用的单个 CSS 类名 |
 
+### 尺寸与对齐
+
+OpenMoji 图形在 SVG 画布内通常带有留白，因此插件默认使用 `1.25em`，让可见图形更接近原生 Emoji 的视觉高度。可以通过 CSS 自定义属性调整生成图片，不需要使用 `!important`：
+
+```css
+.openmoji {
+  --openmoji-size: 1.1em;
+  --openmoji-vertical-align: -0.15em;
+}
+```
+
+| CSS 自定义属性 | 默认值 | 说明 |
+| --- | --- | --- |
+| `--openmoji-size` | `1.25em` | 同时控制生成图片的宽度和高度 |
+| `--openmoji-vertical-align` | `-0.22em` | 控制图片相对文字基线的垂直位置 |
+
+如果需要恢复旧版外观，可设置 `--openmoji-size: 1em` 和 `--openmoji-vertical-align: -0.125em`。使用自定义 `className` 时，将这些变量设置在对应类名上即可。
+
 Astro 的 `base` 会自动加入图片 URL。例如 `base: "/blog"` 时，图片地址为 `/blog/openmoji/1F680.svg`，资源仍输出到 `dist/openmoji/`。
 
 ## 转换范围
@@ -108,51 +129,6 @@ npm pack --dry-run
 
 测试包含独立 Rehype 转换、真实 `astro build` fixture、`base: "/blog"`、最小资源输出，以及真实 `astro dev` SVG 请求。
 
-## 通过 GitHub Actions 发布到 npm
-
-仓库包含两个发布工作流：
-
-- `Bootstrap publish to npm`：仅用于第一次创建 npm 包，需要一个临时 `NPM_TOKEN`。
-- `Publish to npm`：之后在 GitHub Release 发布时运行，使用 npm Trusted Publishing（OIDC），不保存 npm Token。
-
-### 第一次发布
-
-1. 确保 GitHub 仓库 `xjn2005/astro-openmoji` 是公开仓库，并将当前项目推送到 `main`。
-2. 在 npm 创建一个短有效期、具备公开包发布权限的 Granular Access Token。若 npm 账户启用了发布 2FA，请按 npm 页面提示允许该自动化 Token 绕过发布 2FA。
-3. 打开 GitHub 仓库的 **Settings → Secrets and variables → Actions**，新增 Repository secret：`NPM_TOKEN`。
-4. 打开 **Actions → Bootstrap publish to npm → Run workflow**。它会依次执行安装、测试、构建、打包预检，并发布 `0.1.0`；不要重复运行同一版本。
-5. 在 npm 确认 `astro-openmoji` 已创建且包含 provenance 信息。
-
-首次工作流使用 `--provenance`，因此 GitHub 仓库必须公开。Token 不要写入文件、提交记录或工作流源码。
-
-### 切换到 Trusted Publishing
-
-首次发布成功后，在 npm 的 `astro-openmoji` 包设置中添加 GitHub Actions Trusted Publisher，填写：
-
-| 字段 | 值 |
-| --- | --- |
-| Organization or user | `xjn2005` |
-| Repository | `astro-openmoji` |
-| Workflow filename | `publish.yml` |
-| Environment | 留空 |
-
-保存后：
-
-1. 删除 GitHub Repository secret `NPM_TOKEN`。
-2. 禁用或删除 `.github/workflows/bootstrap-publish.yml`，避免误触首次发布流程。
-3. 在 Trusted Publisher 创建后的两天内完成一次正式 OIDC 发布验证；验证成功后，可在 npm 包设置中进一步禁止 Token 发布并要求 2FA。
-
-长期工作流只授予 `contents: read` 和 `id-token: write`，不会读取 npm Token。Trusted Publishing 会自动生成 npm provenance。
-
-### 发布后续版本
-
-1. 更新 `package.json` 和 `package-lock.json` 中的版本，例如运行 `npm version patch --no-git-tag-version`。
-2. 运行 `npm test`、`npm run build` 和 `npm pack --dry-run`，然后提交并推送版本改动。
-3. 为该提交创建匹配的标签，例如版本为 `0.1.1` 时使用 `v0.1.1`。
-4. 在 GitHub 创建并发布使用该标签的 Release。
-
-`Publish to npm` 会检出 Release 标签，并在发布前验证标签严格等于 `v${package.json.version}`。两者不一致时工作流会失败，不会发布。
-
 ## 许可证与署名
 
 `astro-openmoji` 插件代码使用 [MIT License](./LICENSE)。OpenMoji 图形资产由 OpenMoji 项目提供，使用 [CC BY-SA 4.0](https://creativecommons.org/licenses/by-sa/4.0/)；详情见 [ATTRIBUTION.md](./ATTRIBUTION.md)。

package/dist/index.js

@@ -1,4 +1,4 @@
-import { i as openmojiAssetRoot, n as normalizeBase, r as resolveOptions, t as transformOpenmojiTree } from "./transform-CnWUZewM.js";
+import { i as openmojiAssetRoot, n as normalizeBase, r as resolveOptions, t as transformOpenmojiTree } from "./transform-CcxaX6qn.js";
 import { copyFile, mkdir, readFile } from "node:fs/promises";
 import { isUnifiedProcessor, unified } from "@astrojs/markdown-remark";
 // src/index.ts

package/dist/rehype.js

@@ -1,4 +1,4 @@
-import { i as openmojiAssetRoot, n as normalizeBase, r as resolveOptions, t as transformOpenmojiTree } from "./transform-CnWUZewM.js";
+import { i as openmojiAssetRoot, n as normalizeBase, r as resolveOptions, t as transformOpenmojiTree } from "./transform-CcxaX6qn.js";
 // src/rehype.ts
 const rehypeOpenmoji = (options = {}) => {
 	const resolved = resolveOptions(options);

package/dist/{transform-CnWUZewM.js → transform-CcxaX6qn.js}

@@ -47,7 +47,7 @@ function assetUrl(base, assetDir, filename) {
 }
 // src/transform.ts
 const skippedElements = /* @__PURE__ */ new Set(["code", "pre"]);
-const imageStyle = "width:1em;height:1em;vertical-align:-0.125em;display:inline-block";
+const imageStyle = "width:var(--openmoji-size,1.25em);height:var(--openmoji-size,1.25em);vertical-align:var(--openmoji-vertical-align,-0.22em);display:inline-block";
 function transformOpenmojiTree(tree, options) {
 	transformChildren(tree, options);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "astro-openmoji",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "description": "Render native Unicode emoji as local OpenMoji SVGs in Astro Markdown.",
   "type": "module",
   "license": "MIT",