Merge branch 'main' into release

packages/semi-foundation/cascader/cascader.scss

@@ -408,6 +408,21 @@ $module: #{$prefix}-cascader;
             &-empty {
                 margin-right: $spacing-cascader_empty_icon-marginRight;
             }
+
+            &-left {
+                margin-left: $spacing-cascader_option-icon-marginLeft;
+            }
+        }
+
+        &-spin-icon {
+            width: $width-cascader-icon;
+            height: $width-cascader-icon;
+            line-height: 0;
+
+            & svg {
+                width: $width-cascader-icon;
+                height: $width-cascader-icon;
+            }
         }
 
         &-label {

packages/semi-foundation/cascader/variables.scss

@@ -51,6 +51,7 @@ $spacing-cascader_selection_tagInput-marginLeft: - $spacing-extra-tight; // 级
 $spacing-cascader_selection_input-marginLeft: $spacing-extra-tight; // 级联选择触发器多选搜索时输入框的左外边距
 $spacing-cascader_selection_n-marginRight: $spacing-extra-tight; // 超出 maxTagCount 后，+n 的右外边距
 $spacing-cascader_clearBtn-marginRight: 12px; // 级联选择触发器清空按钮右侧外边距
+$spacing-cascader_option-icon-marginLeft: 8px; // 级联选择菜单项图标左侧外边距
 
 $color-cascader_selection_n-text-default: var(--semi-color-text-0); // 超出 maxTagCount 后，+n 的文字默认颜色
 $color-cascader_selection_n-text-disabled: var(--semi-color-disabled-text); // 超出 maxTagCount 后，+n 的文字disabled颜色

packages/semi-icons/CONTRIBUTING.md

@@ -0,0 +1,9 @@
+## 📣 Introduction
+
+How to contribute icon to this package
+
+##  🚀 Steps
+- Add the svg file under the path ```src/svgs/```, naming references to other files.
+- Run command ```lerna run build:icon --scope @douyinfe/semi-icons```, the corresponding tsx file will be generated under the path ```src/icons```.
+- Add the category and name of the new icon to the ```src/svgs/meta.json``` file.
+- Finally, run command ```yarn docsite``` and go to the icon page to confirm whether the icon is successfully added.

packages/semi-icons/src/icons/IconCalendarStroked.tsx

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import { convertIcon } from '../components/Icon';
+
+function SvgComponent(props: React.SVGProps<SVGSVGElement>) {
+    return (
+        <svg
+            viewBox="0 0 24 24"
+            width="1em"
+            height="1em"
+            xmlns="http://www.w3.org/2000/svg"
+            fill="none"
+            focusable={false}
+            aria-hidden={true}
+            {...props}
+        >
+            <path
+                fillRule="evenodd"
+                clipRule="evenodd"
+                d="M9.65168 2.11236C9.65168 1.49802 9.15366 1 8.53932 1C7.92498 1 7.42696 1.49802 7.42696 2.11236V2.97754H3.10112C1.94071 2.97754 1 3.91824 1 5.07866V10.0225V15.955V20.8989C1 22.0593 1.94071 23 3.10112 23H8.53049L8.53932 23L8.54816 23H15.4518C15.4548 23 15.4577 23 15.4607 23C15.4636 23 15.4666 23 15.4695 23H20.8989C22.0593 23 23 22.0593 23 20.8989V15.955V10.0225V5.07866C23 3.91824 22.0593 2.97754 20.8989 2.97754H16.573V2.11236C16.573 1.49802 16.075 1 15.4607 1C14.8463 1 14.3483 1.49802 14.3483 2.11236V2.97754H9.65168V2.11236ZM16.573 20.7753H20.7753V17.0674H16.573V20.7753ZM16.573 14.8427H20.7753V11.1349H16.573V14.8427ZM14.3483 11.1349V14.8427H9.65168V11.1349H14.3483ZM15.4607 8.91016H20.7753V5.20226H16.573V6.06742C16.573 6.68175 16.075 7.17978 15.4607 7.17978C14.8463 7.17978 14.3483 6.68175 14.3483 6.06742V5.20226H9.65168V6.06742C9.65168 6.68175 9.15366 7.17978 8.53932 7.17978C7.92498 7.17978 7.42696 6.68175 7.42696 6.06742V5.20226H3.22472V8.91016H8.53932H15.4607ZM14.3483 17.0674V20.7753H9.65168V17.0674H14.3483ZM7.42696 20.7753V17.0674H3.22472V20.7753H7.42696ZM7.42696 14.8427V11.1349H3.22472V14.8427H7.42696Z"
+                fill="currentColor"
+            />
+        </svg>
+    );
+}
+
+const IconComponent = convertIcon(SvgComponent, 'calendar_stroked');
+export default IconComponent;

packages/semi-icons/src/icons/IconConfigStroked.tsx

@@ -0,0 +1,37 @@
+import * as React from 'react';
+import { convertIcon } from '../components/Icon';
+
+function SvgComponent(props: React.SVGProps<SVGSVGElement>) {
+    return (
+        <svg
+            viewBox="0 0 24 24"
+            width="1em"
+            height="1em"
+            xmlns="http://www.w3.org/2000/svg"
+            fill="none"
+            focusable={false}
+            aria-hidden={true}
+            {...props}
+        >
+            <g clipPath="url(#clip0_1478_52)">
+                <path fillRule="evenodd" clipRule="evenodd" d="M16.9539 4.23508C16.9539 3.61376 17.4575 3.11008 18.0789 3.11008H21.3947C22.016 3.11008 22.5197 3.61376 22.5197 4.23508C22.5197 4.8564 22.016 5.36008 21.3947 5.36008H18.0789C17.4575 5.36008 16.9539 4.8564 16.9539 4.23508Z" fill="currentColor" />
+                <path fillRule="evenodd" clipRule="evenodd" d="M13.6579 0.900024C14.2792 0.900024 14.7829 1.4037 14.7829 2.02502V6.44608C14.7829 7.0674 14.2792 7.57108 13.6579 7.57108C13.0366 7.57108 12.5329 7.0674 12.5329 6.44608V2.02502C12.5329 1.4037 13.0366 0.900024 13.6579 0.900024Z" fill="currentColor" />
+                <path fillRule="evenodd" clipRule="evenodd" d="M0.375 4.23508C0.375 3.61376 0.87868 3.11008 1.5 3.11008H13.6579C14.2792 3.11008 14.7829 3.61376 14.7829 4.23508C14.7829 4.8564 14.2792 5.36008 13.6579 5.36008H1.5C0.87868 5.36008 0.375 4.8564 0.375 4.23508Z" fill="currentColor" />
+                <path fillRule="evenodd" clipRule="evenodd" d="M0.375 11.9727C0.375 11.3514 0.87868 10.8477 1.5 10.8477H5.92106C6.54238 10.8477 7.04606 11.3514 7.04606 11.9727C7.04606 12.594 6.54238 13.0977 5.92106 13.0977H1.5C0.87868 13.0977 0.375 12.594 0.375 11.9727Z" fill="currentColor" />
+                <path fillRule="evenodd" clipRule="evenodd" d="M10.3421 8.63694C10.9634 8.63694 11.4671 9.14062 11.4671 9.76194V14.183C11.4671 14.8043 10.9634 15.308 10.3421 15.308C9.72079 15.308 9.21711 14.8043 9.21711 14.183V9.76194C9.21711 9.14062 9.72079 8.63694 10.3421 8.63694Z" fill="currentColor" />
+                <path fillRule="evenodd" clipRule="evenodd" d="M9.21711 11.9727C9.21711 11.3514 9.72079 10.8477 10.3421 10.8477H22.5C23.1213 10.8477 23.625 11.3514 23.625 11.9727C23.625 12.594 23.1213 13.0977 22.5 13.0977H10.3421C9.72079 13.0977 9.21711 12.594 9.21711 11.9727Z" fill="currentColor" />
+                <path fillRule="evenodd" clipRule="evenodd" d="M16.9539 19.7096C16.9539 19.0883 17.4575 18.5846 18.0789 18.5846H21.3947C22.016 18.5846 22.5197 19.0883 22.5197 19.7096C22.5197 20.3309 22.016 20.8346 21.3947 20.8346H18.0789C17.4575 20.8346 16.9539 20.3309 16.9539 19.7096Z" fill="currentColor" />
+                <path fillRule="evenodd" clipRule="evenodd" d="M13.6579 16.3739C14.2792 16.3739 14.7829 16.8775 14.7829 17.4989V21.9199C14.7829 22.5412 14.2792 23.0449 13.6579 23.0449C13.0366 23.0449 12.5329 22.5412 12.5329 21.9199V17.4989C12.5329 16.8775 13.0366 16.3739 13.6579 16.3739Z" fill="currentColor" />
+                <path fillRule="evenodd" clipRule="evenodd" d="M0.375 19.7096C0.375 19.0883 0.87868 18.5846 1.5 18.5846H13.6579C14.2792 18.5846 14.7829 19.0883 14.7829 19.7096C14.7829 20.3309 14.2792 20.8346 13.6579 20.8346H1.5C0.87868 20.8346 0.375 20.3309 0.375 19.7096Z" fill="currentColor" />
+            </g>
+            <defs>
+                <clipPath id="clip0_1478_52">
+                    <rect width="24" height="24" fill="white" />
+                </clipPath>
+            </defs>
+        </svg>
+    );
+}
+
+const IconComponent = convertIcon(SvgComponent, 'config_stroked');
+export default IconComponent;

packages/semi-icons/src/icons/IconConnectionPoint1.tsx

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import { convertIcon } from '../components/Icon';
+
+function SvgComponent(props: React.SVGProps<SVGSVGElement>) {
+    return (
+        <svg
+            viewBox="0 0 24 24"
+            width="1em"
+            height="1em"
+            xmlns="http://www.w3.org/2000/svg"
+            fill="none"
+            focusable={false}
+            aria-hidden={true}
+            {...props}
+        >
+            <path
+                fillRule="evenodd"
+                clipRule="evenodd"
+                d="M1 3C1 1.89543 1.89543 1 3 1H21C22.1045 1 23 1.89543 23 3V9C23 10.1046 22.1045 11 21 11H7.5V15C7.5 15.8284 8.17157 16.5 9 16.5H13V15C13 13.8954 13.8954 13 15 13H21C22.1046 13 23 13.8954 23 15V21C23 22.1046 22.1046 23 21 23H15C13.8954 23 13 22.1046 13 21V19.5H9C6.51472 19.5 4.5 17.4853 4.5 15V11H3C1.89543 11 1 10.1046 1 9V3Z"
+                fill="currentColor"
+            />
+        </svg>
+    );
+}
+
+const IconComponent = convertIcon(SvgComponent, 'connection_point_1');
+export default IconComponent;

packages/semi-icons/src/icons/IconConnectionPoint2.tsx

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import { convertIcon } from '../components/Icon';
+
+function SvgComponent(props: React.SVGProps<SVGSVGElement>) {
+    return (
+        <svg
+            viewBox="0 0 24 24"
+            width="1em"
+            height="1em"
+            xmlns="http://www.w3.org/2000/svg"
+            fill="none"
+            focusable={false}
+            aria-hidden={true}
+            {...props}
+        >
+            <path
+                fillRule="evenodd"
+                clipRule="evenodd"
+                d="M1 3C1 1.89543 1.89543 1 3 1H21C22.1045 1 23 1.89543 23 3V9C23 10.1046 22.1045 11 21 11H7.5V15C7.5 15.8284 8.17157 16.5 9 16.5H13V15C13 13.8954 13.8954 13 15 13H21C22.1046 13 23 13.8954 23 15V21C23 22.1046 22.1046 23 21 23H15C13.8954 23 13 22.1046 13 21V19.5H9C6.51472 19.5 4.5 17.4853 4.5 15V11H3C1.89543 11 1 10.1046 1 9V3ZM16 16V20H20V16H16Z"
+                fill="currentColor"
+            />
+        </svg>
+    );
+}
+
+const IconComponent = convertIcon(SvgComponent, 'connection_point_2');
+export default IconComponent;

packages/semi-icons/src/icons/IconIssueStroked.tsx

@@ -0,0 +1,31 @@
+import * as React from 'react';
+import { convertIcon } from '../components/Icon';
+
+function SvgComponent(props: React.SVGProps<SVGSVGElement>) {
+    return (
+        <svg
+            viewBox="0 0 24 24"
+            width="1em"
+            height="1em"
+            xmlns="http://www.w3.org/2000/svg"
+            fill="none"
+            focusable={false}
+            aria-hidden={true}
+            {...props}
+        >
+            <g clipPath="url(#clip0_1477_35)">
+                <path fillRule="evenodd" clipRule="evenodd" d="M4.13344 4.13343C6.14546 2.12144 8.92825 0.875 12 0.875C15.0718 0.875 17.8545 2.12144 19.8665 4.13343C21.8785 6.14545 23.125 8.92825 23.125 12C23.125 15.0718 21.8785 17.8545 19.8665 19.8665C17.8545 21.8785 15.0718 23.125 12 23.125C8.92825 23.125 6.14546 21.8785 4.13344 19.8666C2.12145 17.8545 0.875 15.0718 0.875 12C0.875 8.92825 2.12146 6.14545 4.13344 4.13343ZM5.72442 5.72443C5.72441 5.72444 5.72442 5.72443 5.72442 5.72443C7.33174 4.11714 9.54896 3.125 12 3.125C14.451 3.125 16.6683 4.11714 18.2756 5.72443C19.8829 7.33174 20.875 9.54896 20.875 12C20.875 14.451 19.8829 16.6683 18.2756 18.2756C16.6683 19.8829 14.451 20.875 12 20.875C9.54896 20.875 7.33174 19.8829 5.72443 18.2756C4.11714 16.6683 3.125 14.451 3.125 12C3.125 9.54896 4.11713 7.33175 5.72442 5.72443Z" fill="currentColor" />
+                <path fillRule="evenodd" clipRule="evenodd" d="M12 18.5C12.6904 18.5 13.25 17.9404 13.25 17.25C13.25 16.5597 12.6904 16 12 16C11.3097 16 10.75 16.5597 10.75 17.25C10.75 17.9404 11.3097 18.5 12 18.5Z" fill="currentColor" />
+                <path fillRule="evenodd" clipRule="evenodd" d="M12 4.875C12.6213 4.875 13.125 5.37868 13.125 6V14C13.125 14.6213 12.6213 15.125 12 15.125C11.3787 15.125 10.875 14.6213 10.875 14V6C10.875 5.37868 11.3787 4.875 12 4.875Z" fill="currentColor" />
+            </g>
+            <defs>
+                <clipPath id="clip0_1477_35">
+                    <rect width="24" height="24" fill="white" />
+                </clipPath>
+            </defs>
+        </svg>
+    );
+}
+
+const IconComponent = convertIcon(SvgComponent, 'issue_stroked');
+export default IconComponent;

packages/semi-icons/src/icons/IconStoryStroked.tsx

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import { convertIcon } from '../components/Icon';
+
+function SvgComponent(props: React.SVGProps<SVGSVGElement>) {
+    return (
+        <svg
+            viewBox="0 0 24 24"
+            width="1em"
+            height="1em"
+            xmlns="http://www.w3.org/2000/svg"
+            fill="none"
+            focusable={false}
+            aria-hidden={true}
+            {...props}
+        >
+            <path
+                fillRule="evenodd"
+                clipRule="evenodd"
+                d="M20.36 12C20.36 16.6171 16.6171 20.36 12 20.36C7.3829 20.36 3.64 16.6171 3.64 12C3.64 7.3829 7.3829 3.64 12 3.64C16.6171 3.64 20.36 7.3829 20.36 12ZM23 12C23 18.0751 18.0751 23 12 23C5.92487 23 1 18.0751 1 12C1 5.92487 5.92487 1 12 1C18.0751 1 23 5.92487 23 12ZM17.5534 9.85334C18.0689 9.33784 18.0689 8.50207 17.5534 7.98657C17.0379 7.47108 16.2021 7.47108 15.6866 7.98657L10.02 13.6532L7.65338 11.2866C7.13789 10.7711 6.30211 10.7711 5.78662 11.2866C5.27113 11.8021 5.27113 12.6378 5.78662 13.1533L9.08662 16.4533C9.33417 16.7009 9.66992 16.84 10.02 16.84C10.3701 16.84 10.7058 16.7009 10.9534 16.4533L17.5534 9.85334Z"
+                fill="currentColor"
+            />
+        </svg>
+    );
+}
+
+const IconComponent = convertIcon(SvgComponent, 'story_stroked');
+export default IconComponent;

packages/semi-icons/src/icons/IconVersionStroked.tsx

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import { convertIcon } from '../components/Icon';
+
+function SvgComponent(props: React.SVGProps<SVGSVGElement>) {
+    return (
+        <svg
+            viewBox="0 0 24 24"
+            width="1em"
+            height="1em"
+            xmlns="http://www.w3.org/2000/svg"
+            fill="none"
+            focusable={false}
+            aria-hidden={true}
+            {...props}
+        >
+            <path
+                fillRule="evenodd"
+                clipRule="evenodd"
+                d="M5.125 3.125V20.1518L11.4833 16.8643C11.8074 16.6968 12.1926 16.6968 12.5167 16.8643L18.875 20.1518V3.125H5.125ZM2.875 3C2.875 1.82639 3.82639 0.875 5 0.875H19C20.1736 0.875 21.125 1.82641 21.125 3V22C21.125 22.3926 20.9203 22.7568 20.585 22.961C20.2496 23.1651 19.8321 23.1796 19.4833 22.9993L12 19.1301L4.5167 22.9993C4.16794 23.1796 3.75041 23.1651 3.41505 22.961C3.07968 22.7568 2.875 22.3926 2.875 22V3Z"
+                fill="currentColor"
+            />
+        </svg>
+    );
+}
+
+const IconComponent = convertIcon(SvgComponent, 'version_stroked');
+export default IconComponent;

packages/semi-icons/src/icons/index.ts

@@ -60,6 +60,7 @@ export { default as IconButtonStroked } from './IconButtonStroked';
 export { default as IconBytedanceLogo } from './IconBytedanceLogo';
 export { default as IconCalendar } from './IconCalendar';
 export { default as IconCalendarClock } from './IconCalendarClock';
+export { default as IconCalendarStroked } from './IconCalendarStroked';
 export { default as IconCamera } from './IconCamera';
 export { default as IconCandlestickChartStroked } from './IconCandlestickChartStroked';
 export { default as IconCaretdown } from './IconCaretdown';
@@ -100,6 +101,9 @@ export { default as IconCommentStroked } from './IconCommentStroked';
 export { default as IconComponent } from './IconComponent';
 export { default as IconComponentPlaceholderStroked } from './IconComponentPlaceholderStroked';
 export { default as IconComponentStroked } from './IconComponentStroked';
+export { default as IconConfigStroked } from './IconConfigStroked';
+export { default as IconConnectionPoint1 } from './IconConnectionPoint1';
+export { default as IconConnectionPoint2 } from './IconConnectionPoint2';
 export { default as IconContrast } from './IconContrast';
 export { default as IconCopy } from './IconCopy';
 export { default as IconCopyAdd } from './IconCopyAdd';
@@ -222,6 +226,7 @@ export { default as IconInnerSectionStroked } from './IconInnerSectionStroked';
 export { default as IconInstagram } from './IconInstagram';
 export { default as IconInteractiveStroked } from './IconInteractiveStroked';
 export { default as IconInviteStroked } from './IconInviteStroked';
+export { default as IconIssueStroked } from './IconIssueStroked';
 export { default as IconItalic } from './IconItalic';
 export { default as IconJianying } from './IconJianying';
 export { default as IconKanban } from './IconKanban';
@@ -361,6 +366,7 @@ export { default as IconStar } from './IconStar';
 export { default as IconStarStroked } from './IconStarStroked';
 export { default as IconStop } from './IconStop';
 export { default as IconStopwatchStroked } from './IconStopwatchStroked';
+export { default as IconStoryStroked } from './IconStoryStroked';
 export { default as IconStrikeThrough } from './IconStrikeThrough';
 export { default as IconSun } from './IconSun';
 export { default as IconSync } from './IconSync';
@@ -417,6 +423,7 @@ export { default as IconUserSetting } from './IconUserSetting';
 export { default as IconUserStroked } from './IconUserStroked';
 export { default as IconVennChartStroked } from './IconVennChartStroked';
 export { default as IconVerify } from './IconVerify';
+export { default as IconVersionStroked } from './IconVersionStroked';
 export { default as IconVideo } from './IconVideo';
 export { default as IconVideoDouyinStroked } from './IconVideoDouyinStroked';
 export { default as IconVideoListStroked } from './IconVideoListStroked';

packages/semi-icons/src/svgs/calendar_stroked.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9.65168 2.11236C9.65168 1.49802 9.15366 1 8.53932 1C7.92498 1 7.42696 1.49802 7.42696 2.11236V2.97754H3.10112C1.94071 2.97754 1 3.91824 1 5.07866V10.0225V15.955V20.8989C1 22.0593 1.94071 23 3.10112 23H8.53049L8.53932 23L8.54816 23H15.4518C15.4548 23 15.4577 23 15.4607 23C15.4636 23 15.4666 23 15.4695 23H20.8989C22.0593 23 23 22.0593 23 20.8989V15.955V10.0225V5.07866C23 3.91824 22.0593 2.97754 20.8989 2.97754H16.573V2.11236C16.573 1.49802 16.075 1 15.4607 1C14.8463 1 14.3483 1.49802 14.3483 2.11236V2.97754H9.65168V2.11236ZM16.573 20.7753H20.7753V17.0674H16.573V20.7753ZM16.573 14.8427H20.7753V11.1349H16.573V14.8427ZM14.3483 11.1349V14.8427H9.65168V11.1349H14.3483ZM15.4607 8.91016H20.7753V5.20226H16.573V6.06742C16.573 6.68175 16.075 7.17978 15.4607 7.17978C14.8463 7.17978 14.3483 6.68175 14.3483 6.06742V5.20226H9.65168V6.06742C9.65168 6.68175 9.15366 7.17978 8.53932 7.17978C7.92498 7.17978 7.42696 6.68175 7.42696 6.06742V5.20226H3.22472V8.91016H8.53932H15.4607ZM14.3483 17.0674V20.7753H9.65168V17.0674H14.3483ZM7.42696 20.7753V17.0674H3.22472V20.7753H7.42696ZM7.42696 14.8427V11.1349H3.22472V14.8427H7.42696Z" fill="black"/>
+</svg>

packages/semi-icons/src/svgs/config_stroked.svg

@@ -0,0 +1,18 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_1478_52)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M16.9539 4.23508C16.9539 3.61376 17.4575 3.11008 18.0789 3.11008H21.3947C22.016 3.11008 22.5197 3.61376 22.5197 4.23508C22.5197 4.8564 22.016 5.36008 21.3947 5.36008H18.0789C17.4575 5.36008 16.9539 4.8564 16.9539 4.23508Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13.6579 0.900024C14.2792 0.900024 14.7829 1.4037 14.7829 2.02502V6.44608C14.7829 7.0674 14.2792 7.57108 13.6579 7.57108C13.0366 7.57108 12.5329 7.0674 12.5329 6.44608V2.02502C12.5329 1.4037 13.0366 0.900024 13.6579 0.900024Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0.375 4.23508C0.375 3.61376 0.87868 3.11008 1.5 3.11008H13.6579C14.2792 3.11008 14.7829 3.61376 14.7829 4.23508C14.7829 4.8564 14.2792 5.36008 13.6579 5.36008H1.5C0.87868 5.36008 0.375 4.8564 0.375 4.23508Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0.375 11.9727C0.375 11.3514 0.87868 10.8477 1.5 10.8477H5.92106C6.54238 10.8477 7.04606 11.3514 7.04606 11.9727C7.04606 12.594 6.54238 13.0977 5.92106 13.0977H1.5C0.87868 13.0977 0.375 12.594 0.375 11.9727Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M10.3421 8.63694C10.9634 8.63694 11.4671 9.14062 11.4671 9.76194V14.183C11.4671 14.8043 10.9634 15.308 10.3421 15.308C9.72079 15.308 9.21711 14.8043 9.21711 14.183V9.76194C9.21711 9.14062 9.72079 8.63694 10.3421 8.63694Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9.21711 11.9727C9.21711 11.3514 9.72079 10.8477 10.3421 10.8477H22.5C23.1213 10.8477 23.625 11.3514 23.625 11.9727C23.625 12.594 23.1213 13.0977 22.5 13.0977H10.3421C9.72079 13.0977 9.21711 12.594 9.21711 11.9727Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M16.9539 19.7096C16.9539 19.0883 17.4575 18.5846 18.0789 18.5846H21.3947C22.016 18.5846 22.5197 19.0883 22.5197 19.7096C22.5197 20.3309 22.016 20.8346 21.3947 20.8346H18.0789C17.4575 20.8346 16.9539 20.3309 16.9539 19.7096Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13.6579 16.3739C14.2792 16.3739 14.7829 16.8775 14.7829 17.4989V21.9199C14.7829 22.5412 14.2792 23.0449 13.6579 23.0449C13.0366 23.0449 12.5329 22.5412 12.5329 21.9199V17.4989C12.5329 16.8775 13.0366 16.3739 13.6579 16.3739Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M0.375 19.7096C0.375 19.0883 0.87868 18.5846 1.5 18.5846H13.6579C14.2792 18.5846 14.7829 19.0883 14.7829 19.7096C14.7829 20.3309 14.2792 20.8346 13.6579 20.8346H1.5C0.87868 20.8346 0.375 20.3309 0.375 19.7096Z" fill="black"/>
+</g>
+<defs>
+<clipPath id="clip0_1478_52">
+<rect width="24" height="24" fill="white"/>
+</clipPath>
+</defs>
+</svg>

packages/semi-icons/src/svgs/connection_point_1.svg

@@ -0,0 +1 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M1 3C1 1.89543 1.89543 1 3 1H21C22.1045 1 23 1.89543 23 3V9C23 10.1046 22.1045 11 21 11H7.5V15C7.5 15.8284 8.17157 16.5 9 16.5H13V15C13 13.8954 13.8954 13 15 13H21C22.1046 13 23 13.8954 23 15V21C23 22.1046 22.1046 23 21 23H15C13.8954 23 13 22.1046 13 21V19.5H9C6.51472 19.5 4.5 17.4853 4.5 15V11H3C1.89543 11 1 10.1046 1 9V3Z" fill="black"/></svg>

packages/semi-icons/src/svgs/connection_point_2.svg

@@ -0,0 +1 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M1 3C1 1.89543 1.89543 1 3 1H21C22.1045 1 23 1.89543 23 3V9C23 10.1046 22.1045 11 21 11H7.5V15C7.5 15.8284 8.17157 16.5 9 16.5H13V15C13 13.8954 13.8954 13 15 13H21C22.1046 13 23 13.8954 23 15V21C23 22.1046 22.1046 23 21 23H15C13.8954 23 13 22.1046 13 21V19.5H9C6.51472 19.5 4.5 17.4853 4.5 15V11H3C1.89543 11 1 10.1046 1 9V3ZM16 16V20H20V16H16Z" fill="black"/></svg>

packages/semi-icons/src/svgs/issue_stroked.svg

@@ -0,0 +1,12 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_1477_35)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4.13344 4.13343C6.14546 2.12144 8.92825 0.875 12 0.875C15.0718 0.875 17.8545 2.12144 19.8665 4.13343C21.8785 6.14545 23.125 8.92825 23.125 12C23.125 15.0718 21.8785 17.8545 19.8665 19.8665C17.8545 21.8785 15.0718 23.125 12 23.125C8.92825 23.125 6.14546 21.8785 4.13344 19.8666C2.12145 17.8545 0.875 15.0718 0.875 12C0.875 8.92825 2.12146 6.14545 4.13344 4.13343ZM5.72442 5.72443C5.72441 5.72444 5.72442 5.72443 5.72442 5.72443C7.33174 4.11714 9.54896 3.125 12 3.125C14.451 3.125 16.6683 4.11714 18.2756 5.72443C19.8829 7.33174 20.875 9.54896 20.875 12C20.875 14.451 19.8829 16.6683 18.2756 18.2756C16.6683 19.8829 14.451 20.875 12 20.875C9.54896 20.875 7.33174 19.8829 5.72443 18.2756C4.11714 16.6683 3.125 14.451 3.125 12C3.125 9.54896 4.11713 7.33175 5.72442 5.72443Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12 18.5C12.6904 18.5 13.25 17.9404 13.25 17.25C13.25 16.5597 12.6904 16 12 16C11.3097 16 10.75 16.5597 10.75 17.25C10.75 17.9404 11.3097 18.5 12 18.5Z" fill="black"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12 4.875C12.6213 4.875 13.125 5.37868 13.125 6V14C13.125 14.6213 12.6213 15.125 12 15.125C11.3787 15.125 10.875 14.6213 10.875 14V6C10.875 5.37868 11.3787 4.875 12 4.875Z" fill="black"/>
+</g>
+<defs>
+<clipPath id="clip0_1477_35">
+<rect width="24" height="24" fill="white"/>
+</clipPath>
+</defs>
+</svg>

packages/semi-icons/src/svgs/meta.json

@@ -31,6 +31,14 @@
         "name": "scissors",
         "category": "Objects"
     },
+    {
+        "name": "connection_point_1",
+        "category": "Objects"
+    },
+    {
+        "name": "connection_point_2",
+        "category": "Objects"
+    },
     {
         "name": "xigua_logo",
         "category": "Brands"
@@ -1327,6 +1335,26 @@
         "name": "bottom_right_stroked",
         "category": "Magic Customized"
     },
+    {
+        "name": "issue_stroked",
+        "category": "Basic"
+    },
+    {
+        "name": "version_stroked",
+        "category": "Basic"
+    },
+    {
+        "name": "calendar_stroked",
+        "category": "Basic"
+    },
+    {
+        "name": "config_stroked",
+        "category": "Basic"
+    },
+    {
+        "name": "story_stroked",
+        "category": "Basic"
+    },
     {
         "name": "gift_stroked",
         "category": "Basic"

packages/semi-icons/src/svgs/storys_stroked.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M20.36 12C20.36 16.6171 16.6171 20.36 12 20.36C7.3829 20.36 3.64 16.6171 3.64 12C3.64 7.3829 7.3829 3.64 12 3.64C16.6171 3.64 20.36 7.3829 20.36 12ZM23 12C23 18.0751 18.0751 23 12 23C5.92487 23 1 18.0751 1 12C1 5.92487 5.92487 1 12 1C18.0751 1 23 5.92487 23 12ZM17.5534 9.85334C18.0689 9.33784 18.0689 8.50207 17.5534 7.98657C17.0379 7.47108 16.2021 7.47108 15.6866 7.98657L10.02 13.6532L7.65338 11.2866C7.13789 10.7711 6.30211 10.7711 5.78662 11.2866C5.27113 11.8021 5.27113 12.6378 5.78662 13.1533L9.08662 16.4533C9.33417 16.7009 9.66992 16.84 10.02 16.84C10.3701 16.84 10.7058 16.7009 10.9534 16.4533L17.5534 9.85334Z" fill="black"/>
+</svg>

packages/semi-icons/src/svgs/version_stroked.svg

@@ -0,0 +1 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M5.125 3.125V20.1518L11.4833 16.8643C11.8074 16.6968 12.1926 16.6968 12.5167 16.8643L18.875 20.1518V3.125H5.125ZM2.875 3C2.875 1.82639 3.82639 0.875 5 0.875H19C20.1736 0.875 21.125 1.82641 21.125 3V22C21.125 22.3926 20.9203 22.7568 20.585 22.961C20.2496 23.1651 19.8321 23.1796 19.4833 22.9993L12 19.1301L4.5167 22.9993C4.16794 23.1796 3.75041 23.1651 3.41505 22.961C3.07968 22.7568 2.875 22.3926 2.875 22V3Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M6.875 9C6.875 8.37868 7.37868 7.875 8 7.875H16C16.6213 7.875 17.125 8.37868 17.125 9C17.125 9.62132 16.6213 10.125 16 10.125H8C7.37868 10.125 6.875 9.62132 6.875 9Z" fill="black"/></svg>

packages/semi-ui/cascader/item.tsx

@@ -139,16 +139,19 @@ export default class Item extends PureComponent<CascaderItemProps> {
         return state;
     };
 
-    renderIcon = (type: string) => {
+    renderIcon = (type: string, haveMarginLeft = false) => {
+        const finalCls = (style: string) => {
+            return style + (haveMarginLeft ? ` ${prefixcls}-icon-left` : '');
+        };
         switch (type) {
             case 'child':
-                return (<IconChevronRight className={`${prefixcls}-icon ${prefixcls}-icon-expand`} />);
+                return (<IconChevronRight className={finalCls(`${prefixcls}-icon ${prefixcls}-icon-expand`)} />);
             case 'tick':
-                return (<IconTick className={`${prefixcls}-icon ${prefixcls}-icon-active`} />);
+                return (<IconTick className={finalCls(`${prefixcls}-icon ${prefixcls}-icon-active`)} />);
             case 'loading':
-                return <Spin wrapperClassName={`${prefixcls}-spin-icon`} />;
+                return <Spin wrapperClassName={finalCls(`${prefixcls}-spin-icon`)} />;
             case 'empty':
-                return (<span aria-hidden={true} className={`${prefixcls}-icon ${prefixcls}-icon-empty`} />);
+                return (<span aria-hidden={true} className={finalCls(`${prefixcls}-icon ${prefixcls}-icon-empty`)} />);
             default:
                 return null;
         }
@@ -273,7 +276,7 @@ export default class Item extends PureComponent<CascaderItemProps> {
                                 )}
                                 <span>{label}</span>
                             </span>
-                            {showExpand ? this.renderIcon(loading ? 'loading' : 'child') : null}
+                            {showExpand ? this.renderIcon(loading ? 'loading' : 'child', true) : null}
                         </li>
                     );
                 })}