UNPKG

@grapecity/spread-sheets-designer-react

Version:

SpreadJS Designer React Wrapper Components.

295 lines (242 loc) 10.6 kB
/*! * * Spread.Sheets.Designer Wrapper Components for React 18.2.2 * * Copyright(c) of respective holders. All rights reserved. * * Licensed under the SpreadJS Commercial License. * */ (function webpackUniversalModuleDefinition(root, factory) { if(typeof exports === 'object' && typeof module === 'object') module.exports = factory(require("react"), require("@grapecity/spread-sheets"), require("@grapecity/spread-sheets-designer")); else if(typeof define === 'function' && define.amd) define(["react", "@grapecity/spread-sheets", "@grapecity/spread-sheets-designer"], factory); else if(typeof exports === 'object') exports["SpreadSheetsDesignerComponents"] = factory(require("react"), require("@grapecity/spread-sheets"), require("@grapecity/spread-sheets-designer")); else root["SpreadSheetsDesignerComponents"] = factory(root["react"], root["@grapecity/spread-sheets"], root["@grapecity/spread-sheets-designer"]); })(this, function(__WEBPACK_EXTERNAL_MODULE_3__, __WEBPACK_EXTERNAL_MODULE_5__, __WEBPACK_EXTERNAL_MODULE_6__) { 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] = { /******/ exports: {}, /******/ id: moduleId, /******/ loaded: false /******/ }; /******/ /******/ // Execute the module function /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); /******/ /******/ // Flag the module as loaded /******/ module.loaded = 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; /******/ /******/ // __webpack_public_path__ /******/ __webpack_require__.p = ""; /******/ /******/ // Load entry module and return exports /******/ return __webpack_require__(0); /******/ }) /************************************************************************/ /******/ ([ /* 0 */ /*!**********************!*\ !*** ./lib/entry.js ***! \**********************/ /***/ (function(module, exports, __webpack_require__) { 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); exports.Designer = undefined; var _Designer = __webpack_require__(/*! ./Designer/Designer */ 1); var _Designer2 = _interopRequireDefault(_Designer); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } exports.Designer = _Designer2.default; /***/ }), /* 1 */ /*!**********************************!*\ !*** ./lib/Designer/Designer.js ***! \**********************************/ /***/ (function(module, exports, __webpack_require__) { 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); var _reactJSImport = __webpack_require__(/*! ../utils/reactJSImport */ 2); var _reactJSImport2 = _interopRequireDefault(_reactJSImport); var _spreadJSImport = __webpack_require__(/*! ../utils/spreadJSImport */ 4); var _spreadJSImport2 = _interopRequireDefault(_spreadJSImport); var _utils = __webpack_require__(/*! ../utils/utils */ 7); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: 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) : subClass.__proto__ = superClass; } var Designer = function (_React$Component) { _inherits(Designer, _React$Component); function Designer(props) { _classCallCheck(this, Designer); var _this = _possibleConstructorReturn(this, (Designer.__proto__ || Object.getPrototypeOf(Designer)).call(this, props)); _this.designerHost = _reactJSImport2.default.createRef(); _this.designer = null; _this.config = props.config; _this.styleInfo = props.styleInfo; _this.spreadOptions = props.spreadOptions; return _this; } _createClass(Designer, [{ key: 'render', value: function render() { return _reactJSImport2.default.createElement('div', { id: 'designer', className: 'designer', ref: this.designerHost, style: this.styleInfo }); } }, { key: 'componentDidMount', value: function componentDidMount() { var designer = new _spreadJSImport2.default.Spread.Sheets.Designer.Designer(this.designerHost.current, /**designer host */ this.config /**If you want to change Designer's layout or rewrite it, you can pass in your own Config JSON */ , undefined /**If you want to use the spread you already created instead of generating a new spread, pass in */ , this.spreadOptions); this.designer = designer; var designerInitialized = this.props.designerInitialized; if (designerInitialized) { designerInitialized(designer); } } }, { key: 'componentWillUnmount', value: function componentWillUnmount() { this.designer.destroy(); } }, { key: 'shouldComponentUpdate', value: function shouldComponentUpdate(nextProps) { var _this2 = this; var styleInfoChange = (0, _utils.getObjectChange)(this.styleInfo, nextProps.styleInfo); if (styleInfoChange[0].length !== 0 || styleInfoChange[1].length !== 0) { styleInfoChange[0].forEach(function (update) { var key = update[0], value = update[1]; _this2.designerHost.current.style[key] = value; }); styleInfoChange[1].forEach(function (removeKey) { _this2.designerHost.current.style[removeKey] = ""; }); } if (nextProps.config !== this.config) { this.config = nextProps.config; this.designer.setConfig(nextProps.config); } return false; } }]); return Designer; }(_reactJSImport2.default.Component); exports.default = Designer; /***/ }), /* 2 */ /*!************************************!*\ !*** ./lib/utils/reactJSImport.js ***! \************************************/ /***/ (function(module, exports, __webpack_require__) { 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); var _react = __webpack_require__(/*! react */ 3); var _react2 = _interopRequireDefault(_react); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } exports.default = _react2.default; /***/ }), /* 3 */ /*!************************!*\ !*** external "react" ***! \************************/ /***/ (function(module, exports) { module.exports = __WEBPACK_EXTERNAL_MODULE_3__; /***/ }), /* 4 */ /*!*************************************!*\ !*** ./lib/utils/spreadJSImport.js ***! \*************************************/ /***/ (function(module, exports, __webpack_require__) { 'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); var _spreadSheets = __webpack_require__(/*! @grapecity/spread-sheets */ 5); var _spreadSheets2 = _interopRequireDefault(_spreadSheets); __webpack_require__(/*! @grapecity/spread-sheets-designer */ 6); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } exports.default = _spreadSheets2.default; /***/ }), /* 5 */ /*!*******************************************!*\ !*** external "@grapecity/spread-sheets" ***! \*******************************************/ /***/ (function(module, exports) { module.exports = __WEBPACK_EXTERNAL_MODULE_5__; /***/ }), /* 6 */ /*!****************************************************!*\ !*** external "@grapecity/spread-sheets-designer" ***! \****************************************************/ /***/ (function(module, exports) { module.exports = __WEBPACK_EXTERNAL_MODULE_6__; /***/ }), /* 7 */ /*!****************************!*\ !*** ./lib/utils/utils.js ***! \****************************/ /***/ (function(module, exports) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var getObjectChange = exports.getObjectChange = function getObjectChange(curObj, newObj) { var _curObj = curObj ? curObj : {}; var _newObj = newObj ? newObj : {}; var updates = [], remove = []; var curKeys = Object.keys(_curObj); var newKeys = Object.keys(_newObj); curKeys.forEach(function (key) { if (!(key in _newObj)) { remove.push(key); } else if (_curObj[key] !== _newObj[key]) { updates.push([key, _newObj[key]]); } }); newKeys.forEach(function (key) { if (!(key in _curObj)) { updates.push([key, _newObj[key]]); } }); return [updates, remove]; }; /***/ }) /******/ ]) }); ; //# sourceMappingURL=gc.spread.sheets.designer.react.18.2.2.js.map