fix: remove applySmooth in button to fix display issue when used in R…

…ow or Column. Add gaurds around withThemeStyles for firstEnable

packages/@lightningjs/ui-components/src/components/Button/Button.js

@@ -233,7 +233,7 @@ export default class Button extends Surface {
     }
 
     if (Object.keys(contentDimensionsPatch).length > 0) {
-      this.applySmooth(this._Content, contentDimensionsPatch);
+      this._Content.patch(contentDimensionsPatch);
     }
   }
 

packages/@lightningjs/ui-components/src/components/Keyboard/__snapshots__/Keyboard.test.js.snap

@@ -8810,7 +8810,7 @@ exports[`Keyboard renders 1`] = `
                           "visible": true,
                           "w": 0,
                           "x": 35,
-                          "y": [Function],
+                          "y": 45,
                           "zIndex": 2,
                         },
                       },
@@ -11871,7 +11871,7 @@ exports[`KeyboardInput renders 1`] = `
                   "visible": true,
                   "w": 0,
                   "x": 30,
-                  "y": [Function],
+                  "y": 0,
                   "zIndex": 2,
                 },
                 "Eyebrow": {

packages/@lightningjs/ui-components/src/mixins/withThemeStyles/index.js

@@ -50,6 +50,11 @@ export default function withThemeStyles(Base, mixinStyle = {}) {
         this._updatePropDefaults();
         this.queueThemeUpdate();
       });
+
+      this._whenEnabled = new Promise(resolve => {
+        this._whenEnabledResolver = resolve;
+      });
+
       this._withThemeStylesSetupComplete = true;
     }
 
@@ -70,6 +75,14 @@ export default function withThemeStyles(Base, mixinStyle = {}) {
       }
     }
 
+    _firstEnable() {
+      this._readyForUpdates = true;
+      this._whenEnabledResolver();
+      updateManager.deleteRequestUpdate(this);
+      this.queueThemeUpdate();
+      super._firstEnable && super._firstEnable();
+    }
+
     _updatePropDefaults() {
       // Add support for properties passed through the theme
       const componentConfigProps = this._styleManager.props || {};
@@ -168,13 +181,15 @@ export default function withThemeStyles(Base, mixinStyle = {}) {
      * @returns {void}
      */
     _updateThemeComponent() {
-      if (!this.style) return;
-      if (!this._isAttached()) return;
-      this._checkDimensionUpdates();
-      this.queueRequestUpdate
-        ? this.queueRequestUpdate()
-        : this._update && this._update();
-      this._updateItemLayout && this._updateItemLayout();
+      if (this._readyForUpdates) {
+        if (!this.style) return;
+        if (!this._isAttached()) return;
+        this._checkDimensionUpdates();
+        this.queueRequestUpdate
+          ? this.queueRequestUpdate()
+          : this._update && this._update();
+        this._updateItemLayout && this._updateItemLayout();
+      }
     }
 
     /**