Current section
41 Versions
Jump to
Current section
41 Versions
Compare versions
6
files changed
+78
additions
-7
deletions
| @@ -1,5 +1,5 @@ | |
| 1 1 | [ |
| 2 2 | plugins: [Phoenix.LiveView.HTMLFormatter], |
| 3 | - import_deps: [:phoenix], |
| 3 | + import_deps: [:phoenix, :assert_html], |
| 4 4 | inputs: ["*.{heex,ex,exs}", "{config,lib,test}/**/*.{heex,ex,exs}"] |
| 5 5 | ] |
| @@ -1,6 +1,5 @@ | |
| 1 1 | # DaisyUI Components |
| 2 2 | |
| 3 | - |
| 4 3 | <img src="daisyui-logomark-1024-1024.png" alt="Daisy UI Logo" width="150"> |
| 5 4 | |
| 6 5 | [](https://github.com/phcurado/daisy_ui_components/actions?query=branch%3Amain+workflow%3Aci) |
| @@ -14,6 +13,7 @@ This project brings [Daisy UI](https://daisyui.com/) components into your Phoeni | |
| 14 13 | This project is still experimental, expect breaking changes in future. |
| 15 14 | |
| 16 15 | ## Installation |
| 16 | + |
| 17 17 | <!-- MDOC --> |
| 18 18 | |
| 19 19 | Reference this repository on your `mix.exs` file to start using. |
| @@ -87,7 +87,7 @@ List of available components. | |
| 87 87 | - [Avatar](https://daisyui.com/components/avatar) âś… |
| 88 88 | - [Badge](https://daisyui.com/components/badge) âś… |
| 89 89 | - [Bottom navigation](https://daisyui.com/components/botton-navigation) ❌ |
| 90 | - - [Breadcrumbs](https://daisyui.com/components/breadcrumbs) ❌ |
| 90 | + - [Breadcrumbs](https://daisyui.com/components/breadcrumbs) âś… |
| 91 91 | - [Button group](https://daisyui.com/components/button-group) âś… |
| 92 92 | - [Button](https://daisyui.com/components/button) âś… |
| 93 93 | - [Card](https://daisyui.com/components/card) âś… |
| @@ -108,6 +108,7 @@ List of available components. | |
| 108 108 | - [Text Input](https://daisyui.com/components/input) âś… |
| 109 109 | - [Kbd](https://daisyui.com/components/kbd) ❌ |
| 110 110 | - [Link](https://daisyui.com/components/link) ❌ |
| 111 | + - [Loading](https://daisyui.com/components/loading/) âś… |
| 111 112 | - [Mask](https://daisyui.com/components/mask) ❌ |
| 112 113 | - [Menu](https://daisyui.com/components/menu) ❌ |
| 113 114 | - [Code mockup](https://daisyui.com/components/mockup-code) ❌ |
| @@ -11,6 +11,7 @@ | |
| 11 11 | <<"lib/daisy_ui_components/avatar.ex">>, |
| 12 12 | <<"lib/daisy_ui_components/pagination.ex">>, |
| 13 13 | <<"lib/daisy_ui_components/tooltip.ex">>, |
| 14 | + <<"lib/daisy_ui_components/loading.ex">>, |
| 14 15 | <<"lib/daisy_ui_components/card.ex">>, |
| 15 16 | <<"lib/daisy_ui_components/modal.ex">>, |
| 16 17 | <<"lib/daisy_ui_components/navbar.ex">>, |
| @@ -42,4 +43,4 @@ | |
| 42 43 | {<<"optional">>,false}, |
| 43 44 | {<<"repository">>,<<"hexpm">>}, |
| 44 45 | {<<"requirement">>,<<"~> 0.20.14">>}]]}. |
| 45 | - {<<"version">>,<<"0.1.6">>}. |
| 46 | + {<<"version">>,<<"0.1.7">>}. |
| @@ -31,6 +31,7 @@ defmodule DaisyUIComponents do | |
| 31 31 | import DaisyUIComponents.TextInput |
| 32 32 | import DaisyUIComponents.Textarea |
| 33 33 | import DaisyUIComponents.Tooltip |
| 34 | + import DaisyUIComponents.Loading |
| 34 35 | end |
| 35 36 | end |
| 36 37 | end |
| @@ -0,0 +1,66 @@ | |
| 1 | + defmodule DaisyUIComponents.Loading do |
| 2 | + @moduledoc """ |
| 3 | + Loading component |
| 4 | + |
| 5 | + https://daisyui.com/components/loading/ |
| 6 | + |
| 7 | + |
| 8 | + """ |
| 9 | + use DaisyUIComponents.Component |
| 10 | + |
| 11 | + @doc """ |
| 12 | + Renders a loading. |
| 13 | + |
| 14 | + ## Examples |
| 15 | + |
| 16 | + <.loading></.loading> |
| 17 | + <.loading phx-click="go" shape="infinity" color="warning" size="lg" ></.loading> |
| 18 | + """ |
| 19 | + attr :class, :string, default: nil |
| 20 | + attr :shape, :string, required: true, values: ~w(spinner dots ring ball bars infinity) |
| 21 | + attr :color, :string, values: colors() ++ ["neutral"] |
| 22 | + attr :size, :string, values: sizes() |
| 23 | + attr :rest, :global, include: ~w(id) |
| 24 | + |
| 25 | + def loading(assigns) do |
| 26 | + assigns = |
| 27 | + assign(assigns, :class, [ |
| 28 | + "loading", |
| 29 | + loading_shape(assigns[:shape]), |
| 30 | + loading_color(assigns[:color]), |
| 31 | + loading_size(assigns[:size]), |
| 32 | + assigns.class |
| 33 | + ]) |
| 34 | + |
| 35 | + ~H""" |
| 36 | + <span class={@class} {@rest}></span> |
| 37 | + """ |
| 38 | + end |
| 39 | + |
| 40 | + defp loading_color("neutral"), do: "text-neutral" |
| 41 | + defp loading_color("primary"), do: "text-primary" |
| 42 | + defp loading_color("secondary"), do: "text-secondary" |
| 43 | + defp loading_color("accent"), do: "text-accent" |
| 44 | + defp loading_color("info"), do: "text-info" |
| 45 | + defp loading_color("success"), do: "text-success" |
| 46 | + defp loading_color("warning"), do: "text-warning" |
| 47 | + defp loading_color("error"), do: "text-error" |
| 48 | + defp loading_color(_color), do: nil |
| 49 | + |
| 50 | + # Size |
| 51 | + defp loading_size("xs"), do: "loading-xs" |
| 52 | + defp loading_size("sm"), do: "loading-sm" |
| 53 | + defp loading_size("md"), do: "loading-md" |
| 54 | + defp loading_size("lg"), do: "loading-lg" |
| 55 | + defp loading_size(_size), do: nil |
| 56 | + |
| 57 | + # Shapes |
| 58 | + |
| 59 | + defp loading_shape("spinner"), do: "loading-spinner" |
| 60 | + defp loading_shape("dots"), do: "loading-dots" |
| 61 | + defp loading_shape("ring"), do: "loading-ring" |
| 62 | + defp loading_shape("ball"), do: "loading-ball" |
| 63 | + defp loading_shape("bars"), do: "loading-bars" |
| 64 | + defp loading_shape("infinity"), do: "loading-infinity" |
| 65 | + defp loading_shape(_shape), do: nil |
| 66 | + end |
Loading more files…