@zendeskgarden/react-forms 9.0.0-next.6 → 9.0.0-next.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/index.cjs.js +47 -47
  2. package/dist/index.esm.js +47 -47
  3. package/package.json +4 -4
package/dist/index.cjs.js CHANGED
@@ -64,7 +64,7 @@ const useFieldContext = () => {
64
64
  const COMPONENT_ID$G = 'forms.field';
65
65
  const StyledField = styled__default.default.div.attrs({
66
66
  'data-garden-id': COMPONENT_ID$G,
67
- 'data-garden-version': '9.0.0-next.6'
67
+ 'data-garden-version': '9.0.0-next.7'
68
68
  }).withConfig({
69
69
  displayName: "StyledField",
70
70
  componentId: "sc-12gzfsu-0"
@@ -77,7 +77,7 @@ const COMPONENT_ID$F = 'forms.fieldset';
77
77
  const StyledFieldset = styled__default.default(StyledField).attrs({
78
78
  as: 'fieldset',
79
79
  'data-garden-id': COMPONENT_ID$F,
80
- 'data-garden-version': '9.0.0-next.6'
80
+ 'data-garden-version': '9.0.0-next.7'
81
81
  }).withConfig({
82
82
  displayName: "StyledFieldset",
83
83
  componentId: "sc-1vr4mxv-0"
@@ -89,7 +89,7 @@ StyledFieldset.defaultProps = {
89
89
  const COMPONENT_ID$E = 'forms.input_label';
90
90
  const StyledLabel = styled__default.default.label.attrs(props => ({
91
91
  'data-garden-id': props['data-garden-id'] || COMPONENT_ID$E,
92
- 'data-garden-version': props['data-garden-version'] || '9.0.0-next.6'
92
+ 'data-garden-version': props['data-garden-version'] || '9.0.0-next.7'
93
93
  })).withConfig({
94
94
  displayName: "StyledLabel",
95
95
  componentId: "sc-2utmsz-0"
@@ -102,7 +102,7 @@ const COMPONENT_ID$D = 'forms.fieldset_legend';
102
102
  const StyledLegend = styled__default.default(StyledLabel).attrs({
103
103
  as: 'legend',
104
104
  'data-garden-id': COMPONENT_ID$D,
105
- 'data-garden-version': '9.0.0-next.6'
105
+ 'data-garden-version': '9.0.0-next.7'
106
106
  }).withConfig({
107
107
  displayName: "StyledLegend",
108
108
  componentId: "sc-6s0zwq-0"
@@ -114,7 +114,7 @@ StyledLegend.defaultProps = {
114
114
  const COMPONENT_ID$C = 'forms.input_hint';
115
115
  const StyledHint = styled__default.default.div.attrs(props => ({
116
116
  'data-garden-id': props['data-garden-id'] || COMPONENT_ID$C,
117
- 'data-garden-version': props['data-garden-version'] || '9.0.0-next.6'
117
+ 'data-garden-version': props['data-garden-version'] || '9.0.0-next.7'
118
118
  })).withConfig({
119
119
  displayName: "StyledHint",
120
120
  componentId: "sc-17c2wu8-0"
@@ -219,7 +219,7 @@ const MessageIcon = _ref => {
219
219
  const COMPONENT_ID$B = 'forms.input_message_icon';
220
220
  const StyledMessageIcon = styled__default.default(MessageIcon).attrs({
221
221
  'data-garden-id': COMPONENT_ID$B,
222
- 'data-garden-version': '9.0.0-next.6',
222
+ 'data-garden-version': '9.0.0-next.7',
223
223
  'aria-hidden': null
224
224
  }).withConfig({
225
225
  displayName: "StyledMessageIcon",
@@ -247,7 +247,7 @@ const validationStyles = props => {
247
247
  const COMPONENT_ID$A = 'forms.input_message';
248
248
  const StyledMessage = styled__default.default.div.attrs(props => ({
249
249
  'data-garden-id': props['data-garden-id'] || COMPONENT_ID$A,
250
- 'data-garden-version': props['data-garden-version'] || '9.0.0-next.6'
250
+ 'data-garden-version': props['data-garden-version'] || '9.0.0-next.7'
251
251
  })).withConfig({
252
252
  displayName: "StyledMessage",
253
253
  componentId: "sc-30hgg7-0"
@@ -337,7 +337,7 @@ const sizeStyles$c = props => {
337
337
  };
338
338
  const StyledTextInput = styled__default.default.input.attrs(props => ({
339
339
  'data-garden-id': COMPONENT_ID$z,
340
- 'data-garden-version': '9.0.0-next.6',
340
+ 'data-garden-version': '9.0.0-next.7',
341
341
  'aria-invalid': isInvalid(props.validation)
342
342
  })).withConfig({
343
343
  displayName: "StyledTextInput",
@@ -360,7 +360,7 @@ const hiddenStyles = `
360
360
  const StyledTextarea = styled__default.default(StyledTextInput).attrs({
361
361
  as: 'textarea',
362
362
  'data-garden-id': COMPONENT_ID$y,
363
- 'data-garden-version': '9.0.0-next.6'
363
+ 'data-garden-version': '9.0.0-next.7'
364
364
  }).withConfig({
365
365
  displayName: "StyledTextarea",
366
366
  componentId: "sc-wxschl-0"
@@ -406,7 +406,7 @@ _ref => {
406
406
  return React__namespace.default.cloneElement(React.Children.only(children), props);
407
407
  }).attrs({
408
408
  'data-garden-id': COMPONENT_ID$x,
409
- 'data-garden-version': '9.0.0-next.6'
409
+ 'data-garden-version': '9.0.0-next.7'
410
410
  }).withConfig({
411
411
  displayName: "StyledTextMediaFigure",
412
412
  componentId: "sc-1qepknj-0"
@@ -453,7 +453,7 @@ const StyledTextFauxInput = styled__default.default(StyledTextInput).attrs(props
453
453
  'aria-readonly': props.isReadOnly,
454
454
  'aria-disabled': props.isDisabled,
455
455
  'data-garden-id': COMPONENT_ID$w,
456
- 'data-garden-version': '9.0.0-next.6'
456
+ 'data-garden-version': '9.0.0-next.7'
457
457
  })).withConfig({
458
458
  displayName: "StyledTextFauxInput",
459
459
  componentId: "sc-yqw7j9-0"
@@ -465,7 +465,7 @@ StyledTextFauxInput.defaultProps = {
465
465
  const COMPONENT_ID$v = 'forms.media_input';
466
466
  const StyledTextMediaInput = styled__default.default(StyledTextInput).attrs({
467
467
  'data-garden-id': COMPONENT_ID$v,
468
- 'data-garden-version': '9.0.0-next.6',
468
+ 'data-garden-version': '9.0.0-next.7',
469
469
  isBare: true
470
470
  }).withConfig({
471
471
  displayName: "StyledTextMediaInput",
@@ -483,11 +483,11 @@ const positionStyles = props => {
483
483
  const itemStyles = props => {
484
484
  const startDirection = props.theme.rtl ? 'right' : 'left';
485
485
  const endDirection = props.theme.rtl ? 'left' : 'right';
486
- return styled.css(["& > *{z-index:-1;}& > ", "{z-index:0;}& > ", ":disabled{z-index:-2;}& > ", ":hover,& > button:hover,& > ", ":focus-visible,& > button:focus-visible,& > ", "[data-garden-focus-visible],& > button[data-garden-focus-visible],& > ", ":active,& > button:active{z-index:1;}& > button:disabled{border-top-width:0;border-bottom-width:0;}& > *:not(:first-child){margin-", ":-", ";}& > *:first-child:not(:last-child){border-top-", "-radius:0;border-bottom-", "-radius:0;}& > *:last-child:not(:first-child){border-top-", "-radius:0;border-bottom-", "-radius:0;}& > *:not(:first-child):not(:last-child){border-radius:0;}"], StyledTextInput, StyledTextInput, StyledTextInput, StyledTextInput, StyledTextInput, StyledTextInput, startDirection, props.theme.borderWidths.sm, endDirection, endDirection, startDirection, startDirection);
486
+ return styled.css(["& > *{z-index:-1;}& > ", "{z-index:0;}& > ", ":disabled{z-index:-2;}& > ", ":hover,& > button:hover,& > ", ":focus-visible,& > button:focus-visible,& > ", ":active,& > button:active,& > button[aria-pressed='true'],& > button[aria-pressed='mixed']{z-index:1;}& > button:disabled{border-top-width:0;border-bottom-width:0;}& > *:not(:first-child){margin-", ":-", ";}& > *:first-child:not(:last-child){border-top-", "-radius:0;border-bottom-", "-radius:0;}& > *:last-child:not(:first-child){border-top-", "-radius:0;border-bottom-", "-radius:0;}& > *:not(:first-child):not(:last-child){border-radius:0;}"], StyledTextInput, StyledTextInput, StyledTextInput, StyledTextInput, StyledTextInput, startDirection, props.theme.borderWidths.sm, endDirection, endDirection, startDirection, startDirection);
487
487
  };
488
488
  const StyledInputGroup = styled__default.default.div.attrs({
489
489
  'data-garden-id': COMPONENT_ID$u,
490
- 'data-garden-version': '9.0.0-next.6'
490
+ 'data-garden-version': '9.0.0-next.7'
491
491
  }).withConfig({
492
492
  displayName: "StyledInputGroup",
493
493
  componentId: "sc-kjh1f0-0"
@@ -505,7 +505,7 @@ const sizeStyles$a = props => {
505
505
  };
506
506
  const StyledRadioLabel = styled__default.default(StyledLabel).attrs({
507
507
  'data-garden-id': COMPONENT_ID$t,
508
- 'data-garden-version': '9.0.0-next.6',
508
+ 'data-garden-version': '9.0.0-next.7',
509
509
  isRadio: true
510
510
  }).withConfig({
511
511
  displayName: "StyledRadioLabel",
@@ -518,7 +518,7 @@ StyledRadioLabel.defaultProps = {
518
518
  const COMPONENT_ID$s = 'forms.checkbox_label';
519
519
  const StyledCheckLabel = styled__default.default(StyledRadioLabel).attrs({
520
520
  'data-garden-id': COMPONENT_ID$s,
521
- 'data-garden-version': '9.0.0-next.6'
521
+ 'data-garden-version': '9.0.0-next.7'
522
522
  }).withConfig({
523
523
  displayName: "StyledCheckLabel",
524
524
  componentId: "sc-x7nr1-0"
@@ -530,7 +530,7 @@ StyledCheckLabel.defaultProps = {
530
530
  const COMPONENT_ID$r = 'forms.radio_hint';
531
531
  const StyledRadioHint = styled__default.default(StyledHint).attrs({
532
532
  'data-garden-id': COMPONENT_ID$r,
533
- 'data-garden-version': '9.0.0-next.6'
533
+ 'data-garden-version': '9.0.0-next.7'
534
534
  }).withConfig({
535
535
  displayName: "StyledRadioHint",
536
536
  componentId: "sc-eo8twg-0"
@@ -542,7 +542,7 @@ StyledRadioHint.defaultProps = {
542
542
  const COMPONENT_ID$q = 'forms.checkbox_hint';
543
543
  const StyledCheckHint = styled__default.default(StyledRadioHint).attrs({
544
544
  'data-garden-id': COMPONENT_ID$q,
545
- 'data-garden-version': '9.0.0-next.6'
545
+ 'data-garden-version': '9.0.0-next.7'
546
546
  }).withConfig({
547
547
  displayName: "StyledCheckHint",
548
548
  componentId: "sc-1kl8e8c-0"
@@ -574,7 +574,7 @@ const colorStyles$7 = props => {
574
574
  styles: {
575
575
  borderColor: focusBorderColor
576
576
  },
577
- selector: `&:focus-visible ~ ${StyledRadioLabel}::before, &[data-garden-focus-visible='true'] ~ ${StyledRadioLabel}::before`
577
+ selector: `&:focus-visible ~ ${StyledRadioLabel}::before`
578
578
  }), StyledRadioLabel, activeBorderColor, activeBackgroundColor, StyledRadioLabel, checkedBorderColor, checkedBackgroundColor, StyledRadioLabel, checkedHoverBorderColor, checkedHoverBackgroundColor, StyledRadioLabel, checkedActiveBorderColor, checkedActiveBackgroundColor, StyledRadioLabel, disabledBackgroundColor);
579
579
  };
580
580
  const sizeStyles$9 = props => {
@@ -589,7 +589,7 @@ const sizeStyles$9 = props => {
589
589
  };
590
590
  const StyledRadioInput = styled__default.default.input.attrs({
591
591
  'data-garden-id': COMPONENT_ID$p,
592
- 'data-garden-version': '9.0.0-next.6',
592
+ 'data-garden-version': '9.0.0-next.7',
593
593
  type: 'radio'
594
594
  }).withConfig({
595
595
  displayName: "StyledRadioInput",
@@ -611,7 +611,7 @@ const colorStyles$6 = props => {
611
611
  };
612
612
  const StyledCheckInput = styled__default.default(StyledRadioInput).attrs({
613
613
  'data-garden-id': COMPONENT_ID$o,
614
- 'data-garden-version': '9.0.0-next.6',
614
+ 'data-garden-version': '9.0.0-next.7',
615
615
  type: 'checkbox'
616
616
  }).withConfig({
617
617
  displayName: "StyledCheckInput",
@@ -624,7 +624,7 @@ StyledCheckInput.defaultProps = {
624
624
  const COMPONENT_ID$n = 'forms.radio_message';
625
625
  const StyledRadioMessage = styled__default.default(StyledMessage).attrs({
626
626
  'data-garden-id': COMPONENT_ID$n,
627
- 'data-garden-version': '9.0.0-next.6'
627
+ 'data-garden-version': '9.0.0-next.7'
628
628
  }).withConfig({
629
629
  displayName: "StyledRadioMessage",
630
630
  componentId: "sc-1pmi0q8-0"
@@ -636,7 +636,7 @@ StyledRadioMessage.defaultProps = {
636
636
  const COMPONENT_ID$m = 'forms.checkbox_message';
637
637
  const StyledCheckMessage = styled__default.default(StyledRadioMessage).attrs({
638
638
  'data-garden-id': COMPONENT_ID$m,
639
- 'data-garden-version': '9.0.0-next.6'
639
+ 'data-garden-version': '9.0.0-next.7'
640
640
  }).withConfig({
641
641
  displayName: "StyledCheckMessage",
642
642
  componentId: "sc-s4p6kd-0"
@@ -668,7 +668,7 @@ var SvgCheckSmFill = function SvgCheckSmFill(props) {
668
668
  const COMPONENT_ID$l = 'forms.check_svg';
669
669
  const StyledCheckSvg = styled__default.default(SvgCheckSmFill).attrs({
670
670
  'data-garden-id': COMPONENT_ID$l,
671
- 'data-garden-version': '9.0.0-next.6'
671
+ 'data-garden-version': '9.0.0-next.7'
672
672
  }).withConfig({
673
673
  displayName: "StyledCheckSvg",
674
674
  componentId: "sc-fvxetk-0"
@@ -698,7 +698,7 @@ var SvgDashFill = function SvgDashFill(props) {
698
698
  const COMPONENT_ID$k = 'forms.dash_svg';
699
699
  const StyledDashSvg = styled__default.default(SvgDashFill).attrs({
700
700
  'data-garden-id': COMPONENT_ID$k,
701
- 'data-garden-version': '9.0.0-next.6'
701
+ 'data-garden-version': '9.0.0-next.7'
702
702
  }).withConfig({
703
703
  displayName: "StyledDashSvg",
704
704
  componentId: "sc-z3vq71-0"
@@ -729,7 +729,7 @@ const sizeStyles$8 = props => {
729
729
  };
730
730
  const StyledFileUpload = styled__default.default.div.attrs({
731
731
  'data-garden-id': COMPONENT_ID$j,
732
- 'data-garden-version': '9.0.0-next.6'
732
+ 'data-garden-version': '9.0.0-next.7'
733
733
  }).withConfig({
734
734
  displayName: "StyledFileUpload",
735
735
  componentId: "sc-1rodjgn-0"
@@ -741,7 +741,7 @@ StyledFileUpload.defaultProps = {
741
741
  const COMPONENT_ID$i = 'forms.file.close';
742
742
  const StyledFileClose = styled__default.default.button.attrs({
743
743
  'data-garden-id': COMPONENT_ID$i,
744
- 'data-garden-version': '9.0.0-next.6'
744
+ 'data-garden-version': '9.0.0-next.7'
745
745
  }).withConfig({
746
746
  displayName: "StyledFileClose",
747
747
  componentId: "sc-1m31jbf-0"
@@ -804,7 +804,7 @@ const sizeStyles$7 = props => {
804
804
  };
805
805
  const StyledFile = styled__default.default.div.attrs({
806
806
  'data-garden-id': COMPONENT_ID$h,
807
- 'data-garden-version': '9.0.0-next.6'
807
+ 'data-garden-version': '9.0.0-next.7'
808
808
  }).withConfig({
809
809
  displayName: "StyledFile",
810
810
  componentId: "sc-195lzp1-0"
@@ -816,7 +816,7 @@ StyledFile.defaultProps = {
816
816
  const COMPONENT_ID$g = 'forms.file.delete';
817
817
  const StyledFileDelete = styled__default.default(StyledFileClose).attrs({
818
818
  'data-garden-id': COMPONENT_ID$g,
819
- 'data-garden-version': '9.0.0-next.6'
819
+ 'data-garden-version': '9.0.0-next.7'
820
820
  }).withConfig({
821
821
  displayName: "StyledFileDelete",
822
822
  componentId: "sc-a8nnhx-0"
@@ -836,7 +836,7 @@ const StyledFileIcon = styled__default.default(_ref => {
836
836
  return React__namespace.default.cloneElement(React.Children.only(children), props);
837
837
  }).attrs({
838
838
  'data-garden-id': COMPONENT_ID$f,
839
- 'data-garden-version': '9.0.0-next.6'
839
+ 'data-garden-version': '9.0.0-next.7'
840
840
  }).withConfig({
841
841
  displayName: "StyledFileIcon",
842
842
  componentId: "sc-7b3q0c-0"
@@ -848,7 +848,7 @@ StyledFileIcon.defaultProps = {
848
848
  const COMPONENT_ID$e = 'forms.file_list';
849
849
  const StyledFileList = styled__default.default.ul.attrs({
850
850
  'data-garden-id': COMPONENT_ID$e,
851
- 'data-garden-version': '9.0.0-next.6'
851
+ 'data-garden-version': '9.0.0-next.7'
852
852
  }).withConfig({
853
853
  displayName: "StyledFileList",
854
854
  componentId: "sc-gbahjg-0"
@@ -860,7 +860,7 @@ StyledFileList.defaultProps = {
860
860
  const COMPONENT_ID$d = 'forms.file_list.item';
861
861
  const StyledFileListItem = styled__default.default.li.attrs({
862
862
  'data-garden-id': COMPONENT_ID$d,
863
- 'data-garden-version': '9.0.0-next.6'
863
+ 'data-garden-version': '9.0.0-next.7'
864
864
  }).withConfig({
865
865
  displayName: "StyledFileListItem",
866
866
  componentId: "sc-1ova3lo-0"
@@ -890,7 +890,7 @@ var SvgCircleSmFill$1 = function SvgCircleSmFill(props) {
890
890
  const COMPONENT_ID$c = 'forms.radio_svg';
891
891
  const StyledRadioSvg = styled__default.default(SvgCircleSmFill$1).attrs({
892
892
  'data-garden-id': COMPONENT_ID$c,
893
- 'data-garden-version': '9.0.0-next.6'
893
+ 'data-garden-version': '9.0.0-next.7'
894
894
  }).withConfig({
895
895
  displayName: "StyledRadioSvg",
896
896
  componentId: "sc-1r1qtr1-0"
@@ -907,7 +907,7 @@ const sizeStyles$6 = props => {
907
907
  };
908
908
  const StyledToggleLabel = styled__default.default(StyledCheckLabel).attrs({
909
909
  'data-garden-id': COMPONENT_ID$b,
910
- 'data-garden-version': '9.0.0-next.6'
910
+ 'data-garden-version': '9.0.0-next.7'
911
911
  }).withConfig({
912
912
  displayName: "StyledToggleLabel",
913
913
  componentId: "sc-e0asdk-0"
@@ -919,7 +919,7 @@ StyledToggleLabel.defaultProps = {
919
919
  const COMPONENT_ID$a = 'forms.toggle_hint';
920
920
  const StyledToggleHint = styled__default.default(StyledHint).attrs({
921
921
  'data-garden-id': COMPONENT_ID$a,
922
- 'data-garden-version': '9.0.0-next.6'
922
+ 'data-garden-version': '9.0.0-next.7'
923
923
  }).withConfig({
924
924
  displayName: "StyledToggleHint",
925
925
  componentId: "sc-nziggu-0"
@@ -946,7 +946,7 @@ const sizeStyles$5 = props => {
946
946
  };
947
947
  const StyledToggleInput = styled__default.default(StyledCheckInput).attrs({
948
948
  'data-garden-id': COMPONENT_ID$9,
949
- 'data-garden-version': '9.0.0-next.6'
949
+ 'data-garden-version': '9.0.0-next.7'
950
950
  }).withConfig({
951
951
  displayName: "StyledToggleInput",
952
952
  componentId: "sc-sgp47s-0"
@@ -958,7 +958,7 @@ StyledToggleInput.defaultProps = {
958
958
  const COMPONENT_ID$8 = 'forms.toggle_message';
959
959
  const StyledToggleMessage = styled__default.default(StyledMessage).attrs({
960
960
  'data-garden-id': COMPONENT_ID$8,
961
- 'data-garden-version': '9.0.0-next.6'
961
+ 'data-garden-version': '9.0.0-next.7'
962
962
  }).withConfig({
963
963
  displayName: "StyledToggleMessage",
964
964
  componentId: "sc-13vuvl1-0"
@@ -988,7 +988,7 @@ var SvgCircleSmFill = function SvgCircleSmFill(props) {
988
988
  const COMPONENT_ID$7 = 'forms.toggle_svg';
989
989
  const StyledToggleSvg = styled__default.default(SvgCircleSmFill).attrs({
990
990
  'data-garden-id': COMPONENT_ID$7,
991
- 'data-garden-version': '9.0.0-next.6'
991
+ 'data-garden-version': '9.0.0-next.7'
992
992
  }).withConfig({
993
993
  displayName: "StyledToggleSvg",
994
994
  componentId: "sc-162xbyx-0"
@@ -1000,7 +1000,7 @@ StyledToggleSvg.defaultProps = {
1000
1000
  const COMPONENT_ID$6 = 'forms.select';
1001
1001
  const colorStyles$2 = props => {
1002
1002
  const color = reactTheming.getColorV8('neutralHue', 700, props.theme);
1003
- return styled.css(["&:hover + ", ",&:focus + ", ",&:focus-visible + ", ",&[data-garden-focus-visible='true'] + ", "{color:", ";}"], StyledTextMediaFigure, StyledTextMediaFigure, StyledTextMediaFigure, StyledTextMediaFigure, color);
1003
+ return styled.css(["&:hover + ", ",&:focus + ", ",&:focus-visible + ", "{color:", ";}"], StyledTextMediaFigure, StyledTextMediaFigure, StyledTextMediaFigure, color);
1004
1004
  };
1005
1005
  const sizeStyles$4 = props => {
1006
1006
  const padding = polished.math(`${props.theme.iconSizes.md} + ${props.theme.space.base * 5}`);
@@ -1010,7 +1010,7 @@ const sizeStyles$4 = props => {
1010
1010
  };
1011
1011
  const StyledSelect = styled__default.default(StyledTextInput).attrs({
1012
1012
  'data-garden-id': COMPONENT_ID$6,
1013
- 'data-garden-version': '9.0.0-next.6',
1013
+ 'data-garden-version': '9.0.0-next.7',
1014
1014
  as: 'select'
1015
1015
  }).withConfig({
1016
1016
  displayName: "StyledSelect",
@@ -1023,7 +1023,7 @@ StyledSelect.defaultProps = {
1023
1023
  const COMPONENT_ID$5 = 'forms.select_wrapper';
1024
1024
  const StyledSelectWrapper = styled__default.default(StyledTextFauxInput).attrs({
1025
1025
  'data-garden-id': COMPONENT_ID$5,
1026
- 'data-garden-version': '9.0.0-next.6'
1026
+ 'data-garden-version': '9.0.0-next.7'
1027
1027
  }).withConfig({
1028
1028
  displayName: "StyledSelectWrapper",
1029
1029
  componentId: "sc-i7b6hw-0"
@@ -1113,7 +1113,7 @@ const colorStyles$1 = props => {
1113
1113
  background-color: ${thumbHoverBackgroundColor};
1114
1114
  `, ':hover'), thumbStyles(`
1115
1115
  box-shadow: ${thumbFocusBoxShadow};
1116
- `, '[data-garden-focus-visible="true"]'), thumbStyles(`
1116
+ `, ':focus-visible'), thumbStyles(`
1117
1117
  border-color: ${thumbActiveBorderColor};
1118
1118
  background-color: ${thumbActiveBackgroundColor};
1119
1119
  `, ':active'), trackStyles(`
@@ -1148,7 +1148,7 @@ const sizeStyles$3 = props => {
1148
1148
  };
1149
1149
  const StyledRangeInput = styled__default.default.input.attrs(props => ({
1150
1150
  'data-garden-id': COMPONENT_ID$4,
1151
- 'data-garden-version': '9.0.0-next.6',
1151
+ 'data-garden-version': '9.0.0-next.7',
1152
1152
  type: 'range',
1153
1153
  style: {
1154
1154
  backgroundSize: props.hasLowerTrack && props.backgroundSize
@@ -1196,7 +1196,7 @@ const sizeStyles$2 = props => {
1196
1196
  };
1197
1197
  const StyledTileIcon = styled__default.default.span.attrs({
1198
1198
  'data-garden-id': COMPONENT_ID$3,
1199
- 'data-garden-version': '9.0.0-next.6'
1199
+ 'data-garden-version': '9.0.0-next.7'
1200
1200
  }).withConfig({
1201
1201
  displayName: "StyledTileIcon",
1202
1202
  componentId: "sc-1wazhg4-0"
@@ -1237,7 +1237,7 @@ const colorStyles = props => {
1237
1237
  };
1238
1238
  const StyledTile = styled__default.default.label.attrs(props => ({
1239
1239
  'data-garden-id': COMPONENT_ID$2,
1240
- 'data-garden-version': '9.0.0-next.6',
1240
+ 'data-garden-version': '9.0.0-next.7',
1241
1241
  'data-garden-selected': props.isSelected
1242
1242
  })).withConfig({
1243
1243
  displayName: "StyledTile",
@@ -1261,7 +1261,7 @@ const sizeStyles$1 = props => {
1261
1261
  };
1262
1262
  const StyledTileDescription = styled__default.default.span.attrs({
1263
1263
  'data-garden-id': COMPONENT_ID$1,
1264
- 'data-garden-version': '9.0.0-next.6'
1264
+ 'data-garden-version': '9.0.0-next.7'
1265
1265
  }).withConfig({
1266
1266
  displayName: "StyledTileDescription",
1267
1267
  componentId: "sc-xfuu7u-0"
@@ -1294,7 +1294,7 @@ const sizeStyles = props => {
1294
1294
  };
1295
1295
  const StyledTileLabel = styled__default.default.span.attrs({
1296
1296
  'data-garden-id': COMPONENT_ID,
1297
- 'data-garden-version': '9.0.0-next.6'
1297
+ 'data-garden-version': '9.0.0-next.7'
1298
1298
  }).withConfig({
1299
1299
  displayName: "StyledTileLabel",
1300
1300
  componentId: "sc-1mypv27-0"
package/dist/index.esm.js CHANGED
@@ -39,7 +39,7 @@ const useFieldContext = () => {
39
39
  const COMPONENT_ID$G = 'forms.field';
40
40
  const StyledField = styled.div.attrs({
41
41
  'data-garden-id': COMPONENT_ID$G,
42
- 'data-garden-version': '9.0.0-next.6'
42
+ 'data-garden-version': '9.0.0-next.7'
43
43
  }).withConfig({
44
44
  displayName: "StyledField",
45
45
  componentId: "sc-12gzfsu-0"
@@ -52,7 +52,7 @@ const COMPONENT_ID$F = 'forms.fieldset';
52
52
  const StyledFieldset = styled(StyledField).attrs({
53
53
  as: 'fieldset',
54
54
  'data-garden-id': COMPONENT_ID$F,
55
- 'data-garden-version': '9.0.0-next.6'
55
+ 'data-garden-version': '9.0.0-next.7'
56
56
  }).withConfig({
57
57
  displayName: "StyledFieldset",
58
58
  componentId: "sc-1vr4mxv-0"
@@ -64,7 +64,7 @@ StyledFieldset.defaultProps = {
64
64
  const COMPONENT_ID$E = 'forms.input_label';
65
65
  const StyledLabel = styled.label.attrs(props => ({
66
66
  'data-garden-id': props['data-garden-id'] || COMPONENT_ID$E,
67
- 'data-garden-version': props['data-garden-version'] || '9.0.0-next.6'
67
+ 'data-garden-version': props['data-garden-version'] || '9.0.0-next.7'
68
68
  })).withConfig({
69
69
  displayName: "StyledLabel",
70
70
  componentId: "sc-2utmsz-0"
@@ -77,7 +77,7 @@ const COMPONENT_ID$D = 'forms.fieldset_legend';
77
77
  const StyledLegend = styled(StyledLabel).attrs({
78
78
  as: 'legend',
79
79
  'data-garden-id': COMPONENT_ID$D,
80
- 'data-garden-version': '9.0.0-next.6'
80
+ 'data-garden-version': '9.0.0-next.7'
81
81
  }).withConfig({
82
82
  displayName: "StyledLegend",
83
83
  componentId: "sc-6s0zwq-0"
@@ -89,7 +89,7 @@ StyledLegend.defaultProps = {
89
89
  const COMPONENT_ID$C = 'forms.input_hint';
90
90
  const StyledHint = styled.div.attrs(props => ({
91
91
  'data-garden-id': props['data-garden-id'] || COMPONENT_ID$C,
92
- 'data-garden-version': props['data-garden-version'] || '9.0.0-next.6'
92
+ 'data-garden-version': props['data-garden-version'] || '9.0.0-next.7'
93
93
  })).withConfig({
94
94
  displayName: "StyledHint",
95
95
  componentId: "sc-17c2wu8-0"
@@ -194,7 +194,7 @@ const MessageIcon = _ref => {
194
194
  const COMPONENT_ID$B = 'forms.input_message_icon';
195
195
  const StyledMessageIcon = styled(MessageIcon).attrs({
196
196
  'data-garden-id': COMPONENT_ID$B,
197
- 'data-garden-version': '9.0.0-next.6',
197
+ 'data-garden-version': '9.0.0-next.7',
198
198
  'aria-hidden': null
199
199
  }).withConfig({
200
200
  displayName: "StyledMessageIcon",
@@ -222,7 +222,7 @@ const validationStyles = props => {
222
222
  const COMPONENT_ID$A = 'forms.input_message';
223
223
  const StyledMessage = styled.div.attrs(props => ({
224
224
  'data-garden-id': props['data-garden-id'] || COMPONENT_ID$A,
225
- 'data-garden-version': props['data-garden-version'] || '9.0.0-next.6'
225
+ 'data-garden-version': props['data-garden-version'] || '9.0.0-next.7'
226
226
  })).withConfig({
227
227
  displayName: "StyledMessage",
228
228
  componentId: "sc-30hgg7-0"
@@ -312,7 +312,7 @@ const sizeStyles$c = props => {
312
312
  };
313
313
  const StyledTextInput = styled.input.attrs(props => ({
314
314
  'data-garden-id': COMPONENT_ID$z,
315
- 'data-garden-version': '9.0.0-next.6',
315
+ 'data-garden-version': '9.0.0-next.7',
316
316
  'aria-invalid': isInvalid(props.validation)
317
317
  })).withConfig({
318
318
  displayName: "StyledTextInput",
@@ -335,7 +335,7 @@ const hiddenStyles = `
335
335
  const StyledTextarea = styled(StyledTextInput).attrs({
336
336
  as: 'textarea',
337
337
  'data-garden-id': COMPONENT_ID$y,
338
- 'data-garden-version': '9.0.0-next.6'
338
+ 'data-garden-version': '9.0.0-next.7'
339
339
  }).withConfig({
340
340
  displayName: "StyledTextarea",
341
341
  componentId: "sc-wxschl-0"
@@ -381,7 +381,7 @@ _ref => {
381
381
  return React__default.cloneElement(Children.only(children), props);
382
382
  }).attrs({
383
383
  'data-garden-id': COMPONENT_ID$x,
384
- 'data-garden-version': '9.0.0-next.6'
384
+ 'data-garden-version': '9.0.0-next.7'
385
385
  }).withConfig({
386
386
  displayName: "StyledTextMediaFigure",
387
387
  componentId: "sc-1qepknj-0"
@@ -428,7 +428,7 @@ const StyledTextFauxInput = styled(StyledTextInput).attrs(props => ({
428
428
  'aria-readonly': props.isReadOnly,
429
429
  'aria-disabled': props.isDisabled,
430
430
  'data-garden-id': COMPONENT_ID$w,
431
- 'data-garden-version': '9.0.0-next.6'
431
+ 'data-garden-version': '9.0.0-next.7'
432
432
  })).withConfig({
433
433
  displayName: "StyledTextFauxInput",
434
434
  componentId: "sc-yqw7j9-0"
@@ -440,7 +440,7 @@ StyledTextFauxInput.defaultProps = {
440
440
  const COMPONENT_ID$v = 'forms.media_input';
441
441
  const StyledTextMediaInput = styled(StyledTextInput).attrs({
442
442
  'data-garden-id': COMPONENT_ID$v,
443
- 'data-garden-version': '9.0.0-next.6',
443
+ 'data-garden-version': '9.0.0-next.7',
444
444
  isBare: true
445
445
  }).withConfig({
446
446
  displayName: "StyledTextMediaInput",
@@ -458,11 +458,11 @@ const positionStyles = props => {
458
458
  const itemStyles = props => {
459
459
  const startDirection = props.theme.rtl ? 'right' : 'left';
460
460
  const endDirection = props.theme.rtl ? 'left' : 'right';
461
- return css(["& > *{z-index:-1;}& > ", "{z-index:0;}& > ", ":disabled{z-index:-2;}& > ", ":hover,& > button:hover,& > ", ":focus-visible,& > button:focus-visible,& > ", "[data-garden-focus-visible],& > button[data-garden-focus-visible],& > ", ":active,& > button:active{z-index:1;}& > button:disabled{border-top-width:0;border-bottom-width:0;}& > *:not(:first-child){margin-", ":-", ";}& > *:first-child:not(:last-child){border-top-", "-radius:0;border-bottom-", "-radius:0;}& > *:last-child:not(:first-child){border-top-", "-radius:0;border-bottom-", "-radius:0;}& > *:not(:first-child):not(:last-child){border-radius:0;}"], StyledTextInput, StyledTextInput, StyledTextInput, StyledTextInput, StyledTextInput, StyledTextInput, startDirection, props.theme.borderWidths.sm, endDirection, endDirection, startDirection, startDirection);
461
+ return css(["& > *{z-index:-1;}& > ", "{z-index:0;}& > ", ":disabled{z-index:-2;}& > ", ":hover,& > button:hover,& > ", ":focus-visible,& > button:focus-visible,& > ", ":active,& > button:active,& > button[aria-pressed='true'],& > button[aria-pressed='mixed']{z-index:1;}& > button:disabled{border-top-width:0;border-bottom-width:0;}& > *:not(:first-child){margin-", ":-", ";}& > *:first-child:not(:last-child){border-top-", "-radius:0;border-bottom-", "-radius:0;}& > *:last-child:not(:first-child){border-top-", "-radius:0;border-bottom-", "-radius:0;}& > *:not(:first-child):not(:last-child){border-radius:0;}"], StyledTextInput, StyledTextInput, StyledTextInput, StyledTextInput, StyledTextInput, startDirection, props.theme.borderWidths.sm, endDirection, endDirection, startDirection, startDirection);
462
462
  };
463
463
  const StyledInputGroup = styled.div.attrs({
464
464
  'data-garden-id': COMPONENT_ID$u,
465
- 'data-garden-version': '9.0.0-next.6'
465
+ 'data-garden-version': '9.0.0-next.7'
466
466
  }).withConfig({
467
467
  displayName: "StyledInputGroup",
468
468
  componentId: "sc-kjh1f0-0"
@@ -480,7 +480,7 @@ const sizeStyles$a = props => {
480
480
  };
481
481
  const StyledRadioLabel = styled(StyledLabel).attrs({
482
482
  'data-garden-id': COMPONENT_ID$t,
483
- 'data-garden-version': '9.0.0-next.6',
483
+ 'data-garden-version': '9.0.0-next.7',
484
484
  isRadio: true
485
485
  }).withConfig({
486
486
  displayName: "StyledRadioLabel",
@@ -493,7 +493,7 @@ StyledRadioLabel.defaultProps = {
493
493
  const COMPONENT_ID$s = 'forms.checkbox_label';
494
494
  const StyledCheckLabel = styled(StyledRadioLabel).attrs({
495
495
  'data-garden-id': COMPONENT_ID$s,
496
- 'data-garden-version': '9.0.0-next.6'
496
+ 'data-garden-version': '9.0.0-next.7'
497
497
  }).withConfig({
498
498
  displayName: "StyledCheckLabel",
499
499
  componentId: "sc-x7nr1-0"
@@ -505,7 +505,7 @@ StyledCheckLabel.defaultProps = {
505
505
  const COMPONENT_ID$r = 'forms.radio_hint';
506
506
  const StyledRadioHint = styled(StyledHint).attrs({
507
507
  'data-garden-id': COMPONENT_ID$r,
508
- 'data-garden-version': '9.0.0-next.6'
508
+ 'data-garden-version': '9.0.0-next.7'
509
509
  }).withConfig({
510
510
  displayName: "StyledRadioHint",
511
511
  componentId: "sc-eo8twg-0"
@@ -517,7 +517,7 @@ StyledRadioHint.defaultProps = {
517
517
  const COMPONENT_ID$q = 'forms.checkbox_hint';
518
518
  const StyledCheckHint = styled(StyledRadioHint).attrs({
519
519
  'data-garden-id': COMPONENT_ID$q,
520
- 'data-garden-version': '9.0.0-next.6'
520
+ 'data-garden-version': '9.0.0-next.7'
521
521
  }).withConfig({
522
522
  displayName: "StyledCheckHint",
523
523
  componentId: "sc-1kl8e8c-0"
@@ -549,7 +549,7 @@ const colorStyles$7 = props => {
549
549
  styles: {
550
550
  borderColor: focusBorderColor
551
551
  },
552
- selector: `&:focus-visible ~ ${StyledRadioLabel}::before, &[data-garden-focus-visible='true'] ~ ${StyledRadioLabel}::before`
552
+ selector: `&:focus-visible ~ ${StyledRadioLabel}::before`
553
553
  }), StyledRadioLabel, activeBorderColor, activeBackgroundColor, StyledRadioLabel, checkedBorderColor, checkedBackgroundColor, StyledRadioLabel, checkedHoverBorderColor, checkedHoverBackgroundColor, StyledRadioLabel, checkedActiveBorderColor, checkedActiveBackgroundColor, StyledRadioLabel, disabledBackgroundColor);
554
554
  };
555
555
  const sizeStyles$9 = props => {
@@ -564,7 +564,7 @@ const sizeStyles$9 = props => {
564
564
  };
565
565
  const StyledRadioInput = styled.input.attrs({
566
566
  'data-garden-id': COMPONENT_ID$p,
567
- 'data-garden-version': '9.0.0-next.6',
567
+ 'data-garden-version': '9.0.0-next.7',
568
568
  type: 'radio'
569
569
  }).withConfig({
570
570
  displayName: "StyledRadioInput",
@@ -586,7 +586,7 @@ const colorStyles$6 = props => {
586
586
  };
587
587
  const StyledCheckInput = styled(StyledRadioInput).attrs({
588
588
  'data-garden-id': COMPONENT_ID$o,
589
- 'data-garden-version': '9.0.0-next.6',
589
+ 'data-garden-version': '9.0.0-next.7',
590
590
  type: 'checkbox'
591
591
  }).withConfig({
592
592
  displayName: "StyledCheckInput",
@@ -599,7 +599,7 @@ StyledCheckInput.defaultProps = {
599
599
  const COMPONENT_ID$n = 'forms.radio_message';
600
600
  const StyledRadioMessage = styled(StyledMessage).attrs({
601
601
  'data-garden-id': COMPONENT_ID$n,
602
- 'data-garden-version': '9.0.0-next.6'
602
+ 'data-garden-version': '9.0.0-next.7'
603
603
  }).withConfig({
604
604
  displayName: "StyledRadioMessage",
605
605
  componentId: "sc-1pmi0q8-0"
@@ -611,7 +611,7 @@ StyledRadioMessage.defaultProps = {
611
611
  const COMPONENT_ID$m = 'forms.checkbox_message';
612
612
  const StyledCheckMessage = styled(StyledRadioMessage).attrs({
613
613
  'data-garden-id': COMPONENT_ID$m,
614
- 'data-garden-version': '9.0.0-next.6'
614
+ 'data-garden-version': '9.0.0-next.7'
615
615
  }).withConfig({
616
616
  displayName: "StyledCheckMessage",
617
617
  componentId: "sc-s4p6kd-0"
@@ -643,7 +643,7 @@ var SvgCheckSmFill = function SvgCheckSmFill(props) {
643
643
  const COMPONENT_ID$l = 'forms.check_svg';
644
644
  const StyledCheckSvg = styled(SvgCheckSmFill).attrs({
645
645
  'data-garden-id': COMPONENT_ID$l,
646
- 'data-garden-version': '9.0.0-next.6'
646
+ 'data-garden-version': '9.0.0-next.7'
647
647
  }).withConfig({
648
648
  displayName: "StyledCheckSvg",
649
649
  componentId: "sc-fvxetk-0"
@@ -673,7 +673,7 @@ var SvgDashFill = function SvgDashFill(props) {
673
673
  const COMPONENT_ID$k = 'forms.dash_svg';
674
674
  const StyledDashSvg = styled(SvgDashFill).attrs({
675
675
  'data-garden-id': COMPONENT_ID$k,
676
- 'data-garden-version': '9.0.0-next.6'
676
+ 'data-garden-version': '9.0.0-next.7'
677
677
  }).withConfig({
678
678
  displayName: "StyledDashSvg",
679
679
  componentId: "sc-z3vq71-0"
@@ -704,7 +704,7 @@ const sizeStyles$8 = props => {
704
704
  };
705
705
  const StyledFileUpload = styled.div.attrs({
706
706
  'data-garden-id': COMPONENT_ID$j,
707
- 'data-garden-version': '9.0.0-next.6'
707
+ 'data-garden-version': '9.0.0-next.7'
708
708
  }).withConfig({
709
709
  displayName: "StyledFileUpload",
710
710
  componentId: "sc-1rodjgn-0"
@@ -716,7 +716,7 @@ StyledFileUpload.defaultProps = {
716
716
  const COMPONENT_ID$i = 'forms.file.close';
717
717
  const StyledFileClose = styled.button.attrs({
718
718
  'data-garden-id': COMPONENT_ID$i,
719
- 'data-garden-version': '9.0.0-next.6'
719
+ 'data-garden-version': '9.0.0-next.7'
720
720
  }).withConfig({
721
721
  displayName: "StyledFileClose",
722
722
  componentId: "sc-1m31jbf-0"
@@ -779,7 +779,7 @@ const sizeStyles$7 = props => {
779
779
  };
780
780
  const StyledFile = styled.div.attrs({
781
781
  'data-garden-id': COMPONENT_ID$h,
782
- 'data-garden-version': '9.0.0-next.6'
782
+ 'data-garden-version': '9.0.0-next.7'
783
783
  }).withConfig({
784
784
  displayName: "StyledFile",
785
785
  componentId: "sc-195lzp1-0"
@@ -791,7 +791,7 @@ StyledFile.defaultProps = {
791
791
  const COMPONENT_ID$g = 'forms.file.delete';
792
792
  const StyledFileDelete = styled(StyledFileClose).attrs({
793
793
  'data-garden-id': COMPONENT_ID$g,
794
- 'data-garden-version': '9.0.0-next.6'
794
+ 'data-garden-version': '9.0.0-next.7'
795
795
  }).withConfig({
796
796
  displayName: "StyledFileDelete",
797
797
  componentId: "sc-a8nnhx-0"
@@ -811,7 +811,7 @@ const StyledFileIcon = styled(_ref => {
811
811
  return React__default.cloneElement(Children.only(children), props);
812
812
  }).attrs({
813
813
  'data-garden-id': COMPONENT_ID$f,
814
- 'data-garden-version': '9.0.0-next.6'
814
+ 'data-garden-version': '9.0.0-next.7'
815
815
  }).withConfig({
816
816
  displayName: "StyledFileIcon",
817
817
  componentId: "sc-7b3q0c-0"
@@ -823,7 +823,7 @@ StyledFileIcon.defaultProps = {
823
823
  const COMPONENT_ID$e = 'forms.file_list';
824
824
  const StyledFileList = styled.ul.attrs({
825
825
  'data-garden-id': COMPONENT_ID$e,
826
- 'data-garden-version': '9.0.0-next.6'
826
+ 'data-garden-version': '9.0.0-next.7'
827
827
  }).withConfig({
828
828
  displayName: "StyledFileList",
829
829
  componentId: "sc-gbahjg-0"
@@ -835,7 +835,7 @@ StyledFileList.defaultProps = {
835
835
  const COMPONENT_ID$d = 'forms.file_list.item';
836
836
  const StyledFileListItem = styled.li.attrs({
837
837
  'data-garden-id': COMPONENT_ID$d,
838
- 'data-garden-version': '9.0.0-next.6'
838
+ 'data-garden-version': '9.0.0-next.7'
839
839
  }).withConfig({
840
840
  displayName: "StyledFileListItem",
841
841
  componentId: "sc-1ova3lo-0"
@@ -865,7 +865,7 @@ var SvgCircleSmFill$1 = function SvgCircleSmFill(props) {
865
865
  const COMPONENT_ID$c = 'forms.radio_svg';
866
866
  const StyledRadioSvg = styled(SvgCircleSmFill$1).attrs({
867
867
  'data-garden-id': COMPONENT_ID$c,
868
- 'data-garden-version': '9.0.0-next.6'
868
+ 'data-garden-version': '9.0.0-next.7'
869
869
  }).withConfig({
870
870
  displayName: "StyledRadioSvg",
871
871
  componentId: "sc-1r1qtr1-0"
@@ -882,7 +882,7 @@ const sizeStyles$6 = props => {
882
882
  };
883
883
  const StyledToggleLabel = styled(StyledCheckLabel).attrs({
884
884
  'data-garden-id': COMPONENT_ID$b,
885
- 'data-garden-version': '9.0.0-next.6'
885
+ 'data-garden-version': '9.0.0-next.7'
886
886
  }).withConfig({
887
887
  displayName: "StyledToggleLabel",
888
888
  componentId: "sc-e0asdk-0"
@@ -894,7 +894,7 @@ StyledToggleLabel.defaultProps = {
894
894
  const COMPONENT_ID$a = 'forms.toggle_hint';
895
895
  const StyledToggleHint = styled(StyledHint).attrs({
896
896
  'data-garden-id': COMPONENT_ID$a,
897
- 'data-garden-version': '9.0.0-next.6'
897
+ 'data-garden-version': '9.0.0-next.7'
898
898
  }).withConfig({
899
899
  displayName: "StyledToggleHint",
900
900
  componentId: "sc-nziggu-0"
@@ -921,7 +921,7 @@ const sizeStyles$5 = props => {
921
921
  };
922
922
  const StyledToggleInput = styled(StyledCheckInput).attrs({
923
923
  'data-garden-id': COMPONENT_ID$9,
924
- 'data-garden-version': '9.0.0-next.6'
924
+ 'data-garden-version': '9.0.0-next.7'
925
925
  }).withConfig({
926
926
  displayName: "StyledToggleInput",
927
927
  componentId: "sc-sgp47s-0"
@@ -933,7 +933,7 @@ StyledToggleInput.defaultProps = {
933
933
  const COMPONENT_ID$8 = 'forms.toggle_message';
934
934
  const StyledToggleMessage = styled(StyledMessage).attrs({
935
935
  'data-garden-id': COMPONENT_ID$8,
936
- 'data-garden-version': '9.0.0-next.6'
936
+ 'data-garden-version': '9.0.0-next.7'
937
937
  }).withConfig({
938
938
  displayName: "StyledToggleMessage",
939
939
  componentId: "sc-13vuvl1-0"
@@ -963,7 +963,7 @@ var SvgCircleSmFill = function SvgCircleSmFill(props) {
963
963
  const COMPONENT_ID$7 = 'forms.toggle_svg';
964
964
  const StyledToggleSvg = styled(SvgCircleSmFill).attrs({
965
965
  'data-garden-id': COMPONENT_ID$7,
966
- 'data-garden-version': '9.0.0-next.6'
966
+ 'data-garden-version': '9.0.0-next.7'
967
967
  }).withConfig({
968
968
  displayName: "StyledToggleSvg",
969
969
  componentId: "sc-162xbyx-0"
@@ -975,7 +975,7 @@ StyledToggleSvg.defaultProps = {
975
975
  const COMPONENT_ID$6 = 'forms.select';
976
976
  const colorStyles$2 = props => {
977
977
  const color = getColorV8('neutralHue', 700, props.theme);
978
- return css(["&:hover + ", ",&:focus + ", ",&:focus-visible + ", ",&[data-garden-focus-visible='true'] + ", "{color:", ";}"], StyledTextMediaFigure, StyledTextMediaFigure, StyledTextMediaFigure, StyledTextMediaFigure, color);
978
+ return css(["&:hover + ", ",&:focus + ", ",&:focus-visible + ", "{color:", ";}"], StyledTextMediaFigure, StyledTextMediaFigure, StyledTextMediaFigure, color);
979
979
  };
980
980
  const sizeStyles$4 = props => {
981
981
  const padding = math(`${props.theme.iconSizes.md} + ${props.theme.space.base * 5}`);
@@ -985,7 +985,7 @@ const sizeStyles$4 = props => {
985
985
  };
986
986
  const StyledSelect = styled(StyledTextInput).attrs({
987
987
  'data-garden-id': COMPONENT_ID$6,
988
- 'data-garden-version': '9.0.0-next.6',
988
+ 'data-garden-version': '9.0.0-next.7',
989
989
  as: 'select'
990
990
  }).withConfig({
991
991
  displayName: "StyledSelect",
@@ -998,7 +998,7 @@ StyledSelect.defaultProps = {
998
998
  const COMPONENT_ID$5 = 'forms.select_wrapper';
999
999
  const StyledSelectWrapper = styled(StyledTextFauxInput).attrs({
1000
1000
  'data-garden-id': COMPONENT_ID$5,
1001
- 'data-garden-version': '9.0.0-next.6'
1001
+ 'data-garden-version': '9.0.0-next.7'
1002
1002
  }).withConfig({
1003
1003
  displayName: "StyledSelectWrapper",
1004
1004
  componentId: "sc-i7b6hw-0"
@@ -1088,7 +1088,7 @@ const colorStyles$1 = props => {
1088
1088
  background-color: ${thumbHoverBackgroundColor};
1089
1089
  `, ':hover'), thumbStyles(`
1090
1090
  box-shadow: ${thumbFocusBoxShadow};
1091
- `, '[data-garden-focus-visible="true"]'), thumbStyles(`
1091
+ `, ':focus-visible'), thumbStyles(`
1092
1092
  border-color: ${thumbActiveBorderColor};
1093
1093
  background-color: ${thumbActiveBackgroundColor};
1094
1094
  `, ':active'), trackStyles(`
@@ -1123,7 +1123,7 @@ const sizeStyles$3 = props => {
1123
1123
  };
1124
1124
  const StyledRangeInput = styled.input.attrs(props => ({
1125
1125
  'data-garden-id': COMPONENT_ID$4,
1126
- 'data-garden-version': '9.0.0-next.6',
1126
+ 'data-garden-version': '9.0.0-next.7',
1127
1127
  type: 'range',
1128
1128
  style: {
1129
1129
  backgroundSize: props.hasLowerTrack && props.backgroundSize
@@ -1171,7 +1171,7 @@ const sizeStyles$2 = props => {
1171
1171
  };
1172
1172
  const StyledTileIcon = styled.span.attrs({
1173
1173
  'data-garden-id': COMPONENT_ID$3,
1174
- 'data-garden-version': '9.0.0-next.6'
1174
+ 'data-garden-version': '9.0.0-next.7'
1175
1175
  }).withConfig({
1176
1176
  displayName: "StyledTileIcon",
1177
1177
  componentId: "sc-1wazhg4-0"
@@ -1212,7 +1212,7 @@ const colorStyles = props => {
1212
1212
  };
1213
1213
  const StyledTile = styled.label.attrs(props => ({
1214
1214
  'data-garden-id': COMPONENT_ID$2,
1215
- 'data-garden-version': '9.0.0-next.6',
1215
+ 'data-garden-version': '9.0.0-next.7',
1216
1216
  'data-garden-selected': props.isSelected
1217
1217
  })).withConfig({
1218
1218
  displayName: "StyledTile",
@@ -1236,7 +1236,7 @@ const sizeStyles$1 = props => {
1236
1236
  };
1237
1237
  const StyledTileDescription = styled.span.attrs({
1238
1238
  'data-garden-id': COMPONENT_ID$1,
1239
- 'data-garden-version': '9.0.0-next.6'
1239
+ 'data-garden-version': '9.0.0-next.7'
1240
1240
  }).withConfig({
1241
1241
  displayName: "StyledTileDescription",
1242
1242
  componentId: "sc-xfuu7u-0"
@@ -1269,7 +1269,7 @@ const sizeStyles = props => {
1269
1269
  };
1270
1270
  const StyledTileLabel = styled.span.attrs({
1271
1271
  'data-garden-id': COMPONENT_ID,
1272
- 'data-garden-version': '9.0.0-next.6'
1272
+ 'data-garden-version': '9.0.0-next.7'
1273
1273
  }).withConfig({
1274
1274
  displayName: "StyledTileLabel",
1275
1275
  componentId: "sc-1mypv27-0"
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zendeskgarden/react-forms",
3
- "version": "9.0.0-next.6",
3
+ "version": "9.0.0-next.7",
4
4
  "description": "Components relating to form elements in the Garden Design System",
5
5
  "license": "Apache-2.0",
6
6
  "author": "Zendesk Garden <garden@zendesk.com>",
@@ -29,14 +29,14 @@
29
29
  "react-merge-refs": "^2.0.0"
30
30
  },
31
31
  "peerDependencies": {
32
- "@zendeskgarden/react-theming": "^8.67.0",
32
+ "@zendeskgarden/react-theming": "^9.0.0",
33
33
  "react": ">=16.8.0",
34
34
  "react-dom": ">=16.8.0",
35
35
  "styled-components": "^5.3.1"
36
36
  },
37
37
  "devDependencies": {
38
38
  "@types/lodash.debounce": "4.0.9",
39
- "@zendeskgarden/react-theming": "^9.0.0-next.6",
39
+ "@zendeskgarden/react-theming": "^9.0.0-next.7",
40
40
  "@zendeskgarden/svg-icons": "7.0.0",
41
41
  "react-dropzone": "14.2.3"
42
42
  },
@@ -50,5 +50,5 @@
50
50
  "access": "public"
51
51
  },
52
52
  "zendeskgarden:src": "src/index.ts",
53
- "gitHead": "45c56ad1c73af40afba8e5415f529a2c9601c83f"
53
+ "gitHead": "50a2b45b2e237a490a6d460818d33498b92479ec"
54
54
  }