Opinionated design system with a friendly API. Demo.
authScreen : Internal.LowLevel.CustomNode Basics.Never Basics.Never msg
AuthScreen element
sidebar : Internal.LowLevel.CustomNode Basics.Never Basics.Never msg
Sidebar element
avatar : Internal.LowLevel.CustomNode Basics.Never (Avatar.Data msg) msg
Avatar element
layout : Internal.LowLevel.CustomNode Basics.Never Basics.Never msg
Layout element
status : Internal.LowLevel.CustomNode Basics.Never Basics.Never msg
Status element
urlBar : Internal.LowLevel.CustomNode Basics.Never String msg
Url bar element
button : Internal.LowLevel.CustomNode Basics.Never Basics.Never msg
Button element
header : Internal.LowLevel.CustomNode Basics.Never Basics.Never msg
Header element
footer : Internal.LowLevel.CustomNode Basics.Never Basics.Never msg
Footer element
card : Internal.LowLevel.CustomNode Basics.Never Basics.Never msg
Card element
pageHeader : Internal.LowLevel.CustomNode Basics.Never Basics.Never msg
Page header element
input : Internal.LowLevel.CustomNode Basics.Int String msg
Input element
checkbox : Internal.LowLevel.CustomNode Basics.Never (List String) msg
Checkbox element
searchBar : Internal.LowLevel.CustomNode Basics.Never String msg
SearchBar element
form : Internal.LowLevel.CustomNode Basics.Never Basics.Never msg
Form element
modal : Internal.LowLevel.CustomNode Basics.Never Basics.Never msg
Modal element
loader : Internal.LowLevel.CustomNode Basics.Never Basics.Never msg
Loader element
select : Internal.LowLevel.CustomNode Basics.Never (Maybe String) msg
Select element
link : Internal.LowLevel.CustomNode Basics.Never Basics.Never msg
Link element
formPack : Internal.LowLevel.CustomNode Basics.Never Basics.Never msg
FormPack element
switch : Internal.LowLevel.CustomNode Basics.Never Basics.Bool msg
SearchBar element
notification : Internal.LowLevel.CustomNode Basics.Never Basics.Never msg
Notification element
chipElement : Internal.LowLevel.CustomNode Basics.Never Basics.Never msg
Chip element
customLink : Internal.LowLevel.CustomNode Basics.Never Basics.Never msg
Counter element
tile : Internal.LowLevel.CustomNode Basics.Never Basics.Never msg
Tile element
counter : Internal.LowLevel.CustomNode Counter.State Basics.Int msg
Counter element
Counter.Data
Counter data
Counter.State
Counter state
initCounter : CounterState
Init counter state
datePicker : Internal.LowLevel.CustomNode DatePicker.State DatePicker.Data msg
DatePicker element
DatePicker.Data
DatePicker data
DatePicker.State
DatePicker state
initDatePicker : DatePickerState
Init DatePicker state
slider : Internal.LowLevel.CustomNode Slider.State Slider.Data msg
Slider element
Slider.Data
Slider data
Slider.State
Slider state
initSlider : SliderState
Init Slider state
steps : Internal.LowLevel.CustomNode Basics.Never Steps.Data msg
Card element
Steps.Data
StepsData
toggle : Internal.LowLevel.CustomNode Basics.Never String msg
Toggle element
Toggle.Data
ToggleData
dropdown : Internal.LowLevel.CustomNode Basics.Never Dropdown.Data msg
Dropdown element
Dropdown.Data
DropdownData
tabs : Internal.LowLevel.CustomNode Tabs.State (Tabs.Data msg) msg
Tabs element
Tabs.Data msg
Tabs data
Tabs.State
Tabs state
initTabs : TabsState
Init Tabs state
table : Internal.LowLevel.CustomNode Table.State (Table.Data record msg) msg
Smart table
Table.Data record msg
Table data
Table.State
Table state
initTable : TableState
Init Table state
tableSearch : TableState -> Maybe String
Extract search from table state
setTableSearch : String -> TableState -> TableState
Set table search state
listEditor : Internal.LowLevel.CustomNode ListEditor.State ListEditor.Data msg
ListEditor element
ListEditor.Data
ListEditor data
ListEditor.State
ListEditor state
initListEditor : ListEditorState
Init ListEditor state
title : String -> Internal.LowLevel.Setting state data msg
Title attribute
oversized : Internal.LowLevel.Setting state data msg
Oversized
body : String -> Internal.LowLevel.Setting state data msg
Content body attribute
popup : List (Html.Styled.Html msg) -> Internal.LowLevel.Setting state data msg
Popup attribute - specify children that go into a popup belonging to the element.
controls : List (Html.Styled.Html msg) -> Internal.LowLevel.Setting state data msg
Makes list editing components append new items in the reverse order
help : String -> Internal.LowLevel.Setting state data msg
Help text
state : state -> Internal.LowLevel.Setting state data msg
Internal UI widget state, see http://package.elm-lang.org/packages/evancz/elm-sortable-table/1.0.1/Table#view
data : data -> Internal.LowLevel.Setting state data msg
View data 'owned' by the outside application. Of course, all state is owned by the outside app, but contrary to state, this holds core application data that may reach servers later.
toMsg : (data -> msg) -> Internal.LowLevel.Setting state data msg
A'la elm-sortable-table, this is how components communicate to the outside application. The slight modification is that components always pass back both their new internal state and the new data through this method.
toClipboard : (String -> msg) -> Internal.LowLevel.Setting state data msg
Message handler for copying the contents of an input field to clipboard
toStatefulMsg : (state -> data -> msg) -> Internal.LowLevel.Setting state data msg
A'la elm-sortable-table, this is how components communicate to the outside application. The slight modification is that components always pass back both their new internal state and the new data through this method.
toStatefulMsgWithFocus : (Maybe String -> state -> data -> msg) -> Internal.LowLevel.Setting state data msg
A'la elm-sortable-table, this is how components communicate to the outside application. The slight modification is that components always pass back both their new internal state and the new data through this method.
toAsyncStatefulMsg : ((state -> data -> ( state, data )) -> msg) -> Internal.LowLevel.Setting state data msg
A'la elm-sortable-table, this is how components communicate to the outside application. The slight modification is that components always pass back both their new internal state and the new data through this method.
success : Internal.LowLevel.Setting state data msg
Success theme
warning : Internal.LowLevel.Setting state data msg
Warning theme
onDarkBackground : Internal.LowLevel.Setting state data msg
Set theme to work on dark background
error : Internal.LowLevel.Setting state data msg
Error theme
enabled : Basics.Bool -> Internal.LowLevel.Setting state data msg
Enabled state
placeholder : String -> Internal.LowLevel.Setting state data msg
Placeholder
icon : Html.Styled.Html msg -> Internal.LowLevel.Setting state data msg
SVG icon
id : String -> Internal.LowLevel.Setting state data msg
Id
label : String -> Internal.LowLevel.Setting state data msg
Labels, used for forms and sections
onClick : msg -> Internal.LowLevel.Setting state data msg
Click handler
onClose : msg -> Internal.LowLevel.Setting state data msg
Close handler
onSuggestion : (String -> msg) -> Internal.LowLevel.Setting state data msg
Handler for when the user accepts a suggestion
suggestions : List String -> Internal.LowLevel.Setting state data msg
Suggestions for words that autocomplete should recognize
url : String -> Internal.LowLevel.Setting state data msg
Url for links and help sections
discrete : Internal.LowLevel.Setting state data msg
Discrete theme
options : List String -> Internal.LowLevel.Setting state data msg
List of options, e.g. for select
optionIcon : (String -> Html.Styled.Html msg) -> Internal.LowLevel.Setting state data msg
An optional icon for choices
loading : Basics.Bool -> Internal.LowLevel.Setting state data msg
Specifies whether the UI element is in a loading state
css : List Css.Style -> Internal.LowLevel.Setting state data msg
elm-css
styles
type_ : String -> Internal.LowLevel.Setting state data msg
HTML type attribute for buttons and input fields.
required : Internal.LowLevel.Setting state data msg
Required
onFocus : msg -> Internal.LowLevel.Setting state data msg
Focus handler
onBlur : msg -> Internal.LowLevel.Setting state data msg
Blur handler
onSubmit : msg -> Internal.LowLevel.Setting state data msg
Submit handler
onListEditorWordClick : (Basics.Int -> Basics.Int -> msg) -> Internal.LowLevel.Setting state data msg
Click handler on a word in a list editor
searchable : Basics.Bool -> Internal.LowLevel.Setting state data msg
Set searchability, toggling the search bar displays in e.g. tables
appendReverse : Internal.LowLevel.Setting state data msg
Makes list editing components append new items in the reverse order
keepAtLeastOne : Internal.LowLevel.Setting state data msg
Keep at least one item when editing
currentPath : String -> Internal.LowLevel.Setting state data msg
The current path
links : List { path : String, label : String, icon : Maybe (Html.Styled.Html msg) } -> Internal.LowLevel.Setting state data msg
Links
plus : Html.Styled.Html msg
Plus icon
plusInCircle : Html.Styled.Html msg
PlusInCircle icon
barbell : Html.Styled.Html msg
Barbell icon
webhook : Html.Styled.Html msg
Webhooks icon
checkmarkInCircle : Html.Styled.Html msg
Checkmark icon
variable : Html.Styled.Html msg
Variable icon
slot : Html.Styled.Html msg
Slot icon
duplicate : Html.Styled.Html msg
Duplicate icon
trash : Html.Styled.Html msg
Trash icon
target : Html.Styled.Html msg
Target icon
channels : Html.Styled.Html msg
Channels icon
pen : Html.Styled.Html msg
Pen icon
gear : Html.Styled.Html msg
Gear icon
tree : Html.Styled.Html msg
Tree icon
chip : Html.Styled.Html msg
Chip icon
bot : Html.Styled.Html msg
Tree icon
chevronLeft : Html.Styled.Html msg
ChevronLeft icon
chevronRight : Html.Styled.Html msg
ChevronRight icon
chevronUp : Html.Styled.Html msg
ChevronUp icon
chevronDown : Html.Styled.Html msg
ChevronDown icon
search : Html.Styled.Html msg
Search icon
close : Html.Styled.Html msg
Close icon
questionInCircle : Html.Styled.Html msg
QuestionInCircle icon
chart : Html.Styled.Html msg
Chart icon
logout : Html.Styled.Html msg
Logout icon
person : Html.Styled.Html msg
Person icon
hammer : Html.Styled.Html msg
Hammer icon
slack : Html.Styled.Html msg
Slack icon
skype : Html.Styled.Html msg
Skype icon
facebookMessenger : Html.Styled.Html msg
Facebook messenger icon
amazonEcho : Html.Styled.Html msg
Facebook messenger icon
globalStyles : Html.Styled.Html msg
Global setup styles