de95017 · rowtype-yoga/purescript-yoga-react-native

git.iko.soy/rowtype-yoga/purescript-yoga-react-native

WIP: React Native bindings development

commitde950173bf3c7d6ffae654b2347c26ff0aaa76e9 authorMark <mark.eibes@gmail.com> dateMon 16 Feb 2026, 23:18 (7 months ago) parent4dd978c

32 files changed+175−66

compare with main

unifiedsplit

example-macos/src/Demo/DataViews.purs+1−1

@@ -69,7 +69,7 @@ outlineViewDemo = component "OutlineViewDemo" \dp -> React.do

6969 , OutlineItem { id: "pkg", title: "package.json", sfSymbol: "doc.text", children: [] }

7070 ]

7171 , headerVisible: false

72− , onSelectItem: E.onString "id" setSelection

72+ , onSelectItem: setSelection

7373 , style: Style.style { height: 200.0 } <> tw "rounded-lg overflow-hidden mb-2"

7474 }

7575 , if selection == "" then mempty

example-macos/src/Demo/Display.purs+1−2

@@ -17,7 +17,6 @@ import React.Basic.Hooks as React

1717import Yoga.React (component)

1818import Yoga.React.Native (text, tw, view)

1919import Yoga.React.Native.MacOS.AnimatedImage (nativeAnimatedImage)

20−import Yoga.React.Native.MacOS.Events as E

2120import Yoga.React.Native.MacOS.Image (nativeImage)

2221import Yoga.React.Native.MacOS.LevelIndicator (nativeLevelIndicator)

2322import Yoga.React.Native.MacOS.PathControl (nativePathControl)

@@ -142,7 +141,7 @@ pathControlDemo = component "PathControlDemo" \dp -> pure do

142141 , nativePathControl

143142 { url: "/Users"

144143 , pathStyle: T.standardPath

145− , onSelectPath: E.onString "url" \_ -> pure unit

144+ , onSelectPath: \_ -> pure unit

146145 , style: Style.style { height: 24.0 } <> tw "mb-2"

147146 }

148147 ]

example-macos/src/Demo/InputControls.purs+7−7

@@ -154,8 +154,8 @@ comboBoxDemo = component "ComboBoxDemo" \dp -> React.do

154154 { items: [ "Apple", "Banana", "Cherry", "Date", "Elderberry", "Fig", "Grape" ]

155155 , text: txt

156156 , placeholder: "Type a fruit..."

157− , onChangeText: E.onString "text" setTxt

158− , onSelectItem: E.onString "text" \t -> do

157+ , onChangeText: setTxt

158+ , onSelectItem: \t -> do

159159 setTxt t

160160 setResult ("Selected: " <> t)

161161 , style: Style.style { height: 28.0 } <> tw "mb-2"

@@ -196,7 +196,7 @@ datePickerDemo = component "DatePickerDemo" \dp -> React.do

196196 , card dp.cardBg

197197 [ nativeDatePicker

198198 { graphical: false

199− , onChange: E.onString "date" setDateText

199+ , onChange: setDateText

200200 , style: Style.style { height: 24.0, width: 200.0 }

201201 }

202202 , if dateText == "" then mempty

@@ -215,7 +215,7 @@ colorWellDemo = component "ColorWellDemo" \dp -> React.do

215215 [ nativeColorWell

216216 { color

217217 , minimal: true

218− , onChange: E.onString "color" setColor

218+ , onChange: setColor

219219 , style: Style.style { height: 32.0, width: 48.0 }

220220 }

221221 , view

@@ -295,8 +295,8 @@ searchFieldDemo = component "SearchFieldDemo" \dp -> React.do

295295 , nativeSearchField

296296 { text: query

297297 , placeholder: "Search..."

298− , onChangeText: E.onString "text" setQuery

299− , onSearch: E.onString "text" \t -> setResult ("Searched: " <> t)

298+ , onChangeText: setQuery

299+ , onSearch: \t -> setResult ("Searched: " <> t)

300300 , style: Style.style { height: 28.0 } <> tw "mb-2"

301301 }

302302 , if result == "" then mempty

@@ -313,7 +313,7 @@ tokenFieldDemo = component "TokenFieldDemo" \dp -> React.do

313313 , nativeTokenField

314314 { tokens

315315 , placeholder: "Add tags..."

316− , onChangeTokens: E.onStrings "tokens" setTokens

316+ , onChangeTokens: setTokens

317317 , style: Style.style { height: 28.0 } <> tw "mb-2"

318318 }

319319 ]

example-macos/src/Demo/Layout.purs+1−2

@@ -9,7 +9,6 @@ import React.Basic.Hooks as React

99import Yoga.React (component)

1010import Yoga.React.Native (text, tw, view)

1111import Yoga.React.Native.MacOS.Box (nativeBox)

12−import Yoga.React.Native.MacOS.Events as E

1312import Yoga.React.Native.MacOS.SplitView (nativeSplitView)

1413import Yoga.React.Native.MacOS.TabView (nativeTabView)

1514import Yoga.React.Native.Style as Style

@@ -65,7 +64,7 @@ tabViewDemo = component "TabViewDemo" \dp -> React.do

6564 , { id: "about", label: "About" }

6665 ]

6766 , selectedItem: selected

68− , onSelectTab: E.onString "tabId" setSelected

67+ , onSelectTab: setSelected

6968 , style: Style.style { height: 32.0 } <> tw "mb-2"

7069 }

7170 ]

example-macos/src/Demo/Navigation.purs+2−3

@@ -24,7 +24,6 @@ import React.Basic.Hooks (useState', (/\))

2424import React.Basic.Hooks as React

2525import Yoga.React (component)

2626import Yoga.React.Native (text, tw, view)

27−import Yoga.React.Native.MacOS.Events as E

2827import Yoga.React.Native.MacOS.OutlineView (OutlineItem(..), nativeOutlineView)

2928import Yoga.React.Native.MacOS.SearchField (nativeSearchField)

3029import Yoga.React.Native.Style as Style

@@ -135,13 +134,13 @@ outlineSidebar _ setSelectedItem = sidebarComponent { setSelectedItem }

135134 [ nativeSearchField

136135 { text: search

137136 , placeholder: "Filter..."

138− , onChangeText: E.onString "text" setSearch

137+ , onChangeText: setSearch

139138 , style: Style.style { height: 24.0, marginLeft: 8.0, marginRight: 8.0, marginBottom: 4.0 }

140139 }

141140 , nativeOutlineView

142141 { items

143142 , headerVisible: false

144− , onSelectItem: E.onString "id" props.setSelectedItem

143+ , onSelectItem: props.setSelectedItem

145144 , style: tw "flex-1"

146145 }

147146 ]

example-macos/src/Demo/Overlays.purs+1−2

@@ -17,7 +17,6 @@ import Yoga.React.Native (text, tw, view)

1717import Yoga.React.Native.MacOS.Alert (macosAlert)

1818import Yoga.React.Native.MacOS.Button (nativeButton)

1919import Yoga.React.Native.MacOS.ContextMenu (nativeContextMenu)

20−import Yoga.React.Native.MacOS.Events as E

2120import Yoga.React.Native.MacOS.Menu (macosShowMenu)

2221import Yoga.React.Native.MacOS.Popover (nativePopover)

2322import Yoga.React.Native.MacOS.Sheet (nativeSheet)

@@ -110,7 +109,7 @@ contextMenuDemo = component "ContextMenuDemo" \dp -> React.do

110109 , { id: "delete", title: "Delete", sfSymbol: "trash" }

111110 , { id: "selectAll", title: "Select All", sfSymbol: "selection.pin.in.out" }

112111 ]

113− , onSelectItem: E.onString "itemId" setResult

112+ , onSelectItem: setResult

114113 , style: Style.style {}

115114 }

116115 ( card dp.cardBg

example-macos/src/Demo/WebBrowser.purs+2−8

@@ -4,12 +4,10 @@ import Prelude

55import Demo.Shared (DemoProps, sectionTitle)

66import React.Basic (JSX)

7−import React.Basic.Events (handler, unsafeEventFn)

87import React.Basic.Hooks (useState', (/\))

98import React.Basic.Hooks as React

109import Yoga.React (component)

11−import Yoga.React.Native (nativeEvent, tw, view)

12−import Yoga.React.Native.MacOS.Events as E

10+import Yoga.React.Native (tw, view)

1311import Yoga.React.Native.MacOS.TextField (nativeTextField)

1412import Yoga.React.Native.MacOS.WebView (nativeWebView)

1513import Yoga.React.Native.Style as Style

@@ -31,11 +29,7 @@ webViewDemo = component "WebViewDemo" \dp -> React.do

3129 }

3230 , nativeWebView

3331 { url

34− , onFinishLoad: handler

35− ( nativeEvent >>> unsafeEventFn \e ->

36− { url: E.getFieldStr "url" e, title: E.getFieldStr "title" e }

37− )

38− \r -> setUrlBar r.url

32+ , onFinishLoad: setUrlBar

3933 , style: tw "flex-1" <> Style.style { minHeight: 400.0 }

4034 }

4135 ]

example-macos/src/Main.purs+1−2

@@ -8,7 +8,6 @@ import Demo.Navigation (demoContent, outlineSidebar)

88import Demo.Shared (DemoProps)

99import Effect (Effect)

1010import React.Basic (JSX)

11−import React.Basic.Events (handler_)

1211import React.Basic.Hooks (useState', (/\))

1312import React.Basic.Hooks as React

1413import Yoga.React (component)

@@ -45,7 +44,7 @@ app = component "App" \_ -> React.do

4544 , selectedItem: ""

4645 , toolbarStyle: T.unified

4746 , windowTitle: "PureScript React Native"

48− , onSelectItem: handler_ (pure unit)

47+ , onSelectItem: \_ -> pure unit

4948 , style: Style.style { height: 0.0, width: 0.0 }

5049 }

5150 , sidebarLayout

src/Yoga/React/Native/MacOS/ColorWell.js+9−1

@@ -1,2 +1,10 @@

1+import React from "react";

12import { requireNativeComponent } from "react-native";

2−export const colorWellImpl = requireNativeComponent("NativeColorWell");

3+const NativeColorWell = requireNativeComponent("NativeColorWell");

4+export const colorWellImpl = React.forwardRef((props, ref) => {

5+ const nativeProps = { ...props };

6+ if (typeof props.onChange === "function") {

7+ nativeProps.onChange = (e) => props.onChange(e.nativeEvent.color)();

8+ }

9+ return React.createElement(NativeColorWell, { ...nativeProps, ref });

10+});

src/Yoga/React/Native/MacOS/ColorWell.purs+3−2

@@ -1,7 +1,8 @@

11module Yoga.React.Native.MacOS.ColorWell (nativeColorWell, NativeColorWellAttributes) where

3+import Prelude

4+import Effect (Effect)

35import React.Basic (ReactComponent)

4−import React.Basic.Events (EventHandler)

56import Yoga.React.Native.Attributes (BaseAttributes)

67import Yoga.React.Native.Internal (FFINativeComponent_, createNativeElement_)

@@ -13,5 +14,5 @@ nativeColorWell = createNativeElement_ colorWellImpl

1314type NativeColorWellAttributes = BaseAttributes

1415 ( color :: String

1516 , minimal :: Boolean

16− , onChange :: EventHandler

17+ , onChange :: String -> Effect Unit

1718 )

src/Yoga/React/Native/MacOS/ComboBox.js+12−1

@@ -1,2 +1,13 @@

1+import React from "react";

12import { requireNativeComponent } from "react-native";

2−export const comboBoxImpl = requireNativeComponent("MacOSComboBox");

3+const NativeComboBox = requireNativeComponent("MacOSComboBox");

4+export const comboBoxImpl = React.forwardRef((props, ref) => {

5+ const nativeProps = { ...props };

6+ if (typeof props.onChangeText === "function") {

7+ nativeProps.onChangeText = (e) => props.onChangeText(e.nativeEvent.text)();

8+ }

9+ if (typeof props.onSelectItem === "function") {

10+ nativeProps.onSelectItem = (e) => props.onSelectItem(e.nativeEvent.text)();

11+ }

12+ return React.createElement(NativeComboBox, { ...nativeProps, ref });

13+});

src/Yoga/React/Native/MacOS/ComboBox.purs+4−3

@@ -3,8 +3,9 @@ module Yoga.React.Native.MacOS.ComboBox

33 , NativeComboBoxAttributes

44 ) where

6+import Prelude

7+import Effect (Effect)

68import React.Basic (ReactComponent)

7−import React.Basic.Events (EventHandler)

89import Yoga.React.Native.Attributes (BaseAttributes)

910import Yoga.React.Native.Internal (FFINativeComponent_, createNativeElement_)

1011

@@ -17,6 +18,6 @@ type NativeComboBoxAttributes = BaseAttributes

1718 ( items :: Array String

1819 , text :: String

1920 , placeholder :: String

20− , onChangeText :: EventHandler

21− , onSelectItem :: EventHandler

21+ , onChangeText :: String -> Effect Unit

22+ , onSelectItem :: String -> Effect Unit

2223 )

src/Yoga/React/Native/MacOS/ContextMenu.js+10−1

@@ -1,2 +1,11 @@

1+import React from "react";

12import { requireNativeComponent } from "react-native";

2−export const contextMenuImpl = requireNativeComponent("MacOSContextMenu");

3+const NativeContextMenu = requireNativeComponent("MacOSContextMenu");

4+export const contextMenuImpl = React.forwardRef((props, ref) => {

5+ const nativeProps = { ...props };

6+ if (typeof props.onSelectItem === "function") {

7+ nativeProps.onSelectItem = (e) =>

8+ props.onSelectItem(e.nativeEvent.itemId)();

9+ }

10+ return React.createElement(NativeContextMenu, { ...nativeProps, ref });

11+});

src/Yoga/React/Native/MacOS/ContextMenu.purs+3−2

@@ -1,7 +1,8 @@

11module Yoga.React.Native.MacOS.ContextMenu (nativeContextMenu, NativeContextMenuAttributes, ContextMenuItem) where

3+import Prelude

4+import Effect (Effect)

35import React.Basic (ReactComponent)

4−import React.Basic.Events (EventHandler)

56import Yoga.React.Native.Attributes (BaseAttributes)

67import Yoga.React.Native.Internal (FFINativeComponent, createNativeElement)

@@ -18,5 +19,5 @@ type ContextMenuItem =

1819

1920type NativeContextMenuAttributes = BaseAttributes

2021 ( items :: Array ContextMenuItem

21− , onSelectItem :: EventHandler

22+ , onSelectItem :: String -> Effect Unit

2223 )

src/Yoga/React/Native/MacOS/DatePicker.js+9−1

@@ -1,2 +1,10 @@

1+import React from "react";

12import { requireNativeComponent } from "react-native";

2−export const datePickerImpl = requireNativeComponent("NativeDatePicker");

3+const NativeDatePicker = requireNativeComponent("NativeDatePicker");

4+export const datePickerImpl = React.forwardRef((props, ref) => {

5+ const nativeProps = { ...props };

6+ if (typeof props.onChange === "function") {

7+ nativeProps.onChange = (e) => props.onChange(e.nativeEvent.date)();

8+ }

9+ return React.createElement(NativeDatePicker, { ...nativeProps, ref });

10+});

src/Yoga/React/Native/MacOS/DatePicker.purs+3−2

@@ -1,7 +1,8 @@

11module Yoga.React.Native.MacOS.DatePicker (nativeDatePicker, NativeDatePickerAttributes) where

3+import Prelude

4+import Effect (Effect)

35import React.Basic (ReactComponent)

4−import React.Basic.Events (EventHandler)

56import Yoga.React.Native.Attributes (BaseAttributes)

67import Yoga.React.Native.Internal (FFINativeComponent_, createNativeElement_)

@@ -12,5 +13,5 @@ nativeDatePicker = createNativeElement_ datePickerImpl

1213

1314type NativeDatePickerAttributes = BaseAttributes

1415 ( graphical :: Boolean

15− , onChange :: EventHandler

16+ , onChange :: String -> Effect Unit

1617 )

src/Yoga/React/Native/MacOS/OutlineView.js+9−1

@@ -1,2 +1,10 @@

1+import React from "react";

12import { requireNativeComponent } from "react-native";

2−export const outlineViewImpl = requireNativeComponent("MacOSOutlineView");

3+const NativeOutlineView = requireNativeComponent("MacOSOutlineView");

4+export const outlineViewImpl = React.forwardRef((props, ref) => {

5+ const nativeProps = { ...props };

6+ if (typeof props.onSelectItem === "function") {

7+ nativeProps.onSelectItem = (e) => props.onSelectItem(e.nativeEvent.id)();

8+ }

9+ return React.createElement(NativeOutlineView, { ...nativeProps, ref });

10+});

src/Yoga/React/Native/MacOS/OutlineView.purs+3−2

@@ -4,8 +4,9 @@ module Yoga.React.Native.MacOS.OutlineView

44 , OutlineItem(..)

55 ) where

7+import Prelude

8+import Effect (Effect)

79import React.Basic (ReactComponent)

8−import React.Basic.Events (EventHandler)

910import Yoga.React.Native.Attributes (BaseAttributes)

1011import Yoga.React.Native.Internal (FFINativeComponent_, createNativeElement_)

1112

@@ -24,5 +25,5 @@ newtype OutlineItem = OutlineItem

2425type NativeOutlineViewAttributes = BaseAttributes

2526 ( items :: Array OutlineItem

2627 , headerVisible :: Boolean

27− , onSelectItem :: EventHandler

28+ , onSelectItem :: String -> Effect Unit

2829 )

src/Yoga/React/Native/MacOS/PathControl.js+9−1

@@ -1,2 +1,10 @@

1+import React from "react";

12import { requireNativeComponent } from "react-native";

2−export const pathControlImpl = requireNativeComponent("MacOSPathControl");

3+const NativePathControl = requireNativeComponent("MacOSPathControl");

4+export const pathControlImpl = React.forwardRef((props, ref) => {

5+ const nativeProps = { ...props };

6+ if (typeof props.onSelectPath === "function") {

7+ nativeProps.onSelectPath = (e) => props.onSelectPath(e.nativeEvent.url)();

8+ }

9+ return React.createElement(NativePathControl, { ...nativeProps, ref });

10+});

src/Yoga/React/Native/MacOS/PathControl.purs+3−2

@@ -3,8 +3,9 @@ module Yoga.React.Native.MacOS.PathControl

33 , NativePathControlAttributes

44 ) where

6+import Prelude

7+import Effect (Effect)

68import React.Basic (ReactComponent)

7−import React.Basic.Events (EventHandler)

89import Yoga.React.Native.Attributes (BaseAttributes)

910import Yoga.React.Native.Internal (FFINativeComponent_, createNativeElement_)

1011import Yoga.React.Native.MacOS.Types (PathControlStyle)

@@ -17,5 +18,5 @@ nativePathControl = createNativeElement_ pathControlImpl

1718type NativePathControlAttributes = BaseAttributes

1819 ( url :: String

1920 , pathStyle :: PathControlStyle

20− , onSelectPath :: EventHandler

21+ , onSelectPath :: String -> Effect Unit

2122 )

src/Yoga/React/Native/MacOS/SearchField.js+12−1

@@ -1,2 +1,13 @@

1+import React from "react";

12import { requireNativeComponent } from "react-native";

2−export const searchFieldImpl = requireNativeComponent("MacOSSearchField");

3+const NativeSearchField = requireNativeComponent("MacOSSearchField");

4+export const searchFieldImpl = React.forwardRef((props, ref) => {

5+ const nativeProps = { ...props };

6+ if (typeof props.onChangeText === "function") {

7+ nativeProps.onChangeText = (e) => props.onChangeText(e.nativeEvent.text)();

8+ }

9+ if (typeof props.onSearch === "function") {

10+ nativeProps.onSearch = (e) => props.onSearch(e.nativeEvent.text)();

11+ }

12+ return React.createElement(NativeSearchField, { ...nativeProps, ref });

13+});

src/Yoga/React/Native/MacOS/SearchField.purs+4−3

@@ -3,8 +3,9 @@ module Yoga.React.Native.MacOS.SearchField

33 , NativeSearchFieldAttributes

44 ) where

6+import Prelude

7+import Effect (Effect)

68import React.Basic (ReactComponent)

7−import React.Basic.Events (EventHandler)

89import Yoga.React.Native.Attributes (BaseAttributes)

910import Yoga.React.Native.Internal (FFINativeComponent_, createNativeElement_)

1011

@@ -16,6 +17,6 @@ nativeSearchField = createNativeElement_ searchFieldImpl

1617type NativeSearchFieldAttributes = BaseAttributes

1718 ( text :: String

1819 , placeholder :: String

19− , onChangeText :: EventHandler

20− , onSearch :: EventHandler

20+ , onChangeText :: String -> Effect Unit

21+ , onSearch :: String -> Effect Unit

2122 )

src/Yoga/React/Native/MacOS/TabView.js+9−1

@@ -1,2 +1,10 @@

1+import React from "react";

12import { requireNativeComponent } from "react-native";

2−export const tabViewImpl = requireNativeComponent("MacOSTabView");

3+const NativeTabView = requireNativeComponent("MacOSTabView");

4+export const tabViewImpl = React.forwardRef((props, ref) => {

5+ const nativeProps = { ...props };

6+ if (typeof props.onSelectTab === "function") {

7+ nativeProps.onSelectTab = (e) => props.onSelectTab(e.nativeEvent.tabId)();

8+ }

9+ return React.createElement(NativeTabView, { ...nativeProps, ref });

10+});

src/Yoga/React/Native/MacOS/TabView.purs+3−2

@@ -4,8 +4,9 @@ module Yoga.React.Native.MacOS.TabView

44 , TabItem

55 ) where

7+import Prelude

8+import Effect (Effect)

79import React.Basic (ReactComponent)

8−import React.Basic.Events (EventHandler)

910import Yoga.React.Native.Attributes (BaseAttributes)

1011import Yoga.React.Native.Internal (FFINativeComponent_, createNativeElement_)

1112

@@ -22,5 +23,5 @@ type TabItem =

2223type NativeTabViewAttributes = BaseAttributes

2324 ( items :: Array TabItem

2425 , selectedItem :: String

25− , onSelectTab :: EventHandler

26+ , onSelectTab :: String -> Effect Unit

2627 )

src/Yoga/React/Native/MacOS/TextEditor.js+9−1

@@ -1,2 +1,10 @@

1+import React from "react";

12import { requireNativeComponent } from "react-native";

2−export const textEditorImpl = requireNativeComponent("NativeTextEditor");

3+const NativeTextEditor = requireNativeComponent("NativeTextEditor");

4+export const textEditorImpl = React.forwardRef((props, ref) => {

5+ const nativeProps = { ...props };

6+ if (typeof props.onChangeText === "function") {

7+ nativeProps.onChangeText = (e) => props.onChangeText(e.nativeEvent.text)();

8+ }

9+ return React.createElement(NativeTextEditor, { ...nativeProps, ref });

10+});

src/Yoga/React/Native/MacOS/TextEditor.purs+3−2

@@ -1,7 +1,8 @@

11module Yoga.React.Native.MacOS.TextEditor (nativeTextEditor, NativeTextEditorAttributes) where

3+import Prelude

4+import Effect (Effect)

35import React.Basic (ReactComponent)

4−import React.Basic.Events (EventHandler)

56import Yoga.React.Native.Attributes (BaseAttributes)

67import Yoga.React.Native.Internal (FFINativeComponent_, createNativeElement_)

@@ -14,5 +15,5 @@ type NativeTextEditorAttributes = BaseAttributes

1415 ( text :: String

1516 , richText :: Boolean

1617 , showsRuler :: Boolean

17− , onChangeText :: EventHandler

18+ , onChangeText :: String -> Effect Unit

1819 )

src/Yoga/React/Native/MacOS/TokenField.js+10−1

@@ -1,2 +1,11 @@

1+import React from "react";

12import { requireNativeComponent } from "react-native";

2−export const tokenFieldImpl = requireNativeComponent("MacOSTokenField");

3+const NativeTokenField = requireNativeComponent("MacOSTokenField");

4+export const tokenFieldImpl = React.forwardRef((props, ref) => {

5+ const nativeProps = { ...props };

6+ if (typeof props.onChangeTokens === "function") {

7+ nativeProps.onChangeTokens = (e) =>

8+ props.onChangeTokens(e.nativeEvent.tokens || [])();

9+ }

10+ return React.createElement(NativeTokenField, { ...nativeProps, ref });

11+});

src/Yoga/React/Native/MacOS/TokenField.purs+3−2

@@ -3,8 +3,9 @@ module Yoga.React.Native.MacOS.TokenField

33 , NativeTokenFieldAttributes

44 ) where

6+import Prelude

7+import Effect (Effect)

68import React.Basic (ReactComponent)

7−import React.Basic.Events (EventHandler)

89import Yoga.React.Native.Attributes (BaseAttributes)

910import Yoga.React.Native.Internal (FFINativeComponent_, createNativeElement_)

1011

@@ -16,5 +17,5 @@ nativeTokenField = createNativeElement_ tokenFieldImpl

1617type NativeTokenFieldAttributes = BaseAttributes

1718 ( tokens :: Array String

1819 , placeholder :: String

19− , onChangeTokens :: EventHandler

20+ , onChangeTokens :: Array String -> Effect Unit

2021 )

src/Yoga/React/Native/MacOS/Toolbar.js+10−1

@@ -1,2 +1,11 @@

1+import React from "react";

12import { requireNativeComponent } from "react-native";

2−export const toolbarImpl = requireNativeComponent("MacOSToolbar");

3+const NativeToolbar = requireNativeComponent("MacOSToolbar");

4+export const toolbarImpl = React.forwardRef((props, ref) => {

5+ const nativeProps = { ...props };

6+ if (typeof props.onSelectItem === "function") {

7+ nativeProps.onSelectItem = (e) =>

8+ props.onSelectItem(e.nativeEvent.itemId)();

9+ }

10+ return React.createElement(NativeToolbar, { ...nativeProps, ref });

11+});

src/Yoga/React/Native/MacOS/Toolbar.purs+3−2

@@ -1,7 +1,8 @@

11module Yoga.React.Native.MacOS.Toolbar (nativeToolbar, NativeToolbarAttributes, ToolbarItem) where

3+import Prelude

4+import Effect (Effect)

35import React.Basic (ReactComponent)

4−import React.Basic.Events (EventHandler)

56import Yoga.React.Native.Attributes (BaseAttributes)

67import Yoga.React.Native.Internal (FFINativeComponent_, createNativeElement_)

78import Yoga.React.Native.MacOS.Types (ToolbarStyle)

@@ -22,5 +23,5 @@ type NativeToolbarAttributes = BaseAttributes

2223 , selectedItem :: String

2324 , toolbarStyle :: ToolbarStyle

2425 , windowTitle :: String

25− , onSelectItem :: EventHandler

26+ , onSelectItem :: String -> Effect Unit

2627 )

src/Yoga/React/Native/MacOS/WebView.js+12−1

@@ -1,2 +1,13 @@

1+import React from "react";

12import { requireNativeComponent } from "react-native";

2−export const webViewImpl = requireNativeComponent("NativeWebView");

3+const NativeWebView = requireNativeComponent("NativeWebView");

4+export const webViewImpl = React.forwardRef((props, ref) => {

5+ const nativeProps = { ...props };

6+ if (typeof props.onNavigate === "function") {

7+ nativeProps.onNavigate = (e) => props.onNavigate(e.nativeEvent.url)();

8+ }

9+ if (typeof props.onFinishLoad === "function") {

10+ nativeProps.onFinishLoad = (e) => props.onFinishLoad(e.nativeEvent.url)();

11+ }

12+ return React.createElement(NativeWebView, { ...nativeProps, ref });

13+});

src/Yoga/React/Native/MacOS/WebView.purs+4−3

@@ -1,7 +1,8 @@

11module Yoga.React.Native.MacOS.WebView (nativeWebView, NativeWebViewAttributes) where

3+import Prelude

4+import Effect (Effect)

35import React.Basic (ReactComponent)

4−import React.Basic.Events (EventHandler)

56import Yoga.React.Native.Attributes (BaseAttributes)

67import Yoga.React.Native.Internal (FFINativeComponent_, createNativeElement_)

@@ -12,6 +13,6 @@ nativeWebView = createNativeElement_ webViewImpl

1213

1314type NativeWebViewAttributes = BaseAttributes

1415 ( url :: String

15− , onNavigate :: EventHandler

16− , onFinishLoad :: EventHandler

16+ , onNavigate :: String -> Effect Unit

17+ , onFinishLoad :: String -> Effect Unit

1718 )