Skip to content

Commit cbfb05e

Browse files
author
Marko Petzold
committed
chore: update package dependencies and scripts
- Updated dependencies in package.json: - lit from ^3.1.0 to ^3.3.0 - @custom-elements-manifest/analyzer from ^0.9.0 to ^0.10.4 - @rollup/plugin-commonjs from ^25.0.7 to ^28.0.6 - @rollup/plugin-node-resolve from ^15.2.3 to ^16.0.1 - @rollup/plugin-replace from ^5.0.5 to ^6.0.2 - @rollup/plugin-typescript from ^11.1.5 to ^12.1.3 - @web/dev-server from ^0.4.0 to ^0.4.6 - concurrently from ^8.2.2 to ^9.1.2 - json-schema-to-typescript from ^13.1.1 to ^15.0.4 - tslib from ^2.6.2 to ^2.8.1 - typescript from ^5.2.2 to ^5.8.3 - Modified scripts: - Changed "start" script to run concurrently with "watch" and "wds" - Added "watch" script for rollup - Updated "release" script to include build and types generation refactor: enhance definition schema types - Added interfaces for FontColor and BackgroundColor to improve type definitions. - Updated existing type definitions to include semicolons for consistency. feat: implement theme support in WidgetTextbox - Added theme property to WidgetTextbox class. - Implemented dynamic theme color updates in the update lifecycle method. - Updated render method to apply theme colors to title, subtitle, and body elements.
1 parent 7041ce7 commit cbfb05e

File tree

7 files changed

+1063
-633
lines changed

7 files changed

+1063
-633
lines changed

‎demo/index.html‎

Lines changed: 22 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -2,44 +2,51 @@
22
<html lang="en-GB">
33
<head>
44
<meta charset="utf-8" />
5-
<title>Textbox</title>
5+
<title>Gauge</title>
66
<style>
77
html,
88
body {
99
margin: 0;
1010
padding: 0;
1111
width: 100%;
1212
height: 100%;
13+
background-color: aliceblue;
1314
}
15+
1416
* {
1517
width: 100%;
1618
height: 100%;
1719
}
1820
</style>
1921
</head>
22+
2023
<body>
2124
<div id="demo"></div>
22-
2325
<script src="https://storage.googleapis.com/reswarm-images/ObjectRandomizer.js"></script>
2426

2527
<script type="module">
2628
import { html, render } from 'lit'
27-
import '../dist/src/widget-textbox.js'
28-
const response = await fetch('../src/default-data.json')
29-
const data = await response.json()
30-
29+
import '../dist/widget-textbox.js'
30+
const data = await fetch('../src/default-data.json').then((res) => res.json())
31+
const themeObject = await fetch('themes/vintage.json').then((res) => res.json())
32+
const theme = { theme_name: 'vintage', theme_object: themeObject }
33+
render(
34+
html`
35+
<widget-textbox-1.1.2 .theme="${theme}" .inputData=${data}>
36+
web component is not registered. Make sure to use the tag with the correct version
37+
string from the package.json
38+
</widget-textbox-1.1.2>
39+
`,
40+
document.getElementById('demo')
41+
)
42+
const widget = document.getElementById('demo').children[0]
3143
const keyPathsToRandomize = ['title.text', 'subTitle.fontWeight']
32-
setInterval(() => {
44+
const inter = setInterval(() => {
3345
const randomizedObj = randomizeObjectValues(data, keyPathsToRandomize)
3446

35-
render(
36-
html`
37-
<widget-textbox-versionplaceholder .inputData=${randomizedObj}>
38-
some light-dom
39-
</widget-textbox-versionplaceholder>
40-
`,
41-
document.querySelector('#demo')
42-
)
47+
// console.log('random', randomizedObj.dataseries[0].data[0])
48+
widget.inputData = randomizedObj
49+
// clearInterval(inter)
4350
}, 1000)
4451
</script>
4552
</body>

0 commit comments

Comments
 (0)