playbook_ui 8.0.0.pre.alpha1 → 8.0.2

Sign up to get free protection for your applications and to get access to all the features.
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>