preparing for v0.1

BeaconCMS · May 25, 2023 · 98e59e0 · 98e59e0
1 parent b97a2cb
commit 98e59e0
Show file tree

Hide file tree

Showing 5 changed files with 136 additions and 30 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -0,0 +1,7 @@
+# Changelog
+
+## 0.1.0
+
+### Enhancements
+  * Add `<LiveMonacoEditor.code_editor>` component
+
diff --git a/README.md b/README.md
@@ -1,5 +1,10 @@
 # LiveMonacoEditor
 
+[![Documentation](http://img.shields.io/badge/hex.pm-docs-green.svg?style=flat)](https://hexdocs.pm/live_monaco_editor)
+[![Package](https://img.shields.io/hexpm/v/live_monaco_editor.svg)](https://hex.pm/packages/live_monaco_editor)
+
+<!-- MDOC -->
+
 [Monaco Editor](https://microsoft.github.io/monaco-editor/) component for Phoenix LiveView.
 
 ## Installation
@@ -9,14 +14,14 @@ Add `:live_monaco_editor` dependency:
 ```elixir
 def deps do
   [
-    {:live_monaco_editor, github: "BeaconCMS/live_monaco_editor"}
+    {:live_monaco_editor, "~> 0.1"}
   ]
 end
 ```
 
 Once installed, change your `assets/js/app.js` to load the code editor hook in the live socket:
 
-```js
+```javascript
 import { CodeEditorHook } from "../../deps/live_monaco_editor/priv/static/live_monaco_editor.esm"
 
 let Hooks = {}
@@ -33,17 +38,6 @@ A new editor using the default options can be created as:
 <LiveMonacoEditor.code_editor value="# My Code Editor" />
 ```
 
-## Local Development
-
-The file `dev.exs` is a self-contained Phoenix application running LiveMonacoEditor. Execute:
-
-```sh
-mix setup
-iex -S mix dev
-```
-
-Visit http://localhost:4002
-
 ## Features
 
 ### Set editor options
@@ -88,7 +82,7 @@ You can listen to events emitted by the code editor to fetch its current value a
 ```javascript
 window.addEventListener("lme:editor_mounted", (ev) => {
   const hook = ev.detail.hook
-  
+
   // https://microsoft.github.io/monaco-editor/docs.html#interfaces/editor.IStandaloneCodeEditor.html
   const editor = ev.detail.editor.standalone_code_editor
 
@@ -149,11 +143,11 @@ _Note that only adding new content into the editor will trigger this event. For
 ### Change language and value
 
 ```heex
-<button phx-click="change-file">my_file.html</button>
+<button phx-click="create-file">my_file.html</button>
 ```
 
 ```elixir
-def handle_event("change-file", _params, socket) do
+def handle_event("create-file", _params, socket) do
   {:noreply,
    socket
    |> LiveMonacoEditor.change_language("html")
@@ -176,7 +170,18 @@ The component does not depend on any CSS framework but its parent container has
 
 ## Status
 
-Experimental. You can expect incomplete features and breaking changes before a stable v0.1.0 is released.
+Early-stage, you can expect incomplete features and breaking changes.
+
+## Contributing
+
+You can use the file `dev.exs` which is a self-contained Phoenix application running LiveMonacoEditor. Execute:
+
+```sh
+mix setup
+iex -S mix dev
+```
+
+Visit http://localhost:4002
 
 ## Acknowledgements
 

diff --git a/lib/live_monaco_editor.ex b/lib/live_monaco_editor.ex
@@ -1,6 +1,14 @@
 defmodule LiveMonacoEditor do
+  @external_resource "README.md"
+
+  @moduledoc "README.md"
+             |> File.read!()
+             |> String.split("<!-- MDOC -->")
+             |> Enum.fetch!(1)
+
   use Phoenix.Component
   import Phoenix.LiveView, only: [push_event: 3]
+  alias Phoenix.LiveView.Socket
 
   @default_path "file"
 
@@ -21,16 +29,38 @@ defmodule LiveMonacoEditor do
     "suggestSelection" => "first"
   }
 
+  @doc """
+  Renders a monaco editor [model](https://microsoft.github.io/monaco-editor/docs.html#functions/editor.createModel.html).
+
+
+  ## Examples
+
+  Render a simple editor using default options:
+
+      <LiveMonacoEditor.code_editor value="# My Code Editor" />
+
+  Or merge with custom options:
+
+      <LiveMonacoEditor.code_editor
+        opts={
+          Map.merge(
+            LiveMonacoEditor.default_opts(),
+            %{"wordWrap" => "on"}
+          )
+        }
+      />
+
+  """
   attr :path, :string,
     default: @default_path,
-    doc: "file identifier, define unique names to create multiple editors"
+    doc: "file identifier, pass unique names to render multiple editors"
 
   attr :value, :string, default: "", doc: "initial content"
 
   attr :opts, :map,
     default: @default_opts,
     doc: """
-    options for the monaco editor instance. Defaults to LiveMonacoEditor.default_opts()
+    options for the monaco editor instance
 
     ## Example
 
@@ -71,10 +101,7 @@ defmodule LiveMonacoEditor do
   end
 
   @doc """
-  Default Monacto Editor options:
-
-    #{inspect(@default_opts)}
-
+  The default Monaco Editor opts passed to `<.code_editor>`
   """
   def default_opts, do: @default_opts
 
@@ -94,8 +121,19 @@ defmodule LiveMonacoEditor do
   end
 
   @doc """
-  https://microsoft.github.io/monaco-editor/docs.html#functions/editor.setModelLanguage.html
+  Change the editor's language.
+
+  ## Examples
+
+      LiveMonacoEditor.change_language(socket, "markdown", to: "my_file.md")
+
+  ## Options
+
+    * `:to` - the editor's `path` name that will get the language changed. Defaults to "#{@default_path}".
+
+  See https://microsoft.github.io/monaco-editor/docs.html#functions/editor.setModelLanguage.html for more info.
   """
+  @spec change_language(Socket.t(), String.t(), keyword()) :: Socket.t()
   def change_language(socket, mime_type_or_language_id, opts \\ [])
       when is_binary(mime_type_or_language_id) do
     to = Keyword.get(opts, :to, @default_path)
@@ -106,8 +144,19 @@ defmodule LiveMonacoEditor do
   end
 
   @doc """
-  https://microsoft.github.io/monaco-editor/docs.html#interfaces/editor.IStandaloneCodeEditor.html#setValue
+  Change the editor's `value` (content).
+
+  ## Examples
+
+      LiveMonacoEditor.set_value(socket, "Enum.all?([1, 2, 3])", to: "my_script.exs")
+
+  ## Options
+
+    * `:to` - the editor's `path` name that will get the value updated. Defaults to "#{@default_path}".
+
+  See https://microsoft.github.io/monaco-editor/docs.html#interfaces/editor.IStandaloneCodeEditor.html#setValue for more info.
   """
+  @spec set_value(Socket.t(), String.t(), keyword()) :: Socket.t()
   def set_value(socket, value, opts \\ []) when is_binary(value) do
     to = Keyword.get(opts, :to, @default_path)
     push_event(socket, "lme:set_value:#{to}", %{"value" => value})

diff --git a/mix.exs b/mix.exs
@@ -1,14 +1,22 @@
 defmodule LiveMonacoEditor.MixProject do
   use Mix.Project
 
+  @source_url "https://github.com/BeaconCMS/live_monaco_editor"
+  @version "0.1.0"
+
   def project do
     [
       app: :live_monaco_editor,
       version: "0.1.0",
-      elixir: "~> 1.14",
+      elixir: "~> 1.12",
       start_permanent: Mix.env() == :prod,
+      package: package(),
+      docs: docs(),
+      deps: deps(),
       aliases: aliases(),
-      deps: deps()
+      name: "LiveMonacoEditor",
+      homepage_url: "https://github.com/BeaconCMS/live_monaco_editor",
+      description: "Monaco Editor component for Phoenix LiveView"
     ]
   end
 
@@ -18,22 +26,53 @@ defmodule LiveMonacoEditor.MixProject do
     ]
   end
 
+  defp package do
+    [
+      maintainers: ["Leandro Pereira"],
+      licenses: ["MIT"],
+      links: %{
+        Changelog: "https://hexdocs.pm/live_monaco_editor/changelog.html",
+        GitHub: @source_url
+      },
+      files: [
+        "mix.exs",
+        "lib",
+        "assets/package.json",
+        "assets/js",
+        "priv",
+        "README.md",
+        "LICENSE.md",
+        "CHANGELOG.md"
+      ]
+    ]
+  end
+
+  defp docs do
+    [
+      main: "LiveMonacoEditor",
+      source_ref: "v#{@version}",
+      source_url: @source_url,
+      extras: ["CHANGELOG.md"]
+    ]
+  end
+
   defp deps do
     [
       {:esbuild, "~> 0.6", runtime: Mix.env() == :dev},
+      {:ex_doc, "~> 0.29", only: :dev},
+      {:jason, "~> 1.4"},
       {:phoenix, "~> 1.7"},
       {:phoenix_live_view, "~> 0.18"},
       {:phoenix_live_reload, "~> 1.4", only: :dev},
-      {:plug_cowboy, "~> 2.6", only: :dev},
-      {:jason, "~> 1.4"}
+      {:plug_cowboy, "~> 2.6", only: :dev}
     ]
   end
 
   defp aliases do
     [
       dev: "run --no-halt dev.exs",
       setup: ["deps.get", "assets.setup"],
-      format: ["format", "cmd npm run format --prefix ./assets"],
+      "format.all": ["format", "cmd npm run format --prefix ./assets"],
       "assets.setup": ["cmd --cd assets npm install"],
       "assets.build": ["esbuild module", "esbuild main", "esbuild cdn", "esbuild cdn_min"],
       "assets.watch": ["esbuild module --watch"]

diff --git a/mix.lock b/mix.lock
@@ -3,10 +3,16 @@
   "cowboy": {:hex, :cowboy, "2.10.0", "ff9ffeff91dae4ae270dd975642997afe2a1179d94b1887863e43f681a203e26", [:make, :rebar3], [{:cowlib, "2.12.1", [hex: :cowlib, repo: "hexpm", optional: false]}, {:ranch, "1.8.0", [hex: :ranch, repo: "hexpm", optional: false]}], "hexpm", "3afdccb7183cc6f143cb14d3cf51fa00e53db9ec80cdcd525482f5e99bc41d6b"},
   "cowboy_telemetry": {:hex, :cowboy_telemetry, "0.4.0", "f239f68b588efa7707abce16a84d0d2acf3a0f50571f8bb7f56a15865aae820c", [:rebar3], [{:cowboy, "~> 2.7", [hex: :cowboy, repo: "hexpm", optional: false]}, {:telemetry, "~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}], "hexpm", "7d98bac1ee4565d31b62d59f8823dfd8356a169e7fcbb83831b8a5397404c9de"},
   "cowlib": {:hex, :cowlib, "2.12.1", "a9fa9a625f1d2025fe6b462cb865881329b5caff8f1854d1cbc9f9533f00e1e1", [:make, :rebar3], [], "hexpm", "163b73f6367a7341b33c794c4e88e7dbfe6498ac42dcd69ef44c5bc5507c8db0"},
+  "earmark_parser": {:hex, :earmark_parser, "1.4.32", "fa739a0ecfa34493de19426681b23f6814573faee95dfd4b4aafe15a7b5b32c6", [:mix], [], "hexpm", "b8b0dd77d60373e77a3d7e8afa598f325e49e8663a51bcc2b88ef41838cca755"},
   "esbuild": {:hex, :esbuild, "0.7.0", "ce3afb13cd2c5fd63e13c0e2d0e0831487a97a7696cfa563707342bb825d122a", [:mix], [{:castore, ">= 0.0.0", [hex: :castore, repo: "hexpm", optional: false]}], "hexpm", "4ae9f4f237c5ebcb001390b8ada65a12fb2bb04f3fe3d1f1692b7a06fbfe8752"},
+  "ex_doc": {:hex, :ex_doc, "0.29.4", "6257ecbb20c7396b1fe5accd55b7b0d23f44b6aa18017b415cb4c2b91d997729", [:mix], [{:earmark_parser, "~> 1.4.31", [hex: :earmark_parser, repo: "hexpm", optional: false]}, {:makeup_elixir, "~> 0.14", [hex: :makeup_elixir, repo: "hexpm", optional: false]}, {:makeup_erlang, "~> 0.1", [hex: :makeup_erlang, repo: "hexpm", optional: false]}], "hexpm", "2c6699a737ae46cb61e4ed012af931b57b699643b24dabe2400a8168414bc4f5"},
   "file_system": {:hex, :file_system, "0.2.10", "fb082005a9cd1711c05b5248710f8826b02d7d1784e7c3451f9c1231d4fc162d", [:mix], [], "hexpm", "41195edbfb562a593726eda3b3e8b103a309b733ad25f3d642ba49696bf715dc"},
   "jason": {:hex, :jason, "1.4.0", "e855647bc964a44e2f67df589ccf49105ae039d4179db7f6271dfd3843dc27e6", [:mix], [{:decimal, "~> 1.0 or ~> 2.0", [hex: :decimal, repo: "hexpm", optional: true]}], "hexpm", "79a3791085b2a0f743ca04cec0f7be26443738779d09302e01318f97bdb82121"},
+  "makeup": {:hex, :makeup, "1.1.0", "6b67c8bc2882a6b6a445859952a602afc1a41c2e08379ca057c0f525366fc3ca", [:mix], [{:nimble_parsec, "~> 1.2.2 or ~> 1.3", [hex: :nimble_parsec, repo: "hexpm", optional: false]}], "hexpm", "0a45ed501f4a8897f580eabf99a2e5234ea3e75a4373c8a52824f6e873be57a6"},
+  "makeup_elixir": {:hex, :makeup_elixir, "0.16.1", "cc9e3ca312f1cfeccc572b37a09980287e243648108384b97ff2b76e505c3555", [:mix], [{:makeup, "~> 1.0", [hex: :makeup, repo: "hexpm", optional: false]}, {:nimble_parsec, "~> 1.2.3 or ~> 1.3", [hex: :nimble_parsec, repo: "hexpm", optional: false]}], "hexpm", "e127a341ad1b209bd80f7bd1620a15693a9908ed780c3b763bccf7d200c767c6"},
+  "makeup_erlang": {:hex, :makeup_erlang, "0.1.1", "3fcb7f09eb9d98dc4d208f49cc955a34218fc41ff6b84df7c75b3e6e533cc65f", [:mix], [{:makeup, "~> 1.0", [hex: :makeup, repo: "hexpm", optional: false]}], "hexpm", "174d0809e98a4ef0b3309256cbf97101c6ec01c4ab0b23e926a9e17df2077cbb"},
   "mime": {:hex, :mime, "2.0.3", "3676436d3d1f7b81b5a2d2bd8405f412c677558c81b1c92be58c00562bb59095", [:mix], [], "hexpm", "27a30bf0db44d25eecba73755acf4068cbfe26a4372f9eb3e4ea3a45956bff6b"},
+  "nimble_parsec": {:hex, :nimble_parsec, "1.3.1", "2c54013ecf170e249e9291ed0a62e5832f70a476c61da16f6aac6dca0189f2af", [:mix], [], "hexpm", "2682e3c0b2eb58d90c6375fc0cc30bc7be06f365bf72608804fb9cffa5e1b167"},
   "phoenix": {:hex, :phoenix, "1.7.2", "c375ffb482beb4e3d20894f84dd7920442884f5f5b70b9f4528cbe0cedefec63", [:mix], [{:castore, ">= 0.0.0", [hex: :castore, repo: "hexpm", optional: false]}, {:jason, "~> 1.0", [hex: :jason, repo: "hexpm", optional: true]}, {:phoenix_pubsub, "~> 2.1", [hex: :phoenix_pubsub, repo: "hexpm", optional: false]}, {:phoenix_template, "~> 1.0", [hex: :phoenix_template, repo: "hexpm", optional: false]}, {:phoenix_view, "~> 2.0", [hex: :phoenix_view, repo: "hexpm", optional: true]}, {:plug, "~> 1.14", [hex: :plug, repo: "hexpm", optional: false]}, {:plug_cowboy, "~> 2.6", [hex: :plug_cowboy, repo: "hexpm", optional: true]}, {:plug_crypto, "~> 1.2", [hex: :plug_crypto, repo: "hexpm", optional: false]}, {:telemetry, "~> 0.4 or ~> 1.0", [hex: :telemetry, repo: "hexpm", optional: false]}, {:websock_adapter, "~> 0.4", [hex: :websock_adapter, repo: "hexpm", optional: false]}], "hexpm", "1ebca94b32b4d0e097ab2444a9742ed8ff3361acad17365e4e6b2e79b4792159"},
   "phoenix_html": {:hex, :phoenix_html, "3.3.1", "4788757e804a30baac6b3fc9695bf5562465dd3f1da8eb8460ad5b404d9a2178", [:mix], [{:plug, "~> 1.5", [hex: :plug, repo: "hexpm", optional: true]}], "hexpm", "bed1906edd4906a15fd7b412b85b05e521e1f67c9a85418c55999277e553d0d3"},
   "phoenix_live_reload": {:hex, :phoenix_live_reload, "1.4.1", "2aff698f5e47369decde4357ba91fc9c37c6487a512b41732818f2204a8ef1d3", [:mix], [{:file_system, "~> 0.2.1 or ~> 0.3", [hex: :file_system, repo: "hexpm", optional: false]}, {:phoenix, "~> 1.4", [hex: :phoenix, repo: "hexpm", optional: false]}], "hexpm", "9bffb834e7ddf08467fe54ae58b5785507aaba6255568ae22b4d46e2bb3615ab"},