@aloudata/aloudata-design 0.1.0-beta1 → 0.2.0-beta.3

package/es/Table/react-table-config.d.ts

@@ -0,0 +1,122 @@
+/* eslint-disable @typescript-eslint/naming-convention */
+import {
+  UseColumnOrderInstanceProps,
+  UseColumnOrderState,
+  UseExpandedHooks,
+  UseExpandedInstanceProps,
+  UseExpandedOptions,
+  UseExpandedRowProps,
+  UseExpandedState,
+  UseFiltersColumnOptions,
+  UseFiltersColumnProps,
+  UseFiltersInstanceProps,
+  UseFiltersOptions,
+  UseFiltersState,
+  UseGlobalFiltersColumnOptions,
+  UseGlobalFiltersInstanceProps,
+  UseGlobalFiltersOptions,
+  UseGlobalFiltersState,
+  UseGroupByCellProps,
+  UseGroupByColumnOptions,
+  UseGroupByColumnProps,
+  UseGroupByHooks,
+  UseGroupByInstanceProps,
+  UseGroupByOptions,
+  UseGroupByRowProps,
+  UseGroupByState,
+  UsePaginationInstanceProps,
+  UsePaginationOptions,
+  UsePaginationState,
+  UseResizeColumnsColumnOptions,
+  UseResizeColumnsColumnProps,
+  UseResizeColumnsOptions,
+  UseResizeColumnsState,
+  UseRowSelectHooks,
+  UseRowSelectInstanceProps,
+  UseRowSelectOptions,
+  UseRowSelectRowProps,
+  UseRowSelectState,
+  UseRowStateCellProps,
+  UseRowStateInstanceProps,
+  UseRowStateOptions,
+  UseRowStateRowProps,
+  UseRowStateState,
+  UseSortByColumnOptions,
+  UseSortByColumnProps,
+  UseSortByHooks,
+  UseSortByInstanceProps,
+  UseSortByOptions,
+  UseSortByState
+} from 'react-table';
+
+declare module 'react-table' {
+  // take this file as-is, or comment out the sections that don't apply to your plugin configuration
+
+  export interface TableOptions<D extends Record<string, unknown>>
+    extends UseExpandedOptions<D>,
+    UseFiltersOptions<D>,
+    UseGlobalFiltersOptions<D>,
+    UseGroupByOptions<D>,
+    UsePaginationOptions<D>,
+    UseResizeColumnsOptions<D>,
+    UseRowSelectOptions<D>,
+    UseRowStateOptions<D>,
+    UseSortByOptions<D>,
+    // note that having Record here allows you to add anything to the options, this matches the spirit of the
+    // underlying js library, but might be cleaner if it's replaced by a more specific type that matches your
+    // feature set, this is a safe default.
+    Record<string, unknown> {}
+
+  export interface Hooks<D extends Record<string, unknown> = Record<string, unknown>>
+    extends UseExpandedHooks<D>,
+    UseGroupByHooks<D>,
+    UseRowSelectHooks<D>,
+    UseSortByHooks<D> {}
+
+  export interface TableInstance<D extends Record<string, unknown> = Record<string, unknown>>
+    extends UseColumnOrderInstanceProps<D>,
+    UseExpandedInstanceProps<D>,
+    UseFiltersInstanceProps<D>,
+    UseGlobalFiltersInstanceProps<D>,
+    UseGroupByInstanceProps<D>,
+    UsePaginationInstanceProps<D>,
+    UseRowSelectInstanceProps<D>,
+    UseRowStateInstanceProps<D>,
+    UseSortByInstanceProps<D> {}
+
+  export interface TableState<D extends Record<string, unknown> = Record<string, unknown>>
+    extends UseColumnOrderState<D>,
+    UseExpandedState<D>,
+    UseFiltersState<D>,
+    UseGlobalFiltersState<D>,
+    UseGroupByState<D>,
+    UsePaginationState<D>,
+    UseResizeColumnsState<D>,
+    UseRowSelectState<D>,
+    UseRowStateState<D>,
+    UseSortByState<D> {}
+
+  export interface ColumnInterface<D extends Record<string, unknown> = Record<string, unknown>>
+    extends UseFiltersColumnOptions<D>,
+    UseGlobalFiltersColumnOptions<D>,
+    UseGroupByColumnOptions<D>,
+    UseResizeColumnsColumnOptions<D>,
+    UseSortByColumnOptions<D> {}
+
+  export interface ColumnInstance<D extends Record<string, unknown> = Record<string, unknown>>
+    extends UseFiltersColumnProps<D>,
+    UseGroupByColumnProps<D>,
+    UseResizeColumnsColumnProps<D>,
+    UseSortByColumnProps<D> {}
+
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  export interface Cell<D extends Record<string, unknown> = Record<string, unknown>, V = unknown>
+    extends UseGroupByCellProps<D>,
+    UseRowStateCellProps<D> {}
+
+  export interface Row<D extends Record<string, unknown> = Record<string, unknown>>
+    extends UseExpandedRowProps<D>,
+    UseGroupByRowProps<D>,
+    UseRowSelectRowProps<D>,
+    UseRowStateRowProps<D> {}
+}

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

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

package/es/Table/style/index.js

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

package/es/Table/style/index.less

@@ -0,0 +1,141 @@
+@import '../../style/index.less';
+
+@ald-prefix:ant;
+@ald-iconfont-css-prefix:anticon;
+@table-row-height:40px;
+.@{ald-prefix}-block-table {
+  overflow: hidden;
+
+  &-thead {
+    .@{ald-prefix}-block-table-cell {
+      position: relative;
+      color: @NL50;
+
+      &-sorting {
+        color: @B40;
+      }
+      // border: 1px solid red;
+
+      .@{ald-prefix}-block-table-bar {
+        display: inline-block;
+        background: blue;
+        width: 1px;
+        height: 12px;
+        position: absolute;
+        top: 50%;
+        right: 0;
+        transform: translateY(-50%);
+        z-index: 1;
+        touch-action: none;
+        background-color: @NL95;
+      }
+
+      &:last-child {
+        .@{ald-prefix}-block-table-bar {
+          display: none;
+        }
+      }
+    }
+  }
+
+  &-tbody {
+    overflow: hidden;
+
+    &-scroll {
+      overflow-y: scroll;
+      overflow-y: overlay;
+    }
+    .@{ald-prefix}-block-table-row {
+      &:hover {
+        background-color: @NL97;
+      }
+
+      &-selected {
+        background-color: @BBG97;
+
+        &:hover {
+          background-color: @BBG97;
+        }
+      }
+
+      &:last-of-type {
+        .@{ald-prefix}-block-table-cell {
+          border-bottom: 1px solid transparent;
+        }
+      }
+    }
+  }
+
+  &-row {
+    max-width: 100%;
+  }
+
+  &-cell {
+    padding: 0 12px;
+    height: @table-row-height;
+    line-height: @table-row-height;
+    border-bottom: 1px solid @NL95;
+    text-align: left;
+    color: @NL0;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    flex-grow: 1;
+  }
+
+  &-loading {
+    text-align: center;
+    line-height: @table-row-height;
+    color: @NL80;
+  }
+
+  &-header {
+    display: flex;
+    justify-content: space-between;
+    padding: 0 10px;
+    align-items: center;
+    margin-bottom: 24px;
+
+    &-left {
+      font-weight: 500;
+      font-size: 14px;
+      color: @NL0;
+    }
+
+    &-right {
+      display: flex;
+      height: 28px;
+      align-items: center;
+      font-size: 14px;
+      color: @NL0;
+    }
+  }
+
+  &-list {
+    overflow: overlay !important;
+  }
+
+  &-sortIcon {
+    margin-left: 4px;
+    margin-top: -2px;
+  }
+
+  &-column-resizable {
+    overflow: overlay;
+    .@{ald-prefix}-block-table {
+      &-cell {
+        flex: none;
+      }
+
+      &-thead {
+        &::-webkit-scrollbar {
+          display: none;
+        }
+      }
+
+      &-tbody {
+        overflow: initial;
+      }
+    }
+  }
+}

package/es/Tabs/TabPane.d.ts

@@ -0,0 +1,21 @@
+import { ReactNode } from 'react';
+export interface ITabPaneProps {
+    /**
+     * @description 被隐藏时是否渲染 DOM 结构
+     * @default false
+     */
+    forceRender?: boolean;
+    /**
+     * @description 对应 activeKey
+     * @default -
+     */
+    key?: string;
+    /**
+     * @description 选项卡头显示的内容
+     * @default -
+     */
+    tab: ReactNode;
+    className?: string;
+    children?: ReactNode;
+}
+export default function TabPane(props: ITabPaneProps): JSX.Element;

package/es/Tabs/TabPane.js

@@ -0,0 +1,12 @@
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+import React from 'react';
+import AntdTabs from 'antd/lib/tabs';
+var AntdTabPane = AntdTabs.TabPane;
+export default function TabPane(props) {
+  return /*#__PURE__*/React.createElement(AntdTabPane, _objectSpread({}, props));
+}

package/es/Tabs/demo/adaptHeight/index.d.ts

@@ -0,0 +1,3 @@
+import './index.less';
+declare const _default: () => JSX.Element;
+export default _default;

package/es/Tabs/demo/adaptHeight/index.js

@@ -0,0 +1,19 @@
+import React from 'react';
+import './index.less';
+import { Tabs } from '@aloudata/aloudata-design';
+var TabPane = Tabs.TabPane;
+export default (function () {
+  return /*#__PURE__*/React.createElement("div", {
+    className: "demo-adapt-height"
+  }, /*#__PURE__*/React.createElement(Tabs, {
+    adaptHeight: true
+  }, /*#__PURE__*/React.createElement(TabPane, {
+    tab: "Tab 1",
+    key: "1",
+    className: "demo-tabpane"
+  }, "Content of Tab Pane 1"), /*#__PURE__*/React.createElement(TabPane, {
+    tab: "Tab 2",
+    key: "2",
+    className: "demo-tabpane"
+  }, /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", null, "Content of Tab Pane 2"), /*#__PURE__*/React.createElement("div", null, "Content of Tab Pane 2"), /*#__PURE__*/React.createElement("div", null, "Content of Tab Pane 2"), /*#__PURE__*/React.createElement("div", null, "Content of Tab Pane 2"), /*#__PURE__*/React.createElement("div", null, "Content of Tab Pane 2"), /*#__PURE__*/React.createElement("div", null, "Content of Tab Pane 2"), /*#__PURE__*/React.createElement("div", null, "Content of Tab Pane 2"), /*#__PURE__*/React.createElement("div", null, "Content of Tab Pane 2"), /*#__PURE__*/React.createElement("div", null, "Content of Tab Pane 2"), /*#__PURE__*/React.createElement("div", null, "Content of Tab Pane 2"), /*#__PURE__*/React.createElement("div", null, "Content of Tab Pane 2")))));
+});

package/es/Tabs/demo/basic/index.d.ts

@@ -0,0 +1,4 @@
+import 'antd/lib//switch/style/index.less';
+import './index.less';
+declare const _default: () => JSX.Element;
+export default _default;

package/es/Tabs/demo/basic/index.js

@@ -0,0 +1,44 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+import React, { useState } from 'react';
+import Switch from 'antd/lib/switch';
+import 'antd/lib//switch/style/index.less';
+import './index.less';
+import { Tabs } from '@aloudata/aloudata-design';
+var TabPane = Tabs.TabPane;
+export default (function () {
+  var _useState = useState('default'),
+      _useState2 = _slicedToArray(_useState, 2),
+      size = _useState2[0],
+      setSize = _useState2[1];
+
+  return /*#__PURE__*/React.createElement("div", {
+    className: "demo-basic"
+  }, /*#__PURE__*/React.createElement("div", null, "large size: ", /*#__PURE__*/React.createElement(Switch, {
+    checked: size === 'large',
+    onChange: function onChange(checked) {
+      return setSize(checked ? 'large' : 'default');
+    }
+  })), /*#__PURE__*/React.createElement("div", {
+    className: "tabs-container"
+  }, /*#__PURE__*/React.createElement(Tabs, {
+    size: size,
+    destroyInactiveTabPane: true
+  }, /*#__PURE__*/React.createElement(TabPane, {
+    tab: "Tab 1",
+    key: "1"
+  }, "Content of Tab Pane 1"), /*#__PURE__*/React.createElement(TabPane, {
+    tab: "Tab 2",
+    key: "2"
+  }, "Content of Tab Pane 2"))));
+});

package/es/Tabs/demo/horizontalScroll/index.d.ts

@@ -0,0 +1,3 @@
+import './index.less';
+declare const _default: () => JSX.Element;
+export default _default;

package/es/Tabs/demo/horizontalScroll/index.js

@@ -0,0 +1,30 @@
+import React from 'react';
+import './index.less';
+import { Tabs } from '@aloudata/aloudata-design';
+var TabPane = Tabs.TabPane;
+export default (function () {
+  return /*#__PURE__*/React.createElement("div", {
+    className: "demo-horizontal-scroll"
+  }, /*#__PURE__*/React.createElement(Tabs, null, /*#__PURE__*/React.createElement(TabPane, {
+    tab: "Tab 1",
+    key: "1"
+  }, "Content of Tab Pane 1"), /*#__PURE__*/React.createElement(TabPane, {
+    tab: "Tab 2",
+    key: "2"
+  }, "Content of Tab Pane 2"), /*#__PURE__*/React.createElement(TabPane, {
+    tab: "Tab 3",
+    key: "3"
+  }, "Content of Tab Pane 3"), /*#__PURE__*/React.createElement(TabPane, {
+    tab: "Tab 4",
+    key: "4"
+  }, "Content of Tab Pane 4"), /*#__PURE__*/React.createElement(TabPane, {
+    tab: "Tab 5",
+    key: "5"
+  }, "Content of Tab Pane 5"), /*#__PURE__*/React.createElement(TabPane, {
+    tab: "Tab 6",
+    key: "6"
+  }, "Content of Tab Pane 6"), /*#__PURE__*/React.createElement(TabPane, {
+    tab: "Tab 7",
+    key: "7"
+  }, "Content of Tab Pane 7")));
+});

package/es/Tabs/index.d.ts

@@ -0,0 +1,41 @@
+import React from 'react';
+import './style';
+export interface ITabsProps {
+    /**
+     * @description 大小
+     * @default default
+     */
+    size?: 'large' | 'default';
+    /**
+     * @description 当前激活 tab 面板的 key
+     * @default -
+     */
+    activeKey?: string;
+    /**
+     * @description 初始化选中面板的 key，如果没有设置 activeKey
+     * @default 第一个面板的 key
+     */
+    defaultActiveKey?: string;
+    /**
+     * @description 切换面板的回调
+     * @default -
+     */
+    onChange?: (activeKey: string) => void;
+    /**
+     * @description 被隐藏时是否销毁 DOM 结构
+     * @default false
+     */
+    destroyInactiveTabPane?: boolean;
+    /**
+     * @description 撑满容器的高度
+     * @default false
+     */
+    adaptHeight?: boolean;
+    className?: string;
+    children?: React.ReactNode;
+}
+declare function Tabs(props: ITabsProps): JSX.Element;
+declare namespace Tabs {
+    var TabPane: typeof import("./TabPane").default;
+}
+export default Tabs;

package/es/Tabs/index.js

@@ -0,0 +1,42 @@
+var _excluded = ["size", "className", "adaptHeight"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+import React from 'react';
+import AntdTabs from 'antd/lib/tabs';
+import Icon from '../Icon';
+import TabPane from './TabPane';
+import classNames from 'classnames';
+import './style';
+export default function Tabs(props) {
+  var size = props.size,
+      className = props.className,
+      adaptHeight = props.adaptHeight,
+      otherProps = _objectWithoutProperties(props, _excluded);
+
+  var tabsProps = _objectSpread({}, otherProps);
+
+  if (size === 'large') {
+    tabsProps.size = size;
+  }
+
+  return /*#__PURE__*/React.createElement(AntdTabs, _objectSpread({
+    moreIcon: /*#__PURE__*/React.createElement(Icon, {
+      type: "more_vert",
+      size: 18
+    }),
+    tabBarGutter: 24,
+    className: classNames('ald-tabs', className, {
+      'ald-adapt-height': adaptHeight
+    })
+  }, tabsProps));
+}
+Tabs.TabPane = TabPane;

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

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

package/es/Tabs/style/index.js

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

package/es/Tooltip/demo/basic/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: () => JSX.Element;
+export default _default;

package/es/Tooltip/demo/basic/index.js

@@ -0,0 +1,7 @@
+import React from 'react';
+import { Tooltip } from '@aloudata/aloudata-design';
+export default (function () {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Tooltip, {
+    title: "Tooltip"
+  }, /*#__PURE__*/React.createElement("span", null, "Tooltip will show on mouse enter")));
+});

package/es/Tooltip/demo/overflow/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: () => JSX.Element;
+export default _default;

package/es/Tooltip/demo/overflow/index.js

@@ -0,0 +1,7 @@
+import React from 'react';
+import { Tooltip } from '@aloudata/aloudata-design';
+export default (function () {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Tooltip, {
+    title: "longMsglongMsglongMsglongMsglongMsglongMsglongMsglongMsglongMsglongMsglongMsglongMsglongMsglongMsglongMsglongMsglongMsglongMsglongMsglongMsglongMsg"
+  }, /*#__PURE__*/React.createElement("span", null, "Tooltip will show on mouse enter")));
+});

package/es/Tooltip/demo/placement/index.d.ts

@@ -0,0 +1,6 @@
+/**
+ * title: 调整位置
+ */
+import './index.less';
+declare const _default: () => JSX.Element;
+export default _default;

package/es/Tooltip/demo/placement/index.js

@@ -0,0 +1,70 @@
+/**
+ * title: 调整位置
+ */
+import React from 'react';
+import { Tooltip, Button } from '@aloudata/aloudata-design';
+import './index.less';
+var text = /*#__PURE__*/React.createElement("span", null, "prompt text");
+var buttonWidth = 70;
+export default (function () {
+  return /*#__PURE__*/React.createElement("div", {
+    className: "demo-placement"
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      marginLeft: buttonWidth,
+      whiteSpace: 'nowrap'
+    }
+  }, /*#__PURE__*/React.createElement(Tooltip, {
+    placement: "topLeft",
+    title: text
+  }, /*#__PURE__*/React.createElement(Button, null, "TL")), /*#__PURE__*/React.createElement(Tooltip, {
+    placement: "top",
+    title: text
+  }, /*#__PURE__*/React.createElement(Button, null, "Top")), /*#__PURE__*/React.createElement(Tooltip, {
+    placement: "topRight",
+    title: text
+  }, /*#__PURE__*/React.createElement(Button, null, "TR"))), /*#__PURE__*/React.createElement("div", {
+    style: {
+      width: buttonWidth,
+      float: 'left'
+    }
+  }, /*#__PURE__*/React.createElement(Tooltip, {
+    placement: "leftTop",
+    title: text
+  }, /*#__PURE__*/React.createElement(Button, null, "LT")), /*#__PURE__*/React.createElement(Tooltip, {
+    placement: "left",
+    title: text
+  }, /*#__PURE__*/React.createElement(Button, null, "Left")), /*#__PURE__*/React.createElement(Tooltip, {
+    placement: "leftBottom",
+    title: text
+  }, /*#__PURE__*/React.createElement(Button, null, "LB"))), /*#__PURE__*/React.createElement("div", {
+    style: {
+      width: buttonWidth,
+      marginLeft: buttonWidth * 4 + 24
+    }
+  }, /*#__PURE__*/React.createElement(Tooltip, {
+    placement: "rightTop",
+    title: text
+  }, /*#__PURE__*/React.createElement(Button, null, "RT")), /*#__PURE__*/React.createElement(Tooltip, {
+    placement: "right",
+    title: text
+  }, /*#__PURE__*/React.createElement(Button, null, "Right")), /*#__PURE__*/React.createElement(Tooltip, {
+    placement: "rightBottom",
+    title: text
+  }, /*#__PURE__*/React.createElement(Button, null, "RB"))), /*#__PURE__*/React.createElement("div", {
+    style: {
+      marginLeft: buttonWidth,
+      clear: 'both',
+      whiteSpace: 'nowrap'
+    }
+  }, /*#__PURE__*/React.createElement(Tooltip, {
+    placement: "bottomLeft",
+    title: text
+  }, /*#__PURE__*/React.createElement(Button, null, "BL")), /*#__PURE__*/React.createElement(Tooltip, {
+    placement: "bottom",
+    title: text
+  }, /*#__PURE__*/React.createElement(Button, null, "Bottom")), /*#__PURE__*/React.createElement(Tooltip, {
+    placement: "bottomRight",
+    title: text
+  }, /*#__PURE__*/React.createElement(Button, null, "BR"))));
+});

package/es/Tooltip/demo/trigger/index.d.ts

@@ -0,0 +1,3 @@
+import './index.less';
+declare const _default: () => JSX.Element;
+export default _default;

package/es/Tooltip/demo/trigger/index.js

@@ -0,0 +1,20 @@
+import React from 'react';
+import { Tooltip, Button } from '@aloudata/aloudata-design';
+import './index.less';
+export default (function () {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: "demo-trigger"
+  }, /*#__PURE__*/React.createElement(Tooltip, {
+    title: "Tooltip",
+    trigger: "hover"
+  }, /*#__PURE__*/React.createElement(Button, null, "hover")), /*#__PURE__*/React.createElement(Tooltip, {
+    title: "Tooltip",
+    trigger: "click"
+  }, /*#__PURE__*/React.createElement(Button, null, "click")), /*#__PURE__*/React.createElement(Tooltip, {
+    title: "Tooltip",
+    trigger: "contextMenu"
+  }, /*#__PURE__*/React.createElement(Button, null, "contextMenu")), /*#__PURE__*/React.createElement(Tooltip, {
+    title: "Tooltip",
+    trigger: "focus"
+  }, /*#__PURE__*/React.createElement(Button, null, "focus"))));
+});