Tailwind classes in OCaml
anil.recoil.org
1open Tailwind
2
3let () =
4 Printf.printf "=== Improved Tailwind OCaml API Demo ===\n\n";
5
6 (* 1. Using the new organizational structure *)
7 let button_classes = tw [
8 C.bg (Color.make `Blue ~variant:`V500 ());
9 C.text (Color.make `White ());
10 S.(to_class (px (Size.rem 1.0)));
11 S.(to_class (py (Size.rem 0.5)));
12 E.rounded_md;
13 E.shadow_sm;
14 E.transition `Colors;
15 ] in
16 Printf.printf "Button with short aliases: %s\n" (to_string button_classes);
17
18 (* 2. Using patterns for common layouts *)
19 let centered_card = tw [
20 P.card;
21 P.flex_center;
22 ] in
23 Printf.printf "Centered card: %s\n" (to_string centered_card);
24
25 (* 3. Reset utilities in their own module *)
26 let form_input = tw [
27 R.input;
28 C.border (Color.make `Gray ~variant:`V300 ());
29 E.rounded_sm;
30 S.(to_class (p (Size.rem 0.75)));
31 ] in
32 Printf.printf "Form input with reset: %s\n" (to_string form_input);
33
34 (* 4. Animation utilities properly organized *)
35 let animated_button = tw [
36 C.bg (Color.make `Green ~variant:`V500 ());
37 C.text (Color.make `White ());
38 S.(to_class (px (Size.rem 1.5)));
39 S.(to_class (py (Size.rem 0.75)));
40 E.rounded_lg;
41 E.transition `All;
42 E.duration 200;
43 E.ease `In_out;
44 Variants.hover (C.bg (Color.make `Green ~variant:`V600 ()));
45 ] in
46 Printf.printf "Animated button: %s\n" (to_string animated_button);
47
48 (* 5. Stack layout pattern *)
49 let vertical_stack = P.stack ~gap:(Size.rem 1.0) () in
50 Printf.printf "Vertical stack: %s\n" (to_string vertical_stack);
51
52 (* 6. Conditional classes *)
53 let responsive_classes = class_list [
54 (P.flex_center, true);
55 (R.button, false);
56 (E.shadow_lg, true);
57 ] in
58 Printf.printf "Conditional classes: %s\n" (to_string responsive_classes);
59
60 (* 7. Focus ring utility *)
61 let accessible_button = tw [
62 C.bg (Color.make `Purple ~variant:`V500 ());
63 C.text (Color.make `White ());
64 S.(to_class (px (Size.rem 1.0)));
65 S.(to_class (py (Size.rem 0.5)));
66 E.rounded_md;
67 focus_ring ();
68 ] in
69 Printf.printf "Accessible button: %s\n" (to_string accessible_button);
70
71 Printf.printf "\n=== API Improvements Summary ===\n";
72 Printf.printf "✅ Animation utilities moved to Effects module\n";
73 Printf.printf "✅ Reset utilities organized in Reset module\n";
74 Printf.printf "✅ Layout patterns in Patterns module\n";
75 Printf.printf "✅ Convenience aliases (C, S, E, T, F, G, P, R)\n";
76 Printf.printf "✅ Consistent return types across modules\n";
77 Printf.printf "✅ Comprehensive test coverage setup\n";