@zykj2024/much-library 1.1.7-beta.3 → 1.1.7-beta.5

package/dist/McEllipsisMiddle/demo/base.d.ts

@@ -0,0 +1,6 @@
+/**
+ * title: 基础用法
+ * description: 中间省略号，超出时展示省略号，并且移入会有tooltip
+ */
+declare const _default: () => import("react/jsx-runtime").JSX.Element;
+export default _default;

package/dist/McEllipsisMiddle/demo/base.js

@@ -0,0 +1,25 @@
+/**
+ * title: 基础用法
+ * description: 中间省略号，超出时展示省略号，并且移入会有tooltip
+ */
+
+import { McEllipsisMiddle } from "../..";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export default (function () {
+  return /*#__PURE__*/_jsxs("div", {
+    children: [/*#__PURE__*/_jsx(McEllipsisMiddle, {
+      style: {
+        width: 250
+      },
+      text: "\u8FD9\u662F\u4E00\u6BB5\u6CA1\u6709\u6EA2\u51FA\u7684\u6587\u5B57",
+      suffixCount: 4
+    }), /*#__PURE__*/_jsx(McEllipsisMiddle, {
+      style: {
+        width: 250
+      },
+      text: "\u8FD9\u662F\u4E00\u6BB5\u6709\u6EA2\u51FA\u7684\u6587\u5B57\uFF0C\u8FD9\u662F\u4E00\u6BB5\u6709\u6EA2\u51FA\u7684\u6587\u5B57",
+      suffixCount: 4
+    })]
+  });
+});

package/dist/McEllipsisMiddle/demo/tooltip.d.ts

@@ -0,0 +1,6 @@
+/**
+ * title: 进阶用法
+ * description: 自定义tooltip。和默认tooltip不同的是：1. 内容可以自定义 2. 及时没有出现省略号，也会展示tooltip
+ */
+declare const _default: () => import("react/jsx-runtime").JSX.Element;
+export default _default;

package/dist/McEllipsisMiddle/demo/tooltip.js

@@ -0,0 +1,35 @@
+/**
+ * title: 进阶用法
+ * description: 自定义tooltip。和默认tooltip不同的是：1. 内容可以自定义 2. 及时没有出现省略号，也会展示tooltip
+ */
+
+import { McEllipsisMiddle } from "../..";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export default (function () {
+  return /*#__PURE__*/_jsxs("div", {
+    children: [/*#__PURE__*/_jsx(McEllipsisMiddle, {
+      style: {
+        width: 250
+      },
+      tooltip: "\u8FD9\u662Ftooltip\u7684\u5185\u5BB9",
+      noTooltip: true,
+      symbol: function symbol() {
+        return /*#__PURE__*/_jsx("div", {
+          children: "123"
+        });
+      },
+      text: "\u6587\u5B57\u548Ctooltip\u4F7F\u7528\u4E0D\u540C\u7684\u5185\u5BB9,\u6587\u5B57\u548Ctooltip\u4F7F\u7528\u4E0D\u540C\u7684\u5185\u5BB9",
+      suffixCount: 4
+    }), /*#__PURE__*/_jsx(McEllipsisMiddle, {
+      style: {
+        width: 150,
+        marginLeft: 12
+      },
+      tooltip: "\u8FD9\u662Ftooltip\u7684\u5185\u5BB9",
+      noTooltip: true,
+      text: "\u6211\u4E0D\u7F29\u4E5F\u4F1A\u5C55\u793Atooltip",
+      suffixCount: 4
+    })]
+  });
+});

package/dist/McEllipsisMiddle/index.css

@@ -0,0 +1,4 @@
+.mc-ellipsis-middle,
+.mc-ellipsis-middle * {
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
+}

package/dist/McEllipsisMiddle/index.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { TextProps } from 'antd/es/typography/Text';
+import './index.less';
+export interface McEllipsisMiddleProps extends TextProps {
+    text: string;
+    /** 自定义tooltip时, 无论是否省略都会展示 */
+    tooltip?: string;
+    /** 省略号结尾显示的字个数 */
+    suffixCount: number;
+    style?: React.CSSProperties;
+    className?: string;
+}
+export declare const McEllipsisMiddle: ({ text, tooltip, suffixCount, style, className, ...rest }: McEllipsisMiddleProps) => import("react/jsx-runtime").JSX.Element;

package/dist/McEllipsisMiddle/index.js

@@ -0,0 +1,42 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["text", "tooltip", "suffixCount", "style", "className"];
+import { Tooltip, Typography } from 'antd';
+import "./index.css";
+
+/** 中间省略 */
+import { jsx as _jsx } from "react/jsx-runtime";
+var Text = Typography.Text;
+export var McEllipsisMiddle = function McEllipsisMiddle(_ref) {
+  var text = _ref.text,
+    tooltip = _ref.tooltip,
+    suffixCount = _ref.suffixCount,
+    style = _ref.style,
+    className = _ref.className,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var labelStr = String(text || '').trim();
+  var isBeyond = labelStr.length > suffixCount;
+  var start = isBeyond ? labelStr.slice(0, labelStr.length - suffixCount) : labelStr;
+  var suffix = isBeyond ? labelStr.slice(-suffixCount).trim() : '';
+  var renderText = function renderText(noTooltip) {
+    return /*#__PURE__*/_jsx(Text, _objectSpread(_objectSpread({
+      className: ['mc-ellipsis-middle', className].filter(Boolean).join(' '),
+      style: _objectSpread({
+        width: '100%'
+      }, style),
+      ellipsis: {
+        tooltip: !noTooltip && labelStr ? labelStr : false,
+        suffix: suffix
+      }
+    }, rest), {}, {
+      children: start
+    }));
+  };
+  if (tooltip) {
+    return /*#__PURE__*/_jsx(Tooltip, {
+      title: tooltip,
+      children: renderText(true)
+    });
+  }
+  return renderText(false);
+};

package/dist/McFonts/index.d.ts

@@ -0,0 +1,8 @@
+declare const _default: {
+    Regular: string;
+    Bold: string;
+    Light: string;
+    Medium: string;
+    Alphanumeric: string;
+};
+export default _default;

package/dist/McFonts/index.js

@@ -0,0 +1,7 @@
+export default {
+  Regular: 'https://orchardplanet.oss-cn-shenzhen.aliyuncs.com/fonts/SourceHanSansCN-Regular.otf',
+  Bold: 'https://orchardplanet.oss-cn-shenzhen.aliyuncs.com/fonts/SourceHanSansCN-Bold.otf',
+  Light: 'https://orchardplanet.oss-cn-shenzhen.aliyuncs.com/fonts/SourceHanSansCN-Light.otf',
+  Medium: 'https://orchardplanet.oss-cn-shenzhen.aliyuncs.com/fonts/SourceHanSansCN-Medium.otf',
+  Alphanumeric: 'https://orchardplanet.oss-cn-shenzhen.aliyuncs.com/fonts/FF-DIN-Pro-Bold.otf'
+};

package/dist/McGroupPanel/comps/SelectedItem/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import '../../index.less';
+declare const _default: import("react").MemoExoticComponent<({ sortable, itemMap, inexistent, text, color, reserved, inexistentItemMap, value, onRemove, }: any) => import("react/jsx-runtime").JSX.Element>;
+export default _default;

package/dist/McGroupPanel/comps/SelectedItem/index.js

@@ -0,0 +1,75 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import { useSortable } from '@dnd-kit/sortable';
+import { Button, Typography } from 'antd';
+import { MenuOutlined } from 'much-icons';
+import { McIconFont } from "../../..";
+import { memo, useMemo } from 'react';
+import "../../index.css";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var SelectedItem = function SelectedItem(_ref) {
+  var sortable = _ref.sortable,
+    itemMap = _ref.itemMap,
+    inexistent = _ref.inexistent,
+    text = _ref.text,
+    color = _ref.color,
+    reserved = _ref.reserved,
+    inexistentItemMap = _ref.inexistentItemMap,
+    value = _ref.value,
+    onRemove = _ref.onRemove;
+  var _label = useMemo(function () {
+    var _itemMap$value, _inexistentItemMap$va;
+    var label = ((_itemMap$value = itemMap[value]) === null || _itemMap$value === void 0 ? void 0 : _itemMap$value.label) || "".concat((_inexistentItemMap$va = inexistentItemMap[value]) === null || _inexistentItemMap$va === void 0 ? void 0 : _inexistentItemMap$va.label).concat(inexistent && !reserved ? "\u300C".concat(text, "\u300D") : '');
+    var fn = function fn() {
+      var isTooltip = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+      return /*#__PURE__*/_jsx("span", {
+        style: {
+          color: !itemMap[value] && inexistent && !reserved ? color : isTooltip ? '#ffffff' : '#262626'
+        },
+        children: label
+      });
+    };
+    return fn;
+  }, [itemMap, inexistent, text, color, reserved, inexistentItemMap, value]);
+  var _useSortable = useSortable({
+      id: value
+    }),
+    setNodeRef = _useSortable.setNodeRef,
+    attributes = _useSortable.attributes,
+    listeners = _useSortable.listeners,
+    transform = _useSortable.transform,
+    transition = _useSortable.transition,
+    isDragging = _useSortable.isDragging;
+  var style = transform ? {
+    transform: "translate3d(".concat(transform.x, "px, ").concat(transform.y, "px, 0)"),
+    transition: isDragging ? 'unset' : transition
+  } : {
+    transition: 'unset'
+  };
+  return /*#__PURE__*/_jsxs("div", _objectSpread(_objectSpread({
+    ref: setNodeRef,
+    style: style
+  }, attributes), {}, {
+    className: "mc-group-panel__selected-item",
+    children: [sortable && /*#__PURE__*/_jsx(Button, _objectSpread(_objectSpread({}, listeners), {}, {
+      className: "mc-group-panel__selected-item__drag",
+      type: "text",
+      icon: /*#__PURE__*/_jsx(MenuOutlined, {})
+    })), /*#__PURE__*/_jsx(Typography.Paragraph, {
+      style: {
+        margin: '0 auto 0 4px'
+      },
+      ellipsis: {
+        tooltip: _label(true)
+      },
+      children: _label()
+    }), /*#__PURE__*/_jsx(McIconFont, {
+      className: "mc-group-panel__selected-item__remove",
+      type: "icon-CloseOutlined",
+      onClick: onRemove
+    }), !itemMap[value] && reserved && /*#__PURE__*/_jsx("div", {
+      className: "mc-group-panel__selected-item--disabled"
+    })]
+  }));
+};
+export default /*#__PURE__*/memo(SelectedItem);

package/dist/McGroupPanel/index.css

@@ -0,0 +1,169 @@
+.mc-group-panel {
+  width: 100%;
+  height: 341px;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-column-gap: 8px;
+  -moz-column-gap: 8px;
+  column-gap: 8px;
+  position: relative;
+}
+.mc-group-panel__card-header {
+  height: 40px;
+  background: #fafafa;
+  padding: 0 8px;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: justify;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+}
+.mc-group-panel__card-title {
+  color: rgba(0, 0, 0, 0.847);
+  font-weight: 600;
+  font-size: 14px;
+}
+.mc-group-panel__card-icon {
+  color: #8c8c8c;
+}
+.mc-group-panel__card-body {
+  height: calc(100% - 40px);
+  overflow: auto;
+  padding: 8px;
+}
+.mc-group-panel__options {
+  border-radius: 4px;
+  border: 1px solid #ebebeb;
+  overflow: hidden;
+  -webkit-box-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+}
+.mc-group-panel__options-wrapper {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  height: calc(100% - 40px);
+}
+.mc-group-panel__options-groups {
+  -webkit-box-flex: 1;
+  -ms-flex: 1 1 44%;
+  flex: 1 1 44%;
+  overflow: auto;
+}
+.mc-group-panel__options-items {
+  -webkit-box-flex: 1;
+  -ms-flex: 1 1 56%;
+  flex: 1 1 56%;
+  border-left: 1px solid #ebebeb;
+  overflow: auto;
+  padding-bottom: 20px;
+}
+.mc-group-panel__options-list {
+  height: calc(100% - 40px);
+  overflow: auto;
+}
+.mc-group-panel__search-bar {
+  padding: 0 12px;
+}
+.mc-group-panel__checkbox-wrapper {
+  width: 100%;
+  height: 40px;
+  line-height: 40px;
+  padding: 0 12px;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+.mc-group-panel__checkbox-wrapper:not(.mc-group-panel__check-all):hover {
+  background: #f6f6f6;
+  cursor: pointer;
+}
+.mc-group-panel__checkbox {
+  width: 100%;
+  height: 40px;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding: 0 12px;
+}
+.mc-group-panel__checkbox .ant-checkbox + span {
+  overflow: hidden;
+}
+.mc-group-panel__checkbox:hover {
+  background: #f6f6f6;
+}
+.mc-group-panel__selected {
+  border-radius: 4px;
+  border: 1px solid #ebebeb;
+  overflow: hidden;
+  width: 240px;
+}
+.mc-group-panel__selected-item {
+  width: 100%;
+  height: 40px;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding: 0 8px;
+  background: #f5f5f5;
+  border-radius: 4px;
+  overflow: hidden;
+  position: relative;
+}
+.mc-group-panel__selected-item:not(:first-child) {
+  margin-top: 8px;
+}
+.mc-group-panel__selected-item__drag {
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  color: #8c8c8c;
+  padding: 5px 0 3px;
+}
+.mc-group-panel__selected-item__drag:hover {
+  background: rgba(38, 38, 38, 0.15) !important;
+  cursor: move;
+}
+.mc-group-panel__selected-item__remove {
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  color: #8c8c8c;
+  margin-left: 8px;
+}
+.mc-group-panel__selected-item__remove:hover {
+  cursor: pointer;
+  color: #262626;
+}
+.mc-group-panel__selected-item--disabled {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 9;
+  border-radius: 4px;
+  background: rgba(246, 246, 246, 0.66);
+  cursor: no-drop;
+}
+.mc-group-panel--disabled {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 9;
+  border-radius: 4px;
+  background: rgba(228, 228, 228, 0.3);
+  cursor: no-drop;
+}

package/dist/McGroupPanel/index.d.ts

@@ -0,0 +1,30 @@
+import { CSSProperties, FC } from 'react';
+import './index.less';
+type Option = {
+    value: any;
+    label: string;
+    [key: string]: any;
+};
+type Options = Array<Option & {
+    children: Option[];
+}>;
+type Inexistent = {
+    text?: string;
+    color?: string;
+    reserved?: boolean;
+};
+type PropsType = {
+    style?: CSSProperties;
+    className?: string;
+    options?: Options;
+    disabled?: boolean;
+    labelInValue?: boolean;
+    inexistent?: boolean | Inexistent;
+    sortable?: boolean;
+    title?: string;
+    value?: any[];
+    onChange?: (value?: any[]) => void;
+    [key: string]: any;
+};
+declare const McGroupPanel: FC<PropsType>;
+export default McGroupPanel;