Skip to content

Commit 1bcb2e1

Browse files
committed
re-add title, but make it optional
1 parent d0eea4e commit 1bcb2e1

File tree

2 files changed

+16
-8
lines changed

2 files changed

+16
-8
lines changed

installer/templates/phx_web/components/core_components.ex

+8-4
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@ defmodule <%= @web_namespace %>.CoreComponents do
2929
"""
3030
attr :id, :string, doc: "the optional id of flash container"
3131
attr :flash, :map, default: %{}, doc: "the map of flash messages to display"
32+
attr :title, :string, default: nil
3233
attr :kind, :atom, values: [:info, :error], doc: "used for styling and flash lookup"
3334
attr :rest, :global, doc: "the arbitrary HTML attributes to add to the flash container"
3435

@@ -53,7 +54,10 @@ defmodule <%= @web_namespace %>.CoreComponents do
5354
<div class="flex gap-2">
5455
<.icon :if={@kind == :info} name="hero-information-circle-mini" class="h-5 w-5 shrink-0" />
5556
<.icon :if={@kind == :error} name="hero-exclamation-circle-mini" class="h-5 w-5 shrink-0" />
56-
<p class="text-sm leading-5">{msg}</p>
57+
<div class="text-sm leading-5">
58+
<p :if={@title} class="font-semibold">{@title}</p>
59+
<p>{msg}</p>
60+
</div>
5761
<div class="flex-1" />
5862
<button type="button" class="group flex self-start" aria-label=<%= maybe_heex_attr_gettext.("close", @gettext) %>>
5963
<.icon name="hero-x-mark-solid" class="h-5 w-5 opacity-40 group-hover:opacity-70" />
@@ -64,7 +68,7 @@ defmodule <%= @web_namespace %>.CoreComponents do
6468
end
6569

6670
@doc """
67-
Shows the flash group with standard content.
71+
Shows the flash group with standard titles and content.
6872
6973
## Examples
7074
@@ -81,23 +85,23 @@ defmodule <%= @web_namespace %>.CoreComponents do
8185
<.flash
8286
id="client-error"
8387
kind={:error}
88+
title=<%= maybe_heex_attr_gettext.("We can't find the internet", @gettext) %>
8489
phx-disconnected={show(".phx-client-error #client-error")}
8590
phx-connected={hide("#client-error")}
8691
hidden
8792
>
88-
<span class="font-semibold"><%= maybe_eex_gettext.("We can't find the internet!", @gettext)%></span>
8993
<%= maybe_eex_gettext.("Attempting to reconnect", @gettext) %>
9094
<.icon name="hero-arrow-path" class="ml-1 h-3 w-3 motion-safe:animate-spin" />
9195
</.flash>
9296
9397
<.flash
9498
id="server-error"
9599
kind={:error}
100+
title=<%= maybe_heex_attr_gettext.("Something went wrong!", @gettext) %>
96101
phx-disconnected={show(".phx-server-error #server-error")}
97102
phx-connected={hide("#server-error")}
98103
hidden
99104
>
100-
<span class="font-semibold"><%= maybe_eex_gettext.("Something went wrong!", @gettext)%></span>
101105
<%= maybe_eex_gettext.("Hang in there while we get back on track", @gettext) %>
102106
<.icon name="hero-arrow-path" class="ml-1 h-3 w-3 motion-safe:animate-spin" />
103107
</.flash>

priv/templates/phx.gen.live/core_components.ex

+8-4
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@ defmodule <%= @web_namespace %>.CoreComponents do
2929
"""
3030
attr :id, :string, doc: "the optional id of flash container"
3131
attr :flash, :map, default: %{}, doc: "the map of flash messages to display"
32+
attr :title, :string, default: nil
3233
attr :kind, :atom, values: [:info, :error], doc: "used for styling and flash lookup"
3334
attr :rest, :global, doc: "the arbitrary HTML attributes to add to the flash container"
3435

@@ -53,7 +54,10 @@ defmodule <%= @web_namespace %>.CoreComponents do
5354
<div class="flex gap-2">
5455
<.icon :if={@kind == :info} name="hero-information-circle-mini" class="h-5 w-5 shrink-0" />
5556
<.icon :if={@kind == :error} name="hero-exclamation-circle-mini" class="h-5 w-5 shrink-0" />
56-
<p class="text-sm leading-5">{msg}</p>
57+
<div class="text-sm leading-5">
58+
<p :if={@title} class="font-semibold">{@title}</p>
59+
<p>{msg}</p>
60+
</div>
5761
<div class="flex-1" />
5862
<button type="button" class="group flex self-start" aria-label=<%= maybe_heex_attr_gettext.("close", @gettext) %>>
5963
<.icon name="hero-x-mark-solid" class="h-5 w-5 opacity-40 group-hover:opacity-70" />
@@ -64,7 +68,7 @@ defmodule <%= @web_namespace %>.CoreComponents do
6468
end
6569

6670
@doc """
67-
Shows the flash group with standard content.
71+
Shows the flash group with standard titles and content.
6872
6973
## Examples
7074
@@ -81,23 +85,23 @@ defmodule <%= @web_namespace %>.CoreComponents do
8185
<.flash
8286
id="client-error"
8387
kind={:error}
88+
title=<%= maybe_heex_attr_gettext.("We can't find the internet", @gettext) %>
8489
phx-disconnected={show(".phx-client-error #client-error")}
8590
phx-connected={hide("#client-error")}
8691
hidden
8792
>
88-
<span class="font-semibold"><%= maybe_eex_gettext.("We can't find the internet!", @gettext)%></span>
8993
<%= maybe_eex_gettext.("Attempting to reconnect", @gettext) %>
9094
<.icon name="hero-arrow-path" class="ml-1 h-3 w-3 motion-safe:animate-spin" />
9195
</.flash>
9296
9397
<.flash
9498
id="server-error"
9599
kind={:error}
100+
title=<%= maybe_heex_attr_gettext.("Something went wrong!", @gettext) %>
96101
phx-disconnected={show(".phx-server-error #server-error")}
97102
phx-connected={hide("#server-error")}
98103
hidden
99104
>
100-
<span class="font-semibold"><%= maybe_eex_gettext.("Something went wrong!", @gettext)%></span>
101105
<%= maybe_eex_gettext.("Hang in there while we get back on track", @gettext) %>
102106
<.icon name="hero-arrow-path" class="ml-1 h-3 w-3 motion-safe:animate-spin" />
103107
</.flash>

0 commit comments

Comments
 (0)