Player Management

This example shows how you can use nested groupings and custom presenters to get better grid for game players dataset

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 | GrapeCity 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" /> <!-- Google Tag Manager --> <script> (function (w, d, s, l, i) { w[l] = w[l] || []; w[l].push({ 'gtm.start': new Date().getTime(), event: 'gtm.js' }); var f = d.getElementsByTagName(s)[0], j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : ''; j.async = true; j.src = 'https://www.googletagmanager.com/gtm.js?id=' + i + dl; f.parentNode.insertBefore(j, f); })(window, document, 'script', 'dataLayer', 'GTM-WT462SJ'); </script> <!-- End Google Tag Manager --> <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: 'GrapeCity-Internal-Use-Only,GrapeCity,E195393772372914#B0KV4Ny56Vr5Wb7w6buJWeGRWb4NXUnNXRlFWWXl6SoN5VzVkYslmQ95WTENkTllVQzd4QhpEejdDNJZlWOp6M7oERQNnWspkaaB5QMhnR7dmUkRnVJR4L5cHTKNkZZdDbRBzZIxmSSR6NrpVQaVUQrBlc6ImYysSd4UlUEZGbw2kMl9UOzQVMId6ZXtUN83CO5RzaZt4VY5kM5pkUGpUUUV7UExUeGpUdTV5dFJ4bPhTc8pGeXJHWrkzNlFzdUtWTr5UQDdVckdGbSVUWr2yMPNzctZVRxEEW9lEbsZHUKJnVaRXT5p6Z0tWMqJGVrtSTIZnaopGSWZXbVNjY0hzQB5We4dnUr3ER8MkI0IyUiwiIGZUNwEkN5MjI0ICSiwSM9ETO6czNygTM0IicfJye#4Xfd5nIZRVV9IiOiMkIsISM6ByUKN7dllmVhRXYEJiOi8kI1tlOiQmcQJCLiEDMzATOwAyMwgDMwIDMyIiOiQncDJCLiI7au26YukHdpNWZwFmcn9iKsAnau26YukHdpNWZwFmcn9iKs86Yu46bj9Se4l6YlBXYydmLqwSbvNmL6VGZ9RXajVGchJ7ZuoCLt36YukHdpNWZwFmcn9iKiojIz5GRiwiI9RXaDVGchJ7RiojIh94QiwSZ5JHd0ICb6VkIsICNxkjM7MjM7czM9MTN9EjI0ICZJJye0ICRiwiI34zZN3yZGNlUnJDe5wkQPVlcBh7SppmUNBlU9dWS7J4ZMRES4MTZkRXTxM7Uq5GeQdHcyFHVup6dQd6ZDpEVrNDSh9kbNdzZrl4dwdPQ', SJS_LICENSE_KEY: '*.grapecity.com,E613631884219496#B0qRgJHWSJ7NyBlc8BjNMRHW7g7YldTZXFTQuFnW4hVOCplVSlVV09ERlhEZuVTVKlTazE4Q6VGSw2CdWZUWSVmbjVXbrxmWFVWR8ZzQro7U84WMGdlbuVHb73kS5kjUTN4NvFVdLdXWVR4Nox6Z7UUSysEcXJEMsN6bDN4TxMDVwVmWBRzKxhkTzAXTaJmdD3CRFJTd8R4R6M5RklWa6oUaLlXMwR4R8ZUdtRWVxUUaQh6VXNDdEhlZ7FHR6QXTPJTVvkWcyZnbSdHRtZHcYF6TKN4axYGcZNjTDF7TvFTTr24VqZjVHVjcLd7QkRmdNxkI0IyUiwiI5gDOEF4QGVjI0ICSiwiMzkTO9kTOyMTM0IicfJye35XX3JSSGljQiojIDJCLiITMuYHITpEIkFWZyB7UiojIOJyebpjIkJHUiwiI4MDMyEDMgkDM8ATOxAjMiojI4J7QiwiIt36YukHdpNWZwFmcn9iKiojIz5GRiwiIj9WagkHdpNUZwFmcHJiOiEmTDJCLlVnc4pjIsZXRiwiI6kDN9EjM4gDOxMjNzEjNiojIklkIs4XZzxWYmpjIyNHZisnOiwmbBJye0ICRiwiI34TQ72kNBV6YXpXdGxGWxdHcol4MyUGUHJVbQVHRx44Sw84YxRkS4QnZadDNmhWWxV5QxFlTlZEbBJ5N8gUNQlDb7J6Kl36YHVnb4NGN92UMFdlNORFU8VDSaFlQSVlS4EHTrA5Ohh', }, }; </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"> <!-- Google Tag Manager (noscript) --> <noscript ><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-WT462SJ" height="0" width="0" style="display: none; visibility: hidden;" ></iframe ></noscript> <!-- End Google Tag Manager (noscript) --> <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.7'}), '@grapecity/dataviews.core': dv({pkg:'@grapecity/dataviews.core',file:'gc.dataviews.core',version:'1.8.7'}), '@grapecity/dataviews.grid': dv({pkg:'@grapecity/dataviews.grid',file:'gc.dataviews.grid',version:'1.8.7'}), '@grapecity/dataviews.cardlayout': dv({pkg:'@grapecity/dataviews.cardlayout',file:'gc.dataviews.cardlayout',version:'1.8.7'}), '@grapecity/dataviews.masonry': dv({pkg:'@grapecity/dataviews.masonry',file:'gc.dataviews.masonry',version:'1.8.7'}), '@grapecity/dataviews.calendar': dv({pkg:'@grapecity/dataviews.calendar',file:'gc.dataviews.calendar',version:'1.8.7'}), '@grapecity/dataviews.timeline': dv({pkg:'@grapecity/dataviews.timeline',file:'gc.dataviews.timeline',version:'1.8.7'}), '@grapecity/dataviews.trellis': dv({pkg:'@grapecity/dataviews.trellis',file:'gc.dataviews.trellis',version:'1.8.7'}), '@grapecity/dataviews.gantt': dv({pkg:'@grapecity/dataviews.gantt',file:'gc.dataviews.gantt',version:'1.8.7'}), '@grapecity/dataviews.searchbox': dv({pkg:'@grapecity/dataviews.searchbox',file:'gc.dataviews.searchbox',version:'1.8.7'}), '@grapecity/dataviews.react': dv({pkg:'@grapecity/dataviews.react',file:'gc.dataviews.react',version:'1.8.7'}), '@grapecity/dataviews.vue': dv({pkg:'@grapecity/dataviews.vue',file:'gc.dataviews.vue',version:'1.8.7'}), '@grapecity/dataviews.angular': dv({pkg:'@grapecity/dataviews.angular',file:'gc.dataviews.angular',version:'1.8.7'}), '@grapecity/dataviews.csvexport': dv({pkg:'@grapecity/dataviews.angular',file:'gc.dataviews.csvexport',version:'1.8.7'}), // 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.11'}), 'vue-router': npm({pkg:'vue-router',file:'dist/vue-router.js',version:'3.3.4'}), '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:'3.9.7'}), '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);