playbook_ui 8.0.0.pre.alpha1 → 8.0.2

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: c921685c5d3955c36d8ae3c9e44ca3da8a85566f09b1586435c2e0eaadef53bc
4
- data.tar.gz: 84fe2792d4bd4dbc7bb57bc150d5af4bec0cf93b7bbf7ed7e64a7b5c85e6b63d
3
+ metadata.gz: 20781dc839fddc7c39f5bd78cdb4b89668a7ac1a133da354da3e042f2aa3cd69
4
+ data.tar.gz: b0a400b955e43528d6560014ff5fe75891147385a23b1b336c6d2aced8457feb
5
5
  SHA512:
6
- metadata.gz: 68eb2a35ffe4c1b6ecf9fe60853562f7d2cd28ab16c17a8f4cc5904f9b05e56128fa66699fd82527346bdff505f8d797d5eb7251ac78d7095088c8dacabdc721
7
- data.tar.gz: de3dfb369f495b031ac6744170d62c5dfe0ef1ff84cbbb470a03b35675fc8460abb63b44940764b7c6239e351a888d4a23a9c5733958d0595bd5dc97d2c62be9
6
+ metadata.gz: 2cd5d0b4c0c3db6034c22848c911937498240da8ad120ae91d93bca36f3cad962c8c3cc9e5dec398669934d47f0e3f387198490545dcff3ec2f2fbffc5072585
7
+ data.tar.gz: 8d709a7ebc19dc0bc051fd0369fb138c9acaa7c2366e8dede34ea08d374a469e837a7febff561eb5067df51dc13ec28a3c8686aa8e9fe2f06938ffe2c8b284a7
@@ -0,0 +1,12 @@
1
+ <div data-action="toggle" data-togglable="prop_example" class="pb--propsTable">
2
+ <%= pb_rails("title", props: { text: "Available Props", size: 3, margin_bottom: "sm" }) %>
3
+ <%= pb_rails("card", props: { padding: "none" }) do %>
4
+ <%= pb_rails("list", props: { xpadding: true }) do %>
5
+ <% kit_props.each do |key, _def| %>
6
+ <%= pb_rails("list/item") do %>
7
+ <%= key %>
8
+ <% end %>
9
+ <% end %>
10
+ <% end %>
11
+ <% end %>
12
+ </div>
@@ -0,0 +1,19 @@
1
+ # frozen_string_literal: true
2
+
3
+ module Playbook
4
+ module PbDocs
5
+ class KitApi < Playbook::KitBase
6
+ prop :kit, type: Playbook::Props::String, required: true
7
+
8
+ def kit_props
9
+ kit_class.props
10
+ end
11
+
12
+ private
13
+
14
+ def kit_class
15
+ @kit_class ||= Playbook::KitResolver.resolve(kit.to_s)
16
+ end
17
+ end
18
+ end
19
+ end
@@ -0,0 +1,28 @@
1
+ <%= pb_rails("card", props: { classname: "pb--doc", padding: "none", dark: dark }) do %>
2
+ <div class="pb--kit-example">
3
+ <%= pb_rails("caption", props: { text: example_title }) %>
4
+ <br />
5
+ <%= example %>
6
+ <br>
7
+ </div>
8
+
9
+ <% if show_code %>
10
+ <div class="markdown pb--kit-example-markdown <%= dark ? "dark" : "" %>">
11
+ <%= markdown(description) %>
12
+ </div>
13
+ <div id="code-wrapper">
14
+ <div class="pb--codeControls">
15
+ <ul>
16
+ <li>
17
+ <a href="#" id="toggle-open" data-toggle="code_example">Code Example</a>
18
+ </li>
19
+ </ul>
20
+ </div>
21
+ <div class="pb--codeCopy" data-action="toggle" data-togglable="code_example" style="display: none" >
22
+ <%= pb_rails("section_separator", props: { dark: dark })%>
23
+ <a href="#" id="toggle-close" data-toggle="false" class="pb--close-toggle">Close</a>
24
+ <pre class="highlight"><%= raw rouge(source, highlighter) %></pre>
25
+ </div>
26
+ </div>
27
+ <% end %>
28
+ <% end %>
@@ -0,0 +1,46 @@
1
+ # frozen_string_literal: true
2
+
3
+ module Playbook
4
+ module PbDocs
5
+ class KitExample < Playbook::KitBase
6
+ include Playbook::Markdown::Helper
7
+
8
+ prop :kit, type: Playbook::Props::String, required: true
9
+ prop :example_title, type: Playbook::Props::String, required: true
10
+ prop :example_key, type: Playbook::Props::String, required: true
11
+ prop :show_code, type: Playbook::Props::Boolean, default: true
12
+ prop :type, type: Playbook::Props::Enum, values: %w[rails react], default: "rails"
13
+ prop :dark, type: Playbook::Props::Boolean, default: false
14
+
15
+ def example
16
+ if type == "rails"
17
+ render inline: source
18
+ elsif type == "react"
19
+ react_component example_key.camelize, { dark: dark }
20
+ end
21
+ end
22
+
23
+ def description
24
+ @description ||= read_kit_file(kit, "_#{example_key}.md")
25
+ end
26
+
27
+ def highlighter
28
+ type.eql?("rails") ? "erb" : "react"
29
+ end
30
+
31
+ def source
32
+ @source ||= begin
33
+ extension = type == "react" ? "jsx" : "html.erb"
34
+ read_kit_file("_#{example_key}.#{extension}")
35
+ end
36
+ end
37
+
38
+ private
39
+
40
+ def read_kit_file(*args)
41
+ path = ::Playbook.kit_path(kit, "docs", *args)
42
+ path.exist? ? path.read : ""
43
+ end
44
+ end
45
+ end
46
+ end
@@ -1,8 +1,12 @@
1
1
  .pb-form {
2
2
  .pb-form-actions {
3
3
  list-style: none;
4
- margin: 8px;
4
+ margin: 0;
5
5
  padding: 0;
6
+ display: flex;
7
+ justify-content: space-between;
8
+ align-items: flex-start;
9
+ flex-direction: row;
6
10
 
7
11
  > li {
8
12
  display: inline-flex;
@@ -13,8 +13,8 @@
13
13
  ]
14
14
  %>
15
15
 
16
- <%= pb_rails("form", props: {
17
- form_system_options: { scope: :example, method: :get, url: "" },
16
+ <%= pb_rails("form/form_with", props: {
17
+ scope: :example, method: :get, url: "",
18
18
  validate: true
19
19
  }) do |form| %>
20
20
  <%= form.text_field :example_text_field, props: { label: true, required: true } %>
@@ -19,8 +19,17 @@ module Playbook
19
19
  end
20
20
  end
21
21
 
22
- def render_in(view_context, &_block)
23
- super(view_context, &nil)
22
+ def render_in(view_context, &block)
23
+ form_kit.render_in(view_context, &block)
24
+ end
25
+
26
+ private
27
+
28
+ def form_kit
29
+ @form_system ||= begin
30
+ ::Playbook::KitResolver.resolve("form/#{form_system}")
31
+ .new(options: form_system_options, validate: validate, children: children)
32
+ end
24
33
  end
25
34
  end
26
35
  end
@@ -19,9 +19,11 @@ module Playbook
19
19
  prepend(CollectionSelectField)
20
20
  prepend(CheckboxField)
21
21
  prepend(DatePickerField)
22
+ end
22
23
 
23
- def actions(&block)
24
- @template.render_component ActionArea.new(submit_default_value: submit_default_value), &block
24
+ def actions
25
+ @template.send(:view_context).content_tag :ol, class: "pb-form-actions" do
26
+ yield ActionArea.new(@template, submit_default_value)
25
27
  end
26
28
  end
27
29
  end
@@ -3,22 +3,29 @@
3
3
  module Playbook
4
4
  module PbForm
5
5
  module FormBuilder
6
- class ActionArea < Playbook::KitBase
7
- prop :submit_default_value, type: Playbook::Props::String
6
+ class ActionArea
7
+ def initialize(view_context, submit_default_value)
8
+ self.view_context = view_context
9
+ self.submit_default_value = submit_default_value
10
+ end
8
11
 
9
12
  def submit(value = nil, props: {})
10
13
  props[:type] ||= "submit"
14
+ props[:text] ||= value || submit_default_value
15
+
11
16
  button(value, props: props)
12
17
  end
13
18
 
14
19
  def button(value = nil, props:)
15
- props[:text] ||= value || submit_default_value
16
-
17
- content_tag(:li) do
18
- pb_rails("button", props: props)
20
+ view_context.content_tag(:li) do
21
+ view_context.pb_rails("button", props: props)
19
22
  end
20
23
  end
24
+
25
+ private
26
+
27
+ attr_accessor :view_context, :submit_default_value
21
28
  end
22
29
  end
23
30
  end
24
- end
31
+ end
@@ -1,18 +1,11 @@
1
- <%= form_with(id: id,
2
- aria: aria,
3
- class: classname,
4
- data: data,
5
- builder: form_builder,
6
- **options) do |form| %>
7
- <% instance_exec form, &children %>
1
+ <%= form_with(form_options, &method(:render_form)) %>
8
2
 
9
- <% if validate %>
10
- <% content_for :pb_js do %>
11
- <%= javascript_tag do %>
12
- window.addEventListener('DOMContentLoaded', function() {
13
- PbFormValidation.start()
14
- })
15
- <% end %>
3
+ <% if validate %>
4
+ <% content_for :pb_js do %>
5
+ <%= javascript_tag do %>
6
+ window.addEventListener('DOMContentLoaded', function() {
7
+ PbFormValidation.start()
8
+ })
16
9
  <% end %>
17
10
  <% end %>
18
11
  <% end %>
@@ -14,16 +14,23 @@ module Playbook
14
14
  prop(:data).merge("pb-form-validation" => validate)
15
15
  end
16
16
 
17
- def options
18
- { url: "" }.merge(Hash(prop(:options)))
17
+ def form_options
18
+ {
19
+ url: "",
20
+ id: id,
21
+ aria: aria,
22
+ class: classname,
23
+ data: data,
24
+ builder: ::Playbook::PbForm::FormWith::FormBuilder,
25
+ }.merge(options)
19
26
  end
20
27
 
21
- def classname
22
- [generate_classname("pb-form"), options[:class]].join(" ")
28
+ def render_form(builder)
29
+ view_context.capture(builder, &children)
23
30
  end
24
31
 
25
- def form_builder
26
- ::Playbook::PbForm::FormWith::FormBuilder
32
+ def classname
33
+ [generate_classname("pb-form"), options[:class]].join(" ")
27
34
  end
28
35
 
29
36
  def render_in(view_context, &_block)
@@ -1,6 +1,4 @@
1
- <%= simple_form_for model, options do |form| %>
2
- <% instance_exec form, &children %>
3
- <% end %>
1
+ <%= simple_form_for model, options, &method(:render_form) %>
4
2
 
5
3
  <% if validate %>
6
4
  <% content_for :pb_js do %>
@@ -10,4 +8,4 @@
10
8
  })
11
9
  <% end %>
12
10
  <% end %>
13
- <% end %>
11
+ <% end %>
@@ -48,6 +48,10 @@ module Playbook
48
48
  prop(:options).fetch(:html, {})
49
49
  end
50
50
 
51
+ def render_form(builder)
52
+ view_context.capture(builder, &children)
53
+ end
54
+
51
55
  def render_in(view_context, &_block)
52
56
  super(view_context, &nil)
53
57
  end
data/lib/playbook.rb CHANGED
@@ -9,9 +9,10 @@ require "view_component/engine"
9
9
  require "playbook/props"
10
10
  require "playbook/version"
11
11
  require "playbook/pb_kit_helper"
12
+ require "playbook/pb_doc_helper"
12
13
  require "playbook/kit_base"
13
14
  require "playbook/kit_resolver"
14
- require "playbook/markdown/template_handler"
15
+ require "playbook/markdown"
15
16
  require "playbook/engine" if defined?(Rails)
16
17
 
17
18
  module Playbook
@@ -20,12 +21,16 @@ module Playbook
20
21
  class ConflictingPropsError < StandardError; end
21
22
  class MissingPropError < StandardError; end
22
23
 
23
- class << self
24
- def webpacker
25
- @webpacker ||= ::Webpacker::Instance.new(
26
- root_path: ROOT_PATH,
27
- config_path: ROOT_PATH.join("config/webpacker.yml")
28
- )
29
- end
24
+ module_function
25
+
26
+ def webpacker
27
+ @webpacker ||= ::Webpacker::Instance.new(
28
+ root_path: ROOT_PATH,
29
+ config_path: ROOT_PATH.join("config/webpacker.yml")
30
+ )
31
+ end
32
+
33
+ def kit_path(kit, *args)
34
+ Playbook::Engine.root.join("app/pb_kits/playbook/pb_#{kit}", *args)
30
35
  end
31
36
  end
@@ -0,0 +1,4 @@
1
+ # frozen_string_literal: true
2
+
3
+ require "playbook/markdown/template_handler"
4
+ require "playbook/markdown/helper"
@@ -0,0 +1,153 @@
1
+ # frozen_string_literal: true
2
+
3
+ require "redcarpet"
4
+ require "rouge"
5
+ require "rouge/plugins/redcarpet"
6
+ require "action_view"
7
+
8
+ module Playbook
9
+ module Markdown
10
+ module Helper
11
+ def markdown(text)
12
+ options = {
13
+ filter_html: false,
14
+ hard_wrap: true,
15
+ link_attributes: { rel: "nofollow", target: "_blank" },
16
+ space_after_headers: true,
17
+ fenced_code_blocks: true,
18
+ no_styles: false,
19
+ safe_links_only: true,
20
+ }
21
+
22
+ extensions = {
23
+ autolink: true,
24
+ superscript: true,
25
+ fenced_code_blocks: true,
26
+ tables: true,
27
+ disable_indented_code_blocks: false,
28
+ strikethrough: true,
29
+ underline: true,
30
+ highlight: true,
31
+ footnotes: true,
32
+ with_toc_data: true,
33
+ }
34
+
35
+ renderer = HTMLBlockCode.new(options)
36
+ markdown = Redcarpet::Markdown.new(renderer, extensions)
37
+
38
+ markdown.render(text).html_safe
39
+ end
40
+
41
+ def rouge(text, language)
42
+ formatter = Rouge::Formatters::HTML.new(scope: ".highlight")
43
+ lexer = Rouge::Lexer.find(language)
44
+ formatter.format(lexer.lex(text))
45
+ end
46
+
47
+ def rouge_markdown(text)
48
+ render_options = {
49
+ filter_html: true,
50
+ hard_wrap: true,
51
+ link_attributes: { rel: "nofollow" },
52
+ }
53
+ renderer = HTML.new(render_options)
54
+
55
+ extensions = {
56
+ autolink: true,
57
+ fenced_code_blocks: true,
58
+ lax_spacing: true,
59
+ no_intra_emphasis: true,
60
+ strikethrough: true,
61
+ superscript: true,
62
+ }
63
+ markdown = Redcarpet::Markdown.new(renderer, extensions)
64
+ markdown.render(text)
65
+ end
66
+ end
67
+
68
+ class HTML < Redcarpet::Render::HTML
69
+ include Rouge::Plugins::Redcarpet
70
+ end
71
+
72
+ class HTMLBlockCode < Redcarpet::Render::HTML
73
+ include ActionView::Helpers::AssetTagHelper
74
+ def header(title, level)
75
+ if level == 7
76
+ @headers ||= []
77
+ permalink = title.gsub(/\W+/, "-")
78
+ if @headers.include?(permalink)
79
+ permalink += "_1"
80
+ loop do
81
+ break unless @headers.include?(permalink)
82
+
83
+ permalink.gsub!(/\_(\d+)$/, "_#{Regexp.last_match(1).to_i + 1}")
84
+ end
85
+ end
86
+ @headers << permalink
87
+ %(\n<a name="#{permalink}" class="markdown-header-anchor anchor" href="##{permalink}"><span class="fa fa-link anchor-icon"></span></a><h#{level} id=\"#{permalink}\">#{title}</h#{level}>\n)
88
+ else
89
+ %(\n<h#{level}>#{title}</h#{level}>\n)
90
+ end
91
+ end
92
+
93
+ def image(link, title, alt_text)
94
+ image_tag(link, title: title, alt: alt_text, class: "imageloader lazyload")
95
+ end
96
+
97
+ def preprocess(full_document)
98
+ full_document.gsub(/\[component (.*)\]/) do
99
+ @string = Regexp.last_match(1)
100
+ @default_height = "160"
101
+ @attr = ["", @default_height]
102
+
103
+ # Set src from attributes
104
+ @string.gsub(/src="(.*?)"/) do
105
+ @attr[0] = Regexp.last_match(1)
106
+ end
107
+
108
+ # Set height from attributes
109
+ @string.gsub(/height="(.*?)"/) do
110
+ @attr[1] = (Regexp.last_match(1) || @default_height)
111
+ end
112
+
113
+ %(\n<div class="uix-component-frame"><iframe scrolling="no" id="component-preview" src="#{@attr[0]}" width="100%" height="#{@attr[1]}"></iframe><a href="#{@attr[0]}" target="_blank" class="uix-component-link">View component</a></div>\n)
114
+ end
115
+ end
116
+
117
+ def list(contents, _list_type)
118
+ @contents = contents
119
+ @list_items = contents.split("\n")
120
+
121
+ if @list_items[0].include?("[do]") || @list_items[0].include?("[dont]")
122
+ @element_items = []
123
+ @list_items.each do |item, _index|
124
+ item.gsub(%r{\<li>(.*)\</li>}) do
125
+ @element_items.push(Regexp.last_match(1))
126
+ end
127
+ end
128
+
129
+ # Doing both because we could have either/both
130
+ # clean up
131
+ @dont_items, @trash_items_dont = @element_items.partition { |x, _i| x.include? "[dont]" }
132
+ @do_items, @trash_items_do = @element_items.partition { |x, _i| x.include? "[do]" }
133
+
134
+ @do_list = []
135
+ @do_items.each do |item, _index|
136
+ @do_list.push("<li>#{item.sub('[do] ', '')}</li>")
137
+ end
138
+ @do_list = "<ul class='uix-ruleset do-list'>#{@do_list.join('')}</ul>"
139
+
140
+ @dont_list = []
141
+ @dont_items.each do |item, _index|
142
+ @dont_list.push("<li>#{item.sub('[dont] ', '')}</li>")
143
+ end
144
+ @dont_list = "<ul class='uix-ruleset dont-list'>#{@dont_list.join('')}</ul>"
145
+
146
+ "<div class='row uix-ruleset-block'><div class='col-sm-6'>#{@do_list}</div><div class='col-sm-6'>#{@dont_list}</div></div>"
147
+ else
148
+ @contents
149
+ end
150
+ end
151
+ end
152
+ end
153
+ end
@@ -0,0 +1,89 @@
1
+ # frozen_string_literal: true
2
+
3
+ module Playbook
4
+ module PbDocHelper
5
+ def pb_kit_title(title)
6
+ title.remove("pb_").titleize.tr("_", " ")
7
+ end
8
+
9
+ def pb_kit(kit: "", type: "rails", show_code: true, limit_examples: false, dark_mode: false)
10
+ examples = pb_doc_kit_examples(kit, type)
11
+ examples = examples.first(1) if limit_examples
12
+ examples.map do |example|
13
+ pb_rails "docs/kit_example", props: {
14
+ kit: kit,
15
+ example_title: example.values.first,
16
+ example_key: example.keys.first,
17
+ show_code: show_code,
18
+ type: type,
19
+ dark: dark_mode
20
+ }
21
+ end.join.yield_self(&method(:raw))
22
+ end
23
+
24
+ def nav_hash_array(link)
25
+ link.first.last
26
+ end
27
+
28
+ # Deal with lists of kits, used in Playbook doc and Externally
29
+ def pb_kits(type: "rails", limit_examples: false, dark_mode: false)
30
+ display_kits = []
31
+ kits = get_kits
32
+ kits.each do |kit|
33
+ if kit.is_a?(Hash)
34
+ nav_hash_array(kit).each do |sub_kit|
35
+ display_kits << render_pb_doc_kit(sub_kit, type, limit_examples, false, dark_mode)
36
+ end
37
+ else
38
+ display_kits << render_pb_doc_kit(kit, type, limit_examples, false, dark_mode)
39
+ end
40
+ end
41
+ raw("<div class='pb--docItem'>" + display_kits.join("</div><div class='pb--docItem'>") + "</div>")
42
+ end
43
+
44
+ def get_kits
45
+ menu = YAML.load_file(Playbook::Engine.root.join("app/pb_kits/playbook/data/menu.yml"))
46
+ menu["kits"]
47
+ end
48
+
49
+ def render_pb_doc_kit(kit, type, limit_examples, code = true, dark_mode = false)
50
+ title = pb_doc_render_clickable_title(kit, type)
51
+ ui = raw("<div class='pb--docItem-ui'>
52
+ #{pb_kit(kit: kit, type: type, show_code: code, limit_examples: limit_examples, dark_mode: dark_mode)}</div>")
53
+ title + ui
54
+ end
55
+
56
+ private
57
+
58
+ def pb_doc_kit_path(kit, *args)
59
+ Playbook.kit_path(kit, "docs", *args)
60
+ end
61
+
62
+ def pb_doc_kit_examples(kit, type)
63
+ example_file = pb_doc_kit_path(kit, "example.yml")
64
+ if File.exist?(example_file)
65
+ examples_list = YAML.load_file(example_file)
66
+ .inject({}) { |item, (k, v)| item[k.to_sym] = v; item }
67
+ examples_list.dig(:examples, type) || []
68
+ else
69
+ []
70
+ end
71
+ end
72
+
73
+ def pb_doc_render_clickable_title(kit, type)
74
+ url = "#"
75
+ begin
76
+ url = if type == "react"
77
+ kit_show_reacts_path(kit)
78
+ else
79
+ kit_show_path(kit)
80
+ end
81
+ # FIXME this is here because this helper generates a link for playbook website,
82
+ # but shouldn't do anything when used elsewhere
83
+ rescue
84
+ puts "Kit Path Not Avaliable"
85
+ end
86
+ render inline: "<a href='#{url}'>#{pb_rails(:title, props: { text: pb_kit_title(kit), tag: 'h3', size: 2 })}</a>"
87
+ end
88
+ end
89
+ end
@@ -1,5 +1,5 @@
1
1
  # frozen_string_literal: true
2
2
 
3
3
  module Playbook
4
- VERSION = "8.0.0.pre.alpha1"
4
+ VERSION = "8.0.2"
5
5
  end
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: playbook_ui
3
3
  version: !ruby/object:Gem::Version
4
- version: 8.0.0.pre.alpha1
4
+ version: 8.0.2
5
5
  platform: ruby
6
6
  authors:
7
7
  - Power UX
@@ -9,7 +9,7 @@ authors:
9
9
  autorequire:
10
10
  bindir: bin
11
11
  cert_chain: []
12
- date: 2021-02-19 00:00:00.000000000 Z
12
+ date: 2021-03-04 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: actionpack
@@ -286,6 +286,9 @@ dependencies:
286
286
  requirement: !ruby/object:Gem::Requirement
287
287
  requirements:
288
288
  - - "~>"
289
+ - !ruby/object:Gem::Version
290
+ version: '3.8'
291
+ - - ">="
289
292
  - !ruby/object:Gem::Version
290
293
  version: 3.8.0
291
294
  type: :development
@@ -293,6 +296,9 @@ dependencies:
293
296
  version_requirements: !ruby/object:Gem::Requirement
294
297
  requirements:
295
298
  - - "~>"
299
+ - !ruby/object:Gem::Version
300
+ version: '3.8'
301
+ - - ">="
296
302
  - !ruby/object:Gem::Version
297
303
  version: 3.8.0
298
304
  - !ruby/object:Gem::Dependency
@@ -420,11 +426,6 @@ files:
420
426
  - app/assets/images/pb-logo.svg
421
427
  - app/assets/images/pb-white-logo.svg
422
428
  - app/assets/images/pb.logo.svg
423
- - app/controllers/playbook/application_controller.rb
424
- - app/helpers/playbook/application_helper.rb
425
- - app/helpers/playbook/pb_doc_helper.rb
426
- - app/helpers/playbook/pb_sample_helper.rb
427
- - app/helpers/playbook/redcarpet_helper.rb
428
429
  - app/pb_kits/playbook/_playbook.scss
429
430
  - app/pb_kits/playbook/data/menu.yml
430
431
  - app/pb_kits/playbook/index.js
@@ -845,6 +846,10 @@ files:
845
846
  - app/pb_kits/playbook/pb_distribution_bar/docs/_distribution_bar_default.jsx
846
847
  - app/pb_kits/playbook/pb_distribution_bar/docs/example.yml
847
848
  - app/pb_kits/playbook/pb_distribution_bar/docs/index.js
849
+ - app/pb_kits/playbook/pb_docs/kit_api.html.erb
850
+ - app/pb_kits/playbook/pb_docs/kit_api.rb
851
+ - app/pb_kits/playbook/pb_docs/kit_example.html.erb
852
+ - app/pb_kits/playbook/pb_docs/kit_example.rb
848
853
  - app/pb_kits/playbook/pb_enhanced_element/element_observer.js
849
854
  - app/pb_kits/playbook/pb_enhanced_element/index.js
850
855
  - app/pb_kits/playbook/pb_file_upload/_file_upload.jsx
@@ -950,10 +955,8 @@ files:
950
955
  - app/pb_kits/playbook/pb_form/docs/_form_simple_form_validate.html.erb
951
956
  - app/pb_kits/playbook/pb_form/docs/_form_simple_form_validate.md
952
957
  - app/pb_kits/playbook/pb_form/docs/example.yml
953
- - app/pb_kits/playbook/pb_form/form.html.erb
954
958
  - app/pb_kits/playbook/pb_form/form.rb
955
959
  - app/pb_kits/playbook/pb_form/form_builder.rb
956
- - app/pb_kits/playbook/pb_form/form_builder/action_area.html.erb
957
960
  - app/pb_kits/playbook/pb_form/form_builder/action_area.rb
958
961
  - app/pb_kits/playbook/pb_form/form_builder/checkbox_field.rb
959
962
  - app/pb_kits/playbook/pb_form/form_builder/collection_select_field.rb
@@ -2014,7 +2017,10 @@ files:
2014
2017
  - lib/playbook/engine.rb
2015
2018
  - lib/playbook/kit_base.rb
2016
2019
  - lib/playbook/kit_resolver.rb
2020
+ - lib/playbook/markdown.rb
2021
+ - lib/playbook/markdown/helper.rb
2017
2022
  - lib/playbook/markdown/template_handler.rb
2023
+ - lib/playbook/pb_doc_helper.rb
2018
2024
  - lib/playbook/pb_kit_helper.rb
2019
2025
  - lib/playbook/props.rb
2020
2026
  - lib/playbook/props/array.rb
@@ -2049,9 +2055,9 @@ required_ruby_version: !ruby/object:Gem::Requirement
2049
2055
  version: '0'
2050
2056
  required_rubygems_version: !ruby/object:Gem::Requirement
2051
2057
  requirements:
2052
- - - ">"
2058
+ - - ">="
2053
2059
  - !ruby/object:Gem::Version
2054
- version: 1.3.1
2060
+ version: '0'
2055
2061
  requirements: []
2056
2062
  rubyforge_project:
2057
2063
  rubygems_version: 2.7.3
@@ -1,14 +0,0 @@
1
- # frozen_string_literal: true
2
-
3
- module Playbook
4
- class ApplicationController < ActionController::Base
5
- helper Webpacker::Helper
6
- helper Playbook::ApplicationHelper
7
- helper Playbook::PbDocHelper
8
- helper Playbook::PbSampleHelper
9
-
10
- def delete_dark_mode_cookie
11
- cookies.delete :dark_mode
12
- end
13
- end
14
- end
@@ -1,30 +0,0 @@
1
- # frozen_string_literal: true
2
-
3
- module Playbook
4
- module ApplicationHelper
5
- include ::Webpacker::React::Helpers
6
- include ::Playbook::PbKitHelper
7
-
8
- def current_webpacker_instance
9
- Playbook.webpacker
10
- end
11
-
12
- def pb_rails(kit, props: {}, &block)
13
- super kit, props: dark_mode_props(props), &block
14
- end
15
-
16
- def pb_react(kit, props: {}, options: {})
17
- react_component kit.camelize, dark_mode_props(props), options
18
- end
19
-
20
- private
21
-
22
- def dark_mode_props(props)
23
- (props || {}).merge(dark: dark_mode?)
24
- end
25
-
26
- def dark_mode?
27
- cookies[:dark_mode].eql? "true"
28
- end
29
- end
30
- end
@@ -1,210 +0,0 @@
1
- # frozen_string_literal: true
2
-
3
- module Playbook
4
- module PbDocHelper
5
- def pb_kit_title(title)
6
- title.remove("pb_").titleize.tr("_", " ")
7
- end
8
-
9
- def pb_doc_source(type, kit, example_key)
10
- highlight = type == "react" ? "react" : "erb"
11
- extension = type == "react" ? "jsx" : "html.erb"
12
- source = read_source_file kit_path(kit).join("docs/_#{example_key}.#{extension}")
13
- raw rouge(source, highlight)
14
- end
15
-
16
- def pb_doc_example(type, kit, example_key)
17
- if type == "rails"
18
- render file: kit_path(kit).join("docs/_#{example_key}.html.erb")
19
- elsif type == "react"
20
- pb_react(example_key.camelize)
21
- end
22
- end
23
-
24
- def pb_doc_kit_api(kit)
25
- kit_class = Playbook::KitResolver.resolve(kit.to_s)
26
- return unless kit_class
27
- render partial: "playbook/config/pb_kit_api", locals: { kit_api: kit_class.props.keys }
28
- end
29
-
30
- def has_kit_type?(kit, type)
31
- type ||= "rails"
32
- if type == "rails"
33
- erbfiles = File.join("**", "*.erb")
34
- Dir.glob(erbfiles, base: "#{kit_path(kit)}/docs").present?
35
- elsif type == "react"
36
- jsxfiles = File.join("**", "*.jsx")
37
- Dir.glob(jsxfiles, base: "#{kit_path(kit)}/docs").present?
38
- end
39
- end
40
-
41
- def get_kit_description(kit)
42
- read_source_file kit_path(kit).join("docs/_description.md")
43
- end
44
-
45
- def get_per_sample_descriptions(kit, key)
46
- read_source_file kit_path(kit).join("docs/_#{key}.md")
47
- end
48
-
49
- def get_kit_footer(kit)
50
- read_source_file kit_path(kit).join("docs/_footer.md")
51
- end
52
-
53
- def pb_kit(kit: "", type: "rails", show_code: true, limit_examples: false)
54
- @type = type
55
- @kit_examples = get_kit_examples(kit, type)
56
- @limit_examples = limit_examples
57
- @show_code = show_code
58
- render partial: "playbook/config/kit_example"
59
- end
60
-
61
- def pb_kits(type: "rails", limit_examples: false)
62
- display_kits = []
63
- kits = get_kits
64
- kits.each do |kit|
65
- if kit.is_a?(Hash)
66
- nav_hash_array(kit).each do |sub_kit|
67
- display_kits << render_pb_doc_kit(sub_kit, type, false, limit_examples)
68
- end
69
- else
70
- display_kits << render_pb_doc_kit(kit, type, false, limit_examples)
71
- end
72
- end
73
- raw("<div class='pb--docItem'>" + display_kits.join("</div><div class='pb--docItem'>") + "</div>")
74
- end
75
-
76
- def get_kits
77
- menu = YAML.load_file("#{Playbook::Engine.root}/app/pb_kits/playbook/data/menu.yml")
78
- menu["kits"]
79
- end
80
-
81
- def pb_category_kits(category_kits: [], type: "rails")
82
- display_kits = []
83
- category_kits.each do |kit|
84
- display_kits << render_pb_doc_kit(kit, type, false)
85
- end
86
- raw("<div class='pb--docItem'>" + display_kits.join("</div><div class='pb--docItem'>") + "</div>")
87
- end
88
-
89
- def render_pb_doc_kit(kit, type, code = true, limit_examples)
90
- title = render_clickable_title(kit, type)
91
- ui = raw("<div class='pb--docItem-ui'>
92
- #{pb_kit(kit: kit, type: type, show_code: code, limit_examples: limit_examples)}</div>")
93
- title + ui
94
- end
95
-
96
- def nav_hash_category(link)
97
- link.keys.first
98
- end
99
-
100
- def nav_hash_array(link)
101
- link.first.last
102
- end
103
-
104
- def all_link(type)
105
- type == "react" ? kits_path("", type: "react") : kits_path
106
- end
107
-
108
- def category_link(type, link)
109
- if type == "react"
110
- kit_category_show_path(nav_hash_category(link), type: "react")
111
- else
112
- kit_category_show_path(nav_hash_category(link), type: "rails")
113
- end
114
- end
115
-
116
- def sub_category_link(type, link)
117
- if type == "react"
118
- kit_show_reacts_path(link)
119
- else
120
- kit_show_path(link)
121
- end
122
- end
123
-
124
- def kit_link(type, link)
125
- if type == "react"
126
- kit_show_reacts_path(link)
127
- else
128
- kit_show_path(link)
129
- end
130
- end
131
-
132
- def all_active(controller_name, action_name)
133
- (controller_name == "pages" && action_name == "kits")
134
- end
135
-
136
- def category_active(category, link)
137
- (!category.nil? && category == nav_hash_category(link))
138
- end
139
-
140
- def kit_active(kit, link)
141
- (!kit.nil? && kit == link)
142
- end
143
-
144
- def sub_category_active(kit, link)
145
- (!kit.nil? && @kit == link)
146
- end
147
-
148
- def read_source_file(*args)
149
- path = Playbook::Engine.root.join(*args)
150
- path.exist? ? path.read : ""
151
- end
152
-
153
- def format_search_hash(kit)
154
- label_value_hash = {
155
- label: kit.to_s.titleize,
156
- value: @type == "react" || @type.nil? ? "/kits/#{kit}/react" : "/kits/#{kit}",
157
- }
158
- label_value_hash
159
- end
160
-
161
- def search_list
162
- all_kits = []
163
- formatted_kits = []
164
- MENU["kits"].each do |kit|
165
- if kit.is_a? Hash
166
- kit.values[0].each do |sub_kit|
167
- all_kits.push(sub_kit)
168
- end
169
- else
170
- all_kits.push(kit)
171
- end
172
- end
173
- all_kits.sort!.each do |sorted_kit|
174
- formatted_kits.push(format_search_hash(sorted_kit))
175
- end
176
- formatted_kits
177
- end
178
-
179
- private
180
-
181
- def kit_path(kit)
182
- Playbook::Engine.root.join("app/pb_kits/playbook/pb_#{kit}")
183
- end
184
-
185
- def get_kit_examples(kit, type)
186
- example_file = kit_path(kit).join("docs/example.yml")
187
- if File.exist? example_file
188
- examples_list = YAML.load_file(example_file)
189
- .inject({}) { |item, (k, v)| item[k.to_sym] = v; item }
190
- { kit: kit, examples: examples_list[:examples][type] }
191
- else
192
- {}
193
- end
194
- end
195
-
196
- def render_clickable_title(kit, type)
197
- url = "#"
198
- begin
199
- url = if type == "react"
200
- kit_show_reacts_path(kit)
201
- else
202
- kit_show_path(kit)
203
- end
204
- rescue
205
- puts "Kit Path Not Avaliable"
206
- end
207
- render inline: "<a href='#{url}'>#{pb_rails(:title, props: { text: pb_kit_title(kit), tag: 'h3', size: 2 })}</a>"
208
- end
209
- end
210
- end
@@ -1,64 +0,0 @@
1
- # frozen_string_literal: true
2
-
3
- module Playbook
4
- module PbSampleHelper
5
- def kits_used(sample)
6
- code = get_raw_code(sample, "rails")
7
- kits_array = code.scan(%r{pb_rails\("(\w+)(?:"|/)})
8
- kits_array.uniq
9
- end
10
-
11
- def get_raw_code(sample, type)
12
- if type == "rails"
13
- ext = "html.erb"
14
- elsif type == "react"
15
- ext = "jsx"
16
- end
17
-
18
- read_source_file "app/views/playbook/samples", sample, "index.#{ext}"
19
- end
20
-
21
- def get_sample_code_content(sample, type)
22
- if type == "rails"
23
- rouge_type = "erb"
24
- elsif type == "react"
25
- rouge_type = "react"
26
- end
27
- code = get_raw_code(sample, type)
28
- raw rouge(code, rouge_type)
29
- end
30
-
31
- def get_category(sample)
32
- cat = ""
33
- SAMPLES.each do |category, samples|
34
- cat = category if samples.include?(sample)
35
- end
36
- cat
37
- end
38
-
39
- def get_samples(kit)
40
- all_samples = []
41
-
42
- SAMPLES.each do |_category, sample|
43
- all_samples.push(sample)
44
- end
45
-
46
- output = ""
47
- samples_using_kit = []
48
- all_samples[0].each do |sample|
49
- filepath = "#{Playbook::Engine.root}/app/views/playbook/samples/#{sample}/index.html.erb"
50
- output = `grep -l 'pb_rails(\"#{kit}' #{filepath}`
51
- samples_using_kit.push(sample) if output.chomp == filepath
52
- end
53
- samples_using_kit
54
- end
55
-
56
- def render_sample_ui(sample, type)
57
- if type == "rails"
58
- render template: "playbook/samples/#{sample}/index.html.erb"
59
- elsif type == "react"
60
- react_component(sample.titleize.delete(" ").to_s)
61
- end
62
- end
63
- end
64
- end
@@ -1,151 +0,0 @@
1
- # frozen_string_literal: true
2
-
3
- require "redcarpet"
4
- require "rouge"
5
- require "rouge/plugins/redcarpet"
6
- require "action_view"
7
-
8
- module Playbook
9
- module RedcarpetHelper
10
- def markdown(text)
11
- options = {
12
- filter_html: false,
13
- hard_wrap: true,
14
- link_attributes: { rel: "nofollow", target: "_blank" },
15
- space_after_headers: true,
16
- fenced_code_blocks: true,
17
- no_styles: false,
18
- safe_links_only: true,
19
- }
20
-
21
- extensions = {
22
- autolink: true,
23
- superscript: true,
24
- fenced_code_blocks: true,
25
- tables: true,
26
- disable_indented_code_blocks: false,
27
- strikethrough: true,
28
- underline: true,
29
- highlight: true,
30
- footnotes: true,
31
- with_toc_data: true,
32
- }
33
-
34
- renderer = HTMLBlockCode.new(options)
35
- markdown = Redcarpet::Markdown.new(renderer, extensions)
36
-
37
- markdown.render(text).html_safe
38
- end
39
-
40
- def rouge(text, language)
41
- formatter = Rouge::Formatters::HTML.new(scope: ".highlight")
42
- lexer = Rouge::Lexer.find(language)
43
- formatter.format(lexer.lex(text))
44
- end
45
-
46
- def rouge_markdown(text)
47
- render_options = {
48
- filter_html: true,
49
- hard_wrap: true,
50
- link_attributes: { rel: "nofollow" },
51
- }
52
- renderer = HTML.new(render_options)
53
-
54
- extensions = {
55
- autolink: true,
56
- fenced_code_blocks: true,
57
- lax_spacing: true,
58
- no_intra_emphasis: true,
59
- strikethrough: true,
60
- superscript: true,
61
- }
62
- markdown = Redcarpet::Markdown.new(renderer, extensions)
63
- markdown.render(text)
64
- end
65
- end
66
-
67
- class HTML < Redcarpet::Render::HTML
68
- include Rouge::Plugins::Redcarpet
69
- end
70
-
71
- class HTMLBlockCode < Redcarpet::Render::HTML
72
- include ActionView::Helpers::AssetTagHelper
73
- def header(title, level)
74
- if level == 7
75
- @headers ||= []
76
- permalink = title.gsub(/\W+/, "-")
77
- if @headers.include?(permalink)
78
- permalink += "_1"
79
- loop do
80
- break unless @headers.include?(permalink)
81
-
82
- permalink.gsub!(/\_(\d+)$/, "_#{Regexp.last_match(1).to_i + 1}")
83
- end
84
- end
85
- @headers << permalink
86
- %(\n<a name="#{permalink}" class="markdown-header-anchor anchor" href="##{permalink}"><span class="fa fa-link anchor-icon"></span></a><h#{level} id=\"#{permalink}\">#{title}</h#{level}>\n)
87
- else
88
- %(\n<h#{level}>#{title}</h#{level}>\n)
89
- end
90
- end
91
-
92
- def image(link, title, alt_text)
93
- image_tag(link, title: title, alt: alt_text, class: "imageloader lazyload")
94
- end
95
-
96
- def preprocess(full_document)
97
- full_document.gsub(/\[component (.*)\]/) do
98
- @string = Regexp.last_match(1)
99
- @default_height = "160"
100
- @attr = ["", @default_height]
101
-
102
- # Set src from attributes
103
- @string.gsub(/src="(.*?)"/) do
104
- @attr[0] = Regexp.last_match(1)
105
- end
106
-
107
- # Set height from attributes
108
- @string.gsub(/height="(.*?)"/) do
109
- @attr[1] = (Regexp.last_match(1) || @default_height)
110
- end
111
-
112
- %(\n<div class="uix-component-frame"><iframe scrolling="no" id="component-preview" src="#{@attr[0]}" width="100%" height="#{@attr[1]}"></iframe><a href="#{@attr[0]}" target="_blank" class="uix-component-link">View component</a></div>\n)
113
- end
114
- end
115
-
116
- def list(contents, _list_type)
117
- @contents = contents
118
- @list_items = contents.split("\n")
119
-
120
- if @list_items[0].include?("[do]") || @list_items[0].include?("[dont]")
121
- @element_items = []
122
- @list_items.each do |item, _index|
123
- item.gsub(%r{\<li>(.*)\</li>}) do
124
- @element_items.push(Regexp.last_match(1))
125
- end
126
- end
127
-
128
- # Doing both because we could have either/both
129
- # clean up
130
- @dont_items, @trash_items_dont = @element_items.partition { |x, _i| x.include? "[dont]" }
131
- @do_items, @trash_items_do = @element_items.partition { |x, _i| x.include? "[do]" }
132
-
133
- @do_list = []
134
- @do_items.each do |item, _index|
135
- @do_list.push("<li>#{item.sub('[do] ', '')}</li>")
136
- end
137
- @do_list = "<ul class='uix-ruleset do-list'>#{@do_list.join('')}</ul>"
138
-
139
- @dont_list = []
140
- @dont_items.each do |item, _index|
141
- @dont_list.push("<li>#{item.sub('[dont] ', '')}</li>")
142
- end
143
- @dont_list = "<ul class='uix-ruleset dont-list'>#{@dont_list.join('')}</ul>"
144
-
145
- "<div class='row uix-ruleset-block'><div class='col-sm-6'>#{@do_list}</div><div class='col-sm-6'>#{@dont_list}</div></div>"
146
- else
147
- @contents
148
- end
149
- end
150
- end
151
- end
@@ -1,7 +0,0 @@
1
- <%=
2
- pb_rails("form/#{form_system}", props: {
3
- options: form_system_options,
4
- children: children,
5
- validate: validate
6
- })
7
- %>
@@ -1,3 +0,0 @@
1
- <ol class="pb-form-actions">
2
- <%= content %>
3
- </ol>