initial commit

.formatter.exs

@@ -0,0 +1,4 @@
+# Used by "mix format"
+[
+  inputs: ["{mix,.formatter}.exs", "{config,lib,test}/**/*.{ex,exs}"]
+]

.gitignore

@@ -0,0 +1,26 @@
+# The directory Mix will write compiled artifacts to.
+/_build/
+
+# If you run "mix test --cover", coverage assets end up here.
+/cover/
+
+# The directory Mix downloads your dependencies sources to.
+/deps/
+
+.elixir_ls
+
+# Where 3rd-party dependencies like ExDoc output generated docs.
+/doc/
+
+# Ignore .fetch files in case you like to edit your project deps locally.
+/.fetch
+
+# If the VM crashes, it generates a dump, let's ignore it too.
+erl_crash.dump
+
+# Also ignore archive artifacts (built via "mix archive.build").
+*.ez
+
+# Ignore package tarball (built via "mix hex.build").
+sveltex-*.tar
+

README.md

@@ -0,0 +1,21 @@
+# Sveltex
+
+**TODO: Add description**
+
+## Installation
+
+If [available in Hex](https://hex.pm/docs/publish), the package can be installed
+by adding `sveltex` to your list of dependencies in `mix.exs`:
+
+```elixir
+def deps do
+  [
+    {:sveltex, "~> 0.1.0"}
+  ]
+end
+```
+
+Documentation can be generated with [ExDoc](https://github.com/elixir-lang/ex_doc)
+and published on [HexDocs](https://hexdocs.pm). Once published, the docs can
+be found at [https://hexdocs.pm/sveltex](https://hexdocs.pm/sveltex).
+

assets/sveltex.js

@@ -0,0 +1,26 @@
+const context = require.context(“../../assets/js/svelte”, false, /\.svelte/);
+window.onload = function() {
+  context.keys().forEach((file) => {
+    const componentName = file.replace(/\.\/|\.svelte/g, ‘’);
+    const targetId = `sveltex-${componentName}`;
+
+    const root = document.getElementById(targetId);
+
+    if(!root){
+      return;
+    }
+
+    const requiredApp = require(`../../assets/js/svelte/${componentName}.svelte`);
+
+    const props = root.getAttribute(‘data-props’);
+    let parsedProps = {};
+    if(props){
+      parsedProps = JSON.parse(props);
+    }
+
+    new requiredApp.default({
+      target: root,
+      props: parsedProps
+    });
+  });
+};

config/config.exs

@@ -0,0 +1,30 @@
+# This file is responsible for configuring your application
+# and its dependencies with the aid of the Mix.Config module.
+use Mix.Config
+
+# This configuration is loaded before any dependency and is restricted
+# to this project. If another project depends on this project, this
+# file won't be loaded nor affect the parent project. For this reason,
+# if you want to provide default values for your application for
+# 3rd-party users, it should be done in your "mix.exs" file.
+
+# You can configure your application as:
+#
+#     config :sveltex, key: :value
+#
+# and access this configuration in your application as:
+#
+#     Application.get_env(:sveltex, :key)
+#
+# You can also configure a 3rd-party app:
+#
+#     config :logger, level: :info
+#
+
+# It is also possible to import configuration files, relative to this
+# directory. For example, you can emulate configuration per environment
+# by uncommenting the line below and defining dev.exs, test.exs and such.
+# Configuration from the imported file will override the ones defined
+# here (which is why it is important to import them last).
+#
+#     import_config "#{Mix.env()}.exs"

lib/sveltex.ex

@@ -0,0 +1,30 @@
+defmodule Sveltex do
+  @moduledoc """
+  Sveltex is a small library to make embedding svelte component as easy as possible when it comes to works with Phoenix.
+  """
+
+  @doc """
+  Main function to turn markup into html component which later on being parsed by the javascript side.
+
+  ## Examples
+
+      iex> Sveltex.hello()
+      :world
+
+  """
+  def sveltex(name, props) do
+    Phoenix.HTML.Tag.tag(:div,
+      data: [props: payload(props)],
+      id: "sveltex-#{String.replace(name, " ", "-")}"
+    )
+  end
+
+  defp payload(props) do
+    props
+    |> Jason.encode()
+    |> case do
+      {:ok, message} -> message
+      {:error, _} -> ""
+    end
+  end
+end

mix.exs

@@ -0,0 +1,30 @@
+defmodule Sveltex.MixProject do
+  use Mix.Project
+
+  def project do
+    [
+      app: :sveltex,
+      version: "0.1.0",
+      elixir: "~> 1.7",
+      start_permanent: Mix.env() == :prod,
+      deps: deps()
+    ]
+  end
+
+  # Run "mix help compile.app" to learn about applications.
+  def application do
+    [
+      extra_applications: [:logger]
+    ]
+  end
+
+  # Run "mix help deps" to learn about dependencies.
+  defp deps do
+    [
+      {:phoenix_html, "~> 2.13"},
+      {:jason, "~> 1.1"}
+      # {:dep_from_hexpm, "~> 0.3.0"},
+      # {:dep_from_git, git: "https://github.com/elixir-lang/my_dep.git", tag: "0.1.0"},
+    ]
+  end
+end

mix.lock

@@ -0,0 +1,7 @@
+%{
+  "jason": {:hex, :jason, "1.1.2", "b03dedea67a99223a2eaf9f1264ce37154564de899fd3d8b9a21b1a6fd64afe7", [:mix], [{:decimal, "~> 1.0", [hex: :decimal, repo: "hexpm", optional: true]}], "hexpm"},
+  "mime": {:hex, :mime, "1.3.1", "30ce04ab3175b6ad0bdce0035cba77bba68b813d523d1aac73d9781b4d193cf8", [:mix], [], "hexpm"},
+  "phoenix_html": {:hex, :phoenix_html, "2.13.3", "850e292ff6e204257f5f9c4c54a8cb1f6fbc16ed53d360c2b780a3d0ba333867", [:mix], [{:plug, "~> 1.5", [hex: :plug, repo: "hexpm", optional: false]}], "hexpm"},
+  "plug": {:hex, :plug, "1.8.3", "12d5f9796dc72e8ac9614e94bda5e51c4c028d0d428e9297650d09e15a684478", [:mix], [{:mime, "~> 1.0", [hex: :mime, repo: "hexpm", optional: false]}, {:plug_crypto, "~> 1.0", [hex: :plug_crypto, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4", [hex: :telemetry, repo: "hexpm", optional: true]}], "hexpm"},
+  "plug_crypto": {:hex, :plug_crypto, "1.0.0", "18e49317d3fa343f24620ed22795ec29d4a5e602d52d1513ccea0b07d8ea7d4d", [:mix], [], "hexpm"},
+}

test/sveltex_test.exs

@@ -0,0 +1,8 @@
+defmodule SveltexTest do
+  use ExUnit.Case
+  doctest Sveltex
+
+  test "greets the world" do
+    assert Sveltex.hello() == :world
+  end
+end

test/test_helper.exs

@@ -0,0 +1 @@
+ExUnit.start()