@kdcloudjs/kdesign 1.7.48-usePopper.1 → 1.7.48

package/es/popper/style/index.css

@@ -1,356 +0,0 @@
-/* -----------  color  ——————---- start */
-/* -----------  color  ——————---- end */
-/* -----------  motion  ——————---- start */
-/* -----------  motion  ——————---- end */
-/* -----------  transition  ——————---- start */
-/* -----------  transition  ——————---- end */
-/* -----------  font  ——————---- start */
-/* -----------  font  ——————---- end */
-/* -----------  zIndex  ——————---- start */
-/*
-    普通组件内部自身层级应设置在0-100间
-*/
-/* -----------  zIndex  ——————---- end */
-/* -----------  Button  ——————---- start */
-/* -----------  Button  ——————---- end */
-/* -----------  Collapse  ——————---- start */
-/* -----------  Collapse  ——————---- end */
-/* -----------  Card  ——————---- start */
-/* -----------  Card  ——————---- end */
-/* -----------  Carousel  ——————---- start */
-/* -----------  Carousel  ——————---- end */
-/* -----------  Cascader  ——————---- start */
-/* -----------  Cascader  ——————---- end */
-/* -----------  Switch  ——————---- start */
-/* -----------  Switch  ——————---- end */
-/* -----------  Input  ——————---- start */
-/* -----------  Input  ——————---- end */
-/* -----------  InputNumber  ——————---- start */
-/* -----------  InputNumber  ——————---- end */
-/* -----------  checkbox  ——————---- start */
-/* -----------  checkbox  ——————---- start */
-/* -----------  checkbox  ——————---- end */
-/* -----------  Radio  ——————---- start */
-/* -----------  Radio  ——————---- end */
-/* -----------  icon  ——————---- start */
-/* -----------  icon  ——————---- end */
-/* -----------  Popconfirm  ——————---- start */
-/* -----------  Popconfirm  ——————---- end */
-/* -----------  Progress  ——————---- start */
-/* -----------  Progress  ——————---- end */
-/* -----------  Pagination  ——————---- start */
-/* -----------  Pagination  ——————---- end */
-/* -----------  Timeline  ——————---- start */
-/* -----------  Timeline  ——————---- end */
-/* -----------  Tabs  ——————---- start */
-/* -----------  Tabs  ——————---- end */
-/* -----------  Select  ——————---- start */
-/* -----------  Select  ——————---- end */
-/* -----------  Rate  ——————---- start */
-/* -----------  Rate  ——————---- end */
-/* -----------  Dropdown  ——————---- start */
-/* -----------  Dropdown  ——————---- end */
-/* -----------  Tooltip  ——————---- start */
-/* -----------  Tooltip  ——————---- end */
-/* -----------  Transfer  ——————---- start */
-/* -----------  Transfer  ——————---- end */
-/* -----------  DatePicker  ——————---- start */
-/* -----------  DatePicker  ——————---- end */
-/* -----------  ColorPicker  ——————---- start */
-/* -----------  ColorPicker  ——————---- end */
-/* -----------  Tree  ——————---- start */
-/* -----------  Tree  ——————---- end */
-/* -----------  Alert  ——————---- start */
-/* -----------  Alert  ——————---- end */
-/* -----------  Split-Panel ——————---- start */
-/* -----------  Split-Panel ——————---- end */
-/* -----------  Modal  ——————---- start */
-/* -----------  Modal  ——————---- end */
-/* -----------  Steps  ——————---- start */
-/* -----------  Steps  ——————---- end */
-/* -----------  Form  ——————---- start */
-/* -----------  Form  ——————---- end */
-/* -----------  Tag ——————---- start */
-/* -----------  Tag ——————---- end */
-/* -----------  Menu  ——————---- start */
-/* -----------  Menu  ——————---- end */
-/* -----------  notice  ——————---- start */
-/* -----------  message  ——————---- end */
-/* -----------  Spin  ——————---- start */
-/* -----------  Spin  ——————---- end */
-/* -----------  Spin  ——————---- start */
-/* -----------  Spin  ——————---- end */
-/* -----------  Layout  ——————---- start */
-/* -----------  Layout  ——————---- end */
-/* -----------  Typography  ——————---- start */
-/* -----------  Typography  ——————---- start */
-/* -----------  Search  ——————---- start */
-/* -----------  Search  ——————---- start */
-/* -----------  Badge  ——————---- start */
-/* -----------  Badge  ——————---- end */
-/* -----------  Anchor  ——————---- start */
-/* -----------  Anchor  ——————---- end */
-/* -----------  Avatar  ——————---- start */
-/* -----------  Avatar  ——————---- end */
-/* -----------  AdvancedSelector  ——————---- start */
-/* -----------  AdvancedSelector  ——————---- end */
-/* -----------  motion  ——————---- start */
-/* -----------  motion  ——————---- end */
-/* -----------  transition  ——————---- start */
-/* -----------  transition  ——————---- end */
-/* -----------  zIndex  ——————---- start */
-/*
-    普通组件内部自身层级应设置在0-100间
-*/
-/* -----------  zIndex  ——————---- end */
-/* 多行显示省略号 */
-/* 单行显示省略号 */
-/** 浮层箭头样式 **/
-.kd-popper {
-  opacity: 1;
-  z-index: var(--kd-g-z-index-popper, 1050);
-  visibility: visible;
-}
-.kd-popper.hidden {
-  opacity: 0;
-  visibility: hidden;
-  -webkit-transition: all calc(0.3s - 0.1s);
-  transition: all calc(0.3s - 0.1s);
-  pointer-events: none;
-}
-.kd-popper-content .arrow {
-  visibility: hidden;
-}
-.kd-popper-content .arrow::before {
-  visibility: visible;
-  position: absolute;
-  border-style: solid;
-  border-width: var(--arrowSize);
-  content: '';
-  -webkit-transform: rotate(45deg);
-          transform: rotate(45deg);
-}
-.kd-popper[data-popper-placement^='top'] .arrow {
-  bottom: var(--arrowSize);
-}
-.kd-popper[data-popper-placement^='top'] .arrow::before {
-  left: calc(-1 * var(--arrowSize));
-  border-top-color: transparent;
-  border-left-color: transparent;
-}
-.kd-popper[data-popper-placement^='bottom'] .arrow {
-  top: calc(-1 * var(--arrowSize));
-}
-.kd-popper[data-popper-placement^='bottom'] .arrow::before {
-  left: calc(-1 * var(--arrowSize));
-  border-bottom-color: transparent;
-  border-right-color: transparent;
-}
-.kd-popper[data-popper-placement^='left'] .arrow {
-  right: var(--arrowSize);
-}
-.kd-popper[data-popper-placement^='left'] .arrow::before {
-  top: calc(-1 * var(--arrowSize));
-  border-left-color: transparent;
-  border-bottom-color: transparent;
-}
-.kd-popper[data-popper-placement^='right'] .arrow {
-  left: calc(-1 * var(--arrowSize));
-}
-.kd-popper[data-popper-placement^='right'] .arrow::before {
-  top: calc(-1 * var(--arrowSize));
-  border-top-color: transparent;
-  border-right-color: transparent;
-}
-.kd-popper-top {
-  -webkit-animation-duration: calc(0.3s - 0.1s);
-          animation-duration: calc(0.3s - 0.1s);
-}
-.kd-popper-top-in {
-  -webkit-animation-name: kdZoomBottomIn;
-          animation-name: kdZoomBottomIn;
-  -webkit-animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-          animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-}
-.kd-popper-top-out {
-  -webkit-animation-name: kdZoomBottomOut;
-          animation-name: kdZoomBottomOut;
-  -webkit-animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-          animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-}
-.kd-popper-left {
-  -webkit-animation-duration: calc(0.3s - 0.1s);
-          animation-duration: calc(0.3s - 0.1s);
-}
-.kd-popper-left-in {
-  -webkit-animation-name: kdZoomRightIn;
-          animation-name: kdZoomRightIn;
-  -webkit-animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-          animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-}
-.kd-popper-left-out {
-  -webkit-animation-name: kdZoomRightOut;
-          animation-name: kdZoomRightOut;
-  -webkit-animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-          animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-}
-.kd-popper-right {
-  -webkit-animation-duration: calc(0.3s - 0.1s);
-          animation-duration: calc(0.3s - 0.1s);
-}
-.kd-popper-right-in {
-  -webkit-animation-name: kdZoomLeftIn;
-          animation-name: kdZoomLeftIn;
-  -webkit-animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-          animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-}
-.kd-popper-right-out {
-  -webkit-animation-name: kdZoomLeftOut;
-          animation-name: kdZoomLeftOut;
-  -webkit-animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-          animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-}
-.kd-popper-bottom {
-  -webkit-animation-duration: calc(0.3s - 0.1s);
-          animation-duration: calc(0.3s - 0.1s);
-}
-.kd-popper-bottom-in {
-  -webkit-animation-name: kdZoomTopIn;
-          animation-name: kdZoomTopIn;
-  -webkit-animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-          animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-}
-.kd-popper-bottom-out {
-  -webkit-animation-name: kdZoomTopOut;
-          animation-name: kdZoomTopOut;
-  -webkit-animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-          animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-}
-.kd-popper-top-start {
-  -webkit-animation-duration: calc(0.3s - 0.1s);
-          animation-duration: calc(0.3s - 0.1s);
-}
-.kd-popper-top-start-in {
-  -webkit-animation-name: kdZoomLeftBottomIn;
-          animation-name: kdZoomLeftBottomIn;
-  -webkit-animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-          animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-}
-.kd-popper-top-start-out {
-  -webkit-animation-name: kdZoomLeftBottomOut;
-          animation-name: kdZoomLeftBottomOut;
-  -webkit-animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-          animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-}
-.kd-popper-rightBottom {
-  -webkit-animation-duration: calc(0.3s - 0.1s);
-          animation-duration: calc(0.3s - 0.1s);
-}
-.kd-popper-rightBottom-in {
-  -webkit-animation-name: kdZoomLeftBottomIn;
-          animation-name: kdZoomLeftBottomIn;
-  -webkit-animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-          animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-}
-.kd-popper-rightBottom-out {
-  -webkit-animation-name: kdZoomLeftBottomOut;
-          animation-name: kdZoomLeftBottomOut;
-  -webkit-animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-          animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-}
-.kd-popper-top-end {
-  -webkit-animation-duration: calc(0.3s - 0.1s);
-          animation-duration: calc(0.3s - 0.1s);
-}
-.kd-popper-top-end-in {
-  -webkit-animation-name: kdZoomRightBottomIn;
-          animation-name: kdZoomRightBottomIn;
-  -webkit-animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-          animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-}
-.kd-popper-top-end-out {
-  -webkit-animation-name: kdZoomRightBottomOut;
-          animation-name: kdZoomRightBottomOut;
-  -webkit-animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-          animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-}
-.kd-popper-left-end {
-  -webkit-animation-duration: calc(0.3s - 0.1s);
-          animation-duration: calc(0.3s - 0.1s);
-}
-.kd-popper-left-end-in {
-  -webkit-animation-name: kdZoomRightBottomIn;
-          animation-name: kdZoomRightBottomIn;
-  -webkit-animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-          animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-}
-.kd-popper-left-end-out {
-  -webkit-animation-name: kdZoomRightBottomOut;
-          animation-name: kdZoomRightBottomOut;
-  -webkit-animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-          animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-}
-.kd-popper-left-start {
-  -webkit-animation-duration: calc(0.3s - 0.1s);
-          animation-duration: calc(0.3s - 0.1s);
-}
-.kd-popper-left-start-in {
-  -webkit-animation-name: kdZoomTopRightIn;
-          animation-name: kdZoomTopRightIn;
-  -webkit-animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-          animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-}
-.kd-popper-left-start-out {
-  -webkit-animation-name: kdZoomTopRightOut;
-          animation-name: kdZoomTopRightOut;
-  -webkit-animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-          animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-}
-.kd-popper-bottom-end {
-  -webkit-animation-duration: calc(0.3s - 0.1s);
-          animation-duration: calc(0.3s - 0.1s);
-}
-.kd-popper-bottom-end-in {
-  -webkit-animation-name: kdZoomTopRightIn;
-          animation-name: kdZoomTopRightIn;
-  -webkit-animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-          animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-}
-.kd-popper-bottom-end-out {
-  -webkit-animation-name: kdZoomTopRightOut;
-          animation-name: kdZoomTopRightOut;
-  -webkit-animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-          animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-}
-.kd-popper-right-start {
-  -webkit-animation-duration: calc(0.3s - 0.1s);
-          animation-duration: calc(0.3s - 0.1s);
-}
-.kd-popper-right-start-in {
-  -webkit-animation-name: kdZoomTopLeftIn;
-          animation-name: kdZoomTopLeftIn;
-  -webkit-animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-          animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-}
-.kd-popper-right-start-out {
-  -webkit-animation-name: kdZoomTopLeftOut;
-          animation-name: kdZoomTopLeftOut;
-  -webkit-animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-          animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-}
-.kd-popper-bottom-start {
-  -webkit-animation-duration: calc(0.3s - 0.1s);
-          animation-duration: calc(0.3s - 0.1s);
-}
-.kd-popper-bottom-start-in {
-  -webkit-animation-name: kdZoomTopLeftIn;
-          animation-name: kdZoomTopLeftIn;
-  -webkit-animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-          animation-timing-function: cubic-bezier(0, 0.4, 0.4, 1);
-}
-.kd-popper-bottom-start-out {
-  -webkit-animation-name: kdZoomTopLeftOut;
-          animation-name: kdZoomTopLeftOut;
-  -webkit-animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-          animation-timing-function: cubic-bezier(0.4, 0, 1, 0.6);
-}

package/es/popper/style/index.d.ts

@@ -1,2 +0,0 @@
-import '../../style/index.less';
-import './index.less';

package/es/popper/style/index.js

@@ -1,2 +0,0 @@
-import '../../style/index.less';
-import './index.less';

package/es/popper/style/index.less

@@ -1,103 +0,0 @@
-@import '../../style/themes/index';
-@import '../../style/mixins/index';
-// @import './token.less';
-
-@popper-prefix-cls: ~'@{kd-prefix}-popper';
-
-.@{popper-prefix-cls} {
-  opacity: 1;
-  z-index: @z-index-popper;
-  visibility: visible;
-
-  &.hidden {
-    opacity: 0;
-    visibility: hidden;
-    transition: all calc(@transition-duration - 0.1s);
-    pointer-events: none;
-  }
-
-  &-content {
-    .arrow {
-      visibility: hidden;
-
-      &::before {
-        visibility: visible;
-        position: absolute;
-        border-style: solid;
-        border-width: var(--arrowSize);
-        content: '';
-        transform: rotate(45deg);
-      }
-    }
-  }
-
-  &[data-popper-placement^='top'] .arrow {
-    bottom: var(--arrowSize);
-
-    &::before {
-      left: calc(-1 * var(--arrowSize));
-      border-top-color: transparent;
-      border-left-color: transparent;
-    }
-  }
-
-  &[data-popper-placement^='bottom'] .arrow {
-    top: calc(-1 * var(--arrowSize));
-
-    &::before {
-      left: calc(-1 * var(--arrowSize));
-      border-bottom-color: transparent;
-      border-right-color: transparent;
-    }
-  }
-
-  &[data-popper-placement^='left'] .arrow {
-    right: var(--arrowSize);
-
-    &::before {
-      top: calc(-1 * var(--arrowSize));
-      border-left-color: transparent;
-      border-bottom-color: transparent;
-    }
-  }
-
-  &[data-popper-placement^='right'] .arrow {
-    left: calc(-1 * var(--arrowSize));
-
-    &::before {
-      top: calc(-1 * var(--arrowSize));
-      border-top-color: transparent;
-      border-right-color: transparent;
-    }
-  }
-}
-
-.popper-motion(@className, @keyframeName, @duration: calc(@transition-duration - 0.1s)) {
-  .@{className} {
-    animation-duration: @duration;
-
-    &-in {
-      animation-name: ~'@{keyframeName}In';
-      animation-timing-function: @ease-out;
-    }
-
-    &-out {
-      animation-name: ~'@{keyframeName}Out';
-      animation-timing-function: @ease-in;
-    }
-  }
-}
-
-.popper-motion(~'@{popper-prefix-cls}-top', kdZoomBottom);
-.popper-motion(~'@{popper-prefix-cls}-left', kdZoomRight);
-.popper-motion(~'@{popper-prefix-cls}-right', kdZoomLeft);
-.popper-motion(~'@{popper-prefix-cls}-bottom', kdZoomTop);
-.popper-motion(~'@{popper-prefix-cls}-top-start', kdZoomLeftBottom);
-.popper-motion(~'@{popper-prefix-cls}-rightBottom', kdZoomLeftBottom);
-.popper-motion(~'@{popper-prefix-cls}-top-end', kdZoomRightBottom);
-.popper-motion(~'@{popper-prefix-cls}-left-end', kdZoomRightBottom);
-.popper-motion(~'@{popper-prefix-cls}-left-start', kdZoomTopRight);
-.popper-motion(~'@{popper-prefix-cls}-bottom-end', kdZoomTopRight);
-.popper-motion(~'@{popper-prefix-cls}-right-start', kdZoomTopLeft);
-.popper-motion(~'@{popper-prefix-cls}-bottom-start', kdZoomTopLeft);
-

package/lib/popper/index.d.ts

@@ -1,51 +0,0 @@
-import React from 'react';
-export declare const Placements: ["top", "left", "right", "bottom", "topLeft", "topRight", "bottomLeft", "bottomRight", "leftTop", "leftBottom", "rightTop", "rightBottom"];
-export declare type PlacementType = typeof Placements[number];
-export declare const Triggers: ["hover", "focus", "click", "contextMenu"];
-export declare type TriggerType = typeof Triggers[number];
-export declare type RenderFunction = () => React.ReactNode;
-export interface PopperProps {
-    gap?: number;
-    arrow?: boolean;
-    visible?: boolean;
-    prefixCls?: string;
-    arrowSize?: number;
-    disabled?: boolean;
-    arrowOffset?: number;
-    scrollHidden?: boolean;
-    mouseEnterDelay?: number;
-    mouseLeaveDelay?: number;
-    defaultVisible?: boolean;
-    autoPlacement?: boolean;
-    className?: string;
-    style?: React.CSSProperties;
-    popperClassName?: string;
-    popperStyle?: React.CSSProperties;
-    placement?: PlacementType;
-    tip?: any;
-    trigger?: TriggerType | Array<TriggerType>;
-    clickToClose?: boolean;
-    onTrigger?: (trigger: TriggerType) => void;
-    onVisibleChange?: (visible: boolean) => void;
-    getTriggerElement?: (locatorNode: HTMLElement) => HTMLElement;
-    getPopupContainer?: (locatorNode: HTMLElement) => HTMLElement;
-    onTransitionEnd?: (e: React.TransitionEvent) => void;
-    onAnimationEnd?: (e: React.AnimationEvent) => void;
-    children?: React.ReactNode;
-}
-export declare const popperPlacementMap: {
-    top: string;
-    left: string;
-    right: string;
-    bottom: string;
-    topLeft: string;
-    topRight: string;
-    bottomLeft: string;
-    bottomRight: string;
-    leftTop: string;
-    leftBottom: string;
-    rightTop: string;
-    rightBottom: string;
-};
-export declare const Popper: React.ForwardRefExoticComponent<PopperProps & React.RefAttributes<unknown>>;
-export default Popper;