Current section
Files
Jump to
Current section
Files
src/glaze_oat@dialog.erl
-module(glaze_oat@dialog).
-compile([no_auto_import, nowarn_unused_vars, nowarn_unused_function, nowarn_nomatch, inline]).
-define(FILEPATH, "src/glaze_oat/dialog.gleam").
-export([dialog/2, id/1, open_for/1, close_for/1, form/2, closed_by_any/0, closed_by_none/0, closed_by_close_request/0, header/2, title/2, footer/2]).
-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(
" Oat documentation: <https://oat.ink/components/dialog/>\n"
"\n"
" The [`dialog`](#dialog) helpers build native HTML dialog flows for\n"
" confirmations, forms, and focused tasks.\n"
"\n"
" ## Anatomy\n"
"\n"
" A dialog flow usually includes a dialog container, a trigger that opens it,\n"
" and actions that close it. Most dialogs also include a header/title and\n"
" footer actions.\n"
"\n"
" ## Recipes\n"
"\n"
" ### Open and close a dialog with command attributes\n"
"\n"
" ```gleam\n"
" import glaze_oat/dialog\n"
" import lustre/attribute\n"
" import lustre/element/html\n"
"\n"
" fn confirm_delete() {\n"
" let id = \"delete-dialog\"\n"
"\n"
" html.div([], [\n"
" html.button(dialog.open_for(id), [html.text(\"Delete\")]),\n"
" dialog.dialog([dialog.id(id)], [\n"
" dialog.header([], [dialog.title([], [html.text(\"Delete item?\")])]),\n"
" html.p([], [html.text(\"This action cannot be undone.\")]),\n"
" dialog.footer([], [\n"
" html.button(dialog.close_for(id), [html.text(\"Cancel\")]),\n"
" html.button([attribute.class(\"danger\")], [html.text(\"Delete\")]),\n"
" ]),\n"
" ]),\n"
" ])\n"
" }\n"
" ```\n"
"\n"
" ### Close from inside with a dialog form\n"
"\n"
" ```gleam\n"
" import glaze_oat/dialog\n"
" import lustre/element/html\n"
"\n"
" fn simple_dialog() {\n"
" dialog.dialog([dialog.id(\"settings\")], [\n"
" dialog.form([], [\n"
" html.p([], [html.text(\"Done\")]),\n"
" html.button([], [html.text(\"Close\")]),\n"
" ]),\n"
" ])\n"
" }\n"
" ```\n"
"\n"
" ## Close behavior\n"
"\n"
" - [`closed_by_any`](#closed_by_any)\n"
" - [`closed_by_none`](#closed_by_none)\n"
" - [`closed_by_close_request`](#closed_by_close_request)\n"
"\n"
" ## References\n"
"\n"
" - MDN `<dialog>`: <https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog>\n"
" - MDN `HTMLDialogElement`: <https://developer.mozilla.org/en-US/docs/Web/API/HTMLDialogElement>\n"
" - MDN `<form>` `method` attribute (`method=\"dialog\"`):\n"
" <https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/form#method>\n"
" - MDN Invoker Commands (`command`/`commandfor` on dialog controls):\n"
" <https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog>\n"
).
-file("src/glaze_oat/dialog.gleam", 77).
?DOC(
" Render a dialog container.\n"
"\n"
" Use this as the root element for modal and non-modal dialog content.\n"
).
-spec dialog(
list(lustre@vdom@vattr:attribute(PZE)),
list(lustre@vdom@vnode:element(PZE))
) -> lustre@vdom@vnode:element(PZE).
dialog(Attrs, Children) ->
lustre@element@html:dialog(Attrs, Children).
-file("src/glaze_oat/dialog.gleam", 88).
?DOC(
" Set an `id` on a dialog.\n"
"\n"
" Pair this with [`open_for`](#open_for) and [`close_for`](#close_for).\n"
).
-spec id(binary()) -> lustre@vdom@vattr:attribute(any()).
id(Name) ->
lustre@attribute:id(Name).
-file("src/glaze_oat/dialog.gleam", 96).
?DOC(
" Attributes for a control that opens the target dialog.\n"
"\n"
" Attach these to a button or other interactive element.\n"
).
-spec open_for(binary()) -> list(lustre@vdom@vattr:attribute(any())).
open_for(Name) ->
[lustre@attribute:attribute(<<"commandfor"/utf8>>, Name),
lustre@attribute:attribute(<<"command"/utf8>>, <<"show-modal"/utf8>>)].
-file("src/glaze_oat/dialog.gleam", 104).
?DOC(
" Attributes for a control that closes the target dialog.\n"
"\n"
" Attach these to a button or other interactive element.\n"
).
-spec close_for(binary()) -> list(lustre@vdom@vattr:attribute(any())).
close_for(Name) ->
[lustre@attribute:attribute(<<"commandfor"/utf8>>, Name),
lustre@attribute:attribute(<<"command"/utf8>>, <<"close"/utf8>>)].
-file("src/glaze_oat/dialog.gleam", 112).
?DOC(
" Render a form that closes its parent dialog on submit.\n"
"\n"
" Useful for cancel/confirm controls inside dialog content.\n"
).
-spec form(
list(lustre@vdom@vattr:attribute(PZS)),
list(lustre@vdom@vnode:element(PZS))
) -> lustre@vdom@vnode:element(PZS).
form(Attrs, Children) ->
lustre@element@html:form(
[lustre@attribute:method(<<"dialog"/utf8>>) | Attrs],
Children
).
-file("src/glaze_oat/dialog.gleam", 121).
?DOC(" Allow the dialog to close from any supported close interaction.\n").
-spec closed_by_any() -> lustre@vdom@vattr:attribute(any()).
closed_by_any() ->
lustre@attribute:attribute(<<"closedby"/utf8>>, <<"any"/utf8>>).
-file("src/glaze_oat/dialog.gleam", 127).
?DOC(" Prevent automatic close interactions.\n").
-spec closed_by_none() -> lustre@vdom@vattr:attribute(any()).
closed_by_none() ->
lustre@attribute:attribute(<<"closedby"/utf8>>, <<"none"/utf8>>).
-file("src/glaze_oat/dialog.gleam", 133).
?DOC(" Allow close requests such as Esc and explicit close commands.\n").
-spec closed_by_close_request() -> lustre@vdom@vattr:attribute(any()).
closed_by_close_request() ->
lustre@attribute:attribute(<<"closedby"/utf8>>, <<"closerequest"/utf8>>).
-file("src/glaze_oat/dialog.gleam", 137).
-spec header(
list(lustre@vdom@vattr:attribute(QAE)),
list(lustre@vdom@vnode:element(QAE))
) -> lustre@vdom@vnode:element(QAE).
header(Attrs, Children) ->
lustre@element@html:header(Attrs, Children).
-file("src/glaze_oat/dialog.gleam", 144).
-spec title(
list(lustre@vdom@vattr:attribute(QAK)),
list(lustre@vdom@vnode:element(QAK))
) -> lustre@vdom@vnode:element(QAK).
title(Attrs, Children) ->
lustre@element@html:h3(Attrs, Children).
-file("src/glaze_oat/dialog.gleam", 151).
-spec footer(
list(lustre@vdom@vattr:attribute(QAQ)),
list(lustre@vdom@vnode:element(QAQ))
) -> lustre@vdom@vnode:element(QAQ).
footer(Attrs, Children) ->
lustre@element@html:footer(Attrs, Children).