@oceanbase/design 0.1.0

package/lib/Ranger/locale/zh-CN.js

@@ -0,0 +1,29 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/Ranger/locale/zh-CN.ts
+var zh_CN_exports = {};
+__export(zh_CN_exports, {
+  default: () => zh_CN_default
+});
+module.exports = __toCommonJS(zh_CN_exports);
+var zh_CN_default = {
+  customize: "自定义时间"
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {});

package/lib/Ranger/locale/zh-TW.d.ts

@@ -0,0 +1,4 @@
+declare const _default: {
+    customize: string;
+};
+export default _default;

package/lib/Ranger/locale/zh-TW.js

@@ -0,0 +1,29 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/Ranger/locale/zh-TW.ts
+var zh_TW_exports = {};
+__export(zh_TW_exports, {
+  default: () => zh_TW_default
+});
+module.exports = __toCommonJS(zh_TW_exports);
+var zh_TW_default = {
+  customize: "自定義時間"
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {});

package/lib/Ranger/typing.d.ts

@@ -0,0 +1,12 @@
+import type { Moment } from 'moment';
+import type { Dayjs } from 'dayjs';
+export interface RangeOption {
+    /**
+     * @description 选项名称
+     */
+    name: string;
+    /**
+     * @description 时间范围
+     */
+    range?: (current: Moment | Dayjs) => [Moment | Dayjs, Moment | Dayjs];
+}

package/lib/Ranger/typing.js

@@ -0,0 +1,17 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/Ranger/typing.ts
+var typing_exports = {};
+module.exports = __toCommonJS(typing_exports);

package/lib/SideTip/Dragger.d.ts

@@ -0,0 +1,45 @@
+import React from 'react';
+import type { Position } from './index';
+interface DraggableProps {
+    onOverlap?: () => void;
+    onDragStart?: () => void;
+    onDragEnd?: () => void;
+    onDrag?: (offset: any) => void;
+    onClick?: (e: any) => void;
+    onMouseEnter?: (e: any) => void;
+    onMouseLeave?: (e: any) => void;
+    hide?: boolean;
+    open?: boolean;
+    style?: React.CSSProperties;
+    position?: Position;
+    className?: string;
+    prefix?: string;
+    id?: string;
+    getPopupContainer?: () => HTMLElement;
+    children?: any;
+}
+interface DraggableState {
+    dragged?: boolean;
+    width?: number;
+    bottom?: number;
+    right?: number;
+}
+declare class Draggable extends React.Component<DraggableProps, DraggableState> {
+    nodeRef: React.RefObject<HTMLDivElement>;
+    intervalStart: number;
+    deltaX: number;
+    deltaY: number;
+    defaultScrollBarSize: number;
+    constructor(props: any);
+    overlapDetection: () => void;
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    getContainerDom: () => HTMLElement;
+    componentDidUpdate(preProps: any): void;
+    handleResize: () => void;
+    handleMouseDown: (e: any) => void;
+    handleMouseMove: (e: any) => void;
+    handleMouseUp: (e: any) => void;
+    render(): React.JSX.Element;
+}
+export default Draggable;

package/lib/SideTip/Dragger.js

@@ -0,0 +1,261 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/SideTip/Dragger.tsx
+var Dragger_exports = {};
+__export(Dragger_exports, {
+  default: () => Dragger_default
+});
+module.exports = __toCommonJS(Dragger_exports);
+var import_react = __toESM(require("react"));
+var import_utils = require("./utils");
+var import_classnames = __toESM(require("classnames"));
+var INIT_RIGHT = 32;
+var INIT_BOTTOM = 32;
+var Draggable = class extends import_react.default.Component {
+  constructor(props) {
+    super(props);
+    this.overlapDetection = () => {
+      const node = this.nodeRef.current;
+      const { left, top, right, bottom, width, height } = node.getBoundingClientRect();
+      const aroundElems = [
+        document.elementFromPoint(left, top),
+        document.elementFromPoint(right, bottom),
+        document.elementFromPoint(left + width / 2, top + height / 2)
+      ];
+      for (const elem of aroundElems) {
+        if (elem !== node && (0, import_utils.isFixedElem)(elem)) {
+          if (this.props.onOverlap) {
+            this.props.onOverlap();
+          }
+          break;
+        }
+      }
+    };
+    this.getContainerDom = () => {
+      const { getPopupContainer } = this.props;
+      const dom = getPopupContainer ? getPopupContainer() : void 0;
+      return dom;
+    };
+    this.handleResize = () => {
+      const dom = this.getContainerDom();
+      this.defaultScrollBarSize = (0, import_utils.getScrollBarSize)();
+      const node = this.nodeRef.current;
+      const clientRect = node.getBoundingClientRect();
+      const { width, height } = clientRect;
+      const { right: styleRight, bottom: styleBottom } = window.getComputedStyle(node);
+      let right = Number(styleRight.replace("px", ""));
+      let bottom = Number(styleBottom.replace("px", ""));
+      const clientWidth = (0, import_utils.getClientWidth)(dom);
+      const clientHeight = (0, import_utils.getClientHeight)(dom);
+      const deltaX = clientWidth - right - width;
+      const deltaY = clientHeight - bottom - height;
+      if (deltaX < 0) {
+        right += deltaX;
+      }
+      if (deltaY < 0) {
+        bottom += deltaY;
+      }
+      this.setState({
+        bottom,
+        right
+      });
+    };
+    this.handleMouseDown = (e) => {
+      if (e.button !== 0) {
+        return;
+      }
+      const dom = this.getContainerDom();
+      this.intervalStart = new Date().getTime();
+      const scroll = (0, import_utils.getScrollOffsets)(dom);
+      const node = this.nodeRef.current;
+      const startX = e.clientX + scroll.x;
+      const startY = e.clientY + scroll.y;
+      const origX = node.offsetLeft;
+      const origY = node.offsetTop;
+      this.deltaX = startX - origX;
+      this.deltaY = startY - origY;
+      if (this.props.onDragStart) {
+        this.props.onDragStart();
+      }
+      this.setState({
+        dragged: true
+      });
+      if (e.stopPropagation)
+        e.stopPropagation();
+      else
+        e.cancelBubble = true;
+      if (e.preventDefault)
+        e.preventDefault();
+      else
+        e.returnValue = false;
+    };
+    this.handleMouseMove = (e) => {
+      const { dragged } = this.state;
+      const { hide } = this.props;
+      if (e.button !== 0 || !dragged || !!hide) {
+        return;
+      }
+      const { clientX, clientY } = e;
+      const { deltaX, deltaY } = this;
+      const node = this.nodeRef.current;
+      const dom = this.getContainerDom();
+      const scroll = (0, import_utils.getScrollOffsets)(dom);
+      const clientWidth = (0, import_utils.getClientWidth)(dom);
+      const clientHeight = (0, import_utils.getClientHeight)(dom);
+      const { width, height } = node.getBoundingClientRect();
+      const left = clientX + scroll.x - deltaX;
+      const top = clientY + scroll.y - deltaY;
+      let right = clientWidth - left - width;
+      let bottom = clientHeight - top - height;
+      if (right > clientWidth - width) {
+        right = clientWidth - width;
+      }
+      if (bottom > clientHeight - height) {
+        bottom = clientHeight - height;
+      }
+      if (right < 0) {
+        right = 0;
+      }
+      if (bottom < 0) {
+        bottom = 0;
+      }
+      this.setState(
+        {
+          dragged: true,
+          right: right - this.defaultScrollBarSize,
+          bottom
+        },
+        () => {
+          if (this.props.onDrag) {
+            this.props.onDrag({
+              right,
+              bottom
+            });
+          }
+        }
+      );
+    };
+    this.handleMouseUp = (e) => {
+      const { dragged } = this.state;
+      if (dragged) {
+        const interval = new Date().getTime() - this.intervalStart;
+        if (interval < 200 && e.target.id !== "ui-mini-hide") {
+          this.props.onClick(e);
+          this.setState({
+            dragged: false
+          });
+          return;
+        }
+        this.setState(
+          {
+            dragged: false
+          },
+          () => {
+            if (this.props.onDragEnd) {
+              this.props.onDragEnd();
+            }
+          }
+        );
+      }
+    };
+    const { position = {} } = props;
+    this.intervalStart = 0;
+    this.nodeRef = import_react.default.createRef();
+    this.deltaX = 0;
+    this.deltaY = 0;
+    this.defaultScrollBarSize = (0, import_utils.getScrollBarSize)();
+    this.state = {
+      dragged: false,
+      width: 0,
+      bottom: position.bottom ? position.bottom : INIT_BOTTOM,
+      right: position.right ? position.right : INIT_RIGHT
+    };
+  }
+  componentDidMount() {
+    window.addEventListener("resize", this.handleResize, false);
+    window.addEventListener("mousemove", this.handleMouseMove, false);
+    window.addEventListener("mouseup", this.handleMouseUp, false);
+    window.addEventListener("load", this.overlapDetection, false);
+    const { width } = this.nodeRef.current.getBoundingClientRect();
+    this.setState({
+      width
+    });
+  }
+  componentWillUnmount() {
+    window.removeEventListener("load", this.overlapDetection, false);
+    window.removeEventListener("mousemove", this.handleMouseMove, false);
+    window.removeEventListener("mouseup", this.handleMouseUp, false);
+    window.removeEventListener("resize", this.handleResize, false);
+  }
+  componentDidUpdate(preProps) {
+    const { hide: preHide } = preProps;
+    const { hide } = this.props;
+    if (preHide && !hide) {
+      this.setState({
+        right: INIT_RIGHT
+      });
+    }
+  }
+  render() {
+    const {
+      children,
+      hide,
+      style = {},
+      prefix,
+      className,
+      id,
+      onMouseEnter,
+      onMouseLeave
+    } = this.props;
+    const { dragged, width, bottom, right } = this.state;
+    const containerStyle = { bottom, right, ...style };
+    const containerPrefix = `${prefix}-container`;
+    const containerClassName = (0, import_classnames.default)(containerPrefix, className, {
+      [`${containerPrefix}-dragged`]: dragged,
+      [`${containerPrefix}-hide`]: hide,
+      [`${containerPrefix}-hide-not-dragged`]: hide && !dragged
+    });
+    return /* @__PURE__ */ import_react.default.createElement(
+      "div",
+      {
+        id,
+        ref: this.nodeRef,
+        onMouseDown: this.handleMouseDown,
+        onMouseEnter,
+        onMouseLeave,
+        style: hide ? { ...containerStyle, right: -width / 1.5 } : containerStyle,
+        className: containerClassName
+      },
+      children
+    );
+  }
+};
+var Dragger_default = Draggable;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {});

package/lib/SideTip/IconLoading.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const iconLoading: (props: any) => React.JSX.Element;
+export default iconLoading;

package/lib/SideTip/IconLoading.js

@@ -0,0 +1,78 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/SideTip/IconLoading.tsx
+var IconLoading_exports = {};
+__export(IconLoading_exports, {
+  default: () => IconLoading_default
+});
+module.exports = __toCommonJS(IconLoading_exports);
+var import_react = __toESM(require("react"));
+var import_icons = __toESM(require("@ant-design/icons"));
+var LoadingSvg = () => /* @__PURE__ */ import_react.default.createElement(
+  "svg",
+  {
+    version: "1.1",
+    id: "dc-spinner",
+    xmlns: "http://www.w3.org/2000/svg",
+    x: "0px",
+    y: "0px",
+    width: "1em",
+    height: "1em",
+    stroke: "currentColor",
+    viewBox: "3 3 34 34",
+    preserveAspectRatio: "xMinYMin meet"
+  },
+  /* @__PURE__ */ import_react.default.createElement(
+    "path",
+    {
+      strokeWidth: "1",
+      strokeMiterlimit: "10",
+      d: "M5.203,20\n			c0-8.159,6.638-14.797,14.797-14.797V5C11.729,5,5,11.729,5,20s6.729,15,15,15v-0.203C11.841,34.797,5.203,28.159,5.203,20z",
+      transform: "rotate(278.217 20 20)"
+    },
+    /* @__PURE__ */ import_react.default.createElement(
+      "animateTransform",
+      {
+        attributeName: "transform",
+        type: "rotate",
+        from: "0 20 20",
+        to: "360 20 20",
+        calcMode: "spline",
+        keySplines: "0.2, 0.2, 0.2, 0.2",
+        keyTimes: "0;1",
+        dur: "1.2s",
+        repeatCount: "indefinite"
+      }
+    )
+  )
+);
+var iconLoading = (props) => /* @__PURE__ */ import_react.default.createElement(import_icons.default, { component: LoadingSvg, ...props });
+var IconLoading_default = iconLoading;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {});

package/lib/SideTip/index.d.ts

@@ -0,0 +1,156 @@
+import React from 'react';
+import type { BadgeProps } from 'antd/es/badge/index';
+import type { TooltipPropsWithTitle } from 'antd/es/tooltip/index';
+import type { LocaleWrapperProps } from '../locale/LocaleWrapper';
+import './index.less';
+export declare type SideTipType = 'primary' | 'default';
+export declare type SideTipSize = 'small' | 'default';
+export interface Position {
+    /**
+     * @title 距离右侧
+     * @description 设置悬浮按钮距离右侧边框的像素距离
+     * @default "32"
+     */
+    right?: number;
+    /**
+     * @title 距离底部
+     * @description 设置悬浮按钮距离底部边框的像素距离
+     * @default "32"
+     */
+    bottom?: number;
+}
+export interface SideTipProps extends LocaleWrapperProps {
+    /**
+     * @description 自定义前缀
+     * @ignore
+     */
+    prefix?: string;
+    /**
+     * @title 按钮类型
+     * @description 按钮类型
+     */
+    type?: SideTipType;
+    /**
+     * @title 按钮尺寸
+     * @description 按钮尺寸
+     */
+    size?: SideTipSize;
+    /**
+     * @title icon 地址
+     * @description icon地址，可以设置图片地址或 ReactNode
+     */
+    icon?: string | React.ReactNode;
+    /**
+     * @title 指定是否打开
+     * @description 指定是否打开
+     * @default false
+     */
+    open?: boolean;
+    /**
+     * @title 指定是否打开
+     * @description 指定是否打开
+     * @default false
+     * @deprecated
+     */
+    visible?: boolean;
+    /**
+     * @title 加载中
+     * @description 指定是否loading
+     */
+    loading?: boolean;
+    /**
+     * @title 是否可隐藏
+     * @description 是否可隐藏
+     * @default true
+     */
+    hideable?: boolean;
+    /**
+     * @title 组件 ID
+     * @description 若页面中有多个侧边提示组件，则通过 id 标识当前组件，用于缓存侧边提示组件是否隐藏配置
+     */
+    id?: string;
+    /**
+     * @description style 属性
+     * @ignore
+     */
+    style?: React.CSSProperties;
+    /**
+     * @description className
+     * @ignore
+     */
+    className?: string;
+    /**
+     * @title 按钮 style 属性
+     * @description 按钮的 style 属性
+     */
+    buttonStyle?: React.CSSProperties;
+    /**
+     * @title 按钮的 className 属性
+     * @description 按钮的 className 属性
+     */
+    buttonClassName?: string;
+    /**
+     * @title 徽标属性
+     * @description 徽标属性，详见antd [badge](https://ant.design/components/badge-cn/#API)属性
+     */
+    badge?: BadgeProps;
+    /**
+     * @title ToolTip 相关属性
+     * @description ToolTip 相关属性
+     */
+    tooltip?: TooltipPropsWithTitle;
+    /**
+     * @title 默认是否隐藏
+     * @description 按钮默认是否隐藏
+     * @default false
+     */
+    defaultHide?: boolean;
+    /**
+     * @title 初始位置
+     * @description 初始位置
+     */
+    position?: Position;
+    /**
+     * @description 点击气泡事件
+     */
+    onClick?: (e: any) => void;
+    /**
+     * @description 开始拖动
+     */
+    onDragStart?: () => void;
+    /**
+     * @description 结束拖动
+     */
+    onDragEnd?: () => void;
+    /**
+     * @description 正在拖动
+     */
+    onDrag?: (offset: any) => void;
+    /**
+     * 鼠标移入事件
+     */
+    onMouseEnter?: (e: MouseEvent) => void;
+    /**
+     * 鼠标离开事件
+     */
+    onMouseLeave?: (e: MouseEvent) => void;
+    /**
+     * @title 不可用
+     * @description 不可用
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * @title 返回气泡弹出所在的容器
+     * @description 返回气泡弹出所在的容器
+     * @default "() => document.body"
+     */
+    getPopupContainer?: () => HTMLElement;
+    children?: any;
+}
+export interface SideTipState {
+    hide?: boolean;
+    hovered?: boolean;
+}
+declare const _default: any;
+export default _default;