implement Phoenix.HTML.Safe protocol

README.md

@@ -56,7 +56,7 @@ Be sure to use your own project's module name in place of `YourAppWeb`.
 
 ```html
 <script type="importmap">
-  <%= raw PhoenixImportmap.importmap(YourAppWeb.Endpoint) %>
+  <%= PhoenixImportmap.importmap(YourAppWeb.Endpoint) %>
 </script>
 <script type="module">
   import 'app';

lib/phoenix_importmap.ex

@@ -54,7 +54,7 @@ defmodule PhoenixImportmap do
 
   ```html
   <script type="importmap">
-  <%= raw PhoenixImportmap.importmap(YourAppWeb.Endpoint) %>
+  <%= PhoenixImportmap.importmap(YourAppWeb.Endpoint) %>
   </script>
   <script type="module">
   import 'app';
@@ -87,14 +87,15 @@ defmodule PhoenixImportmap do
   alias PhoenixImportmap.Importmap
 
   @doc """
-  Returns a JSON-formatted importmap based on your application configuration.
+  Returns a `t:PhoenixImportmap.Importmap` struct that implements the `Phoenix.HTML.Safe` protocol, allwoing safe interpolation in your template.
+
+  The resulting JSON-formatted importmap is based on your application configuration.
 
   Requires `YourAppWeb.Endpoint` to be passed in for path generation.
   """
   def importmap(endpoint) do
     application_importmap()
     |> Importmap.prepare(endpoint)
-    |> Importmap.json()
   end
 
   @doc """

lib/phoenix_importmap/importmap.ex

@@ -5,6 +5,13 @@ defmodule PhoenixImportmap.Importmap do
 
   alias PhoenixImportmap.Asset
 
+  @derive Jason.Encoder
+  defstruct [:imports]
+
+  @type t() :: %__MODULE__{
+          imports: map()
+        }
+
   @doc """
   Copies importmap assets to `:copy_destination_path`.
   """
@@ -46,7 +53,7 @@ defmodule PhoenixImportmap.Importmap do
   - Uses `YourAppWeb.Endpoint.static_path/1` to determine whether to use digest URLs.
   """
   def prepare(importmap = %{}, endpoint) do
-    %{
+    %__MODULE__{
       imports:
         importmap
         |> Enum.reduce(%{}, fn {specifier, path}, acc ->
@@ -58,4 +65,10 @@ defmodule PhoenixImportmap.Importmap do
         end)
     }
   end
+
+  defimpl Phoenix.HTML.Safe do
+    def to_iodata(importmap) do
+      Jason.encode_to_iodata!(importmap)
+    end
+  end
 end

mix.exs

@@ -32,6 +32,7 @@ defmodule PhoenixImportmap.MixProject do
     [
       {:file_system, "~> 1.0"},
       {:jason, "~> 1.4.4"},
+      {:phoenix_html, "~> 4.1"},
       {:ex_doc, ">= 0.0.0", only: :dev, runtime: false}
     ]
   end

test/phoenix_importmap_test.exs

@@ -31,7 +31,12 @@ defmodule PhoenixImportmapTest do
   end
 
   test "importmap" do
-    assert PhoenixImportmap.importmap(MockEndpoint) ==
+    html_escaped_string =
+      PhoenixImportmap.importmap(MockEndpoint)
+      |> Phoenix.HTML.html_escape()
+      |> Phoenix.HTML.safe_to_string()
+
+    assert html_escaped_string ==
              "{\"imports\":{\"remote\":\"https://cdn.es6/package.js?busted=t\",\"app\":\"/assets/app.js?busted=t\"}}"
   end
 end