@haklex/rich-style-token 0.0.30 → 0.0.32

package/dist/index.mjs

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { createContext, useMemo, use } from "react";
-var vars = { color: { text: "var(--rc-text)", textSecondary: "var(--rc-text-secondary)", bg: "var(--rc-bg)", bgSecondary: "var(--rc-bg-secondary)", bgTertiary: "var(--rc-bg-tertiary)", border: "var(--rc-border)", accent: "var(--rc-accent)", accentLight: "var(--rc-accent-light)", link: "var(--rc-link)", codeText: "var(--rc-code-text)", codeBg: "var(--rc-code-bg)", quoteBorder: "var(--rc-quote-border)", quoteBg: "var(--rc-quote-bg)", alertInfo: "var(--rc-alert-info)", alertWarning: "var(--rc-alert-warning)", alertTip: "var(--rc-alert-tip)", alertCaution: "var(--rc-alert-caution)", alertImportant: "var(--rc-alert-important)" }, spacing: { xs: "var(--rc-space-xs)", sm: "var(--rc-space-sm)", md: "var(--rc-space-md)", lg: "var(--rc-space-lg)", xl: "var(--rc-space-xl)" }, typography: { fontFamily: "var(--rc-font-family)", fontFamilySerif: "var(--rc-font-family-serif)", fontMono: "var(--rc-font-mono)", fontSize2xs: "var(--rc-font-size-2xs)", fontSizeXs: "var(--rc-font-size-xs)", fontSizeSm: "var(--rc-font-size-sm)", fontSizeMd: "var(--rc-font-size-md)", fontSizeLg: "var(--rc-font-size-lg)", fontSizeBase: "var(--rc-font-size-base)", fontSizeSmall: "var(--rc-font-size-small)", lineHeight: "var(--rc-line-height)", lineHeightTight: "var(--rc-line-height-tight)" }, borderRadius: { sm: "var(--rc-radius-sm)", md: "var(--rc-radius-md)", lg: "var(--rc-radius-lg)" }, layout: { maxWidth: "var(--rc-max-width)" } };
+var vars = { color: { text: "var(--rc-text)", textSecondary: "var(--rc-text-secondary)", bg: "var(--rc-bg)", bgSecondary: "var(--rc-bg-secondary)", bgTertiary: "var(--rc-bg-tertiary)", border: "var(--rc-border)", accent: "var(--rc-accent)", accentLight: "var(--rc-accent-light)", link: "var(--rc-link)", codeText: "var(--rc-code-text)", codeBg: "var(--rc-code-bg)", hrBorder: "var(--rc-hr-border)", quoteBorder: "var(--rc-quote-border)", quoteBg: "var(--rc-quote-bg)", alertInfo: "var(--rc-alert-info)", alertWarning: "var(--rc-alert-warning)", alertTip: "var(--rc-alert-tip)", alertCaution: "var(--rc-alert-caution)", alertImportant: "var(--rc-alert-important)" }, spacing: { xs: "var(--rc-space-xs)", sm: "var(--rc-space-sm)", md: "var(--rc-space-md)", lg: "var(--rc-space-lg)", xl: "var(--rc-space-xl)" }, typography: { fontFamily: "var(--rc-font-family)", fontFamilySans: "var(--rc-font-family-sans)", fontFamilySerif: "var(--rc-font-family-serif)", fontMono: "var(--rc-font-mono)", fontSize2xs: "var(--rc-font-size-2xs)", fontSizeXs: "var(--rc-font-size-xs)", fontSizeSm: "var(--rc-font-size-sm)", fontSizeMd: "var(--rc-font-size-md)", fontSizeLg: "var(--rc-font-size-lg)", fontSizeBase: "var(--rc-font-size-base)", fontSizeSmall: "var(--rc-font-size-small)", lineHeight: "var(--rc-line-height)", lineHeightTight: "var(--rc-line-height-tight)" }, borderRadius: { sm: "var(--rc-radius-sm)", md: "var(--rc-radius-md)", lg: "var(--rc-radius-lg)" }, layout: { maxWidth: "var(--rc-max-width)" } };
 function extractVarName(cssVarRef) {
   const match = cssVarRef.match(/^var\((.+)\)$/);
   return match ? match[1] : cssVarRef;
@@ -45,7 +45,7 @@ function PortalThemeWrapper({ children }) {
   return /* @__PURE__ */ jsx("div", { style: { display: "contents" }, className, children });
 }
 const fonts = {
-  fontFamily: '"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji',
+  fontFamilySans: '"PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, Helvetica, "noto sans sc", "hiragino sans gb", -apple-system, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Not Color Emoji',
   fontFamilySerif: '"Noto Serif CJK SC", "Source Han Serif SC", "Source Han Serif", "source-han-serif-sc", "Songti SC", STSong, "华文宋体", serif',
   fontMono: '"SF Mono", SFMono-Regular, ui-monospace, "DejaVu Sans Mono", Menlo, Consolas, monospace'
 };
@@ -59,9 +59,12 @@ const lightArticleColors = {
   accent: "#2563eb",
   accentLight: "#2563eb20",
   link: "#2563eb",
-  codeText: "#374047",
-  codeBg: "#f6f8fa",
-  // GitHub light
+  codeText: "#404040",
+  // neutral-700
+  codeBg: "#f5f5f5",
+  // neutral-100
+  hrBorder: "#d4d4d4",
+  // neutral-300
   quoteBorder: "#2563eb",
   quoteBg: "#eff6ff",
   alertInfo: "#006bb7",
@@ -85,9 +88,12 @@ const darkColors = {
   accent: "#60a5fa",
   accentLight: "#60a5fa20",
   link: "#60a5fa",
-  codeText: "#dee1e3",
-  codeBg: "#161b22",
-  // GitHub dark
+  codeText: "#e5e5e5",
+  // neutral-200
+  codeBg: "#262626",
+  // neutral-800
+  hrBorder: "#525252",
+  // neutral-600
   quoteBorder: "#60a5fa",
   quoteBg: "#1e3a5f",
   alertInfo: "#7db9e5",
@@ -105,6 +111,7 @@ const sharedSpacing = {
 };
 const sharedBorderRadius = { sm: "4px", md: "8px", lg: "12px" };
 const baseTypography = {
+  fontFamilySans: fonts.fontFamilySans,
   fontFamilySerif: fonts.fontFamilySerif,
   fontMono: fonts.fontMono,
   fontSize2xs: "0.625em",
@@ -120,7 +127,10 @@ const baseTypography = {
 const articleLayout = {
   layout: { maxWidth: "700px" },
   spacing: sharedSpacing,
-  typography: { ...baseTypography, fontFamily: fonts.fontFamily },
+  typography: {
+    ...baseTypography,
+    fontFamily: fonts.fontFamilySans
+  },
   borderRadius: sharedBorderRadius
 };
 const noteLayout = {
@@ -138,7 +148,7 @@ const commentLayout = {
   spacing: { xs: "2px", sm: "4px", md: "10px", lg: "16px", xl: "20px" },
   typography: {
     ...baseTypography,
-    fontFamily: fonts.fontFamily,
+    fontFamily: fonts.fontFamilySans,
     fontSizeBase: "14px",
     fontSizeSmall: "12px",
     lineHeight: "1.5",

package/dist/themes.d.ts

@@ -1,5 +1,5 @@
 export declare const fonts: {
-    fontFamily: string;
+    fontFamilySans: string;
     fontFamilySerif: string;
     fontMono: string;
 };
@@ -15,6 +15,7 @@ export declare const lightArticleColors: {
     link: string;
     codeText: string;
     codeBg: string;
+    hrBorder: string;
     quoteBorder: string;
     quoteBg: string;
     alertInfo: string;
@@ -37,6 +38,7 @@ export declare const lightCommentColors: {
     link: string;
     codeText: string;
     codeBg: string;
+    hrBorder: string;
     alertInfo: string;
     alertWarning: string;
     alertTip: string;
@@ -55,6 +57,7 @@ export declare const darkColors: {
     link: string;
     codeText: string;
     codeBg: string;
+    hrBorder: string;
     quoteBorder: string;
     quoteBg: string;
     alertInfo: string;
@@ -76,6 +79,7 @@ export declare const articleLayout: {
     };
     typography: {
         fontFamily: string;
+        fontFamilySans: string;
         fontFamilySerif: string;
         fontMono: string;
         fontSize2xs: string;
@@ -108,6 +112,7 @@ export declare const noteLayout: {
     typography: {
         fontFamily: string;
         lineHeight: string;
+        fontFamilySans: string;
         fontFamilySerif: string;
         fontMono: string;
         fontSize2xs: string;
@@ -142,6 +147,7 @@ export declare const commentLayout: {
         fontSizeSmall: string;
         lineHeight: string;
         lineHeightTight: string;
+        fontFamilySans: string;
         fontFamilySerif: string;
         fontMono: string;
         fontSize2xs: string;

package/dist/themes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"themes.d.ts","sourceRoot":"","sources":["../src/themes.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,KAAK;;;;CAOjB,CAAA;AAGD,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;CAmB9B,CAAA;AAED,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;CAI9B,CAAA;AAED,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;CAmBtB,CAAA;AAyBD,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAKzB,CAAA;AAED,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAStB,CAAA;AAED,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAYzB,CAAA"}
+{"version":3,"file":"themes.d.ts","sourceRoot":"","sources":["../src/themes.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,KAAK;;;;CAOjB,CAAA;AAGD,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;CAoB9B,CAAA;AAED,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;CAI9B,CAAA;AAED,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;CAoBtB,CAAA;AA0BD,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAQzB,CAAA;AAED,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAStB,CAAA;AAED,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAYzB,CAAA"}

package/dist/vars.css.d.ts

@@ -11,6 +11,7 @@ export declare const vars: {
         link: `var(--${string})`;
         codeText: `var(--${string})`;
         codeBg: `var(--${string})`;
+        hrBorder: `var(--${string})`;
         quoteBorder: `var(--${string})`;
         quoteBg: `var(--${string})`;
         alertInfo: `var(--${string})`;
@@ -28,6 +29,7 @@ export declare const vars: {
     };
     typography: {
         fontFamily: `var(--${string})`;
+        fontFamilySans: `var(--${string})`;
         fontFamilySerif: `var(--${string})`;
         fontMono: `var(--${string})`;
         fontSize2xs: `var(--${string})`;

package/dist/vars.css.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"vars.css.d.ts","sourceRoot":"","sources":["../src/vars.css.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkDf,CAAA"}
+{"version":3,"file":"vars.css.d.ts","sourceRoot":"","sources":["../src/vars.css.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDf,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@haklex/rich-style-token",
-  "version": "0.0.30",
+  "version": "0.0.32",
   "description": "Style tokens and CSS variables for haklex rich editor",
   "license": "MIT",
   "type": "module",