Switch to custom unflatten implementation

#39 hughsk/flat#94
Shmew · Jan 26, 2020 · 5fe54e0 · 5fe54e0
1 parent 6f2d489
commit 5fe54e0
Show file tree

Hide file tree

Showing 10 changed files with 45 additions and 60 deletions.
diff --git a/README.md b/README.md
@@ -30,6 +30,11 @@ To run targets using Fake: `dotnet fake build -t TargetName`
 Changelog
 ---------
 
+### 0.11.0
+
+* Switched to custom unflatten implementation to avoid problems (see [#39](https://github.com/cmeeren/Feliz.MaterialUI/issues/39) and [hughsk/flat#94](https://github.com/hughsk/flat/issues/94))
+- As a consequence of the above, removed (the read-only) `Theme.props` and `Theme.overrides`
+
 ### 0.10.1
 
 * Fixed higher-arity `theme.spacing` overloads

diff --git a/docs-app/package-lock.json b/docs-app/package-lock.json
diff --git a/docs-app/package.json b/docs-app/package.json
@@ -11,7 +11,6 @@
         "@material-ui/core": "^4.8.3",
         "@material-ui/icons": "^4.5.1",
         "@material-ui/lab": "^4.0.0-alpha.39",
-        "flat": "^5.0.0",
         "gh-pages": "^2.2.0",
         "mdi-material-ui": "^6.10.0",
         "react": "^16.12.0",

diff --git a/src/Feliz.Generator.MaterialUI/ApiParser.fs b/src/Feliz.Generator.MaterialUI/ApiParser.fs
@@ -799,7 +799,7 @@ let parseApi () =
     ComponentApi.create "Feliz.MaterialUI" "Mui"
     |> ComponentApi.addComponent themeProvider
     |> ComponentApi.addComponents (components |> List.map (fun c -> c.GeneratorComponent))
-    |> ComponentApi.setParseProps "createObj !!properties |> Flat.flat.unflatten"
+    |> ComponentApi.setParseProps "!!properties |> Object.fromFlatEntries"
 
   {
     GeneratorComponentApi = api

diff --git a/src/Feliz.MaterialUI/Bindings.fs b/src/Feliz.MaterialUI/Bindings.fs
@@ -311,13 +311,7 @@ type Theme =
   abstract breakpoints: Breakpoints
   abstract direction: Direction
   abstract mixins: Mixins
-  [<Emit("$0.overrides"); EditorBrowsable(EditorBrowsableState.Never)>]
-  abstract overridesObj: obj
-  member inline this.overrides = this.overridesObj |> Flat.flat.flatten |> objectEntries |> unbox<IThemeProp []>
   abstract palette: Palette
-  [<Emit("$0.props"); EditorBrowsable(EditorBrowsableState.Never)>]
-  abstract propsObj: obj
-  member inline this.props = this.propsObj |> Flat.flat.flatten |> objectEntries |> unbox<IThemeProp []>
   abstract shadows: string []
   abstract typography: Typography
   abstract spacing: a: int -> int

diff --git a/src/Feliz.MaterialUI/Feliz.MaterialUI.fsproj b/src/Feliz.MaterialUI/Feliz.MaterialUI.fsproj
@@ -5,13 +5,14 @@
     <GenerateDocumentationFile>true</GenerateDocumentationFile>
     <Description>Feliz-style Fable bindings for Material-UI.</Description>
     <Authors>Christer van der Meeren</Authors>
-    <Version>0.10.1 </Version>
-    <PackageReleaseNotes>Fixed higher-arity theme.spacing overloads</PackageReleaseNotes>
+    <Version>0.11.0 </Version>
+    <PackageReleaseNotes>- Switched to custom unflatten implementation to avoid problems
+- As a consequence of the above, removed (the read-only) Theme.props and Theme.overrides</PackageReleaseNotes>
   </PropertyGroup>
 
   <ItemGroup>
     <None Include="paket.template" />
-    <Compile Include="FlatBindings.fs" />
+    <Compile Include="Flatten.fs" />
     <Compile Include="Misc.fs" />
     <Compile Include="Bindings.fs" />
     <Compile Include="Autocomplete.fs" />
@@ -30,7 +31,6 @@
     <NpmDependencies>
       <NpmPackage Name="@material-ui/core" Version="gte 4.8 lt 5" ResolutionStrategy="max" />
       <NpmPackage Name="@material-ui/lab" Version="4.0.0-alpha.39" />
-      <NpmPackage Name="flat" Version="gte 5 lt 6" ResolutionStrategy="max" />
     </NpmDependencies>
   </PropertyGroup>
 

diff --git a/src/Feliz.MaterialUI/FlatBindings.fs b/src/Feliz.MaterialUI/FlatBindings.fs
diff --git a/src/Feliz.MaterialUI/Flatten.fs b/src/Feliz.MaterialUI/Flatten.fs
@@ -0,0 +1,31 @@
+namespace Feliz.MaterialUI
+
+module internal Object =
+
+  open Fable.Core
+  open Fable.Core.JS
+  open Fable.Core.JsInterop
+
+  [<Emit("""
+function setProperty(target, key, value) {
+  const sepIdx = key.indexOf('.')
+  if (sepIdx === -1) {
+    target[key] = value
+  } else {
+    const topKey = key.substring(0, sepIdx)
+    const nestedKey = key.substring(sepIdx + 1)
+    if (target[topKey] === undefined) {
+      target[topKey] = {}
+    }
+    setProperty(target[topKey], nestedKey, value)
+  }
+}
+
+const target = {}
+for (let kv of $0) {
+  setProperty(target, kv[0], kv[1])
+}
+
+return target
+""")>]
+  let fromFlatEntries (kvs: seq<string * obj>) : obj = jsNative
diff --git a/src/Feliz.MaterialUI/Mui.fs b/src/Feliz.MaterialUI/Mui.fs
@@ -20,10 +20,10 @@ module MuiHelpers =
     import "createElement" "react"
 
   let createElement (el: ReactElementType) (properties: IReactProperty seq) : ReactElement =
-    reactElement el (createObj !!properties |> Flat.flat.unflatten)
+    reactElement el (!!properties |> Object.fromFlatEntries)
 
   let createElementTag (tag: string) (properties: IReactProperty seq) : ReactElement =
-    reactElementTag tag (createObj !!properties |> Flat.flat.unflatten)
+    reactElementTag tag (!!properties |> Object.fromFlatEntries)
 
 [<Erase>]
 type Mui =

diff --git a/src/Feliz.MaterialUI/Styles.fs b/src/Feliz.MaterialUI/Styles.fs
@@ -85,10 +85,8 @@ type Styles =
 
   /// Generate a theme base on the configured incomplete theme object.
   static member inline createMuiTheme (props: IThemeProp list) : Theme =
-    props
-    |> unbox
-    |> createObj
-    |> Flat.flat.unflatten
+    !!props
+    |> Object.fromFlatEntries
     :?> Theme
     |> StyleImports.createMuiTheme