@king-design/intact 2.0.0-beta.0

package/es/site/data/components/tabs/demos/card/react.js

@@ -0,0 +1,79 @@
+import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
+import _concatInstanceProperty from "@babel/runtime-corejs3/core-js/instance/concat";
+import React from 'react';
+import { Tabs, Tab } from '@king-design/react';
+import './index.styl';
+
+var Demo = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(Demo, _React$Component);
+
+  function Demo() {
+    var _context;
+
+    var _this;
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _React$Component.call.apply(_React$Component, _concatInstanceProperty(_context = [this]).call(_context, args)) || this;
+    _this.state = {
+      tab: 'rulein'
+    };
+    return _this;
+  }
+
+  var _proto = Demo.prototype;
+
+  _proto.render = function render() {
+    var _this2 = this;
+
+    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Tabs, {
+      type: "card",
+      value: this.state.tab,
+      onChangeValue: function onChangeValue(tab) {
+        return _this2.setState({
+          tab: tab
+        });
+      }
+    }, /*#__PURE__*/React.createElement(Tab, {
+      value: "rulein"
+    }, "\u5165\u7AD9\u89C4\u5219"), /*#__PURE__*/React.createElement(Tab, {
+      value: "ruleout"
+    }, "\u51FA\u7AD9\u89C4\u5219"), /*#__PURE__*/React.createElement(Tab, {
+      value: "relatedVM"
+    }, "\u5173\u8054\u4E91\u4E3B\u673A")), /*#__PURE__*/React.createElement(Tabs, {
+      type: "border-card",
+      value: this.state.tab,
+      onChangeValue: function onChangeValue(tab) {
+        return _this2.setState({
+          tab: tab
+        });
+      }
+    }, /*#__PURE__*/React.createElement(Tab, {
+      value: "rulein"
+    }, "\u5165\u7AD9\u89C4\u5219"), /*#__PURE__*/React.createElement(Tab, {
+      value: "ruleout"
+    }, "\u51FA\u7AD9\u89C4\u5219"), /*#__PURE__*/React.createElement(Tab, {
+      value: "relatedVM"
+    }, "\u5173\u8054\u4E91\u4E3B\u673A")), /*#__PURE__*/React.createElement(Tabs, {
+      type: "no-border-card",
+      value: this.state.tab,
+      onChangeValue: function onChangeValue(tab) {
+        return _this2.setState({
+          tab: tab
+        });
+      }
+    }, /*#__PURE__*/React.createElement(Tab, {
+      value: "rulein"
+    }, "\u5165\u7AD9\u89C4\u5219"), /*#__PURE__*/React.createElement(Tab, {
+      value: "ruleout"
+    }, "\u51FA\u7AD9\u89C4\u5219"), /*#__PURE__*/React.createElement(Tab, {
+      value: "relatedVM"
+    }, "\u5173\u8054\u4E91\u4E3B\u673A")));
+  };
+
+  return Demo;
+}(React.Component);
+
+export { Demo as default };

package/es/site/data/components/tabs/demos/closable/index.d.ts

@@ -0,0 +1,20 @@
+export { default as data } from './index.json';
+import { Component } from 'intact';
+import './index.styl';
+import { TabsProps } from 'kpc';
+interface Props {
+    tab?: number;
+    tabs: TabItem[];
+    size: TabsProps['size'];
+    types: TabsProps['type'][];
+}
+declare type TabItem = {
+    value: number;
+    label: string;
+};
+export default class extends Component<Props> {
+    static template: string | import("intact").Template<any>;
+    static defaults(): Props;
+    _remove(value: number): void;
+    _add(): void;
+}

package/es/site/data/components/tabs/demos/closable/index.js

@@ -0,0 +1,89 @@
+import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
+import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js/instance/slice";
+import _findIndexInstanceProperty from "@babel/runtime-corejs3/core-js/instance/find-index";
+import _spliceInstanceProperty from "@babel/runtime-corejs3/core-js/instance/splice";
+import { __decorate } from "tslib";
+export { default as data } from './index.json';
+import { Component } from 'intact';
+import template from './index.vdt';
+import './index.styl';
+import { bind } from 'kpc';
+var id = 3;
+
+var default_1 = /*#__PURE__*/function (_Component) {
+  _inheritsLoose(default_1, _Component);
+
+  function default_1() {
+    return _Component.apply(this, arguments) || this;
+  }
+
+  default_1.defaults = function defaults() {
+    return {
+      tab: 1,
+      tabs: [{
+        value: 1,
+        label: 'Tab 1'
+      }, {
+        value: 2,
+        label: 'Tab 2'
+      }, {
+        value: 3,
+        label: 'Tab 3'
+      }],
+      size: 'large',
+      types: ['default', 'card', 'border-card', 'no-border-card']
+    };
+  };
+
+  var _proto = default_1.prototype;
+
+  _proto._remove = function _remove(value) {
+    var _context;
+
+    var tabs = _sliceInstanceProperty(_context = this.get('tabs')).call(_context, 0);
+
+    var index = _findIndexInstanceProperty(tabs).call(tabs, function (item) {
+      return item.value === value;
+    });
+
+    _spliceInstanceProperty(tabs).call(tabs, index, 1); // 如果删除当前tab，则切换至下一个
+
+
+    var tab = this.get('tab');
+
+    if (value === tab) {
+      var item = tabs[index] || tabs[index - 1];
+      tab = item ? item.value : undefined;
+    }
+
+    this.set({
+      tabs: tabs,
+      tab: tab
+    });
+  };
+
+  _proto._add = function _add() {
+    var _context2;
+
+    var tabs = _sliceInstanceProperty(_context2 = this.get('tabs')).call(_context2, 0);
+
+    id++;
+    tabs.push({
+      value: id,
+      label: "Tab " + id
+    });
+    this.set({
+      tabs: tabs,
+      tab: id
+    });
+  };
+
+  return default_1;
+}(Component);
+
+default_1.template = template;
+export { default_1 as default };
+
+__decorate([bind], default_1.prototype, "_remove", null);
+
+__decorate([bind], default_1.prototype, "_add", null);

package/es/site/data/components/tabs/demos/closable/react.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+import './index.styl';
+import { TabsProps } from '@king-design/react';
+interface Props {
+    tab?: number;
+    tabs: TabItem[];
+    size: TabsProps['size'];
+    types: TabsProps['type'][];
+}
+declare type TabItem = {
+    value: number;
+    label: string;
+};
+export default class Demo extends React.Component<{}, Props> {
+    state: Props;
+    _remove(value: number): void;
+    _add(): void;
+    render(): JSX.Element;
+}
+export {};

package/es/site/data/components/tabs/demos/closable/react.js

@@ -0,0 +1,138 @@
+import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
+import _concatInstanceProperty from "@babel/runtime-corejs3/core-js/instance/concat";
+import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js/instance/slice";
+import _findIndexInstanceProperty from "@babel/runtime-corejs3/core-js/instance/find-index";
+import _spliceInstanceProperty from "@babel/runtime-corejs3/core-js/instance/splice";
+import _mapInstanceProperty from "@babel/runtime-corejs3/core-js/instance/map";
+import { __decorate } from "tslib";
+import React from 'react';
+import { Tabs, Tab, Button, ButtonGroup } from '@king-design/react';
+import './index.styl';
+import { bind } from '@king-design/react';
+var id = 3;
+
+var Demo = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(Demo, _React$Component);
+
+  function Demo() {
+    var _context;
+
+    var _this;
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _React$Component.call.apply(_React$Component, _concatInstanceProperty(_context = [this]).call(_context, args)) || this;
+    _this.state = {
+      tab: 1,
+      tabs: [{
+        value: 1,
+        label: 'Tab 1'
+      }, {
+        value: 2,
+        label: 'Tab 2'
+      }, {
+        value: 3,
+        label: 'Tab 3'
+      }],
+      size: 'large',
+      types: ['default', 'card', 'border-card', 'no-border-card']
+    };
+    return _this;
+  }
+
+  var _proto = Demo.prototype;
+
+  _proto._remove = function _remove(value) {
+    var _context2;
+
+    var tabs = _sliceInstanceProperty(_context2 = this.state.tabs).call(_context2, 0);
+
+    var index = _findIndexInstanceProperty(tabs).call(tabs, function (item) {
+      return item.value === value;
+    });
+
+    _spliceInstanceProperty(tabs).call(tabs, index, 1); // 如果删除当前tab，则切换至下一个
+
+
+    var tab = this.state.tab;
+
+    if (value === tab) {
+      var item = tabs[index] || tabs[index - 1];
+      tab = item ? item.value : undefined;
+    }
+
+    this.setState({
+      tabs: tabs,
+      tab: tab
+    });
+  };
+
+  _proto._add = function _add() {
+    var _context3;
+
+    var tabs = _sliceInstanceProperty(_context3 = this.state.tabs).call(_context3, 0);
+
+    id++;
+    tabs.push({
+      value: id,
+      label: "Tab " + id
+    });
+    this.setState({
+      tabs: tabs,
+      tab: id
+    });
+  };
+
+  _proto.render = function render() {
+    var _this2 = this,
+        _context4,
+        _context5;
+
+    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(ButtonGroup, {
+      value: this.state.size,
+      onChangeValue: function onChangeValue(size) {
+        return _this2.setState({
+          size: size
+        });
+      },
+      checkType: "radio"
+    }, _mapInstanceProperty(_context4 = ['large', 'default', 'small', 'mini']).call(_context4, function ($value, $key) {
+      return /*#__PURE__*/React.createElement(Button, {
+        value: $value
+      }, $value);
+    })), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement(Button, {
+      onClick: this._add
+    }, "\u65B0\u589ETab"), _mapInstanceProperty(_context5 = this.state.types).call(_context5, function ($value, $key) {
+      var _context6;
+
+      return /*#__PURE__*/React.createElement(Tabs, {
+        value: _this2.state.tab,
+        onChangeValue: function onChangeValue(tab) {
+          return _this2.setState({
+            tab: tab
+          });
+        },
+        closable: _this2.state.tabs.length > 1,
+        onRemove: _this2._remove,
+        type: $value,
+        size: _this2.state.size
+      }, _mapInstanceProperty(_context6 = _this2.state.tabs).call(_context6, function ($value, $key) {
+        return /*#__PURE__*/React.createElement(Tab, {
+          value: $value.value,
+          key: $value.value,
+          closable: $value.value !== 10
+        }, $value.label);
+      }));
+    }));
+  };
+
+  return Demo;
+}(React.Component);
+
+export { Demo as default };
+
+__decorate([bind], Demo.prototype, "_remove", null);
+
+__decorate([bind], Demo.prototype, "_add", null);

package/es/site/data/components/tabs/demos/disabled/index.d.ts

@@ -0,0 +1,10 @@
+export { default as data } from './index.json';
+import { Component } from 'intact';
+import './index.styl';
+interface Props {
+    tab?: string | null;
+}
+export default class extends Component {
+    static template: string | import("intact").Template<any>;
+    static defaults(): Props;
+}

package/es/site/data/components/tabs/demos/disabled/index.js

@@ -0,0 +1,24 @@
+import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
+export { default as data } from './index.json';
+import { Component } from 'intact';
+import template from './index.vdt';
+import './index.styl';
+
+var default_1 = /*#__PURE__*/function (_Component) {
+  _inheritsLoose(default_1, _Component);
+
+  function default_1() {
+    return _Component.apply(this, arguments) || this;
+  }
+
+  default_1.defaults = function defaults() {
+    return {
+      tab: null
+    };
+  };
+
+  return default_1;
+}(Component);
+
+default_1.template = template;
+export { default_1 as default };

package/es/site/data/components/tabs/demos/disabled/react.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import './index.styl';
+interface Props {
+    tab?: string | null;
+}
+export default class Demo extends React.Component<{}, Props> {
+    state: Props;
+    render(): JSX.Element;
+}
+export {};

package/es/site/data/components/tabs/demos/disabled/react.js

@@ -0,0 +1,53 @@
+import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
+import _concatInstanceProperty from "@babel/runtime-corejs3/core-js/instance/concat";
+import React from 'react';
+import { Tabs, Tab } from '@king-design/react';
+import './index.styl';
+
+var Demo = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(Demo, _React$Component);
+
+  function Demo() {
+    var _context;
+
+    var _this;
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _React$Component.call.apply(_React$Component, _concatInstanceProperty(_context = [this]).call(_context, args)) || this;
+    _this.state = {
+      tab: null
+    };
+    return _this;
+  }
+
+  var _proto = Demo.prototype;
+
+  _proto.render = function render() {
+    var _this2 = this;
+
+    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Tabs, {
+      value: this.state.tab,
+      onChangeValue: function onChangeValue(tab) {
+        return _this2.setState({
+          tab: tab
+        });
+      }
+    }, /*#__PURE__*/React.createElement(Tab, {
+      value: "rulein"
+    }, "\u5165\u7AD9\u89C4\u5219"), /*#__PURE__*/React.createElement(Tab, {
+      value: "ruleout",
+      disabled: true
+    }, "\u51FA\u7AD9\u89C4\u5219"), /*#__PURE__*/React.createElement(Tab, {
+      value: "relatedVM"
+    }, "\u5173\u8054\u4E91\u4E3B\u673A")), /*#__PURE__*/React.createElement("div", {
+      className: "content"
+    }, this.state.tab === 'rulein' ? /*#__PURE__*/React.createElement("div", null, "\u5165\u7AD9\u89C4\u5219") : this.state.tab === 'ruleout' ? /*#__PURE__*/React.createElement("div", null, "\u51FA\u7AD9\u89C4\u5219") : /*#__PURE__*/React.createElement("div", null, "\u5173\u8054\u4E91\u4E3B\u673A")));
+  };
+
+  return Demo;
+}(React.Component);
+
+export { Demo as default };

package/es/site/data/components/tabs/demos/size/index.d.ts

@@ -0,0 +1,6 @@
+export { default as data } from './index.json';
+import { Component } from 'intact';
+import './index.styl';
+export default class extends Component {
+    static template: string | import("intact").Template<any>;
+}

package/es/site/data/components/tabs/demos/size/index.js

@@ -0,0 +1,18 @@
+import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
+export { default as data } from './index.json';
+import { Component } from 'intact';
+import template from './index.vdt';
+import './index.styl';
+
+var default_1 = /*#__PURE__*/function (_Component) {
+  _inheritsLoose(default_1, _Component);
+
+  function default_1() {
+    return _Component.apply(this, arguments) || this;
+  }
+
+  return default_1;
+}(Component);
+
+default_1.template = template;
+export { default_1 as default };

package/es/site/data/components/tabs/demos/size/react.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import './index.styl';
+export default class Demo extends React.Component {
+    render(): JSX.Element;
+}

package/es/site/data/components/tabs/demos/size/react.js

@@ -0,0 +1,49 @@
+import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
+import React from 'react';
+import { Tabs, Tab } from '@king-design/react';
+import './index.styl';
+
+var Demo = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(Demo, _React$Component);
+
+  function Demo() {
+    return _React$Component.apply(this, arguments) || this;
+  }
+
+  var _proto = Demo.prototype;
+
+  _proto.render = function render() {
+    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Tabs, {
+      size: "large",
+      value: "1"
+    }, /*#__PURE__*/React.createElement(Tab, {
+      value: "1"
+    }, "large1"), /*#__PURE__*/React.createElement(Tab, {
+      value: "2"
+    }, "large2")), /*#__PURE__*/React.createElement(Tabs, {
+      value: "1"
+    }, /*#__PURE__*/React.createElement(Tab, {
+      value: "1"
+    }, "default1"), /*#__PURE__*/React.createElement(Tab, {
+      value: "2"
+    }, "defalut2")), /*#__PURE__*/React.createElement(Tabs, {
+      size: "small",
+      value: "1"
+    }, /*#__PURE__*/React.createElement(Tab, {
+      value: "1"
+    }, "small1"), /*#__PURE__*/React.createElement(Tab, {
+      value: "2"
+    }, "small2")), /*#__PURE__*/React.createElement(Tabs, {
+      size: "mini",
+      value: "1"
+    }, /*#__PURE__*/React.createElement(Tab, {
+      value: "1"
+    }, "mini1"), /*#__PURE__*/React.createElement(Tab, {
+      value: "2"
+    }, "mini2")));
+  };
+
+  return Demo;
+}(React.Component);
+
+export { Demo as default };

package/es/site/data/components/tabs/demos/vertical/index.d.ts

@@ -0,0 +1,9 @@
+export { default as data } from './index.json';
+import { Component } from 'intact';
+import './index.styl';
+export default class extends Component {
+    static template: string | import("intact").Template<any>;
+    static defaults(): {
+        tab: string;
+    };
+}

package/es/site/data/components/tabs/demos/vertical/index.js

@@ -0,0 +1,24 @@
+import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
+export { default as data } from './index.json';
+import { Component } from 'intact';
+import template from './index.vdt';
+import './index.styl';
+
+var default_1 = /*#__PURE__*/function (_Component) {
+  _inheritsLoose(default_1, _Component);
+
+  function default_1() {
+    return _Component.apply(this, arguments) || this;
+  }
+
+  default_1.defaults = function defaults() {
+    return {
+      tab: 'rulein'
+    };
+  };
+
+  return default_1;
+}(Component);
+
+default_1.template = template;
+export { default_1 as default };

package/es/site/data/components/tabs/demos/vertical/react.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import './index.styl';
+export default class Demo extends React.Component {
+    state: {
+        tab: string;
+    };
+    render(): JSX.Element;
+}

package/es/site/data/components/tabs/demos/vertical/react.js

@@ -0,0 +1,96 @@
+import _inheritsLoose from "@babel/runtime-corejs3/helpers/inheritsLoose";
+import _concatInstanceProperty from "@babel/runtime-corejs3/core-js/instance/concat";
+import React from 'react';
+import { Tabs, Tab } from '@king-design/react';
+import './index.styl';
+
+var Demo = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(Demo, _React$Component);
+
+  function Demo() {
+    var _context;
+
+    var _this;
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _React$Component.call.apply(_React$Component, _concatInstanceProperty(_context = [this]).call(_context, args)) || this;
+    _this.state = {
+      tab: 'rulein'
+    };
+    return _this;
+  }
+
+  var _proto = Demo.prototype;
+
+  _proto.render = function render() {
+    var _this2 = this;
+
+    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Tabs, {
+      value: this.state.tab,
+      onChangeValue: function onChangeValue(tab) {
+        return _this2.setState({
+          tab: tab
+        });
+      },
+      vertical: true
+    }, /*#__PURE__*/React.createElement(Tab, {
+      value: "rulein"
+    }, "\u5165\u7AD9\u89C4\u5219"), /*#__PURE__*/React.createElement(Tab, {
+      value: "ruleout"
+    }, "\u51FA\u7AD9\u89C4\u5219"), /*#__PURE__*/React.createElement(Tab, {
+      value: "relatedVM"
+    }, "\u5173\u8054\u4E91\u4E3B\u673A")), /*#__PURE__*/React.createElement(Tabs, {
+      value: this.state.tab,
+      onChangeValue: function onChangeValue(tab) {
+        return _this2.setState({
+          tab: tab
+        });
+      },
+      vertical: true,
+      type: "card"
+    }, /*#__PURE__*/React.createElement(Tab, {
+      value: "rulein"
+    }, "\u5165\u7AD9\u89C4\u5219"), /*#__PURE__*/React.createElement(Tab, {
+      value: "ruleout"
+    }, "\u51FA\u7AD9\u89C4\u5219"), /*#__PURE__*/React.createElement(Tab, {
+      value: "relatedVM"
+    }, "\u5173\u8054\u4E91\u4E3B\u673A")), /*#__PURE__*/React.createElement(Tabs, {
+      value: this.state.tab,
+      onChangeValue: function onChangeValue(tab) {
+        return _this2.setState({
+          tab: tab
+        });
+      },
+      vertical: true,
+      type: "border-card"
+    }, /*#__PURE__*/React.createElement(Tab, {
+      value: "rulein"
+    }, "\u5165\u7AD9\u89C4\u5219"), /*#__PURE__*/React.createElement(Tab, {
+      value: "ruleout"
+    }, "\u51FA\u7AD9\u89C4\u5219"), /*#__PURE__*/React.createElement(Tab, {
+      value: "relatedVM"
+    }, "\u5173\u8054\u4E91\u4E3B\u673A")), /*#__PURE__*/React.createElement(Tabs, {
+      value: this.state.tab,
+      onChangeValue: function onChangeValue(tab) {
+        return _this2.setState({
+          tab: tab
+        });
+      },
+      vertical: true,
+      type: "no-border-card"
+    }, /*#__PURE__*/React.createElement(Tab, {
+      value: "rulein"
+    }, "\u5165\u7AD9\u89C4\u5219"), /*#__PURE__*/React.createElement(Tab, {
+      value: "ruleout"
+    }, "\u51FA\u7AD9\u89C4\u5219"), /*#__PURE__*/React.createElement(Tab, {
+      value: "relatedVM"
+    }, "\u5173\u8054\u4E91\u4E3B\u673A")));
+  };
+
+  return Demo;
+}(React.Component);
+
+export { Demo as default };