Client.fs

module Client

open Elmish
open Elmish.React
open Fable.React
open Thoth.Fetch
open Fable.Core
open Fable.Core.JsInterop

open Shared

//
//
//

type DropdownItem = {
    Foo: string
}

type StringOrNode =
    | Text of string
    | Node of ReactElement

type DropdownItemOrString =
    | Text of string
    | Item of DropdownItem

[<StringEnum>]
type DropdownDirection =
    | Top
    | Bottom

[<StringEnum>]
type DropdownSize =
    | Sm
    | Lg
    | Xl

[<StringEnum>]
type DropdownType =
  | Default
  | Inline

type ProgressProps =
    | Disabled of bool
    | Type of DropdownType
    | ItemToString of (DropdownItem -> string)
    | ItemToElement of (DropdownItem -> ReactElement)
    | Light of bool
    | TitleText of StringOrNode
    | HelperText of StringOrNode
    | Direction of DropdownDirection
    | ClassName of string
    // | Items of ??? list
    | InitialSelectedItem of DropdownItemOrString
    | Id of string
    | Inline of bool
    | Invalid of bool
    | InvalidText of string
    // | OnChange of (() -> ())
    | Label of ReactElement
    // | TranslateWithId of (() -> ())
    | AriaLabel of string
    | Size of DropdownSize
    | SelectedItem of DropdownItemOrString
    // | DownshiftProps of ???

let inline Dropdown (props: ProgressProps list) (elems: ReactElement list): ReactElement =
    ofImport "Dropdown" "carbon-components-react" (keyValueList CaseRules.LowerFirst props) elems

//
//
//

type Model = { Counter: int }

type Msg =
    | Initialized

let init () : Model * Cmd<Msg> =
    { Counter = 1 }, Cmd.none

let update (msg : Msg) (currentModel : Model) : Model * Cmd<Msg> =
    currentModel, Cmd.none

let view (model : Model) (dispatch : Msg -> unit) =
    Dropdown [] []

#if DEBUG
open Elmish.Debug
open Elmish.HMR
#endif

Program.mkProgram init update view
#if DEBUG
|> Program.withConsoleTrace
#endif
|> Program.withReactBatched "elmish-app"
#if DEBUG
|> Program.withDebugger
#endif
|> Program.run

ts2fable: