bootstrap-rn 0.2.2 → 0.2.3
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 +102 -64
- package/dist/bootstrap-rn.esm.js +102 -64
- package/dist/bootstrap-rn.umd.js +102 -64
- package/dist/bootstrap-rn.umd.min.js +3 -3
- package/package.json +1 -1
package/dist/bootstrap-rn.umd.js
CHANGED
|
@@ -5510,21 +5510,21 @@
|
|
|
5510
5510
|
}, function (t) {
|
|
5511
5511
|
return calculate(t['input-padding-y'], '*', 0.5);
|
|
5512
5512
|
}), add(function (t) {
|
|
5513
|
-
return calculate(t['input-line-height'], '*',
|
|
5513
|
+
return calculate(t['input-line-height'], '*', t['input-font-size']);
|
|
5514
5514
|
}, // 1em
|
|
5515
5515
|
add(function (t) {
|
|
5516
5516
|
return calculate(t['input-padding-y'], '*', 2);
|
|
5517
5517
|
}, function (t) {
|
|
5518
5518
|
return t['input-height-border'];
|
|
5519
5519
|
})), add(function (t) {
|
|
5520
|
-
return calculate(t['input-line-height'], '*',
|
|
5520
|
+
return calculate(t['input-line-height'], '*', t['input-font-size-sm']);
|
|
5521
5521
|
}, // 1em
|
|
5522
5522
|
add(function (t) {
|
|
5523
5523
|
return calculate(t['input-padding-y-sm'], '*', 2);
|
|
5524
5524
|
}, function (t) {
|
|
5525
5525
|
return t['input-height-border'];
|
|
5526
5526
|
})), add(function (t) {
|
|
5527
|
-
return calculate(t['input-line-height'], '*',
|
|
5527
|
+
return calculate(t['input-line-height'], '*', t['input-font-size-lg']);
|
|
5528
5528
|
}, // 1em
|
|
5529
5529
|
add(function (t) {
|
|
5530
5530
|
return calculate(t['input-padding-y-lg'], '*', 2);
|
|
@@ -7505,7 +7505,7 @@
|
|
|
7505
7505
|
|
|
7506
7506
|
var _excluded$1l = ["children", "color", "size", "outline", "active", "disabled", "style", "activeStyle", "textStyle", "activeTextStyle"];
|
|
7507
7507
|
|
|
7508
|
-
var _templateObject$15, _templateObject2$P, _templateObject3$p, _templateObject4$m, _templateObject5$j, _templateObject6$g, _templateObject7$b, _templateObject8$b, _templateObject9$
|
|
7508
|
+
var _templateObject$15, _templateObject2$P, _templateObject3$p, _templateObject4$m, _templateObject5$j, _templateObject6$g, _templateObject7$b, _templateObject8$b, _templateObject9$a, _templateObject10$a, _templateObject11$7, _templateObject12$5, _templateObject13$5, _templateObject14$4, _templateObject15$3, _templateObject16$1, _templateObject17$1, _templateObject18$1, _templateObject19$1, _templateObject20$1, _templateObject21, _templateObject22, _templateObject23;
|
|
7509
7509
|
var propTypes$1p = {
|
|
7510
7510
|
children: PropTypes.node.isRequired,
|
|
7511
7511
|
color: PropTypes.oneOf([].concat(_toConsumableArray(Object.keys(THEME_COLORS)), ['link'])),
|
|
@@ -7545,7 +7545,7 @@
|
|
|
7545
7545
|
return t['btn-active-bg-shade-amount'];
|
|
7546
7546
|
}, value), shadeColor(function (t) {
|
|
7547
7547
|
return t['btn-active-border-shade-amount'];
|
|
7548
|
-
}, value))), _defineProperty(_ref, ".btn-".concat(color, ".active --text"), css(_templateObject7$b || (_templateObject7$b = _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$
|
|
7548
|
+
}, value))), _defineProperty(_ref, ".btn-".concat(color, ".active --text"), css(_templateObject7$b || (_templateObject7$b = _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$a || (_templateObject9$a = _taggedTemplateLiteral(["\n $disabled-color: ", ";\n\n color: $disabled-color;\n "])), colorContrast(value))), _defineProperty(_ref, ".btn-outline-".concat(color), css(_templateObject10$a || (_templateObject10$a = _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$7 || (_templateObject11$7 = _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;
|
|
7549
7549
|
})), {}, {
|
|
7550
7550
|
'.btn-link --text': css(_templateObject14$4 || (_templateObject14$4 = _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 "]))),
|
|
7551
7551
|
'.btn-link.disabled --text': css(_templateObject15$3 || (_templateObject15$3 = _taggedTemplateLiteral(["\n color: $btn-link-disabled-color;\n "]))),
|
|
@@ -8567,7 +8567,7 @@
|
|
|
8567
8567
|
|
|
8568
8568
|
var _excluded$19 = ["type", "value", "onFocus", "onBlur", "disabled", "valid", "invalid", "useNativeComponent", "style"];
|
|
8569
8569
|
|
|
8570
|
-
var _templateObject$Y, _templateObject2$H, _templateObject3$m, _templateObject4$j, _templateObject5$g, _templateObject6$e, _templateObject7$9, _templateObject8$9, _templateObject9$
|
|
8570
|
+
var _templateObject$Y, _templateObject2$H, _templateObject3$m, _templateObject4$j, _templateObject5$g, _templateObject6$e, _templateObject7$9, _templateObject8$9, _templateObject9$9, _templateObject10$9, _templateObject11$6, _templateObject12$4, _templateObject13$4, _templateObject14$3, _templateObject15$2;
|
|
8571
8571
|
/* eslint-disable react/no-unused-prop-types */
|
|
8572
8572
|
|
|
8573
8573
|
var propTypes$1c = {
|
|
@@ -8598,17 +8598,17 @@
|
|
|
8598
8598
|
'.form-check-input[type="radio"]:checked': css(_templateObject8$9 || (_templateObject8$9 = _taggedTemplateLiteral(["\n // @if $enable-gradients {\n // background-image: escape-svg($form-check-radio-checked-bg-image), var(--#{$variable-prefix}gradient);\n // } @else {\n background-image: ", ";\n // }\n "])), function (t) {
|
|
8599
8599
|
return escapeSvg(t['form-check-radio-checked-bg-image']);
|
|
8600
8600
|
}),
|
|
8601
|
-
'.form-check-input:disabled': css(_templateObject9$
|
|
8601
|
+
'.form-check-input:disabled': css(_templateObject9$9 || (_templateObject9$9 = _taggedTemplateLiteral(["\n @include platform(web) {\n pointer-events: none;\n filter: none;\n }\n opacity: $form-check-label-disabled-opacity;\n "])))
|
|
8602
8602
|
}, each(FORM_VALIDATION_STATES, function (state, data) {
|
|
8603
8603
|
var _ref;
|
|
8604
8604
|
|
|
8605
|
-
return _ref = {}, _defineProperty(_ref, ".form-check-input:".concat(state), css(_templateObject10$
|
|
8605
|
+
return _ref = {}, _defineProperty(_ref, ".form-check-input:".concat(state), css(_templateObject10$9 || (_templateObject10$9 = _taggedTemplateLiteral(["\n border-color: ", ";\n\n &:focus {\n border-color: ", "; // added for bootstrap-rn\n @include platform(web) {\n box-shadow: 0 0 $input-btn-focus-blur $input-focus-width\n rgba(", ", $input-btn-focus-color-opacity);\n }\n }\n "])), function (t) {
|
|
8606
8606
|
return data(t).color;
|
|
8607
8607
|
}, function (t) {
|
|
8608
8608
|
return data(t).color;
|
|
8609
8609
|
}, function (t) {
|
|
8610
8610
|
return data(t).color;
|
|
8611
|
-
})), _defineProperty(_ref, ".form-check-input:".concat(state, ":checked"), css(_templateObject11$
|
|
8611
|
+
})), _defineProperty(_ref, ".form-check-input:".concat(state, ":checked"), css(_templateObject11$6 || (_templateObject11$6 = _taggedTemplateLiteral(["\n background-color: ", ";\n "])), function (t) {
|
|
8612
8612
|
return data(t).color;
|
|
8613
8613
|
})), _ref;
|
|
8614
8614
|
})), {}, {
|
|
@@ -8978,7 +8978,7 @@
|
|
|
8978
8978
|
|
|
8979
8979
|
var _excluded$15 = ["children", "start", "right", "end", "style", "textStyle"];
|
|
8980
8980
|
|
|
8981
|
-
var _templateObject$U, _templateObject2$F, _templateObject3$k, _templateObject4$h, _templateObject5$e, _templateObject6$d, _templateObject7$8, _templateObject8$8, _templateObject9$
|
|
8981
|
+
var _templateObject$U, _templateObject2$F, _templateObject3$k, _templateObject4$h, _templateObject5$e, _templateObject6$d, _templateObject7$8, _templateObject8$8, _templateObject9$8, _templateObject10$8;
|
|
8982
8982
|
var ALIGNMENT_BREAKPOINTS = [true, 'sm', 'md', 'lg', 'xl', 'xxl'];
|
|
8983
8983
|
var propTypes$16 = {
|
|
8984
8984
|
children: PropTypes.node.isRequired,
|
|
@@ -9003,9 +9003,9 @@
|
|
|
9003
9003
|
'.dropstart .dropdown-menu[data-bs-popper]': css(_templateObject7$8 || (_templateObject7$8 = _taggedTemplateLiteral(["\n top: 0;\n right: 100%;\n left: auto;\n margin-top: 0;\n margin-right: $dropdown-spacer;\n "]))),
|
|
9004
9004
|
'.navbar-nav .dropdown-menu': css(_templateObject8$8 || (_templateObject8$8 = _taggedTemplateLiteral(["\n position: relative; // static;\n "])))
|
|
9005
9005
|
}, each(GRID_BREAKPOINTS, function (breakpoint) {
|
|
9006
|
-
return _defineProperty({}, ".navbar-expand".concat(infix(next(breakpoint)), " .navbar-nav .dropdown-menu"), css(_templateObject9$
|
|
9006
|
+
return _defineProperty({}, ".navbar-expand".concat(infix(next(breakpoint)), " .navbar-nav .dropdown-menu"), css(_templateObject9$8 || (_templateObject9$8 = _taggedTemplateLiteral(["\n @include media-breakpoint-up(", ") {\n position: absolute;\n }\n "])), next(breakpoint)));
|
|
9007
9007
|
})), {}, {
|
|
9008
|
-
'.dropdown-menu --text': css(_templateObject10$
|
|
9008
|
+
'.dropdown-menu --text': css(_templateObject10$8 || (_templateObject10$8 = _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 "])))
|
|
9009
9009
|
}));
|
|
9010
9010
|
|
|
9011
9011
|
var getAlignment = function getAlignment(media, start, end) {
|
|
@@ -9671,7 +9671,7 @@
|
|
|
9671
9671
|
|
|
9672
9672
|
var _excluded$R = ["size", "placeholderTextColor", "multiline", "disabled", "valid", "invalid", "editable", "selectTextOnFocus", "style"];
|
|
9673
9673
|
|
|
9674
|
-
var _templateObject$H, _templateObject2$w, _templateObject3$g, _templateObject4$e, _templateObject5$c, _templateObject6$b, _templateObject7$7, _templateObject8$7;
|
|
9674
|
+
var _templateObject$H, _templateObject2$w, _templateObject3$g, _templateObject4$e, _templateObject5$c, _templateObject6$b, _templateObject7$7, _templateObject8$7, _templateObject9$7, _templateObject10$7, _templateObject11$5;
|
|
9675
9675
|
var propTypes$T = {
|
|
9676
9676
|
size: PropTypes.oneOf(['sm', 'lg']),
|
|
9677
9677
|
placeholderTextColor: PropTypes.string,
|
|
@@ -9683,17 +9683,36 @@
|
|
|
9683
9683
|
selectTextOnFocus: PropTypes.bool,
|
|
9684
9684
|
// eslint-disable-next-line react/forbid-prop-types
|
|
9685
9685
|
style: PropTypes.any
|
|
9686
|
-
};
|
|
9686
|
+
}; // Known issues:
|
|
9687
|
+
//
|
|
9688
|
+
// line-height (iOS)
|
|
9689
|
+
// If a line height is defined on iOS the text will be displayed on the bottom
|
|
9690
|
+
// of the line. As a workaround the line height is only defined for multi line
|
|
9691
|
+
// inputs.
|
|
9692
|
+
//
|
|
9693
|
+
// multi line height (iOS)
|
|
9694
|
+
// A multi line input on iOS has only the height of a single line input. As a
|
|
9695
|
+
// workaround we added a height of $input-height-sm + 8rem for multi line
|
|
9696
|
+
// inputs on iOS.
|
|
9697
|
+
//
|
|
9698
|
+
// single line height (Android)
|
|
9699
|
+
// If no height is defined, Android sets a text line height of 28px auto-
|
|
9700
|
+
// matically, which leads to a larger height than min height for the default
|
|
9701
|
+
// and sm size. As a workaround we set a height for single line inputs.
|
|
9702
|
+
|
|
9687
9703
|
var styles$G = StyleSheet.create(_objectSpread2({
|
|
9688
|
-
'.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 // @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 }\n "]))),
|
|
9704
|
+
'.form-control': css(_templateObject$H || (_templateObject$H = _taggedTemplateLiteral(["\n // display: block;\n width: 100%;\n min-height: $input-height; // added for bootstrap-rn\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 @include platform(web) {\n line-height: $input-font-size * $input-line-height;\n }\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 // @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 }\n "]))),
|
|
9689
9705
|
'.form-control.disabled': css(_templateObject2$w || (_templateObject2$w = _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 "]))),
|
|
9690
|
-
'.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 line-height: $input-font-size-sm * $line-height-base; // added for bootstrap-rn\n border-radius: $input-border-radius-sm;\n "]))),
|
|
9691
|
-
'.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 line-height: $input-font-size-lg * $line-height-base; // added for bootstrap-rn\n border-radius: $input-border-radius-lg;\n "]))),
|
|
9692
|
-
'.form-control
|
|
9693
|
-
'.form-control-
|
|
9694
|
-
'.form-control-
|
|
9706
|
+
'.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 @include platform(web) {\n line-height: $input-font-size-sm * $line-height-base; // added for bootstrap-rn\n }\n border-radius: $input-border-radius-sm;\n "]))),
|
|
9707
|
+
'.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 @include platform(web) {\n line-height: $input-font-size-lg * $line-height-base; // added for bootstrap-rn\n }\n border-radius: $input-border-radius-lg;\n "]))),
|
|
9708
|
+
'.form-control:not(textarea)': css(_templateObject5$c || (_templateObject5$c = _taggedTemplateLiteral(["\n @include platform(android) {\n height: $input-height; // added for bootstrap-rn\n }\n "]))),
|
|
9709
|
+
'.form-control-sm:not(textarea)': css(_templateObject6$b || (_templateObject6$b = _taggedTemplateLiteral(["\n @include platform(android) {\n height: $input-height-sm; // added for bootstrap-rn\n }\n "]))),
|
|
9710
|
+
'.form-control-lg:not(textarea)': css(_templateObject7$7 || (_templateObject7$7 = _taggedTemplateLiteral(["\n @include platform(android) {\n height: $input-height-lg; // added for bootstrap-rn\n }\n "]))),
|
|
9711
|
+
'textarea.form-control': css(_templateObject8$7 || (_templateObject8$7 = _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 @include platform(native) {\n line-height: $input-font-size * $input-line-height; // added for bootstrap-rn\n }\n "]))),
|
|
9712
|
+
'textarea.form-control-sm': css(_templateObject9$7 || (_templateObject9$7 = _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 @include platform(native) {\n line-height: $input-font-size-sm * $line-height-base; // added for bootstrap-rn\n }\n "]))),
|
|
9713
|
+
'textarea.form-control-lg': css(_templateObject10$7 || (_templateObject10$7 = _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 @include platform(native) {\n line-height: $input-font-size-sm * $line-height-base; // added for bootstrap-rn\n }\n "])))
|
|
9695
9714
|
}, each(FORM_VALIDATION_STATES, function (state, data) {
|
|
9696
|
-
return _defineProperty({}, ".form-control:".concat(state), css(
|
|
9715
|
+
return _defineProperty({}, ".form-control:".concat(state), css(_templateObject11$5 || (_templateObject11$5 = _taggedTemplateLiteral(["\n border-color: ", ";\n\n &:focus {\n border-color: ", ";\n @include platform(web) {\n box-shadow: 0 0 $input-btn-focus-blur $input-focus-width\n rgba(", ", $input-btn-focus-color-opacity);\n }\n }\n "])), function (t) {
|
|
9697
9716
|
return data(t).color;
|
|
9698
9717
|
}, function (t) {
|
|
9699
9718
|
return data(t).color;
|
|
@@ -9725,7 +9744,7 @@
|
|
|
9725
9744
|
style = modifierProps.style,
|
|
9726
9745
|
elementProps = _objectWithoutProperties(modifierProps, _excluded$R);
|
|
9727
9746
|
|
|
9728
|
-
var classes = getStyles(styles$G, ['.form-control', disabled && '.form-control.disabled', size === 'sm' && '.form-control-sm', size === 'lg' && '.form-control-lg', multiline && '.form-control
|
|
9747
|
+
var classes = getStyles(styles$G, ['.form-control', disabled && '.form-control.disabled', size === 'sm' && '.form-control-sm', size === 'lg' && '.form-control-lg', !multiline && '.form-control:not(textarea)', !multiline && size === 'sm' && '.form-control-sm:not(textarea)', !multiline && size === 'lg' && '.form-control-lg:not(textarea)', multiline && 'textarea.form-control', multiline && size === 'sm' && 'textarea.form-control-sm', multiline && size === 'lg' && 'textarea.form-control-lg', valid && '.form-control:valid', invalid && '.form-control:invalid']);
|
|
9729
9748
|
return /*#__PURE__*/React__default["default"].createElement(TextInput, _extends$1({}, elementProps, {
|
|
9730
9749
|
ref: modifierRef,
|
|
9731
9750
|
placeholderTextColor: placeholderTextColor,
|
|
@@ -10830,7 +10849,7 @@
|
|
|
10830
10849
|
ModalTitle.displayName = 'ModalTitle';
|
|
10831
10850
|
ModalTitle.propTypes = propTypes$B;
|
|
10832
10851
|
|
|
10833
|
-
var _excluded$y = ["children", "style", "
|
|
10852
|
+
var _excluded$y = ["children", "style", "innerStyle"];
|
|
10834
10853
|
|
|
10835
10854
|
var _templateObject$t;
|
|
10836
10855
|
var propTypes$A = {
|
|
@@ -10838,7 +10857,7 @@
|
|
|
10838
10857
|
// eslint-disable-next-line react/forbid-prop-types
|
|
10839
10858
|
style: PropTypes.any,
|
|
10840
10859
|
// eslint-disable-next-line react/forbid-prop-types
|
|
10841
|
-
|
|
10860
|
+
innerStyle: PropTypes.any
|
|
10842
10861
|
};
|
|
10843
10862
|
var styles$t = StyleSheet.create({
|
|
10844
10863
|
'.modal-body': css(_templateObject$t || (_templateObject$t = _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 "])))
|
|
@@ -10846,7 +10865,7 @@
|
|
|
10846
10865
|
var ModalBody = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
|
|
10847
10866
|
var children = props.children,
|
|
10848
10867
|
style = props.style,
|
|
10849
|
-
|
|
10868
|
+
innerStyle = props.innerStyle,
|
|
10850
10869
|
elementProps = _objectWithoutProperties(props, _excluded$y);
|
|
10851
10870
|
|
|
10852
10871
|
var _useForcedContext = useForcedContext(ModalContext),
|
|
@@ -10857,7 +10876,7 @@
|
|
|
10857
10876
|
return /*#__PURE__*/React__default["default"].createElement(FlexView, _extends$1({}, elementProps, {
|
|
10858
10877
|
ref: ref,
|
|
10859
10878
|
style: scrollable ? style : [classes, style],
|
|
10860
|
-
contentContainerStyle: scrollable ? [classes,
|
|
10879
|
+
contentContainerStyle: scrollable ? [classes, innerStyle] : undefined
|
|
10861
10880
|
}), children);
|
|
10862
10881
|
});
|
|
10863
10882
|
ModalBody.displayName = 'ModalBody';
|
|
@@ -10888,7 +10907,7 @@
|
|
|
10888
10907
|
ModalFooter.displayName = 'ModalFooter';
|
|
10889
10908
|
ModalFooter.propTypes = propTypes$z;
|
|
10890
10909
|
|
|
10891
|
-
var _excluded$w = ["children", "visible", "size", "backdrop", "scrollable", "centered", "onToggle", "style", "textStyle"];
|
|
10910
|
+
var _excluded$w = ["children", "visible", "size", "backdrop", "scrollable", "centered", "onToggle", "style", "innerStyle", "dialogStyle", "contentStyle", "textStyle", "dialogTextStyle", "contentTextStyle"];
|
|
10892
10911
|
|
|
10893
10912
|
var _templateObject$r, _templateObject2$l, _templateObject3$a, _templateObject4$8, _templateObject5$6, _templateObject6$5, _templateObject7$3, _templateObject8$3, _templateObject9$3, _templateObject10$3, _templateObject11$2;
|
|
10894
10913
|
var MODAL_SIZES = ['sm', 'lg', 'xl'];
|
|
@@ -10903,7 +10922,17 @@
|
|
|
10903
10922
|
// eslint-disable-next-line react/forbid-prop-types
|
|
10904
10923
|
style: PropTypes.any,
|
|
10905
10924
|
// eslint-disable-next-line react/forbid-prop-types
|
|
10906
|
-
|
|
10925
|
+
innerStyle: PropTypes.any,
|
|
10926
|
+
// eslint-disable-next-line react/forbid-prop-types
|
|
10927
|
+
dialogStyle: PropTypes.any,
|
|
10928
|
+
// eslint-disable-next-line react/forbid-prop-types
|
|
10929
|
+
contentStyle: PropTypes.any,
|
|
10930
|
+
// eslint-disable-next-line react/forbid-prop-types
|
|
10931
|
+
textStyle: PropTypes.any,
|
|
10932
|
+
// eslint-disable-next-line react/forbid-prop-types
|
|
10933
|
+
dialogTextStyle: PropTypes.any,
|
|
10934
|
+
// eslint-disable-next-line react/forbid-prop-types
|
|
10935
|
+
contentTextStyle: PropTypes.any
|
|
10907
10936
|
};
|
|
10908
10937
|
var styles$r = StyleSheet.create({
|
|
10909
10938
|
'.modal': css(_templateObject$r || (_templateObject$r = _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 "]))),
|
|
@@ -10915,8 +10944,8 @@
|
|
|
10915
10944
|
'.modal-content --text': css(_templateObject7$3 || (_templateObject7$3 = _taggedTemplateLiteral(["\n color: $modal-content-color;\n "]))),
|
|
10916
10945
|
'.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 "]))),
|
|
10917
10946
|
'.modal-sm': css(_templateObject9$3 || (_templateObject9$3 = _taggedTemplateLiteral(["\n @include media-breakpoint-up(sm) {\n max-width: $modal-sm;\n }\n "]))),
|
|
10918
|
-
'.modal-lg': css(_templateObject10$3 || (_templateObject10$3 = _taggedTemplateLiteral(["\n @include media-breakpoint-up(lg) {\n max-width: $modal-lg;\n }\n
|
|
10919
|
-
'.modal-xl': css(_templateObject11$2 || (_templateObject11$2 = _taggedTemplateLiteral(["\n @include media-breakpoint-up(xl) {\n max-width: $modal-xl;\n }\n "])))
|
|
10947
|
+
'.modal-lg': css(_templateObject10$3 || (_templateObject10$3 = _taggedTemplateLiteral(["\n @include media-breakpoint-up(lg) {\n max-width: $modal-lg;\n }\n "]))),
|
|
10948
|
+
'.modal-xl': css(_templateObject11$2 || (_templateObject11$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 "])))
|
|
10920
10949
|
});
|
|
10921
10950
|
var Modal = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
|
|
10922
10951
|
var children = props.children,
|
|
@@ -10930,7 +10959,12 @@
|
|
|
10930
10959
|
centered = _props$centered === void 0 ? false : _props$centered,
|
|
10931
10960
|
handleToggle = props.onToggle,
|
|
10932
10961
|
style = props.style,
|
|
10962
|
+
innerStyle = props.innerStyle,
|
|
10963
|
+
dialogStyle = props.dialogStyle,
|
|
10964
|
+
contentStyle = props.contentStyle,
|
|
10933
10965
|
textStyle = props.textStyle,
|
|
10966
|
+
dialogTextStyle = props.dialogTextStyle,
|
|
10967
|
+
contentTextStyle = props.contentTextStyle,
|
|
10934
10968
|
elementProps = _objectWithoutProperties(props, _excluded$w);
|
|
10935
10969
|
|
|
10936
10970
|
var dialogRef = React.useRef();
|
|
@@ -10953,10 +10987,11 @@
|
|
|
10953
10987
|
}, backdrop && /*#__PURE__*/React__default["default"].createElement(View, {
|
|
10954
10988
|
style: backdropClasses
|
|
10955
10989
|
}), /*#__PURE__*/React__default["default"].createElement(FlexView, {
|
|
10956
|
-
style: classes,
|
|
10957
|
-
|
|
10990
|
+
style: [classes, style],
|
|
10991
|
+
textStyle: textStyle,
|
|
10992
|
+
contentContainerStyle: [scrollable ? undefined : {
|
|
10958
10993
|
flexGrow: 1
|
|
10959
|
-
}
|
|
10994
|
+
}, innerStyle]
|
|
10960
10995
|
}, /*#__PURE__*/React__default["default"].createElement(BackdropHandler, {
|
|
10961
10996
|
dialogRef: dialogRef,
|
|
10962
10997
|
onClose: handleToggle,
|
|
@@ -10967,11 +11002,12 @@
|
|
|
10967
11002
|
}
|
|
10968
11003
|
}, /*#__PURE__*/React__default["default"].createElement(View, {
|
|
10969
11004
|
ref: dialogRef,
|
|
10970
|
-
style: dialogClasses
|
|
11005
|
+
style: [dialogClasses, dialogStyle],
|
|
11006
|
+
textStyle: dialogTextStyle
|
|
10971
11007
|
}, /*#__PURE__*/React__default["default"].createElement(View, _extends$1({}, elementProps, {
|
|
10972
11008
|
ref: ref,
|
|
10973
|
-
style: [contentClasses,
|
|
10974
|
-
textStyle: [contentTextClasses,
|
|
11009
|
+
style: [contentClasses, contentStyle],
|
|
11010
|
+
textStyle: [contentTextClasses, contentTextStyle]
|
|
10975
11011
|
}), /*#__PURE__*/React__default["default"].createElement(ModalContext.Provider, {
|
|
10976
11012
|
value: modal
|
|
10977
11013
|
}, /*#__PURE__*/React__default["default"].createElement(OverlayProvider, null, children)))))));
|
|
@@ -11494,7 +11530,7 @@
|
|
|
11494
11530
|
OffcanvasBody.displayName = 'OffcanvasBody';
|
|
11495
11531
|
OffcanvasBody.propTypes = propTypes$o;
|
|
11496
11532
|
|
|
11497
|
-
var _excluded$j = ["children", "visible", "placement", "backdrop", "scroll", "onToggle", "style", "textStyle"];
|
|
11533
|
+
var _excluded$j = ["children", "visible", "placement", "backdrop", "scroll", "onToggle", "style", "dialogStyle", "textStyle", "dialogTextStyle"];
|
|
11498
11534
|
|
|
11499
11535
|
var _templateObject$g, _templateObject2$b, _templateObject3$4, _templateObject4$3, _templateObject5$3, _templateObject6$2, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
|
|
11500
11536
|
var PLACEMENTS = ['top', 'bottom', 'start', 'end']; // , 'auto'
|
|
@@ -11510,7 +11546,11 @@
|
|
|
11510
11546
|
// eslint-disable-next-line react/forbid-prop-types
|
|
11511
11547
|
style: PropTypes.any,
|
|
11512
11548
|
// eslint-disable-next-line react/forbid-prop-types
|
|
11513
|
-
|
|
11549
|
+
dialogStyle: PropTypes.any,
|
|
11550
|
+
// eslint-disable-next-line react/forbid-prop-types
|
|
11551
|
+
textStyle: PropTypes.any,
|
|
11552
|
+
// eslint-disable-next-line react/forbid-prop-types
|
|
11553
|
+
dialogTextStyle: PropTypes.any
|
|
11514
11554
|
};
|
|
11515
11555
|
var styles$g = StyleSheet.create(_objectSpread2({
|
|
11516
11556
|
'.offcanvas': css(_templateObject$g || (_templateObject$g = _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 "]))),
|
|
@@ -11542,7 +11582,9 @@
|
|
|
11542
11582
|
scroll = _props$scroll === void 0 ? false : _props$scroll,
|
|
11543
11583
|
handleToggle = props.onToggle,
|
|
11544
11584
|
style = props.style,
|
|
11585
|
+
dialogStyle = props.dialogStyle,
|
|
11545
11586
|
textStyle = props.textStyle,
|
|
11587
|
+
dialogTextStyle = props.dialogTextStyle,
|
|
11546
11588
|
elementProps = _objectWithoutProperties(props, _excluded$j);
|
|
11547
11589
|
|
|
11548
11590
|
var media = useMedia();
|
|
@@ -11585,7 +11627,8 @@
|
|
|
11585
11627
|
flexShrink: 1
|
|
11586
11628
|
}
|
|
11587
11629
|
}, /*#__PURE__*/React__default["default"].createElement(View, {
|
|
11588
|
-
style: dialogClasses
|
|
11630
|
+
style: [dialogClasses, dialogStyle],
|
|
11631
|
+
textStyle: dialogTextStyle
|
|
11589
11632
|
}, /*#__PURE__*/React__default["default"].createElement(OffcanvasContext.Provider, {
|
|
11590
11633
|
value: offcanvas
|
|
11591
11634
|
}, /*#__PURE__*/React__default["default"].createElement(OverlayProvider, null, children))))));
|
|
@@ -11666,11 +11709,11 @@
|
|
|
11666
11709
|
var PickerNativeContext = /*#__PURE__*/React__default["default"].createContext();
|
|
11667
11710
|
PickerNativeContext.displayName = 'PickerNativeContext';
|
|
11668
11711
|
|
|
11669
|
-
var _excluded$h = ["children", "selectedValue", "onValueChange", "onFocus", "onBlur", "placeholder", "placeholderTextColor", "disabled", "
|
|
11712
|
+
var _excluded$h = ["children", "selectedValue", "onValueChange", "onFocus", "onBlur", "placeholder", "placeholderTextColor", "disabled", "MenuComponent", "style"];
|
|
11670
11713
|
|
|
11671
11714
|
var _templateObject$f;
|
|
11672
11715
|
var propTypes$l = {
|
|
11673
|
-
children: PropTypes.node,
|
|
11716
|
+
children: PropTypes.node.isRequired,
|
|
11674
11717
|
selectedValue: PropTypes.oneOfType([PropTypes.bool, PropTypes.number, PropTypes.string, PropTypes.object]),
|
|
11675
11718
|
onValueChange: PropTypes.func,
|
|
11676
11719
|
onFocus: PropTypes.func,
|
|
@@ -11678,8 +11721,7 @@
|
|
|
11678
11721
|
placeholder: PropTypes.string,
|
|
11679
11722
|
placeholderTextColor: PropTypes.string,
|
|
11680
11723
|
disabled: PropTypes.bool,
|
|
11681
|
-
|
|
11682
|
-
renderMenu: PropTypes.func,
|
|
11724
|
+
MenuComponent: PropTypes.elementType,
|
|
11683
11725
|
// eslint-disable-next-line react/forbid-prop-types
|
|
11684
11726
|
style: PropTypes.any
|
|
11685
11727
|
};
|
|
@@ -11703,7 +11745,7 @@
|
|
|
11703
11745
|
return textStyles;
|
|
11704
11746
|
};
|
|
11705
11747
|
|
|
11706
|
-
var
|
|
11748
|
+
var getText = function getText(_ref3) {
|
|
11707
11749
|
var children = _ref3.children,
|
|
11708
11750
|
selectedValue = _ref3.selectedValue;
|
|
11709
11751
|
var items = React__default["default"].Children.map(children, function (child) {
|
|
@@ -11717,12 +11759,14 @@
|
|
|
11717
11759
|
});
|
|
11718
11760
|
return selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.label;
|
|
11719
11761
|
};
|
|
11762
|
+
/* eslint-disable react/prop-types */
|
|
11720
11763
|
|
|
11721
|
-
|
|
11764
|
+
|
|
11765
|
+
var DefaultMenuComponent = function DefaultMenuComponent(_ref4) {
|
|
11722
11766
|
var children = _ref4.children,
|
|
11723
11767
|
selectedValue = _ref4.selectedValue,
|
|
11724
|
-
handleValueChange = _ref4.
|
|
11725
|
-
handleClose = _ref4.
|
|
11768
|
+
handleValueChange = _ref4.onValueChange,
|
|
11769
|
+
handleClose = _ref4.onClose;
|
|
11726
11770
|
return /*#__PURE__*/React__default["default"].createElement(Offcanvas, {
|
|
11727
11771
|
placement: "bottom",
|
|
11728
11772
|
visible: true,
|
|
@@ -11736,6 +11780,8 @@
|
|
|
11736
11780
|
}
|
|
11737
11781
|
}, children)));
|
|
11738
11782
|
};
|
|
11783
|
+
/* eslint-enable */
|
|
11784
|
+
|
|
11739
11785
|
|
|
11740
11786
|
var PickerNative = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
|
|
11741
11787
|
var children = props.children,
|
|
@@ -11747,14 +11793,11 @@
|
|
|
11747
11793
|
_props$onBlur = props.onBlur,
|
|
11748
11794
|
onBlur = _props$onBlur === void 0 ? function () {} : _props$onBlur,
|
|
11749
11795
|
placeholder = props.placeholder,
|
|
11750
|
-
|
|
11751
|
-
placeholderTextColor = _props$placeholderTex === void 0 ? StyleSheet.value('input-placeholder-color') : _props$placeholderTex,
|
|
11796
|
+
placeholderTextColor = props.placeholderTextColor,
|
|
11752
11797
|
_props$disabled = props.disabled,
|
|
11753
11798
|
disabled = _props$disabled === void 0 ? false : _props$disabled,
|
|
11754
|
-
_props$
|
|
11755
|
-
|
|
11756
|
-
_props$renderMenu = props.renderMenu,
|
|
11757
|
-
renderMenu = _props$renderMenu === void 0 ? renderMenuDefault : _props$renderMenu,
|
|
11799
|
+
_props$MenuComponent = props.MenuComponent,
|
|
11800
|
+
MenuComponent = _props$MenuComponent === void 0 ? DefaultMenuComponent : _props$MenuComponent,
|
|
11758
11801
|
style = props.style,
|
|
11759
11802
|
elementProps = _objectWithoutProperties(props, _excluded$h);
|
|
11760
11803
|
|
|
@@ -11780,10 +11823,6 @@
|
|
|
11780
11823
|
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Pressable, _extends$1({}, elementProps, {
|
|
11781
11824
|
ref: ref,
|
|
11782
11825
|
accessibilityRole: "combobox",
|
|
11783
|
-
accessibilityDisabled: disabled,
|
|
11784
|
-
accessible: true,
|
|
11785
|
-
focusable: !disabled,
|
|
11786
|
-
selectable: false,
|
|
11787
11826
|
onPress: function onPress() {
|
|
11788
11827
|
setVisible(true);
|
|
11789
11828
|
},
|
|
@@ -11796,15 +11835,14 @@
|
|
|
11796
11835
|
style: [textStyle, showPlaceholder && {
|
|
11797
11836
|
color: placeholderTextColor
|
|
11798
11837
|
}]
|
|
11799
|
-
}, showPlaceholder ? placeholder :
|
|
11838
|
+
}, showPlaceholder ? placeholder : getText({
|
|
11800
11839
|
children: children,
|
|
11801
11840
|
selectedValue: selectedValue
|
|
11802
|
-
}))), visible &&
|
|
11803
|
-
children: children,
|
|
11841
|
+
}))), visible && /*#__PURE__*/React__default["default"].createElement(MenuComponent, {
|
|
11804
11842
|
selectedValue: selectedValue,
|
|
11805
|
-
|
|
11806
|
-
|
|
11807
|
-
}));
|
|
11843
|
+
onValueChange: handleValueChange,
|
|
11844
|
+
onClose: handleClose
|
|
11845
|
+
}, children));
|
|
11808
11846
|
});
|
|
11809
11847
|
PickerNative.propTypes = propTypes$l;
|
|
11810
11848
|
|
|
@@ -11908,7 +11946,7 @@
|
|
|
11908
11946
|
/* eslint-disable react/no-unused-prop-types */
|
|
11909
11947
|
|
|
11910
11948
|
var propTypes$h = {
|
|
11911
|
-
children: PropTypes.node,
|
|
11949
|
+
children: PropTypes.node.isRequired,
|
|
11912
11950
|
onFocus: PropTypes.func,
|
|
11913
11951
|
onBlur: PropTypes.func,
|
|
11914
11952
|
placeholderTextColor: PropTypes.string,
|