5d0b781 · rowtype-yoga/ry-blocks

git.iko.soy/rowtype-yoga/ry-blocks

on main help sign in

For a handful of typesafety

5d0b781Mark Eibes6 years ago

src/Yoga/Block/Atom/Button/Story.purs+1−1

compare with main

unifiedsplit

@@ -7,7 +7,7 @@ import React.Basic (JSX, element, fragment)

7import React.Basic.DOM as R

8import React.Basic.Emotion (str)

9import React.Basic.Emotion as E

10−import Yoga (div, (/>), (</), (</>))

10+import Yoga ((/>), (</), (</>))

11import Yoga.Block as Block

12import Yoga.Block.Atom.Button.Types as ButtonType

13import Yoga.Block.Atom.Button.View as Button

src/Yoga/Block/Atom/CodeInput/Style.purs+3−4

@@ -2,7 +2,6 @@ module Yoga.Block.Atom.CodeInput.Style where

3import Yoga.Prelude.Style

4import Data.Interpolate (i)

5−import Untagged.Castable (cast)

6import Yoga.Block.Container.Style (colour)

5import Yoga.Block.Container.Style (colour)

8type Props f r =

7type Props f r =

@@ -10,8 +9,8 @@ type Props f r =

10 | r

9 | r

11 )

10 )

13−codeInput ∷ ∀ p. { maxLength ∷ Int | Props Id p } -> Style

12+codeInput ∷ ∀ p. { maxLength ∷ OptionalProp Int | Props OptionalProp p } -> Style

14−codeInput props = styles <>? cast props.css

13+codeInput props = styles <>? props.css

15 where

14 where

16 styles =

15 styles =

17 css

16 css

@@ -24,7 +23,7 @@ codeInput props = styles <>? cast props.css

24 , fontFamily: str "var(--mono-font)"

23 , fontFamily: str "var(--mono-font)"

25 , fontSize: str "var(--s0)"

24 , fontSize: str "var(--s0)"

26 , lineHeight: str "var(--s0)"

25 , lineHeight: str "var(--s0)"

27− , width: str $ i "calc(" (cast props.maxLength ?|| 10) "ch + 4.3 * var(--s-5))"

26+ , width: str $ i "calc(" (props.maxLength ?|| 10) "ch + 4.3 * var(--s-5))"

28 , padding: str "calc(var(--s-5) - 1px)"

27 , padding: str "calc(var(--s-5) - 1px)"

29 , color: str colour.text

28 , color: str colour.text

30 , "&:focus":

29 , "&:focus":

src/Yoga/Block/Atom/CodeInput/View.purs+10−3

@@ -1,6 +1,7 @@

1module Yoga.Block.Atom.CodeInput.View

2 ( component

3 , Props

4+ , PropsF

4 , EmotionProps

5 , EmotionProps

5 ) where

6 ) where

@@ -8,11 +9,17 @@ import Yoga.Prelude.View

8import React.Basic.Emotion (Style)

9import React.Basic.Emotion (Style)

9import Yoga.Block.Atom.CodeInput.Style as Style

10import Yoga.Block.Atom.CodeInput.Style as Style

11−type Props =

12+type PropsF f =

12 (

13 (

13− | Style.Props Id (InputPropsF Id EmotionProps)

14+ | Style.Props f (InputPropsF f EmotionProps)

14 )

15 )

17+type Props =

18+ PropsF Id

19+

20+type PropsOptional =

21+ PropsF OptionalProp

22+

16type EmotionProps =

23type EmotionProps =

17 ( className ∷ String, css ∷ Style )

24 ( className ∷ String, css ∷ Style )

@@ -22,7 +29,7 @@ component = rawComponent

22rawComponent ∷ ∀ r. ReactComponent { | r }

29rawComponent ∷ ∀ r. ReactComponent { | r }

23rawComponent =

30rawComponent =

24 mkForwardRefComponent "CodeInput" do

31 mkForwardRefComponent "CodeInput" do

25− \(props ∷ { | Props }) ref -> React.do

32+ \(props ∷ { | PropsOptional }) ref -> React.do

26 pure

33 pure

27 $ emotionInput ref

34 $ emotionInput ref

28 props

35 props

src/Yoga/Block/Atom/Input/Story.purs+10−10

@@ -37,6 +37,16 @@ input = do

37 $ fragment

38 [ R.div_

39 [ R.h1_ [ R.text "Input Examples" ]

40+ , R.h3_ [ R.text "With a label" ]

41+ , Block.cluster </ {}

42+ /> [ element Input.component { label: nes (SProxy ∷ _ "This has a label"), value: "And text", onChange: handler_ mempty }

43+ , element Input.component { label: nes (SProxy ∷ _ "This has a label"), value: "", onChange: handler_ mempty }

44+ , element Input.component { label: nes (SProxy ∷ _ "This has a label"), placeholder: "A very long placeholder, too..." }

45+ , element Input.component { label: nes (SProxy ∷ _ "Pig nose"), leading: R.text "🐽🤣" }

46+ , element Input.component { label: nes (SProxy ∷ _ "Pig nose"), trailing: R.text "🤫" }

47+ , element Input.component { label: nes (SProxy ∷ _ "Pig nose"), leading: R.text "🌭" }

48+ , element Input.component { label: nes (SProxy ∷ _ "Pig nose"), leading: R.text "⭐", trailing: R.text "🔮" }

49+ ]

40 , R.h2_ [ R.text "Generic Input" ]

50 , R.h2_ [ R.text "Generic Input" ]

41 , Input.component </> { value: "A Generic Input", onChange: handler_ mempty }

51 , Input.component </> { value: "A Generic Input", onChange: handler_ mempty }

42 , R.h2_ [ R.text "Validation on text Input" ]

52 , R.h2_ [ R.text "Validation on text Input" ]

@@ -48,16 +58,6 @@ input = do

48 , label: nes (SProxy ∷ _ "I am so important")

58 , label: nes (SProxy ∷ _ "I am so important")

49 , _aria: Object.singleton "required" "true"

59 , _aria: Object.singleton "required" "true"

50 }

60 }

51− , R.h3_ [ R.text "With a label" ]

52− , Block.cluster </ {}

53− /> [ element Input.component { label: nes (SProxy ∷ _ "This has a label"), value: "And text", onChange: handler_ mempty }

54− , element Input.component { label: nes (SProxy ∷ _ "This has a label"), value: "", onChange: handler_ mempty }

55− , element Input.component { label: nes (SProxy ∷ _ "This has a label"), placeholder: "A very long placeholder, too..." }

56− , element Input.component { label: nes (SProxy ∷ _ "Pig nose"), leading: R.text "🐽🤣" }

57− , element Input.component { label: nes (SProxy ∷ _ "Pig nose"), trailing: R.text "🤫" }

58− , element Input.component { label: nes (SProxy ∷ _ "Pig nose"), leading: R.text "🌭" }

59− , element Input.component { label: nes (SProxy ∷ _ "Pig nose"), leading: R.text "⭐", trailing: R.text "🔮" }

60− ]

61 , R.h2_ [ R.text "Overflowing label" ]

62 , element Input.component

63 { type: HTMLInput.Text

src/Yoga/Block/Atom/Input/Style.purs+5−8

@@ -96,21 +96,18 @@ labelSmall =

96 }

97 }

99−labelLarge ∷ { leftIconWidth ∷ Maybe Number, inputWidth ∷ Number } -> Style

99+labelLarge ∷ { left ∷ Number, width ∷ Number, top ∷ Number } -> Style

100−labelLarge { leftIconWidth, inputWidth } =

100+labelLarge { left, width, top } =

101 css

102 { fontSize: str "calc(var(--s0) * 0.85)"

103 , padding: _0

104 , whiteSpace: nowrap -- force on one line

105 , overflow: str "hidden"

106− , maxWidth: str $ i "calc(" inputWidth "px)"

106+ , maxWidth: str $ i width "px"

107 , textOverflow: str "ellipsis"

108 , marginTop: str "calc(var(--s-1) + var(--s-5))"

109− , marginBottom: str "calc(var(--s-1) + var(--s-5))"

109+ , marginBottom: str $ i "calc(" "var(--s-1)" "+" "var(--s-5)" " + " top "px" ")"

110− , marginLeft:

110+ , marginLeft: str $ i left "px"

111− case leftIconWidth of

112− Nothing -> var "--input-side-padding"

113− Just size -> str $ i "calc(var(--input-side-padding) + " gapSize " + " size "px)"

114 , marginRight: str "var(--input-side-padding)"

111 , marginRight: str "var(--input-side-padding)"

115 , color: str colour.placeholderText

112 , color: str colour.placeholderText

116 , fontWeight: str "400"

113 , fontWeight: str "400"

src/Yoga/Block/Atom/Input/View.purs+39−26

@@ -8,6 +8,7 @@ import Framer.Motion as M

8import React.Basic.DOM (css)

9import React.Basic.DOM as R

10import React.Basic.Hooks as React

11+import Unsafe.Coerce (unsafeCoerce)

11import Web.HTML.HTMLInputElement as InputElement

12import Web.HTML.HTMLInputElement as InputElement

12import Yoga.Block.Atom.Icon as Icon

13import Yoga.Block.Atom.Icon as Icon

13import Yoga.Block.Atom.Input.Style as Style

14import Yoga.Block.Atom.Input.Style as Style

@@ -22,16 +23,19 @@ type PropsF f =

22 , trailing ∷ f JSX

23 , trailing ∷ f JSX

23 , label ∷ f NonEmptyString

24 , label ∷ f NonEmptyString

24 , type ∷ f HTMLInput

25 , type ∷ f HTMLInput

25− | Style.Props f InputProps

26+ | Style.Props f (InputPropsF f ())

26 )

27 )

29+coerceProps ∷ { | PropsOptional } -> { | Props }

30+coerceProps = unsafeCoerce

31+

28type Props =

32type Props =

29 PropsF Id

33 PropsF Id

31type PropsOptional =

35type PropsOptional =

32 PropsF OptionalProp

36 PropsF OptionalProp

34−component ∷ ∀ p p_. Union p p_ Props => ReactComponent { | p }

38+component ∷ ∀ p q. Union p q Props => ReactComponent { | p }

35component = rawComponent

39component = rawComponent

37mkLeftIcon ∷ JSX -> JSX

41mkLeftIcon ∷ JSX -> JSX

@@ -46,6 +50,12 @@ mkLeftIcon icon =

46 }

50 }

47 ]

51 ]

53+inputComponent ∷ ∀ p q. Union p q Props => ReactComponent { | p }

54+inputComponent = rawInput

55+

56+inputComponentOptional ∷ ∀ p q. Union p q PropsOptional => ReactComponent { | p }

57+inputComponentOptional = rawInput

58+

49rawInput ∷ ∀ p. ReactComponent { | p }

59rawInput ∷ ∀ p. ReactComponent { | p }

50rawInput =

60rawInput =

51 mkForwardRefComponent "Input" do

61 mkForwardRefComponent "Input" do

@@ -54,7 +64,7 @@ rawInput =

54 result = inputWrapper [ input ]

64 result = inputWrapper [ input ]

55 inputWrapper = div </* { className: "ry-input-wrapper", css: Style.inputWrapper }

65 inputWrapper = div </* { className: "ry-input-wrapper", css: Style.inputWrapper }

56 input = emotionInput ref inputProps { className: "ry-input", css: Style.input }

66 input = emotionInput ref inputProps { className: "ry-input", css: Style.input }

57− inputProps = props { type = HTMLInput.toString <$> props.type # unsafeUnOptional }

67+ inputProps = props { type = HTMLInput.toString <$> props.type }

58 pure result

68 pure result

60rawComponent ∷ ∀ p. ReactComponent (Record p)

70rawComponent ∷ ∀ p. ReactComponent (Record p)

@@ -62,22 +72,23 @@ rawComponent =

62 mkForwardRefComponent "InputContainer" do

72 mkForwardRefComponent "InputContainer" do

63 \(props ∷ { | PropsOptional }) propsRef -> React.do

73 \(props ∷ { | PropsOptional }) propsRef -> React.do

64 hasFocus /\ setHasFocus <- useState' false

74 hasFocus /\ setHasFocus <- useState' false

75+ parentRef ∷ NodeRef <- useRef null

65− backupRef ∷ NodeRef <- useRef null -- [TODO] test this

76+ backupRef ∷ NodeRef <- useRef null

66 let ref = forwardedRefAsMaybe propsRef # fromMaybe backupRef

77 let ref = forwardedRefAsMaybe propsRef # fromMaybe backupRef

67 let

78 let

68 focusInput =

79 focusInput =

69 unless hasFocus do

80 unless hasFocus do

70 maybeHTMLElement <- getHTMLElementFromRef ref

81 maybeHTMLElement <- getHTMLElementFromRef ref

71 for_ maybeHTMLElement focus

82 for_ maybeHTMLElement focus

72− -- Left icon width to correctly place the label

83+ let

73− leftIconRef ∷ NodeRef <- useRef null

74− let (maybeValue ∷ Maybe String) = cast props.value # opToMaybe

84+ maybeValue ∷ Maybe String

85+ maybeValue = props.value # opToMaybe

75 hasValue /\ setHasValue <- useState' ((maybeValue # isJust) && (maybeValue /= Just ""))

86 hasValue /\ setHasValue <- useState' ((maybeValue # isJust) && (maybeValue /= Just ""))

76 let

87 let

77 aria ∷ Object String

88 aria ∷ Object String

78− aria = props._aria # cast # opToMaybe # fold

89+ aria = props._aria # opToMaybe # fold

79 labelId ∷ String

90 labelId ∷ String

80− labelId = props.id # cast # opToMaybe # fold # (_ <> "-label")

91+ labelId = props.id # opToMaybe # fold # (_ <> "-label")

81 renderLargeLabel ∷ Boolean

92 renderLargeLabel ∷ Boolean

82 renderLargeLabel = not hasFocus && not hasValue

93 renderLargeLabel = not hasFocus && not hasValue

83 maybeLabelText ∷ Maybe NonEmptyString

94 maybeLabelText ∷ Maybe NonEmptyString

@@ -90,10 +101,10 @@ rawComponent =

90 , isRequired: aria # Object.lookup "required" # (_ == Just "true")

101 , isRequired: aria # Object.lookup "required" # (_ == Just "true")

91 , isInvalid: aria # Object.lookup "invalid" # (_ == Just "true")

102 , isInvalid: aria # Object.lookup "invalid" # (_ == Just "true")

92 , renderLargeLabel

103 , renderLargeLabel

93− , leftIconRef

94 , labelId

104 , labelId

95− , inputId: props.id

105+ , inputId: props.id ?|| "no-id" -- [TODO] Enforce ID?

96 , inputRef: ref

106 , inputRef: ref

107+ , parentRef

97 , labelText

108 , labelText

98 }

109 }

99 leading ∷ Maybe JSX

110 leading ∷ Maybe JSX

@@ -107,7 +118,7 @@ rawComponent =

107 trailing = opToMaybe props.trailing

118 trailing = opToMaybe props.trailing

108 maybePlaceholder ∷ Maybe String

119 maybePlaceholder ∷ Maybe String

109 maybePlaceholder = do

120 maybePlaceholder = do

110− given <- props.placeholder # cast # opToMaybe

121+ given <- props.placeholder # opToMaybe

111 if isJust maybeLabelText && hasFocus then Just given else Nothing

122 if isJust maybeLabelText && hasFocus then Just given else Nothing

112 onBlur =

123 onBlur =

113 handler preventDefault

124 handler preventDefault

@@ -121,26 +132,28 @@ rawComponent =

121 )

132 )

122 onFocus = handler preventDefault (const $ unless hasFocus $ setHasFocus true)

133 onFocus = handler preventDefault (const $ unless hasFocus $ setHasFocus true)

123 theInput =

134 theInput =

124− rawInput

135+ inputComponentOptional

125− </> ( props

136+ </> ( (cast ∷ _ -> { | PropsOptional })

137+ $ props

126− { onFocus = composeHandler props.onFocus onFocus

138+ { onFocus = composeHandler onFocus props.onFocus

127− , onBlur = composeHandler props.onBlur onBlur

139+ , onBlur = composeHandler onBlur props.onBlur

128− , ref = ref

140+ , ref = ref

129− , placeholder = maybePlaceholder # maybeToOp # unsafeUnOptional

141+ , placeholder = maybePlaceholder # maybeToOp

130− , _aria =

142+ , _aria =

131− if props.label # opToMaybe # isJust then

143+ if props.label # opToMaybe # isJust then

132− aria # Object.insert "labelledby" labelId

144+ aria # Object.insert "labelledby" labelId

133− else

145+ else

134− aria

146+ aria

135− }

147+ }

136 )

148 )

137 inputContainer =

149 inputContainer =

138 rawContainer

150 rawContainer

139 </ { hasFocus: hasFocus

151 </ { hasFocus: hasFocus

140 , isInvalid: aria # Object.lookup "invalid" <#> (_ == "true") # maybeToOp

152 , isInvalid: aria # Object.lookup "invalid" <#> (_ == "true") # maybeToOp

141 , css: props.css

153 , css: props.css

154+ , ref: parentRef

142 }

155 }

143− /> [ leading # foldMap \l -> div </ { ref: leftIconRef } /> [ l ]

156+ /> [ leading # foldMap \l -> div </ {} /> [ l ]

144 , theInput

157 , theInput

145 , trailing # foldMap \t -> div </ {} /> [ t ]

158 , trailing # foldMap \t -> div </ {} /> [ t ]

146 ]

159 ]

@@ -208,7 +221,7 @@ password =

208 , R.div' </ {}

221 , R.div' </ {}

209 /> [ emotionInput

222 /> [ emotionInput

210 ref

223 ref

211− props { type = HTMLInput.toString <$> props.type # unsafeUnOptional }

224+ (props { type = HTMLInput.toString <$> props.type })

212 { className: "ry-input"

225 { className: "ry-input"

213 , css: Style.input

226 , css: Style.input

214 , type: if hidePassword then "password" else "text"

227 , type: if hidePassword then "password" else "text"

src/Yoga/Block/Atom/Input/View/Label.purs+14−12

@@ -17,8 +17,8 @@ type Props =

17 , isInvalid ∷ Boolean

18 , isFocussed ∷ Boolean

19 , renderLargeLabel ∷ Boolean

20− , leftIconRef ∷ NodeRef

21 , inputRef ∷ NodeRef

20 , inputRef ∷ NodeRef

21+ , parentRef ∷ NodeRef

22 , labelId ∷ String

23 , inputId ∷ String

24 , labelText ∷ NonEmptyString

@@ -30,19 +30,18 @@ component =

30 $ reactComponent "Input Label" \props -> React.do

31 -- Track input bounding box

32 inputBbox /\ setInputBbox <- useState' (zero ∷ DOMRect)

33+ parentBbox /\ setParentBbox <- useState' (zero ∷ DOMRect)

33 useEffectOnce do

34 useEffectOnce do

34 maybeBBox <- getBoundingBoxFromRef props.inputRef

35 maybeBBox <- getBoundingBoxFromRef props.inputRef

35 for_ maybeBBox setInputBbox

36 for_ maybeBBox setInputBbox

36 mempty

37 mempty

37− -- Left icon

38+ useEffectOnce do

38− leftIconBbox /\ setLeftIconBbox <- useState' Nothing

39− useEffectAlways do

40− when (leftIconBbox == Nothing) do

41− maybeBBox <- getBoundingBoxFromRef props.leftIconRef

39+ maybeBBox <- getBoundingBoxFromRef props.parentRef

42− for_ maybeBBox (setLeftIconBbox <<< Just)

40+ for_ maybeBBox setParentBbox

43 mempty

41 mempty

44 -- UI

42 -- UI

45 let

43 let

44+ text = R.text $ NonEmptyString.toString props.labelText

46 result =

45 result =

47 container

46 container

48 [ sharedLayout

47 [ sharedLayout

@@ -52,20 +51,23 @@ component =

52 ]

51 ]

53 ]

52 ]

54 ]

53 ]

55− text = R.text $ NonEmptyString.toString props.labelText

56− sharedLayout = M.animateSharedLayout </ { type: M.switch }

57 container = div </* { className: "ry-input-label-container", css: Style.labelContainer }

54 container = div </* { className: "ry-input-label-container", css: Style.labelContainer }

55+ sharedLayout = M.animateSharedLayout </ { type: M.switch }

58 labelContainer =

56 labelContainer =

59− guard (inputBbox /= zero)

57+ guard (inputBbox /= zero && parentBbox /= zero)

60 $ M.div

58 $ M.div

61 </* { className: if props.renderLargeLabel then "ry-input-label-large" else "ry-input-label-small"

59 </* { className: if props.renderLargeLabel then "ry-input-label-large" else "ry-input-label-small"

60+ , layout: M.layout true

62 , layoutId: M.layoutId "ry-input-label"

61 , layoutId: M.layoutId "ry-input-label"

63 , css:

62 , css:

64 if props.renderLargeLabel then

63 if props.renderLargeLabel then

65− Style.labelLarge { leftIconWidth: leftIconBbox <#> _.width, inputWidth: inputBbox.width }

64+ Style.labelLarge

65+ { left: inputBbox.left - parentBbox.left

66+ , width: inputBbox.width

67+ , top: inputBbox.top - parentBbox.top

68+ }

66 else

69 else

67 Style.labelSmall

70 Style.labelSmall

68− , layout: M.layout true

69 , transition: M.transition { duration: 0.18, ease: "easeOut" }

71 , transition: M.transition { duration: 0.18, ease: "easeOut" }

70 , _data:

72 , _data:

71 Object.fromHomogeneous

73 Object.fromHomogeneous

src/Yoga/Block/Atom/Popover/Story.purs−1

@@ -37,7 +37,6 @@ import Yoga.Block.Container.Style (colour)

37import Yoga.Block.Container.Style as Styles

38import Yoga.Block.Icon.SVG as Icons

39import Yoga.Block.Layout.Box as Box

40−import Yoga.Block.Layout.Cluster as Cluster

41import Yoga.Block.Layout.Stack as Stack

40import Yoga.Block.Layout.Stack as Stack

43default ∷

42default ∷

src/Yoga/Block/Atom/Range/View.purs+26−25

@@ -8,19 +8,19 @@ import React.Basic.DOM.Events as Event

8import React.Basic.Hooks as React

9import Yoga.Block.Atom.Range.Style as Style

11−type PropsF f

11+type PropsF f =

12− = ( className ∷ f String

12+ ( className ∷ f String

13− , min ∷ f Int

13+ , min ∷ f Int

14− , max ∷ f Int

14+ , max ∷ f Int

15− , value ∷ f Int

15+ , value ∷ f Int

16− | Style.Props f InputProps

16+ | Style.Props f (InputPropsF f ())

17− )

17+ )

19−type Props

19+type Props =

20− = PropsF Id

20+ PropsF Id

22−type PropsOptional

22+type PropsOptional =

23− = PropsF OptionalProp

23+ PropsF OptionalProp

25component ∷ ∀ p p_. Union p p_ Props => ReactComponent { | p }

26component = rawComponent

@@ -29,34 +29,35 @@ rawComponent ∷ ∀ p. ReactComponent (Record p)

29rawComponent =

30 mkForwardRefComponent "Range" do

31 \(props ∷ { | PropsOptional }) ref -> React.do

32− let

33− min = props.min ?|| 0

32+ let min = props.min ?|| 0

34− let

35− max = props.max ?|| 100

33+ let max = props.max ?|| 100

36− let

37− v = props.value ?|| ((max - min) / 2)

34+ let v = props.value ?|| ((max - min) / 2)

38− let

39− disabled = props.disabled

35+ let disabled = props.disabled ?|| false

40 value /\ setValue <- useState' v

36 value /\ setValue <- useState' v

41 hasFocus /\ setHasFocus <- useState' false

37 hasFocus /\ setHasFocus <- useState' false

42 pure

38 pure

43 $ div

39 $ div

44 </* { className: "ry-range"

40 </* { className: "ry-range"

45− , css: Style.container <> guard props.disabled Style.inputDisabled

41+ , css: Style.container <> guard disabled Style.inputDisabled

46 , onFocus: handler_ $ setHasFocus true

42 , onFocus: handler_ $ setHasFocus true

47 , onBlur: handler_ $ setHasFocus false

43 , onBlur: handler_ $ setHasFocus false

48− , style: props.style <> css { "--val": value, "--max": max - min }

44+ , style: fold props.style <> css { "--val": value, "--max": max - min }

49 , _data: Object.singleton "testid" "range-testid"

45 , _data: Object.singleton "testid" "range-testid"

50 }

46 }

51− /> [ div </*> { className: "ry-range-filled", css: Style.filled <> guard props.disabled Style.disabled }

47+ /> [ div </*> { className: "ry-range-filled", css: Style.filled <> guard disabled Style.disabled }

52− , div </*> { className: "ry-range-not-filled", css: Style.notFilled <> guard props.disabled Style.disabled }

48+ , div </*> { className: "ry-range-not-filled", css: Style.notFilled <> guard disabled Style.disabled }

53 , guard hasFocus do

49 , guard hasFocus do

54 div </*> { className: "ry-range-focus-circle", css: Style.focusCircle }

50 div </*> { className: "ry-range-focus-circle", css: Style.focusCircle }

55 , emotionInput

51 , emotionInput

56 ref

52 ref

53+ ( props

54+ { max = show max # asOptional

55+ , min = show min # asOptional

57− (props { max = show max, min = show min, value = show value })

56+ , value = show value # asOptional

57+ }

58+ )

58 { className: "ry-range-thumb " <>? props.className

59 { className: "ry-range-thumb " <>? props.className

59− , css: Style.range props <> guard props.disabled Style.inputDisabled <>? props.css

60+ , css: Style.range props <> guard disabled Style.inputDisabled <>? props.css

60 , type: "range"

61 , type: "range"

61 , onChange: handler Event.targetValue ((_ >>= Int.fromString) >>> (foldMap setValue))

62 , onChange: handler Event.targetValue ((_ >>= Int.fromString) >>> (foldMap setValue))

62 }

63 }

src/Yoga/Block/Internal.purs+447−445

@@ -38,14 +38,13 @@ import Foreign.Object (Object)

38import Prim.Row (class Lacks, class Union)

39import Prim.Row as Row

40import Prim.RowList as RL

41−import React.Basic.DOM (CSS, Props_input, Props_button, unsafeCreateDOMComponent)

41+import React.Basic.DOM (CSS, unsafeCreateDOMComponent)

42import React.Basic.Emotion (Style)

43import React.Basic.Emotion as E

44import React.Basic.Events (EventHandler)

45import React.Basic.Hooks (JSX, ReactComponent, Ref, Render, readRefMaybe)

46import Record.Extra (class Keys, keys)

47import Type.Data.Row (RProxy(..))

48−import Type.Row (type (+))

49import Unsafe.Coerce (unsafeCoerce)

48import Unsafe.Coerce (unsafeCoerce)

50import Untagged.Union (UndefinedOr, uorToMaybe)

49import Untagged.Union (UndefinedOr, uorToMaybe)

51import Web.DOM (Node)

50import Web.DOM (Node)

@@ -68,8 +67,8 @@ foreign import mkForwardRefComponentEffect ∷

69foreign import createRef ∷ ∀ a. Effect (Ref a)

68foreign import createRef ∷ ∀ a. Effect (Ref a)

71−type NodeRef

70+type NodeRef =

72− = Ref (Nullable Node)

71+ Ref (Nullable Node)

74getBoundingBoxFromRef ∷ Ref (Nullable Node) -> Effect (Maybe DOMRect)

73getBoundingBoxFromRef ∷ Ref (Nullable Node) -> Effect (Maybe DOMRect)

75getBoundingBoxFromRef itemRef = do

74getBoundingBoxFromRef itemRef = do

@@ -85,8 +84,8 @@ getHTMLElementFromRef itemRef =

85forwardedRefAsMaybe ∷ ∀ a. Ref a -> Maybe (Ref a)

84forwardedRefAsMaybe ∷ ∀ a. Ref a -> Maybe (Ref a)

86forwardedRefAsMaybe r = safelyWrapped # uorToMaybe >>= Nullable.toMaybe

85forwardedRefAsMaybe r = safelyWrapped # uorToMaybe >>= Nullable.toMaybe

87 where

86 where

88− safelyWrapped ∷ UndefinedOr (Nullable (Ref a))

87+ safelyWrapped ∷ UndefinedOr (Nullable (Ref a))

89− safelyWrapped = unsafeCoerce r

88+ safelyWrapped = unsafeCoerce r

91foreign import unsafeUnionDroppingUndefined ∷ ∀ r1 r2 r3. Record r1 -> Record r2 -> Record r3

90foreign import unsafeUnionDroppingUndefined ∷ ∀ r1 r2 r3. Record r1 -> Record r2 -> Record r3

@@ -138,7 +137,7 @@ pickDefined ∷

138 { ref ∷ Ref (Nullable Node) | b }

137 { ref ∷ Ref (Nullable Node) | b }

139pickDefined ref = runFn3 pickDefinedFn ref ks

138pickDefined ref = runFn3 pickDefinedFn ref ks

140 where

139 where

141− ks = Array.fromFoldable $ keys (RProxy ∷ RProxy b)

140+ ks = Array.fromFoldable $ keys (RProxy ∷ RProxy b)

142

141

143-- [TODO] Delete?

142-- [TODO] Delete?

144emotionInputKeyed_ ∷

143emotionInputKeyed_ ∷

@@ -157,7 +156,7 @@ emotionInputKeyed_ = unsafeEmotionKeyed unsafeInput

157emotionInput_ ∷

156emotionInput_ ∷

158 ∀ props props_.

157 ∀ props props_.

159 Lacks "ref" props =>

158 Lacks "ref" props =>

160− Union props props_ ( className ∷ String, css ∷ Style, ref ∷ Ref (Nullable Node) | InputProps ) =>

159+ Union props props_ ( className ∷ String, css ∷ Style, ref ∷ Ref (Nullable Node) | InputPropsF Id () ) =>

161 { | InputProps } ->

160 { | InputProps } ->

162 { className ∷ String

161 { className ∷ String

163 , css ∷ Style

162 , css ∷ Style

@@ -171,13 +170,16 @@ emotionInput ∷

171 Lacks "ref" props =>

170 Lacks "ref" props =>

172 Union props props_ ( className ∷ String, css ∷ Style, ref ∷ Ref (Nullable Node) | InputProps ) =>

171 Union props props_ ( className ∷ String, css ∷ Style, ref ∷ Ref (Nullable Node) | InputProps ) =>

173 Ref (Nullable Node) ->

172 Ref (Nullable Node) ->

174− { | InputPropsF Id more } ->

173+ { | InputPropsF OptionalProp more } ->

175 { className ∷ String

174 { className ∷ String

176 , css ∷ Style

175 , css ∷ Style

177 | props

176 | props

178 } ->

177 } ->

179 JSX

178 JSX

180−emotionInput ref = emotionInput_ <<< pickDefined ref

179+emotionInput ref = emotionInput_ <<< pickDefined ref <<< coerceUnOptional

180+ where

181+ coerceUnOptional ∷ { | InputPropsF OptionalProp more } -> { | InputPropsF Id more }

182+ coerceUnOptional = unsafeCoerce

181

183

182unsafeInput ∷ ∀ r. ReactComponent (Record r)

184unsafeInput ∷ ∀ r. ReactComponent (Record r)

183unsafeInput = dangerous "input"

185unsafeInput = dangerous "input"

@@ -215,443 +217,443 @@ dangerous = unsafePerformEffect <<< unsafeCreateDOMComponent

215

217

216-- type DivProps =

218-- type DivProps =

217-- Props_div

219-- Props_div

218−type DivProps

220+type DivProps =

219− = DivPropsF Id ()

221+ DivPropsF Id ()

220

222

221−type DivPropsF f more

223+type DivPropsF f more =

222− = ( _aria ∷ f (Object String)

224+ ( _aria ∷ f (Object String)

223− , _data ∷ f (Object String)

225+ , _data ∷ f (Object String)

224− , about ∷ f String

226+ , about ∷ f String

225− , acceptCharset ∷ f String

227+ , acceptCharset ∷ f String

226− , accessKey ∷ f String

228+ , accessKey ∷ f String

227− , allowFullScreen ∷ f Boolean

229+ , allowFullScreen ∷ f Boolean

228− , autoFocus ∷ f Boolean

230+ , autoFocus ∷ f Boolean

229− , autoPlay ∷ f Boolean

231+ , autoPlay ∷ f Boolean

230− , capture ∷ f Boolean

232+ , capture ∷ f Boolean

231− , cellPadding ∷ f String

233+ , cellPadding ∷ f String

232− , cellSpacing ∷ f String

234+ , cellSpacing ∷ f String

233− , charSet ∷ f String

235+ , charSet ∷ f String

234− , children ∷ f (Array JSX)

236+ , children ∷ f (Array JSX)

235− , classID ∷ f String

237+ , classID ∷ f String

236− , colSpan ∷ f Int

238+ , colSpan ∷ f Int

237− , contentEditable ∷ f Boolean

239+ , contentEditable ∷ f Boolean

238− , contextMenu ∷ f String

240+ , contextMenu ∷ f String

239− , crossOrigin ∷ f String

241+ , crossOrigin ∷ f String

240− , dangerouslySetInnerHTML ∷ f { __html ∷ f String }

242+ , dangerouslySetInnerHTML ∷ f { __html ∷ f String }

241− , datatype ∷ f String

243+ , datatype ∷ f String

242− , dateTime ∷ f String

244+ , dateTime ∷ f String

243− , dir ∷ f String

245+ , dir ∷ f String

244− , draggable ∷ f Boolean

246+ , draggable ∷ f Boolean

245− , encType ∷ f String

247+ , encType ∷ f String

246− , formAction ∷ f String

248+ , formAction ∷ f String

247− , formEncType ∷ f String

249+ , formEncType ∷ f String

248− , formMethod ∷ f String

250+ , formMethod ∷ f String

249− , formNoValidate ∷ f Boolean

251+ , formNoValidate ∷ f Boolean

250− , formTarget ∷ f String

252+ , formTarget ∷ f String

251− , frameBorder ∷ f String

253+ , frameBorder ∷ f String

252− , hidden ∷ f Boolean

254+ , hidden ∷ f Boolean

253− , hrefLang ∷ f String

255+ , hrefLang ∷ f String

254− , htmlFor ∷ f String

256+ , htmlFor ∷ f String

255− , httpEquiv ∷ f String

257+ , httpEquiv ∷ f String

256− , icon ∷ f String

258+ , icon ∷ f String

257− , id ∷ f String

259+ , id ∷ f String

258− , inlist ∷ f String

260+ , inlist ∷ f String

259− , inputMode ∷ f String

261+ , inputMode ∷ f String

260− , is ∷ f String

262+ , is ∷ f String

261− , itemID ∷ f String

263+ , itemID ∷ f String

262− , itemProp ∷ f String

264+ , itemProp ∷ f String

263− , itemRef ∷ f String

265+ , itemRef ∷ f String

264− , itemScope ∷ f Boolean

266+ , itemScope ∷ f Boolean

265− , itemType ∷ f String

267+ , itemType ∷ f String

266− , keyParams ∷ f String

268+ , keyParams ∷ f String

267− , keyType ∷ f String

269+ , keyType ∷ f String

268− , lang ∷ f String

270+ , lang ∷ f String

269− , marginHeight ∷ f String

271+ , marginHeight ∷ f String

270− , marginWidth ∷ f String

272+ , marginWidth ∷ f String

271− , maxLength ∷ f Int

273+ , maxLength ∷ f Int

272− , mediaGroup ∷ f String

274+ , mediaGroup ∷ f String

273− , minLength ∷ f Int

275+ , minLength ∷ f Int

274− , noValidate ∷ f Boolean

276+ , noValidate ∷ f Boolean

275− , onAnimationEnd ∷ f EventHandler

277+ , onAnimationEnd ∷ f EventHandler

276− , onAnimationIteration ∷ f EventHandler

278+ , onAnimationIteration ∷ f EventHandler

277− , onAnimationStart ∷ f EventHandler

279+ , onAnimationStart ∷ f EventHandler

278− , onBlur ∷ f EventHandler

280+ , onBlur ∷ f EventHandler

279− , onClick ∷ f EventHandler

281+ , onClick ∷ f EventHandler

280− , onCompositionEnd ∷ f EventHandler

282+ , onCompositionEnd ∷ f EventHandler

281− , onCompositionStart ∷ f EventHandler

283+ , onCompositionStart ∷ f EventHandler

282− , onCompositionUpdate ∷ f EventHandler

284+ , onCompositionUpdate ∷ f EventHandler

283− , onContextMenu ∷ f EventHandler

285+ , onContextMenu ∷ f EventHandler

284− , onCopy ∷ f EventHandler

286+ , onCopy ∷ f EventHandler

285− , onCut ∷ f EventHandler

287+ , onCut ∷ f EventHandler

286− , onDoubleClick ∷ f EventHandler

288+ , onDoubleClick ∷ f EventHandler

287− , onDrag ∷ f EventHandler

289+ , onDrag ∷ f EventHandler

288− , onDragEnd ∷ f EventHandler

290+ , onDragEnd ∷ f EventHandler

289− , onDragEnter ∷ f EventHandler

291+ , onDragEnter ∷ f EventHandler

290− , onDragExit ∷ f EventHandler

292+ , onDragExit ∷ f EventHandler

291− , onDragLeave ∷ f EventHandler

293+ , onDragLeave ∷ f EventHandler

292− , onDragOver ∷ f EventHandler

294+ , onDragOver ∷ f EventHandler

293− , onDragStart ∷ f EventHandler

295+ , onDragStart ∷ f EventHandler

294− , onDrop ∷ f EventHandler

296+ , onDrop ∷ f EventHandler

295− , onFocus ∷ f EventHandler

297+ , onFocus ∷ f EventHandler

296− , onGotPointerCapture ∷ f EventHandler

298+ , onGotPointerCapture ∷ f EventHandler

297− , onInvalid ∷ f EventHandler

299+ , onInvalid ∷ f EventHandler

298− , onKeyDown ∷ f EventHandler

300+ , onKeyDown ∷ f EventHandler

299− , onKeyPress ∷ f EventHandler

301+ , onKeyPress ∷ f EventHandler

300− , onKeyUp ∷ f EventHandler

302+ , onKeyUp ∷ f EventHandler

301− , onLostPointerCapture ∷ f EventHandler

303+ , onLostPointerCapture ∷ f EventHandler

302− , onMouseDown ∷ f EventHandler

304+ , onMouseDown ∷ f EventHandler

303− , onMouseEnter ∷ f EventHandler

305+ , onMouseEnter ∷ f EventHandler

304− , onMouseLeave ∷ f EventHandler

306+ , onMouseLeave ∷ f EventHandler

305− , onMouseMove ∷ f EventHandler

307+ , onMouseMove ∷ f EventHandler

306− , onMouseOut ∷ f EventHandler

308+ , onMouseOut ∷ f EventHandler

307− , onMouseOver ∷ f EventHandler

309+ , onMouseOver ∷ f EventHandler

308− , onMouseUp ∷ f EventHandler

310+ , onMouseUp ∷ f EventHandler

309− , onPaste ∷ f EventHandler

311+ , onPaste ∷ f EventHandler

310− , onPointerCancel ∷ f EventHandler

312+ , onPointerCancel ∷ f EventHandler

311− , onPointerDown ∷ f EventHandler

313+ , onPointerDown ∷ f EventHandler

312− , onPointerEnter ∷ f EventHandler

314+ , onPointerEnter ∷ f EventHandler

313− , onPointerLeave ∷ f EventHandler

315+ , onPointerLeave ∷ f EventHandler

314− , onPointerMove ∷ f EventHandler

316+ , onPointerMove ∷ f EventHandler

315− , onPointerOut ∷ f EventHandler

317+ , onPointerOut ∷ f EventHandler

316− , onPointerOver ∷ f EventHandler

318+ , onPointerOver ∷ f EventHandler

317− , onPointerUp ∷ f EventHandler

319+ , onPointerUp ∷ f EventHandler

318− , onSelect ∷ f EventHandler

320+ , onSelect ∷ f EventHandler

319− , onSubmit ∷ f EventHandler

321+ , onSubmit ∷ f EventHandler

320− , onTouchCancel ∷ f EventHandler

322+ , onTouchCancel ∷ f EventHandler

321− , onTouchEnd ∷ f EventHandler

323+ , onTouchEnd ∷ f EventHandler

322− , onTouchMove ∷ f EventHandler

324+ , onTouchMove ∷ f EventHandler

323− , onTouchStart ∷ f EventHandler

325+ , onTouchStart ∷ f EventHandler

324− , onTransitionEnd ∷ f EventHandler

326+ , onTransitionEnd ∷ f EventHandler

325− , onWheel ∷ f EventHandler

327+ , onWheel ∷ f EventHandler

326− , prefix ∷ f String

328+ , prefix ∷ f String

327− , property ∷ f String

329+ , property ∷ f String

328− , radioGroup ∷ f String

330+ , radioGroup ∷ f String

329− , readOnly ∷ f Boolean

331+ , readOnly ∷ f Boolean

330− , ref ∷ f (Ref (Nullable Node))

332+ , ref ∷ f (Ref (Nullable Node))

331− , resource ∷ f String

333+ , resource ∷ f String

332− , role ∷ f String

334+ , role ∷ f String

333− , rowSpan ∷ f Int

335+ , rowSpan ∷ f Int

334− , scoped ∷ f Boolean

336+ , scoped ∷ f Boolean

335− , seamless ∷ f Boolean

337+ , seamless ∷ f Boolean

336− , security ∷ f String

338+ , security ∷ f String

337− , spellCheck ∷ f Boolean

339+ , spellCheck ∷ f Boolean

338− , srcDoc ∷ f JSX

340+ , srcDoc ∷ f JSX

339− , srcLang ∷ f String

341+ , srcLang ∷ f String

340− , srcSet ∷ f String

342+ , srcSet ∷ f String

341− , style ∷ f CSS

343+ , style ∷ f CSS

342− , suppressContentEditableWarning ∷ f Boolean

344+ , suppressContentEditableWarning ∷ f Boolean

343− , tabIndex ∷ f Int

345+ , tabIndex ∷ f Int

344− , title ∷ f String

346+ , title ∷ f String

345− , typeof ∷ f String

347+ , typeof ∷ f String

346− , unselectable ∷ f Boolean

348+ , unselectable ∷ f Boolean

347− , useMap ∷ f String

349+ , useMap ∷ f String

348− , vocab ∷ f String

350+ , vocab ∷ f String

349− , wmode ∷ f String

351+ , wmode ∷ f String

350− | more

352+ | more

351− )

353+ )

352

354

353−type InputProps

355+type InputProps =

354− = InputPropsF Id ()

356+ InputPropsF Id ()

355

357

356−type InputPropsF f more

358+type InputPropsF f more =

357− = ( _aria ∷ f (Object String)

359+ ( _aria ∷ f (Object String)

358− , _data ∷ f (Object String)

360+ , _data ∷ f (Object String)

359− , about ∷ f String

361+ , about ∷ f String

360− , accept ∷ f String

362+ , accept ∷ f String

361− , acceptCharset ∷ f String

363+ , acceptCharset ∷ f String

362− , accessKey ∷ f String

364+ , accessKey ∷ f String

363− , allowFullScreen ∷ f Boolean

365+ , allowFullScreen ∷ f Boolean

364− , alt ∷ f String

366+ , alt ∷ f String

365− , autoCapitalize ∷ f String

367+ , autoCapitalize ∷ f String

366− , autoComplete ∷ f String

368+ , autoComplete ∷ f String

367− , autoCorrect ∷ f String

369+ , autoCorrect ∷ f String

368− , autoFocus ∷ f Boolean

370+ , autoFocus ∷ f Boolean

369− , autoPlay ∷ f Boolean

371+ , autoPlay ∷ f Boolean

370− , autoSave ∷ f String

372+ , autoSave ∷ f String

371− , capture ∷ f Boolean

373+ , capture ∷ f Boolean

372− , cellPadding ∷ f String

374+ , cellPadding ∷ f String

373− , cellSpacing ∷ f String

375+ , cellSpacing ∷ f String

374− , charSet ∷ f String

376+ , charSet ∷ f String

375− , checked ∷ f Boolean

377+ , checked ∷ f Boolean

376− , classID ∷ f String

378+ , classID ∷ f String

377− , colSpan ∷ f Int

379+ , colSpan ∷ f Int

378− , contentEditable ∷ f Boolean

380+ , contentEditable ∷ f Boolean

379− , contextMenu ∷ f String

381+ , contextMenu ∷ f String

380− , crossOrigin ∷ f String

382+ , crossOrigin ∷ f String

381− , dangerouslySetInnerHTML ∷ f { __html ∷ f String }

383+ , dangerouslySetInnerHTML ∷ f { __html ∷ f String }

382− , datatype ∷ f String

384+ , datatype ∷ f String

383− , dateTime ∷ f String

385+ , dateTime ∷ f String

384− , defaultChecked ∷ f String

386+ , defaultChecked ∷ f String

385− , defaultValue ∷ f String

387+ , defaultValue ∷ f String

386− , dir ∷ f String

388+ , dir ∷ f String

387− , disabled ∷ f Boolean

389+ , disabled ∷ f Boolean

388− , draggable ∷ f Boolean

390+ , draggable ∷ f Boolean

389− , encType ∷ f String

391+ , encType ∷ f String

390− , form ∷ f String

392+ , form ∷ f String

391− , formAction ∷ f String

393+ , formAction ∷ f String

392− , formEncType ∷ f String

394+ , formEncType ∷ f String

393− , formMethod ∷ f String

395+ , formMethod ∷ f String

394− , formNoValidate ∷ f Boolean

396+ , formNoValidate ∷ f Boolean

395− , formTarget ∷ f String

397+ , formTarget ∷ f String

396− , frameBorder ∷ f String

398+ , frameBorder ∷ f String

397− , height ∷ f String

399+ , height ∷ f String

398− , hidden ∷ f Boolean

400+ , hidden ∷ f Boolean

399− , hrefLang ∷ f String

401+ , hrefLang ∷ f String

400− , htmlFor ∷ f String

402+ , htmlFor ∷ f String

401− , httpEquiv ∷ f String

403+ , httpEquiv ∷ f String

402− , icon ∷ f String

404+ , icon ∷ f String

403− , id ∷ f String

405+ , id ∷ f String

404− , inlist ∷ f String

406+ , inlist ∷ f String

405− , inputMode ∷ f String

407+ , inputMode ∷ f String

406− , is ∷ f String

408+ , is ∷ f String

407− , itemID ∷ f String

409+ , itemID ∷ f String

408− , itemProp ∷ f String

410+ , itemProp ∷ f String

409− , itemRef ∷ f String

411+ , itemRef ∷ f String

410− , itemScope ∷ f Boolean

412+ , itemScope ∷ f Boolean

411− , itemType ∷ f String

413+ , itemType ∷ f String

412− , keyParams ∷ f String

414+ , keyParams ∷ f String

413− , keyType ∷ f String

415+ , keyType ∷ f String

414− , lang ∷ f String

416+ , lang ∷ f String

415− , list ∷ f String

417+ , list ∷ f String

416− , marginHeight ∷ f String

418+ , marginHeight ∷ f String

417− , marginWidth ∷ f String

419+ , marginWidth ∷ f String

418− , maxLength ∷ f Int

420+ , maxLength ∷ f Int

419− , mediaGroup ∷ f String

421+ , mediaGroup ∷ f String

420− , minLength ∷ f Int

422+ , minLength ∷ f Int

421− , multiple ∷ f Boolean

423+ , multiple ∷ f Boolean

422− , name ∷ f String

424+ , name ∷ f String

423− , noValidate ∷ f Boolean

425+ , noValidate ∷ f Boolean

424− , onAnimationEnd ∷ f EventHandler

426+ , onAnimationEnd ∷ f EventHandler

425− , onAnimationIteration ∷ f EventHandler

427+ , onAnimationIteration ∷ f EventHandler

426− , onAnimationStart ∷ f EventHandler

428+ , onAnimationStart ∷ f EventHandler

427− , onBlur ∷ f EventHandler

429+ , onBlur ∷ f EventHandler

428− , onChange ∷ f EventHandler

430+ , onChange ∷ f EventHandler

429− , onClick ∷ f EventHandler

431+ , onClick ∷ f EventHandler

430− , onCompositionEnd ∷ f EventHandler

432+ , onCompositionEnd ∷ f EventHandler

431− , onCompositionStart ∷ f EventHandler

433+ , onCompositionStart ∷ f EventHandler

432− , onCompositionUpdate ∷ f EventHandler

434+ , onCompositionUpdate ∷ f EventHandler

433− , onContextMenu ∷ f EventHandler

435+ , onContextMenu ∷ f EventHandler

434− , onCopy ∷ f EventHandler

436+ , onCopy ∷ f EventHandler

435− , onCut ∷ f EventHandler

437+ , onCut ∷ f EventHandler

436− , onDoubleClick ∷ f EventHandler

438+ , onDoubleClick ∷ f EventHandler

437− , onDrag ∷ f EventHandler

439+ , onDrag ∷ f EventHandler

438− , onDragEnd ∷ f EventHandler

440+ , onDragEnd ∷ f EventHandler

439− , onDragEnter ∷ f EventHandler

441+ , onDragEnter ∷ f EventHandler

440− , onDragExit ∷ f EventHandler

442+ , onDragExit ∷ f EventHandler

441− , onDragLeave ∷ f EventHandler

443+ , onDragLeave ∷ f EventHandler

442− , onDragOver ∷ f EventHandler

444+ , onDragOver ∷ f EventHandler

443− , onDragStart ∷ f EventHandler

445+ , onDragStart ∷ f EventHandler

444− , onDrop ∷ f EventHandler

446+ , onDrop ∷ f EventHandler

445− , onFocus ∷ f EventHandler

447+ , onFocus ∷ f EventHandler

446− , onGotPointerCapture ∷ f EventHandler

448+ , onGotPointerCapture ∷ f EventHandler

447− , onInvalid ∷ f EventHandler

449+ , onInvalid ∷ f EventHandler

448− , onKeyDown ∷ f EventHandler

450+ , onKeyDown ∷ f EventHandler

449− , onKeyPress ∷ f EventHandler

451+ , onKeyPress ∷ f EventHandler

450− , onKeyUp ∷ f EventHandler

452+ , onKeyUp ∷ f EventHandler

451− , onLostPointerCapture ∷ f EventHandler

453+ , onLostPointerCapture ∷ f EventHandler

452− , onMouseDown ∷ f EventHandler

454+ , onMouseDown ∷ f EventHandler

453− , onMouseEnter ∷ f EventHandler

455+ , onMouseEnter ∷ f EventHandler

454− , onMouseLeave ∷ f EventHandler

456+ , onMouseLeave ∷ f EventHandler

455− , onMouseMove ∷ f EventHandler

457+ , onMouseMove ∷ f EventHandler

456− , onMouseOut ∷ f EventHandler

458+ , onMouseOut ∷ f EventHandler

457− , onMouseOver ∷ f EventHandler

459+ , onMouseOver ∷ f EventHandler

458− , onMouseUp ∷ f EventHandler

460+ , onMouseUp ∷ f EventHandler

459− , onPaste ∷ f EventHandler

461+ , onPaste ∷ f EventHandler

460− , onPointerCancel ∷ f EventHandler

462+ , onPointerCancel ∷ f EventHandler

461− , onPointerDown ∷ f EventHandler

463+ , onPointerDown ∷ f EventHandler

462− , onPointerEnter ∷ f EventHandler

464+ , onPointerEnter ∷ f EventHandler

463− , onPointerLeave ∷ f EventHandler

465+ , onPointerLeave ∷ f EventHandler

464− , onPointerMove ∷ f EventHandler

466+ , onPointerMove ∷ f EventHandler

465− , onPointerOut ∷ f EventHandler

467+ , onPointerOut ∷ f EventHandler

466− , onPointerOver ∷ f EventHandler

468+ , onPointerOver ∷ f EventHandler

467− , onPointerUp ∷ f EventHandler

469+ , onPointerUp ∷ f EventHandler

468− , onSelect ∷ f EventHandler

470+ , onSelect ∷ f EventHandler

469− , onSubmit ∷ f EventHandler

471+ , onSubmit ∷ f EventHandler

470− , onTouchCancel ∷ f EventHandler

472+ , onTouchCancel ∷ f EventHandler

471− , onTouchEnd ∷ f EventHandler

473+ , onTouchEnd ∷ f EventHandler

472− , onTouchMove ∷ f EventHandler

474+ , onTouchMove ∷ f EventHandler

473− , onTouchStart ∷ f EventHandler

475+ , onTouchStart ∷ f EventHandler

474− , onTransitionEnd ∷ f EventHandler

476+ , onTransitionEnd ∷ f EventHandler

475− , onWheel ∷ f EventHandler

477+ , onWheel ∷ f EventHandler

476− , pattern ∷ f String

478+ , pattern ∷ f String

477− , placeholder ∷ f String

479+ , placeholder ∷ f String

478− , prefix ∷ f String

480+ , prefix ∷ f String

479− , property ∷ f String

481+ , property ∷ f String

480− , radioGroup ∷ f String

482+ , radioGroup ∷ f String

481− , ref ∷ f (Ref (Nullable Node))

483+ , ref ∷ f (Ref (Nullable Node))

482− , readOnly ∷ f Boolean

484+ , readOnly ∷ f Boolean

483− , required ∷ f Boolean

485+ , required ∷ f Boolean

484− , resource ∷ f String

486+ , resource ∷ f String

485− , results ∷ f String

487+ , results ∷ f String

486− , role ∷ f String

488+ , role ∷ f String

487− , rowSpan ∷ f Int

489+ , rowSpan ∷ f Int

488− , scoped ∷ f Boolean

490+ , scoped ∷ f Boolean

489− , seamless ∷ f Boolean

491+ , seamless ∷ f Boolean

490− , security ∷ f String

492+ , security ∷ f String

491− , size ∷ f Int

493+ , size ∷ f Int

492− , spellCheck ∷ f Boolean

494+ , spellCheck ∷ f Boolean

493− , src ∷ f String

495+ , src ∷ f String

494− , srcDoc ∷ f JSX

496+ , srcDoc ∷ f JSX

495− , srcLang ∷ f String

497+ , srcLang ∷ f String

496− , srcSet ∷ f String

498+ , srcSet ∷ f String

497− , step ∷ f String

499+ , step ∷ f String

498− , style ∷ f CSS

500+ , style ∷ f CSS

499− , suppressContentEditableWarning ∷ f Boolean

501+ , suppressContentEditableWarning ∷ f Boolean

500− , tabIndex ∷ f Int

502+ , tabIndex ∷ f Int

501− , title ∷ f String

503+ , title ∷ f String

502− , title ∷ f String

504+ , title ∷ f String

503− , type ∷ f String

505+ , type ∷ f String

504− , typeof ∷ f String

506+ , typeof ∷ f String

505− , unselectable ∷ f Boolean

507+ , unselectable ∷ f Boolean

506− , useMap ∷ f String

508+ , useMap ∷ f String

507− , value ∷ f String

509+ , value ∷ f String

508− , vocab ∷ f String

510+ , vocab ∷ f String

509− , width ∷ f String

511+ , width ∷ f String

510− , wmode ∷ f String

512+ , wmode ∷ f String

511− , min ∷ f (String)

513+ , min ∷ f (String)

512− , max ∷ f (String)

514+ , max ∷ f (String)

513− | more

515+ | more

514− )

516+ )

515

517

516−type ButtonProps

518+type ButtonProps =

517− = ButtonPropsF Id ()

519+ ButtonPropsF Id ()

518

520

519−type ButtonPropsF f more

521+type ButtonPropsF f more =

520− = ( _aria :: f (Object String)

522+ ( _aria ∷ f (Object String)

521− , _data :: f (Object String)

523+ , _data ∷ f (Object String)

522− , about :: f String

524+ , about ∷ f String

523− , acceptCharset :: f String

525+ , acceptCharset ∷ f String

524− , accessKey :: f String

526+ , accessKey ∷ f String

525− , allowFullScreen :: f Boolean

527+ , allowFullScreen ∷ f Boolean

526− , allowTransparency :: f Boolean

528+ , allowTransparency ∷ f Boolean

527− , autoFocus :: f Boolean

529+ , autoFocus ∷ f Boolean

528− , autoPlay :: f Boolean

530+ , autoPlay ∷ f Boolean

529− , capture :: f Boolean

531+ , capture ∷ f Boolean

530− , cellPadding :: f String

532+ , cellPadding ∷ f String

531− , cellSpacing :: f String

533+ , cellSpacing ∷ f String

532− , charSet :: f String

534+ , charSet ∷ f String

533− , children :: f (Array JSX)

535+ , children ∷ f (Array JSX)

534− , classID :: f String

536+ , classID ∷ f String

535− , className :: f String

537+ , className ∷ f String

536− , colSpan :: f Int

538+ , colSpan ∷ f Int

537− , contentEditable :: f Boolean

539+ , contentEditable ∷ f Boolean

538− , contextMenu :: f String

540+ , contextMenu ∷ f String

539− , crossOrigin :: f String

541+ , crossOrigin ∷ f String

540− , dangerouslySetInnerHTML :: f { __html :: String }

542+ , dangerouslySetInnerHTML ∷ f { __html ∷ String }

541− , datatype :: f String

543+ , datatype ∷ f String

542− , dateTime :: f String

544+ , dateTime ∷ f String

543− , dir :: f String

545+ , dir ∷ f String

544− , disabled :: f Boolean

546+ , disabled ∷ f Boolean

545− , draggable :: f Boolean

547+ , draggable ∷ f Boolean

546− , encType :: f String

548+ , encType ∷ f String

547− , form :: f String

549+ , form ∷ f String

548− , formAction :: f String

550+ , formAction ∷ f String

549− , formEncType :: f String

551+ , formEncType ∷ f String

550− , formMethod :: f String

552+ , formMethod ∷ f String

551− , formNoValidate :: f Boolean

553+ , formNoValidate ∷ f Boolean

552− , formTarget :: f String

554+ , formTarget ∷ f String

553− , frameBorder :: f String

555+ , frameBorder ∷ f String

554− , hidden :: f Boolean

556+ , hidden ∷ f Boolean

555− , hrefLang :: f String

557+ , hrefLang ∷ f String

556− , htmlFor :: f String

558+ , htmlFor ∷ f String

557− , httpEquiv :: f String

559+ , httpEquiv ∷ f String

558− , icon :: f String

560+ , icon ∷ f String

559− , id :: f String

561+ , id ∷ f String

560− , inlist :: f String

562+ , inlist ∷ f String

561− , inputMode :: f String

563+ , inputMode ∷ f String

562− , is :: f String

564+ , is ∷ f String

563− , itemID :: f String

565+ , itemID ∷ f String

564− , itemProp :: f String

566+ , itemProp ∷ f String

565− , itemRef :: f String

567+ , itemRef ∷ f String

566− , itemScope :: f Boolean

568+ , itemScope ∷ f Boolean

567− , itemType :: f String

569+ , itemType ∷ f String

568− , key :: f String

570+ , key ∷ f String

569− , keyParams :: f String

571+ , keyParams ∷ f String

570− , keyType :: f String

572+ , keyType ∷ f String

571− , lang :: f String

573+ , lang ∷ f String

572− , marginHeight :: f String

574+ , marginHeight ∷ f String

573− , marginWidth :: f String

575+ , marginWidth ∷ f String

574− , maxLength :: f Int

576+ , maxLength ∷ f Int

575− , mediaGroup :: f String

577+ , mediaGroup ∷ f String

576− , minLength :: f Int

578+ , minLength ∷ f Int

577− , name :: f String

579+ , name ∷ f String

578− , noValidate :: f Boolean

580+ , noValidate ∷ f Boolean

579− , onAnimationEnd :: f EventHandler

581+ , onAnimationEnd ∷ f EventHandler

580− , onAnimationIteration :: f EventHandler

582+ , onAnimationIteration ∷ f EventHandler

581− , onAnimationStart :: f EventHandler

583+ , onAnimationStart ∷ f EventHandler

582− , onBlur :: f EventHandler

584+ , onBlur ∷ f EventHandler

583− , onClick :: f EventHandler

585+ , onClick ∷ f EventHandler

584− , onCompositionEnd :: f EventHandler

586+ , onCompositionEnd ∷ f EventHandler

585− , onCompositionStart :: f EventHandler

587+ , onCompositionStart ∷ f EventHandler

586− , onCompositionUpdate :: f EventHandler

588+ , onCompositionUpdate ∷ f EventHandler

587− , onContextMenu :: f EventHandler

589+ , onContextMenu ∷ f EventHandler

588− , onCopy :: f EventHandler

590+ , onCopy ∷ f EventHandler

589− , onCut :: f EventHandler

591+ , onCut ∷ f EventHandler

590− , onDoubleClick :: f EventHandler

592+ , onDoubleClick ∷ f EventHandler

591− , onDrag :: f EventHandler

593+ , onDrag ∷ f EventHandler

592− , onDragEnd :: f EventHandler

594+ , onDragEnd ∷ f EventHandler

593− , onDragEnter :: f EventHandler

595+ , onDragEnter ∷ f EventHandler

594− , onDragExit :: f EventHandler

596+ , onDragExit ∷ f EventHandler

595− , onDragLeave :: f EventHandler

597+ , onDragLeave ∷ f EventHandler

596− , onDragOver :: f EventHandler

598+ , onDragOver ∷ f EventHandler

597− , onDragStart :: f EventHandler

599+ , onDragStart ∷ f EventHandler

598− , onDrop :: f EventHandler

600+ , onDrop ∷ f EventHandler

599− , onFocus :: f EventHandler

601+ , onFocus ∷ f EventHandler

600− , onGotPointerCapture :: f EventHandler

602+ , onGotPointerCapture ∷ f EventHandler

601− , onInvalid :: f EventHandler

603+ , onInvalid ∷ f EventHandler

602− , onKeyDown :: f EventHandler

604+ , onKeyDown ∷ f EventHandler

603− , onKeyPress :: f EventHandler

605+ , onKeyPress ∷ f EventHandler

604− , onKeyUp :: f EventHandler

606+ , onKeyUp ∷ f EventHandler

605− , onLostPointerCapture :: f EventHandler

607+ , onLostPointerCapture ∷ f EventHandler

606− , onMouseDown :: f EventHandler

608+ , onMouseDown ∷ f EventHandler

607− , onMouseEnter :: f EventHandler

609+ , onMouseEnter ∷ f EventHandler

608− , onMouseLeave :: f EventHandler

610+ , onMouseLeave ∷ f EventHandler

609− , onMouseMove :: f EventHandler

611+ , onMouseMove ∷ f EventHandler

610− , onMouseOut :: f EventHandler

612+ , onMouseOut ∷ f EventHandler

611− , onMouseOver :: f EventHandler

613+ , onMouseOver ∷ f EventHandler

612− , onMouseUp :: f EventHandler

614+ , onMouseUp ∷ f EventHandler

613− , onPaste :: f EventHandler

615+ , onPaste ∷ f EventHandler

614− , onPointerCancel :: f EventHandler

616+ , onPointerCancel ∷ f EventHandler

615− , onPointerDown :: f EventHandler

617+ , onPointerDown ∷ f EventHandler

616− , onPointerEnter :: f EventHandler

618+ , onPointerEnter ∷ f EventHandler

617− , onPointerLeave :: f EventHandler

619+ , onPointerLeave ∷ f EventHandler

618− , onPointerMove :: f EventHandler

620+ , onPointerMove ∷ f EventHandler

619− , onPointerOut :: f EventHandler

621+ , onPointerOut ∷ f EventHandler

620− , onPointerOver :: f EventHandler

622+ , onPointerOver ∷ f EventHandler

621− , onPointerUp :: f EventHandler

623+ , onPointerUp ∷ f EventHandler

622− , onSelect :: f EventHandler

624+ , onSelect ∷ f EventHandler

623− , onSubmit :: f EventHandler

625+ , onSubmit ∷ f EventHandler

624− , onTouchCancel :: f EventHandler

626+ , onTouchCancel ∷ f EventHandler

625− , onTouchEnd :: f EventHandler

627+ , onTouchEnd ∷ f EventHandler

626− , onTouchMove :: f EventHandler

628+ , onTouchMove ∷ f EventHandler

627− , onTouchStart :: f EventHandler

629+ , onTouchStart ∷ f EventHandler

628− , onTransitionEnd :: f EventHandler

630+ , onTransitionEnd ∷ f EventHandler

629− , onWheel :: f EventHandler

631+ , onWheel ∷ f EventHandler

630− , prefix :: f String

632+ , prefix ∷ f String

631− , property :: f String

633+ , property ∷ f String

632− , radioGroup :: f String

634+ , radioGroup ∷ f String

633− , readOnly :: f Boolean

635+ , readOnly ∷ f Boolean

634− , ref :: f (Ref (Nullable Node))

636+ , ref ∷ f (Ref (Nullable Node))

635− , resource :: f String

637+ , resource ∷ f String

636− , role :: f String

638+ , role ∷ f String

637− , rowSpan :: f Int

639+ , rowSpan ∷ f Int

638− , scoped :: f Boolean

640+ , scoped ∷ f Boolean

639− , seamless :: f Boolean

641+ , seamless ∷ f Boolean

640− , security :: f String

642+ , security ∷ f String

641− , spellCheck :: f Boolean

643+ , spellCheck ∷ f Boolean

642− , srcDoc :: f JSX

644+ , srcDoc ∷ f JSX

643− , srcLang :: f String

645+ , srcLang ∷ f String

644− , srcSet :: f String

646+ , srcSet ∷ f String

645− , style :: f CSS

647+ , style ∷ f CSS

646− , suppressContentEditableWarning :: f Boolean

648+ , suppressContentEditableWarning ∷ f Boolean

647− , tabIndex :: f Int

649+ , tabIndex ∷ f Int

648− , title :: f String

650+ , title ∷ f String

649− , type :: f String

651+ , type ∷ f String

650− , typeof :: f String

652+ , typeof ∷ f String

651− , unselectable :: f Boolean

653+ , unselectable ∷ f Boolean

652− , useMap :: f String

654+ , useMap ∷ f String

653− , value :: f String

655+ , value ∷ f String

654− , vocab :: f String

656+ , vocab ∷ f String

655− , wmode :: f String

657+ , wmode ∷ f String

656− | more

658+ | more

657− )

659+ )

src/Yoga/Block/Internal/OptionalProp.purs+9−9

@@ -15,11 +15,10 @@ import Unsafe.Coerce (unsafeCoerce)

15import Untagged.Castable (class Castable, cast)

16import Untagged.Union (UndefinedOr, defined, fromUndefinedOr, maybeToUor, uorToMaybe)

18−type Id a

18+type Id a =

19− = a

19+ a

21−newtype OptionalProp a

22− = OptionalProp (UndefinedOr a)

21+newtype OptionalProp a = OptionalProp (UndefinedOr a)

24setOrDelete ∷

23setOrDelete ∷

25 ∀ r a rNoA key.

24 ∀ r a rNoA key.

@@ -33,17 +32,17 @@ setOrDelete key v = case opToMaybe v of

33 Nothing -> unsafeDelete (reflectSymbol key)

32 Nothing -> unsafeDelete (reflectSymbol key)

34 Just v' -> set key v'

33 Just v' -> set key v'

36−asOptional :: forall a. a -> OptionalProp a

35+asOptional ∷ ∀ a. a -> OptionalProp a

37asOptional = cast

36asOptional = cast

39−asMaybe :: forall a. a -> Maybe a

38+asMaybe ∷ ∀ a. a -> Maybe a

40asMaybe = asOptional >>> opToMaybe

39asMaybe = asOptional >>> opToMaybe

42−composeHandler :: EventHandler -> EventHandler -> EventHandler

41+composeHandler ∷ EventHandler -> OptionalProp EventHandler -> EventHandler

43composeHandler handler propsHandler =

42composeHandler handler propsHandler =

44 mkEffectFn1 \a -> do

43 mkEffectFn1 \a -> do

45− for_ (propsHandler # asMaybe) $ flip runEffectFn1 a

44+ for_ (propsHandler # opToMaybe) $ flip runEffectFn1 a

46− for_ (handler # asMaybe) $ flip runEffectFn1 a -- not necessary but safer

45+ for_ (handler # asMaybe) $ flip runEffectFn1 a

48unsafeUnOptional ∷ ∀ a. OptionalProp a -> a

47unsafeUnOptional ∷ ∀ a. OptionalProp a -> a

49unsafeUnOptional = unsafeCoerce

48unsafeUnOptional = unsafeCoerce

@@ -56,6 +55,7 @@ opToMaybe (OptionalProp x) = uorToMaybe x

57maybeToOp ∷ ∀ a. Maybe a -> OptionalProp a

56maybeToOp ∷ ∀ a. Maybe a -> OptionalProp a

58maybeToOp mb = OptionalProp (maybeToUor mb)

57maybeToOp mb = OptionalProp (maybeToUor mb)

58+

59derive instance ntOptionalProp ∷ Newtype (OptionalProp a) _

61instance semigroupOptionalProp ∷ Semigroup a => Semigroup (OptionalProp a) where