@alicloud/console-base-theme 1.4.7 → 1.6.0

package/CHANGELOG.md

@@ -1,6 +1,5 @@
-HISTORY
-===
+# CHANGELOG
 
-# 1.0.0 2020/12/23 @驳是
+## 1.0.0 2020/12/23 @驳是
 
 * 横空出世

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2019 Alibaba Cloud
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,5 +1,4 @@
-@alicloud/console-base-theme
-===
+# @alicloud/console-base-theme
 
 * [关于 CSS Variable 的实践研究](doc/reserch.md)
 * [设计标注 - Fusion](https://fusion.alibaba-inc.com/pc/component/tokens)
@@ -10,7 +9,7 @@
 
 控制台主题
 
-# Usage
+## Usage
 
 ```js
 import {

package/build/cjs/global-style-font-family-for-ja/index.js

@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _styledComponents = require("styled-components");
+
+var _mixin = require("../mixin");
+
+// 为所有的控制台添加日文默认字体，仅日文下会生效，这里对 body 上的 class 有耦合，该 class 由 ConsoleBase 注入
+var _default = (0, _styledComponents.createGlobalStyle)(["body.lang-ja{", "}"], _mixin.mixinTypoFontFamilyBaseJa);
+
+exports.default = _default;

package/build/cjs/index.js

@@ -9,18 +9,25 @@ var _exportNames = {
   mixinTopNavButtonDarkFix: true,
   ThemeStyleLight: true,
   ThemeStyleDark: true,
+  GlobalStyleFontFamilyForJa: true,
   toggleBodyClass: true
 };
+Object.defineProperty(exports, "GlobalStyleFontFamilyForJa", {
+  enumerable: true,
+  get: function get() {
+    return _globalStyleFontFamilyForJa.default;
+  }
+});
 Object.defineProperty(exports, "ThemeStyleDark", {
   enumerable: true,
   get: function get() {
-    return _themeStyleDark.default;
+    return _globalStyleThemeDark.default;
   }
 });
 Object.defineProperty(exports, "ThemeStyleLight", {
   enumerable: true,
   get: function get() {
-    return _themeStyleLight.default;
+    return _globalStyleThemeLight.default;
   }
 });
 exports.mixinTopNavButtonDarkFix = void 0;
@@ -61,9 +68,11 @@ Object.keys(_mixin).forEach(function (key) {
   });
 });
 
-var _themeStyleLight = _interopRequireDefault(require("./theme-style-light"));
+var _globalStyleThemeLight = _interopRequireDefault(require("./global-style-theme-light"));
+
+var _globalStyleThemeDark = _interopRequireDefault(require("./global-style-theme-dark"));
 
-var _themeStyleDark = _interopRequireDefault(require("./theme-style-dark"));
+var _globalStyleFontFamilyForJa = _interopRequireDefault(require("./global-style-font-family-for-ja"));
 
 var _util = require("./util");
 

package/build/cjs/mixin/typo.js

@@ -15,15 +15,15 @@ var _bg = require("./bg");
 
 var _border = require("./border");
 
-var mixinTypoFontFamilyBase = (0, _styledComponents.css)(["font-family:", ";font-family:var(--cb-typo-font-family-base,", ");"], _var.TYPO.FONT_FAMILY_BASE, _var.TYPO.FONT_FAMILY_BASE); // 日文专属
+// 日文专属
+var mixinTypoFontFamilyBaseJa = (0, _styledComponents.css)(["font-family:", ";font-family:var(--cb-typo-font-family-base-ja,", ");"], _var.TYPO.FONT_FAMILY_BASE_JA, _var.TYPO.FONT_FAMILY_BASE_JA); // lang-ja 是 console-base 注入到 body 的 className，虽然有些耦合，但比较实用
 
-exports.mixinTypoFontFamilyBase = mixinTypoFontFamilyBase;
-var mixinTypoFontFamilyBaseJa = (0, _styledComponents.css)(["font-family:", ";font-family:var(--cb-typo-font-family-base-ja,", ");"], _var.TYPO.FONT_FAMILY_BASE_JA, _var.TYPO.FONT_FAMILY_BASE_JA);
 exports.mixinTypoFontFamilyBaseJa = mixinTypoFontFamilyBaseJa;
-var mixinTypoFontFamilyMono = (0, _styledComponents.css)(["font-family:", ";font-family:var(--cb-typo-font-family-monospace,", ");"], _var.TYPO.FONT_FAMILY_MONOSPACE, _var.TYPO.FONT_FAMILY_MONOSPACE); // lang-ja 是 console-base 注入到 body 的 className，虽然有些耦合，但比较实用
-
+var mixinTypoFontFamilyBase = (0, _styledComponents.css)(["font-family:", ";font-family:var(--cb-typo-font-family-base,", ");body.lang-ja &{", "}"], _var.TYPO.FONT_FAMILY_BASE, _var.TYPO.FONT_FAMILY_BASE, mixinTypoFontFamilyBaseJa);
+exports.mixinTypoFontFamilyBase = mixinTypoFontFamilyBase;
+var mixinTypoFontFamilyMono = (0, _styledComponents.css)(["font-family:", ";font-family:var(--cb-typo-font-family-monospace,", ");"], _var.TYPO.FONT_FAMILY_MONOSPACE, _var.TYPO.FONT_FAMILY_MONOSPACE);
 exports.mixinTypoFontFamilyMono = mixinTypoFontFamilyMono;
-var mixinTypoFontBase = (0, _styledComponents.css)(["line-height:1.5;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;", " body.lang-ja &{", "}"], mixinTypoFontFamilyBase, mixinTypoFontFamilyBaseJa);
+var mixinTypoFontBase = (0, _styledComponents.css)(["line-height:1.5;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;", ""], mixinTypoFontFamilyBase);
 exports.mixinTypoFontBase = mixinTypoFontBase;
 var mixinTypoStrong = (0, _styledComponents.css)(["font-weight:600;", ""], _text.mixinTextPrimary);
 exports.mixinTypoStrong = mixinTypoStrong;

package/build/es/global-style-font-family-for-ja/index.js

@@ -0,0 +1,4 @@
+import { createGlobalStyle } from 'styled-components';
+import { mixinTypoFontFamilyBaseJa } from '../mixin'; // 为所有的控制台添加日文默认字体，仅日文下会生效，这里对 body 上的 class 有耦合，该 class 由 ConsoleBase 注入
+
+export default createGlobalStyle(["body.lang-ja{", "}"], mixinTypoFontFamilyBaseJa);

package/build/es/index.js

@@ -1,8 +1,9 @@
 import { css } from 'styled-components';
 export * from './var';
 export * from './mixin';
-export { default as ThemeStyleLight } from './theme-style-light';
-export { default as ThemeStyleDark } from './theme-style-dark';
+export { default as ThemeStyleLight } from './global-style-theme-light';
+export { default as ThemeStyleDark } from './global-style-theme-dark';
+export { default as GlobalStyleFontFamilyForJa } from './global-style-font-family-for-ja';
 export { toggleBodyClass } from './util'; // 主题黑的时候，在顶栏上的 button 背景色不能是标准的... FIXME 我需要调整颜色的策略 primary-secondary-tertiary 区分 container 和 control
 
 export var mixinTopNavButtonDarkFix = css([".theme-dark &{background-color:rgba(255,255,255,0.08);}"]);

package/build/es/mixin/typo.js

@@ -2,13 +2,13 @@ import { css } from 'styled-components';
 import { TYPO, COLOR } from '../var';
 import { mixinTextPrimary, mixinTextEmphasis, mixinTextCode, mixinTextSecondary, mixinTextTertiary } from './text';
 import { mixinBgSecondary, mixinBgSecondaryFade } from './bg';
-import { mixinBorderTertiary, mixinBorderTertiaryColor } from './border';
-export var mixinTypoFontFamilyBase = css(["font-family:", ";font-family:var(--cb-typo-font-family-base,", ");"], TYPO.FONT_FAMILY_BASE, TYPO.FONT_FAMILY_BASE); // 日文专属
+import { mixinBorderTertiary, mixinBorderTertiaryColor } from './border'; // 日文专属
 
-export var mixinTypoFontFamilyBaseJa = css(["font-family:", ";font-family:var(--cb-typo-font-family-base-ja,", ");"], TYPO.FONT_FAMILY_BASE_JA, TYPO.FONT_FAMILY_BASE_JA);
-export var mixinTypoFontFamilyMono = css(["font-family:", ";font-family:var(--cb-typo-font-family-monospace,", ");"], TYPO.FONT_FAMILY_MONOSPACE, TYPO.FONT_FAMILY_MONOSPACE); // lang-ja 是 console-base 注入到 body 的 className，虽然有些耦合，但比较实用
+export var mixinTypoFontFamilyBaseJa = css(["font-family:", ";font-family:var(--cb-typo-font-family-base-ja,", ");"], TYPO.FONT_FAMILY_BASE_JA, TYPO.FONT_FAMILY_BASE_JA); // lang-ja 是 console-base 注入到 body 的 className，虽然有些耦合，但比较实用
 
-export var mixinTypoFontBase = css(["line-height:1.5;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;", " body.lang-ja &{", "}"], mixinTypoFontFamilyBase, mixinTypoFontFamilyBaseJa);
+export var mixinTypoFontFamilyBase = css(["font-family:", ";font-family:var(--cb-typo-font-family-base,", ");body.lang-ja &{", "}"], TYPO.FONT_FAMILY_BASE, TYPO.FONT_FAMILY_BASE, mixinTypoFontFamilyBaseJa);
+export var mixinTypoFontFamilyMono = css(["font-family:", ";font-family:var(--cb-typo-font-family-monospace,", ");"], TYPO.FONT_FAMILY_MONOSPACE, TYPO.FONT_FAMILY_MONOSPACE);
+export var mixinTypoFontBase = css(["line-height:1.5;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;", ""], mixinTypoFontFamilyBase);
 export var mixinTypoStrong = css(["font-weight:600;", ""], mixinTextPrimary);
 export var mixinTypoEm = css(["font-style:normal;", ""], mixinTextEmphasis);
 export var mixinTypoSmall = css(["font-size:inherit;", ""], mixinTextTertiary);

package/build/types/global-style-font-family-for-ja/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("styled-components").GlobalStyleComponent<{}, import("styled-components").DefaultTheme>;
+export default _default;

package/build/types/index.d.ts

@@ -1,7 +1,8 @@
 export * from './var';
 export * from './mixin';
-export { default as ThemeStyleLight } from './theme-style-light';
-export { default as ThemeStyleDark } from './theme-style-dark';
+export { default as ThemeStyleLight } from './global-style-theme-light';
+export { default as ThemeStyleDark } from './global-style-theme-dark';
+export { default as GlobalStyleFontFamilyForJa } from './global-style-font-family-for-ja';
 export { toggleBodyClass } from './util';
 export declare const mixinTopNavButtonDarkFix: import("styled-components").FlattenSimpleInterpolation;
 export type { IPropsEllipsisLines as EllipsisLinesProps } from './types';

package/build/types/mixin/typo.d.ts

@@ -1,6 +1,6 @@
 import { IPropsEllipsisLines } from '../types';
-export declare const mixinTypoFontFamilyBase: import("styled-components").FlattenSimpleInterpolation;
 export declare const mixinTypoFontFamilyBaseJa: import("styled-components").FlattenSimpleInterpolation;
+export declare const mixinTypoFontFamilyBase: import("styled-components").FlattenSimpleInterpolation;
 export declare const mixinTypoFontFamilyMono: import("styled-components").FlattenSimpleInterpolation;
 export declare const mixinTypoFontBase: import("styled-components").FlattenSimpleInterpolation;
 export declare const mixinTypoStrong: import("styled-components").FlattenSimpleInterpolation;

package/build/types/var/index.d.ts

@@ -5,6 +5,9 @@ import Z_INDEX from './z-index';
 declare type ThemeTypo = typeof TYPO;
 declare type ThemeSize = typeof SIZE;
 declare type ThemeZIndex = typeof Z_INDEX;
+/**
+ * 默认主题（亮色）的所有变量
+ */
 declare const _default: {
     COLOR: ThemeColors;
     TYPO: {
@@ -76,9 +79,6 @@ declare const _default: {
         BACKDROP_SYS: number;
     };
 };
-/**
- * 默认主题（亮色）的所有变量
- */
 export default _default;
 export { COLOR, TYPO, SIZE, Z_INDEX };
 export type { ThemeColors, ThemeTypo, ThemeSize, ThemeZIndex };

package/build/types/var/size.d.ts

@@ -1,3 +1,6 @@
+/**
+ * 文字大小、宽高、间距等，都是数值（基本上都是 px）
+ */
 declare const _default: {
     FONT_SIZE_H1: number;
     FONT_SIZE_H2: number;
@@ -48,7 +51,4 @@ declare const _default: {
     BORDER_RADIUS_L: number;
     BORDER_RADIUS_XL: number;
 };
-/**
- * 文字大小、宽高、间距等，都是数值（基本上都是 px）
- */
 export default _default;

package/build/types/var/typo.d.ts

@@ -1,9 +1,9 @@
+/**
+ * 文字相关
+ */
 declare const _default: {
     FONT_FAMILY_BASE: string;
     FONT_FAMILY_BASE_JA: string;
     FONT_FAMILY_MONOSPACE: string;
 };
-/**
- * 文字相关
- */
 export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alicloud/console-base-theme",
-  "version": "1.4.7",
+  "version": "1.6.0",
   "description": "控制台主题 - 基于 css variable 和 styled-components",
   "license": "MIT",
   "sideEffects": false,
@@ -25,22 +25,22 @@
   ],
   "devDependencies": {
     "@alicloud/console-toolkit-cli": "^1.2.30",
-    "@alicloud/console-toolkit-preset-component": "^1.2.56",
-    "@alicloud/demo-rc-elements": "^1.5.4",
+    "@alicloud/console-toolkit-preset-component": "^1.2.61",
+    "@alicloud/demo-rc-elements": "^1.6.0",
     "@types/lodash": "^4.14.182",
-    "@types/react": "^17.0.43",
+    "@types/react": "^17.0.45",
     "@types/styled-components": "^5.1.25",
     "lodash": "^4.17.21",
     "react": "^17.0.2",
     "styled-components": "^5.3.5",
-    "typescript": "^4.6.3"
+    "typescript": "^4.7.4"
   },
   "peerDependencies": {
     "styled-components": ">=5"
   },
   "dependencies": {
-    "@alicloud/console-base-theme-color": "^1.1.84",
-    "@alicloud/mere-dom": "^1.3.1"
+    "@alicloud/console-base-theme-color": "^1.3.0",
+    "@alicloud/mere-dom": "^1.4.0"
   },
   "scripts": {
     "start": "breezr start-storybook",
@@ -53,5 +53,5 @@
     "clean": "rm -rf build",
     "prepublishOnly": "yarn clean && yarn build"
   },
-  "gitHead": "e575919bb3e5dc36f28501101c18cf0d7cee2488"
+  "gitHead": "464397b99676139ae2bee8b893246537048aa09a"
 }