Merge branch 'main' into release

lerna.json

@@ -1,5 +1,5 @@
 {
     "useWorkspaces": true,
     "npmClient": "yarn",
-    "version": "2.33.0"
+    "version": "2.33.1"
 }

package.json

@@ -167,7 +167,7 @@
         "eslint-plugin-markdown": "^2.2.1",
         "eslint-plugin-react": "^7.24.0",
         "eslint-plugin-react-hooks": "^4.2.0",
-        "eslint-plugin-semi-design": "latest",
+        "eslint-plugin-semi-design": "^2.33.0",
         "fs-extra": "^8.1.0",
         "glob": "^7.1.7",
         "html-webpack-plugin": "^3.2.0",
@@ -226,4 +226,4 @@
         ]
     },
     "license": "MIT"
-}
+}

packages/semi-animation-react/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-animation-react",
-    "version": "2.33.0",
+    "version": "2.33.1",
     "description": "motion library for semi-ui-react",
     "keywords": [
         "motion",

packages/semi-animation-styled/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-animation-styled",
-    "version": "2.33.0",
+    "version": "2.33.1",
     "description": "semi styled animation",
     "keywords": [
         "semi",

packages/semi-animation/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-animation",
-    "version": "2.33.0",
+    "version": "2.33.1",
     "description": "animation base library for semi-ui",
     "keywords": [
         "animation",

packages/semi-eslint-plugin/package.json

@@ -1,6 +1,6 @@
 {
     "name": "eslint-plugin-semi-design",
-    "version": "2.33.0",
+    "version": "2.33.1",
     "description": "semi ui eslint plugin",
     "keywords": [
         "semi",

packages/semi-foundation/breadcrumb/breadcrumb.scss

@@ -82,14 +82,14 @@ $module: #{$prefix}-breadcrumb;
         }
     }
 
-    &-item-icon+&-item-title {
-        margin-left: $spacing-breadcrumb_item_text-marginLeft;
-    }
+    // &-item-icon+&-item-title {
+    //     margin-left: $spacing-breadcrumb_item_text-marginLeft;
+    // }
 
     &-item-link {
         display: inline-flex;
         align-items: center;
-        column-gap: 4px;
+        column-gap: $spacing-breadcrumb_item_text-marginLeft;
         text-decoration: inherit;
         transition: color $transition_duration-breadcrumb_link-text $transition-function_breadcrumb_link-text $transition_delay-breadcrumb_link-text;
         transform: scale($transform_scale-breadcrumb_link-text);

packages/semi-foundation/calendar/eventUtil.ts

@@ -96,9 +96,9 @@ export interface DateObj {
     month: string
 }
 
-export type weeekStartsOnEnum = 0 | 1 | 2 | 3 | 4 | 5 | 6;
+export type weekStartsOnEnum = 0 | 1 | 2 | 3 | 4 | 5 | 6;
 
-export const calcRangeData = (value: Date, start: Date, rangeLen: number, mode: string, locale: Locale, weekStartsOn: weeekStartsOnEnum) => {
+export const calcRangeData = (value: Date, start: Date, rangeLen: number, mode: string, locale: Locale, weekStartsOn: weekStartsOnEnum) => {
     const today = getCurrDate();
     const arr: Array<DateObj> = [];
     [...Array(rangeLen).keys()].map(ind => {
@@ -121,15 +121,17 @@ export const calcRangeData = (value: Date, start: Date, rangeLen: number, mode:
 
 /**
  *
- * @param {value} date
+ * @param {Date} date
+ * @param {Date} monthStart current month start date, using for month mode
  * @param {string} mode
  * @param {string} locale
  * @returns {object[]} { date: Date, dayString: string, ind: number, isToday: boolean, isWeekend: boolean, weekday: string }
  * create weekly object array
  */
-export const calcWeekData = (value: Date, mode = 'week', locale: Locale, weekStartsOn: weeekStartsOnEnum) => {
+export const calcWeekData = (value: Date, monthStart: Date | null, mode = 'week', locale: Locale, weekStartsOn: weekStartsOnEnum) => {
     const start = startOfWeek(value, { weekStartsOn });
-    return calcRangeData(value, start, 7, mode, locale, weekStartsOn);
+    const realValue = monthStart || value;
+    return calcRangeData(realValue, start, 7, mode, locale, weekStartsOn);
 };
 
 /**
@@ -250,7 +252,7 @@ export const filterEvents = (events: Map<string, EventObject[]>, start: Date, en
  * filter out event that is not in the week range
  */
 // eslint-disable-next-line max-len
-export const filterWeeklyEvents = (events: Map<string, EventObject[]>, weekStart: Date, weekStartsOn: weeekStartsOnEnum ) => filterEvents(events, weekStart, addDays(endOfWeek(weekStart, { weekStartsOn }), 1));
+export const filterWeeklyEvents = (events: Map<string, EventObject[]>, weekStart: Date, weekStartsOn: weekStartsOnEnum ) => filterEvents(events, weekStart, addDays(endOfWeek(weekStart, { weekStartsOn }), 1));
 
 /**
  * @returns {arr}
@@ -309,7 +311,7 @@ export const parseWeeklyAllDayEvent = (
     startDate: Date,
     weekStart: Date,
     parsed: Array<Array<ParsedRangeEvent>>,
-    weekStartsOn: weeekStartsOnEnum
+    weekStartsOn: weekStartsOnEnum
 ) => parseRangeAllDayEvent(event, startDate, weekStart, addDays(endOfWeek(startDate, { weekStartsOn }), 1), parsed);
 
 

packages/semi-foundation/calendar/foundation.ts

@@ -33,9 +33,9 @@ import {
     DateObj,
     checkWeekend,
 } from './eventUtil';
-import type { weeekStartsOnEnum } from './eventUtil';
+import type { weekStartsOnEnum } from './eventUtil';
 
-export { weeekStartsOnEnum };
+export { weekStartsOnEnum };
 export interface EventObject {
     [x: string]: any;
     key: string;
@@ -191,7 +191,7 @@ export default class CalendarFoundation<P = Record<string, any>, S = Record<stri
         const data = {} as WeeklyData;
         const { weekStartsOn } = this.getProps();
         data.month = format(value, 'LLL', { locale: dateFnsLocale, weekStartsOn });
-        data.week = calcWeekData(value, 'week', dateFnsLocale, weekStartsOn);
+        data.week = calcWeekData(value, null, 'week', dateFnsLocale, weekStartsOn);
         this._adapter.setWeeklyData(data);
         return data;
     }
@@ -212,7 +212,7 @@ export default class CalendarFoundation<P = Record<string, any>, S = Record<stri
         const { weekStartsOn } = this.getProps();
         const numberOfWeek = getWeeksInMonth(value, { weekStartsOn });
         [...Array(numberOfWeek).keys()].map(ind => {
-            data[ind] = calcWeekData(addDays(monthStart, ind * 7), 'month', dateFnsLocale, weekStartsOn);
+            data[ind] = calcWeekData(addDays(monthStart, ind * 7), monthStart, 'month', dateFnsLocale, weekStartsOn);
         });
         this._adapter.setMonthlyData(data);
         return data;

packages/semi-foundation/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-foundation",
-    "version": "2.33.0",
+    "version": "2.33.1",
     "description": "",
     "scripts": {
         "build:lib": "node ./scripts/compileLib.js",

packages/semi-foundation/radio/radio.scss

@@ -416,6 +416,7 @@ $inner-width: $width-icon-medium;
     &-horizontal {
         display: inline-flex;
         flex-wrap: wrap;
+        vertical-align: bottom; // Fix 1573
         gap: $spacing-radio_group_horizontal-marginRight;
     }
 

packages/semi-foundation/timePicker/foundation.ts

@@ -10,7 +10,7 @@ import {
     transformToArray,
     isTimeFormatLike
 } from './utils';
-import { split } from 'lodash';
+import { split, isUndefined } from 'lodash';
 import { isValid, format, getHours } from 'date-fns';
 import { utcToZonedTime, zonedTimeToUtc } from '../utils/date-fns-extra';
 import isNullOrUndefined from '../utils/isNullOrUndefined';
@@ -182,7 +182,7 @@ class TimePickerFoundation<P = Record<string, any>, S = Record<string, any>> ext
             isAM[index] = panelIsAM;
             const inputValue = this.formatValue(value);
 
-            if (this.getState('isAM')[index] !== result.isAM){
+            if (this.getState('isAM')[index] !== result.isAM) {
                 this.setState({ isAM } as any);
             }
             if (!this._isControlledComponent('value')) {
@@ -369,7 +369,16 @@ class TimePickerFoundation<P = Record<string, any>, S = Record<string, any>> ext
         }
 
         if (_dates && Array.isArray(_dates)) {
-            return _dates.map(date => formatToString(date, validFormat, dateFnsLocale)).join(rangeSeparator);
+            const result = _dates.map(date => {
+                let str;
+                if (isUndefined(date)) {
+                    str = '';
+                } else {
+                    str = formatToString(date, validFormat, dateFnsLocale);
+                }
+                return str;
+            });
+            return result.join(rangeSeparator);
         }
         return undefined;
     }

packages/semi-icons/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-icons",
-    "version": "2.33.0",
+    "version": "2.33.1",
     "description": "semi icons",
     "keywords": [
         "semi",

packages/semi-illustrations/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-illustrations",
-    "version": "2.33.0",
+    "version": "2.33.1",
     "description": "semi illustrations",
     "keywords": [
         "semi",

packages/semi-next/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-next",
-    "version": "2.33.0",
+    "version": "2.33.1",
     "description": "Plugin that support Semi Design in Next.js",
     "author": "伍浩威 <[email protected]>",
     "homepage": "",

packages/semi-scss-compile/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-scss-compile",
-    "version": "2.33.0",
+    "version": "2.33.1",
     "description": "compile semi scss to css",
     "author": "[email protected]",
     "license": "MIT",

packages/semi-theme-default/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-theme-default",
-    "version": "2.33.0",
+    "version": "2.33.1",
     "description": "semi-theme-default",
     "keywords": [
         "semi-theme",

packages/semi-ui/_utils/index.tsx

@@ -11,7 +11,7 @@ import { isHTMLElement } from '@douyinfe/semi-foundation/utils/dom';
  * @param {React.MouseEvent<HTMLElement>} e React mouse event object
  * @param {boolean} noImmediate Skip stopping immediate propagation
  */
-export function stopPropagation(e: React.MouseEvent, noImmediate?: boolean) {
+export function stopPropagation(e: React.MouseEvent | React.FocusEvent<HTMLElement>, noImmediate?: boolean) {
     if (e && typeof e.stopPropagation === 'function') {
         e.stopPropagation();
     }

packages/semi-ui/calendar/__test__/calendar.test.js

@@ -179,4 +179,25 @@ describe('Calendar', () => {
         let defaultFirstHead = defaultCalendar.find('.semi-calendar-month-header li').at(0).text();
         expect(defaultFirstHead).toEqual('周日');
     });
+
+    it('test getMonthlyData same month fixture', () => {
+        const displayValue = new Date(2023, 3, 10, 8, 32, 0);
+
+        let calendar = mount(<Calendar
+            mode={'month'}
+            displayValue={displayValue}
+        ></Calendar>);
+
+        let firstRow = calendar.find('.semi-calendar-month-weekrow').at(0);
+        let lastRow = calendar.find('.semi-calendar-month-weekrow').last();
+        let sameMonthClass = `${BASE_CLASS_PREFIX}-calendar-month-same`;
+        // 2023-03-26
+        expect(firstRow.find('li').at(0).hasClass(sameMonthClass)).toEqual(false);
+        // 2023-04-01
+        expect(firstRow.find('li').last().hasClass(sameMonthClass)).toEqual(true);
+        // 2023-04-30
+        expect(lastRow.find('li').at(0).hasClass(sameMonthClass)).toEqual(true);
+        // 2023-05-06
+        expect(lastRow.find('li').last().hasClass(sameMonthClass)).toEqual(false);
+    });
 })

packages/semi-ui/calendar/interface.ts

@@ -1,7 +1,7 @@
 import { strings } from '@douyinfe/semi-foundation/calendar/constants';
 import type { ArrayElement } from '../_base/base';
 import type { BaseProps } from '../_base/baseComponent';
-import type { EventObject, weeekStartsOnEnum } from '@douyinfe/semi-foundation/calendar/foundation';
+import type { EventObject, weekStartsOnEnum } from '@douyinfe/semi-foundation/calendar/foundation';
 
 export interface CalendarProps extends BaseProps {
     displayValue?: Date;
@@ -10,7 +10,7 @@ export interface CalendarProps extends BaseProps {
     events?: EventObject[];
     mode?: ArrayElement<typeof strings.MODE>;
     showCurrTime?: boolean;
-    weekStartsOn?: weeekStartsOnEnum;
+    weekStartsOn?: weekStartsOnEnum;
     scrollTop?: number;
     onClick?: (e: React.MouseEvent, value: Date) => void;
     onClose?: (e: React.MouseEvent) => void;

packages/semi-ui/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-ui",
-    "version": "2.33.0",
+    "version": "2.33.1",
     "description": "",
     "main": "lib/cjs/index.js",
     "module": "lib/es/index.js",
@@ -17,12 +17,12 @@
         "lib/*"
     ],
     "dependencies": {
-        "@douyinfe/semi-animation": "2.33.0",
-        "@douyinfe/semi-animation-react": "2.33.0",
-        "@douyinfe/semi-foundation": "2.33.0",
-        "@douyinfe/semi-icons": "2.33.0",
-        "@douyinfe/semi-illustrations": "2.33.0",
-        "@douyinfe/semi-theme-default": "2.33.0",
+        "@douyinfe/semi-animation": "2.33.1",
+        "@douyinfe/semi-animation-react": "2.33.1",
+        "@douyinfe/semi-foundation": "2.33.1",
+        "@douyinfe/semi-icons": "2.33.1",
+        "@douyinfe/semi-illustrations": "2.33.1",
+        "@douyinfe/semi-theme-default": "2.33.1",
         "async-validator": "^3.5.0",
         "classnames": "^2.2.6",
         "copy-text-to-clipboard": "^2.1.1",

packages/semi-ui/table/Body/BaseRow.tsx

@@ -62,7 +62,7 @@ export interface BaseRowProps {
     store?: Store;
     style?: React.CSSProperties;
     virtualized?: Virtualized;
-    visible: boolean; // required
+    visible: boolean // required
 }
 
 export default class TableRow extends BaseComponent<BaseRowProps, Record<string, any>> {
@@ -246,7 +246,7 @@ export default class TableRow extends BaseComponent<BaseRowProps, Record<string,
                 if (level != null && columnIndex === firstIndex) {
                     expandableProps.indent = level;
 
-                    if (!expandableRow) {
+                    if (!expandableRow && hideExpandedColumn) {
                         expandableProps.indent = level + 1;
                     }
                 }

packages/semi-ui/table/_story/v2/Fixed1556/index.tsx

@@ -0,0 +1,112 @@
+import React from 'react';
+import { Table } from '@douyinfe/semi-ui';
+
+App.storyName = 'fixed hideExpandedColumn indent';
+/**
+ * @see https://github.com/DouyinFE/semi-design/issues/1556
+ */
+export default function App() {
+    const columns = [
+        {
+            title: 'Name',
+            dataIndex: 'name',
+            key: 'name',
+        },
+        {
+            title: 'Age',
+            dataIndex: 'age',
+            key: 'age',
+            width: 150,
+        },
+        {
+            title: 'Address',
+            dataIndex: 'address',
+            key: 'address',
+            width: 400,
+        },
+    ];
+
+    const data = [
+        {
+            key: 1,
+            name: 'John Brown sr.',
+            age: 60,
+            address: 'New York No. 1 Lake Park',
+            children: [
+                {
+                    key: 11,
+                    name: 'John Brown',
+                    age: 42,
+                    address: 'New York No. 2 Lake Park',
+                },
+                {
+                    key: 12,
+                    name: 'John Brown jr.',
+                    age: 30,
+                    address: 'New York No. 3 Lake Park',
+                    children: [
+                        {
+                            key: 121,
+                            name: 'Jimmy Brown',
+                            age: 16,
+                            address: 'New York No. 3 Lake Park',
+                        },
+                    ],
+                },
+                {
+                    key: 13,
+                    name: 'Jim Green sr.',
+                    age: 72,
+                    address: 'London No. 1 Lake Park',
+                    children: [
+                        {
+                            key: 131,
+                            name: 'Jim Green',
+                            age: 42,
+                            address: 'London No. 2 Lake Park',
+                            children: [
+                                {
+                                    key: 1311,
+                                    name: 'Jim Green jr.',
+                                    age: 25,
+                                    address: 'London No. 3 Lake Park',
+                                },
+                                {
+                                    key: 1312,
+                                    name: 'Jimmy Green sr.',
+                                    age: 18,
+                                    address: 'London No. 4 Lake Park',
+                                },
+                            ],
+                        },
+                    ],
+                },
+            ],
+        },
+        {
+            key: 2,
+            name: 'Joe Black',
+            age: 32,
+            address: 'Sidney No. 1 Lake Park',
+        }
+    ];
+
+    return (
+        <div>
+            <h4>hideExpandedColumn=false</h4>
+            <Table
+                hideExpandedColumn={false}
+                columns={columns}
+                defaultExpandAllRows
+                dataSource={data}
+            />
+            <h4>hideExpandedColumn=true</h4>
+            <Table
+                hideExpandedColumn={true}
+                columns={columns}
+                defaultExpandAllRows
+                dataSource={data}
+            />
+        </div>
+    );
+}

packages/semi-ui/table/_story/v2/index.js

@@ -16,4 +16,5 @@ export { default as EmptyFilters } from './emptyFilters';
 export { default as fixedResizableWithForm } from './fixedResizableWithForm';
 export { default as zebra } from './zebra';
 export { WordBreakNormalTable, WordBreakFixedTable } from './FeatWordBreak';
-export { EllipsisNormalTable, EllipsisFixedTable, ShowTitleTable } from './FeatEllipsis';
+export { EllipsisNormalTable, EllipsisFixedTable, ShowTitleTable } from './FeatEllipsis';
+export { default as Fixed1556 } from './Fixed1556';

packages/semi-ui/tooltip/_story/tooltip.stories.jsx

@@ -15,7 +15,9 @@ import {
   Popover,
   Input,
   RadioGroup,
-  SideSheet
+  SideSheet,
+  Dropdown,
+  Popconfirm
 } from '@douyinfe/semi-ui';
 
 import InTableDemo from './InTable';
@@ -1503,3 +1505,28 @@ Bottom2BottomLeftDemo.storyName = `✅ auto : bottom -> bottomLeft`;
 
 export const Bottom2BottomRightDemo = () => <Bottom2BottomRight />;
 Bottom2BottomRightDemo.storyName = `✅ auto : bottom -> bottomRight`;
+
+
+export const Fix1557 = () =>{
+   return (
+      <Dropdown
+          trigger='hover'
+          disableFocusListener
+          render={
+              <Dropdown.Menu>
+                  <Popconfirm
+                    content={
+                        <>
+                        <Select filter/>
+                        </>
+                    }
+                  >
+                      <Button>点我后再点击select, Dropdown 面板不收起</Button>
+                  </Popconfirm>
+              </Dropdown.Menu>
+          }
+      >
+          <Tag>Hover Me</Tag>
+      </Dropdown>
+  );
+}

packages/semi-ui/tooltip/index.tsx

@@ -571,6 +571,18 @@ export default class Tooltip extends BaseComponent<TooltipProps, TooltipState> {
         }
     }
 
+    handlePortalFocus = (e: React.FocusEvent<HTMLElement>) => {
+        if (this.props.stopPropagation) {
+            stopPropagation(e);
+        }
+    }
+
+    handlePortalBlur = (e: React.FocusEvent<HTMLElement>) => {
+        if (this.props.stopPropagation) {
+            stopPropagation(e);
+        }
+    }
+
     handlePortalInnerKeyDown = (e: React.KeyboardEvent) => {
         this.foundation.handleContainerKeydown(e);
     }
@@ -655,6 +667,8 @@ export default class Tooltip extends BaseComponent<TooltipProps, TooltipState> {
                     style={portalInnerStyle}
                     ref={this.setContainerEl}
                     onClick={this.handlePortalInnerClick}
+                    onFocus={this.handlePortalFocus}
+                    onBlur={this.handlePortalBlur}
                     onMouseDown={this.handlePortalMouseDown}
                     onKeyDown={this.handlePortalInnerKeyDown}
                 >

packages/semi-webpack/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-webpack-plugin",
-    "version": "2.33.0",
+    "version": "2.33.1",
     "description": "",
     "author": "伍浩威 <[email protected]>",
     "homepage": "",

yarn.lock

@@ -11143,11 +11143,6 @@ eslint-plugin-react@^7.20.6, eslint-plugin-react@^7.24.0:
     semver "^6.3.0"
     string.prototype.matchall "^4.0.6"
 
-eslint-plugin-semi-design@latest:
-  version "2.30.2"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-semi-design/-/eslint-plugin-semi-design-2.30.2.tgz#ee32382f1d3609a2af7560931ff22fecefc31b29"
-  integrity sha512-AN8fqqf2YLN42G840QY4qScyGb9/8zKpZKSU1FIc9hjahQ9dlTm5vVJpuYSoYzIhJO6taD6PM7uMBwUfH9mxug==
-
 eslint-rule-composer@^0.3.0:
   version "0.3.0"
   resolved "https://registry.npmjs.org/eslint-rule-composer/-/eslint-rule-composer-0.3.0.tgz"