/
Tabs.purs
49 lines (44 loc) · 1.26 KB
/
Tabs.purs
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
module Lumi.Components.Layouts.Tabs where
import Prelude
import Data.Maybe (Maybe(..))
import Data.NonEmpty (NonEmpty, oneOf)
import Effect (Effect)
import Lumi.Components.Tab (TabId, TabKey)
import Lumi.Components.Tab as Tab
import React.Basic (Component, JSX, createComponent, makeStateless)
import React.Basic.DOM as R
import Web.HTML.History (URL)
component :: Component TabLayoutProps
component = createComponent "TabsLayout"
type TabLayoutProps =
{ currentLocation :: URL
, queryKey :: TabKey
, useHash :: Boolean
, navigate :: Maybe (URL -> Effect Unit)
, tabs :: NonEmpty Array
{ id :: TabId
, label :: String
, count :: Maybe Int
, content :: Unit -> JSX
}
}
tabLayout :: TabLayoutProps -> JSX
tabLayout = makeStateless component render
where
render { currentLocation, navigate, queryKey, tabs, useHash } =
Tab.tabs
{ style: R.css { "paddingLeft": "24px" }
, tabStyle: R.css {}
, selectedTabStyle: R.css {}
, currentLocation
, queryKey
, useHash
, navigate
, tabs: oneOf tabs <#> \t ->
{ content: t.content
, id: t.id
, label: t.label
, count: t.count
, testId: Nothing
}
}