@daoyi/nmtl-ui 2.0.1-beta.8 → 2.0.1-beta.80

package/lib/components/Dropdown.js

@@ -1 +1,134 @@
-import{a as e}from"./_rollupPluginBabelHelpers-ec4e2a53.js";import n,{useRef as o,useState as t}from"react";import{c as r}from"./index-b2745105.js";import i from"prop-types";import{Button as a,Menu as l,Divider as c,MenuItem as s,ListItemIcon as p,ListItemText as d}from"@material-ui/core";import{makeStyles as u}from"@material-ui/styles";import{s as m}from"./style-inject.es-1f59c1d0.js";m("");var f={default:"outlined",primary:"contained",link:"text"},b=function(i){var m=i.className,b=i.type,v=i.disabled,y=i.children,C=i.icon,E=i.options,g=i.onOpen,h=i.onClose,k=i.getPopupContainer,O=o(null),P=t(!1),j=e(P,2),x=j[0],A=j[1],N=u((function(){return{root:{opacity:.6,pointerEvents:"none",cursor:"pointer"},disabled:!0}}));return n.createElement("div",{className:r("dropdown",m)},n.createElement(a,{id:"basic-button",ref:O,"aria-controls":"basic-menu","aria-haspopup":"true","aria-expanded":x?"true":void 0,onClick:function(){E&&Array.isArray(E)&&E.length>0&&(A(!0),g&&g())},variant:f[b]||"text",startIcon:C||null,disabled:v||!1},y||null),n.createElement(l,{id:"basic-menu",getContentAnchorEl:null,container:k||O.current,anchorOrigin:{vertical:"bottom",horizontal:"center"},transformOrigin:{vertical:"top",horizontal:"center"},anchorEl:O.current,open:x,onClose:function(){A(!1),h&&h()},MenuListProps:{"aria-labelledby":"basic-button"}},E&&Array.isArray(E)&&E.map((function(e,o){return n.createElement("div",{key:o.toString()},e.divider&&n.createElement(c,null),n.createElement(s,{className:e.disabled?N().root:"",onClick:function(){A(!1),h&&h(),e.onClick&&e.onClick({label:e.label,value:e.value})}},e.icon&&n.createElement(p,null,e.icon),e.label&&n.createElement(d,null,e.label)))}))))};b.defaultProps={className:void 0,children:void 0,icon:void 0,type:"link",disabled:void 0,options:void 0,getPopupContainer:void 0,onOpen:void 0,onClose:void 0},b.propTypes={className:i.string,children:i.node,icon:i.node,type:i.oneOf(Object.keys(f)),disabled:i.bool,options:i.arrayOf(i.any),getPopupContainer:i.func,onOpen:i.func,onClose:i.func};export{b as default};
+import { a as _slicedToArray } from './_rollupPluginBabelHelpers-a52356f6.js';
+import React__default, { useRef, useState } from 'react';
+import { c as classNames } from './index-848f4409.js';
+import PropTypes from 'prop-types';
+import { Button, Menu, Divider, MenuItem, ListItemIcon, ListItemText } from '@material-ui/core';
+import { makeStyles } from '@material-ui/styles';
+import { s as styleInject } from './style-inject.es-1f59c1d0.js';
+
+var css_248z = "";
+styleInject(css_248z);
+
+var buttonType = {
+  default: 'outlined',
+  primary: 'contained',
+  link: 'text'
+};
+var Dropdown = function Dropdown(props) {
+  var className = props.className,
+    type = props.type,
+    disabled = props.disabled; // Attributes
+
+  var children = props.children,
+    icon = props.icon; // Node/Elements
+
+  var options = props.options; // Data List
+
+  var onOpen = props.onOpen,
+    _onClose = props.onClose,
+    getPopupContainer = props.getPopupContainer; // Callback List
+
+  var buttonRef = useRef(null);
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    open = _useState2[0],
+    setOpen = _useState2[1];
+  var useStyles = makeStyles(function () {
+    return {
+      root: {
+        opacity: 0.6,
+        pointerEvents: 'none',
+        cursor: 'pointer'
+      },
+      disabled: true
+    };
+  });
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: classNames('dropdown', className)
+  }, /*#__PURE__*/React__default.createElement(Button, {
+    id: "basic-button",
+    ref: buttonRef,
+    "aria-controls": "basic-menu",
+    "aria-haspopup": "true",
+    "aria-expanded": open ? 'true' : undefined,
+    onClick: function onClick() {
+      if (options && Array.isArray(options) && options.length > 0) {
+        setOpen(true);
+        if (onOpen) onOpen();
+      }
+    },
+    variant: buttonType[type] || 'text',
+    startIcon: icon || null,
+    disabled: disabled || false
+  }, children || null), /*#__PURE__*/React__default.createElement(Menu, {
+    id: "basic-menu",
+    getContentAnchorEl: null,
+    container: getPopupContainer || buttonRef.current,
+    anchorOrigin: {
+      vertical: 'bottom',
+      horizontal: 'center'
+    },
+    transformOrigin: {
+      vertical: 'top',
+      horizontal: 'center'
+    },
+    anchorEl: buttonRef.current,
+    open: open,
+    onClose: function onClose() {
+      setOpen(false);
+      if (_onClose) _onClose();
+    },
+    MenuListProps: {
+      'aria-labelledby': 'basic-button'
+    }
+  }, options && Array.isArray(options) && options.map(function (item, index) {
+    return /*#__PURE__*/React__default.createElement("div", {
+      key: index.toString()
+    }, item.divider && /*#__PURE__*/React__default.createElement(Divider, null), /*#__PURE__*/React__default.createElement(MenuItem, {
+      className: item.disabled ? useStyles().root : '',
+      onClick: function onClick() {
+        setOpen(false);
+        if (_onClose) _onClose();
+        if (item.onClick) item.onClick({
+          label: item.label,
+          value: item.value
+        });
+      }
+    }, item.icon && /*#__PURE__*/React__default.createElement(ListItemIcon, null, item.icon), item.label && /*#__PURE__*/React__default.createElement(ListItemText, null, item.label)));
+  })));
+};
+Dropdown.defaultProps = {
+  className: undefined,
+  children: undefined,
+  icon: undefined,
+  type: 'link',
+  disabled: undefined,
+  options: undefined,
+  getPopupContainer: undefined,
+  onOpen: undefined,
+  onClose: undefined
+};
+
+/* Write props detail information and 'npm run updateStory' will help you generate stories's argTypes */
+Dropdown.propTypes = {
+  /** Css Name */
+  className: PropTypes.string,
+  /** 按鈕內容 */
+  children: PropTypes.node,
+  /** 按鈕左側Icon */
+  icon: PropTypes.node,
+  /** 按鈕類型 */
+  type: PropTypes.oneOf(Object.keys(buttonType)),
+  /** Menu按鈕是否禁用 */
+  disabled: PropTypes.bool,
+  /** Menu Data list */
+  options: PropTypes.arrayOf(PropTypes.any),
+  /** Menu content render by node */
+  getPopupContainer: PropTypes.func,
+  /** Menu 開啟 Callback */
+  onOpen: PropTypes.func,
+  /** Menu 關閉 Callback */
+  onClose: PropTypes.func
+};
+
+export { Dropdown as default };

package/lib/components/Empty-67b4d7d7.js

@@ -0,0 +1,45 @@
+import React__default from 'react';
+import PropTypes from 'prop-types';
+import { c as classNames } from './index-848f4409.js';
+import { s as styleInject } from './style-inject.es-1f59c1d0.js';
+
+var img = "data:image/svg+xml,%3csvg class='ant-empty-img-default' width='184' height='152' viewBox='0 0 184 152' xmlns='http://www.w3.org/2000/svg'%3e %3cg fill='none' fill-rule='evenodd'%3e %3cg transform='translate(24 31.67)'%3e %3cellipse fill='%23f5f5f5' fill-opacity='0.8' cx='67.797' cy='106.89' rx='67.797' ry='12.668'%3e%3c/ellipse%3e %3cpath fill='%23aeb8c2' d='M122.034 69.674L98.109 40.229c-1.148-1.386-2.826-2.225-4.593-2.225h-51.44c-1.766 0-3.444.839-4.592 2.225L13.56 69.674v15.383h108.475V69.674z'%3e%3c/path%3e %3cpath fill='url(%23linearGradient-1)' d='M101.537 86.214L80.63 61.102c-1.001-1.207-2.507-1.867-4.048-1.867H31.724c-1.54 0-3.047.66-4.048 1.867L6.769 86.214v13.792h94.768V86.214z' transform='translate(13.56)'%3e%3c/path%3e %3cpath fill='%23f5f5f7' d='M33.83 0h67.933a4 4 0 0 1 4 4v93.344a4 4 0 0 1-4 4H33.83a4 4 0 0 1-4-4V4a4 4 0 0 1 4-4z'%3e%3c/path%3e %3cpath fill='%23dce0e6' d='M42.678 9.953h50.237a2 2 0 0 1 2 2V36.91a2 2 0 0 1-2 2H42.678a2 2 0 0 1-2-2V11.953a2 2 0 0 1 2-2zM42.94 49.767h49.713a2.262 2.262 0 1 1 0 4.524H42.94a2.262 2.262 0 0 1 0-4.524zM42.94 61.53h49.713a2.262 2.262 0 1 1 0 4.525H42.94a2.262 2.262 0 0 1 0-4.525zM121.813 105.032c-.775 3.071-3.497 5.36-6.735 5.36H20.515c-3.238 0-5.96-2.29-6.734-5.36a7.309 7.309 0 0 1-.222-1.79V69.675h26.318c2.907 0 5.25 2.448 5.25 5.42v.04c0 2.971 2.37 5.37 5.277 5.37h34.785c2.907 0 5.277-2.421 5.277-5.393V75.1c0-2.972 2.343-5.426 5.25-5.426h26.318v33.569c0 .617-.077 1.216-.221 1.789z'%3e%3c/path%3e %3c/g%3e %3cpath fill='%23dce0e6' d='M149.121 33.292l-6.83 2.65a1 1 0 0 1-1.317-1.23l1.937-6.207c-2.589-2.944-4.109-6.534-4.109-10.408C138.802 8.102 148.92 0 161.402 0 173.881 0 184 8.102 184 18.097c0 9.995-10.118 18.097-22.599 18.097-4.528 0-8.744-1.066-12.28-2.902z'%3e%3c/path%3e %3cg fill='white' transform='translate(149.65 15.383)'%3e %3cellipse cx='20.654' cy='3.167' rx='2.849' ry='2.815'%3e%3c/ellipse%3e %3cpath d='M5.698 5.63H0L2.898.704zM9.259.704h4.985V5.63H9.259z'%3e%3c/path%3e %3c/g%3e %3c/g%3e%3c/svg%3e";
+
+var css_248z = ".antd-empty {\n  width: 100%;\n  font-size: 1rem;\n  line-height: 1.5715;\n  text-align: center;\n  overflow: hidden;\n  height: 100%; }\n  .antd-empty .ant-empty-image {\n    height: 100px;\n    margin-bottom: 8px; }\n    .antd-empty .ant-empty-image img {\n      height: calc(100% - 22px);\n      margin: auto; }\n  .antd-empty .antd-empty-description {\n    color: rgba(0, 0, 0, 0.85); }\n";
+styleInject(css_248z);
+
+var Empty = function Empty(_ref) {
+  var className = _ref.className,
+    description = _ref.description,
+    emptySrc = _ref.emptySrc,
+    imageStyle = _ref.imageStyle;
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: classNames('antd-empty', className)
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: "ant-empty-image"
+  }, /*#__PURE__*/React__default.createElement("img", {
+    src: emptySrc || img,
+    alt: description,
+    style: imageStyle
+  }), description && /*#__PURE__*/React__default.createElement("div", {
+    className: "ant-empty-description"
+  }, description)));
+};
+Empty.defaultProps = {
+  className: undefined,
+  emptySrc: undefined,
+  description: 'No Data',
+  imageStyle: {}
+};
+Empty.propTypes = {
+  /** Css名稱 */
+  className: PropTypes.string,
+  /** 空白時圖案的Src */
+  emptySrc: PropTypes.string,
+  /** 描述 */
+  description: PropTypes.node,
+  /** 圖案的style */
+  imageStyle: PropTypes.objectOf(PropTypes.any)
+};
+
+export { Empty as E };

package/lib/components/Empty.js

@@ -1 +1,5 @@
-import e from"react";import t from"prop-types";import{c as a}from"./index-b2745105.js";import{s as c}from"./style-inject.es-1f59c1d0.js";c(".antd-empty {\n  width: 100%;\n  font-size: 1rem;\n  line-height: 1.5715;\n  text-align: center;\n  overflow: hidden;\n  height: 100%; }\n  .antd-empty .ant-empty-image {\n    height: 100px;\n    margin-bottom: 8px; }\n    .antd-empty .ant-empty-image img {\n      height: calc(100% - 22px);\n      margin: auto; }\n  .antd-empty .antd-empty-description {\n    color: rgba(0, 0, 0, 0.85); }\n");var i=function(t){var c=t.className,i=t.description,l=t.emptySrc,n=t.imageStyle;return e.createElement("div",{className:a("antd-empty",c)},e.createElement("div",{className:"ant-empty-image"},e.createElement("img",{src:l||"data:image/svg+xml,%3csvg class='ant-empty-img-default' width='184' height='152' viewBox='0 0 184 152' xmlns='http://www.w3.org/2000/svg'%3e %3cg fill='none' fill-rule='evenodd'%3e %3cg transform='translate(24 31.67)'%3e %3cellipse fill='%23f5f5f5' fill-opacity='0.8' cx='67.797' cy='106.89' rx='67.797' ry='12.668'%3e%3c/ellipse%3e %3cpath fill='%23aeb8c2' d='M122.034 69.674L98.109 40.229c-1.148-1.386-2.826-2.225-4.593-2.225h-51.44c-1.766 0-3.444.839-4.592 2.225L13.56 69.674v15.383h108.475V69.674z'%3e%3c/path%3e %3cpath fill='url(%23linearGradient-1)' d='M101.537 86.214L80.63 61.102c-1.001-1.207-2.507-1.867-4.048-1.867H31.724c-1.54 0-3.047.66-4.048 1.867L6.769 86.214v13.792h94.768V86.214z' transform='translate(13.56)'%3e%3c/path%3e %3cpath fill='%23f5f5f7' d='M33.83 0h67.933a4 4 0 0 1 4 4v93.344a4 4 0 0 1-4 4H33.83a4 4 0 0 1-4-4V4a4 4 0 0 1 4-4z'%3e%3c/path%3e %3cpath fill='%23dce0e6' d='M42.678 9.953h50.237a2 2 0 0 1 2 2V36.91a2 2 0 0 1-2 2H42.678a2 2 0 0 1-2-2V11.953a2 2 0 0 1 2-2zM42.94 49.767h49.713a2.262 2.262 0 1 1 0 4.524H42.94a2.262 2.262 0 0 1 0-4.524zM42.94 61.53h49.713a2.262 2.262 0 1 1 0 4.525H42.94a2.262 2.262 0 0 1 0-4.525zM121.813 105.032c-.775 3.071-3.497 5.36-6.735 5.36H20.515c-3.238 0-5.96-2.29-6.734-5.36a7.309 7.309 0 0 1-.222-1.79V69.675h26.318c2.907 0 5.25 2.448 5.25 5.42v.04c0 2.971 2.37 5.37 5.277 5.37h34.785c2.907 0 5.277-2.421 5.277-5.393V75.1c0-2.972 2.343-5.426 5.25-5.426h26.318v33.569c0 .617-.077 1.216-.221 1.789z'%3e%3c/path%3e %3c/g%3e %3cpath fill='%23dce0e6' d='M149.121 33.292l-6.83 2.65a1 1 0 0 1-1.317-1.23l1.937-6.207c-2.589-2.944-4.109-6.534-4.109-10.408C138.802 8.102 148.92 0 161.402 0 173.881 0 184 8.102 184 18.097c0 9.995-10.118 18.097-22.599 18.097-4.528 0-8.744-1.066-12.28-2.902z'%3e%3c/path%3e %3cg fill='white' transform='translate(149.65 15.383)'%3e %3cellipse cx='20.654' cy='3.167' rx='2.849' ry='2.815'%3e%3c/ellipse%3e %3cpath d='M5.698 5.63H0L2.898.704zM9.259.704h4.985V5.63H9.259z'%3e%3c/path%3e %3c/g%3e %3c/g%3e%3c/svg%3e",alt:i,style:n}),i&&e.createElement("div",{className:"ant-empty-description"},i)))};i.defaultProps={className:void 0,emptySrc:void 0,description:"No Data",imageStyle:{}},i.propTypes={className:t.string,emptySrc:t.string,description:t.node,imageStyle:t.objectOf(t.any)};export{i as default};
+export { E as default } from './Empty-67b4d7d7.js';
+import 'react';
+import 'prop-types';
+import './index-848f4409.js';
+import './style-inject.es-1f59c1d0.js';

package/lib/components/ExportButton.js

@@ -1 +1,112 @@
-import{a as t}from"./_rollupPluginBabelHelpers-ec4e2a53.js";import e,{useState as o}from"react";import r from"prop-types";import{c as n}from"./index-b2745105.js";import{ExitToApp as a}from"@material-ui/icons";import{Dialog as i,DialogContent as c,DialogContentText as l,DialogActions as s,Button as p}from"@material-ui/core";import{f as u,j as f,a as x}from"./dataExport-9fccd4f0.js";import{s as m}from"./style-inject.es-1f59c1d0.js";m(".exportButton {\n  display: flex;\n  align-items: center;\n  font-size: 1.5rem;\n  transition: color 0.3s ease-in-out;\n  -webkit-user-select: none;\n          user-select: none; }\n  .exportButton--right {\n    justify-content: flex-end; }\n  .exportButton__text {\n    display: flex;\n    align-items: center;\n    text-decoration: underline;\n    cursor: pointer; }\n    .exportButton__text__icon {\n      font-size: 2rem;\n      margin-right: 4px; }\n    .exportButton__text:hover {\n      font-weight: bold; }\n");var d=function(r){var m=r.className,d=r.color,y=r.right,g=r.forceTxt,T=r.exportText,_=r.exportTypeText,E=r.data,b=o(!1),v=t(b,2),B=v[0],k=v[1],h=[{type:"CSV",click:function(){return u("\ufeff".concat(x(E)),"output.csv")}},{type:"EXCEL",click:function(){return u("\ufeff".concat(x(E)),"output.xls")}},{type:"TXT",click:function(){return u("\ufeff".concat(f(E)),"output.txt")}}];return e.createElement("div",{style:{color:d},className:n("exportButton",{"exportButton--right":y},m)},e.createElement("div",{className:"exportButton__text",onClick:function(){return g?u("\ufeff".concat(f(E)),"output.txt"):k(!0)}},e.createElement(a,{className:"exportButton__text__icon"}),T),e.createElement(i,{open:B,keepMounted:!0,onClose:function(){return k(!1)},"aria-labelledby":"alert-dialog-slide-title","aria-describedby":"alert-dialog-slide-description"},e.createElement(c,null,e.createElement(l,null,_)),e.createElement(s,null,h.map((function(t){var o=t.type,r=t.click;return e.createElement(p,{key:o,variant:"text",onClick:function(){r(),k(!1)}},o)})))))};d.defaultProps={className:void 0,color:"#4e3a16",right:void 0,forceTxt:!0,exportText:"Export",exportTypeText:"Export Type",data:void 0},d.propTypes={className:r.string,color:r.string,right:r.bool,forceTxt:r.bool,exportText:r.string,exportTypeText:r.string,data:r.oneOfType([r.objectOf(r.any),r.arrayOf(r.any)])};export{d as default};
+import { a as _slicedToArray } from './_rollupPluginBabelHelpers-a52356f6.js';
+import React__default, { useState } from 'react';
+import PropTypes from 'prop-types';
+import { c as classNames } from './index-848f4409.js';
+import { ExitToApp } from '@material-ui/icons';
+import { Dialog, DialogContent, DialogContentText, DialogActions, Button } from '@material-ui/core';
+import { f as fileDownload, j as jsonTxt, a as jsonExcel } from './dataExport-04b77185.js';
+import { getIntl } from './globalConfig';
+import { s as styleInject } from './style-inject.es-1f59c1d0.js';
+
+var css_248z = ".exportButton {\n  display: flex;\n  align-items: center;\n  font-size: 1.5rem;\n  transition: color 0.3s ease-in-out;\n  -webkit-user-select: none;\n          user-select: none; }\n  .exportButton--right {\n    justify-content: flex-end; }\n  .exportButton__text {\n    display: flex;\n    align-items: center;\n    text-decoration: underline;\n    cursor: pointer; }\n    .exportButton__text__icon {\n      font-size: 2rem;\n      margin-right: 4px; }\n    .exportButton__text:hover {\n      font-weight: bold; }\n";
+styleInject(css_248z);
+
+var ExportButton = function ExportButton(_ref) {
+  var className = _ref.className,
+    color = _ref.color,
+    right = _ref.right,
+    forceTxt = _ref.forceTxt,
+    exportText = _ref.exportText,
+    exportTypeText = _ref.exportTypeText,
+    data = _ref.data;
+  var _getIntl = getIntl(),
+    formatMessage = _getIntl.formatMessage;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    open = _useState2[0],
+    setOpen = _useState2[1];
+  var buttons = [{
+    type: 'CSV',
+    click: function click() {
+      return fileDownload("\uFEFF".concat(jsonExcel(data)), 'output.csv');
+    }
+  }, {
+    type: 'EXCEL',
+    click: function click() {
+      return fileDownload("\uFEFF".concat(jsonExcel(data)), 'output.xls');
+    }
+  }, {
+    type: 'TXT',
+    click: function click() {
+      return fileDownload("\uFEFF".concat(jsonTxt(data)), 'output.txt');
+    }
+  }];
+  return /*#__PURE__*/React__default.createElement("div", {
+    style: {
+      color: color
+    },
+    className: classNames('exportButton', {
+      'exportButton--right': right
+    }, className)
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: "exportButton__text",
+    onClick: function onClick() {
+      return forceTxt ? fileDownload("\uFEFF".concat(jsonTxt(data)), 'output.txt') : setOpen(true);
+    }
+  }, /*#__PURE__*/React__default.createElement(ExitToApp, {
+    className: "exportButton__text__icon"
+  }), exportText || formatMessage({
+    id: 'common.export'
+  })), /*#__PURE__*/React__default.createElement(Dialog, {
+    open: open,
+    keepMounted: true,
+    onClose: function onClose() {
+      return setOpen(false);
+    },
+    "aria-labelledby": "alert-dialog-slide-title",
+    "aria-describedby": "alert-dialog-slide-description"
+  }, /*#__PURE__*/React__default.createElement(DialogContent, null, /*#__PURE__*/React__default.createElement(DialogContentText, null, exportTypeText || formatMessage({
+    id: 'common.export.type'
+  }))), /*#__PURE__*/React__default.createElement(DialogActions, null, buttons.map(function (_ref2) {
+    var type = _ref2.type,
+      click = _ref2.click;
+    return /*#__PURE__*/React__default.createElement(Button, {
+      key: type,
+      variant: "text",
+      onClick: function onClick() {
+        click();
+        setOpen(false);
+      }
+    }, type);
+  }))));
+};
+ExportButton.defaultProps = {
+  className: undefined,
+  color: '#4e3a16',
+  right: undefined,
+  forceTxt: true,
+  // 聽說Excel怪怪的 先強制隱藏
+  exportText: undefined,
+  exportTypeText: 'Export Type',
+  data: undefined
+};
+
+/* Write props detail information and 'npm run updateStory' will help you generate stories's argTypes */
+ExportButton.propTypes = {
+  /** Css Name */
+  className: PropTypes.string,
+  /** 主題顏色 */
+  color: PropTypes.string,
+  /** 靠右起來 */
+  right: PropTypes.bool,
+  /** 匯出是否強制txt */
+  forceTxt: PropTypes.bool,
+  /** 匯出的文字 */
+  exportText: PropTypes.string,
+  /** 匯出類型的文字 */
+  exportTypeText: PropTypes.string,
+  /** 要匯出的JSON資料 */
+  data: PropTypes.oneOfType([PropTypes.objectOf(PropTypes.any), PropTypes.arrayOf(PropTypes.any)])
+};
+
+export { ExportButton as default };