Compare commits

...

24 Commits

Author SHA1 Message Date
ea0858fd27 1.0.74 2022-04-14 16:56:04 +02:00
03c00919df fix(core): update 2022-04-14 16:56:04 +02:00
6917145b58 1.0.73 2022-03-24 18:30:55 +01:00
2e2ad98ed8 fix(core): update 2022-03-24 18:30:54 +01:00
68375a5e58 1.0.72 2022-03-24 17:08:26 +01:00
5876225b39 fix(core): update 2022-03-24 17:08:25 +01:00
342ac96429 1.0.71 2022-03-24 16:14:12 +01:00
85a472fe1c fix(core): update 2022-03-24 16:14:12 +01:00
4fecae83dc 1.0.70 2022-03-24 15:53:03 +01:00
b7a666ac66 fix(core): update 2022-03-24 15:53:02 +01:00
e559ed072c 1.0.69 2022-03-24 15:39:18 +01:00
c44d9e7365 fix(core): update 2022-03-24 15:39:17 +01:00
53f53be991 1.0.68 2022-03-04 10:24:04 +01:00
9dec6e25b5 fix(core): update 2022-03-04 10:24:03 +01:00
03fa323eb9 1.0.67 2022-03-02 20:01:15 +01:00
e0344bb513 fix(core): update 2022-03-02 20:01:14 +01:00
a6f583b8c4 1.0.66 2021-11-26 19:18:14 +01:00
60e173b7be fix(core): update 2021-11-26 19:18:14 +01:00
d51027d4be 1.0.65 2021-11-26 19:16:09 +01:00
2efa465930 fix(core): update 2021-11-26 19:16:09 +01:00
19081caacd 1.0.64 2021-11-26 19:05:05 +01:00
c42e8b8bef fix(core): update 2021-11-26 19:05:04 +01:00
750e8cef32 1.0.63 2021-11-26 18:52:44 +01:00
c0d057949d fix(core): update 2021-11-26 18:52:44 +01:00
17 changed files with 6941 additions and 16267 deletions

View File

@ -12,6 +12,9 @@ stages:
- release - release
- metadata - metadata
before_script:
- npm install -g @shipzone/npmci
# ==================== # ====================
# security stage # security stage
# ==================== # ====================
@ -36,6 +39,7 @@ auditProductionDependencies:
- npmci command npm audit --audit-level=high --only=prod --production - npmci command npm audit --audit-level=high --only=prod --production
tags: tags:
- docker - docker
allow_failure: true
auditDevDependencies: auditDevDependencies:
image: registry.gitlab.com/hosttoday/ht-docker-node:npmci image: registry.gitlab.com/hosttoday/ht-docker-node:npmci
@ -96,10 +100,9 @@ codequality:
only: only:
- tags - tags
script: script:
- npmci command npm install -g tslint typescript - npmci command npm install -g typescript
- npmci npm prepare - npmci npm prepare
- npmci npm install - npmci npm install
- npmci command "tslint -c tslint.json ./ts/**/*.ts"
tags: tags:
- lossless - lossless
- docker - docker

24
.vscode/launch.json vendored
View File

@ -2,28 +2,10 @@
"version": "0.2.0", "version": "0.2.0",
"configurations": [ "configurations": [
{ {
"name": "current file", "command": "npm test",
"type": "node", "name": "Run npm test",
"request": "launch", "request": "launch",
"args": [ "type": "node-terminal"
"${relativeFile}"
],
"runtimeArgs": ["-r", "@gitzone/tsrun"],
"cwd": "${workspaceRoot}",
"protocol": "inspector",
"internalConsoleOptions": "openOnSessionStart"
},
{
"name": "test.ts",
"type": "node",
"request": "launch",
"args": [
"test/test.ts"
],
"runtimeArgs": ["-r", "@gitzone/tsrun"],
"cwd": "${workspaceRoot}",
"protocol": "inspector",
"internalConsoleOptions": "openOnSessionStart"
} }
] ]
} }

View File

@ -17,7 +17,7 @@
} }
</style> </style>
<script src="./index.ts"></script> <script type="module" src="/bundle.js"></script>
</head> </head>
<body> <body>
</body> </body>

View File

@ -1,10 +1,10 @@
// dees tools // dees tools
import * as deesWccTools from '../ts_web'; import * as deesWccTools from '../ts_web/index.js';
import * as deesDomTools from '@designestate/dees-domtools'; import * as deesDomTools from '@designestate/dees-domtools';
// elements and pages // elements and pages
import * as elements from '../test/elements'; import * as elements from '../test/elements/index.js';
import * as pages from '../test/pages'; import * as pages from '../test/pages/index.js';
deesWccTools.setupWccTools(elements as any, pages); deesWccTools.setupWccTools(elements as any, pages);
deesDomTools.elementBasic.setup(); deesDomTools.elementBasic.setup();

View File

@ -5,7 +5,7 @@
"githost": "gitlab.com", "githost": "gitlab.com",
"gitscope": "designestate", "gitscope": "designestate",
"gitrepo": "dees-wcctools", "gitrepo": "dees-wcctools",
"shortDescription": "wcc tools for creating element catalogues", "description": "wcc tools for creating element catalogues",
"npmPackagename": "@designestate/dees-wcctools", "npmPackagename": "@designestate/dees-wcctools",
"license": "MIT", "license": "MIT",
"projectDomain": "design.estate" "projectDomain": "design.estate"

22856
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -1,31 +1,29 @@
{ {
"name": "@designestate/dees-wcctools", "name": "@designestate/dees-wcctools",
"version": "1.0.62", "version": "1.0.74",
"private": false, "private": false,
"description": "wcc tools for creating element catalogues", "description": "wcc tools for creating element catalogues",
"main": "dist_ts_web/index.js", "main": "dist_ts_web/index.js",
"typings": "dist_ts_web/index.d.ts", "typings": "dist_ts_web/index.d.ts",
"type": "module",
"scripts": { "scripts": {
"test": "(npm run build)", "test": "(npm run build)",
"build": "(tsbuild custom ts_web --web && tsbundle element)", "build": "(tsbuild element --web --allowimplicitany --skiplibcheck && tsbundle element)",
"watch": "tswatch element" "watch": "tswatch element"
}, },
"author": "Lossless GmbH", "author": "Lossless GmbH",
"license": "UNLICENSED", "license": "UNLICENSED",
"dependencies": { "dependencies": {
"@designestate/dees-domtools": "^1.0.102", "@designestate/dees-domtools": "^2.0.6",
"@designestate/dees-element": "^1.0.26", "@designestate/dees-element": "^2.0.6",
"@gitzone/tsrun": "^1.2.18", "@gitzone/tsrun": "^1.2.32",
"@pushrocks/smartdelay": "^2.0.13", "@pushrocks/smartdelay": "^2.0.13",
"@pushrocks/smartexpress": "^3.0.108", "@pushrocks/smartexpress": "^4.0.4"
"lit-element": "^3.0.2",
"lit-html": "^2.0.2",
"typescript": "^4.5.2"
}, },
"devDependencies": { "devDependencies": {
"@gitzone/tsbuild": "^2.1.28", "@gitzone/tsbuild": "^2.1.61",
"@gitzone/tsbundle": "^1.0.88", "@gitzone/tsbundle": "^1.0.102",
"@gitzone/tswatch": "^1.0.56", "@gitzone/tswatch": "^1.0.76",
"@pushrocks/projectinfo": "^4.0.5", "@pushrocks/projectinfo": "^4.0.5",
"tslint": "^6.1.3", "tslint": "^6.1.3",
"tslint-config-prettier": "^1.17.0" "tslint-config-prettier": "^1.17.0"

View File

@ -1 +1 @@
export * from './test-demoelement'; export * from './test-demoelement.js';

View File

@ -72,12 +72,21 @@ export class TestDemoelement extends DeesElement {
color: ${cssManager.bdTheme('#000', '#fff')}; color: ${cssManager.bdTheme('#000', '#fff')};
background: ${cssManager.bdTheme('#fff', '#000')}; background: ${cssManager.bdTheme('#fff', '#000')};
} }
@container wccToolsViewport size(min-width: 1px) {
.maincontainer,
.themeindicator {
border-radius: 50px;
}
}
${domtools.breakpoints.cssForPhablet(css` ${domtools.breakpoints.cssForPhablet(css`
.maincontainer, .maincontainer,
.themeindicator { .themeindicator {
border-radius: 50px; border-radius: 50px;
} }
`)} `)}
pre b { pre b {
color: green; color: green;
} }

View File

@ -1,3 +1,3 @@
import * as wcctools from '../ts_web/index'; import * as wcctools from '../ts_web/index.js';
import * as elements from './elements'; import * as elements from './elements/index.js';
wcctools.setupWccTools(elements as any, {}); wcctools.setupWccTools(elements as any, {});

View File

@ -1,19 +1,18 @@
import { LitElement, property, html, customElement, TemplateResult, queryAsync } from 'lit-element'; import { DeesElement, property, html, customElement, TemplateResult, queryAsync, render, domtools } from '@designestate/dees-element';
import * as plugins from '../wcctools.plugins'; import * as plugins from '../wcctools.plugins.js';
// wcc tools // wcc tools
import './wcc-frame'; import './wcc-frame.js';
import './wcc-sidebar'; import './wcc-sidebar.js';
import './wcc-properties'; import './wcc-properties.js';
import { TTheme } from './wcc-properties'; import { TTheme } from './wcc-properties.js';
import { TElementType } from './wcc-sidebar'; import { TElementType } from './wcc-sidebar.js';
import { breakpoints } from '@designestate/dees-domtools'; import { breakpoints } from '@designestate/dees-domtools';
import { WccFrame } from './wcc-frame'; import { WccFrame } from './wcc-frame.js';
@customElement('wcc-dashboard') @customElement('wcc-dashboard')
export class WccDashboard extends LitElement { export class WccDashboard extends DeesElement {
public domtools: plugins.deesDomtools.DomTools;
@property() @property()
public selectedType: TElementType; public selectedType: TElementType;
@ -22,7 +21,7 @@ export class WccDashboard extends LitElement {
public selectedItemName: string; public selectedItemName: string;
@property() @property()
public selectedItem: (() => TemplateResult) | LitElement; public selectedItem: (() => TemplateResult) | DeesElement;
@property() @property()
public selectedViewport: plugins.deesDomtools.breakpoints.TViewport = 'desktop'; public selectedViewport: plugins.deesDomtools.breakpoints.TViewport = 'desktop';
@ -34,7 +33,7 @@ export class WccDashboard extends LitElement {
public pages: { [key: string]: () => TemplateResult } = {}; public pages: { [key: string]: () => TemplateResult } = {};
@property() @property()
public elements: { [key: string]: LitElement } = {}; public elements: { [key: string]: DeesElement } = {};
@property() @property()
public warning: string = null; public warning: string = null;
@ -43,7 +42,7 @@ export class WccDashboard extends LitElement {
public wccFrame: Promise<WccFrame>; public wccFrame: Promise<WccFrame>;
constructor( constructor(
elementsArg?: { [key: string]: LitElement }, elementsArg?: { [key: string]: DeesElement },
pagesArg?: { [key: string]: () => TemplateResult } pagesArg?: { [key: string]: () => TemplateResult }
) { ) {
super(); super();
@ -99,31 +98,6 @@ export class WccDashboard extends LitElement {
}} }}
></wcc-properties> ></wcc-properties>
<wcc-frame id="wccFrame" viewport=${this.selectedViewport}> <wcc-frame id="wccFrame" viewport=${this.selectedViewport}>
${(() => {
if (this.selectedType === 'page' && this.selectedItem) {
if (typeof this.selectedItem === 'function') {
return this.selectedItem();
} else {
console.error('The selected item looks strange:');
console.log(this.selectedItem);
}
} else if (this.selectedType === 'element' && this.selectedItem) {
// console.log(this.selectedItem);
const anonItem: any = this.selectedItem;
if (!anonItem.demo) {
this.setWarning(`component ${anonItem.name} does not expose a demo property.`);
return;
}
if (!(typeof anonItem.demo === 'function')) {
this.setWarning(
`component ${anonItem.name} has demo property, but it is not of type function`
);
return;
}
this.setWarning(null);
return html`${anonItem.demo()}`;
}
})()}
</wcc-frame> </wcc-frame>
`; `;
} }
@ -160,24 +134,39 @@ export class WccDashboard extends LitElement {
); );
} }
private updating = false;
public async updated() { public async updated() {
if (this.updating) {
return;
}
this.domtools = await plugins.deesDomtools.DomTools.setupDomTools(); this.domtools = await plugins.deesDomtools.DomTools.setupDomTools();
await this.domtools.router._handleRouteState(); await this.domtools.router._handleRouteState();
this.updating = true;
const storeElement = this.selectedItem; const storeElement = this.selectedItem;
setTimeout(async () => { const wccFrame: WccFrame = this.shadowRoot.querySelector('wcc-frame');
this.selectedItem = null;
setTimeout(async () => { if (this.selectedType === 'page' && this.selectedItem) {
this.selectedItem = storeElement; if (typeof this.selectedItem === 'function') {
setTimeout(() => { console.log('slotting page.');
this.updating = false; const viewport = await wccFrame.getViewportElement();
}, 0); render(this.selectedItem(), viewport);
}); console.log('rendered page.');
}, 0); } else {
console.error('The selected item looks strange:');
console.log(this.selectedItem);
}
} else if (this.selectedType === 'element' && this.selectedItem) {
console.log('slotting element.');
const anonItem: any = this.selectedItem;
if (!anonItem.demo) {
this.setWarning(`component ${anonItem.name} does not expose a demo property.`);
return;
}
if (!(typeof anonItem.demo === 'function')) {
this.setWarning(
`component ${anonItem.name} has demo property, but it is not of type function`
);
return;
}
this.setWarning(null);
const viewport = await wccFrame.getViewportElement();
render(anonItem.demo(), viewport);;
}
} }
public buildUrl() { public buildUrl() {

View File

@ -1,25 +1,45 @@
import { DeesElement, property, html, customElement, TemplateResult } from '@designestate/dees-element'; import { DeesElement, property, html, customElement, TemplateResult, css, cssManager } from '@designestate/dees-element';
import * as domtools from '@designestate/dees-domtools'; import * as domtools from '@designestate/dees-domtools';
declare global {
interface HTMLElementTagNameMap {
'wcc-frame': WccFrame;
}
}
@customElement('wcc-frame') @customElement('wcc-frame')
export class WccFrame extends DeesElement { export class WccFrame extends DeesElement {
@property() @property()
public viewport: string; public viewport: string;
public render(): TemplateResult { public static styles = [
return html` css`
<style>
:host { :host {
border: 10px solid #ffaeaf; border: 10px solid #ffaeaf;
position: absolute; position: absolute;
background: ${this.goBright ? '#333': '#000'}; background: ${cssManager.bdTheme('#333', '#000')};
left: 200px; left: 200px;
right: 0px; right: 0px;
top: 0px; top: 0px;
bottom: 100px; bottom: 100px;
overflow-y: auto; overflow-y: auto;
overflow-x: auto; overflow-x: auto;
}
.viewport {
container-type: inline-size;
container-name: wccToolsViewport;
position: relative;
min-height: 100%;
}
`,
]
public render(): TemplateResult {
return html`
<style>
:host {
${(() => { ${(() => {
switch (this.viewport) { switch (this.viewport) {
case 'desktop': case 'desktop':
@ -49,15 +69,13 @@ export class WccFrame extends DeesElement {
} }
.viewport { .viewport {
container-type: inline-size;
container-name: wccToolsViewport;
position: relative;
${this.viewport !== 'desktop' ${this.viewport !== 'desktop'
? html` border-right: 1px dotted #444; border-left: 1px dotted #444; ` ? html` border-right: 1px dotted #444; border-left: 1px dotted #444; `
: html``} : html``
min-height: 100%; }
background: background:
${this.goBright ? ` ${
this.goBright ? `
radial-gradient(#CCCCCC 3px, transparent 4px), radial-gradient(#CCCCCC 3px, transparent 4px),
radial-gradient(#CCCCCC 3px, transparent 4px), radial-gradient(#CCCCCC 3px, transparent 4px),
linear-gradient(#eeeeee 4px, transparent 0), linear-gradient(#eeeeee 4px, transparent 0),
@ -75,11 +93,12 @@ export class WccFrame extends DeesElement {
#222222; #222222;
background-size: 109px 109px, 109px 109px,100% 6px, 109px 109px, 109px 109px; background-size: 109px 109px, 109px 109px,100% 6px, 109px 109px, 109px 109px;
background-position: 54px 55px, 0px 0px, 0px 0px, 0px 0px, 0px 0px; background-position: 54px 55px, 0px 0px, 0px 0px, 0px 0px, 0px 0px;
`} `
}
} }
</style> </style>
<div class="viewport"> <div class="viewport">
<slot></slot>
</div> </div>
`; `;
} }
@ -89,4 +108,8 @@ export class WccFrame extends DeesElement {
const slottedContent = this.children; const slottedContent = this.children;
console.log(slottedContent); console.log(slottedContent);
} }
public async getViewportElement(): Promise<HTMLElement> {
return this.shadowRoot.querySelector('.viewport') as HTMLElement;
}
} }

View File

@ -1,5 +1,5 @@
import { LitElement, property, html, customElement, TemplateResult, state } from 'lit-element'; import { DeesElement, property, html, customElement, TemplateResult, state } from '@designestate/dees-element';
import { WccDashboard } from './wcc-dashboard'; import { WccDashboard } from './wcc-dashboard.js';
export type TPropertyType = 'String' | 'Number' | 'Boolean' | 'Object' | 'Enum' | 'Array'; export type TPropertyType = 'String' | 'Number' | 'Boolean' | 'Object' | 'Enum' | 'Array';
@ -13,12 +13,14 @@ export const setEnvironment = (envArg) => {
}; };
@customElement('wcc-properties') @customElement('wcc-properties')
export class WccProperties extends LitElement { export class WccProperties extends DeesElement {
@property() @property({
dashboardRef: WccDashboard; type: WccDashboard
})
public dashboardRef: WccDashboard;
@property() @property()
public selectedItem: (() => TemplateResult) | LitElement; public selectedItem: (() => TemplateResult) | DeesElement;
@property() @property()
public selectedViewport: TEnvironment = 'native'; public selectedViewport: TEnvironment = 'native';
@ -130,13 +132,14 @@ export class WccProperties extends LitElement {
.warning { .warning {
position: absolute; position: absolute;
background: #800000; background: #222;
color: #CCC;
top: 0px; top: 0px;
bottom: 0px; bottom: 0px;
left: 0px; left: 0px;
right: 0px; right: 520px;
text-align: center; text-align: center;
padding: 20px; padding: 35px;
font-size: 25px; font-size: 25px;
} }
</style> </style>
@ -240,7 +243,7 @@ export class WccProperties extends LitElement {
}); });
return enumValues; return enumValues;
}; };
const determinePropertyType = (propertyArg: any): TPropertyType => { const determinePropertyType = async (propertyArg: any): Promise<TPropertyType> => {
const typeName: any | undefined = propertyArg.type.name; const typeName: any | undefined = propertyArg.type.name;
if (typeName) { if (typeName) {
return typeName; return typeName;
@ -256,25 +259,35 @@ export class WccProperties extends LitElement {
console.log(`Got Dees-Element for property evaluation.`); console.log(`Got Dees-Element for property evaluation.`);
const anonItem: any = this.selectedItem; const anonItem: any = this.selectedItem;
if (!anonItem) { if (!anonItem) {
this.warning = 'no element selected';
return; return;
} }
console.log(anonItem.elementProperties); console.log(anonItem.elementProperties);
const wccFrame = await this.dashboardRef.wccFrame; const wccFrame = await this.dashboardRef.wccFrame;
let selectedElement: HTMLElement; let firstFoundInstantiatedElement: HTMLElement;
for (const element of Array.from(wccFrame.children)) { for (const element of Array.from((await wccFrame.getViewportElement()).children)) {
if (element instanceof (this.selectedItem as any)) { if (element instanceof (this.selectedItem as any)) {
selectedElement = element as HTMLElement; firstFoundInstantiatedElement = element as HTMLElement;
break; break;
} }
} }
if (!firstFoundInstantiatedElement) {
this.warning = `no first instantiated element found for >>${anonItem.name}<<`;
return;
}
const classProperties: Map<string, any> = anonItem.elementProperties; const classProperties: Map<string, any> = anonItem.elementProperties;
if (!classProperties) {
this.warning = `selected element >>${anonItem.name}<< does not expose element properties`;
return;
}
this.warning = null;
const propertyArray: TemplateResult[] = []; const propertyArray: TemplateResult[] = [];
for (const key of classProperties.keys()) { for (const key of classProperties.keys()) {
if (key === 'goBright' || key === 'domtools') { if (key === 'goBright' || key === 'domtools') {
continue; continue;
} }
const property = classProperties.get(key); const property = classProperties.get(key);
const propertyTypeString = determinePropertyType(property); const propertyTypeString = await determinePropertyType(property);
propertyArray.push( propertyArray.push(
html` html`
<div class="property"> <div class="property">
@ -284,38 +297,38 @@ export class WccProperties extends LitElement {
case 'Boolean': case 'Boolean':
return html`<input return html`<input
type="checkbox" type="checkbox"
?checked=${selectedElement[key]} ?checked=${firstFoundInstantiatedElement[key]}
@input="${(eventArg: any) => { @input="${(eventArg: any) => {
selectedElement[key] = eventArg.target.checked; firstFoundInstantiatedElement[key] = eventArg.target.checked;
}}" }}"
/>`; />`;
case 'String': case 'String':
return html`<input return html`<input
type="text" type="text"
value=${selectedElement[key]} value=${firstFoundInstantiatedElement[key]}
@input="${(eventArg: any) => { @input="${(eventArg: any) => {
selectedElement[key] = eventArg.target.value; firstFoundInstantiatedElement[key] = eventArg.target.value;
}}" }}"
/>`; />`;
case 'Number': case 'Number':
return html`<input return html`<input
type="number" type="number"
value=${selectedElement[key]} value=${firstFoundInstantiatedElement[key]}
@input="${(eventArg: any) => { @input="${(eventArg: any) => {
selectedElement[key] = eventArg.target.value; firstFoundInstantiatedElement[key] = eventArg.target.value;
}}" }}"
/>`; />`;
case 'Enum': case 'Enum':
const enumValues: any[] = getEnumValues(property); const enumValues: any[] = getEnumValues(property);
return html`<select return html`<select
@change="${(eventArg: any) => { @change="${(eventArg: any) => {
selectedElement[key] = eventArg.target.value; firstFoundInstantiatedElement[key] = eventArg.target.value;
}}" }}"
> >
${enumValues.map((valueArg) => { ${enumValues.map((valueArg) => {
return html` return html`
<option <option
?selected=${valueArg === selectedElement[key] ? true : false} ?selected=${valueArg === firstFoundInstantiatedElement[key] ? true : false}
name="${valueArg}" name="${valueArg}"
> >
${valueArg} ${valueArg}
@ -331,7 +344,8 @@ export class WccProperties extends LitElement {
} }
this.propertyContent = propertyArray; this.propertyContent = propertyArray;
} else { } else {
console.log(`Cannot extract properties of ${(this.selectedItem as any)?.name}`) console.log(`Cannot extract properties of ${(this.selectedItem as any)?.name}`);
this.warning = `You selected a page.`;
return null; return null;
} }
} }
@ -347,9 +361,9 @@ export class WccProperties extends LitElement {
this.dashboardRef.buildUrl(); this.dashboardRef.buildUrl();
} }
public async performUpdate() { public async scheduleUpdate() {
await this.createProperties(); await this.createProperties();
super.performUpdate(); super.scheduleUpdate();
} }
public selectViewport(viewport: TEnvironment) { public selectViewport(viewport: TEnvironment) {

View File

@ -1,16 +1,16 @@
import * as plugins from '../wcctools.plugins'; import * as plugins from '../wcctools.plugins.js';
import { LitElement, property, html, customElement, TemplateResult } from 'lit-element'; import { DeesElement, property, html, customElement, TemplateResult } from '@designestate/dees-element';
import { WccDashboard } from './wcc-dashboard'; import { WccDashboard } from './wcc-dashboard.js';
export type TElementType = 'element' | 'page'; export type TElementType = 'element' | 'page';
@customElement('wcc-sidebar') @customElement('wcc-sidebar')
export class WccSidebar extends LitElement { export class WccSidebar extends DeesElement {
@property({type: Array}) @property({type: Array})
public websites: string[] = []; public websites: string[] = [];
@property({ attribute: false }) @property({ attribute: false })
public selectedItem: LitElement | (() => TemplateResult); public selectedItem: DeesElement | (() => TemplateResult);
@property({ attribute: false }) @property({ attribute: false })
public selectedType: TElementType; public selectedType: TElementType;
@ -150,7 +150,7 @@ export class WccSidebar extends LitElement {
`; `;
} }
public selectItem(typeArg: TElementType, itemNameArg: string, itemArg: (() => TemplateResult) | LitElement) { public selectItem(typeArg: TElementType, itemNameArg: string, itemArg: (() => TemplateResult) | DeesElement) {
console.log('selected item'); console.log('selected item');
console.log(itemNameArg); console.log(itemNameArg);
console.log(itemArg); console.log(itemArg);

View File

@ -1,4 +1,4 @@
import { WccDashboard } from './elements/wcc-dashboard'; import { WccDashboard } from './elements/wcc-dashboard.js';
import { LitElement, TemplateResult } from 'lit-element'; import { LitElement, TemplateResult } from 'lit-element';
const setupWccTools = (elementsArg?: { [key: string]: LitElement }, pagesArg?: { [key: string]: () => TemplateResult }) => { const setupWccTools = (elementsArg?: { [key: string]: LitElement }, pagesArg?: { [key: string]: () => TemplateResult }) => {

View File

@ -1,16 +0,0 @@
{
"compilerOptions": {
"target": "es2017",
"module": "es2015",
"moduleResolution": "node",
"lib": ["es2017", "dom"],
"declaration": true,
"inlineSources": true,
"inlineSourceMap": true,
"noUnusedLocals": true,
"noFallthroughCasesInSwitch": true,
"outDir": "dist/",
"skipLibCheck": true,
"experimentalDecorators": true
}
}

View File

@ -1,7 +1,9 @@
{ {
"compilerOptions": { "compilerOptions": {
"experimentalDecorators": true, "experimentalDecorators": true,
"target": "ES2017", "useDefineForClassFields": false,
"moduleResolution": "Node" "target": "ES2022",
"module": "ES2022",
"moduleResolution": "nodenext"
} }
} }