playbook_ui_docs 16.7.0 → 16.8.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_date/docs/_playground.json +13 -17
- data/app/pb_kits/playbook/pb_date/docs/_playground.overrides.json +13 -16
- data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_inline.html.erb +0 -2
- data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_inline.jsx +0 -2
- data/app/pb_kits/playbook/pb_date_picker/docs/_playground.json +136 -42
- data/app/pb_kits/playbook/pb_date_picker/docs/_playground.overrides.json +113 -45
- data/app/pb_kits/playbook/pb_date_range_inline/docs/_playground.json +48 -6
- data/app/pb_kits/playbook/pb_date_range_inline/docs/_playground.overrides.json +57 -0
- data/app/pb_kits/playbook/pb_date_range_stacked/docs/_playground.json +28 -5
- data/app/pb_kits/playbook/pb_date_range_stacked/docs/_playground.overrides.json +38 -0
- data/app/pb_kits/playbook/pb_date_stacked/docs/_playground.json +1 -1
- data/app/pb_kits/playbook/pb_date_stacked/docs/_playground.overrides.json +1 -1
- data/app/pb_kits/playbook/pb_date_time/docs/_playground.json +16 -3
- data/app/pb_kits/playbook/pb_date_time/docs/_playground.overrides.json +16 -3
- data/app/pb_kits/playbook/pb_date_time_stacked/docs/_playground.json +11 -15
- data/app/pb_kits/playbook/pb_date_time_stacked/docs/_playground.overrides.json +11 -15
- data/app/pb_kits/playbook/pb_date_year_stacked/docs/_playground.json +4 -4
- data/app/pb_kits/playbook/pb_date_year_stacked/docs/_playground.overrides.json +4 -4
- data/app/pb_kits/playbook/pb_detail/docs/_playground.json +12 -18
- data/app/pb_kits/playbook/pb_detail/docs/_playground.overrides.json +13 -12
- data/app/pb_kits/playbook/pb_dialog/docs/_playground.json +108 -42
- data/app/pb_kits/playbook/pb_dialog/docs/_playground.overrides.json +88 -40
- data/app/pb_kits/playbook/pb_distribution_bar/docs/_playground.json +65 -7
- data/app/pb_kits/playbook/pb_distribution_bar/docs/_playground.overrides.json +45 -0
- data/app/pb_kits/playbook/pb_dropdown/docs/_playground.json +318 -21
- data/app/pb_kits/playbook/pb_dropdown/docs/_playground.overrides.json +192 -19
- data/app/pb_kits/playbook/pb_empty_state/docs/_playground.json +77 -12
- data/app/pb_kits/playbook/pb_empty_state/docs/_playground.overrides.json +79 -0
- data/app/pb_kits/playbook/pb_file_upload/docs/_playground.json +98 -13
- data/app/pb_kits/playbook/pb_file_upload/docs/_playground.overrides.json +99 -0
- data/app/pb_kits/playbook/pb_link/docs/_playground.json +81 -40
- data/app/pb_kits/playbook/pb_link/docs/_playground.overrides.json +88 -30
- data/app/pb_kits/playbook/pb_phone_number_input/docs/_playground.json +4 -2
- data/app/pb_kits/playbook/pb_title/docs/_playground.json +72 -23
- data/app/pb_kits/playbook/pb_title/docs/_playground.overrides.json +80 -16
- metadata +7 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 8be402480cee5a4271d6fb1f027fcb36b991dfa23c63422e5293aab73f600d2e
|
|
4
|
+
data.tar.gz: c2cdd266f2c14133d667cb18d01a49d052773022bf5463afeaf65a4ae94b15aa
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: b5aec9e35bb48fd1f2cdab167e0f6448fb45a2c7f8961878681d9c302ff2bb01e168885901628d47223197bbc2c77a5342fe243fc2fa15a7923d0ee63b4eeeb3
|
|
7
|
+
data.tar.gz: f8798db30d4cd0a0a462731b3def3988efdc50b4c8f949b5ef93e478111b0b8d95a456220566cf51e44020abdcb7b4b25069678d0c14062cc1f01de6036ae550
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
{
|
|
2
|
-
"template": "<
|
|
2
|
+
"template": "<FormattedDate{{props}} />",
|
|
3
3
|
"propTargets": {},
|
|
4
4
|
"defaults": {
|
|
5
5
|
"alignment": "left",
|
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
},
|
|
12
12
|
"groups": [
|
|
13
13
|
{
|
|
14
|
-
"name": "
|
|
14
|
+
"name": "Date Config",
|
|
15
15
|
"props": [
|
|
16
16
|
"value",
|
|
17
17
|
"showDayOfWeek",
|
|
@@ -32,21 +32,20 @@
|
|
|
32
32
|
{
|
|
33
33
|
"name": "Default",
|
|
34
34
|
"props": {
|
|
35
|
-
"value": "2026-04-
|
|
35
|
+
"value": "2026-04-09"
|
|
36
36
|
}
|
|
37
37
|
},
|
|
38
38
|
{
|
|
39
|
-
"name": "
|
|
39
|
+
"name": "centered",
|
|
40
40
|
"props": {
|
|
41
|
-
"value": "2026-04-
|
|
42
|
-
"size": "lg",
|
|
41
|
+
"value": "2026-04-09",
|
|
43
42
|
"alignment": "center"
|
|
44
43
|
}
|
|
45
44
|
},
|
|
46
45
|
{
|
|
47
46
|
"name": "Small with weekday",
|
|
48
47
|
"props": {
|
|
49
|
-
"value": "2026-06-
|
|
48
|
+
"value": "2026-06-18",
|
|
50
49
|
"size": "sm",
|
|
51
50
|
"showDayOfWeek": true
|
|
52
51
|
}
|
|
@@ -54,20 +53,17 @@
|
|
|
54
53
|
{
|
|
55
54
|
"name": "With icon & year",
|
|
56
55
|
"props": {
|
|
57
|
-
"value": "2024-11-
|
|
56
|
+
"value": "2024-11-02",
|
|
58
57
|
"showIcon": true,
|
|
59
58
|
"showCurrentYear": true
|
|
60
59
|
}
|
|
61
|
-
},
|
|
62
|
-
{
|
|
63
|
-
"name": "Unstyled",
|
|
64
|
-
"props": {
|
|
65
|
-
"value": "2026-04-09T15:30:00.000Z",
|
|
66
|
-
"unstyled": true,
|
|
67
|
-
"showDayOfWeek": true
|
|
68
|
-
}
|
|
69
60
|
}
|
|
70
61
|
],
|
|
71
62
|
"conditionals": {},
|
|
72
|
-
"hints": {
|
|
63
|
+
"hints": {
|
|
64
|
+
"default": {
|
|
65
|
+
"message": "Use as FormattedDate to avoid naming collisions with global Date object",
|
|
66
|
+
"type": "info"
|
|
67
|
+
}
|
|
68
|
+
}
|
|
73
69
|
}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
{
|
|
2
|
+
"template": "<FormattedDate{{props}} />",
|
|
2
3
|
"groups": [
|
|
3
4
|
{
|
|
4
|
-
"name": "
|
|
5
|
+
"name": "Date Config",
|
|
5
6
|
"props": ["value", "showDayOfWeek", "showCurrentYear", "showIcon"]
|
|
6
7
|
},
|
|
7
8
|
{
|
|
@@ -13,21 +14,20 @@
|
|
|
13
14
|
{
|
|
14
15
|
"name": "Default",
|
|
15
16
|
"props": {
|
|
16
|
-
"value": "2026-04-
|
|
17
|
+
"value": "2026-04-09"
|
|
17
18
|
}
|
|
18
19
|
},
|
|
19
20
|
{
|
|
20
|
-
"name": "
|
|
21
|
+
"name": "centered",
|
|
21
22
|
"props": {
|
|
22
|
-
"value": "2026-04-
|
|
23
|
-
"size": "lg",
|
|
23
|
+
"value": "2026-04-09",
|
|
24
24
|
"alignment": "center"
|
|
25
25
|
}
|
|
26
26
|
},
|
|
27
27
|
{
|
|
28
28
|
"name": "Small with weekday",
|
|
29
29
|
"props": {
|
|
30
|
-
"value": "2026-06-
|
|
30
|
+
"value": "2026-06-18",
|
|
31
31
|
"size": "sm",
|
|
32
32
|
"showDayOfWeek": true
|
|
33
33
|
}
|
|
@@ -35,20 +35,17 @@
|
|
|
35
35
|
{
|
|
36
36
|
"name": "With icon & year",
|
|
37
37
|
"props": {
|
|
38
|
-
"value": "2024-11-
|
|
38
|
+
"value": "2024-11-02",
|
|
39
39
|
"showIcon": true,
|
|
40
40
|
"showCurrentYear": true
|
|
41
41
|
}
|
|
42
|
-
},
|
|
43
|
-
{
|
|
44
|
-
"name": "Unstyled",
|
|
45
|
-
"props": {
|
|
46
|
-
"value": "2026-04-09T15:30:00.000Z",
|
|
47
|
-
"unstyled": true,
|
|
48
|
-
"showDayOfWeek": true
|
|
49
|
-
}
|
|
50
42
|
}
|
|
51
43
|
],
|
|
52
44
|
"conditionals": {},
|
|
53
|
-
"hints": {
|
|
45
|
+
"hints": {
|
|
46
|
+
"default": {
|
|
47
|
+
"message": "Use as FormattedDate to avoid naming collisions with global Date object",
|
|
48
|
+
"type": "info"
|
|
49
|
+
}
|
|
50
|
+
}
|
|
54
51
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
{
|
|
2
|
-
"template": "<DatePicker{{props}} />",
|
|
2
|
+
"template": "<DatePicker {{props}} />",
|
|
3
3
|
"propTargets": {},
|
|
4
4
|
"defaults": {
|
|
5
5
|
"allowInput": false,
|
|
@@ -19,11 +19,23 @@
|
|
|
19
19
|
"controlsStartId": "",
|
|
20
20
|
"controlsEndId": "",
|
|
21
21
|
"syncStartWith": "",
|
|
22
|
-
"syncEndWith": ""
|
|
22
|
+
"syncEndWith": "",
|
|
23
|
+
"customQuickPickDates": {
|
|
24
|
+
"override": false,
|
|
25
|
+
"dates": []
|
|
26
|
+
},
|
|
27
|
+
"pickerId": "playground-date-picker",
|
|
28
|
+
"disableDate": [],
|
|
29
|
+
"disableRange": [],
|
|
30
|
+
"disableWeekdays": [],
|
|
31
|
+
"yearRange": [
|
|
32
|
+
1900,
|
|
33
|
+
2100
|
|
34
|
+
]
|
|
23
35
|
},
|
|
24
36
|
"groups": [
|
|
25
37
|
{
|
|
26
|
-
"name": "
|
|
38
|
+
"name": "Date Picker Config",
|
|
27
39
|
"props": [
|
|
28
40
|
"label",
|
|
29
41
|
"placeholder",
|
|
@@ -36,11 +48,18 @@
|
|
|
36
48
|
{
|
|
37
49
|
"name": "Appearance",
|
|
38
50
|
"props": [
|
|
51
|
+
"dark",
|
|
39
52
|
"hideIcon",
|
|
40
53
|
"hideLabel",
|
|
41
|
-
"inLine"
|
|
42
|
-
|
|
43
|
-
|
|
54
|
+
"inLine"
|
|
55
|
+
]
|
|
56
|
+
},
|
|
57
|
+
{
|
|
58
|
+
"name": "Quick pick",
|
|
59
|
+
"props": [
|
|
60
|
+
"selectionType",
|
|
61
|
+
"customQuickPickDates",
|
|
62
|
+
"thisRangesEndToday"
|
|
44
63
|
]
|
|
45
64
|
},
|
|
46
65
|
{
|
|
@@ -69,20 +88,12 @@
|
|
|
69
88
|
{
|
|
70
89
|
"name": "Advanced",
|
|
71
90
|
"props": [
|
|
72
|
-
"customQuickPickDates",
|
|
73
|
-
"positionElement",
|
|
74
|
-
"scrollContainer",
|
|
75
91
|
"inputValue",
|
|
76
92
|
"inputOnChange",
|
|
77
93
|
"inputAria",
|
|
78
94
|
"inputData",
|
|
79
95
|
"type",
|
|
80
|
-
"timeFormat"
|
|
81
|
-
"thisRangesEndToday",
|
|
82
|
-
"controlsStartId",
|
|
83
|
-
"controlsEndId",
|
|
84
|
-
"syncStartWith",
|
|
85
|
-
"syncEndWith"
|
|
96
|
+
"timeFormat"
|
|
86
97
|
]
|
|
87
98
|
}
|
|
88
99
|
],
|
|
@@ -93,20 +104,57 @@
|
|
|
93
104
|
"name": "event_date",
|
|
94
105
|
"pickerId": "playground-date-picker",
|
|
95
106
|
"label": "Event date",
|
|
96
|
-
"placeholder": "Select date"
|
|
97
|
-
"defaultDate": "04/09/2026",
|
|
98
|
-
"format": "m/d/Y"
|
|
107
|
+
"placeholder": "Select date"
|
|
99
108
|
}
|
|
100
109
|
},
|
|
101
110
|
{
|
|
102
|
-
"name": "Inline
|
|
111
|
+
"name": "Inline",
|
|
103
112
|
"props": {
|
|
104
113
|
"name": "inline_date",
|
|
105
114
|
"pickerId": "playground-date-inline",
|
|
106
115
|
"label": "Inline",
|
|
107
|
-
"
|
|
108
|
-
|
|
109
|
-
|
|
116
|
+
"inLine": true
|
|
117
|
+
}
|
|
118
|
+
},
|
|
119
|
+
{
|
|
120
|
+
"name": "Quick pick",
|
|
121
|
+
"props": {
|
|
122
|
+
"name": "quickpick_range",
|
|
123
|
+
"pickerId": "playground-quickpick",
|
|
124
|
+
"label": "Date range",
|
|
125
|
+
"placeholder": "mm/dd/yyyy to mm/dd/yyyy",
|
|
126
|
+
"allowInput": true,
|
|
127
|
+
"selectionType": "quickpick"
|
|
128
|
+
}
|
|
129
|
+
},
|
|
130
|
+
{
|
|
131
|
+
"name": "Quick pick with Custom Dates",
|
|
132
|
+
"props": {
|
|
133
|
+
"name": "quickpick_range",
|
|
134
|
+
"pickerId": "playground-quickpick",
|
|
135
|
+
"label": "Date range",
|
|
136
|
+
"placeholder": "mm/dd/yyyy to mm/dd/yyyy",
|
|
137
|
+
"allowInput": true,
|
|
138
|
+
"selectionType": "quickpick",
|
|
139
|
+
"customQuickPickDates": {
|
|
140
|
+
"override": false,
|
|
141
|
+
"dates": [
|
|
142
|
+
{
|
|
143
|
+
"label": "Last 15 months",
|
|
144
|
+
"value": {
|
|
145
|
+
"timePeriod": "months",
|
|
146
|
+
"amount": 15
|
|
147
|
+
}
|
|
148
|
+
},
|
|
149
|
+
{
|
|
150
|
+
"label": "First week of June 2022",
|
|
151
|
+
"value": [
|
|
152
|
+
"06/01/2022",
|
|
153
|
+
"06/07/2022"
|
|
154
|
+
]
|
|
155
|
+
}
|
|
156
|
+
]
|
|
157
|
+
}
|
|
110
158
|
}
|
|
111
159
|
},
|
|
112
160
|
{
|
|
@@ -115,7 +163,6 @@
|
|
|
115
163
|
"name": "starts_at",
|
|
116
164
|
"pickerId": "playground-datetime",
|
|
117
165
|
"label": "Starts at",
|
|
118
|
-
"defaultDate": "04/09/2026",
|
|
119
166
|
"enableTime": true,
|
|
120
167
|
"format": "m/d/Y H:i"
|
|
121
168
|
}
|
|
@@ -126,8 +173,7 @@
|
|
|
126
173
|
"name": "typed_date",
|
|
127
174
|
"pickerId": "playground-allow-input",
|
|
128
175
|
"label": "Start date",
|
|
129
|
-
"allowInput": true
|
|
130
|
-
"defaultDate": "04/09/2026"
|
|
176
|
+
"allowInput": true
|
|
131
177
|
}
|
|
132
178
|
},
|
|
133
179
|
{
|
|
@@ -136,8 +182,25 @@
|
|
|
136
182
|
"name": "month_only",
|
|
137
183
|
"pickerId": "playground-month",
|
|
138
184
|
"label": "Month",
|
|
139
|
-
"selectionType": "month"
|
|
140
|
-
|
|
185
|
+
"selectionType": "month"
|
|
186
|
+
}
|
|
187
|
+
},
|
|
188
|
+
{
|
|
189
|
+
"name": "Week picker",
|
|
190
|
+
"props": {
|
|
191
|
+
"name": "week_only",
|
|
192
|
+
"pickerId": "playground-week",
|
|
193
|
+
"label": "Week",
|
|
194
|
+
"selectionType": "week"
|
|
195
|
+
}
|
|
196
|
+
},
|
|
197
|
+
{
|
|
198
|
+
"name": "Dark",
|
|
199
|
+
"props": {
|
|
200
|
+
"name": "dark_picker",
|
|
201
|
+
"pickerId": "playground-dark",
|
|
202
|
+
"label": "Event date",
|
|
203
|
+
"dark": true
|
|
141
204
|
}
|
|
142
205
|
},
|
|
143
206
|
{
|
|
@@ -146,7 +209,6 @@
|
|
|
146
209
|
"name": "bounded",
|
|
147
210
|
"pickerId": "playground-bounded",
|
|
148
211
|
"label": "Within range",
|
|
149
|
-
"defaultDate": "04/09/2026",
|
|
150
212
|
"minDate": "01/01/2026",
|
|
151
213
|
"maxDate": "12/31/2026"
|
|
152
214
|
}
|
|
@@ -157,22 +219,54 @@
|
|
|
157
219
|
"name": "invalid_date",
|
|
158
220
|
"pickerId": "playground-error",
|
|
159
221
|
"label": "Due date",
|
|
160
|
-
"error": "Please choose a valid date"
|
|
161
|
-
|
|
222
|
+
"error": "Please choose a valid date"
|
|
223
|
+
}
|
|
224
|
+
}
|
|
225
|
+
],
|
|
226
|
+
"conditionals": {
|
|
227
|
+
"customQuickPickDates": {
|
|
228
|
+
"requires": {
|
|
229
|
+
"selectionType": "quickpick"
|
|
162
230
|
}
|
|
163
231
|
},
|
|
164
|
-
{
|
|
165
|
-
"
|
|
166
|
-
|
|
167
|
-
"name": "compact_date",
|
|
168
|
-
"pickerId": "playground-minimal",
|
|
169
|
-
"label": "",
|
|
170
|
-
"hideLabel": true,
|
|
171
|
-
"hideIcon": true,
|
|
172
|
-
"defaultDate": "04/09/2026"
|
|
232
|
+
"thisRangesEndToday": {
|
|
233
|
+
"requires": {
|
|
234
|
+
"selectionType": "quickpick"
|
|
173
235
|
}
|
|
174
236
|
}
|
|
175
|
-
|
|
176
|
-
"
|
|
177
|
-
|
|
237
|
+
},
|
|
238
|
+
"hints": {
|
|
239
|
+
"pickerId": {
|
|
240
|
+
"message": "The pickerId is used to identify the date picker in the DOM. It is required and must be unique.",
|
|
241
|
+
"type": "info"
|
|
242
|
+
},
|
|
243
|
+
"defaultDate": {
|
|
244
|
+
"when": {
|
|
245
|
+
"defaultDate": "04/09/2026"
|
|
246
|
+
},
|
|
247
|
+
"message": "The default date is the date that will be selected when the date picker is first rendered. It is required and must be a valid date.",
|
|
248
|
+
"type": "info"
|
|
249
|
+
},
|
|
250
|
+
"quickPick": {
|
|
251
|
+
"when": {
|
|
252
|
+
"selectionType": "quickpick"
|
|
253
|
+
},
|
|
254
|
+
"message": "Quick pick shows preset ranges (relative periods or explicit date pairs). Use thisRangesEndToday when the plugin should treat ranges as ending today.",
|
|
255
|
+
"type": "info"
|
|
256
|
+
},
|
|
257
|
+
"customQuickPickDates": {
|
|
258
|
+
"presetName": "Quick pick with Custom Dates",
|
|
259
|
+
"message": "Custom quick pick dates are used to override the default quick pick dates. It must be an object with a dates array.",
|
|
260
|
+
"type": "info"
|
|
261
|
+
}
|
|
262
|
+
},
|
|
263
|
+
"hiddenProps": [
|
|
264
|
+
"staticPosition",
|
|
265
|
+
"scrollContainer",
|
|
266
|
+
"controlsStartId",
|
|
267
|
+
"controlsEndId",
|
|
268
|
+
"syncStartWith",
|
|
269
|
+
"syncEndWith",
|
|
270
|
+
"positionElement"
|
|
271
|
+
]
|
|
178
272
|
}
|
|
@@ -1,7 +1,25 @@
|
|
|
1
1
|
{
|
|
2
|
+
"template": "<DatePicker {{props}} />",
|
|
3
|
+
"defaults": {
|
|
4
|
+
"customQuickPickDates": { "override": false, "dates": [] },
|
|
5
|
+
"pickerId": "playground-date-picker",
|
|
6
|
+
"disableDate": [],
|
|
7
|
+
"disableRange": [],
|
|
8
|
+
"disableWeekdays": [],
|
|
9
|
+
"yearRange": [1900, 2100]
|
|
10
|
+
},
|
|
11
|
+
"hiddenProps": [
|
|
12
|
+
"staticPosition",
|
|
13
|
+
"scrollContainer",
|
|
14
|
+
"controlsStartId",
|
|
15
|
+
"controlsEndId",
|
|
16
|
+
"syncStartWith",
|
|
17
|
+
"syncEndWith",
|
|
18
|
+
"positionElement"
|
|
19
|
+
],
|
|
2
20
|
"groups": [
|
|
3
21
|
{
|
|
4
|
-
"name": "
|
|
22
|
+
"name": "Date Picker Config",
|
|
5
23
|
"props": [
|
|
6
24
|
"label",
|
|
7
25
|
"placeholder",
|
|
@@ -13,13 +31,11 @@
|
|
|
13
31
|
},
|
|
14
32
|
{
|
|
15
33
|
"name": "Appearance",
|
|
16
|
-
"props": [
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
"selectionType"
|
|
22
|
-
]
|
|
34
|
+
"props": ["dark", "hideIcon", "hideLabel", "inLine"]
|
|
35
|
+
},
|
|
36
|
+
{
|
|
37
|
+
"name": "Quick pick",
|
|
38
|
+
"props": ["selectionType", "customQuickPickDates", "thisRangesEndToday"]
|
|
23
39
|
},
|
|
24
40
|
{
|
|
25
41
|
"name": "Behavior",
|
|
@@ -47,20 +63,12 @@
|
|
|
47
63
|
{
|
|
48
64
|
"name": "Advanced",
|
|
49
65
|
"props": [
|
|
50
|
-
"customQuickPickDates",
|
|
51
|
-
"positionElement",
|
|
52
|
-
"scrollContainer",
|
|
53
66
|
"inputValue",
|
|
54
67
|
"inputOnChange",
|
|
55
68
|
"inputAria",
|
|
56
69
|
"inputData",
|
|
57
70
|
"type",
|
|
58
|
-
"timeFormat"
|
|
59
|
-
"thisRangesEndToday",
|
|
60
|
-
"controlsStartId",
|
|
61
|
-
"controlsEndId",
|
|
62
|
-
"syncStartWith",
|
|
63
|
-
"syncEndWith"
|
|
71
|
+
"timeFormat"
|
|
64
72
|
]
|
|
65
73
|
}
|
|
66
74
|
],
|
|
@@ -71,20 +79,51 @@
|
|
|
71
79
|
"name": "event_date",
|
|
72
80
|
"pickerId": "playground-date-picker",
|
|
73
81
|
"label": "Event date",
|
|
74
|
-
"placeholder": "Select date"
|
|
75
|
-
"defaultDate": "04/09/2026",
|
|
76
|
-
"format": "m/d/Y"
|
|
82
|
+
"placeholder": "Select date"
|
|
77
83
|
}
|
|
78
84
|
},
|
|
79
85
|
{
|
|
80
|
-
"name": "Inline
|
|
86
|
+
"name": "Inline",
|
|
81
87
|
"props": {
|
|
82
88
|
"name": "inline_date",
|
|
83
89
|
"pickerId": "playground-date-inline",
|
|
84
90
|
"label": "Inline",
|
|
85
|
-
"
|
|
86
|
-
|
|
87
|
-
|
|
91
|
+
"inLine": true
|
|
92
|
+
}
|
|
93
|
+
},
|
|
94
|
+
{
|
|
95
|
+
"name": "Quick pick",
|
|
96
|
+
"props": {
|
|
97
|
+
"name": "quickpick_range",
|
|
98
|
+
"pickerId": "playground-quickpick",
|
|
99
|
+
"label": "Date range",
|
|
100
|
+
"placeholder": "mm/dd/yyyy to mm/dd/yyyy",
|
|
101
|
+
"allowInput": true,
|
|
102
|
+
"selectionType": "quickpick"
|
|
103
|
+
}
|
|
104
|
+
},
|
|
105
|
+
{
|
|
106
|
+
"name": "Quick pick with Custom Dates",
|
|
107
|
+
"props": {
|
|
108
|
+
"name": "quickpick_range",
|
|
109
|
+
"pickerId": "playground-quickpick",
|
|
110
|
+
"label": "Date range",
|
|
111
|
+
"placeholder": "mm/dd/yyyy to mm/dd/yyyy",
|
|
112
|
+
"allowInput": true,
|
|
113
|
+
"selectionType": "quickpick",
|
|
114
|
+
"customQuickPickDates": {
|
|
115
|
+
"override": false,
|
|
116
|
+
"dates": [
|
|
117
|
+
{
|
|
118
|
+
"label": "Last 15 months",
|
|
119
|
+
"value": { "timePeriod": "months", "amount": 15 }
|
|
120
|
+
},
|
|
121
|
+
{
|
|
122
|
+
"label": "First week of June 2022",
|
|
123
|
+
"value": ["06/01/2022", "06/07/2022"]
|
|
124
|
+
}
|
|
125
|
+
]
|
|
126
|
+
}
|
|
88
127
|
}
|
|
89
128
|
},
|
|
90
129
|
{
|
|
@@ -93,7 +132,6 @@
|
|
|
93
132
|
"name": "starts_at",
|
|
94
133
|
"pickerId": "playground-datetime",
|
|
95
134
|
"label": "Starts at",
|
|
96
|
-
"defaultDate": "04/09/2026",
|
|
97
135
|
"enableTime": true,
|
|
98
136
|
"format": "m/d/Y H:i"
|
|
99
137
|
}
|
|
@@ -104,8 +142,7 @@
|
|
|
104
142
|
"name": "typed_date",
|
|
105
143
|
"pickerId": "playground-allow-input",
|
|
106
144
|
"label": "Start date",
|
|
107
|
-
"allowInput": true
|
|
108
|
-
"defaultDate": "04/09/2026"
|
|
145
|
+
"allowInput": true
|
|
109
146
|
}
|
|
110
147
|
},
|
|
111
148
|
{
|
|
@@ -114,8 +151,25 @@
|
|
|
114
151
|
"name": "month_only",
|
|
115
152
|
"pickerId": "playground-month",
|
|
116
153
|
"label": "Month",
|
|
117
|
-
"selectionType": "month"
|
|
118
|
-
|
|
154
|
+
"selectionType": "month"
|
|
155
|
+
}
|
|
156
|
+
},
|
|
157
|
+
{
|
|
158
|
+
"name": "Week picker",
|
|
159
|
+
"props": {
|
|
160
|
+
"name": "week_only",
|
|
161
|
+
"pickerId": "playground-week",
|
|
162
|
+
"label": "Week",
|
|
163
|
+
"selectionType": "week"
|
|
164
|
+
}
|
|
165
|
+
},
|
|
166
|
+
{
|
|
167
|
+
"name": "Dark",
|
|
168
|
+
"props": {
|
|
169
|
+
"name": "dark_picker",
|
|
170
|
+
"pickerId": "playground-dark",
|
|
171
|
+
"label": "Event date",
|
|
172
|
+
"dark": true
|
|
119
173
|
}
|
|
120
174
|
},
|
|
121
175
|
{
|
|
@@ -124,7 +178,6 @@
|
|
|
124
178
|
"name": "bounded",
|
|
125
179
|
"pickerId": "playground-bounded",
|
|
126
180
|
"label": "Within range",
|
|
127
|
-
"defaultDate": "04/09/2026",
|
|
128
181
|
"minDate": "01/01/2026",
|
|
129
182
|
"maxDate": "12/31/2026"
|
|
130
183
|
}
|
|
@@ -135,22 +188,37 @@
|
|
|
135
188
|
"name": "invalid_date",
|
|
136
189
|
"pickerId": "playground-error",
|
|
137
190
|
"label": "Due date",
|
|
138
|
-
"error": "Please choose a valid date"
|
|
139
|
-
"defaultDate": ""
|
|
140
|
-
}
|
|
141
|
-
},
|
|
142
|
-
{
|
|
143
|
-
"name": "Minimal chrome",
|
|
144
|
-
"props": {
|
|
145
|
-
"name": "compact_date",
|
|
146
|
-
"pickerId": "playground-minimal",
|
|
147
|
-
"label": "",
|
|
148
|
-
"hideLabel": true,
|
|
149
|
-
"hideIcon": true,
|
|
150
|
-
"defaultDate": "04/09/2026"
|
|
191
|
+
"error": "Please choose a valid date"
|
|
151
192
|
}
|
|
152
193
|
}
|
|
153
194
|
],
|
|
154
|
-
"conditionals": {
|
|
155
|
-
|
|
195
|
+
"conditionals": {
|
|
196
|
+
"customQuickPickDates": {
|
|
197
|
+
"requires": { "selectionType": "quickpick" }
|
|
198
|
+
},
|
|
199
|
+
"thisRangesEndToday": {
|
|
200
|
+
"requires": { "selectionType": "quickpick" }
|
|
201
|
+
}
|
|
202
|
+
},
|
|
203
|
+
"hints": {
|
|
204
|
+
"pickerId": {
|
|
205
|
+
"message": "The pickerId is used to identify the date picker in the DOM. It is required and must be unique.",
|
|
206
|
+
"type": "info"
|
|
207
|
+
},
|
|
208
|
+
"defaultDate": {
|
|
209
|
+
"when": { "defaultDate": "04/09/2026" },
|
|
210
|
+
"message": "The default date is the date that will be selected when the date picker is first rendered. It is required and must be a valid date.",
|
|
211
|
+
"type": "info"
|
|
212
|
+
},
|
|
213
|
+
"quickPick": {
|
|
214
|
+
"when": { "selectionType": "quickpick" },
|
|
215
|
+
"message": "Quick pick shows preset ranges (relative periods or explicit date pairs). Use thisRangesEndToday when the plugin should treat ranges as ending today.",
|
|
216
|
+
"type": "info"
|
|
217
|
+
},
|
|
218
|
+
"customQuickPickDates": {
|
|
219
|
+
"presetName": "Quick pick with Custom Dates",
|
|
220
|
+
"message": "Custom quick pick dates are used to override the default quick pick dates. It must be an object with a dates array.",
|
|
221
|
+
"type": "info"
|
|
222
|
+
}
|
|
223
|
+
}
|
|
156
224
|
}
|