Compare commits

...

18 Commits

Author SHA1 Message Date
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
14 changed files with 6811 additions and 16039 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"

22672
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.63", "version": "1.0.72",
"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.1",
"@designestate/dees-element": "^1.0.26", "@designestate/dees-element": "^2.0.4",
"@gitzone/tsrun": "^1.2.18", "@gitzone/tsrun": "^1.2.31",
"@pushrocks/smartdelay": "^2.0.13", "@pushrocks/smartdelay": "^2.0.13",
"@pushrocks/smartexpress": "^3.0.108", "@pushrocks/smartexpress": "^4.0.0"
"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.60",
"@gitzone/tsbundle": "^1.0.88", "@gitzone/tsbundle": "^1.0.101",
"@gitzone/tswatch": "^1.0.56", "@gitzone/tswatch": "^1.0.73",
"@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 } 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();
@ -100,8 +99,10 @@ export class WccDashboard extends LitElement {
></wcc-properties> ></wcc-properties>
<wcc-frame id="wccFrame" viewport=${this.selectedViewport}> <wcc-frame id="wccFrame" viewport=${this.selectedViewport}>
${(() => { ${(() => {
console.log('jojo');
if (this.selectedType === 'page' && this.selectedItem) { if (this.selectedType === 'page' && this.selectedItem) {
if (typeof this.selectedItem === 'function') { if (typeof this.selectedItem === 'function') {
console.log('jojo page')
return this.selectedItem(); return this.selectedItem();
} else { } else {
console.error('The selected item looks strange:'); console.error('The selected item looks strange:');

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>
@ -256,21 +259,28 @@ 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(wccFrame.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;
} }
} }
const classProperties: Map<string, any> = anonItem.elementProperties; if (!firstFoundInstantiatedElement) {
if (!classProperties) { this.warning = `no first instantiated element found for >>${anonItem.name}<<`;
return; return;
} }
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') {
@ -287,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}
@ -334,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;
} }
} }
@ -350,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 }) => {