playbook_ui 14.18.0 → 14.19.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.
- checksums.yaml +4 -4
- data/app/pb_kits/playbook/pb_circle_chart/_circle_chart.tsx +1 -1
- data/app/pb_kits/playbook/pb_circle_chart/circleChart.test.js +2 -2
- data/app/pb_kits/playbook/pb_circle_chart/circleChartTheme.ts +53 -0
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_block.html.erb +2 -2
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_block.jsx +1 -1
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_colors.html.erb +1 -1
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_colors.jsx +1 -1
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_custom_tooltip.html.erb +1 -1
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_custom_tooltip.jsx +1 -1
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_default.html.erb +1 -1
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_default.jsx +1 -1
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_legend_position.html.erb +1 -1
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_legend_position.jsx +1 -1
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_live_data.jsx +2 -2
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_pb_styles.jsx +38 -0
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_pb_styles.md +1 -0
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_rounded.html.erb +1 -1
- data/app/pb_kits/playbook/pb_circle_chart/docs/_circle_chart_rounded.jsx +1 -1
- data/app/pb_kits/playbook/pb_circle_chart/docs/example.yml +2 -3
- data/app/pb_kits/playbook/pb_circle_chart/docs/index.js +2 -1
- data/app/pb_kits/playbook/pb_date_picker/_date_picker.tsx +12 -0
- data/app/pb_kits/playbook/pb_date_picker/date_picker.rb +12 -0
- data/app/pb_kits/playbook/pb_date_picker/date_picker_helper.ts +50 -1
- data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_error.jsx +4 -1
- data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_quick_pick_rails.md +4 -0
- data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_quick_pick_range_limit.md +1 -1
- data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_quick_pick_react.md +5 -1
- data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range_pattern.jsx +34 -0
- data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range_pattern.md +14 -0
- data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range_pattern_rails.html.erb +20 -0
- data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_range_pattern_rails.md +14 -0
- data/app/pb_kits/playbook/pb_date_picker/docs/example.yml +2 -0
- data/app/pb_kits/playbook/pb_date_picker/docs/index.js +1 -0
- data/app/pb_kits/playbook/pb_date_picker/plugins/quickPick.tsx +10 -0
- data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_error.jsx +4 -1
- data/app/pb_kits/playbook/pb_gauge/docs/_gauge_pb_styles.jsx +0 -1
- data/app/pb_kits/playbook/pb_gauge/gaugeTheme.ts +3 -1
- data/app/pb_kits/playbook/pb_phone_number_input/docs/_phone_number_input_validation.jsx +8 -1
- data/app/pb_kits/playbook/pb_select/docs/_select_error.jsx +7 -2
- data/app/pb_kits/playbook/pb_text_input/docs/_text_input_error.jsx +9 -1
- data/app/pb_kits/playbook/pb_textarea/docs/_textarea_error.jsx +7 -1
- data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_error_state.jsx +6 -2
- data/dist/chunks/{_typeahead-C_FX7o_S.js → _typeahead-BX8IifKY.js} +2 -2
- data/dist/chunks/_weekday_stacked-DfMD7HJz.js +45 -0
- data/dist/chunks/lazysizes-B7xYodB-.js +1 -0
- data/dist/chunks/lib-96_ZmvAo.js +29 -0
- data/dist/chunks/{pb_form_validation-BRjyJrKh.js → pb_form_validation-Vv2TqXVC.js} +1 -1
- data/dist/chunks/vendor.js +1 -1
- data/dist/playbook-doc.js +2 -2
- data/dist/playbook-rails-react-bindings.js +1 -1
- data/dist/playbook-rails.js +1 -1
- data/lib/playbook/version.rb +2 -2
- metadata +14 -7
- data/dist/chunks/_weekday_stacked-B4RLTeDo.js +0 -45
- data/dist/chunks/lazysizes-DHz07jlL.js +0 -1
- data/dist/chunks/lib-ySl8uEpT.js +0 -29
@@ -3,6 +3,7 @@ import React, { useEffect, useState } from "react";
|
|
3
3
|
import Button from '../../pb_button/_button'
|
4
4
|
import FixedConfirmationToast from '../../pb_fixed_confirmation_toast/_fixed_confirmation_toast'
|
5
5
|
import PhoneNumberInput from '../../pb_phone_number_input/_phone_number_input'
|
6
|
+
import Icon from '../../pb_icon/_icon'
|
6
7
|
|
7
8
|
const PhoneNumberInputValidation = (props) => {
|
8
9
|
const [formErrors, setFormErrors] = useState("");
|
@@ -29,6 +30,12 @@ const PhoneNumberInputValidation = (props) => {
|
|
29
30
|
setShowFormErrors(formErrors.length > 0);
|
30
31
|
}, [formErrors]);
|
31
32
|
|
33
|
+
const error = (
|
34
|
+
<>
|
35
|
+
<Icon icon="warning" /> Missing phone number.
|
36
|
+
</>
|
37
|
+
)
|
38
|
+
|
32
39
|
return (
|
33
40
|
<form
|
34
41
|
action=""
|
@@ -43,7 +50,7 @@ const PhoneNumberInputValidation = (props) => {
|
|
43
50
|
/>
|
44
51
|
)}
|
45
52
|
<PhoneNumberInput
|
46
|
-
error=
|
53
|
+
error={error}
|
47
54
|
id="validation"
|
48
55
|
initialCountry={countryCode}
|
49
56
|
onChange={handleOnChange}
|
@@ -1,6 +1,7 @@
|
|
1
1
|
import React from 'react'
|
2
2
|
import Body from '../../pb_body/_body'
|
3
3
|
import Select from '../../pb_select/_select'
|
4
|
+
import Icon from '../../pb_icon/_icon'
|
4
5
|
|
5
6
|
const SelectError = (props) => {
|
6
7
|
const options = [
|
@@ -18,10 +19,14 @@ const SelectError = (props) => {
|
|
18
19
|
},
|
19
20
|
]
|
20
21
|
|
22
|
+
const error = (<>
|
23
|
+
<Icon icon="warning" /> Please make a valid selection
|
24
|
+
</>)
|
25
|
+
|
21
26
|
return (
|
22
27
|
<div>
|
23
28
|
<Select
|
24
|
-
error=
|
29
|
+
error={error}
|
25
30
|
label="Favorite Food"
|
26
31
|
name="food"
|
27
32
|
options={options}
|
@@ -29,7 +34,7 @@ const SelectError = (props) => {
|
|
29
34
|
{...props}
|
30
35
|
/>
|
31
36
|
<Body
|
32
|
-
error=
|
37
|
+
error={error}
|
33
38
|
status="negative"
|
34
39
|
{...props}
|
35
40
|
/>
|
@@ -1,6 +1,7 @@
|
|
1
1
|
import React, { useState } from 'react'
|
2
2
|
|
3
3
|
import TextInput from '../_text_input'
|
4
|
+
import Icon from '../../pb_icon/_icon'
|
4
5
|
|
5
6
|
const TextInputError = (props) => {
|
6
7
|
const [email, setEmail] = useState('')
|
@@ -8,11 +9,18 @@ const TextInputError = (props) => {
|
|
8
9
|
const handleUpdateEmail = ({ target }) => {
|
9
10
|
setEmail(target.value)
|
10
11
|
}
|
12
|
+
|
13
|
+
const error = (
|
14
|
+
<>
|
15
|
+
<Icon icon="warning" /> Please enter a valid email address
|
16
|
+
</>
|
17
|
+
)
|
18
|
+
|
11
19
|
return (
|
12
20
|
<div>
|
13
21
|
<TextInput
|
14
22
|
addOn={{ icon: 'user', alignment: 'left', border: true }}
|
15
|
-
error=
|
23
|
+
error={error}
|
16
24
|
label="Email Address"
|
17
25
|
onChange={handleUpdateEmail}
|
18
26
|
placeholder="Enter email address"
|
@@ -1,15 +1,21 @@
|
|
1
1
|
import React, {useState} from 'react'
|
2
2
|
import Textarea from '../../pb_textarea/_textarea'
|
3
|
+
import Icon from '../../pb_icon/_icon'
|
3
4
|
|
4
5
|
const TextareaError = (props) => {
|
5
6
|
const [value, setValue] = useState('default value text')
|
6
7
|
const handleChange = (event) => {
|
7
8
|
setValue(event.target.value)
|
8
9
|
}
|
10
|
+
const error = (
|
11
|
+
<>
|
12
|
+
<Icon icon="warning" /> This field has an error!
|
13
|
+
</>
|
14
|
+
)
|
9
15
|
return (
|
10
16
|
<div>
|
11
17
|
<Textarea
|
12
|
-
error=
|
18
|
+
error={error}
|
13
19
|
label="Label"
|
14
20
|
name="comment"
|
15
21
|
onChange={(e)=> handleChange(e)}
|
@@ -1,6 +1,7 @@
|
|
1
1
|
import React, { useState, useEffect } from 'react'
|
2
2
|
|
3
3
|
import Typeahead from '../_typeahead'
|
4
|
+
import Icon from '../../pb_icon/_icon'
|
4
5
|
|
5
6
|
const options = [
|
6
7
|
{ label: 'Orange', value: '#FFA500' },
|
@@ -10,7 +11,10 @@ const options = [
|
|
10
11
|
]
|
11
12
|
|
12
13
|
const TypeaheadErrorState = (props) => {
|
13
|
-
const
|
14
|
+
const error = (<>
|
15
|
+
<Icon icon="warning" /> Please make a valid selection
|
16
|
+
</>)
|
17
|
+
const [errorState, setErrorState] = useState(error);
|
14
18
|
const [searchValue, setSearchValue] = useState(null);
|
15
19
|
|
16
20
|
const handleOnChange = (value) => setSearchValue(value)
|
@@ -19,7 +23,7 @@ const TypeaheadErrorState = (props) => {
|
|
19
23
|
if(searchValue) {
|
20
24
|
setErrorState("")
|
21
25
|
} else {
|
22
|
-
setErrorState(
|
26
|
+
setErrorState(error)
|
23
27
|
}
|
24
28
|
}, [searchValue])
|
25
29
|
|