tinper-bee
Version:
React Components living for enterprise-class pc backend application
1,472 lines (1,087 loc) • 238 kB
JavaScript
(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory(require("react"), require("prop-types"), require("react-dom"));
else if(typeof define === 'function' && define.amd)
define(["react", "prop-types", "react-dom"], factory);
else {
var a = typeof exports === 'object' ? factory(require("react"), require("prop-types"), require("react-dom")) : factory(root["React"], root["PropTypes"], root["ReactDOM"]);
for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
}
})(typeof self !== 'undefined' ? self : this, function(__WEBPACK_EXTERNAL_MODULE_0__, __WEBPACK_EXTERNAL_MODULE_1__, __WEBPACK_EXTERNAL_MODULE_3__) {
return /******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId]) {
/******/ return installedModules[moduleId].exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ i: moduleId,
/******/ l: false,
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.l = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // define getter function for harmony exports
/******/ __webpack_require__.d = function(exports, name, getter) {
/******/ if(!__webpack_require__.o(exports, name)) {
/******/ Object.defineProperty(exports, name, {
/******/ configurable: false,
/******/ enumerable: true,
/******/ get: getter
/******/ });
/******/ }
/******/ };
/******/
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = function(module) {
/******/ var getter = module && module.__esModule ?
/******/ function getDefault() { return module['default']; } :
/******/ function getModuleExports() { return module; };
/******/ __webpack_require__.d(getter, 'a', getter);
/******/ return getter;
/******/ };
/******/
/******/ // Object.prototype.hasOwnProperty.call
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "";
/******/
/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = 1509);
/******/ })
/************************************************************************/
/******/ ({
/***/ 0:
/***/ (function(module, exports) {
module.exports = __WEBPACK_EXTERNAL_MODULE_0__;
/***/ }),
/***/ 1:
/***/ (function(module, exports) {
module.exports = __WEBPACK_EXTERNAL_MODULE_1__;
/***/ }),
/***/ 112:
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = camelize;
var rHyphen = /-(.)/g;
function camelize(string) {
return string.replace(rHyphen, function (_, chr) {
return chr.toUpperCase();
});
}
module.exports = exports["default"];
/***/ }),
/***/ 113:
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = hyphenateStyleName;
var _hyphenate = __webpack_require__(114);
var _hyphenate2 = _interopRequireDefault(_hyphenate);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var msPattern = /^ms-/; /**
* Copyright 2013-2014, Facebook, Inc.
* All rights reserved.
* https://github.com/facebook/react/blob/2aeb8a2a6beb00617a4217f7f8284924fa2ad819/src/vendor/core/hyphenateStyleName.js
*/
function hyphenateStyleName(string) {
return (0, _hyphenate2.default)(string).replace(msPattern, '-ms-');
}
module.exports = exports['default'];
/***/ }),
/***/ 114:
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = hyphenate;
var rUpper = /([A-Z])/g;
function hyphenate(string) {
return string.replace(rUpper, '-$1').toLowerCase();
}
module.exports = exports['default'];
/***/ }),
/***/ 115:
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = _getComputedStyle;
var _camelizeStyle = __webpack_require__(70);
var _camelizeStyle2 = _interopRequireDefault(_camelizeStyle);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var rposition = /^(top|right|bottom|left)$/;
var rnumnonpx = /^([+-]?(?:\d*\.|)\d+(?:[eE][+-]?\d+|))(?!px)[a-z%]+$/i;
function _getComputedStyle(node) {
if (!node) throw new TypeError('No Element passed to `getComputedStyle()`');
var doc = node.ownerDocument;
return 'defaultView' in doc ? doc.defaultView.opener ? node.ownerDocument.defaultView.getComputedStyle(node, null) : window.getComputedStyle(node, null) : {
//ie 8 "magic" from: https://github.com/jquery/jquery/blob/1.11-stable/src/css/curCSS.js#L72
getPropertyValue: function getPropertyValue(prop) {
var style = node.style;
prop = (0, _camelizeStyle2.default)(prop);
if (prop == 'float') prop = 'styleFloat';
var current = node.currentStyle[prop] || null;
if (current == null && style && style[prop]) current = style[prop];
if (rnumnonpx.test(current) && !rposition.test(prop)) {
// Remember the original values
var left = style.left;
var runStyle = node.runtimeStyle;
var rsLeft = runStyle && runStyle.left;
// Put in the new values to get a computed value out
if (rsLeft) runStyle.left = node.currentStyle.left;
style.left = prop === 'fontSize' ? '1em' : current;
current = style.pixelLeft + 'px';
// Revert the changed values
style.left = left;
if (rsLeft) runStyle.left = rsLeft;
}
return current;
}
};
}
module.exports = exports['default'];
/***/ }),
/***/ 116:
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = removeStyle;
function removeStyle(node, key) {
return 'removeProperty' in node.style ? node.style.removeProperty(key) : node.style.removeAttribute(key);
}
module.exports = exports['default'];
/***/ }),
/***/ 117:
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = isTransform;
var supportedTransforms = /^((translate|rotate|scale)(X|Y|Z|3d)?|matrix(3d)?|perspective|skew(X|Y)?)$/i;
function isTransform(property) {
return !!(property && supportedTransforms.test(property));
}
module.exports = exports["default"];
/***/ }),
/***/ 136:
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = function (componentOrElement) {
return (0, _ownerDocument2["default"])(_reactDom2["default"].findDOMNode(componentOrElement));
};
var _reactDom = __webpack_require__(3);
var _reactDom2 = _interopRequireDefault(_reactDom);
var _ownerDocument = __webpack_require__(49);
var _ownerDocument2 = _interopRequireDefault(_ownerDocument);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
module.exports = exports['default'];
/***/ }),
/***/ 1509:
/***/ (function(module, exports, __webpack_require__) {
module.exports = __webpack_require__(1510);
/***/ }),
/***/ 1510:
/***/ (function(module, exports, __webpack_require__) {
__webpack_require__(1511);
module.exports = __webpack_require__(1512);
/***/ }),
/***/ 1511:
/***/ (function(module, exports) {
// removed by extract-text-webpack-plugin
/***/ }),
/***/ 1512:
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
var _SearchPanel = __webpack_require__(1513);
var _SearchPanel2 = _interopRequireDefault(_SearchPanel);
var _AdvancedContainer = __webpack_require__(986);
var _AdvancedContainer2 = _interopRequireDefault(_AdvancedContainer);
var _HeadContainer = __webpack_require__(987);
var _HeadContainer2 = _interopRequireDefault(_HeadContainer);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
_SearchPanel2["default"].HeadContainer = _HeadContainer2["default"];
_SearchPanel2["default"].AdvancedContainer = _AdvancedContainer2["default"];
exports["default"] = _SearchPanel2["default"];
module.exports = exports['default'];
/***/ }),
/***/ 1513:
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _react = __webpack_require__(0);
var _react2 = _interopRequireDefault(_react);
var _beePanel = __webpack_require__(1514);
var _classnames = __webpack_require__(4);
var _classnames2 = _interopRequireDefault(_classnames);
var _propTypes = __webpack_require__(1);
var _propTypes2 = _interopRequireDefault(_propTypes);
var _AdvancedContainer = __webpack_require__(986);
var _AdvancedContainer2 = _interopRequireDefault(_AdvancedContainer);
var _HeadContainer = __webpack_require__(987);
var _HeadContainer2 = _interopRequireDefault(_HeadContainer);
var _i18n = __webpack_require__(1545);
var _i18n2 = _interopRequireDefault(_i18n);
var _tool = __webpack_require__(1546);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
function _defaults(obj, defaults) { var keys = Object.getOwnPropertyNames(defaults); for (var i = 0; i < keys.length; i++) { var key = keys[i]; var value = Object.getOwnPropertyDescriptor(defaults, key); if (value && value.configurable && obj[key] === undefined) { Object.defineProperty(obj, key, value); } } return obj; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
var emFun = function emFun() {};
var propTypes = {
isExpandedBtn: _propTypes2["default"].bool, //是否显示展开按钮
defaultExpanded: _propTypes2["default"].bool, //展开和收起的默认状态
expanded: _propTypes2["default"].bool, //是否默认展开，false默认关闭
onSearch: _propTypes2["default"].func, //点击查询的回调
onReset: _propTypes2["default"].func, //点击重置的回调
resetName: _propTypes2["default"].string, //重置的文字
searchName: _propTypes2["default"].string, //查询的文字
title: _propTypes2["default"].string,
onPanelChangeStart: _propTypes2["default"].func, //显示或隐藏开始回调
onPanelChangeIng: _propTypes2["default"].func, //显示或隐藏进行中回调
onPanelChangeEnd: _propTypes2["default"].func, //显示或隐藏结束回调
onChange: _propTypes2["default"].func, //点击显示或隐藏回调
showOperation: _propTypes2["default"].bool //是否显示 查询，清空
// resident: PropTypes.node //常驻面板内容，不会隐藏
};
var defaultProps = {
isExpandedBtn: true,
className: "",
clsPrefix: 'u-search',
defaultExpanded: false,
bgColor: "#F7F9FB",
showOperation: true
};
var SearchPanel = function (_Component) {
_inherits(SearchPanel, _Component);
function SearchPanel(props) {
_classCallCheck(this, SearchPanel);
var _this = _possibleConstructorReturn(this, _Component.call(this, props));
_this.changeExpanded = function () {
_this.setState({
expanded: !_this.state.expanded
});
};
_this._onChange = function () {
var onChange = _this.props.onChange;
if ('expanded' in _this.props) {
_this.setState({ expanded: _this.props.expanded });
} else {
_this.setState({ expanded: !_this.state.expanded });
}
onChange && onChange();
};
_this.search = function () {
var onSearch = _this.props.onSearch;
onSearch && onSearch();
};
_this.reset = function () {
var onReset = _this.props.onReset;
onReset && onReset();
};
_this._onPanelChange = function (type, func) {
if (func) {
var status = "";
if (type === 0) {
status = "hide";
} else if (type === 1) {
status = 'visible';
}
func(status);
}
};
_this._onPanelChangeStart = function (type) {
var onPanelChangeStart = _this.props.onPanelChangeStart;
onPanelChangeStart && _this._onPanelChange(type, onPanelChangeStart);
};
_this._onPanelChangeIng = function (type) {
var onPanelChangeIng = _this.props.onPanelChangeIng;
onPanelChangeIng && _this._onPanelChange(type, onPanelChangeIng);
};
_this._onPanelChangeEnd = function (type) {
var onPanelChangeEnd = _this.props.onPanelChangeEnd;
onPanelChangeEnd && _this._onPanelChange(type, onPanelChangeEnd);
};
_this._getChildren = function (element) {
if (element.type.name === "HeadContainer" || element.type.prototype === _HeadContainer2["default"].prototype) {
// if(element.type.name === "HeadContainer"){
_this._HeadContainer = element;
} else if (element.type.name === "AdvancedContainer" || element.type.prototype === _AdvancedContainer2["default"].prototype) {
// }else if(element.type.name === "AdvancedContainer"){
_this._AdvancedContainer = element;
}
};
_this.state = {
expanded: props.expanded || props.defaultExpanded
};
_this._HeadContainer = null;
_this._AdvancedContainer = null;
return _this;
}
SearchPanel.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
if ('expanded' in nextProps) {
this.setState({ expanded: nextProps.expanded });
}
};
SearchPanel.prototype.render = function render() {
var _this2 = this;
var local = (0, _tool.getComponentLocale)(this.props, this.context, 'SearchPanel', function () {
return _i18n2["default"];
});
var _props = this.props,
children = _props.children,
clsPrefix = _props.clsPrefix,
className = _props.className,
resetName = _props.resetName,
searchName = _props.searchName,
title = _props.title,
bgColor = _props.bgColor,
style = _props.style,
showOperation = _props.showOperation;
if (!resetName) resetName = local['resetName'];
if (!searchName) searchName = local['searchName'];
if (!title) title = local['title'];
var expanded = this.state.expanded;
var _stype = style || {};
if (children instanceof Array) {
children.forEach(function (element) {
_this2._getChildren(element);
});
} else {
this._getChildren(children);
}
return _react2["default"].createElement(
'div',
{ className: clsPrefix + ' ' + className,
style: _extends({ background: bgColor }, _stype) },
_react2["default"].createElement(
'div',
{ className: clsPrefix + "-header" },
_react2["default"].createElement(
'div',
{ className: clsPrefix + "-header-title" },
_react2["default"].createElement(
'span',
null,
title
)
),
_react2["default"].createElement(
'div',
{ className: clsPrefix + "-header-oper" },
(this._HeadContainer || expanded) && showOperation ? _react2["default"].createElement(
'span',
{ className: 'header-oper-btn', role: 'button', onClick: this.reset },
resetName
) : null,
(this._HeadContainer || expanded) && showOperation ? _react2["default"].createElement(
'span',
{ className: 'header-oper-btn primary', role: 'button', onClick: this.search },
searchName
) : null,
this.props.isExpandedBtn && _react2["default"].createElement(
'span',
{
className: 'header-oper-btn',
role: 'button',
onClick: this._onChange
},
expanded ? local['up'] : local['down'],
_react2["default"].createElement('i', { className: (0, _classnames2["default"])({
'uf': true,
'uf-arrow-down': !expanded,
'uf-arrow-up': expanded
}) })
)
)
),
_react2["default"].createElement(
'div',
{ className: clsPrefix + '-resident' },
this._HeadContainer
),
_react2["default"].createElement(
_beePanel.Panel,
{
collapsible: true,
expanded: this.state.expanded,
onExit: this._onPanelChangeStart.bind(this, 0) //隐藏开始回调
, onEnter: this._onPanelChangeStart.bind(this, 1) //显示开始回调
, onExiting: this._onPanelChangeIng.bind(this, 0) //隐藏进行中回调
, onEntering: this._onPanelChangeIng.bind(this, 1) //显示进行中回调
, onExited: this._onPanelChangeEnd.bind(this, 0) //隐藏完成回调
, onEntered: this._onPanelChangeEnd.bind(this, 1) //显示后回调
},
this._AdvancedContainer
)
);
};
return SearchPanel;
}(_react.Component);
SearchPanel.propTypes = propTypes;
SearchPanel.defaultProps = defaultProps;
SearchPanel.contextTypes = {
beeLocale: _propTypes2["default"].object
};
exports["default"] = SearchPanel;
module.exports = exports['default'];
/***/ }),
/***/ 1514:
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.PanelGroup = exports.Panel = undefined;
var _Panel2 = __webpack_require__(1515);
var _Panel3 = _interopRequireDefault(_Panel2);
var _PanelGroup2 = __webpack_require__(1544);
var _PanelGroup3 = _interopRequireDefault(_PanelGroup2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
exports.Panel = _Panel3["default"];
exports.PanelGroup = _PanelGroup3["default"];
/***/ }),
/***/ 1515:
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _classnames = __webpack_require__(982);
var _classnames2 = _interopRequireDefault(_classnames);
var _react = __webpack_require__(0);
var _react2 = _interopRequireDefault(_react);
var _beeTransition = __webpack_require__(1516);
var _beeMessage = __webpack_require__(1532);
var _beeMessage2 = _interopRequireDefault(_beeMessage);
var _propTypes = __webpack_require__(1);
var _propTypes2 = _interopRequireDefault(_propTypes);
var _copyToClipboard = __webpack_require__(670);
var _copyToClipboard2 = _interopRequireDefault(_copyToClipboard);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
function _defaults(obj, defaults) { var keys = Object.getOwnPropertyNames(defaults); for (var i = 0; i < keys.length; i++) { var key = keys[i]; var value = Object.getOwnPropertyDescriptor(defaults, key); if (value && value.configurable && obj[key] === undefined) { Object.defineProperty(obj, key, value); } } return obj; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
var propTypes = {
//是否添加折叠
collapsible: _propTypes2["default"].bool,
onSelect: _propTypes2["default"].func,
//头部组件
header: _propTypes2["default"].node,
headerStyle: _propTypes2["default"].object,
id: _propTypes2["default"].oneOfType([_propTypes2["default"].string, _propTypes2["default"].number]),
headerContent: _propTypes2["default"].bool,
//footer组件
footer: _propTypes2["default"].node,
footerStyle: _propTypes2["default"].object,
//默认是否打开
defaultExpanded: _propTypes2["default"].bool,
//是否打开
expanded: _propTypes2["default"].bool,
//每个panel的标记
eventKey: _propTypes2["default"].any,
headerRole: _propTypes2["default"].string,
panelRole: _propTypes2["default"].string,
//颜色
colors: _propTypes2["default"].oneOf(['primary', 'accent', 'success', 'info', 'warning', 'danger', 'default', 'bordered']),
// From Collapse.的扩展动画
onEnter: _propTypes2["default"].func,
onEntering: _propTypes2["default"].func,
onEntered: _propTypes2["default"].func,
onExit: _propTypes2["default"].func,
onExiting: _propTypes2["default"].func,
onExited: _propTypes2["default"].func,
//是否可复制内容
copyable: _propTypes2["default"].bool
};
var defaultProps = {
defaultExpanded: false,
clsPrefix: "u-panel",
colors: "default"
};
var Panel = function (_React$Component) {
_inherits(Panel, _React$Component);
function Panel(props, context) {
_classCallCheck(this, Panel);
var _this = _possibleConstructorReturn(this, _React$Component.call(this, props, context));
_this.handleClickTitle = _this.handleClickTitle.bind(_this);
_this.state = {
expanded: _this.props.defaultExpanded
};
return _this;
}
//头部点击事件
Panel.prototype.handleClickTitle = function handleClickTitle(e) {
// 不让事件进入事件池
e.persist();
e.selected = true;
if (this.props.onSelect) {
this.props.onSelect(this.props.eventKey, e);
} else {
e.preventDefault();
}
if (e.selected) {
this.setState({ expanded: !this.state.expanded });
}
};
//渲染panelheader
Panel.prototype.renderHeader = function renderHeader(collapsible, header, id, role, expanded, clsPrefix) {
var titleClassName = clsPrefix + '-title';
if (!collapsible) {
if (!_react2["default"].isValidElement(header)) {
return header;
}
return (0, _react.cloneElement)(header, {
className: (0, _classnames2["default"])(header.props.className, titleClassName)
});
}
if (!_react2["default"].isValidElement(header)) {
return _react2["default"].createElement(
'h4',
{ role: 'presentation', className: titleClassName },
this.renderAnchor(header, id, role, expanded)
);
}
if (this.props.headerContent) {
return (0, _react.cloneElement)(header, {
className: (0, _classnames2["default"])(header.props.className, titleClassName)
});
}
return (0, _react.cloneElement)(header, {
className: (0, _classnames2["default"])(header.props.className, titleClassName),
children: this.renderAnchor(header.props.children, id, role, expanded)
});
};
//如果使用链接，渲染为a标签
Panel.prototype.renderAnchor = function renderAnchor(header, id, role, expanded) {
return _react2["default"].createElement(
'a',
{
role: role,
href: id && '#' + id,
'aria-controls': id,
'aria-expanded': expanded,
'aria-selected': expanded,
className: expanded ? null : 'collapsed'
},
header
);
};
//复制代码，弹出提示信息
Panel.prototype.copyDemo = function copyDemo(e) {
var panelTarget = e.target.parentNode;
var clipBoardContent = panelTarget.firstChild.innerText;
(0, _copyToClipboard2["default"])(clipBoardContent);
_beeMessage2["default"].create({ content: '复制成功！', color: 'success', duration: 2 });
};
//如果有折叠动画，渲染折叠动画
Panel.prototype.renderCollapsibleBody = function renderCollapsibleBody(id, expanded, role, children, clsPrefix, copyable, animationHooks) {
return _react2["default"].createElement(
_beeTransition.Collapse,
_extends({ 'in': expanded }, animationHooks),
_react2["default"].createElement(
'div',
{
id: id,
role: role,
className: clsPrefix + '-collapse',
'aria-hidden': !expanded
},
this.renderBody(children, clsPrefix, copyable)
)
);
};
//渲染panelbody
Panel.prototype.renderBody = function renderBody(rawChildren, clsPrefix, copyable) {
var self = this;
var children = [];
var bodyChildren = [];
var bodyClassName = clsPrefix + '-body';
//添加到body的children中
function maybeAddBody(self) {
if (!bodyChildren.length) {
return;
}
// 给子组件添加key，为了之后触发事件时使用
children.push(_react2["default"].createElement(
'div',
{ key: children.length, className: bodyClassName },
bodyChildren,
copyable && _react2["default"].createElement('i', { className: clsPrefix + '-copy uf uf-files-o', onClick: self.copyDemo })
));
bodyChildren = [];
}
//转换为数组，方便复用
_react2["default"].Children.toArray(rawChildren).forEach(function (child) {
if (_react2["default"].isValidElement(child) && child.props.fill) {
maybeAddBody(self);
//将标示fill设置为undefined
children.push((0, _react.cloneElement)(child, { fill: undefined }));
return;
}
bodyChildren.push(child);
});
maybeAddBody(self);
return children;
};
Panel.prototype.render = function render() {
var _props = this.props,
collapsible = _props.collapsible,
header = _props.header,
id = _props.id,
footer = _props.footer,
propsExpanded = _props.expanded,
footerStyle = _props.footerStyle,
headerStyle = _props.headerStyle,
headerRole = _props.headerRole,
panelRole = _props.panelRole,
className = _props.className,
colors = _props.colors,
children = _props.children,
onEnter = _props.onEnter,
onEntering = _props.onEntering,
onEntered = _props.onEntered,
clsPrefix = _props.clsPrefix,
onExit = _props.onExit,
headerContent = _props.headerContent,
onExiting = _props.onExiting,
onExited = _props.onExited,
defaultExpanded = _props.defaultExpanded,
eventKey = _props.eventKey,
onSelect = _props.onSelect,
copyable = _props.copyable,
props = _objectWithoutProperties(_props, ['collapsible', 'header', 'id', 'footer', 'expanded', 'footerStyle', 'headerStyle', 'headerRole', 'panelRole', 'className', 'colors', 'children', 'onEnter', 'onEntering', 'onEntered', 'clsPrefix', 'onExit', 'headerContent', 'onExiting', 'onExited', 'defaultExpanded', 'eventKey', 'onSelect', 'copyable']);
var expanded = propsExpanded != null ? propsExpanded : this.state.expanded;
var classes = {};
classes['' + clsPrefix] = true;
classes[clsPrefix + '-' + colors] = true;
var headerClass = _defineProperty({}, clsPrefix + '-heading', true);
copyable === false ? false : true;
return _react2["default"].createElement(
'div',
_extends({}, props, {
className: (0, _classnames2["default"])(className, classes),
id: collapsible ? null : id
}),
header && _react2["default"].createElement(
'div',
{ className: (0, _classnames2["default"])(headerClass), style: headerStyle, onClick: this.handleClickTitle },
this.renderHeader(collapsible, header, id, headerRole, expanded, clsPrefix)
),
collapsible ? this.renderCollapsibleBody(id, expanded, panelRole, children, clsPrefix, copyable, { onEnter: onEnter, onEntering: onEntering, onEntered: onEntered, onExit: onExit, onExiting: onExiting, onExited: onExited }) : this.renderBody(children, clsPrefix, copyable),
footer && _react2["default"].createElement(
'div',
{ className: clsPrefix + '-footer', style: footerStyle },
footer
)
);
};
return Panel;
}(_react2["default"].Component);
Panel.propTypes = propTypes;
Panel.defaultProps = defaultProps;
exports["default"] = Panel;
module.exports = exports['default'];
/***/ }),
/***/ 1516:
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.Fade = exports.Collapse = exports.Transition = undefined;
var _Transition2 = __webpack_require__(920);
var _Transition3 = _interopRequireDefault(_Transition2);
var _Collapse2 = __webpack_require__(1517);
var _Collapse3 = _interopRequireDefault(_Collapse2);
var _Fade2 = __webpack_require__(1531);
var _Fade3 = _interopRequireDefault(_Fade2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
exports.Transition = _Transition3["default"];
exports.Collapse = _Collapse3["default"];
exports.Fade = _Fade3["default"];
/***/ }),
/***/ 1517:
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _classnames = __webpack_require__(4);
var _classnames2 = _interopRequireDefault(_classnames);
var _style = __webpack_require__(79);
var _style2 = _interopRequireDefault(_style);
var _react = __webpack_require__(0);
var _react2 = _interopRequireDefault(_react);
var _propTypes = __webpack_require__(1);
var _propTypes2 = _interopRequireDefault(_propTypes);
var _Transition = __webpack_require__(920);
var _Transition2 = _interopRequireDefault(_Transition);
var _capitalize = __webpack_require__(1518);
var _capitalize2 = _interopRequireDefault(_capitalize);
var _tinperBeeCore = __webpack_require__(921);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
function _defaults(obj, defaults) { var keys = Object.getOwnPropertyNames(defaults); for (var i = 0; i < keys.length; i++) { var key = keys[i]; var value = Object.getOwnPropertyDescriptor(defaults, key); if (value && value.configurable && obj[key] === undefined) { Object.defineProperty(obj, key, value); } } return obj; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
var MARGINS = {
height: ['marginTop', 'marginBottom'],
width: ['marginLeft', 'marginRight']
};
// reading a dimension prop will cause the browser to recalculate,
// which will let our animations work
function triggerBrowserReflow(node) {
node.offsetHeight; // eslint-disable-line no-unused-expressions
}
function getDimensionValue(dimension, elem) {
var value = elem['offset' + (0, _capitalize2["default"])(dimension)];
var margins = MARGINS[dimension];
return value + parseInt((0, _style2["default"])(elem, margins[0]), 10) + parseInt((0, _style2["default"])(elem, margins[1]), 10);
}
var propTypes = {
/**
* Show the component; triggers the expand or collapse animation
*/
"in": _propTypes2["default"].bool,
/**
* Unmount the component (remove it from the DOM) when it is collapsed
*/
unmountOnExit: _propTypes2["default"].bool,
/**
* Run the expand animation when the component mounts, if it is initially
* shown
*/
transitionAppear: _propTypes2["default"].bool,
/**
* Duration of the collapse animation in milliseconds, to ensure that
* finishing callbacks are fired even if the original browser transition end
* events are canceled
*/
timeout: _propTypes2["default"].number,
/**
* Callback fired before the component expands
*/
onEnter: _propTypes2["default"].func,
/**
* Callback fired after the component starts to expand
*/
onEntering: _propTypes2["default"].func,
/**
* Callback fired after the component has expanded
*/
onEntered: _propTypes2["default"].func,
/**
* Callback fired before the component collapses
*/
onExit: _propTypes2["default"].func,
/**
* Callback fired after the component starts to collapse
*/
onExiting: _propTypes2["default"].func,
/**
* Callback fired after the component has collapsed
*/
onExited: _propTypes2["default"].func,
/**
* The dimension used when collapsing, or a function that returns the
* dimension
*
* _Note: Bootstrap only partially supports 'width'!
* You will need to supply your own CSS animation for the `.width` CSS class._
*/
dimension: _propTypes2["default"].oneOfType([_propTypes2["default"].oneOf(['height', 'width']), _propTypes2["default"].func]),
/**
* Function that returns the height or width of the animating DOM node
*
* Allows for providing some custom logic for how much the Collapse component
* should animate in its specified dimension. Called with the current
* dimension prop value and the DOM node.
*/
getDimensionValue: _propTypes2["default"].func,
/**
* ARIA role of collapsible element
*/
role: _propTypes2["default"].string
};
var defaultProps = {
"in": false,
timeout: 300,
unmountOnExit: false,
transitionAppear: false,
dimension: 'height',
getDimensionValue: getDimensionValue
};
var Collapse = function (_React$Component) {
_inherits(Collapse, _React$Component);
function Collapse(props, context) {
_classCallCheck(this, Collapse);
var _this = _possibleConstructorReturn(this, _React$Component.call(this, props, context));
_this.handleEnter = _this.handleEnter.bind(_this);
_this.handleEntering = _this.handleEntering.bind(_this);
_this.handleEntered = _this.handleEntered.bind(_this);
_this.handleExit = _this.handleExit.bind(_this);
_this.handleExiting = _this.handleExiting.bind(_this);
return _this;
}
/* -- Expanding -- */
Collapse.prototype.handleEnter = function handleEnter(elem) {
var dimension = this._dimension();
elem.style[dimension] = '0';
};
Collapse.prototype.handleEntering = function handleEntering(elem) {
var dimension = this._dimension();
elem.style[dimension] = this._getScrollDimensionValue(elem, dimension);
};
Collapse.prototype.handleEntered = function handleEntered(elem) {
var dimension = this._dimension();
elem.style[dimension] = null;
};
/* -- Collapsing -- */
Collapse.prototype.handleExit = function handleExit(elem) {
var dimension = this._dimension();
elem.style[dimension] = this.props.getDimensionValue(dimension, elem) + 'px';
triggerBrowserReflow(elem);
};
Collapse.prototype.handleExiting = function handleExiting(elem) {
var dimension = this._dimension();
elem.style[dimension] = '0';
};
Collapse.prototype._dimension = function _dimension() {
return typeof this.props.dimension === 'function' ? this.props.dimension() : this.props.dimension;
};
// for testing
Collapse.prototype._getScrollDimensionValue = function _getScrollDimensionValue(elem, dimension) {
return elem['scroll' + (0, _capitalize2["default"])(dimension)] + 'px';
};
Collapse.prototype.render = function render() {
var _props = this.props,
onEnter = _props.onEnter,
onEntering = _props.onEntering,
onEntered = _props.onEntered,
onExit = _props.onExit,
onExiting = _props.onExiting,
className = _props.className,
props = _objectWithoutProperties(_props, ['onEnter', 'onEntering', 'onEntered', 'onExit', 'onExiting', 'className']);
delete props.dimension;
delete props.getDimensionValue;
var handleEnter = (0, _tinperBeeCore.createChainedFunction)(this.handleEnter, onEnter);
var handleEntering = (0, _tinperBeeCore.createChainedFunction)(this.handleEntering, onEntering);
var handleEntered = (0, _tinperBeeCore.createChainedFunction)(this.handleEntered, onEntered);
var handleExit = (0, _tinperBeeCore.createChainedFunction)(this.handleExit, onExit);
var handleExiting = (0, _tinperBeeCore.createChainedFunction)(this.handleExiting, onExiting);
var classes = {
width: this._dimension() === 'width'
};
return _react2["default"].createElement(_Transition2["default"], _extends({}, props, {
'aria-expanded': props.role ? props["in"] : null,
className: (0, _classnames2["default"])(className, classes),
exitedClassName: 'collapse',
exitingClassName: 'collapsing',
enteredClassName: 'collapse in',
enteringClassName: 'collapsing',
onEnter: handleEnter,
onEntering: handleEntering,
onEntered: handleEntered,
onExit: handleExit,
onExiting: handleExiting
}));
};
return Collapse;
}(_react2["default"].Component);
Collapse.propTypes = propTypes;
Collapse.defaultProps = defaultProps;
exports["default"] = Collapse;
module.exports = exports['default'];
/***/ }),
/***/ 1518:
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = capitalize;
function capitalize(string) {
return "" + string.charAt(0).toUpperCase() + string.slice(1);
}
module.exports = exports["default"];
/***/ }),
/***/ 1519:
/***/ (function(module, exports, __webpack_require__) {
"use strict";
exports.__esModule = true;
exports.default = all;
var _createChainableTypeChecker = __webpack_require__(922);
var _createChainableTypeChecker2 = _interopRequireDefault(_createChainableTypeChecker);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function all() {
for (var _len = arguments.length, validators = Array(_len), _key = 0; _key < _len; _key++) {
validators[_key] = arguments[_key];
}
function allPropTypes() {
for (var _len2 = arguments.length, args = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
args[_key2] = arguments[_key2];
}
var error = null;
validators.forEach(function (validator) {
if (error != null) {
return;
}
var result = validator.apply(undefined, args);
if (result != null) {
error = result;
}
});
return error;
}
return (0, _createChainableTypeChecker2.default)(allPropTypes);
} /**
* This source code is quoted from rc-util.
* homepage: https://github.com/react-component/util
*/
/***/ }),
/***/ 1520:
/***/ (function(module, exports, __webpack_require__) {
"use strict";
exports.__esModule = true;
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; /**
* This source code is quoted from rc-util.
* homepage: https://github.com/react-component/util
*/
var _react = __webpack_require__(0);
var _react2 = _interopRequireDefault(_react);
var _createChainableTypeChecker = __webpack_require__(922);
var _createChainableTypeChecker2 = _interopRequireDefault(_createChainableTypeChecker);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function validate(props, propName, componentName, location, propFullName) {
var propValue = props[propName];
var propType = typeof propValue === 'undefined' ? 'undefined' : _typeof(propValue);
if (_react2.default.isValidElement(propValue)) {
return new Error('Invalid ' + location + ' `' + propFullName + '` of type ReactElement ' + ('supplied to `' + componentName + '`, expected a ReactComponent or a ') + 'DOMElement. You can usually obtain a ReactComponent or DOMElement ' + 'from a ReactElement by attaching a ref to it.');
}
if ((propType !== 'object' || typeof propValue.render !== 'function') && propValue.nodeType !== 1) {
return new Error('Invalid ' + location + ' `' + propFullName + '` of value `' + propValue + '` ' + ('supplied to `' + componentName + '`, expected a ReactComponent or a ') + 'DOMElement.');
}
return null;
}
exports.default = (0, _createChainableTypeChecker2.default)(validate);
/***/ }),
/***/ 1521:
/***/ (function(module, exports, __webpack_require__) {
"use strict";
exports.__esModule = true;
exports.default = deprecated;
var _warning = __webpack_require__(27);
var _warning2 = _interopRequireDefault(_warning);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var warned = {}; /**
* This source code is quoted from rc-util.
* homepage: https://github.com/react-component/util
*/
function deprecated(validator, reason) {
return function validate(props, propName, componentName, location, propFullName) {
var componentNameSafe = componentName || '<<anonymous>>';
var propFullNameSafe = propFullName || propName;
if (props[propName] != null) {
var messageKey = componentName + '.' + propName;
(0, _warning2.default)(warned[messageKey], 'The ' + location + ' `' + propFullNameSafe + '` of ' + ('`' + componentNameSafe + '` is deprecated. ' + reason + '.'));
warned[messageKey] = true;
}
for (var _len = arguments.length, args = Array(_len > 5 ? _len - 5 : 0), _key = 5; _key < _len; _key++) {
args[_key - 5] = arguments[_key];
}
return validator.apply(undefined, [props, propName, componentName, location, propFullName].concat(args));
};
}
/* eslint-disable no-underscore-dangle */
function _resetWarned() {
warned = {};
}
deprecated._resetWarned = _resetWarned;
/* eslint-enable no-underscore-dangle */
/***/ }),
/***/ 1522:
/***/ (function(module, exports, __webpack_require__) {
"use strict";
exports.__esModule = true;
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; /**
* This source code is quoted from rc-util.
* homepage: https://github.com/react-component/util
*/
var _react = __webpack_require__(0);
var _react2 = _interopRequireDefault(_react);
var _createChainableTypeChecker = __webpack_require__(922);
var _createChainableTypeChecker2 = _interopRequireDefault(_createChainableTypeChecker);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function elementType(props, propName, componentName, location, propFullName) {
var propValue = props[propName];
var propType = typeof propValue === 'undefined' ? 'undefined' : _typeof(propValue);
if (_react2.default.isValidElement(propValue)) {
return new Error('Invalid ' + location + ' `' + propFullName + '` of type ReactElement ' + ('supplied to `' + componentName + '`, expected an element type (a string ') + 'or a ReactClass).');
}
if (propType !== 'function' && propType !== 'string') {
return new Error('Invalid ' + location + ' `' + propFullName + '` of value `' + propValue + '` ' + ('supplied to `' + componentName + '`, expected an element type (a string ') + 'or a ReactClass).');
}
return null;
}
exports.default = (0, _createChainableTypeChecker2.default)(elementType);
/***/ }),
/***/ 1523:
/***/ (function(module, exports, __webpack_require__) {
"use strict";
exports.__esModule = true;
exports.default = isRequiredForA11y;
/**
* This source code is quoted from rc-util.
* homepage: https://github.com/react-component/util
*/
functi