release(toolbar): v0.5.7

index.json

@@ -352,7 +352,7 @@
   },
   "toolbar": {
     "react": true,
-    "version": "0.5.6",
+    "version": "0.5.7",
     "style": true,
     "icon": false,
     "test": true,

src/toolbar/index.ts

@@ -253,6 +253,7 @@ export type IButtonState = '' | 'hover' | 'active'
 
 export class LunaToolbarButton extends LunaToolbarItem {
   private $button: $.$
+  private handler: types.AnyFn
   constructor(
     toolbar: Toolbar,
     content: string | HTMLElement,
@@ -266,6 +267,7 @@ export class LunaToolbarButton extends LunaToolbarItem {
     const $button = this.$container.find('button')
     $button.append(content)
     $button.on('click', handler)
+    this.handler = handler
     this.$button = $button
 
     this.setState(state)
@@ -277,6 +279,13 @@ export class LunaToolbarButton extends LunaToolbarItem {
       $button.addClass(this.toolbar.c(state))
     }
   }
+  setHandler(handler: types.AnyFn) {
+    const { $button } = this
+
+    $button.off('click', this.handler)
+    $button.on('click', handler)
+    this.handler = handler
+  }
 }
 
 export class LunaToolbarHtml extends LunaToolbarItem {

src/toolbar/package.json

@@ -1,6 +1,6 @@
 {
   "name": "toolbar",
-  "version": "0.5.6",
+  "version": "0.5.7",
   "description": "Application toolbar",
   "luna": {
     "react": true

src/toolbar/react.tsx

@@ -116,6 +116,12 @@ export const LunaToolbarButton: FC<PropsWithChildren<IToolbarButtonProps>> = (
     }
   }, [props.state])
 
+  useEffect(() => {
+    if (toolbarButton.current && props.onClick) {
+      toolbarButton.current.setHandler(props.onClick)
+    }
+  }, [props.onClick])
+
   useEffect(
     () => setDisabled(toolbarButton.current, props.disabled),
     [props.disabled]