git.iko.soy/rowtype-yoga/ry-blocks
on main help sign in
lsdkfj
commite36e0d42d2892c6f49c9cc9464f546975b452cad authorMark Eibes <mark.eibes@gmail.com> dateMon 29 Mar 2021, 13:47 (6 years ago) parent6a35fb5
6 files changed+50−8
compare with main
unifiedsplit
package.json+2−1 src/React/FocusTrap.js+1 src/React/FocusTrap.purs+22 src/Yoga/Block/Atom/Input/View.purs+2−3 src/Yoga/Block/Atom/Input/View/Label.purs+4−4 yarn.lock+19
package.json+2−1
@@ -50,10 +50,11 @@
5050 "dependencies": {
5151 "@emotion/core": "^10.0.28",
5252 "@popperjs/core": "^2.6.0",
53+ "focus-trap-react": "^8.4.2",
5354 "framer-motion": "^4.0.3",
5455 "react": "^16.0.0",
5556 "react-dom": "^16.0.0",
5657 "react-popper": "^2.2.4",
5758 "react-syntax-highlighter": "^15.3.1"
5859 }
59−}
60+}
src/React/FocusTrap.jsnew file+1
@@ -0,0 +1 @@
1+exports.focusTrap_ = require('focus-trap-react');
src/React/FocusTrap.pursnew file+22
@@ -0,0 +1,22 @@
1+module React.FocusTrap (focusTrap) where
2+
3+import Prelude
4+import Effect (Effect)
5+import Prim.Row (class Union)
6+import React.Basic (ReactComponent)
7+import Web.HTML (HTMLElement)
8+
9+foreign import focusTrap_ ∷ ∀ p. ReactComponent { | p }
10+
11+focusTrap ∷ ∀ p q. Union p q Props => ReactComponent { | p }
12+focusTrap = focusTrap_
13+
14+type Props =
15+ ( focusTrapOptions ∷
16+ { onActivate ∷ Effect Unit
17+ , onDeactivate ∷ Effect Unit
18+ }
19+ , active ∷ Boolean
20+ , paused ∷ Boolean
21+ , containerElements ∷ Array HTMLElement
22+ )
src/Yoga/Block/Atom/Input/View.purs+2−3
@@ -79,14 +79,13 @@ rawComponent =
7979 labelId ∷ String
8080 labelId = props.id # opToMaybe # fold # (_ <> "-label")
8181 renderLargeLabel ∷ Boolean
82− renderLargeLabel = not hasFocus && not hasValue
82+ renderLargeLabel = not (isTruthy props.forceSmallLabel) && not hasFocus && not hasValue
8383 maybeLabelText ∷ Maybe NonEmptyString
8484 maybeLabelText = props.label # opToMaybe
8585 mkLabel ∷ NonEmptyString -> JSX
8686 mkLabel labelText =
8787 Label.component
88− </> { onClickLargeLabel: handler preventDefault (const focusInput)
89− , isFocussed: hasFocus
88+ </> { isFocussed: hasFocus
9089 , isRequired: aria # Object.lookup "required" # (_ == Just "true")
9190 , isInvalid: aria # Object.lookup "invalid" # (_ == Just "true")
9291 , renderLargeLabel
src/Yoga/Block/Atom/Input/View/Label.purs+4−4
@@ -7,6 +7,7 @@ import Effect.Class.Console (warn)
77import Effect.Unsafe (unsafePerformEffect)
88import Foreign.Object as Object
99import Framer.Motion as M
10+import React.Basic.DOM (css)
1011import React.Basic.DOM as R
1112import React.Basic.Emotion (StyleProperty)
1213import React.Basic.Hooks (reactComponent)
@@ -15,8 +16,7 @@ import Record.Extra (sequenceRecord)
1516import Yoga.Block.Atom.Input.Style as Style
1617
1718type Props =
18− { onClickLargeLabel ∷ EventHandler
19− , isRequired ∷ Boolean
19+ { isRequired ∷ Boolean
2020 , isInvalid ∷ Boolean
2121 , isFocussed ∷ Boolean
2222 , renderLargeLabel ∷ Boolean
@@ -117,10 +117,10 @@ component =
117117 }
118118 labelSpan =
119119 M.span
120− </ { onClick: props.onClickLargeLabel
121− , layout: M.layout true
120+ </ { layout: M.layout true
122121 , layoutId: M.layoutId "ry-input-label-text"
123122 , htmlFor: props.inputId
123+ , style: css { pointerEvents: "none" }
124124 , id: props.labelId
125125 }
126126 pure result
yarn.lock+19
@@ -4749,6 +4749,20 @@ flush-write-stream@^1.0.0:
47494749 inherits "^2.0.3"
47504750 readable-stream "^2.3.6"
47514751
4752+focus-trap-react@^8.4.2:
4753+ version "8.4.2"
4754+ resolved "https://registry.yarnpkg.com/focus-trap-react/-/focus-trap-react-8.4.2.tgz#5b313605e0789a7beee1467785e455dc63388a98"
4755+ integrity sha512-yuItOIwgriOBMrbHDqbWMpQjGVs9SbtugYrT0vs0yPjHiPKja3NZ9dBMxDQrV1JhyojGK5d6j7ayqBS7Kcm9xQ==
4756+ dependencies:
4757+ focus-trap "^6.3.0"
4758+
4759+focus-trap@^6.3.0:
4760+ version "6.3.0"
4761+ resolved "https://registry.yarnpkg.com/focus-trap/-/focus-trap-6.3.0.tgz#31c08f0b6099705f71f6e0a16d88fbcc4c012586"
4762+ integrity sha512-BBzvFfkPg5PqrVVCdQ1YOIVNKGvqG9YNVkiAUQFuDM66N8J9uADhs6mlYKrd30ofDJIzEniBnBKM7GO45iCzKQ==
4763+ dependencies:
4764+ tabbable "^5.1.5"
4765+
47524766follow-redirects@^1.0.0:
47534767 version "1.13.3"
47544768 resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.13.3.tgz#e5598ad50174c1bc4e872301e82ac2cd97f90267"
@@ -9122,6 +9136,11 @@ symbol.prototype.description@^1.0.0:
91229136 has-symbols "^1.0.1"
91239137 object.getownpropertydescriptors "^2.1.2"
91249138
9139+tabbable@^5.1.5:
9140+ version "5.1.6"
9141+ resolved "https://registry.yarnpkg.com/tabbable/-/tabbable-5.1.6.tgz#dd495abe81d5e41e003fbfa70952e20d5e1e1e89"
9142+ integrity sha512-KSlGaSX9PbL7FHDTn2dB+zv61prkY8BeGioTsKfeN7dKhw5uz1S4U2iFaWMK4GR8oU+5OFBkFuxbMsaUxVVlrQ==
9143+
91259144tapable@^1.0.0, tapable@^1.1.3:
91269145 version "1.1.3"
91279146 resolved "https://registry.yarnpkg.com/tapable/-/tapable-1.1.3.tgz#a1fccc06b58db61fd7a45da2da44f5f3a3e67ba2"