playbook_ui_docs 13.27.0.pre.alpha.PLAY888Cardkithighlightoverflowtooltiperror2930 → 13.27.0.pre.alpha.PLAY1122fixMultipleUserspaddingoverflow2844

Sign up to get free protection for your applications and to get access to all the features.
Files changed (78) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/pb_avatar/docs/_avatar_badge_component_overlay.html.erb +66 -46
  3. data/app/pb_kits/playbook/pb_avatar/docs/_avatar_badge_component_overlay.jsx +29 -8
  4. data/app/pb_kits/playbook/pb_avatar/docs/_avatar_circle_icon_component_overlay.html.erb +33 -13
  5. data/app/pb_kits/playbook/pb_avatar/docs/_avatar_circle_icon_component_overlay.jsx +67 -48
  6. data/app/pb_kits/playbook/pb_avatar/docs/_avatar_default.jsx +20 -0
  7. data/app/pb_kits/playbook/pb_avatar/docs/example.yml +2 -2
  8. data/app/pb_kits/playbook/pb_card/docs/_card_background.html.erb +0 -20
  9. data/app/pb_kits/playbook/pb_card/docs/_card_background.jsx +1 -41
  10. data/app/pb_kits/playbook/pb_card/docs/_card_background.md +1 -1
  11. data/app/pb_kits/playbook/pb_card/docs/_card_header.html.erb +1 -1
  12. data/app/pb_kits/playbook/pb_card/docs/_card_header.md +1 -1
  13. data/app/pb_kits/playbook/pb_card/docs/_card_highlight.md +1 -1
  14. data/app/pb_kits/playbook/pb_collapsible/docs/example.yml +0 -7
  15. data/app/pb_kits/playbook/pb_collapsible/docs/index.js +1 -3
  16. data/app/pb_kits/playbook/pb_date_range_inline/docs/example.yml +1 -4
  17. data/app/pb_kits/playbook/pb_date_stacked/docs/example.yml +0 -7
  18. data/app/pb_kits/playbook/pb_date_time/docs/example.yml +0 -6
  19. data/app/pb_kits/playbook/pb_date_year_stacked/docs/example.yml +0 -4
  20. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.html.erb +3 -3
  21. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_default.md +1 -1
  22. data/app/pb_kits/playbook/pb_dropdown/docs/{_dropdown_subcomponent_structure_rails.html.erb → _dropdown_subcomponent_structure.html.erb} +3 -3
  23. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subcomponent_structure.md +6 -5
  24. data/app/pb_kits/playbook/pb_dropdown/docs/{_dropdown_with_custom_display_rails.html.erb → _dropdown_with_custom_display.html.erb} +6 -11
  25. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display.jsx +3 -6
  26. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display.md +3 -3
  27. data/app/pb_kits/playbook/pb_dropdown/docs/{_dropdown_with_custom_options_rails.html.erb → _dropdown_with_custom_options.html.erb} +11 -16
  28. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_options.jsx +2 -5
  29. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_options.md +1 -1
  30. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_padding.html.erb +3 -3
  31. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_padding.md +1 -1
  32. data/app/pb_kits/playbook/pb_dropdown/docs/{_dropdown_with_custom_trigger_rails.html.erb → _dropdown_with_custom_trigger.html.erb} +11 -16
  33. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_trigger.jsx +2 -5
  34. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_trigger.md +1 -1
  35. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_label.html.erb +3 -3
  36. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_label.md +1 -1
  37. data/app/pb_kits/playbook/pb_dropdown/docs/example.yml +6 -6
  38. data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/example.yml +0 -9
  39. data/app/pb_kits/playbook/pb_form/docs/_form_form_with.html.erb +1 -1
  40. data/app/pb_kits/playbook/pb_form/docs/_form_form_with_validate.html.erb +1 -1
  41. data/dist/app/components/playbook/pb_docs/kit_example.html.erb +3 -3
  42. data/dist/menu.yml +2 -2
  43. data/dist/playbook-doc.js +6 -6
  44. metadata +6 -40
  45. data/app/pb_kits/playbook/pb_avatar/docs/_avatar_badge_component_overlay.md +0 -3
  46. data/app/pb_kits/playbook/pb_avatar/docs/_avatar_circle_icon_component_overlay.md +0 -3
  47. data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_custom_main.jsx +0 -72
  48. data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_custom_main.md +0 -3
  49. data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_custom_main_rails.html.erb +0 -19
  50. data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_custom_main_rails.md +0 -3
  51. data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_custom_main_with_icon.jsx +0 -73
  52. data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_custom_main_with_icon.md +0 -3
  53. data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_custom_main_with_icon_rails.html.erb +0 -20
  54. data/app/pb_kits/playbook/pb_collapsible/docs/_collapsible_custom_main_with_icon_rails.md +0 -3
  55. data/app/pb_kits/playbook/pb_date_range_inline/docs/_date_range_inline_default_swift.md +0 -61
  56. data/app/pb_kits/playbook/pb_date_range_inline/docs/_date_range_inline_props_swift.md +0 -11
  57. data/app/pb_kits/playbook/pb_date_stacked/docs/_date_stacked_bold_swift.md +0 -32
  58. data/app/pb_kits/playbook/pb_date_stacked/docs/_date_stacked_default_swift.md +0 -17
  59. data/app/pb_kits/playbook/pb_date_stacked/docs/_date_stacked_not_current_year_swift.md +0 -19
  60. data/app/pb_kits/playbook/pb_date_stacked/docs/_date_stacked_props_swift.md +0 -10
  61. data/app/pb_kits/playbook/pb_date_stacked/docs/_date_stacked_reversed_swift.md +0 -17
  62. data/app/pb_kits/playbook/pb_date_time/docs/_date_time_alignment_swift.md +0 -39
  63. data/app/pb_kits/playbook/pb_date_time/docs/_date_time_default_swift.md +0 -39
  64. data/app/pb_kits/playbook/pb_date_time/docs/_date_time_props_swift.md +0 -15
  65. data/app/pb_kits/playbook/pb_date_time/docs/_date_time_size_swift.md +0 -78
  66. data/app/pb_kits/playbook/pb_date_year_stacked/docs/_date_year_stacked_default_swift.md +0 -20
  67. data/app/pb_kits/playbook/pb_date_year_stacked/docs/_date_year_stacked_props_swift.md +0 -6
  68. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_subcomponent_structure_rails.md +0 -6
  69. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display_rails.md +0 -5
  70. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_options_rails.md +0 -1
  71. data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_trigger_rails.md +0 -1
  72. data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_children_swift.md +0 -23
  73. data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_close_swift.md +0 -7
  74. data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_default_swift.md +0 -9
  75. data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_dismiss_with_timer_swift.md +0 -22
  76. data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_multi_line_swift.md +0 -9
  77. data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_positions_swift.md +0 -62
  78. data/app/pb_kits/playbook/pb_fixed_confirmation_toast/docs/_fixed_confirmation_toast_props_swift.md +0 -8
@@ -1,78 +0,0 @@
1
- ![Date-Time-Sizes](https://github.com/powerhome/playbook-swift/assets/54749071/59b2394d-cf25-46b5-a634-ca0721a7b3b0)
2
- ```swift
3
- VStack(alignment: .leading, spacing: Spacing.xSmall) {
4
- PBDateTime(
5
- dateVariant: .dayDate(showYear: false),
6
- timeVariant: .iconTimeZone,
7
- fontSize: .caption,
8
- zone: .utc,
9
- showTimeZone: true,
10
- timeZoneIdentifier: "2012-08-02T17:49:29Z",
11
- showIcon: true
12
- )
13
- PBDateTime(
14
- dateVariant: .dayDate(showYear: false),
15
- timeVariant: .iconTimeZone,
16
- fontSize: .caption,
17
- zone: .utc,
18
- showTimeZone: true,
19
- timeZoneIdentifier: "2012-08-02T17:49:29Z"
20
- )
21
- PBDateTime(
22
- dateVariant: .short(showIcon: false),
23
- timeVariant: .iconTimeZone,
24
- fontSize: .caption,
25
- zone: .utc,
26
- showTimeZone: true,
27
- timeZoneIdentifier: "2012-08-02T17:49:29Z",
28
- showIcon: true
29
- )
30
- PBDateTime(
31
- dateVariant: .short(showIcon: false),
32
- timeVariant: .iconTimeZone,
33
- fontSize: .caption,
34
- zone: .utc,
35
- showTimeZone: true,
36
- timeZoneIdentifier: "2012-08-02T17:49:29Z"
37
- )
38
- Spacer()
39
- PBDateTime(
40
- dateVariant: .dayDate(showYear: false),
41
- timeVariant: .iconTimeZone,
42
- isLowercase: true,
43
- isTimeBold: true,
44
- zone: .utc,
45
- showTimeZone: true,
46
- timeZoneIdentifier: "2012-08-02T17:49:29Z",
47
- showIcon: true
48
- )
49
- PBDateTime(
50
- dateVariant: .dayDate(showYear: false),
51
- timeVariant: .iconTimeZone,
52
- isLowercase: true,
53
- isTimeBold: true,
54
- zone: .utc,
55
- showTimeZone: true,
56
- timeZoneIdentifier: "2012-08-02T17:49:29Z"
57
- )
58
- PBDateTime(
59
- dateVariant: .short(showIcon: false),
60
- timeVariant: .iconTimeZone,
61
- isLowercase: true,
62
- isTimeBold: true,
63
- zone: .utc,
64
- showTimeZone: true,
65
- timeZoneIdentifier: "2012-08-02T17:49:29Z",
66
- showIcon: true
67
- )
68
- PBDateTime(
69
- dateVariant: .short(showIcon: false),
70
- timeVariant: .iconTimeZone,
71
- isLowercase: true,
72
- isTimeBold: true,
73
- zone: .utc,
74
- showTimeZone: true,
75
- timeZoneIdentifier: "2012-08-02T17:49:29Z"
76
- )
77
- }
78
- ```
@@ -1,20 +0,0 @@
1
- ![Date-Year-Stacked-Default](https://github.com/powerhome/playbook-swift/assets/54749071/997c9389-669a-42d4-b4af-661d546024b9)
2
- ```swift
3
- VStack(alignment: .leading, spacing: Spacing.small) {
4
- PBDateYearStacked(
5
- date: Date(),
6
- alignment: .leading
7
- )
8
- .frame(maxWidth: .infinity, alignment: .leading)
9
- PBDateYearStacked(
10
- date: Date(),
11
- alignment: .center
12
- )
13
- .frame(maxWidth: .infinity, alignment: .center)
14
- PBDateYearStacked(
15
- date: Date(),
16
- alignment: .trailing
17
- )
18
- .frame(maxWidth: .infinity, alignment: .trailing)
19
- }
20
- ```
@@ -1,6 +0,0 @@
1
- ### Props
2
- | Name | Type | Description | Default | Values |
3
- | --- | ----------- | --------- | --------- | --------- |
4
- | **date** | `Date()` |Sets the size of the date | `Date()` | |
5
- | **alignment** | `HorizontalAlignment` | Changes the alignment of the date | `.leading` | `.leading` `.trailing` |
6
- | **variant** | `PBDate.Variant` | Boolean value that determines whether or not the month and date are reversed. | `.standard` | `short(showIcon: Bool)`, `standard`, `dayDate(showYear: Bool)`, `withIcon(isStandard: Bool)` |
@@ -1,6 +0,0 @@
1
- The dropdown is built using all of the following required subcomponents:
2
-
3
- `dropdown/dropdown_trigger` is the UI component that users interact with to toggle the dropdown.
4
- `dropdown/dropdown_container` is the floating container that wraps the list of dropdown options.
5
- `dropdown/dropdown_option` renders options that are passed to the container.
6
- Each of these subcomponents can be altered using global props and/or their respective props. See doc examples below for more information on each.
@@ -1,5 +0,0 @@
1
- Optionally utilize `custom_display` on the `dropdown/dropdown_trigger` subcomponent to customize its content after an option is selected. The component passed to custom_display will be rendered to the left of the default text-based display. In this example the Avatar kit is being used.
2
-
3
- The `placeholder` prop can also be used to customize the placeholder text for the default `dropdown/dropdown_trigger`.
4
-
5
- The dropdown follows the typical rails pattern of utilizing hidden inputs for form submission. The hidden input value is the selected options' id.
@@ -1 +0,0 @@
1
- `dropdown/dropdown_option` subcomponent accepts any child components to customize the options' contents and display. By default, options are Body kit text that is set by the `label` value from the `option` object.
@@ -1 +0,0 @@
1
- Optionally replace the default trigger's select element by passing child components directly to the `dropdown/dropdown_trigger`.
@@ -1,23 +0,0 @@
1
- ![Children-Toast](https://github.com/powerhome/playbook-swift/assets/54749071/55aebd12-43c4-4061-92d3-6aebb07ff349)
2
-
3
- ```swift
4
- VStack(alignment: .leading) {
5
- PBToast(
6
- text: message,
7
- variant: .success,
8
- actionView: .custom(AnyView(Text("Undo").pbFont(.title4, color: .white))),
9
- dismissAction: closeToast
10
- )
11
- PBToast(
12
- variant: .custom(nil, .pbPrimary),
13
- actionView: .custom(
14
- AnyView(
15
- HStack {
16
- Text("Undo action").pbFont(.caption, color: .white)
17
- PBButton(variant: .primary, title: "Undo").disabled(true)
18
- }
19
- )),
20
- dismissAction: closeToast
21
- )
22
- }
23
- ```
@@ -1,7 +0,0 @@
1
- ```swift
2
- VStack(alignment: .leading) {
3
- PBToast(text: "Error Message", variant: .error, actionView: .default, dismissAction: closeToast)
4
- PBToast(text: "Items Successfully Moved", variant: .success, actionView: .default, dismissAction: closeToast)
5
- PBToast(text: "Scan to Assign Selected Items", variant: .neutral, actionView: .default, dismissAction: closeToast)
6
- }
7
- ```
@@ -1,9 +0,0 @@
1
- ![Default-Toast](https://github.com/powerhome/playbook-swift/assets/54749071/cc465b1b-85ba-4492-a832-b06b842a1555)
2
-
3
- ```swift
4
- VStack(alignment: .leading) {
5
- PBToast(text: "Error Message", variant: .error, dismissAction: closeToast)
6
- PBToast(text: "Items Successfully Moved", variant: .success, dismissAction: closeToast)
7
- PBToast(text: "Scan to Assign Selected Items", variant: .neutral, dismissAction: closeToast)
8
- }
9
- ```
@@ -1,22 +0,0 @@
1
- ```swift
2
- HStack {
3
- PBButton(variant: .secondary, title: "Top Center") {
4
- position = .top
5
- toastView = PBToast(
6
- text: "Top Center",
7
- variant: .neutral,
8
- actionView: .withTimer(3),
9
- dismissAction: closeToast
10
- )
11
- }
12
- PBButton(variant: .secondary, title: "Bottom Center") {
13
- position = .bottom
14
- toastView = PBToast(
15
- text: "Bottom Center",
16
- variant: .neutral,
17
- actionView: .withTimer(2),
18
- dismissAction: closeToast
19
- )
20
- }
21
- }
22
- ```
@@ -1,9 +0,0 @@
1
- ![Multiline-Toast](https://github.com/powerhome/playbook-swift/assets/54749071/df7bb8da-89ee-477e-8001-7262e48ce03a)
2
-
3
- ```swift
4
- PBToast(
5
- text: message,
6
- variant: .custom(.infoCircle, .pbPrimary),
7
- dismissAction: closeToast
8
- )
9
- ```
@@ -1,62 +0,0 @@
1
- ```swift
2
- GridRow {
3
- PBButton(variant: .secondary, title: "Top Left") {
4
- position = .topLeft
5
- toastView = PBToast(
6
- text: "Top Left",
7
- variant: .neutral,
8
- actionView: .default,
9
- dismissAction: closeToast
10
- )
11
- }
12
- PBButton(variant: .secondary, title: "Top Right") {
13
- position = .topRight
14
- toastView = PBToast(
15
- text: "Top Right",
16
- variant: .neutral,
17
- actionView: .default,
18
- dismissAction: closeToast
19
- )
20
- }
21
- }
22
- GridRow {
23
- PBButton(variant: .secondary, title: "Top Center") {
24
- position = .top
25
- toastView = PBToast(
26
- text: "Top Center",
27
- variant: .neutral,
28
- actionView: .default,
29
- dismissAction: closeToast
30
- )
31
- }
32
- PBButton(variant: .secondary, title: "Bottom Center") {
33
- position = .bottom
34
- toastView = PBToast(
35
- text: "Bottom Center",
36
- variant: .custom(.user, .status(.neutral)),
37
- actionView: .default,
38
- dismissAction: closeToast
39
- )
40
- }
41
- }
42
- GridRow {
43
- PBButton(variant: .secondary, title: "Bottom Left") {
44
- position = .bottomLeft
45
- toastView = PBToast(
46
- text: "Bottom Left",
47
- variant: .custom(.user, .status(.neutral)),
48
- actionView: .default,
49
- dismissAction: closeToast
50
- )
51
- }
52
- PBButton(variant: .secondary, title: "Bottom Right") {
53
- position = .bottomRight
54
- toastView = PBToast(
55
- text: "Bottom Right",
56
- variant: .custom(.user, .status(.neutral)),
57
- actionView: .default,
58
- dismissAction: closeToast
59
- )
60
- }
61
- }
62
- ```
@@ -1,8 +0,0 @@
1
- ### Props
2
- | Name | Type | Description | Default | Values |
3
- | --- | ----------- | --------- | --------- | --------- |
4
- | **text** | `String` |`Value for the toast message` | `nil` | |
5
- | **variant** | `Variant` | `Determines the type pf toast message being displayed` | `.custom()` | `error`, `success`,
6
- `neutral`, `custom()` |
7
- | **actionView** | `dismissAction` | Dismisses the toast message | `.default` | `default` `custom()` `withTimer()` |
8
- | **dismissAction** | `(() -> Void)` | `Triggers the dismiss action` | | |