Packages

daisy_ui_components

0.7.5
0.9.7 0.9.6 0.9.5 0.9.4 0.9.3 0.9.2 0.9.1 0.9.0 0.8.7 0.8.7-rc.0 0.8.6 0.8.5 0.8.4 0.8.3 0.8.2 0.8.1 0.8.0 0.7.6 0.7.5 0.7.4 0.7.3 0.7.2 0.7.1 0.7.0 0.6.0 0.5.0 0.4.3 0.4.2 0.4.1 0.4.0 0.3.0 0.2.1 0.2.0 0.1.7 0.1.6 0.1.5 0.1.4 0.1.3 0.1.2 0.1.1 0.1.0

DaisyUI component library for LiveView

HexDocs

Current section

41 Versions

Jump to
Readme
41 Versions
1 Dependency
Dependants
Files
Activity
Hide whitespace

Compare versions

6 files changed
+130 additions
-12 deletions
  @@ -217,8 +217,8 @@ List of available components.
217 217 | [Drawer](https://daisyui.com/components/drawer) | âś… | âś… |
218 218 | [Footer](https://daisyui.com/components/footer) | ❌ | ❌ |
219 219 | [Hero](https://daisyui.com/components/hero) | ❌ | ❌ |
220 - | [Indicator](https://daisyui.com/components/indicator) | ❌ | ❌ |
221 - | [Join](https://daisyui.com/components/join) | ✅ | ❌ |
220 + | [Indicator](https://daisyui.com/components/indicator) | âś… | âś… |
221 + | [Join](https://daisyui.com/components/join) | âś… | âś… |
222 222 | [Mask](https://daisyui.com/components/mask) | ❌ | ❌ |
223 223 | [Stack](https://daisyui.com/components/stack) | ❌ | ❌ |
  @@ -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.7.4">>}.
4 + {<<"version">>,<<"0.7.5">>}.
5 5 {<<"description">>,<<"DaisyUI component library for LiveView">>}.
6 6 {<<"elixir">>,<<"~> 1.14">>}.
7 7 {<<"app">>,<<"daisy_ui_components">>}.
  @@ -35,6 +35,7 @@
35 35 <<"lib/daisy_ui_components/icon.ex">>,
36 36 <<"lib/daisy_ui_components/sidebar.ex">>,
37 37 <<"lib/daisy_ui_components/text_input.ex">>,
38 + <<"lib/daisy_ui_components/indicator.ex">>,
38 39 <<"lib/daisy_ui_components/menu.ex">>,<<"lib/daisy_ui_components/join.ex">>,
39 40 <<"lib/daisy_ui_components/header.ex">>,
40 41 <<"lib/daisy_ui_components/input.ex">>,
  @@ -55,6 +55,7 @@ defmodule DaisyUIComponents do
55 55 import DaisyUIComponents.Form
56 56 import DaisyUIComponents.Header
57 57 import DaisyUIComponents.Icon
58 + import DaisyUIComponents.Indicator
58 59 import DaisyUIComponents.Input
59 60 import DaisyUIComponents.Join
60 61 import DaisyUIComponents.JSHelpers
  @@ -25,14 +25,7 @@ defmodule DaisyUIComponents.Badge do
25 25
26 26 def badge(assigns) do
27 27 assigns =
28 - assign(assigns, :class, [
29 - "badge",
30 - badge_color(assigns[:color]),
31 - maybe_add_class(assigns[:ghost], "badge-ghost"),
32 - maybe_add_class(assigns[:outline], "badge-outline"),
33 - badge_size(assigns[:size]),
34 - assigns.class
35 - ])
28 + assign(assigns, :class, badge_classes(assigns))
36 29
37 30 ~H"""
38 31 <div class={@class} {@rest}>
  @@ -41,6 +34,17 @@ defmodule DaisyUIComponents.Badge do
41 34 """
42 35 end
43 36
37 + def badge_classes(assigns) do
38 + classes([
39 + "badge",
40 + badge_color(assigns[:color]),
41 + maybe_add_class(assigns[:ghost], "badge-ghost"),
42 + maybe_add_class(assigns[:outline], "badge-outline"),
43 + badge_size(assigns[:size]),
44 + assigns.class
45 + ])
46 + end
47 +
44 48 # Color
45 49 defp badge_color("neutral"), do: "badge-neutral"
46 50 defp badge_color("primary"), do: "badge-primary"
  @@ -0,0 +1,111 @@
1 + defmodule DaisyUIComponents.Indicator do
2 + @moduledoc """
3 + Indicator component
4 +
5 + https://daisyui.com/components/indicator/
6 + """
7 +
8 + use DaisyUIComponents, :component
9 +
10 + alias DaisyUIComponents.Badge
11 +
12 + @aligns ~w(start end center)
13 + @directions ~w(top bottom middle)
14 +
15 + def indicator_aligns, do: @aligns
16 + def indicator_directions, do: @directions
17 +
18 + @doc ~S"""
19 + Renders a indicator.
20 +
21 + ## Examples
22 +
23 + <.indicator>
24 + <:badge color="secondary" />
25 + <div class="bg-base-300 grid h-32 w-32 place-items-center">content</div>
26 + </.indicator>
27 +
28 + without a badge slot:
29 +
30 + <.indicator>
31 + <.badge color="secondary" class="indicator-item"></.badge>
32 + <div class="bg-base-300 grid h-32 w-32 place-items-center">content</div>
33 + </.indicator>
34 + """
35 + attr :class, :string, default: nil
36 + attr :rest, :global
37 +
38 + slot :badge do
39 + attr :class, :any
40 + attr :color, :string, values: colors()
41 + attr :align, :string, values: @aligns
42 + attr :direction, :string, values: @directions
43 + end
44 +
45 + slot :inner_block
46 +
47 + def indicator(assigns) do
48 + assigns =
49 + assigns
50 + |> assign(
51 + :class,
52 + classes([
53 + "indicator",
54 + assigns.class
55 + ])
56 + )
57 +
58 + ~H"""
59 + <div class={@class} {@rest}>
60 + <.badge
61 + :for={badge <- @badge}
62 + class={badge[:class]}
63 + color={badge[:color]}
64 + align={badge[:align]}
65 + direction={badge[:direction]}
66 + >
67 + {render_slot(badge)}
68 + </.badge>
69 + {render_slot(@inner_block)}
70 + </div>
71 + """
72 + end
73 +
74 + attr :class, :any, default: nil
75 + attr :color, :string
76 + attr :align, :string, values: @aligns
77 + attr :direction, :string, values: @directions
78 + slot :inner_block
79 +
80 + defp badge(assigns) do
81 + assigns =
82 + assigns
83 + |> assign(
84 + :class,
85 + classes([
86 + Badge.badge_classes(assigns),
87 + "indicator-item",
88 + indicator_align(assigns[:align]),
89 + indicator_direction(assigns[:direction])
90 + ])
91 + )
92 +
93 + ~H"""
94 + <span class={@class}>
95 + {render_slot(@inner_block)}
96 + </span>
97 + """
98 + end
99 +
100 + # Color
101 + defp indicator_direction("top"), do: "indicator-top"
102 + defp indicator_direction("bottom"), do: "indicator-bottom"
103 + defp indicator_direction("middle"), do: "indicator-middle"
104 + defp indicator_direction(_direction), do: nil
105 +
106 + # Size
107 + defp indicator_align("start"), do: "indicator-start"
108 + defp indicator_align("end"), do: "indicator-end"
109 + defp indicator_align("center"), do: "indicator-center"
110 + defp indicator_align(_align), do: nil
111 + end
Loading more files…