@khanacademy/wonder-blocks-birthday-picker 1.2.26 → 1.2.28

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 (3) hide show
  1. package/CHANGELOG.md +23 -0
  2. package/package.json +7 -7
  3. package/dist/index.js +0 -471
package/CHANGELOG.md CHANGED
@@ -1,5 +1,28 @@
1
1
  # @khanacademy/wonder-blocks-birthday-picker
2
2
 
3
+ ## 1.2.28
4
+
5
+ ### Patch Changes
6
+
7
+ - @khanacademy/wonder-blocks-core@4.6.1
8
+ - @khanacademy/wonder-blocks-dropdown@2.10.4
9
+ - @khanacademy/wonder-blocks-icon@1.2.34
10
+ - @khanacademy/wonder-blocks-layout@1.4.14
11
+ - @khanacademy/wonder-blocks-typography@1.1.36
12
+
13
+ ## 1.2.27
14
+
15
+ ### Patch Changes
16
+
17
+ - Updated dependencies [b561425a]
18
+ - Updated dependencies [a566e232]
19
+ - Updated dependencies [d2b21a6e]
20
+ - @khanacademy/wonder-blocks-core@4.6.0
21
+ - @khanacademy/wonder-blocks-dropdown@2.10.3
22
+ - @khanacademy/wonder-blocks-icon@1.2.33
23
+ - @khanacademy/wonder-blocks-layout@1.4.13
24
+ - @khanacademy/wonder-blocks-typography@1.1.35
25
+
3
26
  ## 1.2.26
4
27
 
5
28
  ### Patch Changes
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@khanacademy/wonder-blocks-birthday-picker",
3
- "version": "1.2.26",
3
+ "version": "1.2.28",
4
4
  "design": "v1",
5
5
  "publishConfig": {
6
6
  "access": "public"
@@ -15,12 +15,12 @@
15
15
  "dependencies": {
16
16
  "@babel/runtime": "^7.18.6",
17
17
  "@khanacademy/wonder-blocks-color": "^1.2.0",
18
- "@khanacademy/wonder-blocks-core": "^4.5.0",
19
- "@khanacademy/wonder-blocks-dropdown": "^2.10.2",
20
- "@khanacademy/wonder-blocks-icon": "^1.2.32",
21
- "@khanacademy/wonder-blocks-layout": "^1.4.12",
18
+ "@khanacademy/wonder-blocks-core": "^4.6.1",
19
+ "@khanacademy/wonder-blocks-dropdown": "^2.10.4",
20
+ "@khanacademy/wonder-blocks-icon": "^1.2.34",
21
+ "@khanacademy/wonder-blocks-layout": "^1.4.14",
22
22
  "@khanacademy/wonder-blocks-spacing": "^3.0.5",
23
- "@khanacademy/wonder-blocks-typography": "^1.1.34"
23
+ "@khanacademy/wonder-blocks-typography": "^1.1.36"
24
24
  },
25
25
  "peerDependencies": {
26
26
  "aphrodite": "^1.2.5",
@@ -28,7 +28,7 @@
28
28
  "react": "16.14.0"
29
29
  },
30
30
  "devDependencies": {
31
- "wb-dev-build-settings": "^0.4.0"
31
+ "wb-dev-build-settings": "^0.6.0"
32
32
  },
33
33
  "author": "",
34
34
  "license": "MIT"
package/dist/index.js DELETED
@@ -1,471 +0,0 @@
1
- module.exports =
2
- /******/ (function(modules) { // webpackBootstrap
3
- /******/ // The module cache
4
- /******/ var installedModules = {};
5
- /******/
6
- /******/ // The require function
7
- /******/ function __webpack_require__(moduleId) {
8
- /******/
9
- /******/ // Check if module is in cache
10
- /******/ if(installedModules[moduleId]) {
11
- /******/ return installedModules[moduleId].exports;
12
- /******/ }
13
- /******/ // Create a new module (and put it into the cache)
14
- /******/ var module = installedModules[moduleId] = {
15
- /******/ i: moduleId,
16
- /******/ l: false,
17
- /******/ exports: {}
18
- /******/ };
19
- /******/
20
- /******/ // Execute the module function
21
- /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
22
- /******/
23
- /******/ // Flag the module as loaded
24
- /******/ module.l = true;
25
- /******/
26
- /******/ // Return the exports of the module
27
- /******/ return module.exports;
28
- /******/ }
29
- /******/
30
- /******/
31
- /******/ // expose the modules object (__webpack_modules__)
32
- /******/ __webpack_require__.m = modules;
33
- /******/
34
- /******/ // expose the module cache
35
- /******/ __webpack_require__.c = installedModules;
36
- /******/
37
- /******/ // define getter function for harmony exports
38
- /******/ __webpack_require__.d = function(exports, name, getter) {
39
- /******/ if(!__webpack_require__.o(exports, name)) {
40
- /******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
41
- /******/ }
42
- /******/ };
43
- /******/
44
- /******/ // define __esModule on exports
45
- /******/ __webpack_require__.r = function(exports) {
46
- /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
47
- /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
48
- /******/ }
49
- /******/ Object.defineProperty(exports, '__esModule', { value: true });
50
- /******/ };
51
- /******/
52
- /******/ // create a fake namespace object
53
- /******/ // mode & 1: value is a module id, require it
54
- /******/ // mode & 2: merge all properties of value into the ns
55
- /******/ // mode & 4: return value when already ns object
56
- /******/ // mode & 8|1: behave like require
57
- /******/ __webpack_require__.t = function(value, mode) {
58
- /******/ if(mode & 1) value = __webpack_require__(value);
59
- /******/ if(mode & 8) return value;
60
- /******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
61
- /******/ var ns = Object.create(null);
62
- /******/ __webpack_require__.r(ns);
63
- /******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
64
- /******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
65
- /******/ return ns;
66
- /******/ };
67
- /******/
68
- /******/ // getDefaultExport function for compatibility with non-harmony modules
69
- /******/ __webpack_require__.n = function(module) {
70
- /******/ var getter = module && module.__esModule ?
71
- /******/ function getDefault() { return module['default']; } :
72
- /******/ function getModuleExports() { return module; };
73
- /******/ __webpack_require__.d(getter, 'a', getter);
74
- /******/ return getter;
75
- /******/ };
76
- /******/
77
- /******/ // Object.prototype.hasOwnProperty.call
78
- /******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
79
- /******/
80
- /******/ // __webpack_public_path__
81
- /******/ __webpack_require__.p = "";
82
- /******/
83
- /******/
84
- /******/ // Load entry module and return exports
85
- /******/ return __webpack_require__(__webpack_require__.s = 10);
86
- /******/ })
87
- /************************************************************************/
88
- /******/ ([
89
- /* 0 */
90
- /***/ (function(module, exports) {
91
-
92
- module.exports = require("react");
93
-
94
- /***/ }),
95
- /* 1 */
96
- /***/ (function(module, exports) {
97
-
98
- module.exports = require("@khanacademy/wonder-blocks-dropdown");
99
-
100
- /***/ }),
101
- /* 2 */
102
- /***/ (function(module, exports) {
103
-
104
- module.exports = require("@khanacademy/wonder-blocks-layout");
105
-
106
- /***/ }),
107
- /* 3 */
108
- /***/ (function(module, exports) {
109
-
110
- module.exports = require("@khanacademy/wonder-blocks-spacing");
111
-
112
- /***/ }),
113
- /* 4 */
114
- /***/ (function(module, exports) {
115
-
116
- module.exports = require("moment");
117
-
118
- /***/ }),
119
- /* 5 */
120
- /***/ (function(module, exports) {
121
-
122
- module.exports = require("@khanacademy/wonder-blocks-core");
123
-
124
- /***/ }),
125
- /* 6 */
126
- /***/ (function(module, exports) {
127
-
128
- module.exports = require("@khanacademy/wonder-blocks-icon");
129
-
130
- /***/ }),
131
- /* 7 */
132
- /***/ (function(module, exports) {
133
-
134
- module.exports = require("@khanacademy/wonder-blocks-color");
135
-
136
- /***/ }),
137
- /* 8 */
138
- /***/ (function(module, __webpack_exports__, __webpack_require__) {
139
-
140
- "use strict";
141
- /* unused harmony export defaultLabels */
142
- /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return BirthdayPicker; });
143
- /* harmony import */ var moment__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(4);
144
- /* harmony import */ var moment__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(moment__WEBPACK_IMPORTED_MODULE_0__);
145
- /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(0);
146
- /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
147
- /* harmony import */ var _khanacademy_wonder_blocks_core__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(5);
148
- /* harmony import */ var _khanacademy_wonder_blocks_core__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_khanacademy_wonder_blocks_core__WEBPACK_IMPORTED_MODULE_2__);
149
- /* harmony import */ var _khanacademy_wonder_blocks_layout__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(2);
150
- /* harmony import */ var _khanacademy_wonder_blocks_layout__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_khanacademy_wonder_blocks_layout__WEBPACK_IMPORTED_MODULE_3__);
151
- /* harmony import */ var _khanacademy_wonder_blocks_spacing__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(3);
152
- /* harmony import */ var _khanacademy_wonder_blocks_spacing__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_khanacademy_wonder_blocks_spacing__WEBPACK_IMPORTED_MODULE_4__);
153
- /* harmony import */ var _khanacademy_wonder_blocks_typography__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(9);
154
- /* harmony import */ var _khanacademy_wonder_blocks_typography__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_khanacademy_wonder_blocks_typography__WEBPACK_IMPORTED_MODULE_5__);
155
- /* harmony import */ var _khanacademy_wonder_blocks_icon__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(6);
156
- /* harmony import */ var _khanacademy_wonder_blocks_icon__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_khanacademy_wonder_blocks_icon__WEBPACK_IMPORTED_MODULE_6__);
157
- /* harmony import */ var _khanacademy_wonder_blocks_color__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(7);
158
- /* harmony import */ var _khanacademy_wonder_blocks_color__WEBPACK_IMPORTED_MODULE_7___default = /*#__PURE__*/__webpack_require__.n(_khanacademy_wonder_blocks_color__WEBPACK_IMPORTED_MODULE_7__);
159
- /* harmony import */ var _khanacademy_wonder_blocks_dropdown__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(1);
160
- /* harmony import */ var _khanacademy_wonder_blocks_dropdown__WEBPACK_IMPORTED_MODULE_8___default = /*#__PURE__*/__webpack_require__.n(_khanacademy_wonder_blocks_dropdown__WEBPACK_IMPORTED_MODULE_8__);
161
-
162
-
163
-
164
-
165
-
166
-
167
-
168
-
169
-
170
- // Flow doesn't know about the getYear property on Date for some reason!
171
- // $FlowFixMe[prop-missing]
172
- const CUR_YEAR = new Date().getYear() + 1900; // Only exported internally for testing/documentation purposes.
173
-
174
- const defaultLabels = Object.freeze({
175
- errorMessage: "Please select a valid birthdate.",
176
- month: "Month",
177
- year: "Year",
178
- day: "Day"
179
- }); // Default minWidth value when we include the full DOB.
180
-
181
- const FIELD_MIN_WIDTH_FULL = 110; // Alternative minWidth value when we hide the day field.
182
- // See: https://www.figma.com/file/uJZi9ZvuEz5N8GJ3HqKFAa/(2021)-Account-records?node-id=20%3A398
183
-
184
- const FIELD_MIN_WIDTH_MONTH_YEAR = 167;
185
- /**
186
- * Birthday Picker. Similar to a datepicker, but specifically for birthdates.
187
- * We don't want to show a calendar in this case as it can be quite tedious to
188
- * try and select a date that's many years old. Instead, we use a set of
189
- * dropdowns to achieve a similar effect.
190
- *
191
- * More information on this pattern:
192
- * https://medium.com/samsung-internet-dev/making-input-type-date-complicated-a544fd27c45a
193
- *
194
- * Arguably, this should probably even be 3 textfields, but that would be a
195
- * larger design change, more info:
196
- * https://designnotes.blog.gov.uk/2013/12/05/asking-for-a-date-of-birth/
197
- *
198
- * **NOTE:** This component is uncontrolled.
199
- *
200
- * ### Usage
201
- *
202
- * ```jsx
203
- * import {BirthdayPicker} from "@khanacademy/wonder-blocks-dates";
204
- *
205
- * <BirthdayPicker
206
- * defaultValue="2021-05-26"
207
- * onChange={(date) => {setDate(date)}}
208
- * />
209
- * ```
210
- */
211
-
212
- class BirthdayPicker extends react__WEBPACK_IMPORTED_MODULE_1__["Component"] {
213
- /**
214
- * Strings used for placeholders and error message. These are used this way
215
- * to support i18n.
216
- * NOTE: This is a field rather than state to avoid re-rendering the entire
217
- * component. Also, we don't need to use state because these strings are
218
- * only needed on mount.
219
- */
220
- constructor(props) {
221
- super(props);
222
- this.lastChangeValue = null;
223
-
224
- this.reportChange = value => {
225
- if (value !== this.lastChangeValue) {
226
- this.lastChangeValue = value;
227
- this.props.onChange(value);
228
- }
229
- };
230
-
231
- this.handleChange = () => {
232
- const {
233
- month,
234
- day,
235
- year
236
- } = this.state; // If any of the values haven't been set then our overall value is
237
- // equal to null
238
-
239
- if (month === null || day === null || year === null) {
240
- this.reportChange(null);
241
- return;
242
- } // This is a legal call to Moment, but our Moment types don't
243
- // recognize it.
244
- // $FlowFixMe[incompatible-call]
245
-
246
-
247
- const date = moment__WEBPACK_IMPORTED_MODULE_0___default()([year, month, day]); // If the date is in the future or is invalid then we want to show
248
- // an error to the user and return a null value.
249
-
250
- if (date.isAfter() || !date.isValid()) {
251
- this.setState({
252
- error: this.labels.errorMessage
253
- });
254
- this.reportChange(null);
255
- } else {
256
- this.setState({
257
- error: null
258
- }); // If the date picker is in a non-English language, we still
259
- // want to generate an English date.
260
-
261
- this.reportChange(date.locale("en").format("YYYY-MM-DD"));
262
- }
263
- };
264
-
265
- this.handleMonthChange = month => {
266
- this.setState({
267
- month
268
- }, this.handleChange);
269
- };
270
-
271
- this.handleDayChange = day => {
272
- this.setState({
273
- day
274
- }, this.handleChange);
275
- };
276
-
277
- this.handleYearChange = year => {
278
- this.setState({
279
- year
280
- }, this.handleChange);
281
- };
282
-
283
- this.lastChangeValue = props.defaultValue || null;
284
- this.state = this.getStateFromDefault();
285
- }
286
- /**
287
- * Calculates the initial state values based on the default value.
288
- */
289
-
290
-
291
- getStateFromDefault() {
292
- const {
293
- defaultValue,
294
- monthYearOnly
295
- } = this.props;
296
- const initialState = {
297
- month: null,
298
- day: monthYearOnly ? "1" : null,
299
- year: null,
300
- error: null
301
- }; // merge custom labels with the default ones
302
-
303
- this.labels = { ...defaultLabels,
304
- ...this.props.labels
305
- }; // If a default value was provided then we use moment to convert it
306
- // into a date that we can use to populate the
307
-
308
- if (defaultValue) {
309
- const date = moment__WEBPACK_IMPORTED_MODULE_0___default()(defaultValue);
310
-
311
- if (date.isValid()) {
312
- initialState.month = String(date.month());
313
- initialState.day = String(date.date());
314
- initialState.year = String(date.year());
315
- } // If the date is in the future or is invalid then we want to show
316
- // an error to the user.
317
-
318
-
319
- if (date.isAfter() || !date.isValid()) {
320
- initialState.error = this.labels.errorMessage;
321
- }
322
- }
323
-
324
- return initialState;
325
- }
326
-
327
- maybeRenderError() {
328
- const {
329
- error
330
- } = this.state;
331
-
332
- if (!error) {
333
- return null;
334
- }
335
-
336
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__["createElement"](react__WEBPACK_IMPORTED_MODULE_1__["Fragment"], null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_khanacademy_wonder_blocks_layout__WEBPACK_IMPORTED_MODULE_3__["Strut"], {
337
- size: _khanacademy_wonder_blocks_spacing__WEBPACK_IMPORTED_MODULE_4___default.a.xxxSmall_4
338
- }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_khanacademy_wonder_blocks_core__WEBPACK_IMPORTED_MODULE_2__["View"], {
339
- style: {
340
- flexDirection: "row"
341
- },
342
- role: "alert"
343
- }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_khanacademy_wonder_blocks_icon__WEBPACK_IMPORTED_MODULE_6___default.a, {
344
- size: "small",
345
- icon: _khanacademy_wonder_blocks_icon__WEBPACK_IMPORTED_MODULE_6__["icons"].info,
346
- color: _khanacademy_wonder_blocks_color__WEBPACK_IMPORTED_MODULE_7___default.a.red,
347
- style: {
348
- marginTop: 3
349
- },
350
- "aria-hidden": "true"
351
- }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_khanacademy_wonder_blocks_layout__WEBPACK_IMPORTED_MODULE_3__["Strut"], {
352
- size: _khanacademy_wonder_blocks_spacing__WEBPACK_IMPORTED_MODULE_4___default.a.xxxSmall_4
353
- }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_khanacademy_wonder_blocks_typography__WEBPACK_IMPORTED_MODULE_5__["Body"], {
354
- style: {
355
- color: _khanacademy_wonder_blocks_color__WEBPACK_IMPORTED_MODULE_7___default.a.red
356
- }
357
- }, error)));
358
- }
359
-
360
- renderMonth() {
361
- const {
362
- disabled,
363
- monthYearOnly
364
- } = this.props;
365
- const {
366
- month
367
- } = this.state;
368
- const minWidth = monthYearOnly ? FIELD_MIN_WIDTH_MONTH_YEAR : FIELD_MIN_WIDTH_FULL;
369
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_khanacademy_wonder_blocks_dropdown__WEBPACK_IMPORTED_MODULE_8__["SingleSelect"], {
370
- disabled: disabled,
371
- placeholder: this.labels.month,
372
- onChange: this.handleMonthChange,
373
- selectedValue: month,
374
- style: {
375
- minWidth
376
- },
377
- testId: "birthday-picker-month"
378
- }, moment__WEBPACK_IMPORTED_MODULE_0___default.a.monthsShort().map((month, i) => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_khanacademy_wonder_blocks_dropdown__WEBPACK_IMPORTED_MODULE_8__["OptionItem"], {
379
- key: month,
380
- label: month,
381
- value: String(i)
382
- })));
383
- }
384
-
385
- maybeRenderDay() {
386
- const {
387
- disabled,
388
- monthYearOnly
389
- } = this.props;
390
- const {
391
- day
392
- } = this.state; // Hide the day field if the month/year only mode is enabled.
393
-
394
- if (monthYearOnly) {
395
- return null;
396
- }
397
-
398
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__["createElement"](react__WEBPACK_IMPORTED_MODULE_1__["Fragment"], null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_khanacademy_wonder_blocks_layout__WEBPACK_IMPORTED_MODULE_3__["Strut"], {
399
- size: _khanacademy_wonder_blocks_spacing__WEBPACK_IMPORTED_MODULE_4___default.a.xSmall_8
400
- }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_khanacademy_wonder_blocks_dropdown__WEBPACK_IMPORTED_MODULE_8__["SingleSelect"], {
401
- disabled: disabled,
402
- placeholder: this.labels.day,
403
- onChange: this.handleDayChange,
404
- selectedValue: day,
405
- style: {
406
- minWidth: 100
407
- },
408
- testId: "birthday-picker-day"
409
- }, Array.from(Array(31)).map((_, day) => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_khanacademy_wonder_blocks_dropdown__WEBPACK_IMPORTED_MODULE_8__["OptionItem"], {
410
- key: String(day + 1),
411
- label: String(day + 1),
412
- value: String(day + 1)
413
- }))));
414
- }
415
-
416
- renderYear() {
417
- const {
418
- disabled,
419
- monthYearOnly
420
- } = this.props;
421
- const {
422
- year
423
- } = this.state;
424
- const minWidth = monthYearOnly ? FIELD_MIN_WIDTH_MONTH_YEAR : FIELD_MIN_WIDTH_FULL;
425
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_khanacademy_wonder_blocks_dropdown__WEBPACK_IMPORTED_MODULE_8__["SingleSelect"], {
426
- disabled: disabled,
427
- placeholder: this.labels.year,
428
- onChange: this.handleYearChange,
429
- selectedValue: year,
430
- style: {
431
- minWidth
432
- },
433
- testId: "birthday-picker-year"
434
- }, Array.from(Array(120)).map((_, yearOffset) => /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_khanacademy_wonder_blocks_dropdown__WEBPACK_IMPORTED_MODULE_8__["OptionItem"], {
435
- key: String(CUR_YEAR - yearOffset),
436
- label: String(CUR_YEAR - yearOffset),
437
- value: String(CUR_YEAR - yearOffset)
438
- })));
439
- }
440
-
441
- render() {
442
- return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__["createElement"](react__WEBPACK_IMPORTED_MODULE_1__["Fragment"], null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_khanacademy_wonder_blocks_core__WEBPACK_IMPORTED_MODULE_2__["View"], {
443
- testId: "birthday-picker",
444
- style: {
445
- flexDirection: "row"
446
- }
447
- }, this.renderMonth(), this.maybeRenderDay(), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_khanacademy_wonder_blocks_layout__WEBPACK_IMPORTED_MODULE_3__["Strut"], {
448
- size: _khanacademy_wonder_blocks_spacing__WEBPACK_IMPORTED_MODULE_4___default.a.xSmall_8
449
- }), this.renderYear()), this.maybeRenderError());
450
- }
451
-
452
- }
453
-
454
- /***/ }),
455
- /* 9 */
456
- /***/ (function(module, exports) {
457
-
458
- module.exports = require("@khanacademy/wonder-blocks-typography");
459
-
460
- /***/ }),
461
- /* 10 */
462
- /***/ (function(module, __webpack_exports__, __webpack_require__) {
463
-
464
- "use strict";
465
- __webpack_require__.r(__webpack_exports__);
466
- /* harmony import */ var _components_birthday_picker_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(8);
467
-
468
- /* harmony default export */ __webpack_exports__["default"] = (_components_birthday_picker_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "a"]);
469
-
470
- /***/ })
471
- /******/ ]);