@jike-js/ui 0.2.0 → 0.3.0

package/README.md

@@ -5,16 +5,16 @@
 ## 安装
 
 ```powershell
-pnpm add @jike-js/ui@0.1.1
+pnpm add @jike-js/ui@0.3.0
 ```
 
-当前公开版本：`0.1.1`，已包含登录行高隔离修订；品牌配置 API 的本地实现版本为 `0.2.0`，尚未发布。业务项目安装后锁定明确版本，不使用 Git、本地 `file:` 或未发布版本。
+当前本地版本：`0.3.0`，增加统一 `BrandLogo` 和品牌资源导出；发布前请先完成构建检查。业务项目安装后锁定明确版本，不使用 Git、本地 `file:` 或未发布版本。
 
 业务项目只需引入 `@jike-js/ui/styles.css` 一个样式入口；该入口在构建时包含 Token、基础层和组件层，避免漏引或形成第二份 reset。Token 的唯一源文件仍是 `frontend/tokens/design-tokens.json`，CSS 是其运行时输出。
 
-当前提供：`LoginShell`、`PageLayout`、`PageHeader`、`Notice`、`EmptyState`、`LoadingState`。包构建会同时检查 TypeScript，并输出单一 `styles.css`。
+当前提供：`BrandLogo`、`LoginShell`、`PageLayout`、`PageHeader`、`Notice`、`EmptyState`、`LoadingState`。包构建会同时检查 TypeScript，并输出单一 `styles.css` 和品牌资源。
 
-本包不包含业务请求、路由、权限和项目 Logo。业务项目只能通过组件参数接入这些能力。登录文案使用 `brandTitle`、`brandSubtitle`、`formTitle`、`formSubtitle` 四个明确层级。
+本包不包含业务请求、路由和权限。业务项目通过 `BrandLogo` 使用统一 Logo，通过 `LoginShell` 参数接入品牌文案和登录逻辑。登录文案使用 `brandTitle`、`brandSubtitle`、`formTitle`、`formSubtitle` 四个明确层级。
 
 品牌差异通过 `LoginBrandConfig` 传入：
 

package/dist/BrandLogo.d.ts

@@ -0,0 +1,8 @@
+export type BrandLogoSize = "sm" | "md" | "lg";
+export interface BrandLogoProps {
+    /** 小尺寸用于导航，中尺寸用于常规品牌入口，大尺寸用于登录页。 */
+    size?: BrandLogoSize;
+    alt?: string;
+    "aria-label"?: string;
+}
+export declare function BrandLogo({ size, alt, "aria-label": ariaLabel }: BrandLogoProps): import("react").JSX.Element;

package/dist/BrandLogo.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+const logoSource = new URL("./assets/brand/jike-logo.svg", import.meta.url).href;
+export function BrandLogo({ size = "md", alt, "aria-label": ariaLabel }) {
+    const label = ariaLabel ?? alt ?? "jike";
+    return _jsx("img", { className: `jike-brand-logo jike-brand-logo--${size}`, src: logoSource, alt: label, "aria-label": ariaLabel });
+}

package/dist/assets/brand/jike-logo.svg

@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 198 198" role="img" aria-labelledby="title desc">
+  <title id="title">jike 品牌 Logo</title>
+  <desc id="desc">基于 workspace 现有 Logo 重绘的纯矢量版本</desc>
+  <circle cx="99" cy="99" r="96" fill="#004A70"/>
+  <path fill="#FFFFFF" fill-rule="evenodd" d="M45.57 132 45.97 129 46.42 128 47.18 124 47.45 120 48.13 119 48.99 115 49.49 114 50.94 106 53.37 96 55 87.03 56.47 82 57.58 76 57.63 75 57 74.51 55 74.36 54.63 74 54.93 71 55.68 67 56 66.43 92 66.36 92.32 67 92.28 68 91.23 75 87.33 85 87.36 86 88 86.49 90 86.5 91.16 87 90.22 95 88.34 98 87.01 101 81.35 111 80.82 113 85.58 122 87 124.09 88.33 127 90 129.66 91 130.65 93 129.35 103 121.1 104 120.66 109 124.68 110.44 126 111.08 127 110 128.14 105 132.01 104 132.3 78 132.31 76.95 132 75 129.28 74 129.02 72 132.21 60 132.31 58.62 132 58 131.19 57.62 132 57 132.31 46 132.31Z M100.88 96 101.14 95 101.81 94 103.43 92 108 85.03 109.67 83 109 82.32 103 82.25 102.45 82 102.94 76 104 69.89 105 69.62 128 69.62 128.92 69 124.76 65 125 64.81 147 64.68 148 64.74 148.3 65 148.1 69 149 69.61 173 69.62 173.82 70 173.9 71 173.11 77 172 82.16 165 82.25 164 82.58 163.63 83 163 86.73 161.74 88 127 115.02 121.4 119 121 119.13 113.83 113 114.31 112 126.61 102 126.32 101 123 99.1 116 94.38 115 94.07 113 96.17 101 96.13Z M20.66 84 21 80.24 21.67 77 22 76.53 29 76.43 29.82 76 30.37 75 31.21 68 30.86 67 26.81 65 28 64.66 30 64.63 44 64.63 45.04 65 44.55 67 44 73 43.57 75 43.86 76 45 76.43 51 76.46 51.37 77 51.02 82 50.63 84 50 84.47 43 84.55 42.38 85 42.07 86 41.59 88 39.16 109 38.48 112 37.06 126 36 132.16 24 132.31 22.88 132 28.7 86 28.59 85 28 84.55 21 84.38Z M14.18 128 15.98 117 16.54 115 17.91 105 18.95 99 19.57 97 20.8 88 22 87.24 26 87.24 27.21 88 24.54 102 24.02 107 22.13 118 21.56 120 20.38 128 20 129.04 14.58 129Z M40.47 122 41 112.28 42.47 98 42.94 90 43.32 88 44 87.24 49 87.25 49.34 88 49.01 93 48.4 97 46.85 122 46.37 123 46 123.07 40.88 123Z M65.81 94 67.11 89 68.4 82 69.14 80 70.34 75 71 74.49 72 74.45 77 74.53 77.6 75 76.41 79 74.92 82 73.3 87 71.91 90 70.56 94 71 94.58 76 94.76 76.29 95 76.11 96 74.48 99 73 100.99 69 95.69 68 94.81 67 94.8 66 94.3Z M117.55 78 117.6 79 118 79.42 124 79.69 125 80.38 126 80.53 156 80.53 157.33 80 157.76 78 157 77.16 119 77.13 118 77.4Z M123.66 89 124 88.46 125 88.18 145 88.3 145.56 89 145 89.47 138 93.97 136 95.62 135 95.94 134 95.65 124 89.29Z M58.12 131 58.42 128 59.11 126 60 121.66 61.63 112 62.38 109 63 107.87 66.68 113 66.65 114 65 117.33 59 131.73Z"/>
+  <path fill="#F84A3F" d="M105.54 118 106 119.05 121 131.97 126 129.17 134 123.8 136 122.95 145 130.14 147 131.18 176 104.47 176.96 105 181 109.36 182 109.55 182.28 109 183.25 101 184 92.77 183 91.91 168 93.18 167 93.39 166.62 94 170.27 98 169.85 99 147 120.02 146 120.3 138 113.86 136 112.72 122 121.69 121 121.1 113 113.54 112 113.02 106 117.54Z"/>
+</svg>

package/dist/index.d.ts

@@ -1,5 +1,7 @@
 export { LoginShell } from "./LoginShell";
 export type { LoginBrandConfig, LoginCredentials, LoginShellProps } from "./LoginShell";
+export { BrandLogo } from "./BrandLogo";
+export type { BrandLogoProps, BrandLogoSize } from "./BrandLogo";
 export { PageLayout } from "./PageLayout";
 export type { PageLayoutProps } from "./PageLayout";
 export { PageHeader } from "./PageHeader";

package/dist/index.js

@@ -1,4 +1,5 @@
 export { LoginShell } from "./LoginShell";
+export { BrandLogo } from "./BrandLogo";
 export { PageLayout } from "./PageLayout";
 export { PageHeader } from "./PageHeader";
 export { EmptyState, LoadingState, Notice } from "./Feedback";

package/dist/styles.css

@@ -132,6 +132,10 @@ svg {
 }
 
 .jike-login-shell { box-sizing: border-box; min-height: 100vh; display: grid; place-items: center; padding: var(--space-6); background: var(--color-bg-page); color: var(--color-text-primary); font-family: var(--jike-login-font-family, var(--font-family-sans)); line-height: var(--login-form-line-height); }
+.jike-brand-logo { display: block; width: var(--jike-brand-logo-size); height: var(--jike-brand-logo-size); object-fit: contain; }
+.jike-brand-logo--sm { --jike-brand-logo-size: 32px; }
+.jike-brand-logo--md { --jike-brand-logo-size: 40px; }
+.jike-brand-logo--lg { --jike-brand-logo-size: 80px; }
 .jike-login-shell__card { box-sizing: border-box; display: grid; grid-template-columns: var(--login-column-ratio); width: var(--login-container-width); max-width: var(--login-container-max-width); min-height: var(--login-container-min-height); overflow: hidden; background: var(--color-bg-surface); border: var(--border-width-default) solid var(--color-border); border-radius: var(--radius-container); box-shadow: var(--shadow-login); }
 .jike-login-shell__brand { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: var(--login-brand-padding-y) var(--login-brand-padding-x); color: var(--color-bg-surface); text-align: center; background: linear-gradient(135deg, var(--jike-login-brand-primary, var(--color-brand)), var(--jike-login-brand-primary-hover, var(--color-brand-hover))); }
 .jike-login-shell__logo { display: grid; place-items: center; width: var(--login-logo-size); height: var(--login-logo-size); margin-bottom: var(--space-6); }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jike-js/ui",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "jike 统一前端组件实现",
   "license": "MIT",
   "repository": {
@@ -17,7 +17,10 @@
   "types": "./dist/index.d.ts",
   "exports": {
     ".": "./dist/index.js",
-    "./styles.css": "./dist/styles.css"
+    "./styles.css": "./dist/styles.css",
+    "./assets/jike-logo.svg": "./dist/assets/brand/jike-logo.svg",
+    "./assets/jike-logo.png": "./dist/assets/brand/jike-logo.png",
+    "./assets/jike-favicon.ico": "./dist/assets/brand/jike-favicon.ico"
   },
   "peerDependencies": {
     "lucide-react": ">=0.468.0",