Current section
41 Versions
Jump to
Current section
41 Versions
Compare versions
6
files changed
+78
additions
-5
deletions
| @@ -1,7 +1,7 @@ | |
| 1 1 | {<<"links">>, |
| 2 2 | [{<<"GitHub">>,<<"https://github.com/phcurado/daisy_ui_components">>}]}. |
| 3 3 | {<<"name">>,<<"daisy_ui_components">>}. |
| 4 | - {<<"version">>,<<"0.9.3">>}. |
| 4 | + {<<"version">>,<<"0.9.4">>}. |
| 5 5 | {<<"description">>,<<"DaisyUI component library for LiveView">>}. |
| 6 6 | {<<"elixir">>,<<"~> 1.14">>}. |
| 7 7 | {<<"app">>,<<"daisy_ui_components">>}. |
| @@ -41,6 +41,7 @@ | |
| 41 41 | <<"lib/daisy_ui_components/pagination.ex">>, |
| 42 42 | <<"lib/daisy_ui_components/radio.ex">>, |
| 43 43 | <<"lib/daisy_ui_components/label.ex">>, |
| 44 | + <<"lib/daisy_ui_components/toast.ex">>, |
| 44 45 | <<"lib/daisy_ui_components/accordion.ex">>, |
| 45 46 | <<"lib/daisy_ui_components/stat.ex">>,<<"lib/daisy_ui_components/icon.ex">>, |
| 46 47 | <<"lib/daisy_ui_components/indicator.ex">>, |
| @@ -34,7 +34,7 @@ defmodule DaisyUIComponents.Alert do | |
| 34 34 | ) |
| 35 35 | |
| 36 36 | ~H""" |
| 37 | - <div id={@id} class={@class} {@rest}> |
| 37 | + <div id={@id} role="alert" class={@class} {@rest}> |
| 38 38 | {render_slot(@inner_block)} |
| 39 39 | </div> |
| 40 40 | """ |
| @@ -112,10 +112,12 @@ defmodule DaisyUIComponents.Modal do | |
| 112 112 | > |
| 113 113 | <form :if={@closeable} method="dialog"> |
| 114 114 | <button |
| 115 | + type="button" |
| 116 | + aria-label="Close modal" |
| 115 117 | phx-click={JS.exec("data-cancel", to: "##{@modal_id}")} |
| 116 118 | class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2" |
| 117 119 | > |
| 118 | - âś• |
| 120 | + <span aria-hidden="true">âś•</span> |
| 119 121 | </button> |
| 120 122 | </form> |
| 121 123 | <div id={"#{@modal_id}-content"} class={@content_class}> |
| @@ -180,7 +180,7 @@ defmodule DaisyUIComponents.Table do | |
| 180 180 | <.td |
| 181 181 | :for={col <- @col} |
| 182 182 | phx-click={@row_click && @row_click.(row)} |
| 183 | - class={[@row_click && "hover:cursor-pointer", @col[:class]]} |
| 183 | + class={[@row_click && "hover:cursor-pointer", col[:class]]} |
| 184 184 | collapse_breakpoint={col[:collapse_breakpoint]} |
| 185 185 | > |
| 186 186 | {render_slot(col, @row_item.(row))} |
| @@ -0,0 +1,70 @@ | |
| 1 | + defmodule DaisyUIComponents.Toast do |
| 2 | + @moduledoc """ |
| 3 | + Toast component for displaying notifications positioned at the corners of the page. |
| 4 | + |
| 5 | + https://daisyui.com/components/toast/ |
| 6 | + |
| 7 | + ## Basic Example: |
| 8 | + <.toast> |
| 9 | + <.alert color="info">New message arrived.</.alert> |
| 10 | + </.toast> |
| 11 | + |
| 12 | + ## Positioned Example: |
| 13 | + <.toast horizontal="start" vertical="top"> |
| 14 | + <.alert color="success">Data saved successfully!</.alert> |
| 15 | + </.toast> |
| 16 | + """ |
| 17 | + |
| 18 | + use DaisyUIComponents, :component |
| 19 | + |
| 20 | + @doc """ |
| 21 | + Renders a toast container for positioning notifications. |
| 22 | + |
| 23 | + ## Examples |
| 24 | + |
| 25 | + <.toast> |
| 26 | + <.alert>Default notification</.alert> |
| 27 | + </.toast> |
| 28 | + |
| 29 | + <.toast horizontal="center" vertical="top"> |
| 30 | + <.alert color="info">Centered top notification</.alert> |
| 31 | + </.toast> |
| 32 | + """ |
| 33 | + attr :class, :any, default: nil |
| 34 | + attr :horizontal, :string, values: ~w(start center end), doc: "Horizontal alignment" |
| 35 | + attr :vertical, :string, values: ~w(top middle bottom), doc: "Vertical alignment" |
| 36 | + attr :rest, :global |
| 37 | + slot :inner_block |
| 38 | + |
| 39 | + def toast(assigns) do |
| 40 | + assigns = |
| 41 | + assign(assigns, :class, toast_classes(assigns)) |
| 42 | + |
| 43 | + ~H""" |
| 44 | + <div class={@class} {@rest}> |
| 45 | + {render_slot(@inner_block)} |
| 46 | + </div> |
| 47 | + """ |
| 48 | + end |
| 49 | + |
| 50 | + defp toast_classes(assigns) do |
| 51 | + classes([ |
| 52 | + "toast", |
| 53 | + toast_horizontal(assigns[:horizontal]), |
| 54 | + toast_vertical(assigns[:vertical]), |
| 55 | + assigns.class |
| 56 | + ]) |
| 57 | + end |
| 58 | + |
| 59 | + # Horizontal alignment |
| 60 | + defp toast_horizontal("start"), do: "toast-start" |
| 61 | + defp toast_horizontal("center"), do: "toast-center" |
| 62 | + defp toast_horizontal("end"), do: "toast-end" |
| 63 | + defp toast_horizontal(_), do: nil |
| 64 | + |
| 65 | + # Vertical alignment |
| 66 | + defp toast_vertical("top"), do: "toast-top" |
| 67 | + defp toast_vertical("middle"), do: "toast-middle" |
| 68 | + defp toast_vertical("bottom"), do: "toast-bottom" |
| 69 | + defp toast_vertical(_), do: nil |
| 70 | + end |
Loading more files…