@ornikar/bumper 1.1.0

package/src/components/primitives/__snapshots__/Stack.stories.tsx.snap

@@ -0,0 +1,376 @@
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+
+exports[`bumper/Primitives/Stacks Stacks 1`] = `
+<RNCSafeAreaProvider
+  onInsetsChange={[Function]}
+  style={
+    [
+      {
+        "flex": 1,
+      },
+      undefined,
+    ]
+  }
+>
+  <Text
+    suppressHighlighting={true}
+  >
+    - space is deprecated, use gap instead - direction from NB is now flexDirection- reversed from NB is now direction (rtl/ltr)
+  </Text>
+  <View
+    style={
+      {
+        "flexDirection": "column",
+        "paddingBottom": 4,
+        "paddingLeft": 4,
+        "paddingRight": 4,
+        "paddingTop": 4,
+      }
+    }
+  >
+    <Text
+      style={
+        {
+          "fontFamily": "GTStandardSemibold",
+          "fontSize": 38,
+          "letterSpacing": 0,
+          "lineHeight": 48,
+          "marginBottom": 4,
+        }
+      }
+      suppressHighlighting={true}
+    >
+      Stack
+    </Text>
+    <View
+      style={
+        {
+          "flexDirection": "column",
+          "paddingBottom": 4,
+          "paddingLeft": 4,
+          "paddingRight": 4,
+          "paddingTop": 4,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandardSemibold",
+            "fontSize": 24,
+            "letterSpacing": 0,
+            "lineHeight": 32,
+            "marginBottom": 4,
+          }
+        }
+        suppressHighlighting={true}
+      >
+        Demo
+      </Text>
+      <View
+        style={
+          {
+            "flexDirection": "column-reverse",
+            "gap": 2,
+          }
+        }
+      >
+        <Text
+          style={
+            {
+              "fontFamily": "GTStandard",
+            }
+          }
+          suppressHighlighting={true}
+        >
+          1
+        </Text>
+        <Text
+          style={
+            {
+              "fontFamily": "GTStandard",
+            }
+          }
+          suppressHighlighting={true}
+        >
+          2
+        </Text>
+      </View>
+    </View>
+  </View>
+  <View
+    style={
+      {
+        "flexDirection": "column",
+        "paddingBottom": 4,
+        "paddingLeft": 4,
+        "paddingRight": 4,
+        "paddingTop": 4,
+      }
+    }
+  >
+    <Text
+      style={
+        {
+          "fontFamily": "GTStandardSemibold",
+          "fontSize": 38,
+          "letterSpacing": 0,
+          "lineHeight": 48,
+          "marginBottom": 4,
+        }
+      }
+      suppressHighlighting={true}
+    >
+      HStack
+    </Text>
+    <View
+      style={
+        {
+          "flexDirection": "column",
+          "paddingBottom": 4,
+          "paddingLeft": 4,
+          "paddingRight": 4,
+          "paddingTop": 4,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandardSemibold",
+            "fontSize": 24,
+            "letterSpacing": 0,
+            "lineHeight": 32,
+            "marginBottom": 4,
+          }
+        }
+        suppressHighlighting={true}
+      >
+        Default
+      </Text>
+      <View
+        style={
+          {
+            "flexDirection": "row",
+          }
+        }
+      >
+        <Text
+          style={
+            {
+              "fontFamily": "GTStandard",
+            }
+          }
+          suppressHighlighting={true}
+        >
+          1
+        </Text>
+        <Text
+          style={
+            {
+              "fontFamily": "GTStandard",
+            }
+          }
+          suppressHighlighting={true}
+        >
+          2
+        </Text>
+      </View>
+    </View>
+    <View
+      style={
+        {
+          "flexDirection": "column",
+          "paddingBottom": 4,
+          "paddingLeft": 4,
+          "paddingRight": 4,
+          "paddingTop": 4,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandardSemibold",
+            "fontSize": 24,
+            "letterSpacing": 0,
+            "lineHeight": 32,
+            "marginBottom": 4,
+          }
+        }
+        suppressHighlighting={true}
+      >
+        With gap (space)
+      </Text>
+      <View
+        style={
+          {
+            "flexDirection": "row",
+            "gap": 2,
+          }
+        }
+      >
+        <Text
+          style={
+            {
+              "backgroundColor": "#563B56",
+              "fontFamily": "GTStandard",
+            }
+          }
+          suppressHighlighting={true}
+        >
+          1
+        </Text>
+        <Text
+          style={
+            {
+              "backgroundColor": "#563B56",
+              "fontFamily": "GTStandard",
+            }
+          }
+          suppressHighlighting={true}
+        >
+          2
+        </Text>
+      </View>
+    </View>
+  </View>
+  <View
+    style={
+      {
+        "flexDirection": "column",
+        "paddingBottom": 4,
+        "paddingLeft": 4,
+        "paddingRight": 4,
+        "paddingTop": 4,
+      }
+    }
+  >
+    <Text
+      style={
+        {
+          "fontFamily": "GTStandardSemibold",
+          "fontSize": 38,
+          "letterSpacing": 0,
+          "lineHeight": 48,
+          "marginBottom": 4,
+        }
+      }
+      suppressHighlighting={true}
+    >
+      VStack
+    </Text>
+    <View
+      style={
+        {
+          "flexDirection": "column",
+          "paddingBottom": 4,
+          "paddingLeft": 4,
+          "paddingRight": 4,
+          "paddingTop": 4,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandardSemibold",
+            "fontSize": 24,
+            "letterSpacing": 0,
+            "lineHeight": 32,
+            "marginBottom": 4,
+          }
+        }
+        suppressHighlighting={true}
+      >
+        Default
+      </Text>
+      <View
+        style={
+          {
+            "flexDirection": "column",
+          }
+        }
+      >
+        <Text
+          style={
+            {
+              "fontFamily": "GTStandard",
+            }
+          }
+          suppressHighlighting={true}
+        >
+          1
+        </Text>
+        <Text
+          style={
+            {
+              "fontFamily": "GTStandard",
+            }
+          }
+          suppressHighlighting={true}
+        >
+          2
+        </Text>
+      </View>
+    </View>
+    <View
+      style={
+        {
+          "flexDirection": "column",
+          "paddingBottom": 4,
+          "paddingLeft": 4,
+          "paddingRight": 4,
+          "paddingTop": 4,
+        }
+      }
+    >
+      <Text
+        style={
+          {
+            "fontFamily": "GTStandardSemibold",
+            "fontSize": 24,
+            "letterSpacing": 0,
+            "lineHeight": 32,
+            "marginBottom": 4,
+          }
+        }
+        suppressHighlighting={true}
+      >
+        With gap (space)
+      </Text>
+      <View
+        style={
+          {
+            "flexDirection": "column",
+            "gap": 2,
+          }
+        }
+      >
+        <Text
+          style={
+            {
+              "backgroundColor": "#563B56",
+              "fontFamily": "GTStandard",
+            }
+          }
+          suppressHighlighting={true}
+        >
+          1
+        </Text>
+        <Text
+          style={
+            {
+              "backgroundColor": "#563B56",
+              "fontFamily": "GTStandard",
+            }
+          }
+          suppressHighlighting={true}
+        >
+          2
+        </Text>
+      </View>
+    </View>
+  </View>
+</RNCSafeAreaProvider>
+`;

package/src/components/primitives/__snapshots__/View.stories.tsx.snap

@@ -0,0 +1,25 @@
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+
+exports[`bumper/Primitives/View View 1`] = `
+<RNCSafeAreaProvider
+  onInsetsChange={[Function]}
+  style={
+    [
+      {
+        "flex": 1,
+      },
+      undefined,
+    ]
+  }
+>
+  <View
+    style={
+      {
+        "backgroundColor": "#F7F4EE",
+        "height": 500,
+        "width": 50,
+      }
+    }
+  />
+</RNCSafeAreaProvider>
+`;

package/src/components/primitives/__snapshots_web__/Stack.stories.tsx.snap

@@ -0,0 +1,190 @@
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+
+exports[`bumper/Primitives/Stacks Stacks 1`] = `
+<DocumentFragment>
+  <div
+    class="css-view-175oi2r r-flex-13awgt0"
+  >
+    <span
+      class=""
+      style="display: contents;"
+    >
+      <span
+        class=" "
+        style="display: contents;"
+      >
+        <span
+          class=" t_light is_Theme"
+          style="display: contents;"
+        >
+          <span
+            class="font_unset _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px"
+          >
+            - space is deprecated, use gap instead - direction from NB is now flexDirection- reversed from NB is now direction (rtl/ltr)
+          </span>
+          <div
+            class="is_VStack _display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-column _paddingTop-t-space-4 _paddingBottom-t-space-4 _paddingRight-t-space-4 _paddingLeft-t-space-4"
+          >
+            <span
+              class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-t-space-4 _marginLeft-0px _fontFamily-f-family _fontSize-f-size-head100347201 _lineHeight-f-lineHeigh1544154440 _letterSpacing-f-letterSpa1195674547 _fontWeight-f-weight-se1074390495"
+              data-disable-theme="true"
+            >
+              Stack
+            </span>
+            <div
+              class="is_VStack _display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-column _paddingTop-t-space-4 _paddingBottom-t-space-4 _paddingRight-t-space-4 _paddingLeft-t-space-4"
+            >
+              <span
+                class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-t-space-4 _marginLeft-0px _fontFamily-f-family _fontSize-f-size-head100347202 _lineHeight-f-lineHeigh1544154441 _letterSpacing-f-letterSpa1195674548 _fontWeight-f-weight-se1074390495"
+                data-disable-theme="true"
+              >
+                Demo
+              </span>
+              <div
+                class="_display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-column-reve113220 _gap-t-space-2"
+              >
+                <span
+                  class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _fontFamily-f-family"
+                  data-disable-theme="true"
+                >
+                  1
+                </span>
+                <span
+                  class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _fontFamily-f-family"
+                  data-disable-theme="true"
+                >
+                  2
+                </span>
+              </div>
+            </div>
+          </div>
+          <div
+            class="is_VStack _display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-column _paddingTop-t-space-4 _paddingBottom-t-space-4 _paddingRight-t-space-4 _paddingLeft-t-space-4"
+          >
+            <span
+              class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-t-space-4 _marginLeft-0px _fontFamily-f-family _fontSize-f-size-head100347201 _lineHeight-f-lineHeigh1544154440 _letterSpacing-f-letterSpa1195674547 _fontWeight-f-weight-se1074390495"
+              data-disable-theme="true"
+            >
+              HStack
+            </span>
+            <div
+              class="is_VStack _display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-column _paddingTop-t-space-4 _paddingBottom-t-space-4 _paddingRight-t-space-4 _paddingLeft-t-space-4"
+            >
+              <span
+                class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-t-space-4 _marginLeft-0px _fontFamily-f-family _fontSize-f-size-head100347202 _lineHeight-f-lineHeigh1544154441 _letterSpacing-f-letterSpa1195674548 _fontWeight-f-weight-se1074390495"
+                data-disable-theme="true"
+              >
+                Default
+              </span>
+              <div
+                class="is_HStack _display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-row"
+              >
+                <span
+                  class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _fontFamily-f-family"
+                  data-disable-theme="true"
+                >
+                  1
+                </span>
+                <span
+                  class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _fontFamily-f-family"
+                  data-disable-theme="true"
+                >
+                  2
+                </span>
+              </div>
+            </div>
+            <div
+              class="is_VStack _display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-column _paddingTop-t-space-4 _paddingBottom-t-space-4 _paddingRight-t-space-4 _paddingLeft-t-space-4"
+            >
+              <span
+                class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-t-space-4 _marginLeft-0px _fontFamily-f-family _fontSize-f-size-head100347202 _lineHeight-f-lineHeigh1544154441 _letterSpacing-f-letterSpa1195674548 _fontWeight-f-weight-se1074390495"
+                data-disable-theme="true"
+              >
+                With gap (space)
+              </span>
+              <div
+                class="is_HStack _display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-row _gap-t-space-2"
+              >
+                <span
+                  class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _fontFamily-f-family _backgroundColor-bg--accent-1633109644"
+                  data-disable-theme="true"
+                >
+                  1
+                </span>
+                <span
+                  class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _fontFamily-f-family _backgroundColor-bg--accent-1633109644"
+                  data-disable-theme="true"
+                >
+                  2
+                </span>
+              </div>
+            </div>
+          </div>
+          <div
+            class="is_VStack _display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-column _paddingTop-t-space-4 _paddingBottom-t-space-4 _paddingRight-t-space-4 _paddingLeft-t-space-4"
+          >
+            <span
+              class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-t-space-4 _marginLeft-0px _fontFamily-f-family _fontSize-f-size-head100347201 _lineHeight-f-lineHeigh1544154440 _letterSpacing-f-letterSpa1195674547 _fontWeight-f-weight-se1074390495"
+              data-disable-theme="true"
+            >
+              VStack
+            </span>
+            <div
+              class="is_VStack _display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-column _paddingTop-t-space-4 _paddingBottom-t-space-4 _paddingRight-t-space-4 _paddingLeft-t-space-4"
+            >
+              <span
+                class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-t-space-4 _marginLeft-0px _fontFamily-f-family _fontSize-f-size-head100347202 _lineHeight-f-lineHeigh1544154441 _letterSpacing-f-letterSpa1195674548 _fontWeight-f-weight-se1074390495"
+                data-disable-theme="true"
+              >
+                Default
+              </span>
+              <div
+                class="is_VStack _display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-column"
+              >
+                <span
+                  class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _fontFamily-f-family"
+                  data-disable-theme="true"
+                >
+                  1
+                </span>
+                <span
+                  class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _fontFamily-f-family"
+                  data-disable-theme="true"
+                >
+                  2
+                </span>
+              </div>
+            </div>
+            <div
+              class="is_VStack _display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-column _paddingTop-t-space-4 _paddingBottom-t-space-4 _paddingRight-t-space-4 _paddingLeft-t-space-4"
+            >
+              <span
+                class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-t-space-4 _marginLeft-0px _fontFamily-f-family _fontSize-f-size-head100347202 _lineHeight-f-lineHeigh1544154441 _letterSpacing-f-letterSpa1195674548 _fontWeight-f-weight-se1074390495"
+                data-disable-theme="true"
+              >
+                With gap (space)
+              </span>
+              <div
+                class="is_VStack _display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-column _gap-t-space-2"
+              >
+                <span
+                  class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _fontFamily-f-family _backgroundColor-bg--accent-1633109644"
+                  data-disable-theme="true"
+                >
+                  1
+                </span>
+                <span
+                  class="font_GTStandard _WebkitFontSmoothing-_platformweb_antialiased _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _marginTop-0px _marginRight-0px _marginBottom-0px _marginLeft-0px _fontFamily-f-family _backgroundColor-bg--accent-1633109644"
+                  data-disable-theme="true"
+                >
+                  2
+                </span>
+              </div>
+            </div>
+          </div>
+        </span>
+      </span>
+    </span>
+  </div>
+</DocumentFragment>
+`;

package/src/components/primitives/__snapshots_web__/View.stories.tsx.snap

@@ -0,0 +1,28 @@
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+
+exports[`bumper/Primitives/View View 1`] = `
+<DocumentFragment>
+  <div
+    class="css-view-175oi2r r-flex-13awgt0"
+  >
+    <span
+      class=""
+      style="display: contents;"
+    >
+      <span
+        class=" "
+        style="display: contents;"
+      >
+        <span
+          class=" t_light is_Theme"
+          style="display: contents;"
+        >
+          <div
+            class="_display-flex _alignItems-stretch _flexDirection-column _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _width-50px _height-500px _backgroundColor-bg--base--m757972454"
+          />
+        </span>
+      </span>
+    </span>
+  </div>
+</DocumentFragment>
+`;