Module

Flare

Package
purescript-flare
Repository
sharkdp/purescript-flare

#ElementId Source

type ElementId = String

#Label Source

type Label = String

#Flare Source

data Flare a

A Flare is a Signal with a corresponding list of HTML elements for the user interface components.

Instances

#UI Source

newtype UI e a

The main data type for a Flare UI. It encapsulates the Eff action which is to be run when setting up the input elements and corresponding signals.

Instances

#number Source

number :: forall e. Label -> Number -> UI e Number

Creates an input field for a Number from a given label and default value.

#number_ Source

number_ :: forall e. Number -> UI e Number

Like number, but without a label.

#numberRange Source

numberRange :: forall e. Label -> Number -> Number -> Number -> Number -> UI e Number

Creates an input field for a Number from a given label, minimum value, maximum value, step size as well as default value. The returned value is guaranteed to be within the given range.

#numberRange_ Source

numberRange_ :: forall e. Number -> Number -> Number -> Number -> UI e Number

Like numberRange, but without a label.

#numberSlider Source

numberSlider :: forall e. Label -> Number -> Number -> Number -> Number -> UI e Number

Creates a slider for a Number input from a given label, minimum value, maximum value, step size as well as default value.

#numberSlider_ Source

numberSlider_ :: forall e. Number -> Number -> Number -> Number -> UI e Number

Like numberSlider, but without a label.

#int Source

int :: forall e. Label -> Int -> UI e Int

Creates an input field for an Int from a given label and default value. The returned value is guaranteed to be within the allowed integer range.

#int_ Source

int_ :: forall e. Int -> UI e Int

Like int, but without a label.

#intRange Source

intRange :: forall e. Label -> Int -> Int -> Int -> UI e Int

Creates an input field for an Int from a given label, minimum and maximum values as well as a default value. The returned value is guaranteed to be within the given range.

#intRange_ Source

intRange_ :: forall e. Int -> Int -> Int -> UI e Int

Like intRange, but without a label.

#intSlider Source

intSlider :: forall e. Label -> Int -> Int -> Int -> UI e Int

Creates a slider for an Int input from a given label, minimum and maximum values as well as a default value.

#intSlider_ Source

intSlider_ :: forall e. Int -> Int -> Int -> UI e Int

Like intSlider, but without a label.

#string Source

string :: forall e. Label -> String -> UI e String

Creates a text field for a String input from a given label and default value.

#string_ Source

string_ :: forall e. String -> UI e String

Like string, but without a label.

#stringPattern Source

stringPattern :: forall e. Label -> String -> String -> UI e String

Creates a text field for a String input from a given label, validation pattern (HTML5 pattern attribute), and a default value.

#stringPattern_ Source

stringPattern_ :: forall e. String -> String -> UI e String

Like stringPattern, but without a label.

#boolean Source

boolean :: forall e. Label -> Boolean -> UI e Boolean

Creates a checkbox for a Boolean input from a given label and default value.

#boolean_ Source

boolean_ :: forall e. Boolean -> UI e Boolean

Like boolean, but without a label.

#optional Source

optional :: forall e a. Label -> Boolean -> a -> UI e (Maybe a)

Creates a checkbox that returns Just x if enabled and Nothing if disabled. Takes a label, the initial state (enabled or disabled) and the default value x.

#optional_ Source

optional_ :: forall e a. Boolean -> a -> UI e (Maybe a)

Like optional, but without a label.

#button Source

button :: forall e a. Label -> a -> a -> UI e a

Creates a button which yields the first value in the default state and the second value when it is pressed.

#buttons Source

buttons :: forall e a f. Traversable f => f a -> (a -> String) -> UI e (Maybe a)

Create a button for each element of the given container. The whole component returns Nothing if none of the buttons is pressed and Just x if the button corresponding to the element x is pressed.

#select Source

select :: forall a f e. Foldable f => Label -> NonEmpty f a -> (a -> String) -> UI e a

Creates a select box to choose from a list of options. The first option is selected by default. The rest of the options is given as an array.

#select_ Source

select_ :: forall a f e. Foldable f => NonEmpty f a -> (a -> String) -> UI e a

Like select, but without a label.

#radioGroup Source

radioGroup :: forall a f e. Foldable f => Label -> NonEmpty f a -> (a -> String) -> UI e a

Creates a group of radio buttons to choose from a list of options. The first option is selected by default. The rest of the options is given as an array.

#radioGroup_ Source

radioGroup_ :: forall a f e. Foldable f => NonEmpty f a -> (a -> String) -> UI e a

Like radioGroup, but without a label.

#textarea Source

textarea :: forall e. Label -> String -> UI e String

Creates a textarea field for a String input from a given label and default value.

#textarea_ Source

textarea_ :: forall e. String -> UI e String

Like textarea, but without a label.

#color Source

color :: forall e. Label -> Color -> UI e Color

Creates a color picker input field from a label and default Color.

#color_ Source

color_ :: forall e. Color -> UI e Color

Like color, but without a label.

#date Source

date :: forall e. Label -> Date -> UI e Date

Creates a date input field from a label and default Date.

#date_ Source

date_ :: forall e. Date -> UI e Date

Like date, but without a label.

#time Source

time :: forall e. Label -> Time -> UI e Time

Creates a time input field from a label and default Time.

#time_ Source

time_ :: forall e. Time -> UI e Time

Like time, but without a label.

#fieldset Source

fieldset :: forall a e. Label -> UI e a -> UI e a

Group the components of a UI inside a fieldset element with a given title.

#applyUIFlipped Source

applyUIFlipped :: forall e b a. UI e a -> UI e (a -> b) -> UI e b

A flipped version of <*> for UI that arranges the components in the order of appearance.

#(<**>) Source

Operator alias for Flare.applyUIFlipped (left-associative / precedence 4)

#wrap Source

wrap :: forall a e. (Signal a) -> UI e a

Encapsulate a Signal within a UI component.

#lift Source

lift :: forall a e. Eff (channel :: CHANNEL, dom :: DOM | e) (Signal a) -> UI e a

Lift a Signal inside the Eff monad to a UI component.

#liftSF Source

liftSF :: forall b a e. (Signal a -> Signal b) -> UI e a -> UI e b

Lift a function from Signal a to Signal b to a function from UI e a to UI e b without affecting the components. For example:

dropRepeats :: forall e a. (Eq a) => UI e a -> UI e a
dropRepeats = liftSF S.dropRepeats

#foldp Source

foldp :: forall e b a. (a -> b -> b) -> b -> UI e a -> UI e b

Create a past dependent component. The fold-function takes the current value of the component and the previous value of the output to produce the new value of the output.

#setupFlare Source

setupFlare :: forall a e. UI e a -> Eff (channel :: CHANNEL, dom :: DOM | e) { components :: Array Element, signal :: Signal a }

Low level function to get direct access to the HTML elements and the Signal inside a Flare UI.

#flareWith Source

flareWith :: forall a e. ElementId -> (Signal a -> Eff (channel :: CHANNEL, dom :: DOM | e) Unit) -> UI e a -> Eff (channel :: CHANNEL, dom :: DOM | e) Unit

Renders a Flare UI to the DOM and sets up all event handlers. The ID specifies the HTML element to which the controls are attached. The handler function argument handles the Signal inside the Flare.

#runFlareWith Source

runFlareWith :: forall a e. ElementId -> (a -> Eff (channel :: CHANNEL, dom :: DOM | e) Unit) -> UI e a -> Eff (channel :: CHANNEL, dom :: DOM | e) Unit

Renders a Flare UI to the DOM and sets up all event handlers. The ID specifies the HTML element to which the controls are attached. The function argument will be mapped over the Signal inside the Flare.

#runFlare Source

runFlare :: forall e. ElementId -> ElementId -> UI e String -> Eff (channel :: CHANNEL, dom :: DOM | e) Unit

Renders a Flare UI to the DOM and sets up all event handlers. The two IDs specify the DOM elements to which the controls and the output will be attached, respectively.

#runFlareShow Source

runFlareShow :: forall a e. Show a => ElementId -> ElementId -> UI e a -> Eff (channel :: CHANNEL, dom :: DOM | e) Unit

Like runFlare but uses show to convert the contained value to a String before rendering to the DOM (useful for testing).

Modules
Flare
Flare.Drawing
Flare.Smolder