bootstrap-rn 0.2.3 → 0.2.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.
@@ -4481,6 +4481,7 @@ var propTypes$1e = {
4481
4481
  };
4482
4482
  var styles$Y = reactNative.StyleSheet.create({
4483
4483
  reboot: {
4484
+ flexShrink: 0,
4484
4485
  margin: 0
4485
4486
  }
4486
4487
  }); // eslint-disable-next-line react/prop-types
@@ -4591,7 +4592,7 @@ var propTypes$1c = {
4591
4592
  /* eslint-enable */
4592
4593
 
4593
4594
  var styles$X = StyleSheet.create(_objectSpread2(_objectSpread2({
4594
- '.form-check .form-check-input': css(_templateObject$Y || (_templateObject$Y = _taggedTemplateLiteral(["\n // float: left;\n // margin-left: $form-check-padding-start * -1;\n margin-right: $form-check-padding-start - $form-check-input-width; // added for bootstrap-rn\n "]))),
4595
+ '.form-check .form-check-input': css(_templateObject$Y || (_templateObject$Y = _taggedTemplateLiteral(["\n $margin-top-double: $line-height-base - $form-check-input-width;\n\n // float: left;\n // margin-left: $form-check-padding-start * -1;\n margin-top: $margin-top-double * 0.5; // added for bootstrap-rn\n margin-right: $form-check-padding-start - $form-check-input-width; // added for bootstrap-rn\n "]))),
4595
4596
  '.form-check-reverse .form-check-input': css(_templateObject2$H || (_templateObject2$H = _taggedTemplateLiteral(["\n // float: right;\n // margin-right: $form-check-padding-start * -1;\n margin-right: 0; // added for bootstrap-rn\n // margin-left: 0;\n margin-left: $form-check-padding-start - $form-check-input-width; // added for bootstrap-rn\n "]))),
4596
4597
  '.form-check-input': css(_templateObject3$m || (_templateObject3$m = _taggedTemplateLiteral(["\n width: $form-check-input-width;\n height: $form-check-input-width;\n // margin-top: ($line-height-base - $form-check-input-width) * 0.5; // line-height minus check height\n // vertical-align: top;\n background-color: $form-check-input-bg;\n background-repeat: no-repeat;\n background-position: center;\n background-size: contain;\n border: $form-check-input-border;\n @include platform(web) {\n appearance: none;\n user-select: none; // added for bootstrap-rn\n color-adjust: exact; // Keep themed appearance for print\n }\n // @include transition($form-check-transition);\n\n &:active {\n // filter: $form-check-input-active-filter;\n }\n\n &:focus {\n border-color: $form-check-input-focus-border;\n @include platform(web) {\n outline-width: 0; // outline: 0;\n box-shadow: $form-check-input-focus-box-shadow;\n }\n }\n "]))),
4597
4598
  '.form-check-input[type="checkbox"]': css(_templateObject4$j || (_templateObject4$j = _taggedTemplateLiteral(["\n border-radius: $form-check-input-border-radius;\n "]))),
@@ -4882,7 +4883,7 @@ var styles$U = StyleSheet.create({
4882
4883
  });
4883
4884
  var initialState = {
4884
4885
  waitingForMouseUp: false,
4885
- isDialogClick: false
4886
+ ignoreBackdropClick: false
4886
4887
  };
4887
4888
 
4888
4889
  var BackdropHandler = function BackdropHandler(props) {
@@ -4909,24 +4910,25 @@ var BackdropHandler = function BackdropHandler(props) {
4909
4910
 
4910
4911
 
4911
4912
  var handleDialogMouseUp = function handleDialogMouseUp() {
4912
- state.isDialogClick = true;
4913
+ state.ignoreBackdropClick = true;
4913
4914
  };
4914
4915
 
4915
4916
  var handleDocumentClick = function handleDocumentClick(_ref) {
4916
4917
  var target = _ref.target;
4918
+ var isDialogClick = state.ignoreBackdropClick || dialog.contains(target);
4917
4919
 
4918
4920
  if (backdrop === 'static' || autoClose === false) {
4919
4921
  return;
4920
4922
  } // Click outside -> return if autoClose is inside.
4921
4923
 
4922
4924
 
4923
- if (!state.isDialogClick && autoClose === 'inside') {
4925
+ if (!isDialogClick && autoClose === 'inside') {
4924
4926
  return;
4925
4927
  } // Click inside / on dialog -> return if autoClose is outside.
4926
4928
 
4927
4929
 
4928
- if (state.isDialogClick) {
4929
- state.isDialogClick = false;
4930
+ if (isDialogClick) {
4931
+ state.ignoreBackdropClick = false;
4930
4932
 
4931
4933
  if (autoClose === 'outside') {
4932
4934
  return;
@@ -4943,7 +4945,7 @@ var BackdropHandler = function BackdropHandler(props) {
4943
4945
 
4944
4946
  var handleDocumentMouseUp = function handleDocumentMouseUp() {
4945
4947
  if (state.waitingForMouseUp) {
4946
- state.isDialogClick = true;
4948
+ state.ignoreBackdropClick = true;
4947
4949
  }
4948
4950
 
4949
4951
  state.waitingForMouseUp = false;
@@ -5139,7 +5141,7 @@ var styles$S = StyleSheet.create(_objectSpread2({
5139
5141
  }, each(FONT_SIZES, function (size, value) {
5140
5142
  return _defineProperty({}, ".h".concat(size), css(_templateObject2$E || (_templateObject2$E = _taggedTemplateLiteral(["\n font-size: ", ";\n line-height: ", " * $headings-line-height;\n "])), value, value));
5141
5143
  })));
5142
- var Heading$2 = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
5144
+ var Heading$1 = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
5143
5145
  var children = props.children,
5144
5146
  size = props.size,
5145
5147
  style = props.style,
@@ -5153,8 +5155,8 @@ var Heading$2 = /*#__PURE__*/React__default["default"].forwardRef(function (prop
5153
5155
  style: [classes, style]
5154
5156
  }), children);
5155
5157
  });
5156
- Heading$2.displayName = 'Heading';
5157
- Heading$2.propTypes = propTypes$15;
5158
+ Heading$1.displayName = 'Heading';
5159
+ Heading$1.propTypes = propTypes$15;
5158
5160
 
5159
5161
  var _excluded$13 = ["children", "style", "textStyle"];
5160
5162
 
@@ -5182,7 +5184,7 @@ var DropdownHeader = /*#__PURE__*/React__default["default"].forwardRef(function
5182
5184
  return /*#__PURE__*/React__default["default"].createElement(View, _extends({}, elementProps, {
5183
5185
  ref: ref,
5184
5186
  style: [classes, style]
5185
- }), /*#__PURE__*/React__default["default"].createElement(Heading$2, {
5187
+ }), /*#__PURE__*/React__default["default"].createElement(Heading$1, {
5186
5188
  size: 6,
5187
5189
  style: [textClasses, textStyle]
5188
5190
  }, children));
@@ -5407,7 +5409,7 @@ var DisplayHeading = /*#__PURE__*/React__default["default"].forwardRef(function
5407
5409
  elementProps = _objectWithoutProperties(props, _excluded$Z);
5408
5410
 
5409
5411
  var classes = getStyles(styles$M, [".display-".concat(size)]);
5410
- return /*#__PURE__*/React__default["default"].createElement(Heading$2, _extends({}, elementProps, {
5412
+ return /*#__PURE__*/React__default["default"].createElement(Heading$1, _extends({}, elementProps, {
5411
5413
  ref: ref,
5412
5414
  size: 1,
5413
5415
  style: [classes, style]
@@ -5450,7 +5452,7 @@ var propTypes$Z = {
5450
5452
  children: PropTypes__default["default"].node.isRequired,
5451
5453
  htmlFor: PropTypes__default["default"].string
5452
5454
  };
5453
- var Heading$1 = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
5455
+ var Label = /*#__PURE__*/React__default["default"].forwardRef(function (props, ref) {
5454
5456
  var children = props.children,
5455
5457
  htmlFor = props.htmlFor,
5456
5458
  elementProps = _objectWithoutProperties(props, _excluded$X); // Ref: https://github.com/necolas/react-native-web/issues/1651
@@ -5469,8 +5471,8 @@ var Heading$1 = /*#__PURE__*/React__default["default"].forwardRef(function (prop
5469
5471
  accessibilityRole: role
5470
5472
  }), children);
5471
5473
  });
5472
- Heading$1.displayName = 'Heading';
5473
- Heading$1.propTypes = propTypes$Z;
5474
+ Label.displayName = 'Label';
5475
+ Label.propTypes = propTypes$Z;
5474
5476
 
5475
5477
  var _excluded$W = ["children", "style", "textStyle"];
5476
5478
 
@@ -5484,7 +5486,7 @@ var propTypes$Y = {
5484
5486
  };
5485
5487
  var styles$K = StyleSheet.create(_objectSpread2({
5486
5488
  '.form-check-input:disabled ~ .form-check-label': css(_templateObject$L || (_templateObject$L = _taggedTemplateLiteral(["\n @include platform(web) {\n cursor: default;\n }\n opacity: $form-check-label-disabled-opacity;\n "]))),
5487
- '.form-check-label': css(_templateObject2$A || (_templateObject2$A = _taggedTemplateLiteral(["\n @include platform(web) {\n cursor: $form-check-label-cursor;\n }\n "]))),
5489
+ '.form-check-label': css(_templateObject2$A || (_templateObject2$A = _taggedTemplateLiteral(["\n flex-shrink: 1; // added for bootstrap-rn\n\n @include platform(web) {\n cursor: $form-check-label-cursor;\n }\n "]))),
5488
5490
  '.form-check-label --text': css(_templateObject3$i || (_templateObject3$i = _taggedTemplateLiteral(["\n color: $form-check-label-color;\n "])))
5489
5491
  }, each(FORM_VALIDATION_STATES, function (state, data) {
5490
5492
  return _defineProperty({}, ".form-check-input:".concat(state, " ~ .form-check-label --text"), css(_templateObject4$f || (_templateObject4$f = _taggedTemplateLiteral(["\n color: ", ";\n "])), function (t) {
@@ -5505,7 +5507,7 @@ var FormCheckLabel = /*#__PURE__*/React__default["default"].forwardRef(function
5505
5507
  var classes = getStyles(styles$K, [disabled && '.form-check-input:disabled ~ .form-check-label', '.form-check-label']);
5506
5508
  var textClasses = getStyles(styles$K, ['.form-check-label --text', // validation
5507
5509
  valid && '.form-check-input:valid ~ .form-check-label --text', invalid && '.form-check-input:invalid ~ .form-check-label --text']);
5508
- return /*#__PURE__*/React__default["default"].createElement(Heading$1, _extends({}, elementProps, {
5510
+ return /*#__PURE__*/React__default["default"].createElement(Label, _extends({}, elementProps, {
5509
5511
  ref: ref,
5510
5512
  disabled: disabled,
5511
5513
  style: [classes, style],
@@ -5528,7 +5530,7 @@ var propTypes$X = {
5528
5530
  style: PropTypes__default["default"].any
5529
5531
  };
5530
5532
  var styles$J = StyleSheet.create({
5531
- '.form-check': css(_templateObject$K || (_templateObject$K = _taggedTemplateLiteral(["\n // display: block;\n flex-direction: row; // added for bootstrap-rn\n align-items: center; // 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 "]))),
5533
+ '.form-check': css(_templateObject$K || (_templateObject$K = _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 "]))),
5532
5534
  '.form-check-reverse': css(_templateObject2$z || (_templateObject2$z = _taggedTemplateLiteral(["\n flex-direction: row-reverse; // added for bootstrap-rn\n // padding-right: $form-check-padding-start;\n // padding-left: 0;\n // text-align: right;\n "]))),
5533
5535
  '.form-switch.form-check': css(_templateObject3$h || (_templateObject3$h = _taggedTemplateLiteral(["\n // padding-left: $form-switch-padding-start;\n "])))
5534
5536
  });
@@ -5584,7 +5586,7 @@ var FormLabel = /*#__PURE__*/React__default["default"].forwardRef(function (prop
5584
5586
 
5585
5587
  var classes = getStyles(styles$I, ['.form-label']);
5586
5588
  var textClasses = getStyles(styles$I, ['.form-label --text']);
5587
- return /*#__PURE__*/React__default["default"].createElement(Heading$1, _extends({}, elementProps, {
5589
+ return /*#__PURE__*/React__default["default"].createElement(Label, _extends({}, elementProps, {
5588
5590
  ref: ref,
5589
5591
  style: [classes, style],
5590
5592
  textStyle: [textClasses, textStyle]
@@ -5745,7 +5747,7 @@ var Input = /*#__PURE__*/React__default["default"].forwardRef(function (props, r
5745
5747
  _modifierProps$editab = modifierProps.editable,
5746
5748
  editable = _modifierProps$editab === void 0 ? true : _modifierProps$editab,
5747
5749
  _modifierProps$select = modifierProps.selectTextOnFocus,
5748
- selectTextOnFocus = _modifierProps$select === void 0 ? true : _modifierProps$select,
5750
+ selectTextOnFocus = _modifierProps$select === void 0 ? false : _modifierProps$select,
5749
5751
  style = modifierProps.style,
5750
5752
  elementProps = _objectWithoutProperties(modifierProps, _excluded$R);
5751
5753
 
@@ -5755,8 +5757,8 @@ var Input = /*#__PURE__*/React__default["default"].forwardRef(function (props, r
5755
5757
  placeholderTextColor: placeholderTextColor,
5756
5758
  multiline: multiline,
5757
5759
  disabled: disabled,
5758
- editable: disabled ? !disabled : editable,
5759
- selectTextOnFocus: disabled ? !disabled : selectTextOnFocus,
5760
+ editable: disabled ? false : editable,
5761
+ selectTextOnFocus: disabled ? false : selectTextOnFocus,
5760
5762
  style: [classes, style]
5761
5763
  }));
5762
5764
  });
@@ -5978,7 +5980,7 @@ var PopoverHeader = /*#__PURE__*/React__default["default"].forwardRef(function (
5978
5980
  return /*#__PURE__*/React__default["default"].createElement(View, _extends({}, elementProps, {
5979
5981
  ref: ref,
5980
5982
  style: [classes, style]
5981
- }), /*#__PURE__*/React__default["default"].createElement(Heading$2, {
5983
+ }), /*#__PURE__*/React__default["default"].createElement(Heading$1, {
5982
5984
  size: 3,
5983
5985
  style: [textClasses, textStyle]
5984
5986
  }, children));
@@ -6844,7 +6846,7 @@ var ModalTitle = /*#__PURE__*/React__default["default"].forwardRef(function (pro
6844
6846
  elementProps = _objectWithoutProperties(props, _excluded$z);
6845
6847
 
6846
6848
  var classes = getStyles(styles$u, ['.modal-title']);
6847
- return /*#__PURE__*/React__default["default"].createElement(Heading$2, _extends({
6849
+ return /*#__PURE__*/React__default["default"].createElement(Heading$1, _extends({
6848
6850
  size: 5
6849
6851
  }, elementProps, {
6850
6852
  ref: ref,
@@ -7493,7 +7495,7 @@ var OffcanvasTitle = /*#__PURE__*/React__default["default"].forwardRef(function
7493
7495
  elementProps = _objectWithoutProperties(props, _excluded$l);
7494
7496
 
7495
7497
  var classes = getStyles(styles$i, ['.offcanvas-title']);
7496
- return /*#__PURE__*/React__default["default"].createElement(Heading$2, _extends({
7498
+ return /*#__PURE__*/React__default["default"].createElement(Heading$1, _extends({
7497
7499
  size: 5
7498
7500
  }, elementProps, {
7499
7501
  ref: ref,
@@ -7688,7 +7690,7 @@ var PickerWeb = /*#__PURE__*/React__default["default"].forwardRef(function (prop
7688
7690
  elementProps = _objectWithoutProperties(props, _excluded$i);
7689
7691
 
7690
7692
  var background = useBackground(style);
7691
- var showPlaceholder = placeholder && (selectedValue === undefined || selectedValue === null);
7693
+ var showPlaceholder = selectedValue === undefined || selectedValue === null;
7692
7694
  return /*#__PURE__*/React__default["default"].createElement(reactNative.Picker, _extends({}, elementProps, {
7693
7695
  ref: ref,
7694
7696
  selectedValue: showPlaceholder ? PLACEHOLDER : selectedValue,
@@ -7699,7 +7701,7 @@ var PickerWeb = /*#__PURE__*/React__default["default"].forwardRef(function (prop
7699
7701
  style: [background.style, showPlaceholder && {
7700
7702
  color: placeholderTextColor
7701
7703
  }]
7702
- }), placeholder && /*#__PURE__*/React__default["default"].createElement("option", {
7704
+ }), /*#__PURE__*/React__default["default"].createElement("option", {
7703
7705
  value: PLACEHOLDER,
7704
7706
  disabled: true,
7705
7707
  hidden: true
@@ -7814,7 +7816,7 @@ var PickerNative = /*#__PURE__*/React__default["default"].forwardRef(function (p
7814
7816
  setVisible = _useState2[1];
7815
7817
 
7816
7818
  var textStyle = extractTextStyles(background.style);
7817
- var showPlaceholder = placeholder && (selectedValue === undefined || selectedValue === null);
7819
+ var showPlaceholder = selectedValue === undefined || selectedValue === null;
7818
7820
 
7819
7821
  var handleValueChange = function handleValueChange(nextValue) {
7820
7822
  onValueChange(nextValue);
@@ -7840,7 +7842,7 @@ var PickerNative = /*#__PURE__*/React__default["default"].forwardRef(function (p
7840
7842
  style: [textStyle, showPlaceholder && {
7841
7843
  color: placeholderTextColor
7842
7844
  }]
7843
- }, showPlaceholder ? placeholder : getText({
7845
+ }, showPlaceholder ? placeholder || /*#__PURE__*/React__default["default"].createElement(Text, null, "\xA0") : getText({
7844
7846
  children: children,
7845
7847
  selectedValue: selectedValue
7846
7848
  }))), visible && /*#__PURE__*/React__default["default"].createElement(MenuComponent, {
@@ -8810,11 +8812,11 @@ exports.Feedback = Feedback;
8810
8812
  exports.FormCheck = FormCheck;
8811
8813
  exports.FormLabel = FormLabel;
8812
8814
  exports.FormText = FormText;
8813
- exports.Heading = Heading$2;
8815
+ exports.Heading = Heading$1;
8814
8816
  exports.Image = Image;
8815
8817
  exports.ImageBackground = ImageBackground;
8816
8818
  exports.Input = Input;
8817
- exports.Label = Heading$1;
8819
+ exports.Label = Label;
8818
8820
  exports.Link = Link;
8819
8821
  exports.ListGroup = ListGroup;
8820
8822
  exports.Modal = Modal;
@@ -4472,6 +4472,7 @@ var propTypes$1e = {
4472
4472
  };
4473
4473
  var styles$Y = StyleSheet$1.create({
4474
4474
  reboot: {
4475
+ flexShrink: 0,
4475
4476
  margin: 0
4476
4477
  }
4477
4478
  }); // eslint-disable-next-line react/prop-types
@@ -4582,7 +4583,7 @@ var propTypes$1c = {
4582
4583
  /* eslint-enable */
4583
4584
 
4584
4585
  var styles$X = StyleSheet.create(_objectSpread2(_objectSpread2({
4585
- '.form-check .form-check-input': css(_templateObject$Y || (_templateObject$Y = _taggedTemplateLiteral(["\n // float: left;\n // margin-left: $form-check-padding-start * -1;\n margin-right: $form-check-padding-start - $form-check-input-width; // added for bootstrap-rn\n "]))),
4586
+ '.form-check .form-check-input': css(_templateObject$Y || (_templateObject$Y = _taggedTemplateLiteral(["\n $margin-top-double: $line-height-base - $form-check-input-width;\n\n // float: left;\n // margin-left: $form-check-padding-start * -1;\n margin-top: $margin-top-double * 0.5; // added for bootstrap-rn\n margin-right: $form-check-padding-start - $form-check-input-width; // added for bootstrap-rn\n "]))),
4586
4587
  '.form-check-reverse .form-check-input': css(_templateObject2$H || (_templateObject2$H = _taggedTemplateLiteral(["\n // float: right;\n // margin-right: $form-check-padding-start * -1;\n margin-right: 0; // added for bootstrap-rn\n // margin-left: 0;\n margin-left: $form-check-padding-start - $form-check-input-width; // added for bootstrap-rn\n "]))),
4587
4588
  '.form-check-input': css(_templateObject3$m || (_templateObject3$m = _taggedTemplateLiteral(["\n width: $form-check-input-width;\n height: $form-check-input-width;\n // margin-top: ($line-height-base - $form-check-input-width) * 0.5; // line-height minus check height\n // vertical-align: top;\n background-color: $form-check-input-bg;\n background-repeat: no-repeat;\n background-position: center;\n background-size: contain;\n border: $form-check-input-border;\n @include platform(web) {\n appearance: none;\n user-select: none; // added for bootstrap-rn\n color-adjust: exact; // Keep themed appearance for print\n }\n // @include transition($form-check-transition);\n\n &:active {\n // filter: $form-check-input-active-filter;\n }\n\n &:focus {\n border-color: $form-check-input-focus-border;\n @include platform(web) {\n outline-width: 0; // outline: 0;\n box-shadow: $form-check-input-focus-box-shadow;\n }\n }\n "]))),
4588
4589
  '.form-check-input[type="checkbox"]': css(_templateObject4$j || (_templateObject4$j = _taggedTemplateLiteral(["\n border-radius: $form-check-input-border-radius;\n "]))),
@@ -4873,7 +4874,7 @@ var styles$U = StyleSheet.create({
4873
4874
  });
4874
4875
  var initialState = {
4875
4876
  waitingForMouseUp: false,
4876
- isDialogClick: false
4877
+ ignoreBackdropClick: false
4877
4878
  };
4878
4879
 
4879
4880
  var BackdropHandler = function BackdropHandler(props) {
@@ -4900,24 +4901,25 @@ var BackdropHandler = function BackdropHandler(props) {
4900
4901
 
4901
4902
 
4902
4903
  var handleDialogMouseUp = function handleDialogMouseUp() {
4903
- state.isDialogClick = true;
4904
+ state.ignoreBackdropClick = true;
4904
4905
  };
4905
4906
 
4906
4907
  var handleDocumentClick = function handleDocumentClick(_ref) {
4907
4908
  var target = _ref.target;
4909
+ var isDialogClick = state.ignoreBackdropClick || dialog.contains(target);
4908
4910
 
4909
4911
  if (backdrop === 'static' || autoClose === false) {
4910
4912
  return;
4911
4913
  } // Click outside -> return if autoClose is inside.
4912
4914
 
4913
4915
 
4914
- if (!state.isDialogClick && autoClose === 'inside') {
4916
+ if (!isDialogClick && autoClose === 'inside') {
4915
4917
  return;
4916
4918
  } // Click inside / on dialog -> return if autoClose is outside.
4917
4919
 
4918
4920
 
4919
- if (state.isDialogClick) {
4920
- state.isDialogClick = false;
4921
+ if (isDialogClick) {
4922
+ state.ignoreBackdropClick = false;
4921
4923
 
4922
4924
  if (autoClose === 'outside') {
4923
4925
  return;
@@ -4934,7 +4936,7 @@ var BackdropHandler = function BackdropHandler(props) {
4934
4936
 
4935
4937
  var handleDocumentMouseUp = function handleDocumentMouseUp() {
4936
4938
  if (state.waitingForMouseUp) {
4937
- state.isDialogClick = true;
4939
+ state.ignoreBackdropClick = true;
4938
4940
  }
4939
4941
 
4940
4942
  state.waitingForMouseUp = false;
@@ -5130,7 +5132,7 @@ var styles$S = StyleSheet.create(_objectSpread2({
5130
5132
  }, each(FONT_SIZES, function (size, value) {
5131
5133
  return _defineProperty({}, ".h".concat(size), css(_templateObject2$E || (_templateObject2$E = _taggedTemplateLiteral(["\n font-size: ", ";\n line-height: ", " * $headings-line-height;\n "])), value, value));
5132
5134
  })));
5133
- var Heading$2 = /*#__PURE__*/React.forwardRef(function (props, ref) {
5135
+ var Heading$1 = /*#__PURE__*/React.forwardRef(function (props, ref) {
5134
5136
  var children = props.children,
5135
5137
  size = props.size,
5136
5138
  style = props.style,
@@ -5144,8 +5146,8 @@ var Heading$2 = /*#__PURE__*/React.forwardRef(function (props, ref) {
5144
5146
  style: [classes, style]
5145
5147
  }), children);
5146
5148
  });
5147
- Heading$2.displayName = 'Heading';
5148
- Heading$2.propTypes = propTypes$15;
5149
+ Heading$1.displayName = 'Heading';
5150
+ Heading$1.propTypes = propTypes$15;
5149
5151
 
5150
5152
  var _excluded$13 = ["children", "style", "textStyle"];
5151
5153
 
@@ -5173,7 +5175,7 @@ var DropdownHeader = /*#__PURE__*/React.forwardRef(function (props, ref) {
5173
5175
  return /*#__PURE__*/React.createElement(View, _extends({}, elementProps, {
5174
5176
  ref: ref,
5175
5177
  style: [classes, style]
5176
- }), /*#__PURE__*/React.createElement(Heading$2, {
5178
+ }), /*#__PURE__*/React.createElement(Heading$1, {
5177
5179
  size: 6,
5178
5180
  style: [textClasses, textStyle]
5179
5181
  }, children));
@@ -5398,7 +5400,7 @@ var DisplayHeading = /*#__PURE__*/React.forwardRef(function (props, ref) {
5398
5400
  elementProps = _objectWithoutProperties(props, _excluded$Z);
5399
5401
 
5400
5402
  var classes = getStyles(styles$M, [".display-".concat(size)]);
5401
- return /*#__PURE__*/React.createElement(Heading$2, _extends({}, elementProps, {
5403
+ return /*#__PURE__*/React.createElement(Heading$1, _extends({}, elementProps, {
5402
5404
  ref: ref,
5403
5405
  size: 1,
5404
5406
  style: [classes, style]
@@ -5441,7 +5443,7 @@ var propTypes$Z = {
5441
5443
  children: PropTypes.node.isRequired,
5442
5444
  htmlFor: PropTypes.string
5443
5445
  };
5444
- var Heading$1 = /*#__PURE__*/React.forwardRef(function (props, ref) {
5446
+ var Label = /*#__PURE__*/React.forwardRef(function (props, ref) {
5445
5447
  var children = props.children,
5446
5448
  htmlFor = props.htmlFor,
5447
5449
  elementProps = _objectWithoutProperties(props, _excluded$X); // Ref: https://github.com/necolas/react-native-web/issues/1651
@@ -5460,8 +5462,8 @@ var Heading$1 = /*#__PURE__*/React.forwardRef(function (props, ref) {
5460
5462
  accessibilityRole: role
5461
5463
  }), children);
5462
5464
  });
5463
- Heading$1.displayName = 'Heading';
5464
- Heading$1.propTypes = propTypes$Z;
5465
+ Label.displayName = 'Label';
5466
+ Label.propTypes = propTypes$Z;
5465
5467
 
5466
5468
  var _excluded$W = ["children", "style", "textStyle"];
5467
5469
 
@@ -5475,7 +5477,7 @@ var propTypes$Y = {
5475
5477
  };
5476
5478
  var styles$K = StyleSheet.create(_objectSpread2({
5477
5479
  '.form-check-input:disabled ~ .form-check-label': css(_templateObject$L || (_templateObject$L = _taggedTemplateLiteral(["\n @include platform(web) {\n cursor: default;\n }\n opacity: $form-check-label-disabled-opacity;\n "]))),
5478
- '.form-check-label': css(_templateObject2$A || (_templateObject2$A = _taggedTemplateLiteral(["\n @include platform(web) {\n cursor: $form-check-label-cursor;\n }\n "]))),
5480
+ '.form-check-label': css(_templateObject2$A || (_templateObject2$A = _taggedTemplateLiteral(["\n flex-shrink: 1; // added for bootstrap-rn\n\n @include platform(web) {\n cursor: $form-check-label-cursor;\n }\n "]))),
5479
5481
  '.form-check-label --text': css(_templateObject3$i || (_templateObject3$i = _taggedTemplateLiteral(["\n color: $form-check-label-color;\n "])))
5480
5482
  }, each(FORM_VALIDATION_STATES, function (state, data) {
5481
5483
  return _defineProperty({}, ".form-check-input:".concat(state, " ~ .form-check-label --text"), css(_templateObject4$f || (_templateObject4$f = _taggedTemplateLiteral(["\n color: ", ";\n "])), function (t) {
@@ -5496,7 +5498,7 @@ var FormCheckLabel = /*#__PURE__*/React.forwardRef(function (props, ref) {
5496
5498
  var classes = getStyles(styles$K, [disabled && '.form-check-input:disabled ~ .form-check-label', '.form-check-label']);
5497
5499
  var textClasses = getStyles(styles$K, ['.form-check-label --text', // validation
5498
5500
  valid && '.form-check-input:valid ~ .form-check-label --text', invalid && '.form-check-input:invalid ~ .form-check-label --text']);
5499
- return /*#__PURE__*/React.createElement(Heading$1, _extends({}, elementProps, {
5501
+ return /*#__PURE__*/React.createElement(Label, _extends({}, elementProps, {
5500
5502
  ref: ref,
5501
5503
  disabled: disabled,
5502
5504
  style: [classes, style],
@@ -5519,7 +5521,7 @@ var propTypes$X = {
5519
5521
  style: PropTypes.any
5520
5522
  };
5521
5523
  var styles$J = StyleSheet.create({
5522
- '.form-check': css(_templateObject$K || (_templateObject$K = _taggedTemplateLiteral(["\n // display: block;\n flex-direction: row; // added for bootstrap-rn\n align-items: center; // 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 "]))),
5524
+ '.form-check': css(_templateObject$K || (_templateObject$K = _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 "]))),
5523
5525
  '.form-check-reverse': css(_templateObject2$z || (_templateObject2$z = _taggedTemplateLiteral(["\n flex-direction: row-reverse; // added for bootstrap-rn\n // padding-right: $form-check-padding-start;\n // padding-left: 0;\n // text-align: right;\n "]))),
5524
5526
  '.form-switch.form-check': css(_templateObject3$h || (_templateObject3$h = _taggedTemplateLiteral(["\n // padding-left: $form-switch-padding-start;\n "])))
5525
5527
  });
@@ -5575,7 +5577,7 @@ var FormLabel = /*#__PURE__*/React.forwardRef(function (props, ref) {
5575
5577
 
5576
5578
  var classes = getStyles(styles$I, ['.form-label']);
5577
5579
  var textClasses = getStyles(styles$I, ['.form-label --text']);
5578
- return /*#__PURE__*/React.createElement(Heading$1, _extends({}, elementProps, {
5580
+ return /*#__PURE__*/React.createElement(Label, _extends({}, elementProps, {
5579
5581
  ref: ref,
5580
5582
  style: [classes, style],
5581
5583
  textStyle: [textClasses, textStyle]
@@ -5736,7 +5738,7 @@ var Input = /*#__PURE__*/React.forwardRef(function (props, ref) {
5736
5738
  _modifierProps$editab = modifierProps.editable,
5737
5739
  editable = _modifierProps$editab === void 0 ? true : _modifierProps$editab,
5738
5740
  _modifierProps$select = modifierProps.selectTextOnFocus,
5739
- selectTextOnFocus = _modifierProps$select === void 0 ? true : _modifierProps$select,
5741
+ selectTextOnFocus = _modifierProps$select === void 0 ? false : _modifierProps$select,
5740
5742
  style = modifierProps.style,
5741
5743
  elementProps = _objectWithoutProperties(modifierProps, _excluded$R);
5742
5744
 
@@ -5746,8 +5748,8 @@ var Input = /*#__PURE__*/React.forwardRef(function (props, ref) {
5746
5748
  placeholderTextColor: placeholderTextColor,
5747
5749
  multiline: multiline,
5748
5750
  disabled: disabled,
5749
- editable: disabled ? !disabled : editable,
5750
- selectTextOnFocus: disabled ? !disabled : selectTextOnFocus,
5751
+ editable: disabled ? false : editable,
5752
+ selectTextOnFocus: disabled ? false : selectTextOnFocus,
5751
5753
  style: [classes, style]
5752
5754
  }));
5753
5755
  });
@@ -5969,7 +5971,7 @@ var PopoverHeader = /*#__PURE__*/React.forwardRef(function (props, ref) {
5969
5971
  return /*#__PURE__*/React.createElement(View, _extends({}, elementProps, {
5970
5972
  ref: ref,
5971
5973
  style: [classes, style]
5972
- }), /*#__PURE__*/React.createElement(Heading$2, {
5974
+ }), /*#__PURE__*/React.createElement(Heading$1, {
5973
5975
  size: 3,
5974
5976
  style: [textClasses, textStyle]
5975
5977
  }, children));
@@ -6835,7 +6837,7 @@ var ModalTitle = /*#__PURE__*/React.forwardRef(function (props, ref) {
6835
6837
  elementProps = _objectWithoutProperties(props, _excluded$z);
6836
6838
 
6837
6839
  var classes = getStyles(styles$u, ['.modal-title']);
6838
- return /*#__PURE__*/React.createElement(Heading$2, _extends({
6840
+ return /*#__PURE__*/React.createElement(Heading$1, _extends({
6839
6841
  size: 5
6840
6842
  }, elementProps, {
6841
6843
  ref: ref,
@@ -7484,7 +7486,7 @@ var OffcanvasTitle = /*#__PURE__*/React.forwardRef(function (props, ref) {
7484
7486
  elementProps = _objectWithoutProperties(props, _excluded$l);
7485
7487
 
7486
7488
  var classes = getStyles(styles$i, ['.offcanvas-title']);
7487
- return /*#__PURE__*/React.createElement(Heading$2, _extends({
7489
+ return /*#__PURE__*/React.createElement(Heading$1, _extends({
7488
7490
  size: 5
7489
7491
  }, elementProps, {
7490
7492
  ref: ref,
@@ -7679,7 +7681,7 @@ var PickerWeb = /*#__PURE__*/React.forwardRef(function (props, ref) {
7679
7681
  elementProps = _objectWithoutProperties(props, _excluded$i);
7680
7682
 
7681
7683
  var background = useBackground(style);
7682
- var showPlaceholder = placeholder && (selectedValue === undefined || selectedValue === null);
7684
+ var showPlaceholder = selectedValue === undefined || selectedValue === null;
7683
7685
  return /*#__PURE__*/React.createElement(Picker$1, _extends({}, elementProps, {
7684
7686
  ref: ref,
7685
7687
  selectedValue: showPlaceholder ? PLACEHOLDER : selectedValue,
@@ -7690,7 +7692,7 @@ var PickerWeb = /*#__PURE__*/React.forwardRef(function (props, ref) {
7690
7692
  style: [background.style, showPlaceholder && {
7691
7693
  color: placeholderTextColor
7692
7694
  }]
7693
- }), placeholder && /*#__PURE__*/React.createElement("option", {
7695
+ }), /*#__PURE__*/React.createElement("option", {
7694
7696
  value: PLACEHOLDER,
7695
7697
  disabled: true,
7696
7698
  hidden: true
@@ -7805,7 +7807,7 @@ var PickerNative = /*#__PURE__*/React.forwardRef(function (props, ref) {
7805
7807
  setVisible = _useState2[1];
7806
7808
 
7807
7809
  var textStyle = extractTextStyles(background.style);
7808
- var showPlaceholder = placeholder && (selectedValue === undefined || selectedValue === null);
7810
+ var showPlaceholder = selectedValue === undefined || selectedValue === null;
7809
7811
 
7810
7812
  var handleValueChange = function handleValueChange(nextValue) {
7811
7813
  onValueChange(nextValue);
@@ -7831,7 +7833,7 @@ var PickerNative = /*#__PURE__*/React.forwardRef(function (props, ref) {
7831
7833
  style: [textStyle, showPlaceholder && {
7832
7834
  color: placeholderTextColor
7833
7835
  }]
7834
- }, showPlaceholder ? placeholder : getText({
7836
+ }, showPlaceholder ? placeholder || /*#__PURE__*/React.createElement(Text, null, "\xA0") : getText({
7835
7837
  children: children,
7836
7838
  selectedValue: selectedValue
7837
7839
  }))), visible && /*#__PURE__*/React.createElement(MenuComponent, {
@@ -8775,4 +8777,4 @@ function useFixedElement() {
8775
8777
  return ref;
8776
8778
  }
8777
8779
 
8778
- export { Alert, Badge, Blockquote, Body, Breadcrumb, Button, ButtonGroup, ButtonToolbar, Card, Checkbox, CloseButton, Code, Col, Collapse, Container, Context, DisplayHeading, Dropdown, Feedback, FormCheck, FormLabel, FormText, Heading$2 as Heading, Image, ImageBackground, Input, Heading$1 as Label, Link, ListGroup, Modal, Nav, Navbar, Offcanvas, Pagination, Heading as Paragraph, Picker, Placeholders, Popover, Pressable, Progress, Provider, Radio, Row, ScrollView, Spinner, StyleSheet, Switch, Tab, Text, TextInput, Toast, ToastContainer, Tooltip, View, add, colorContrast, css, divide, escapeSvg, fn, injectPopover, injectTooltip, makeTheme, makeUtilities, shadeColor, shiftColor, subtract, tintColor, useFixedElement, useMedia, useStyle };
8780
+ export { Alert, Badge, Blockquote, Body, Breadcrumb, Button, ButtonGroup, ButtonToolbar, Card, Checkbox, CloseButton, Code, Col, Collapse, Container, Context, DisplayHeading, Dropdown, Feedback, FormCheck, FormLabel, FormText, Heading$1 as Heading, Image, ImageBackground, Input, Label, Link, ListGroup, Modal, Nav, Navbar, Offcanvas, Pagination, Heading as Paragraph, Picker, Placeholders, Popover, Pressable, Progress, Provider, Radio, Row, ScrollView, Spinner, StyleSheet, Switch, Tab, Text, TextInput, Toast, ToastContainer, Tooltip, View, add, colorContrast, css, divide, escapeSvg, fn, injectPopover, injectTooltip, makeTheme, makeUtilities, shadeColor, shiftColor, subtract, tintColor, useFixedElement, useMedia, useStyle };