playbook_ui 14.3.2.pre.alpha.pbntr523enablekitsforradiofix3809 → 14.3.2.pre.alpha.play1472newicons3773

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.
Files changed (81) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/pb_advanced_table/Components/SortIconButton.tsx +23 -4
  3. data/app/pb_kits/playbook/pb_contact/_contact.tsx +17 -5
  4. data/app/pb_kits/playbook/pb_contact/contact.html.erb +14 -6
  5. data/app/pb_kits/playbook/pb_contact/contact.rb +4 -0
  6. data/app/pb_kits/playbook/pb_contact/contact.test.js +1 -1
  7. data/app/pb_kits/playbook/pb_date_picker/_date_picker.tsx +4 -3
  8. data/app/pb_kits/playbook/pb_date_picker/date_picker.html.erb +1 -1
  9. data/app/pb_kits/playbook/pb_date_picker/date_picker.rb +4 -0
  10. data/app/pb_kits/playbook/pb_date_picker/date_picker_helper.ts +6 -3
  11. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_inline.html.erb +1 -1
  12. data/app/pb_kits/playbook/pb_date_picker/sass_partials/_flatpickr_styles.scss +3 -2
  13. data/app/pb_kits/playbook/pb_date_picker/sass_partials/_header_styles.scss +6 -2
  14. data/app/pb_kits/playbook/pb_form_pill/_form_pill.scss +23 -245
  15. data/app/pb_kits/playbook/pb_form_pill/_form_pill.tsx +1 -1
  16. data/app/pb_kits/playbook/pb_form_pill/docs/example.yml +0 -2
  17. data/app/pb_kits/playbook/pb_form_pill/docs/index.js +0 -1
  18. data/app/pb_kits/playbook/pb_form_pill/form_pill.rb +1 -1
  19. data/app/pb_kits/playbook/pb_map/_map_controls.tsx +7 -1
  20. data/app/pb_kits/playbook/pb_multi_level_select/_multi_level_select.tsx +1 -5
  21. data/app/pb_kits/playbook/pb_multi_level_select/docs/example.yml +0 -2
  22. data/app/pb_kits/playbook/pb_multi_level_select/docs/index.js +0 -1
  23. data/app/pb_kits/playbook/pb_multi_level_select/multi_level_select.rb +0 -4
  24. data/app/pb_kits/playbook/pb_multiple_users_stacked/_multiple_users_stacked.scss +21 -97
  25. data/app/pb_kits/playbook/pb_multiple_users_stacked/_multiple_users_stacked.test.js +0 -166
  26. data/app/pb_kits/playbook/pb_multiple_users_stacked/_multiple_users_stacked.tsx +6 -45
  27. data/app/pb_kits/playbook/pb_multiple_users_stacked/docs/example.yml +0 -2
  28. data/app/pb_kits/playbook/pb_multiple_users_stacked/docs/index.js +0 -1
  29. data/app/pb_kits/playbook/pb_multiple_users_stacked/multiple_users_stacked.html.erb +2 -6
  30. data/app/pb_kits/playbook/pb_multiple_users_stacked/multiple_users_stacked.rb +1 -21
  31. data/app/pb_kits/playbook/pb_passphrase/_passphrase.tsx +10 -2
  32. data/app/pb_kits/playbook/pb_radio/_radio.tsx +33 -92
  33. data/app/pb_kits/playbook/pb_radio/docs/example.yml +0 -2
  34. data/app/pb_kits/playbook/pb_radio/docs/index.js +0 -1
  35. data/app/pb_kits/playbook/pb_radio/radio.html.erb +13 -35
  36. data/app/pb_kits/playbook/pb_radio/radio.rb +1 -3
  37. data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/ToolbarDropdown.tsx +12 -5
  38. data/app/pb_kits/playbook/pb_select/_select.tsx +5 -2
  39. data/app/pb_kits/playbook/pb_select/select.html.erb +1 -1
  40. data/app/pb_kits/playbook/pb_select/select.rb +4 -0
  41. data/app/pb_kits/playbook/pb_typeahead/_typeahead.test.jsx +0 -16
  42. data/app/pb_kits/playbook/pb_typeahead/_typeahead.tsx +0 -4
  43. data/app/pb_kits/playbook/pb_typeahead/components/MultiValue.tsx +18 -26
  44. data/app/pb_kits/playbook/pb_typeahead/docs/example.yml +0 -2
  45. data/app/pb_kits/playbook/pb_typeahead/docs/index.js +0 -1
  46. data/app/pb_kits/playbook/pb_typeahead/typeahead.rb +0 -4
  47. data/app/pb_kits/playbook/tokens/_colors.scss +0 -2
  48. data/app/pb_kits/playbook/utilities/icons/allicons.tsx +123 -0
  49. data/app/pb_kits/playbook/utilities/icons/angle-down.svg +3 -0
  50. data/app/pb_kits/playbook/utilities/icons/envelope.svg +3 -0
  51. data/dist/chunks/_typeahead-C7opsM-6.js +22 -0
  52. data/dist/chunks/_weekday_stacked-Bhq2bj8p.js +45 -0
  53. data/dist/chunks/lib-ACUFk6Hu.js +29 -0
  54. data/dist/chunks/{pb_form_validation-zV9OpdSt.js → pb_form_validation-CA0nEXlG.js} +1 -1
  55. data/dist/chunks/vendor.js +1 -1
  56. data/dist/playbook-doc.js +1 -1
  57. data/dist/playbook-rails-react-bindings.js +1 -1
  58. data/dist/playbook-rails.js +1 -1
  59. data/dist/playbook.css +1 -1
  60. data/lib/playbook/version.rb +1 -1
  61. metadata +8 -23
  62. data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_colors.html.erb +0 -117
  63. data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_colors.jsx +0 -227
  64. data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_colors.md +0 -1
  65. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_color.html.erb +0 -72
  66. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_color.jsx +0 -91
  67. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_color_rails.md +0 -1
  68. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_color_react.md +0 -1
  69. data/app/pb_kits/playbook/pb_multiple_users_stacked/docs/_multiple_users_stacked_bubble.html.erb +0 -73
  70. data/app/pb_kits/playbook/pb_multiple_users_stacked/docs/_multiple_users_stacked_bubble.jsx +0 -86
  71. data/app/pb_kits/playbook/pb_radio/docs/_radio_custom_children.html.erb +0 -48
  72. data/app/pb_kits/playbook/pb_radio/docs/_radio_custom_children.jsx +0 -59
  73. data/app/pb_kits/playbook/pb_radio/docs/_radio_custom_children.md +0 -1
  74. data/app/pb_kits/playbook/pb_radio/index.js +0 -17
  75. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_color.html.erb +0 -31
  76. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_color.jsx +0 -26
  77. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_color_rails.md +0 -1
  78. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_color_react.md +0 -1
  79. data/dist/chunks/_typeahead-468tQVei.js +0 -22
  80. data/dist/chunks/_weekday_stacked-CODev76A.js +0 -45
  81. data/dist/chunks/lib-D2U4I1U6.js +0 -16
@@ -2,5 +2,5 @@
2
2
 
3
3
  module Playbook
4
4
  PREVIOUS_VERSION = "14.3.2"
5
- VERSION = "14.3.2.pre.alpha.pbntr523enablekitsforradiofix3809"
5
+ VERSION = "14.3.2.pre.alpha.play1472newicons3773"
6
6
  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: 14.3.2.pre.alpha.pbntr523enablekitsforradiofix3809
4
+ version: 14.3.2.pre.alpha.play1472newicons3773
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: 2024-09-18 00:00:00.000000000 Z
12
+ date: 2024-09-13 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: actionpack
@@ -1337,9 +1337,6 @@ files:
1337
1337
  - app/pb_kits/playbook/pb_form_pill/_form_pill.scss
1338
1338
  - app/pb_kits/playbook/pb_form_pill/_form_pill.test.jsx
1339
1339
  - app/pb_kits/playbook/pb_form_pill/_form_pill.tsx
1340
- - app/pb_kits/playbook/pb_form_pill/docs/_form_pill_colors.html.erb
1341
- - app/pb_kits/playbook/pb_form_pill/docs/_form_pill_colors.jsx
1342
- - app/pb_kits/playbook/pb_form_pill/docs/_form_pill_colors.md
1343
1340
  - app/pb_kits/playbook/pb_form_pill/docs/_form_pill_example.html.erb
1344
1341
  - app/pb_kits/playbook/pb_form_pill/docs/_form_pill_example.jsx
1345
1342
  - app/pb_kits/playbook/pb_form_pill/docs/_form_pill_example.md
@@ -1778,10 +1775,6 @@ files:
1778
1775
  - app/pb_kits/playbook/pb_multi_level_select/_helper_functions.tsx
1779
1776
  - app/pb_kits/playbook/pb_multi_level_select/_multi_level_select.scss
1780
1777
  - app/pb_kits/playbook/pb_multi_level_select/_multi_level_select.tsx
1781
- - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_color.html.erb
1782
- - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_color.jsx
1783
- - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_color_rails.md
1784
- - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_color_react.md
1785
1778
  - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_default.html.erb
1786
1779
  - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_default.jsx
1787
1780
  - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_default.md
@@ -1827,8 +1820,6 @@ files:
1827
1820
  - app/pb_kits/playbook/pb_multiple_users_stacked/_multiple_users_stacked.test.js
1828
1821
  - app/pb_kits/playbook/pb_multiple_users_stacked/_multiple_users_stacked.tsx
1829
1822
  - app/pb_kits/playbook/pb_multiple_users_stacked/docs/_description.md
1830
- - app/pb_kits/playbook/pb_multiple_users_stacked/docs/_multiple_users_stacked_bubble.html.erb
1831
- - app/pb_kits/playbook/pb_multiple_users_stacked/docs/_multiple_users_stacked_bubble.jsx
1832
1823
  - app/pb_kits/playbook/pb_multiple_users_stacked/docs/_multiple_users_stacked_default.html.erb
1833
1824
  - app/pb_kits/playbook/pb_multiple_users_stacked/docs/_multiple_users_stacked_default.jsx
1834
1825
  - app/pb_kits/playbook/pb_multiple_users_stacked/docs/_multiple_users_stacked_default_swift.md
@@ -2158,9 +2149,6 @@ files:
2158
2149
  - app/pb_kits/playbook/pb_radio/docs/_radio_alignment_swift.md
2159
2150
  - app/pb_kits/playbook/pb_radio/docs/_radio_custom.html.erb
2160
2151
  - app/pb_kits/playbook/pb_radio/docs/_radio_custom.jsx
2161
- - app/pb_kits/playbook/pb_radio/docs/_radio_custom_children.html.erb
2162
- - app/pb_kits/playbook/pb_radio/docs/_radio_custom_children.jsx
2163
- - app/pb_kits/playbook/pb_radio/docs/_radio_custom_children.md
2164
2152
  - app/pb_kits/playbook/pb_radio/docs/_radio_custom_swift.md
2165
2153
  - app/pb_kits/playbook/pb_radio/docs/_radio_default.html.erb
2166
2154
  - app/pb_kits/playbook/pb_radio/docs/_radio_default.jsx
@@ -2179,7 +2167,6 @@ files:
2179
2167
  - app/pb_kits/playbook/pb_radio/docs/_radio_subtitle_swift.md
2180
2168
  - app/pb_kits/playbook/pb_radio/docs/example.yml
2181
2169
  - app/pb_kits/playbook/pb_radio/docs/index.js
2182
- - app/pb_kits/playbook/pb_radio/index.js
2183
2170
  - app/pb_kits/playbook/pb_radio/radio.html.erb
2184
2171
  - app/pb_kits/playbook/pb_radio/radio.rb
2185
2172
  - app/pb_kits/playbook/pb_radio/radio.test.js
@@ -2881,10 +2868,6 @@ files:
2881
2868
  - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async_users.html.erb
2882
2869
  - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async_users.jsx
2883
2870
  - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_async_users.md
2884
- - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_color.html.erb
2885
- - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_color.jsx
2886
- - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_color_rails.md
2887
- - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_with_pills_color_react.md
2888
2871
  - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_without_pills.html.erb
2889
2872
  - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_without_pills.md
2890
2873
  - app/pb_kits/playbook/pb_typeahead/docs/example.yml
@@ -3030,7 +3013,9 @@ files:
3030
3013
  - app/pb_kits/playbook/utilities/globalPropNames.mjs
3031
3014
  - app/pb_kits/playbook/utilities/globalProps.ts
3032
3015
  - app/pb_kits/playbook/utilities/icons/allicons.tsx
3016
+ - app/pb_kits/playbook/utilities/icons/angle-down.svg
3033
3017
  - app/pb_kits/playbook/utilities/icons/clock.svg
3018
+ - app/pb_kits/playbook/utilities/icons/envelope.svg
3034
3019
  - app/pb_kits/playbook/utilities/icons/spinner.svg
3035
3020
  - app/pb_kits/playbook/utilities/icons/times.svg
3036
3021
  - app/pb_kits/playbook/utilities/object.ts
@@ -3051,11 +3036,11 @@ files:
3051
3036
  - app/pb_kits/playbook/utilities/test/globalProps/truncate.test.js
3052
3037
  - app/pb_kits/playbook/utilities/text.ts
3053
3038
  - app/pb_kits/playbook/utilities/validEmojiChecker.ts
3054
- - dist/chunks/_typeahead-468tQVei.js
3055
- - dist/chunks/_weekday_stacked-CODev76A.js
3039
+ - dist/chunks/_typeahead-C7opsM-6.js
3040
+ - dist/chunks/_weekday_stacked-Bhq2bj8p.js
3056
3041
  - dist/chunks/lazysizes-B7xYodB-.js
3057
- - dist/chunks/lib-D2U4I1U6.js
3058
- - dist/chunks/pb_form_validation-zV9OpdSt.js
3042
+ - dist/chunks/lib-ACUFk6Hu.js
3043
+ - dist/chunks/pb_form_validation-CA0nEXlG.js
3059
3044
  - dist/chunks/vendor.js
3060
3045
  - dist/menu.yml
3061
3046
  - dist/playbook-doc.js
@@ -1,117 +0,0 @@
1
- <%= pb_rails("title", props: { text: "Status Colors", tag: "h4", size: 4, margin_bottom: "sm" }) %>
2
-
3
- <%= pb_rails("form_pill", props: {
4
- text: "Primary",
5
- tabindex: 0,
6
- }) %>
7
- <%= pb_rails("form_pill", props: {
8
- color: "neutral",
9
- text: "Neutral",
10
- tabindex: 0,
11
- }) %>
12
- <%= pb_rails("form_pill", props: {
13
- color: "success",
14
- text: "Success",
15
- tabindex: 0,
16
- }) %>
17
- <%= pb_rails("form_pill", props: {
18
- color: "warning",
19
- text: "Warning",
20
- tabindex: 0,
21
- }) %>
22
- <%= pb_rails("form_pill", props: {
23
- color: "error",
24
- text: "Error",
25
- tabindex: 0,
26
- }) %>
27
- <%= pb_rails("form_pill", props: {
28
- color: "info",
29
- text: "Info",
30
- tabindex: 0,
31
- }) %>
32
-
33
- <%= pb_rails("title", props: { text: "Data Colors", tag: "h4", size: 4, margin_bottom: "sm", margin_top: "md" }) %>
34
-
35
- <%= pb_rails("form_pill", props: {
36
- color: "data_1",
37
- text: "Data 1",
38
- tabindex: 0,
39
- }) %>
40
- <%= pb_rails("form_pill", props: {
41
- color: "data_2",
42
- text: "Data 2",
43
- tabindex: 0,
44
- }) %>
45
- <%= pb_rails("form_pill", props: {
46
- color: "data_3",
47
- text: "Data 3",
48
- tabindex: 0,
49
- }) %>
50
- <%= pb_rails("form_pill", props: {
51
- color: "data_4",
52
- text: "Data 4",
53
- tabindex: 0,
54
- }) %>
55
- <%= pb_rails("form_pill", props: {
56
- color: "data_5",
57
- text: "Data 5",
58
- tabindex: 0,
59
- }) %>
60
- <%= pb_rails("form_pill", props: {
61
- color: "data_6",
62
- text: "Data 6",
63
- tabindex: 0,
64
- }) %>
65
- <%= pb_rails("form_pill", props: {
66
- color: "data_7",
67
- text: "Data 7",
68
- tabindex: 0,
69
- }) %>
70
- <%= pb_rails("form_pill", props: {
71
- color: "data_8",
72
- text: "Data 8",
73
- tabindex: 0,
74
- }) %>
75
-
76
- <%= pb_rails("title", props: { text: "Product Colors", tag: "h4", size: 4, margin_bottom: "sm", margin_top: "md" }) %>
77
-
78
- <%= pb_rails("form_pill", props: {
79
- color: "windows",
80
- text: "Windows",
81
- tabindex: 0,
82
- }) %>
83
- <%= pb_rails("form_pill", props: {
84
- color: "siding",
85
- text: "Siding",
86
- tabindex: 0,
87
- }) %>
88
- <%= pb_rails("form_pill", props: {
89
- color: "roofing",
90
- text: "Roofing",
91
- tabindex: 0,
92
- }) %>
93
- <%= pb_rails("form_pill", props: {
94
- color: "doors",
95
- text: "Doors",
96
- tabindex: 0,
97
- }) %>
98
- <%= pb_rails("form_pill", props: {
99
- color: "gutters",
100
- text: "Gutters",
101
- tabindex: 0,
102
- }) %>
103
- <%= pb_rails("form_pill", props: {
104
- color: "solar",
105
- text: "Solar",
106
- tabindex: 0,
107
- }) %>
108
- <%= pb_rails("form_pill", props: {
109
- color: "insulation",
110
- text: "Insulation",
111
- tabindex: 0,
112
- }) %>
113
- <%= pb_rails("form_pill", props: {
114
- color: "accessories",
115
- text: "Accessories",
116
- tabindex: 0,
117
- }) %>
@@ -1,227 +0,0 @@
1
- import React from 'react'
2
- import { FormPill, Title } from 'playbook-ui'
3
-
4
- const FormPillColors = (props) => {
5
- return (
6
- <div>
7
- <Title
8
- marginBottom="sm"
9
- size={4}
10
- text="Status Colors"
11
- {...props}
12
- />
13
- <FormPill
14
- onClick={() => {
15
- alert('Click!')
16
- }}
17
- tabIndex={0}
18
- text="Primary"
19
- {...props}
20
- />
21
- <FormPill
22
- color="neutral"
23
- onClick={() => {
24
- alert('Click!')
25
- }}
26
- tabIndex={0}
27
- text="Neutral"
28
- {...props}
29
- />
30
- <FormPill
31
- color="success"
32
- onClick={() => {
33
- alert('Click!')
34
- }}
35
- tabIndex={0}
36
- text="Success"
37
- {...props}
38
- />
39
- <FormPill
40
- color="warning"
41
- onClick={() => {
42
- alert('Click!')
43
- }}
44
- tabIndex={0}
45
- text="Warning"
46
- {...props}
47
- />
48
- <FormPill
49
- color="error"
50
- onClick={() => {
51
- alert('Click!')
52
- }}
53
- tabIndex={0}
54
- text="Error"
55
- {...props}
56
- />
57
- <FormPill
58
- color="info"
59
- onClick={() => {
60
- alert('Click!')
61
- }}
62
- tabIndex={0}
63
- text="Info"
64
- {...props}
65
- />
66
- <Title
67
- marginBottom="sm"
68
- marginTop="md"
69
- size={4}
70
- text="Data Colors"
71
- {...props}
72
- />
73
- <FormPill
74
- color="data_1"
75
- onClick={() => {
76
- alert('Click!')
77
- }}
78
- tabIndex={0}
79
- text="Data 1"
80
- {...props}
81
- />
82
- <FormPill
83
- color="data_2"
84
- onClick={() => {
85
- alert('Click!')
86
- }}
87
- tabIndex={0}
88
- text="Data 2"
89
- {...props}
90
- />
91
- <FormPill
92
- color="data_3"
93
- onClick={() => {
94
- alert('Click!')
95
- }}
96
- tabIndex={0}
97
- text="Data 3"
98
- {...props}
99
- />
100
- <FormPill
101
- color="data_4"
102
- onClick={() => {
103
- alert('Click!')
104
- }}
105
- tabIndex={0}
106
- text="Data 4"
107
- {...props}
108
- />
109
- <FormPill
110
- color="data_5"
111
- onClick={() => {
112
- alert('Click!')
113
- }}
114
- tabIndex={0}
115
- text="Data 5"
116
- {...props}
117
- />
118
- <FormPill
119
- color="data_6"
120
- onClick={() => {
121
- alert('Click!')
122
- }}
123
- tabIndex={0}
124
- text="Data 6"
125
- {...props}
126
- />
127
- <FormPill
128
- color="data_7"
129
- onClick={() => {
130
- alert('Click!')
131
- }}
132
- tabIndex={0}
133
- text="Data 7"
134
- {...props}
135
- />
136
- <FormPill
137
- color="data_8"
138
- onClick={() => {
139
- alert('Click!')
140
- }}
141
- tabIndex={0}
142
- text="Data 8"
143
- {...props}
144
- />
145
- <Title
146
- marginBottom="sm"
147
- marginTop="md"
148
- size={4}
149
- text="Product Colors"
150
- {...props}
151
- />
152
- <FormPill
153
- color="windows"
154
- onClick={() => {
155
- alert('Click!')
156
- }}
157
- tabIndex={0}
158
- text="Windows"
159
- {...props}
160
- />
161
- <FormPill
162
- color="siding"
163
- onClick={() => {
164
- alert('Click!')
165
- }}
166
- tabIndex={0}
167
- text="Siding"
168
- {...props}
169
- />
170
- <FormPill
171
- color="roofing"
172
- onClick={() => {
173
- alert('Click!')
174
- }}
175
- tabIndex={0}
176
- text="Roofing"
177
- {...props}
178
- />
179
- <FormPill
180
- color="doors"
181
- onClick={() => {
182
- alert('Click!')
183
- }}
184
- tabIndex={0}
185
- text="Doors"
186
- {...props}
187
- />
188
- <FormPill
189
- color="gutters"
190
- onClick={() => {
191
- alert('Click!')
192
- }}
193
- tabIndex={0}
194
- text="Gutters"
195
- {...props}
196
- />
197
- <FormPill
198
- color="solar"
199
- onClick={() => {
200
- alert('Click!')
201
- }}
202
- tabIndex={0}
203
- text="Solar"
204
- {...props}
205
- />
206
- <FormPill
207
- color="insulation"
208
- onClick={() => {
209
- alert('Click!')
210
- }}
211
- tabIndex={0}
212
- text="Insulation"
213
- {...props}
214
- />
215
- <FormPill
216
- color="accessories"
217
- onClick={() => {
218
- alert('Click!')
219
- }}
220
- tabIndex={0}
221
- text="Accessories"
222
- {...props}
223
- />
224
- </div>
225
- )
226
- }
227
- export default FormPillColors
@@ -1 +0,0 @@
1
- The Status, Data, and Product colors highlighted above can be passed to the `color` prop. Primary is the default color. Form pills with a text tag, an avatar, or an icon with text tag can all receive the `color` prop.
@@ -1,72 +0,0 @@
1
- <% treeData = [{
2
- label: "Power Home Remodeling",
3
- value: "Power Home Remodeling",
4
- id: "100",
5
- expanded: true,
6
- children: [
7
- {
8
- label: "People",
9
- value: "People",
10
- id: "101",
11
- expanded: true,
12
- children: [
13
- {
14
- label: "Talent Acquisition",
15
- value: "Talent Acquisition",
16
- id: "102",
17
- },
18
- {
19
- label: "Business Affairs",
20
- value: "Business Affairs",
21
- id: "103",
22
- children: [
23
- {
24
- label: "Initiatives",
25
- value: "Initiatives",
26
- id: "104",
27
- },
28
- {
29
- label: "Learning & Development",
30
- value: "Learning & Development",
31
- id: "105",
32
- },
33
- ],
34
- },
35
- {
36
- label: "People Experience",
37
- value: "People Experience",
38
- id: "106",
39
- },
40
- ],
41
- },
42
- {
43
- label: "Contact Center",
44
- value: "Contact Center",
45
- id: "107",
46
- children: [
47
- {
48
- label: "Appointment Management",
49
- value: "Appointment Management",
50
- id: "108",
51
- },
52
- {
53
- label: "Customer Service",
54
- value: "Customer Service",
55
- id: "109",
56
- },
57
- {
58
- label: "Energy",
59
- value: "Energy",
60
- id: "110",
61
- },
62
- ],
63
- },
64
- ],
65
- }] %>
66
-
67
- <%= pb_rails("multi_level_select", props: {
68
- id: "multi-level-select-default-rails",
69
- name: "my_array",
70
- tree_data: treeData,
71
- pill_color: "neutral"
72
- }) %>
@@ -1,91 +0,0 @@
1
- import React from "react";
2
- import MultiLevelSelect from "../_multi_level_select";
3
-
4
- const treeData = [
5
- {
6
- label: "Power Home Remodeling",
7
- value: "Power Home Remodeling",
8
- id: "powerhome1",
9
- expanded: true,
10
- children: [
11
- {
12
- label: "People",
13
- value: "People",
14
- id: "people1",
15
- expanded: true,
16
- children: [
17
- {
18
- label: "Talent Acquisition",
19
- value: "Talent Acquisition",
20
- id: "talent1",
21
- },
22
- {
23
- label: "Business Affairs",
24
- value: "Business Affairs",
25
- id: "business1",
26
- children: [
27
- {
28
- label: "Initiatives",
29
- value: "Initiatives",
30
- id: "initiative1",
31
- },
32
- {
33
- label: "Learning & Development",
34
- value: "Learning & Development",
35
- id: "development1",
36
- },
37
- ],
38
- },
39
- {
40
- label: "People Experience",
41
- value: "People Experience",
42
- id: "experience1",
43
- },
44
- ],
45
- },
46
- {
47
- label: "Contact Center",
48
- value: "Contact Center",
49
- id: "contact1",
50
- children: [
51
- {
52
- label: "Appointment Management",
53
- value: "Appointment Management",
54
- id: "appointment1",
55
- },
56
- {
57
- label: "Customer Service",
58
- value: "Customer Service",
59
- id: "customer1",
60
- },
61
- {
62
- label: "Energy",
63
- value: "Energy",
64
- id: "energy1",
65
- },
66
- ],
67
- },
68
- ],
69
- },
70
- ];
71
-
72
- const MultiLevelSelectColor = (props) => {
73
- return (
74
- <div>
75
- <MultiLevelSelect
76
- id='multiselect-color'
77
- onSelect={(selectedNodes) =>
78
- console.log(
79
- "Selected Items",
80
- selectedNodes
81
- )
82
- }
83
- pillColor="neutral"
84
- treeData={treeData}
85
- {...props}
86
- />
87
- </div>
88
- )
89
- };
90
-
91
- export default MultiLevelSelectColor;
@@ -1 +0,0 @@
1
- Change the form pill color by passing the optional `pill_color` prop. Product, Data, and Status colors are available options. Check them out <a href="https://playbook.powerapp.cloud/kits/form_pill#form-pill-colors" target="_blank">here</a> in the Form Pill colors example.
@@ -1 +0,0 @@
1
- Change the form pill color by passing the optional `pillColor` prop. Product, Data, and Status colors are available options. Check them out <a href="https://playbook.powerapp.cloud/kits/form_pill/react#form-pill-colors" target="_blank">here</a> in the Form Pill colors example.
@@ -1,73 +0,0 @@
1
- <%= pb_rails("multiple_users_stacked", props: {
2
- variant: "bubble",
3
- users: [
4
- {
5
- name: "Patrick Welch",
6
- image_url: "https://randomuser.me/api/portraits/men/9.jpg",
7
- }
8
- ]
9
- }) %>
10
-
11
- <br/><br/>
12
-
13
- <%= pb_rails("multiple_users_stacked", props: {
14
- variant: "bubble",
15
- users: [
16
- {
17
- name: "Patrick Welch",
18
- image_url: "https://randomuser.me/api/portraits/men/9.jpg",
19
- },
20
- {
21
- name: "Lucille Sanchez",
22
- image_url: "https://randomuser.me/api/portraits/women/6.jpg",
23
- }
24
- ]
25
- }) %>
26
-
27
- <br/><br/>
28
-
29
- <%= pb_rails("multiple_users_stacked", props: {
30
- variant: "bubble",
31
- users: [
32
- {
33
- name: "Patrick Welch",
34
- image_url: "https://randomuser.me/api/portraits/men/9.jpg",
35
- },
36
- {
37
- name: "Lucille Sanchez",
38
- image_url: "https://randomuser.me/api/portraits/women/6.jpg",
39
- },
40
- {
41
- name: "Beverly Reyes",
42
- image_url: "https://randomuser.me/api/portraits/women/74.jpg",
43
- },
44
- ]
45
- }) %>
46
-
47
- <br/><br/>
48
-
49
- <%= pb_rails("multiple_users_stacked", props: {
50
- variant: "bubble",
51
- users: [
52
- {
53
- name: "Patrick Welch",
54
- image_url: "https://randomuser.me/api/portraits/men/9.jpg",
55
- },
56
- {
57
- name: "Lucille Sanchez",
58
- image_url: "https://randomuser.me/api/portraits/women/6.jpg",
59
- },
60
- {
61
- name: "Beverly Reyes",
62
- image_url: "https://randomuser.me/api/portraits/women/74.jpg",
63
- },
64
- {
65
- name: "Keith Craig",
66
- image_url: "https://randomuser.me/api/portraits/men/40.jpg",
67
- },
68
- {
69
- name: "Alicia Cooper",
70
- image_url: "https://randomuser.me/api/portraits/women/46.jpg",
71
- }
72
- ]
73
- }) %>