From 8de47ab1e3a0cac5c7e43a48c867936875a097a8 Mon Sep 17 00:00:00 2001 From: Dzung Nguyen Date: Wed, 6 Nov 2024 07:53:01 +0700 Subject: [PATCH 1/3] Update document - Update post install message - Update readme to explain the different between init modes. --- README.md | 21 +++++++++++++++++++-- lib/mix/tasks/salad.init.ex | 6 +++++- 2 files changed, 24 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 3dbafa0..a797941 100644 --- a/README.md +++ b/README.md @@ -29,6 +29,9 @@ 1. **Using `salad_ui` as part of your project:** +> This way you can install only components that you want to use or you want to edit SaladUI's component source code to fit your need. +> If you just want to use SaladUI's components, see **Using as library** below. + - Adding `salad_ui` to your list of dependencies in `mix.exs`: ```elixir @@ -67,6 +70,20 @@ end #> mix salad.init --as-lib ``` +- Using in your project +``` +defmodule MyModule do + # import any component you need + import SaladUI.Button + + def render(_) do + ~H""" + <.button>Click me + """ + end +end +``` + ## More configuration 1. Custom error translate function @@ -102,7 +119,7 @@ To run the failing tests only, just run `mix test.watch --stale`. - ✅ Accordion - ✅ Alert -- 🚧 Alert Dialog +- ✅ Alert Dialog - ✅ Avatar - ✅ Badge - ✅ Breadcrumb @@ -111,7 +128,7 @@ To run the failing tests only, just run `mix test.watch --stale`. - [ ] Carousel - ✅ Chart - ✅ Checkbox -- 🚧 Collapsible +- ✅ Collapsible - [ ] Combobox - [ ] Command - [ ] Context Menu diff --git a/lib/mix/tasks/salad.init.ex b/lib/mix/tasks/salad.init.ex index 2abb418..5084154 100644 --- a/lib/mix/tasks/salad.init.ex +++ b/lib/mix/tasks/salad.init.ex @@ -49,7 +49,11 @@ defmodule Mix.Tasks.Salad.Init do :ok <- maybe_write_helpers_module(component_path, app_name, opts), :ok <- maybe_write_component_module(component_path, app_name, opts), :ok <- install_node_dependencies(node_opts) do - Mix.shell().info("Done. Now you can add components by running mix salad.add ") + if opts[:as_lib] do + Mix.shell().info("Done. Now you can use any component by importSaladUI. in your project.") + else + Mix.shell().info("Done. Now you can add components by running mix salad.add ") + end else {:error, reason} -> Mix.shell().error("Error during setup: #{reason}") end From 384520be0fe86f96bd63f6814d2bc6998ac55514 Mon Sep 17 00:00:00 2001 From: Dzung Nguyen Date: Wed, 6 Nov 2024 08:19:14 +0700 Subject: [PATCH 2/3] Fix format --- lib/salad_ui/accordion.ex | 2 -- lib/salad_ui/alert_dialog.ex | 6 +++--- lib/salad_ui/popover.ex | 22 +++++++++++++++------- test/salad_ui/chart_test.exs | 1 + test/salad_ui/collapsible_test.exs | 22 +++++++++++++--------- test/salad_ui/popover_test.exs | 3 ++- 6 files changed, 34 insertions(+), 22 deletions(-) diff --git a/lib/salad_ui/accordion.ex b/lib/salad_ui/accordion.ex index 4e50430..7701256 100644 --- a/lib/salad_ui/accordion.ex +++ b/lib/salad_ui/accordion.ex @@ -37,7 +37,6 @@ defmodule SaladUI.Accordion do slot :inner_block, required: true def accordion(assigns) do - ~H"""
<%= render_slot(@inner_block) %> @@ -61,7 +60,6 @@ defmodule SaladUI.Accordion do attr :open, :boolean, default: false slot :inner_block, required: true - def accordion_trigger(assigns) do ~H"""
diff --git a/lib/salad_ui/alert_dialog.ex b/lib/salad_ui/alert_dialog.ex index 89fb49f..f260ffe 100644 --- a/lib/salad_ui/alert_dialog.ex +++ b/lib/salad_ui/alert_dialog.ex @@ -253,9 +253,9 @@ defmodule SaladUI.AlertDialog do @doc """ Show alert dialog """ - def show_alert_dialog( js \\ %JS{}, %{id: id} = _builder) do + def show_alert_dialog(js \\ %JS{}, %{id: id} = _builder) do js - |> JS.set_attribute( {"data-state", "open"}, to: "##{id} .alert-dialog-content") + |> JS.set_attribute({"data-state", "open"}, to: "##{id} .alert-dialog-content") |> JS.show(to: "##{id} .alert-dialog-content", transition: {"_", "_", "_"}, time: 150) |> JS.add_class("overflow-hidden", to: "body") |> JS.focus_first(to: "##{id} .alert-dialog-content") @@ -266,7 +266,7 @@ defmodule SaladUI.AlertDialog do """ def hide_alert_dialog(js \\ %JS{}, %{id: id} = _builder) do js - |> JS.set_attribute( {"data-state", "closed"}, to: "##{id} .alert-dialog-content") + |> JS.set_attribute({"data-state", "closed"}, to: "##{id} .alert-dialog-content") |> JS.hide(to: "##{id} .alert-dialog-content", transition: {"_", "_", "_"}, time: 130) |> JS.remove_class("overflow-hidden", to: "body") |> JS.pop_focus() diff --git a/lib/salad_ui/popover.ex b/lib/salad_ui/popover.ex index ac0b722..2759b8c 100644 --- a/lib/salad_ui/popover.ex +++ b/lib/salad_ui/popover.ex @@ -43,8 +43,11 @@ defmodule SaladUI.Popover do Render popover trigger """ attr :class, :string, default: nil - attr :target, :string, required: true, - doc: "The id of target element to show popover" + + attr :target, :string, + required: true, + doc: "The id of target element to show popover" + attr :rest, :global slot :inner_block, required: true @@ -77,9 +80,15 @@ defmodule SaladUI.Popover do def popover_content(assigns) do assigns = - assign(assigns, :variant_class, side_variant(assigns.side, assigns.align)) - |> assign_new(:state, fn -> if assigns[:open] in ["true", true] do "open" else "closed" end end) - + assigns + |> assign(:variant_class, side_variant(assigns.side, assigns.align)) + |> assign_new(:state, fn -> + if assigns[:open] in ["true", true] do + "open" + else + "closed" + end + end) ~H""" " + assert html =~ + "div class=\"relative inline-block\">
Hover card content
" end end end From f7f53fce365fd75551e059c2e0a52333b5e3963c Mon Sep 17 00:00:00 2001 From: Dzung Nguyen Date: Wed, 6 Nov 2024 08:31:37 +0700 Subject: [PATCH 3/3] Update test ci --- .github/workflows/tests.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/tests.yml b/.github/workflows/tests.yml index 5394d90..1de0909 100644 --- a/.github/workflows/tests.yml +++ b/.github/workflows/tests.yml @@ -84,4 +84,4 @@ jobs: # Step: Execute the tests. - name: Run tests - run: mix test \ No newline at end of file + run: mix test test/salad_ui