release: WRNexusJS 0.6.0

packages/ui/components/Drawer.wrn

@@ -1,63 +1,65 @@
 component Drawer {
-  props {
-    @event open = function
-    @event close = function
-    @event cancel = function
+  outputs {
+    open(payload: { placement: string; sourceEvent: Event })
+    close(payload: { reason: string; placement: string; sourceEvent: Event })
+    cancel(payload: { placement: string; sourceEvent: Event })
+  }
 
-    open = false
-    defaultOpen = false
-    placement = "right"
-    size = "md"
-    color = "primary"
-    variant = "default"
-    title = "Drawer"
-    description = ""
-    icon = ""
-    label = "Drawer"
-    closeLabel = "Close drawer"
-    showClose = true
-    closeOnBackdrop = true
-    closeOnEscape = true
-    overlay = true
-    scrollable = true
-    triggerLabel = ""
-    triggerIcon = ""
-    class = ""
+  props {
+open: boolean = false
+    defaultOpen: boolean = false
+    placement: string = "right"
+    size: string = "md"
+    color: string = "primary"
+    variant: string = "default"
+    title: string = "Drawer"
+    description: string = ""
+    icon: string = ""
+    label: string = "Drawer"
+    closeLabel: string = "Close drawer"
+    showClose: boolean = true
+    closeOnBackdrop: boolean = true
+    closeOnEscape: boolean = true
+    overlay: boolean = true
+    scrollable: boolean = true
+    triggerLabel: string = ""
+    triggerIcon: string = ""
+    class: string = ""
   }
 
   state visible = defaultOpen
 
   functions {
-    function isOpen() {
+    shared function isOpen() {
       return open || visible
     }
 
-    function showDrawer(sourceEvent) {
+    client function showDrawer(sourceEvent) {
       visible = true
-      $emit("open", {
+      output.open({
         placement: placement,
         sourceEvent: sourceEvent
       })
     }
 
-    function hideDrawer(reason, sourceEvent) {
+    client function hideDrawer(reason, sourceEvent) {
       visible = false
-      $emit("close", {
+      output.close({
         reason: reason,
         placement: placement,
         sourceEvent: sourceEvent
       })
     }
 
-    function cancelDrawer(sourceEvent) {
-      $emit("cancel", {
+    client function cancelDrawer(sourceEvent) {
+      output.cancel({
         placement: placement,
         sourceEvent: sourceEvent
       })
       hideDrawer("cancel", sourceEvent)
     }
 
-    function handleKeydown(sourceEvent) {
+    client function handleKeydown(sourceEvent) {
       if (closeOnEscape && sourceEvent.key === "Escape") {
         sourceEvent.preventDefault()
         cancelDrawer(sourceEvent)