action_markdown 0.1.3 → 0.1.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 819dfe2572347f57003b682837bf117fcb0548e1a3794fdf4a30d5575d8c0a09
|
|
4
|
+
data.tar.gz: 56c826b841e25557d305651d848ec0707f63a50cfb5b41ecf00f86e966841a5d
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 271f2cd02c1b66af671b0e940bdb4b1efdefbc38587e86ba97a576ed2d8e907c0243c69a44c461ee3aec75a3aa70aafef93ce85f76da14d686c3c54cf5d0ed09
|
|
7
|
+
data.tar.gz: a5a108c1a0b0fd10182e6f07bebe04518922f2270d829652b50910aa85a521607bfb4919ac6619fc6ffbd0308cdd3f3e702d9b1973bbc13232e060be21e7e78f
|
|
@@ -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
|
+
}
|
|
@@ -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
|
|
@@ -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.
|
|
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:
|
|
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
|