-module(legos@input). -compile([no_auto_import, nowarn_unused_vars, nowarn_unused_function, nowarn_nomatch, inline]). -define(FILEPATH, "src/legos/input.gleam"). -export([placeholder/2, label_right/2, label_left/2, label_above/2, label_below/2, label_hidden/1, default_checkbox/1, option_with/2, thumb/1, default_thumb/0, option/2, slider/8, radio/5, radio_row/5, focused_on_load/0, text_input/5, spell_checked/5, search/5, username/5, email/5, new_password/6, current_password/6, multiline/6, button/3, checkbox/5]). -export_type([placeholder/1, label_location/0, label/1, text_kind/0, text_input/0, text_config/1, option_state/0, radio_option/2, thumb/1, box/0, redistributed/1, orientation/0]). -if(?OTP_RELEASE >= 27). -define(MODULEDOC(Str), -moduledoc(Str)). -define(DOC(Str), -doc(Str)). -else. -define(MODULEDOC(Str), -compile([])). -define(DOC(Str), -compile([])). -endif. -type placeholder(VFR) :: {placeholder, list(legos@internal@model:attribute(legos@internal@model:aligned(), VFR)), legos@internal@model:element(VFR)}. -type label_location() :: on_right | on_left | above | below. -type label(VFS) :: {label, label_location(), list(legos@internal@model:attribute(legos@internal@model:aligned(), VFS)), legos@internal@model:element(VFS)} | {hidden_label, binary()}. -type text_kind() :: {text_input_node, binary()} | text_area. -type text_input() :: {text_input, text_kind(), boolean(), gleam@option:option(binary())}. -type text_config(VFT) :: {text_config, fun((binary()) -> VFT), binary(), gleam@option:option(placeholder(VFT)), label(VFT)}. -type option_state() :: idle | focused | selected. -type radio_option(VFU, VFV) :: {radio_option, VFU, fun((option_state()) -> legos@internal@model:element(VFV))}. -type thumb(VFW) :: {thumb, list(legos@internal@model:attribute(legos@internal@model:aligned(), VFW))}. -type box() :: {box, integer(), integer(), integer(), integer()}. -type redistributed(VFX) :: {redistributed, list(legos@internal@model:attribute(legos@internal@model:aligned(), VFX)), list(legos@internal@model:attribute(legos@internal@model:aligned(), VFX)), list(legos@internal@model:attribute(legos@internal@model:aligned(), VFX)), list(legos@internal@model:attribute(legos@internal@model:aligned(), VFX)), list(legos@internal@model:attribute(legos@internal@model:aligned(), VFX))}. -type orientation() :: row | column. -file("src/legos/input.gleam", 30). ?DOC(" Create a placeholder for text inputs\n"). -spec placeholder( list(legos@internal@model:attribute(legos@internal@model:aligned(), VFY)), legos@internal@model:element(VFY) ) -> placeholder(VFY). placeholder(Attrs, Content) -> {placeholder, Attrs, Content}. -file("src/legos/input.gleam", 56). ?DOC(" Create a label positioned to the right\n"). -spec label_right( list(legos@internal@model:attribute(legos@internal@model:aligned(), VGD)), legos@internal@model:element(VGD) ) -> label(VGD). label_right(Attrs, Content) -> {label, on_right, Attrs, Content}. -file("src/legos/input.gleam", 64). ?DOC(" Create a label positioned to the left\n"). -spec label_left( list(legos@internal@model:attribute(legos@internal@model:aligned(), VGI)), legos@internal@model:element(VGI) ) -> label(VGI). label_left(Attrs, Content) -> {label, on_left, Attrs, Content}. -file("src/legos/input.gleam", 72). ?DOC(" Create a label positioned above\n"). -spec label_above( list(legos@internal@model:attribute(legos@internal@model:aligned(), VGN)), legos@internal@model:element(VGN) ) -> label(VGN). label_above(Attrs, Content) -> {label, above, Attrs, Content}. -file("src/legos/input.gleam", 80). ?DOC(" Create a label positioned below\n"). -spec label_below( list(legos@internal@model:attribute(legos@internal@model:aligned(), VGS)), legos@internal@model:element(VGS) ) -> label(VGS). label_below(Attrs, Content) -> {label, below, Attrs, Content}. -file("src/legos/input.gleam", 88). ?DOC(" Create a hidden label for accessibility (screen readers only)\n"). -spec label_hidden(binary()) -> label(any()). label_hidden(Text) -> {hidden_label, Text}. -file("src/legos/input.gleam", 92). -spec is_stacked(label(any())) -> boolean(). is_stacked(Label) -> case Label of {label, on_right, _, _} -> false; {label, on_left, _, _} -> false; {label, above, _, _} -> true; {label, below, _, _} -> true; {hidden_label, _} -> true end. -file("src/legos/input.gleam", 102). -spec hidden_label_attribute(label(VHB)) -> legos@internal@model:attribute(legos@internal@model:aligned(), VHB). hidden_label_attribute(Label) -> case Label of {hidden_label, Text_label} -> {describe, {label, Text_label}}; {label, _, _, _} -> no_attribute end. -file("src/legos/input.gleam", 162). -spec has_focus_style( legos@internal@model:attribute(legos@internal@model:aligned(), any()) ) -> boolean(). has_focus_style(Attr) -> case Attr of {style_class, _, {pseudo_selector, focus, _}} -> true; _ -> false end. -file("src/legos/input.gleam", 155). -spec focus_default( list(legos@internal@model:attribute(legos@internal@model:aligned(), VHK)) ) -> legos@internal@model:attribute(legos@internal@model:aligned(), VHK). focus_default(Attrs) -> case gleam@list:any(Attrs, fun has_focus_style/1) of true -> no_attribute; false -> legos@internal@model:html_class(<<"focusable"/utf8>>) end. -file("src/legos/input.gleam", 249). -spec default_checkbox(boolean()) -> legos@internal@model:element(any()). default_checkbox(Checked) -> legos@ui:el( [legos@internal@model:html_class(<<"focusable"/utf8>>), legos@ui:width(legos@ui:px(14)), legos@ui:height(legos@ui:px(14)), legos@font:color(legos@color:white()), legos@ui:center_y(), legos@font:size(9), legos@font:center(), legos@border:rounded(3), legos@border:color(case Checked of true -> legos@color:rgb( 59.0 / 255.0, 153.0 / 255.0, 252.0 / 255.0 ); false -> legos@color:rgb( 211.0 / 255.0, 211.0 / 255.0, 211.0 / 255.0 ) end), legos@border:shadow(case Checked of true -> legos@color:rgba( 238.0 / 255.0, 238.0 / 255.0, 238.0 / 255.0, +0.0 ); false -> legos@color:rgb( 238.0 / 255.0, 238.0 / 255.0, 238.0 / 255.0 ) end, {0, 0}, 1, 1), legos@background:color(case Checked of true -> legos@color:rgb( 59.0 / 255.0, 153.0 / 255.0, 252.0 / 255.0 ); false -> legos@color:white() end), legos@border:width(case Checked of true -> 0; false -> 1 end), legos@ui:in_front( legos@ui:el( [legos@border:color(legos@color:white()), legos@ui:height(legos@ui:px(6)), legos@ui:width(legos@ui:px(9)), legos@ui:rotate(-45.0), legos@ui:center_x(), legos@ui:center_y(), legos@ui:move_up(1.0), legos@ui:transparent(not Checked), legos@border:width_each(2, 2, 0, 0)], empty ) )], empty ). -file("src/legos/input.gleam", 508). ?DOC(" Create a radio option with custom styling\n"). -spec option_with( VKH, fun((option_state()) -> legos@internal@model:element(VKI)) ) -> radio_option(VKH, VKI). option_with(Value, View) -> {radio_option, Value, View}. -file("src/legos/input.gleam", 544). ?DOC(" Create a slider thumb\n"). -spec thumb( list(legos@internal@model:attribute(legos@internal@model:aligned(), VLG)) ) -> thumb(VLG). thumb(Attrs) -> {thumb, Attrs}. -file("src/legos/input.gleam", 549). ?DOC(" Default slider thumb\n"). -spec default_thumb() -> thumb(any()). default_thumb() -> {thumb, [legos@ui:width(legos@ui:px(16)), legos@ui:height(legos@ui:px(16)), legos@border:rounded(8), legos@border:width(1), legos@border:color(legos@color:rgb(0.5, 0.5, 0.5)), legos@background:color(legos@color:white())]}. -file("src/legos/input.gleam", 1377). -spec is_fill(legos@internal@model:length()) -> boolean(). is_fill(Len) -> case Len of {fill, _} -> true; content -> false; {px, _} -> false; {pct, _} -> false; {screen_pct, _} -> false; {min, _, L} -> is_fill(L); {max, _, L@1} -> is_fill(L@1) end. -file("src/legos/input.gleam", 1123). -spec redistribute_over(boolean(), boolean()) -> fun((redistributed(VMO), legos@internal@model:attribute(legos@internal@model:aligned(), VMO)) -> redistributed(VMO)). redistribute_over(Is_multiline, Stacked) -> fun(Els, Attr) -> case Attr of {nearby, _, _} -> {redistributed, erlang:element(2, Els), [Attr | erlang:element(3, Els)], erlang:element(4, Els), erlang:element(5, Els), erlang:element(6, Els)}; {width, Width} -> case is_fill(Width) of true -> {redistributed, [Attr | erlang:element(2, Els)], [Attr | erlang:element(3, Els)], erlang:element(4, Els), [Attr | erlang:element(5, Els)], erlang:element(6, Els)}; false -> case Stacked of true -> {redistributed, [Attr | erlang:element(2, Els)], erlang:element(3, Els), erlang:element(4, Els), erlang:element(5, Els), erlang:element(6, Els)}; false -> {redistributed, erlang:element(2, Els), [Attr | erlang:element(3, Els)], erlang:element(4, Els), erlang:element(5, Els), erlang:element(6, Els)} end end; {height, Height} -> case Stacked of false -> {redistributed, [Attr | erlang:element(2, Els)], [Attr | erlang:element(3, Els)], erlang:element(4, Els), erlang:element(5, Els), erlang:element(6, Els)}; true -> case is_fill(Height) of true -> {redistributed, [Attr | erlang:element(2, Els)], [Attr | erlang:element(3, Els)], erlang:element(4, Els), erlang:element(5, Els), erlang:element(6, Els)}; false -> {redistributed, erlang:element(2, Els), [Attr | erlang:element(3, Els)], erlang:element(4, Els), erlang:element(5, Els), erlang:element(6, Els)} end end; {align_x, _} -> {redistributed, [Attr | erlang:element(2, Els)], erlang:element(3, Els), erlang:element(4, Els), erlang:element(5, Els), erlang:element(6, Els)}; {align_y, _} -> {redistributed, [Attr | erlang:element(2, Els)], erlang:element(3, Els), erlang:element(4, Els), erlang:element(5, Els), erlang:element(6, Els)}; {style_class, _, {spacing_style, _, _, _}} -> {redistributed, [Attr | erlang:element(2, Els)], [Attr | erlang:element(3, Els)], [Attr | erlang:element(4, Els)], [Attr | erlang:element(5, Els)], erlang:element(6, Els)}; {style_class, _, {padding_style, _, T, R, B, L}} -> case Is_multiline of true -> {redistributed, erlang:element(2, Els), [Attr | erlang:element(3, Els)], erlang:element(4, Els), erlang:element(5, Els), [Attr | erlang:element(6, Els)]}; false -> New_height = legos@ui:html_attribute( lustre@attribute:style( <<"height"/utf8>>, <<<<"calc(1.0em + "/utf8, (gleam_stdlib:float_to_string( 2.0 * gleam@float:min(T, B) ))/binary>>/binary, "px)"/utf8>> ) ), New_line_height = legos@ui:html_attribute( lustre@attribute:style( <<"line-height"/utf8>>, <<<<"calc(1.0em + "/utf8, (gleam_stdlib:float_to_string( 2.0 * gleam@float:min(T, B) ))/binary>>/binary, "px)"/utf8>> ) ), New_top = T - gleam@float:min(T, B), New_bottom = B - gleam@float:min(T, B), Reduced_vertical_padding = {style_class, legos@internal@flag:padding(), {padding_style, legos@internal@model:padding_name_float( New_top, R, New_bottom, L ), New_top, R, New_bottom, L}}, {redistributed, erlang:element(2, Els), [Reduced_vertical_padding | erlang:element(3, Els)], erlang:element(4, Els), [New_height, New_line_height | erlang:element(5, Els)], [Attr | erlang:element(6, Els)]} end; {style_class, _, {border_width, _, _, _, _, _}} -> {redistributed, erlang:element(2, Els), [Attr | erlang:element(3, Els)], erlang:element(4, Els), erlang:element(5, Els), [Attr | erlang:element(6, Els)]}; {style_class, _, {transform, _}} -> {redistributed, erlang:element(2, Els), [Attr | erlang:element(3, Els)], erlang:element(4, Els), erlang:element(5, Els), [Attr | erlang:element(6, Els)]}; {style_class, _, {font_size, _}} -> {redistributed, [Attr | erlang:element(2, Els)], erlang:element(3, Els), erlang:element(4, Els), erlang:element(5, Els), erlang:element(6, Els)}; {style_class, _, {font_family, _, _}} -> {redistributed, [Attr | erlang:element(2, Els)], erlang:element(3, Els), erlang:element(4, Els), erlang:element(5, Els), erlang:element(6, Els)}; {style_class, _, _} -> {redistributed, erlang:element(2, Els), [Attr | erlang:element(3, Els)], erlang:element(4, Els), erlang:element(5, Els), erlang:element(6, Els)}; no_attribute -> Els; {attr, _} -> {redistributed, erlang:element(2, Els), erlang:element(3, Els), erlang:element(4, Els), [Attr | erlang:element(5, Els)], erlang:element(6, Els)}; {describe, _} -> {redistributed, erlang:element(2, Els), erlang:element(3, Els), erlang:element(4, Els), [Attr | erlang:element(5, Els)], erlang:element(6, Els)}; {class, _, _} -> {redistributed, erlang:element(2, Els), [Attr | erlang:element(3, Els)], erlang:element(4, Els), erlang:element(5, Els), erlang:element(6, Els)}; {transform_component, _, _} -> {redistributed, erlang:element(2, Els), erlang:element(3, Els), erlang:element(4, Els), [Attr | erlang:element(5, Els)], erlang:element(6, Els)} end end. -file("src/legos/input.gleam", 1094). -spec redistribute( boolean(), boolean(), list(legos@internal@model:attribute(legos@internal@model:aligned(), VMK)) ) -> redistributed(VMK). redistribute(Is_multiline, Stacked, Attrs) -> _pipe = Attrs, _pipe@1 = gleam@list:fold( _pipe, {redistributed, [], [], [], [], []}, fun(Attr, Redist) -> (redistribute_over(Is_multiline, Stacked))(Attr, Redist) end ), (fun(Redist@1) -> {redistributed, lists:reverse(erlang:element(2, Redist@1)), lists:reverse(erlang:element(3, Redist@1)), lists:reverse(erlang:element(4, Redist@1)), lists:reverse(erlang:element(5, Redist@1)), lists:reverse(erlang:element(6, Redist@1))} end)(_pipe@1). -file("src/legos/input.gleam", 1403). -spec apply_label( list(legos@internal@model:attribute(legos@internal@model:aligned(), VMS)), label(VMS), legos@internal@model:element(VMS) ) -> legos@internal@model:element(VMS). apply_label(Attrs, Label, Input) -> case Label of {hidden_label, _} -> legos@internal@model:element( as_column, {node_name, <<"label"/utf8>>}, Attrs, {unkeyed, [Input]} ); {label, Position, Label_attrs, Label_child} -> Label_element = legos@internal@model:element( as_el, generic, Label_attrs, {unkeyed, [Label_child]} ), case Position of above -> legos@internal@model:element( as_column, {node_name, <<"label"/utf8>>}, [legos@internal@model:html_class(<<"lbl"/utf8>>) | Attrs], {unkeyed, [Label_element, Input]} ); below -> legos@internal@model:element( as_column, {node_name, <<"label"/utf8>>}, [legos@internal@model:html_class(<<"lbl"/utf8>>) | Attrs], {unkeyed, [Input, Label_element]} ); on_right -> legos@internal@model:element( as_row, {node_name, <<"label"/utf8>>}, [legos@internal@model:html_class(<<"lbl"/utf8>>) | Attrs], {unkeyed, [Input, Label_element]} ); on_left -> legos@internal@model:element( as_row, {node_name, <<"label"/utf8>>}, [legos@internal@model:html_class(<<"lbl"/utf8>>) | Attrs], {unkeyed, [Label_element, Input]} ) end end. -file("src/legos/input.gleam", 1459). -spec is_hidden_label(label(any())) -> boolean(). is_hidden_label(Label) -> case Label of {hidden_label, _} -> true; _ -> false end. -file("src/legos/input.gleam", 1532). -spec default_radio_option(legos@internal@model:element(VNK)) -> fun((option_state()) -> legos@internal@model:element(VNK)). default_radio_option(Option_label) -> fun(Status) -> legos@ui:row( [legos@ui:spacing(10), legos@ui:align_left(), legos@ui:width(legos@ui:shrink())], [legos@ui:el( [legos@ui:width(legos@ui:px(14)), legos@ui:height(legos@ui:px(14)), legos@background:color(legos@color:white()), legos@border:rounded(7), case Status of selected -> legos@internal@model:html_class( <<"focusable"/utf8>> ); _ -> no_attribute end, legos@border:width(case Status of selected -> 5; _ -> 1 end), legos@border:color(case Status of selected -> legos@color:rgb( 59.0 / 255.0, 153.0 / 255.0, 252.0 / 255.0 ); _ -> legos@color:rgb( 208.0 / 255.0, 208.0 / 255.0, 208.0 / 255.0 ) end)], empty ), legos@ui:el( [legos@ui:width(legos@ui:fill()), legos@internal@model:html_class(<<"unfocusable"/utf8>>)], Option_label )] ) end. -file("src/legos/input.gleam", 503). ?DOC(" Create a radio option with default styling\n"). -spec option(VKC, legos@internal@model:element(VKD)) -> radio_option(VKC, VKD). option(Value, Content) -> {radio_option, Value, default_radio_option(Content)}. -file("src/legos/input.gleam", 785). -spec view_horizontal_thumb( float(), list(legos@internal@model:attribute(legos@internal@model:aligned(), VLT)), gleam@option:option(legos@internal@model:length()) ) -> legos@internal@model:element(VLT). view_horizontal_thumb(Factor, Thumb_attributes, Track_height) -> legos@ui:row( [legos@ui:height(gleam@option:unwrap(Track_height, legos@ui:fill())), legos@ui:center_y(), legos@ui:width(legos@ui:fill())], [legos@ui:el( [legos@ui:height(content), legos@ui:width( legos@ui:fill_portion(erlang:round(Factor * 10000.0)) )], empty ), legos@ui:el([legos@ui:center_y() | Thumb_attributes], empty), legos@ui:el( [legos@ui:height( gleam@option:unwrap(Track_height, legos@ui:fill()) ), legos@ui:width( legos@ui:fill_portion( erlang:round( gleam@float:absolute_value(1.0 - Factor) * 10000.0 ) ) )], empty )] ). -file("src/legos/input.gleam", 824). -spec view_vertical_thumb( float(), list(legos@internal@model:attribute(legos@internal@model:aligned(), VLY)), gleam@option:option(legos@internal@model:length()) ) -> legos@internal@model:element(VLY). view_vertical_thumb(Factor, Thumb_attributes, Track_width) -> legos@ui:column( [legos@ui:height(legos@ui:fill()), legos@ui:width(gleam@option:unwrap(Track_width, legos@ui:fill())), legos@ui:center_x()], [legos@ui:el( [legos@ui:height( legos@ui:fill_portion( erlang:round( gleam@float:absolute_value(1.0 - Factor) * 10000.0 ) ) )], empty ), legos@ui:el([legos@ui:center_x() | Thumb_attributes], empty), legos@ui:el( [legos@ui:height( legos@ui:fill_portion(erlang:round(Factor * 10000.0)) )], empty )] ). -file("src/legos/input.gleam", 603). ?DOC( " A slider input, good for capturing float values.\n" "\n" " Input.slider\n" " [ Element.height (Element.px 30)\n" "\n" " -- Here is where we're creating/styling the \"track\"\n" " , Element.behindContent\n" " (Element.el\n" " [ Element.width Element.fill\n" " , Element.height (Element.px 2)\n" " , Element.centerY\n" " , Background.color grey\n" " , Border.rounded 2\n" " ]\n" " Element.none\n" " )\n" " ]\n" " { on_change = AdjustValue\n" " , label =\n" " Input.labelAbove []\n" " (text \"My Slider Value\")\n" " , min = 0\n" " , max = 75\n" " , step = Nothing\n" " , value = model.sliderValue\n" " , thumb =\n" " Input.defaultThumb\n" " }\n" "\n" " `Element.behindContent` is used to render the track of the slider. Without it, no track would be rendered. The `thumb` is the icon that you can move around.\n" "\n" " The slider can be vertical or horizontal depending on the width/height of the slider.\n" "\n" " - `height fill` and `width (px someWidth)` will cause the slider to be vertical.\n" " - `height (px someHeight)` and `width (px someWidth)` where `someHeight` > `someWidth` will also do it.\n" " - otherwise, the slider will be horizontal.\n" "\n" " **Note** If you want a slider for an `Int` value:\n" "\n" " - set `step` to be `Just 1`, or some other whole value\n" " - `value = toFloat model.myInt`\n" " - And finally, round the value before making a message `on_change = round >> AdjustValue`\n" ). -spec slider( list(legos@internal@model:attribute(legos@internal@model:aligned(), VLM)), fun((float()) -> VLM), label(VLM), float(), float(), float(), thumb(VLM), gleam@option:option(float()) ) -> legos@internal@model:element(VLM). slider(Attributes, On_change, Label_val, Min, Max, Value, Thumb, Step) -> {thumb, Thumb_attributes} = Thumb, Width = legos@internal@model:get_width(Thumb_attributes), Height = legos@internal@model:get_height(Thumb_attributes), Track_height = legos@internal@model:get_height(Attributes), Track_width = legos@internal@model:get_width(Attributes), Vertical = case {Track_width, Track_height} of {none, none} -> false; {{some, {px, W}}, {some, {px, H}}} -> H > W; {{some, {px, _}}, {some, {fill, _}}} -> true; {_, _} -> false end, Spacing = legos@internal@model:get_spacing(Attributes, {5, 5}), Spacing_x = erlang:element(1, Spacing), Spacing_y = erlang:element(2, Spacing), Factor = case (Max - Min) of +0.0 -> +0.0; -0.0 -> -0.0; Gleam@denominator -> (Value - Min) / Gleam@denominator end, Thumb_width_string = case Width of none -> <<"20px"/utf8>>; {some, {px, Px}} -> <<(erlang:integer_to_binary(Px))/binary, "px"/utf8>>; _ -> <<"100%"/utf8>> end, Thumb_height_string = case Height of none -> <<"20px"/utf8>>; {some, {px, Px@1}} -> <<(erlang:integer_to_binary(Px@1))/binary, "px"/utf8>>; _ -> <<"100%"/utf8>> end, Class_name = <<<<<<"thmb-"/utf8, Thumb_width_string/binary>>/binary, "-"/utf8>>/binary, Thumb_height_string/binary>>, Thumb_shadow_style = [{property, <<"width"/utf8>>, Thumb_width_string}, {property, <<"height"/utf8>>, Thumb_height_string}], Thumb@1 = case Vertical of true -> view_vertical_thumb( Factor, lists:append( [legos@internal@model:html_class(<<"focusable-thumb"/utf8>>)], Thumb_attributes ), Track_width ); false -> view_horizontal_thumb( Factor, [legos@internal@model:html_class(<<"focusable-thumb"/utf8>>) | Thumb_attributes], Track_height ) end, apply_label(lists:append([case is_hidden_label(Label_val) of true -> [no_attribute]; false -> [legos@ui:spacing_xy(Spacing_x, Spacing_y)] end, [legos@region:announce()], [legos@ui:width( case Track_width of none -> legos@ui:fill(); {some, {px, _}} -> legos@ui:shrink(); {some, X} -> X end )], [legos@ui:height(case Track_height of none -> legos@ui:shrink(); {some, {px, _}} -> legos@ui:shrink(); {some, X@1} -> X@1 end)]]), Label_val, legos@ui:row( [legos@ui:width(gleam@option:unwrap(Track_width, legos@ui:fill())), legos@ui:height( gleam@option:unwrap(Track_height, legos@ui:px(20)) ), legos@ui:behind_content( legos@ui:el([legos@ui:alpha(+0.0)], Thumb@1) )], [legos@internal@model:element( as_el, {node_name, <<"input"/utf8>>}, lists:append( [[hidden_label_attribute(Label_val)], [{style_class, legos@internal@flag:active(), {style, <<<<"input[type=\"range\"]."/utf8, Class_name/binary>>/binary, "::-moz-range-thumb"/utf8>>, Thumb_shadow_style}}, {style_class, legos@internal@flag:hover(), {style, <<<<"input[type=\"range\"]."/utf8, Class_name/binary>>/binary, "::-webkit-slider-thumb"/utf8>>, Thumb_shadow_style}}, {style_class, legos@internal@flag:focus(), {style, <<<<"input[type=\"range\"]."/utf8, Class_name/binary>>/binary, "::-ms-thumb"/utf8>>, Thumb_shadow_style}}, {attr, lustre@attribute:class( <> )}, legos@events:on_input( fun(Str) -> case gleam_stdlib:parse_float(Str) of {error, _} -> On_change(+0.0); {ok, Val} -> On_change(Val) end end ), {attr, lustre@attribute:type_(<<"range"/utf8>>)}, {attr, lustre@attribute:step(case Step of none -> <<"any"/utf8>>; {some, Step@1} -> gleam_stdlib:float_to_string( Step@1 ) end)}, {attr, lustre@attribute:min( gleam_stdlib:float_to_string(Min) )}, {attr, lustre@attribute:max( gleam_stdlib:float_to_string(Max) )}, {attr, lustre@attribute:value( gleam_stdlib:float_to_string(Value) )}, case Vertical of true -> {attr, lustre@attribute:attribute( <<"orient"/utf8>>, <<"vertical"/utf8>> )}; false -> no_attribute end, legos@ui:width(case Vertical of true -> gleam@option:unwrap( Track_height, legos@ui:px(20) ); false -> gleam@option:unwrap( Track_width, legos@ui:fill() ) end), legos@ui:height(case Vertical of true -> gleam@option:unwrap( Track_width, legos@ui:fill() ); false -> gleam@option:unwrap( Track_height, legos@ui:px(20) ) end)]] ), {unkeyed, []} ), legos@ui:el( lists:append( [[legos@ui:width( gleam@option:unwrap( Track_width, legos@ui:fill() ) ), legos@ui:height( gleam@option:unwrap( Track_height, legos@ui:px(20) ) )], Attributes, [legos@ui:behind_content(Thumb@1)]] ), empty )] )). -file("src/legos/input.gleam", 1572). -spec tab_index(integer()) -> legos@internal@model:attribute(legos@internal@model:aligned(), any()). tab_index(Index) -> {attr, lustre@attribute:tabindex(Index)}. -file("src/legos/input.gleam", 1471). -spec radio_helper( orientation(), list(legos@internal@model:attribute(legos@internal@model:aligned(), VNA)), fun((VND) -> VNA), list(radio_option(VND, VNA)), gleam@option:option(VND), label(VNA) ) -> legos@internal@model:element(VNA). radio_helper(Orientation, Attrs, On_change, Options, Selected, Label) -> Render_option = fun(Radio_option) -> {radio_option, Val, View} = Radio_option, Status = case Selected of {some, Sel} when Sel =:= Val -> selected; _ -> idle end, legos@ui:el([legos@ui:pointer(), case Orientation of row -> legos@ui:width(legos@ui:shrink()); column -> legos@ui:width(legos@ui:fill()) end, legos@events:on_click(On_change(Val)), {attr, lustre@attribute:aria_checked(case Status of selected -> <<"true"/utf8>>; _ -> <<"false"/utf8>> end)}, {attr, lustre@attribute:role(<<"radio"/utf8>>)}], View( Status )) end, Option_area = case Orientation of row -> legos@ui:row( [hidden_label_attribute(Label) | Attrs], gleam@list:map(Options, Render_option) ); column -> legos@ui:column( [hidden_label_attribute(Label) | Attrs], gleam@list:map(Options, Render_option) ) end, apply_label( [legos@ui:align_left(), tab_index(0), legos@internal@model:html_class(<<"focus"/utf8>>), legos@region:announce(), {attr, lustre@attribute:role(<<"radiogroup"/utf8>>)}], Label, Option_area ). -file("src/legos/input.gleam", 516). ?DOC(" Create a radio button group (column layout)\n"). -spec radio( list(legos@internal@model:attribute(legos@internal@model:aligned(), VKM)), fun((VKP) -> VKM), list(radio_option(VKP, VKM)), gleam@option:option(VKP), label(VKM) ) -> legos@internal@model:element(VKM). radio(Attrs, On_change, Options, Selected, Label) -> radio_helper(column, Attrs, On_change, Options, Selected, Label). -file("src/legos/input.gleam", 527). ?DOC(" Create a radio button group (row layout)\n"). -spec radio_row( list(legos@internal@model:attribute(legos@internal@model:aligned(), VKW)), fun((VKZ) -> VKW), list(radio_option(VKZ, VKW)), gleam@option:option(VKZ), label(VKW) ) -> legos@internal@model:element(VKW). radio_row(Attrs, On_change, Options, Selected, Label) -> radio_helper(row, Attrs, On_change, Options, Selected, Label). -file("src/legos/input.gleam", 1576). -spec on_key_lookup(VNQ, fun((binary()) -> gleam@option:option(VNQ))) -> legos@internal@model:attribute(legos@internal@model:aligned(), VNQ). on_key_lookup(Msg, Decoder) -> legos@events:on( <<"keyup"/utf8>>, begin gleam@dynamic@decode:then( legos@events:key(), fun(Key) -> case Decoder(Key) of {some, Msg@1} -> gleam@dynamic@decode:success(Msg@1); none -> gleam@dynamic@decode:failure( Msg, <<"Key not handled"/utf8>> ) end end ) end ). -file("src/legos/input.gleam", 1587). ?DOC(" Set an element to be focused when the page loads\n"). -spec focused_on_load() -> legos@internal@model:attribute(legos@internal@model:aligned(), any()). focused_on_load() -> {attr, lustre@attribute:autofocus(true)}. -file("src/legos/input.gleam", 1605). -spec default_text_padding() -> legos@internal@model:attribute(legos@internal@model:aligned(), any()). default_text_padding() -> legos@ui:padding_xy(12, 12). -file("src/legos/input.gleam", 1591). -spec default_text_box_style() -> list(legos@internal@model:attribute(legos@internal@model:aligned(), any())). default_text_box_style() -> [default_text_padding(), legos@border:rounded(3), legos@border:color( {rgba, 64.0 / 255.0, 64.0 / 255.0, 64.0 / 255.0, 1.0} ), legos@background:color(legos@color:white()), legos@border:width(1), legos@ui:spacing(5), legos@ui:width(legos@ui:fill()), legos@ui:height(legos@ui:shrink())]. -file("src/legos/input.gleam", 1609). -spec get_height( legos@internal@model:attribute(legos@internal@model:aligned(), any()) ) -> {ok, legos@internal@model:length()} | {error, nil}. get_height(Attr) -> case Attr of {height, H} -> {ok, H}; _ -> {error, nil} end. -file("src/legos/input.gleam", 1616). -spec is_constrained(legos@internal@model:length()) -> boolean(). is_constrained(Len) -> case Len of content -> false; {px, _} -> true; {pct, _} -> true; {screen_pct, _} -> true; {fill, _} -> true; {min, _, L} -> is_constrained(L); {max, _, _} -> true end. -file("src/legos/input.gleam", 1628). -spec render_placeholder( placeholder(VOA), list(legos@internal@model:attribute(legos@internal@model:aligned(), VOA)), boolean() ) -> legos@internal@model:element(VOA). render_placeholder(P, For_placeholder, On) -> {placeholder, Placeholder_attrs, Placeholder_el} = P, legos@ui:el( lists:append( [For_placeholder, [legos@font:color(legos@color:rgb(0.21, 0.21, 0.21)), legos@internal@model:html_class( <<<<(<<"notxt"/utf8>>)/binary, " "/utf8>>/binary, (<<"ppe"/utf8>>)/binary>> ), legos@ui:clip(), legos@border:width(0), legos@border:color(legos@color:rgba(+0.0, +0.0, +0.0, +0.0)), legos@background:color( legos@color:rgba(+0.0, +0.0, +0.0, +0.0) ), legos@ui:height(legos@ui:fill()), legos@ui:width(legos@ui:fill()), legos@ui:alpha(case On of true -> 1.0; false -> +0.0 end)], Placeholder_attrs] ), Placeholder_el ). -file("src/legos/input.gleam", 1665). -spec calc_move_to_compensate_for_padding( list(legos@internal@model:attribute(legos@internal@model:aligned(), VOF)) ) -> legos@internal@model:attribute(legos@internal@model:aligned(), VOF). calc_move_to_compensate_for_padding(Attrs) -> Gather_spacing = fun(Found, Attr) -> case Attr of {style_class, _, {spacing_style, _, _, Y}} -> case Found of none -> {some, Y}; {some, _} -> Found end; _ -> Found end end, case gleam@list:fold_right(Attrs, none, Gather_spacing) of none -> no_attribute; {some, V_space} -> legos@ui:move_up(math:floor(erlang:float(V_space) / 2.0)) end. -file("src/legos/input.gleam", 1685). -spec negate_box(box()) -> box(). negate_box(Box) -> {box, - erlang:element(2, Box), - erlang:element(3, Box), - erlang:element(4, Box), - erlang:element(5, Box)}. -file("src/legos/input.gleam", 1689). -spec render_box(box()) -> binary(). render_box(Box) -> <<<<<<<<<<<<<<(erlang:integer_to_binary(erlang:element(5, Box)))/binary, "px "/utf8>>/binary, (erlang:integer_to_binary(erlang:element(4, Box)))/binary>>/binary, "px "/utf8>>/binary, (erlang:integer_to_binary(erlang:element(2, Box)))/binary>>/binary, "px "/utf8>>/binary, (erlang:integer_to_binary(erlang:element(3, Box)))/binary>>/binary, "px"/utf8>>. -file("src/legos/input.gleam", 860). -spec text_helper( text_input(), list(legos@internal@model:attribute(legos@internal@model:aligned(), VMD)), fun((binary()) -> VMD), binary(), gleam@option:option(placeholder(VMD)), label(VMD) ) -> legos@internal@model:element(VMD). text_helper(Text_input, Attrs, On_change, Text_val, Placeholder, Label_val) -> With_defaults = lists:append(default_text_box_style(), Attrs), Redistributed = redistribute( erlang:element(2, Text_input) =:= text_area, is_stacked(Label_val), With_defaults ), Get_padding = fun(Attr) -> case Attr of {style_class, _, {padding_style, _, T, R, B, L}} -> {ok, {box, gleam@int:max(0, erlang:round(math:floor(B - 3.0))), gleam@int:max(0, erlang:round(math:floor(L - 3.0))), gleam@int:max(0, erlang:round(math:floor(R - 3.0))), gleam@int:max(0, erlang:round(math:floor(T - 3.0)))}}; _ -> {error, nil} end end, Height_constrained = case erlang:element(2, Text_input) of {text_input_node, _} -> false; text_area -> _pipe = With_defaults, _pipe@1 = gleam@list:filter_map(_pipe, fun get_height/1), _pipe@2 = lists:reverse(_pipe@1), _pipe@3 = gleam@list:first(_pipe@2), _pipe@4 = gleam@result:map(_pipe@3, fun is_constrained/1), gleam@result:unwrap(_pipe@4, false) end, Parent_padding = begin _pipe@5 = With_defaults, _pipe@6 = gleam@list:filter_map(_pipe@5, Get_padding), _pipe@7 = lists:reverse(_pipe@6), _pipe@8 = gleam@list:first(_pipe@7), gleam@result:unwrap(_pipe@8, {box, 0, 0, 0, 0}) end, Input_element = legos@internal@model:element( as_el, case erlang:element(2, Text_input) of {text_input_node, _} -> {node_name, <<"input"/utf8>>}; text_area -> {node_name, <<"textarea"/utf8>>} end, lists:append([case erlang:element(2, Text_input) of {text_input_node, Input_type} -> [{attr, lustre@attribute:type_(Input_type)}, legos@internal@model:html_class(<<"it"/utf8>>)]; text_area -> [legos@ui:clip(), legos@ui:height(legos@ui:fill()), legos@internal@model:html_class(<<"iml"/utf8>>), calc_move_to_compensate_for_padding(With_defaults), legos@ui:padding_each( erlang:element(5, Parent_padding), erlang:element(4, Parent_padding), erlang:element(2, Parent_padding), erlang:element(3, Parent_padding) ), {attr, lustre@attribute:style( <<"margin"/utf8>>, render_box(negate_box(Parent_padding)) )}, {attr, lustre@attribute:style( <<"box-sizing"/utf8>>, <<"content-box"/utf8>> )}] end, [{attr, lustre@attribute:value(Text_val)}, {attr, lustre@event:on_input(On_change)}, hidden_label_attribute(Label_val), {attr, lustre@attribute:spellcheck( erlang:element(3, Text_input) )}, case erlang:element(4, Text_input) of {some, Value} -> {attr, lustre@attribute:autocomplete(Value)}; none -> no_attribute end], erlang:element(5, Redistributed)]), {unkeyed, []} ), Wrapped_input = case erlang:element(2, Text_input) of text_area -> legos@internal@model:element( as_el, generic, begin _pipe@9 = [legos@ui:width(legos@ui:fill()), case gleam@list:any( With_defaults, fun has_focus_style/1 ) of true -> no_attribute; false -> legos@internal@model:html_class( <<"focus-within"/utf8>> ) end, legos@internal@model:html_class(<<"implw"/utf8>>) | erlang:element(3, Redistributed)], (fun(A) -> case Height_constrained of true -> [legos@ui:scrollbar_y() | A]; false -> A end end)(_pipe@9) end, {unkeyed, [legos@internal@model:element( as_paragraph, generic, [legos@ui:width(legos@ui:fill()), legos@ui:height(legos@ui:fill()), legos@ui:in_front(Input_element), legos@internal@model:html_class(<<"imlp"/utf8>>) | erlang:element(4, Redistributed)], {unkeyed, case Text_val =:= <<""/utf8>> of true -> case Placeholder of none -> [legos@ui:text( <<"\x{00A0}"/utf8>> )]; {some, Place} -> [render_placeholder( Place, [], true )] end; false -> [legos@internal@model:unstyled( lustre@element@html:span( [lustre@attribute:class( <<"imlf"/utf8>> )], [lustre@element@html:text( <> )] ) )] end} )]} ); {text_input_node, _} -> legos@internal@model:element( as_el, generic, [legos@ui:width(legos@ui:fill()), case gleam@list:any(With_defaults, fun has_focus_style/1) of true -> no_attribute; false -> legos@internal@model:html_class( <<"focus-within"/utf8>> ) end | lists:append( [erlang:element(3, Redistributed), case Placeholder of none -> []; {some, Place@1} -> [legos@ui:behind_content( render_placeholder( Place@1, erlang:element(6, Redistributed), Text_val =:= <<""/utf8>> ) )] end] )], {unkeyed, [Input_element]} ) end, apply_label( [{class, legos@internal@flag:cursor(), <<"ctxt"/utf8>>}, case is_hidden_label(Label_val) of true -> no_attribute; false -> legos@ui:spacing(5) end, legos@region:announce() | erlang:element(2, Redistributed)], Label_val, Wrapped_input ). -file("src/legos/input.gleam", 318). ?DOC(" Create a basic text input\n"). -spec text_input( list(legos@internal@model:attribute(legos@internal@model:aligned(), VHY)), fun((binary()) -> VHY), binary(), gleam@option:option(placeholder(VHY)), label(VHY) ) -> legos@internal@model:element(VHY). text_input(Attrs, On_change, Text, Placeholder, Label) -> text_helper( {text_input, {text_input_node, <<"text"/utf8>>}, false, none}, Attrs, On_change, Text, Placeholder, Label ). -file("src/legos/input.gleam", 336). ?DOC(" Create a spell-checked text input\n"). -spec spell_checked( list(legos@internal@model:attribute(legos@internal@model:aligned(), VIF)), fun((binary()) -> VIF), binary(), gleam@option:option(placeholder(VIF)), label(VIF) ) -> legos@internal@model:element(VIF). spell_checked(Attrs, On_change, Text, Placeholder, Label) -> text_helper( {text_input, {text_input_node, <<"text"/utf8>>}, true, none}, Attrs, On_change, Text, Placeholder, Label ). -file("src/legos/input.gleam", 354). ?DOC(" Create a search input\n"). -spec search( list(legos@internal@model:attribute(legos@internal@model:aligned(), VIM)), fun((binary()) -> VIM), binary(), gleam@option:option(placeholder(VIM)), label(VIM) ) -> legos@internal@model:element(VIM). search(Attrs, On_change, Text, Placeholder, Label) -> text_helper( {text_input, {text_input_node, <<"search"/utf8>>}, false, none}, Attrs, On_change, Text, Placeholder, Label ). -file("src/legos/input.gleam", 376). ?DOC(" Create a username input\n"). -spec username( list(legos@internal@model:attribute(legos@internal@model:aligned(), VIT)), fun((binary()) -> VIT), binary(), gleam@option:option(placeholder(VIT)), label(VIT) ) -> legos@internal@model:element(VIT). username(Attrs, On_change, Text, Placeholder, Label) -> text_helper( {text_input, {text_input_node, <<"text"/utf8>>}, false, {some, <<"username"/utf8>>}}, Attrs, On_change, Text, Placeholder, Label ). -file("src/legos/input.gleam", 398). ?DOC(" Create an email input\n"). -spec email( list(legos@internal@model:attribute(legos@internal@model:aligned(), VJA)), fun((binary()) -> VJA), binary(), gleam@option:option(placeholder(VJA)), label(VJA) ) -> legos@internal@model:element(VJA). email(Attrs, On_change, Text, Placeholder, Label) -> text_helper( {text_input, {text_input_node, <<"email"/utf8>>}, false, {some, <<"email"/utf8>>}}, Attrs, On_change, Text, Placeholder, Label ). -file("src/legos/input.gleam", 420). ?DOC(" Create a new password input\n"). -spec new_password( list(legos@internal@model:attribute(legos@internal@model:aligned(), VJH)), fun((binary()) -> VJH), binary(), gleam@option:option(placeholder(VJH)), label(VJH), boolean() ) -> legos@internal@model:element(VJH). new_password(Attrs, On_change, Text_val, Placeholder_val, Label_val, Show) -> text_helper({text_input, {text_input_node, case Show of true -> <<"text"/utf8>>; false -> <<"password"/utf8>> end}, false, {some, <<"new-password"/utf8>>}}, Attrs, On_change, Text_val, Placeholder_val, Label_val). -file("src/legos/input.gleam", 446). ?DOC(" Create a current password input\n"). -spec current_password( list(legos@internal@model:attribute(legos@internal@model:aligned(), VJO)), fun((binary()) -> VJO), binary(), gleam@option:option(placeholder(VJO)), label(VJO), boolean() ) -> legos@internal@model:element(VJO). current_password(Attrs, On_change, Text_val, Placeholder_val, Label_val, Show) -> text_helper({text_input, {text_input_node, case Show of true -> <<"text"/utf8>>; false -> <<"password"/utf8>> end}, false, {some, <<"current-password"/utf8>>}}, Attrs, On_change, Text_val, Placeholder_val, Label_val). -file("src/legos/input.gleam", 472). ?DOC(" Create a multiline text input (textarea)\n"). -spec multiline( list(legos@internal@model:attribute(legos@internal@model:aligned(), VJV)), fun((binary()) -> VJV), binary(), gleam@option:option(placeholder(VJV)), label(VJV), boolean() ) -> legos@internal@model:element(VJV). multiline( Attrs, On_change, Text_val, Placeholder_val, Label_val, Spellcheck_val ) -> text_helper( {text_input, text_area, Spellcheck_val, none}, Attrs, On_change, Text_val, Placeholder_val, Label_val ). -file("src/legos/input.gleam", 112). ?DOC(" Create a button element\n"). -spec button( list(legos@internal@model:attribute(legos@internal@model:aligned(), VHE)), gleam@option:option(VHE), legos@internal@model:element(VHE) ) -> legos@internal@model:element(VHE). button(Attrs, On_press, Label) -> legos@internal@model:element( as_el, generic, [legos@ui:width(legos@ui:shrink()), legos@ui:height(legos@ui:shrink()), legos@internal@model:html_class( <<<<<<<<<<<<(<<"ccx"/utf8>>)/binary, " "/utf8>>/binary, (<<"ccy"/utf8>>)/binary>>/binary, " "/utf8>>/binary, (<<"sbt"/utf8>>)/binary>>/binary, " "/utf8>>/binary, (<<"notxt"/utf8>>)/binary>> ), legos@ui:pointer(), focus_default(Attrs), {describe, button}, {attr, lustre@attribute:tabindex(0)} | case On_press of none -> [{attr, lustre@attribute:disabled(true)} | Attrs]; {some, Msg} -> [legos@events:on_click(Msg), on_key_lookup(Msg, fun(Code) -> case Code of C when C =:= <<"Enter"/utf8>> -> {some, Msg}; C@1 when C@1 =:= <<" "/utf8>> -> {some, Msg}; _ -> none end end) | Attrs] end], {unkeyed, [Label]} ). -file("src/legos/input.gleam", 172). ?DOC(" Create a checkbox input\n"). -spec checkbox( list(legos@internal@model:attribute(legos@internal@model:aligned(), VHQ)), fun((boolean()) -> VHQ), fun((boolean()) -> legos@internal@model:element(VHQ)), boolean(), label(VHQ) ) -> legos@internal@model:element(VHQ). checkbox(Attrs, On_change, Icon, Checked, Label) -> Attributes = [case is_hidden_label(Label) of true -> no_attribute; false -> legos@ui:spacing(6) end, legos@events:on_click(On_change(not Checked)), legos@region:announce( ), on_key_lookup(On_change(true), fun(Code) -> case Code of C when C =:= <<"Enter"/utf8>> -> {some, On_change(not Checked)}; C@1 when C@1 =:= <<" "/utf8>> -> {some, On_change(not Checked)}; _ -> none end end), tab_index(0), legos@ui:pointer(), legos@ui:align_left( ), legos@ui:width(legos@ui:fill()) | Attrs], apply_label( [{attr, lustre@attribute:role(<<"checkbox"/utf8>>)}, {attr, lustre@attribute:aria_checked(case Checked of true -> <<"true"/utf8>>; false -> <<"false"/utf8>> end)}, hidden_label_attribute(Label) | Attributes], Label, legos@internal@model:element( as_el, generic, [legos@ui:center_y(), legos@ui:height(legos@ui:fill()), legos@ui:width(legos@ui:shrink())], {unkeyed, [Icon(Checked)]} ) ).