Docs/changelog (#51)

* fix: fix darkmode error in crossorigin

* docs: add 2.0.0 changelog

Co-authored-by: 代强 <[email protected]>
Co-authored-by: 石嘉 <[email protected]>

content/start/changelog/index-en-US.md

@@ -16,6 +16,46 @@ Version：Major.Minor.Patch
 
 ---
 
+#### 🎉 2.0.0 (2021-10-26)
+
+- 【Breaking Change】
+  - Component Changes
+    - Icon related
+      - Icon component no longer supports type = xxx using built-in icons
+      - Custom svg no longer supports plug-in configuration srcSvgPaths
+      - The Button icon property no longer supports passing built-in icon names through strings
+      - Dropdown deletes the iconType attribute and unifies it into the icon attribute
+      - Navigation icons no longer support incoming by string, ReactNode needs to be passed in
+      - Notification icons are no longer passed in by string, please use ReactNode uniformly
+    - AutoComplete officially discards the onChangeWithObject property
+    - Remove onInputChange from Cascader triggerRender
+    - Form no longer exports Label components from `semi-ui/index.js`
+    - Tree onRightClick renamed onContextMenu
+    - Upload dragable renamed draggable
+    - Table
+      - API that no longer responds when componentDidUpdate
+        - DefaultExpandAllRows, please replace with expandAllRows
+        - Default ExpandRowKeys, please replace with expandRowKeys
+        - Default ExpandAllGroupRows, please replace with expandAllGroupRows
+  - Style Changes
+    - CSS variable with semi prefix, for example --color-primary = > --semi-color-primary
+    - In 2.x, the unified set the width and height of the illustration to `200 * 200px`
+    - Design Token Changes
+      - Popconfirm
+        - $color-popconfirm_body-text 由 --semi-color-tertiary => --semi-color-text-2
+        - $color-popconfirm_header_alert-icon 由 #fa7500 => --semi-color-warning
+      - Progress
+        - $spacing-progress_line_text-marginLeft 由 15px => $spacing-base(16px)
+        - $spacing-progress_line_text-marginRight 由 15px => $spacing-base(16px)
+      - Radio
+        - $spacing-radio_addon_buttonRadio_large-paddingY 由 6px => $spacing-base-tight / 2 (6px)
+        - $radius-radio_cardRadioGroup 由 3px => --semi-border-radius-small(3px)
+  - Plugin Changes
+    - In 2.x, the iconLazyLoad, svgPaths, srcSvgPaths configurations are no longer supported
+    - In 2.x, section dark mode and bright mode no longer need to configure themeScope attributes in the plug-in, and the default is built-in. The usage method is updated from adding id #semi-ways-xxx to adding class .semi-ways-xxx.
+  - Other Changes
+    - Due to the adjustment of the Icon, the way of using icons and illustrations for Icon and Empty components is different from before. Please see for [details](/en-US/start/update-to-v2)
+
 #### 🎉 1.33.0 (2021-10-22)
 - 【Fix】
     - Fix that when the Cascader uses changeOnSelect and loadData attributes at the same time, and the last level is not selected, the value can not reset  

content/start/changelog/index.md

@@ -15,6 +15,45 @@ Semi 版本号遵循**Semver**规范（主版本号-次版本号-修订版本号
 
 ---
 
+#### 🎉 2.0.0 (2021-10-26)
+
+- 【Breaking Change】
+  - 组件相关调整
+    - Icon 相关
+      - Icon 组件不再支持  type=xxx 方式使用内置 icon
+      - 自定义 svg 不再支持插件方式配置 srcSvgPaths
+      - Button icon 属性不再支持通过 string 传递内置 icon 名
+      - Dropdown 删除 iconType 属性，统一为 icon 属性
+      - Navigation icon 不再支持通过 string 方式传入，需要传入 ReactNode
+      - Notification icon 不再支持通过 string 方式传入，请统一使用 ReactNode
+    - AutoComplete 正式废弃 onChangeWithObject 属性
+    - Cascader triggerRender 的入参移除 onInputChange
+    - Form 不再从 `semi-ui/index.js` 导出 Label组件，如需使用请用 Form.Label
+    - Tree onRightClick 更名为 onContextMenu
+    - Upload dragable 更名为 draggable
+    - Table
+      - 不再在 componentDidUpdate 时响应的 API
+        - defaultExpandAllRows，请用 expandAllRows 替换
+        - defaultExpandRowKeys，请用 expandRowKeys 替换
+        - defaultExpandAllGroupRows，请用 expandAllGroupRows 替换
+  - 样式相关调整
+    - CSS 变量添加 semi 前缀，例如 --color-primary => --semi-color-primary
+    - 在 2.x，统一将插画的宽高设置为 `200 * 200px`，1.x 的尺寸为 `300 * 150px`
+    - 设计变量调整
+      - Popconfirm
+        - $color-popconfirm_body-text 由 --semi-color-tertiary => --semi-color-text-2
+        - $color-popconfirm_header_alert-icon 由 #fa7500 => --semi-color-warning
+      - Progress
+        - $spacing-progress_line_text-marginLeft 由 15px => $spacing-base(16px)
+        - $spacing-progress_line_text-marginRight 由 15px => $spacing-base(16px)
+      - Radio
+        - $spacing-radio_addon_buttonRadio_large-paddingY 由 6px => $spacing-base-tight / 2 (6px)
+        - $radius-radio_cardRadioGroup 由 3px => --semi-border-radius-small(3px)
+  - 插件相关调整
+      - 2.x 不再支持通过 Semi 插件配置 iconLazyLoad、svgPaths、srcSvgPaths
+      - 2.x 默认已支持局部暗色/亮色模式，不再需要在插件配置 themeScope。使用方式由 #semi-always-xxx => .semi-always-xxx
+  - 其他调整
+    - 由于 Icon 方案的调整，Icon、Empty 组件使用 icon、插画的方式与之前不同，具体请看 [1.x 迁移 2.x 指南](/zh-CN/start/update-to-v2)
 
 #### 🎉 1.33.0 (2021-10-22)
 - 【Fix】

content/start/update-to-v2/index-en-US.md

@@ -33,7 +33,7 @@ v2.0 Semi is officially released to the public network npm, the package name nee
 
 ```jsx
 // before
-import { Select, Input, Form } from '@douyinfe/semi-ui';
+import { Select, Input, Form } from '@ies/semi-ui-react';
 
 // now
 import { Select, Input, Form } from '@douyinfe/semi-ui';
@@ -43,7 +43,7 @@ import { Select, Input, Form } from '@douyinfe/semi-ui';
 
 ```jsx
 // before
-import { SelectProps } from '@douyinfe/semi-ui/select' 
+import { SelectProps } from '@ies/semi-ui-react/select' 
 
 // now
 import { SelectProps } from '@douyinfe/semi-ui/lib/es/select'
@@ -53,7 +53,7 @@ import { SelectProps } from '@douyinfe/semi-ui/lib/es/select'
 
 ```jsx
 // before
-import en_GB from '@douyinfe/semi-ui/locale/source/en_GB'
+import en_GB from '@ies/semi-ui-react/locale/source/en_GB'
 
 // now
 import en_GB from '@douyinfe/semi-ui/lib/es/locale/source/en_GB'
@@ -103,7 +103,7 @@ Icon usage adjustment:
 <Icon type="home" />
 
 // 1.x when iconLazyload is true
-import homeSvg from '@douyinfe/semi-icons/semi-icons-home.svg';
+import homeSvg from '@ies/semi-icons/semi-icons-home.svg';
 <Icon type={homeSvg.id} />
 
 // 2.x use the following methods uniformly
@@ -115,8 +115,8 @@ Illustration Adjustment:
 
 ```jsx
 // 1.x
-import { Empty } from '@douyinfe/semi-ui';
-import Construction from '@douyinfe/semi-illustrations/construction.svg';
+import { Empty } from '@ies/semi-ui-react';
+import Construction from '@ies/semi-illustrations/construction.svg';
 <Empty image={Construction} />
 
 // 2.x

content/start/update-to-v2/index.md

@@ -33,7 +33,7 @@ v2.0 Semi 正式开源发布至公网 npm，包名需要调整，去除原有的
 
 ```jsx
 // before
-import { Select, Input, Form } from '@douyinfe/semi-ui';
+import { Select, Input, Form } from '@ies/semi-ui-react';
 
 // after
 import { Select, Input, Form } from '@douyinfe/semi-ui';
@@ -44,7 +44,7 @@ import { Select, Input, Form } from '@douyinfe/semi-ui';
 
 ```jsx
 // before
-import { SelectProps } from '@douyinfe/semi-ui/select' 
+import { SelectProps } from '@ies/semi-ui-react/select' 
 
 // now
 import { SelectProps } from '@douyinfe/semi-ui/lib/es/select'
@@ -54,7 +54,7 @@ import { SelectProps } from '@douyinfe/semi-ui/lib/es/select'
 
 ```jsx
 // before
-import en_GB from '@douyinfe/semi-ui/locale/source/en_GB'
+import en_GB from '@ies/semi-ui-react/locale/source/en_GB'
 
 // now
 import en_GB from '@douyinfe/semi-ui/lib/es/locale/source/en_GB'
@@ -105,7 +105,7 @@ Icon 使用调整：
 <Icon type="home" />
 
 // 1.x 当 iconLazyload 为 true 的情况
-import homeSvg from '@douyinfe/semi-icons/semi-icons-home.svg';
+import homeSvg from '@ies/semi-icons/semi-icons-home.svg';
 <Icon type={homeSvg.id} />
 
 // 2.x 统一使用如下方式使用
@@ -117,8 +117,8 @@ import { IconHome } from '@douyinfe/semi-icons';
 
 ```jsx
 // 1.x
-import { Empty } from '@douyinfe/semi-ui';
-import Construction from '@douyinfe/semi-illustrations/construction.svg';
+import { Empty } from '@ies/semi-ui-react';
+import Construction from '@ies/semi-illustrations/construction.svg';
 <Empty image={Construction} />
 
 // 2.x

scripts/changelog.js

@@ -76,7 +76,7 @@ const TYPE_MAP = {
     styles: 'style',
 };
 
-const SUPPORT_TYPES = new Set(['feature', 'performance', 'style', 'new component', 'chore', 'docs', 'fix', 'refactor']);
+const SUPPORT_TYPES = new Set(['feature', 'performance', 'style', 'new component', 'chore', 'docs', 'fix', 'refactor', 'breaking change']);
 
 const UNKNOWN_COMPONENT_NAME = 'Other';
 const UNKNOWN_TYPE_NAME = 'chore';
@@ -156,10 +156,12 @@ function getChangeLogList(rawMarkdown) {
     const output = [];
     let version, type, parentComponent, prevLevel, level, prevIndent;
     let parentIndent = 0;
+    let intent2Level = new Map();
     for (let line of lines) {
         // is version line, eg. #### 🎉 1.24.4 (2021-06-21)
         if (line.startsWith('####')) {
             version = getVersion(line);
+            intent2Level = new Map();
             continue;
         }
         // is type line, eg. - 【Fix】
@@ -175,12 +177,20 @@ function getChangeLogList(rawMarkdown) {
             let [content, indent] = getChangeLog(line);
             let component = getComponent(content);
             // process level
-            if (indent > prevIndent) {
-                level = ++prevLevel;
-            } else if (indent < prevIndent) {
-                level = --prevLevel;
+            const _level = intent2Level.get(indent); // align to same value indent
+            if (_level) {
+                level = _level;
+                prevIndent = indent;
+                prevLevel = level;
             } else {
-                level = prevLevel;
+                if (indent > prevIndent) {
+                    level = ++prevLevel;
+                } else if (indent < prevIndent) {
+                    level = --prevLevel;
+                } else {
+                    level = prevLevel;
+                }
+                intent2Level.set(indent, level);
             }
             // process component is none
             if ((prevIndent && (indent > prevIndent)) || ((indent === prevIndent) && level !== 1)) {

src/components/ChangeLogDiff/constant.js

@@ -7,4 +7,5 @@ export const CHANGELOG_TYPE_MAP = {
     performance: '🚀 Performance',
     chore: '🗃 Chore',
     docs: '✏️ Documentation',
+    'breaking change': '💥 Breaking Change'
 };

src/components/ChangeLogDiff/index.jsx

@@ -75,7 +75,7 @@ export default function ChangeLogDiff(props) {
                 const filterComponent = componentsIsValid ? components : allComponents;
                 const filterType = Array.isArray(types) && types.length > 0 ? types : ALL_TYPES;
                 const searchResult = filterData(v1, v2, filterComponent, filterType);
-                searchResult.sort((a, b) => (a.component < b.component ? -1 : 1));
+                // searchResult.sort((a, b) => (a.component < b.component ? -1 : 1)); // remove component name sort
 
                 if (!componentsIsValid) {
                     const newComponentList = Array.from(new Set(searchResult.map(item => item.component)));

src/templates/postTemplate.js

@@ -283,6 +283,10 @@ const components = {
             if (children[0] === '【Refactor】') {
                 children[0] = <div className={'changelog-title'}>🧶【Refactor】</div>;
             }
+
+            if (children[0] === '【Breaking Change】') {
+                children[0] = <div className={'changelog-title'}>💥【Breaking Change】</div>;
+            }
         }
 
         return <li className={'gatsby-li'}>{children}</li>;