OData Explorer

This demo shows how DataViews binds with queried OData.

This demo shows how DataViews binds with queried OData. Try creating a query using the options and then click the "Get Data" button to show that data bound to a DataViews grid.
<!DOCTYPE html> <html lang="en"> <head> <base href="/dataviewsjs/demos/en/sample/Showcase/ODataExplorer/purejs/" /> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="keywords" content="column, operation, OData" /> <meta name="description" content="This demo shows how DataViews binds with queried OData." /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>OData Explorer | 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/css/bootstrap-snippet.min.css" rel="stylesheet" type="text/css" /> <link href="/dataviewsjs/demos/node_modules/@fortawesome/fontawesome-free/css/all.min.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/node_modules/lodash/lodash.min.js" type="text/javascript"></script> <script src="/dataviewsjs/demos/node_modules/jquery/dist/jquery.min.js" type="text/javascript"></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 id="queryBuilderContainer"> <h4 id="promtInfo"> In this demo you can select options to build the request data url, then request data from the service to fill the DataView. </h4> <div id="queryBuilder" class="row-fluid"> <div id="selectQuery"> <div class="filterLabel">Select:</div> <div class="selectDropDown"> <select id="dataSource" placeholder="-- Select --"> </select> <select id="top"> <option value="0" class="queryDropdownColor">Single using Keys</option> <option value="100000" class="queryDropdownColor">Count Only</option> <option value="1" class="queryDropdownColor">top 1</option> <option value="10" class="queryDropdownColor">top 10</option> <option value="20" class="queryDropdownColor">top 20</option> <option value="50" class="queryDropdownColor">top 50</option> <option value="100" class="queryDropdownColor">top 100</option> </select> </div> </div> <div id="queryFilters" class="hidden"> <div id="filtersConditions"> <div id="selectConditions" class="filterContainer"> <div class="flex-button"> <div class="filterLabel">Columns:</div> <button id="addSelectCondition" class="addCondition"></button> </div> <span id="selectFiltersList" class="filterList"></span> </div> <div id="orderByConditions" class="filterContainer"> <div class="flex-button"> <div class="filterLabel">Order by:</div> <button id="addOrderByCondition" class="addCondition">+</button> </div> <span id="orderByFiltersList" class="filterList"></span> </div> </div> <div id="queryURLBlock" class="alert-info"> <input readonly type="text" id="queryUrlText" class="form-control input-sm" rel="tooltip" /> </div> </div> <div id="queryButtons" class="hidden"> <button id="submitQuery" class="buttonQuery btn btn-success">Get Data</button> <button id="clearQuery" class="buttonQuery btn btn-warning">Reset</button> </div> <div id="qbErrorMessageLine" class="text-center hidden"> <div id="errorMessage" class="alert-warning"></div> </div> </div> <div id="result" class="row-fluid hidden"> <div id="grid"></div> </div> <div id="backgroundOverlay" class="gc-popup-overlay"> <div class="cube-loader-container"> <div class="sk-cube-grid"> <div class="sk-cube sk-cube1"></div> <div class="sk-cube sk-cube2"></div> <div class="sk-cube sk-cube3"></div> <div class="sk-cube sk-cube4"></div> <div class="sk-cube sk-cube5"></div> <div class="sk-cube sk-cube6"></div> <div class="sk-cube sk-cube7"></div> <div class="sk-cube sk-cube8"></div> <div class="sk-cube sk-cube9"></div> </div> <h3></h3> </div> </div> </div> <script type="text/javascript"> System.import('./app.js'); </script> </body> </html>
import { baseUrl, loadMetadata, metadata, fetchData } from './odata'; let searchUrl; let selectTop = 20; let orderBys = []; let selectedColumns = []; $(() => { loadMetadata((metadata) => { const dataSource = document.getElementById('dataSource'); metadata.forEach((md) => { if (dataSource) { const html = `<option value="${md.tableName}" class="queryDropdownColor">${md.tableName}</option>`; const option = createElement(html); dataSource.appendChild(option); } }); initUI(); }); }); $('#selectConditions #addSelectCondition').click(() => { $('#selectConditions').toggleClass('listVisible'); }); $('#orderByConditions #addOrderByCondition').click(() => { $('#orderByConditions').toggleClass('listVisible'); }); $('#top').val(selectTop.toString()); $('#dataSource').change(() => { $('.hidden').removeClass('hidden'); updateConditions(); updateUrl(); }); $('#top').change(() => { selectTop = parseInt($('#top').val(), 10); updateUrl(); }); $('#submitQuery').click(() => { fetchData(searchUrl) .then((data) => { const rowHeight = 35; const minHeight = rowHeight * Math.min(data.length + 1, 11) + 2; $('#grid')[0].style.minHeight = `${minHeight}px`; destroyView(); const layout = new GC.DataViews.GridLayout(); new GC.DataViews.DataView(document.getElementById('grid'), data, null, layout); //focus data.view by default document.querySelector('#grid').focus(); }) .catch((err) => { alert(`Failed to get data from ${searchUrl}`); }); }); function destroyView() { const dataView = GC.DataViews.DataView.getControlByElement(document.body); if (dataView) { dataView.destroy(); } } function initUI() { initElement(); updateConditions(); updateUrl(); destroyView(); } $('#clearQuery').click(initUI); function updateConditions() { initElement(); for (let i = 0, len = metadata.length; i < len; i++) { if (metadata[i].tableName === selectedTable()) { metadata[i].columns.forEach((col) => { appendColumnElement(col.Name); if (col.Type !== 'Edm.Binary') { appendOrderByElement(col.Name); } }); registerEvent(); break; } } } function registerEvent() { $('#orderByFiltersList .queryOrderByValue').click(handleSortButtonClick); $('#selectFiltersList label').click(handleCheckBoxClick); } function initElement() { $('#selectFiltersList').empty(); $('#orderByFiltersList').empty(); $('#queryUrlText').empty(); $('#top').val(20); $('#selectConditions')[0].className = 'filterContainer'; $('#orderByConditions')[0].className = 'filterContainer'; orderBys = []; selectedColumns = []; selectTop = 20; } function appendColumnElement(prop) { const element = createElement(`<label><input type="checkbox" data-column="${prop}">${prop}</label>`); document.getElementById('selectFiltersList').appendChild(element); } function appendOrderByElement(prop) { const html = `<label> <div class="queryOrderByValueGroup btn-group" data-toggle="buttons"> <div name="queryOrderByValueGroup" class="queryOrderByValue btn btn-sm btn-info" data-toggle="radio" data-value="0" data-id="1" data-column="${prop}"> <i class="fa fa-lg fa-times"></i> </div> <div name="queryOrderByValueGroup" class="queryOrderByValue btn btn-sm btn-info" data-toggle="radio" data-value="1" data-id="1" data-column="${prop}"> <i class="fa fa-lg fa-sort-alpha-up"></i> </div> <div name="queryOrderByValueGroup" class="queryOrderByValue btn btn-sm btn-info" data-toggle="radio" data-value="2" data-id="1" data-column="${prop}"> <i class="fa fa-lg fa-sort-alpha-down"></i> </div> </div>${prop}</label>`; const sortElement = createElement(html); document.getElementById('orderByFiltersList').appendChild(sortElement); } function handleCheckBoxClick(event) { const columnName = event.target.dataset.column; if (columnName) { if (event.target.checked) { selectedColumns.push(columnName); } else { selectedColumns.splice(selectedColumns.indexOf(columnName), 1); } updateUrl(); } } function handleSortButtonClick(event) { const target = event.currentTarget; const column = target.dataset.column; const value = parseInt(target.dataset.value, 10); _.remove(orderBys, (order) => order.column === column); if (value !== 0) { orderBys.push({ column, desc: value === 2 }); } updateUrl(); } function selectedTable() { return $('#dataSource').val(); } function orderByQuery() { if (orderBys.length > 0) { const conditions = _.map(orderBys, (t) => `${t.column}${t.desc ? ' desc' : ''}`).join(','); return `$orderby=${conditions}`; } return undefined; } function selectQuery() { if (selectedColumns.length > 0) { const cols = selectedColumns.join(','); return `$select=${cols}`; } return undefined; } function updateUrl() { const block = $('#queryUrlText')[0]; let url = baseUrl; if (selectedTable()) { url += selectedTable(); } if (selectTop === 100000) { url += '/$count?'; } else if (selectTop === 0) { url += '()?'; } else { url += `?$top=${selectTop}&`; } const params = [orderByQuery(), selectQuery()].filter(_.identity).join('&'); url += params; url = _.trim(url, '?'); url = _.trim(url, '&'); searchUrl = url; block.value = url; } function createElement(html) { const div = document.createElement('div'); div.innerHTML = html; return div.children[0]; }
import _ from 'lodash'; export const baseUrl = process.env.SITE_ROOT + '/Northwind.svc/'; function isMSBrowser() { const isIE = /*@cc_on!@*/ false || !!document.documentMode; // Edge 20+ const isEdge = !isIE && !!window.StyleMedia; return isIE || isEdge; } export const metadata = []; const nodeName = isMSBrowser() ? 'childNodes' : 'children'; const parentName = isMSBrowser() ? 'parentNode' : 'parentElement'; export function fetchData(url) { return new Promise((resolve, reject) => { beginLoad(`Getting data from ${url}`); $.ajax({ url: url, crossDomain: true, success: (resp) => { endLoad(); if (_.isPlainObject(resp)) { const first = _.head(resp.value); if (first) { const props = Object.keys(first).filter( (prop) => !_.startsWith(prop, '_') && !_.isPlainObject(first[prop]) ); const data = resp.value.map((r) => _.pick(r, props)); resolve(data); } else { resolve([]); } } else { resolve([{ data: resp }]); } }, error: (err) => { endLoad(); reject(err); }, }); }); } export function loadMetadata(callback) { beginLoad('Getting metadata from ' + window.location.protocol + baseUrl); $.ajax({ url: `${baseUrl}$metadata`, crossDomain: true, success: (data) => { endLoad(); if (isMSBrowser()) { data = data.childNodes[0]; } const entityTypes = []; const entitySets = []; getEntityInfo(data, entityTypes, entitySets); metadata.length = 0; fillMetadata(entityTypes, entitySets); callback(metadata); }, error: (xhr, status) => { endLoad(); if (status !== 'abort') { alert('Failed to load data from remote web site.'); } }, }); } function fillMetadata(entityTypes, entitySets) { for (let i = 0, len1 = entitySets.length; i < len1; i++) { const entitySet = entitySets[i]; for (let j = 0, len2 = entityTypes.length; j < len2; j++) { const entityType = entityTypes[j]; if (entitySet.EntityType === entityType.Name) { metadata.push({ tableName: entitySet.Name, tableType: entityType.Name, columns: entityType.columns, }); } } } } function getEntityInfo(data, entityTypes, entitySets) { for (let i = 0, len = data.childElementCount; i < len; i++) { const subData = data[nodeName][i]; if (subData.nodeName === 'EntityType') { const nameSpace = readNode(subData[parentName], null, true); const type = {}; readEntityType(subData, type, nameSpace); entityTypes.push(type); } else if (subData.nodeName === 'EntitySet') { const set = {}; readNode(subData, set); entitySets.push(set); } else { getEntityInfo(subData, entityTypes, entitySets); } } } function readEntityType(entityType, node, nameSpace) { readNode(entityType, node); node.Name = nameSpace + '.' + node.Name; node.columns = []; for (let i = 0, len = entityType.childElementCount; i < len; i++) { const column = {}; if (entityType[nodeName][i].nodeName === 'Property') { readNode(entityType[nodeName][i], column); node.columns.push(column); } } } function readNode(xmlNode, node, onlyNameSpace) { for (let i = 0, len = xmlNode.attributes.length; i < len; i++) { const attribute = xmlNode.attributes[i]; const name = attribute.nodeName; const val = attribute.nodeValue; if (onlyNameSpace) { if (name === 'Namespace') { return val; } } else { node[name] = val; } } } function setDisplay(id, display) { const element = document.getElementById(id); if (element) { element.style.display = display; } } function beginLoad(text) { setDisplay('custom-loadIcon', ''); const msg = document.querySelector('#backgroundOverlay h3'); msg.innerHTML = text; setDisplay('backgroundOverlay', 'block'); } function endLoad() { setDisplay('custom-loadIcon', 'none'); setDisplay('backgroundOverlay', 'none'); }
html { background: #fff url("/dataviewsjs/demos/images/grid-background.png"); width: 100%; height: 100%; } body { background-color: transparent; padding: 10px 30px; font-family: "Roboto", Helvetica, Arial, sans-serif !important; } .form-control { color: #747474; background-color: #fffffb; font-weight: bold; display: inline-block; width: auto; vertical-align: middle; } .gc-grid { font-size: 12px; } .gc-popup-overlay { background-color: darkgrey; } #queryBuilderContainer { height: 100%; display: flex; flex-direction: column; } #queryBuilderContainer #backgroundOverlay { display: none; } #queryBuilderContainer #backgroundOverlay .cube-loader-container { position: fixed; left: 45%; top: 45%; } #queryBuilderContainer #backgroundOverlay .cube-loader-container h3 { left: -35%; position: relative; color: white; } #queryBuilderContainer #promtInfo { flex-grow: 0; flex-shrink: 0; } #queryBuilderContainer #queryBuilder { flex-grow: 0; flex-shrink: 1; } #queryBuilderContainer #queryBuilder #selectQuery { display: flex; align-items: center; margin-bottom: 20px; } #queryBuilderContainer #queryBuilder #selectQuery .selectDropDown { display: flex; align-items: center; margin-left: 45px; } #queryBuilderContainer #queryBuilder #selectQuery .selectDropDown #dataSource { margin-right: 10px; } #queryBuilderContainer #queryBuilder input { width: 18px; height: 18px; vertical-align: bottom; margin-right: 5px; } #queryBuilderContainer #queryBuilder input[type=text] { min-width: 250px; margin: 5px; padding: 3px; width: 99%; height: 30px; } #queryBuilderContainer #queryBuilder #errorMessage { display: none; } #queryBuilderContainer #queryBuilder #queryUrlText { display: inline-block; } #queryBuilderContainer #queryBuilder .buttonQuery { cursor: pointer; margin-top: 15px; width: 100px; height: 40px; } #queryBuilderContainer #queryBuilder #submitQuery { background: #29abe0; color: #ffffff; margin-right: 15px; } #queryBuilderContainer #queryBuilder #clearQuery { color: #000000; background-color: #e6e6e6; } #queryBuilderContainer #queryBuilder .filterList { display: none; } #queryBuilderContainer #queryBuilder .listVisible .filterList { overflow-y: auto; overflow-x: hidden; max-height: 200px; width: auto; display: inline-block; margin-left: 10px; } #queryBuilderContainer #queryBuilder .listVisible button { vertical-align: top; background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAA7CAAAOwgEVKEqAAAAAB3RJTUUH3QsJATEJ1u8O6wAAAbBJREFUOMut1V+LTVEYBvDf2bOPUmp8h9MwF0oSytVEdkfNRLmYK00ulFwpJWNEHYYo5gO40rggKRkX/tYkSaNc00l8hCEiMw43767V7nTmODy1L9ba63ne9b7rfdaqFUWhC0ZxEOPYhRy/sYolPMR9vKsShxqNRjpeh1O4hf34gdsxfoZP2IJJHIkgS/hVCuSJ2EbMx66e4yqe6I4iAl/CbhzGMmSxoI6bIXYOzR5i4l8z1o4Ht56mfBrHcR4X0LE2OngRaR/Dd7ysFUUxgrdRiyZW/B3qeITt2JbhEDZgdgAxwZnFMCYzTKCNRYNjMTQmcuzAjUrdhrE+6tMNGb7gW1LPpziaRw3aFcJFHOhxOEOYw/Vkro162Tar/hPyENtUmT8bhV4r5RQjWMmTdsmSFD/H1y8y7MObDAuhPvYPmY6FxkKGe/iKmdI+AzT2TGR0J4vTuYw9mB5AcDq4V/Cx9PJrbA1PdvCqDz/nsbMWHuAEOllin6m4OFvhzaKHWBFrWsGZKm2b3ofL4euTEfkx3sfd2E5aYy82R9ucwTX8LEVqfTwBO5PA6RNwFx+qxD9+2m672NnhxQAAAABJRU5ErkJggg==); background-repeat: no-repeat; } #queryBuilderContainer #queryBuilder .filterList > label { display: block; white-space: nowrap; margin-bottom: 10px; } #queryBuilderContainer #queryBuilder .queryOrderByValueGroup { margin-right: 5px; } #queryBuilderContainer #queryBuilder .filterContainer { display: flex; align-items: start; margin-bottom: 10px; } #queryBuilderContainer #queryBuilder .flex-button { display: flex; align-items: center; } #queryBuilderContainer #queryBuilder .filterLabel { margin-right: 10px; } #queryBuilderContainer #queryBuilder .addCondition { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAA7CAAAOwgEVKEqAAAAAB3RJTUUH3QsJATErA49PDwAAAgBJREFUOMut1T1IVWEYB/DfPfdKXxTRkFFD0KUhDUIotEYHl0KkoKlF+qBIoqGGloZoq6EPpaAiCGmIDDVaa4sgSYSyaIiiEEkSK4REr7flOXA63NsH9MCBw/s+z//5/r+Fjo4ONWQrdmMvmlGN8wJe4QEe4WXesJADXImTOI05PMczTMf9GrRhB5bgAi7hewpQyoCtQy/24V4oj6gt28PpOWxDDyazgKvRhz04hluYV19GcABPcDlKcRAzKWBP1Oswbvo7mcd1LOAGRnG+WC6Xm3EH93E204BUVmEX1mMqALIyhs04hKEEneHtIio1ItmCAdzG2hr3lbCdR2eCLjyNkOulVox6/6ijMxoYXQmaYjSyqa7AJjRGqgUk2IgN8TVk9KuB0VQKxS85j+3RnG9YHg6WRepVfEI33mZsppEkoVDxn6QUgI2588fYidnYiruRxX5MhM7nnM0aLJYwjtaoU1rHWbyL/4k4X8SHGkDpjrdhPMFgzFlLnSwaoiQLWFpHpyUwBhMMh9GpGI+8vI797q4TXTFsGzBcLJfLU9HpE/iIFzmDObyPu4UagEdwJohiIN3l3gi7Lxr1J3JIS3E0yGEAV0VkMIPjeIhr6A+K8hv66seV4IAefM3z4WTUaSy4rj1HsJXY5dYYpWKQyS8EW/iHJ6AaGaVPwBDe5A1/AgojgwuRXC6BAAAAAElFTkSuQmCC); background-repeat: no-repeat; cursor: pointer; color: transparent; height: 20px; width: 20px; padding: 0; border: none; outline: none; } #queryBuilderContainer #result { width: 100%; height: 100%; flex-grow: 1; flex-shrink: 1; margin-top: 20px; display: flex; } #queryBuilderContainer #result #grid { width: 100%; height: 100%; flex-grow: 1; flex-shrink: 1; } .sk-cube-grid { width: 80px; height: 80px; } .sk-cube-grid .sk-cube { width: 33%; height: 33%; background-color: blue; float: left; animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out; } .sk-cube-grid .sk-cube1 { animation-delay: 0.2s; } .sk-cube-grid .sk-cube2 { animation-delay: 0.3s; } .sk-cube-grid .sk-cube3 { animation-delay: 0.4s; } .sk-cube-grid .sk-cube4 { animation-delay: 0.1s; } .sk-cube-grid .sk-cube5 { animation-delay: 0.2s; } .sk-cube-grid .sk-cube6 { animation-delay: 0.3s; } .sk-cube-grid .sk-cube7 { animation-delay: 0s; } .sk-cube-grid .sk-cube8 { animation-delay: 0.1s; } .sk-cube-grid .sk-cube9 { animation-delay: 0.2s; } @keyframes sk-cubeGridScaleDelay { 0%, 70%, 100% { transform: scale3D(1, 1, 1); } 35% { transform: scale3D(0, 0, 1); } } /*# sourceMappingURL=data:application/json;charset=utf8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlNob3djYXNlL09EYXRhRXhwbG9yZXIvcHVyZWpzL3N0eWxlcy5zY3NzIiwiU2hvd2Nhc2UvT0RhdGFFeHBsb3Jlci9wdXJlanMvc3R5bGVzLmNzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTtFQUNFLHFFQUFBO0VBQ0EsV0FBQTtFQUNBLFlBQUE7QUNDRjs7QURFQTtFQUNFLDZCQUFBO0VBQ0Esa0JBQUE7RUFDQSw4REFBQTtBQ0NGOztBREVBO0VBQ0UsY0FBQTtFQUNBLHlCQUFBO0VBQ0EsaUJBQUE7RUFDQSxxQkFBQTtFQUNBLFdBQUE7RUFDQSxzQkFBQTtBQ0NGOztBREVBO0VBQ0UsZUFBQTtBQ0NGOztBREVBO0VBQ0UsMEJBQUE7QUNDRjs7QURFQTtFQUNFLFlBQUE7RUFDQSxhQUFBO0VBQ0Esc0JBQUE7QUNDRjtBRENFO0VBQ0UsYUFBQTtBQ0NKO0FEQ0k7RUFDRSxlQUFBO0VBQ0EsU0FBQTtFQUNBLFFBQUE7QUNDTjtBRENNO0VBQ0UsVUFBQTtFQUNBLGtCQUFBO0VBQ0EsWUFBQTtBQ0NSO0FESUU7RUFDRSxZQUFBO0VBQ0EsY0FBQTtBQ0ZKO0FES0U7RUFDRSxZQUFBO0VBQ0EsY0FBQTtBQ0hKO0FES0k7RUFDRSxhQUFBO0VBQ0EsbUJBQUE7RUFDQSxtQkFBQTtBQ0hOO0FES007RUFDRSxhQUFBO0VBQ0EsbUJBQUE7RUFDQSxpQkFBQTtBQ0hSO0FES1E7RUFDRSxrQkFBQTtBQ0hWO0FEUUk7RUFDRSxXQUFBO0VBQ0EsWUFBQTtFQUNBLHNCQUFBO0VBQ0EsaUJBQUE7QUNOTjtBRFNJO0VBQ0UsZ0JBQUE7RUFDQSxXQUFBO0VBQ0EsWUFBQTtFQUNBLFVBQUE7RUFDQSxZQUFBO0FDUE47QURVSTtFQUNFLGFBQUE7QUNSTjtBRFdJO0VBQ0UscUJBQUE7QUNUTjtBRFlJO0VBQ0UsZUFBQTtFQUNBLGdCQUFBO0VBQ0EsWUFBQTtFQUNBLFlBQUE7QUNWTjtBRGFJO0VBQ0UsbUJBQUE7RUFDQSxjQUFBO0VBQ0Esa0JBQUE7QUNYTjtBRGNJO0VBQ0UsY0FBQTtFQUNBLHlCQUFBO0FDWk47QURlSTtFQUNFLGFBQUE7QUNiTjtBRGdCSTtFQUNFLGdCQUFBO0VBQ0Esa0JBQUE7RUFDQSxpQkFBQTtFQUNBLFdBQUE7RUFDQSxxQkFBQTtFQUNBLGlCQUFBO0FDZE47QURpQkk7RUFDRSxtQkFBQTtFQUNBLG13QkFBQTtFQUNBLDRCQUFBO0FDZk47QURrQkk7RUFDRSxjQUFBO0VBQ0EsbUJBQUE7RUFDQSxtQkFBQTtBQ2hCTjtBRG1CSTtFQUNFLGlCQUFBO0FDakJOO0FEb0JJO0VBQ0UsYUFBQTtFQUNBLGtCQUFBO0VBQ0EsbUJBQUE7QUNsQk47QURxQkk7RUFDRSxhQUFBO0VBQ0EsbUJBQUE7QUNuQk47QURzQkk7RUFDRSxrQkFBQTtBQ3BCTjtBRHVCSTtFQUNFLDIyQkFBQTtFQUNBLDRCQUFBO0VBQ0EsZUFBQTtFQUNBLGtCQUFBO0VBQ0EsWUFBQTtFQUNBLFdBQUE7RUFDQSxVQUFBO0VBQ0EsWUFBQTtFQUNBLGFBQUE7QUNyQk47QUR5QkU7RUFDRSxXQUFBO0VBQ0EsWUFBQTtFQUNBLFlBQUE7RUFDQSxjQUFBO0VBQ0EsZ0JBQUE7RUFDQSxhQUFBO0FDdkJKO0FEeUJJO0VBQ0UsV0FBQTtFQUNBLFlBQUE7RUFDQSxZQUFBO0VBQ0EsY0FBQTtBQ3ZCTjs7QUQ2QkE7RUFDRSxXQUFBO0VBQ0EsWUFBQTtBQzFCRjs7QUQ2QkE7RUFDRSxVQUFBO0VBQ0EsV0FBQTtFQUNBLHNCQUFBO0VBQ0EsV0FBQTtFQUVBLDBEQUFBO0FDMUJGOztBRDRCQTtFQUVFLHFCQUFBO0FDekJGOztBRDJCQTtFQUVFLHFCQUFBO0FDeEJGOztBRDBCQTtFQUVFLHFCQUFBO0FDdkJGOztBRHlCQTtFQUVFLHFCQUFBO0FDdEJGOztBRHdCQTtFQUVFLHFCQUFBO0FDckJGOztBRHVCQTtFQUVFLHFCQUFBO0FDcEJGOztBRHNCQTtFQUVFLG1CQUFBO0FDbkJGOztBRHFCQTtFQUVFLHFCQUFBO0FDbEJGOztBRG9CQTtFQUVFLHFCQUFBO0FDakJGO0FEaUNBO0VBQ0U7SUFJRSwyQkFBQTtFQ3RCRjtFRHdCQTtJQUVFLDJCQUFBO0VDdEJGO0FBQ0YiLCJmaWxlIjoiU2hvd2Nhc2UvT0RhdGFFeHBsb3Jlci9wdXJlanMvc3R5bGVzLmNzcyIsInNvdXJjZXNDb250ZW50IjpbImh0bWwge1xuICBiYWNrZ3JvdW5kOiAjZmZmIHVybCgnL2RhdGF2aWV3c2pzL2RlbW9zL2ltYWdlcy9ncmlkLWJhY2tncm91bmQucG5nJyk7XG4gIHdpZHRoOiAxMDAlO1xuICBoZWlnaHQ6IDEwMCU7XG59XG5cbmJvZHkge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB0cmFuc3BhcmVudDtcbiAgcGFkZGluZzogMTBweCAzMHB4O1xuICBmb250LWZhbWlseTogJ1JvYm90bycsIEhlbHZldGljYSwgQXJpYWwsIHNhbnMtc2VyaWYgIWltcG9ydGFudDtcbn1cblxuLmZvcm0tY29udHJvbCB7XG4gIGNvbG9yOiAjNzQ3NDc0O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmZmZiO1xuICBmb250LXdlaWdodDogYm9sZDtcbiAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xuICB3aWR0aDogYXV0bztcbiAgdmVydGljYWwtYWxpZ246IG1pZGRsZTtcbn1cblxuLmdjLWdyaWQge1xuICBmb250LXNpemU6IDEycHg7XG59XG5cbi5nYy1wb3B1cC1vdmVybGF5IHtcbiAgYmFja2dyb3VuZC1jb2xvcjogZGFya2dyZXk7XG59XG5cbiNxdWVyeUJ1aWxkZXJDb250YWluZXIge1xuICBoZWlnaHQ6IDEwMCU7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG5cbiAgI2JhY2tncm91bmRPdmVybGF5IHtcbiAgICBkaXNwbGF5OiBub25lO1xuXG4gICAgLmN1YmUtbG9hZGVyLWNvbnRhaW5lciB7XG4gICAgICBwb3NpdGlvbjogZml4ZWQ7XG4gICAgICBsZWZ0OiA0NSU7XG4gICAgICB0b3A6IDQ1JTtcblxuICAgICAgaDMge1xuICAgICAgICBsZWZ0OiAtMzUlO1xuICAgICAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICAgICAgIGNvbG9yOiB3aGl0ZTtcbiAgICAgIH1cbiAgICB9XG4gIH1cblxuICAjcHJvbXRJbmZvIHtcbiAgICBmbGV4LWdyb3c6IDA7XG4gICAgZmxleC1zaHJpbms6IDA7XG4gIH1cblxuICAjcXVlcnlCdWlsZGVyIHtcbiAgICBmbGV4LWdyb3c6IDA7XG4gICAgZmxleC1zaHJpbms6IDE7XG5cbiAgICAjc2VsZWN0UXVlcnkge1xuICAgICAgZGlzcGxheTogZmxleDtcbiAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgICBtYXJnaW4tYm90dG9tOiAyMHB4O1xuXG4gICAgICAuc2VsZWN0RHJvcERvd24ge1xuICAgICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgICAgICBtYXJnaW4tbGVmdDogNDVweDtcblxuICAgICAgICAjZGF0YVNvdXJjZSB7XG4gICAgICAgICAgbWFyZ2luLXJpZ2h0OiAxMHB4O1xuICAgICAgICB9XG4gICAgICB9XG4gICAgfVxuXG4gICAgaW5wdXQge1xuICAgICAgd2lkdGg6IDE4cHg7XG4gICAgICBoZWlnaHQ6IDE4cHg7XG4gICAgICB2ZXJ0aWNhbC1hbGlnbjogYm90dG9tO1xuICAgICAgbWFyZ2luLXJpZ2h0OiA1cHg7XG4gICAgfVxuXG4gICAgaW5wdXRbdHlwZT0ndGV4dCddIHtcbiAgICAgIG1pbi13aWR0aDogMjUwcHg7XG4gICAgICBtYXJnaW46IDVweDtcbiAgICAgIHBhZGRpbmc6IDNweDtcbiAgICAgIHdpZHRoOiA5OSU7XG4gICAgICBoZWlnaHQ6IDMwcHg7XG4gICAgfVxuXG4gICAgI2Vycm9yTWVzc2FnZSB7XG4gICAgICBkaXNwbGF5OiBub25lO1xuICAgIH1cblxuICAgICNxdWVyeVVybFRleHQge1xuICAgICAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xuICAgIH1cblxuICAgIC5idXR0b25RdWVyeSB7XG4gICAgICBjdXJzb3I6IHBvaW50ZXI7XG4gICAgICBtYXJnaW4tdG9wOiAxNXB4O1xuICAgICAgd2lkdGg6IDEwMHB4O1xuICAgICAgaGVpZ2h0OiA0MHB4O1xuICAgIH1cblxuICAgICNzdWJtaXRRdWVyeSB7XG4gICAgICBiYWNrZ3JvdW5kOiAjMjlhYmUwO1xuICAgICAgY29sb3I6ICNmZmZmZmY7XG4gICAgICBtYXJnaW4tcmlnaHQ6IDE1cHg7XG4gICAgfVxuXG4gICAgI2NsZWFyUXVlcnkge1xuICAgICAgY29sb3I6ICMwMDAwMDA7XG4gICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjZTZlNmU2O1xuICAgIH1cblxuICAgIC5maWx0ZXJMaXN0IHtcbiAgICAgIGRpc3BsYXk6IG5vbmU7XG4gICAgfVxuXG4gICAgLmxpc3RWaXNpYmxlIC5maWx0ZXJMaXN0IHtcbiAgICAgIG92ZXJmbG93LXk6IGF1dG87XG4gICAgICBvdmVyZmxvdy14OiBoaWRkZW47XG4gICAgICBtYXgtaGVpZ2h0OiAyMDBweDtcbiAgICAgIHdpZHRoOiBhdXRvO1xuICAgICAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xuICAgICAgbWFyZ2luLWxlZnQ6IDEwcHg7XG4gICAgfVxuXG4gICAgLmxpc3RWaXNpYmxlIGJ1dHRvbiB7XG4gICAgICB2ZXJ0aWNhbC1hbGlnbjogdG9wO1xuICAgICAgYmFja2dyb3VuZDogdXJsKGRhdGE6aW1hZ2UvcG5nO2Jhc2U2NCxpVkJPUncwS0dnb0FBQUFOU1VoRVVnQUFBQlFBQUFBVUNBWUFBQUNOaVIwTkFBQUFCbUpMUjBRQS93RC9BUCtndmFlVEFBQUFDWEJJV1hNQUFBN0NBQUFPd2dFVktFcUFBQUFBQjNSSlRVVUgzUXNKQVRFSjF1OE82d0FBQWJCSlJFRlVPTXV0MVYrTFRWRVlCdkRmMmJPUFVtcDhoOU13RjBvU3l0VkVka2ZOUkxtWUswMHVsRndwSldORUhZWW81Z080MHJnZ0tSa1gvdFlrU2FOYzAwbDhoQ0VpTXc0Mzc2N1Y3blRtT0R5MUw5YmE2M25lOWI3cmZkYXFGVVdoQzBaeEVPUFloUnkvc1lvbFBNUjl2S3NTaHhxTlJqcGVoMU80aGYzNGdkc3hmb1pQMklKSkhJa2dTL2hWQ3VTSjJFYk14NjZlNHlxZTZJNGlBbC9DYmh6R01tU3hvSTZiSVhZT3pSNWk0bDh6MW80SHQ1Nm1mQnJIY1I0WDBMRTJPbmdSYVIvRGQ3eXNGVVV4Z3JkUml5WlcvQjNxZUlUdDJKYmhFRFpnZGdBeHdabkZNQ1l6VEtDTlJZTmpNVFFtY3V6QWpVcmRockUrNnRNTkdiN2dXMUxQcHppYVJ3M2FGY0pGSE9oeE9FT1l3L1Zrcm8xNjJUYXIvaFB5RU50VW1UOGJoVjRyNVJRaldNbVRkc21TRkQvSDF5OHk3TU9iREF1aFB2WVBtWTZGeGtLR2UvaUttZEkrQXpUMlRHUjBKNHZUdVl3OW1CNUFjRHE0Vi9DeDlQSnJiQTFQZHZDcUR6L25zYk1XSHVBRU9sbGluNm00T0Z2aHphS0hXQkZyV3NHWkttMmIzb2ZMNGV1VEVma3gzc2ZkMkU1YVl5ODJSOXVjd1RYOExFVnFmVHdCTzVQQTZSTndGeCtxeEQ5KzJtNjcyTm5oeFFBQUFBQkpSVTVFcmtKZ2dnPT0pO1xuICAgICAgYmFja2dyb3VuZC1yZXBlYXQ6IG5vLXJlcGVhdDtcbiAgICB9XG5cbiAgICAuZmlsdGVyTGlzdCA+IGxhYmVsIHtcbiAgICAgIGRpc3BsYXk6IGJsb2NrO1xuICAgICAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgICAgIG1hcmdpbi1ib3R0b206IDEwcHg7XG4gICAgfVxuXG4gICAgLnF1ZXJ5T3JkZXJCeVZhbHVlR3JvdXAge1xuICAgICAgbWFyZ2luLXJpZ2h0OiA1cHg7XG4gICAgfVxuXG4gICAgLmZpbHRlckNvbnRhaW5lciB7XG4gICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAgYWxpZ24taXRlbXM6IHN0YXJ0O1xuICAgICAgbWFyZ2luLWJvdHRvbTogMTBweDtcbiAgICB9XG5cbiAgICAuZmxleC1idXR0b24ge1xuICAgICAgZGlzcGxheTogZmxleDtcbiAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgfVxuXG4gICAgLmZpbHRlckxhYmVsIHtcbiAgICAgIG1hcmdpbi1yaWdodDogMTBweDtcbiAgICB9XG5cbiAgICAuYWRkQ29uZGl0aW9uIHtcbiAgICAgIGJhY2tncm91bmQ6IHVybChkYXRhOmltYWdlL3BuZztiYXNlNjQsaVZCT1J3MEtHZ29BQUFBTlNVaEVVZ0FBQUJRQUFBQVVDQVlBQUFDTmlSME5BQUFBQm1KTFIwUUEvd0QvQVArZ3ZhZVRBQUFBQ1hCSVdYTUFBQTdDQUFBT3dnRVZLRXFBQUFBQUIzUkpUVVVIM1FzSkFURXJBNDlQRHdBQUFnQkpSRUZVT011dDFUMUlWV0VZQi9EZlBmZEtYeFRSa0ZGRDBLVWhEVUlvdEVZSGwwS2tvS2xGK3FCSW9xR0dsb1pvcTZFUHBhQWlDR21JRERWYWE0c2dTWVN5YUlpaUVFa1NLNFJFcjdmbE9YQTYzTnNIOU1DQncvcyt6Ly81L3IrRmpvNE9OV1FyZG1Ndm1sR044d0plNFFFZTRXWGVzSkFEWEltVE9JMDVQTWN6VE1mOUdyUmhCNWJnQWk3aGV3cFF5b0N0UXkvMjRWNG9qNmd0MjhQcE9XeEREeWF6Z0t2Umh6MDRobHVZVjE5R2NBQlBjRGxLY1JBektXQlAxT3N3YnZvN21jZDFMT0FHUm5HK1dDNlhtM0VIOTNFMjA0QlVWbUVYMW1NcUFMSXloczA0aEtFRW5lSHRJaW8xSXRtQ0FkekcyaHIzbGJDZFIyZUNManlOa091bFZveDYvNmlqTXhvWVhRbWFZalN5cWE3QUpqUkdxZ1VrMklnTjhUVms5S3VCMFZRS3hTODVqKzNSbkc5WUhnNldSZXBWZkVJMzNtWnNwcEVrb1ZEeG42UVVnSTI1ODhmWWlkbllpcnVSeFg1TWhNN25uTTBhTEpZd2p0YW9VMXJIV2J5TC80azRYOFNIR2tEcGpyZGhQTUZnekZsTG5Td2FvaVFMV0ZwSHB5VXdCaE1NaDlHcEdJKzh2STc5N3E0VFhURnNHekJjTEpmTFU5SHBFL2lJRnptRE9ieVB1NFVhZ0Vkd0pvaGlJTjNsM2dpN0x4cjFKM0pJUzNFMHlHRUFWMFZrTUlQamVJaHI2QStLOGh2NjZzZVY0SUFlZk0zejRXVFVhU3k0cmoxSHNKWFk1ZFlZcFdLUXlTOEVXL2lISjZBYUdhVlB3QkRlNUExL0Fnb2pnd3VSWEM2QkFBQUFBRWxGVGtTdVFtQ0MpO1xuICAgICAgYmFja2dyb3VuZC1yZXBlYXQ6IG5vLXJlcGVhdDtcbiAgICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgICAgIGNvbG9yOiB0cmFuc3BhcmVudDtcbiAgICAgIGhlaWdodDogMjBweDtcbiAgICAgIHdpZHRoOiAyMHB4O1xuICAgICAgcGFkZGluZzogMDtcbiAgICAgIGJvcmRlcjogbm9uZTtcbiAgICAgIG91dGxpbmU6IG5vbmU7XG4gICAgfVxuICB9XG5cbiAgI3Jlc3VsdCB7XG4gICAgd2lkdGg6IDEwMCU7XG4gICAgaGVpZ2h0OiAxMDAlO1xuICAgIGZsZXgtZ3JvdzogMTtcbiAgICBmbGV4LXNocmluazogMTtcbiAgICBtYXJnaW4tdG9wOiAyMHB4O1xuICAgIGRpc3BsYXk6IGZsZXg7XG5cbiAgICAjZ3JpZCB7XG4gICAgICB3aWR0aDogMTAwJTtcbiAgICAgIGhlaWdodDogMTAwJTtcbiAgICAgIGZsZXgtZ3JvdzogMTtcbiAgICAgIGZsZXgtc2hyaW5rOiAxO1xuICAgIH1cbiAgfVxufVxuXG4vLyBsb2FkZXJcbi5zay1jdWJlLWdyaWQge1xuICB3aWR0aDogODBweDtcbiAgaGVpZ2h0OiA4MHB4O1xufVxuXG4uc2stY3ViZS1ncmlkIC5zay1jdWJlIHtcbiAgd2lkdGg6IDMzJTtcbiAgaGVpZ2h0OiAzMyU7XG4gIGJhY2tncm91bmQtY29sb3I6IGJsdWU7XG4gIGZsb2F0OiBsZWZ0O1xuICAtd2Via2l0LWFuaW1hdGlvbjogc2stY3ViZUdyaWRTY2FsZURlbGF5IDEuM3MgaW5maW5pdGUgZWFzZS1pbi1vdXQ7XG4gIGFuaW1hdGlvbjogc2stY3ViZUdyaWRTY2FsZURlbGF5IDEuM3MgaW5maW5pdGUgZWFzZS1pbi1vdXQ7XG59XG4uc2stY3ViZS1ncmlkIC5zay1jdWJlMSB7XG4gIC13ZWJraXQtYW5pbWF0aW9uLWRlbGF5OiAwLjJzO1xuICBhbmltYXRpb24tZGVsYXk6IDAuMnM7XG59XG4uc2stY3ViZS1ncmlkIC5zay1jdWJlMiB7XG4gIC13ZWJraXQtYW5pbWF0aW9uLWRlbGF5OiAwLjNzO1xuICBhbmltYXRpb24tZGVsYXk6IDAuM3M7XG59XG4uc2stY3ViZS1ncmlkIC5zay1jdWJlMyB7XG4gIC13ZWJraXQtYW5pbWF0aW9uLWRlbGF5OiAwLjRzO1xuICBhbmltYXRpb24tZGVsYXk6IDAuNHM7XG59XG4uc2stY3ViZS1ncmlkIC5zay1jdWJlNCB7XG4gIC13ZWJraXQtYW5pbWF0aW9uLWRlbGF5OiAwLjFzO1xuICBhbmltYXRpb24tZGVsYXk6IDAuMXM7XG59XG4uc2stY3ViZS1ncmlkIC5zay1jdWJlNSB7XG4gIC13ZWJraXQtYW5pbWF0aW9uLWRlbGF5OiAwLjJzO1xuICBhbmltYXRpb24tZGVsYXk6IDAuMnM7XG59XG4uc2stY3ViZS1ncmlkIC5zay1jdWJlNiB7XG4gIC13ZWJraXQtYW5pbWF0aW9uLWRlbGF5OiAwLjNzO1xuICBhbmltYXRpb24tZGVsYXk6IDAuM3M7XG59XG4uc2stY3ViZS1ncmlkIC5zay1jdWJlNyB7XG4gIC13ZWJraXQtYW5pbWF0aW9uLWRlbGF5OiAwcztcbiAgYW5pbWF0aW9uLWRlbGF5OiAwcztcbn1cbi5zay1jdWJlLWdyaWQgLnNrLWN1YmU4IHtcbiAgLXdlYmtpdC1hbmltYXRpb24tZGVsYXk6IDAuMXM7XG4gIGFuaW1hdGlvbi1kZWxheTogMC4xcztcbn1cbi5zay1jdWJlLWdyaWQgLnNrLWN1YmU5IHtcbiAgLXdlYmtpdC1hbmltYXRpb24tZGVsYXk6IDAuMnM7XG4gIGFuaW1hdGlvbi1kZWxheTogMC4ycztcbn1cblxuQC13ZWJraXQta2V5ZnJhbWVzIHNrLWN1YmVHcmlkU2NhbGVEZWxheSB7XG4gIDAlLFxuICA3MCUsXG4gIDEwMCUge1xuICAgIC13ZWJraXQtdHJhbnNmb3JtOiBzY2FsZTNEKDEsIDEsIDEpO1xuICAgIHRyYW5zZm9ybTogc2NhbGUzRCgxLCAxLCAxKTtcbiAgfVxuICAzNSUge1xuICAgIC13ZWJraXQtdHJhbnNmb3JtOiBzY2FsZTNEKDAsIDAsIDEpO1xuICAgIHRyYW5zZm9ybTogc2NhbGUzRCgwLCAwLCAxKTtcbiAgfVxufVxuXG5Aa2V5ZnJhbWVzIHNrLWN1YmVHcmlkU2NhbGVEZWxheSB7XG4gIDAlLFxuICA3MCUsXG4gIDEwMCUge1xuICAgIC13ZWJraXQtdHJhbnNmb3JtOiBzY2FsZTNEKDEsIDEsIDEpO1xuICAgIHRyYW5zZm9ybTogc2NhbGUzRCgxLCAxLCAxKTtcbiAgfVxuICAzNSUge1xuICAgIC13ZWJraXQtdHJhbnNmb3JtOiBzY2FsZTNEKDAsIDAsIDEpO1xuICAgIHRyYW5zZm9ybTogc2NhbGUzRCgwLCAwLCAxKTtcbiAgfVxufVxuIiwiaHRtbCB7XG4gIGJhY2tncm91bmQ6ICNmZmYgdXJsKFwiL2RhdGF2aWV3c2pzL2RlbW9zL2ltYWdlcy9ncmlkLWJhY2tncm91bmQucG5nXCIpO1xuICB3aWR0aDogMTAwJTtcbiAgaGVpZ2h0OiAxMDAlO1xufVxuXG5ib2R5IHtcbiAgYmFja2dyb3VuZC1jb2xvcjogdHJhbnNwYXJlbnQ7XG4gIHBhZGRpbmc6IDEwcHggMzBweDtcbiAgZm9udC1mYW1pbHk6IFwiUm9ib3RvXCIsIEhlbHZldGljYSwgQXJpYWwsIHNhbnMtc2VyaWYgIWltcG9ydGFudDtcbn1cblxuLmZvcm0tY29udHJvbCB7XG4gIGNvbG9yOiAjNzQ3NDc0O1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmZmZiO1xuICBmb250LXdlaWdodDogYm9sZDtcbiAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xuICB3aWR0aDogYXV0bztcbiAgdmVydGljYWwtYWxpZ246IG1pZGRsZTtcbn1cblxuLmdjLWdyaWQge1xuICBmb250LXNpemU6IDEycHg7XG59XG5cbi5nYy1wb3B1cC1vdmVybGF5IHtcbiAgYmFja2dyb3VuZC1jb2xvcjogZGFya2dyZXk7XG59XG5cbiNxdWVyeUJ1aWxkZXJDb250YWluZXIge1xuICBoZWlnaHQ6IDEwMCU7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG59XG4jcXVlcnlCdWlsZGVyQ29udGFpbmVyICNiYWNrZ3JvdW5kT3ZlcmxheSB7XG4gIGRpc3BsYXk6IG5vbmU7XG59XG4jcXVlcnlCdWlsZGVyQ29udGFpbmVyICNiYWNrZ3JvdW5kT3ZlcmxheSAuY3ViZS1sb2FkZXItY29udGFpbmVyIHtcbiAgcG9zaXRpb246IGZpeGVkO1xuICBsZWZ0OiA0NSU7XG4gIHRvcDogNDUlO1xufVxuI3F1ZXJ5QnVpbGRlckNvbnRhaW5lciAjYmFja2dyb3VuZE92ZXJsYXkgLmN1YmUtbG9hZGVyLWNvbnRhaW5lciBoMyB7XG4gIGxlZnQ6IC0zNSU7XG4gIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgY29sb3I6IHdoaXRlO1xufVxuI3F1ZXJ5QnVpbGRlckNvbnRhaW5lciAjcHJvbXRJbmZvIHtcbiAgZmxleC1ncm93OiAwO1xuICBmbGV4LXNocmluazogMDtcbn1cbiNxdWVyeUJ1aWxkZXJDb250YWluZXIgI3F1ZXJ5QnVpbGRlciB7XG4gIGZsZXgtZ3JvdzogMDtcbiAgZmxleC1zaHJpbms6IDE7XG59XG4jcXVlcnlCdWlsZGVyQ29udGFpbmVyICNxdWVyeUJ1aWxkZXIgI3NlbGVjdFF1ZXJ5IHtcbiAgZGlzcGxheTogZmxleDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgbWFyZ2luLWJvdHRvbTogMjBweDtcbn1cbiNxdWVyeUJ1aWxkZXJDb250YWluZXIgI3F1ZXJ5QnVpbGRlciAjc2VsZWN0UXVlcnkgLnNlbGVjdERyb3BEb3duIHtcbiAgZGlzcGxheTogZmxleDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgbWFyZ2luLWxlZnQ6IDQ1cHg7XG59XG4jcXVlcnlCdWlsZGVyQ29udGFpbmVyICNxdWVyeUJ1aWxkZXIgI3NlbGVjdFF1ZXJ5IC5zZWxlY3REcm9wRG93biAjZGF0YVNvdXJjZSB7XG4gIG1hcmdpbi1yaWdodDogMTBweDtcbn1cbiNxdWVyeUJ1aWxkZXJDb250YWluZXIgI3F1ZXJ5QnVpbGRlciBpbnB1dCB7XG4gIHdpZHRoOiAxOHB4O1xuICBoZWlnaHQ6IDE4cHg7XG4gIHZlcnRpY2FsLWFsaWduOiBib3R0b207XG4gIG1hcmdpbi1yaWdodDogNXB4O1xufVxuI3F1ZXJ5QnVpbGRlckNvbnRhaW5lciAjcXVlcnlCdWlsZGVyIGlucHV0W3R5cGU9dGV4dF0ge1xuICBtaW4td2lkdGg6IDI1MHB4O1xuICBtYXJnaW46IDVweDtcbiAgcGFkZGluZzogM3B4O1xuICB3aWR0aDogOTklO1xuICBoZWlnaHQ6IDMwcHg7XG59XG4jcXVlcnlCdWlsZGVyQ29udGFpbmVyICNxdWVyeUJ1aWxkZXIgI2Vycm9yTWVzc2FnZSB7XG4gIGRpc3BsYXk6IG5vbmU7XG59XG4jcXVlcnlCdWlsZGVyQ29udGFpbmVyICNxdWVyeUJ1aWxkZXIgI3F1ZXJ5VXJsVGV4dCB7XG4gIGRpc3BsYXk6IGlubGluZS1ibG9jaztcbn1cbiNxdWVyeUJ1aWxkZXJDb250YWluZXIgI3F1ZXJ5QnVpbGRlciAuYnV0dG9uUXVlcnkge1xuICBjdXJzb3I6IHBvaW50ZXI7XG4gIG1hcmdpbi10b3A6IDE1cHg7XG4gIHdpZHRoOiAxMDBweDtcbiAgaGVpZ2h0OiA0MHB4O1xufVxuI3F1ZXJ5QnVpbGRlckNvbnRhaW5lciAjcXVlcnlCdWlsZGVyICNzdWJtaXRRdWVyeSB7XG4gIGJhY2tncm91bmQ6ICMyOWFiZTA7XG4gIGNvbG9yOiAjZmZmZmZmO1xuICBtYXJnaW4tcmlnaHQ6IDE1cHg7XG59XG4jcXVlcnlCdWlsZGVyQ29udGFpbmVyICNxdWVyeUJ1aWxkZXIgI2NsZWFyUXVlcnkge1xuICBjb2xvcjogIzAwMDAwMDtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2U2ZTZlNjtcbn1cbiNxdWVyeUJ1aWxkZXJDb250YWluZXIgI3F1ZXJ5QnVpbGRlciAuZmlsdGVyTGlzdCB7XG4gIGRpc3BsYXk6IG5vbmU7XG59XG4jcXVlcnlCdWlsZGVyQ29udGFpbmVyICNxdWVyeUJ1aWxkZXIgLmxpc3RWaXNpYmxlIC5maWx0ZXJMaXN0IHtcbiAgb3ZlcmZsb3cteTogYXV0bztcbiAgb3ZlcmZsb3cteDogaGlkZGVuO1xuICBtYXgtaGVpZ2h0OiAyMDBweDtcbiAgd2lkdGg6IGF1dG87XG4gIGRpc3BsYXk6IGlubGluZS1ibG9jaztcbiAgbWFyZ2luLWxlZnQ6IDEwcHg7XG59XG4jcXVlcnlCdWlsZGVyQ29udGFpbmVyICNxdWVyeUJ1aWxkZXIgLmxpc3RWaXNpYmxlIGJ1dHRvbiB7XG4gIHZlcnRpY2FsLWFsaWduOiB0b3A7XG4gIGJhY2tncm91bmQ6IHVybChkYXRhOmltYWdlL3BuZztiYXNlNjQsaVZCT1J3MEtHZ29BQUFBTlNVaEVVZ0FBQUJRQUFBQVVDQVlBQUFDTmlSME5BQUFBQm1KTFIwUUEvd0QvQVArZ3ZhZVRBQUFBQ1hCSVdYTUFBQTdDQUFBT3dnRVZLRXFBQUFBQUIzUkpUVVVIM1FzSkFURUoxdThPNndBQUFiQkpSRUZVT011dDFWK0xUVkVZQnZEZjJiT1BVbXA4aDlNd0Ywb1N5dFZFZGtmTlJMbVlLMDB1bEZ3cEpXTkVIWVlvNWdPNDByZ2dLUmtYL3RZa1NhTmMwMGw4aENFaU13NDM3NjdWN25UbU9EeTFMOWJhNjNuZTliN3JmZGFxRlVXaEMwWnhFT1BZaFJ5L3NZb2xQTVI5dktzU2h4cU5SanBlaDFPNGhmMzRnZHN4Zm9aUDJJSkpISWtnUy9oVkN1U0oyRWJNeDY2ZTR5cWU2STRpQWwvQ2JoekdNbVN4b0k2YklYWU96UjVpNGw4ejFvNEh0NTZtZkJySGNSNFgwTEUyT25nUmFSL0RkN3lzRlVVeGdyZFJpeVpXL0IzcWVJVHQySmJoRURaZ2RnQXh3Wm5GTUNZelRLQ05SWU5qTVRRbWN1ekFqVXJkaHJFKzZ0TU5HYjdnVzFMUHB6aWFSdzNhRmNKRkhPaHhPRU9Zdy9Wa3JvMTYyVGFyL2hQeUVOdFVtVDhiaFY0cjVSUWpXTW1UZHNtU0ZEL0gxeTh5N01PYkRBdWhQdllQbVk2RnhrS0dlL2lLbWRJK0F6VDJUR1IwSjR2VHVZdzltQjVBY0RxNFYvQ3g5UEpyYkExUGR2Q3FEei9uc2JNV0h1QUVPbGxpbjZtNE9Gdmh6YUtIV0JGcldzR1pLbTJiM29mTDRldVRFZmt4M3NmZDJFNWFZeTgyUjl1Y3dUWDhMRVZxZlR3Qk81UEE2Uk53RngrcXhEOSsybTY3Mk5uaHhRQUFBQUJKUlU1RXJrSmdnZz09KTtcbiAgYmFja2dyb3VuZC1yZXBlYXQ6IG5vLXJlcGVhdDtcbn1cbiNxdWVyeUJ1aWxkZXJDb250YWluZXIgI3F1ZXJ5QnVpbGRlciAuZmlsdGVyTGlzdCA+IGxhYmVsIHtcbiAgZGlzcGxheTogYmxvY2s7XG4gIHdoaXRlLXNwYWNlOiBub3dyYXA7XG4gIG1hcmdpbi1ib3R0b206IDEwcHg7XG59XG4jcXVlcnlCdWlsZGVyQ29udGFpbmVyICNxdWVyeUJ1aWxkZXIgLnF1ZXJ5T3JkZXJCeVZhbHVlR3JvdXAge1xuICBtYXJnaW4tcmlnaHQ6IDVweDtcbn1cbiNxdWVyeUJ1aWxkZXJDb250YWluZXIgI3F1ZXJ5QnVpbGRlciAuZmlsdGVyQ29udGFpbmVyIHtcbiAgZGlzcGxheTogZmxleDtcbiAgYWxpZ24taXRlbXM6IHN0YXJ0O1xuICBtYXJnaW4tYm90dG9tOiAxMHB4O1xufVxuI3F1ZXJ5QnVpbGRlckNvbnRhaW5lciAjcXVlcnlCdWlsZGVyIC5mbGV4LWJ1dHRvbiB7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG59XG4jcXVlcnlCdWlsZGVyQ29udGFpbmVyICNxdWVyeUJ1aWxkZXIgLmZpbHRlckxhYmVsIHtcbiAgbWFyZ2luLXJpZ2h0OiAxMHB4O1xufVxuI3F1ZXJ5QnVpbGRlckNvbnRhaW5lciAjcXVlcnlCdWlsZGVyIC5hZGRDb25kaXRpb24ge1xuICBiYWNrZ3JvdW5kOiB1cmwoZGF0YTppbWFnZS9wbmc7YmFzZTY0LGlWQk9SdzBLR2dvQUFBQU5TVWhFVWdBQUFCUUFBQUFVQ0FZQUFBQ05pUjBOQUFBQUJtSkxSMFFBL3dEL0FQK2d2YWVUQUFBQUNYQklXWE1BQUE3Q0FBQU93Z0VWS0VxQUFBQUFCM1JKVFVVSDNRc0pBVEVyQTQ5UER3QUFBZ0JKUkVGVU9NdXQxVDFJVldFWUIvRGZQZmRLWHhUUmtGRkQwS1VoRFVJb3RFWUhsMEtrb0tsRitxQklvcUdHbG9ab3E2RVBwYUFpQ0dtSUREVmFhNHNnU1lTeWFJaWlFRWtTSzRSRXI3ZmxPWEE2M05zSDlNQ0J3L3Mrei8vNS9yK0ZqbzRPTldRcmRtTXZtbEdOOHdKZTRRRWU0V1hlc0pBRFhJbVRPSTA1UE1jelRNZjlHclJoQjViZ0FpN2hld3BReW9DdFF5LzI0VjRvajZndDI4UHBPV3hERHlhemdLdlJoejA0aGx1WVYxOUdjQUJQY0RsS2NSQXpLV0JQMU9zd2J2bzdtY2QxTE9BR1JuRytXQzZYbTNFSDkzRTIwNEJVVm1FWDFtTXFBTEl5aHMwNGhLRUVuZUh0SWlvMUl0bUNBZHpHMmhyM2xiQ2RSMmVDTGp5TmtPdWxWb3g2LzZpak14b1lYUW1hWWpTeXFhN0FKalJHcWdVazJJZ044VFZrOUt1QjBWUUt4Uzg1aiszUm5HOVlIZzZXUmVwVmZFSTMzbVpzcHBFa29WRHhuNlFVZ0kyNTg4ZllpZG5ZaXJ1UnhYNU1oTTdubk0wYUxKWXdqdGFvVTFySFdieUwvNGs0WDhTSEdrRHBqcmRoUE1GZ3pGbExuU3dhb2lRTFdGcEhweVV3QmhNTWg5R3BHSSs4dkk3OTdxNFRYVEZzR3pCY0xKZkxVOUhwRS9pSUZ6bURPYnlQdTRVYWdFZHdKb2hpSU4zbDNnaTdMeHIxSjNKSVMzRTB5R0VBVjBWa01JUGplSWhyNkErSzhodjY2c2VWNElBZWZNM3o0V1RVYVN5NHJqMUhzSlhZNWRZWXBXS1F5UzhFVy9pSEo2QWFHYVZQd0JEZTVBMS9BZ29qZ3d1UlhDNkJBQUFBQUVsRlRrU3VRbUNDKTtcbiAgYmFja2dyb3VuZC1yZXBlYXQ6IG5vLXJlcGVhdDtcbiAgY3Vyc29yOiBwb2ludGVyO1xuICBjb2xvcjogdHJhbnNwYXJlbnQ7XG4gIGhlaWdodDogMjBweDtcbiAgd2lkdGg6IDIwcHg7XG4gIHBhZGRpbmc6IDA7XG4gIGJvcmRlcjogbm9uZTtcbiAgb3V0bGluZTogbm9uZTtcbn1cbiNxdWVyeUJ1aWxkZXJDb250YWluZXIgI3Jlc3VsdCB7XG4gIHdpZHRoOiAxMDAlO1xuICBoZWlnaHQ6IDEwMCU7XG4gIGZsZXgtZ3JvdzogMTtcbiAgZmxleC1zaHJpbms6IDE7XG4gIG1hcmdpbi10b3A6IDIwcHg7XG4gIGRpc3BsYXk6IGZsZXg7XG59XG4jcXVlcnlCdWlsZGVyQ29udGFpbmVyICNyZXN1bHQgI2dyaWQge1xuICB3aWR0aDogMTAwJTtcbiAgaGVpZ2h0OiAxMDAlO1xuICBmbGV4LWdyb3c6IDE7XG4gIGZsZXgtc2hyaW5rOiAxO1xufVxuXG4uc2stY3ViZS1ncmlkIHtcbiAgd2lkdGg6IDgwcHg7XG4gIGhlaWdodDogODBweDtcbn1cblxuLnNrLWN1YmUtZ3JpZCAuc2stY3ViZSB7XG4gIHdpZHRoOiAzMyU7XG4gIGhlaWdodDogMzMlO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiBibHVlO1xuICBmbG9hdDogbGVmdDtcbiAgLXdlYmtpdC1hbmltYXRpb246IHNrLWN1YmVHcmlkU2NhbGVEZWxheSAxLjNzIGluZmluaXRlIGVhc2UtaW4tb3V0O1xuICBhbmltYXRpb246IHNrLWN1YmVHcmlkU2NhbGVEZWxheSAxLjNzIGluZmluaXRlIGVhc2UtaW4tb3V0O1xufVxuXG4uc2stY3ViZS1ncmlkIC5zay1jdWJlMSB7XG4gIC13ZWJraXQtYW5pbWF0aW9uLWRlbGF5OiAwLjJzO1xuICBhbmltYXRpb24tZGVsYXk6IDAuMnM7XG59XG5cbi5zay1jdWJlLWdyaWQgLnNrLWN1YmUyIHtcbiAgLXdlYmtpdC1hbmltYXRpb24tZGVsYXk6IDAuM3M7XG4gIGFuaW1hdGlvbi1kZWxheTogMC4zcztcbn1cblxuLnNrLWN1YmUtZ3JpZCAuc2stY3ViZTMge1xuICAtd2Via2l0LWFuaW1hdGlvbi1kZWxheTogMC40cztcbiAgYW5pbWF0aW9uLWRlbGF5OiAwLjRzO1xufVxuXG4uc2stY3ViZS1ncmlkIC5zay1jdWJlNCB7XG4gIC13ZWJraXQtYW5pbWF0aW9uLWRlbGF5OiAwLjFzO1xuICBhbmltYXRpb24tZGVsYXk6IDAuMXM7XG59XG5cbi5zay1jdWJlLWdyaWQgLnNrLWN1YmU1IHtcbiAgLXdlYmtpdC1hbmltYXRpb24tZGVsYXk6IDAuMnM7XG4gIGFuaW1hdGlvbi1kZWxheTogMC4ycztcbn1cblxuLnNrLWN1YmUtZ3JpZCAuc2stY3ViZTYge1xuICAtd2Via2l0LWFuaW1hdGlvbi1kZWxheTogMC4zcztcbiAgYW5pbWF0aW9uLWRlbGF5OiAwLjNzO1xufVxuXG4uc2stY3ViZS1ncmlkIC5zay1jdWJlNyB7XG4gIC13ZWJraXQtYW5pbWF0aW9uLWRlbGF5OiAwcztcbiAgYW5pbWF0aW9uLWRlbGF5OiAwcztcbn1cblxuLnNrLWN1YmUtZ3JpZCAuc2stY3ViZTgge1xuICAtd2Via2l0LWFuaW1hdGlvbi1kZWxheTogMC4xcztcbiAgYW5pbWF0aW9uLWRlbGF5OiAwLjFzO1xufVxuXG4uc2stY3ViZS1ncmlkIC5zay1jdWJlOSB7XG4gIC13ZWJraXQtYW5pbWF0aW9uLWRlbGF5OiAwLjJzO1xuICBhbmltYXRpb24tZGVsYXk6IDAuMnM7XG59XG5cbkAtd2Via2l0LWtleWZyYW1lcyBzay1jdWJlR3JpZFNjYWxlRGVsYXkge1xuICAwJSwgNzAlLCAxMDAlIHtcbiAgICAtd2Via2l0LXRyYW5zZm9ybTogc2NhbGUzRCgxLCAxLCAxKTtcbiAgICB0cmFuc2Zvcm06IHNjYWxlM0QoMSwgMSwgMSk7XG4gIH1cbiAgMzUlIHtcbiAgICAtd2Via2l0LXRyYW5zZm9ybTogc2NhbGUzRCgwLCAwLCAxKTtcbiAgICB0cmFuc2Zvcm06IHNjYWxlM0QoMCwgMCwgMSk7XG4gIH1cbn1cbkBrZXlmcmFtZXMgc2stY3ViZUdyaWRTY2FsZURlbGF5IHtcbiAgMCUsIDcwJSwgMTAwJSB7XG4gICAgLXdlYmtpdC10cmFuc2Zvcm06IHNjYWxlM0QoMSwgMSwgMSk7XG4gICAgdHJhbnNmb3JtOiBzY2FsZTNEKDEsIDEsIDEpO1xuICB9XG4gIDM1JSB7XG4gICAgLXdlYmtpdC10cmFuc2Zvcm06IHNjYWxlM0QoMCwgMCwgMSk7XG4gICAgdHJhbnNmb3JtOiBzY2FsZTNEKDAsIDAsIDEpO1xuICB9XG59Il19 */
(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);