The Focus Cell feature highlights the active cell with a semi-transparent overlay on its entire row and column, making it easier to identify the current position in a large spreadsheet.
You can configure the focusCell through the workbook options:
Enable or Disable
Use the enabled property to toggle the focus cell highlight:
Color
Set the highlight color using theme colors or RGBA values(the opacity from color as high priority):
Opacity
Adjust the transparency of the highlight overlay:
import * as React from 'react';
import { createRoot } from 'react-dom/client';
import './styles.css';
import { AppFunc } from './app-func';
import { App } from './app-class';
// 1. Functional Component sample
createRoot(document.getElementById('app')).render(<AppFunc />);
// 2. Class Component sample
// createRoot(document.getElementById('app')).render(<App />);
import * as React from 'react';
import { SpreadSheets, Worksheet } from '@mescius/spread-sheets-react';
import { data } from './data';
export function AppFunc() {
var spreadRef = React.useRef(null);
var enabledState = React.useState(false);
var focusCellEnabled = enabledState[0];
var setFocusCellEnabled = enabledState[1];
var colorState = React.useState('');
var focusCellColor = colorState[0];
var setFocusCellColor = colorState[1];
var opacityState = React.useState(0);
var focusCellOpacity = opacityState[0];
var setFocusCellOpacity = opacityState[1];
function updateFocusCell(enabled, color, opacity) {
if (!spreadRef.current) return;
spreadRef.current.options.focusCell = {
enabled: enabled,
color: color,
opacity: opacity
};
}
function initSpread(spread) {
spreadRef.current = spread;
spread.fromJSON(data[0]);
// Enable focus cell and read options to init component values
spread.options.focusCell.enabled = true;
var focusCell = spread.options.focusCell || {};
setFocusCellEnabled(true);
setFocusCellColor(focusCell.color || '');
setFocusCellOpacity(focusCell.opacity || 0.22);
}
function handleEnabledChange(e) {
var val = e.target.checked;
setFocusCellEnabled(val);
updateFocusCell(val, focusCellColor, focusCellOpacity);
}
function handleColorChange(e) {
var val = e.target.value;
setFocusCellColor(val);
}
function handleSetColor() {
updateFocusCell(focusCellEnabled, focusCellColor, focusCellOpacity);
}
function handleOpacityChange(e) {
var val = parseFloat(e.target.value);
setFocusCellOpacity(val);
updateFocusCell(focusCellEnabled, focusCellColor, val);
}
return (
<div className="sample-tutorial">
<div className="sample-spreadsheets">
<SpreadSheets hostStyle={{ width: '100%', height: '100%' }} workbookInitialized={initSpread}>
<Worksheet />
</SpreadSheets>
</div>
<aside className="options-container" aria-label="Focus Cell Settings">
<div className="panel-header">
<h1>Focus Cell Settings</h1>
<p className="panel-description">Change the properties below to see how they affect the focus cell highlight.</p>
</div>
<section className="control-section">
<h2>Availability</h2>
<label className="check-field" htmlFor="chk_enabled">
<input type="checkbox" id="chk_enabled" checked={focusCellEnabled} onChange={handleEnabledChange} />
<span>
<strong>Enable Focus Cell</strong>
</span>
</label>
</section>
<section className="control-section">
<h2>Highlight Style</h2>
<div className="field">
<label htmlFor="focusCellColor">Color</label>
<div className="field-row">
<input type="text" id="focusCellColor" value={focusCellColor} disabled={!focusCellEnabled} onChange={handleColorChange} />
<input type="button" value="Set" id="setFocusCellColor" disabled={!focusCellEnabled} onClick={handleSetColor} className="narrow" />
</div>
</div>
<div className="field">
<label htmlFor="focusCellOpacity">Opacity</label>
<div className="field-row range-field">
<input type="range" id="focusCellOpacity" min="0" max="1" step="0.01" value={focusCellOpacity} disabled={!focusCellEnabled} onChange={handleOpacityChange} />
<span className="opacity-value">{focusCellOpacity.toFixed(2)}</span>
</div>
</div>
</section>
</aside>
</div>
);
}
import * as React from 'react';
import { SpreadSheets, Worksheet } from '@mescius/spread-sheets-react';
import { data } from './data';
import './styles.css';
const Component = React.Component, useState = React.useState;
export class App extends Component {
constructor(props) {
super(props);
this.spread = null;
}
render() {
return (
<div className="sample-tutorial">
<div className="sample-spreadsheets">
<SpreadSheets hostStyle={{ width: '100%', height: '100%' }} workbookInitialized={spread => this.initSpread(spread)}>
<Worksheet></Worksheet>
</SpreadSheets>
</div>
<Panel
setEnabled={(e) => this.setEnabled(e)}
setColor={(e) => this.setColor(e)}
applyColor={() => this.applyColor()}
setOpacity={(e) => this.setOpacity(e)}
></Panel>
</div>
);
}
initSpread(spread) {
this.spread = spread;
spread.fromJSON(data[0]);
// Enable focus cell and read options to init component values
spread.options.focusCell.enabled = true;
var focusCell = spread.options.focusCell || {};
this.panel.initComponentValues(true, focusCell.color || '', focusCell.opacity || 0.22);
}
setEnabled(e) {
var enabled = e.target.checked;
this.spread.options.focusCell.enabled = enabled;
this.panel.updateDisabledState(!enabled);
}
setColor(e) {
this.color = e.target.value;
}
applyColor() {
this.spread.options.focusCell.color = this.color;
}
setOpacity(e) {
var opacity = parseFloat(e.target.value);
this.spread.options.focusCell.opacity = opacity;
this.panel.updateOpacityText(opacity.toFixed(2));
}
}
class Panel extends Component {
constructor(props) {
super(props);
this.state = {
enabled: true,
color: '',
opacity: 0.22,
disabled: false,
opacityText: '0.22'
};
}
initComponentValues(enabled, color, opacity) {
this.setState({
enabled: enabled,
color: color,
opacity: opacity,
disabled: !enabled,
opacityText: opacity.toFixed(2)
});
}
updateDisabledState(disabled) {
this.setState({ disabled: disabled });
}
updateOpacityText(text) {
this.setState({ opacityText: text });
}
render() {
let props = this.props;
return (
<aside className="options-container" aria-label="Focus Cell Settings">
<div className="panel-header">
<h1>Focus Cell Settings</h1>
<p className="panel-description">Change the properties below to see how they affect the focus cell highlight.</p>
</div>
<section className="control-section">
<h2>Availability</h2>
<label className="check-field" htmlFor="chk_enabled">
<input type="checkbox" id="chk_enabled" checked={this.state.enabled} onChange={props.setEnabled} />
<span>
<strong>Enable Focus Cell</strong>
</span>
</label>
</section>
<section className="control-section">
<h2>Highlight Style</h2>
<div className="field">
<label htmlFor="focusCellColor">Color</label>
<div className="field-row">
<input type="text" id="focusCellColor" value={this.state.color} disabled={this.state.disabled} onChange={(e) => {
this.setState({ color: e.target.value });
props.setColor(e);
}} />
<input type="button" value="Set" id="setFocusCellColor" disabled={this.state.disabled} onClick={props.applyColor} className="narrow" />
</div>
</div>
<div className="field">
<label htmlFor="focusCellOpacity">Opacity</label>
<div className="field-row range-field">
<input type="range" id="focusCellOpacity" min="0" max="1" step="0.01" value={this.state.opacity} disabled={this.state.disabled} onChange={props.setOpacity} />
<span className="opacity-value">{this.state.opacityText}</span>
</div>
</div>
</section>
</aside>
);
}
}
<!doctype html>
<html style="height:100%;font-size:14px;">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" type="text/css" href="$DEMOROOT$/en/react/node_modules/@mescius/spread-sheets/styles/gc.spread.sheets.excel2013white.css">
<!-- SystemJS -->
<script src="$DEMOROOT$/en/react/node_modules/systemjs/dist/system.src.js"></script>
<script src="systemjs.config.js"></script>
<script>
System.import('$DEMOROOT$/en/lib/react/license.js').then(function () {
System.import('./src/app');
});
</script>
</head>
<body>
<div id="app"></div>
</body>
</html>
body {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: 0;
color: #1f2933;
background: #f7f8fa;
}
#app {
height: 100%;
}
.sample-tutorial {
display: flex;
height: 100%;
overflow: hidden;
}
.sample-spreadsheets {
flex: 1 1 auto;
min-width: 0;
height: 100%;
overflow: hidden;
}
.options-container {
flex: 0 0 320px;
width: 320px;
height: 100%;
padding: 24px 20px;
box-sizing: border-box;
overflow: auto;
background: #fff;
border-left: 1px solid #e5e7eb;
}
.panel-header {
padding-bottom: 20px;
border-bottom: 1px solid #eef0f3;
}
.panel-header h1 {
margin: 0;
font-size: 20px;
font-weight: 650;
line-height: 1.25;
}
.panel-description {
margin: 10px 0 0;
color: #6b7280;
font-size: 13px;
line-height: 1.6;
}
.control-section {
padding: 20px 0;
border-bottom: 1px solid #eef0f3;
}
.control-section:last-child {
border-bottom: 0;
}
.control-section h2 {
margin: 0 0 14px;
color: #374151;
font-size: 13px;
font-weight: 700;
line-height: 1.3;
}
.field {
display: grid;
gap: 7px;
margin-bottom: 14px;
}
.field:last-child {
margin-bottom: 0;
}
.options-container label {
color: #374151;
font-size: 13px;
font-weight: 600;
line-height: 1.35;
}
.field-row {
display: flex;
align-items: center;
gap: 8px;
}
.field-row input[type="text"] {
flex: 1 1 auto;
min-width: 0;
}
.options-container input[type="text"],
.options-container input[type="button"].narrow {
height: 34px;
box-sizing: border-box;
font: inherit;
border-radius: 6px;
}
.options-container input[type="text"] {
width: 100%;
padding: 0 10px;
color: #111827;
background: #fff;
border: 1px solid #d8dde5;
outline: none;
transition: border-color .15s ease, box-shadow .15s ease;
}
.options-container input[type="text"]:focus {
border-color: #2563eb;
box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}
.options-container input[type="button"].narrow {
flex: 0 0 60px;
width: 60px;
color: #fff;
border: 1px solid #2563eb;
background: #2563eb;
cursor: pointer;
}
.options-container input[type="button"].narrow:hover:not(:disabled) {
background: #1d4ed8;
}
.options-container input:disabled {
color: #8d969e;
border-color: #d9dee3;
background: #eef1f4;
cursor: not-allowed;
}
.check-field {
display: flex;
gap: 10px;
align-items: flex-start;
padding: 10px 0;
cursor: pointer;
}
.check-field input {
width: 16px;
height: 16px;
margin: 2px 0 0;
accent-color: #2563eb;
flex: 0 0 auto;
}
.check-field span {
display: grid;
gap: 3px;
}
.check-field strong {
color: #1f2933;
font-size: 13px;
font-weight: 650;
line-height: 1.35;
}
.range-field input[type="range"] {
flex: 1 1 auto;
min-width: 0;
margin: 0;
accent-color: #2563eb;
}
.opacity-value {
flex: 0 0 auto;
min-width: 38px;
padding: 4px 7px;
color: #2f4f6f;
text-align: center;
border-radius: 6px;
background: #e9f1fb;
font-size: 13px;
line-height: 1.4;
}
@media (max-width: 760px) {
.sample-tutorial {
flex-direction: column;
}
.sample-spreadsheets {
min-height: 55%;
}
.options-container {
flex: 0 0 auto;
width: 100%;
height: 45%;
border-top: 1px solid #e5e7eb;
border-left: 0;
}
}
export var data = [{
"version":"14.0.5",
"tabStripRatio":0.6,
"customList":[
],
"sheets":{
"Sheet1":{
"name":"Sheet1",
"isSelected":true,
"rowCount":100,
"columnCount":100,
"activeRow":8,
"theme":{
"name":"Office",
"themeColor":{
"name":"Office",
"background1":{
"a":255,
"r":255,
"g":255,
"b":255
},
"background2":{
"a":255,
"r":231,
"g":230,
"b":230
},
"text1":{
"a":255,
"r":0,
"g":0,
"b":0
},
"text2":{
"a":255,
"r":68,
"g":84,
"b":106
},
"accent1":{
"a":255,
"r":68,
"g":114,
"b":196
},
"accent2":{
"a":255,
"r":237,
"g":125,
"b":49
},
"accent3":{
"a":255,
"r":165,
"g":165,
"b":165
},
"accent4":{
"a":255,
"r":255,
"g":192,
"b":0
},
"accent5":{
"a":255,
"r":91,
"g":155,
"b":213
},
"accent6":{
"a":255,
"r":112,
"g":173,
"b":71
},
"hyperlink":{
"a":255,
"r":5,
"g":99,
"b":193
},
"followedHyperlink":{
"a":255,
"r":149,
"g":79,
"b":114
}
},
"headingFont":"Calibri Light",
"bodyFont":"Calibri"
},
"data":{
"dataTable":{
"0":{
"0":{
"value":"Film"
},
"1":{
"value":"Genre"
},
"2":{
"value":"Lead Studio"
},
"3":{
"value":"Audience Score %"
},
"4":{
"value":"Profitability"
},
"5":{
"value":"Rating"
},
"6":{
"value":"Worldwide Gross"
},
"7":{
"value":"Year"
}
},
"1":{
"0":{
"value":"27 Dresses",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Comedy",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Fox",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":71,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":5.34,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":40,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":160.3,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2008,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"2":{
"0":{
"value":"(500) Days of Summer",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Comedy",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Fox",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":81,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":8.09,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":87,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":60.72,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2009,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"3":{
"0":{
"value":"A Dangerous Method",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Drama",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Independent",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":89,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":0.44,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":79,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":8.97,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2011,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"4":{
"0":{
"value":"A Serious Man",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Drama",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Universal",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":64,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":4.38,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":89,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":30.68,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2009,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"5":{
"0":{
"value":"Across the Universe",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Romance",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Independent",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":84,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":0.65,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":54,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":29.36,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2007,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"6":{
"0":{
"value":"Beginners",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Comedy",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Independent",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":80,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":4.47,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":84,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":14.31,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2011,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"7":{
"0":{
"value":"Dear John",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Drama",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Sony",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":66,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":46,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":29,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":114.97,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2010,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"8":{
"0":{
"value":"Enchanted",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Comedy",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Disney",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":80,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":4,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":93,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":340.48,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2007,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"9":{
"0":{
"value":"Fireproof",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Drama",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Independent",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":51,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":66.93,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":40,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":33.46,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2008,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"10":{
"0":{
"value":"Four Christmases",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Comedy",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Warner Bros.",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":52,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":2.02,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":26,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":161.83,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2008,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"11":{
"0":{
"value":"Ghosts of Girlfriends Past",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Comedy",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Warner Bros.",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":47,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":20.44,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":27,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":102.22,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2009,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"12":{
"0":{
"value":"Gnomeo and Juliet",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Animation",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Disney",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":52,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":5.38,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":56,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":193.96,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2011,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"13":{
"0":{
"value":"Going the Distance",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Comedy",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Warner Bros.",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":56,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":1.31,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":53,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":42.05,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2010,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"14":{
"0":{
"value":"Good Luck Chuck",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Comedy",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Lionsgate",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":61,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":2.36,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":3,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":59.19,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2007,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"15":{
"0":{
"value":"He's Just Not That Into You",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Comedy",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Warner Bros.",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":60,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":7.15,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":42,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":178.84,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2009,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"16":{
"0":{
"value":"High School Musical 3: Senior Year",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Comedy",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Disney",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":76,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":22.91,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":65,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":252.04,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2008,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"17":{
"0":{
"value":"I Love You Phillip Morris",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Comedy",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Independent",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":57,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":1.34,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":71,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":20.1,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2010,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"18":{
"0":{
"value":"It's Complicated",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Comedy",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Universal",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":63,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":2.64,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":56,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":224.6,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2009,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"19":{
"0":{
"value":"Jane Eyre",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Romance",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Universal",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":77,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":85,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":30.14,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2011,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"20":{
"0":{
"value":"Just Wright",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Comedy",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Fox",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":58,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":1.79,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":45,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":21.56,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2010,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"21":{
"0":{
"value":"Killers",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Action",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Lionsgate",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":45,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":1.24,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":11,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":93.4,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2010,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"22":{
"0":{
"value":"Knocked Up",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Comedy",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Universal",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":83,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":6.63,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":91,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":219,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2007,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"23":{
"0":{
"value":"Leap Year",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Comedy",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Universal",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":49,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":1.71,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":21,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":32.59,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2010,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"24":{
"0":{
"value":"Letters to Juliet",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Comedy",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Summit",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":62,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":2.7,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":40,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":79.18,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2010,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"25":{
"0":{
"value":"License to Wed",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Comedy",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Warner Bros.",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":55,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":1.98,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":8,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":69.3,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2007,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"26":{
"0":{
"value":"Life as We Know It",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Comedy",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Independent",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":62,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":2.53,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":28,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":96.16,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2010,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"27":{
"0":{
"value":"Love & Other Drugs",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Comedy",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Fox",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":55,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":1.81,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":48,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":54.53,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2010,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"28":{
"0":{
"value":"Love Happens",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Drama",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Universal",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":40,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":2,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":18,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":36.08,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2009,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"29":{
"0":{
"value":"Made of Honor",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Comedy",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Sony",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":61,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":2.64,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":13,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":105.96,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2008,
"style":"__builtInTableStyle0__builtInStyle2"
}
},
"30":{
"0":{
"value":"Mamma Mia!",
"style":"__builtInTableStyle0__builtInStyle2"
},
"1":{
"value":"Comedy",
"style":"__builtInTableStyle0__builtInStyle2"
},
"2":{
"value":"Universal",
"style":"__builtInTableStyle0__builtInStyle2"
},
"3":{
"value":76,
"style":"__builtInTableStyle0__builtInStyle2"
},
"4":{
"value":9.23,
"style":"__builtInTableStyle1__builtInStyle3"
},
"5":{
"value":53,
"style":"__builtInTableStyle0__builtInStyle2"
},
"6":{
"value":609.47,
"style":"__builtInTableStyle1__builtInStyle3"
},
"7":{
"value":2008,
"style":"__builtInTableStyle0__builtInStyle2"
}
}
},
"defaultDataNode":{
"style":{
"backColor":null,
"foreColor":"Text 1 0",
"vAlign":2,
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"borderLeft":null,
"borderTop":null,
"borderRight":null,
"borderBottom":null,
"locked":true,
"textIndent":0,
"wordWrap":false,
"diagonalDown":null,
"diagonalUp":null
}
}
},
"rowHeaderData":{
"defaultDataNode":{
"style":{
"themeFont":"Body"
}
}
},
"colHeaderData":{
"defaultDataNode":{
"style":{
"themeFont":"Body"
}
}
},
"rows":[
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":20
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
},
{
"size":19
}
],
"columns":[
{
"size":204
},
{
"size":93
},
{
"size":120
},
{
"size":120
},
{
"size":93
},
{
"size":77
},
{
"size":117
}
],
"leftCellIndex":0,
"topCellIndex":0,
"selections":{
"0":{
"row":8,
"rowCount":1,
"col":0,
"colCount":1
},
"length":1
},
"defaults":{
"colHeaderRowHeight":20,
"colWidth":64,
"rowHeaderColWidth":40,
"rowHeight":19.2,
"_isExcelDefaultColumnWidth":true
},
"rowOutlines":{
"items":[
]
},
"columnOutlines":{
"items":[
]
},
"cellStates":{
},
"outlineColumnOptions":{
},
"autoMergeRangeInfos":[
],
"tables":[
{
"name":"Table1",
"row":0,
"col":0,
"rowCount":31,
"colCount":8,
"style":{
"buildInName":"Medium18"
},
"rowFilter":{
"range":{
"row":1,
"rowCount":30,
"col":0,
"colCount":8
},
"typeName":"HideRowFilter",
"dialogVisibleInfo":{
},
"filterButtonVisibleInfo":{
"0":false,
"1":false,
"2":false,
"3":false,
"4":false,
"5":false,
"6":false,
"7":false
},
"showFilterButton":false
},
"columns":[
{
"id":1,
"name":"Film"
},
{
"id":2,
"name":"Genre"
},
{
"id":3,
"name":"Lead Studio"
},
{
"id":4,
"name":"Audience Score"
},
{
"id":5,
"name":"Profitability"
},
{
"id":6,
"name":"Rating"
},
{
"id":7,
"name":"Worldwide Gross"
},
{
"id":8,
"name":"Year"
}
]
}
],
"index":0
}
},
"namedStyles":[
{
"backColor":"Accent 1 80",
"foreColor":"Text 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"20% - Accent1"
},
{
"backColor":"Accent 2 80",
"foreColor":"Text 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"20% - Accent2"
},
{
"backColor":"Accent 3 80",
"foreColor":"Text 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"20% - Accent3"
},
{
"backColor":"Accent 4 80",
"foreColor":"Text 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"20% - Accent4"
},
{
"backColor":"Accent 5 80",
"foreColor":"Text 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"20% - Accent5"
},
{
"backColor":"Accent 6 80",
"foreColor":"Text 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"20% - Accent6"
},
{
"backColor":"Accent 1 60",
"foreColor":"Text 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"40% - Accent1"
},
{
"backColor":"Accent 2 60",
"foreColor":"Text 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"40% - Accent2"
},
{
"backColor":"Accent 3 60",
"foreColor":"Text 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"40% - Accent3"
},
{
"backColor":"Accent 4 60",
"foreColor":"Text 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"40% - Accent4"
},
{
"backColor":"Accent 5 60",
"foreColor":"Text 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"40% - Accent5"
},
{
"backColor":"Accent 6 60",
"foreColor":"Text 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"40% - Accent6"
},
{
"backColor":"Accent 1 40",
"foreColor":"Background 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"60% - Accent1"
},
{
"backColor":"Accent 2 40",
"foreColor":"Background 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"60% - Accent2"
},
{
"backColor":"Accent 3 40",
"foreColor":"Background 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"60% - Accent3"
},
{
"backColor":"Accent 4 40",
"foreColor":"Background 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"60% - Accent4"
},
{
"backColor":"Accent 5 40",
"foreColor":"Background 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"60% - Accent5"
},
{
"backColor":"Accent 6 40",
"foreColor":"Background 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"60% - Accent6"
},
{
"backColor":"Accent 1 0",
"foreColor":"Background 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"Accent1"
},
{
"backColor":"Accent 2 0",
"foreColor":"Background 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"Accent2"
},
{
"backColor":"Accent 3 0",
"foreColor":"Background 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"Accent3"
},
{
"backColor":"Accent 4 0",
"foreColor":"Background 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"Accent4"
},
{
"backColor":"Accent 5 0",
"foreColor":"Background 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"Accent5"
},
{
"backColor":"Accent 6 0",
"foreColor":"Background 1 0",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"Accent6"
},
{
"backColor":"#ffc7ce",
"foreColor":"#9c0006",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"Bad"
},
{
"backColor":"#f2f2f2",
"foreColor":"#fa7d00",
"font":"normal bold 14.7px Calibri",
"themeFont":"Body",
"borderLeft":{
"color":"#7f7f7f",
"style":1
},
"borderTop":{
"color":"#7f7f7f",
"style":1
},
"borderRight":{
"color":"#7f7f7f",
"style":1
},
"borderBottom":{
"color":"#7f7f7f",
"style":1
},
"name":"Calculation",
"diagonalDown":null,
"diagonalUp":null
},
{
"backColor":"#a5a5a5",
"foreColor":"Background 1 0",
"font":"normal bold 14.7px Calibri",
"themeFont":"Body",
"borderLeft":{
"color":"#3f3f3f",
"style":6
},
"borderTop":{
"color":"#3f3f3f",
"style":6
},
"borderRight":{
"color":"#3f3f3f",
"style":6
},
"borderBottom":{
"color":"#3f3f3f",
"style":6
},
"name":"Check Cell",
"diagonalDown":null,
"diagonalUp":null
},
{
"backColor":null,
"formatter":"_(* #,##0.00_);_(* (#,##0.00);_(* \"-\"??_);_(@_)",
"name":"Comma"
},
{
"backColor":null,
"formatter":"_(* #,##0_);_(* (#,##0);_(* \"-\"_);_(@_)",
"name":"Comma [0]"
},
{
"backColor":null,
"formatter":"_(\"$\"* #,##0.00_);_(\"$\"* (#,##0.00);_(\"$\"* \"-\"??_);_(@_)",
"name":"Currency"
},
{
"backColor":null,
"formatter":"_(\"$\"* #,##0_);_(\"$\"* (#,##0);_(\"$\"* \"-\"_);_(@_)",
"name":"Currency [0]"
},
{
"backColor":null,
"foreColor":"#7f7f7f",
"font":"italic normal 14.7px Calibri",
"themeFont":"Body",
"name":"Explanatory Text"
},
{
"backColor":"#c6efce",
"foreColor":"#006100",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"Good"
},
{
"backColor":null,
"foreColor":"Text 2 0",
"font":"normal bold 20px Calibri",
"themeFont":"Body",
"borderLeft":null,
"borderTop":null,
"borderRight":null,
"borderBottom":{
"color":"Accent 1 0",
"style":5
},
"name":"Heading 1",
"diagonalDown":null,
"diagonalUp":null
},
{
"backColor":null,
"foreColor":"Text 2 0",
"font":"normal bold 17.3px Calibri",
"themeFont":"Body",
"borderLeft":null,
"borderTop":null,
"borderRight":null,
"borderBottom":{
"color":"Accent 1 50",
"style":5
},
"name":"Heading 2",
"diagonalDown":null,
"diagonalUp":null
},
{
"backColor":null,
"foreColor":"Text 2 0",
"font":"normal bold 14.7px Calibri",
"themeFont":"Body",
"borderLeft":null,
"borderTop":null,
"borderRight":null,
"borderBottom":{
"color":"Accent 1 40",
"style":2
},
"name":"Heading 3",
"diagonalDown":null,
"diagonalUp":null
},
{
"backColor":null,
"foreColor":"Text 2 0",
"font":"normal bold 14.7px Calibri",
"themeFont":"Body",
"name":"Heading 4"
},
{
"backColor":"#ffcc99",
"foreColor":"#3f3f76",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"borderLeft":{
"color":"#7f7f7f",
"style":1
},
"borderTop":{
"color":"#7f7f7f",
"style":1
},
"borderRight":{
"color":"#7f7f7f",
"style":1
},
"borderBottom":{
"color":"#7f7f7f",
"style":1
},
"name":"Input",
"diagonalDown":null,
"diagonalUp":null
},
{
"backColor":null,
"foreColor":"#fa7d00",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"borderLeft":null,
"borderTop":null,
"borderRight":null,
"borderBottom":{
"color":"#ff8001",
"style":6
},
"name":"Linked Cell",
"diagonalDown":null,
"diagonalUp":null
},
{
"backColor":"#ffeb9c",
"foreColor":"#9c6500",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"Neutral"
},
{
"backColor":null,
"foreColor":"Text 1 0",
"hAlign":3,
"vAlign":2,
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"borderLeft":null,
"borderTop":null,
"borderRight":null,
"borderBottom":null,
"locked":true,
"textIndent":0,
"wordWrap":false,
"name":"Normal",
"diagonalDown":null,
"diagonalUp":null
},
{
"backColor":"#ffffcc",
"borderLeft":{
"color":"#b2b2b2",
"style":1
},
"borderTop":{
"color":"#b2b2b2",
"style":1
},
"borderRight":{
"color":"#b2b2b2",
"style":1
},
"borderBottom":{
"color":"#b2b2b2",
"style":1
},
"name":"Note",
"diagonalDown":null,
"diagonalUp":null
},
{
"backColor":"#f2f2f2",
"foreColor":"#3f3f3f",
"font":"normal bold 14.7px Calibri",
"themeFont":"Body",
"borderLeft":{
"color":"#3f3f3f",
"style":1
},
"borderTop":{
"color":"#3f3f3f",
"style":1
},
"borderRight":{
"color":"#3f3f3f",
"style":1
},
"borderBottom":{
"color":"#3f3f3f",
"style":1
},
"name":"Output",
"diagonalDown":null,
"diagonalUp":null
},
{
"backColor":null,
"formatter":"0%",
"name":"Percent"
},
{
"backColor":null,
"foreColor":"Text 2 0",
"font":"normal bold 24px Calibri Light",
"themeFont":"Headings",
"name":"Title"
},
{
"backColor":null,
"foreColor":"Text 1 0",
"font":"normal bold 14.7px Calibri",
"themeFont":"Body",
"borderLeft":null,
"borderTop":{
"color":"Accent 1 0",
"style":1
},
"borderRight":null,
"borderBottom":{
"color":"Accent 1 0",
"style":6
},
"name":"Total",
"diagonalDown":null,
"diagonalUp":null
},
{
"backColor":null,
"foreColor":"#ff0000",
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"name":"Warning Text"
},
{
"backColor":null,
"foreColor":"Text 1 0",
"hAlign":3,
"vAlign":2,
"font":"normal normal 14.7px Calibri",
"themeFont":"Body",
"formatter":"General",
"borderLeft":null,
"borderTop":null,
"borderRight":null,
"borderBottom":null,
"locked":true,
"textIndent":0,
"wordWrap":false,
"name":"__builtInStyle1",
"diagonalDown":null,
"diagonalUp":null
},
{
"backColor":null,
"foreColor":"#000000",
"hAlign":3,
"vAlign":0,
"font":"normal normal 12px Calibri",
"formatter":"General",
"borderLeft":null,
"borderTop":null,
"borderRight":null,
"borderBottom":null,
"locked":true,
"textIndent":0,
"wordWrap":true,
"name":"__builtInStyle2",
"diagonalDown":null,
"diagonalUp":null
},
{
"backColor":null,
"foreColor":"#000000",
"hAlign":3,
"vAlign":0,
"font":"normal normal 12px Calibri",
"formatter":"#,##0.00",
"borderLeft":null,
"borderTop":null,
"borderRight":null,
"borderBottom":null,
"locked":true,
"textIndent":0,
"wordWrap":true,
"name":"__builtInStyle3",
"diagonalDown":null,
"diagonalUp":null
},
{
"foreColor":"#000000",
"hAlign":3,
"vAlign":0,
"font":"normal normal 12px Calibri",
"formatter":"General",
"locked":true,
"textIndent":0,
"wordWrap":true,
"name":"__builtInTableStyle0__builtInStyle2",
"diagonalDown":null,
"diagonalUp":null
},
{
"foreColor":"#000000",
"hAlign":3,
"vAlign":0,
"font":"normal normal 12px Calibri",
"formatter":"#,##0.00",
"locked":true,
"textIndent":0,
"wordWrap":true,
"name":"__builtInTableStyle1__builtInStyle3",
"diagonalDown":null,
"diagonalUp":null
}
]
}];
(function (global) {
System.config({
transpiler: 'plugin-babel',
babelOptions: {
es2015: true,
react: true
},
meta: {
'*.css': { loader: 'css' }
},
paths: {
// paths serve as alias
'npm:': 'node_modules/',
'cdn:': 'https://cdn.mescius.io/demoapps/packages/spreadjs/19.2.2-master-2026-09-02-2133/'
},
// map tells the System loader where to look for things
map: {
'@mescius/spread-sheets': 'cdn:@mescius/spread-sheets/index.js',
'@mescius/spread-sheets-shapes': 'cdn:@mescius/spread-sheets-shapes/index.js',
'@mescius/spread-sheets-slicers': 'cdn:@mescius/spread-sheets-slicers/index.js',
'@mescius/spread-sheets-charts': 'cdn:@mescius/spread-sheets-charts/index.js',
'@mescius/spread-sheets-react': 'cdn:@mescius/spread-sheets-react/index.js',
'@grapecity/jsob-test-dependency-package/react-components': 'npm:@grapecity/jsob-test-dependency-package/react-components/index.js',
'react': 'npm:react/cjs/react.production.js',
'react-dom': 'npm:react-dom/cjs/react-dom.production.js',
'react-dom/client': 'npm:react-dom/cjs/react-dom-client.production.js',
'scheduler': 'npm:scheduler/cjs/scheduler.production.js',
'css': 'npm:systemjs-plugin-css/css.js',
'plugin-babel': 'npm:systemjs-plugin-babel/plugin-babel.js',
'systemjs-babel-build':'npm:systemjs-plugin-babel/systemjs-babel-browser.js'
},
// packages tells the System loader how to load when no filename and/or no extension
packages: {
src: {
defaultExtension: 'jsx'
},
"node_modules": {
defaultExtension: 'js'
},
}
});
})(this);
