action_markdown 0.1.3 → 0.1.4

Sign up to get free protection for your applications and to get access to all the features.
Files changed (6) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/stylesheets/action_markdown/action_markdown_toolbar.css +42 -0
  3. data/app/helpers/action_markdown/tag_helper.rb +62 -1
  4. data/lib/action_markdown/version.rb +1 -1
  5. data/lib/generators/action_markdown/install/install_generator.rb +29 -0
  6. metadata +3 -2
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 8a8a81aff87626aae72f69e3be289da05a2b876e9245e31431715152690d48b0
4
- data.tar.gz: db012c37bdca4c232184ecd68b727e1eb7294c4cfaa387450990e2bb62e958ff
3
+ metadata.gz: 819dfe2572347f57003b682837bf117fcb0548e1a3794fdf4a30d5575d8c0a09
4
+ data.tar.gz: 56c826b841e25557d305651d848ec0707f63a50cfb5b41ecf00f86e966841a5d
5
5
  SHA512:
6
- metadata.gz: 696d0b60182b7baa446ecfed938304de4673fdb406db11e21248b2cdc118951a46dcbc6f516f9d7637d59f93ceb2d97f2b0e7e165ad07374ab45b59873d69937
7
- data.tar.gz: 9953248c9fcd4f28047b06404a619925ac752828b00981d01cded14b75ac09b4840c314035704f0d31e60bc3006729d809676354a812347410cb6af0eed94368
6
+ metadata.gz: 271f2cd02c1b66af671b0e940bdb4b1efdefbc38587e86ba97a576ed2d8e907c0243c69a44c461ee3aec75a3aa70aafef93ce85f76da14d686c3c54cf5d0ed09
7
+ data.tar.gz: a5a108c1a0b0fd10182e6f07bebe04518922f2270d829652b50910aa85a521607bfb4919ac6619fc6ffbd0308cdd3f3e702d9b1973bbc13232e060be21e7e78f
data/app/assets/stylesheets/action_markdown/action_markdown_toolbar.css ADDED
@@ -0,0 +1,42 @@
1
+ .action-markdown-toolbar {
2
+ /* Colors */
3
+ --am-toolbar-background: hsl(0, 0%, 95%);
4
+ --am-toolbar-item-hover: hsl(0, 0%, 85%);
5
+ --am-toolbar-item-color: hsl(0, 0%, 15%);
6
+
7
+ /* Spaces */
8
+ --am-toolbar-gap: 0.5rem;
9
+ --am-toolbar-padding: 0.25rem;
10
+ --am-toolbar-border-radius: 0.25rem;
11
+ --am-toolbar-item-border-radius: 0.125rem;
12
+
13
+ /* Actual styles */
14
+ display: flex;
15
+ gap: var(--am-toolbar-gap);
16
+
17
+ background-color: var(--am-toolbar-background);
18
+ border-radius: var(--am-toolbar-border-radius);
19
+ padding: var(--am-toolbar-padding);
20
+ overflow: auto;
21
+ }
22
+
23
+ .action-markdown-toolbar > * {
24
+ display: flex;
25
+ align-items: center;
26
+ cursor: pointer;
27
+ border-radius: var(--am-toolbar-item-border-radius);
28
+ padding: var(--am-toolbar-padding);
29
+ }
30
+
31
+ .action-markdown-toolbar > *:hover {
32
+ background-color: var(--am-toolbar-item-hover);
33
+ }
34
+
35
+ .action-markdown-toolbar svg {
36
+ fill: var(--am-toolbar-item-color);
37
+ }
38
+
39
+ .action-markdown-input {
40
+ max-width: 100%;
41
+ min-width: 100%;
42
+ }
data/app/helpers/action_markdown/tag_helper.rb CHANGED
@@ -2,10 +2,14 @@ require "action_view/helpers/tags/placeholderable"
2
2
 
3
3
  module ActionMarkdown
4
4
  module TagHelper
5
+ cattr_accessor(:id, instance_accessor: false) { 0 }
6
+
5
7
  def markdown_field_tag(name, value = nil, options = {})
6
8
  options = options.symbolize_keys
9
+ options[:id] ||= "action_markdown_input_#{ActionMarkdown::TagHelper.id += 1}"
10
+ options[:class] ||= "action-markdown-input"
7
11
 
8
- content_tag("textarea", value, options)
12
+ markdown_toolbar(id: options[:id]) + content_tag("textarea", value, options)
9
13
  end
10
14
  end
11
15
  end
@@ -35,3 +39,60 @@ module ActionView::Helpers
35
39
  end
36
40
  end
37
41
  end
42
+
43
+ module ActionMarkdown
44
+ module TagHelper
45
+ def markdown_toolbar(id:)
46
+ <<~HTML.squish.html_safe
47
+ <markdown-toolbar class="action-markdown-toolbar" for="#{id}">
48
+ <md-header aria-label="Header" role="button">
49
+ <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
50
+ <path d="M6 4V20ZM18 4V20Z"/>
51
+ <path d="M6 4V20H8V13H16V20H18V4H16V11H8V4H6Z"/>
52
+ </svg>
53
+ </md-header>
54
+ <md-bold aria-label="Bold" role="button">
55
+ <svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
56
+ <path d="M8 11h4.5a2.5 2.5 0 0 0 0-5H8v5Zm10 4.5a4.501 4.501 0 0 1-4.5 4.5H6V4h6.5a4.5 4.5 0 0 1 3.256 7.606A4.5 4.5 0 0 1 18 15.5ZM8 13v5h5.5a2.5 2.5 0 0 0 0-5H8Z"></path>
57
+ </svg>
58
+ </md-bold>
59
+ <md-italic aria-label="Italic" role="button">
60
+ <svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
61
+ <path d="M15 20H7v-2h2.927l2.116-12H9V4h8v2h-2.927l-2.116 12H15v2Z"></path>
62
+ </svg>
63
+ </md-italic>
64
+ <md-quote aria-label="Quote" role="button">
65
+ <svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
66
+ <path d="M4.583 17.321C3.553 16.227 3 15 3 13.011c0-3.5 2.457-6.637 6.03-8.188l.893 1.378c-3.335 1.804-3.987 4.145-4.247 5.621.537-.278 1.24-.375 1.929-.311 1.804.167 3.226 1.648 3.226 3.489a3.5 3.5 0 0 1-3.5 3.5 3.871 3.871 0 0 1-2.748-1.179zm10 0C13.553 16.227 13 15 13 13.011c0-3.5 2.457-6.637 6.03-8.188l.893 1.378c-3.335 1.804-3.987 4.145-4.247 5.621.537-.278 1.24-.375 1.929-.311 1.804.167 3.226 1.648 3.226 3.489a3.5 3.5 0 0 1-3.5 3.5 3.871 3.871 0 0 1-2.748-1.179z"></path>
67
+ </svg>
68
+ </md-quote>
69
+ <md-code aria-label="Code" role="button">
70
+ <svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
71
+ <path d="m23 12-7.071 7.071-1.414-1.414L20.172 12l-5.657-5.657 1.414-1.414zM3.828 12l5.657 5.657-1.414 1.414L1 12l7.071-7.071 1.414 1.414z"></path>
72
+ </svg>
73
+ </md-code>
74
+ <md-link aria-label="Link" role="button">
75
+ <svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
76
+ <path d="M18.364 15.536 16.95 14.12l1.414-1.414a5.001 5.001 0 0 0-3.531-8.551 5 5 0 0 0-3.54 1.48L9.879 7.05 8.464 5.636 9.88 4.222a7 7 0 1 1 9.9 9.9l-1.415 1.414zm-2.828 2.828-1.415 1.414a7 7 0 0 1-9.9-9.9l1.415-1.414L7.05 9.88l-1.414 1.414a5 5 0 1 0 7.071 7.071l1.414-1.414 1.415 1.414zm-.708-10.607 1.415 1.415-7.071 7.07-1.415-1.414 7.071-7.07z"></path>
77
+ </svg>
78
+ </md-link>
79
+ <md-image aria-label="Image" role="button">
80
+ <svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
81
+ <path d="M20 5H4v14l9.292-9.294a1 1 0 0 1 1.414 0L20 15.01V5zM2 3.993A1 1 0 0 1 2.992 3h18.016c.548 0 .992.445.992.993v16.014a1 1 0 0 1-.992.993H2.992A.993.993 0 0 1 2 20.007V3.993zM8 11a2 2 0 1 1 0-4 2 2 0 0 1 0 4z"></path>
82
+ </svg>
83
+ </md-image>
84
+ <md-unordered-list aria-label="Unordered list" role="button">
85
+ <svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
86
+ <path d="M8 4h13v2H8zM4.5 6.5a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm0 7a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zm0 6.9a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3zM8 11h13v2H8zm0 7h13v2H8z"></path>
87
+ </svg>
88
+ </md-unordered-list>
89
+ <md-ordered-list aria-label="Ordered list" role="button">
90
+ <svg height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
91
+ <path d="M8 4h13v2H8zM5 3v3h1v1H3V6h1V4H3V3zM3 14v-2.5h2V11H3v-1h3v2.5H4v.5h2v1zm2 5.5H3v-1h2V18H3v-1h3v4H3v-1h2zM8 11h13v2H8zm0 7h13v2H8z"></path>
92
+ </svg>
93
+ </md-ordered-list>
94
+ </markdown-toolbar>
95
+ HTML
96
+ end
97
+ end
98
+ end
data/lib/action_markdown/version.rb CHANGED
@@ -1,3 +1,3 @@
1
1
  module ActionMarkdown
2
- VERSION = "0.1.3"
2
+ VERSION = "0.1.4"
3
3
  end
data/lib/generators/action_markdown/install/install_generator.rb CHANGED
@@ -13,11 +13,40 @@ module ActionMarkdown
13
13
  "app/assets/stylesheets/action_markdown.css"
14
14
  )
15
15
 
16
+ copy_file(
17
+ "app/assets/stylesheets/action_markdown/action_markdown_toolbar.css",
18
+ "app/assets/stylesheets/action_markdown_toolbar.css"
19
+ )
20
+
16
21
  copy_file(
17
22
  "app/views/action_markdown/contents/_content.html.erb",
18
23
  "app/views/action_markdown/contents/_content.html.erb"
19
24
  )
20
25
  end
26
+
27
+ def install_javascript_dependencies
28
+ if Rails.root.join("config/importmap.rb").exist?
29
+ say "Import @github/markdown-toolbar-element", :green
30
+ append_to_file "app/javascript/application.js", %(import "@github/markdown-toolbar-element"\n)
31
+
32
+ github_lib = "@github/markdown-toolbar-element"
33
+ github_link = "https://ga.jspm.io/npm:@github/markdown-toolbar-element@2.1.1/dist/index.js"
34
+
35
+ say "Pin #{github_lib}", :green
36
+ append_to_file "config/importmap.rb", %(pin "#{github_lib}", to: "#{github_link}"\n)
37
+ elsif Rails.root.join("package.json").exist?
38
+ say "Import @github/markdown-toolbar-element", :green
39
+ append_to_file "app/javascript/application.js", %(import "@github/markdown-toolbar-element"\n)
40
+
41
+ say "Install @github/markdown-toolbar-element", :green
42
+ run "yarn add @github/markdown-toolbar-element@2.1.1"
43
+ else
44
+ say <<~TEXT.squish, :red
45
+ You must either be running with node (package.json) or
46
+ importmap-rails (config/importmap.rb) to use action_markdown.
47
+ TEXT
48
+ end
49
+ end
21
50
  end
22
51
  end
23
52
  end
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: action_markdown
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.1.3
4
+ version: 0.1.4
5
5
  platform: ruby
6
6
  authors:
7
7
  - Alexandre Ruban
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2022-12-03 00:00:00.000000000 Z
11
+ date: 2023-01-09 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: rails
@@ -62,6 +62,7 @@ files:
62
62
  - MIT-LICENSE
63
63
  - README.md
64
64
  - app/assets/stylesheets/action_markdown/action_markdown.css
65
+ - app/assets/stylesheets/action_markdown/action_markdown_toolbar.css
65
66
  - app/helpers/action_markdown/tag_helper.rb
66
67
  - app/models/action_markdown/application_record.rb
67
68
  - app/models/action_markdown/markdown_text.rb