Packages

glaze_basecoat

2.0.0
3.1.0 3.0.0 2.1.0 2.0.0 1.0.0

🍩 Lustre Bindings to Basecoat UI Components

HexDocs

Current section

Files

Jump to
Readme
5 Versions
2 Dependencies
Dependants
Files
Activity
glaze_basecoat src glaze@basecoat@sidebar.erl
Raw

src/glaze@basecoat@sidebar.erl 

-module(glaze@basecoat@sidebar).

-compile([no_auto_import, nowarn_unused_vars, nowarn_unused_function, nowarn_nomatch, inline]).

-define(FILEPATH, "src/glaze/basecoat/sidebar.gleam").

-export([sidebar/3, left/0, right/0, hidden/0, visible/0, nav/2, nav_with_label/3, header/2, section/2, group/2, group_with_attrs/3, link/4, button/3, submenu/4, submenu_with_icon/5, footer/2, toggle_script/1, toggle_script_default/0, open_script/1, close_script/1]).

-export_type([side/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.



?MODULEDOC(

    " Basecoat documentation: <https://basecoatui.com/components/sidebar/>\n"

    "\n"

    " Sidebar layout helpers for responsive app navigation.\n"

    "\n"

    " **Note**: This component requires JavaScript from Basecoat.\n"

    "\n"

    " ## Anatomy\n"

    "\n"

    " A sidebar is typically an `aside` with a `nav` containing groups and links.\n"

    "\n"

    " ## Recipe\n"

    "\n"

    " ```gleam\n"

    " import glaze/basecoat/sidebar\n"

    " import lustre/element/html\n"

    "\n"

    " fn main_sidebar() {\n"

    "   sidebar.sidebar(\"main-nav\", [sidebar.left()], [\n"

    "     sidebar.nav([], [\n"

    "       sidebar.section([], [\n"

    "         sidebar.group(\"Getting started\", [\n"

    "           sidebar.link(\"#\", True, [], [html.text(\"Playground\")]),\n"

    "           sidebar.link(\"#\", False, [], [html.text(\"Models\")]),\n"

    "         ]),\n"

    "       ]),\n"

    "     ]),\n"

    "   ])\n"

    " }\n"

    " ```\n"

    "\n"

    " ## References\n"

    "\n"

    " - MDN `aria-current`: <https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-current>\n"

).



-type side() :: left | right.



-file("src/glaze/basecoat/sidebar.gleam", 45).

-spec sidebar(

    binary(),

    list(lustre@vdom@vattr:attribute(TEQ)),

    list(lustre@vdom@vnode:element(TEQ))

) -> lustre@vdom@vnode:element(TEQ).

sidebar(Id, Attrs, Children) ->

    lustre@element@html:aside(

        lists:append(

            [lustre@attribute:class(<<"sidebar"/utf8>>),

                lustre@attribute:id(Id),

                lustre@attribute:aria_hidden(false)],

            Attrs

        ),

        Children

    ).



-file("src/glaze/basecoat/sidebar.gleam", 63).

-spec left() -> lustre@vdom@vattr:attribute(any()).

left() ->

    lustre@attribute:data(<<"side"/utf8>>, <<"left"/utf8>>).



-file("src/glaze/basecoat/sidebar.gleam", 67).

-spec right() -> lustre@vdom@vattr:attribute(any()).

right() ->

    lustre@attribute:data(<<"side"/utf8>>, <<"right"/utf8>>).



-file("src/glaze/basecoat/sidebar.gleam", 71).

-spec hidden() -> lustre@vdom@vattr:attribute(any()).

hidden() ->

    lustre@attribute:aria_hidden(true).



-file("src/glaze/basecoat/sidebar.gleam", 75).

-spec visible() -> lustre@vdom@vattr:attribute(any()).

visible() ->

    lustre@attribute:aria_hidden(false).



-file("src/glaze/basecoat/sidebar.gleam", 79).

-spec nav(

    list(lustre@vdom@vattr:attribute(TFE)),

    list(lustre@vdom@vnode:element(TFE))

) -> lustre@vdom@vnode:element(TFE).

nav(Attrs, Children) ->

    lustre@element@html:nav(Attrs, Children).



-file("src/glaze/basecoat/sidebar.gleam", 86).

-spec nav_with_label(

    binary(),

    list(lustre@vdom@vattr:attribute(TFK)),

    list(lustre@vdom@vnode:element(TFK))

) -> lustre@vdom@vnode:element(TFK).

nav_with_label(Label, Attrs, Children) ->

    lustre@element@html:nav(

        lists:append([lustre@attribute:aria_label(Label)], Attrs),

        Children

    ).



-file("src/glaze/basecoat/sidebar.gleam", 94).

-spec header(

    list(lustre@vdom@vattr:attribute(TFQ)),

    list(lustre@vdom@vnode:element(TFQ))

) -> lustre@vdom@vnode:element(TFQ).

header(Attrs, Children) ->

    lustre@element@html:header(Attrs, Children).



-file("src/glaze/basecoat/sidebar.gleam", 101).

-spec section(

    list(lustre@vdom@vattr:attribute(TFW)),

    list(lustre@vdom@vnode:element(TFW))

) -> lustre@vdom@vnode:element(TFW).

section(Attrs, Children) ->

    lustre@element@html:section(

        lists:append([lustre@attribute:class(<<"scrollbar"/utf8>>)], Attrs),

        Children

    ).



-file("src/glaze/basecoat/sidebar.gleam", 108).

-spec group(binary(), list(lustre@vdom@vnode:element(TGC))) -> lustre@vdom@vnode:element(TGC).

group(Label, Items) ->

    Label_id = <<"group-label-"/utf8, Label/binary>>,

    lustre@element@html:'div'(

        [lustre@attribute:role(<<"group"/utf8>>),

            lustre@attribute:aria_labelledby(Label_id)],

        [lustre@element@html:h3(

                [lustre@attribute:id(Label_id),

                    lustre@attribute:class(<<"text-sm font-medium"/utf8>>)],

                [lustre@element@html:text(Label)]

            ),

            lustre@element@html:ul([], Items)]

    ).



-file("src/glaze/basecoat/sidebar.gleam", 124).

-spec group_with_attrs(

    binary(),

    list(lustre@vdom@vattr:attribute(TGG)),

    list(lustre@vdom@vnode:element(TGG))

) -> lustre@vdom@vnode:element(TGG).

group_with_attrs(Label, Attrs, Items) ->

    Label_id = <<"group-label-"/utf8, Label/binary>>,

    lustre@element@html:'div'(

        lists:append(

            [lustre@attribute:role(<<"group"/utf8>>),

                lustre@attribute:aria_labelledby(Label_id)],

            Attrs

        ),

        [lustre@element@html:h3(

                [lustre@attribute:id(Label_id),

                    lustre@attribute:class(<<"text-sm font-medium"/utf8>>)],

                [lustre@element@html:text(Label)]

            ),

            lustre@element@html:ul([], Items)]

    ).



-file("src/glaze/basecoat/sidebar.gleam", 147).

-spec link(

    binary(),

    boolean(),

    list(lustre@vdom@vattr:attribute(TGM)),

    list(lustre@vdom@vnode:element(TGM))

) -> lustre@vdom@vnode:element(TGM).

link(Href, Is_current, Attrs, Children) ->

    Current_attr = case Is_current of

        true ->

            [lustre@attribute:aria_current(<<"page"/utf8>>)];



        false ->

            []

    end,

    lustre@element@html:li(

        [],

        [lustre@element@html:a(

                lists:append(

                    lists:append([lustre@attribute:href(Href)], Current_attr),

                    Attrs

                ),

                Children

            )]

    ).



-file("src/glaze/basecoat/sidebar.gleam", 165).

-spec button(

    boolean(),

    list(lustre@vdom@vattr:attribute(TGS)),

    list(lustre@vdom@vnode:element(TGS))

) -> lustre@vdom@vnode:element(TGS).

button(Is_current, Attrs, Children) ->

    Current_attr = case Is_current of

        true ->

            [lustre@attribute:aria_current(<<"page"/utf8>>)];



        false ->

            []

    end,

    lustre@element@html:li(

        [],

        [lustre@element@html:button(

                lists:append(

                    lists:append(

                        [lustre@attribute:type_(<<"button"/utf8>>),

                            lustre@attribute:class(<<"w-full text-left"/utf8>>)],

                        Current_attr

                    ),

                    Attrs

                ),

                Children

            )]

    ).



-file("src/glaze/basecoat/sidebar.gleam", 188).

-spec submenu(

    binary(),

    binary(),

    list(lustre@vdom@vattr:attribute(TGY)),

    list(lustre@vdom@vnode:element(TGY))

) -> lustre@vdom@vnode:element(TGY).

submenu(Id, Label, Attrs, Items) ->

    lustre@element@html:li(

        [],

        [lustre@element@html:details(

                lists:append([lustre@attribute:id(Id)], Attrs),

                [lustre@element@html:summary(

                        [lustre@attribute:aria_controls(

                                <<Id/binary, "-content"/utf8>>

                            )],

                        [lustre@element@html:text(Label)]

                    ),

                    lustre@element@html:ul(

                        [lustre@attribute:id(<<Id/binary, "-content"/utf8>>)],

                        Items

                    )]

            )]

    ).



-file("src/glaze/basecoat/sidebar.gleam", 204).

-spec submenu_with_icon(

    binary(),

    lustre@vdom@vnode:element(THE),

    binary(),

    list(lustre@vdom@vattr:attribute(THE)),

    list(lustre@vdom@vnode:element(THE))

) -> lustre@vdom@vnode:element(THE).

submenu_with_icon(Id, Icon, Label, Attrs, Items) ->

    lustre@element@html:li(

        [],

        [lustre@element@html:details(

                lists:append([lustre@attribute:id(Id)], Attrs),

                [lustre@element@html:summary(

                        [lustre@attribute:aria_controls(

                                <<Id/binary, "-content"/utf8>>

                            )],

                        [Icon, lustre@element@html:text(Label)]

                    ),

                    lustre@element@html:ul(

                        [lustre@attribute:id(<<Id/binary, "-content"/utf8>>)],

                        Items

                    )]

            )]

    ).



-file("src/glaze/basecoat/sidebar.gleam", 222).

-spec footer(

    list(lustre@vdom@vattr:attribute(THL)),

    list(lustre@vdom@vnode:element(THL))

) -> lustre@vdom@vnode:element(THL).

footer(Attrs, Children) ->

    lustre@element@html:footer(Attrs, Children).



-file("src/glaze/basecoat/sidebar.gleam", 229).

-spec toggle_script(binary()) -> binary().

toggle_script(Sidebar_id) ->

    <<<<"document.dispatchEvent(new CustomEvent('basecoat:sidebar', { detail: { id: '"/utf8,

            Sidebar_id/binary>>/binary,

        "' } }));"/utf8>>.



-file("src/glaze/basecoat/sidebar.gleam", 235).

-spec toggle_script_default() -> binary().

toggle_script_default() ->

    <<"document.dispatchEvent(new CustomEvent('basecoat:sidebar'));"/utf8>>.



-file("src/glaze/basecoat/sidebar.gleam", 239).

-spec open_script(binary()) -> binary().

open_script(Sidebar_id) ->

    <<<<"document.dispatchEvent(new CustomEvent('basecoat:sidebar', { detail: { id: '"/utf8,

            Sidebar_id/binary>>/binary,

        "', action: 'open' } }));"/utf8>>.



-file("src/glaze/basecoat/sidebar.gleam", 245).

-spec close_script(binary()) -> binary().

close_script(Sidebar_id) ->

    <<<<"document.dispatchEvent(new CustomEvent('basecoat:sidebar', { detail: { id: '"/utf8,

            Sidebar_id/binary>>/binary,

        "', action: 'close' } }));"/utf8>>.