@douyinfe/semi-foundation 2.36.0-alpha.0 → 2.36.0

package/lib/es/utils/touchPolyfill.js

@@ -1,5 +1,4 @@
 import warning from './warning';
-
 const touchEventPolyfill = (touch, touchEvent) => {
   /* Touch is the first point of multi-touch. In order to minimize the change of slider code to support touch,
   some methods that will be used on touchEvent are mounted on the multi-touch Touch object.*/
@@ -7,11 +6,9 @@ const touchEventPolyfill = (touch, touchEvent) => {
   if (!globalThis.Touch || !(touch instanceof Touch)) {
     return touch;
   }
-
   const keysNeedPolyfill = ['stopPropagation', 'preventDefault'];
   keysNeedPolyfill.forEach(key => {
     let value = touchEvent[key];
-
     if (value) {
       if (typeof value === 'function') {
         // bind 'this' for function of touchEvent running in Touch Point Object
@@ -19,7 +16,6 @@ const touchEventPolyfill = (touch, touchEvent) => {
           return touchEvent[key](...arguments);
         };
       }
-
       if (touch[key]) {
         warning(true, `"The key ${key}" exist in Touch.`);
       } else {
@@ -29,5 +25,4 @@ const touchEventPolyfill = (touch, touchEvent) => {
   });
   return touch;
 };
-
 export default touchEventPolyfill;

package/lib/es/utils/type.d.ts

@@ -1,6 +1,6 @@
-export declare type ArrayElement<ArrayType extends readonly unknown[]> = ArrayType extends readonly (infer ElementType)[] ? ElementType : never;
-export declare type Motion<P extends Record<string, any> = any> = boolean | MotionObject | MotionFunction<P>;
-export declare type MotionFunction<P> = (props: P) => MotionObject;
+export type ArrayElement<ArrayType extends readonly unknown[]> = ArrayType extends readonly (infer ElementType)[] ? ElementType : never;
+export type Motion<P extends Record<string, any> = any> = boolean | MotionObject | MotionFunction<P>;
+export type MotionFunction<P> = (props: P) => MotionObject;
 export interface MotionObject {
     [x: string]: any;
     children?: any | ((props: MotionChildrenProps) => any);

package/lib/es/utils/uuid.js

@@ -1,10 +1,9 @@
 export default function getUuid(prefix) {
   return `${prefix}-${new Date().getTime()}-${Math.random()}`;
-} // https://stackoverflow.com/questions/105034/create-guid-uuid-in-javascript
-
+}
+// https://stackoverflow.com/questions/105034/create-guid-uuid-in-javascript
 function getUuidv4() {
   var _a, _b;
-
   try {
     // @ts-ignore
     return (_b = (_a = crypto === null || crypto === void 0 ? void 0 : crypto.randomUUID) === null || _a === void 0 ? void 0 : _a.call(crypto)) !== null && _b !== void 0 ? _b : String(1e7 + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, c => (Number(c) ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> Number(c) / 4).toString(16));
@@ -22,8 +21,6 @@ function getUuidv4() {
  * getUuidShort({ prefix: '' }) => '0eer2i0'
  * getUuidShort({ prefix: 'semi', length: 4 }) => 'semi-8jts'
  */
-
-
 function getUuidShort() {
   let options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   const {
@@ -33,13 +30,10 @@ function getUuidShort() {
   const characters = '0123456789abcdefghijklmnopqrstuvwxyz';
   const total = characters.length;
   let randomId = '';
-
   for (let i = 0; i < length; i++) {
     const random = Math.floor(Math.random() * total);
     randomId += characters.charAt(random);
   }
-
   return prefix ? `${prefix}-${randomId}` : randomId;
 }
-
 export { getUuid, getUuidv4, getUuidShort };

package/navigation/itemFoundation.ts

@@ -39,9 +39,7 @@ export interface ItemAdapter<P = Record<string, any>, S = Record<string, any>> e
     notifyMouseLeave(e: any): void;
     getIsCollapsed(): boolean;
     getSelected(): boolean;
-    getIsOpen(): boolean;
-    getIsInSubNav(): boolean;
-    getMode(): string
+    getIsOpen(): boolean
 }
 
 export default class ItemFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<ItemAdapter<P, S>, P, S> {

package/navigation/navigation.scss

@@ -76,7 +76,7 @@ $module: #{$prefix}-navigation;
         padding: $spacing-navigation_item-paddingY $spacing-navigation_item-paddingX;
         box-sizing: border-box;
         margin-top: 0;
-        // margin-bottom: $spacing-navigation_item-marginBottom;
+        margin-bottom: $spacing-navigation_item-marginBottom;
 
         @include font-size-regular;
         font-weight: $font-navigation_item_normal-fontWeight;
@@ -257,13 +257,6 @@ $module: #{$prefix}-navigation;
         text-overflow: ellipsis;
         white-space: nowrap;
         overflow: hidden;
-        display: flex;
-        flex-direction: column;
-        row-gap: $spacing-navigation_item-marginBottom;
-
-        &.#{$module}-sub-open {
-            margin-top: $spacing-navigation_sub_item_first_child-marginTop;
-        }
 
         .#{$module}-item {
             color: $color-navigation_itemLn-text-default;
@@ -275,9 +268,9 @@ $module: #{$prefix}-navigation;
             font-weight: $font-navigation_sub_item-fontWeight;
             width: 100%;
 
-            // &:first-child {
-            //     margin-top: $spacing-navigation_sub_item_first_child-marginTop;
-            // }
+            &:first-child {
+                margin-top: $spacing-navigation_sub_item_first_child-marginTop;
+            }
 
             & > &-text:first-child {
                 margin-left: $spacing-base-tight + $width-navigation_icon_left + $width-navigation_icon_text_between;
@@ -350,12 +343,6 @@ $module: #{$prefix}-navigation;
         transform: rotate(-180deg);
     }
 
-    &-icon-rotate-0-no-transition {
-        transform: rotate(0);
-    }
-    &-icon-rotate-180-no-transition {
-        transform: rotate(-180deg);
-    }
 }
 
 /* Header、Footer-Common */
@@ -443,12 +430,6 @@ $module: #{$prefix}-navigation;
             }
         }
 
-        &-list {
-            display: flex;
-            flex-direction: column;
-            row-gap: $spacing-navigation_item-marginBottom;
-        }
-
         &-list > .#{$module}-sub-wrap {
             & > .#{$module}-sub-title {
                 color: $color-navigation_itemL1-text-default;
@@ -502,9 +483,9 @@ $module: #{$prefix}-navigation;
         }
     }
 
-    // .#{$module}-item:last-of-type {
-    //     margin-bottom: $spacing-navigation_vertical_nav_item_last-marginBottom;
-    // }
+    .#{$module}-item:last-of-type {
+        margin-bottom: $spacing-navigation_vertical_nav_item_last-marginBottom;
+    }
 
     .#{$module}-inner {
         flex-direction: column;
@@ -733,97 +714,4 @@ $module: #{$prefix}-navigation;
     }
 }
 
-// The following css is used for the variant generation of NavItem and NavSub in C2D
-.#{$module}-first-layer {
-    > .#{$module}-sub-title {
-        .#{$module}-item-text {
-            font-weight: 600;
-        }
-    }
-
-    > .#{$module}-item-text {
-        font-weight: 600;
-    }
-}
-
-.#{$module}-sub-title-selected {
-    .#{$module}-item-icon:first-child {
-        color: $color-navigation_itemL1_selected_icon-default;
-    }
-}
-
-.#{$module}-sub-wrap {
-    .#{$module}-sub-title {
-        margin-bottom: $spacing-navigation_sub_title-marginBottom;
-    }
-
-    .#{$module}-item:last-of-type {
-        margin-bottom: $spacing-navigation_vertical_nav_item_last-marginBottom;
-    } 
-}
-
-.#{$module}-sub-title {
-    &.#{$module}-sub-title-disabled {
-        .semi-navigation-item-text {
-            color: $color-navigation_itemL1_disabled-text-default;
-        }
-    }
-}
-
-.#{$module}-item-horizontal {
-    // The width of nav NavItem and NavSub in the horizontal direction both need fit-content
-    &.#{$module}-item { 
-        width: fit-content;
-        margin-bottom: $spacing-navigation_horizontal_nav_list_item-marginBottom;
-        margin-right: $spacing-navigation_horizontal_nav_list_item_not_last-marginRight;
-
-        &.#{$module}-item-disabled {
-            color: $color-navigation_horizontal_itemL1_disabled-text-default;
-        }
-    }
-
-    .#{$module}-sub-title {
-        .#{$module}-item-icon:first-child,
-        .#{$module}-item-text {
-            color: var(--semi-color-text-2);
-            background-color: transparent;
-        }
-
-        &.#{$module}-sub-title-selected {
-            .#{$module}-item-icon:first-child,
-            .#{$module}-item-text {
-                color: $color-navigation_horizontal_itemL1_selected-text-default;
-            }
-        }
-
-        &.#{$module}-sub-title-disabled {
-            .#{$module}-item-icon:first-child,
-            .#{$module}-item-text {
-                color: $color-navigation_horizontal_itemL1_disabled-text-default;
-            }
-        }
-    }
-
-    &.#{$module}-first-layer {
-        color: $color-navigation_horizontal_itemL1-text-default;
-    }
-
-    &.#{$module}-item-selected {
-        background-color: $color-navigation_horizontal_itemL1_selected-bg-default;
-
-        .#{$module}-item-icon:first-child,
-        .#{$module}-item-text {
-            color: $color-navigation_horizontal_itemL1_selected-text-default;
-        }
-    }
-
-    .semi-navigation-item-icon:first-child {
-        margin-right: $spacing-navigation_horizontal_icon_last-marginLeft;
-    }
-
-    .semi-navigation-item-icon:last-child {
-        margin-left: $spacing-navigation_horizontal_icon_first-marginRight;
-    }
-}
-
 @import "./rtl.scss";

package/navigation/subNavFoundation.ts

@@ -37,9 +37,7 @@ export interface SubNavAdapter<P = Record<string, any>, S = Record<string, any>>
     notifyGlobalOnSelect(data: OnSelectData): void;
     notifyGlobalOnClick(data: OnClickData): void;
     getIsSelected(itemKey: string | number): boolean;
-    getIsOpen(): boolean;
-    getIsCollapsed(): boolean;
-    getMode(): string
+    getIsOpen(): boolean
 }
 
 export default class SubNavFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<SubNavAdapter<P, S>, P, S> {

package/overflowList/foundation.ts

@@ -8,7 +8,7 @@ export interface OverflowListAdapter extends DefaultAdapter {
     updateStates: (state: any) => void;
     updateVisibleState: (visible: Map<string, boolean>) => void;
     notifyIntersect: (res: any) => void;
-    getItemSizeMap: ()=>Map<string, number>
+    getItemSizeMap: () => Map<string, number>
 }
 
 class OverflowListFoundation extends BaseFoundation<OverflowListAdapter> {
@@ -46,7 +46,7 @@ class OverflowListFoundation extends BaseFoundation<OverflowListAdapter> {
 
         const res = {};
         entries.forEach(entry => {
-            const itemKey = get(entry, 'target.dataset.scrollkey');
+            const itemKey: string = get(entry, 'target.dataset.scrollkey');
             const visible = entry.isIntersecting;
             res[itemKey] = entry;
             visibleState.set(itemKey, visible);
@@ -77,7 +77,7 @@ class OverflowListFoundation extends BaseFoundation<OverflowListAdapter> {
         const { items } = this.getProps();
         return cloneDeep(items).reverse();
     }
-    handleCollapseOverflow(){
+    handleCollapseOverflow() {
         const { minVisibleItems, collapseFrom } = this.getProps();
         const { overflowWidth, containerWidth, pivot: statePivot, overflowStatus } = this.getStates();
         const { items, onOverflow } = this.getProps();
@@ -114,7 +114,7 @@ class OverflowListFoundation extends BaseFoundation<OverflowListAdapter> {
                 overflow,
             });
             // trigger onOverflow
-            if (statePivot !== pivot){
+            if (statePivot !== pivot) {
                 onOverflow(overflow);
             }
             return;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@douyinfe/semi-foundation",
-    "version": "2.36.0-alpha.0",
+    "version": "2.36.0",
     "description": "",
     "scripts": {
         "build:lib": "node ./scripts/compileLib.js",
@@ -23,7 +23,7 @@
         "*.scss",
         "*.css"
     ],
-    "gitHead": "b0ea78a81e9ba459f9f5a06c831235a5d5e9d3a0",
+    "gitHead": "597a4a6279411ed623d2072f1bcde3f2f3983985",
     "devDependencies": {
         "@babel/plugin-transform-runtime": "^7.15.8",
         "@babel/preset-env": "^7.15.8",