@douyinfe/semi-foundation 2.1.0-next.0 → 2.1.0

package/lib/cjs/sideSheet/sideSheet.css

@@ -1,143 +0,0 @@
-/* shadow */
-/* sizing */
-/* spacing */
-.semi-sidesheet {
-  font-size: 14px;
-  line-height: 20px;
-  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
-  position: fixed;
-  margin: 0;
-  top: 0;
-  left: 0;
-  height: 100%;
-}
-.semi-sidesheet-inner:focus, .semi-sidesheet-content:focus {
-  outline: none;
-}
-.semi-sidesheet-inner-wrap {
-  position: absolute;
-}
-.semi-sidesheet-left, .semi-sidesheet-right {
-  top: 0;
-  width: 0%;
-  height: 100%;
-}
-.semi-sidesheet-left .semi-sidesheet-inner-wrap, .semi-sidesheet-right .semi-sidesheet-inner-wrap {
-  height: 100%;
-}
-.semi-sidesheet-left.semi-sidesheet, .semi-sidesheet-right.semi-sidesheet {
-  width: 100%;
-}
-.semi-sidesheet-right {
-  right: 0;
-}
-.semi-sidesheet-right .semi-sidesheet-inner-wrap {
-  right: 0;
-}
-.semi-sidesheet-top, .semi-sidesheet-bottom {
-  left: 0;
-  width: 100%;
-  height: 0%;
-}
-.semi-sidesheet-top .semi-sidesheet-inner-wrap, .semi-sidesheet-bottom .semi-sidesheet-inner-wrap {
-  width: 100%;
-}
-.semi-sidesheet-top.semi-sidesheet, .semi-sidesheet-bottom.semi-sidesheet {
-  height: 100%;
-}
-.semi-sidesheet-top {
-  top: 0;
-}
-.semi-sidesheet-bottom {
-  bottom: 0;
-}
-.semi-sidesheet-bottom .semi-sidesheet-inner-wrap {
-  bottom: 0;
-}
-.semi-sidesheet-title {
-  flex: 1 0 auto;
-  margin: 0;
-  font-size: 18px;
-  line-height: 24px;
-  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
-  font-weight: 600;
-  color: var(--semi-color-text-0);
-  text-align: left;
-}
-.semi-sidesheet-inner {
-  z-index: 1;
-  overflow: auto;
-  background-color: var(--semi-color-bg-2);
-  border: 0;
-}
-.semi-sidesheet-header {
-  display: flex;
-  align-items: flex-start;
-  padding: 24px;
-  padding-bottom: 20px;
-}
-.semi-sidesheet-body {
-  padding: 0 24px;
-  flex: 1;
-}
-.semi-sidesheet-content {
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  box-sizing: border-box;
-  overflow: hidden;
-}
-.semi-sidesheet-mask {
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  background-color: var(--semi-overlay-bg);
-}
-.semi-sidesheet-mask-hidden {
-  display: none;
-}
-.semi-sidesheet-footer {
-  padding: 24px;
-}
-
-.semi-sidesheet-fixed .semi-sidesheet-inner {
-  box-shadow: var(--semi-shadow-elevated);
-}
-.semi-sidesheet-fixed.semi-sidesheet-left {
-  left: 0;
-}
-.semi-sidesheet-fixed.semi-sidesheet-left .semi-sidesheet-inner {
-  left: 0;
-}
-.semi-sidesheet-fixed.semi-sidesheet-right {
-  left: auto;
-}
-.semi-sidesheet-fixed.semi-sidesheet-right .semi-sidesheet-inner {
-  right: 0;
-}
-.semi-sidesheet-fixed.semi-sidesheet-top, .semi-sidesheet-fixed.semi-sidesheet-bottom {
-  height: auto;
-}
-.semi-sidesheet-fixed.semi-sidesheet-bottom {
-  top: auto;
-}
-.semi-sidesheet-fixed.semi-sidesheet-bottom .semi-sidesheet-inner {
-  bottom: 0;
-}
-
-.semi-sidesheet.semi-sidesheet-popup {
-  position: absolute;
-}
-
-.semi-sidesheet-hidden {
-  display: none;
-}
-
-.semi-sidesheet-rtl .semi-sidesheet-inner {
-  direction: rtl;
-}
-.semi-sidesheet-rtl .semi-sidesheet-title {
-  text-align: right;
-}

package/lib/cjs/sideSheet/sideSheet.scss

@@ -1,171 +0,0 @@
-@import "./variables.scss";
-
-$module: #{$prefix}-sidesheet;
-
-.#{$module} {
-    @include font-size-regular;
-    position: fixed;
-    margin: $spacing-sideSheet-margin;
-    top: 0;
-    left: 0;
-    height: 100%;
-
-    &-inner:focus,
-    &-content:focus {
-        outline: none;
-    }
-
-    &-inner-wrap {
-        position: absolute;
-    }
-
-    &-left,
-    &-right {
-        top: 0;
-        width: 0%;
-        height: 100%;
-
-        .#{$module}-inner-wrap {
-            height: 100%;
-        }
-
-        &.#{$module} {
-            width: 100%;
-        }
-    }
-
-    &-right {
-        right: 0;
-
-        .#{$module}-inner-wrap {
-            right: 0;
-        }
-    }
-
-    &-top,
-    &-bottom {
-        left: 0;
-        width: 100%;
-        height: 0%;
-
-        .#{$module}-inner-wrap {
-            width: 100%;
-        }
-
-        &.#{$module} {
-            height: 100%;
-        }
-    }
-
-    &-top {
-        top: 0;
-    }
-
-    &-bottom {
-        bottom: 0;
-
-        .#{$module}-inner-wrap {
-            bottom: 0;
-        }
-    }
-
-    &-title {
-        flex: 1 0 auto;
-        margin: $spacing-sideSheet_title-margin;
-        @include font-size-header-5;
-        font-weight: $font-sideSheet_title-fontWeight;
-        color: $color-sideSheet_main-text;
-        text-align: left;
-    }
-
-    &-inner {
-        // position: relative;
-        z-index: 1;
-        overflow: auto;
-        background-color: $color-sideSheet-bg;
-        // background-clip: padding-box;
-        border: 0;
-    }
-
-    &-header {
-        display: flex;
-        align-items: flex-start;
-        padding: $spacing-sideSheet_header-padding;
-        padding-bottom: $spacing-sideSheet_header-paddingBottom;
-    }
-
-    &-body {
-        padding: $spacing-sideSheet_body-paddingY $spacing-sideSheet_body-paddingX;
-        flex: 1;
-    }
-
-    &-content {
-        height: 100%;
-        display: flex;
-        flex-direction: column;
-        box-sizing: border-box;
-        overflow: hidden;
-        // padding: 0 $spacing-loose;
-    }
-
-    &-mask {
-        position: absolute;
-        top: 0;
-        left: 0;
-        width: 100%;
-        height: 100%;
-        background-color: $color-sideSheet_mask-bg;
-
-        &-hidden {
-            display: none;
-        }
-    }
-
-    &-footer {
-        padding: $spacing-sideSheet_footer-padding;
-    }
-}
-
-.#{$module}-fixed {
-    .#{$module}-inner {
-        box-shadow: var(--semi-shadow-elevated);
-    }
-
-    &.#{$module}-left {
-        left: 0;
-        // width will inject by js
-        .#{$module}-inner {
-            left: 0;
-        }
-    }
-
-    &.#{$module}-right {
-        left: auto;
-        // width will inject by js
-        .#{$module}-inner {
-            right: 0;
-        }
-    }
-
-    &.#{$module}-top,
-    &.#{$module}-bottom {
-        height: auto;
-    }
-
-    &.#{$module}-bottom {
-        top: auto;
-
-        .#{$module}-inner {
-            bottom: 0;
-        }
-    }
-}
-
-.#{$module}.#{$module}-popup {
-    position: absolute;
-}
-.#{$module}-hidden {
-    display: none;
-}
-
-@import "./rtl.scss";

package/lib/cjs/sideSheet/sideSheetFoundation.d.ts

@@ -1,55 +0,0 @@
-import BaseFoundation, { DefaultAdapter } from '../base/foundation';
-import { Motion } from '../utils/type';
-export interface SideSheetProps {
-    afterVisibleChange?: (isVisible: boolean) => void;
-    bodyStyle?: Record<string, any>;
-    className?: string;
-    closable?: boolean;
-    closeOnEsc?: boolean;
-    disableScroll?: boolean;
-    footer?: any;
-    getPopupContainer?: () => HTMLElement;
-    headerStyle?: Record<string, any>;
-    height?: number | string;
-    keepDOM?: boolean;
-    mask?: boolean;
-    maskClosable?: boolean;
-    maskStyle?: Record<string, any>;
-    motion?: Motion;
-    onCancel?: (e: any) => void;
-    placement?: 'top' | 'bottom' | 'left' | 'right';
-    size?: 'small' | 'medium' | 'large';
-    style?: Record<string, any>;
-    title?: any;
-    visible?: boolean;
-    width?: number | string;
-    zIndex?: number;
-    children?: any;
-}
-export interface SideSheetState {
-    hidden: boolean;
-}
-export interface SideSheetAdapter extends DefaultAdapter<SideSheetProps, SideSheetState> {
-    disabledBodyScroll: () => void;
-    enabledBodyScroll: () => void;
-    notifyCancel: (e: any) => void;
-    notifyVisibleChange: (visible: boolean) => void;
-    setOnKeyDownListener: () => void;
-    removeKeyDownListener: () => void;
-    toggleHidden: (hidden: boolean) => void;
-}
-export default class SideSheetFoundation extends BaseFoundation<SideSheetAdapter> {
-    constructor(adapter: SideSheetAdapter);
-    get defaultAdapter(): {
-        handleCancel: (...args: any[]) => void;
-        beforeShow: (...args: any[]) => void;
-        afterHide: (...args: any[]) => void;
-    };
-    destroy(): void;
-    handleCancel(e: any): void;
-    beforeShow(): void;
-    afterHide(): void;
-    handleKeyDown(e: any): void;
-    mergeMotionProp: (motion: any, prop: string, cb: () => void) => any;
-    getMergedMotion: () => any;
-}

package/lib/cjs/sideSheet/sideSheetFoundation.js

@@ -1,124 +0,0 @@
-"use strict";
-
-var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
-var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-
-_Object$defineProperty(exports, "__esModule", {
-  value: true
-});
-
-exports.default = void 0;
-
-var _assign = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/assign"));
-
-var _bind = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/bind"));
-
-var _foundation = _interopRequireDefault(require("../base/foundation"));
-
-var _lodashEs = require("lodash-es");
-
-var _keyCode = _interopRequireDefault(require("../utils/keyCode"));
-
-class SideSheetFoundation extends _foundation.default {
-  constructor(adapter) {
-    var _this;
-
-    super((0, _assign.default)((0, _assign.default)({}, SideSheetFoundation.defaultAdapter), adapter));
-    _this = this;
-
-    this.mergeMotionProp = (motion, prop, cb) => {
-      const mergedMotion = typeof motion === 'undefined' || motion ? (0, _assign.default)((0, _assign.default)({}, motion), {
-        [prop]: function () {
-          const curr = (0, _lodashEs.get)(motion, prop);
-
-          if (typeof curr === 'function') {
-            curr(...arguments);
-          }
-
-          cb();
-        }
-      }) : false;
-      return mergedMotion;
-    };
-
-    this.getMergedMotion = () => {
-      const {
-        motion,
-        visible,
-        keepDOM
-      } = this.getProps();
-      let mergedMotion = this.mergeMotionProp(motion, 'didEnter', function () {
-        const didEnter = (0, _lodashEs.get)(motion, 'didEnter');
-
-        if (typeof didEnter === 'function') {
-          didEnter(...arguments);
-        }
-
-        _this._adapter.notifyVisibleChange(visible);
-      });
-      mergedMotion = this.mergeMotionProp(mergedMotion, 'didLeave', function () {
-        const didLeave = (0, _lodashEs.get)(motion, 'didLeave');
-
-        if (typeof didLeave === 'function') {
-          didLeave(...arguments);
-        }
-
-        _this._adapter.notifyVisibleChange(visible);
-      });
-
-      if (keepDOM) {
-        var _context;
-
-        mergedMotion = this.mergeMotionProp(mergedMotion, 'didLeave', (0, _bind.default)(_context = this._adapter.toggleHidden).call(_context, this, true));
-      }
-
-      return mergedMotion;
-    };
-  }
-
-  get defaultAdapter() {
-    return {
-      handleCancel: _lodashEs.noop,
-      beforeShow: _lodashEs.noop,
-      afterHide: _lodashEs.noop
-    };
-  }
-
-  destroy() {
-    this.afterHide();
-  }
-
-  handleCancel(e) {
-    this._adapter.notifyCancel(e);
-  }
-
-  beforeShow() {
-    const allowDisable = this.getProp('disableScroll');
-    allowDisable && this._adapter.disabledBodyScroll();
-
-    this._adapter.setOnKeyDownListener();
-  }
-
-  afterHide() {
-    const allowDisable = this.getProp('disableScroll');
-    allowDisable && this._adapter.enabledBodyScroll();
-
-    this._adapter.removeKeyDownListener();
-  }
-
-  handleKeyDown(e) {
-    const {
-      closeOnEsc
-    } = this.getProps();
-
-    if (closeOnEsc && e.keyCode === _keyCode.default.ESC) {
-      e.stopPropagation();
-      this.handleCancel(e);
-      return;
-    }
-  }
-
-}
-
-exports.default = SideSheetFoundation;

package/lib/cjs/sideSheet/variables.scss

@@ -1,16 +0,0 @@
-// Color
-$color-sideSheet_mask-bg: var(--semi-overlay-bg); // 侧边栏打开后蒙层颜色
-$color-sideSheet-bg: var(--semi-color-bg-2); // 侧边栏背景颜色
-$color-sideSheet_main-text: var(--semi-color-text-0); // 侧边栏默认文本颜色
-
-// Spacing
-$spacing-sideSheet-margin: 0; // 侧边栏整体外边距
-$spacing-sideSheet_title-margin: 0; // 侧边栏标题外边距
-$spacing-sideSheet_header-padding: $spacing-loose; // 侧边栏 header 内边距
-$spacing-sideSheet_header-paddingBottom: $spacing-base-loose; // 侧边栏 header 底部内边距
-$spacing-sideSheet_body-paddingY: 0; // 侧边栏 body 垂直内边距
-$spacing-sideSheet_body-paddingX: $spacing-loose; // 侧边栏 body 水平内边距
-$spacing-sideSheet_footer-padding: $spacing-loose; // 侧边栏 footer 内边距
-
-// Font
-$font-sideSheet_title-fontWeight: $font-weight-bold; // 侧边栏标题文本字重

package/lib/cjs/skeleton/constants.d.ts

@@ -1,5 +0,0 @@
-declare const cssClasses: {
-    PREFIX: string;
-};
-declare const strings: {};
-export { cssClasses, strings };

package/lib/cjs/skeleton/constants.js

@@ -1,18 +0,0 @@
-"use strict";
-
-var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-
-_Object$defineProperty(exports, "__esModule", {
-  value: true
-});
-
-exports.strings = exports.cssClasses = void 0;
-
-var _constants = require("../base/constants");
-
-const cssClasses = {
-  PREFIX: "".concat(_constants.BASE_CLASS_PREFIX, "-skeleton")
-};
-exports.cssClasses = cssClasses;
-const strings = {};
-exports.strings = strings;

package/lib/cjs/skeleton/rtl.scss

@@ -1,8 +0,0 @@
-$module: #{$prefix}-skeleton;
-
-.#{$prefix}-rtl,
-.#{$prefix}-portal-rtl {
-    .#{$module} {
-        direction: rtl;
-    }
-}

package/lib/cjs/skeleton/skeleton.css

@@ -1,87 +0,0 @@
-/* shadow */
-/* sizing */
-/* spacing */
-.semi-skeleton-avatar, .semi-skeleton-image, .semi-skeleton-title, .semi-skeleton-button {
-  background: var(--semi-color-fill-0);
-  border-radius: 4px;
-}
-.semi-skeleton-avatar {
-  border-radius: 50%;
-}
-.semi-skeleton-avatar-extra-extra-small {
-  width: 20px;
-  height: 20px;
-}
-.semi-skeleton-avatar-extra-small {
-  width: 24px;
-  height: 24px;
-}
-.semi-skeleton-avatar-medium {
-  width: 48px;
-  height: 48px;
-}
-.semi-skeleton-avatar-small {
-  width: 32px;
-  height: 32px;
-}
-.semi-skeleton-avatar-large {
-  width: 72px;
-  height: 72px;
-}
-.semi-skeleton-avatar-extra-large {
-  width: 128px;
-  height: 128px;
-}
-.semi-skeleton-paragraph {
-  margin: 0;
-  padding: 0;
-  list-style-type: none;
-}
-.semi-skeleton-paragraph li {
-  background: var(--semi-color-fill-0);
-  border-radius: 4px;
-  width: 100%;
-  height: 16px;
-  margin-bottom: 10px;
-}
-.semi-skeleton-paragraph li:last-child {
-  width: 60%;
-  margin-bottom: 0;
-}
-.semi-skeleton-paragraph li:first-child {
-  width: 100%;
-}
-.semi-skeleton-title {
-  width: 100%;
-  height: 24px;
-}
-.semi-skeleton-button {
-  width: 115px;
-  height: 32px;
-}
-.semi-skeleton-image {
-  width: 100%;
-  height: 100%;
-}
-.semi-skeleton-active .semi-skeleton-avatar,
-.semi-skeleton-active .semi-skeleton-image,
-.semi-skeleton-active .semi-skeleton-title,
-.semi-skeleton-active .semi-skeleton-button,
-.semi-skeleton-active .semi-skeleton-paragraph li {
-  background: linear-gradient(90deg, var(--semi-color-fill-0) 25%, var(--semi-color-fill-1) 44%, var(--semi-color-fill-0) 88%);
-  background-size: 400% 100%;
-  animation: skeleton-loading 1.4s ease infinite;
-}
-@keyframes skeleton-loading {
-  0% {
-    background-position: 100% 50%;
-  }
-  100% {
-    background-position: 0 50%;
-  }
-}
-
-.semi-rtl .semi-skeleton,
-.semi-portal-rtl .semi-skeleton {
-  direction: rtl;
-}