bootstrap-rn 0.1.4 → 0.1.5
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.
- package/dist/bootstrap-rn.cjs.js +150 -113
- package/dist/bootstrap-rn.esm.js +151 -114
- package/dist/bootstrap-rn.umd.js +277 -242
- package/dist/bootstrap-rn.umd.min.js +2 -2
- package/package.json +57 -58
package/dist/bootstrap-rn.cjs.js
CHANGED
|
@@ -839,6 +839,13 @@ function transform(children, theme) {
|
|
|
839
839
|
order: value
|
|
840
840
|
});
|
|
841
841
|
}
|
|
842
|
+
} else if (child.name === 'margin-horizontal' && value === 'auto') {
|
|
843
|
+
// Workaround for react-native issue #350
|
|
844
|
+
// https://github.com/facebook/react-native/issues/350#issuecomment-375238958
|
|
845
|
+
Object.assign(definitions[0].declarations, {
|
|
846
|
+
marginLeft: value,
|
|
847
|
+
marginRight: value
|
|
848
|
+
});
|
|
842
849
|
} else if (child.name === 'border-color' && value.split(' ').length === 1) {
|
|
843
850
|
// Workaround for react-native issue #19981
|
|
844
851
|
// https://github.com/facebook/react-native/issues/19981
|
|
@@ -2794,9 +2801,9 @@ function useViewport(initialViewport) {
|
|
|
2794
2801
|
});
|
|
2795
2802
|
}, []);
|
|
2796
2803
|
React.useEffect(function () {
|
|
2797
|
-
reactNative.Dimensions.addEventListener('change', handleChange);
|
|
2804
|
+
var subscription = reactNative.Dimensions.addEventListener('change', handleChange);
|
|
2798
2805
|
return function () {
|
|
2799
|
-
|
|
2806
|
+
subscription.remove();
|
|
2800
2807
|
};
|
|
2801
2808
|
}, [viewport]);
|
|
2802
2809
|
return viewport;
|
|
@@ -3010,7 +3017,7 @@ Alert.propTypes = propTypes$1o;
|
|
|
3010
3017
|
|
|
3011
3018
|
var _excluded$1p = ["color", "bold", "italic", "mark", "small", "style", "styleName"];
|
|
3012
3019
|
|
|
3013
|
-
var _templateObject$18, _templateObject2$K, _templateObject3$p, _templateObject4$
|
|
3020
|
+
var _templateObject$18, _templateObject2$K, _templateObject3$p, _templateObject4$m, _templateObject5$k;
|
|
3014
3021
|
var propTypes$1n = {
|
|
3015
3022
|
color: PropTypes__default["default"].oneOf([].concat(_toConsumableArray(Object.keys(THEME_COLORS)), ['muted', 'black-50', 'white-50'])),
|
|
3016
3023
|
small: PropTypes__default["default"].bool,
|
|
@@ -3026,8 +3033,8 @@ var styles$17 = StyleSheet.create({
|
|
|
3026
3033
|
text: css(_templateObject$18 || (_templateObject$18 = _taggedTemplateLiteral(["\n font-family: $font-family-base;\n font-size: $font-size-base;\n font-weight: $font-weight-base;\n line-height: $font-size-base * $line-height-base;\n "]))),
|
|
3027
3034
|
strong: css(_templateObject2$K || (_templateObject2$K = _taggedTemplateLiteral(["\n font-weight: $font-weight-bolder;\n "]))),
|
|
3028
3035
|
italic: css(_templateObject3$p || (_templateObject3$p = _taggedTemplateLiteral(["\n font-style: italic;\n "]))),
|
|
3029
|
-
small: css(_templateObject4$
|
|
3030
|
-
mark: css(_templateObject5$
|
|
3036
|
+
small: css(_templateObject4$m || (_templateObject4$m = _taggedTemplateLiteral(["\n font-size: $small-font-size;\n line-height: $small-font-size * $line-height-base;\n "]))),
|
|
3037
|
+
mark: css(_templateObject5$k || (_templateObject5$k = _taggedTemplateLiteral(["\n padding: $mark-padding;\n background-color: $mark-bg;\n "])))
|
|
3031
3038
|
});
|
|
3032
3039
|
|
|
3033
3040
|
var getStyleName = function getStyleName(styleName, color) {
|
|
@@ -3434,7 +3441,7 @@ function useToggleButton(props) {
|
|
|
3434
3441
|
|
|
3435
3442
|
var _excluded$1f = ["children", "color", "size", "outline", "first", "last", "active", "disabled", "style", "activeStyle", "textStyle", "activeTextStyle"];
|
|
3436
3443
|
|
|
3437
|
-
var _templateObject$12, _templateObject2$H, _templateObject3$n, _templateObject4$
|
|
3444
|
+
var _templateObject$12, _templateObject2$H, _templateObject3$n, _templateObject4$l, _templateObject5$j, _templateObject6$g, _templateObject7$c, _templateObject8$b, _templateObject9$8, _templateObject10$8, _templateObject11$6, _templateObject12$5, _templateObject13$5, _templateObject14$3, _templateObject15$2, _templateObject16$1, _templateObject17$1, _templateObject18$1, _templateObject19$1, _templateObject20$1, _templateObject21, _templateObject22, _templateObject23;
|
|
3438
3445
|
var propTypes$1g = {
|
|
3439
3446
|
children: PropTypes__default["default"].node.isRequired,
|
|
3440
3447
|
color: PropTypes__default["default"].oneOf([].concat(_toConsumableArray(Object.keys(THEME_COLORS)), ['link'])),
|
|
@@ -3460,7 +3467,7 @@ var styles$11 = StyleSheet.create(_objectSpread2(_objectSpread2({
|
|
|
3460
3467
|
}, each(THEME_COLORS, function (color, value) {
|
|
3461
3468
|
var _ref;
|
|
3462
3469
|
|
|
3463
|
-
return _ref = {}, _defineProperty(_ref, ".btn-".concat(color), css(_templateObject4$
|
|
3470
|
+
return _ref = {}, _defineProperty(_ref, ".btn-".concat(color), css(_templateObject4$l || (_templateObject4$l = _taggedTemplateLiteral(["\n background-color: ", ";\n border-color: ", ";\n // @include box-shadow($btn-box-shadow);\n\n &:hover {\n background-color: ", ";\n border-color: ", ";\n }\n\n &:focus {\n background-color: ", ";\n border-color: ", ";\n /* @if $enable-shadows {\n @include box-shadow($btn-box-shadow, 0 0 0 $btn-focus-width rgba(mix($color, $border, 15%), .5));\n } @else {\n // Avoid using mixin so we can pass custom focus shadow properly\n box-shadow: 0 0 0 $btn-focus-width rgba(mix($color, $border, 15%), .5);\n } */\n }\n\n &:active {\n background-color: ", ";\n // Remove CSS gradients if they're enabled\n // background-image: if($enable-gradients, none, null);\n border-color: ", ";\n }\n "])), value, value, shadeColor(function (t) {
|
|
3464
3471
|
return t['btn-hover-bg-shade-amount'];
|
|
3465
3472
|
}, value), shadeColor(function (t) {
|
|
3466
3473
|
return t['btn-hover-border-shade-amount'];
|
|
@@ -3472,11 +3479,11 @@ var styles$11 = StyleSheet.create(_objectSpread2(_objectSpread2({
|
|
|
3472
3479
|
return t['btn-active-bg-shade-amount'];
|
|
3473
3480
|
}, value), shadeColor(function (t) {
|
|
3474
3481
|
return t['btn-active-border-shade-amount'];
|
|
3475
|
-
}, value))), _defineProperty(_ref, ".btn-".concat(color, "-text"), css(_templateObject5$
|
|
3482
|
+
}, value))), _defineProperty(_ref, ".btn-".concat(color, "-text"), css(_templateObject5$j || (_templateObject5$j = _taggedTemplateLiteral(["\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n\n &:focus {\n color: ", ";\n }\n\n &:active {\n color: ", ";\n }\n "])), colorContrast(value), colorContrast(value), colorContrast(value), colorContrast(value))), _defineProperty(_ref, ".btn-".concat(color, "-active"), css(_templateObject6$g || (_templateObject6$g = _taggedTemplateLiteral(["\n background-color: ", ";\n // Remove CSS gradients if they're enabled\n // background-image: if($enable-gradients, none, null);\n border-color: ", ";\n "])), shadeColor(function (t) {
|
|
3476
3483
|
return t['btn-active-bg-shade-amount'];
|
|
3477
3484
|
}, value), shadeColor(function (t) {
|
|
3478
3485
|
return t['btn-active-border-shade-amount'];
|
|
3479
|
-
}, value))), _defineProperty(_ref, ".btn-".concat(color, "-active-text"), css(_templateObject7$c || (_templateObject7$c = _taggedTemplateLiteral(["\n color: ", ";\n "])), colorContrast(value))), _defineProperty(_ref, ".btn-".concat(color, "-disabled"), css(_templateObject8$b || (_templateObject8$b = _taggedTemplateLiteral(["\n $disabled-background: ", ";\n $disabled-border: ", ";\n\n background-color: $disabled-background;\n // Remove CSS gradients if they're enabled\n // background-image: if($enable-gradients, none, null);\n border-color: $disabled-border;\n "])), value, value)), _defineProperty(_ref, ".btn-".concat(color, "-disabled-text"), css(_templateObject9$
|
|
3486
|
+
}, value))), _defineProperty(_ref, ".btn-".concat(color, "-active-text"), css(_templateObject7$c || (_templateObject7$c = _taggedTemplateLiteral(["\n color: ", ";\n "])), colorContrast(value))), _defineProperty(_ref, ".btn-".concat(color, "-disabled"), css(_templateObject8$b || (_templateObject8$b = _taggedTemplateLiteral(["\n $disabled-background: ", ";\n $disabled-border: ", ";\n\n background-color: $disabled-background;\n // Remove CSS gradients if they're enabled\n // background-image: if($enable-gradients, none, null);\n border-color: $disabled-border;\n "])), value, value)), _defineProperty(_ref, ".btn-".concat(color, "-disabled-text"), css(_templateObject9$8 || (_templateObject9$8 = _taggedTemplateLiteral(["\n $disabled-color: ", ";\n\n color: $disabled-color;\n "])), colorContrast(value))), _defineProperty(_ref, ".btn-outline-".concat(color), css(_templateObject10$8 || (_templateObject10$8 = _taggedTemplateLiteral(["\n border-color: ", ";\n\n &:hover {\n background-color: ", ";\n border-color: ", ";\n }\n\n &:focus {\n // box-shadow: 0 0 0 $btn-focus-width rgba($color, .5);\n }\n\n &:active {\n background-color: ", ";\n border-color: ", ";\n\n /* &:focus {\n @if $enable-shadows {\n @include box-shadow(\n $btn-active-box-shadow,\n 0 0 0 $btn-focus-width rgba($color, 0.5)\n );\n } @else {\n // Avoid using mixin so we can pass custom focus shadow properly\n box-shadow: 0 0 0 $btn-focus-width rgba($color, 0.5);\n }\n } */\n }\n "])), value, value, value, value, value)), _defineProperty(_ref, ".btn-outline-".concat(color, "-text"), css(_templateObject11$6 || (_templateObject11$6 = _taggedTemplateLiteral(["\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n\n &:active {\n color: ", ";\n }\n "])), value, colorContrast(value), colorContrast(value))), _defineProperty(_ref, ".btn-outline-".concat(color, "-disabled"), css(_templateObject12$5 || (_templateObject12$5 = _taggedTemplateLiteral(["\n background-color: transparent;\n "])))), _defineProperty(_ref, ".btn-outline-".concat(color, "-disabled-text"), css(_templateObject13$5 || (_templateObject13$5 = _taggedTemplateLiteral(["\n color: ", ";\n "])), value)), _ref;
|
|
3480
3487
|
})), {}, {
|
|
3481
3488
|
'.btn-link-text': css(_templateObject14$3 || (_templateObject14$3 = _taggedTemplateLiteral(["\n font-weight: $font-weight-normal;\n color: $btn-link-color;\n text-decoration-color: $btn-link-color; // added for bootstrap-rn\n text-decoration-line: $link-decoration;\n\n &:hover {\n color: $btn-link-hover-color;\n text-decoration-color: $btn-link-hover-color; // added for bootstrap-rn\n text-decoration-line: $link-hover-decoration;\n }\n\n &:focus {\n text-decoration-line: $link-hover-decoration;\n }\n\n // No need for an active state here\n "]))),
|
|
3482
3489
|
'.btn-link-text-disabled': css(_templateObject15$2 || (_templateObject15$2 = _taggedTemplateLiteral(["\n color: $btn-link-disabled-color;\n "]))),
|
|
@@ -3484,7 +3491,7 @@ var styles$11 = StyleSheet.create(_objectSpread2(_objectSpread2({
|
|
|
3484
3491
|
'.btn-lg-text': css(_templateObject17$1 || (_templateObject17$1 = _taggedTemplateLiteral(["\n line-height: $btn-font-size-lg * $btn-line-height;\n font-size: $btn-font-size-lg;\n "]))),
|
|
3485
3492
|
'.btn-sm': css(_templateObject18$1 || (_templateObject18$1 = _taggedTemplateLiteral(["\n padding: $btn-padding-y-sm $btn-padding-x-sm;\n // Manually declare to provide an override to the browser default\n border-radius: $btn-border-radius-sm;\n "]))),
|
|
3486
3493
|
'.btn-sm-text': css(_templateObject19$1 || (_templateObject19$1 = _taggedTemplateLiteral(["\n line-height: $btn-font-size-sm * $btn-line-height;\n font-size: $btn-font-size-sm;\n "]))),
|
|
3487
|
-
'.btn-group > .btn': css(_templateObject20$1 || (_templateObject20$1 = _taggedTemplateLiteral(["\n position: relative;\n flex: 1 1 auto;\n\n &:hover {\n z-index: 1;\n }\n &:focus {\n z-index: 1;\n }\n &:active {\n z-index: 1;\n }\n "]))),
|
|
3494
|
+
'.btn-group > .btn': css(_templateObject20$1 || (_templateObject20$1 = _taggedTemplateLiteral(["\n position: relative;\n // flex: 1 1 auto;\n\n &:hover {\n z-index: 1;\n }\n &:focus {\n z-index: 1;\n }\n &:active {\n z-index: 1;\n }\n "]))),
|
|
3488
3495
|
'.btn-group > .btn-active': css(_templateObject21 || (_templateObject21 = _taggedTemplateLiteral(["\n z-index: 2; // 1;\n "]))),
|
|
3489
3496
|
'.btn-group > .btn-not-first': css(_templateObject22 || (_templateObject22 = _taggedTemplateLiteral(["\n margin-left: -$btn-border-width;\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n "]))),
|
|
3490
3497
|
'.btn-group > .btn-not-last': css(_templateObject23 || (_templateObject23 = _taggedTemplateLiteral(["\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n "])))
|
|
@@ -3596,7 +3603,7 @@ var propTypes$1e = {
|
|
|
3596
3603
|
textStyle: PropTypes__default["default"].any
|
|
3597
3604
|
};
|
|
3598
3605
|
var styles$$ = StyleSheet.create({
|
|
3599
|
-
body: css(_templateObject$10 || (_templateObject$10 = _taggedTemplateLiteral(["\n background-color: $body-bg;\n "]))),
|
|
3606
|
+
body: css(_templateObject$10 || (_templateObject$10 = _taggedTemplateLiteral(["\n background-color: $body-bg;\n height: 100%; // added for bootstrap-rn\n "]))),
|
|
3600
3607
|
'body-text': css(_templateObject2$F || (_templateObject2$F = _taggedTemplateLiteral(["\n color: $body-color;\n text-align: $body-text-align;\n "])))
|
|
3601
3608
|
});
|
|
3602
3609
|
var Body = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
|
|
@@ -3737,9 +3744,15 @@ Card.Header = CardHeader;
|
|
|
3737
3744
|
Card.Body = CardBody;
|
|
3738
3745
|
Card.Footer = CardFooter;
|
|
3739
3746
|
|
|
3747
|
+
var ModalContext = /*#__PURE__*/React__default["default"].createContext();
|
|
3748
|
+
ModalContext.displayName = 'ModalContext';
|
|
3749
|
+
|
|
3750
|
+
var OffcanvasContext = /*#__PURE__*/React__default["default"].createContext();
|
|
3751
|
+
OffcanvasContext.displayName = 'OffcanvasContext';
|
|
3752
|
+
|
|
3740
3753
|
var _excluded$18 = ["children", "disabled", "style", "textStyle"];
|
|
3741
3754
|
|
|
3742
|
-
var _templateObject$X, _templateObject2$B, _templateObject3$m;
|
|
3755
|
+
var _templateObject$X, _templateObject2$B, _templateObject3$m, _templateObject4$k, _templateObject5$i;
|
|
3743
3756
|
var propTypes$19 = {
|
|
3744
3757
|
children: PropTypes__default["default"].node,
|
|
3745
3758
|
disabled: PropTypes__default["default"].bool,
|
|
@@ -3751,7 +3764,11 @@ var propTypes$19 = {
|
|
|
3751
3764
|
var styles$W = StyleSheet.create({
|
|
3752
3765
|
'.btn-close': css(_templateObject$X || (_templateObject$X = _taggedTemplateLiteral(["\n // Workaround for missing box-sizing in react native.\n $additional-width: $btn-close-padding-x * 2;\n $additional-height: $btn-close-padding-y * 2;\n\n // box-sizing: content-box;\n width: $btn-close-width + $additional-width;\n height: $btn-close-height + $additional-height;\n padding: $btn-close-padding-y $btn-close-padding-x;\n background: transparent;\n border-width: 0; // for button elements\n // @include border-radius();\n opacity: $btn-close-opacity;\n\n &:hover {\n opacity: $btn-close-hover-opacity;\n }\n\n &:focus {\n // outline: 0;\n // box-shadow: $btn-close-focus-shadow;\n opacity: $btn-close-focus-opacity;\n }\n "]))),
|
|
3753
3766
|
'.btn-close-text': css(_templateObject2$B || (_templateObject2$B = _taggedTemplateLiteral(["\n color: $btn-close-color;\n\n // Override <a>'s hover style\n &:hover {\n color: $btn-close-color;\n text-decoration: none;\n }\n "]))),
|
|
3754
|
-
'.btn-close-disabled': css(_templateObject3$m || (_templateObject3$m = _taggedTemplateLiteral(["\n // pointer-events: none;\n // user-select: none;\n opacity: $btn-close-disabled-opacity;\n "])))
|
|
3767
|
+
'.btn-close-disabled': css(_templateObject3$m || (_templateObject3$m = _taggedTemplateLiteral(["\n // pointer-events: none;\n // user-select: none;\n opacity: $btn-close-disabled-opacity;\n "]))),
|
|
3768
|
+
// Modal styles
|
|
3769
|
+
'.modal-header .btn-close': css(_templateObject4$k || (_templateObject4$k = _taggedTemplateLiteral(["\n padding: $modal-header-padding-y * 0.5 $modal-header-padding-x * 0.5;\n margin: -0.5 * $modal-header-padding-y -0.5 * $modal-header-padding-x -0.5 *\n $modal-header-padding-y auto;\n\n // Workaround for missing box-sizing in react native.\n width: $btn-close-width + $modal-header-padding-x;\n height: $btn-close-height + $modal-header-padding-y;\n "]))),
|
|
3770
|
+
// Offcanvas styles
|
|
3771
|
+
'.offcanvas-header .btn-close': css(_templateObject5$i || (_templateObject5$i = _taggedTemplateLiteral(["\n padding: $offcanvas-padding-y * 0.5 $offcanvas-padding-x * 0.5;\n margin-top: -0.5 * $offcanvas-padding-y;\n margin-right: -0.5 * $offcanvas-padding-x;\n margin-bottom: -0.5 * $offcanvas-padding-y;\n\n // Workaround for missing box-sizing in react native.\n width: $btn-close-width + $offcanvas-padding-x;\n height: $btn-close-height + $offcanvas-padding-y;\n "])))
|
|
3755
3772
|
});
|
|
3756
3773
|
var CloseButton = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
|
|
3757
3774
|
props.children;
|
|
@@ -3761,7 +3778,11 @@ var CloseButton = /*#__PURE__*/React__default["default"].forwardRef(function (pr
|
|
|
3761
3778
|
textStyle = props.textStyle,
|
|
3762
3779
|
elementProps = _objectWithoutProperties(props, _excluded$18);
|
|
3763
3780
|
|
|
3764
|
-
var
|
|
3781
|
+
var modal = React.useContext(ModalContext);
|
|
3782
|
+
var offcanvas = React.useContext(OffcanvasContext);
|
|
3783
|
+
var classes = getStyles(styles$W, ['.btn-close', disabled && '.btn-close-disabled', // Modal styles
|
|
3784
|
+
modal && '.modal-header .btn-close', // Offcanvas styles
|
|
3785
|
+
offcanvas && '.offcanvas-header .btn-close']);
|
|
3765
3786
|
var textClasses = getStyles(styles$W, ['.btn-close-text']);
|
|
3766
3787
|
return /*#__PURE__*/React__default["default"].createElement(Pressable, _extends({}, elementProps, {
|
|
3767
3788
|
ref: ref,
|
|
@@ -3987,9 +4008,9 @@ var Container = /*#__PURE__*/React__default["default"].forwardRef(function (prop
|
|
|
3987
4008
|
Container.displayName = 'Container';
|
|
3988
4009
|
Container.propTypes = propTypes$16;
|
|
3989
4010
|
|
|
3990
|
-
var _excluded$14 = ["children", "type", "value", "onChange", "onPress", "label", "disabled", "valid", "invalid", "style", "inputStyle", "labelStyle"];
|
|
4011
|
+
var _excluded$14 = ["children", "type", "value", "onChange", "onPress", "label", "disabled", "valid", "invalid", "style", "inputStyle", "labelStyle", "labelTextStyle"];
|
|
3991
4012
|
|
|
3992
|
-
var _templateObject$V, _templateObject2$z, _templateObject3$k, _templateObject4$i, _templateObject5$g, _templateObject6$e, _templateObject7$a, _templateObject8$9, _templateObject9$
|
|
4013
|
+
var _templateObject$V, _templateObject2$z, _templateObject3$k, _templateObject4$i, _templateObject5$g, _templateObject6$e, _templateObject7$a, _templateObject8$9, _templateObject9$7, _templateObject10$7, _templateObject11$5, _templateObject12$4, _templateObject13$4;
|
|
3993
4014
|
var propTypes$15 = {
|
|
3994
4015
|
children: PropTypes__default["default"].node,
|
|
3995
4016
|
type: PropTypes__default["default"].oneOf(['checkbox', 'radio', 'switch']).isRequired,
|
|
@@ -4005,7 +4026,9 @@ var propTypes$15 = {
|
|
|
4005
4026
|
// eslint-disable-next-line react/forbid-prop-types
|
|
4006
4027
|
inputStyle: PropTypes__default["default"].any,
|
|
4007
4028
|
// eslint-disable-next-line react/forbid-prop-types
|
|
4008
|
-
labelStyle: PropTypes__default["default"].any
|
|
4029
|
+
labelStyle: PropTypes__default["default"].any,
|
|
4030
|
+
// eslint-disable-next-line react/forbid-prop-types
|
|
4031
|
+
labelTextStyle: PropTypes__default["default"].any
|
|
4009
4032
|
};
|
|
4010
4033
|
var styles$U = StyleSheet.create(_objectSpread2({
|
|
4011
4034
|
'.form-check': css(_templateObject$V || (_templateObject$V = _taggedTemplateLiteral(["\n // display: block;\n flex-direction: row; // added for bootstrap-rn\n min-height: $form-check-min-height;\n padding-left: $form-check-padding-start;\n margin-bottom: $form-check-margin-bottom;\n "]))),
|
|
@@ -4016,16 +4039,16 @@ var styles$U = StyleSheet.create(_objectSpread2({
|
|
|
4016
4039
|
'.form-check-input-checked': css(_templateObject6$e || (_templateObject6$e = _taggedTemplateLiteral(["\n background-color: $form-check-input-checked-bg-color;\n border-color: $form-check-input-checked-border-color;\n "]))),
|
|
4017
4040
|
'.form-check-label': css(_templateObject7$a || (_templateObject7$a = _taggedTemplateLiteral(["\n color: $form-check-label-color;\n @include platform(web) {\n cursor: $form-check-label-cursor;\n }\n "]))),
|
|
4018
4041
|
'.form-switch': css(_templateObject8$9 || (_templateObject8$9 = _taggedTemplateLiteral(["\n padding-left: $form-switch-padding-start;\n "]))),
|
|
4019
|
-
'.form-check-input-switch': css(_templateObject9$
|
|
4020
|
-
'.form-check-input-switch-checked': css(_templateObject10$
|
|
4042
|
+
'.form-check-input-switch': css(_templateObject9$7 || (_templateObject9$7 = _taggedTemplateLiteral(["\n width: $form-switch-width;\n margin-left: $form-switch-padding-start * -1;\n margin-right: $form-switch-padding-start - $form-switch-width; // added for bootstrap-rn\n border-radius: $form-switch-border-radius;\n // @include transition($form-switch-transition);\n align-items: flex-start; // added for bootstrap-rn\n justify-content: center; // added for bootstrap-rn\n "]))),
|
|
4043
|
+
'.form-check-input-switch-checked': css(_templateObject10$7 || (_templateObject10$7 = _taggedTemplateLiteral(["\n align-items: flex-end; // added for bootstrap-rn\n justify-content: center; // added for bootstrap-rn\n "])))
|
|
4021
4044
|
}, each(FORM_VALIDATION_STATES, function (state, data) {
|
|
4022
4045
|
var _ref;
|
|
4023
4046
|
|
|
4024
|
-
return _ref = {}, _defineProperty(_ref, ".form-check-input.is-".concat(state), css(_templateObject11$
|
|
4047
|
+
return _ref = {}, _defineProperty(_ref, ".form-check-input.is-".concat(state), css(_templateObject11$5 || (_templateObject11$5 = _taggedTemplateLiteral(["\n border: ", ";\n\n &:focus {\n // box-shadow: $focus-box-shadow;\n }\n "])), function (t) {
|
|
4025
4048
|
return data(t).color;
|
|
4026
|
-
})), _defineProperty(_ref, ".form-check-input-checked.is-".concat(state), css(_templateObject12$
|
|
4049
|
+
})), _defineProperty(_ref, ".form-check-input-checked.is-".concat(state), css(_templateObject12$4 || (_templateObject12$4 = _taggedTemplateLiteral(["\n background-color: ", ";\n "])), function (t) {
|
|
4027
4050
|
return data(t).color;
|
|
4028
|
-
})), _defineProperty(_ref, ".form-check-label.is-".concat(state), css(_templateObject13$
|
|
4051
|
+
})), _defineProperty(_ref, ".form-check-label.is-".concat(state), css(_templateObject13$4 || (_templateObject13$4 = _taggedTemplateLiteral(["\n color: ", ";\n "])), function (t) {
|
|
4029
4052
|
return data(t).color;
|
|
4030
4053
|
})), _ref;
|
|
4031
4054
|
})));
|
|
@@ -4067,6 +4090,7 @@ var CheckInput = /*#__PURE__*/React__default["default"].forwardRef(function (pro
|
|
|
4067
4090
|
style = modifierProps.style,
|
|
4068
4091
|
inputStyle = modifierProps.inputStyle,
|
|
4069
4092
|
labelStyle = modifierProps.labelStyle,
|
|
4093
|
+
labelTextStyle = modifierProps.labelTextStyle,
|
|
4070
4094
|
elementProps = _objectWithoutProperties(modifierProps, _excluded$14);
|
|
4071
4095
|
|
|
4072
4096
|
if (!children && !label) {
|
|
@@ -4076,7 +4100,7 @@ var CheckInput = /*#__PURE__*/React__default["default"].forwardRef(function (pro
|
|
|
4076
4100
|
|
|
4077
4101
|
var classes = getStyles(styles$U, ['.form-check', type === 'switch' && '.form-switch', disabled && '.form-check-disabled']);
|
|
4078
4102
|
var inputClasses = getStyles(styles$U, ['.form-check-input', type === 'checkbox' && '.form-check-input-checkbox', type === 'radio' && '.form-check-input-radio', type === 'switch' && '.form-check-input-switch', value && '.form-check-input-checked', type === 'switch' && value && '.form-check-input-switch-checked', valid && '.form-check-input.is-valid', valid && value && '.form-check-input-checked.is-valid', invalid && '.form-check-input.is-invalid', invalid && value && '.form-check-input-checked.is-invalid']);
|
|
4079
|
-
var
|
|
4103
|
+
var labelTextClasses = getStyles(styles$U, ['.form-check-label', valid && '.form-check-label.is-valid', invalid && '.form-check-label.is-invalid']); // TODO &:focus, &:active
|
|
4080
4104
|
|
|
4081
4105
|
return /*#__PURE__*/React__default["default"].createElement(Pressable, _extends({}, elementProps, {
|
|
4082
4106
|
ref: modifierRef,
|
|
@@ -4090,8 +4114,9 @@ var CheckInput = /*#__PURE__*/React__default["default"].forwardRef(function (pro
|
|
|
4090
4114
|
style: [classes, style]
|
|
4091
4115
|
}), /*#__PURE__*/React__default["default"].createElement(View, {
|
|
4092
4116
|
style: [inputClasses, inputStyle]
|
|
4093
|
-
}, getSvg(type, value)), children && /*#__PURE__*/React__default["default"].createElement(
|
|
4094
|
-
style:
|
|
4117
|
+
}, getSvg(type, value)), children && /*#__PURE__*/React__default["default"].createElement(View, {
|
|
4118
|
+
style: labelStyle,
|
|
4119
|
+
textStyle: [labelTextClasses, labelTextStyle]
|
|
4095
4120
|
}, children));
|
|
4096
4121
|
});
|
|
4097
4122
|
CheckInput.displayName = 'CheckInput';
|
|
@@ -4371,7 +4396,7 @@ BackdropHandler.propTypes = propTypes$10;
|
|
|
4371
4396
|
|
|
4372
4397
|
var _excluded$10 = ["children", "start", "end", "style", "textStyle"];
|
|
4373
4398
|
|
|
4374
|
-
var _templateObject$R, _templateObject2$x, _templateObject3$i, _templateObject4$g, _templateObject5$e, _templateObject6$d, _templateObject7$9, _templateObject8$8, _templateObject9$
|
|
4399
|
+
var _templateObject$R, _templateObject2$x, _templateObject3$i, _templateObject4$g, _templateObject5$e, _templateObject6$d, _templateObject7$9, _templateObject8$8, _templateObject9$6, _templateObject10$6;
|
|
4375
4400
|
var ALIGNMENT_BREAKPOINTS = [true, 'sm', 'md', 'lg', 'xl', 'xxl'];
|
|
4376
4401
|
var propTypes$$ = {
|
|
4377
4402
|
children: PropTypes__default["default"].node.isRequired,
|
|
@@ -4395,9 +4420,9 @@ var styles$Q = StyleSheet.create(_objectSpread2(_objectSpread2(_objectSpread2({
|
|
|
4395
4420
|
'.dropstart .dropdown-menu[data-bs-popper]': css(_templateObject7$9 || (_templateObject7$9 = _taggedTemplateLiteral(["\n top: 0;\n right: 100%;\n left: auto;\n margin-top: 0;\n margin-right: $dropdown-spacer;\n "]))),
|
|
4396
4421
|
'.navbar-nav .dropdown-menu': css(_templateObject8$8 || (_templateObject8$8 = _taggedTemplateLiteral(["\n position: relative; // static;\n "])))
|
|
4397
4422
|
}, each(GRID_BREAKPOINTS, function (breakpoint) {
|
|
4398
|
-
return _defineProperty({}, ".navbar-expand".concat(infix(next(breakpoint)), " .navbar-nav .dropdown-menu"), css(_templateObject9$
|
|
4423
|
+
return _defineProperty({}, ".navbar-expand".concat(infix(next(breakpoint)), " .navbar-nav .dropdown-menu"), css(_templateObject9$6 || (_templateObject9$6 = _taggedTemplateLiteral(["\n @include media-breakpoint-up(", ") {\n position: absolute;\n }\n "])), next(breakpoint)));
|
|
4399
4424
|
})), {}, {
|
|
4400
|
-
'.dropdown-menu-text': css(_templateObject10$
|
|
4425
|
+
'.dropdown-menu-text': css(_templateObject10$6 || (_templateObject10$6 = _taggedTemplateLiteral(["\n font-size: $dropdown-font-size;\n color: $dropdown-color;\n text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer)\n "])))
|
|
4401
4426
|
}));
|
|
4402
4427
|
|
|
4403
4428
|
var getAlignment = function getAlignment(media, start, end) {
|
|
@@ -4623,7 +4648,7 @@ var propTypes$X = {
|
|
|
4623
4648
|
var styles$M = StyleSheet.create({
|
|
4624
4649
|
'.dropdown-item-text': css(_templateObject$N || (_templateObject$N = _taggedTemplateLiteral(["\n // display: block;\n padding: $dropdown-item-padding-y $dropdown-item-padding-x;\n color: $dropdown-link-color;\n "])))
|
|
4625
4650
|
});
|
|
4626
|
-
var
|
|
4651
|
+
var DropdownItemText = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
|
|
4627
4652
|
var children = props.children,
|
|
4628
4653
|
style = props.style,
|
|
4629
4654
|
elementProps = _objectWithoutProperties(props, _excluded$Y);
|
|
@@ -4634,8 +4659,8 @@ var DropdownTextItem = /*#__PURE__*/React__default["default"].forwardRef(functio
|
|
|
4634
4659
|
style: [classes, style]
|
|
4635
4660
|
}), children);
|
|
4636
4661
|
});
|
|
4637
|
-
|
|
4638
|
-
|
|
4662
|
+
DropdownItemText.displayName = 'DropdownItemText';
|
|
4663
|
+
DropdownItemText.propTypes = propTypes$X;
|
|
4639
4664
|
|
|
4640
4665
|
var _excluded$X = ["style"];
|
|
4641
4666
|
|
|
@@ -4692,7 +4717,7 @@ function useDismissDropdown(props) {
|
|
|
4692
4717
|
return _objectSpread2(_objectSpread2({}, restProps), {}, {
|
|
4693
4718
|
onPress: function onPress(event) {
|
|
4694
4719
|
if (handlePress) handlePress(event);
|
|
4695
|
-
context.
|
|
4720
|
+
context.setVisible(false);
|
|
4696
4721
|
}
|
|
4697
4722
|
});
|
|
4698
4723
|
}
|
|
@@ -4746,7 +4771,7 @@ Dropdown.Toggle = DropdownToggle;
|
|
|
4746
4771
|
Dropdown.Menu = DropdownMenu;
|
|
4747
4772
|
Dropdown.Header = DropdownHeader;
|
|
4748
4773
|
Dropdown.Item = DropdownItem;
|
|
4749
|
-
Dropdown.
|
|
4774
|
+
Dropdown.ItemText = DropdownItemText;
|
|
4750
4775
|
Dropdown.Divider = DropdownDivider;
|
|
4751
4776
|
Dropdown.useDismiss = useDismissDropdown;
|
|
4752
4777
|
Dropdown.useToggle = useToggleDropdown;
|
|
@@ -4897,13 +4922,13 @@ var propTypes$Q = {
|
|
|
4897
4922
|
style: PropTypes__default["default"].any
|
|
4898
4923
|
};
|
|
4899
4924
|
var styles$G = StyleSheet.create(_objectSpread2({
|
|
4900
|
-
'.form-control': css(_templateObject$H || (_templateObject$H = _taggedTemplateLiteral(["\n // display: block;\n width: 100%;\n padding: $input-padding-y $input-padding-x;\n font-family: $input-font-family;\n font-size: $input-font-size;\n font-weight: $input-font-weight;\n line-height: $input-font-size * $input-line-height;\n color: $input-color;\n
|
|
4925
|
+
'.form-control': css(_templateObject$H || (_templateObject$H = _taggedTemplateLiteral(["\n // display: block;\n width: 100%;\n padding: $input-padding-y $input-padding-x;\n font-family: $input-font-family;\n font-size: $input-font-size;\n font-weight: $input-font-weight;\n line-height: $input-font-size * $input-line-height;\n color: $input-color;\n background-color: $input-bg;\n // background-clip: padding-box;\n border: $input-border-width solid $input-border-color;\n @include platform(web) {\n appearance: none; // Fix appearance for date inputs in Safari\n }\n\n // Note: This has no effect on <select>s in some browsers, due to the limited stylability of \"<select>\"s in CSS.\n border-radius: $input-border-radius;\n\n // @include box-shadow($input-box-shadow);\n // @include transition($input-transition);\n\n // Customize the \":focus\" state to imitate native WebKit styles.\n &:focus {\n color: $input-focus-color;\n background-color: $input-focus-bg;\n border-color: $input-focus-border-color;\n @include platform(web) {\n outline-width: 0; // outline: 0;\n }\n /* @if $enable-shadows {\n @include box-shadow($input-box-shadow, $input-focus-box-shadow);\n } @else {\n // Avoid using mixin so we can pass custom focus shadow properly\n box-shadow: $input-focus-box-shadow;\n } */\n }\n "]))),
|
|
4901
4926
|
'.form-control-disabled': css(_templateObject2$u || (_templateObject2$u = _taggedTemplateLiteral(["\n background-color: $input-disabled-bg;\n border-color: $input-disabled-border-color;\n // iOS fix for unreadable disabled content; see https://github.com/twbs/bootstrap/issues/11655.\n opacity: 1;\n "]))),
|
|
4902
4927
|
'.form-control-sm': css(_templateObject3$g || (_templateObject3$g = _taggedTemplateLiteral(["\n min-height: $input-height-sm;\n padding: $input-padding-y-sm $input-padding-x-sm;\n font-size: $input-font-size-sm;\n border-radius: $input-border-radius-sm;\n "]))),
|
|
4903
4928
|
'.form-control-lg': css(_templateObject4$e || (_templateObject4$e = _taggedTemplateLiteral(["\n min-height: $input-height-lg;\n padding: $input-padding-y-lg $input-padding-x-lg;\n font-size: $input-font-size-lg;\n border-radius: $input-border-radius-lg;\n "]))),
|
|
4904
|
-
'.form-control-multiline': css(_templateObject5$c || (_templateObject5$c = _taggedTemplateLiteral(["\n min-height: $input-height;\n "]))),
|
|
4905
|
-
'.form-control-multiline-sm': css(_templateObject6$b || (_templateObject6$b = _taggedTemplateLiteral(["\n min-height: $input-height-sm;\n "]))),
|
|
4906
|
-
'.form-control-multiline-lg': css(_templateObject7$8 || (_templateObject7$8 = _taggedTemplateLiteral(["\n min-height: $input-height-lg;\n "])))
|
|
4929
|
+
'.form-control-multiline': css(_templateObject5$c || (_templateObject5$c = _taggedTemplateLiteral(["\n text-align-vertical: top; // added for bootstrap-rn\n min-height: $input-height;\n\n @include platform(ios) {\n min-height: $input-height-sm + 8rem; // added for bootstrap-rn\n }\n "]))),
|
|
4930
|
+
'.form-control-multiline-sm': css(_templateObject6$b || (_templateObject6$b = _taggedTemplateLiteral(["\n min-height: $input-height-sm;\n\n @include platform(ios) {\n // TODO: Adjust ios height to sm size\n min-height: $input-height-sm + 8rem; // added for bootstrap-rn\n }\n "]))),
|
|
4931
|
+
'.form-control-multiline-lg': css(_templateObject7$8 || (_templateObject7$8 = _taggedTemplateLiteral(["\n min-height: $input-height-lg;\n\n @include platform(ios) {\n // TODO: Adjust ios height to lg size\n min-height: $input-height-sm + 8rem; // added for bootstrap-rn\n }\n "])))
|
|
4907
4932
|
}, each(FORM_VALIDATION_STATES, function (state, data) {
|
|
4908
4933
|
return _defineProperty({}, ".form-control.is-".concat(state), css(_templateObject8$7 || (_templateObject8$7 = _taggedTemplateLiteral(["\n border-color: ", ";\n\n &:focus {\n border-color: ", ";\n // box-shadow: $focus-box-shadow;\n }\n "])), function (t) {
|
|
4909
4934
|
return data(t).color;
|
|
@@ -4936,6 +4961,8 @@ var Input = /*#__PURE__*/React__default["default"].forwardRef(function (props, r
|
|
|
4936
4961
|
placeholderTextColor: placeholderTextColor || StyleSheet.value('input-placeholder-color'),
|
|
4937
4962
|
multiline: multiline,
|
|
4938
4963
|
disabled: disabled,
|
|
4964
|
+
editable: !disabled,
|
|
4965
|
+
selectTextOnFocus: !disabled,
|
|
4939
4966
|
style: [classes, style]
|
|
4940
4967
|
}));
|
|
4941
4968
|
});
|
|
@@ -5067,7 +5094,7 @@ PopoverContext.displayName = 'PopoverContext';
|
|
|
5067
5094
|
|
|
5068
5095
|
var _excluded$P = ["style"];
|
|
5069
5096
|
|
|
5070
|
-
var _templateObject$G, _templateObject2$t, _templateObject3$f, _templateObject4$d, _templateObject5$b, _templateObject6$a, _templateObject7$7, _templateObject8$6, _templateObject9$
|
|
5097
|
+
var _templateObject$G, _templateObject2$t, _templateObject3$f, _templateObject4$d, _templateObject5$b, _templateObject6$a, _templateObject7$7, _templateObject8$6, _templateObject9$5, _templateObject10$5, _templateObject11$4, _templateObject12$3, _templateObject13$3, _templateObject14$2, _templateObject15$1;
|
|
5071
5098
|
var propTypes$P = {
|
|
5072
5099
|
// eslint-disable-next-line react/forbid-prop-types
|
|
5073
5100
|
style: PropTypes__default["default"].any
|
|
@@ -5089,15 +5116,15 @@ var styles$F = StyleSheet.create({
|
|
|
5089
5116
|
return t['popover-border-width'];
|
|
5090
5117
|
})),
|
|
5091
5118
|
'.bs-popover-end .popover-arrow::before': css(_templateObject8$6 || (_templateObject8$6 = _taggedTemplateLiteral(["\n left: 0;\n border-top-width: $popover-arrow-width * 0.5;\n border-right-width: $popover-arrow-height;\n border-left-width: 0;\n border-bottom-width: $popover-arrow-width * 0.5;\n border-right-color: $popover-arrow-outer-color;\n "]))),
|
|
5092
|
-
'.bs-popover-end .popover-arrow::after': css(_templateObject9$
|
|
5093
|
-
'.bs-popover-bottom .popover-arrow': css(_templateObject10$
|
|
5119
|
+
'.bs-popover-end .popover-arrow::after': css(_templateObject9$5 || (_templateObject9$5 = _taggedTemplateLiteral(["\n left: $popover-border-width;\n border-top-width: $popover-arrow-width * 0.5;\n border-right-width: $popover-arrow-height;\n border-left-width: 0;\n border-bottom-width: $popover-arrow-width * 0.5;\n border-right-color: $popover-arrow-color;\n "]))),
|
|
5120
|
+
'.bs-popover-bottom .popover-arrow': css(_templateObject10$5 || (_templateObject10$5 = _taggedTemplateLiteral(["\n top: ", ";\n "])), subtract(function (t) {
|
|
5094
5121
|
return "-".concat(t['popover-arrow-height']);
|
|
5095
5122
|
}, function (t) {
|
|
5096
5123
|
return t['popover-border-width'];
|
|
5097
5124
|
})),
|
|
5098
|
-
'.bs-popover-bottom .popover-arrow::before': css(_templateObject11$
|
|
5099
|
-
'.bs-popover-bottom .popover-arrow::after': css(_templateObject12$
|
|
5100
|
-
'.bs-popover-start .popover-arrow': css(_templateObject13$
|
|
5125
|
+
'.bs-popover-bottom .popover-arrow::before': css(_templateObject11$4 || (_templateObject11$4 = _taggedTemplateLiteral(["\n top: 0;\n border-top-width: 0;\n border-right-width: $popover-arrow-width * 0.5;\n border-left-width: $popover-arrow-width * 0.5;\n border-bottom-width: $popover-arrow-height;\n border-bottom-color: $popover-arrow-outer-color;\n "]))),
|
|
5126
|
+
'.bs-popover-bottom .popover-arrow::after': css(_templateObject12$3 || (_templateObject12$3 = _taggedTemplateLiteral(["\n top: $popover-border-width;\n border-top-width: 0;\n border-right-width: $popover-arrow-width * 0.5;\n border-left-width: $popover-arrow-width * 0.5;\n border-bottom-width: $popover-arrow-height;\n border-bottom-color: $popover-arrow-color;\n "]))),
|
|
5127
|
+
'.bs-popover-start .popover-arrow': css(_templateObject13$3 || (_templateObject13$3 = _taggedTemplateLiteral(["\n right: ", ";\n width: $popover-arrow-height;\n height: $popover-arrow-width;\n "])), subtract(function (t) {
|
|
5101
5128
|
return "-".concat(t['popover-arrow-height']);
|
|
5102
5129
|
}, function (t) {
|
|
5103
5130
|
return t['popover-border-width'];
|
|
@@ -5297,7 +5324,7 @@ TooltipContext.displayName = 'TooltipContext';
|
|
|
5297
5324
|
|
|
5298
5325
|
var _excluded$K = ["style"];
|
|
5299
5326
|
|
|
5300
|
-
var _templateObject$C, _templateObject2$q, _templateObject3$e, _templateObject4$c, _templateObject5$a, _templateObject6$9, _templateObject7$6, _templateObject8$5, _templateObject9$
|
|
5327
|
+
var _templateObject$C, _templateObject2$q, _templateObject3$e, _templateObject4$c, _templateObject5$a, _templateObject6$9, _templateObject7$6, _templateObject8$5, _templateObject9$4, _templateObject10$4;
|
|
5301
5328
|
var propTypes$K = {
|
|
5302
5329
|
// eslint-disable-next-line react/forbid-prop-types
|
|
5303
5330
|
style: PropTypes__default["default"].any
|
|
@@ -5311,8 +5338,8 @@ var styles$B = StyleSheet.create({
|
|
|
5311
5338
|
'.bs-tooltip-end .tooltip-arrow::before': css(_templateObject6$9 || (_templateObject6$9 = _taggedTemplateLiteral(["\n right: -1px;\n border-top-width: $tooltip-arrow-width * 0.5;\n border-right-width: $tooltip-arrow-height;\n border-left-width: 0;\n border-bottom-width: $tooltip-arrow-width * 0.5;\n border-right-color: $tooltip-arrow-color;\n "]))),
|
|
5312
5339
|
'.bs-tooltip-bottom .tooltip-arrow': css(_templateObject7$6 || (_templateObject7$6 = _taggedTemplateLiteral(["\n top: 0;\n "]))),
|
|
5313
5340
|
'.bs-tooltip-bottom .tooltip-arrow::before': css(_templateObject8$5 || (_templateObject8$5 = _taggedTemplateLiteral(["\n bottom: -1px;\n border-top-width: 0;\n border-right-width: $tooltip-arrow-width * 0.5;\n border-left-width: $tooltip-arrow-width * 0.5;\n border-bottom-width: $tooltip-arrow-height;\n border-bottom-color: $tooltip-arrow-color;\n "]))),
|
|
5314
|
-
'.bs-tooltip-start .tooltip-arrow': css(_templateObject9$
|
|
5315
|
-
'.bs-tooltip-start .tooltip-arrow::before': css(_templateObject10$
|
|
5341
|
+
'.bs-tooltip-start .tooltip-arrow': css(_templateObject9$4 || (_templateObject9$4 = _taggedTemplateLiteral(["\n right: 0;\n width: $tooltip-arrow-height;\n height: $tooltip-arrow-width;\n "]))),
|
|
5342
|
+
'.bs-tooltip-start .tooltip-arrow::before': css(_templateObject10$4 || (_templateObject10$4 = _taggedTemplateLiteral(["\n left: -1px;\n border-top-width: $tooltip-arrow-width * 0.5;\n border-right-width: 0;\n border-left-width: $tooltip-arrow-height;\n border-bottom-width: $tooltip-arrow-width * 0.5;\n border-left-color: $tooltip-arrow-color;\n "])))
|
|
5316
5343
|
});
|
|
5317
5344
|
var TooltipArrow = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
|
|
5318
5345
|
var style = props.style,
|
|
@@ -5545,7 +5572,7 @@ ListGroupContext.displayName = 'ListGroupContext';
|
|
|
5545
5572
|
|
|
5546
5573
|
var _excluded$D = ["children", "color", "active", "first", "last", "disabled", "style", "textStyle"];
|
|
5547
5574
|
|
|
5548
|
-
var _templateObject$y, _templateObject2$o, _templateObject3$c, _templateObject4$a, _templateObject5$8, _templateObject6$7, _templateObject7$5, _templateObject8$4, _templateObject9$
|
|
5575
|
+
var _templateObject$y, _templateObject2$o, _templateObject3$c, _templateObject4$a, _templateObject5$8, _templateObject6$7, _templateObject7$5, _templateObject8$4, _templateObject9$3, _templateObject10$3, _templateObject11$3, _templateObject12$2, _templateObject13$2, _templateObject14$1;
|
|
5549
5576
|
var propTypes$D = {
|
|
5550
5577
|
children: PropTypes__default["default"].node.isRequired,
|
|
5551
5578
|
color: PropTypes__default["default"].oneOf(Object.keys(THEME_COLORS)),
|
|
@@ -5567,14 +5594,14 @@ var styles$x = StyleSheet.create(_objectSpread2({
|
|
|
5567
5594
|
'.list-group-item-disabled-text': css(_templateObject6$7 || (_templateObject6$7 = _taggedTemplateLiteral(["\n color: $list-group-disabled-color;\n "]))),
|
|
5568
5595
|
'.list-group-item-active': css(_templateObject7$5 || (_templateObject7$5 = _taggedTemplateLiteral(["\n z-index: 2; // Place active items above their siblings for proper border styling\n background-color: $list-group-active-bg;\n border-color: $list-group-active-border-color;\n "]))),
|
|
5569
5596
|
'.list-group-item-active-text': css(_templateObject8$4 || (_templateObject8$4 = _taggedTemplateLiteral(["\n color: $list-group-active-color;\n "]))),
|
|
5570
|
-
'.list-group-item-not-first': css(_templateObject9$
|
|
5571
|
-
'.list-group-item-not-first-active': css(_templateObject10$
|
|
5572
|
-
'.list-group-item-flush': css(_templateObject11$
|
|
5573
|
-
'.list-group-item-flush-last': css(_templateObject12$
|
|
5597
|
+
'.list-group-item-not-first': css(_templateObject9$3 || (_templateObject9$3 = _taggedTemplateLiteral(["\n border-top-width: 0;\n "]))),
|
|
5598
|
+
'.list-group-item-not-first-active': css(_templateObject10$3 || (_templateObject10$3 = _taggedTemplateLiteral(["\n margin-top: -$list-group-border-width;\n border-top-width: $list-group-border-width;\n "]))),
|
|
5599
|
+
'.list-group-item-flush': css(_templateObject11$3 || (_templateObject11$3 = _taggedTemplateLiteral(["\n border-top-left-radius: 0; // added for bootstrap-rn\n border-top-right-radius: 0; // added for bootstrap-rn\n border-bottom-left-radius: 0; // added for bootstrap-rn\n border-bottom-right-radius: 0; // added for bootstrap-rn\n border-top-width: 0;\n border-right-width: 0;\n border-bottom-width: $list-group-border-width;\n border-left-width: 0;\n "]))),
|
|
5600
|
+
'.list-group-item-flush-last': css(_templateObject12$2 || (_templateObject12$2 = _taggedTemplateLiteral(["\n border-bottom-width: 0;\n "])))
|
|
5574
5601
|
}, each(THEME_COLORS, function (state, value) {
|
|
5575
5602
|
var _ref;
|
|
5576
5603
|
|
|
5577
|
-
return _ref = {}, _defineProperty(_ref, ".list-group-item-".concat(state), css(_templateObject13$
|
|
5604
|
+
return _ref = {}, _defineProperty(_ref, ".list-group-item-".concat(state), css(_templateObject13$2 || (_templateObject13$2 = _taggedTemplateLiteral(["\n background-color: ", ";\n "])), shiftColor(function (t) {
|
|
5578
5605
|
return t['list-group-item-bg-scale'];
|
|
5579
5606
|
}, value))), _defineProperty(_ref, ".list-group-item-".concat(state, "-text"), css(_templateObject14$1 || (_templateObject14$1 = _taggedTemplateLiteral(["\n color: ", ";\n "])), shiftColor(function (t) {
|
|
5580
5607
|
return t['list-group-item-color-scale'];
|
|
@@ -5888,9 +5915,7 @@ var computeScrollbarWidth = function computeScrollbarWidth() {
|
|
|
5888
5915
|
};
|
|
5889
5916
|
|
|
5890
5917
|
function useScrollbarEffects(_ref) {
|
|
5891
|
-
var
|
|
5892
|
-
keepBodyScroll = _ref.keepBodyScroll,
|
|
5893
|
-
centered = _ref.centered,
|
|
5918
|
+
var keepBodyScroll = _ref.keepBodyScroll,
|
|
5894
5919
|
visible = _ref.visible;
|
|
5895
5920
|
|
|
5896
5921
|
if (reactNative.Platform.OS !== 'web' || keepBodyScroll) {
|
|
@@ -5905,9 +5930,9 @@ function useScrollbarEffects(_ref) {
|
|
|
5905
5930
|
|
|
5906
5931
|
if (!scrollbarWidth.current) {
|
|
5907
5932
|
scrollbarWidth.current = computeScrollbarWidth();
|
|
5908
|
-
}
|
|
5933
|
+
} // const element = findNodeHandle(ref.current);
|
|
5934
|
+
|
|
5909
5935
|
|
|
5910
|
-
var element = reactNative.findNodeHandle(ref.current);
|
|
5911
5936
|
var rect = document.body.getBoundingClientRect();
|
|
5912
5937
|
var isBodyOverflowing = rect.left + rect.right < window.innerWidth; // Set body and fixed elements padding adjustments.
|
|
5913
5938
|
|
|
@@ -5922,21 +5947,6 @@ function useScrollbarEffects(_ref) {
|
|
|
5922
5947
|
// eslint-disable-next-line no-param-reassign
|
|
5923
5948
|
el.style.width = "calc(100% - ".concat(scrollbarWidth.current, "px)");
|
|
5924
5949
|
});
|
|
5925
|
-
}
|
|
5926
|
-
|
|
5927
|
-
var isModalOverflowing = element.scrollHeight > document.documentElement.clientHeight;
|
|
5928
|
-
|
|
5929
|
-
if (centered) {
|
|
5930
|
-
// Set dialog padding adjustments.
|
|
5931
|
-
if (!isBodyOverflowing && isModalOverflowing) {
|
|
5932
|
-
// eslint-disable-next-line no-param-reassign
|
|
5933
|
-
element.style.paddingLeft = "".concat(scrollbarWidth.current, "px");
|
|
5934
|
-
}
|
|
5935
|
-
|
|
5936
|
-
if (isBodyOverflowing && !isModalOverflowing) {
|
|
5937
|
-
// eslint-disable-next-line no-param-reassign
|
|
5938
|
-
element.style.paddingRight = "".concat(scrollbarWidth.current, "px");
|
|
5939
|
-
}
|
|
5940
5950
|
} // Add "overflow: hidden" to body element.
|
|
5941
5951
|
|
|
5942
5952
|
|
|
@@ -5961,9 +5971,6 @@ function useModal(scrollable) {
|
|
|
5961
5971
|
}, [scrollable]);
|
|
5962
5972
|
}
|
|
5963
5973
|
|
|
5964
|
-
var ModalContext = /*#__PURE__*/React__default["default"].createContext();
|
|
5965
|
-
ModalContext.displayName = 'ModalContext';
|
|
5966
|
-
|
|
5967
5974
|
var _excluded$y = ["children", "style"];
|
|
5968
5975
|
|
|
5969
5976
|
var _templateObject$u;
|
|
@@ -6016,13 +6023,15 @@ var ModalTitle = /*#__PURE__*/React__default["default"].forwardRef(function (pro
|
|
|
6016
6023
|
ModalTitle.displayName = 'ModalTitle';
|
|
6017
6024
|
ModalTitle.propTypes = propTypes$x;
|
|
6018
6025
|
|
|
6019
|
-
var _excluded$w = ["children", "style"];
|
|
6026
|
+
var _excluded$w = ["children", "style", "contentContainerStyle"];
|
|
6020
6027
|
|
|
6021
6028
|
var _templateObject$s;
|
|
6022
6029
|
var propTypes$w = {
|
|
6023
6030
|
children: PropTypes__default["default"].node.isRequired,
|
|
6024
6031
|
// eslint-disable-next-line react/forbid-prop-types
|
|
6025
|
-
style: PropTypes__default["default"].any
|
|
6032
|
+
style: PropTypes__default["default"].any,
|
|
6033
|
+
// eslint-disable-next-line react/forbid-prop-types
|
|
6034
|
+
contentContainerStyle: PropTypes__default["default"].any
|
|
6026
6035
|
};
|
|
6027
6036
|
var styles$s = StyleSheet.create({
|
|
6028
6037
|
'.modal-body': css(_templateObject$s || (_templateObject$s = _taggedTemplateLiteral(["\n position: relative;\n // Enable \"flex-grow: 1\" so that the body take up as much space as possible\n // when there should be a fixed height on \".modal-dialog\".\n // Note from bootstrap-rn: Centered modals do not work with this style, but\n // everything just works fine without this style.\n // flex: 1 1 auto;\n padding: $modal-inner-padding;\n "])))
|
|
@@ -6030,6 +6039,7 @@ var styles$s = StyleSheet.create({
|
|
|
6030
6039
|
var ModalBody = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
|
|
6031
6040
|
var children = props.children,
|
|
6032
6041
|
style = props.style,
|
|
6042
|
+
contentContainerStyle = props.contentContainerStyle,
|
|
6033
6043
|
elementProps = _objectWithoutProperties(props, _excluded$w);
|
|
6034
6044
|
|
|
6035
6045
|
var _useForcedContext = useForcedContext(ModalContext),
|
|
@@ -6039,8 +6049,8 @@ var ModalBody = /*#__PURE__*/React__default["default"].forwardRef(function (prop
|
|
|
6039
6049
|
var FlexView = scrollable ? ScrollView : View;
|
|
6040
6050
|
return /*#__PURE__*/React__default["default"].createElement(FlexView, _extends({}, elementProps, {
|
|
6041
6051
|
ref: ref,
|
|
6042
|
-
style: scrollable ?
|
|
6043
|
-
contentContainerStyle: scrollable ? [classes,
|
|
6052
|
+
style: scrollable ? style : [classes, style],
|
|
6053
|
+
contentContainerStyle: scrollable ? [classes, contentContainerStyle] : undefined
|
|
6044
6054
|
}), children);
|
|
6045
6055
|
});
|
|
6046
6056
|
ModalBody.displayName = 'ModalBody';
|
|
@@ -6073,7 +6083,7 @@ ModalFooter.propTypes = propTypes$v;
|
|
|
6073
6083
|
|
|
6074
6084
|
var _excluded$u = ["children", "visible", "size", "backdrop", "scrollable", "centered", "onToggle", "style", "textStyle"];
|
|
6075
6085
|
|
|
6076
|
-
var _templateObject$q, _templateObject2$l, _templateObject3$a, _templateObject4$8, _templateObject5$6, _templateObject6$5, _templateObject7$4, _templateObject8$3, _templateObject9$
|
|
6086
|
+
var _templateObject$q, _templateObject2$l, _templateObject3$a, _templateObject4$8, _templateObject5$6, _templateObject6$5, _templateObject7$4, _templateObject8$3, _templateObject9$2, _templateObject10$2, _templateObject11$2;
|
|
6077
6087
|
var MODAL_SIZES = ['sm', 'lg', 'xl'];
|
|
6078
6088
|
var propTypes$u = {
|
|
6079
6089
|
children: PropTypes__default["default"].node.isRequired,
|
|
@@ -6090,16 +6100,16 @@ var propTypes$u = {
|
|
|
6090
6100
|
};
|
|
6091
6101
|
var styles$q = StyleSheet.create({
|
|
6092
6102
|
'.modal': css(_templateObject$q || (_templateObject$q = _taggedTemplateLiteral(["\n position: absolute; // fixed;\n top: 0;\n left: 0;\n z-index: $zindex-modal;\n // display: none;\n width: 100%;\n height: 100%;\n // overflow-x: hidden;\n // overflow-y: auto;\n // Prevent Chrome on Windows from adding a focus outline. For details, see\n // https://github.com/twbs/bootstrap/pull/10951.\n @include platform(web) {\n outline-width: 0; // outline: 0;\n }\n // We deliberately don't use \"-webkit-overflow-scrolling: touch;\" due to a\n // gnarly iOS Safari bug: https://bugs.webkit.org/show_bug.cgi?id=158342\n // See also https://github.com/twbs/bootstrap/issues/17695\n "]))),
|
|
6093
|
-
'.modal-dialog': css(_templateObject2$l || (_templateObject2$l = _taggedTemplateLiteral(["\n position: relative;\n width: auto;\n margin: $modal-dialog-margin;\n // allow clicks to pass through for custom click handling to close modal\n // pointer-events: none;\n
|
|
6103
|
+
'.modal-dialog': css(_templateObject2$l || (_templateObject2$l = _taggedTemplateLiteral(["\n position: relative;\n width: auto;\n margin: $modal-dialog-margin;\n // allow clicks to pass through for custom click handling to close modal\n // pointer-events: none;\n\n @include media-breakpoint-up(sm) {\n width: 100%; // added for bootstrap-rn\n max-width: $modal-md;\n margin-right: auto;\n margin-left: auto;\n }\n "]))),
|
|
6094
6104
|
'.modal-dialog-scrollable': css(_templateObject3$a || (_templateObject3$a = _taggedTemplateLiteral(["\n flex-shrink: 1; // added for bootstrap-rn\n // height: calc(100% - var(--#{$prefix}modal-margin) * 2);\n "]))),
|
|
6095
6105
|
'.modal-dialog-scrollable .modal-content': css(_templateObject4$8 || (_templateObject4$8 = _taggedTemplateLiteral(["\n max-height: 100%;\n overflow: hidden;\n "]))),
|
|
6096
6106
|
'.modal-dialog-centered': css(_templateObject5$6 || (_templateObject5$6 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: row; // added for bootstrap-rn\n flex-grow: 1; // added for bootstrap-rn\n align-items: center;\n // min-height: calc(100% - var(--#{$prefix}modal-margin) * 2);\n "]))),
|
|
6097
6107
|
'.modal-content': css(_templateObject6$5 || (_templateObject6$5 = _taggedTemplateLiteral(["\n position: relative;\n display: flex;\n flex-direction: column;\n width: 100%; // Ensure \".modal-content\" extends the full width of the parent \".modal-dialog\"\n // counteract the pointer-events: none; in the .modal-dialog\n // pointer-events: auto;\n background-color: $modal-content-bg;\n // background-clip: padding-box;\n border: $modal-content-border-width solid $modal-content-border-color;\n border-radius: $modal-content-border-radius;\n // @include box-shadow($modal-content-box-shadow-xs);\n // Remove focus outline from opened modal\n // outline: 0;\n\n @include media-breakpoint-up(sm) {\n // @include box-shadow($modal-content-box-shadow-sm-up);\n }\n "]))),
|
|
6098
6108
|
'.modal-content-text': css(_templateObject7$4 || (_templateObject7$4 = _taggedTemplateLiteral(["\n color: $modal-content-color;\n "]))),
|
|
6099
6109
|
'.modal-backdrop': css(_templateObject8$3 || (_templateObject8$3 = _taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n left: 0;\n z-index: $zindex-modal-backdrop;\n width: 100%;\n height: 100%;\n background-color: $modal-backdrop-bg;\n opacity: $modal-backdrop-opacity;\n "]))),
|
|
6100
|
-
'.modal-sm': css(_templateObject9$
|
|
6101
|
-
'.modal-lg': css(_templateObject10$
|
|
6102
|
-
'.modal-xl': css(_templateObject11$
|
|
6110
|
+
'.modal-sm': css(_templateObject9$2 || (_templateObject9$2 = _taggedTemplateLiteral(["\n @include media-breakpoint-up(sm) {\n max-width: $modal-sm;\n }\n "]))),
|
|
6111
|
+
'.modal-lg': css(_templateObject10$2 || (_templateObject10$2 = _taggedTemplateLiteral(["\n @include media-breakpoint-up(lg) {\n max-width: $modal-lg;\n }\n @include media-breakpoint-up(xl) {\n max-width: $modal-xl;\n }\n "]))),
|
|
6112
|
+
'.modal-xl': css(_templateObject11$2 || (_templateObject11$2 = _taggedTemplateLiteral(["\n @include media-breakpoint-up(xl) {\n max-width: $modal-xl;\n }\n "])))
|
|
6103
6113
|
});
|
|
6104
6114
|
var Modal = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
|
|
6105
6115
|
var children = props.children,
|
|
@@ -6116,13 +6126,10 @@ var Modal = /*#__PURE__*/React__default["default"].forwardRef(function (props, r
|
|
|
6116
6126
|
textStyle = props.textStyle,
|
|
6117
6127
|
elementProps = _objectWithoutProperties(props, _excluded$u);
|
|
6118
6128
|
|
|
6119
|
-
var modalRef = React.useRef();
|
|
6120
6129
|
var dialogRef = React.useRef();
|
|
6121
6130
|
var modal = useModal(scrollable);
|
|
6122
6131
|
useScrollbarEffects({
|
|
6123
|
-
ref: modalRef,
|
|
6124
6132
|
keepBodyScroll: false,
|
|
6125
|
-
centered: true,
|
|
6126
6133
|
visible: visible
|
|
6127
6134
|
});
|
|
6128
6135
|
var backdropClasses = getStyles(styles$q, ['.modal-backdrop']);
|
|
@@ -6139,7 +6146,6 @@ var Modal = /*#__PURE__*/React__default["default"].forwardRef(function (props, r
|
|
|
6139
6146
|
}, backdrop && /*#__PURE__*/React__default["default"].createElement(View, {
|
|
6140
6147
|
style: backdropClasses
|
|
6141
6148
|
}), /*#__PURE__*/React__default["default"].createElement(FlexView, {
|
|
6142
|
-
ref: modalRef,
|
|
6143
6149
|
style: classes,
|
|
6144
6150
|
contentContainerStyle: scrollable ? undefined : {
|
|
6145
6151
|
flexGrow: 1
|
|
@@ -6148,7 +6154,11 @@ var Modal = /*#__PURE__*/React__default["default"].forwardRef(function (props, r
|
|
|
6148
6154
|
dialogRef: dialogRef,
|
|
6149
6155
|
onClose: handleToggle,
|
|
6150
6156
|
backdrop: backdrop
|
|
6151
|
-
}), /*#__PURE__*/React__default["default"].createElement(
|
|
6157
|
+
}), /*#__PURE__*/React__default["default"].createElement(reactNative.SafeAreaView, {
|
|
6158
|
+
style: {
|
|
6159
|
+
flexShrink: 1
|
|
6160
|
+
}
|
|
6161
|
+
}, /*#__PURE__*/React__default["default"].createElement(View, {
|
|
6152
6162
|
ref: dialogRef,
|
|
6153
6163
|
style: dialogClasses
|
|
6154
6164
|
}, /*#__PURE__*/React__default["default"].createElement(View, _extends({}, elementProps, {
|
|
@@ -6157,7 +6167,7 @@ var Modal = /*#__PURE__*/React__default["default"].forwardRef(function (props, r
|
|
|
6157
6167
|
textStyle: [contentTextClasses, textStyle]
|
|
6158
6168
|
}), /*#__PURE__*/React__default["default"].createElement(ModalContext.Provider, {
|
|
6159
6169
|
value: modal
|
|
6160
|
-
}, children))))));
|
|
6170
|
+
}, /*#__PURE__*/React__default["default"].createElement(overlays.OverlayProvider, null, children)))))));
|
|
6161
6171
|
});
|
|
6162
6172
|
Modal.displayName = 'Modal';
|
|
6163
6173
|
Modal.propTypes = propTypes$u;
|
|
@@ -6172,7 +6182,7 @@ NavContext.displayName = 'NavContext';
|
|
|
6172
6182
|
|
|
6173
6183
|
var _excluded$t = ["children", "active", "disabled", "style", "activeStyle", "textStyle", "activeTextStyle"];
|
|
6174
6184
|
|
|
6175
|
-
var _templateObject$p, _templateObject2$k, _templateObject3$9, _templateObject4$7, _templateObject5$5, _templateObject6$4, _templateObject7$3, _templateObject8$2, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20;
|
|
6185
|
+
var _templateObject$p, _templateObject2$k, _templateObject3$9, _templateObject4$7, _templateObject5$5, _templateObject6$4, _templateObject7$3, _templateObject8$2, _templateObject9$1, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20;
|
|
6176
6186
|
var propTypes$t = {
|
|
6177
6187
|
children: PropTypes__default["default"].node.isRequired,
|
|
6178
6188
|
active: PropTypes__default["default"].bool,
|
|
@@ -6195,12 +6205,12 @@ var styles$p = StyleSheet.create(_objectSpread2(_objectSpread2({
|
|
|
6195
6205
|
'.nav-tabs .nav-link-disabled': css(_templateObject6$4 || (_templateObject6$4 = _taggedTemplateLiteral(["\n background-color: transparent;\n border-color: transparent;\n "]))),
|
|
6196
6206
|
'.nav-tabs .nav-link-disabled-text': css(_templateObject7$3 || (_templateObject7$3 = _taggedTemplateLiteral(["\n color: $nav-link-disabled-color;\n "]))),
|
|
6197
6207
|
'.nav-tabs .nav-link-active': css(_templateObject8$2 || (_templateObject8$2 = _taggedTemplateLiteral(["\n background-color: $nav-tabs-link-active-bg;\n border-color: $nav-tabs-link-active-border-color;\n\n &:hover {\n background-color: $nav-tabs-link-active-bg; // added for bootstrap-rn\n border-color: $nav-tabs-link-active-border-color; // added for bootstrap-rn\n }\n &:focus {\n background-color: $nav-tabs-link-active-bg; // added for bootstrap-rn\n border-color: $nav-tabs-link-active-border-color; // added for bootstrap-rn\n }\n "]))),
|
|
6198
|
-
'.nav-tabs .nav-link-active-text': css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n color: $nav-tabs-link-active-color;\n\n &:hover {\n color: $nav-tabs-link-active-color; // added for bootstrap-rn\n }\n &:focus {\n color: $nav-tabs-link-active-color; // added for bootstrap-rn\n }\n "]))),
|
|
6199
|
-
'.nav-pills .nav-link': css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n background: transparent; // none;\n border: 0;\n border-radius: $nav-pills-border-radius;\n "]))),
|
|
6200
|
-
'.nav-pills .nav-link-active': css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n // @include gradient-bg($nav-pills-link-active-bg);\n background-color: $nav-pills-link-active-bg; // added for bootstrap-rn\n\n &:hover {\n background-color: $nav-pills-link-active-bg; // added for bootstrap-rn\n }\n &:focus {\n background-color: $nav-pills-link-active-bg; // added for bootstrap-rn\n }\n "]))),
|
|
6201
|
-
'.nav-pills .nav-link-active-text': css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n color: $nav-pills-link-active-color;\n\n &:hover {\n color: $nav-pills-link-active-color; // added for bootstrap-rn\n }\n &:focus {\n color: $nav-pills-link-active-color; // added for bootstyl\n }\n "]))),
|
|
6208
|
+
'.nav-tabs .nav-link-active-text': css(_templateObject9$1 || (_templateObject9$1 = _taggedTemplateLiteral(["\n color: $nav-tabs-link-active-color;\n\n &:hover {\n color: $nav-tabs-link-active-color; // added for bootstrap-rn\n }\n &:focus {\n color: $nav-tabs-link-active-color; // added for bootstrap-rn\n }\n "]))),
|
|
6209
|
+
'.nav-pills .nav-link': css(_templateObject10$1 || (_templateObject10$1 = _taggedTemplateLiteral(["\n background: transparent; // none;\n border: 0;\n border-radius: $nav-pills-border-radius;\n "]))),
|
|
6210
|
+
'.nav-pills .nav-link-active': css(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteral(["\n // @include gradient-bg($nav-pills-link-active-bg);\n background-color: $nav-pills-link-active-bg; // added for bootstrap-rn\n\n &:hover {\n background-color: $nav-pills-link-active-bg; // added for bootstrap-rn\n }\n &:focus {\n background-color: $nav-pills-link-active-bg; // added for bootstrap-rn\n }\n "]))),
|
|
6211
|
+
'.nav-pills .nav-link-active-text': css(_templateObject12$1 || (_templateObject12$1 = _taggedTemplateLiteral(["\n color: $nav-pills-link-active-color;\n\n &:hover {\n color: $nav-pills-link-active-color; // added for bootstrap-rn\n }\n &:focus {\n color: $nav-pills-link-active-color; // added for bootstyl\n }\n "]))),
|
|
6202
6212
|
// Navbar styles
|
|
6203
|
-
'.navbar-nav .nav-link': css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n padding-right: 0;\n padding-left: 0;\n "])))
|
|
6213
|
+
'.navbar-nav .nav-link': css(_templateObject13$1 || (_templateObject13$1 = _taggedTemplateLiteral(["\n padding-right: 0;\n padding-left: 0;\n "])))
|
|
6204
6214
|
}, each(GRID_BREAKPOINTS, function (breakpoint) {
|
|
6205
6215
|
return _defineProperty({}, ".navbar-expand".concat(infix(next(breakpoint)), " .navbar-nav .nav-link"), css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n @include media-breakpoint-up(", ") {\n padding-right: $navbar-nav-link-padding-x;\n padding-left: $navbar-nav-link-padding-x;\n }\n "])), next(breakpoint)));
|
|
6206
6216
|
})), {}, {
|
|
@@ -6565,6 +6575,12 @@ Navbar.Toggler = NavbarToggler;
|
|
|
6565
6575
|
Navbar.useDismiss = useDismissNavbar;
|
|
6566
6576
|
Navbar.useToggle = useToggleNavbar;
|
|
6567
6577
|
|
|
6578
|
+
function useOffcanvas() {
|
|
6579
|
+
return React.useMemo(function () {
|
|
6580
|
+
return {};
|
|
6581
|
+
}, []);
|
|
6582
|
+
}
|
|
6583
|
+
|
|
6568
6584
|
var _excluded$k = ["children", "style"];
|
|
6569
6585
|
|
|
6570
6586
|
var _templateObject$i, _templateObject2$d;
|
|
@@ -6620,29 +6636,33 @@ var OffcanvasTitle = /*#__PURE__*/React__default["default"].forwardRef(function
|
|
|
6620
6636
|
OffcanvasTitle.displayName = 'OffcanvasTitle';
|
|
6621
6637
|
OffcanvasTitle.propTypes = propTypes$l;
|
|
6622
6638
|
|
|
6623
|
-
var _excluded$i = ["children", "style"];
|
|
6639
|
+
var _excluded$i = ["children", "style", "contentContainerStyle"];
|
|
6624
6640
|
|
|
6625
6641
|
var _templateObject$g, _templateObject2$c;
|
|
6626
6642
|
var propTypes$k = {
|
|
6627
6643
|
children: PropTypes__default["default"].node.isRequired,
|
|
6628
6644
|
// eslint-disable-next-line react/forbid-prop-types
|
|
6629
|
-
style: PropTypes__default["default"].any
|
|
6645
|
+
style: PropTypes__default["default"].any,
|
|
6646
|
+
// eslint-disable-next-line react/forbid-prop-types
|
|
6647
|
+
contentContainerStyle: PropTypes__default["default"].any
|
|
6630
6648
|
};
|
|
6631
6649
|
var styles$g = StyleSheet.create(_objectSpread2({
|
|
6632
|
-
'.offcanvas-body': css(_templateObject$g || (_templateObject$g = _taggedTemplateLiteral(["\n flex-grow: 1;\n padding: $offcanvas-padding-y $offcanvas-padding-x;\n // overflow-y: auto;\n "])))
|
|
6650
|
+
'.offcanvas-body': css(_templateObject$g || (_templateObject$g = _taggedTemplateLiteral(["\n // flex-grow: 1;\n padding: $offcanvas-padding-y $offcanvas-padding-x;\n // overflow-y: auto;\n "])))
|
|
6633
6651
|
}, each(GRID_BREAKPOINTS, function (breakpoint) {
|
|
6634
6652
|
return _defineProperty({}, ".navbar-expand".concat(infix(next(breakpoint)), " .offcanvas-body"), css(_templateObject2$c || (_templateObject2$c = _taggedTemplateLiteral(["\n @include media-breakpoint-up(", ") {\n display: flex;\n flex-grow: 0;\n padding: 0;\n // overflow-y: visible;\n }\n "])), next(breakpoint)));
|
|
6635
6653
|
})));
|
|
6636
6654
|
var OffcanvasBody = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
|
|
6637
6655
|
var children = props.children,
|
|
6638
6656
|
style = props.style,
|
|
6657
|
+
contentContainerStyle = props.contentContainerStyle,
|
|
6639
6658
|
elementProps = _objectWithoutProperties(props, _excluded$i);
|
|
6640
6659
|
|
|
6641
6660
|
var navbar = React.useContext(NavbarContext);
|
|
6642
|
-
var
|
|
6643
|
-
return /*#__PURE__*/React__default["default"].createElement(
|
|
6661
|
+
var contentContainerClasses = getStyles(styles$g, ['.offcanvas-body', navbar && navbar.expand && ".navbar-expand".concat(navbar.expand === true ? '' : "-".concat(navbar.expand), " .offcanvas-body")]);
|
|
6662
|
+
return /*#__PURE__*/React__default["default"].createElement(ScrollView, _extends({}, elementProps, {
|
|
6644
6663
|
ref: ref,
|
|
6645
|
-
style:
|
|
6664
|
+
style: style,
|
|
6665
|
+
contentContainerStyle: [contentContainerClasses, contentContainerStyle]
|
|
6646
6666
|
}), children);
|
|
6647
6667
|
});
|
|
6648
6668
|
OffcanvasBody.displayName = 'OffcanvasBody';
|
|
@@ -6650,7 +6670,7 @@ OffcanvasBody.propTypes = propTypes$k;
|
|
|
6650
6670
|
|
|
6651
6671
|
var _excluded$h = ["children", "visible", "placement", "backdrop", "scroll", "onToggle", "style", "textStyle"];
|
|
6652
6672
|
|
|
6653
|
-
var _templateObject$f, _templateObject2$b, _templateObject3$4, _templateObject4$3, _templateObject5$3, _templateObject6$2, _templateObject7$1, _templateObject8;
|
|
6673
|
+
var _templateObject$f, _templateObject2$b, _templateObject3$4, _templateObject4$3, _templateObject5$3, _templateObject6$2, _templateObject7$1, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
|
|
6654
6674
|
var PLACEMENTS = ['top', 'bottom', 'start', 'end']; // , 'auto'
|
|
6655
6675
|
|
|
6656
6676
|
var propTypes$j = {
|
|
@@ -6667,15 +6687,23 @@ var propTypes$j = {
|
|
|
6667
6687
|
textStyle: PropTypes__default["default"].any
|
|
6668
6688
|
};
|
|
6669
6689
|
var styles$f = StyleSheet.create(_objectSpread2({
|
|
6670
|
-
'.offcanvas': css(_templateObject$f || (_templateObject$f = _taggedTemplateLiteral(["\n position: absolute; // fixed;\n bottom: 0;\n z-index: $zindex-offcanvas;\n display: flex;\n flex-direction: column;\n max-width: 100%;\n // visibility: hidden;\n background-color: $offcanvas-bg-color;\n // background-clip: padding-box;\n @include platform(web) {\n outline-width: 0; // outline: 0;\n }\n // @include box-shadow($offcanvas-box-shadow);\n // @include transition(transform $offcanvas-transition-duration ease-in-out);\n "]))),
|
|
6690
|
+
'.offcanvas': css(_templateObject$f || (_templateObject$f = _taggedTemplateLiteral(["\n position: absolute; // fixed;\n // bottom: 0;\n z-index: $zindex-offcanvas;\n display: flex;\n flex-direction: column;\n max-width: 100%;\n // visibility: hidden;\n background-color: $offcanvas-bg-color;\n // background-clip: padding-box;\n @include platform(web) {\n outline-width: 0; // outline: 0;\n }\n // @include box-shadow($offcanvas-box-shadow);\n // @include transition(transform $offcanvas-transition-duration ease-in-out);\n "]))),
|
|
6671
6691
|
'.offcanvas-text': css(_templateObject2$b || (_templateObject2$b = _taggedTemplateLiteral(["\n color: $offcanvas-color;\n "]))),
|
|
6672
6692
|
'.offcanvas-backdrop': css(_templateObject3$4 || (_templateObject3$4 = _taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n left: 0;\n z-index: $zindex-offcanvas-backdrop;\n width: 100%;\n height: 100%;\n background-color: $offcanvas-backdrop-bg;\n opacity: $offcanvas-backdrop-opacity;\n "]))),
|
|
6673
|
-
'.offcanvas-start': css(_templateObject4$3 || (_templateObject4$3 = _taggedTemplateLiteral(["\n top: 0;\n left: 0;\n width: $offcanvas-horizontal-width;\n border-right-width: $offcanvas-border-width;\n border-style: solid;\n border-color: $offcanvas-border-color;\n // transform: translateX(-100%);\n "]))),
|
|
6674
|
-
'.offcanvas-end': css(_templateObject5$3 || (_templateObject5$3 = _taggedTemplateLiteral(["\n top: 0;\n right: 0;\n width: $offcanvas-horizontal-width;\n border-left-width: $offcanvas-border-width;\n border-style: solid;\n border-color: $offcanvas-border-color;\n // transform: translateX(100%);\n "]))),
|
|
6675
|
-
'.offcanvas-top': css(_templateObject6$2 || (_templateObject6$2 = _taggedTemplateLiteral(["\n top: 0;\n right: 0;\n left: 0;\n height: $offcanvas-vertical-height;\n max-height: 100%;\n border-bottom-width: $offcanvas-border-width;\n border-style: solid;\n border-color: $offcanvas-border-color;\n // transform: translateY(-100%);\n "]))),
|
|
6676
|
-
'.offcanvas-bottom': css(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteral(["\n right: 0;\n left: 0;\n height: $offcanvas-vertical-height;\n max-height: 100%;\n width: 100%;\n border-top-width: $offcanvas-border-width;\n border-style: solid;\n border-color: $offcanvas-border-color;\n // transform: translateY(100%);\n "])))
|
|
6693
|
+
'.offcanvas-start': css(_templateObject4$3 || (_templateObject4$3 = _taggedTemplateLiteral(["\n top: 0;\n bottom: 0; // added for bootstrap-rn\n left: 0;\n // width: $offcanvas-horizontal-width;\n border-right-width: $offcanvas-border-width;\n border-style: solid;\n border-color: $offcanvas-border-color;\n // transform: translateX(-100%);\n "]))),
|
|
6694
|
+
'.offcanvas-end': css(_templateObject5$3 || (_templateObject5$3 = _taggedTemplateLiteral(["\n top: 0;\n bottom: 0; // added for bootstrap-rn\n right: 0;\n // width: $offcanvas-horizontal-width;\n border-left-width: $offcanvas-border-width;\n border-style: solid;\n border-color: $offcanvas-border-color;\n // transform: translateX(100%);\n "]))),
|
|
6695
|
+
'.offcanvas-top': css(_templateObject6$2 || (_templateObject6$2 = _taggedTemplateLiteral(["\n top: 0;\n right: 0;\n left: 0;\n // height: $offcanvas-vertical-height;\n max-height: 100%;\n border-bottom-width: $offcanvas-border-width;\n border-style: solid;\n border-color: $offcanvas-border-color;\n // transform: translateY(-100%);\n "]))),
|
|
6696
|
+
'.offcanvas-bottom': css(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteral(["\n bottom: 0; // added for bootstrap-rn\n right: 0;\n left: 0;\n // height: $offcanvas-vertical-height;\n max-height: 100%;\n width: 100%;\n border-top-width: $offcanvas-border-width;\n border-style: solid;\n border-color: $offcanvas-border-color;\n // transform: translateY(100%);\n "]))),
|
|
6697
|
+
// The following .offcanvas-dialog classes are added for bootstrap-rn,
|
|
6698
|
+
// because otherwise the text would exceed a width of 100% on native
|
|
6699
|
+
// and also additional width by SafeAreaView would not be applied.
|
|
6700
|
+
'.offcanvas-dialog': css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n max-width: 100%;\n max-height: 100%;\n "]))),
|
|
6701
|
+
'.offcanvas-dialog-start': css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n width: $offcanvas-horizontal-width;\n "]))),
|
|
6702
|
+
'.offcanvas-dialog-end': css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n width: $offcanvas-horizontal-width;\n "]))),
|
|
6703
|
+
'.offcanvas-dialog-top': css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n height: $offcanvas-vertical-height;\n "]))),
|
|
6704
|
+
'.offcanvas-dialog-bottom': css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n height: $offcanvas-vertical-height;\n "])))
|
|
6677
6705
|
}, each(GRID_BREAKPOINTS, function (breakpoint) {
|
|
6678
|
-
return _defineProperty({}, ".navbar-expand".concat(infix(next(breakpoint)), " .offcanvas"), css(
|
|
6706
|
+
return _defineProperty({}, ".navbar-expand".concat(infix(next(breakpoint)), " .offcanvas"), css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n @include media-breakpoint-up(", ") {\n position: relative; // inherit;\n bottom: 0;\n // z-index: auto;\n flex-grow: 1;\n // visibility: visible !important; // stylelint-disable-line declaration-no-important\n background-color: transparent;\n border-right-width: 0;\n border-left-width: 0;\n // @include box-shadow(none);\n // @include transition(none);\n // transform: none;\n }\n "])), next(breakpoint)));
|
|
6679
6707
|
})));
|
|
6680
6708
|
var Offcanvas = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
|
|
6681
6709
|
var children = props.children,
|
|
@@ -6694,14 +6722,14 @@ var Offcanvas = /*#__PURE__*/React__default["default"].forwardRef(function (prop
|
|
|
6694
6722
|
var media = useMedia();
|
|
6695
6723
|
var navbar = React.useContext(NavbarContext);
|
|
6696
6724
|
var offcanvasRef = React.useRef();
|
|
6725
|
+
var offcanvas = useOffcanvas();
|
|
6697
6726
|
useScrollbarEffects({
|
|
6698
|
-
ref: offcanvasRef,
|
|
6699
6727
|
keepBodyScroll: scroll,
|
|
6700
|
-
centered: false,
|
|
6701
6728
|
visible: visible
|
|
6702
6729
|
});
|
|
6703
6730
|
var backdropClasses = getStyles(styles$f, ['.offcanvas-backdrop']);
|
|
6704
6731
|
var classes = getStyles(styles$f, ['.offcanvas', ".offcanvas-".concat(placement), navbar && navbar.expand && ".navbar-expand".concat(navbar.expand === true ? '' : "-".concat(navbar.expand), " .offcanvas")]);
|
|
6732
|
+
var dialogClasses = getStyles(styles$f, ['.offcanvas-dialog', ".offcanvas-dialog-".concat(placement)]);
|
|
6705
6733
|
var textClasses = getStyles(styles$f, ['.offcanvas-content-text']); // Render children without modal for navbar.
|
|
6706
6734
|
|
|
6707
6735
|
if (navbar && navbar.expand && (navbar.expand === true || media.up(navbar.expand))) {
|
|
@@ -6722,14 +6750,23 @@ var Offcanvas = /*#__PURE__*/React__default["default"].forwardRef(function (prop
|
|
|
6722
6750
|
dialogRef: offcanvasRef,
|
|
6723
6751
|
onClose: handleToggle,
|
|
6724
6752
|
backdrop: backdrop
|
|
6725
|
-
})), /*#__PURE__*/React__default["default"].createElement(
|
|
6753
|
+
})), /*#__PURE__*/React__default["default"].createElement(View, _extends({}, elementProps, {
|
|
6726
6754
|
ref: concatRefs(offcanvasRef, ref),
|
|
6727
6755
|
style: [classes, style],
|
|
6728
6756
|
textStyle: [textClasses, textStyle]
|
|
6729
|
-
}), /*#__PURE__*/React__default["default"].createElement(
|
|
6757
|
+
}), /*#__PURE__*/React__default["default"].createElement(reactNative.SafeAreaView, {
|
|
6758
|
+
style: {
|
|
6759
|
+
flexShrink: 1
|
|
6760
|
+
}
|
|
6761
|
+
}, /*#__PURE__*/React__default["default"].createElement(View, {
|
|
6762
|
+
style: dialogClasses
|
|
6763
|
+
}, /*#__PURE__*/React__default["default"].createElement(OffcanvasContext.Provider, {
|
|
6764
|
+
value: offcanvas
|
|
6765
|
+
}, /*#__PURE__*/React__default["default"].createElement(overlays.OverlayProvider, null, children))))));
|
|
6730
6766
|
});
|
|
6731
6767
|
Offcanvas.displayName = 'Offcanvas';
|
|
6732
6768
|
Offcanvas.propTypes = propTypes$j;
|
|
6769
|
+
Offcanvas.Context = OffcanvasContext;
|
|
6733
6770
|
Offcanvas.Header = OffcanvasHeader;
|
|
6734
6771
|
Offcanvas.Title = OffcanvasTitle;
|
|
6735
6772
|
Offcanvas.Body = OffcanvasBody;
|