playbook_ui 5.3.0 → 5.5.1.pre.alpha2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (80) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/_playbook.scss +2 -1
  3. data/app/pb_kits/playbook/data/menu.yml +2 -0
  4. data/app/pb_kits/playbook/index.js +2 -0
  5. data/app/pb_kits/playbook/packs/examples.js +2 -0
  6. data/app/pb_kits/playbook/packs/samples.js +2 -0
  7. data/app/pb_kits/playbook/pb_body/_body.html.erb +1 -0
  8. data/app/pb_kits/playbook/pb_body/_body.jsx +33 -24
  9. data/app/pb_kits/playbook/pb_body/docs/_body_dark.html.erb +1 -1
  10. data/app/pb_kits/playbook/pb_body/docs/_body_dark.jsx +0 -2
  11. data/app/pb_kits/playbook/pb_body/docs/_body_light.html.erb +1 -0
  12. data/app/pb_kits/playbook/pb_body/docs/_body_light.jsx +3 -7
  13. data/app/pb_kits/playbook/pb_button/_button.jsx +2 -0
  14. data/app/pb_kits/playbook/pb_caption/_caption.scss +2 -2
  15. data/app/pb_kits/playbook/pb_checkbox/_checkbox.html.erb +2 -1
  16. data/app/pb_kits/playbook/pb_checkbox/_checkbox.jsx +18 -5
  17. data/app/pb_kits/playbook/pb_checkbox/docs/_checkbox_checked.jsx +17 -0
  18. data/app/pb_kits/playbook/pb_checkbox/docs/example.yml +1 -0
  19. data/app/pb_kits/playbook/pb_checkbox/docs/index.js +1 -0
  20. data/app/pb_kits/playbook/pb_circle_icon_button/_circle_icon_button.html.erb +1 -0
  21. data/app/pb_kits/playbook/pb_circle_icon_button/_circle_icon_button.jsx +17 -1
  22. data/app/pb_kits/playbook/pb_dashboard_value/_dashboard_value.html.erb +3 -2
  23. data/app/pb_kits/playbook/pb_dashboard_value/_dashboard_value.jsx +15 -12
  24. data/app/pb_kits/playbook/pb_date_picker/_date_picker.html.erb +36 -0
  25. data/app/pb_kits/playbook/pb_date_picker/_date_picker.jsx +98 -0
  26. data/app/pb_kits/playbook/pb_date_picker/_date_picker.scss +59 -0
  27. data/app/pb_kits/playbook/pb_date_picker/date_picker.rb +38 -0
  28. data/app/pb_kits/playbook/pb_date_picker/date_picker_helper.js +91 -0
  29. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default.html.erb +1 -0
  30. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default.jsx +12 -0
  31. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default_date.html.erb +24 -0
  32. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default_date.jsx +30 -0
  33. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_disabled.html.erb +43 -0
  34. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_disabled.jsx +48 -0
  35. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_error.html.erb +4 -0
  36. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_error.jsx +13 -0
  37. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_format.html.erb +19 -0
  38. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_format.jsx +25 -0
  39. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_label.html.erb +4 -0
  40. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_label.jsx +13 -0
  41. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_min_max.html.erb +14 -0
  42. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_min_max.jsx +22 -0
  43. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range.html.erb +4 -0
  44. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range.jsx +13 -0
  45. data/app/pb_kits/playbook/pb_date_picker/docs/example.yml +23 -0
  46. data/app/pb_kits/playbook/pb_date_picker/docs/index.js +8 -0
  47. data/app/pb_kits/playbook/pb_date_picker/index.js +11 -0
  48. data/app/pb_kits/playbook/pb_filter/docs/_filter_default.html.erb +1 -0
  49. data/app/pb_kits/playbook/pb_form/docs/_form_form_with.html.erb +1 -0
  50. data/app/pb_kits/playbook/pb_form/docs/_form_simple_form.html.erb +3 -1
  51. data/app/pb_kits/playbook/pb_form/form_builder.rb +1 -0
  52. data/app/pb_kits/playbook/pb_form/form_builder/date_picker_field.rb +15 -0
  53. data/app/pb_kits/playbook/pb_highlight/docs/_highlight_default.html.erb +1 -1
  54. data/app/pb_kits/playbook/pb_image/_image.jsx +1 -1
  55. data/app/pb_kits/playbook/pb_layout/_layout.scss +16 -0
  56. data/app/pb_kits/playbook/pb_legend/_legend.html.erb +1 -0
  57. data/app/pb_kits/playbook/pb_legend/_legend.jsx +25 -4
  58. data/app/pb_kits/playbook/pb_nav/_item.jsx +20 -10
  59. data/app/pb_kits/playbook/pb_nav/_vertical_nav.scss +3 -0
  60. data/app/pb_kits/playbook/pb_popover/_popover.html.erb +1 -1
  61. data/app/pb_kits/playbook/pb_popover/_popover.jsx +3 -1
  62. data/app/pb_kits/playbook/pb_popover/_popover.scss +4 -0
  63. data/app/pb_kits/playbook/pb_popover/popover.rb +4 -0
  64. data/app/pb_kits/playbook/pb_time_range_inline/_time_range_inline.html.erb +2 -2
  65. data/app/pb_kits/playbook/pb_time_range_inline/_time_range_inline.jsx +24 -10
  66. data/app/pb_kits/playbook/pb_time_range_inline/_time_range_inline.scss +3 -1
  67. data/app/pb_kits/playbook/pb_time_range_inline/time_range_inline.rb +6 -0
  68. data/app/pb_kits/playbook/pb_title/_title.jsx +7 -4
  69. data/app/pb_kits/playbook/pb_title/_title.scss +7 -0
  70. data/app/pb_kits/playbook/pb_title/_title_mixin.scss +2 -0
  71. data/app/pb_kits/playbook/pb_title/title.rb +4 -1
  72. data/app/pb_kits/playbook/vendor.js +4 -0
  73. data/app/views/layouts/playbook/samples.html.erb +1 -0
  74. data/app/views/playbook/samples/collection_detail/index.html.erb +169 -0
  75. data/app/views/playbook/samples/collection_detail/index.jsx +372 -0
  76. data/lib/generators/kit/kit_generator.rb +6 -3
  77. data/lib/generators/kit/templates/kit_html.erb.tt +3 -2
  78. data/lib/generators/kit/templates/kit_jsx.erb.tt +38 -10
  79. data/lib/playbook/version.rb +1 -1
  80. metadata +32 -4
@@ -13,10 +13,10 @@ class KitGenerator < Rails::Generators::NamedBase
13
13
  @kit_name_underscore = kit_name.parameterize.underscore
14
14
  @kit_name_pascal = kit_name.titleize.gsub(/\s+/, "")
15
15
 
16
- kit_props = options[:props].concat(%w[id:string classname:string data:object])
16
+ kit_props = options[:props].concat(%w[id:string classname:string data:object aria:object])
17
17
  @kit_props = kit_props.map { |hash| [hash.partition(":").first, hash.partition(":").last] }.to_h
18
18
  @kit_props = @kit_props.sort.to_h
19
- @unique_props = @kit_props.symbolize_keys.without(:id, :classname, :data)
19
+ @unique_props = @kit_props.symbolize_keys.without(:id, :classname, :data, :aria)
20
20
 
21
21
  @kit_class_init = []
22
22
  @kit_props.each do |key, _val|
@@ -48,7 +48,7 @@ class KitGenerator < Rails::Generators::NamedBase
48
48
  # Generate SCSS files ==============================
49
49
  template "kit_scss.erb", "#{full_kit_directory}/_#{@kit_name_underscore}.scss"
50
50
  open("app/pb_kits/playbook/_playbook.scss", "a") do |f|
51
- f.puts "@" + "import " + "\'" + "pb_#{@kit_name_underscore}/#{@kit_name_underscore}" + "\';"
51
+ f.puts "\n@" + "import " + "\'" + "pb_#{@kit_name_underscore}/#{@kit_name_underscore}" + "\';"
52
52
  end
53
53
  say_status "complete",
54
54
  "#{@kit_name_capitalize} kit stylesheet successfully created and imported.",
@@ -77,6 +77,9 @@ class KitGenerator < Rails::Generators::NamedBase
77
77
  append_to_file("app/pb_kits/playbook/packs/examples.js") do
78
78
  "import * as #{@kit_name_pascal} from 'pb_#{@kit_name_underscore}/docs'\nWebpackerReact.setup(#{@kit_name_pascal})\n"
79
79
  end
80
+ append_to_file("app/pb_kits/playbook/index.js") do
81
+ "\nexport #{@kit_name_pascal} from 'pb_#{@kit_name_underscore}/_#{@kit_name_underscore}.jsx'"
82
+ end
80
83
 
81
84
  say_status "complete",
82
85
  "#{@kit_name_capitalize} react kit successfully created.",
@@ -1,6 +1,7 @@
1
1
  <%%= content_tag(:div,
2
- id: object.id,
2
+ aria: object.aria,
3
+ class: object.classname,
3
4
  data: object.data,
4
- class: object.classname) do %>
5
+ id: object.id) do %>
5
6
  <span><%= @kit_name_uppercase %> CONTENT</span>
6
7
  <%% end %>
@@ -10,6 +10,7 @@ props_types = @kit_props.map do |key, val|
10
10
  prop_type = case val
11
11
  when "enum", "one_of" then "'option_1' | 'option_2'"
12
12
  when "boolean", "bool" then "Boolean"
13
+ when "object", "obj" then "object"
13
14
  else "String"
14
15
  end
15
16
 
@@ -17,24 +18,51 @@ props_types = @kit_props.map do |key, val|
17
18
  end
18
19
  puts props_types.inspect
19
20
 
20
- props_names = @kit_props.map { |key,| key == "classname" ? "className" : key.camelize(:lower) }
21
+ props_names = @kit_props.keys.map do |key|
22
+ case key
23
+ when "classname" || "className"
24
+ "className"
25
+ when "aria"
26
+ "aria = {}"
27
+ when "data"
28
+ "data = {}"
29
+ else
30
+ key
31
+ end
32
+ end
33
+
34
+ %>
21
35
 
22
- props_and_values = props_names.map { |prop| "<p>{`#{prop}: ${#{prop}}`}</p>" }
23
- -%>
24
36
  /* @flow */
25
37
 
26
38
  import React from 'react'
39
+ import classnames from 'classnames'
40
+ import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
41
+ import { spacing } from '../utilities/spacing.js'
27
42
 
28
43
  type <%= type_name %> = {
29
44
  <%= break_lines.call(props_types) %>
30
45
  }
31
46
 
32
- const <%= @kit_name_pascal %> = ({
33
- <%= break_lines.call(props_names) %>
34
- }: <%= type_name %>) => (
35
- <div>
36
- <%= break_lines.call(props_and_values, 4, "") %>
37
- </div>
38
- )
47
+ const <%= @kit_name_pascal %> = (props: <%= type_name %>) => {
48
+ const {
49
+ <%= break_lines.call(props_names) %>
50
+ } = props
51
+
52
+ const ariaProps = buildAriaProps(aria)
53
+ const dataProps = buildDataProps(data)
54
+ const classes = classnames(buildCss('pb_<%= @kit_name_underscore %>'), className, spacing(props))
55
+
56
+ return (
57
+ <div
58
+ {...ariaProps}
59
+ {...dataProps}
60
+ className={classes}
61
+ id={id}
62
+ >
63
+ {className}
64
+ </div>
65
+ )
66
+ }
39
67
 
40
68
  export default <%= @kit_name_pascal %>
@@ -1,5 +1,5 @@
1
1
  # frozen_string_literal: true
2
2
 
3
3
  module Playbook
4
- VERSION = "5.3.0"
4
+ VERSION = "5.5.1.pre.alpha2"
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: 5.3.0
4
+ version: 5.5.1.pre.alpha2
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: 2020-07-10 00:00:00.000000000 Z
12
+ date: 2020-07-30 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: actionpack
@@ -574,6 +574,7 @@ files:
574
574
  - app/pb_kits/playbook/pb_checkbox/_checkbox.scss
575
575
  - app/pb_kits/playbook/pb_checkbox/checkbox.rb
576
576
  - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_checked.html.erb
577
+ - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_checked.jsx
577
578
  - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_custom.html.erb
578
579
  - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_custom.jsx
579
580
  - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_dark.html.erb
@@ -661,6 +662,30 @@ files:
661
662
  - app/pb_kits/playbook/pb_date/docs/_description.md
662
663
  - app/pb_kits/playbook/pb_date/docs/example.yml
663
664
  - app/pb_kits/playbook/pb_date/docs/index.js
665
+ - app/pb_kits/playbook/pb_date_picker/_date_picker.html.erb
666
+ - app/pb_kits/playbook/pb_date_picker/_date_picker.jsx
667
+ - app/pb_kits/playbook/pb_date_picker/_date_picker.scss
668
+ - app/pb_kits/playbook/pb_date_picker/date_picker.rb
669
+ - app/pb_kits/playbook/pb_date_picker/date_picker_helper.js
670
+ - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default.html.erb
671
+ - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default.jsx
672
+ - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default_date.html.erb
673
+ - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default_date.jsx
674
+ - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_disabled.html.erb
675
+ - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_disabled.jsx
676
+ - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_error.html.erb
677
+ - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_error.jsx
678
+ - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_format.html.erb
679
+ - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_format.jsx
680
+ - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_label.html.erb
681
+ - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_label.jsx
682
+ - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_min_max.html.erb
683
+ - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_min_max.jsx
684
+ - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range.html.erb
685
+ - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range.jsx
686
+ - app/pb_kits/playbook/pb_date_picker/docs/example.yml
687
+ - app/pb_kits/playbook/pb_date_picker/docs/index.js
688
+ - app/pb_kits/playbook/pb_date_picker/index.js
664
689
  - app/pb_kits/playbook/pb_date_range_inline/_date_range_inline.html.erb
665
690
  - app/pb_kits/playbook/pb_date_range_inline/_date_range_inline.jsx
666
691
  - app/pb_kits/playbook/pb_date_range_inline/_date_range_inline.scss
@@ -826,6 +851,7 @@ files:
826
851
  - app/pb_kits/playbook/pb_form/form_builder.rb
827
852
  - app/pb_kits/playbook/pb_form/form_builder/action_area.rb
828
853
  - app/pb_kits/playbook/pb_form/form_builder/collection_select_field.rb
854
+ - app/pb_kits/playbook/pb_form/form_builder/date_picker_field.rb
829
855
  - app/pb_kits/playbook/pb_form/form_builder/form_field_builder.rb
830
856
  - app/pb_kits/playbook/pb_form/form_builder/form_with_form_builder.rb
831
857
  - app/pb_kits/playbook/pb_form/form_builder/select_field.rb
@@ -1772,6 +1798,8 @@ files:
1772
1798
  - app/views/playbook/pages/tokens/_pb_doc_spacing.html.slim
1773
1799
  - app/views/playbook/pages/utilities.html.slim
1774
1800
  - app/views/playbook/pages/utilities/_pb_doc_color.html.slim
1801
+ - app/views/playbook/samples/collection_detail/index.html.erb
1802
+ - app/views/playbook/samples/collection_detail/index.jsx
1775
1803
  - app/views/playbook/samples/dashboards/index.html.erb
1776
1804
  - app/views/playbook/samples/dashboards/index.jsx
1777
1805
  - app/views/playbook/samples/filter_table/index.html.erb
@@ -1813,9 +1841,9 @@ required_ruby_version: !ruby/object:Gem::Requirement
1813
1841
  version: '0'
1814
1842
  required_rubygems_version: !ruby/object:Gem::Requirement
1815
1843
  requirements:
1816
- - - ">="
1844
+ - - ">"
1817
1845
  - !ruby/object:Gem::Version
1818
- version: '0'
1846
+ version: 1.3.1
1819
1847
  requirements: []
1820
1848
  rubyforge_project:
1821
1849
  rubygems_version: 2.7.3