playbook_ui_docs 13.8.0.pre.alpha.play845allkitsbytypes1258 → 13.9.0.pre.alpha.PLAY962SingleSelect1261

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: ddf86926af8cd1c684471ea7f309297f8b6a50dd4c62dc8a259130e338f8929f
4
- data.tar.gz: ffa2221b03f5d64afb802fef29dc50887d1c626e8a32ab415ee1afe0c66adf03
3
+ metadata.gz: 918760bc33e0a9428f893a965e764638fec02decc484e233dd9f9978966f99d5
4
+ data.tar.gz: 3b79962ba6509e2748b09f0b1d368efd3381608754d3a1be124f6ed1db8654e8
5
5
  SHA512:
6
- metadata.gz: 1f67f812a570779945937a10c9334febeee4ac267cb5289025ed9bad78d84620b7cb090866ef7fb96f02f600b18d96ac2aecafff6bb1a388c38a04c6437926bb
7
- data.tar.gz: e56e17062d3ec23d7d398295c36a0b6848c163c758c40bcd10cd2c565ec732fc0b1e0da1006c09166c213a3ee5a40254fa604e7b888800f134325a70d8eee3a5
6
+ metadata.gz: 48114a59782850e5a77540256a7b1068ca8e7c5d3ad55b1769e383fd72b89bcd06d5bbcc778e7c5fc6d056adf2bc39db79c27288a9279f74974a20f09bcf8b4d
7
+ data.tar.gz: 014b8f88a13112f445f66d9b89742afef15a0dcca6bbf1d5e9f7968f7d2239b3f0a6fe50b9ad3f1b61db302fd9254a7c741535911b2c8d1457fe5ba5bdd8216c
@@ -1,5 +1,5 @@
1
1
  <%= pb_rails("button", props: { count: 153, highlight: false, icon: "&#127881;", classname: "count", id: "reaction-button-highlight", variant: "reaction" }) %>
2
- <%= pb_rails("button", props: { count: 5, icon: "😍", variant: "reaction", margin_left: "lg" }) %>
2
+ <%= pb_rails("button", props: { count: 5, icon: "1️⃣", variant: "reaction", margin_left: "lg" }) %>
3
3
  <%= pb_rails("button", props: { variant: "reaction", margin_left: "lg" }) %>
4
4
  <%= pb_rails("button", props: { icon: "user", variant: "reaction", margin_left: "lg" }) %>
5
5
 
@@ -19,7 +19,7 @@ return (
19
19
  />
20
20
  <Button
21
21
  count={5}
22
- icon="😍"
22
+ icon="1️⃣"
23
23
  marginLeft='lg'
24
24
  tabIndex={0}
25
25
  variant="reaction"
@@ -8,6 +8,7 @@
8
8
  label: "People",
9
9
  value: "People",
10
10
  id: "101",
11
+ expanded: true,
11
12
  children: [
12
13
  {
13
14
  label: "Talent Acquisition",
@@ -63,10 +64,8 @@
63
64
  ],
64
65
  }] %>
65
66
 
66
-
67
-
68
- <%= pb_rails("multi_level_select", props: {
69
- id: "multi-level-select-default-rails",
70
- name: "my_array",
71
- tree_data: treeData
72
- }) %>
67
+ <%= pb_rails("multi_level_select", props: {
68
+ id: "multi-level-select-default-rails",
69
+ name: "my_array",
70
+ tree_data: treeData
71
+ }) %>
@@ -77,7 +77,7 @@ const MultiLevelSelectSelectedIds = (props) => {
77
77
  console.log("Selected Items with Return All Selected Data", selectedNodes)
78
78
  }
79
79
  returnAllSelected
80
- selectedIds={["energy1","talent1"]}
80
+ selectedIds={["energy1", "talent1"]}
81
81
  treeData={treeData}
82
82
  {...props}
83
83
  />
@@ -0,0 +1,73 @@
1
+ <% treeData = [{
2
+ label: "Power Home Remodeling",
3
+ value: "Power Home Remodeling",
4
+ id: "200",
5
+ expanded: true,
6
+ children: [
7
+ {
8
+ label: "People",
9
+ value: "People",
10
+ id: "201",
11
+ expanded: true,
12
+ children: [
13
+ {
14
+ label: "Talent Acquisition",
15
+ value: "Talent Acquisition",
16
+ id: "202",
17
+ },
18
+ {
19
+ label: "Business Affairs",
20
+ value: "Business Affairs",
21
+ id: "203",
22
+ children: [
23
+ {
24
+ label: "Initiatives",
25
+ value: "Initiatives",
26
+ id: "204",
27
+ },
28
+ {
29
+ label: "Learning & Development",
30
+ value: "Learning & Development",
31
+ id: "205",
32
+ },
33
+ ],
34
+ },
35
+ {
36
+ label: "People Experience",
37
+ value: "People Experience",
38
+ id: "206",
39
+ },
40
+ ],
41
+ },
42
+ {
43
+ label: "Contact Center",
44
+ value: "Contact Center",
45
+ id: "207",
46
+ children: [
47
+ {
48
+ label: "Appointment Management",
49
+ value: "Appointment Management",
50
+ id: "208",
51
+ },
52
+ {
53
+ label: "Customer Service",
54
+ value: "Customer Service",
55
+ id: "209",
56
+ },
57
+ {
58
+ label: "Energy",
59
+ value: "Energy",
60
+ id: "210",
61
+ },
62
+ ],
63
+ },
64
+ ],
65
+ }] %>
66
+
67
+ <%= pb_rails("multi_level_select", props: {
68
+ id: "multi-level-select-single-rails",
69
+ name: "my_single_select_array",
70
+ tree_data: treeData,
71
+ input_name: "Power",
72
+ variant: "single"
73
+ }) %>
@@ -0,0 +1,87 @@
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: "powerhome2",
9
+ expanded: true,
10
+ children: [
11
+ {
12
+ label: "People",
13
+ value: "People",
14
+ id: "people2",
15
+ expanded: true,
16
+ children: [
17
+ {
18
+ label: "Talent Acquisition",
19
+ value: "Talent Acquisition",
20
+ id: "talent2",
21
+ },
22
+ {
23
+ label: "Business Affairs",
24
+ value: "Business Affairs",
25
+ id: "business2",
26
+ children: [
27
+ {
28
+ label: "Initiatives",
29
+ value: "Initiatives",
30
+ id: "initiative2",
31
+ },
32
+ {
33
+ label: "Learning & Development",
34
+ value: "Learning & Development",
35
+ id: "development2",
36
+ },
37
+ ],
38
+ },
39
+ {
40
+ label: "People Experience",
41
+ value: "People Experience",
42
+ id: "experience2",
43
+ },
44
+ ],
45
+ },
46
+ {
47
+ label: "Contact Center",
48
+ value: "Contact Center",
49
+ id: "contact2",
50
+ children: [
51
+ {
52
+ label: "Appointment Management",
53
+ value: "Appointment Management",
54
+ id: "appointment2",
55
+ },
56
+ {
57
+ label: "Customer Service",
58
+ value: "Customer Service",
59
+ id: "customer2",
60
+ },
61
+ {
62
+ label: "Energy",
63
+ value: "Energy",
64
+ id: "energy2",
65
+ },
66
+ ],
67
+ },
68
+ ],
69
+ },
70
+ ];
71
+
72
+ const MultiLevelSelectSingle = (props) => {
73
+ return (
74
+ <div>
75
+ <MultiLevelSelect
76
+ id="multiselect-single"
77
+ inputName="Power"
78
+ onSelect={(selectedNode) => console.log("Selected Node", selectedNode)}
79
+ treeData={treeData}
80
+ variant="single"
81
+ {...props}
82
+ />
83
+ </div>
84
+ )
85
+ };
86
+
87
+ export default MultiLevelSelectSingle;
@@ -1,12 +1,13 @@
1
1
  examples:
2
2
  rails:
3
3
  - multi_level_select_default: Default
4
+ - multi_level_select_single: Single Select
4
5
  - multi_level_select_return_all_selected: Return All Selected
5
6
  - multi_level_select_selected_ids: Selected Ids
6
7
  - multi_level_select_with_form: With Form
7
-
8
+
8
9
  react:
9
10
  - multi_level_select_default: Default
11
+ - multi_level_select_single: Single Select
10
12
  - multi_level_select_return_all_selected: Return All Selected
11
13
  - multi_level_select_selected_ids: Selected Ids
12
-
@@ -1,3 +1,4 @@
1
1
  export { default as MultiLevelSelectDefault } from './_multi_level_select_default.jsx'
2
+ export { default as MultiLevelSelectSingle } from './_multi_level_select_single.jsx'
2
3
  export { default as MultiLevelSelectReturnAllSelected } from './_multi_level_select_return_all_selected.jsx'
3
- export { default as MultiLevelSelectSelectedIds } from "./_multi_level_select_selected_ids.jsx"
4
+ export { default as MultiLevelSelectSelectedIds } from "./_multi_level_select_selected_ids.jsx"
data/dist/menu.yml CHANGED
@@ -1,282 +1,111 @@
1
- web: &web ["rails", "react"]
2
- all: &all ["rails", "react", "swift"]
3
- rails_only: &rails_only ["rails"]
4
- react_only: &react_only ["react"]
5
-
6
1
  kits:
7
- - name: "avatars"
8
- components:
9
- - name: "avatar"
10
- platforms: *all
11
- - name: "avatar_action_button"
12
- platforms: *web
13
- - name: "multiple_users"
14
- platforms: *web
15
- - name: "multiple_users_stacked"
16
- platforms: *web
17
- - name: "user"
18
- platforms: *web
19
- - name: "background"
20
- components:
21
- - name: "background"
22
- platforms: *web
23
- - name: "bread_crumbs"
24
- components:
25
- - name: "bread_crumbs"
26
- platforms: *web
27
- - name: "buttons"
28
- components:
29
- - name: "button"
30
- platforms: *web
31
- - name: "button_toolbar"
32
- platforms: *web
33
- - name: "circle_icon_button"
34
- platforms: *web
35
- - name: "card"
36
- components:
37
- - name: "card"
38
- platforms: *all
39
- - name: "collapsible"
40
- components:
41
- - name: "collapsible"
42
- platforms: *web
43
- - name: "charts_and_graphs"
44
- components:
45
- - name: "bar_graph"
46
- platforms: *web
47
- - name: "circle_chart"
48
- platforms: *web
49
- - name: "distribution_bar"
50
- platforms: *web
51
- - name: "gauge"
52
- platforms: *web
53
- - name: "legend"
54
- platforms: *web
55
- - name: "line_graph"
56
- platforms: *web
57
- - name: "treemap_chart"
58
- platforms: *web
59
- - name: "dialog"
60
- components:
61
- - name: "dialog"
62
- platforms: *web
63
- - name: "filter"
64
- components:
65
- - name: "filter"
66
- platforms: *web
67
- - name: "fixed_confirmation_toast"
68
- components:
69
- - name: "fixed_confirmation_toast"
70
- platforms: *web
71
- - name: "forms"
72
- components:
73
- - name: "checkbox"
74
- platforms: *web
75
- - name: "date_picker"
76
- platforms: *web
77
- - name: "file_upload"
78
- platforms: *web
79
- - name: "form"
80
- platforms: *rails_only
81
- - name: "form_group"
82
- platforms: *web
83
- - name: "form_pill"
84
- platforms: *web
85
- - name: "multi_level_select"
86
- platforms: *web
87
- - name: "passphrase"
88
- platforms: *web
89
- - name: "phone_number_input"
90
- platforms: *web
91
- - name: "radio"
92
- platforms: *all
93
- - name: "rich_text_editor"
94
- platforms: *web
95
- - name: "select"
96
- platforms: *web
97
- - name: "selectable_card"
98
- platforms: *web
99
- - name: "selectable_card_icon"
100
- platforms: *web
101
- - name: "selectable_icon"
102
- platforms: *web
103
- - name: "selectable_list"
104
- platforms: *web
105
- - name: "text_input"
106
- platforms: *web
107
- - name: "textarea"
108
- platforms: *web
109
- - name: "toggle"
110
- platforms: *web
111
- - name: "typeahead"
112
- platforms: *web
113
- - name: "highlight"
114
- components:
115
- - name: "highlight"
116
- platforms: *web
117
- - name: "icon"
118
- components:
119
- - name: "icon"
120
- platforms: *web
121
- - name: "icon_circle"
122
- components:
123
- - name: "icon_circle"
124
- platforms: *web
125
- - name: "icon_stat_value"
126
- components:
127
- - name: "icon_stat_value"
128
- platforms: *web
129
- - name: "icon_value"
130
- components:
131
- - name: "icon_value"
132
- platforms: *web
133
- - name: "image"
134
- components:
135
- - name: "image"
136
- platforms: *web
137
- - name: "layouts"
138
- components:
139
- - name: "flex"
140
- platforms: *web
141
- - name: "layout"
142
- platforms: *web
143
- - name: "lightbox"
144
- components:
145
- - name: "lightbox"
146
- platforms: *react_only
147
- - name: "list"
148
- components:
149
- - name: "list"
150
- platforms: *web
151
- - name: "loading_inline"
152
- components:
153
- - name: "loading_inline"
154
- platforms: *web
155
- - name: "map"
156
- components:
157
- - name: "map"
158
- platforms: *react_only
159
- - name: "nav"
160
- components:
161
- - name: "nav"
162
- platforms: *web
163
- - name: "pagination"
164
- components:
165
- - name: "pagination"
166
- platforms: *rails_only
167
- - name: "popover"
168
- components:
169
- - name: "popover"
170
- platforms: *web
171
- - name: "progress"
172
- components:
173
- - name: "progress_pills"
174
- platforms: *web
175
- - name: "progress_simple"
176
- platforms: *web
177
- - name: "progress_step"
178
- platforms: *web
179
- - name: "section_separator"
180
- components:
181
- - name: "section_separator"
182
- platforms: *web
183
- - name: "star_rating"
184
- components:
185
- - name: "star_rating"
186
- platforms: *web
187
- - name: "table"
188
- components:
189
- - name: "table"
190
- platforms: *web
191
- - name: "tags"
192
- components:
193
- - name: "tags"
194
- platforms: *web
195
- - name: "badge"
196
- platforms: *web
197
- - name: "hashtag"
198
- platforms: *web
199
- - name: "pill"
200
- platforms: *all
201
- - name: "timeline"
202
- components:
203
- - name: "timeline"
204
- platforms: *web
205
- - name: "time_and_date"
206
- components:
207
- - name: "date"
208
- platforms: *web
209
- - name: "date_range_inline"
210
- platforms: *web
211
- - name: "date_range_stacked"
212
- platforms: *web
213
- - name: "date_stacked"
214
- platforms: *web
215
- - name: "date_time"
216
- platforms: *web
217
- - name: "date_time_stacked"
218
- platforms: *web
219
- - name: "date_year_stacked"
220
- platforms: *web
221
- - name: "time"
222
- platforms: *web
223
- - name: "time_range_inline"
224
- platforms: *web
225
- - name: "time_stacked"
226
- platforms: *web
227
- - name: "timestamp"
228
- platforms: *all
229
- - name: "weekday_stacked"
230
- platforms: *web
231
- - name: "tooltip"
232
- components:
233
- - name: "tooltip"
234
- platforms: *web
235
- - name: "typography"
236
- components:
237
- - name: "body"
238
- platforms: *web
239
- - name: "caption"
240
- platforms: *web
241
- - name: "detail"
242
- platforms: *web
243
- - name: "title"
244
- platforms: *web
245
- - name: "typography_patterns"
246
- components:
247
- - name: "contact"
248
- platforms: *web
249
- - name: "currency"
250
- platforms: *web
251
- - name: "dashboard_value"
252
- platforms: *web
253
- - name: "home_address_street"
254
- platforms: *web
255
- - name: "label_pill"
256
- platforms: *web
257
- - name: "label_value"
258
- platforms: *web
259
- - name: "message"
260
- platforms: *web
261
- - name: "person"
262
- platforms: *web
263
- - name: "person_contact"
264
- platforms: *web
265
- - name: "source"
266
- platforms: *web
267
- - name: "stat_change"
268
- platforms: *web
269
- - name: "stat_value"
270
- platforms: *web
271
- - name: "title_count"
272
- platforms: *web
273
- - name: "title_detail"
274
- platforms: *web
275
- - name: "user_badge"
276
- components:
277
- - name: "user_badge"
278
- platforms: *web
279
- - name: "walkthrough"
280
- components:
281
- - name: "walkthrough"
282
- platforms: *web
2
+ - avatars:
3
+ - avatar
4
+ - avatar_action_button
5
+ - multiple_users
6
+ - multiple_users_stacked
7
+ - user
8
+ - background
9
+ - bread_crumbs
10
+ - buttons:
11
+ - button
12
+ - button_toolbar
13
+ - circle_icon_button
14
+ - card
15
+ - collapsible
16
+ - charts_and_graphs:
17
+ - bar_graph
18
+ - circle_chart
19
+ - distribution_bar
20
+ - gauge
21
+ - legend
22
+ - line_graph
23
+ - treemap_chart
24
+ - dialog
25
+ - filter
26
+ - fixed_confirmation_toast
27
+ - forms:
28
+ - checkbox
29
+ - date_picker
30
+ - file_upload
31
+ - form
32
+ - form_group
33
+ - form_pill
34
+ - multi_level_select
35
+ - passphrase
36
+ - phone_number_input
37
+ - radio
38
+ - rich_text_editor
39
+ - select
40
+ - selectable_card
41
+ - selectable_card_icon
42
+ - selectable_icon
43
+ - selectable_list
44
+ - text_input
45
+ - textarea
46
+ - toggle
47
+ - typeahead
48
+ - highlight
49
+ - icon
50
+ - icon_circle
51
+ - icon_stat_value
52
+ - icon_value
53
+ - image
54
+ - layouts:
55
+ - flex
56
+ - layout
57
+ - lightbox
58
+ - list
59
+ - loading_inline
60
+ - map
61
+ - nav
62
+ - tags:
63
+ - badge
64
+ - hashtag
65
+ - pill
66
+ - pagination
67
+ - popover
68
+ - progress:
69
+ - progress_pills
70
+ - progress_simple
71
+ - progress_step
72
+ - section_separator
73
+ - star_rating
74
+ - table
75
+ - timeline
76
+ - time_and_date:
77
+ - date
78
+ - date_range_inline
79
+ - date_range_stacked
80
+ - date_stacked
81
+ - date_time
82
+ - date_time_stacked
83
+ - date_year_stacked
84
+ - time
85
+ - time_range_inline
86
+ - time_stacked
87
+ - timestamp
88
+ - weekday_stacked
89
+ - tooltip
90
+ - typography:
91
+ - body
92
+ - caption
93
+ - detail
94
+ - title
95
+ - typography_patterns:
96
+ - contact
97
+ - currency
98
+ - dashboard_value
99
+ - home_address_street
100
+ - label_pill
101
+ - label_value
102
+ - message
103
+ - person
104
+ - person_contact
105
+ - source
106
+ - stat_change
107
+ - stat_value
108
+ - title_count
109
+ - title_detail
110
+ - user_badge
111
+ - walkthrough