playbook_ui_docs 16.1.0.pre.alpha.play277814027 → 16.1.0.pre.rc.0

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 (79) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_inline_row_loading.md +2 -2
  3. data/app/pb_kits/playbook/pb_advanced_table/docs/example.yml +0 -2
  4. data/app/pb_kits/playbook/pb_advanced_table/docs/index.js +1 -2
  5. data/app/pb_kits/playbook/pb_background/docs/example.yml +0 -1
  6. data/app/pb_kits/playbook/pb_background/docs/index.js +0 -1
  7. data/app/pb_kits/playbook/pb_dropdown/docs/example.yml +0 -6
  8. data/app/pb_kits/playbook/pb_dropdown/docs/index.js +1 -4
  9. data/app/pb_kits/playbook/pb_filter/docs/_filter_default.html.erb +2 -2
  10. data/app/pb_kits/playbook/pb_filter/docs/_filter_default.jsx +9 -16
  11. data/app/pb_kits/playbook/pb_form/docs/_form_with_required_indicator.html.erb +1 -5
  12. data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.html.erb +5 -5
  13. data/app/pb_kits/playbook/pb_form_pill/docs/_form_pill_truncated_text.jsx +4 -4
  14. data/app/pb_kits/playbook/pb_multi_level_select/docs/example.yml +33 -35
  15. data/app/pb_kits/playbook/pb_multi_level_select/docs/index.js +0 -1
  16. data/app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_with_tooltip.jsx +1 -1
  17. data/app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_with_tooltip.md +1 -1
  18. data/app/pb_kits/playbook/pb_multiple_users/docs/example.yml +0 -1
  19. data/app/pb_kits/playbook/pb_passphrase/docs/_passphrase_meter_settings.jsx +0 -1
  20. data/app/pb_kits/playbook/pb_passphrase/docs/example.yml +0 -2
  21. data/app/pb_kits/playbook/pb_passphrase/docs/index.js +0 -1
  22. data/app/pb_kits/playbook/pb_phone_number_input/docs/example.yml +0 -2
  23. data/app/pb_kits/playbook/pb_phone_number_input/docs/index.js +0 -1
  24. data/app/pb_kits/playbook/pb_rich_text_editor/docs/example.yml +0 -3
  25. data/app/pb_kits/playbook/pb_rich_text_editor/docs/index.js +0 -2
  26. data/app/pb_kits/playbook/pb_textarea/docs/_textarea_default.html.erb +3 -3
  27. data/app/pb_kits/playbook/pb_textarea/docs/_textarea_default.jsx +0 -3
  28. data/app/pb_kits/playbook/pb_textarea/docs/example.yml +1 -4
  29. data/app/pb_kits/playbook/pb_textarea/docs/index.js +0 -1
  30. data/app/pb_kits/playbook/pb_time_picker/docs/_time_picker_on_handler.jsx +2 -5
  31. data/app/pb_kits/playbook/pb_time_picker/docs/example.yml +0 -2
  32. data/app/pb_kits/playbook/pb_time_picker/docs/index.js +0 -1
  33. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_truncated_text.html.erb +1 -1
  34. data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_truncated_text.jsx +1 -1
  35. metadata +2 -46
  36. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background_custom.jsx +0 -71
  37. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background_custom.md +0 -4
  38. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_inline_row_loading_rails.html.erb +0 -64
  39. data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_inline_row_loading_rails.md +0 -18
  40. data/app/pb_kits/playbook/pb_background/docs/_background_responsive.jsx +0 -30
  41. data/app/pb_kits/playbook/pb_background/docs/_background_responsive.md +0 -1
  42. data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default.md +0 -1
  43. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_blank_selection_rails.md +0 -3
  44. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_blank_selection_react.md +0 -3
  45. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_clearable.html.erb +0 -52
  46. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_clearable.jsx +0 -72
  47. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_clearable.md +0 -5
  48. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_constrain_height.jsx +0 -33
  49. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_constrain_height_rails.html.erb +0 -20
  50. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_constrain_height_rails.md +0 -8
  51. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_constrain_height_react.md +0 -8
  52. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_placeholder.html.erb +0 -9
  53. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_placeholder.jsx +0 -33
  54. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_placeholder.md +0 -3
  55. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_input_display.html.erb +0 -74
  56. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_input_display.jsx +0 -87
  57. data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_input_display.md +0 -3
  58. data/app/pb_kits/playbook/pb_multiple_users/docs/_multiple_users_with_tooltip.html.erb +0 -30
  59. data/app/pb_kits/playbook/pb_passphrase/docs/_passphrase_required_indicator.html.erb +0 -7
  60. data/app/pb_kits/playbook/pb_passphrase/docs/_passphrase_required_indicator.jsx +0 -24
  61. data/app/pb_kits/playbook/pb_passphrase/docs/_passphrase_required_indicator.md +0 -3
  62. data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_required_indicator.html.erb +0 -5
  63. data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_required_indicator.jsx +0 -14
  64. data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_required_indicator.md +0 -3
  65. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_required_indicator.jsx +0 -35
  66. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_required_indicator.md +0 -3
  67. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_required_indicator.html.erb +0 -10
  68. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_required_indicator.jsx +0 -21
  69. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_required_indicator.md +0 -3
  70. data/app/pb_kits/playbook/pb_table/docs/_sections.yml +0 -68
  71. data/app/pb_kits/playbook/pb_textarea/docs/_textarea_default.md +0 -1
  72. data/app/pb_kits/playbook/pb_textarea/docs/_textarea_input_options.html.erb +0 -39
  73. data/app/pb_kits/playbook/pb_textarea/docs/_textarea_input_options.md +0 -3
  74. data/app/pb_kits/playbook/pb_textarea/docs/_textarea_required_indicator.html.erb +0 -5
  75. data/app/pb_kits/playbook/pb_textarea/docs/_textarea_required_indicator.jsx +0 -25
  76. data/app/pb_kits/playbook/pb_textarea/docs/_textarea_required_indicator.md +0 -3
  77. data/app/pb_kits/playbook/pb_time_picker/docs/_time_picker_required_indicator.html.erb +0 -6
  78. data/app/pb_kits/playbook/pb_time_picker/docs/_time_picker_required_indicator.jsx +0 -16
  79. data/app/pb_kits/playbook/pb_time_picker/docs/_time_picker_required_indicator.md +0 -3
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 43f7d11b6833e9d85b5d4a595f5217ea6d98de29164345f41e2fbdd768851a82
4
- data.tar.gz: 5a1d93a5ddb391158a1552eeb5d736d7e305d381624eed5201ee8449e11fa4a5
3
+ metadata.gz: 1a500947d189faf49975a04214fc6a7777068bb6e97e701b56120716e8ea496e
4
+ data.tar.gz: cda73d66b6a43912b4729d9852e46fcd1521e4066b79f1b60a4290b8bbb6a256
5
5
  SHA512:
6
- metadata.gz: 455ed90c00a6ca16af00f7ad78ce9265cf1d5014c84bc737a37b10189d2cd3b554938d78ba0cceec469c23db3c07a1f94af725369fc65bf773e6dfba49dd728b
7
- data.tar.gz: 7083d22a67bc730c855ee8fbfa8bb93cded87249da657b57869154d3f9d52bf2fedbc9436906bc0f679a66d4639be4a4444fe6e6dbd68095986ac2f0a4f1fefe
6
+ metadata.gz: df07ec138ac3b2a63260de43aa35051bc3fd6d8cbbba11989e789d02a486092763e936cf69c6856145cacf3b1197f0486b83dad239885c842e8165071b86428e
7
+ data.tar.gz: 1e2254818a11b43ce09a4dc1c319abaa7fa1be93a793d5917be95d5d966f9da7e5f345d9d895e03982b956df10874fddab545066849d30cdbf32fa81bbc6b3e4
@@ -6,9 +6,9 @@ In the first Advanced Table in this code example, 2021 has an empty children arr
6
6
  This prop is set to `false` by default.
7
7
 
8
8
 
9
- ### persistToggleExpansionButton
9
+ ### persistToggleExpansion
10
10
  The `persistToggleExpansionButton` is a boolean prop that renders the toggle-all icon in the top left header cell for complex datasets with empty `children` arrays and advanced querying logic explained in the preceeding doc example. Your logic may require an additional query helper file to update data specifically from requerying via toggle all buttons.
11
11
 
12
12
  In the second and third Advanced Tables in this code example, all 3 rows have empty children arrays. The second Advanced Table demonstrates that the toggle all button does not render (prior to an initial row expansion) without `persistToggleExpansionButton` in place. The third Advanced Table shows the toggle all button due to `persistToggleExpansionButton`.
13
13
 
14
- This prop is set to `false` by default and should only be used in conjunction with `inlineRowLoading`.
14
+ This prop is set to false by default and should only be used in conjunction with `inlineRowLoading`.
@@ -29,7 +29,6 @@ examples:
29
29
  - advanced_table_background_control_rails: Column Styling Background Color
30
30
  - advanced_table_background_colors_rails: Column Styling Individual Cell Background Color
31
31
  - advanced_table_column_border_color_rails: Column Group Border Color
32
- - advanced_table_inline_row_loading_rails: Inline Row Loading
33
32
 
34
33
 
35
34
  react:
@@ -78,7 +77,6 @@ examples:
78
77
  - advanced_table_column_styling: Column Styling
79
78
  - advanced_table_column_styling_column_headers: Column Styling with Multiple Headers
80
79
  - advanced_table_column_styling_background: Column Styling Background Color
81
- - advanced_table_column_styling_background_custom: Column Styling Background Color (Custom)
82
80
  - advanced_table_column_styling_background_multi: Column Styling Background Color with Multiple Headers
83
81
  - advanced_table_padding_control: Padding Control using Column Styling
84
82
  - advanced_table_column_border_color: Column Group Border Color
@@ -47,5 +47,4 @@ export { default as AdvancedTableSortPerColumnForMultiColumn } from './_advanced
47
47
  export { default as AdvancedTablePaddingControl } from './_advanced_table_padding_control.jsx'
48
48
  export { default as AdvancedTablePaddingControlPerRow } from './_advanced_table_padding_control_per_row.jsx'
49
49
  export { default as AdvancedTableColumnStylingBackground } from './_advanced_table_column_styling_background.jsx'
50
- export { default as AdvancedTableColumnStylingBackgroundMulti } from './_advanced_table_column_styling_background_multi.jsx'
51
- export { default as AdvancedTableColumnStylingBackgroundCustom } from './_advanced_table_column_styling_background_custom.jsx'
50
+ export { default as AdvancedTableColumnStylingBackgroundMulti } from './_advanced_table_column_styling_background_multi.jsx'
@@ -20,4 +20,3 @@ examples:
20
20
  - background_category: Category
21
21
  - background_size: Size
22
22
  - background_overlay: Overlay
23
- - background_responsive: Responsive
@@ -7,4 +7,3 @@ export { default as BackgroundStatusSubtle } from './_background_status_subtle.j
7
7
  export { default as BackgroundCategory } from './_background_category.jsx'
8
8
  export { default as BackgroundSize } from './_background_size.jsx'
9
9
  export { default as BackgroundOverlay } from './_background_overlay.jsx'
10
- export { default as BackgroundResponsive } from './_background_responsive.jsx'
@@ -21,10 +21,7 @@ examples:
21
21
  - dropdown_default_value: Default Value
22
22
  - dropdown_multi_select_with_default: Multi Select Default Value
23
23
  - dropdown_blank_selection: Blank Selection
24
- - dropdown_with_placeholder: Placeholder
25
24
  - dropdown_separators_hidden: Separators Hidden
26
- - dropdown_with_clearable: Clearable
27
- - dropdown_with_constrain_height_rails: Constrain Height
28
25
  - dropdown_quickpick_rails: Quick Pick Variant
29
26
  - dropdown_quickpick_range_end_rails: Quick Pick Variant (Range Ends Today)
30
27
  - dropdown_quickpick_default_dates: Quick Pick Variant (Default Dates)
@@ -55,10 +52,7 @@ examples:
55
52
  - dropdown_default_value: Default Value
56
53
  - dropdown_multi_select_with_default: Multi Select Default Value
57
54
  - dropdown_blank_selection: Blank Selection
58
- - dropdown_with_placeholder: Placeholder
59
55
  - dropdown_clear_selection: Clear Selection
60
- - dropdown_with_clearable: Clearable
61
- - dropdown_with_constrain_height: Constrain Height
62
56
  - dropdown_separators_hidden: Separators Hidden
63
57
  - dropdown_with_external_control: useDropdown Hook
64
58
  - dropdown_quickpick: Quick Pick Variant
@@ -11,7 +11,6 @@ export { default as DropdownSubcomponentStructure } from './_dropdown_subcompone
11
11
  export { default as DropdownError } from './_dropdown_error.jsx'
12
12
  export { default as DropdownDefaultValue } from './_dropdown_default_value.jsx'
13
13
  export { default as DropdownBlankSelection } from './_dropdown_blank_selection.jsx'
14
- export { default as DropdownWithPlaceholder } from './_dropdown_with_placeholder.jsx'
15
14
  export { default as DropdownClearSelection } from './_dropdown_clear_selection.jsx'
16
15
  export { default as DropdownSubtleVariant } from './_dropdown_subtle_variant.jsx'
17
16
  export { default as DropdownSeparatorsHidden } from './_dropdown_separators_hidden.jsx'
@@ -28,6 +27,4 @@ export { default as DropdownQuickpick } from './_dropdown_quickpick.jsx'
28
27
  export { default as DropdownQuickpickRangeEnd } from './_dropdown_quickpick_range_end.jsx'
29
28
  export { default as DropdownQuickpickDefaultDates } from './_dropdown_quickpick_default_dates.jsx'
30
29
  export { default as DropdownQuickpickWithDatePickers } from './_dropdown_quickpick_with_date_pickers.jsx'
31
- export { default as DropdownQuickpickCustom } from './_dropdown_quickpick_custom.jsx'
32
- export { default as DropdownWithClearable } from './_dropdown_with_clearable.jsx'
33
- export { default as DropdownWithConstrainHeight } from './_dropdown_with_constrain_height.jsx'
30
+ export { default as DropdownQuickpickCustom } from './_dropdown_quickpick_custom.jsx'
@@ -1,7 +1,7 @@
1
1
  <%=
2
2
  pb_rails("filter", props: {
3
3
  min_width: "360px",
4
- id: "filter-demo-1",
4
+ id: "1",
5
5
  margin_bottom: "xl",
6
6
  filters: [
7
7
  { name: "name", value: "John Wick" },
@@ -44,7 +44,7 @@
44
44
  <%=
45
45
  pb_rails("filter", props: {
46
46
  min_width: "360px",
47
- id: "filter-demo-2",
47
+ id: "def2",
48
48
  sort_menu: [
49
49
  { item: "Popularity", link: "?q[sorts]=managers_popularity+asc", active: true, direction: "desc" },
50
50
  { item: "Mananger's Title", link: "?q[sorts]=managers_title+asc", active: false },
@@ -1,4 +1,4 @@
1
- import React, { useState } from 'react'
1
+ import React from 'react'
2
2
 
3
3
  import Button from '../../pb_button/_button'
4
4
  import Filter from '../../pb_filter/_filter'
@@ -6,18 +6,11 @@ import Flex from '../../pb_flex/_flex'
6
6
  import Select from '../../pb_select/_select'
7
7
  import TextInput from '../../pb_text_input/_text_input'
8
8
 
9
- const FilterDefault = (props) => {
10
- const [sortValue, setSortValue] = useState([{ name: 'popularity', dir: 'desc' }])
11
- const [sortValue2, setSortValue2] = useState([{ name: 'popularity', dir: 'desc' }])
12
-
13
- const handleSortChange = (sortOptions) => {
14
- setSortValue(sortOptions)
15
- alert(JSON.stringify(sortOptions[0]))
16
- }
9
+ const SortingChangeCallback = (sortOptions) => {
10
+ alert(JSON.stringify(sortOptions[0]))
11
+ }
17
12
 
18
- const handleSortChange2 = (sortOptions) => {
19
- setSortValue2(sortOptions)
20
- }
13
+ const FilterDefault = (props) => {
21
14
  const options = [
22
15
  { value: 'USA' },
23
16
  { value: 'Canada' },
@@ -36,7 +29,7 @@ const FilterDefault = (props) => {
36
29
  }}
37
30
  marginBottom="xl"
38
31
  minWidth="375px"
39
- onSortChange={handleSortChange}
32
+ onSortChange={SortingChangeCallback}
40
33
  results={1}
41
34
  sortOptions={{
42
35
  popularity: 'Popularity',
@@ -45,7 +38,7 @@ const FilterDefault = (props) => {
45
38
  // eslint-disable-next-line
46
39
  manager_name: 'Manager\'s Name',
47
40
  }}
48
- sortValue={sortValue}
41
+ sortValue={[{ name: 'popularity', dir: 'desc' }]}
49
42
  {...props}
50
43
  >
51
44
  {({ closePopover }) => (
@@ -89,7 +82,7 @@ const FilterDefault = (props) => {
89
82
  <Filter
90
83
  double
91
84
  minWidth="375px"
92
- onSortChange={handleSortChange2}
85
+ onSortChange={SortingChangeCallback}
93
86
  results={0}
94
87
  sortOptions={{
95
88
  popularity: 'Popularity',
@@ -98,7 +91,7 @@ const FilterDefault = (props) => {
98
91
  // eslint-disable-next-line
99
92
  manager_name: 'Manager\'s Name',
100
93
  }}
101
- sortValue={sortValue2}
94
+ sortValue={[{ name: 'popularity', dir: 'desc' }]}
102
95
  {...props}
103
96
  >
104
97
  {({ closePopover }) => (
@@ -1,18 +1,14 @@
1
1
  <%= pb_form_with(scope: :example, url: "", method: :get, validate: true) do |form| %>
2
2
  <%= form.text_field :example_text_field, props: { label: true, required: true, required_indicator: true } %>
3
3
  <%= form.text_field :example_text_field_2, props: { label: "Text Field Custom Label", required: true, required_indicator: true } %>
4
- <%= form.text_area :example_text_area, props: { label: true, required: true, required_indicator: true } %>
5
- <%= form.text_area :example_text_area_2, props: { label: "Textarea Custom Label", required: true, required_indicator: true } %>
6
4
  <%= form.email_field :example_email_field, props: { label: true, required: true, required_indicator: true } %>
7
5
  <%= form.number_field :example_number_field, props: { label: true, required: true, required_indicator: true } %>
8
6
  <%= form.search_field :example_search_field, props: { label: true, required: true, required_indicator: true } %>
9
7
  <%= form.password_field :example_password_field, props: { label: true, required: true, required_indicator: true } %>
10
8
  <%= form.url_field :example_url_field, props: { label: true, required: true, required_indicator: true } %>
11
- <%= form.phone_number_field :example_phone_number_field, props: { label: true, required: true, required_indicator: true } %>
12
- <%= form.time_picker :example_time_picker_required_indicator, props: { label: true, required: true, required_indicator: true } %>
13
9
 
14
10
  <%= form.actions do |action| %>
15
11
  <%= action.submit %>
16
12
  <%= action.button props: { type: "reset", text: "Cancel", variant: "secondary" } %>
17
13
  <% end %>
18
- <% end %>
14
+ <% end %>
@@ -15,7 +15,7 @@
15
15
  options: names,
16
16
  label: "Truncation Within Typeahead",
17
17
  pills: true,
18
- truncate: "1",
18
+ truncate: 1,
19
19
  }) %>
20
20
 
21
21
  <%= pb_rails("caption", props: { text: "Form Pill Truncation" }) %>
@@ -24,19 +24,19 @@
24
24
  name: "Princess Amelia Mignonette Grimaldi Thermopolis Renaldo",
25
25
  avatar_url: "https://randomuser.me/api/portraits/women/44.jpg",
26
26
  tabindex: 0,
27
- truncate: "1",
27
+ truncate: 1,
28
28
  id: "truncation-1"
29
29
  }) %>
30
30
  <%= pb_rails("form_pill", props: {
31
31
  icon: "badge-check",
32
32
  text: "icon and a very long tag to show truncation",
33
33
  tabindex: 0,
34
- truncate: "1",
34
+ truncate: 1,
35
35
  id: "truncation-2"
36
36
  }) %>
37
37
  <%= pb_rails("form_pill", props: {
38
38
  text: "form pill long tag no tooltip show truncation",
39
39
  tabindex: 0,
40
- truncate: "1",
40
+ truncate: 1,
41
41
  }) %>
42
- <% end %>
42
+ <% end %>
@@ -21,7 +21,7 @@ const FormPillTruncatedText = (props) => {
21
21
  isMulti
22
22
  label="Truncation Within Typeahead"
23
23
  options={names}
24
- truncate={"1"}
24
+ truncate={1}
25
25
  {...props}
26
26
  />
27
27
  <Caption text="Form Pill Truncation"/>
@@ -31,20 +31,20 @@ const FormPillTruncatedText = (props) => {
31
31
  name="Princess Amelia Mignonette Grimaldi Thermopolis Renaldo"
32
32
  onClick={() => alert('Click!')}
33
33
  tabIndex={0}
34
- truncate={"1"}
34
+ truncate={1}
35
35
  />
36
36
  <FormPill
37
37
  icon="badge-check"
38
38
  onClick={() => {alert('Click!')}}
39
39
  tabIndex={0}
40
40
  text="icon and a very long tag to show truncation"
41
- truncate={"1"}
41
+ truncate={1}
42
42
  />
43
43
  <FormPill
44
44
  onClick={() => {alert('Click!')}}
45
45
  tabIndex={0}
46
46
  text="form pill with a very long tag to show truncation"
47
- truncate={"1"}
47
+ truncate={1}
48
48
  />
49
49
  </Card>
50
50
  </>
@@ -1,39 +1,37 @@
1
1
  examples:
2
2
  rails:
3
- - multi_level_select_default: Default
4
- - multi_level_select_single: Single Select
5
- - multi_level_select_single_children_only: Single Select w/ Hidden Radios
6
- - multi_level_select_return_all_selected: Return All Selected
7
- - multi_level_select_input_display: With Input Display None
8
- - multi_level_select_selected_ids: Selected Ids
9
- - multi_level_select_with_form: With Form
10
- - multi_level_select_color: With Pills (Custom Color)
11
- - multi_level_select_reset: Reset Selection
12
- - multi_level_select_label: With Label
13
- - multi_level_select_error: Error
14
- - multi_level_select_disabled: Disabled Input
15
- - multi_level_select_disabled_options_default: Disabled Options (Default)
16
- - multi_level_select_disabled_options: Disabled Options (Return All Selected)
17
- - multi_level_select_disabled_options_parent_default: Disabled Parent Option (Default)
18
- - multi_level_select_disabled_options_parent: Disabled Parent Option (Return All Selected)
19
- - multi_level_select_single_disabled: Disabled Options (Single Select)
3
+ - multi_level_select_default: Default
4
+ - multi_level_select_single: Single Select
5
+ - multi_level_select_single_children_only: Single Select w/ Hidden Radios
6
+ - multi_level_select_return_all_selected: Return All Selected
7
+ - multi_level_select_selected_ids: Selected Ids
8
+ - multi_level_select_with_form: With Form
9
+ - multi_level_select_color: With Pills (Custom Color)
10
+ - multi_level_select_reset: Reset Selection
11
+ - multi_level_select_label: With Label
12
+ - multi_level_select_error: Error
13
+ - multi_level_select_disabled: Disabled Input
14
+ - multi_level_select_disabled_options_default: Disabled Options (Default)
15
+ - multi_level_select_disabled_options: Disabled Options (Return All Selected)
16
+ - multi_level_select_disabled_options_parent_default: Disabled Parent Option (Default)
17
+ - multi_level_select_disabled_options_parent: Disabled Parent Option (Return All Selected)
18
+ - multi_level_select_single_disabled: Disabled Options (Single Select)
20
19
 
21
20
  react:
22
- - multi_level_select_default: Default
23
- - multi_level_select_react_hook: React Hook
24
- - multi_level_select_single: Single Select
25
- - multi_level_select_single_children_only: Single Select w/ Hidden Radios
26
- - multi_level_select_return_all_selected: Return All Selected
27
- - multi_level_select_input_display: With Input Display None
28
- - multi_level_select_selected_ids_react: Selected Ids
29
- - multi_level_select_color: With Pills (Custom Color)
30
- - multi_level_select_with_children: Checkboxes With Children
31
- - multi_level_select_with_children_with_radios: Single Select With Children
32
- - multi_level_select_label: With Label
33
- - multi_level_select_error: Error
34
- - multi_level_select_disabled: Disabled Input
35
- - multi_level_select_disabled_options_default: Disabled Options (Default)
36
- - multi_level_select_disabled_options: Disabled Options (Return All Selected)
37
- - multi_level_select_disabled_options_parent_default: Disabled Parent Option (Default)
38
- - multi_level_select_disabled_options_parent: Disabled Parent Option (Return All Selected)
39
- - multi_level_select_single_disabled: Disabled Options (Single Select)
21
+ - multi_level_select_default: Default
22
+ - multi_level_select_react_hook: React Hook
23
+ - multi_level_select_single: Single Select
24
+ - multi_level_select_single_children_only: Single Select w/ Hidden Radios
25
+ - multi_level_select_return_all_selected: Return All Selected
26
+ - multi_level_select_selected_ids_react: Selected Ids
27
+ - multi_level_select_color: With Pills (Custom Color)
28
+ - multi_level_select_with_children: Checkboxes With Children
29
+ - multi_level_select_with_children_with_radios: Single Select With Children
30
+ - multi_level_select_label: With Label
31
+ - multi_level_select_error: Error
32
+ - multi_level_select_disabled: Disabled Input
33
+ - multi_level_select_disabled_options_default: Disabled Options (Default)
34
+ - multi_level_select_disabled_options: Disabled Options (Return All Selected)
35
+ - multi_level_select_disabled_options_parent_default: Disabled Parent Option (Default)
36
+ - multi_level_select_disabled_options_parent: Disabled Parent Option (Return All Selected)
37
+ - multi_level_select_single_disabled: Disabled Options (Single Select)
@@ -4,7 +4,6 @@ export { default as MultiLevelSelectSingleChildrenOnly } from './_multi_level_se
4
4
  export { default as MultiLevelSelectReturnAllSelected } from './_multi_level_select_return_all_selected.jsx'
5
5
  export { default as MultiLevelSelectSelectedIdsReact } from "./_multi_level_select_selected_ids_react.jsx"
6
6
  export { default as MultiLevelSelectColor } from './_multi_level_select_color.jsx'
7
- export { default as MultiLevelSelectInputDisplay } from './_multi_level_select_input_display.jsx'
8
7
  export { default as MultiLevelSelectWithChildren } from './_multi_level_select_with_children.jsx'
9
8
  export { default as MultiLevelSelectWithChildrenWithRadios } from './_multi_level_select_with_children_with_radios.jsx'
10
9
  export { default as MultiLevelSelectDisabled } from './_multi_level_select_disabled.jsx'
@@ -38,5 +38,5 @@ const MultipleUsersWithTooltip = (props) => {
38
38
  </div>
39
39
  )
40
40
  }
41
-
41
+ ``
42
42
  export default MultipleUsersWithTooltip
@@ -1 +1 @@
1
- Use the `withTooltip` / `with_tooltip` boolean prop to enable setting user-specific tooltip content via the `tooltip` property in the users array.
1
+ Use the `withTooltip` boolean prop to enable setting user-specific tooltip content via the `tooltip` property in the users array.
@@ -4,7 +4,6 @@ examples:
4
4
  - multiple_users_default: Default
5
5
  - multiple_users_reverse: Reverse
6
6
  - multiple_users_size: Size
7
- - multiple_users_with_tooltip: With Tooltip
8
7
 
9
8
 
10
9
  react:
@@ -120,7 +120,6 @@ const PassphraseMeterSettings = (props) => {
120
120
  "These examples will all share the same input value. Type in any of the inputs to see how the strength meter changes in response to different settings."
121
121
  }
122
122
  </Body>
123
- <br/>
124
123
  <Passphrase
125
124
  label={"Type your passphrase"}
126
125
  onChange={handleChange}
@@ -9,7 +9,6 @@ examples:
9
9
  - passphrase_strength_change: Strength Change
10
10
  - passphrase_common: Common Passphrases
11
11
  - passphrase_breached: Breached Passphrases
12
- - passphrase_required_indicator: Required Indicator
13
12
 
14
13
  react:
15
14
  - passphrase_default: Default
@@ -20,4 +19,3 @@ examples:
20
19
  - passphrase_strength_change: Strength Change
21
20
  - passphrase_common: Common Passphrases
22
21
  - passphrase_breached: Breached Passphrases
23
- - passphrase_required_indicator: Required Indicator
@@ -6,4 +6,3 @@ export { default as PassphraseTips } from './_passphrase_tips'
6
6
  export { default as PassphraseStrengthChange } from './_passphrase_strength_change'
7
7
  export { default as PassphraseCommon } from './_passphrase_common'
8
8
  export { default as PassphraseBreached } from './_passphrase_breached'
9
- export { default as PassphraseRequiredIndicator } from './_passphrase_required_indicator.jsx'
@@ -12,7 +12,6 @@ examples:
12
12
  - phone_number_input_format: Format as You Type
13
13
  - phone_number_input_strict_mode: Strict Mode
14
14
  - phone_number_input_country_search: Country Search
15
- - phone_number_input_required_indicator: Required Indicator
16
15
 
17
16
  rails:
18
17
  - phone_number_input_default: Default
@@ -25,4 +24,3 @@ examples:
25
24
  - phone_number_input_strict_mode: Strict Mode
26
25
  - phone_number_input_hidden_inputs: Hidden Inputs
27
26
  - phone_number_input_country_search: Country Search
28
- - phone_number_input_required_indicator: Required Indicator
@@ -9,4 +9,3 @@ export { default as PhoneNumberInputAccessInputElement } from './_phone_number_i
9
9
  export { default as PhoneNumberInputFormat } from './_phone_number_input_format'
10
10
  export { default as PhoneNumberInputStrictMode } from './_phone_number_input_strict_mode'
11
11
  export { default as PhoneNumberInputCountrySearch } from './_phone_number_input_country_search'
12
- export { default as PhoneNumberInputRequiredIndicator } from './_phone_number_input_required_indicator.jsx'
@@ -9,7 +9,6 @@ examples:
9
9
  - rich_text_editor_templates: Templates
10
10
  # - rich_text_editor_toolbar_bottom: Toolbar Bottom
11
11
  - rich_text_editor_inline: Inline
12
- - rich_text_editor_required_indicator: Required Indicator
13
12
  - rich_text_editor_preview: Preview
14
13
 
15
14
  react:
@@ -32,7 +31,5 @@ examples:
32
31
  - rich_text_editor_advanced_inline: Advanced (Inline)
33
32
  - rich_text_editor_advanced_height: Advanced Height
34
33
  - rich_text_editor_advanced_min_height: Advanced Min Height
35
- - rich_text_editor_required_indicator: Required Indicator
36
- - rich_text_editor_advanced_required_indicator: Advanced Required Indicator
37
34
  - rich_text_editor_preview: Preview
38
35
  - rich_text_editor_advanced_preview: Advanced Preview
@@ -19,5 +19,3 @@ export { default as RichTextEditorAdvancedSticky } from './_rich_text_editor_adv
19
19
  export { default as RichTextEditorAdvancedInline } from './_rich_text_editor_advanced_inline.jsx'
20
20
  export { default as RichTextEditorAdvancedHeight } from './_rich_text_editor_advanced_height.jsx'
21
21
  export { default as RichTextEditorAdvancedMinHeight } from './_rich_text_editor_advanced_min_height.jsx'
22
- export { default as RichTextEditorRequiredIndicator } from './_rich_text_editor_required_indicator.jsx'
23
- export { default as RichTextEditorAdvancedRequiredIndicator } from './_rich_text_editor_advanced_required_indicator.jsx'
@@ -1,9 +1,9 @@
1
- <%= pb_rails("textarea", props: { label: "Label", rows: 4, id: "default-example-1" }) %>
1
+ <%= pb_rails("textarea", props: { label: "Label", rows: 4}) %>
2
2
 
3
3
  <br/>
4
4
 
5
- <%= pb_rails("textarea", props: { label: "Label", placeholder: "Placeholder text", id: "default-example-2" }) %>
5
+ <%= pb_rails("textarea", props: { label: "Label", placeholder: "Placeholder text" }) %>
6
6
 
7
7
  <br/>
8
8
 
9
- <%= pb_rails("textarea", props: { label: "Label", name: "comment", value: "Default value text", id: "default-example-3" }) %>
9
+ <%= pb_rails("textarea", props: { label: "Label", name: "comment", value: "Default value text" }) %>
@@ -13,7 +13,6 @@ const TextareaDefault = (props) => {
13
13
  label="Label"
14
14
  rows={4}
15
15
  {...props}
16
- id="default-example-1"
17
16
  />
18
17
 
19
18
  <br />
@@ -22,7 +21,6 @@ const TextareaDefault = (props) => {
22
21
  label="Label"
23
22
  placeholder="Placeholder text"
24
23
  {...props}
25
- id="default-example-2"
26
24
  />
27
25
 
28
26
  <br />
@@ -34,7 +32,6 @@ const TextareaDefault = (props) => {
34
32
  placeholder="Placeholder text"
35
33
  value={value}
36
34
  {...props}
37
- id="default-example-3"
38
35
  />
39
36
 
40
37
  </div>
@@ -8,8 +8,6 @@ examples:
8
8
  - textarea_character_counter: Character Counter
9
9
  - textarea_inline: Inline
10
10
  - textarea_emoji_mask: Emoji Mask
11
- - textarea_required_indicator: Required Indicator
12
- - textarea_input_options: Input Options
13
11
 
14
12
  react:
15
13
  - textarea_default: Default
@@ -19,9 +17,8 @@ examples:
19
17
  - textarea_character_counter: Character Counter
20
18
  - textarea_inline: Inline
21
19
  - textarea_emoji_mask: Emoji Mask
22
- - textarea_required_indicator: Required Indicator
23
20
 
24
21
  swift:
25
22
  - textarea_default_swift: Default
26
23
  - textarea_error_swift: Textarea w/ Error
27
- - textarea_props_swift: ""
24
+ - textarea_props_swift: ""
@@ -5,4 +5,3 @@ export { default as TextareaError } from './_textarea_error.jsx'
5
5
  export { default as TextareaCharacterCounter } from './_textarea_character_counter.jsx'
6
6
  export { default as TextareaInline } from './_textarea_inline.jsx'
7
7
  export { default as TextareaEmojiMask } from './_textarea_emoji_mask.jsx'
8
- export { default as TextareaRequiredIndicator } from './_textarea_required_indicator.jsx'
@@ -1,7 +1,6 @@
1
1
  import React, { useState } from 'react'
2
2
  import TimePicker from '../../pb_time_picker/_time_picker'
3
3
  import Body from '../../pb_body/_body'
4
- import Flex from '../../pb_flex/_flex'
5
4
 
6
5
  const TimePickerOnHandler = (props) => {
7
6
  const [selectedTime, setSelectedTime] = useState('')
@@ -18,9 +17,7 @@ const TimePickerOnHandler = (props) => {
18
17
  return (
19
18
  <div>
20
19
  {(selectedTime || closedTime) && (
21
- <Flex marginBottom="sm"
22
- orientation="column"
23
- >
20
+ <div style={{ marginBottom: '16px' }}>
24
21
  {selectedTime && (
25
22
  <Body
26
23
  text={`onChange: ${selectedTime}`}
@@ -32,7 +29,7 @@ const TimePickerOnHandler = (props) => {
32
29
  text={`onClose: ${closedTime}`}
33
30
  />
34
31
  )}
35
- </Flex>
32
+ </div>
36
33
  )}
37
34
  <TimePicker
38
35
  id="time-picker-on-handler"
@@ -9,7 +9,6 @@ examples:
9
9
  - time_picker_min_max_time: Min & Max Time
10
10
  - time_picker_error: Error
11
11
  - time_picker_disabled: Disabled
12
- - time_picker_required_indicator: Required Indicator
13
12
  - time_picker_input_options: Input Options
14
13
 
15
14
 
@@ -22,5 +21,4 @@ examples:
22
21
  - time_picker_min_max_time: Min & Max Time
23
22
  - time_picker_error: Error
24
23
  - time_picker_disabled: Disabled
25
- - time_picker_required_indicator: Required Indicator
26
24
  - time_picker_on_handler: onChange & onClose Handlers
@@ -7,4 +7,3 @@ export { default as TimePickerOnHandler } from './_time_picker_on_handler.jsx'
7
7
  export { default as TimePickerMinMaxTime } from './_time_picker_min_max_time.jsx'
8
8
  export { default as TimePickerError } from './_time_picker_error.jsx'
9
9
  export { default as TimePickerDisabled } from './_time_picker_disabled.jsx'
10
- export { default as TimePickerRequiredIndicator } from './_time_picker_required_indicator.jsx'
@@ -15,5 +15,5 @@
15
15
  options: names,
16
16
  label: "Truncation Within Typeahead",
17
17
  pills: true,
18
- truncate: "1",
18
+ truncate: 1,
19
19
  }) %>
@@ -17,7 +17,7 @@ const TypeaheadTruncatedText = (props) => {
17
17
  isMulti
18
18
  label="Truncation Within Typeahead"
19
19
  options={names}
20
- truncate={"1"}
20
+ truncate={1}
21
21
  {...props}
22
22
  />
23
23
  </>