@design.estate/dees-wcctools 1.0.97 → 1.0.99
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist_bundle/bundle.js +86 -10
- package/dist_bundle/bundle.js.map +2 -2
- package/dist_ts_web/00_commitinfo_data.d.ts +1 -1
- package/dist_ts_web/00_commitinfo_data.js +2 -2
- package/dist_ts_web/elements/wcc-dashboard.d.ts +7 -0
- package/dist_ts_web/elements/wcc-dashboard.js +91 -3
- package/dist_ts_web/elements/wcc-properties.js +8 -8
- package/dist_watch/bundle.js +6 -6
- package/dist_watch/bundle.js.map +2 -2
- package/package.json +1 -1
- package/readme.hints.md +5 -3
- package/readme.plan.md +13 -1
- package/ts_web/00_commitinfo_data.ts +2 -2
- package/ts_web/elements/wcc-dashboard.ts +108 -4
- package/ts_web/elements/wcc-properties.ts +7 -7
package/dist_bundle/bundle.js
CHANGED
|
@@ -43406,7 +43406,7 @@ var WccProperties = class extends DeesElement {
|
|
|
43406
43406
|
}
|
|
43407
43407
|
console.log(anonItem.elementProperties);
|
|
43408
43408
|
const wccFrame = await this.dashboardRef.wccFrame;
|
|
43409
|
-
await new Promise((resolve2) => setTimeout(resolve2,
|
|
43409
|
+
await new Promise((resolve2) => setTimeout(resolve2, 200));
|
|
43410
43410
|
const viewport = await wccFrame.getViewportElement();
|
|
43411
43411
|
let firstFoundInstantiatedElement = await this.findElementRecursively(
|
|
43412
43412
|
viewport,
|
|
@@ -43461,7 +43461,7 @@ var WccProperties = class extends DeesElement {
|
|
|
43461
43461
|
case "String":
|
|
43462
43462
|
return x`<input
|
|
43463
43463
|
type="text"
|
|
43464
|
-
value=${firstFoundInstantiatedElement[key2]}
|
|
43464
|
+
.value=${firstFoundInstantiatedElement[key2] || ""}
|
|
43465
43465
|
@input="${(eventArg) => {
|
|
43466
43466
|
firstFoundInstantiatedElement[key2] = eventArg.target.value;
|
|
43467
43467
|
}}"
|
|
@@ -43469,14 +43469,15 @@ var WccProperties = class extends DeesElement {
|
|
|
43469
43469
|
case "Number":
|
|
43470
43470
|
return x`<input
|
|
43471
43471
|
type="number"
|
|
43472
|
-
value=${firstFoundInstantiatedElement[key2]}
|
|
43472
|
+
.value=${firstFoundInstantiatedElement[key2] ?? ""}
|
|
43473
43473
|
@input="${(eventArg) => {
|
|
43474
|
-
firstFoundInstantiatedElement[key2] = eventArg.target.value;
|
|
43474
|
+
firstFoundInstantiatedElement[key2] = parseFloat(eventArg.target.value) || 0;
|
|
43475
43475
|
}}"
|
|
43476
43476
|
/>`;
|
|
43477
43477
|
case "Enum":
|
|
43478
43478
|
const enumValues = getEnumValues(property);
|
|
43479
43479
|
return x`<select
|
|
43480
|
+
.value=${firstFoundInstantiatedElement[key2] || ""}
|
|
43480
43481
|
@change="${(eventArg) => {
|
|
43481
43482
|
firstFoundInstantiatedElement[key2] = eventArg.target.value;
|
|
43482
43483
|
}}"
|
|
@@ -43484,8 +43485,7 @@ var WccProperties = class extends DeesElement {
|
|
|
43484
43485
|
${enumValues.map((valueArg) => {
|
|
43485
43486
|
return x`
|
|
43486
43487
|
<option
|
|
43487
|
-
|
|
43488
|
-
name="${valueArg}"
|
|
43488
|
+
value="${valueArg}"
|
|
43489
43489
|
>
|
|
43490
43490
|
${valueArg}
|
|
43491
43491
|
</option>
|
|
@@ -43571,6 +43571,8 @@ var WccDashboard2 = class extends DeesElement {
|
|
|
43571
43571
|
this.pages = {};
|
|
43572
43572
|
this.elements = {};
|
|
43573
43573
|
this.warning = null;
|
|
43574
|
+
this.frameScrollY = 0;
|
|
43575
|
+
this.sidebarScrollY = 0;
|
|
43574
43576
|
if (elementsArg) {
|
|
43575
43577
|
this.elements = elementsArg;
|
|
43576
43578
|
console.log("got elements:");
|
|
@@ -43634,6 +43636,9 @@ var WccDashboard2 = class extends DeesElement {
|
|
|
43634
43636
|
}
|
|
43635
43637
|
async firstUpdated() {
|
|
43636
43638
|
this.domtools = await dist_ts_exports27.DomTools.setupDomTools();
|
|
43639
|
+
setTimeout(() => {
|
|
43640
|
+
this.setupScrollListeners();
|
|
43641
|
+
}, 500);
|
|
43637
43642
|
this.domtools.router.on(
|
|
43638
43643
|
"/wcctools-route/:itemType/:itemName/:viewport/:theme",
|
|
43639
43644
|
async (routeInfo) => {
|
|
@@ -43646,6 +43651,19 @@ var WccDashboard2 = class extends DeesElement {
|
|
|
43646
43651
|
} else if (routeInfo.params.itemType === "page") {
|
|
43647
43652
|
this.selectedItem = this.pages[routeInfo.params.itemName];
|
|
43648
43653
|
}
|
|
43654
|
+
if (routeInfo.queryParams) {
|
|
43655
|
+
const frameScrollY = routeInfo.queryParams.frameScrollY;
|
|
43656
|
+
const sidebarScrollY = routeInfo.queryParams.sidebarScrollY;
|
|
43657
|
+
if (frameScrollY) {
|
|
43658
|
+
this.frameScrollY = parseInt(frameScrollY);
|
|
43659
|
+
}
|
|
43660
|
+
if (sidebarScrollY) {
|
|
43661
|
+
this.sidebarScrollY = parseInt(sidebarScrollY);
|
|
43662
|
+
}
|
|
43663
|
+
setTimeout(() => {
|
|
43664
|
+
this.applyScrollPositions();
|
|
43665
|
+
}, 100);
|
|
43666
|
+
}
|
|
43649
43667
|
const domtoolsInstance = await dist_ts_exports27.elementBasic.setup();
|
|
43650
43668
|
this.selectedTheme === "bright" ? domtoolsInstance.themeManager.goBright() : domtoolsInstance.themeManager.goDark();
|
|
43651
43669
|
}
|
|
@@ -43654,7 +43672,6 @@ var WccDashboard2 = class extends DeesElement {
|
|
|
43654
43672
|
async updated(changedPropertiesArg) {
|
|
43655
43673
|
this.domtools = await dist_ts_exports27.DomTools.setupDomTools();
|
|
43656
43674
|
await this.domtools.router._handleRouteState();
|
|
43657
|
-
const storeElement = this.selectedItem;
|
|
43658
43675
|
const wccFrame = this.shadowRoot.querySelector("wcc-frame");
|
|
43659
43676
|
if (changedPropertiesArg.has("selectedItemName")) {
|
|
43660
43677
|
document.title = this.selectedItemName;
|
|
@@ -43690,9 +43707,62 @@ var WccDashboard2 = class extends DeesElement {
|
|
|
43690
43707
|
}
|
|
43691
43708
|
}
|
|
43692
43709
|
buildUrl() {
|
|
43693
|
-
this.
|
|
43694
|
-
|
|
43695
|
-
)
|
|
43710
|
+
const baseUrl = `/wcctools-route/${this.selectedType}/${this.selectedItemName}/${this.selectedViewport}/${this.selectedTheme}`;
|
|
43711
|
+
const queryParams = new URLSearchParams();
|
|
43712
|
+
if (this.frameScrollY > 0) {
|
|
43713
|
+
queryParams.set("frameScrollY", this.frameScrollY.toString());
|
|
43714
|
+
}
|
|
43715
|
+
if (this.sidebarScrollY > 0) {
|
|
43716
|
+
queryParams.set("sidebarScrollY", this.sidebarScrollY.toString());
|
|
43717
|
+
}
|
|
43718
|
+
const queryString = queryParams.toString();
|
|
43719
|
+
const fullUrl = queryString ? `${baseUrl}?${queryString}` : baseUrl;
|
|
43720
|
+
this.domtools.router.pushUrl(fullUrl);
|
|
43721
|
+
}
|
|
43722
|
+
async setupScrollListeners() {
|
|
43723
|
+
const wccFrame = await this.wccFrame;
|
|
43724
|
+
const wccSidebar = this.shadowRoot.querySelector("wcc-sidebar");
|
|
43725
|
+
if (wccFrame) {
|
|
43726
|
+
wccFrame.addEventListener("scroll", () => {
|
|
43727
|
+
this.frameScrollY = wccFrame.scrollTop;
|
|
43728
|
+
this.debouncedScrollUpdate();
|
|
43729
|
+
});
|
|
43730
|
+
}
|
|
43731
|
+
if (wccSidebar) {
|
|
43732
|
+
wccSidebar.addEventListener("scroll", () => {
|
|
43733
|
+
this.sidebarScrollY = wccSidebar.scrollTop;
|
|
43734
|
+
this.debouncedScrollUpdate();
|
|
43735
|
+
});
|
|
43736
|
+
}
|
|
43737
|
+
}
|
|
43738
|
+
debouncedScrollUpdate() {
|
|
43739
|
+
clearTimeout(this.scrollUpdateTimeout);
|
|
43740
|
+
this.scrollUpdateTimeout = setTimeout(() => {
|
|
43741
|
+
this.updateUrlWithScrollState();
|
|
43742
|
+
}, 300);
|
|
43743
|
+
}
|
|
43744
|
+
updateUrlWithScrollState() {
|
|
43745
|
+
const baseUrl = `/wcctools-route/${this.selectedType}/${this.selectedItemName}/${this.selectedViewport}/${this.selectedTheme}`;
|
|
43746
|
+
const queryParams = new URLSearchParams();
|
|
43747
|
+
if (this.frameScrollY > 0) {
|
|
43748
|
+
queryParams.set("frameScrollY", this.frameScrollY.toString());
|
|
43749
|
+
}
|
|
43750
|
+
if (this.sidebarScrollY > 0) {
|
|
43751
|
+
queryParams.set("sidebarScrollY", this.sidebarScrollY.toString());
|
|
43752
|
+
}
|
|
43753
|
+
const queryString = queryParams.toString();
|
|
43754
|
+
const fullUrl = queryString ? `${baseUrl}?${queryString}` : baseUrl;
|
|
43755
|
+
window.history.replaceState(null, "", fullUrl);
|
|
43756
|
+
}
|
|
43757
|
+
async applyScrollPositions() {
|
|
43758
|
+
const wccFrame = await this.wccFrame;
|
|
43759
|
+
const wccSidebar = this.shadowRoot.querySelector("wcc-sidebar");
|
|
43760
|
+
if (wccFrame && this.frameScrollY > 0) {
|
|
43761
|
+
wccFrame.scrollTop = this.frameScrollY;
|
|
43762
|
+
}
|
|
43763
|
+
if (wccSidebar && this.sidebarScrollY > 0) {
|
|
43764
|
+
wccSidebar.scrollTop = this.sidebarScrollY;
|
|
43765
|
+
}
|
|
43696
43766
|
}
|
|
43697
43767
|
};
|
|
43698
43768
|
__decorateClass([
|
|
@@ -43719,6 +43789,12 @@ __decorateClass([
|
|
|
43719
43789
|
__decorateClass([
|
|
43720
43790
|
n4()
|
|
43721
43791
|
], WccDashboard2.prototype, "warning", 2);
|
|
43792
|
+
__decorateClass([
|
|
43793
|
+
n4()
|
|
43794
|
+
], WccDashboard2.prototype, "frameScrollY", 2);
|
|
43795
|
+
__decorateClass([
|
|
43796
|
+
n4()
|
|
43797
|
+
], WccDashboard2.prototype, "sidebarScrollY", 2);
|
|
43722
43798
|
__decorateClass([
|
|
43723
43799
|
r6("wcc-frame")
|
|
43724
43800
|
], WccDashboard2.prototype, "wccFrame", 2);
|