@fle-ui/next 1.0.0-alpha.8 → 1.0.0-alpha.9

package/es/notification/demo/basic.js

@@ -1,25 +0,0 @@
-/**
- * title: 基本
- * desc: 最简单的用法，4.5 秒后自动关闭。
- */
-import React from 'react';
-import { Button, notification } from '@fle-ui/next';
-
-var Demo = function Demo() {
-  var openNotification = function openNotification() {
-    notification.open({
-      message: 'Notification Title',
-      description: 'This is the content of the notification. This is the content of the notification. This is the content of the notification.',
-      onClick: function onClick() {
-        console.log('Notification Clicked!');
-      }
-    });
-  };
-
-  return /*#__PURE__*/React.createElement(Button, {
-    type: "primary",
-    onClick: openNotification
-  }, "Open the notification box");
-};
-
-export default Demo;

package/es/notification/demo/custom-icon.d.ts

@@ -1,6 +0,0 @@
-/**
- * title: 自定义图标
- * desc: 图标可以被自定义。
- */
-declare const Demo: () => JSX.Element;
-export default Demo;

package/es/notification/demo/custom-icon.js

@@ -1,28 +0,0 @@
-/**
- * title: 自定义图标
- * desc: 图标可以被自定义。
- */
-import React from 'react';
-import { Button, notification } from '@fle-ui/next';
-import { SmileOutlined } from '@ant-design/icons';
-
-var Demo = function Demo() {
-  var openNotification = function openNotification() {
-    notification.open({
-      message: 'Notification Title',
-      description: 'This is the content of the notification. This is the content of the notification. This is the content of the notification.',
-      icon: /*#__PURE__*/React.createElement(SmileOutlined, {
-        style: {
-          color: '#108ee9'
-        }
-      })
-    });
-  };
-
-  return /*#__PURE__*/React.createElement(Button, {
-    type: "primary",
-    onClick: openNotification
-  }, "Open the notification box");
-};
-
-export default Demo;

package/es/notification/demo/custom-style.d.ts

@@ -1,6 +0,0 @@
-/**
- * title: 自定义样式
- * desc: 使用 style 和 className 来定义样式。
- */
-declare const Demo: () => JSX.Element;
-export default Demo;

package/es/notification/demo/custom-style.js

@@ -1,26 +0,0 @@
-/**
- * title: 自定义样式
- * desc: 使用 style 和 className 来定义样式。
- */
-import React from 'react';
-import { Button, notification } from '@fle-ui/next';
-
-var Demo = function Demo() {
-  var openNotification = function openNotification() {
-    notification.open({
-      message: 'Notification Title',
-      description: 'This is the content of the notification. This is the content of the notification. This is the content of the notification.',
-      className: 'custom-class',
-      style: {
-        width: 600
-      }
-    });
-  };
-
-  return /*#__PURE__*/React.createElement(Button, {
-    type: "primary",
-    onClick: openNotification
-  }, "Open the notification box");
-};
-
-export default Demo;

package/es/notification/demo/duration.d.ts

@@ -1,6 +0,0 @@
-/**
- * title: 自动关闭的延时
- * desc: 自定义通知框自动关闭的延时，默认 4.5s，取消自动关闭只要将该值设为 0 即可。
- */
-declare const Demo: () => JSX.Element;
-export default Demo;

package/es/notification/demo/duration.js

@@ -1,24 +0,0 @@
-/**
- * title: 自动关闭的延时
- * desc: 自定义通知框自动关闭的延时，默认 4.5s，取消自动关闭只要将该值设为 0 即可。
- */
-import React from 'react';
-import { Button, notification } from '@fle-ui/next';
-
-var Demo = function Demo() {
-  var openNotification = function openNotification() {
-    var args = {
-      message: 'Notification Title',
-      description: 'I will never close automatically. This is a purposely very very long description that has many many characters and words.',
-      duration: 0
-    };
-    notification.open(args);
-  };
-
-  return /*#__PURE__*/React.createElement(Button, {
-    type: "primary",
-    onClick: openNotification
-  }, "Open the notification box");
-};
-
-export default Demo;

package/es/notification/demo/hooks.d.ts

@@ -1,6 +0,0 @@
-/**
- * title: 通过 Hooks 获取上下文
- * desc: 通过 `notification.useNotification` 创建支持读取 context 的 `contextHolder`。
- */
-declare const Demo: () => JSX.Element;
-export default Demo;

package/es/notification/demo/hooks.js

@@ -1,58 +0,0 @@
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-
-/**
- * title: 通过 Hooks 获取上下文
- * desc: 通过 `notification.useNotification` 创建支持读取 context 的 `contextHolder`。
- */
-import React from 'react';
-import { Button, notification, Divider, Space } from '@fle-ui/next';
-import { RadiusUpleftOutlined, RadiusUprightOutlined, RadiusBottomleftOutlined, RadiusBottomrightOutlined } from '@ant-design/icons';
-var Context = /*#__PURE__*/React.createContext({
-  name: 'Default'
-});
-
-var Demo = function Demo() {
-  var _notification$useNoti = notification.useNotification(),
-      _notification$useNoti2 = _slicedToArray(_notification$useNoti, 2),
-      api = _notification$useNoti2[0],
-      contextHolder = _notification$useNoti2[1];
-
-  var openNotification = function openNotification(placement) {
-    api.info({
-      message: "Notification ".concat(placement),
-      description: /*#__PURE__*/React.createElement(Context.Consumer, null, function (_ref) {
-        var name = _ref.name;
-        return "Hello, ".concat(name, "!");
-      }),
-      placement: placement
-    });
-  };
-
-  return /*#__PURE__*/React.createElement(Context.Provider, {
-    value: {
-      name: 'Ant Design'
-    }
-  }, contextHolder, /*#__PURE__*/React.createElement(Space, null, /*#__PURE__*/React.createElement(Button, {
-    type: "primary",
-    onClick: function onClick() {
-      return openNotification('topLeft');
-    }
-  }, /*#__PURE__*/React.createElement(RadiusUpleftOutlined, null), "topLeft"), /*#__PURE__*/React.createElement(Button, {
-    type: "primary",
-    onClick: function onClick() {
-      return openNotification('topRight');
-    }
-  }, /*#__PURE__*/React.createElement(RadiusUprightOutlined, null), "topRight")), /*#__PURE__*/React.createElement(Divider, null), /*#__PURE__*/React.createElement(Space, null, /*#__PURE__*/React.createElement(Button, {
-    type: "primary",
-    onClick: function onClick() {
-      return openNotification('bottomLeft');
-    }
-  }, /*#__PURE__*/React.createElement(RadiusBottomleftOutlined, null), "bottomLeft"), /*#__PURE__*/React.createElement(Button, {
-    type: "primary",
-    onClick: function onClick() {
-      return openNotification('bottomRight');
-    }
-  }, /*#__PURE__*/React.createElement(RadiusBottomrightOutlined, null), "bottomRight")));
-};
-
-export default Demo;

package/es/notification/demo/placement.d.ts

@@ -1,6 +0,0 @@
-/**
- * title: 位置
- * desc: 通知从右上角、右下角、左下角、左上角弹出。
- */
-declare const Demo: () => JSX.Element;
-export default Demo;

package/es/notification/demo/placement.js

@@ -1,41 +0,0 @@
-/**
- * title: 位置
- * desc: 通知从右上角、右下角、左下角、左上角弹出。
- */
-import React from 'react';
-import { Button, notification, Divider, Space } from '@fle-ui/next';
-import { RadiusUpleftOutlined, RadiusUprightOutlined, RadiusBottomleftOutlined, RadiusBottomrightOutlined } from '@ant-design/icons';
-
-var Demo = function Demo() {
-  var openNotification = function openNotification(placement) {
-    notification.info({
-      message: "Notification ".concat(placement),
-      description: 'This is the content of the notification. This is the content of the notification. This is the content of the notification.',
-      placement: placement
-    });
-  };
-
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Space, null, /*#__PURE__*/React.createElement(Button, {
-    type: "primary",
-    onClick: function onClick() {
-      return openNotification('topLeft');
-    }
-  }, /*#__PURE__*/React.createElement(RadiusUpleftOutlined, null), "topLeft"), /*#__PURE__*/React.createElement(Button, {
-    type: "primary",
-    onClick: function onClick() {
-      return openNotification('topRight');
-    }
-  }, /*#__PURE__*/React.createElement(RadiusUprightOutlined, null), "topRight")), /*#__PURE__*/React.createElement(Divider, null), /*#__PURE__*/React.createElement(Space, null, /*#__PURE__*/React.createElement(Button, {
-    type: "primary",
-    onClick: function onClick() {
-      return openNotification('bottomLeft');
-    }
-  }, /*#__PURE__*/React.createElement(RadiusBottomleftOutlined, null), "bottomLeft"), /*#__PURE__*/React.createElement(Button, {
-    type: "primary",
-    onClick: function onClick() {
-      return openNotification('bottomRight');
-    }
-  }, /*#__PURE__*/React.createElement(RadiusBottomrightOutlined, null), "bottomRight")));
-};
-
-export default Demo;

package/es/notification/demo/update.d.ts

@@ -1,6 +0,0 @@
-/**
- * title: 更新消息内容
- * desc: 可以通过唯一的 key 来更新内容。
- */
-declare const Demo: () => JSX.Element;
-export default Demo;

package/es/notification/demo/update.js

@@ -1,32 +0,0 @@
-/**
- * title: 更新消息内容
- * desc: 可以通过唯一的 key 来更新内容。
- */
-import React from 'react';
-import { Button, notification } from '@fle-ui/next';
-
-var Demo = function Demo() {
-  var key = 'updatable';
-
-  var openNotification = function openNotification() {
-    notification.open({
-      key: key,
-      message: 'Notification Title',
-      description: 'description.'
-    });
-    setTimeout(function () {
-      notification.open({
-        key: key,
-        message: 'New Title',
-        description: 'New description.'
-      });
-    }, 1000);
-  };
-
-  return /*#__PURE__*/React.createElement(Button, {
-    type: "primary",
-    onClick: openNotification
-  }, "Open the notification box");
-};
-
-export default Demo;

package/es/notification/demo/with-btn.d.ts

@@ -1,6 +0,0 @@
-/**
- * title: 自定义按钮
- * desc: 自定义关闭按钮的样式和文字。
- */
-declare const Demo: () => JSX.Element;
-export default Demo;

package/es/notification/demo/with-btn.js

@@ -1,37 +0,0 @@
-/**
- * title: 自定义按钮
- * desc: 自定义关闭按钮的样式和文字。
- */
-import React from 'react';
-import { Button, notification } from '@fle-ui/next';
-
-var Demo = function Demo() {
-  var close = function close() {
-    console.log('Notification was closed. Either the close button was clicked or duration time elapsed.');
-  };
-
-  var openNotification = function openNotification() {
-    var key = "open".concat(Date.now());
-    var btn = /*#__PURE__*/React.createElement(Button, {
-      type: "primary",
-      size: "small",
-      onClick: function onClick() {
-        return notification.close(key);
-      }
-    }, "Confirm");
-    notification.open({
-      message: 'Notification Title',
-      description: 'A function will be be called after the notification is closed (automatically after the "duration" time of manually).',
-      btn: btn,
-      key: key,
-      onClose: close
-    });
-  };
-
-  return /*#__PURE__*/React.createElement(Button, {
-    type: "primary",
-    onClick: openNotification
-  }, "Open the notification box");
-};
-
-export default Demo;

package/es/notification/demo/with-icon.d.ts

@@ -1,6 +0,0 @@
-/**
- * title: 带有图标的通知提醒框
- * desc: 通知提醒框左侧有图标。
- */
-declare const Demo: () => JSX.Element;
-export default Demo;

package/es/notification/demo/with-icon.js

@@ -1,35 +0,0 @@
-/**
- * title: 带有图标的通知提醒框
- * desc: 通知提醒框左侧有图标。
- */
-import React from 'react';
-import { Button, notification, Space } from '@fle-ui/next';
-
-var Demo = function Demo() {
-  var openNotificationWithIcon = function openNotificationWithIcon(type) {
-    notification[type]({
-      message: 'Notification Title',
-      description: 'This is the content of the notification. This is the content of the notification. This is the content of the notification.'
-    });
-  };
-
-  return /*#__PURE__*/React.createElement(Space, null, /*#__PURE__*/React.createElement(Button, {
-    onClick: function onClick() {
-      return openNotificationWithIcon('success');
-    }
-  }, "Success"), /*#__PURE__*/React.createElement(Button, {
-    onClick: function onClick() {
-      return openNotificationWithIcon('info');
-    }
-  }, "Info"), /*#__PURE__*/React.createElement(Button, {
-    onClick: function onClick() {
-      return openNotificationWithIcon('warning');
-    }
-  }, "Warning"), /*#__PURE__*/React.createElement(Button, {
-    onClick: function onClick() {
-      return openNotificationWithIcon('error');
-    }
-  }, "Error"));
-};
-
-export default Demo;

package/es/notification/style/index-pure.less

@@ -1,217 +0,0 @@
-@import '../../style/themes/index';
-@import '../../style/theme.less';
-@import '../../style/mixins/index';
-
-.popover-customize-bg(@notification-prefix-cls, @popover-background);
-
-@notification-prefix-cls: ~'@{ant-prefix}-notification';
-@notification-width: 384px;
-@notification-padding: @notification-padding-vertical @notification-padding-horizontal;
-@notification-margin-bottom: 16px;
-@notification-margin-edge: 24px;
-
-.@{notification-prefix-cls} {
-  .reset-component();
-
-  position: fixed;
-  z-index: @zindex-notification;
-  margin-right: @notification-margin-edge;
-
-  &-topLeft,
-  &-bottomLeft {
-    margin-right: 0;
-    margin-left: @notification-margin-edge;
-
-    .@{notification-prefix-cls}-fade-enter.@{notification-prefix-cls}-fade-enter-active,
-    .@{notification-prefix-cls}-fade-appear.@{notification-prefix-cls}-fade-appear-active {
-      animation-name: NotificationLeftFadeIn;
-    }
-  }
-
-  &-close-icon {
-    font-size: @font-size-base;
-    cursor: pointer;
-  }
-
-  &-hook-holder {
-    position: relative;
-  }
-
-  &-notice {
-    position: relative;
-    width: @notification-width;
-    max-width: ~'calc(100vw - @{notification-margin-edge} * 2)';
-    margin-bottom: @notification-margin-bottom;
-    margin-left: auto;
-    padding: @notification-padding;
-    overflow: hidden;
-    line-height: @line-height-base;
-    word-wrap: break-word;
-    background: @notification-bg;
-    border-radius: @border-radius-base;
-    box-shadow: @shadow-2;
-
-    .@{notification-prefix-cls}-topLeft &,
-    .@{notification-prefix-cls}-bottomLeft & {
-      margin-right: auto;
-      margin-left: 0;
-    }
-
-    &-message {
-      margin-bottom: 8px;
-      color: @heading-color;
-      font-size: @font-size-lg;
-      line-height: 24px;
-
-      // https://github.com/ant-design/ant-design/issues/5846#issuecomment-296244140
-      &-single-line-auto-margin {
-        display: block;
-        width: ~'calc(@{notification-width} - @{notification-padding-horizontal} * 2 - 24px - 48px - 100%)';
-        max-width: 4px;
-        background-color: transparent;
-        pointer-events: none;
-        &::before {
-          display: block;
-          content: '';
-        }
-      }
-    }
-
-    &-description {
-      font-size: @font-size-base;
-    }
-
-    &-closable &-message {
-      padding-right: 24px;
-    }
-
-    &-with-icon &-message {
-      margin-bottom: 4px;
-      margin-left: 48px;
-      font-size: @font-size-lg;
-    }
-
-    &-with-icon &-description {
-      margin-left: 48px;
-      font-size: @font-size-base;
-    }
-
-    // Icon & color style in different selector level
-    // https://github.com/ant-design/ant-design/issues/16503
-    // https://github.com/ant-design/ant-design/issues/15512
-    &-icon {
-      position: absolute;
-      margin-left: 4px;
-      font-size: 24px;
-      line-height: 24px;
-    }
-
-    .@{iconfont-css-prefix}&-icon {
-      &-success {
-        color: @success-color;
-      }
-      &-info {
-        color: @info-color;
-      }
-      &-warning {
-        color: @warning-color;
-      }
-      &-error {
-        color: @error-color;
-      }
-    }
-
-    &-close {
-      position: absolute;
-      top: 16px;
-      right: 22px;
-      color: @text-color-secondary;
-      outline: none;
-
-      &:hover {
-        & when (@theme = dark) {
-          color: fade(@white, 85%);
-        }
-        & when not (@theme = dark) {
-          color: shade(@text-color-secondary, 40%);
-        }
-      }
-    }
-
-    &-btn {
-      float: right;
-      margin-top: 16px;
-    }
-  }
-
-  .notification-fade-effect {
-    animation-duration: 0.24s;
-    animation-timing-function: @ease-in-out;
-    animation-fill-mode: both;
-  }
-
-  &-fade-enter,
-  &-fade-appear {
-    .notification-fade-effect();
-
-    opacity: 0;
-    animation-play-state: paused;
-  }
-
-  &-fade-leave {
-    .notification-fade-effect();
-
-    animation-duration: 0.2s;
-    animation-play-state: paused;
-  }
-
-  &-fade-enter&-fade-enter-active,
-  &-fade-appear&-fade-appear-active {
-    animation-name: NotificationFadeIn;
-    animation-play-state: running;
-  }
-
-  &-fade-leave&-fade-leave-active {
-    animation-name: NotificationFadeOut;
-    animation-play-state: running;
-  }
-}
-
-@keyframes NotificationFadeIn {
-  0% {
-    left: @notification-width;
-    opacity: 0;
-  }
-  100% {
-    left: 0;
-    opacity: 1;
-  }
-}
-
-@keyframes NotificationLeftFadeIn {
-  0% {
-    right: @notification-width;
-    opacity: 0;
-  }
-  100% {
-    right: 0;
-    opacity: 1;
-  }
-}
-
-@keyframes NotificationFadeOut {
-  0% {
-    max-height: 150px;
-    margin-bottom: @notification-margin-bottom;
-    opacity: 1;
-  }
-  100% {
-    max-height: 0;
-    margin-bottom: 0;
-    padding-top: 0;
-    padding-bottom: 0;
-    opacity: 0;
-  }
-}
-
-@import './rtl';

package/es/page-header/demo/basic.d.ts

@@ -1,6 +0,0 @@
-/**
- * title: 标准样式
- * desc: 标准页头，适合使用在需要简单描述的场景。
- */
-declare const BasicDemo: () => JSX.Element;
-export default BasicDemo;

package/es/page-header/demo/basic.js

@@ -1,19 +0,0 @@
-/**
- * title: 标准样式
- * desc: 标准页头，适合使用在需要简单描述的场景。
- */
-import React from 'react';
-import { PageHeader } from '@fle-ui/next';
-
-var BasicDemo = function BasicDemo() {
-  return /*#__PURE__*/React.createElement(PageHeader, {
-    className: "site-page-header",
-    onBack: function onBack() {
-      return null;
-    },
-    title: "Title",
-    subTitle: "This is a subtitle"
-  });
-};
-
-export default BasicDemo;

package/es/page-header/demo/breadcrumb.d.ts

@@ -1,6 +0,0 @@
-/**
- * title: 带面包屑页头
- * desc: 带面包屑页头，适合层级比较深的页面，让用户可以快速导航。
- */
-declare const BreadcrumbDemo: () => JSX.Element;
-export default BreadcrumbDemo;

package/es/page-header/demo/breadcrumb.js

@@ -1,29 +0,0 @@
-/**
- * title: 带面包屑页头
- * desc: 带面包屑页头，适合层级比较深的页面，让用户可以快速导航。
- */
-import React from 'react';
-import { PageHeader } from '@fle-ui/next';
-
-var BreadcrumbDemo = function BreadcrumbDemo() {
-  var routes = [{
-    path: 'index',
-    breadcrumbName: 'First-level Menu'
-  }, {
-    path: 'first',
-    breadcrumbName: 'Second-level Menu'
-  }, {
-    path: 'second',
-    breadcrumbName: 'Third-level Menu'
-  }];
-  return /*#__PURE__*/React.createElement(PageHeader, {
-    className: "site-page-header",
-    title: "Title",
-    breadcrumb: {
-      routes: routes
-    },
-    subTitle: "This is a subtitle"
-  });
-};
-
-export default BreadcrumbDemo;

package/es/page-header/demo/combination.d.ts

@@ -1,6 +0,0 @@
-/**
- * title: 组合示例
- * desc: 使用了 PageHeader 提供的所有能力。
- */
-declare const CombinationDemo: () => JSX.Element;
-export default CombinationDemo;