Current section

9 Versions

Jump to

Compare versions

11 files changed
+159 additions
-86 deletions
  @@ -22,7 +22,7 @@ pub fn main() {
22 22 // once before rendering the application. You can initialize one stylesheet
23 23 // for your entire app, or multiple stylesheets if you're running server
24 24 // components (in that case, one stylesheet per client is recommended).
25 - let assert Ok(stylesheet) = sketch.setup()
25 + let assert Ok(stylesheet) = sketch_lustre.setup()
26 26 // Because stylesheets are persistents with sketch_lustre, you can inject
27 27 // classes, keyframes or @rules directly in it.
28 28 sketch.global(stylesheet, css.global("body", [css.margin(px(0))]))
  @@ -1,5 +1,5 @@
1 1 name = "sketch_lustre"
2 - version = "3.0.0"
2 + version = "3.1.0"
3 3
4 4 description = "A Sketch runtime package, made to work with Lustre!"
5 5 internal_modules = ["sketch/lustre/internals", "sketch/lustre/internals/*"]
  @@ -1,6 +1,6 @@
1 1 {<<"name">>, <<"sketch_lustre">>}.
2 2 {<<"app">>, <<"sketch_lustre">>}.
3 - {<<"version">>, <<"3.0.0">>}.
3 + {<<"version">>, <<"3.1.0">>}.
4 4 {<<"description">>, <<"A Sketch runtime package, made to work with Lustre!"/utf8>>}.
5 5 {<<"licenses">>, [<<"MIT">>]}.
6 6 {<<"build_tools">>, [<<"gleam">>]}.
  @@ -9,20 +9,20 @@
9 9 {<<"Repository">>, <<"https://github.com/ghivert/sketch">>}
10 10 ]}.
11 11 {<<"requirements">>, [
12 - {<<"lustre">>, [
13 - {<<"app">>, <<"lustre">>},
12 + {<<"gleam_stdlib">>, [
13 + {<<"app">>, <<"gleam_stdlib">>},
14 14 {<<"optional">>, false},
15 - {<<"requirement">>, <<">= 5.0.0 and < 6.0.0">>}
15 + {<<"requirement">>, <<">= 0.56.0 and < 2.0.0">>}
16 16 ]},
17 17 {<<"sketch">>, [
18 18 {<<"app">>, <<"sketch">>},
19 19 {<<"optional">>, false},
20 20 {<<"requirement">>, <<">= 4.1.0 and < 5.0.0">>}
21 21 ]},
22 - {<<"gleam_stdlib">>, [
23 - {<<"app">>, <<"gleam_stdlib">>},
22 + {<<"lustre">>, [
23 + {<<"app">>, <<"lustre">>},
24 24 {<<"optional">>, false},
25 - {<<"requirement">>, <<">= 0.56.0 and < 2.0.0">>}
25 + {<<"requirement">>, <<">= 5.0.0 and < 6.0.0">>}
26 26 ]}
27 27 ]}.
28 28 {<<"files">>, [
  @@ -26,6 +26,9 @@ pub opaque type Container {
26 26 /// In `sketch_lustre`, there's no notion of persistent or ephemeral stylesheets:
27 27 /// all stylesheets will be persisted in the application.
28 28 ///
29 + /// In case you need to add initial styling directly in your stylesheet, take a
30 + /// look at [`construct`](#construct).
31 + ///
29 32 /// ```gleam
30 33 /// pub fn main() {
31 34 /// let assert Ok(stylesheet) = sketch_lustre.setup()
  @@ -39,6 +42,34 @@ pub fn setup() -> Result(sketch.StyleSheet, Nil) {
39 42 }
40 43 }
41 44
45 + /// Setup the StyleSheet to use across your application, and let you inject
46 + /// initial styling directly in your stylesheet. If you don't need to add
47 + /// default styling, you can take a look at [`setup`](#setup).
48 + ///
49 + /// In `sketch_lustre`, there's no notion of persistent or ephemeral stylesheets:
50 + /// all stylesheets will be persisted in the application.
51 + ///
52 + /// ```gleam
53 + /// pub fn main() {
54 + /// let assert Ok(stylesheet) =
55 + /// sketch_lustre.construct(fn (stylesheet) {
56 + /// stylesheet
57 + /// |> sketch.global(css.global("html", [...]))
58 + /// |> sketch.global(css.global("body", [...]))
59 + /// |> sketch.global(css.global(":root", [...]))
60 + /// })
61 + /// // The following code goes there.
62 + /// }
63 + /// ```
64 + pub fn construct(
65 + init: fn(sketch.StyleSheet) -> sketch.StyleSheet,
66 + ) -> Result(sketch.StyleSheet, Nil) {
67 + case sketch.stylesheet(strategy: sketch.Persistent) {
68 + Error(_) -> Error(Nil)
69 + Ok(stylesheet) -> global.set_stylesheet(init(stylesheet))
70 + }
71 + }
72 +
42 73 /// Unref the StyleSheet to let it be garbaged by the runtime. Because stylesheets
43 74 /// are memoized to guarantee performance and usability of Sketch Lustre, they
44 75 /// should be dereferenced to ensure no memory leaks will happen in the application.
  @@ -1,7 +1,7 @@
1 1 -module(sketch@lustre).
2 2 -compile([no_auto_import, nowarn_unused_vars, nowarn_unused_function, nowarn_nomatch]).
3 -
4 - -export([setup/0, teardown/1, render/3, node/0, ssr/1]).
3 + -define(FILEPATH, "src/sketch/lustre.gleam").
4 + -export([setup/0, construct/1, teardown/1, render/3, node/0, ssr/1]).
5 5 -export_type([container/0]).
6 6
7 7 -if(?OTP_RELEASE >= 27).
  @@ -16,7 +16,7 @@
16 16 {shadow, gleam@dynamic:dynamic_()} |
17 17 node.
18 18
19 - -file("src/sketch/lustre.gleam", 35).
19 + -file("src/sketch/lustre.gleam", 38).
20 20 ?DOC(
21 21 " Setup the StyleSheet to use across your application. At least one stylesheet\n"
22 22 " must be set in your entire application. `setup` should be called once for\n"
  @@ -25,6 +25,9 @@
25 25 " In `sketch_lustre`, there's no notion of persistent or ephemeral stylesheets:\n"
26 26 " all stylesheets will be persisted in the application.\n"
27 27 "\n"
28 + " In case you need to add initial styling directly in your stylesheet, take a\n"
29 + " look at [`construct`](#construct).\n"
30 + "\n"
28 31 " ```gleam\n"
29 32 " pub fn main() {\n"
30 33 " let assert Ok(stylesheet) = sketch_lustre.setup()\n"
  @@ -42,7 +45,41 @@ setup() ->
42 45 sketch_global_ffi:set_stylesheet(Stylesheet)
43 46 end.
44 47
45 - -file("src/sketch/lustre.gleam", 53).
48 + -file("src/sketch/lustre.gleam", 64).
49 + ?DOC(
50 + " Setup the StyleSheet to use across your application, and let you inject\n"
51 + " initial styling directly in your stylesheet. If you don't need to add\n"
52 + " default styling, you can take a look at [`setup`](#setup).\n"
53 + "\n"
54 + " In `sketch_lustre`, there's no notion of persistent or ephemeral stylesheets:\n"
55 + " all stylesheets will be persisted in the application.\n"
56 + "\n"
57 + " ```gleam\n"
58 + " pub fn main() {\n"
59 + " let assert Ok(stylesheet) =\n"
60 + " sketch_lustre.construct(fn (stylesheet) {\n"
61 + " stylesheet\n"
62 + " |> sketch.global(css.global(\"html\", [...]))\n"
63 + " |> sketch.global(css.global(\"body\", [...]))\n"
64 + " |> sketch.global(css.global(\":root\", [...]))\n"
65 + " })\n"
66 + " // The following code goes there.\n"
67 + " }\n"
68 + " ```\n"
69 + ).
70 + -spec construct(fun((sketch:style_sheet()) -> sketch:style_sheet())) -> {ok,
71 + sketch:style_sheet()} |
72 + {error, nil}.
73 + construct(Init) ->
74 + case sketch:stylesheet(persistent) of
75 + {error, _} ->
76 + {error, nil};
77 +
78 + {ok, Stylesheet} ->
79 + sketch_global_ffi:set_stylesheet(Init(Stylesheet))
80 + end.
81 +
82 + -file("src/sketch/lustre.gleam", 84).
46 83 ?DOC(
47 84 " Unref the StyleSheet to let it be garbaged by the runtime. Because stylesheets\n"
48 85 " are memoized to guarantee performance and usability of Sketch Lustre, they\n"
  @@ -63,7 +100,7 @@ teardown(Stylesheet) ->
63 100 fun(_) -> sketch:dispose(Stylesheet) end
64 101 ).
65 102
66 - -file("src/sketch/lustre.gleam", 81).
103 + -file("src/sketch/lustre.gleam", 112).
67 104 ?DOC(
68 105 " Use `render` as a view middleware. Like in Wisp, `sketch_lustre`\n"
69 106 " adopts the middleware philosophy in Lustre, and allows you to call `render`\n"
  @@ -92,19 +129,23 @@ teardown(Stylesheet) ->
92 129 -spec render(
93 130 sketch:style_sheet(),
94 131 list(container()),
95 - fun(() -> lustre@vdom@vnode:element(PJN))
96 - ) -> lustre@vdom@vnode:element(PJN).
132 + fun(() -> lustre@vdom@vnode:element(OYD))
133 + ) -> lustre@vdom@vnode:element(OYD).
97 134 render(Stylesheet, Outputs, View) ->
98 - _assert_subject = sketch_global_ffi:set_current_stylesheet(Stylesheet),
99 - {ok, _} = case _assert_subject of
100 - {ok, _} -> _assert_subject;
135 + case sketch_global_ffi:set_current_stylesheet(Stylesheet) of
136 + {ok, _} -> nil;
101 137 _assert_fail ->
102 138 erlang:error(#{gleam_error => let_assert,
103 139 message => <<"Pattern match failed, no pattern matched the value."/utf8>>,
104 - value => _assert_fail,
140 + file => <<?FILEPATH/utf8>>,
105 141 module => <<"sketch/lustre"/utf8>>,
106 142 function => <<"render"/utf8>>,
107 - line => 86})
143 + line => 117,
144 + value => _assert_fail,
145 + start => 3944,
146 + 'end' => 4004,
147 + pattern_start => 3955,
148 + pattern_end => 3960})
108 149 end,
109 150 New_view = View(),
110 151 case sketch_global_ffi:get_stylesheet() of
  @@ -153,7 +194,7 @@ render(Stylesheet, Outputs, View) ->
153 194 )
154 195 end.
155 196
156 - -file("src/sketch/lustre.gleam", 180).
197 + -file("src/sketch/lustre.gleam", 211).
157 198 ?DOC(
158 199 " Create a container in the window document. Create a `CSSStyleSheet` and\n"
159 200 " updates the content directly inside. \\\n"
  @@ -170,7 +211,7 @@ render(Stylesheet, Outputs, View) ->
170 211 node() ->
171 212 node.
172 213
173 - -file("src/sketch/lustre.gleam", 184).
214 + -file("src/sketch/lustre.gleam", 215).
174 215 -spec contains_head(lustre@vdom@vnode:element(any())) -> boolean().
175 216 contains_head(El) ->
176 217 case El of
  @@ -188,8 +229,8 @@ contains_head(El) ->
188 229 false
189 230 end.
190 231
191 - -file("src/sketch/lustre.gleam", 195).
192 - -spec put_in_head(lustre@vdom@vnode:element(PJV), binary()) -> lustre@vdom@vnode:element(PJV).
232 + -file("src/sketch/lustre.gleam", 226).
233 + -spec put_in_head(lustre@vdom@vnode:element(OYL), binary()) -> lustre@vdom@vnode:element(OYL).
193 234 put_in_head(El, Content) ->
194 235 case El of
195 236 {element, _, _, _, _, <<"head"/utf8>>, _, _, _, _, _} ->
  @@ -232,7 +273,7 @@ put_in_head(El, Content) ->
232 273 Node
233 274 end.
234 275
235 - -file("src/sketch/lustre.gleam", 144).
276 + -file("src/sketch/lustre.gleam", 175).
236 277 ?DOC(
237 278 " Use `ssr` as a view middleware. Like in Wisp, `sketch_lustre`\n"
238 279 " adopts the middleware philosophy in Lustre, and allows you to call `ssr`\n"
  @@ -274,7 +315,7 @@ put_in_head(El, Content) ->
274 315 " }\n"
275 316 " ```\n"
276 317 ).
277 - -spec ssr(fun(() -> lustre@vdom@vnode:element(PJQ))) -> lustre@vdom@vnode:element(PJQ).
318 + -spec ssr(fun(() -> lustre@vdom@vnode:element(OYG))) -> lustre@vdom@vnode:element(OYG).
278 319 ssr(View) ->
279 320 New_view = View(),
280 321 case sketch_global_ffi:get_stylesheet() of
Loading more files…