This example shows how you can use nested groupings and custom presenters to get better grid for dataset with game players.
<!DOCTYPE html>
<html lang="en">
<head>
<base href="/dataviewsjs/demos/en/sample/Showcase/PlayerManagement/purejs/" />
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="keywords" content="grid, nested groupings, custom presenters" />
<meta
name="description"
content="This example shows how you can use nested groupings and custom presenters to get better grid for game players dataset"
/>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Player Management | Showcase | MESCIUS DataViewsJS JavaScript Demos</title>
<link href="/dataviewsjs/demos/node_modules/normalize.css/normalize.css" rel="stylesheet" type="text/css" />
<link href="/dataviewsjs/demos/static/css/base.css" rel="stylesheet" type="text/css" />
<link href="/dataviewsjs/demos/static/dataviews/gc.dataviews.core.min.css" rel="stylesheet" type="text/css" />
<link href="/dataviewsjs/demos/static/dataviews/gc.dataviews.grid.min.css" rel="stylesheet" type="text/css" />
<link href="styles.css" rel="stylesheet" type="text/css" />
<script src="/dataviewsjs/demos/static/js/app-polyfills.min.js" type="text/javascript"></script>
<script type="text/javascript">
window.process = {
env: {
NODE_ENV: 'production',
USE_NPM: false,
USE_CDN: false,
SITE_ROOT: '/dataviewsjs/demos',
FRAMEWORK: 'purejs',
DVJS_LICENSE_KEY:
'E348418822993781#B0EWvwY4dNNVQqJHUDpFROVWe5ZWNYFlVQFmRsJWRht4Z6lDO4Vla7YUaXhEWxd7Z5YXMuRnY7tWTQRHSlVnaYlXNhlEOpdkZ0FHWYJ5QKd6VXN5aR3ieGhUav9kZTBXWahkYBhEVutmZ72CbjdlZvV5TVdGdiplQsZXe95kUmNmZVF5cJ3mcypWNyx4UydESE3UblxGZyE7KQ94R4BjbUxUewsiaoREMxRDNllWREV6Voh4Q4dDZPRjWrIzUJl4TERXcQZWMHp4Sp9WaMZzN5o6StJmVDJXcwIVVmR6UMVGOlxUW8RmTxZDZTJWVN5GZqJHZuVDMkVGSW3WdxNzKCdDdSB7TzY7cqlnMU5GVyNzNP9WMyhDRvEEOFdkQORDM4dFVlFFWqFWSyMjNQJiOiMlIsISQyIkQ9YjQxIiOigkIsUTM7YjNxYTM0IicfJye&Qf35VfikFVVljI0IyQiwiIxYHITp4c7VWaWFGdhRkI0IiTis7W0ICZyBlIsIiNxUTN6ADI8EDMxMjMwIjI0ICdyNkIsIyc59yc5l6YzVWbuoCLwpmLzVXajNXZt9iKs2WauMXdpN6cl5mLqwSbvNmLzVXajNXZt9iKsAnau26YuMXdpN6cl5mLqwSbvNmL6VGZ9RXajVGchJ7ZuoCLuNmLt36YukHdpNWZwFmcn9iKs46bj9Se4l6YlBXYydmLqwicr9ybj9Se4l6YlBXYydmLqwCcq9ybj9Se4l6YlBXYydmLqIiOiMXbEJCLiMVVJN4UF5kI0ISYONkIsUWdyRnOiwmdFJCLiEDO7MTO9IjM8gTM4gDNzIiOiQWSisnOiQkIsISP3EkVxBVUHFDMplzLlVUdGd7cI9UeIt4SshESzV7NvY7ZxlDOuNTb5tzLr',
SJS_LICENSE_KEY:
'E518585142165236#B0wm4nx4QzdlTHRTSOFzcvVnaJdjSnNEeXdTMUtSUzk6bU94QuVXNwZVZjd4SzYjcadXRIVEMzEXTThkVyR7R85UayoHZZBTYQ5mZyh4Shd6VxFXazF4cBNGRG5WTvUGTsV4T6knQYRzKxxUdk9EarplU7d6VLF6KIR7bPJ5N6ZUMWZWaURGRKRDbLJDN5YjSN5mUoxmaxonSD56LEh7Y7RXenpmTvomevZlV9dkaysCO7hTRQFHcGRWQyc5LI9kQmB7QwR4Z7ZHOR3CSXp6SiFWYzFXeXZUSp94K8VDTkFjdwl4KptSYlRWcDxmNE5kS6kzdrkVcNJXROVGbLJkcTNGRzIER8tmd4YGNhh7dxAnMvIHRv46VtBXS4U5KvJ6dZJ6M5p4TxIjd9I5QSpXTTV6SDZXb7lzaL56ZiojITJCLikTQxUTQFV4NiojIIJCLyETO7UzM7kTO0IicfJye&Qf35VfikkR9IkI0IyQiwiIyEjL6ByUKBCZhVmcwNlI0IiTis7W0ICZyBlIsISNwkTN6ADI8EDMxMjMwIjI0ICdyNkIsIyc59yc5l6YzVWbuoCLwpmLzVXajNXZt9iKs2WauMXdpN6cl5mLqwSbvNmLzVXajNXZt9iKsAnau26YuMXdpN6cl5mLqwSbvNmL6VGZ9RXajVGchJ7ZuoCLuNmLt36YukHdpNWZwFmcn9iKs46bj9Se4l6YlBXYydmLqwicr9ybj9Se4l6YlBXYydmLqwCcq9ybj9Se4l6YlBXYydmLqIiOiMXbEJCLiMVVJN4UF5kI0ISYONkIsUWdyRnOiwmdFJCLiYzMyUjNxIDNxUDO5gTM5IiOiQWSiwSfdtlOicGbmJCLlNHbhZmOiI7ckJye0ICbuFkI1pjIEJCLi4TPRtGOhtWWEFWd4IDOLRVRvx4SyMGcDhTW6n4ep',
},
};
</script>
<script src="/dataviewsjs/demos/static/dataviews/gc.dataviews.common.min.js" type="text/javascript"></script>
<script src="/dataviewsjs/demos/static/dataviews/gc.dataviews.core.min.js" type="text/javascript"></script>
<script src="/dataviewsjs/demos/static/dataviews/gc.dataviews.grid.min.js" type="text/javascript"></script>
<script src="/dataviewsjs/demos/static/js/license.js" type="text/javascript"></script>
<script src="/dataviewsjs/demos/node_modules/systemjs/dist/system.js" type="text/javascript"></script>
<script src="systemjs.config.js" type="text/javascript"></script>
</head>
<body class="theme-default">
<noscript>You need to enable JavaScript to run this app.</noscript>
<div class="main-container">
<div id="grid"></div>
</div>
<script type="text/javascript">
System.import('./app.js');
</script>
</body>
</html>
import { data } from './data.js';
// helpers
const getColumnWidth = () => (screen.width >= 480 ? '*' : 60);
// presenters
const teamPresenter = '<span class="team-label" style="background-color:{{=it.color}};">{{=it.team}}</span>';
const starPresenter = '<div class="stars-box rating{{=it.skillLevel}}"></div>';
const namePresenter = [
'<span>{{=it.firstName}} </span>',
'<span class="capitalize">"{{=it.summonerName}}" </span>',
'<span>{{=it.lastName}}</span>',
].join('');
// columns
const cols = [
{
id: 'name',
caption: 'Name',
dataField: 'name',
pinned: 'left',
width: 260,
presenter: namePresenter,
},
{
id: 'team',
caption: 'Team',
dataField: 'team',
width: getColumnWidth(),
presenter: teamPresenter,
},
{
id: 'positions',
caption: 'Positions',
dataField: 'positions',
width: getColumnWidth(),
},
{
id: 'skillLevel',
caption: 'Skill Level',
dataField: 'skillLevel',
width: 110,
presenter: starPresenter,
},
{
id: 'communication',
caption: 'Communication',
dataField: 'communication',
width: getColumnWidth(),
},
{
id: 'twitch',
caption: 'Twitch',
dataField: 'twitch',
width: getColumnWidth(),
},
{
id: 'discord',
caption: 'Discord',
dataField: 'discord',
width: getColumnWidth(),
},
];
const getHeaderTemplate = (type) => `
<div class="header-wrapper gutter-{{=it.margin}}" style="margin-left: {{=it.margin+4}}px;">
<div class="group-title">${type === 'team' ? 'Team Name' : 'Qualified For'}</div>
<div class="header-cells">
<div class="header-cell">
<span class="gc-grouping-toggle {{=it.groupStatus}}">
<svg class="expand-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M7,10L12,15L17,10H7Z" /></svg>
<svg class="collapse-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M10,17L15,12L10,7V17Z" /></svg>
</span>
<span class="subgroup-title" level="{{=it.level}}">{{=it.name}}</span>
</div>
<div class="header-cell">
${type !== 'team' ? '<span class="count">Count </span>' : ''}
<b>{{=it.count}}</b>
</div>
</div>
</div>
`;
const layout = new GC.DataViews.GridLayout({
showRowHeader: false,
allowSorting: false,
allowGrouping: false,
allowColumnReorder: false,
allowColumnResize: false,
grouping: [
{
field: 'stage',
header: { height: 56, template: getHeaderTemplate('communication') },
footer: { visible: false },
collapsed: false,
},
{
field: 'team',
header: { height: 56, template: getHeaderTemplate('team') },
footer: { visible: false },
collapsed: false,
},
],
});
new GC.DataViews.DataView(document.getElementById('grid'), data, cols, layout);
// focus data.view by default
document.getElementById('grid').focus();
export const data = [
{
name: 'Cass Williams',
legalFirstName: 'Cassandra',
firstName: 'Cass',
lastName: 'Williams',
summonerName: 'casswillz',
team: 'A Team',
positions: 'Top',
gender: 'Female',
birthday: '1/23/1995',
citizenship: 'USA',
passport: 111111111,
email: 'cass@example.com',
color: 'aliceblue',
stage: 'CS:GO',
communication: 'Discord',
twitch: 'casswillz',
discord: 'casswillz',
skype: 'casswillz',
twitter: 'casswillz',
phone: '(111) 111-1111',
skillLevel: 5,
},
{
name: 'Dan Allerson',
legalFirstName: 'Daniel',
firstName: 'Dan',
lastName: 'Allerson',
summonerName: 'luckboy120',
team: 'A Team',
positions: 'Jungle',
gender: 'Male',
birthday: '2/4/1995',
citizenship: 'USA',
passport: 2222222,
email: 'dan@example.com',
color: 'aliceblue',
stage: 'CS:GO',
communication: 'Email',
twitch: 'luckboy120',
discord: 'luckboy120',
skype: 'luckboy120',
twitter: 'luckboy120',
phone: '(222) 222-2222',
skillLevel: 4,
},
{
name: 'Sandra Chan',
legalFirstName: '',
firstName: 'Sandra',
lastName: 'Chan',
summonerName: 'sanchangirl',
team: 'A Team',
positions: 'Mid',
gender: 'Female',
birthday: '3/17/1995',
citizenship: 'USA',
passport: 3333333,
email: 'sandra@example.com',
color: 'aliceblue',
stage: 'CS:GO',
communication: 'Discord',
twitch: 'sanchangirl',
discord: 'sanchangirl',
skype: 'sanchangirl',
twitter: 'sanchangirl',
phone: '(333) 333-3333',
skillLevel: 5,
},
{
name: 'Laura Jones',
legalFirstName: '',
firstName: 'Laura',
lastName: 'Jones',
summonerName: 'laurjonez349',
team: 'A Team',
positions: 'ADC',
gender: 'Female',
birthday: '4/8/1995',
citizenship: 'USA',
passport: 4444444,
email: 'laura@example.com',
color: 'aliceblue',
stage: 'CS:GO',
communication: 'Twitter',
twitch: 'laurjonez349',
discord: 'laurjonez349',
skype: 'laurjonez349',
twitter: 'laurjonez349',
phone: '(444) 444-4444',
skillLevel: 4,
},
{
name: 'Don Lee',
legalFirstName: 'Donald',
firstName: 'Don',
lastName: 'Lee',
summonerName: 'dlee812',
team: 'A Team',
positions: 'Support',
gender: 'Male',
birthday: '8/15/1994',
citizenship: 'South Korea',
passport: 5555555,
email: 'donald@example.com',
color: 'aliceblue',
stage: 'CS:GO',
communication: 'Discord',
twitch: 'dlee812',
discord: 'dlee812',
skype: 'dlee812',
twitter: 'dlee812',
phone: '(555) 555-5555',
skillLevel: 5,
},
{
name: 'Nishant Kumar',
legalFirstName: '',
firstName: 'Nishant',
lastName: 'Kumar',
summonerName: 'nishantk33',
team: 'Origin',
positions: 'Top',
gender: 'Male',
birthday: '2/23/1994',
citizenship: 'USA',
passport: 6666666,
email: 'nishant@example.com',
color: 'azure',
stage: 'Dota 2',
communication: 'Discord',
twitch: 'nishantk33',
discord: 'nishantk33',
skype: 'nishantk33',
twitter: 'nishantk33',
phone: '(666) 666-6666',
skillLevel: 4,
},
{
name: 'Aditi Gupta',
legalFirstName: '',
firstName: 'Aditi',
lastName: 'Gupta',
summonerName: 'guptaaaaa',
team: 'Origin',
positions: 'Jungle',
gender: 'Female',
birthday: '8/12/1993',
citizenship: 'USA',
passport: 7777777,
email: 'aditi@example.com',
color: 'azure',
stage: 'Dota 2',
communication: 'Email',
twitch: 'guptaaaaa',
discord: 'guptaaaaa',
skype: 'guptaaaaa',
twitter: 'guptaaaaa',
phone: '(777) 777-7777',
skillLevel: 5,
},
{
name: 'Clara Sanchez',
legalFirstName: '',
firstName: 'Clara',
lastName: 'Sanchez',
summonerName: 'clarasanchez09',
team: 'Origin',
positions: 'Mid',
gender: 'Female',
birthday: '12/4/1992',
citizenship: 'USA',
passport: 8888888,
email: 'clara@example.com',
color: 'azure',
stage: 'Dota 2',
communication: 'Email',
twitch: 'clarasanchez09',
discord: 'clarasanchez09',
skype: 'clarasanchez09',
twitter: 'clarasanchez09',
phone: '(888) 888-8888',
skillLevel: 4,
},
{
name: 'Jeff Miller',
legalFirstName: 'Jeffrey',
firstName: 'Jeff',
lastName: 'Miller',
summonerName: 'jmi11ler',
team: 'Origin',
positions: 'ADC',
gender: 'Male',
birthday: '5/24/1993',
citizenship: 'USA',
passport: 9999999,
email: 'jeff@example.com',
color: 'azure',
stage: 'Dota 2',
communication: 'Email',
twitch: 'jmi11ler',
discord: 'jmi11ler',
skype: 'jmi11ler',
twitter: 'jmi11ler',
phone: '(999) 999-9999',
skillLevel: 5,
},
{
name: 'Josiah Taylor',
legalFirstName: '',
firstName: 'Josiah',
lastName: 'Taylor',
summonerName: 'alpal10',
team: 'Origin',
positions: 'Support',
gender: 'Male',
birthday: '2/22/1993',
citizenship: 'USA',
passport: 0,
email: 'josiah@example.com',
color: 'azure',
stage: 'Dota 2',
communication: 'Discord',
twitch: 'alpal10',
discord: 'alpal10',
skype: 'alpal10',
twitter: 'alpal10',
phone: '(000) 000-0000',
skillLevel: 4,
},
{
name: 'Pat Everett',
legalFirstName: '',
firstName: 'Pat',
lastName: 'Everett',
summonerName: 'pat92',
team: 'Record GG',
positions: 'Top',
gender: 'Female',
birthday: '9/17/1992',
citizenship: 'USA',
passport: 1010101,
email: 'pat@example.com',
color: 'gold',
stage: 'Dota 2',
communication: 'Email',
twitch: 'pat92',
discord: 'pat92',
skype: 'pat92',
twitter: 'pat92',
phone: '(111) 111-2222',
skillLevel: 4,
},
{
name: 'Peyton Devereaux',
legalFirstName: '',
firstName: 'Peyton',
lastName: 'Devereaux',
summonerName: 'peypey',
team: 'Record GG',
positions: 'Jungle',
gender: 'Male',
birthday: '7/24/1992',
citizenship: 'France',
passport: 2020202,
email: 'peyton@example.com',
color: 'gold',
stage: 'Dota 2',
communication: 'Email',
twitch: 'peypey',
discord: 'peypey',
skype: 'peypey',
twitter: 'peypey',
phone: '(111) 111-3333',
skillLevel: 3,
},
{
name: 'Quinn Nguyen',
legalFirstName: '',
firstName: 'Quinn',
lastName: 'Nguyen',
summonerName: 'quinnsential',
team: 'Record GG',
positions: 'Mid',
gender: 'Female',
birthday: '11/20/1992',
citizenship: 'Vietnam',
passport: 3030303,
email: 'quinn@example.com',
color: 'gold',
stage: 'Dota 2',
communication: 'Discord',
twitch: 'quinnsential',
discord: 'quinnsential',
skype: 'quinnsential',
twitter: 'quinnsential',
phone: '(111) 111-4444',
skillLevel: 4,
},
{
name: 'Reese Meisner',
legalFirstName: '',
firstName: 'Reese',
lastName: 'Meisner',
summonerName: 'reneemeisner',
team: 'Record GG',
positions: 'ADC',
gender: 'Female',
birthday: '5/28/1993',
citizenship: 'USA',
passport: 4040404,
email: 'renee@example.com',
color: 'gold',
stage: 'Dota 2',
communication: 'Twitter',
twitch: 'reneemeisner',
discord: 'reneemeisner',
skype: 'reneemeisner',
twitter: 'reneemeisner',
phone: '(111) 111-5555',
skillLevel: 5,
Gear: 'Techne X350 Helios',
},
{
name: "Sam O'Shea",
legalFirstName: '',
firstName: 'Sam',
lastName: "O'Shea",
summonerName: 'samo',
team: 'Record GG',
positions: 'Support',
gender: 'Male',
birthday: '3/8/1993',
citizenship: 'USA',
passport: 5050505,
email: 'sam@example.com',
color: 'gold',
stage: 'Dota 2',
communication: 'Skype',
twitch: 'samo',
discord: 'samo',
skype: 'samo',
twitter: 'samo',
phone: '(111) 111-6666',
skillLevel: 4,
},
{
name: 'River Chan',
legalFirstName: '',
firstName: 'River',
lastName: 'Chan',
summonerName: 'riv9393',
team: 'Summonerz',
positions: 'Top',
gender: 'Male',
birthday: '2/22/1993',
citizenship: 'USA',
passport: 6060606,
email: 'river@example.com',
color: 'bisque',
stage: 'CS:GO',
communication: 'Skype',
twitch: 'riv9393',
discord: 'riv9393',
skype: 'riv9393',
twitter: 'riv9393',
phone: '(111) 111-7777',
skillLevel: 4,
},
{
name: 'Robby Pritchett',
legalFirstName: '',
firstName: 'Robby',
lastName: 'Pritchett',
summonerName: 'robprit',
team: 'Summonerz',
positions: 'Jungle',
gender: 'Male',
birthday: '7/17/1993',
citizenship: 'USA',
passport: 7070707,
email: 'robby@example.com',
color: 'bisque',
stage: 'CS:GO',
communication: 'Discord',
twitch: 'robprit',
discord: 'robprit',
skype: 'robprit',
twitter: 'robprit',
phone: '(111) 111-8888',
skillLevel: 5,
},
{
name: 'Robin Jaffe',
legalFirstName: '',
firstName: 'Robin',
lastName: 'Jaffe',
summonerName: 'robinjaffe93',
team: 'Summonerz',
positions: 'Mid',
gender: 'Female',
birthday: '8/31/1993',
citizenship: 'USA',
passport: 8080808,
email: 'robin@example.com',
color: 'bisque',
stage: 'CS:GO',
communication: 'Discord',
twitch: 'robinjaffe93',
discord: 'robinjaffe93',
skype: 'robinjaffe93',
twitter: 'robinjaffe93',
phone: '(111) 111-9999',
skillLevel: 4,
},
{
name: 'Sam Epps',
legalFirstName: '',
firstName: 'Sam',
lastName: 'Epps',
summonerName: 'sammmm94',
team: 'Summonerz',
positions: 'ADC',
gender: 'Male',
birthday: '5/1/1994',
citizenship: 'USA',
passport: 9090909,
email: 'sam@example.com',
color: 'bisque',
stage: 'CS:GO',
communication: 'Email',
twitch: 'sammmm94',
discord: 'sammmm94',
skype: 'sammmm94',
twitter: 'sammmm94',
phone: '(111) 222-1111',
skillLevel: 3,
},
{
name: 'Skyler Xu',
legalFirstName: '',
firstName: 'Skyler',
lastName: 'Xu',
summonerName: 'skyblue',
team: 'Summonerz',
positions: 'Support',
gender: 'Female',
birthday: '12/3/1994',
citizenship: 'USA',
passport: 10010010,
email: 'skyler@example.com',
color: 'bisque',
stage: 'CS:GO',
communication: 'Discord',
twitch: 'skyblue',
discord: 'skyblue',
skype: 'skyblue',
twitter: 'skyblue',
phone: '(111) 333-1111',
skillLevel: 5,
},
];
.main-container {
overflow: hidden;
height: 100%;
}
.header-wrapper {
display: flex;
flex-direction: column;
width: 100%;
box-sizing: border-box;
padding: 0 7px;
}
.header-cells {
display: flex;
align-items: center;
flex-wrap: nowrap;
justify-content: space-between;
margin-top: 4px;
}
.header-cells .header-cell {
display: flex;
align-items: center;
flex-direction: row;
}
.gc-grouping-toggle {
display: inline-flex;
align-items: center;
margin-right: 6px;
}
.gc-grouping-toggle svg {
width: 18px;
height: 18px;
display: inline-flex;
align-items: center;
}
.gc-grouping-toggle.expand .expand-icon {
display: inline-flex;
}
.gc-grouping-toggle.expand .collapse-icon {
display: none;
}
.gc-grouping-toggle.collapsed .expand-icon {
display: none;
}
.gc-grouping-toggle.collapsed .collapse-icon {
display: inline-flex;
}
.group-title {
text-transform: uppercase;
font-size: 0.75rem;
letter-spacing: 0.1em;
opacity: 0.9;
}
.subgroup-title,
.team-label {
border-radius: 0.5em;
padding: 0.2em 0.35em;
display: inline-block;
}
.count {
opacity: 0.9;
font-size: 0.875em;
padding: 0 0.25rem;
}
.gutter-18 {
margin-left: 22px;
}
.wrapper {
position: relative;
height: 100%;
}
.grid-container {
height: 100%;
}
.grid-container #grid {
height: 100%;
}
.gc-viewport {
box-sizing: border-box;
}
.gc-group-header-row {
display: flex;
align-items: center;
}
.gc-pinned-left .gc-row > .gc-cell {
padding-left: 28px;
}
.stars-box {
height: 18px;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAARCAYAAADQWvz5AAAACXBIWXMAAAsSAAALEgHS3X78AAAA/0lEQVQ4EY2UwW0CMRBFnxF30gFQQeDqE50AHdAKHUAHoQM4ZM9LBUk6IBUMmrUR7I7H4ksjWX/+fM3aXxtEhCqasOnaUQ412dgwFrvMVI1GhnlFE1bAZ1fp7KJuBBvnbODfURNmwM+AnRPl12jdjZLJzvDKpZ5BkG++gA9ABVOjqOMP0A1varQAzsCkOuLjH1iNiNLmba6u1Me1m43SpjuKclNX4OSOWJy6mTRbeLUmaPDWZqyPI1F6cSi9WmsYC6MpGVUT7GlKRgvDvKHpG6WwvWbpAixz6fmB6TCYw40eK2s2tkTRV2lzaW+be+bzSkb7nA3720icbqKapxFwBx7qRr1Qs6HiAAAAAElFTkSuQmCC");
}
.rating0 {
width: 0;
}
.rating1 {
width: 16px;
}
.rating2 {
width: 32px;
}
.rating3 {
width: 48px;
}
.rating4 {
width: 64px;
}
.rating5 {
width: 80px;
}
.hide {
display: none !important;
}
.uppercase {
text-transform: uppercase;
}
.capitalize {
text-transform: capitalize;
}
/*# sourceMappingURL=data:application/json;charset=utf8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlNob3djYXNlL1BsYXllck1hbmFnZW1lbnQvcHVyZWpzL3N0eWxlcy5zY3NzIiwiU2hvd2Nhc2UvUGxheWVyTWFuYWdlbWVudC9wdXJlanMvc3R5bGVzLmNzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTtFQUNFLGdCQUFBO0VBQ0EsWUFBQTtBQ0NGOztBREVBO0VBQ0UsYUFBQTtFQUNBLHNCQUFBO0VBQ0EsV0FBQTtFQUNBLHNCQUFBO0VBQ0EsY0FBQTtBQ0NGOztBREVBO0VBQ0UsYUFBQTtFQUNBLG1CQUFBO0VBQ0EsaUJBQUE7RUFDQSw4QkFBQTtFQUNBLGVBQUE7QUNDRjs7QURFQTtFQUNFLGFBQUE7RUFDQSxtQkFBQTtFQUNBLG1CQUFBO0FDQ0Y7O0FERUE7RUFDRSxvQkFBQTtFQUNBLG1CQUFBO0VBQ0EsaUJBQUE7QUNDRjs7QURFQTtFQUNFLFdBQUE7RUFDQSxZQUFBO0VBQ0Esb0JBQUE7RUFDQSxtQkFBQTtBQ0NGOztBREdFO0VBQ0Usb0JBQUE7QUNBSjtBREVFO0VBQ0UsYUFBQTtBQ0FKOztBREtFO0VBQ0UsYUFBQTtBQ0ZKO0FESUU7RUFDRSxvQkFBQTtBQ0ZKOztBRE1BO0VBQ0UseUJBQUE7RUFDQSxrQkFBQTtFQUNBLHFCQUFBO0VBQ0EsWUFBQTtBQ0hGOztBRE1BOztFQUVFLG9CQUFBO0VBQ0EscUJBQUE7RUFDQSxxQkFBQTtBQ0hGOztBRE1BO0VBQ0UsWUFBQTtFQUNBLGtCQUFBO0VBQ0Esa0JBQUE7QUNIRjs7QURNQTtFQUNFLGlCQUFBO0FDSEY7O0FETUE7RUFDRSxrQkFBQTtFQUNBLFlBQUE7QUNIRjs7QURNQTtFQUNFLFlBQUE7QUNIRjtBREtFO0VBQ0UsWUFBQTtBQ0hKOztBRE9BO0VBQ0Usc0JBQUE7QUNKRjs7QURPQTtFQUNFLGFBQUE7RUFDQSxtQkFBQTtBQ0pGOztBRE9BO0VBQ0Usa0JBQUE7QUNKRjs7QURPQTtFQUNFLFlBQUE7RUFDQSwyZUFBQTtBQ0pGOztBRE9BO0VBQ0UsUUFBQTtBQ0pGOztBRE9BO0VBQ0UsV0FBQTtBQ0pGOztBRE9BO0VBQ0UsV0FBQTtBQ0pGOztBRE9BO0VBQ0UsV0FBQTtBQ0pGOztBRE9BO0VBQ0UsV0FBQTtBQ0pGOztBRE9BO0VBQ0UsV0FBQTtBQ0pGOztBRE9BO0VBQ0Usd0JBQUE7QUNKRjs7QURPQTtFQUNFLHlCQUFBO0FDSkY7O0FET0E7RUFDRSwwQkFBQTtBQ0pGIiwiZmlsZSI6IlNob3djYXNlL1BsYXllck1hbmFnZW1lbnQvcHVyZWpzL3N0eWxlcy5jc3MiLCJzb3VyY2VzQ29udGVudCI6WyIubWFpbi1jb250YWluZXIge1xuICBvdmVyZmxvdzogaGlkZGVuO1xuICBoZWlnaHQ6IDEwMCU7XG59XG5cbi5oZWFkZXItd3JhcHBlciB7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG4gIHdpZHRoOiAxMDAlO1xuICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICBwYWRkaW5nOiAwIDdweDtcbn1cblxuLmhlYWRlci1jZWxscyB7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGZsZXgtd3JhcDogbm93cmFwO1xuICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47XG4gIG1hcmdpbi10b3A6IDRweDtcbn1cblxuLmhlYWRlci1jZWxscyAuaGVhZGVyLWNlbGwge1xuICBkaXNwbGF5OiBmbGV4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBmbGV4LWRpcmVjdGlvbjogcm93O1xufVxuXG4uZ2MtZ3JvdXBpbmctdG9nZ2xlIHtcbiAgZGlzcGxheTogaW5saW5lLWZsZXg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIG1hcmdpbi1yaWdodDogNnB4O1xufVxuXG4uZ2MtZ3JvdXBpbmctdG9nZ2xlIHN2ZyB7XG4gIHdpZHRoOiAxOHB4O1xuICBoZWlnaHQ6IDE4cHg7XG4gIGRpc3BsYXk6IGlubGluZS1mbGV4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xufVxuXG4uZ2MtZ3JvdXBpbmctdG9nZ2xlLmV4cGFuZCB7XG4gIC5leHBhbmQtaWNvbiB7XG4gICAgZGlzcGxheTogaW5saW5lLWZsZXg7XG4gIH1cbiAgLmNvbGxhcHNlLWljb24ge1xuICAgIGRpc3BsYXk6IG5vbmU7XG4gIH1cbn1cblxuLmdjLWdyb3VwaW5nLXRvZ2dsZS5jb2xsYXBzZWQge1xuICAuZXhwYW5kLWljb24ge1xuICAgIGRpc3BsYXk6IG5vbmU7XG4gIH1cbiAgLmNvbGxhcHNlLWljb24ge1xuICAgIGRpc3BsYXk6IGlubGluZS1mbGV4O1xuICB9XG59XG5cbi5ncm91cC10aXRsZSB7XG4gIHRleHQtdHJhbnNmb3JtOiB1cHBlcmNhc2U7XG4gIGZvbnQtc2l6ZTogMC43NXJlbTtcbiAgbGV0dGVyLXNwYWNpbmc6IDAuMWVtO1xuICBvcGFjaXR5OiAwLjk7XG59XG5cbi5zdWJncm91cC10aXRsZSxcbi50ZWFtLWxhYmVsIHtcbiAgYm9yZGVyLXJhZGl1czogMC41ZW07XG4gIHBhZGRpbmc6IDAuMmVtIDAuMzVlbTtcbiAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xufVxuXG4uY291bnQge1xuICBvcGFjaXR5OiAwLjk7XG4gIGZvbnQtc2l6ZTogMC44NzVlbTtcbiAgcGFkZGluZzogMCAwLjI1cmVtO1xufVxuXG4uZ3V0dGVyLTE4IHtcbiAgbWFyZ2luLWxlZnQ6IDIycHg7XG59XG5cbi53cmFwcGVyIHtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICBoZWlnaHQ6IDEwMCU7XG59XG5cbi5ncmlkLWNvbnRhaW5lciB7XG4gIGhlaWdodDogMTAwJTtcblxuICAjZ3JpZCB7XG4gICAgaGVpZ2h0OiAxMDAlO1xuICB9XG59XG5cbi5nYy12aWV3cG9ydCB7XG4gIGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG59XG5cbi5nYy1ncm91cC1oZWFkZXItcm93IHtcbiAgZGlzcGxheTogZmxleDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbn1cblxuLmdjLXBpbm5lZC1sZWZ0IC5nYy1yb3cgPiAuZ2MtY2VsbCB7XG4gIHBhZGRpbmctbGVmdDogMjhweDtcbn1cblxuLnN0YXJzLWJveCB7XG4gIGhlaWdodDogMThweDtcbiAgYmFja2dyb3VuZC1pbWFnZTogdXJsKCdkYXRhOmltYWdlL3BuZztiYXNlNjQsaVZCT1J3MEtHZ29BQUFBTlNVaEVVZ0FBQUJJQUFBQVJDQVlBQUFEUVd2ejVBQUFBQ1hCSVdYTUFBQXNTQUFBTEVnSFMzWDc4QUFBQS8wbEVRVlE0RVkyVXdXMENNUkJGbnhGMzBnRlFRZURxRTUwQUhkQUtIVUFIb1FNNFpNOUxCVWs2SUJVTW1yVVI3STdINGtzaldYLytmTTNhWHh0RWhDcWFzT25hVVE0MTJkZ3dGcnZNVkkxR2hubEZFMWJBWjFmcDdLSnVCQnZuYk9EZlVSTm13TStBblJQbDEyamRqWkxKenZES3BaNUJrRysrZ0E5QUJWT2pxT01QMEExdmFyUUF6c0NrT3VMakgxaU5pTkxtYmE2dTFNZTFtNDNTcGp1S2NsTlg0T1NPV0p5Nm1UUmJlTFVtYVBEV1pxeVBJMUY2Y1NpOVdtc1lDNk1wR1ZVVDdHbEtSZ3ZEdktIcEc2V3d2V2JwQWl4ejZmbUI2VENZdzQwZUsyczJ0a1RSVjJsemFXK2JlK2J6U2tiN25BMzcyMGljYnFLYXB4RndCeDdxUnIxUXM2SGlBQUFBQUVsRlRrU3VRbUNDJyk7XG59XG5cbi5yYXRpbmcwIHtcbiAgd2lkdGg6IDA7XG59XG5cbi5yYXRpbmcxIHtcbiAgd2lkdGg6IDE2cHg7XG59XG5cbi5yYXRpbmcyIHtcbiAgd2lkdGg6IDMycHg7XG59XG5cbi5yYXRpbmczIHtcbiAgd2lkdGg6IDQ4cHg7XG59XG5cbi5yYXRpbmc0IHtcbiAgd2lkdGg6IDY0cHg7XG59XG5cbi5yYXRpbmc1IHtcbiAgd2lkdGg6IDgwcHg7XG59XG5cbi5oaWRlIHtcbiAgZGlzcGxheTogbm9uZSAhaW1wb3J0YW50O1xufVxuXG4udXBwZXJjYXNlIHtcbiAgdGV4dC10cmFuc2Zvcm06IHVwcGVyY2FzZTtcbn1cblxuLmNhcGl0YWxpemUge1xuICB0ZXh0LXRyYW5zZm9ybTogY2FwaXRhbGl6ZTtcbn1cbiIsIi5tYWluLWNvbnRhaW5lciB7XG4gIG92ZXJmbG93OiBoaWRkZW47XG4gIGhlaWdodDogMTAwJTtcbn1cblxuLmhlYWRlci13cmFwcGVyIHtcbiAgZGlzcGxheTogZmxleDtcbiAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgd2lkdGg6IDEwMCU7XG4gIGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG4gIHBhZGRpbmc6IDAgN3B4O1xufVxuXG4uaGVhZGVyLWNlbGxzIHtcbiAgZGlzcGxheTogZmxleDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgZmxleC13cmFwOiBub3dyYXA7XG4gIGp1c3RpZnktY29udGVudDogc3BhY2UtYmV0d2VlbjtcbiAgbWFyZ2luLXRvcDogNHB4O1xufVxuXG4uaGVhZGVyLWNlbGxzIC5oZWFkZXItY2VsbCB7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGZsZXgtZGlyZWN0aW9uOiByb3c7XG59XG5cbi5nYy1ncm91cGluZy10b2dnbGUge1xuICBkaXNwbGF5OiBpbmxpbmUtZmxleDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgbWFyZ2luLXJpZ2h0OiA2cHg7XG59XG5cbi5nYy1ncm91cGluZy10b2dnbGUgc3ZnIHtcbiAgd2lkdGg6IDE4cHg7XG4gIGhlaWdodDogMThweDtcbiAgZGlzcGxheTogaW5saW5lLWZsZXg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG59XG5cbi5nYy1ncm91cGluZy10b2dnbGUuZXhwYW5kIC5leHBhbmQtaWNvbiB7XG4gIGRpc3BsYXk6IGlubGluZS1mbGV4O1xufVxuLmdjLWdyb3VwaW5nLXRvZ2dsZS5leHBhbmQgLmNvbGxhcHNlLWljb24ge1xuICBkaXNwbGF5OiBub25lO1xufVxuXG4uZ2MtZ3JvdXBpbmctdG9nZ2xlLmNvbGxhcHNlZCAuZXhwYW5kLWljb24ge1xuICBkaXNwbGF5OiBub25lO1xufVxuLmdjLWdyb3VwaW5nLXRvZ2dsZS5jb2xsYXBzZWQgLmNvbGxhcHNlLWljb24ge1xuICBkaXNwbGF5OiBpbmxpbmUtZmxleDtcbn1cblxuLmdyb3VwLXRpdGxlIHtcbiAgdGV4dC10cmFuc2Zvcm06IHVwcGVyY2FzZTtcbiAgZm9udC1zaXplOiAwLjc1cmVtO1xuICBsZXR0ZXItc3BhY2luZzogMC4xZW07XG4gIG9wYWNpdHk6IDAuOTtcbn1cblxuLnN1Ymdyb3VwLXRpdGxlLFxuLnRlYW0tbGFiZWwge1xuICBib3JkZXItcmFkaXVzOiAwLjVlbTtcbiAgcGFkZGluZzogMC4yZW0gMC4zNWVtO1xuICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7XG59XG5cbi5jb3VudCB7XG4gIG9wYWNpdHk6IDAuOTtcbiAgZm9udC1zaXplOiAwLjg3NWVtO1xuICBwYWRkaW5nOiAwIDAuMjVyZW07XG59XG5cbi5ndXR0ZXItMTgge1xuICBtYXJnaW4tbGVmdDogMjJweDtcbn1cblxuLndyYXBwZXIge1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIGhlaWdodDogMTAwJTtcbn1cblxuLmdyaWQtY29udGFpbmVyIHtcbiAgaGVpZ2h0OiAxMDAlO1xufVxuLmdyaWQtY29udGFpbmVyICNncmlkIHtcbiAgaGVpZ2h0OiAxMDAlO1xufVxuXG4uZ2Mtdmlld3BvcnQge1xuICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xufVxuXG4uZ2MtZ3JvdXAtaGVhZGVyLXJvdyB7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG59XG5cbi5nYy1waW5uZWQtbGVmdCAuZ2Mtcm93ID4gLmdjLWNlbGwge1xuICBwYWRkaW5nLWxlZnQ6IDI4cHg7XG59XG5cbi5zdGFycy1ib3gge1xuICBoZWlnaHQ6IDE4cHg7XG4gIGJhY2tncm91bmQtaW1hZ2U6IHVybChcImRhdGE6aW1hZ2UvcG5nO2Jhc2U2NCxpVkJPUncwS0dnb0FBQUFOU1VoRVVnQUFBQklBQUFBUkNBWUFBQURRV3Z6NUFBQUFDWEJJV1hNQUFBc1NBQUFMRWdIUzNYNzhBQUFBLzBsRVFWUTRFWTJVd1cwQ01SQkZueEYzMGdGUVFlRHFFNTBBSGRBS0hVQUhvUU00Wk05TEJVazZJQlVNbXJVUjdJN0g0a3NqV1gvK2ZNM2FYeHRFaENxYXNPbmFVUTQxMmRnd0Zydk1WSTFHaG5sRkUxYkFaMWZwN0tKdUJCdm5iT0RmVVJObXdNK0FuUlBsMTJqZGpaTEp6dkRLcFo1QmtHKytnQTlBQlZPanFPTVAwQTF2YXJRQXpzQ2tPdUxqSDFpTmlOTG1iYTZ1MU1lMW00M1NwanVLY2xOWDRPU09XSnk2bVRSYmVMVW1hUERXWnF5UEkxRjZjU2k5V21zWUM2TXBHVlVUN0dsS1JndkR2S0hwRzZXd3ZXYnBBaXh6NmZtQjZUQ1l3NDBlSzJzMnRrVFJWMmx6YVcrYmUrYnpTa2I3bkEzNzIwaWNicUthcHhGd0J4N3FScjFRczZIaUFBQUFBRWxGVGtTdVFtQ0NcIik7XG59XG5cbi5yYXRpbmcwIHtcbiAgd2lkdGg6IDA7XG59XG5cbi5yYXRpbmcxIHtcbiAgd2lkdGg6IDE2cHg7XG59XG5cbi5yYXRpbmcyIHtcbiAgd2lkdGg6IDMycHg7XG59XG5cbi5yYXRpbmczIHtcbiAgd2lkdGg6IDQ4cHg7XG59XG5cbi5yYXRpbmc0IHtcbiAgd2lkdGg6IDY0cHg7XG59XG5cbi5yYXRpbmc1IHtcbiAgd2lkdGg6IDgwcHg7XG59XG5cbi5oaWRlIHtcbiAgZGlzcGxheTogbm9uZSAhaW1wb3J0YW50O1xufVxuXG4udXBwZXJjYXNlIHtcbiAgdGV4dC10cmFuc2Zvcm06IHVwcGVyY2FzZTtcbn1cblxuLmNhcGl0YWxpemUge1xuICB0ZXh0LXRyYW5zZm9ybTogY2FwaXRhbGl6ZTtcbn0iXX0= */
(function () {
const IS_PROD = window.process.env.NODE_ENV === 'production';
const USE_NPM = window.process.env.USE_NPM;
const USE_CDN = window.process.env.USE_CDN;
const SITE_ROOT = window.process.env.SITE_ROOT;
const FRAMEWORK = window.process.env.FRAMEWORK;
const ext = IS_PROD ? '.min.js' : '.js';
function js(name) {
return name + ext;
}
function npm(t) {
if (!t.file) {
t.file = IS_PROD ? t.prod : t.dev;
}
const version = USE_CDN && t.version ? '@' + t.version : '';
const path = t.pkg + version + '/' + t.file;
if (USE_CDN) {
return 'https://unpkg.com/' + path;
}
return 'npm:' + path;
}
function dv(t) {
if (USE_CDN || USE_NPM) {
t.file = 'dist/' + t.file + '.min.js';
return npm(t);
}
return SITE_ROOT + '/static/dataviews/' + js(t.file);
}
const isTypeScript = FRAMEWORK === 'angular';
const babelConfig = {
es2015: true,
react: true,
};
const meta = {
js: {
babelOptions: babelConfig,
},
ts: {
typescriptOptions: {
tsconfig: true
},
},
};
const map = {
// gc.dataviews packages
'@grapecity/dataviews.common': dv({pkg:'@grapecity/dataviews.common',file:'gc.dataviews.common',version:'1.8.17'}),
'@grapecity/dataviews.core': dv({pkg:'@grapecity/dataviews.core',file:'gc.dataviews.core',version:'1.8.17'}),
'@grapecity/dataviews.grid': dv({pkg:'@grapecity/dataviews.grid',file:'gc.dataviews.grid',version:'1.8.17'}),
'@grapecity/dataviews.cardlayout': dv({pkg:'@grapecity/dataviews.cardlayout',file:'gc.dataviews.cardlayout',version:'1.8.17'}),
'@grapecity/dataviews.masonry': dv({pkg:'@grapecity/dataviews.masonry',file:'gc.dataviews.masonry',version:'1.8.17'}),
'@grapecity/dataviews.calendar': dv({pkg:'@grapecity/dataviews.calendar',file:'gc.dataviews.calendar',version:'1.8.17'}),
'@grapecity/dataviews.timeline': dv({pkg:'@grapecity/dataviews.timeline',file:'gc.dataviews.timeline',version:'1.8.17'}),
'@grapecity/dataviews.trellis': dv({pkg:'@grapecity/dataviews.trellis',file:'gc.dataviews.trellis',version:'1.8.17'}),
'@grapecity/dataviews.gantt': dv({pkg:'@grapecity/dataviews.gantt',file:'gc.dataviews.gantt',version:'1.8.17'}),
'@grapecity/dataviews.searchbox': dv({pkg:'@grapecity/dataviews.searchbox',file:'gc.dataviews.searchbox',version:'1.8.17'}),
'@grapecity/dataviews.react': dv({pkg:'@grapecity/dataviews.react',file:'gc.dataviews.react',version:'1.8.17'}),
'@grapecity/dataviews.vue': dv({pkg:'@grapecity/dataviews.vue',file:'gc.dataviews.vue',version:'1.8.17'}),
'@grapecity/dataviews.angular': dv({pkg:'@grapecity/dataviews.angular',file:'gc.dataviews.angular',version:'1.8.17'}),
'@grapecity/dataviews.csvexport': dv({pkg:'@grapecity/dataviews.angular',file:'gc.dataviews.csvexport',version:'1.8.17'}),
// third-party libs
react: npm({pkg:'react',prod:'umd/react.production.min.js',dev:'umd/react.development.js',version:'16.13.1'}),
'react-dom': npm({pkg:'react-dom',prod:'umd/react-dom.production.min.js',dev:'umd/react-dom.development.js',version:'16.13.1'}),
'react-router-dom': npm({pkg:'react-router-dom',prod:'umd/react-router-dom.min.js',dev:'umd/react-router-dom.js',version:'5.2.0'}),
'vue': npm({pkg:'vue',file:'dist/vue.js',version:'2.6.12'}),
'vue-router': npm({pkg:'vue-router',file:'dist/vue-router.js',version:'3.4.3'}),
'lodash': npm({pkg: 'lodash', file: js('lodash')}),
'zone.js': npm({pkg: 'zone.js', file: js('dist/zone')}),
'rxjs': npm({pkg: 'rxjs', file: js('bundles/rxjs.umd')}),
'rxjs/operators': npm({pkg:'rxjs-operators-bundle',prod:'dist/bundle.min.js',dev:'dist/bundle.js',version:'1.0.2'}),
'@angular/core': npm({pkg: '@angular/core', file: js('bundles/core.umd')}),
'@angular/common': npm({pkg: '@angular/common', file: js('bundles/common.umd')}),
'@angular/compiler': npm({pkg: '@angular/compiler', file: js('bundles/compiler.umd')}),
'@angular/platform-browser': npm({pkg: '@angular/platform-browser', file: js('bundles/platform-browser.umd')}),
'@angular/platform-browser-dynamic': npm({pkg: '@angular/platform-browser-dynamic', file: js('bundles/platform-browser-dynamic.umd')}),
'@angular/http': npm({pkg: '@angular/http', file: js('bundles/http.umd')}),
'@angular/common/http': npm({pkg: '@angular/common', file: js('bundles/common-http.umd')}),
'@angular/router': npm({pkg: '@angular/router', file: js('bundles/router.umd')}),
'@angular/forms': npm({pkg: '@angular/forms', file: js('bundles/forms.umd')}),
// systemjs plugins
'systemjs-plugin-json': npm({pkg:'systemjs-plugin-json',file:'json.js',version:'0.3.0'}),
'systemjs-plugin-css': npm({pkg:'systemjs-plugin-css',file:'css.js',version:'0.1.37'}),
'systemjs-plugin-babel': npm({pkg:'systemjs-plugin-babel',file:'plugin-babel.js',version:'0.0.25'}),
'systemjs-babel-build': npm({pkg:'systemjs-plugin-babel',file:'systemjs-babel-browser.js',version:'0.0.25'}),
'plugin-typescript': npm({pkg:'plugin-typescript',file:'lib/plugin.js',version:'8.0.0'}),
'typescript': npm({pkg:'typescript',file:'lib/typescript.js',version:'4.0.2'}),
'systemjs-vue-browser': npm({pkg:'systemjs-vue-browser',file:'index.js',version:'1.0.11'}),
};
const config = {
defaultJSExtensions: true,
transpiler: isTypeScript ? 'plugin-typescript' : 'systemjs-plugin-babel',
typescriptOptions: {
tsconfig: true
},
meta: {
'*.json': {loader: 'systemjs-plugin-json'},
'*.css': {loader: 'systemjs-plugin-css'},
'*.vue': {loader: 'systemjs-vue-browser'},
'*.js': meta.js,
'*.ts': meta.ts,
'app.js': {
format: 'esm',
babelOptions: babelConfig,
},
'typescript': {
exports: 'ts',
},
'@grapecity/dataviews.common': {
format: 'amd',
},
'@grapecity/dataviews.core': {
format: 'amd',
deps: [
'@grapecity/dataviews.common',
],
},
'@grapecity/dataviews.grid': {
format: 'amd',
deps: [
'@grapecity/dataviews.common',
'@grapecity/dataviews.core',
],
},
'@grapecity/dataviews.cardlayout': {
format: 'amd',
deps: [
'@grapecity/dataviews.common',
],
},
'@grapecity/dataviews.masonry': {
format: 'amd',
deps: [
'@grapecity/dataviews.common',
],
},
'@grapecity/dataviews.calendar': {
format: 'amd',
deps: [
'@grapecity/dataviews.common',
'@grapecity/dataviews.core',
],
},
'@grapecity/dataviews.timeline': {
format: 'amd',
deps: [
'@grapecity/dataviews.common',
],
},
'@grapecity/dataviews.trellis': {
format: 'amd',
deps: [
'@grapecity/dataviews.common',
],
},
'@grapecity/dataviews.gantt': {
format: 'amd',
deps: [
'@grapecity/dataviews.common',
],
},
'@grapecity/dataviews.searchbox': {
format: 'amd',
deps: [
'@grapecity/dataviews.common',
],
},
'@grapecity/dataviews.react': {
format: 'amd',
deps: [
'react',
'@grapecity/dataviews.common',
'@grapecity/dataviews.core'
],
},
'@grapecity/dataviews.vue': {
format: 'amd',
deps: [
'vue',
'@grapecity/dataviews.common',
'@grapecity/dataviews.core'
],
},
'@grapecity/dataviews.angular': {
format: 'amd',
deps: [
'@angular/core',
'@grapecity/dataviews.common',
'@grapecity/dataviews.core'
],
},
'@grapecity/dataviews.csvexport': {
format: 'amd',
deps: [
'@grapecity/dataviews.common'
],
},
},
paths: {
// paths serve as alias
'npm:': SITE_ROOT + '/node_modules/',
},
// map tells the System loader where to look for things
map: map,
// packages tells the System loader how to load when no filename and/or no extension
packages: {
'.': { defaultExtension: isTypeScript ? 'ts' : 'js' },
node_modules: { defaultExtension: 'js' },
}
};
// fast format detection to avoid detection by source code using regexp
Object.keys(map).filter(function (key) {
return !config.meta[key];
}).forEach(function (key) {
const path = map[key];
if (path.indexOf('/umd') >= 0 || path.indexOf('.umd') >= 0) {
config.meta[key] = { format: 'amd' };
}
if (path.indexOf('/cjs') >= 0) {
config.meta[key] = { format: 'cjs' };
}
});
System.config(config);
})(this);
