@@ -6,7 +6,8 @@ import Effect (Effect)
66import Effect.Uncurried (EffectFn1)
77import React.Basic (JSX)
88import Yoga.React.DOM.Internal (class IsJSX)
9−import Data.Function.Uncurried (runFn4)
9+import Data.Function.Uncurried (Fn2, mkFn2, runFn4)
10+import Data.String (Pattern(..), contains, toLower)
1011import HeroUI.Types (FieldVariant, fieldVariantToString)
1112import HeroUI.Internal (class CoerceHeroProps, createElementTransformImpl)
1213import HeroUI.Raw as Raw
@@ -51,10 +52,13 @@ autocompleteTrigger
5152 -> JSX
5253autocompleteTrigger props kids = runFn4 createElementTransformImpl {} Raw.autocompleteTrigger props kids
5354
55+-- | Shows the selected option's text, or `placeholder` when nothing is selected.
56+type AutocompleteValueProps r = (placeholder :: String, className :: String | r)
57+
5458autocompleteValue
5559 :: forall givenProps nonDataProps kids
5660 . IsJSX kids
57− => CoerceHeroProps { | givenProps } { | nonDataProps } { | SectionProps () }
61+ => CoerceHeroProps { | givenProps } { | nonDataProps } { | AutocompleteValueProps () }
5862 => { | givenProps }
5963 -> kids
6064 -> JSX
@@ -78,6 +82,30 @@ autocompletePopover
7882 -> JSX
7983autocompletePopover props kids = runFn4 createElementTransformImpl {} Raw.autocompletePopover props kids
8084
85+-- | Wraps the search `input` + the options collection inside the popover;
86+-- | this is what makes the autocomplete typeable. Pass `filter` to narrow the
87+-- | options as the user types (see `containsFilter` for the common case).
88+type AutocompleteFilterProps r =
89+ ( filter :: Fn2 String String Boolean
90+ , className :: String
91+ | r
92+ )
93+
94+autocompleteFilter
95+ :: forall givenProps nonDataProps kids
96+ . IsJSX kids
97+ => CoerceHeroProps { | givenProps } { | nonDataProps } { | AutocompleteFilterProps () }
98+ => { | givenProps }
99+ -> kids
100+ -> JSX
101+autocompleteFilter props kids = runFn4 createElementTransformImpl {} Raw.autocompleteFilter props kids
102+
103+-- | Case-insensitive substring match — the usual `filter` for `autocompleteFilter`.
104+-- | react-aria calls it as `filter optionTextValue typedInput`; keep an option
105+-- | when what the user typed appears anywhere in its `textValue`.
106+containsFilter :: Fn2 String String Boolean
107+containsFilter = mkFn2 \optionText typed -> contains (Pattern (toLower typed)) (toLower optionText)
108+
81109autocompleteClearButton
82110 :: forall givenProps nonDataProps kids
83111 . IsJSX kids