1.1.0

changelog.md

@@ -1,5 +1,23 @@
 # Changelog
 
+## 2024-06-27 - 1.1.0 - feat(elements)
+Add performance improvements to uptimelink-webwidget
+
+- Added 'will-change: transform' to improve performance of the transform property
+- Increased transition speed for element opacity from 0.2s to 0.1s for faster visual feedback
+- Added scale transformation effect to the focused state of the widget
+
+## 2024-06-27 - 1.0.82 - fix(core)
+No code changes detected. Preparing for version increment based on package state.
+
+
+## 2024-06-26 - 1.0.81 - fix(core)
+Updated dependencies and improved code documentation.
+
+- Updated internal dependencies to newer versions.
+- Improved code documentation within TypeScript files.
+- Adjusted scripts in package.json for better build performance.
+
 ## 2024-06-26 - 1.0.80 - fix(documentation)
 Update package description and README for clarity
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uptime.link/webwidget",
-  "version": "1.0.80",
+  "version": "1.1.0",
   "private": false,
   "description": "The web widget for public use of uptimelink, allowing users to monitor uptime status through a user-friendly interface.",
   "main": "dist_ts_web/index.js",

ts_web/00_commitinfo_data.ts

@@ -3,6 +3,6 @@
  */
 export const commitinfo = {
   name: '@uptime.link/webwidget',
-  version: '1.0.80',
+  version: '1.1.0',
   description: 'The web widget for public use of uptimelink, allowing users to monitor uptime status through a user-friendly interface.'
 }

ts_web/elements/uptimelink-webwidget.ts

@@ -67,6 +67,7 @@ export class UptimelinkWebwidget extends DeesElement {
           cursor: pointer;
           transition: all 0.2s;
           overflow: hidden;
+          will-change: transform;
         }
 
         .firstLine {
@@ -77,6 +78,7 @@ export class UptimelinkWebwidget extends DeesElement {
         .mainbox.focused {
           width: 182px;
           height: 117px;
+          transform: scale(1.1, 1.1);
         }
 
         .statusindicator {
@@ -91,7 +93,7 @@ export class UptimelinkWebwidget extends DeesElement {
 
         .expanded {
           opacity: 0;
-          transition: opacity 0.2s;
+          transition: opacity 0.1s;
         }
 
         .miniHeading {
@@ -199,7 +201,7 @@ export class UptimelinkWebwidget extends DeesElement {
       }
       this.showExpanded = true;
       await this.performUpdate();
-      await (await this.domtoolsPromise).convenience.smartdelay.delayFor(50);
+      await domtools.convenience.smartdelay.delayFor(0);
       const expandedDiv = this.shadowRoot.querySelector('.expanded') as HTMLElement;
       expandedDiv.style.opacity = '1';
     };