playbook_ui_docs 15.1.0.pre.alpha.play252710946 → 15.1.0.pre.alpha.testingtiptap11004

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 (11) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/pb_dialog/docs/_dialog_stacked_alert.html.erb +16 -16
  3. data/app/pb_kits/playbook/pb_dialog/docs/_dialog_stacked_alert.jsx +2 -1
  4. data/app/pb_kits/playbook/pb_dialog/docs/_dialog_status.html.erb +31 -31
  5. data/app/pb_kits/playbook/pb_dialog/docs/_dialog_status.jsx +4 -3
  6. data/app/pb_kits/playbook/pb_form/docs/_form_form_with_validate.html.erb +1 -12
  7. data/app/pb_kits/playbook/pb_text_input/docs/_text_input_default.html.erb +8 -4
  8. data/app/pb_kits/playbook/pb_text_input/docs/_text_input_default.jsx +5 -0
  9. data/app/pb_kits/playbook/pb_text_input/docs/_text_input_default.md +1 -0
  10. data/dist/playbook-doc.js +2 -2
  11. metadata +3 -2
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: ba871c739875f28a67034dae55927445ea665ca0c4b6908c850bda1bc4305bfb
4
- data.tar.gz: 90773204906e130d004f324ff0ab9fe1122bf4448c5a74e34bb2e91e8e5770c5
3
+ metadata.gz: 9cbabbeda6bae750e0d9e8dd9655ce98d221bb6a38e4c568b12d8b4d21996dbf
4
+ data.tar.gz: 02e7328097c463a3d39b5d2273d5603abe30d00c7bdd4259e9580b03fa357866
5
5
  SHA512:
6
- metadata.gz: a5a0308f5d22f4761dcb2fffaa577580091dfed97208923423149078f53f2c6bca01227c33887ed3db590a31f5d5ca1007fea5ff24909be184468690a53df911
7
- data.tar.gz: e52fddeaa05e7a315349f954f00e647ab94d58f00973b6b181c1330d668cc7c2a0b26c73d80381948d2552c2dd933f645496f448ddc7fb05d9dc9c4fcd678b1e
6
+ metadata.gz: 5a3ee95c22bff5171e5eedb58a8e1fce9d8de6eae65c40460b6ca2c1575cca9b6ff9b3eda7ca1c3a9707f3c364ba74b5242b1f5133c060dee3ef7d31212cc19c
7
+ data.tar.gz: 5d25afe99898f1928c42c8c9b058086a8dbe736fb74d837a8a16378eecf0b0ec56ffe432503d4eb12f9eb32075d7ffb6ea1360f8fae488cbf53a2bea7a6c41d1
data/app/pb_kits/playbook/pb_dialog/docs/_dialog_stacked_alert.html.erb CHANGED
@@ -3,12 +3,12 @@
3
3
  <%= pb_rails("button", props: { text: "Delete Status", data: {"open-dialog": "dialog-stacked-delete"}, margin_right: "md" }) %>
4
4
 
5
5
 
6
- <%= pb_rails("dialog", props: {
7
- id:"dialog-stacked-default",
6
+ <%= pb_rails("dialog", props: {
7
+ id:"dialog-stacked-default",
8
8
  status: "default",
9
- size: "sm",
10
- title: "Are you sure?",
11
- text: "Text explaining why there is an alert",
9
+ size: "sm",
10
+ title: "Are you sure?",
11
+ text: "Text explaining why there is an alert",
12
12
  }) do %>
13
13
  <%= pb_rails("dialog/dialog_footer") do %>
14
14
  <%= pb_rails("flex", props: { orientation: "column", padding_x:"md", padding: "sm" }) do %>
@@ -18,12 +18,12 @@
18
18
  <% end %>
19
19
  <% end %>
20
20
 
21
- <%= pb_rails("dialog", props: {
22
- id:"dialog-stacked-caution",
21
+ <%= pb_rails("dialog", props: {
22
+ id:"dialog-stacked-caution",
23
23
  status: "caution",
24
- size: "sm",
25
- title: "Are you sure?",
26
- text: "This is the action you will be taking",
24
+ size: "sm",
25
+ title: "Are you sure?",
26
+ text: "This is the action you will be taking",
27
27
  }) do %>
28
28
  <%= pb_rails("dialog/dialog_footer") do %>
29
29
  <%= pb_rails("flex", props: { orientation: "column", padding_x:"md", padding: "sm" }) do %>
@@ -33,16 +33,16 @@
33
33
  <% end %>
34
34
  <% end %>
35
35
 
36
- <%= pb_rails("dialog", props: {
37
- id:"dialog-stacked-delete",
36
+ <%= pb_rails("dialog", props: {
37
+ id:"dialog-stacked-delete",
38
38
  status: "delete",
39
- size: "sm",
40
- title: "Delete",
41
- text: "You are about to delete ...",
39
+ size: "sm",
40
+ title: "Delete",
41
+ text: "You are about to delete ...",
42
42
  }) do %>
43
43
  <%= pb_rails("dialog/dialog_footer") do %>
44
44
  <%= pb_rails("flex", props: { orientation: "column", padding_x:"md", padding: "sm" }) do %>
45
- <%= pb_rails("button", props: { text: "Yes, Action", full_width: true }) %>
45
+ <%= pb_rails("button", props: { text: "Yes, Action", variant: "danger", full_width: true }) %>
46
46
  <%= pb_rails("button", props: { text: "No, Cancel", variant: "secondary", full_width: true, margin_top: "sm", data: {"close-dialog": "dialog-stacked-delete" } }) %>
47
47
  <% end %>
48
48
  <% end %>
data/app/pb_kits/playbook/pb_dialog/docs/_dialog_stacked_alert.jsx CHANGED
@@ -51,7 +51,7 @@ const DialogStackedAlert = () => {
51
51
  return (
52
52
  <div>
53
53
  <Flex
54
- rowGap="xs"
54
+ rowGap="xs"
55
55
  wrap
56
56
  >
57
57
  <Button
@@ -93,6 +93,7 @@ const DialogStackedAlert = () => {
93
93
  <Button
94
94
  fullWidth
95
95
  onClick={dialog.toggle}
96
+ variant= {dialog.status == "delete" ? "danger" : "primary"}
96
97
  >
97
98
  {dialog.buttonOneText}
98
99
  </Button>
data/app/pb_kits/playbook/pb_dialog/docs/_dialog_status.html.erb CHANGED
@@ -8,12 +8,12 @@
8
8
  <%= pb_rails("button", props: { text: "Success Status", data: {"open-dialog": "dialog-status-success"}, margin_right: "md" }) %>
9
9
  <% end %>
10
10
 
11
- <%= pb_rails("dialog", props: {
12
- id:"dialog-status-default",
11
+ <%= pb_rails("dialog", props: {
12
+ id:"dialog-status-default",
13
13
  status: "default",
14
- size: "status_size",
15
- title: "Are you sure?",
16
- text: "Text explaining why there is an alert",
14
+ size: "status_size",
15
+ title: "Are you sure?",
16
+ text: "Text explaining why there is an alert",
17
17
  }) do %>
18
18
  <%= pb_rails("dialog/dialog_footer") do %>
19
19
  <%= pb_rails("flex", props: { spacing:"between", padding_x:"md", padding_bottom:"md", padding: "sm" }) do %>
@@ -23,12 +23,12 @@
23
23
  <% end %>
24
24
  <% end %>
25
25
 
26
- <%= pb_rails("dialog", props: {
27
- id:"dialog-status-info",
26
+ <%= pb_rails("dialog", props: {
27
+ id:"dialog-status-info",
28
28
  status: "info",
29
- size: "status_size",
30
- title: "Information",
31
- text: "Text explaining why there is an alert",
29
+ size: "status_size",
30
+ title: "Information",
31
+ text: "Text explaining why there is an alert",
32
32
  }) do %>
33
33
  <%= pb_rails("dialog/dialog_footer") do %>
34
34
  <%= pb_rails("flex", props: { spacing:"between", padding_x:"md", padding_bottom:"md", padding: "sm" }) do %>
@@ -37,12 +37,12 @@
37
37
  <% end %>
38
38
  <% end %>
39
39
 
40
- <%= pb_rails("dialog", props: {
41
- id:"dialog-status-caution",
40
+ <%= pb_rails("dialog", props: {
41
+ id:"dialog-status-caution",
42
42
  status: "caution",
43
- size: "status_size",
44
- title: "Are you Sure?",
45
- text: "This is the action you will be taking",
43
+ size: "status_size",
44
+ title: "Are you Sure?",
45
+ text: "This is the action you will be taking",
46
46
  }) do %>
47
47
  <%= pb_rails("dialog/dialog_footer") do %>
48
48
  <%= pb_rails("flex", props: { spacing:"between", padding_x:"md", padding_bottom:"md", padding: "sm" }) do %>
@@ -52,27 +52,27 @@
52
52
  <% end %>
53
53
  <% end %>
54
54
 
55
- <%= pb_rails("dialog", props: {
56
- id:"dialog-status-delete",
55
+ <%= pb_rails("dialog", props: {
56
+ id:"dialog-status-delete",
57
57
  status: "delete",
58
- size: "status_size",
59
- title: "Delete",
60
- text: "You are about to delete ...",
58
+ size: "status_size",
59
+ title: "Delete",
60
+ text: "You are about to delete ...",
61
61
  }) do %>
62
62
  <%= pb_rails("dialog/dialog_footer") do %>
63
63
  <%= pb_rails("flex", props: { spacing:"between", padding_x:"md", padding_bottom:"md", padding: "sm" }) do %>
64
- <%= pb_rails("button", props: { text: "Yes, Delete" }) %>
64
+ <%= pb_rails("button", props: { text: "Yes, Delete", variant: "danger" }) %>
65
65
  <%= pb_rails("button", props: { text: "No, Cancel", variant: "secondary", data: {"close-dialog": "dialog-status-delete" } }) %>
66
66
  <% end %>
67
67
  <% end %>
68
68
  <% end %>
69
69
 
70
- <%= pb_rails("dialog", props: {
71
- id:"dialog-status-error",
70
+ <%= pb_rails("dialog", props: {
71
+ id:"dialog-status-error",
72
72
  status: "error",
73
- size: "status_size",
74
- title: "Error Message",
75
- text: "Text explaining the error",
73
+ size: "status_size",
74
+ title: "Error Message",
75
+ text: "Text explaining the error",
76
76
  }) do %>
77
77
  <%= pb_rails("dialog/dialog_footer") do %>
78
78
  <%= pb_rails("flex", props: { spacing:"between", padding_x:"md", padding_bottom:"md", padding: "sm" }) do %>
@@ -81,12 +81,12 @@
81
81
  <% end %>
82
82
  <% end %>
83
83
 
84
- <%= pb_rails("dialog", props: {
85
- id:"dialog-status-success",
84
+ <%= pb_rails("dialog", props: {
85
+ id:"dialog-status-success",
86
86
  status: "success",
87
- size: "status_size",
88
- title: "Success!",
89
- text: "Text explaining what is successful",
87
+ size: "status_size",
88
+ title: "Success!",
89
+ text: "Text explaining what is successful",
90
90
  }) do %>
91
91
  <%= pb_rails("dialog/dialog_footer") do %>
92
92
  <%= pb_rails("flex", props: { spacing:"between", padding_x:"md", padding_bottom:"md", padding: "sm" }) do %>
data/app/pb_kits/playbook/pb_dialog/docs/_dialog_status.jsx CHANGED
@@ -83,8 +83,8 @@ const DialogStatus = () => {
83
83
 
84
84
  return (
85
85
  <div>
86
- <Flex
87
- rowGap="xs"
86
+ <Flex
87
+ rowGap="xs"
88
88
  wrap
89
89
  >
90
90
  <Button
@@ -117,7 +117,7 @@ const DialogStatus = () => {
117
117
  >
118
118
  {"Success Status"}
119
119
  </Button>
120
- <Button
120
+ <Button
121
121
  marginRight="md"
122
122
  onClick={toggleErrorAlert}
123
123
  >
@@ -152,6 +152,7 @@ const DialogStatus = () => {
152
152
  <Button
153
153
  onClick={dialog.toggle}
154
154
  paddingRight="xl"
155
+ variant={dialog.status == "delete" ? "danger" : "primary"}
155
156
  >
156
157
  {dialog.buttonOneText}
157
158
  </Button>
data/app/pb_kits/playbook/pb_form/docs/_form_form_with_validate.html.erb CHANGED
@@ -21,15 +21,6 @@
21
21
  ]
22
22
  %>
23
23
 
24
- <%
25
- example_typeahead_options = [
26
- { label: 'Orange', value: '#FFA500' },
27
- { label: 'Red', value: '#FF0000' },
28
- { label: 'Green', value: '#00FF00' },
29
- { label: 'Blue', value: '#0000FF' },
30
- ]
31
- %>
32
-
33
24
  <% treeData = [{
34
25
  label: "Power Home Remodeling",
35
26
  value: "Power Home Remodeling",
@@ -97,9 +88,7 @@
97
88
  }] %>
98
89
 
99
90
  <%= pb_form_with(scope: :example, method: :get, url: "", validate: true) do |form| %>
100
- <%= form.typeahead :example_typeahead_validation_rails, props: { data: { typeahead_example2: true, user: {} }, label: true, placeholder: "Search for a user", required: true, validation: { message: "Please select a user." } } %>
101
- <%= form.typeahead :example_typeahead_validation, props: { options: example_typeahead_options, pills: true, label: "Example Typeahead (React Rendered)", placeholder: "Search for a user", required: true, validation: { message: "Please select a color." } } %>
102
- <%= form.typeahead :example_typeahead_validation_2, props: { options: example_typeahead_options, pills: true, label: "Example Typeahead 2 (React Rendered)", placeholder: "Search for a user", required: true } %>
91
+ <%= form.typeahead :example_typeahead_validation, props: { data: { typeahead_example2: true, user: {} }, label: true, placeholder: "Search for a user", required: true, validation: { message: "Please select a user." } } %>
103
92
  <%= form.text_field :example_text_field_validation, props: { label: true, required: true } %>
104
93
  <%= form.phone_number_field :example_phone_number_field_validation, props: { label: "Example phone field", hidden_inputs: true } %>
105
94
  <%= form.email_field :example_email_field_validation, props: { label: true, required: true } %>
data/app/pb_kits/playbook/pb_text_input/docs/_text_input_default.html.erb CHANGED
@@ -9,23 +9,27 @@
9
9
 
10
10
  <%= pb_rails("text_input", props: {
11
11
  label: "Last Name",
12
- placeholder: "Enter last name"
12
+ placeholder: "Enter last name",
13
+ id: "last-name"
13
14
  }) %>
14
15
 
15
16
  <%= pb_rails("text_input", props: {
16
17
  label: "Phone Number",
17
18
  type: "phone",
18
- placeholder: "Enter phone number"
19
+ placeholder: "Enter phone number",
20
+ id: "phone"
19
21
  }) %>
20
22
 
21
23
  <%= pb_rails("text_input", props: {
22
24
  label: "Email Address",
23
25
  type: "email",
24
- placeholder: "Enter email address"
26
+ placeholder: "Enter email address",
27
+ id: "email"
25
28
  }) %>
26
29
 
27
30
  <%= pb_rails("text_input", props: {
28
31
  label: "Zip Code",
29
32
  type: "number",
30
- placeholder: "Enter zip code"
33
+ placeholder: "Enter zip code",
34
+ id: "zip"
31
35
  }) %>
data/app/pb_kits/playbook/pb_text_input/docs/_text_input_default.jsx CHANGED
@@ -38,6 +38,7 @@ const TextInputDefault = (props) => {
38
38
  {...props}
39
39
  />
40
40
  <TextInput
41
+ id="last-name"
41
42
  label="Last Name"
42
43
  name="lastName"
43
44
  onChange={handleOnChangeFormField}
@@ -46,6 +47,7 @@ const TextInputDefault = (props) => {
46
47
  {...props}
47
48
  />
48
49
  <TextInput
50
+ id="phone"
49
51
  label="Phone Number"
50
52
  name="phone"
51
53
  onChange={handleOnChangeFormField}
@@ -55,6 +57,7 @@ const TextInputDefault = (props) => {
55
57
  {...props}
56
58
  />
57
59
  <TextInput
60
+ id="email"
58
61
  label="Email Address"
59
62
  name="email"
60
63
  onChange={handleOnChangeFormField}
@@ -64,6 +67,7 @@ const TextInputDefault = (props) => {
64
67
  {...props}
65
68
  />
66
69
  <TextInput
70
+ id="zip"
67
71
  label="Zip Code"
68
72
  name="zip"
69
73
  onChange={handleOnChangeFormField}
@@ -84,6 +88,7 @@ const TextInputDefault = (props) => {
84
88
  <br />
85
89
 
86
90
  <TextInput
91
+ id="first-name"
87
92
  label="First Name"
88
93
  onChange={handleOnChangeFirstName}
89
94
  placeholder="Enter first name"
data/app/pb_kits/playbook/pb_text_input/docs/_text_input_default.md ADDED
@@ -0,0 +1 @@
1
+ Add an `id` to your Text Input so that clicking the label will move focus directly to the input.