assui 2.0.2 → 2.0.6

package/es/single-img-upload/style/index.d.ts

@@ -0,0 +1,3 @@
+import 'antd/es/image/style';
+import 'antd/es/progress/style';
+import './index.less';

package/es/single-img-upload/style/index.js

@@ -0,0 +1,3 @@
+import 'antd/es/image/style';
+import 'antd/es/progress/style';
+import './index.less';

package/es/single-img-upload/style/index.less

@@ -0,0 +1,85 @@
+@import '~antd/es/style/themes/index';
+
+@progress-prefix-cls: ~'@{ant-prefix}';
+
+.as-img-upload {
+  width: 335px;
+  height: 140px;
+  border: 1px solid #cacaca;
+  border-radius: 4px;
+
+  &:hover {
+    border: 1px solid #1890ff;
+  }
+
+  .rc-upload,
+  &:focus {
+    outline: none;
+  }
+
+  &-button {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    cursor: pointer;
+
+    &:focus {
+      outline: none;
+    }
+  }
+
+  &-content {
+    position: relative;
+    z-index: 1010;
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    background-color: #fff;
+  }
+
+  &-close-button {
+    position: absolute;
+    top: 0;
+    right: 0;
+    z-index: 10;
+    width: 20px;
+    height: 20px;
+    text-align: center;
+    background-color: #000;
+    cursor: pointer;
+    opacity: 0.6;
+
+    .spotecicon {
+      width: 15px;
+      height: 15px;
+      color: #fff;
+    }
+  }
+
+  &-preview {
+    height: 100%;
+  }
+
+  &-upload-progress {
+    position: absolute;
+    top: 50%;
+    left: 0;
+    z-index: 2;
+    transform: translateY(-34%);
+
+    .@{ant-prefix}-progress-outer {
+      padding: 0 20px;
+    }
+
+    .@{ant-prefix}-progress-text {
+      display: block;
+      width: 100%;
+      color: #fff;
+      text-align: center;
+    }
+  }
+}

package/es/sortable-hoc/demo/VerticalListBase/index.modules.less

@@ -0,0 +1,63 @@
+@focusedOutlineColor: #4c9ffe;
+
+.root {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  height: 100%;
+  padding: 10px 0;
+  background-color: #f5f6fa;
+}
+
+// Base styles
+.list {
+  width: 400px;
+  height: 400px;
+  overflow: auto;
+  border: 1px solid #999;
+  -webkit-overflow-scrolling: touch;
+}
+
+.item {
+  position: relative;
+  width: 400px;
+  border-bottom: 1px solid #999;
+  cursor: grab;
+  touch-action: manipulation;
+
+  &.sorting {
+    pointer-events: none;
+  }
+}
+
+// Stylized
+.stylized-list {
+  position: relative;
+  z-index: 0;
+  background-color: #f3f3f3;
+  border: 1px solid #efefef;
+  border-radius: 3px;
+  outline: none;
+}
+
+.stylized-item {
+  display: flex;
+  align-items: center;
+  box-sizing: border-box;
+  width: 100%;
+  padding: 0 20px;
+
+  color: #333;
+  font-weight: 400;
+  background-color: #fff;
+  border-bottom: 1px solid #efefef;
+  outline: none;
+  user-select: none;
+
+  &:focus:not(.containsDragHandle) {
+    text-indent: -2px;
+    border: 2px solid @focusedOutlineColor;
+  }
+}

package/es/sortable-hoc/demo/index.modules.less

@@ -0,0 +1,248 @@
+@focusedOutlineColor: #4c9ffe;
+
+.root {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  height: 100%;
+  padding: 10px 0;
+  background-color: #f5f6fa;
+}
+
+// Base styles
+.list {
+  width: 400px;
+  height: 600px;
+  overflow: auto;
+  border: 1px solid #999;
+  -webkit-overflow-scrolling: touch;
+}
+
+.item {
+  position: relative;
+  border-bottom: 1px solid #999;
+
+  cursor: grab;
+  touch-action: manipulation;
+
+  &.sorting {
+    pointer-events: none;
+  }
+}
+
+.containsDragHandle {
+  cursor: default;
+}
+
+// Stylized
+.stylizedList {
+  position: relative;
+  z-index: 0;
+  background-color: #f3f3f3;
+  border: 1px solid #efefef;
+  border-radius: 3px;
+  outline: none;
+}
+
+.stylizedItem {
+  display: flex;
+  align-items: center;
+  box-sizing: border-box;
+  width: 100%;
+  padding: 0 20px;
+
+  color: #333;
+  font-weight: 400;
+  background-color: #fff;
+  border-bottom: 1px solid #efefef;
+  outline: none;
+  user-select: none;
+
+  &:focus:not(.containsDragHandle) {
+    text-indent: -2px;
+    border: 2px solid @focusedOutlineColor;
+  }
+}
+
+.disabled {
+  cursor: not-allowed;
+  opacity: 0.5;
+}
+
+// Drag handle
+.handleWrapper {
+  width: 18px;
+  height: 18px;
+  outline: none;
+}
+
+.handle {
+  display: block;
+  width: 18px;
+  height: 18px;
+  margin-right: 20px;
+  overflow: hidden;
+
+  cursor: grab;
+
+  > svg {
+    opacity: 0.3;
+  }
+}
+
+// Horizontal list
+.horizontalList {
+  display: flex;
+  width: 600px;
+  height: 300px;
+  white-space: nowrap;
+}
+
+.horizontalItem {
+  display: flex;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+  width: 200px;
+  border-right: 1px solid #efefef;
+  border-bottom: 0;
+}
+
+// Grid
+.grid {
+  display: grid;
+  grid-gap: 10px;
+  grid-template-columns: auto auto auto auto;
+  width: auto;
+  height: 130 * 3px + 20px;
+  white-space: nowrap;
+  background-color: transparent;
+  border: 0;
+}
+
+.gridItem {
+  width: 130px;
+  height: 130px;
+  padding: 0;
+  background-color: transparent;
+  border: none;
+
+  .wrapper {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+    height: 100%;
+    font-size: 28px;
+    background-color: #fff;
+    transform: scale(1);
+
+    span {
+      display: none;
+    }
+  }
+}
+
+.gridVariableSized {
+  .gridItem {
+    &[data-index='0'] {
+      grid-row-end: span 2;
+      grid-column-end: span 2;
+      width: auto !important;
+      height: auto !important;
+    }
+
+    &.sorting {
+      .wrapper {
+        transition: transform 150ms ease-in-out;
+      }
+    }
+  }
+}
+
+.gridItemVariableSized {
+  &[data-index='0'] {
+    .wrapper {
+      font-size: 56px;
+    }
+  }
+}
+
+// Nested
+.category {
+  height: auto;
+
+  .categoryHeader {
+    display: flex;
+    flex-flow: row nowrap;
+    align-items: center;
+    padding: 10px 14px;
+    background: #f9f9f9;
+    border-bottom: 1px solid #efefef;
+    user-select: none;
+  }
+
+  .categoryList {
+    height: auto;
+  }
+}
+
+// Divider
+.divider {
+  padding: 10px 20px;
+  color: #333;
+  font-size: 14px;
+  text-transform: uppercase;
+  background: #f9f9f9;
+  border-bottom: 1px solid #efefef;
+}
+
+// Helper styles
+.helper {
+  box-shadow: 0 5px 5px -5px rgba(0, 0, 0, 0.2), 0 -5px 5px -5px rgba(0, 0, 0, 0.2);
+
+  cursor: grabbing;
+}
+
+.stylizedHelper {
+  &:not(.gridItem),
+  &.gridItem .wrapper {
+    background-color: rgba(255, 255, 255, 0.9);
+    border: 1px solid #efefef;
+    border-radius: 3px;
+    box-shadow: 0 5px 5px -5px rgba(0, 0, 0, 0.2);
+
+    &.horizontalItem {
+      cursor: col-resize;
+    }
+
+    &:focus {
+      box-shadow: 0 0px 5px 1px @focusedOutlineColor;
+    }
+  }
+
+  &.gridItem .wrapper {
+    transition: transform 150ms ease-in-out;
+  }
+}
+
+.shrinkedHelper {
+  height: 20px !important;
+}
+
+:global {
+  body {
+    font-family: 'Montserrat', 'Helvetica Neue', 'Helvetica', arial, sans-serif;
+    background-color: rgba(#f4f5f9, 0.7);
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+  }
+  html,
+  body,
+  #root {
+    height: 100%;
+    margin: 0;
+  }
+}

package/es/sortable-hoc/index.d.ts

@@ -0,0 +1,2 @@
+import * as sortableHoc from 'react-sortable-hoc';
+export default sortableHoc;

package/es/sortable-hoc/index.js

@@ -0,0 +1,2 @@
+import * as sortableHoc from 'react-sortable-hoc';
+export default sortableHoc;

package/es/sortable-hoc/style/index.d.ts

@@ -0,0 +1 @@
+

package/es/split-pane/index.d.ts

@@ -0,0 +1,59 @@
+import * as React from 'react';
+export declare type Size = string | number;
+export declare type Split = 'vertical' | 'horizontal';
+export declare type SplitPaneProps = {
+    /**
+     * 是否允许拖动
+     * @default true
+     */
+    allowResize?: boolean;
+    /** 自定义组件类名 */
+    className?: string;
+    /**
+     * 设置主体窗口
+     * @default first
+     */
+    primary?: 'first' | 'second';
+    /**
+     * 窗口最小大小
+     * @default 50
+     */
+    minSize?: string | number;
+    /** 窗口最大大小 */
+    maxSize?: string | number;
+    /** 默认窗口大小 */
+    defaultSize?: string | number;
+    /** 窗口大小 */
+    size?: string | number;
+    /**
+     * 拆分方式
+     * @default vertical
+     */
+    split?: 'vertical' | 'horizontal';
+    /** 拖拽开始回调 */
+    onDragStarted?: () => void;
+    /** 拖拽完成回调 */
+    onDragFinished?: (newSize: number) => void;
+    /** 拖拽过程回调 */
+    onChange?: (newSize: number) => void;
+    /** 拖拽条单击回调 */
+    onResizerClick?: (event: MouseEvent) => void;
+    /** 拖拽条双击回调 */
+    onResizerDoubleClick?: (event: MouseEvent) => void;
+    /** 总窗口样式 */
+    style?: React.CSSProperties;
+    /** 拖拽条样式 */
+    resizerStyle?: React.CSSProperties;
+    /** 每个窗口共同样式 */
+    paneStyle?: React.CSSProperties;
+    /** 拆分窗口1样式 */
+    pane1Style?: React.CSSProperties;
+    /** 拆分窗口2样式 */
+    pane2Style?: React.CSSProperties;
+    /** 拆分窗口2样式 */
+    resizerClassName?: string;
+    /** 拖动固定步进值 */
+    step?: number;
+};
+declare const _default: (props: SplitPaneProps) => JSX.Element;
+export default _default;