@douyinfe/semi-foundation 2.28.0-beta.0 → 2.28.0

package/lib/es/cascader/util.d.ts

@@ -0,0 +1,5 @@
+export declare function isValid(val: any): boolean;
+export declare function normalizedArr(val: any): any[];
+export declare function convertDataToEntities(dataNodes: any): any;
+export declare function findKeysForValues(value: any, keyEntities: any): any[];
+export declare function calcMergeType(autoMergeValue: boolean, leafOnly: boolean): string;

package/lib/es/cascader/util.js

@@ -0,0 +1,90 @@
+import _isEqual from "lodash/isEqual";
+import _isUndefined from "lodash/isUndefined";
+import _isNull from "lodash/isNull";
+import { strings } from './constants';
+
+function getPosition(level, index) {
+  return `${level}-${index}`;
+}
+
+export function isValid(val) {
+  return !_isNull(val) && !_isUndefined(val);
+}
+export function normalizedArr(val) {
+  if (!Array.isArray(val)) {
+    return [val];
+  } else {
+    return val;
+  }
+}
+/**
+ * Traverse all the data by `treeData`.
+ */
+
+function traverseDataNodes(treeNodes, callback) {
+  const processNode = (node, ind, parent) => {
+    const children = node ? node.children : treeNodes;
+    let item = null; // Process node if is not root
+
+    if (node) {
+      const key = parent ? getPosition(parent.key, ind) : `${ind}`;
+      item = {
+        data: Object.assign({}, node),
+        ind,
+        key,
+        level: parent ? parent.level + 1 : 0,
+        parentKey: parent ? parent.key : null,
+        path: parent ? [...parent.path, key] : [key],
+        valuePath: parent ? [...parent.valuePath, node.value] : [node.value]
+      };
+      callback(item);
+    } // Process children node
+
+
+    if (children) {
+      children.forEach((subNode, subIndex) => {
+        processNode(subNode, subIndex, item);
+      });
+    }
+  };
+
+  processNode(null);
+}
+
+export function convertDataToEntities(dataNodes) {
+  const keyEntities = {};
+  traverseDataNodes(dataNodes, data => {
+    const {
+      key,
+      parentKey
+    } = data;
+    const entity = Object.assign({}, data);
+    keyEntities[key] = entity; // Fill children
+
+    entity.parent = keyEntities[parentKey];
+
+    if (entity.parent) {
+      entity.parent.children = entity.parent.children || [];
+      entity.parent.children.push(entity);
+    }
+  });
+  return keyEntities;
+}
+export function findKeysForValues(value, keyEntities) {
+  const valuePath = normalizedArr(value);
+  const res = Object.values(keyEntities).filter(item => _isEqual(item.valuePath, valuePath)).map(item => item.key);
+  return res;
+}
+export function calcMergeType(autoMergeValue, leafOnly) {
+  let mergeType;
+
+  if (leafOnly) {
+    mergeType = strings.LEAF_ONLY_MERGE_TYPE;
+  } else if (autoMergeValue) {
+    mergeType = strings.AUTO_MERGE_VALUE_MERGE_TYPE;
+  } else {
+    mergeType = strings.NONE_MERGE_TYPE;
+  }
+
+  return mergeType;
+}

package/lib/es/checkbox/checkboxFoundation.d.ts

@@ -0,0 +1,58 @@
+import BaseFoundation, { DefaultAdapter, noopFunction } from '../base/foundation';
+export interface BasicTargetObject {
+    [x: string]: any;
+    checked?: boolean;
+}
+export interface BasicCheckboxEvent {
+    target: BasicTargetObject;
+    stopPropagation: () => void;
+    preventDefault: () => void;
+    [x: string]: any;
+}
+export interface CheckboxAdapter<P = Record<string, any>, S = Record<string, any>> extends DefaultAdapter<P, S> {
+    getIsInGroup: () => boolean;
+    getGroupValue: () => any[];
+    notifyGroupChange: (e: any) => void;
+    getGroupDisabled: () => boolean;
+    setNativeControlChecked: (checked: boolean) => void;
+    getState: noopFunction;
+    notifyChange: (e: any) => void;
+    setAddonId: () => void;
+    setExtraId: () => void;
+    setFocusVisible: (focusVisible: boolean) => void;
+    focusCheckboxEntity: () => void;
+    generateEvent: (checked: boolean, e: any) => any;
+}
+declare class CheckboxFoundation<P = Record<string, any>, S = Record<string, any>> extends BaseFoundation<CheckboxAdapter<P, S>, P, S> {
+    constructor(adapter: CheckboxAdapter<P, S>);
+    clickState: boolean;
+    init(): void;
+    notifyChange(checked: boolean, e: any): void;
+    handleChange(e: any): void;
+    handleChangeInGroup(e: any): void;
+    handleEnterPress(e: any): void;
+    setChecked(checked: boolean): void;
+    handleFocusVisible: (event: any) => void;
+    handleBlur: () => void;
+    destroy(): void;
+}
+export interface BaseCheckboxProps {
+    id?: string;
+    autoFocus?: boolean;
+    checked?: boolean;
+    defaultChecked?: boolean;
+    disabled?: boolean;
+    indeterminate?: boolean;
+    onChange?: (e: any) => any;
+    value?: any;
+    style?: Record<string, any>;
+    className?: string;
+    prefixCls?: string;
+    onMouseEnter?: (e: any) => void;
+    onMouseLeave?: (e: any) => void;
+    extra?: any;
+    addonId?: string;
+    extraId?: string;
+    preventScroll?: boolean;
+}
+export default CheckboxFoundation;

package/lib/es/checkbox/checkboxFoundation.js

@@ -0,0 +1,127 @@
+import BaseFoundation from '../base/foundation';
+import isEnterPress from '../utils/isEnterPress';
+import warning from '../utils/warning';
+
+class CheckboxFoundation extends BaseFoundation {
+  constructor(adapter) {
+    super(Object.assign({}, adapter));
+    this.clickState = false;
+
+    this.handleFocusVisible = event => {
+      const {
+        target
+      } = event;
+
+      try {
+        if (this.clickState) {
+          this.clickState = false;
+          return;
+        }
+
+        if (target.matches(':focus-visible')) {
+          this._adapter.setFocusVisible(true);
+        }
+      } catch (error) {
+        warning(true, 'Warning: [Semi Checkbox] The current browser does not support the focus-visible');
+      }
+    };
+
+    this.handleBlur = () => {
+      this.clickState = false;
+
+      this._adapter.setFocusVisible(false);
+    };
+  }
+
+  init() {
+    const {
+      children,
+      extra,
+      extraId,
+      addonId
+    } = this.getProps();
+
+    if (children && !addonId) {
+      this._adapter.setAddonId();
+    }
+
+    if (extra && !extraId) {
+      this._adapter.setExtraId();
+    }
+  }
+
+  notifyChange(checked, e) {
+    const cbValue = this._adapter.generateEvent(checked, e);
+
+    this._adapter.notifyChange(cbValue);
+  }
+
+  handleChange(e) {
+    const disabled = this.getProp('disabled');
+
+    if (disabled) {
+      return;
+    }
+
+    if ((e === null || e === void 0 ? void 0 : e.type) === 'click') {
+      this.clickState = true;
+    }
+
+    this._adapter.focusCheckboxEntity();
+
+    const isInGroup = this._adapter.getIsInGroup();
+
+    if (isInGroup) {
+      const groupDisabled = this._adapter.getGroupDisabled();
+
+      if (!groupDisabled) {
+        this.handleChangeInGroup(e);
+      }
+
+      return;
+    }
+
+    const checked = this.getState('checked');
+    const newChecked = !checked;
+
+    if (this._isControlledComponent('checked')) {
+      this.notifyChange(newChecked, e);
+    } else {
+      this.setChecked(newChecked);
+      this.notifyChange(newChecked, e);
+    }
+  }
+
+  handleChangeInGroup(e) {
+    const {
+      value
+    } = this.getProps();
+
+    const groupValue = this._adapter.getGroupValue();
+
+    const checked = groupValue.includes(value);
+    const newChecked = !checked;
+
+    const event = this._adapter.generateEvent(newChecked, e);
+
+    this._adapter.notifyChange(event);
+
+    this._adapter.notifyGroupChange(event);
+  }
+
+  handleEnterPress(e) {
+    if (isEnterPress(e)) {
+      this.handleChange(e);
+    }
+  }
+
+  setChecked(checked) {
+    this._adapter.setNativeControlChecked(checked);
+  } // eslint-disable-next-line @typescript-eslint/no-empty-function
+
+
+  destroy() {}
+
+}
+
+export default CheckboxFoundation;

package/lib/es/checkbox/checkboxGroupFoundation.d.ts

@@ -0,0 +1,17 @@
+import BaseFoundation, { DefaultAdapter } from '../base/foundation';
+import { BasicCheckboxEvent } from './checkboxFoundation';
+export interface CheckboxGroupAdapter extends DefaultAdapter {
+    updateGroupValue: (value: any[]) => void;
+    notifyChange: (value: any[]) => void;
+}
+declare class CheckboxGroupFoundation extends BaseFoundation<CheckboxGroupAdapter> {
+    static get checkboxGroupDefaultAdapter(): {};
+    constructor(adapter: CheckboxGroupAdapter);
+    init(): void;
+    notifyChange(value: any[]): void;
+    handleChange(evt: BasicCheckboxEvent): void;
+    getFormatName(): any;
+    handlePropValueChange(newPropValue: any[]): void;
+    destroy(): void;
+}
+export default CheckboxGroupFoundation;

package/lib/es/checkbox/checkboxGroupFoundation.js

@@ -0,0 +1,83 @@
+import BaseFoundation from '../base/foundation';
+import warning from '../utils/warning';
+
+class CheckboxGroupFoundation extends BaseFoundation {
+  static get checkboxGroupDefaultAdapter() {
+    return {};
+  }
+
+  constructor(adapter) {
+    super(Object.assign(Object.assign({}, CheckboxGroupFoundation.checkboxGroupDefaultAdapter), adapter));
+  }
+
+  init() {
+    const {
+      defaultValue,
+      value
+    } = this.getProps();
+
+    if (typeof defaultValue !== 'undefined' && !Array.isArray(defaultValue)) {
+      warning(true, 'Warning: [Semi CheckboxGroup] defaultValue should be an Array');
+    }
+
+    if (typeof value !== 'undefined' && !Array.isArray(value)) {
+      warning(true, 'Warning: [Semi CheckboxGroup] value should be an Array');
+    }
+  }
+
+  notifyChange(value) {
+    this._adapter.notifyChange(value);
+  }
+
+  handleChange(evt) {
+    const prevValue = this.getState('value');
+    let newValue = [];
+
+    if (!Array.isArray(prevValue)) {
+      newValue = [prevValue];
+    }
+
+    if (evt.target.checked) {
+      newValue = [...prevValue, evt.target.value];
+    } else {
+      newValue = prevValue.filter((itm, idx) => itm !== evt.target.value);
+    }
+
+    const isControlledMode = ('value' in this.getProps());
+
+    if (isControlledMode) {
+      // Controlled mode only needs to notify
+      this.notifyChange(newValue);
+    } else {
+      // In uncontrolled mode, update the value in the state, and then notify
+      this._adapter.updateGroupValue(newValue);
+
+      this.notifyChange(newValue);
+    }
+  }
+
+  getFormatName() {
+    const propName = this.getProp('name');
+    const defaultName = 'default';
+    return propName || defaultName;
+  }
+
+  handlePropValueChange(newPropValue) {
+    if (Array.isArray(newPropValue)) {
+      this._adapter.updateGroupValue(newPropValue);
+    } else {
+      // to adjust reset in Form.CheckboxGroup
+      if (typeof newPropValue === 'undefined') {
+        this._adapter.updateGroupValue([]);
+      }
+
+      warning(true, 'Warning: [Semi CheckboxGroup] value should be an Array');
+    }
+  } // eslint-disable-next-line @typescript-eslint/no-empty-function
+
+
+  destroy() {}
+
+}
+
+export default CheckboxGroupFoundation;

package/lib/es/checkbox/constants.d.ts

@@ -0,0 +1,27 @@
+declare const checkboxClasses: {
+    PREFIX: string;
+    INNER: string;
+    TEXT: string;
+    INPUT: string;
+    CHECKED: string;
+    DISABLED: string;
+    BUTTON: string;
+    WRAPPER: string;
+};
+declare const checkboxGroupClasses: {
+    PREFIX: string;
+    INNER: string;
+    TEXT: string;
+    INPUT: string;
+    CHECKED: string;
+    DISABLED: string;
+};
+declare const strings: {
+    readonly DIRECTION_SET: readonly ["horizontal", "vertical"];
+    readonly TYPE_DEFAULT: "default";
+    readonly TYPE_CARD: "card";
+    readonly TYPE_PURECARD: "pureCard";
+    readonly DEFAULT_DIRECTION: "vertical";
+};
+declare const numbers: {};
+export { checkboxClasses, checkboxGroupClasses, strings, numbers };

package/lib/es/checkbox/constants.js

@@ -0,0 +1,28 @@
+import { BASE_CLASS_PREFIX } from '../base/constants';
+const checkboxClasses = {
+  PREFIX: `${BASE_CLASS_PREFIX}-checkbox`,
+  INNER: `${BASE_CLASS_PREFIX}-checkbox-inner`,
+  TEXT: `${BASE_CLASS_PREFIX}-checkbox-text`,
+  INPUT: `${BASE_CLASS_PREFIX}-checkbox-input`,
+  CHECKED: `${BASE_CLASS_PREFIX}-checkbox-checked`,
+  DISABLED: `${BASE_CLASS_PREFIX}-checkbox-disabled`,
+  BUTTON: `${BASE_CLASS_PREFIX}-checkbox-button`,
+  WRAPPER: ''
+};
+const checkboxGroupClasses = {
+  PREFIX: `${BASE_CLASS_PREFIX}-checkboxGroup`,
+  INNER: `${BASE_CLASS_PREFIX}-checkboxGroup-inner`,
+  TEXT: `${BASE_CLASS_PREFIX}-checkboxGroup-text`,
+  INPUT: `${BASE_CLASS_PREFIX}-checkboxGroup-input`,
+  CHECKED: `${BASE_CLASS_PREFIX}-checkboxGroup-checked`,
+  DISABLED: `${BASE_CLASS_PREFIX}-checkboxGroup-disabled`
+};
+const strings = {
+  DIRECTION_SET: ['horizontal', 'vertical'],
+  TYPE_DEFAULT: 'default',
+  TYPE_CARD: 'card',
+  TYPE_PURECARD: 'pureCard',
+  DEFAULT_DIRECTION: 'vertical'
+};
+const numbers = {};
+export { checkboxClasses, checkboxGroupClasses, strings, numbers };

package/lib/es/collapse/constants.d.ts

@@ -0,0 +1,7 @@
+declare const cssClasses: {
+    PREFIX: string;
+};
+declare const strings: {
+    iconPosition: string[];
+};
+export { cssClasses, strings };

package/lib/es/collapse/constants.js

@@ -0,0 +1,8 @@
+import { BASE_CLASS_PREFIX } from '../base/constants';
+const cssClasses = {
+  PREFIX: `${BASE_CLASS_PREFIX}-collapse`
+};
+const strings = {
+  iconPosition: ['left', 'right']
+};
+export { cssClasses, strings };

package/lib/es/collapse/foundation.d.ts

@@ -0,0 +1,27 @@
+import BaseFoundation, { DefaultAdapter } from '../base/foundation';
+export declare type ArgsType<T> = T extends (...args: infer A) => any ? A : never;
+export interface CollapseProps {
+    activeKey?: string | string[];
+    defaultActiveKey?: string | string[];
+    accordion?: boolean;
+    onChange?: (activeKey: CollapseProps['activeKey'], e: any) => void;
+    expandIcon?: any;
+    collapseIcon?: any;
+    style?: any;
+    className?: string;
+    keepDOM?: boolean;
+    motion?: boolean;
+    expandIconPosition?: 'left' | 'right';
+}
+export interface CollapseState {
+    activeSet: Set<string>;
+}
+export interface CollapseAdapter extends DefaultAdapter<CollapseProps, CollapseState> {
+    handleChange: (activeKey: CollapseProps['activeKey'], e: any) => void;
+    addActiveKey: (newSet: CollapseState['activeSet']) => void;
+}
+export default class CollapseFoundation extends BaseFoundation<CollapseAdapter> {
+    constructor(adapter: CollapseAdapter);
+    initActiveKey(): any;
+    handleChange(newKey: string, e: any): void;
+}

package/lib/es/collapse/foundation.js

@@ -0,0 +1,54 @@
+import BaseFoundation from '../base/foundation';
+export default class CollapseFoundation extends BaseFoundation {
+  constructor(adapter) {
+    super(Object.assign({}, adapter));
+  }
+
+  initActiveKey() {
+    const {
+      defaultActiveKey,
+      activeKey,
+      accordion
+    } = this.getProps();
+    let activeKeyList = activeKey ? activeKey : defaultActiveKey;
+
+    if (accordion) {
+      activeKeyList = Array.isArray(activeKeyList) ? activeKeyList[0] : activeKeyList;
+    }
+
+    if (activeKeyList && activeKeyList.length) {
+      activeKeyList = Array.isArray(activeKeyList) ? activeKeyList : [activeKeyList];
+      return activeKeyList;
+    }
+
+    return []; // this._adapter.initActiveSet(activeKeyList);
+  }
+
+  handleChange(newKey, e) {
+    const {
+      activeKey,
+      accordion
+    } = this.getProps();
+    const {
+      activeSet
+    } = this.getStates();
+    let newSet = new Set(activeSet);
+
+    if (newSet.has(newKey)) {
+      newSet.delete(newKey);
+    } else {
+      if (accordion) {
+        newSet = new Set([newKey]);
+      } else {
+        newSet.add(newKey);
+      }
+    }
+
+    this._adapter.handleChange([...newSet.values()], e);
+
+    if (typeof activeKey === 'undefined') {
+      this._adapter.addActiveKey(newSet);
+    }
+  }
+
+}

package/lib/es/collapsible/constants.d.ts

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

package/lib/es/collapsible/constants.js

@@ -0,0 +1,5 @@
+import { BASE_CLASS_PREFIX } from '../base/constants';
+const cssClasses = {
+  PREFIX: `${BASE_CLASS_PREFIX}-collapsible`
+};
+export { cssClasses };

package/lib/es/collapsible/foundation.d.ts

@@ -0,0 +1,31 @@
+import BaseFoundation, { DefaultAdapter } from "../base/foundation";
+export interface CollapsibleFoundationProps {
+    isOpen?: boolean;
+    duration?: number;
+    keepDOM?: boolean;
+    className?: string;
+    collapseHeight?: number;
+    reCalcKey?: number | string;
+    id?: string;
+    fade?: boolean;
+}
+export interface CollapsibleFoundationState {
+    domInRenderTree: boolean;
+    domHeight: number;
+    visible: boolean;
+    isTransitioning: boolean;
+}
+export interface CollapsibleAdapter<P = Record<string, any>, S = Record<string, any>> extends DefaultAdapter<P, S> {
+    setDOMInRenderTree: (isInRenderTree: boolean) => void;
+    setDOMHeight: (domHeight: number) => void;
+    setVisible: (visible: boolean) => void;
+    setIsTransitioning: (isTransitioning: boolean) => void;
+}
+declare class CollapsibleFoundation extends BaseFoundation<CollapsibleAdapter<CollapsibleFoundationProps, CollapsibleFoundationState>, CollapsibleFoundationProps, CollapsibleFoundationState> {
+    constructor(adapter: CollapsibleAdapter<CollapsibleFoundationProps, CollapsibleFoundationState>);
+    updateDOMInRenderTree: (isInRenderTree: any) => void;
+    updateDOMHeight: (domHeight: number) => void;
+    updateVisible: (visible: boolean) => void;
+    updateIsTransitioning: (isTransitioning: boolean) => void;
+}
+export default CollapsibleFoundation;

package/lib/es/collapsible/foundation.js

@@ -0,0 +1,26 @@
+import BaseFoundation from "../base/foundation";
+
+class CollapsibleFoundation extends BaseFoundation {
+  constructor(adapter) {
+    super(Object.assign({}, adapter));
+
+    this.updateDOMInRenderTree = isInRenderTree => {
+      this._adapter.setDOMInRenderTree(isInRenderTree);
+    };
+
+    this.updateDOMHeight = domHeight => {
+      this._adapter.setDOMHeight(domHeight);
+    };
+
+    this.updateVisible = visible => {
+      this._adapter.setVisible(visible);
+    };
+
+    this.updateIsTransitioning = isTransitioning => {
+      this._adapter.setIsTransitioning(isTransitioning);
+    };
+  }
+
+}
+
+export default CollapsibleFoundation;

package/lib/es/datePicker/_utils/formatter.d.ts

@@ -0,0 +1,14 @@
+import { BaseValueType } from '../foundation';
+/**
+ * Formats the displayed date text
+ * @param {string[]|Date[]} values
+ * @param {string} formatToken
+ * @param {Object} groupOptions
+ * @param {Object} locale
+ * @returns {string}
+ */
+export declare function formatDateValues(values: BaseValueType[], formatToken: string, { groupInnerSeparator, groupSize, groupSeparator, }: {
+    groupInnerSeparator?: string;
+    groupSize?: number;
+    groupSeparator?: string;
+}, locale: any): string;

package/lib/es/datePicker/_utils/formatter.js

@@ -0,0 +1,54 @@
+/**
+ * @file
+ * Date-related formatting display method
+ */
+import { format } from 'date-fns';
+import { strings } from '../constants';
+/**
+ * Formats the displayed date text
+ * @param {string[]|Date[]} values
+ * @param {string} formatToken
+ * @param {Object} groupOptions
+ * @param {Object} locale
+ * @returns {string}
+ */
+
+export function formatDateValues(values, formatToken) {
+  let {
+    groupInnerSeparator = strings.DEFAULT_SEPARATOR_RANGE,
+    groupSize = 1,
+    groupSeparator = strings.DEFAULT_SEPARATOR_MULTIPLE
+  } = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+  let locale = arguments.length > 3 ? arguments[3] : undefined;
+  let text = '';
+  (groupSize <= 0 || typeof groupSize !== 'number') && (groupSize = 1); // console.log(values, formatToken, groupInnerSeparator, groupSize, groupSeparator);
+
+  if (Array.isArray(values) && values.length) {
+    const groups = [];
+    const {
+      length
+    } = values; // chunk
+
+    for (let i = 0; i < length; i++) {
+      if (i % groupSize === 0) {
+        groups.push([]);
+      }
+
+      const curArrIdx = Math.floor(i / groupSize);
+      groups[curArrIdx].push(values[i]);
+    }
+
+    text = groups.map(arr => arr.map(v => {
+      if (v) {
+        // console.log(`formatDateValues() -> formatDateValues: ${v}`);
+        return format(v, formatToken, {
+          locale
+        });
+      } else {
+        return '';
+      }
+    }).join(groupInnerSeparator)).join(groupSeparator);
+  }
+
+  return text;
+}