Feliz 2.9.0

dotnet add package Feliz --version 2.9.0                
NuGet\Install-Package Feliz -Version 2.9.0                
This command is intended to be used within the Package Manager Console in Visual Studio, as it uses the NuGet module's version of Install-Package.
<PackageReference Include="Feliz" Version="2.9.0" />                
For projects that support PackageReference, copy this XML node into the project file to reference the package.
paket add Feliz --version 2.9.0                
#r "nuget: Feliz, 2.9.0"                
#r directive can be used in F# Interactive and Polyglot Notebooks. Copy this into the interactive tool or source code of the script to reference the package.
// Install Feliz as a Cake Addin
#addin nuget:?package=Feliz&version=2.9.0

// Install Feliz as a Cake Tool
#tool nuget:?package=Feliz&version=2.9.0                

Feliz Nuget Build status

A fresh retake of the React API in Fable, optimized for happiness.

Here is how it looks like:

module App

open Feliz

[<ReactComponent>]
let Counter() =
    let (count, setCount) = React.useState(0)
    Html.div [
        Html.button [
            prop.style [ style.marginRight 5 ]
            prop.onClick (fun _ -> setCount(count + 1))
            prop.text "Increment"
        ]

        Html.button [
            prop.style [ style.marginLeft 5 ]
            prop.onClick (fun _ -> setCount(count - 1))
            prop.text "Decrement"
        ]

        Html.h1 count
    ]

open Browser.Dom

let root = ReactDOM.createRoot(document.getElementById "root")
root.render(Counter())

Features

  • Consistent, lightweight formatting: no more awkward indentation using two lists for every element.
  • Discoverable attributes with no more functions, Html attributes or css properties globally available so they are easy to find.
  • Proper documentation: each attribute and CSS property
  • Full React API support: Feliz aims to support the React API for building components using hooks, context and more.
  • Fully Type-safe: no more Margin of obj but instead utilizing a plethora of overloaded functions to account for the overloaded nature of CSS attributes, covering 90%+ of the CSS styles, values and properties.
  • Included color list of most commonly used Html colors in the colors module.
  • Compatible with the current React DSL used in applications.
  • Compatible with Femto.
  • Approximately Zero bundle size increase where everything function body is erased from the generated javascript unless you actually use said function.

Quick Start

dotnet new -i Feliz.Template
dotnet new feliz -n MyProject
cd MyProject
npm install
npm start

Documentation

Feliz has extensive documentation at https://zaid-ajaj.github.io/Feliz with live examples along side code samples, check them out and if you have any question, let us know!

Product Compatible and additional computed target framework versions.
.NET net5.0 was computed.  net5.0-windows was computed.  net6.0 was computed.  net6.0-android was computed.  net6.0-ios was computed.  net6.0-maccatalyst was computed.  net6.0-macos was computed.  net6.0-tvos was computed.  net6.0-windows was computed.  net7.0 was computed.  net7.0-android was computed.  net7.0-ios was computed.  net7.0-maccatalyst was computed.  net7.0-macos was computed.  net7.0-tvos was computed.  net7.0-windows was computed.  net8.0 was computed.  net8.0-android was computed.  net8.0-browser was computed.  net8.0-ios was computed.  net8.0-maccatalyst was computed.  net8.0-macos was computed.  net8.0-tvos was computed.  net8.0-windows was computed.  net9.0 was computed.  net9.0-android was computed.  net9.0-browser was computed.  net9.0-ios was computed.  net9.0-maccatalyst was computed.  net9.0-macos was computed.  net9.0-tvos was computed.  net9.0-windows was computed. 
.NET Core netcoreapp2.0 was computed.  netcoreapp2.1 was computed.  netcoreapp2.2 was computed.  netcoreapp3.0 was computed.  netcoreapp3.1 was computed. 
.NET Standard netstandard2.0 is compatible.  netstandard2.1 was computed. 
.NET Framework net461 was computed.  net462 was computed.  net463 was computed.  net47 was computed.  net471 was computed.  net472 was computed.  net48 was computed.  net481 was computed. 
MonoAndroid monoandroid was computed. 
MonoMac monomac was computed. 
MonoTouch monotouch was computed. 
Tizen tizen40 was computed.  tizen60 was computed. 
Xamarin.iOS xamarinios was computed. 
Xamarin.Mac xamarinmac was computed. 
Xamarin.TVOS xamarintvos was computed. 
Xamarin.WatchOS xamarinwatchos was computed. 
Compatible target framework(s)
Included target framework(s) (in package)
Learn more about Target Frameworks and .NET Standard.

NuGet packages (132)

Showing the top 5 NuGet packages that depend on Feliz:

Package Downloads
Feliz.Router

A router component for React and Elmish that is focused, powerful and extremely easy to use.

Feliz.Bulma

Bulma wrapper for amazing Feliz DSL

Feliz.UseListener

React hooks for easy event listener management.

Feliz.UseDeferred

Hooks for dead-simple data fetching with Feliz

Feliz.Recharts

Recharts bindings based on the Feliz API

GitHub repositories

This package is not used by any popular GitHub repositories.

Version Downloads Last updated
2.9.0 11,445 5 months ago
2.8.0 19,632 9 months ago
2.8.0-beta.0 3,161 12/25/2023
2.7.0 34,553 10/8/2023
2.6.0 54,123 3/21/2023
2.5.0 524 3/18/2023
2.4.1 4,166 2/23/2023
2.4.0 11,315 1/14/2023
2.3.0 12,767 12/27/2022
2.2.0 350 12/27/2022
2.1.0 345 12/27/2022
2.0.1 474 12/25/2022
2.0.0 5,105 12/25/2022
2.0.0-prerelease-003 6,707 9/16/2022
2.0.0-prerelease-002 5,618 9/1/2022
2.0.0-prerelease-001 195 8/26/2022
1.68.0 48,841 8/17/2022
1.67.0 8,846 8/5/2022
1.66.0 1,952 8/3/2022
1.65.0 25,476 7/9/2022
1.64.0 17,735 5/9/2022
1.63.0 739 5/9/2022
1.62.0 26,706 4/19/2022
1.61.0 27,041 3/12/2022
1.60.0 1,290 3/5/2022
1.59.0 12,462 2/24/2022
1.58.1 6,986 2/10/2022
1.58.0 1,229 2/3/2022
1.57.0 26,135 11/29/2021
1.56.0 3,795 11/8/2021
1.55.0 11,986 11/5/2021
1.54.0 3,489 10/24/2021
1.53.0 3,680 10/2/2021
1.52.0 9,865 9/10/2021
1.51.0 8,868 8/17/2021
1.50.0 2,801 8/8/2021
1.49.0 20,085 7/7/2021
1.48.0 505 7/7/2021
1.47.0 19,675 6/13/2021
1.46.0 2,027 6/8/2021
1.45.0 10,560 5/13/2021
1.44.0 1,739 5/3/2021
1.43.0 6,140 4/16/2021
1.42.0 1,538 4/10/2021
1.41.0 845 4/8/2021
1.40.1 4,811 3/30/2021
1.40.0 2,278 3/24/2021
1.39.0 502 3/24/2021
1.38.0 1,320 3/17/2021
1.37.0 4,882 3/8/2021
1.36.0 574 3/6/2021
1.35.0 1,221 2/28/2021
1.34.0 1,706 2/21/2021
1.33.1 16,458 2/21/2021
1.33.0 3,418 2/4/2021
1.32.0 17,270 12/27/2020
1.31.1 1,265 12/22/2020
1.31.0 795 12/22/2020
1.30.0 560 12/22/2020
1.29.0 2,041 12/15/2020
1.28.0 23,704 12/15/2020
1.27.0 657 12/13/2020
1.25.0 721 12/12/2020
1.24.0 1,137 12/10/2020
1.23.0 506 12/10/2020
1.22.1 552 12/10/2020
1.22.0 5,769 12/2/2020
1.21.0 698 12/2/2020
1.20.0 1,075 11/27/2020
1.19.0 523 11/26/2020
1.18.0 1,129 11/26/2020
1.17.0 11,762 11/15/2020
1.16.2 3,104 11/1/2020
1.16.1 635 10/30/2020
1.16.0 6,044 10/23/2020
1.15.0 1,005 10/23/2020
1.14.1 4,668 10/19/2020
1.14.0 4,617 9/19/2020
1.13.2 1,608 9/16/2020
1.13.1 13,222 9/1/2020
1.13.0 4,533 8/16/2020
1.12.1 1,301 8/10/2020
1.12.0 1,107 8/9/2020
1.11.0 2,260 8/8/2020
1.10.1 1,333 7/30/2020
1.10.0 619 7/29/2020
1.9.0 593 7/29/2020
1.8.0 643 7/29/2020
1.7.0 2,528 7/16/2020
1.6.0 8,791 7/3/2020
1.5.0 12,968 6/24/2020
1.4.0 647 6/24/2020
1.3.0 17,493 6/7/2020
1.2.0 4,122 6/4/2020
1.1.1 10,609 5/24/2020
1.1.0 4,995 5/21/2020
1.0.0 3,284 5/16/2020
0.86.0 4,313 5/9/2020
0.85.0 1,972 5/7/2020
0.84.0 749 5/4/2020
0.83.0 3,167 5/4/2020
0.82.0 676 5/3/2020
0.81.0 1,089 4/30/2020
0.80.0 693 4/28/2020
0.79.0 588 4/28/2020
0.78.0 1,482 4/27/2020
0.77.0 591 4/26/2020
0.76.0 1,435 4/26/2020
0.75.0 3,370 4/22/2020
0.74.2 5,765 4/20/2020
0.74.1 4,276 4/12/2020
0.74.0 6,203 3/29/2020
0.73.0 1,660 3/26/2020
0.72.0 5,786 3/22/2020
0.71.0 1,552 3/20/2020
0.70.0 2,440 3/17/2020
0.69.0 1,762 3/12/2020
0.68.10 6,200 12/10/2019
0.68.9 3,959 12/5/2019
0.68.8 1,497 12/5/2019
0.68.7 2,346 12/4/2019
0.68.6 1,510 12/1/2019
0.68.5 1,471 11/29/2019
0.68.3 3,924 11/27/2019
0.68.2 7,241 11/18/2019
0.68.1 1,409 11/18/2019
0.68.0 4,012 11/14/2019
0.67.2 2,274 11/13/2019
0.67.1 1,564 11/4/2019
0.67.0 1,758 11/4/2019
0.66.5 1,427 11/3/2019
0.66.4 1,209 11/3/2019
0.66.3 1,397 11/1/2019
0.66.2 1,289 11/1/2019
0.66.1 2,361 10/31/2019
0.66.0 1,563 10/30/2019
0.65.5 1,328 10/29/2019
0.65.4 1,371 10/28/2019
0.65.3 1,336 10/28/2019
0.65.2 1,149 10/27/2019
0.65.1 1,070 10/27/2019
0.65.0 1,418 10/27/2019
0.64.0 1,113 10/27/2019
0.63.0 1,492 10/22/2019
0.62.0 1,001 10/21/2019
0.61.0 935 10/21/2019
0.60.0 661 10/20/2019
0.59.0 1,132 10/20/2019
0.58.0 2,322 10/14/2019
0.57.2 1,163 10/12/2019
0.57.1 970 10/10/2019
0.57.0 1,583 10/8/2019
0.56.0 1,329 10/6/2019
0.55.0 641 10/6/2019
0.54.0 847 10/6/2019
0.53.0 1,085 10/5/2019
0.52.0 906 9/14/2019
0.51.0 645 9/14/2019
0.50.0 651 9/10/2019
0.49.0 682 9/9/2019
0.48.0 668 9/9/2019
0.47.0 986 8/31/2019
0.46.0 1,105 8/28/2019
0.45.0 657 8/28/2019
0.44.0 630 8/27/2019
0.42.0 673 8/26/2019
0.41.0 695 8/19/2019
0.40.0 1,212 8/13/2019
0.39.0 688 8/13/2019
0.38.0 709 8/5/2019
0.37.0 685 8/5/2019
0.36.0 726 7/31/2019
0.35.0 743 7/29/2019
0.34.0 700 7/28/2019
0.33.0 673 7/28/2019
0.32.0 708 7/28/2019
0.31.0 675 7/28/2019
0.30.0 699 7/27/2019
0.29.0 653 7/26/2019
0.28.0 665 7/26/2019
0.27.0 674 7/26/2019
0.26.0 658 7/26/2019
0.25.0 684 7/26/2019
0.24.0 650 7/25/2019
0.23.0 675 7/25/2019
0.22.0 673 7/25/2019
0.20.0 652 7/25/2019
0.19.0 665 7/25/2019
0.18.0 662 7/24/2019
0.17.0 660 7/24/2019
0.16.0 696 7/23/2019
0.15.0 658 7/22/2019
0.14.0 668 7/22/2019
0.13.0 666 7/22/2019
0.12.0 685 7/22/2019
0.11.0 632 7/22/2019
0.10.1 657 7/22/2019
0.10.0 692 7/22/2019
0.9.0 658 7/22/2019
0.8.0 666 7/22/2019
0.7.0 666 7/22/2019
0.6.0 701 7/22/2019
0.5.0 665 7/21/2019
0.4.0 635 7/21/2019
0.3.0 620 7/21/2019
0.2.0 673 7/21/2019
0.1.0 794 7/21/2019

Add scrollbarColor, aria-roledescription and order style properties