playbook_ui 5.5.1.pre.alpha1 → 6.0.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (93) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/_playbook.scss +0 -3
  3. data/app/pb_kits/playbook/data/menu.yml +0 -3
  4. data/app/pb_kits/playbook/index.js +0 -3
  5. data/app/pb_kits/playbook/packs/examples.js +0 -6
  6. data/app/pb_kits/playbook/pb_circle_chart/_circle_chart.html.erb +21 -11
  7. data/app/pb_kits/playbook/pb_circle_chart/_circle_chart.scss +10 -0
  8. data/app/pb_kits/playbook/pb_circle_chart/circle_chart.rb +14 -0
  9. data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_block.html.erb +26 -0
  10. data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_colors.html.erb +20 -0
  11. data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_rounded.html.erb +22 -0
  12. data/app/pb_kits/playbook/pb_circle_chart/docs/example.yml +5 -1
  13. data/app/pb_kits/playbook/pb_filter/docs/_filter_default.html.erb +0 -1
  14. data/app/pb_kits/playbook/pb_form/docs/_form_form_with.html.erb +0 -1
  15. data/app/pb_kits/playbook/pb_form/docs/_form_simple_form.html.erb +1 -3
  16. data/app/pb_kits/playbook/pb_form/form_builder.rb +0 -1
  17. data/app/pb_kits/playbook/pb_image/_image.html.erb +2 -1
  18. data/app/pb_kits/playbook/pb_image/_image.jsx +31 -8
  19. data/app/pb_kits/playbook/pb_image/docs/_default_image.jsx +3 -3
  20. data/app/pb_kits/playbook/pb_label_value/_label_value.html.erb +20 -2
  21. data/app/pb_kits/playbook/pb_label_value/_label_value.jsx +109 -5
  22. data/app/pb_kits/playbook/pb_label_value/_label_value.scss +0 -10
  23. data/app/pb_kits/playbook/pb_label_value/docs/_description.md +3 -1
  24. data/app/pb_kits/playbook/pb_label_value/docs/_label_value_details.html.erb +39 -0
  25. data/app/pb_kits/playbook/pb_label_value/docs/_label_value_details.jsx +50 -0
  26. data/app/pb_kits/playbook/pb_label_value/docs/_label_value_details.md +1 -0
  27. data/app/pb_kits/playbook/pb_label_value/docs/_label_value_details_dark.html.erb +43 -0
  28. data/app/pb_kits/playbook/pb_label_value/docs/_label_value_details_dark.jsx +54 -0
  29. data/app/pb_kits/playbook/pb_label_value/docs/_label_value_details_examples.html.erb +72 -0
  30. data/app/pb_kits/playbook/pb_label_value/docs/_label_value_details_examples.jsx +92 -0
  31. data/app/pb_kits/playbook/pb_label_value/docs/_label_value_details_examples_dark.html.erb +80 -0
  32. data/app/pb_kits/playbook/pb_label_value/docs/_label_value_details_examples_dark.jsx +101 -0
  33. data/app/pb_kits/playbook/pb_label_value/docs/example.yml +9 -0
  34. data/app/pb_kits/playbook/pb_label_value/docs/index.js +5 -0
  35. data/app/pb_kits/playbook/pb_label_value/label_value.rb +19 -2
  36. data/app/pb_kits/playbook/pb_progress_simple/_progress_simple.jsx +5 -1
  37. data/app/pb_kits/playbook/pb_progress_simple/_progress_simple.scss +12 -1
  38. data/app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_variants.html.erb +9 -0
  39. data/app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_variants.jsx +26 -0
  40. data/app/pb_kits/playbook/pb_progress_simple/docs/_progress_simple_variants.md +1 -0
  41. data/app/pb_kits/playbook/pb_progress_simple/docs/example.yml +2 -0
  42. data/app/pb_kits/playbook/pb_progress_simple/docs/index.js +2 -0
  43. data/app/pb_kits/playbook/pb_progress_simple/progress_simple.rb +8 -1
  44. data/app/pb_kits/playbook/pb_title/_title.scss +3 -4
  45. data/app/pb_kits/playbook/pb_title/title.rb +2 -2
  46. data/app/pb_kits/playbook/plugins/pb_chart.js +49 -4
  47. data/app/pb_kits/playbook/vendor.js +0 -4
  48. data/lib/playbook/version.rb +1 -1
  49. metadata +19 -49
  50. data/app/pb_kits/playbook/pb_date_picker/_date_picker.html.erb +0 -36
  51. data/app/pb_kits/playbook/pb_date_picker/_date_picker.jsx +0 -98
  52. data/app/pb_kits/playbook/pb_date_picker/_date_picker.scss +0 -59
  53. data/app/pb_kits/playbook/pb_date_picker/date_picker.rb +0 -38
  54. data/app/pb_kits/playbook/pb_date_picker/date_picker_helper.js +0 -91
  55. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default.html.erb +0 -1
  56. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default.jsx +0 -12
  57. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default_date.html.erb +0 -24
  58. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default_date.jsx +0 -30
  59. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_disabled.html.erb +0 -43
  60. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_disabled.jsx +0 -48
  61. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_error.html.erb +0 -4
  62. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_error.jsx +0 -13
  63. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_format.html.erb +0 -19
  64. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_format.jsx +0 -25
  65. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_label.html.erb +0 -4
  66. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_label.jsx +0 -13
  67. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_min_max.html.erb +0 -14
  68. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_min_max.jsx +0 -22
  69. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range.html.erb +0 -4
  70. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range.jsx +0 -13
  71. data/app/pb_kits/playbook/pb_date_picker/docs/example.yml +0 -23
  72. data/app/pb_kits/playbook/pb_date_picker/docs/index.js +0 -8
  73. data/app/pb_kits/playbook/pb_date_picker/index.js +0 -11
  74. data/app/pb_kits/playbook/pb_form/form_builder/date_picker_field.rb +0 -15
  75. data/app/pb_kits/playbook/pb_installer/_installer.html.erb +0 -16
  76. data/app/pb_kits/playbook/pb_installer/_installer.jsx +0 -54
  77. data/app/pb_kits/playbook/pb_installer/_installer.scss +0 -7
  78. data/app/pb_kits/playbook/pb_installer/docs/_installer_default.html.erb +0 -8
  79. data/app/pb_kits/playbook/pb_installer/docs/_installer_default.jsx +0 -16
  80. data/app/pb_kits/playbook/pb_installer/docs/example.yml +0 -9
  81. data/app/pb_kits/playbook/pb_installer/docs/index.js +0 -1
  82. data/app/pb_kits/playbook/pb_installer/installer.rb +0 -18
  83. data/app/pb_kits/playbook/pb_label_value/docs/index.html.erb +0 -25
  84. data/app/pb_kits/playbook/pb_logistic/_logistic.html.erb +0 -20
  85. data/app/pb_kits/playbook/pb_logistic/_logistic.jsx +0 -111
  86. data/app/pb_kits/playbook/pb_logistic/_logistic.scss +0 -7
  87. data/app/pb_kits/playbook/pb_logistic/docs/_logistic_dark.html.erb +0 -27
  88. data/app/pb_kits/playbook/pb_logistic/docs/_logistic_dark.jsx +0 -39
  89. data/app/pb_kits/playbook/pb_logistic/docs/_logistic_default.html.erb +0 -24
  90. data/app/pb_kits/playbook/pb_logistic/docs/_logistic_default.jsx +0 -35
  91. data/app/pb_kits/playbook/pb_logistic/docs/example.yml +0 -11
  92. data/app/pb_kits/playbook/pb_logistic/docs/index.js +0 -2
  93. data/app/pb_kits/playbook/pb_logistic/logistic.rb +0 -31
@@ -1,7 +0,0 @@
1
- [class^=pb_installer_kit] {
2
- .pb_installer_kit_links {
3
- span {
4
- color: $data_1;
5
- }
6
- }
7
- }
@@ -1,8 +0,0 @@
1
- <%= pb_rails("installer", props: {
2
- project_name: "JD Installations LLC"
3
- }) %>
4
- <br /><br />
5
- <%= pb_rails("installer", props: {
6
- link: "#",
7
- project_name: "JD Installations LLC"
8
- }) %>
@@ -1,16 +0,0 @@
1
- import React from 'react'
2
- import Installer from '../_installer.jsx'
3
-
4
- const InstallerDefault = () => (
5
- <div>
6
- <Installer projectName="JD Installations LLC" />
7
- <br />
8
- <br />
9
- <Installer
10
- link="#"
11
- projectName="JD Installations LLC"
12
- />
13
- </div>
14
- )
15
-
16
- export default InstallerDefault
@@ -1,9 +0,0 @@
1
- examples:
2
-
3
- rails:
4
- - installer_default: Default
5
-
6
-
7
- react:
8
- - installer_default: Default
9
-
@@ -1 +0,0 @@
1
- export { default as InstallerDefault } from './_installer_default.jsx'
@@ -1,18 +0,0 @@
1
- # frozen_string_literal: true
2
-
3
- module Playbook
4
- module PbInstaller
5
- class Installer
6
- include Playbook::Props
7
-
8
- partial "pb_installer/installer"
9
-
10
- prop :link
11
- prop :project_name
12
-
13
- def classname
14
- generate_classname("pb_installer_kit")
15
- end
16
- end
17
- end
18
- end
@@ -1,25 +0,0 @@
1
- <div class="container-fluid mt-5">
2
- <%= render partial: 'partials/filter-search' %>
3
- <%= pb_rails("table", props: { size: "md"} ) do %>
4
- <div class="mt-5">
5
- <thead>
6
- <tr>
7
- <th>Backlog Item</th>
8
- <th>Deployment</th>
9
- <th>Assignees</th>
10
- <th class="text-nowrap">Ready for Review</th>
11
- <th>Review Status</th>
12
- </tr>
13
- </thead>
14
- <tbody>
15
- <%= render partial: 'partials/item1' %>
16
- <%= render partial: 'partials/item2' %>
17
- <%= render partial: 'partials/item3' %>
18
-
19
- </tbody>
20
- </div>
21
- <% end %>
22
- </div>
23
-
24
-
25
- <%= render partial: 'partials/modal' %>
@@ -1,20 +0,0 @@
1
- <%= content_tag(:div,
2
- aria: object.aria,
3
- id: object.id,
4
- data: object.data,
5
- class: object.classname) do %>
6
- <%= pb_rails("body", props: {color: "light" }) do %>
7
- <%= pb_rails("caption", props: { text: "Project" }) %>
8
- <%= pb_rails("icon", props: { icon: "home", fixed_width: true }) %>
9
- <%= object.project_number%>
10
- <% if object.link %>
11
- <%= link_to object.link, class: "pb_logistic_kit_links" do %>
12
- <%= pb_rails("title", props: { text: object.project_name, tag: "span", size: 4, dark: object.dark }) %>
13
- <%= pb_rails("title", props: { text: object.date_element, tag: "span", size: 4, dark: object.dark }) if object.date.present? %>
14
- <% end %>
15
- <% else %>
16
- <%= pb_rails("title", props: { text: object.project_name, tag: "span", size: 4, dark: object.dark }) %>
17
- <%= pb_rails("title", props: { text: object.date_element, tag: "span", size: 4, dark: object.dark} ) if object.date.present? %>
18
- <% end %>
19
- <% end %>
20
- <% end %>
@@ -1,111 +0,0 @@
1
- /* @flow */
2
-
3
- import React from 'react'
4
- import classnames from 'classnames'
5
- import DateTime from '../pb_kit/dateTime.js'
6
- import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
7
- import { Body, Caption, Icon, Title } from '../'
8
- import { spacing } from '../utilities/spacing.js'
9
-
10
- const dateString = (value: DateTime) => {
11
- const month = value.toMonthNum()
12
- const day = value.toDay()
13
-
14
- return ` · ${month}/${day}`
15
- }
16
-
17
- type LogisticProps = {
18
- aria?: object,
19
- className?: String,
20
- dark?: Boolean,
21
- data?: object,
22
- date: String,
23
- id?: String,
24
- link?: String,
25
- projectName?: String,
26
- projectNumber?: Number,
27
- }
28
-
29
- const Logistic = (props: LogisticProps) => {
30
- const { aria = {},
31
- className,
32
- dark = false,
33
- data = {},
34
- date,
35
- id,
36
- link,
37
- projectName,
38
- projectNumber } = props
39
-
40
- const ariaProps = buildAriaProps(aria)
41
- const dataProps = buildDataProps(data)
42
- const formattedDate = new DateTime({ value: date })
43
- const classes = classnames(buildCss('pb_logistic_kit', { dark: dark }), className, spacing(props))
44
-
45
- return (
46
- <div
47
- {...ariaProps}
48
- {...dataProps}
49
- className={classes}
50
- id={id}
51
- >
52
- <Body color="light">
53
- <Caption text="Project" />
54
- <Icon
55
- fixedWidth
56
- icon="home"
57
- />
58
-
59
- {` ${projectNumber}`}
60
-
61
- <Choose>
62
- <When condition={link}>
63
- <a
64
- className="pb_logistic_kit_links"
65
- href={link}
66
- >
67
- <Choose>
68
- <When condition={date}>
69
- <Title
70
- size={4}
71
- tag="span"
72
- text={' ' + projectName + dateString(formattedDate)}
73
- />
74
- </When>
75
- <Otherwise>
76
- <Title
77
- size={4}
78
- tag="span"
79
- text={' ' + projectName}
80
- />
81
- </Otherwise>
82
- </Choose>
83
- </a>
84
- </When>
85
- <Otherwise>
86
- <Choose>
87
- <When condition={date}>
88
- <Title
89
- dark={dark}
90
- size={4}
91
- tag="span"
92
- text={' ' + projectName + dateString(formattedDate)}
93
- />
94
- </When>
95
- <Otherwise>
96
- <Title
97
- dark={dark}
98
- size={4}
99
- tag="span"
100
- text={' ' + projectName}
101
- />
102
- </Otherwise>
103
- </Choose>
104
- </Otherwise>
105
- </Choose>
106
- </Body>
107
- </div>
108
- )
109
- }
110
-
111
- export default Logistic
@@ -1,7 +0,0 @@
1
- [class^=pb_logistic_kit] {
2
- .pb_logistic_kit_links {
3
- span {
4
- color: $data_1;
5
- }
6
- }
7
- }
@@ -1,27 +0,0 @@
1
- <%= pb_rails("logistic", props: {
2
- project_name: "Jefferson-Smith",
3
- project_number: "33-12345",
4
- date: Date.new(2019, 11, 18),
5
- link: "#",
6
- dark: true
7
- }) %>
8
- <br/><br/>
9
- <%= pb_rails("logistic", props: {
10
- project_name: "Jefferson-Smith",
11
- project_number: "33-12345",
12
- date: Date.new(2019, 11, 18),
13
- dark: true
14
- }) %>
15
- <br/><br/>
16
- <%= pb_rails("logistic", props: {
17
- project_name: "Jefferson-Smith",
18
- project_number: "33-12345",
19
- link: "#",
20
- dark: true
21
- }) %>
22
- <br/><br/>
23
- <%= pb_rails("logistic", props: {
24
- project_name: "Jefferson-Smith",
25
- project_number: "33-12345",
26
- dark: true
27
- }) %>
@@ -1,39 +0,0 @@
1
- import React from 'react'
2
- import { Logistic } from '../../'
3
-
4
- const LogisticDark = () => (
5
- <div>
6
- <Logistic
7
- dark
8
- date={new Date('18 Nov 2019')}
9
- link="#"
10
- projectName="Jefferson-Smith"
11
- projectNumber="33-12345"
12
- />
13
- <br />
14
- <br />
15
- <Logistic
16
- dark
17
- date={new Date('18 Nov 2019')}
18
- projectName="Jefferson-Smith"
19
- projectNumber="33-12345"
20
- />
21
- <br />
22
- <br />
23
- <Logistic
24
- dark
25
- link="#"
26
- projectName="Jefferson-Smith"
27
- projectNumber="33-12345"
28
- />
29
- <br />
30
- <br />
31
- <Logistic
32
- dark
33
- projectName="Jefferson-Smith"
34
- projectNumber="33-12345"
35
- />
36
- </div>
37
- )
38
-
39
- export default LogisticDark
@@ -1,24 +0,0 @@
1
- <%= pb_rails("logistic", props: {
2
- project_name: "Jefferson-Smith",
3
- project_number: "33-12345",
4
- date: Date.new(2019, 11, 18),
5
- link: "#"
6
- }) %>
7
- <br/><br/>
8
- <%= pb_rails("logistic", props: {
9
- project_name: "Jefferson-Smith",
10
- project_number: "33-12345",
11
- date: Date.new(2019, 11, 18),
12
- }) %>
13
- <br/><br/>
14
- <%= pb_rails("logistic", props: {
15
- project_name: "Jefferson-Smith",
16
- project_number: "33-12345",
17
- link: "#"
18
- }) %>
19
- <br/><br/>
20
- <%= pb_rails("logistic", props: {
21
- project_name: "Jefferson-Smith",
22
- project_number: "33-12345",
23
- }) %>
24
-
@@ -1,35 +0,0 @@
1
- import React from 'react'
2
- import { Logistic } from '../../'
3
-
4
- const LogisticDefault = () => (
5
- <div>
6
- <Logistic
7
- date={new Date('18 Nov 2019')}
8
- link="#"
9
- projectName="Jefferson-Smith"
10
- projectNumber="33-12345"
11
- />
12
- <br />
13
- <br />
14
- <Logistic
15
- date={new Date('18 Nov 2019')}
16
- projectName="Jefferson-Smith"
17
- projectNumber="33-12345"
18
- />
19
- <br />
20
- <br />
21
- <Logistic
22
- link="#"
23
- projectName="Jefferson-Smith"
24
- projectNumber="33-12345"
25
- />
26
- <br />
27
- <br />
28
- <Logistic
29
- projectName="Jefferson-Smith"
30
- projectNumber="33-12345"
31
- />
32
- </div>
33
- )
34
-
35
- export default LogisticDefault
@@ -1,11 +0,0 @@
1
- examples:
2
-
3
- rails:
4
- - logistic_default: Default
5
- - logistic_dark: Dark
6
-
7
-
8
- react:
9
- - logistic_default: Default
10
- - logistic_dark: Dark
11
-
@@ -1,2 +0,0 @@
1
- export { default as LogisticDefault } from './_logistic_default.jsx'
2
- export { default as LogisticDark } from './_logistic_dark.jsx'
@@ -1,31 +0,0 @@
1
- # frozen_string_literal: true
2
-
3
- module Playbook
4
- module PbLogistic
5
- class Logistic
6
- include Playbook::Props
7
-
8
- partial "pb_logistic/logistic"
9
-
10
- prop :dark, type: Playbook::Props::Boolean, default: false
11
- prop :project_name
12
- prop :project_number
13
- prop :date
14
- prop :link
15
-
16
- def classname
17
- generate_classname("pb_logistic_kit", dark_class)
18
- end
19
-
20
- def date_element
21
- "&middot; #{date.strftime('%m/%d')}".html_safe
22
- end
23
-
24
- private
25
-
26
- def dark_class
27
- dark ? "dark" : nil
28
- end
29
- end
30
- end
31
- end