@lemon-fe/components 0.1.154 → 1.1.0-alpha.0

package/es/MainFramework/components/TabBar/index.less

@@ -1,155 +0,0 @@
-.@{prefixCls}-nav-tabs-layout {
-  position: relative;
-  display: flex;
-  flex-grow: 1;
-  flex-wrap: nowrap;
-  align-items: flex-end;
-  justify-content: space-between;
-  overflow-x: hidden;
-
-  &-icon {
-    align-self: center;
-  }
-}
-
-.@{prefixCls}-nav-tabs {
-  position: relative;
-  display: flex;
-  flex-wrap: nowrap;
-  align-items: flex-end;
-  padding: 7px 16px 0;
-  overflow-x: hidden;
-
-  &::before {
-    position: absolute;
-    top: 0;
-    left: 0;
-    z-index: 4;
-    display: block;
-    width: 16px;
-    height: 100%;
-    background-color: #fff;
-    border-bottom-right-radius: 10px;
-    content: '';
-  }
-
-  &::after {
-    position: absolute;
-    top: 0;
-    right: 0;
-    z-index: 4;
-    display: block;
-    width: 16px;
-    height: 100%;
-    background-color: #fff;
-    border-bottom-left-radius: 10px;
-    content: '';
-  }
-}
-
-.@{prefixCls}-nav-tab {
-  position: relative;
-  box-sizing: content-box;
-  min-width: 66px;
-  max-width: 120px;
-  height: 43px;
-  cursor: pointer;
-
-  &::before {
-    position: absolute;
-    top: 15px;
-    left: 0;
-    z-index: 5;
-    display: block;
-    width: 1px;
-    height: 12px;
-    background-color: #c4c4c4;
-    opacity: 0.2;
-    content: '';
-  }
-
-  &::after {
-    position: absolute;
-    right: -10px;
-    bottom: 0;
-    left: -10px;
-    z-index: 1;
-    display: block;
-    height: 10px;
-    background-color: #fff;
-    transition: background-color 0.2s;
-    content: '';
-  }
-
-  &-title {
-    position: relative;
-    z-index: 4;
-    display: flex;
-    align-items: center;
-    padding: 7px 12px 14px;
-    background-color: #fff;
-    border-radius: 10px;
-    transition: background-color 0.2s;
-  }
-
-  &:hover:not(&-active) &-title,
-  &:hover:not(&-active)::after {
-    background-color: #f9f9f9;
-  }
-
-  &-active &-title,
-  &-active::after {
-    background-color: #f2f2f2;
-  }
-
-  &:hover::after {
-    z-index: 2;
-  }
-
-  &-active::after {
-    z-index: 3;
-  }
-
-  &-active::before,
-  &-active + &::before,
-  &:hover::before,
-  &:hover + &::before {
-    opacity: 0;
-  }
-
-  &-active &-inner {
-    opacity: 1;
-  }
-
-  &-inner {
-    flex: 1;
-    min-width: 28px;
-    overflow: hidden;
-    color: #333;
-    font-size: 14px;
-    line-height: 22px;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    opacity: 0.7;
-
-    &::after {
-      display: inline-block;
-      width: 16px;
-      content: ' ';
-    }
-  }
-
-  &-close {
-    width: 14px;
-    height: 14px;
-    color: #c4c4c4;
-    line-height: 14px;
-    text-align: center;
-    border-radius: 50%;
-
-    &:hover {
-      color: #f2f2f2;
-      background-color: #c1c1c1;
-    }
-  }
-}

package/es/MainFramework/components/WaterMark/index.d.ts

@@ -1,6 +0,0 @@
-/// <reference types="react" />
-interface Props {
-    waterMark: string;
-}
-export default function WaterMark(props: Props): JSX.Element;
-export {};

package/es/MainFramework/components/WaterMark/index.js

@@ -1,65 +0,0 @@
-import React from 'react';
-import { useEffect, useRef } from 'react';
-import { createPortal } from 'react-dom';
-function createImgBase(options) {
-  var canvas = document.createElement('canvas');
-  var ratio = window.devicePixelRatio;
-  canvas.width = options.width * ratio;
-  canvas.height = options.height * ratio;
-  var ctx = canvas.getContext('2d');
-  if (ctx) {
-    ctx.font = "".concat(options.fontSize * ratio, "px ").concat(options.fontFamily);
-    ctx.fillStyle = options.color;
-    ctx.rotate(options.rotateDegree);
-    ctx.textAlign = 'center';
-    ctx.fillText(options.content, canvas.width / 2, canvas.height / 2);
-  }
-  return canvas.toDataURL('image/png');
-}
-function genWaterMark(_ref) {
-  var className = _ref.className,
-    _ref$width = _ref.width,
-    width = _ref$width === void 0 ? 225 : _ref$width,
-    _ref$height = _ref.height,
-    height = _ref$height === void 0 ? 225 : _ref$height,
-    _ref$content = _ref.content,
-    content = _ref$content === void 0 ? '水印' : _ref$content,
-    _ref$fontFamily = _ref.fontFamily,
-    fontFamily = _ref$fontFamily === void 0 ? '"Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", 微软雅黑, Arial, sans-serif' : _ref$fontFamily,
-    _ref$fontSize = _ref.fontSize,
-    fontSize = _ref$fontSize === void 0 ? 14 : _ref$fontSize,
-    _ref$color = _ref.color,
-    color = _ref$color === void 0 ? 'rgba(156, 162, 169, 0.1)' : _ref$color,
-    _ref$rotate = _ref.rotate,
-    rotate = _ref$rotate === void 0 ? -24 : _ref$rotate;
-  var option = {
-    width: width,
-    height: height,
-    content: content,
-    fontSize: fontSize,
-    fontFamily: fontFamily,
-    color: color,
-    rotateDegree: rotate * Math.PI / 180
-  };
-  // 为了实现交错水印的效果，此处生成两张位置不同的水印 固定相对位置
-  var dataUri = createImgBase(option);
-  return ".".concat(className, " {\n    position: fixed;\n    top: 0;\n    right: 0;\n    bottom: 0;\n    left: 0;\n    z-index: 10000;\n    background-repeat: repeat;\n    background-image: url(").concat(dataUri, "), url(").concat(dataUri, ");\n    background-size: ").concat(option.width, "px ").concat(option.height, "px;\n    background-position: ").concat(width / 2, "px ").concat(height / 2, "px, 0 0;\n    pointer-events: none;\n  }");
-}
-export default function WaterMark(props) {
-  var waterMark = props.waterMark;
-  var ref = useRef(null);
-  var name = 'EVudqS';
-  useEffect(function () {
-    if (waterMark && ref.current !== null) {
-      ref.current.innerHTML = genWaterMark({
-        className: name,
-        content: waterMark
-      });
-    }
-  }, [waterMark]);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement("style", {
-    ref: ref
-  }), document.head), /*#__PURE__*/React.createElement("div", {
-    className: name
-  }));
-}

package/es/MainFramework/index.d.ts

@@ -1,28 +0,0 @@
-import type { ReactElement, ReactNode, CSSProperties } from 'react';
-import type { MenuFavorites, MenuItem } from './typings';
-interface Props<T> {
-    title: string | ReactNode;
-    logo?: string | false | ReactElement;
-    active: number;
-    tabs: T[];
-    onTabClick: (index: number) => void;
-    onTabClose: (index: number) => void;
-    onRefresh: () => void;
-    onCloseOther: () => void;
-    onCloseAll: () => void;
-    menus?: MenuItem[];
-    onMenuClick?: (menu: MenuItem) => void;
-    renderMenu?: () => ReactNode;
-    favorites?: MenuFavorites;
-    onFavoritesChange?: (value: MenuFavorites) => void;
-    right?: ReactNode;
-    children?: ReactNode;
-    className?: string;
-    style?: CSSProperties;
-    waterMark?: string;
-}
-export default function MainFramework<TabType extends {
-    title: string;
-    closable?: boolean;
-}>(props: Props<TabType>): JSX.Element;
-export {};

package/es/MainFramework/index.js

@@ -1,78 +0,0 @@
-import React from 'react';
-import classNames from 'classnames';
-import TabBar from './components/TabBar';
-import Menu from './components/Menu';
-import { PREFIX_CLS as prefixCls } from '../constants';
-import RefreshButton from './components/RefreshButton';
-import WaterMark from './components/WaterMark';
-export default function MainFramework(props) {
-  var className = props.className,
-    tabs = props.tabs,
-    active = props.active,
-    children = props.children,
-    right = props.right,
-    _props$menus = props.menus,
-    menus = _props$menus === void 0 ? [] : _props$menus,
-    onTabClick = props.onTabClick,
-    onMenuClick = props.onMenuClick,
-    onTabClose = props.onTabClose,
-    onRefresh = props.onRefresh,
-    onCloseOther = props.onCloseOther,
-    onCloseAll = props.onCloseAll,
-    logo = props.logo,
-    title = props.title,
-    favorites = props.favorites,
-    onFavoritesChange = props.onFavoritesChange,
-    renderMenu = props.renderMenu,
-    style = props.style,
-    waterMark = props.waterMark;
-  return /*#__PURE__*/React.createElement("div", {
-    className: classNames("".concat(prefixCls, "-main"), className),
-    style: style
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-nav")
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-nav-left")
-  }, logo !== false && /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-nav-logo")
-  }, typeof logo === 'string' ? /*#__PURE__*/React.createElement("img", {
-    src: logo
-  }) : logo || /*#__PURE__*/React.createElement("svg", {
-    width: "15",
-    height: "22",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, /*#__PURE__*/React.createElement("g", {
-    fill: "currentColor",
-    fillRule: "nonzero"
-  }, /*#__PURE__*/React.createElement("path", {
-    d: "M3.403 10.313c.194-.163.393-.324.6-.481 1.47-1.123 2.592-2.339 3.333-3.622a7.805 7.805 0 0 0 1.101-4.036L8.427.966C8.159.657 7.906.335 7.67 0c-.26.384-.544.752-.849 1.103a15.52 15.52 0 0 1-2.336 2.165C2.853 4.514 1.67 5.858.938 7.28c.563 1.06 1.391 2.073 2.461 3.027M3.602 12.008a17.318 17.318 0 0 1-.835-.711C1.782 10.4.99 9.44.402 8.437a8.004 8.004 0 0 0 .362 5.91c.677 1.448 1.812 2.814 3.375 4.053.502.398.981.828 1.434 1.288v-.264a8.913 8.913 0 0 1 .99-4.146c-.687-1.157-1.683-2.256-2.96-3.276M11.025 12.036c-1.482 1.092-2.611 2.27-3.355 3.51a7.355 7.355 0 0 0-1.107 3.91l.008 1.173c.272.298.528.61.764.933.263-.372.549-.73.856-1.07a15.398 15.398 0 0 1 2.346-2.098c2.984-2.196 4.486-4.693 4.463-7.42a7.134 7.134 0 0 0-.489-2.537c-.802 1.278-1.971 2.484-3.486 3.597M11.353 9.828c.186.156.371.317.553.485.945-.983 1.668-2.02 2.156-3.096-.675-1.429-1.765-2.778-3.239-4.01-.496-.411-.968-.856-1.414-1.332v.268a9.617 9.617 0 0 1-.972 4.298c.68 1.201 1.661 2.34 2.917 3.387"
-  })))), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-nav-title")
-  }, title, waterMark && /*#__PURE__*/React.createElement(WaterMark, {
-    waterMark: waterMark
-  }))), /*#__PURE__*/React.createElement(TabBar, {
-    tabs: tabs,
-    active: active,
-    onClick: onTabClick,
-    onClose: onTabClose
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-nav-right")
-  }, /*#__PURE__*/React.createElement(RefreshButton, {
-    onRefresh: onRefresh,
-    onCloseAll: onCloseAll,
-    onCloseOther: onCloseOther
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-nav-divider")
-  }), right)), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-body")
-  }, renderMenu ? /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-menu")
-  }, renderMenu()) : /*#__PURE__*/React.createElement(Menu, {
-    data: menus,
-    onClick: onMenuClick,
-    favorites: favorites,
-    onFavoritesChange: onFavoritesChange
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-content")
-  }, children)));
-}

package/es/MainFramework/index.less

@@ -1,97 +0,0 @@
-@import './components/Menu/index.less';
-@import './components/TabBar/index.less';
-@import './components/DropMenu/index.less';
-@import './components/RefreshButton/index.less';
-
-.@{prefixCls}-main {
-  display: flex;
-  flex-direction: column;
-  width: 100vw;
-  min-width: 768px;
-  height: 100vh;
-  background: #f2f2f2;
-}
-
-.@{prefixCls}-nav {
-  position: relative;
-  z-index: 4;
-  display: flex;
-  flex-wrap: nowrap;
-  align-items: center;
-  box-sizing: border-box;
-  width: 100%;
-  height: 50px;
-  padding: 0 16px;
-  background: #ffff;
-
-  &-logo {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    height: 24px;
-    margin-right: 8px;
-    color: .primary(1) [];
-
-    & > img {
-      display: block;
-      height: 24px;
-      margin: 0 auto;
-    }
-  }
-
-  &-title {
-    color: #000;
-    font-weight: 500;
-    font-size: 16px;
-  }
-
-  &-left,
-  &-right {
-    display: flex;
-    align-items: center;
-  }
-
-  &-left {
-    flex: 0 0 184px;
-    box-sizing: border-box;
-  }
-
-  &-right {
-    flex-shrink: 0;
-    flex-wrap: nowrap;
-  }
-
-  &-divider {
-    width: 1px;
-    height: 14px;
-    margin: 0 9px;
-    background: #c4c4c4;
-  }
-}
-
-.@{prefixCls}-body {
-  position: relative;
-  display: flex;
-  flex: 1;
-  min-height: 0;
-}
-
-.@{prefixCls}-content {
-  position: relative;
-  z-index: 1;
-  flex: 1;
-  min-width: 0;
-
-  &-loading {
-    position: absolute;
-    top: 0;
-    left: 0;
-    z-index: 1;
-  }
-
-  & > div {
-    width: 100%;
-    height: 100%;
-    overflow: auto;
-  }
-}

package/es/MainFramework/typings.d.ts

@@ -1,10 +0,0 @@
-import type { ReactElement } from 'react';
-
-export type MenuItem = {
-  name: string;
-  path?: string;
-  icon?: string | ReactElement;
-  children?: MenuItem[];
-};
-
-export type MenuFavorites = { name: string; path?: string }[];

package/es/Popup/index.d.ts

@@ -1,39 +0,0 @@
-import { ReactElement } from 'react';
-import type { ModalProps } from 'antd/lib/modal';
-export interface PopupProps<ValueType> extends ModalProps {
-    value?: ValueType;
-    onChange?: (value?: ValueType) => void;
-    /**
-     * @description  渲染函数，这个函数不是作为组件渲染的，偷懒可以直接传入组件，如果需要考虑优化参考demo的传入方式
-     */
-    component: (params: {
-        value?: ValueType;
-        onChange: (value: ValueType) => void;
-    }) => ReactElement | null;
-    formatLabel?: (value: ValueType) => string;
-    beforeOk?: (value: ValueType) => ValueType | PromiseLike<ValueType>;
-    /** 确认事件之前校验 */
-    beforeOkCheck?: (value?: ValueType) => boolean | PromiseLike<boolean>;
-    children?: JSX.Element | ((props: {
-        value?: ValueType;
-    }) => JSX.Element);
-    allowClear?: boolean;
-    disabled?: boolean;
-    autoFocus?: boolean;
-    showLabel?: boolean;
-    placeholder?: string;
-    disabledTip?: string;
-    bordered?: boolean;
-    onClick?: () => void;
-    /**
-     * @description 清空后的值
-     */
-    emptyValue?: ValueType;
-}
-interface ValuedPopupProps<ValueType> extends Omit<PopupProps<ValueType>, 'onChange' | 'emptyValue'> {
-    onChange?: (value: ValueType) => void;
-    emptyValue: ValueType;
-}
-declare function Popup<ValueType>(props: ValuedPopupProps<ValueType>): JSX.Element;
-declare function Popup<ValueType>(props: PopupProps<ValueType>): JSX.Element;
-export default Popup;