assui 3.0.79 → 3.1.0

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

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

package/es/flex/style/index.js

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

package/es/flex/style/index.less

@@ -0,0 +1,125 @@
+@import '~antd/lib/style/index.less';
+
+.as-flex-wrap-wrap {
+  flex-wrap: wrap;
+}
+
+.as-flex-wrap-nowrap {
+  flex-wrap: nowrap;
+}
+
+.as-flex-wrap-wrap-reverse {
+  flex-wrap: wrap-reverse;
+}
+
+.as-flex-align-center {
+  align-items: center;
+}
+
+.as-flex-align-start {
+  align-items: start;
+}
+
+.as-flex-align-end {
+  align-items: end;
+}
+
+.as-flex-align-flex-start {
+  align-items: flex-start;
+}
+
+.as-flex-align-flex-end {
+  align-items: flex-end;
+}
+
+.as-flex-align-self-start {
+  align-items: self-start;
+}
+
+.as-flex-align-self-end {
+  align-items: self-end;
+}
+
+.as-flex-align-baseline {
+  align-items: baseline;
+}
+
+.as-flex-align-normal {
+  align-items: normal;
+}
+
+.as-flex-align-stretch {
+  align-items: stretch;
+}
+
+.as-flex-justify-flex-start {
+  justify-content: flex-start;
+}
+
+.as-flex-justify-flex-end {
+  justify-content: flex-end;
+}
+
+.as-flex-justify-start {
+  justify-content: start;
+}
+
+.as-flex-justify-end {
+  justify-content: end;
+}
+
+.as-flex-justify-center {
+  justify-content: center;
+}
+
+.as-flex-justify-space-between {
+  justify-content: space-between;
+}
+
+.as-flex-justify-space-around {
+  justify-content: space-around;
+}
+
+.as-flex-justify-space-evenly {
+  justify-content: space-evenly;
+}
+
+.as-flex-justify-stretch {
+  justify-content: stretch;
+}
+
+.as-flex-justify-normal {
+  justify-content: normal;
+}
+
+.as-flex-justify-left {
+  justify-content: left;
+}
+
+.as-flex-justify-right {
+  justify-content: right;
+}
+
+.as-flex {
+  display: flex;
+
+  &-vertical {
+    flex-direction: column;
+  }
+
+  &:empty {
+    display: none;
+  }
+
+  &-gap-small {
+    gap: 8px;
+  }
+
+  &-gap-middle {
+    gap: 16px;
+  }
+
+  &-gap-large {
+    gap: 24px;
+  }
+}

package/es/flex/utils/gapSize.d.ts

@@ -0,0 +1,2 @@
+import type { SizeType } from 'antd/lib/config-provider/SizeContext';
+export declare function isPresetSize(size?: SizeType | string | number): size is SizeType;

package/es/flex/utils/gapSize.js

@@ -0,0 +1,3 @@
+export function isPresetSize(size) {
+  return ['small', 'middle', 'large'].includes(size);
+}

package/es/flex/utils/index.d.ts

@@ -0,0 +1,6 @@
+import type { FlexProps } from '../index';
+export declare const flexWrapValues: readonly ["wrap", "nowrap", "wrap-reverse"];
+export declare const justifyContentValues: readonly ["flex-start", "flex-end", "start", "end", "center", "space-between", "space-around", "space-evenly", "stretch", "normal", "left", "right"];
+export declare const alignItemsValues: readonly ["center", "start", "end", "flex-start", "flex-end", "self-start", "self-end", "baseline", "normal", "stretch"];
+declare function createFlexClassNames(prefixCls: string, props: FlexProps): string;
+export default createFlexClassNames;

package/es/flex/utils/index.js

@@ -0,0 +1,42 @@
+var __assign = this && this.__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) {
+        if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+      }
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+import classNames from 'classnames';
+export var flexWrapValues = ['wrap', 'nowrap', 'wrap-reverse'];
+export var justifyContentValues = ['flex-start', 'flex-end', 'start', 'end', 'center', 'space-between', 'space-around', 'space-evenly', 'stretch', 'normal', 'left', 'right'];
+export var alignItemsValues = ['center', 'start', 'end', 'flex-start', 'flex-end', 'self-start', 'self-end', 'baseline', 'normal', 'stretch'];
+var genClsWrap = function genClsWrap(prefixCls, props) {
+  var wrapCls = {};
+  flexWrapValues.forEach(function (cssKey) {
+    wrapCls["".concat(prefixCls, "-wrap-").concat(cssKey)] = props.wrap === cssKey;
+  });
+  return wrapCls;
+};
+var genClsAlign = function genClsAlign(prefixCls, props) {
+  var alignCls = {};
+  alignItemsValues.forEach(function (cssKey) {
+    alignCls["".concat(prefixCls, "-align-").concat(cssKey)] = props.align === cssKey;
+  });
+  alignCls["".concat(prefixCls, "-align-stretch")] = !props.align && !!props.vertical;
+  return alignCls;
+};
+var genClsJustify = function genClsJustify(prefixCls, props) {
+  var justifyCls = {};
+  justifyContentValues.forEach(function (cssKey) {
+    justifyCls["".concat(prefixCls, "-justify-").concat(cssKey)] = props.justify === cssKey;
+  });
+  return justifyCls;
+};
+function createFlexClassNames(prefixCls, props) {
+  return classNames(__assign(__assign(__assign({}, genClsWrap(prefixCls, props)), genClsAlign(prefixCls, props)), genClsJustify(prefixCls, props)));
+}
+export default createFlexClassNames;

package/es/index.d.ts

@@ -76,3 +76,5 @@ export type { RichTextEditorProps } from './rich-text-editor';
 export { default as RichTextEditor } from './rich-text-editor';
 export { default as BeautifulDnd } from './beautiful-dnd';
 export { default as Resizable } from './resizable';
+export type { FlexProps } from './flex';
+export { default as Flex } from './flex';

package/es/index.js

@@ -38,4 +38,5 @@ export { default as TableCol } from './table-col';
 export { default as LabelCustomizeRangePicker } from './label-customize-range-picker';
 export { default as RichTextEditor } from './rich-text-editor';
 export { default as BeautifulDnd } from './beautiful-dnd';
-export { default as Resizable } from './resizable';
+export { default as Resizable } from './resizable';
+export { default as Flex } from './flex';

package/lib/flex/index.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+import type { SizeType } from 'antd/lib/config-provider/SizeContext';
+export interface FlexProps<P = Record<PropertyKey, any>> extends React.HTMLAttributes<HTMLElement> {
+    /** flex 主轴的方向是否垂直 */
+    vertical?: boolean;
+    /** 设置元素单行显示还是多行显示 */
+    wrap?: React.CSSProperties['flexWrap'];
+    /** 设置元素在主轴方向上的对齐方式 */
+    justify?: React.CSSProperties['justifyContent'];
+    /** 设置元素在交叉轴方向上的对齐方式 */
+    align?: React.CSSProperties['alignItems'];
+    /** flex CSS 简写属性 */
+    flex?: React.CSSProperties['flex'];
+    /** 设置网格之间的间隙 */
+    gap?: React.CSSProperties['gap'] | SizeType;
+    children: React.ReactNode;
+    /** 自定义元素类型 */
+    component?: React.ComponentType<P> | string;
+}
+declare const Flex: React.ForwardRefExoticComponent<FlexProps<Record<PropertyKey, any>> & React.RefAttributes<HTMLElement>>;
+export default Flex;

package/lib/flex/index.js

@@ -0,0 +1,67 @@
+"use strict";
+
+var __assign = this && this.__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) {
+        if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+      }
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+var __rest = this && this.__rest || function (s, e) {
+  var t = {};
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+var __importDefault = this && this.__importDefault || function (mod) {
+  return mod && mod.__esModule ? mod : {
+    "default": mod
+  };
+};
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var react_1 = __importDefault(require("react"));
+var classnames_1 = __importDefault(require("classnames"));
+var omit_1 = __importDefault(require("rc-util/lib/omit"));
+var gapSize_1 = require("./utils/gapSize");
+var utils_1 = __importDefault(require("./utils"));
+var Flex = react_1["default"].forwardRef(function (props, ref) {
+  var _a;
+  var className = props.className,
+    style = props.style,
+    flex = props.flex,
+    gap = props.gap,
+    children = props.children,
+    _b = props.vertical,
+    vertical = _b === void 0 ? false : _b,
+    _c = props.component,
+    Component = _c === void 0 ? 'div' : _c,
+    othersProps = __rest(props, ["className", "style", "flex", "gap", "children", "vertical", "component"]);
+  var prefixCls = 'as-flex';
+  var flexClassNames = (0, utils_1["default"])(prefixCls, props);
+  var mergedCls = (0, classnames_1["default"])(className, prefixCls, flexClassNames, (_a = {}, _a["".concat(prefixCls, "-gap-").concat(gap)] = (0, gapSize_1.isPresetSize)(gap), _a["".concat(prefixCls, "-vertical")] = vertical, _a));
+  var mergedStyle = __assign({}, style);
+  if (flex) {
+    mergedStyle.flex = flex;
+  }
+  if (gap && !(0, gapSize_1.isPresetSize)(gap)) {
+    mergedStyle.gap = gap;
+  }
+  return react_1["default"].createElement(Component, __assign({
+    ref: ref,
+    className: mergedCls
+  }, (0, omit_1["default"])(othersProps, ['justify', 'wrap', 'align']), {
+    style: mergedStyle
+  }), children);
+});
+exports["default"] = Flex;