Merge pull request #1074 from fabulous-dev/component-binding

Add support for Binding in Components

src/Fabulous/Binding.fs

@@ -0,0 +1,61 @@
+namespace Fabulous
+
+open System
+open System.ComponentModel
+open System.Runtime.CompilerServices
+
+type BindingRequest<'T> = delegate of unit -> StateValue<'T>
+
+[<Struct>]
+type BindingValue<'T> =
+    [<EditorBrowsable(EditorBrowsableState.Never)>]
+    val public SourceContext: ComponentContext
+
+    [<EditorBrowsable(EditorBrowsableState.Never)>]
+    val public SourceKey: int
+
+    new(stateValue: StateValue<'T>) =
+        { SourceContext = stateValue.Context
+          SourceKey = stateValue.Key }
+
+    member this.Current = this.SourceContext.TryGetValue<'T>(this.SourceKey).Value
+
+    member inline this.Set(value: 'T) =
+        this.SourceContext.SetValue(this.SourceKey, value)
+
+[<AutoOpen>]
+module BindingBuilders =
+    type Context with
+
+        static member inline Binding(value: StateValue<'T>) = BindingRequest<'T>(fun () -> value)
+
+[<Extension>]
+type BindingExtensions =
+    [<Extension>]
+    static member inline Bind
+        (
+            _: ComponentBuilder<'parentMsg>,
+            [<InlineIfLambda>] fn: BindingRequest<'T>,
+            [<InlineIfLambda>] continuation: BindingValue<'T> -> ComponentBodyBuilder<'marker>
+        ) =
+        ComponentBodyBuilder<'marker>(fun bindings ctx ->
+            let key = int bindings
+            let stateValue = fn.Invoke()
+
+            // Dispose previous subscription
+            match ctx.TryGetValue<IDisposable>(key) with
+            | ValueNone -> ()
+            | ValueSome d -> d.Dispose()
+
+            // Subscribe to source context changes
+            let sourceKey = stateValue.Key
+
+            let sub =
+                stateValue.Context.RenderNeeded.Subscribe(fun k ->
+                    if k = sourceKey then
+                        ctx.NeedsRender(key))
+
+            ctx.SetValueInternal(key, sub)
+
+            let bindingValue = BindingValue<'T>(stateValue)
+            (continuation bindingValue).Invoke(bindings, ctx))

src/Fabulous/Component.fs

@@ -332,7 +332,7 @@ type Component(treeContext: ViewTreeContext, body: ComponentBody, context: Compo
     interface IDisposable with
         member this.Dispose() = this.Dispose()
 
-    member this.Render() =
+    member this.Render(_) =
         treeContext.SyncAction(this.RenderInternal)
 
 module Component =

src/Fabulous/ComponentContext.fs

@@ -31,15 +31,15 @@ type ComponentContext(initialSize: int) =
     let mutable values = Array.zeroCreate initialSize
     let disposables = System.Collections.Generic.List<IDisposable>()
 
-    let renderNeeded = Event<unit>()
+    let renderNeeded = Event<int>()
 
     // We assume that most components will have few values, so initialize it with a small array
     new() = new ComponentContext(3)
 
     member this.Id = id
 
     member this.RenderNeeded = renderNeeded.Publish
-    member this.NeedsRender() = renderNeeded.Trigger()
+    member this.NeedsRender(key: int) = renderNeeded.Trigger(key)
 
     member private this.ResizeIfNeeded(count: int) =
         // If the array is already big enough, we don't need to do anything
@@ -66,7 +66,7 @@ type ComponentContext(initialSize: int) =
 
     member this.SetValue(key: int, value: 'T) =
         this.SetValueInternal(key, value)
-        this.NeedsRender()
+        this.NeedsRender(key)
 
     member this.LinkDisposable(disposable: IDisposable) = disposables.Add(disposable)
 
@@ -76,6 +76,10 @@ type ComponentContext(initialSize: int) =
 
         disposables.Clear()
 
+        for value in values do
+            if value :? IDisposable then
+                (value :?> IDisposable).Dispose()
+
         values <- Array.empty
 
     interface IDisposable with

src/Fabulous/Fabulous.fsproj

@@ -43,6 +43,7 @@
     <Compile Include="ComponentContext.fs" />
     <Compile Include="Component.fs" />
     <Compile Include="State.fs" />
+    <Compile Include="Binding.fs" />
     <Compile Include="MvuComponent.fs" />
     <Compile Include="Memo.fs" />
     <Compile Include="View.fs" />