@daoyi/nmtl-ui 2.0.1-beta.44 → 2.0.1-beta.46

package/lib/components/Breadcrumbs.js

@@ -1 +1,122 @@
-import e from"react";import{s as t,c as r}from"./vendor-851c6356.js";import a from"prop-types";import{NavLink as n}from"react-router-dom";import{Typography as o,Breadcrumbs as i}from"@material-ui/core";import"react-is";import"@material-ui/styles";import"react-dom";t(".breadcrumbItem {\n  display: flex;\n  opacity: 0.8;\n  transition: opacity 0.1s ease-in-out; }\n  .breadcrumbItem:hover {\n    opacity: 1; }\n  .breadcrumbItem--last {\n    opacity: 1;\n    font-weight: 500 !important; }\n  .breadcrumbItem__icon {\n    display: flex;\n    align-items: center;\n    margin-right: 4px; }\n    .breadcrumbItem__icon svg {\n      font-size: 18px; }\n");const c=t=>{let{className:a,icon:n,text:i,lastItem:c,onClick:m}=t;return e.createElement(o,{color:"textPrimary",className:a,onClick:m},e.createElement("div",{className:r("breadcrumbItem",{"breadcrumbItem--last":c})},n&&e.createElement("span",{className:"breadcrumbItem__icon"},n),e.createElement("span",{className:"breadcrumbItem__text"},i)))};c.defaultProps={className:void 0,icon:void 0,text:void 0,lastItem:void 0,onClick:()=>{}},c.propTypes={className:a.string,icon:a.node,text:a.string,lastItem:a.bool,onClick:a.func};t(".breadcrumbs__link {\n  cursor: pointer;\n  text-decoration: none !important; }\n");var m=function(t){var a=t.className,o=t.links,m=t.separator;return e.createElement(i,{className:r("breadcrumbs",a),"aria-label":"breadcrumb",separator:m&&m.length>0?m:void 0},Array.isArray(o)&&o.length>0&&o.map((function(t,r){var a=t.icon,i=t.text,m=t.href,s=t.onClick;return r===o.length-1?e.createElement(c,{key:r.toString(),lastItem:!0,icon:a,text:i,onClick:s}):0===r?e.createElement(n,{className:"breadcrumbs__link",key:r.toString(),to:m||"/",onClick:s},e.createElement(c,{icon:a,text:i})):m?e.createElement(n,{className:"breadcrumbs__link",key:r.toString(),to:m,onClick:s},e.createElement(c,{icon:a,text:i})):e.createElement(c,{key:r.toString(),lastItem:!0,icon:a,text:i,onClick:s})})))};m.defaultProps={className:void 0,links:void 0,separator:void 0},m.propTypes={className:a.string,links:a.arrayOf(a.any),separator:a.string};export{m as default};
+import React__default from 'react';
+import { c as classNames } from './index-f491ebce.js';
+import PropTypes from 'prop-types';
+import { NavLink } from 'react-router-dom';
+import { Typography, Breadcrumbs as Breadcrumbs$1 } from '@material-ui/core';
+import { s as styleInject } from './style-inject.es-1f59c1d0.js';
+
+var css_248z$1 = ".breadcrumbItem {\n  display: flex;\n  opacity: 0.8;\n  transition: opacity 0.1s ease-in-out; }\n  .breadcrumbItem:hover {\n    opacity: 1; }\n  .breadcrumbItem--last {\n    opacity: 1;\n    font-weight: 500 !important; }\n  .breadcrumbItem__icon {\n    display: flex;\n    align-items: center;\n    margin-right: 4px; }\n    .breadcrumbItem__icon svg {\n      font-size: 18px; }\n";
+styleInject(css_248z$1);
+
+const BreadcrumbItem = _ref => {
+  let {
+    className,
+    icon,
+    text,
+    lastItem,
+    onClick
+  } = _ref;
+  return /*#__PURE__*/React__default.createElement(Typography, {
+    color: "textPrimary",
+    className: className,
+    onClick: onClick
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: classNames('breadcrumbItem', {
+      'breadcrumbItem--last': lastItem
+    })
+  }, icon && /*#__PURE__*/React__default.createElement("span", {
+    className: "breadcrumbItem__icon"
+  }, icon), /*#__PURE__*/React__default.createElement("span", {
+    className: "breadcrumbItem__text"
+  }, text)));
+};
+BreadcrumbItem.defaultProps = {
+  className: undefined,
+  icon: undefined,
+  text: undefined,
+  lastItem: undefined,
+  onClick: () => {}
+};
+BreadcrumbItem.propTypes = {
+  className: PropTypes.string,
+  icon: PropTypes.node,
+  text: PropTypes.string,
+  lastItem: PropTypes.bool,
+  onClick: PropTypes.func
+};
+
+var css_248z = ".breadcrumbs__link {\n  cursor: pointer;\n  text-decoration: none !important; }\n";
+styleInject(css_248z);
+
+var Breadcrumbs = function Breadcrumbs(_ref) {
+  var className = _ref.className,
+    links = _ref.links,
+    separator = _ref.separator;
+  return /*#__PURE__*/React__default.createElement(Breadcrumbs$1, {
+    className: classNames('breadcrumbs', className),
+    "aria-label": "breadcrumb",
+    separator: separator && separator.length > 0 ? separator : undefined
+  }, Array.isArray(links) && links.length > 0 && links.map(function (_ref2, i) {
+    var icon = _ref2.icon,
+      text = _ref2.text,
+      href = _ref2.href,
+      onClick = _ref2.onClick;
+    var lastLink = i === links.length - 1;
+
+    /* 尾巴 */
+    if (lastLink) return /*#__PURE__*/React__default.createElement(BreadcrumbItem, {
+      key: i.toString(),
+      lastItem: true,
+      icon: icon,
+      text: text,
+      onClick: onClick
+    });
+
+    /* 頭 */
+    if (i === 0) {
+      return /*#__PURE__*/React__default.createElement(NavLink, {
+        className: "breadcrumbs__link",
+        key: i.toString(),
+        to: href || '/',
+        onClick: onClick
+      }, /*#__PURE__*/React__default.createElement(BreadcrumbItem, {
+        icon: icon,
+        text: text
+      }));
+    }
+
+    /* 中間 */
+    return href ? /*#__PURE__*/React__default.createElement(NavLink, {
+      className: "breadcrumbs__link",
+      key: i.toString(),
+      to: href,
+      onClick: onClick
+    }, /*#__PURE__*/React__default.createElement(BreadcrumbItem, {
+      icon: icon,
+      text: text
+    })) : /*#__PURE__*/React__default.createElement(BreadcrumbItem, {
+      key: i.toString(),
+      lastItem: true,
+      icon: icon,
+      text: text,
+      onClick: onClick
+    });
+  }));
+};
+Breadcrumbs.defaultProps = {
+  className: undefined,
+  links: undefined,
+  separator: undefined
+};
+
+/* Write props detail information and 'npm run updateStory' will help you generate stories's argTypes */
+Breadcrumbs.propTypes = {
+  /** Css Name */
+  className: PropTypes.string,
+  /** 麵包穴的連結們 */
+  links: PropTypes.arrayOf(PropTypes.any),
+  /** 分割者的符號 */
+  separator: PropTypes.string
+};
+
+export { Breadcrumbs as default };

package/lib/components/Button-2f8f0493.js

@@ -0,0 +1,92 @@
+import React__default from 'react';
+import PropTypes from 'prop-types';
+import { c as classNames } from './index-f491ebce.js';
+import { Button as Button$1, CircularProgress } from '@material-ui/core';
+import { s as styleInject } from './style-inject.es-1f59c1d0.js';
+
+var css_248z = ".button {\n  border: 1px solid #ffffff99;\n  border-radius: 45px;\n  padding: 8px 16px;\n  background: #007bff;\n  color: white;\n  cursor: pointer; }\n  .button:hover {\n    opacity: 0.9; }\n";
+styleInject(css_248z);
+
+var Button = function Button(props) {
+  var style = props.style,
+    className = props.className,
+    tabIndex = props.tabIndex,
+    alt = props.alt,
+    text = props.text,
+    size = props.size,
+    variant = props.variant;
+  var type = props.type,
+    color = props.color,
+    loading = props.loading,
+    disabled = props.disabled,
+    icon = props.icon,
+    endIcon = props.endIcon,
+    children = props.children,
+    onClick = props.onClick;
+  return /*#__PURE__*/React__default.createElement(Button$1, {
+    style: style,
+    className: classNames('button', className),
+    tabIndex: tabIndex,
+    alt: alt,
+    size: size,
+    variant: variant,
+    color: type || color,
+    disabled: loading || disabled,
+    onClick: onClick,
+    startIcon: icon,
+    endIcon: loading ? /*#__PURE__*/React__default.createElement(CircularProgress, {
+      size: 16
+    }) : endIcon
+  }, text, children);
+};
+Button.defaultProps = {
+  style: undefined,
+  className: undefined,
+  tabIndex: undefined,
+  alt: undefined,
+  text: undefined,
+  loading: false,
+  disabled: false,
+  variant: undefined,
+  size: 'small',
+  color: 'primary',
+  type: undefined,
+  children: undefined,
+  icon: undefined,
+  endIcon: undefined,
+  onClick: function onClick() {}
+};
+Button.propTypes = {
+  /** 樣式 */
+  style: PropTypes.objectOf(PropTypes.any),
+  /** Css Name */
+  className: PropTypes.string,
+  /** Tab 鍵位置 */
+  tabIndex: PropTypes.number,
+  /** 註解 */
+  alt: PropTypes.string,
+  /** 輸入的文字 */
+  text: PropTypes.string,
+  /** 是否載入中 */
+  loading: PropTypes.bool,
+  /** 是否禁用 */
+  disabled: PropTypes.bool,
+  /** 按鈕種類 */
+  variant: PropTypes.oneOf(['contained', 'outlined', 'text']),
+  /** 按鈕的大小 */
+  size: PropTypes.oneOf(['small', 'medium', 'large']),
+  /** 按鈕顏色 */
+  color: PropTypes.oneOf(['default', 'inherit', 'primary', 'secondary']),
+  /** 按鈕樣式(同按鈕顏色) */
+  type: PropTypes.oneOf(['default', 'inherit', 'primary', 'secondary']),
+  /** 按鈕內容 */
+  children: PropTypes.node,
+  /** 按鈕圖案(前面) */
+  icon: PropTypes.node,
+  /** 按鈕圖案(後面) */
+  endIcon: PropTypes.node,
+  /** 點擊後的返回 */
+  onClick: PropTypes.func
+};
+
+export { Button as B };

package/lib/components/Button.js

@@ -1 +1,6 @@
-export{B as default}from"./Button-63c7e9f3.js";import"react";import"prop-types";import"./vendor-851c6356.js";import"react-is";import"@material-ui/styles";import"react-dom";import"@material-ui/core";
+export { B as default } from './Button-2f8f0493.js';
+import 'react';
+import 'prop-types';
+import './index-f491ebce.js';
+import '@material-ui/core';
+import './style-inject.es-1f59c1d0.js';