amis 1.3.5-beta.7 → 1.4.2-beta.11

package/lib/components/Button.js

@@ -10,18 +10,19 @@ var react_1 = (0, tslib_1.__importDefault)(require("react"));
 var TooltipWrapper_1 = (0, tslib_1.__importDefault)(require("./TooltipWrapper"));
 var helper_1 = require("../utils/helper");
 var theme_1 = require("../theme");
+var icons_1 = require("./icons");
 var Button = /** @class */ (function (_super) {
     (0, tslib_1.__extends)(Button, _super);
     function Button() {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     Button.prototype.renderButton = function () {
-        var _a;
-        var _b = this.props, level = _b.level, size = _b.size, disabled = _b.disabled, className = _b.className, Comp = _b.componentClass, cx = _b.classnames, children = _b.children, disabledTip = _b.disabledTip, block = _b.block, type = _b.type, active = _b.active, iconOnly = _b.iconOnly, href = _b.href, overrideClassName = _b.overrideClassName, rest = (0, tslib_1.__rest)(_b, ["level", "size", "disabled", "className", "componentClass", "classnames", "children", "disabledTip", "block", "type", "active", "iconOnly", "href", "overrideClassName"]);
+        var _a, _b;
+        var _c = this.props, level = _c.level, size = _c.size, disabled = _c.disabled, className = _c.className, Comp = _c.componentClass, cx = _c.classnames, children = _c.children, disabledTip = _c.disabledTip, block = _c.block, type = _c.type, active = _c.active, iconOnly = _c.iconOnly, href = _c.href, loading = _c.loading, loadingClassName = _c.loadingClassName, overrideClassName = _c.overrideClassName, rest = (0, tslib_1.__rest)(_c, ["level", "size", "disabled", "className", "componentClass", "classnames", "children", "disabledTip", "block", "type", "active", "iconOnly", "href", "loading", "loadingClassName", "overrideClassName"]);
         if (href) {
             Comp = 'a';
         }
-        else if (Comp === 'button' && disabled) {
+        else if ((Comp === 'button' && disabled) || loading) {
             Comp = 'div';
         }
         return (react_1.default.createElement(Comp, (0, tslib_1.__assign)({ type: Comp === 'input' || Comp === 'button' ? type : undefined }, (0, helper_1.pickEventsProps)(rest), { href: href, className: cx(overrideClassName
@@ -35,17 +36,22 @@ var Button = /** @class */ (function (_super) {
                     _a["Button--iconOnly"] = iconOnly,
                     _a['is-disabled'] = disabled,
                     _a['is-active'] = active,
-                    _a), className), disabled: disabled }), children));
+                    _a), className), disabled: disabled }),
+            loading && !disabled ? (react_1.default.createElement("span", { className: cx(overrideClassName
+                    ? ''
+                    : (_b = {}, _b["Button--loading Button--loading--" + level] = level, _b), loadingClassName) },
+                react_1.default.createElement(icons_1.Icon, { icon: "loading-outline", className: "icon" }))) : null,
+            children));
     };
     Button.prototype.render = function () {
-        var _a = this.props, tooltip = _a.tooltip, placement = _a.placement, tooltipContainer = _a.tooltipContainer, tooltipTrigger = _a.tooltipTrigger, tooltipRootClose = _a.tooltipRootClose, disabled = _a.disabled, disabledTip = _a.disabledTip, cx = _a.classnames;
-        return (react_1.default.createElement(TooltipWrapper_1.default, { placement: placement, tooltip: disabled ? disabledTip : tooltip, container: tooltipContainer, trigger: tooltipTrigger, rootClose: tooltipRootClose }, this.renderButton()));
+        var _a = this.props, tooltip = _a.tooltip, tooltipPlacement = _a.tooltipPlacement, tooltipContainer = _a.tooltipContainer, tooltipTrigger = _a.tooltipTrigger, tooltipRootClose = _a.tooltipRootClose, disabled = _a.disabled, disabledTip = _a.disabledTip, cx = _a.classnames;
+        return (react_1.default.createElement(TooltipWrapper_1.default, { placement: tooltipPlacement, tooltip: disabled ? disabledTip : tooltip, container: tooltipContainer, trigger: tooltipTrigger, rootClose: tooltipRootClose }, this.renderButton()));
     };
     Button.defaultProps = {
         componentClass: 'button',
         level: 'default',
         type: 'button',
-        placement: 'top',
+        tooltipPlacement: 'top',
         tooltipTrigger: ['hover', 'focus'],
         tooltipRootClose: false
     };

package/lib/components/Button.js.map

@@ -6,8 +6,8 @@
         "/src/components/Button.tsx"
     ],
     "names": [],
-    "mappings": ";AAAA;;;GAGG;;;;AAEH,6DAA0B;AAC1B,iFAAwE;AACxE,0CAAgD;AAChD,kCAAiD;AAyBjD;IAA4B,uCAA4B;IAAxD;;IA6FA,CAAC;IA3EC,6BAAY,GAAZ;;QACE,IAAI,KAgBA,IAAI,CAAC,KAAK,EAfZ,KAAK,WAAA,EACL,IAAI,UAAA,EACJ,QAAQ,cAAA,EACR,SAAS,eAAA,EACO,IAAI,oBAAA,EACR,EAAE,gBAAA,EACd,QAAQ,cAAA,EACR,WAAW,iBAAA,EACX,KAAK,WAAA,EACL,IAAI,UAAA,EACJ,MAAM,YAAA,EACN,QAAQ,cAAA,EACR,IAAI,UAAA,EACJ,iBAAiB,uBAAA,EACd,IAAI,2BAfL,yKAgBH,CAAa,CAAC;QAEf,IAAI,IAAI,EAAE;YACR,IAAI,GAAG,GAAG,CAAC;SACZ;aAAM,IAAI,IAAI,KAAK,QAAQ,IAAI,QAAQ,EAAE;YACxC,IAAI,GAAG,KAAK,CAAC;SACd;QAED,OAAO,CACL,8BAAC,IAAI,0BACH,IAAI,EAAE,IAAI,KAAK,OAAO,IAAI,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,IAC1D,IAAA,wBAAe,EAAC,IAAI,CAAC,IACzB,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,EAAE,CACX,iBAAiB;gBACf,CAAC,CAAC,EAAE;gBACJ,CAAC;wBACG,QAAQ,EAAE,IAAI;;oBACd,GAAC,aAAW,KAAO,IAAG,KAAK;oBAC3B,GAAC,aAAW,IAAM,IAAG,IAAI;oBACzB,GAAC,eAAe,IAAG,KAAK;oBACxB,GAAC,kBAAkB,IAAG,QAAQ;oBAC9B,iBAAa,GAAE,QAAQ;oBACvB,eAAW,GAAE,MAAM;uBACpB,EACL,SAAS,CACV,EACD,QAAQ,EAAE,QAAQ,KAEjB,QAAQ,CACJ,CACR,CAAC;IACJ,CAAC;IAED,uBAAM,GAAN;QACQ,IAAA,KASF,IAAI,CAAC,KAAK,EARZ,OAAO,aAAA,EACP,SAAS,eAAA,EACT,gBAAgB,sBAAA,EAChB,cAAc,oBAAA,EACd,gBAAgB,sBAAA,EAChB,QAAQ,cAAA,EACR,WAAW,iBAAA,EACC,EAAE,gBACF,CAAC;QAEf,OAAO,CACL,8BAAC,wBAAc,IACb,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,OAAO,EACzC,SAAS,EAAE,gBAAgB,EAC3B,OAAO,EAAE,cAAc,EACvB,SAAS,EAAE,gBAAgB,IAE1B,IAAI,CAAC,YAAY,EAAE,CACL,CAClB,CAAC;IACJ,CAAC;IA3FM,mBAAY,GAQf;QACF,cAAc,EAAE,QAAQ;QACxB,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,QAAQ;QACd,SAAS,EAAE,KAAK;QAChB,cAAc,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC;QAClC,gBAAgB,EAAE,KAAK;KACxB,CAAC;IA6EJ,aAAC;CAAA,AA7FD,CAA4B,eAAK,CAAC,SAAS,GA6F1C;AA7FY,wBAAM;AA+FnB,kBAAe,IAAA,iBAAS,EAAC,MAAM,CAAC,CAAC",
+    "mappings": "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",
     "sourcesContent": [
-        "/**\n * @file Button\n * @author fex\n */\n\nimport React from 'react';\nimport TooltipWrapper, {TooltipObject, Trigger} from './TooltipWrapper';\nimport {pickEventsProps} from '../utils/helper';\nimport {ClassNamesFn, themeable} from '../theme';\n\ninterface ButtonProps extends React.DOMAttributes<HTMLButtonElement> {\n  id?: string;\n  className?: string;\n  href?: string;\n  size?: 'xs' | 'sm' | 'md' | 'lg';\n  type: 'button' | 'reset' | 'submit';\n  level: string; // 'link' | 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'danger' | 'light' | 'dark' | 'default';\n  tooltip?: string | TooltipObject;\n  placement: 'top' | 'right' | 'bottom' | 'left';\n  tooltipContainer?: any;\n  tooltipTrigger: Trigger | Array<Trigger>;\n  tooltipRootClose: boolean;\n  disabled?: boolean;\n  active?: boolean;\n  block?: boolean;\n  iconOnly?: boolean;\n  disabledTip?: string | TooltipObject;\n  classPrefix: string;\n  classnames: ClassNamesFn;\n  componentClass: React.ReactType;\n  overrideClassName?: boolean;\n}\n\nexport class Button extends React.Component<ButtonProps> {\n  static defaultProps: Pick<\n    ButtonProps,\n    | 'componentClass'\n    | 'level'\n    | 'type'\n    | 'placement'\n    | 'tooltipTrigger'\n    | 'tooltipRootClose'\n  > = {\n    componentClass: 'button',\n    level: 'default',\n    type: 'button',\n    placement: 'top',\n    tooltipTrigger: ['hover', 'focus'],\n    tooltipRootClose: false\n  };\n\n  renderButton() {\n    let {\n      level,\n      size,\n      disabled,\n      className,\n      componentClass: Comp,\n      classnames: cx,\n      children,\n      disabledTip,\n      block,\n      type,\n      active,\n      iconOnly,\n      href,\n      overrideClassName,\n      ...rest\n    } = this.props;\n\n    if (href) {\n      Comp = 'a';\n    } else if (Comp === 'button' && disabled) {\n      Comp = 'div';\n    }\n\n    return (\n      <Comp\n        type={Comp === 'input' || Comp === 'button' ? type : undefined}\n        {...pickEventsProps(rest)}\n        href={href}\n        className={cx(\n          overrideClassName\n            ? ''\n            : {\n                'Button': true,\n                [`Button--${level}`]: level,\n                [`Button--${size}`]: size,\n                [`Button--block`]: block,\n                [`Button--iconOnly`]: iconOnly,\n                'is-disabled': disabled,\n                'is-active': active\n              },\n          className\n        )}\n        disabled={disabled}\n      >\n        {children}\n      </Comp>\n    );\n  }\n\n  render() {\n    const {\n      tooltip,\n      placement,\n      tooltipContainer,\n      tooltipTrigger,\n      tooltipRootClose,\n      disabled,\n      disabledTip,\n      classnames: cx\n    } = this.props;\n\n    return (\n      <TooltipWrapper\n        placement={placement}\n        tooltip={disabled ? disabledTip : tooltip}\n        container={tooltipContainer}\n        trigger={tooltipTrigger}\n        rootClose={tooltipRootClose}\n      >\n        {this.renderButton()}\n      </TooltipWrapper>\n    );\n  }\n}\n\nexport default themeable(Button);\n"
+        "/**\n * @file Button\n * @author fex\n */\n\nimport React from 'react';\nimport TooltipWrapper, {TooltipObject, Trigger} from './TooltipWrapper';\nimport {pickEventsProps} from '../utils/helper';\nimport {ClassNamesFn, themeable} from '../theme';\nimport {Icon} from './icons';\ninterface ButtonProps extends React.DOMAttributes<HTMLButtonElement> {\n  id?: string;\n  className?: string;\n  href?: string;\n  size?: 'xs' | 'sm' | 'md' | 'lg';\n  type: 'button' | 'reset' | 'submit';\n  level: string; // 'link' | 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'danger' | 'light' | 'dark' | 'default';\n  tooltip?: string | TooltipObject;\n  tooltipPlacement: 'top' | 'right' | 'bottom' | 'left';\n  tooltipContainer?: any;\n  tooltipTrigger: Trigger | Array<Trigger>;\n  tooltipRootClose: boolean;\n  disabled?: boolean;\n  active?: boolean;\n  block?: boolean;\n  iconOnly?: boolean;\n  disabledTip?: string | TooltipObject;\n  classPrefix: string;\n  classnames: ClassNamesFn;\n  componentClass: React.ReactType;\n  overrideClassName?: boolean;\n  loading?: boolean;\n  loadingClassName?: string;\n}\n\nexport class Button extends React.Component<ButtonProps> {\n  static defaultProps: Pick<\n    ButtonProps,\n    | 'componentClass'\n    | 'level'\n    | 'type'\n    | 'tooltipPlacement'\n    | 'tooltipTrigger'\n    | 'tooltipRootClose'\n  > = {\n    componentClass: 'button',\n    level: 'default',\n    type: 'button',\n    tooltipPlacement: 'top',\n    tooltipTrigger: ['hover', 'focus'],\n    tooltipRootClose: false\n  };\n\n  renderButton() {\n    let {\n      level,\n      size,\n      disabled,\n      className,\n      componentClass: Comp,\n      classnames: cx,\n      children,\n      disabledTip,\n      block,\n      type,\n      active,\n      iconOnly,\n      href,\n      loading,\n      loadingClassName,\n      overrideClassName,\n      ...rest\n    } = this.props;\n\n    if (href) {\n      Comp = 'a';\n    } else if ((Comp === 'button' && disabled) || loading) {\n      Comp = 'div';\n    }\n\n    return (\n      <Comp\n        type={Comp === 'input' || Comp === 'button' ? type : undefined}\n        {...pickEventsProps(rest)}\n        href={href}\n        className={cx(\n          overrideClassName\n            ? ''\n            : {\n                'Button': true,\n                [`Button--${level}`]: level,\n                [`Button--${size}`]: size,\n                [`Button--block`]: block,\n                [`Button--iconOnly`]: iconOnly,\n                'is-disabled': disabled,\n                'is-active': active\n              },\n          className\n        )}\n        disabled={disabled}\n      >\n        {loading && !disabled ? (\n          <span\n            className={cx(\n              overrideClassName\n                ? ''\n                : {[`Button--loading Button--loading--${level}`]: level},\n              loadingClassName\n            )}\n          >\n            <Icon icon=\"loading-outline\" className=\"icon\" />\n          </span>\n        ) : null}\n        {children}\n      </Comp>\n    );\n  }\n\n  render() {\n    const {\n      tooltip,\n      tooltipPlacement,\n      tooltipContainer,\n      tooltipTrigger,\n      tooltipRootClose,\n      disabled,\n      disabledTip,\n      classnames: cx\n    } = this.props;\n\n    return (\n      <TooltipWrapper\n        placement={tooltipPlacement}\n        tooltip={disabled ? disabledTip : tooltip}\n        container={tooltipContainer}\n        trigger={tooltipTrigger}\n        rootClose={tooltipRootClose}\n      >\n        {this.renderButton()}\n      </TooltipWrapper>\n    );\n  }\n}\n\nexport default themeable(Button);\n"
     ]
 }