npm - @tactics/toddle-styleguide - Versions diffs - 1.2.2 → 1.2.4 - Mend

@tactics/toddle-styleguide 1.2.2 → 1.2.4

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 (56) hide show

package/src/components/molecules/time-picker/__snapshots__/time-picker.test.js.snap ADDED Viewed

@@ -0,0 +1,2241 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+exports[`Time picker test Should render a time picker where we can choose the hours and minutes separately, and our initial set time is 08:00 1`] = `
+<View
+  style={
+    {
+      "alignItems": "center",
+      "flexDirection": "row",
+      "gap": 12,
+    }
+  }
+>
+  <View
+    style={
+      {
+        "alignItems": "center",
+        "borderColor": "#E5E8EB",
+        "borderRadius": 20,
+        "borderStyle": "solid",
+        "borderWidth": 1,
+        "justifyContent": "center",
+        "maxHeight": 72,
+        "maxWidth": 72,
+        "overflow": "hidden",
+      }
+    }
+  >
+    <View
+      style={
+        {
+          "backgroundColor": "#F5F7FA",
+          "height": 320,
+          "width": 72,
+        }
+      }
+    >
+      <RCTScrollView
+        data={
+          [
+            {
+              "label": "",
+              "value": null,
+            },
+            {
+              "label": "",
+              "value": null,
+            },
+            {
+              "label": "--",
+              "value": "--",
+            },
+            {
+              "label": "00",
+              "value": "00",
+            },
+            {
+              "label": "01",
+              "value": "01",
+            },
+            {
+              "label": "02",
+              "value": "02",
+            },
+            {
+              "label": "03",
+              "value": "03",
+            },
+            {
+              "label": "04",
+              "value": "04",
+            },
+            {
+              "label": "05",
+              "value": "05",
+            },
+            {
+              "label": "06",
+              "value": "06",
+            },
+            {
+              "label": "07",
+              "value": "07",
+            },
+            {
+              "label": "08",
+              "value": "08",
+            },
+            {
+              "label": "09",
+              "value": "09",
+            },
+            {
+              "label": "10",
+              "value": "10",
+            },
+            {
+              "label": "11",
+              "value": "11",
+            },
+            {
+              "label": "12",
+              "value": "12",
+            },
+            {
+              "label": "13",
+              "value": "13",
+            },
+            {
+              "label": "14",
+              "value": "14",
+            },
+            {
+              "label": "15",
+              "value": "15",
+            },
+            {
+              "label": "16",
+              "value": "16",
+            },
+            {
+              "label": "17",
+              "value": "17",
+            },
+            {
+              "label": "18",
+              "value": "18",
+            },
+            {
+              "label": "19",
+              "value": "19",
+            },
+            {
+              "label": "20",
+              "value": "20",
+            },
+            {
+              "label": "21",
+              "value": "21",
+            },
+            {
+              "label": "22",
+              "value": "22",
+            },
+            {
+              "label": "23",
+              "value": "23",
+            },
+            {
+              "label": "",
+              "value": null,
+            },
+            {
+              "label": "",
+              "value": null,
+            },
+          ]
+        }
+        getItem={[Function]}
+        getItemCount={[Function]}
+        getItemLayout={[Function]}
+        initialScrollIndex={9}
+        keyExtractor={[Function]}
+        onContentSizeChange={[Function]}
+        onLayout={[Function]}
+        onMomentumScrollBegin={[Function]}
+        onMomentumScrollEnd={[Function]}
+        onScroll={[Function]}
+        onScrollBeginDrag={[Function]}
+        onScrollEndDrag={[Function]}
+        onTouchStart={[Function]}
+        removeClippedSubviews={false}
+        renderItem={[Function]}
+        scrollEventThrottle={50}
+        showsVerticalScrollIndicator={false}
+        snapToInterval={64}
+        stickyHeaderIndices={[]}
+        viewabilityConfigCallbackPairs={[]}
+      >
+        <View>
+          <View
+            style={
+              {
+                "height": 576,
+              }
+            }
+          />
+          <View
+            onFocusCapture={[Function]}
+            style={null}
+          >
+            <View
+              accessibilityState={
+                {
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": undefined,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
+                {
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                {
+                  "opacity": 1,
+                }
+              }
+            >
+              <View
+                style={
+                  {
+                    "alignItems": "center",
+                    "backgroundColor": "#F5F7FA",
+                    "fontSize": 32,
+                    "height": 64,
+                    "justifyContent": "center",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    [
+                      [
+                        {
+                          "fontFamily": "SourceSansPro",
+                          "fontSize": 38,
+                          "lineHeight": 47.8,
+                        },
+                      ],
+                      {
+                        "color": "#9AA5B1",
+                        "textAlign": "center",
+                        "width": "100%",
+                      },
+                      {
+                        "fontSize": 42,
+                        "fontWeight": "200",
+                      },
+                    ]
+                  }
+                >
+                  06
+                </Text>
+              </View>
+            </View>
+          </View>
+          <View
+            onFocusCapture={[Function]}
+            style={null}
+          >
+            <View
+              accessibilityState={
+                {
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": undefined,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
+                {
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                {
+                  "opacity": 1,
+                }
+              }
+            >
+              <View
+                style={
+                  {
+                    "alignItems": "center",
+                    "backgroundColor": "#F5F7FA",
+                    "fontSize": 32,
+                    "height": 64,
+                    "justifyContent": "center",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    [
+                      [
+                        {
+                          "fontFamily": "SourceSansPro",
+                          "fontSize": 38,
+                          "lineHeight": 47.8,
+                        },
+                      ],
+                      {
+                        "color": "#9AA5B1",
+                        "textAlign": "center",
+                        "width": "100%",
+                      },
+                      {
+                        "fontSize": 42,
+                        "fontWeight": "200",
+                      },
+                    ]
+                  }
+                >
+                  07
+                </Text>
+              </View>
+            </View>
+          </View>
+          <View
+            onFocusCapture={[Function]}
+            style={null}
+          >
+            <View
+              accessibilityState={
+                {
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": undefined,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
+                {
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                {
+                  "opacity": 1,
+                }
+              }
+            >
+              <View
+                style={
+                  {
+                    "alignItems": "center",
+                    "backgroundColor": "#F5F7FA",
+                    "fontSize": 32,
+                    "height": 64,
+                    "justifyContent": "center",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    [
+                      [
+                        {
+                          "fontFamily": "SourceSansPro",
+                          "fontSize": 38,
+                          "lineHeight": 47.8,
+                        },
+                      ],
+                      {
+                        "color": "#9AA5B1",
+                        "textAlign": "center",
+                        "width": "100%",
+                      },
+                      {
+                        "fontSize": 42,
+                        "fontWeight": "200",
+                      },
+                    ]
+                  }
+                >
+                  08
+                </Text>
+              </View>
+            </View>
+          </View>
+          <View
+            onFocusCapture={[Function]}
+            style={null}
+          >
+            <View
+              accessibilityState={
+                {
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": undefined,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
+                {
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                {
+                  "opacity": 1,
+                }
+              }
+            >
+              <View
+                style={
+                  {
+                    "alignItems": "center",
+                    "backgroundColor": "#F5F7FA",
+                    "fontSize": 32,
+                    "height": 64,
+                    "justifyContent": "center",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    [
+                      [
+                        {
+                          "fontFamily": "SourceSansPro",
+                          "fontSize": 38,
+                          "lineHeight": 47.8,
+                        },
+                      ],
+                      {
+                        "color": "#9AA5B1",
+                        "textAlign": "center",
+                        "width": "100%",
+                      },
+                      {
+                        "fontSize": 42,
+                        "fontWeight": "200",
+                      },
+                    ]
+                  }
+                >
+                  09
+                </Text>
+              </View>
+            </View>
+          </View>
+          <View
+            onFocusCapture={[Function]}
+            style={null}
+          >
+            <View
+              accessibilityState={
+                {
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": undefined,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
+                {
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                {
+                  "opacity": 1,
+                }
+              }
+            >
+              <View
+                style={
+                  {
+                    "alignItems": "center",
+                    "backgroundColor": "#F5F7FA",
+                    "fontSize": 32,
+                    "height": 64,
+                    "justifyContent": "center",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    [
+                      [
+                        {
+                          "fontFamily": "SourceSansPro",
+                          "fontSize": 38,
+                          "lineHeight": 47.8,
+                        },
+                      ],
+                      {
+                        "color": "#9AA5B1",
+                        "textAlign": "center",
+                        "width": "100%",
+                      },
+                      {
+                        "fontSize": 42,
+                        "fontWeight": "200",
+                      },
+                    ]
+                  }
+                >
+                  10
+                </Text>
+              </View>
+            </View>
+          </View>
+          <View
+            onFocusCapture={[Function]}
+            style={null}
+          >
+            <View
+              accessibilityState={
+                {
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": undefined,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
+                {
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                {
+                  "opacity": 1,
+                }
+              }
+            >
+              <View
+                style={
+                  {
+                    "alignItems": "center",
+                    "backgroundColor": "#F5F7FA",
+                    "fontSize": 32,
+                    "height": 64,
+                    "justifyContent": "center",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    [
+                      [
+                        {
+                          "fontFamily": "SourceSansPro",
+                          "fontSize": 38,
+                          "lineHeight": 47.8,
+                        },
+                      ],
+                      {
+                        "color": "#9AA5B1",
+                        "textAlign": "center",
+                        "width": "100%",
+                      },
+                      {
+                        "fontSize": 42,
+                        "fontWeight": "200",
+                      },
+                    ]
+                  }
+                >
+                  11
+                </Text>
+              </View>
+            </View>
+          </View>
+          <View
+            onFocusCapture={[Function]}
+            style={null}
+          >
+            <View
+              accessibilityState={
+                {
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": undefined,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
+                {
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                {
+                  "opacity": 1,
+                }
+              }
+            >
+              <View
+                style={
+                  {
+                    "alignItems": "center",
+                    "backgroundColor": "#F5F7FA",
+                    "fontSize": 32,
+                    "height": 64,
+                    "justifyContent": "center",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    [
+                      [
+                        {
+                          "fontFamily": "SourceSansPro",
+                          "fontSize": 38,
+                          "lineHeight": 47.8,
+                        },
+                      ],
+                      {
+                        "color": "#9AA5B1",
+                        "textAlign": "center",
+                        "width": "100%",
+                      },
+                      {
+                        "fontSize": 42,
+                        "fontWeight": "200",
+                      },
+                    ]
+                  }
+                >
+                  12
+                </Text>
+              </View>
+            </View>
+          </View>
+          <View
+            onFocusCapture={[Function]}
+            style={null}
+          >
+            <View
+              accessibilityState={
+                {
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": undefined,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
+                {
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                {
+                  "opacity": 1,
+                }
+              }
+            >
+              <View
+                style={
+                  {
+                    "alignItems": "center",
+                    "backgroundColor": "#F5F7FA",
+                    "fontSize": 32,
+                    "height": 64,
+                    "justifyContent": "center",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    [
+                      [
+                        {
+                          "fontFamily": "SourceSansPro",
+                          "fontSize": 38,
+                          "lineHeight": 47.8,
+                        },
+                      ],
+                      {
+                        "color": "#9AA5B1",
+                        "textAlign": "center",
+                        "width": "100%",
+                      },
+                      {
+                        "fontSize": 42,
+                        "fontWeight": "200",
+                      },
+                    ]
+                  }
+                >
+                  13
+                </Text>
+              </View>
+            </View>
+          </View>
+          <View
+            onFocusCapture={[Function]}
+            style={null}
+          >
+            <View
+              accessibilityState={
+                {
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": undefined,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
+                {
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                {
+                  "opacity": 1,
+                }
+              }
+            >
+              <View
+                style={
+                  {
+                    "alignItems": "center",
+                    "backgroundColor": "#F5F7FA",
+                    "fontSize": 32,
+                    "height": 64,
+                    "justifyContent": "center",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    [
+                      [
+                        {
+                          "fontFamily": "SourceSansPro",
+                          "fontSize": 38,
+                          "lineHeight": 47.8,
+                        },
+                      ],
+                      {
+                        "color": "#9AA5B1",
+                        "textAlign": "center",
+                        "width": "100%",
+                      },
+                      {
+                        "fontSize": 42,
+                        "fontWeight": "200",
+                      },
+                    ]
+                  }
+                >
+                  14
+                </Text>
+              </View>
+            </View>
+          </View>
+          <View
+            onFocusCapture={[Function]}
+            style={null}
+          >
+            <View
+              accessibilityState={
+                {
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": undefined,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
+                {
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                {
+                  "opacity": 1,
+                }
+              }
+            >
+              <View
+                style={
+                  {
+                    "alignItems": "center",
+                    "backgroundColor": "#F5F7FA",
+                    "fontSize": 32,
+                    "height": 64,
+                    "justifyContent": "center",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    [
+                      [
+                        {
+                          "fontFamily": "SourceSansPro",
+                          "fontSize": 38,
+                          "lineHeight": 47.8,
+                        },
+                      ],
+                      {
+                        "color": "#9AA5B1",
+                        "textAlign": "center",
+                        "width": "100%",
+                      },
+                      {
+                        "fontSize": 42,
+                        "fontWeight": "200",
+                      },
+                    ]
+                  }
+                >
+                  15
+                </Text>
+              </View>
+            </View>
+          </View>
+          <View
+            style={
+              {
+                "height": 640,
+              }
+            }
+          />
+        </View>
+      </RCTScrollView>
+      <View
+        pointerEvents="none"
+        style={
+          [
+            [
+              {
+                "borderColor": undefined,
+                "height": 128,
+              },
+              {
+                "position": "absolute",
+                "width": "100%",
+              },
+            ],
+            {
+              "top": 0,
+            },
+            {
+              "borderBottomWidth": undefined,
+            },
+          ]
+        }
+      >
+        <ViewManagerAdapter_ExpoLinearGradient
+          proxiedProperties={
+            {
+              "colors": [
+                4294309882,
+                871757818,
+              ],
+              "endPoint": undefined,
+              "locations": undefined,
+              "startPoint": undefined,
+            }
+          }
+          style={
+            {
+              "flex": 1,
+            }
+          }
+        />
+      </View>
+      <View
+        pointerEvents="none"
+        style={
+          [
+            [
+              {
+                "borderColor": undefined,
+                "height": 128,
+              },
+              {
+                "position": "absolute",
+                "width": "100%",
+              },
+            ],
+            {
+              "bottom": 0,
+            },
+            {
+              "borderTopWidth": undefined,
+            },
+          ]
+        }
+      >
+        <ViewManagerAdapter_ExpoLinearGradient
+          proxiedProperties={
+            {
+              "colors": [
+                871757818,
+                4294309882,
+              ],
+              "endPoint": undefined,
+              "locations": undefined,
+              "startPoint": undefined,
+            }
+          }
+          style={
+            {
+              "flex": 1,
+            }
+          }
+        />
+      </View>
+    </View>
+  </View>
+  <View>
+    <Text
+      style={
+        [
+          [
+            {
+              "fontFamily": "SourceSansPro",
+              "fontSize": 38,
+              "lineHeight": 47.8,
+            },
+          ],
+          {
+            "color": "#9AA5B1",
+            "textAlign": "center",
+            "width": "100%",
+          },
+          {
+            "fontSize": 42,
+            "fontWeight": "200",
+            "lineHeight": 42,
+          },
+        ]
+      }
+    >
+      :
+    </Text>
+  </View>
+  <View
+    style={
+      {
+        "alignItems": "center",
+        "borderColor": "#E5E8EB",
+        "borderRadius": 20,
+        "borderStyle": "solid",
+        "borderWidth": 1,
+        "justifyContent": "center",
+        "maxHeight": 72,
+        "maxWidth": 72,
+        "overflow": "hidden",
+      }
+    }
+  >
+    <View
+      style={
+        {
+          "backgroundColor": "#F5F7FA",
+          "height": 320,
+          "width": 72,
+        }
+      }
+    >
+      <RCTScrollView
+        data={
+          [
+            {
+              "label": "",
+              "value": null,
+            },
+            {
+              "label": "",
+              "value": null,
+            },
+            {
+              "label": "--",
+              "value": "--",
+            },
+            {
+              "label": "00",
+              "value": "00",
+            },
+            {
+              "label": "01",
+              "value": "01",
+            },
+            {
+              "label": "02",
+              "value": "02",
+            },
+            {
+              "label": "03",
+              "value": "03",
+            },
+            {
+              "label": "04",
+              "value": "04",
+            },
+            {
+              "label": "05",
+              "value": "05",
+            },
+            {
+              "label": "06",
+              "value": "06",
+            },
+            {
+              "label": "07",
+              "value": "07",
+            },
+            {
+              "label": "08",
+              "value": "08",
+            },
+            {
+              "label": "09",
+              "value": "09",
+            },
+            {
+              "label": "10",
+              "value": "10",
+            },
+            {
+              "label": "11",
+              "value": "11",
+            },
+            {
+              "label": "12",
+              "value": "12",
+            },
+            {
+              "label": "13",
+              "value": "13",
+            },
+            {
+              "label": "14",
+              "value": "14",
+            },
+            {
+              "label": "15",
+              "value": "15",
+            },
+            {
+              "label": "16",
+              "value": "16",
+            },
+            {
+              "label": "17",
+              "value": "17",
+            },
+            {
+              "label": "18",
+              "value": "18",
+            },
+            {
+              "label": "19",
+              "value": "19",
+            },
+            {
+              "label": "20",
+              "value": "20",
+            },
+            {
+              "label": "21",
+              "value": "21",
+            },
+            {
+              "label": "22",
+              "value": "22",
+            },
+            {
+              "label": "23",
+              "value": "23",
+            },
+            {
+              "label": "24",
+              "value": "24",
+            },
+            {
+              "label": "25",
+              "value": "25",
+            },
+            {
+              "label": "26",
+              "value": "26",
+            },
+            {
+              "label": "27",
+              "value": "27",
+            },
+            {
+              "label": "28",
+              "value": "28",
+            },
+            {
+              "label": "29",
+              "value": "29",
+            },
+            {
+              "label": "30",
+              "value": "30",
+            },
+            {
+              "label": "31",
+              "value": "31",
+            },
+            {
+              "label": "32",
+              "value": "32",
+            },
+            {
+              "label": "33",
+              "value": "33",
+            },
+            {
+              "label": "34",
+              "value": "34",
+            },
+            {
+              "label": "35",
+              "value": "35",
+            },
+            {
+              "label": "36",
+              "value": "36",
+            },
+            {
+              "label": "37",
+              "value": "37",
+            },
+            {
+              "label": "38",
+              "value": "38",
+            },
+            {
+              "label": "39",
+              "value": "39",
+            },
+            {
+              "label": "40",
+              "value": "40",
+            },
+            {
+              "label": "41",
+              "value": "41",
+            },
+            {
+              "label": "42",
+              "value": "42",
+            },
+            {
+              "label": "43",
+              "value": "43",
+            },
+            {
+              "label": "44",
+              "value": "44",
+            },
+            {
+              "label": "45",
+              "value": "45",
+            },
+            {
+              "label": "46",
+              "value": "46",
+            },
+            {
+              "label": "47",
+              "value": "47",
+            },
+            {
+              "label": "48",
+              "value": "48",
+            },
+            {
+              "label": "49",
+              "value": "49",
+            },
+            {
+              "label": "50",
+              "value": "50",
+            },
+            {
+              "label": "51",
+              "value": "51",
+            },
+            {
+              "label": "52",
+              "value": "52",
+            },
+            {
+              "label": "53",
+              "value": "53",
+            },
+            {
+              "label": "54",
+              "value": "54",
+            },
+            {
+              "label": "55",
+              "value": "55",
+            },
+            {
+              "label": "56",
+              "value": "56",
+            },
+            {
+              "label": "57",
+              "value": "57",
+            },
+            {
+              "label": "58",
+              "value": "58",
+            },
+            {
+              "label": "59",
+              "value": "59",
+            },
+            {
+              "label": "",
+              "value": null,
+            },
+            {
+              "label": "",
+              "value": null,
+            },
+          ]
+        }
+        getItem={[Function]}
+        getItemCount={[Function]}
+        getItemLayout={[Function]}
+        initialScrollIndex={1}
+        keyExtractor={[Function]}
+        onContentSizeChange={[Function]}
+        onLayout={[Function]}
+        onMomentumScrollBegin={[Function]}
+        onMomentumScrollEnd={[Function]}
+        onScroll={[Function]}
+        onScrollBeginDrag={[Function]}
+        onScrollEndDrag={[Function]}
+        onTouchStart={[Function]}
+        removeClippedSubviews={false}
+        renderItem={[Function]}
+        scrollEventThrottle={50}
+        showsVerticalScrollIndicator={false}
+        snapToInterval={64}
+        stickyHeaderIndices={[]}
+        viewabilityConfigCallbackPairs={[]}
+      >
+        <View>
+          <View
+            style={
+              {
+                "height": 64,
+              }
+            }
+          />
+          <View
+            onFocusCapture={[Function]}
+            style={null}
+          >
+            <View
+              accessibilityState={
+                {
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": undefined,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
+                {
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                {
+                  "opacity": 1,
+                }
+              }
+            >
+              <View
+                style={
+                  {
+                    "alignItems": "center",
+                    "backgroundColor": "#F5F7FA",
+                    "fontSize": 32,
+                    "height": 64,
+                    "justifyContent": "center",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    [
+                      [
+                        {
+                          "fontFamily": "SourceSansPro",
+                          "fontSize": 38,
+                          "lineHeight": 47.8,
+                        },
+                      ],
+                      {
+                        "color": "#9AA5B1",
+                        "textAlign": "center",
+                        "width": "100%",
+                      },
+                      {
+                        "fontSize": 42,
+                        "fontWeight": "200",
+                      },
+                    ]
+                  }
+                />
+              </View>
+            </View>
+          </View>
+          <View
+            onFocusCapture={[Function]}
+            style={null}
+          >
+            <View
+              accessibilityState={
+                {
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": undefined,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
+                {
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                {
+                  "opacity": 1,
+                }
+              }
+            >
+              <View
+                style={
+                  {
+                    "alignItems": "center",
+                    "backgroundColor": "#F5F7FA",
+                    "fontSize": 32,
+                    "height": 64,
+                    "justifyContent": "center",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    [
+                      [
+                        {
+                          "fontFamily": "SourceSansPro",
+                          "fontSize": 38,
+                          "lineHeight": 47.8,
+                        },
+                      ],
+                      {
+                        "color": "#9AA5B1",
+                        "textAlign": "center",
+                        "width": "100%",
+                      },
+                      {
+                        "fontSize": 42,
+                        "fontWeight": "200",
+                      },
+                    ]
+                  }
+                >
+                  --
+                </Text>
+              </View>
+            </View>
+          </View>
+          <View
+            onFocusCapture={[Function]}
+            style={null}
+          >
+            <View
+              accessibilityState={
+                {
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": undefined,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
+                {
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                {
+                  "opacity": 1,
+                }
+              }
+            >
+              <View
+                style={
+                  {
+                    "alignItems": "center",
+                    "backgroundColor": "#F5F7FA",
+                    "fontSize": 32,
+                    "height": 64,
+                    "justifyContent": "center",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    [
+                      [
+                        {
+                          "fontFamily": "SourceSansPro",
+                          "fontSize": 38,
+                          "lineHeight": 47.8,
+                        },
+                      ],
+                      {
+                        "color": "#9AA5B1",
+                        "textAlign": "center",
+                        "width": "100%",
+                      },
+                      {
+                        "fontSize": 42,
+                        "fontWeight": "200",
+                      },
+                    ]
+                  }
+                >
+                  00
+                </Text>
+              </View>
+            </View>
+          </View>
+          <View
+            onFocusCapture={[Function]}
+            style={null}
+          >
+            <View
+              accessibilityState={
+                {
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": undefined,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
+                {
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                {
+                  "opacity": 1,
+                }
+              }
+            >
+              <View
+                style={
+                  {
+                    "alignItems": "center",
+                    "backgroundColor": "#F5F7FA",
+                    "fontSize": 32,
+                    "height": 64,
+                    "justifyContent": "center",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    [
+                      [
+                        {
+                          "fontFamily": "SourceSansPro",
+                          "fontSize": 38,
+                          "lineHeight": 47.8,
+                        },
+                      ],
+                      {
+                        "color": "#9AA5B1",
+                        "textAlign": "center",
+                        "width": "100%",
+                      },
+                      {
+                        "fontSize": 42,
+                        "fontWeight": "200",
+                      },
+                    ]
+                  }
+                >
+                  01
+                </Text>
+              </View>
+            </View>
+          </View>
+          <View
+            onFocusCapture={[Function]}
+            style={null}
+          >
+            <View
+              accessibilityState={
+                {
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": undefined,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
+                {
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                {
+                  "opacity": 1,
+                }
+              }
+            >
+              <View
+                style={
+                  {
+                    "alignItems": "center",
+                    "backgroundColor": "#F5F7FA",
+                    "fontSize": 32,
+                    "height": 64,
+                    "justifyContent": "center",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    [
+                      [
+                        {
+                          "fontFamily": "SourceSansPro",
+                          "fontSize": 38,
+                          "lineHeight": 47.8,
+                        },
+                      ],
+                      {
+                        "color": "#9AA5B1",
+                        "textAlign": "center",
+                        "width": "100%",
+                      },
+                      {
+                        "fontSize": 42,
+                        "fontWeight": "200",
+                      },
+                    ]
+                  }
+                >
+                  02
+                </Text>
+              </View>
+            </View>
+          </View>
+          <View
+            onFocusCapture={[Function]}
+            style={null}
+          >
+            <View
+              accessibilityState={
+                {
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": undefined,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
+                {
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                {
+                  "opacity": 1,
+                }
+              }
+            >
+              <View
+                style={
+                  {
+                    "alignItems": "center",
+                    "backgroundColor": "#F5F7FA",
+                    "fontSize": 32,
+                    "height": 64,
+                    "justifyContent": "center",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    [
+                      [
+                        {
+                          "fontFamily": "SourceSansPro",
+                          "fontSize": 38,
+                          "lineHeight": 47.8,
+                        },
+                      ],
+                      {
+                        "color": "#9AA5B1",
+                        "textAlign": "center",
+                        "width": "100%",
+                      },
+                      {
+                        "fontSize": 42,
+                        "fontWeight": "200",
+                      },
+                    ]
+                  }
+                >
+                  03
+                </Text>
+              </View>
+            </View>
+          </View>
+          <View
+            onFocusCapture={[Function]}
+            style={null}
+          >
+            <View
+              accessibilityState={
+                {
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": undefined,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
+                {
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                {
+                  "opacity": 1,
+                }
+              }
+            >
+              <View
+                style={
+                  {
+                    "alignItems": "center",
+                    "backgroundColor": "#F5F7FA",
+                    "fontSize": 32,
+                    "height": 64,
+                    "justifyContent": "center",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    [
+                      [
+                        {
+                          "fontFamily": "SourceSansPro",
+                          "fontSize": 38,
+                          "lineHeight": 47.8,
+                        },
+                      ],
+                      {
+                        "color": "#9AA5B1",
+                        "textAlign": "center",
+                        "width": "100%",
+                      },
+                      {
+                        "fontSize": 42,
+                        "fontWeight": "200",
+                      },
+                    ]
+                  }
+                >
+                  04
+                </Text>
+              </View>
+            </View>
+          </View>
+          <View
+            onFocusCapture={[Function]}
+            style={null}
+          >
+            <View
+              accessibilityState={
+                {
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": undefined,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
+                {
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                {
+                  "opacity": 1,
+                }
+              }
+            >
+              <View
+                style={
+                  {
+                    "alignItems": "center",
+                    "backgroundColor": "#F5F7FA",
+                    "fontSize": 32,
+                    "height": 64,
+                    "justifyContent": "center",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    [
+                      [
+                        {
+                          "fontFamily": "SourceSansPro",
+                          "fontSize": 38,
+                          "lineHeight": 47.8,
+                        },
+                      ],
+                      {
+                        "color": "#9AA5B1",
+                        "textAlign": "center",
+                        "width": "100%",
+                      },
+                      {
+                        "fontSize": 42,
+                        "fontWeight": "200",
+                      },
+                    ]
+                  }
+                >
+                  05
+                </Text>
+              </View>
+            </View>
+          </View>
+          <View
+            onFocusCapture={[Function]}
+            style={null}
+          >
+            <View
+              accessibilityState={
+                {
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": undefined,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
+                {
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                {
+                  "opacity": 1,
+                }
+              }
+            >
+              <View
+                style={
+                  {
+                    "alignItems": "center",
+                    "backgroundColor": "#F5F7FA",
+                    "fontSize": 32,
+                    "height": 64,
+                    "justifyContent": "center",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    [
+                      [
+                        {
+                          "fontFamily": "SourceSansPro",
+                          "fontSize": 38,
+                          "lineHeight": 47.8,
+                        },
+                      ],
+                      {
+                        "color": "#9AA5B1",
+                        "textAlign": "center",
+                        "width": "100%",
+                      },
+                      {
+                        "fontSize": 42,
+                        "fontWeight": "200",
+                      },
+                    ]
+                  }
+                >
+                  06
+                </Text>
+              </View>
+            </View>
+          </View>
+          <View
+            onFocusCapture={[Function]}
+            style={null}
+          >
+            <View
+              accessibilityState={
+                {
+                  "busy": undefined,
+                  "checked": undefined,
+                  "disabled": undefined,
+                  "expanded": undefined,
+                  "selected": undefined,
+                }
+              }
+              accessibilityValue={
+                {
+                  "max": undefined,
+                  "min": undefined,
+                  "now": undefined,
+                  "text": undefined,
+                }
+              }
+              accessible={true}
+              collapsable={false}
+              focusable={true}
+              onClick={[Function]}
+              onResponderGrant={[Function]}
+              onResponderMove={[Function]}
+              onResponderRelease={[Function]}
+              onResponderTerminate={[Function]}
+              onResponderTerminationRequest={[Function]}
+              onStartShouldSetResponder={[Function]}
+              style={
+                {
+                  "opacity": 1,
+                }
+              }
+            >
+              <View
+                style={
+                  {
+                    "alignItems": "center",
+                    "backgroundColor": "#F5F7FA",
+                    "fontSize": 32,
+                    "height": 64,
+                    "justifyContent": "center",
+                  }
+                }
+              >
+                <Text
+                  style={
+                    [
+                      [
+                        {
+                          "fontFamily": "SourceSansPro",
+                          "fontSize": 38,
+                          "lineHeight": 47.8,
+                        },
+                      ],
+                      {
+                        "color": "#9AA5B1",
+                        "textAlign": "center",
+                        "width": "100%",
+                      },
+                      {
+                        "fontSize": 42,
+                        "fontWeight": "200",
+                      },
+                    ]
+                  }
+                >
+                  07
+                </Text>
+              </View>
+            </View>
+          </View>
+          <View
+            style={
+              {
+                "height": 3456,
+              }
+            }
+          />
+        </View>
+      </RCTScrollView>
+      <View
+        pointerEvents="none"
+        style={
+          [
+            [
+              {
+                "borderColor": undefined,
+                "height": 128,
+              },
+              {
+                "position": "absolute",
+                "width": "100%",
+              },
+            ],
+            {
+              "top": 0,
+            },
+            {
+              "borderBottomWidth": undefined,
+            },
+          ]
+        }
+      >
+        <ViewManagerAdapter_ExpoLinearGradient
+          proxiedProperties={
+            {
+              "colors": [
+                4294309882,
+                871757818,
+              ],
+              "endPoint": undefined,
+              "locations": undefined,
+              "startPoint": undefined,
+            }
+          }
+          style={
+            {
+              "flex": 1,
+            }
+          }
+        />
+      </View>
+      <View
+        pointerEvents="none"
+        style={
+          [
+            [
+              {
+                "borderColor": undefined,
+                "height": 128,
+              },
+              {
+                "position": "absolute",
+                "width": "100%",
+              },
+            ],
+            {
+              "bottom": 0,
+            },
+            {
+              "borderTopWidth": undefined,
+            },
+          ]
+        }
+      >
+        <ViewManagerAdapter_ExpoLinearGradient
+          proxiedProperties={
+            {
+              "colors": [
+                871757818,
+                4294309882,
+              ],
+              "endPoint": undefined,
+              "locations": undefined,
+              "startPoint": undefined,
+            }
+          }
+          style={
+            {
+              "flex": 1,
+            }
+          }
+        />
+      </View>
+    </View>
+  </View>
+</View>
+`;