@servesall/atoms 1.1.9 → 1.1.10

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 (9) hide show
  1. package/dist/bundle.cjs.js +44 -6
  2. package/dist/bundle.esm.js +43 -7
  3. package/dist/bundle.umd.js +44 -6
  4. package/package.json +1 -1
  5. package/src/Layout/Layout.style.js +12 -0
  6. package/src/Layout/PaddingLeft.js +12 -0
  7. package/src/Layout/PaddingRight.js +12 -0
  8. package/src/Layout/index.js +4 -0
  9. package/src/index.js +4 -0
package/dist/bundle.cjs.js CHANGED
@@ -551,7 +551,7 @@ SpanText.propTypes = {
551
551
  style: PropTypes__default["default"].object
552
552
  };
553
553
 
554
- var _templateObject$m, _templateObject2$d, _templateObject3$6, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19;
554
+ var _templateObject$m, _templateObject2$d, _templateObject3$6, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21;
555
555
  var DEFAULT_FLEX_DIRECTION = reactNative.Platform.OS === "web" ? "column" : "column";
556
556
  var CenterElement = styled__default["default"].View(_templateObject$m || (_templateObject$m = _taggedTemplateLiteral(["\n align-items: center;\n justify-content: center;\n flex: 1;\n flex-direction: ", ";\n ", ";\n"])), function (props) {
557
557
  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
@@ -653,25 +653,39 @@ var PaddingBottomElement = styled__default["default"].View(_templateObject14 ||
653
653
  }, function (props) {
654
654
  return props.style;
655
655
  });
656
- var RowElement = styled__default["default"].View(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n flex-direction: row;\n ", ";\n"])), function (props) {
656
+ var PaddingLeftElement = styled__default["default"].View(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n padding-left: ", ";\n flex-direction: ", ";\n ", ";\n"])), function (props) {
657
+ return props.theme.padding;
658
+ }, function (props) {
659
+ return props.flexDirection || DEFAULT_FLEX_DIRECTION;
660
+ }, function (props) {
657
661
  return props.style;
658
662
  });
659
- var StretchElement = styled__default["default"].View(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n align-items: stretch;\n align-self: stretch;\n flex-direction: ", ";\n ", ";\n"])), function (props) {
663
+ var PaddingRightElement = styled__default["default"].View(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n padding-right: ", ";\n flex-direction: ", ";\n ", ";\n"])), function (props) {
664
+ return props.theme.padding;
665
+ }, function (props) {
660
666
  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
661
667
  }, function (props) {
662
668
  return props.style;
663
669
  });
664
- var BoxElement = styled__default["default"].View(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n flex: 1;\n flex-direction: ", ";\n ", ";\n"])), function (props) {
670
+ var RowElement = styled__default["default"].View(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n flex-direction: row;\n ", ";\n"])), function (props) {
671
+ return props.style;
672
+ });
673
+ var StretchElement = styled__default["default"].View(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["\n align-items: stretch;\n align-self: stretch;\n flex-direction: ", ";\n ", ";\n"])), function (props) {
665
674
  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
666
675
  }, function (props) {
667
676
  return props.style;
668
677
  });
669
- var FullScreenElement = styled__default["default"].View(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n z-index: 11;\n flex-direction: ", ";\n ", ";\n"])), function (props) {
678
+ var BoxElement = styled__default["default"].View(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["\n flex: 1;\n flex-direction: ", ";\n ", ";\n"])), function (props) {
670
679
  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
671
680
  }, function (props) {
672
681
  return props.style;
673
682
  });
674
- var WebSmallWrapperElement = styled__default["default"].View(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["\n flex-direction: ", ";\n width: 500px;\n ", ";\n"])), function (props) {
683
+ var FullScreenElement = styled__default["default"].View(_templateObject20 || (_templateObject20 = _taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n z-index: 11;\n flex-direction: ", ";\n ", ";\n"])), function (props) {
684
+ return props.flexDirection || DEFAULT_FLEX_DIRECTION;
685
+ }, function (props) {
686
+ return props.style;
687
+ });
688
+ var WebSmallWrapperElement = styled__default["default"].View(_templateObject21 || (_templateObject21 = _taggedTemplateLiteral(["\n flex-direction: ", ";\n width: 500px;\n ", ";\n"])), function (props) {
675
689
  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
676
690
  }, function (props) {
677
691
  return props.style;
@@ -831,6 +845,28 @@ var PaddingBottom = function PaddingBottom(_ref) {
831
845
  }, children);
832
846
  };
833
847
 
848
+ var PaddingLeft = function PaddingLeft(_ref) {
849
+ var children = _ref.children,
850
+ style = _ref.style,
851
+ _ref$direction = _ref.direction,
852
+ direction = _ref$direction === void 0 ? false : _ref$direction;
853
+ return /*#__PURE__*/React__default["default"].createElement(PaddingLeftElement, {
854
+ style: style,
855
+ flexDirection: direction
856
+ }, children);
857
+ };
858
+
859
+ var PaddingRight = function PaddingRight(_ref) {
860
+ var children = _ref.children,
861
+ style = _ref.style,
862
+ _ref$direction = _ref.direction,
863
+ direction = _ref$direction === void 0 ? false : _ref$direction;
864
+ return /*#__PURE__*/React__default["default"].createElement(PaddingRightElement, {
865
+ style: style,
866
+ flexDirection: direction
867
+ }, children);
868
+ };
869
+
834
870
  var Row = function Row(_ref) {
835
871
  var children = _ref.children,
836
872
  style = _ref.style;
@@ -54611,6 +54647,8 @@ exports.P = pText;
54611
54647
  exports.Padding = Padding;
54612
54648
  exports.PaddingBottom = PaddingBottom;
54613
54649
  exports.PaddingHorizontal = PaddingHorizontal;
54650
+ exports.PaddingLeft = PaddingLeft;
54651
+ exports.PaddingRight = PaddingRight;
54614
54652
  exports.PaddingTop = PaddingTop;
54615
54653
  exports.PaddingVertical = PaddingVertical;
54616
54654
  exports.RoundBtn = RoundBtn$3;
package/dist/bundle.esm.js CHANGED
@@ -538,7 +538,7 @@ SpanText.propTypes = {
538
538
  style: PropTypes.object
539
539
  };
540
540
 
541
- var _templateObject$m, _templateObject2$d, _templateObject3$6, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19;
541
+ var _templateObject$m, _templateObject2$d, _templateObject3$6, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21;
542
542
  var DEFAULT_FLEX_DIRECTION = Platform.OS === "web" ? "column" : "column";
543
543
  var CenterElement = styled.View(_templateObject$m || (_templateObject$m = _taggedTemplateLiteral(["\n align-items: center;\n justify-content: center;\n flex: 1;\n flex-direction: ", ";\n ", ";\n"])), function (props) {
544
544
  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
@@ -640,25 +640,39 @@ var PaddingBottomElement = styled.View(_templateObject14 || (_templateObject14 =
640
640
  }, function (props) {
641
641
  return props.style;
642
642
  });
643
- var RowElement = styled.View(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n flex-direction: row;\n ", ";\n"])), function (props) {
643
+ var PaddingLeftElement = styled.View(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n padding-left: ", ";\n flex-direction: ", ";\n ", ";\n"])), function (props) {
644
+ return props.theme.padding;
645
+ }, function (props) {
646
+ return props.flexDirection || DEFAULT_FLEX_DIRECTION;
647
+ }, function (props) {
644
648
  return props.style;
645
649
  });
646
- var StretchElement = styled.View(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n align-items: stretch;\n align-self: stretch;\n flex-direction: ", ";\n ", ";\n"])), function (props) {
650
+ var PaddingRightElement = styled.View(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n padding-right: ", ";\n flex-direction: ", ";\n ", ";\n"])), function (props) {
651
+ return props.theme.padding;
652
+ }, function (props) {
647
653
  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
648
654
  }, function (props) {
649
655
  return props.style;
650
656
  });
651
- var BoxElement = styled.View(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n flex: 1;\n flex-direction: ", ";\n ", ";\n"])), function (props) {
657
+ var RowElement = styled.View(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n flex-direction: row;\n ", ";\n"])), function (props) {
658
+ return props.style;
659
+ });
660
+ var StretchElement = styled.View(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["\n align-items: stretch;\n align-self: stretch;\n flex-direction: ", ";\n ", ";\n"])), function (props) {
652
661
  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
653
662
  }, function (props) {
654
663
  return props.style;
655
664
  });
656
- var FullScreenElement = styled.View(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n z-index: 11;\n flex-direction: ", ";\n ", ";\n"])), function (props) {
665
+ var BoxElement = styled.View(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["\n flex: 1;\n flex-direction: ", ";\n ", ";\n"])), function (props) {
657
666
  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
658
667
  }, function (props) {
659
668
  return props.style;
660
669
  });
661
- var WebSmallWrapperElement = styled.View(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["\n flex-direction: ", ";\n width: 500px;\n ", ";\n"])), function (props) {
670
+ var FullScreenElement = styled.View(_templateObject20 || (_templateObject20 = _taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n z-index: 11;\n flex-direction: ", ";\n ", ";\n"])), function (props) {
671
+ return props.flexDirection || DEFAULT_FLEX_DIRECTION;
672
+ }, function (props) {
673
+ return props.style;
674
+ });
675
+ var WebSmallWrapperElement = styled.View(_templateObject21 || (_templateObject21 = _taggedTemplateLiteral(["\n flex-direction: ", ";\n width: 500px;\n ", ";\n"])), function (props) {
662
676
  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
663
677
  }, function (props) {
664
678
  return props.style;
@@ -818,6 +832,28 @@ var PaddingBottom = function PaddingBottom(_ref) {
818
832
  }, children);
819
833
  };
820
834
 
835
+ var PaddingLeft = function PaddingLeft(_ref) {
836
+ var children = _ref.children,
837
+ style = _ref.style,
838
+ _ref$direction = _ref.direction,
839
+ direction = _ref$direction === void 0 ? false : _ref$direction;
840
+ return /*#__PURE__*/React.createElement(PaddingLeftElement, {
841
+ style: style,
842
+ flexDirection: direction
843
+ }, children);
844
+ };
845
+
846
+ var PaddingRight = function PaddingRight(_ref) {
847
+ var children = _ref.children,
848
+ style = _ref.style,
849
+ _ref$direction = _ref.direction,
850
+ direction = _ref$direction === void 0 ? false : _ref$direction;
851
+ return /*#__PURE__*/React.createElement(PaddingRightElement, {
852
+ style: style,
853
+ flexDirection: direction
854
+ }, children);
855
+ };
856
+
821
857
  var Row = function Row(_ref) {
822
858
  var children = _ref.children,
823
859
  style = _ref.style;
@@ -54561,4 +54597,4 @@ function NewCustomer(_ref2) {
54561
54597
  }));
54562
54598
  }
54563
54599
 
54564
- export { AnimatedButton$1 as AnimatedButton, AnimatedPlaceholder, AnimatedRoundedButton, BottomNavBar, Box, Center, CenterLeft, CenterRight, NewCustomer as CountryList, Error, ErrorText, AnimatedButton as FeedbackButton, FlatList, RoundBtn$1 as FloatingBtn, FullScreen, H1Text as H1, H2Text as H2, H3Text as H3, H4Text as H4, H5Text as H5, Header, Icon, Input$1 as Input, Input as InputNormal, InputOtp, InputPhone, Loader, Margin, MarginBottom, MarginHorizontal, MarginRight, MarginTop, MarginVertical, pText as P, Padding, PaddingBottom, PaddingHorizontal, PaddingTop, PaddingVertical, RoundBtn$3 as RoundBtn, RoundedBtn$1 as RoundedBtn, RoundedTopBox, Row, SpanText as Span, Stretch, Success, SwipeButton, Switch, TextBtn, ThemeWrapper, WebSmallWrapper, useThemeContext };
54600
+ export { AnimatedButton$1 as AnimatedButton, AnimatedPlaceholder, AnimatedRoundedButton, BottomNavBar, Box, Center, CenterLeft, CenterRight, NewCustomer as CountryList, Error, ErrorText, AnimatedButton as FeedbackButton, FlatList, RoundBtn$1 as FloatingBtn, FullScreen, H1Text as H1, H2Text as H2, H3Text as H3, H4Text as H4, H5Text as H5, Header, Icon, Input$1 as Input, Input as InputNormal, InputOtp, InputPhone, Loader, Margin, MarginBottom, MarginHorizontal, MarginRight, MarginTop, MarginVertical, pText as P, Padding, PaddingBottom, PaddingHorizontal, PaddingLeft, PaddingRight, PaddingTop, PaddingVertical, RoundBtn$3 as RoundBtn, RoundedBtn$1 as RoundedBtn, RoundedTopBox, Row, SpanText as Span, Stretch, Success, SwipeButton, Switch, TextBtn, ThemeWrapper, WebSmallWrapper, useThemeContext };
package/dist/bundle.umd.js CHANGED
@@ -543,7 +543,7 @@
543
543
  style: PropTypes__default["default"].object
544
544
  };
545
545
 
546
- var _templateObject$m, _templateObject2$d, _templateObject3$6, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19;
546
+ var _templateObject$m, _templateObject2$d, _templateObject3$6, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21;
547
547
  var DEFAULT_FLEX_DIRECTION = reactNative.Platform.OS === "web" ? "column" : "column";
548
548
  var CenterElement = styled__default["default"].View(_templateObject$m || (_templateObject$m = _taggedTemplateLiteral(["\n align-items: center;\n justify-content: center;\n flex: 1;\n flex-direction: ", ";\n ", ";\n"])), function (props) {
549
549
  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
@@ -645,25 +645,39 @@
645
645
  }, function (props) {
646
646
  return props.style;
647
647
  });
648
- var RowElement = styled__default["default"].View(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n flex-direction: row;\n ", ";\n"])), function (props) {
648
+ var PaddingLeftElement = styled__default["default"].View(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n padding-left: ", ";\n flex-direction: ", ";\n ", ";\n"])), function (props) {
649
+ return props.theme.padding;
650
+ }, function (props) {
651
+ return props.flexDirection || DEFAULT_FLEX_DIRECTION;
652
+ }, function (props) {
649
653
  return props.style;
650
654
  });
651
- var StretchElement = styled__default["default"].View(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n align-items: stretch;\n align-self: stretch;\n flex-direction: ", ";\n ", ";\n"])), function (props) {
655
+ var PaddingRightElement = styled__default["default"].View(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n padding-right: ", ";\n flex-direction: ", ";\n ", ";\n"])), function (props) {
656
+ return props.theme.padding;
657
+ }, function (props) {
652
658
  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
653
659
  }, function (props) {
654
660
  return props.style;
655
661
  });
656
- var BoxElement = styled__default["default"].View(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n flex: 1;\n flex-direction: ", ";\n ", ";\n"])), function (props) {
662
+ var RowElement = styled__default["default"].View(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n flex-direction: row;\n ", ";\n"])), function (props) {
663
+ return props.style;
664
+ });
665
+ var StretchElement = styled__default["default"].View(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["\n align-items: stretch;\n align-self: stretch;\n flex-direction: ", ";\n ", ";\n"])), function (props) {
657
666
  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
658
667
  }, function (props) {
659
668
  return props.style;
660
669
  });
661
- var FullScreenElement = styled__default["default"].View(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n z-index: 11;\n flex-direction: ", ";\n ", ";\n"])), function (props) {
670
+ var BoxElement = styled__default["default"].View(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["\n flex: 1;\n flex-direction: ", ";\n ", ";\n"])), function (props) {
662
671
  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
663
672
  }, function (props) {
664
673
  return props.style;
665
674
  });
666
- var WebSmallWrapperElement = styled__default["default"].View(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["\n flex-direction: ", ";\n width: 500px;\n ", ";\n"])), function (props) {
675
+ var FullScreenElement = styled__default["default"].View(_templateObject20 || (_templateObject20 = _taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n z-index: 11;\n flex-direction: ", ";\n ", ";\n"])), function (props) {
676
+ return props.flexDirection || DEFAULT_FLEX_DIRECTION;
677
+ }, function (props) {
678
+ return props.style;
679
+ });
680
+ var WebSmallWrapperElement = styled__default["default"].View(_templateObject21 || (_templateObject21 = _taggedTemplateLiteral(["\n flex-direction: ", ";\n width: 500px;\n ", ";\n"])), function (props) {
667
681
  return props.flexDirection || DEFAULT_FLEX_DIRECTION;
668
682
  }, function (props) {
669
683
  return props.style;
@@ -823,6 +837,28 @@
823
837
  }, children);
824
838
  };
825
839
 
840
+ var PaddingLeft = function PaddingLeft(_ref) {
841
+ var children = _ref.children,
842
+ style = _ref.style,
843
+ _ref$direction = _ref.direction,
844
+ direction = _ref$direction === void 0 ? false : _ref$direction;
845
+ return /*#__PURE__*/React__default["default"].createElement(PaddingLeftElement, {
846
+ style: style,
847
+ flexDirection: direction
848
+ }, children);
849
+ };
850
+
851
+ var PaddingRight = function PaddingRight(_ref) {
852
+ var children = _ref.children,
853
+ style = _ref.style,
854
+ _ref$direction = _ref.direction,
855
+ direction = _ref$direction === void 0 ? false : _ref$direction;
856
+ return /*#__PURE__*/React__default["default"].createElement(PaddingRightElement, {
857
+ style: style,
858
+ flexDirection: direction
859
+ }, children);
860
+ };
861
+
826
862
  var Row = function Row(_ref) {
827
863
  var children = _ref.children,
828
864
  style = _ref.style;
@@ -54603,6 +54639,8 @@
54603
54639
  exports.Padding = Padding;
54604
54640
  exports.PaddingBottom = PaddingBottom;
54605
54641
  exports.PaddingHorizontal = PaddingHorizontal;
54642
+ exports.PaddingLeft = PaddingLeft;
54643
+ exports.PaddingRight = PaddingRight;
54606
54644
  exports.PaddingTop = PaddingTop;
54607
54645
  exports.PaddingVertical = PaddingVertical;
54608
54646
  exports.RoundBtn = RoundBtn$3;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@servesall/atoms",
3
- "version": "1.1.9",
3
+ "version": "1.1.10",
4
4
  "description": "Atoms for react-native",
5
5
  "main": "dist/bundle.cjs.js",
6
6
  "module": "dist/bundle.esm.js",
package/src/Layout/Layout.style.js CHANGED
@@ -105,6 +105,18 @@ export const PaddingBottomElement = styled.View`
105
105
  ${(props) => props.style};
106
106
  `;
107
107
 
108
+ export const PaddingLeftElement = styled.View`
109
+ padding-left: ${(props) => props.theme.padding};
110
+ flex-direction: ${(props) => props.flexDirection || DEFAULT_FLEX_DIRECTION};
111
+ ${(props) => props.style};
112
+ `;
113
+
114
+ export const PaddingRightElement = styled.View`
115
+ padding-right: ${(props) => props.theme.padding};
116
+ flex-direction: ${(props) => props.flexDirection || DEFAULT_FLEX_DIRECTION};
117
+ ${(props) => props.style};
118
+ `;
119
+
108
120
  export const RowElement = styled.View`
109
121
  flex-direction: row;
110
122
  ${(props) => props.style};
package/src/Layout/PaddingLeft.js ADDED
@@ -0,0 +1,12 @@
1
+ import React from "react";
2
+ import { PaddingLeftElement } from "./Layout.style";
3
+
4
+ const PaddingLeft = ({ children, style, direction = false }) => {
5
+ return (
6
+ <PaddingLeftElement style={style} flexDirection={direction}>
7
+ {children}
8
+ </PaddingLeftElement>
9
+ );
10
+ };
11
+
12
+ export default PaddingLeft;
package/src/Layout/PaddingRight.js ADDED
@@ -0,0 +1,12 @@
1
+ import React from "react";
2
+ import { PaddingRightElement } from "./Layout.style";
3
+
4
+ const PaddingRight = ({ children, style, direction = false }) => {
5
+ return (
6
+ <PaddingRightElement style={style} flexDirection={direction}>
7
+ {children}
8
+ </PaddingRightElement>
9
+ );
10
+ };
11
+
12
+ export default PaddingRight;
package/src/Layout/index.js CHANGED
@@ -12,6 +12,8 @@ import PaddingHorizontal from "./PaddingHorizontal";
12
12
  import PaddingVertical from "./PaddingVertical";
13
13
  import PaddingTop from "./PaddingTop";
14
14
  import PaddingBottom from "./PaddingBottom";
15
+ import PaddingLeft from "./PaddingLeft";
16
+ import PaddingRight from "./PaddingRight";
15
17
  import Row from "./Row";
16
18
  import Stretch from "./Stretch";
17
19
  import FullScreen from "./FullScreen";
@@ -34,6 +36,8 @@ export {
34
36
  PaddingVertical,
35
37
  PaddingTop,
36
38
  PaddingBottom,
39
+ PaddingLeft,
40
+ PaddingRight,
37
41
  Row,
38
42
  Stretch,
39
43
  FullScreen,
package/src/index.js CHANGED
@@ -15,6 +15,8 @@ import {
15
15
  PaddingVertical,
16
16
  PaddingTop,
17
17
  PaddingBottom,
18
+ PaddingLeft,
19
+ PaddingRight,
18
20
  Row,
19
21
  Stretch,
20
22
  FullScreen,
@@ -74,6 +76,8 @@ export {
74
76
  PaddingVertical,
75
77
  PaddingTop,
76
78
  PaddingBottom,
79
+ PaddingLeft,
80
+ PaddingRight,
77
81
  Row,
78
82
  Stretch,
79
83
  FullScreen,