diff options
| -rw-r--r-- | src/ffi.mjs | 10 | ||||
| -rw-r--r-- | src/lustre/attribute.gleam | 11 |
2 files changed, 18 insertions, 3 deletions
diff --git a/src/ffi.mjs b/src/ffi.mjs index 2352f01..89642c0 100644 --- a/src/ffi.mjs +++ b/src/ffi.mjs @@ -4,7 +4,7 @@ import * as Gleam from './gleam.mjs' // ----------------------------------------------------------------------------- -export const mount = ({ init, update, view }, selector) => { +export const mount = ({ init, update, render }, selector) => { const root = document.querySelector(selector) if (!root) { @@ -22,8 +22,12 @@ export const mount = ({ init, update, view }, selector) => { const App = React.createElement(() => { const [state, dispatch] = React.useReducer(update, init) + const el = render(state) - return view(state)(dispatch) + + return typeof el == 'string' + ? el + : el(dispatch) }) ReactDOM.render(App, root) @@ -108,4 +112,6 @@ export const map = (element, f) => (dispatch) => { // ----------------------------------------------------------------------------- +export const object = (entries) => Object.fromEntries(entries) + const capitalise = s => s && s[0].toUpperCase() + s.slice(1) diff --git a/src/lustre/attribute.gleam b/src/lustre/attribute.gleam index 745e834..c1fd213 100644 --- a/src/lustre/attribute.gleam +++ b/src/lustre/attribute.gleam @@ -18,4 +18,13 @@ pub fn property (name: String, value: Dynamic) -> Attribute(action) { pub fn event (name: String, handler: fn (Dynamic, fn (action) -> Nil) -> Nil) -> Attribute(action) { Event(name, handler) -}
\ No newline at end of file +} + +// + +pub fn style (properties: List(#(String, String))) -> Attribute(action) { + property("style", style_object(properties)) +} + +external fn style_object (properties: List(#(String, String))) -> Dynamic + = "../ffi.mjs" "object" |