@servesall/atoms 1.1.23 → 1.1.25

package/dist/bundle.web.esm/src/Layout/WebSmallWrapper.js

@@ -0,0 +1,15 @@
+import React__default from 'react';
+import { WebSmallWrapperElement } from './Layout.style.web.js';
+
+var WebSmallWrapper = function WebSmallWrapper(_ref) {
+  var children = _ref.children,
+      style = _ref.style,
+      _ref$direction = _ref.direction,
+      direction = _ref$direction === void 0 ? false : _ref$direction;
+  return /*#__PURE__*/React__default.createElement(WebSmallWrapperElement, {
+    style: style,
+    direction: direction
+  }, children);
+};
+
+export { WebSmallWrapper as default };

package/dist/bundle.web.esm/src/Text/H1.js

@@ -0,0 +1,29 @@
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default from 'react';
+import PropTypes from 'prop-types';
+import { H1 } from './Text.style.web.js';
+
+var _excluded = ["children", "style", "align", "color", "fontFamily"];
+
+var H1Text = function H1Text(_ref) {
+  var children = _ref.children,
+      style = _ref.style,
+      _ref$align = _ref.align,
+      align = _ref$align === void 0 ? "left" : _ref$align,
+      color = _ref.color,
+      fontFamily = _ref.fontFamily,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/React__default.createElement(H1, _extends({}, rest, {
+    style: style,
+    align: align,
+    color: color,
+    fontFamily: fontFamily
+  }), children);
+};
+
+H1Text.propTypes = {
+  style: PropTypes.object
+};
+
+export { H1Text as default };

package/dist/bundle.web.esm/src/Text/H2.js

@@ -0,0 +1,29 @@
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default from 'react';
+import PropTypes from 'prop-types';
+import { H2 } from './Text.style.web.js';
+
+var _excluded = ["children", "style", "align", "color", "fontFamily"];
+
+var H2Text = function H2Text(_ref) {
+  var children = _ref.children,
+      style = _ref.style,
+      _ref$align = _ref.align,
+      align = _ref$align === void 0 ? "left" : _ref$align,
+      color = _ref.color,
+      fontFamily = _ref.fontFamily,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/React__default.createElement(H2, _extends({}, rest, {
+    style: style,
+    align: align,
+    color: color,
+    fontFamily: fontFamily
+  }), children);
+};
+
+H2Text.propTypes = {
+  style: PropTypes.object
+};
+
+export { H2Text as default };

package/dist/bundle.web.esm/src/Text/H3.js

@@ -0,0 +1,29 @@
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default from 'react';
+import PropTypes from 'prop-types';
+import { H3 } from './Text.style.web.js';
+
+var _excluded = ["children", "style", "align", "color", "fontFamily"];
+
+var H3Text = function H3Text(_ref) {
+  var children = _ref.children,
+      style = _ref.style,
+      _ref$align = _ref.align,
+      align = _ref$align === void 0 ? "left" : _ref$align,
+      color = _ref.color,
+      fontFamily = _ref.fontFamily,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/React__default.createElement(H3, _extends({}, rest, {
+    style: style,
+    align: align,
+    color: color,
+    fontFamily: fontFamily
+  }), children);
+};
+
+H3Text.propTypes = {
+  style: PropTypes.object
+};
+
+export { H3Text as default };

package/dist/bundle.web.esm/src/Text/H4.js

@@ -0,0 +1,29 @@
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default from 'react';
+import PropTypes from 'prop-types';
+import { H4 } from './Text.style.web.js';
+
+var _excluded = ["children", "style", "align", "color", "fontFamily"];
+
+var H4Text = function H4Text(_ref) {
+  var children = _ref.children,
+      style = _ref.style,
+      _ref$align = _ref.align,
+      align = _ref$align === void 0 ? "left" : _ref$align,
+      color = _ref.color,
+      fontFamily = _ref.fontFamily,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/React__default.createElement(H4, _extends({}, rest, {
+    style: style,
+    align: align,
+    color: color,
+    fontFamily: fontFamily
+  }), children);
+};
+
+H4Text.propTypes = {
+  style: PropTypes.object
+};
+
+export { H4Text as default };

package/dist/bundle.web.esm/src/Text/H5.js

@@ -0,0 +1,29 @@
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default from 'react';
+import PropTypes from 'prop-types';
+import { H5 } from './Text.style.web.js';
+
+var _excluded = ["children", "style", "align", "color", "fontFamily"];
+
+var H5Text = function H5Text(_ref) {
+  var children = _ref.children,
+      style = _ref.style,
+      _ref$align = _ref.align,
+      align = _ref$align === void 0 ? "left" : _ref$align,
+      color = _ref.color,
+      fontFamily = _ref.fontFamily,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/React__default.createElement(H5, _extends({}, rest, {
+    style: style,
+    align: align,
+    color: color,
+    fontFamily: fontFamily
+  }), children);
+};
+
+H5Text.propTypes = {
+  style: PropTypes.object
+};
+
+export { H5Text as default };

package/dist/bundle.web.esm/src/Text/P.js

@@ -0,0 +1,29 @@
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default from 'react';
+import PropTypes from 'prop-types';
+import { P } from './Text.style.web.js';
+
+var _excluded = ["children", "style", "align", "color", "fontFamily"];
+
+var pText = function pText(_ref) {
+  var children = _ref.children,
+      style = _ref.style,
+      _ref$align = _ref.align,
+      align = _ref$align === void 0 ? "left" : _ref$align,
+      color = _ref.color,
+      fontFamily = _ref.fontFamily,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/React__default.createElement(P, _extends({}, rest, {
+    style: style,
+    align: align,
+    color: color,
+    fontFamily: fontFamily
+  }), children);
+};
+
+pText.propTypes = {
+  style: PropTypes.object
+};
+
+export { pText as default };

package/dist/bundle.web.esm/src/Text/Span.js

@@ -0,0 +1,29 @@
+import { objectWithoutProperties as _objectWithoutProperties, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default from 'react';
+import PropTypes from 'prop-types';
+import { Span } from './Text.style.web.js';
+
+var _excluded = ["children", "style", "align", "color", "fontFamily"];
+
+var SpanText = function SpanText(_ref) {
+  var children = _ref.children,
+      style = _ref.style,
+      _ref$align = _ref.align,
+      align = _ref$align === void 0 ? "left" : _ref$align,
+      color = _ref.color,
+      fontFamily = _ref.fontFamily,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/React__default.createElement(Span, _extends({}, rest, {
+    style: style,
+    align: align,
+    color: color,
+    fontFamily: fontFamily
+  }), children);
+};
+
+SpanText.propTypes = {
+  style: PropTypes.object
+};
+
+export { SpanText as default };

package/dist/bundle.web.esm/src/Text/Text.style.web.js

@@ -0,0 +1,97 @@
+import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import styled from 'styled-components';
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
+var H1 = styled.h1(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  font-size: ", ";\n  font-family: ", ";\n  text-align: ", ";\n  color: ", ";\n  line-height: ", ";\n  ", ";\n"])), function (props) {
+  return props.theme.large;
+}, function (props) {
+  return props.fontFamily || props.theme.fontFamily1;
+}, function (props) {
+  return props.align;
+}, function (props) {
+  return props.color || (props.secondary ? props.theme.secondaryText : props.theme.primaryText);
+}, function (props) {
+  return props.theme.lhLarge;
+}, function (props) {
+  return props.style;
+});
+var H2 = styled.h2(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  font-size: ", ";\n  font-family: ", ";\n  text-align: ", ";\n  color: ", ";\n  line-height: ", ";\n  ", ";\n"])), function (props) {
+  return props.theme.medium;
+}, function (props) {
+  return props.fontFamily || props.theme.fontFamily1;
+}, function (props) {
+  return props.align;
+}, function (props) {
+  return props.color || (props.secondary ? props.theme.secondaryText : props.theme.primaryText);
+}, function (props) {
+  return props.theme.lhMedium;
+}, function (props) {
+  return props.style;
+});
+var H3 = styled.h3(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  font-size: ", ";\n  font-family: ", ";\n  text-align: ", ";\n  color: ", ";\n  line-height: ", ";\n  ", ";\n"])), function (props) {
+  return props.theme.small;
+}, function (props) {
+  return props.fontFamily || props.theme.fontFamily1;
+}, function (props) {
+  return props.align;
+}, function (props) {
+  return props.color || (props.secondary ? props.theme.secondaryText : props.theme.primaryText);
+}, function (props) {
+  return props.theme.lhSmall;
+}, function (props) {
+  return props.style;
+});
+var H4 = styled.h4(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  font-size: ", ";\n  font-family: ", ";\n  text-align: ", ";\n  color: ", ";\n  line-height: ", ";\n  ", ";\n"])), function (props) {
+  return props.theme.xsmall;
+}, function (props) {
+  return props.fontFamily || props.theme.fontFamily1;
+}, function (props) {
+  return props.align;
+}, function (props) {
+  return props.color || (props.secondary ? props.theme.secondaryText : props.theme.primaryText);
+}, function (props) {
+  return props.theme.small;
+}, function (props) {
+  return props.style;
+});
+var H5 = styled.h5(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  font-size: ", ";\n  font-family: ", ";\n  text-align: ", ";\n  color: ", ";\n  line-height: ", ";\n  ", ";\n"])), function (props) {
+  return props.theme.xssmall;
+}, function (props) {
+  return props.fontFamily || props.theme.fontFamily1;
+}, function (props) {
+  return props.align;
+}, function (props) {
+  return props.color || (props.secondary ? props.theme.secondaryText : props.theme.primaryText);
+}, function (props) {
+  return props.theme.xssmall;
+}, function (props) {
+  return props.style;
+});
+var Span = styled.span(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  font-size: ", ";\n  font-family: ", ";\n  text-align: ", ";\n  color: ", ";\n  line-height: ", ";\n  ", ";\n"])), function (props) {
+  return props.theme.small;
+}, function (props) {
+  return props.fontFamily || props.theme.fontFamily1;
+}, function (props) {
+  return props.align;
+}, function (props) {
+  return props.color || (props.secondary ? props.theme.secondaryText : props.theme.primaryText);
+}, function (props) {
+  return props.theme.lhSmall;
+}, function (props) {
+  return props.style;
+});
+var P = styled.p(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n  font-size: ", ";\n  font-family: ", ";\n  text-align: ", ";\n  color: ", ";\n  line-height: ", ";\n  ", ";\n"])), function (props) {
+  return props.theme.small;
+}, function (props) {
+  return props.fontFamily || props.theme.fontFamily1;
+}, function (props) {
+  return props.align;
+}, function (props) {
+  return props.color || (props.secondary ? props.theme.secondaryText : props.theme.primaryText);
+}, function (props) {
+  return props.theme.lhSmall;
+}, function (props) {
+  return props.style;
+});
+
+export { H1, H2, H3, H4, H5, P, Span };

package/dist/bundle.web.esm/src/Theme/colorScheme.web.js

@@ -0,0 +1,43 @@
+"use client";
+import { slicedToArray as _slicedToArray } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import * as React from 'react';
+
+function useColorScheme() {
+  var _React$useState = React.useState("light"),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      colorScheme = _React$useState2[0],
+      setColorScheme = _React$useState2[1];
+
+  React.useEffect(function () {
+    if (typeof window.matchMedia !== "function") return;
+    var media = window.matchMedia("(prefers-color-scheme: dark)");
+
+    var handleChange = function handleChange() {
+      return setColorScheme(media.matches ? "dark" : "light");
+    }; // Set initial on mount
+
+
+    handleChange();
+
+    if (typeof media.addEventListener === "function") {
+      media.addEventListener("change", handleChange);
+      return function () {
+        return media.removeEventListener("change", handleChange);
+      };
+    } // Fallback for older browsers without addEventListener
+
+
+    if ("onchange" in media) {
+      media.onchange = handleChange;
+      return function () {
+        media.onchange = null;
+      };
+    } // No supported listener API; nothing to clean up
+
+
+    return;
+  }, []);
+  return colorScheme;
+}
+
+export { useColorScheme };

package/dist/bundle.web.esm/src/Theme/definitions/colors.js

@@ -0,0 +1,158 @@
+import { objectSpread2 as _objectSpread2 } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+
+var colorMap = {
+  white: "#FFFFFF",
+  hotPink: "#E576A2",
+  lightPink: "#FA9EBC",
+  salmonPink: "#FFD1E0",
+  skyBlue: "#3187F6",
+  lightBlue: "#CFEAFF",
+  greyBlue: "#212E66",
+  blue: "#0B1957",
+  darkBlue: "#060630"
+};
+
+var colors = _objectSpread2(_objectSpread2({
+  backwardCompatibility: {
+    // Whites & Grays
+    color1: "#FFFFFF",
+    // Pure white
+    color7: "#dfe6e9",
+    // Light gray
+    color8: "#F8F9FB",
+    // Very light gray
+    color10: "#F2F3F7",
+    // Another light gray
+    color16: "#636e72",
+    // Dark gray
+    greyText: "#b2bec3",
+    // Gray for text
+    greyButton: "#94A3A9",
+    // Gray for buttons
+    color2: "#2d3436",
+    // Almost black
+    // Blues
+    color3: "#74b9ff",
+    // Light blue
+    color3light: "#E1F0FF",
+    // Very light blue
+    color4: "#0984e3",
+    // Medium blue
+    blue: "#74b9ff",
+    // Light blue (duplicate)
+    blueLight: "#E1F0FF",
+    // Very light blue (duplicate)
+    darkBlue: "#0984e3",
+    // Medium blue (duplicate)
+    darkBlueLight: "#CFEAFF",
+    // Pale blue
+    color15: "#00cec9",
+    // Cyan
+    color18: "#81ecec",
+    // Light cyan
+    // Yellows
+    color5: "#ffeaa7",
+    // Light yellow
+    color5light: "#FFF9E5",
+    // Very light yellow
+    color5border: "#E4E0D2",
+    // Yellow border
+    darkYellow: "#fdcb6e",
+    // Dark yellow
+    darkYellowLight: "#FFF7E8",
+    // Light yellow
+    darkYellowDark: "#8C6F39",
+    // Brown yellow
+    darkYellowGray: "#ECE5D8",
+    // Grayish yellow
+    // Oranges & Browns
+    color9: "#FFA15F",
+    // Orange
+    color9light: "#F9F0EA",
+    // Light orange
+    color9dark: "#804F2D",
+    // Dark brown
+    color9border: "#DDD1C9",
+    // Orange border
+    color13: "#fab1a0",
+    // Peach
+    orange: "#FFA15F",
+    // Orange (duplicate)
+    orangeLight: "#FFFAF6",
+    // Light orange
+    orangeDark: "#3D1901",
+    // Very dark brown
+    orangeGray: "#EEE5DE",
+    // Grayish orange
+    // Reds
+    color6: "#ff7675",
+    // Red
+    color6light: "#FFDCDB",
+    // Light red
+    red: "#ff7675",
+    // Red (duplicate)
+    redlight: "#fff0ed",
+    // Very light red
+    redDark: "#9C4140",
+    // Dark red
+    redBorder: "#D2BBBB",
+    // Red border
+    // Greens
+    color11: "#00b894",
+    // Green
+    color11light: "#EEFFFC",
+    // Light green
+    color11border: "#D2E3E0",
+    // Green border
+    color14: "#00b894",
+    // Green (duplicate)
+    green: "#55efc4",
+    // Light green
+    greenLight: "#F3FFFC",
+    // Very light green
+    greenDark: "#236A56",
+    // Dark green
+    // Purples
+    color12: "#6c5ce7",
+    // Purple
+    color12light: "#F5F4FF",
+    // Light purple
+    color12border: "#DFDDEA",
+    // Purple border
+    color12dark: "#584E74",
+    // Dark purple
+    color17: "#6c5ce7",
+    // Purple (duplicate)
+    purple: "#6c5ce7",
+    // Purple (duplicate)
+    purpleLight: "#F9F8FF",
+    // Light purple
+    purpleDark: "#372E78" // Dark purple
+
+  }
+}, colorMap), {}, {
+  // Light Mode
+  lightMode: {
+    background: colorMap.salmonPink,
+    primaryButton: colorMap.darkBlue,
+    primaryButtonText: colorMap.salmonPink,
+    secondaryButton: colorMap.skyBlue,
+    secondaryButtonText: colorMap.salmonPink,
+    primaryText: colorMap.blue,
+    secondaryText: colorMap.greyBlue,
+    border: colorMap.greyBlue
+  },
+  // Dark Mode
+  darkMode: {
+    background: colorMap.darkBlue,
+    primaryButton: colorMap.hotPink,
+    primaryButtonText: colorMap.darkBlue,
+    secondaryButton: colorMap.skyBlue,
+    secondaryButtonText: colorMap.salmonPink,
+    primaryText: colorMap.salmonPink,
+    secondaryText: colorMap.lightPink,
+    border: colorMap.lightPink
+  }
+});
+
+export { colors as default };

package/dist/bundle.web.esm/src/Theme/definitions/fonts.import.js

@@ -0,0 +1,9 @@
+import { taggedTemplateLiteral as _taggedTemplateLiteral } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import { createGlobalStyle } from 'styled-components';
+import EestiRegular from '../../../assets/fonts/GTEestiProDisplay-Regular.ttf.js';
+import EestiBold from '../../../assets/fonts/GTEestiProDisplay-Bold.ttf.js';
+
+var _templateObject;
+var FontStyles = createGlobalStyle(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  @font-face {\n    font-family: 'Eesti';\n    src: url(", ") format('truetype');\n    font-weight: 400;\n  }\n\n  @font-face {\n    font-family: 'Eesti';\n    src: url(", ") format('truetype');\n    font-weight: 700;\n  }\n\n  body {\n    font-family: 'Eesti', sans-serif;\n  }\n"])), EestiRegular, EestiBold);
+
+export { FontStyles };

package/dist/bundle.web.esm/src/Theme/definitions/fonts.js

@@ -0,0 +1,19 @@
+var fonts = {
+  xssmall: "14px",
+  xsmall: "16px",
+  lhXsmall: "15px",
+  small: "18px",
+  lhSmall: "21px",
+  medium: "24px",
+  lhMedium: "27px",
+  large: "36px",
+  lhLarge: "39px",
+  xlarge: "66px",
+  lhXlarge: "69px",
+  fontFamily1: "Eesti",
+  fontFamily2: "Eesti",
+  fontWeight1: "400",
+  fontWeight2: "700"
+};
+
+export { fonts as default };

package/dist/bundle.web.esm/src/Theme/definitions/index.js

@@ -0,0 +1,10 @@
+import { objectSpread2 as _objectSpread2 } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import colors from './colors.js';
+import fonts from './fonts.js';
+import layout from './layout.js';
+
+var theme = function theme(colorScheme) {
+  return _objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({}, fonts), layout), colors.backwardCompatibility), colorScheme === "dark" ? colors.darkMode : colors.lightMode);
+};
+
+export { theme };

package/dist/bundle.web.esm/src/Theme/definitions/layout.js

@@ -0,0 +1,12 @@
+var layout = {
+  margin: "16px",
+  padding: "10px",
+  borderRadius: "8px",
+  borderRadiusMedium: "16px",
+  borderRadiusSmall: "8px",
+  webPageMarginBig: "100px",
+  webPageMarginMedium: "50px",
+  webPageMarginSmall: "16px"
+};
+
+export { layout as default };

package/dist/bundle.web.esm/src/Theme/index.web.js

@@ -0,0 +1,31 @@
+"use client";
+import { objectSpread2 as _objectSpread2 } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import React__default from 'react';
+import { ThemeProvider, ThemeContext } from 'styled-components';
+export { ThemeContext } from 'styled-components';
+import { theme } from './definitions/index.js';
+import { FontStyles } from './definitions/fonts.import.js';
+import { useColorScheme } from './colorScheme.web.js';
+
+// prettier-ignore
+var ThemeWrapperContext = /*#__PURE__*/React__default.createContext();
+
+var ThemeWrapper = function ThemeWrapper(_ref) {
+  var children = _ref.children,
+      _ref$theme = _ref.theme,
+      theme$1 = _ref$theme === void 0 ? {} : _ref$theme;
+  var colorScheme = useColorScheme();
+  return /*#__PURE__*/React__default.createElement(ThemeWrapperContext.Provider, {
+    value: _objectSpread2({}, theme$1)
+  }, /*#__PURE__*/React__default.createElement(ThemeProvider, {
+    theme: _objectSpread2(_objectSpread2(_objectSpread2({}, theme(colorScheme)), theme$1), {}, {
+      colorScheme: colorScheme
+    })
+  }, /*#__PURE__*/React__default.createElement(FontStyles, null), children));
+};
+
+var useThemeContext = function useThemeContext() {
+  return React__default.useContext(ThemeContext);
+};
+
+export { ThemeWrapper, useThemeContext };

package/dist/bundle.web.esm/src/index.web.js

@@ -0,0 +1,38 @@
+export { ThemeWrapper, useThemeContext } from './Theme/index.web.js';
+export { default as H1 } from './Text/H1.js';
+export { default as H2 } from './Text/H2.js';
+export { default as H3 } from './Text/H3.js';
+export { default as H4 } from './Text/H4.js';
+export { default as H5 } from './Text/H5.js';
+export { default as P } from './Text/P.js';
+export { default as Span } from './Text/Span.js';
+export { default as Icon } from './Icons/index.web.js';
+export { default as Center } from './Layout/Center.js';
+export { default as CenterLeft } from './Layout/CenterLeft.js';
+export { default as CenterRight } from './Layout/CenterRight.js';
+export { default as Margin } from './Layout/Margin.js';
+export { default as MarginHorizontal } from './Layout/MarginHorizontal.js';
+export { default as MarginVertical } from './Layout/MarginVertical.js';
+export { default as MarginBottom } from './Layout/MarginBottom.js';
+export { default as MarginTop } from './Layout/MarginTop.js';
+export { default as MarginRight } from './Layout/MarginRight.js';
+export { default as MarginLeft } from './Layout/MarginLeft.js';
+export { default as Padding } from './Layout/Padding.js';
+export { default as PaddingHorizontal } from './Layout/PaddingHorizontal.js';
+export { default as PaddingVertical } from './Layout/PaddingVertical.js';
+export { default as PaddingTop } from './Layout/PaddingTop.js';
+export { default as PaddingBottom } from './Layout/PaddingBottom.js';
+export { default as PaddingLeft } from './Layout/PaddingLeft.js';
+export { default as PaddingRight } from './Layout/PaddingRight.js';
+export { default as Row } from './Layout/Row.js';
+export { default as Stretch } from './Layout/Stretch.js';
+export { default as FullScreen } from './Layout/FullScreen.js';
+export { default as WebSmallWrapper } from './Layout/WebSmallWrapper.js';
+export { default as Box } from './Layout/Box.js';
+export { default as RoundedTopBox } from './Layout/RoundedTopBox.js';
+export { default as BorderBottom } from './Layout/BorderBottom.js';
+export { default as BorderTop } from './Layout/BorderTop.js';
+export { default as BorderBox } from './Layout/BorderBox.js';
+export { default as ImageWrapper } from './Layout/ImageWrapper.js';
+export { default as Background } from './Layout/Background.web.js';
+export { default as RoundedBox } from './Layout/RoundedBox.js';