@zendeskgarden/react-dropdowns 9.0.0-next.7 → 9.0.0-next.8

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 (68) hide show
  1. package/dist/esm/context/useComboboxContext.js +18 -0
  2. package/dist/esm/context/useFieldContext.js +18 -0
  3. package/dist/esm/context/useItemContext.js +18 -0
  4. package/dist/esm/context/useItemGroupContext.js +14 -0
  5. package/dist/esm/context/useMenuContext.js +18 -0
  6. package/dist/esm/context/useOptionContext.js +18 -0
  7. package/dist/esm/elements/combobox/Combobox.js +330 -0
  8. package/dist/esm/elements/combobox/Field.js +75 -0
  9. package/dist/esm/elements/combobox/Hint.js +57 -0
  10. package/dist/esm/elements/combobox/Label.js +68 -0
  11. package/dist/esm/elements/combobox/Listbox.js +155 -0
  12. package/dist/esm/elements/combobox/Message.js +63 -0
  13. package/dist/esm/elements/combobox/OptGroup.js +93 -0
  14. package/dist/esm/elements/combobox/Option.js +133 -0
  15. package/dist/esm/elements/combobox/OptionMeta.js +55 -0
  16. package/dist/esm/elements/combobox/Tag.js +98 -0
  17. package/dist/esm/elements/combobox/TagAvatar.js +13 -0
  18. package/dist/esm/elements/combobox/TagGroup.js +35 -0
  19. package/dist/esm/elements/combobox/utils.js +36 -0
  20. package/dist/esm/elements/menu/Item.js +140 -0
  21. package/dist/esm/elements/menu/ItemGroup.js +96 -0
  22. package/dist/esm/elements/menu/ItemMeta.js +55 -0
  23. package/dist/esm/elements/menu/Menu.js +157 -0
  24. package/dist/esm/elements/menu/MenuList.js +170 -0
  25. package/dist/esm/elements/menu/Separator.js +58 -0
  26. package/dist/esm/elements/menu/utils.js +55 -0
  27. package/dist/esm/index.js +19 -0
  28. package/dist/esm/node_modules/@zendeskgarden/svg-icons/src/16/check-lg-stroke.svg.js +28 -0
  29. package/dist/esm/node_modules/@zendeskgarden/svg-icons/src/16/chevron-down-stroke.svg.js +25 -0
  30. package/dist/esm/node_modules/@zendeskgarden/svg-icons/src/16/chevron-left-stroke.svg.js +25 -0
  31. package/dist/esm/node_modules/@zendeskgarden/svg-icons/src/16/chevron-right-stroke.svg.js +25 -0
  32. package/dist/esm/node_modules/@zendeskgarden/svg-icons/src/16/plus-stroke.svg.js +26 -0
  33. package/dist/esm/types/index.js +12 -0
  34. package/dist/esm/views/combobox/StyledCombobox.js +30 -0
  35. package/dist/esm/views/combobox/StyledContainer.js +22 -0
  36. package/dist/esm/views/combobox/StyledField.js +22 -0
  37. package/dist/esm/views/combobox/StyledFloatingListbox.js +27 -0
  38. package/dist/esm/views/combobox/StyledHint.js +23 -0
  39. package/dist/esm/views/combobox/StyledInput.js +41 -0
  40. package/dist/esm/views/combobox/StyledInputGroup.js +26 -0
  41. package/dist/esm/views/combobox/StyledInputIcon.js +56 -0
  42. package/dist/esm/views/combobox/StyledLabel.js +23 -0
  43. package/dist/esm/views/combobox/StyledListbox.js +31 -0
  44. package/dist/esm/views/combobox/StyledListboxSeparator.js +31 -0
  45. package/dist/esm/views/combobox/StyledMessage.js +23 -0
  46. package/dist/esm/views/combobox/StyledOptGroup.js +22 -0
  47. package/dist/esm/views/combobox/StyledOption.js +48 -0
  48. package/dist/esm/views/combobox/StyledOptionContent.js +22 -0
  49. package/dist/esm/views/combobox/StyledOptionIcon.js +37 -0
  50. package/dist/esm/views/combobox/StyledOptionMeta.js +31 -0
  51. package/dist/esm/views/combobox/StyledOptionTypeIcon.js +58 -0
  52. package/dist/esm/views/combobox/StyledTag.js +24 -0
  53. package/dist/esm/views/combobox/StyledTagsButton.js +28 -0
  54. package/dist/esm/views/combobox/StyledTrigger.js +94 -0
  55. package/dist/esm/views/combobox/StyledValue.js +32 -0
  56. package/dist/esm/views/menu/StyledButton.js +23 -0
  57. package/dist/esm/views/menu/StyledFloatingMenu.js +23 -0
  58. package/dist/esm/views/menu/StyledItem.js +23 -0
  59. package/dist/esm/views/menu/StyledItemContent.js +23 -0
  60. package/dist/esm/views/menu/StyledItemGroup.js +23 -0
  61. package/dist/esm/views/menu/StyledItemIcon.js +23 -0
  62. package/dist/esm/views/menu/StyledItemMeta.js +23 -0
  63. package/dist/esm/views/menu/StyledItemTypeIcon.js +24 -0
  64. package/dist/esm/views/menu/StyledMenu.js +27 -0
  65. package/dist/esm/views/menu/StyledSeparator.js +23 -0
  66. package/dist/index.cjs.js +61 -75
  67. package/package.json +9 -9
  68. package/dist/index.esm.js +0 -1969
package/dist/index.cjs.js CHANGED
@@ -1,10 +1,9 @@
1
1
  /**
2
- * Copyright Zendesk, Inc.
3
- *
4
- * Use of this source code is governed under the Apache License, Version 2.0
5
- * found at http://www.apache.org/licenses/LICENSE-2.0.
6
- */
7
-
2
+ * Copyright Zendesk, Inc.
3
+ *
4
+ * Use of this source code is governed under the Apache License, Version 2.0
5
+ * found at http://www.apache.org/licenses/LICENSE-2.0.
6
+ */
8
7
  'use strict';
9
8
 
10
9
  var React = require('react');
@@ -47,21 +46,6 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
47
46
  var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
48
47
  var styled__default = /*#__PURE__*/_interopDefault(styled);
49
48
 
50
- function _extends$5() {
51
- _extends$5 = Object.assign ? Object.assign.bind() : function (target) {
52
- for (var i = 1; i < arguments.length; i++) {
53
- var source = arguments[i];
54
- for (var key in source) {
55
- if (Object.prototype.hasOwnProperty.call(source, key)) {
56
- target[key] = source[key];
57
- }
58
- }
59
- }
60
- return target;
61
- };
62
- return _extends$5.apply(this, arguments);
63
- }
64
-
65
49
  var _path$4;
66
50
  function _extends$4() { _extends$4 = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$4.apply(this, arguments); }
67
51
  var SvgChevronDownStroke = function SvgChevronDownStroke(props) {
@@ -99,7 +83,7 @@ const useFieldContext = () => {
99
83
  const COMPONENT_ID$v = 'dropdowns.combobox.label';
100
84
  const StyledLabel = styled__default.default(reactForms.Field.Label).attrs({
101
85
  'data-garden-id': COMPONENT_ID$v,
102
- 'data-garden-version': '9.0.0-next.7'
86
+ 'data-garden-version': '9.0.0-next.8'
103
87
  }).withConfig({
104
88
  displayName: "StyledLabel",
105
89
  componentId: "sc-az6now-0"
@@ -111,7 +95,7 @@ StyledLabel.defaultProps = {
111
95
  const COMPONENT_ID$u = 'dropdowns.combobox.hint';
112
96
  const StyledHint = styled__default.default(reactForms.Field.Hint).attrs({
113
97
  'data-garden-id': COMPONENT_ID$u,
114
- 'data-garden-version': '9.0.0-next.7'
98
+ 'data-garden-version': '9.0.0-next.8'
115
99
  }).withConfig({
116
100
  displayName: "StyledHint",
117
101
  componentId: "sc-106qvqx-0"
@@ -123,7 +107,7 @@ StyledHint.defaultProps = {
123
107
  const COMPONENT_ID$t = 'dropdowns.combobox.message';
124
108
  const StyledMessage = styled__default.default(reactForms.Field.Message).attrs({
125
109
  'data-garden-id': COMPONENT_ID$t,
126
- 'data-garden-version': '9.0.0-next.7'
110
+ 'data-garden-version': '9.0.0-next.8'
127
111
  }).withConfig({
128
112
  displayName: "StyledMessage",
129
113
  componentId: "sc-jux8m5-0"
@@ -140,7 +124,7 @@ const sizeStyles$a = props => {
140
124
  };
141
125
  const StyledCombobox = styled__default.default.div.attrs({
142
126
  'data-garden-id': COMPONENT_ID$s,
143
- 'data-garden-version': '9.0.0-next.7'
127
+ 'data-garden-version': '9.0.0-next.8'
144
128
  }).withConfig({
145
129
  displayName: "StyledCombobox",
146
130
  componentId: "sc-13eybg8-0"
@@ -152,7 +136,7 @@ StyledCombobox.defaultProps = {
152
136
  const COMPONENT_ID$r = 'dropdowns.combobox.container';
153
137
  const StyledContainer = styled__default.default.div.attrs({
154
138
  'data-garden-id': COMPONENT_ID$r,
155
- 'data-garden-version': '9.0.0-next.7'
139
+ 'data-garden-version': '9.0.0-next.8'
156
140
  }).withConfig({
157
141
  displayName: "StyledContainer",
158
142
  componentId: "sc-14i9jid-0"
@@ -164,7 +148,7 @@ StyledContainer.defaultProps = {
164
148
  const COMPONENT_ID$q = 'dropdowns.combobox.field';
165
149
  const StyledField = styled__default.default.div.attrs({
166
150
  'data-garden-id': COMPONENT_ID$q,
167
- 'data-garden-version': '9.0.0-next.7'
151
+ 'data-garden-version': '9.0.0-next.8'
168
152
  }).withConfig({
169
153
  displayName: "StyledField",
170
154
  componentId: "sc-zc57xl-0"
@@ -176,7 +160,7 @@ StyledField.defaultProps = {
176
160
  const COMPONENT_ID$p = 'dropdowns.combobox.floating';
177
161
  const StyledFloatingListbox = styled__default.default.div.attrs({
178
162
  'data-garden-id': COMPONENT_ID$p,
179
- 'data-garden-version': '9.0.0-next.7'
163
+ 'data-garden-version': '9.0.0-next.8'
180
164
  }).withConfig({
181
165
  displayName: "StyledFloatingListbox",
182
166
  componentId: "sc-1cp6spf-0"
@@ -211,7 +195,7 @@ const sizeStyles$9 = props => {
211
195
  };
212
196
  const StyledInput = styled__default.default.input.attrs({
213
197
  'data-garden-id': COMPONENT_ID$o,
214
- 'data-garden-version': '9.0.0-next.7'
198
+ 'data-garden-version': '9.0.0-next.8'
215
199
  }).withConfig({
216
200
  displayName: "StyledInput",
217
201
  componentId: "sc-1lkqdg-0"
@@ -227,7 +211,7 @@ const sizeStyles$8 = props => {
227
211
  };
228
212
  const StyledInputGroup = styled__default.default.div.attrs({
229
213
  'data-garden-id': COMPONENT_ID$n,
230
- 'data-garden-version': '9.0.0-next.7'
214
+ 'data-garden-version': '9.0.0-next.8'
231
215
  }).withConfig({
232
216
  displayName: "StyledInputGroup",
233
217
  componentId: "sc-yx3q7u-0"
@@ -276,8 +260,10 @@ const colorStyles$7 = props => {
276
260
  return styled.css(["border-color:", ";background-color:", ";color:", ";&:hover{border-color:", ";}", " &[aria-disabled='true']{border-color:", ";background-color:", ";color:", ";}"], props.isLabelHovered ? hoverBorderColor : borderColor, backgroundColor, reactTheming.getColorV8('foreground', 600 , props.theme), hoverBorderColor, reactTheming.focusStyles({
277
261
  theme: props.theme,
278
262
  inset: props.focusInset,
279
- hue: focusBorderColor,
280
- shade: focusShade,
263
+ color: {
264
+ hue: focusBorderColor,
265
+ shade: focusShade
266
+ },
281
267
  selector: focusSelector,
282
268
  styles: {
283
269
  borderColor: focusBorderColor
@@ -307,7 +293,7 @@ const sizeStyles$7 = props => {
307
293
  };
308
294
  const StyledTrigger = styled__default.default.div.attrs({
309
295
  'data-garden-id': COMPONENT_ID$m,
310
- 'data-garden-version': '9.0.0-next.7'
296
+ 'data-garden-version': '9.0.0-next.8'
311
297
  }).withConfig({
312
298
  displayName: "StyledTrigger",
313
299
  componentId: "sc-116nftk-0"
@@ -349,7 +335,7 @@ const StyledInputIcon = styled__default.default(_ref => {
349
335
  return React.cloneElement(React.Children.only(children), props);
350
336
  }).attrs({
351
337
  'data-garden-id': COMPONENT_ID$l,
352
- 'data-garden-version': '9.0.0-next.7'
338
+ 'data-garden-version': '9.0.0-next.8'
353
339
  }).withConfig({
354
340
  displayName: "StyledInputIcon",
355
341
  componentId: "sc-gqbs1s-0"
@@ -386,7 +372,7 @@ const sizeStyles$5 = props => {
386
372
  };
387
373
  const StyledOption = styled__default.default.li.attrs({
388
374
  'data-garden-id': COMPONENT_ID$k,
389
- 'data-garden-version': '9.0.0-next.7'
375
+ 'data-garden-version': '9.0.0-next.8'
390
376
  }).withConfig({
391
377
  displayName: "StyledOption",
392
378
  componentId: "sc-jl4wn6-0"
@@ -398,7 +384,7 @@ StyledOption.defaultProps = {
398
384
  const COMPONENT_ID$j = 'dropdowns.combobox.option.content';
399
385
  const StyledOptionContent = styled__default.default.div.attrs({
400
386
  'data-garden-id': COMPONENT_ID$j,
401
- 'data-garden-version': '9.0.0-next.7'
387
+ 'data-garden-version': '9.0.0-next.8'
402
388
  }).withConfig({
403
389
  displayName: "StyledOptionContent",
404
390
  componentId: "sc-121ujpu-0"
@@ -410,7 +396,7 @@ StyledOptionContent.defaultProps = {
410
396
  const COMPONENT_ID$i = 'dropdowns.combobox.optgroup';
411
397
  const StyledOptGroup = styled__default.default.ul.attrs({
412
398
  'data-garden-id': COMPONENT_ID$i,
413
- 'data-garden-version': '9.0.0-next.7'
399
+ 'data-garden-version': '9.0.0-next.8'
414
400
  }).withConfig({
415
401
  displayName: "StyledOptGroup",
416
402
  componentId: "sc-1kavqsx-0"
@@ -431,7 +417,7 @@ const sizeStyles$4 = props => {
431
417
  };
432
418
  const StyledListboxSeparator = styled__default.default.li.attrs({
433
419
  'data-garden-id': COMPONENT_ID$h,
434
- 'data-garden-version': '9.0.0-next.7'
420
+ 'data-garden-version': '9.0.0-next.8'
435
421
  }).withConfig({
436
422
  displayName: "StyledListboxSeparator",
437
423
  componentId: "sc-1p6toh2-0"
@@ -448,7 +434,7 @@ const sizeStyles$3 = props => {
448
434
  };
449
435
  const StyledListbox = styled__default.default.ul.attrs({
450
436
  'data-garden-id': COMPONENT_ID$g,
451
- 'data-garden-version': '9.0.0-next.7'
437
+ 'data-garden-version': '9.0.0-next.8'
452
438
  }).withConfig({
453
439
  displayName: "StyledListbox",
454
440
  componentId: "sc-1k13ba7-0"
@@ -473,7 +459,7 @@ const StyledOptionIcon = styled__default.default(_ref => {
473
459
  return React.cloneElement(React.Children.only(children), props);
474
460
  }).attrs({
475
461
  'data-garden-id': COMPONENT_ID$f,
476
- 'data-garden-version': '9.0.0-next.7'
462
+ 'data-garden-version': '9.0.0-next.8'
477
463
  }).withConfig({
478
464
  displayName: "StyledOptionIcon",
479
465
  componentId: "sc-qsab3y-0"
@@ -494,7 +480,7 @@ const sizeStyles$1 = props => {
494
480
  };
495
481
  const StyledOptionMeta = styled__default.default.div.attrs({
496
482
  'data-garden-id': COMPONENT_ID$e,
497
- 'data-garden-version': '9.0.0-next.7'
483
+ 'data-garden-version': '9.0.0-next.8'
498
484
  }).withConfig({
499
485
  displayName: "StyledOptionMeta",
500
486
  componentId: "sc-j6pu10-0"
@@ -539,7 +525,7 @@ const StyledOptionTypeIcon = styled__default.default(_ref => {
539
525
  return React.cloneElement(React.Children.only(children), props);
540
526
  }).attrs({
541
527
  'data-garden-id': COMPONENT_ID$d,
542
- 'data-garden-version': '9.0.0-next.7'
528
+ 'data-garden-version': '9.0.0-next.8'
543
529
  }).withConfig({
544
530
  displayName: "StyledOptionTypeIcon",
545
531
  componentId: "sc-xpink2-0"
@@ -551,7 +537,7 @@ StyledOptionTypeIcon.defaultProps = {
551
537
  const COMPONENT_ID$c = 'dropdowns.combobox.tag';
552
538
  const StyledTag = styled__default.default(reactTags.Tag).attrs({
553
539
  'data-garden-id': COMPONENT_ID$c,
554
- 'data-garden-version': '9.0.0-next.7'
540
+ 'data-garden-version': '9.0.0-next.8'
555
541
  }).withConfig({
556
542
  displayName: "StyledTag",
557
543
  componentId: "sc-1alam0r-0"
@@ -567,7 +553,7 @@ const colorStyles$1 = props => {
567
553
  };
568
554
  const StyledValue = styled__default.default.div.attrs({
569
555
  'data-garden-id': COMPONENT_ID$b,
570
- 'data-garden-version': '9.0.0-next.7'
556
+ 'data-garden-version': '9.0.0-next.8'
571
557
  }).withConfig({
572
558
  displayName: "StyledValue",
573
559
  componentId: "sc-t719sx-0"
@@ -589,7 +575,7 @@ const colorStyles = props => {
589
575
  const StyledTagsButton = styled__default.default(StyledValue).attrs({
590
576
  as: 'button',
591
577
  'data-garden-id': COMPONENT_ID$a,
592
- 'data-garden-version': '9.0.0-next.7'
578
+ 'data-garden-version': '9.0.0-next.8'
593
579
  }).withConfig({
594
580
  displayName: "StyledTagsButton",
595
581
  componentId: "sc-6q5w33-0"
@@ -601,7 +587,7 @@ StyledTagsButton.defaultProps = {
601
587
  const COMPONENT_ID$9 = 'dropdowns.menu';
602
588
  const StyledMenu = styled__default.default(StyledListbox).attrs({
603
589
  'data-garden-id': COMPONENT_ID$9,
604
- 'data-garden-version': '9.0.0-next.7'
590
+ 'data-garden-version': '9.0.0-next.8'
605
591
  }).withConfig({
606
592
  displayName: "StyledMenu",
607
593
  componentId: "sc-f77ntu-0"
@@ -617,7 +603,7 @@ StyledMenu.defaultProps = {
617
603
  const COMPONENT_ID$8 = 'dropdowns.menu.floating';
618
604
  const StyledFloatingMenu = styled__default.default(StyledFloatingListbox).attrs({
619
605
  'data-garden-id': COMPONENT_ID$8,
620
- 'data-garden-version': '9.0.0-next.7'
606
+ 'data-garden-version': '9.0.0-next.8'
621
607
  }).withConfig({
622
608
  displayName: "StyledFloatingMenu",
623
609
  componentId: "sc-1rc7ahb-0"
@@ -629,7 +615,7 @@ StyledFloatingMenu.defaultProps = {
629
615
  const COMPONENT_ID$7 = 'dropdowns.menu.item';
630
616
  const StyledItem = styled__default.default(StyledOption).attrs({
631
617
  'data-garden-id': COMPONENT_ID$7,
632
- 'data-garden-version': '9.0.0-next.7'
618
+ 'data-garden-version': '9.0.0-next.8'
633
619
  }).withConfig({
634
620
  displayName: "StyledItem",
635
621
  componentId: "sc-1jp99dq-0"
@@ -641,7 +627,7 @@ StyledItem.defaultProps = {
641
627
  const COMPONENT_ID$6 = 'dropdowns.menu.item.content';
642
628
  const StyledItemContent = styled__default.default(StyledOptionContent).attrs({
643
629
  'data-garden-id': COMPONENT_ID$6,
644
- 'data-garden-version': '9.0.0-next.7'
630
+ 'data-garden-version': '9.0.0-next.8'
645
631
  }).withConfig({
646
632
  displayName: "StyledItemContent",
647
633
  componentId: "sc-1opglsb-0"
@@ -653,7 +639,7 @@ StyledItemContent.defaultProps = {
653
639
  const COMPONENT_ID$5 = 'dropdowns.menu.item_group';
654
640
  const StyledItemGroup = styled__default.default(StyledOptGroup).attrs({
655
641
  'data-garden-id': COMPONENT_ID$5,
656
- 'data-garden-version': '9.0.0-next.7'
642
+ 'data-garden-version': '9.0.0-next.8'
657
643
  }).withConfig({
658
644
  displayName: "StyledItemGroup",
659
645
  componentId: "sc-1umk3cg-0"
@@ -665,7 +651,7 @@ StyledItemGroup.defaultProps = {
665
651
  const COMPONENT_ID$4 = 'dropdowns.menu.item.icon';
666
652
  const StyledItemIcon = styled__default.default(StyledOptionIcon).attrs({
667
653
  'data-garden-id': COMPONENT_ID$4,
668
- 'data-garden-version': '9.0.0-next.7'
654
+ 'data-garden-version': '9.0.0-next.8'
669
655
  }).withConfig({
670
656
  displayName: "StyledItemIcon",
671
657
  componentId: "sc-w9orqb-0"
@@ -677,7 +663,7 @@ StyledItemIcon.defaultProps = {
677
663
  const COMPONENT_ID$3 = 'dropdowns.menu.item.meta';
678
664
  const StyledItemMeta = styled__default.default(StyledOptionMeta).attrs({
679
665
  'data-garden-id': COMPONENT_ID$3,
680
- 'data-garden-version': '9.0.0-next.7'
666
+ 'data-garden-version': '9.0.0-next.8'
681
667
  }).withConfig({
682
668
  displayName: "StyledItemMeta",
683
669
  componentId: "sc-1unw3x1-0"
@@ -689,7 +675,7 @@ StyledItemMeta.defaultProps = {
689
675
  const COMPONENT_ID$2 = 'dropdowns.menu.item.type_icon';
690
676
  const StyledItemTypeIcon = styled__default.default(StyledOptionTypeIcon).attrs({
691
677
  'data-garden-id': COMPONENT_ID$2,
692
- 'data-garden-version': '9.0.0-next.7'
678
+ 'data-garden-version': '9.0.0-next.8'
693
679
  }).withConfig({
694
680
  displayName: "StyledItemTypeIcon",
695
681
  componentId: "sc-1pll3nu-0"
@@ -701,7 +687,7 @@ StyledItemTypeIcon.defaultProps = {
701
687
  const COMPONENT_ID$1 = 'dropdowns.menu.button';
702
688
  const StyledButton = styled__default.default(reactButtons.Button).attrs({
703
689
  'data-garden-id': COMPONENT_ID$1,
704
- 'data-garden-version': '9.0.0-next.7'
690
+ 'data-garden-version': '9.0.0-next.8'
705
691
  }).withConfig({
706
692
  displayName: "StyledButton",
707
693
  componentId: "sc-5hs2jg-0"
@@ -713,7 +699,7 @@ StyledButton.defaultProps = {
713
699
  const COMPONENT_ID = 'dropdowns.menu.separator';
714
700
  const StyledSeparator = styled__default.default(StyledListboxSeparator).attrs({
715
701
  'data-garden-id': COMPONENT_ID,
716
- 'data-garden-version': '9.0.0-next.7'
702
+ 'data-garden-version': '9.0.0-next.8'
717
703
  }).withConfig({
718
704
  displayName: "StyledSeparator",
719
705
  componentId: "sc-8kqwen-0"
@@ -807,7 +793,7 @@ const Listbox = React.forwardRef((_ref, ref) => {
807
793
  },
808
794
  zIndex: zIndex,
809
795
  ref: floatingRef
810
- }, React__namespace.default.createElement(StyledListbox, _extends$5({
796
+ }, React__namespace.default.createElement(StyledListbox, Object.assign({
811
797
  isCompact: isCompact,
812
798
  maxHeight: maxHeight,
813
799
  minHeight: minHeight,
@@ -857,7 +843,7 @@ const TagComponent = React.forwardRef((_ref, ref) => {
857
843
  const theme = React.useContext(styled.ThemeContext) || reactTheming.DEFAULT_THEME;
858
844
  const doc = reactTheming.useDocument(theme);
859
845
  const handleClick = () => removeSelection(option.value);
860
- return React__namespace.default.createElement(StyledTag, _extends$5({
846
+ return React__namespace.default.createElement(StyledTag, Object.assign({
861
847
  "aria-disabled": option.disabled,
862
848
  tabIndex: option.disabled ? undefined : 0
863
849
  }, tagProps, props, {
@@ -897,7 +883,7 @@ const TagGroup = _ref => {
897
883
  } = _ref;
898
884
  return React__namespace.default.createElement(React__namespace.default.Fragment, null, selection.map((option, index) => {
899
885
  const disabled = isDisabled || option.disabled;
900
- return React__namespace.default.createElement(Tag, _extends$5({
886
+ return React__namespace.default.createElement(Tag, Object.assign({
901
887
  key: option.value,
902
888
  hidden: !isExpanded && index >= maxTags,
903
889
  option: {
@@ -1126,7 +1112,7 @@ const Combobox = React.forwardRef((_ref, ref) => {
1126
1112
  }, [getMessageProps, messageProps, setMessageProps]);
1127
1113
  return React__namespace.default.createElement(ComboboxContext.Provider, {
1128
1114
  value: contextValue
1129
- }, React__namespace.default.createElement(StyledCombobox, _extends$5({
1115
+ }, React__namespace.default.createElement(StyledCombobox, Object.assign({
1130
1116
  isCompact: isCompact,
1131
1117
  tabIndex: -1
1132
1118
  }, props, {
@@ -1166,7 +1152,7 @@ const Combobox = React.forwardRef((_ref, ref) => {
1166
1152
  isEnd: true,
1167
1153
  isLabelHovered: isLabelHovered,
1168
1154
  isRotated: hasChevron && isExpanded
1169
- }, hasChevron ? React__namespace.default.createElement(SvgChevronDownStroke, null) : endIcon))), React__namespace.default.createElement(Listbox, _extends$5({
1155
+ }, hasChevron ? React__namespace.default.createElement(SvgChevronDownStroke, null) : endIcon))), React__namespace.default.createElement(Listbox, Object.assign({
1170
1156
  appendToNode: listboxAppendToNode,
1171
1157
  isCompact: isCompact,
1172
1158
  isExpanded: isExpanded,
@@ -1224,7 +1210,7 @@ const Hint = React.forwardRef((props, ref) => {
1224
1210
  setHasHint(true);
1225
1211
  return () => setHasHint(false);
1226
1212
  }, [setHasHint]);
1227
- return React__namespace.default.createElement(StyledHint, _extends$5({}, hintProps, props, {
1213
+ return React__namespace.default.createElement(StyledHint, Object.assign({}, hintProps, props, {
1228
1214
  ref: ref
1229
1215
  }));
1230
1216
  });
@@ -1240,7 +1226,7 @@ const Label = React.forwardRef((_ref, ref) => {
1240
1226
  const {
1241
1227
  labelProps
1242
1228
  } = useFieldContext();
1243
- return React__namespace.default.createElement(StyledLabel, _extends$5({}, labelProps, {
1229
+ return React__namespace.default.createElement(StyledLabel, Object.assign({}, labelProps, {
1244
1230
  onClick: containerUtilities.composeEventHandlers(onClick, labelProps?.onClick),
1245
1231
  onMouseEnter: containerUtilities.composeEventHandlers(onMouseEnter, labelProps?.onMouseEnter),
1246
1232
  onMouseLeave: containerUtilities.composeEventHandlers(onMouseLeave, labelProps?.onMouseLeave)
@@ -1263,7 +1249,7 @@ const Message = React.forwardRef((props, ref) => {
1263
1249
  setHasMessage(true);
1264
1250
  return () => setHasMessage(false);
1265
1251
  }, [setHasMessage]);
1266
- return React__namespace.default.createElement(StyledMessage, _extends$5({}, messageProps, props, {
1252
+ return React__namespace.default.createElement(StyledMessage, Object.assign({}, messageProps, props, {
1267
1253
  ref: ref
1268
1254
  }));
1269
1255
  });
@@ -1293,7 +1279,7 @@ const FieldComponent = React.forwardRef((props, ref) => {
1293
1279
  }), [labelProps, setLabelProps, hasHint, setHasHint, hintProps, setHintProps, hasMessage, setHasMessage, messageProps, setMessageProps]);
1294
1280
  return React__namespace.default.createElement(FieldContext.Provider, {
1295
1281
  value: contextValue
1296
- }, React__namespace.default.createElement(StyledField, _extends$5({}, props, {
1282
+ }, React__namespace.default.createElement(StyledField, Object.assign({}, props, {
1297
1283
  ref: ref
1298
1284
  })));
1299
1285
  });
@@ -1387,7 +1373,7 @@ const OptionMetaComponent = React.forwardRef((props, ref) => {
1387
1373
  const {
1388
1374
  isDisabled
1389
1375
  } = useOptionContext();
1390
- return React__namespace.default.createElement(StyledOptionMeta, _extends$5({
1376
+ return React__namespace.default.createElement(StyledOptionMeta, Object.assign({
1391
1377
  isDisabled: isDisabled
1392
1378
  }, props, {
1393
1379
  ref: ref
@@ -1454,7 +1440,7 @@ const OptionComponent = React.forwardRef((_ref, ref) => {
1454
1440
  });
1455
1441
  return React__namespace.default.createElement(OptionContext.Provider, {
1456
1442
  value: contextValue
1457
- }, React__namespace.default.createElement(StyledOption, _extends$5({
1443
+ }, React__namespace.default.createElement(StyledOption, Object.assign({
1458
1444
  isActive: isActive,
1459
1445
  isCompact: isCompact,
1460
1446
  $type: type
@@ -1498,7 +1484,7 @@ const OptGroup = React.forwardRef((_ref, ref) => {
1498
1484
  const optGroupProps = getOptGroupProps({
1499
1485
  'aria-label': groupAriaLabel || legend
1500
1486
  });
1501
- return React__namespace.default.createElement(StyledOption, _extends$5({
1487
+ return React__namespace.default.createElement(StyledOption, Object.assign({
1502
1488
  isCompact: isCompact,
1503
1489
  $type: "group",
1504
1490
  onMouseDown: containerUtilities.composeEventHandlers(onMouseDown, handleMouseDown),
@@ -1512,7 +1498,7 @@ const OptGroup = React.forwardRef((_ref, ref) => {
1512
1498
  }, icon && React__namespace.default.createElement(StyledOptionTypeIcon, {
1513
1499
  isCompact: isCompact,
1514
1500
  type: "header"
1515
- }, icon), content || legend), React__namespace.default.createElement(StyledOptGroup, _extends$5({
1501
+ }, icon), content || legend), React__namespace.default.createElement(StyledOptGroup, Object.assign({
1516
1502
  isCompact: isCompact
1517
1503
  }, optGroupProps), React__namespace.default.createElement(StyledListboxSeparator, {
1518
1504
  role: "none"
@@ -1671,7 +1657,7 @@ const MenuList = React.forwardRef((_ref, ref) => {
1671
1657
  transform
1672
1658
  },
1673
1659
  ref: floatingRef
1674
- }, React__namespace.default.createElement(StyledMenu, _extends$5({
1660
+ }, React__namespace.default.createElement(StyledMenu, Object.assign({
1675
1661
  "data-garden-animate-arrow": isVisible,
1676
1662
  arrowPosition: hasArrow ? reactTheming.getArrowPosition(theme, placement) : undefined,
1677
1663
  isCompact: isCompact,
@@ -1775,7 +1761,7 @@ const Menu = React.forwardRef((_ref, ref) => {
1775
1761
  }), [isCompact, focusedValue, getItemProps, getItemGroupProps, getSeparatorProps]);
1776
1762
  return React__namespace.default.createElement(MenuContext.Provider, {
1777
1763
  value: contextValue
1778
- }, trigger, React__namespace.default.createElement(MenuList, _extends$5({}, props, getMenuProps({
1764
+ }, trigger, React__namespace.default.createElement(MenuList, Object.assign({}, props, getMenuProps({
1779
1765
  onMouseLeave
1780
1766
  }), {
1781
1767
  ref: reactMergeRefs.mergeRefs([menuRef, ref]),
@@ -1839,7 +1825,7 @@ const ItemGroup = React.forwardRef((_ref, ref) => {
1839
1825
  }), [type]);
1840
1826
  return React__namespace.default.createElement(ItemGroupContext.Provider, {
1841
1827
  value: contextValue
1842
- }, React__namespace.default.createElement(StyledItem, _extends$5({
1828
+ }, React__namespace.default.createElement(StyledItem, Object.assign({
1843
1829
  isCompact: isCompact,
1844
1830
  $type: "group"
1845
1831
  }, props, {
@@ -1851,7 +1837,7 @@ const ItemGroup = React.forwardRef((_ref, ref) => {
1851
1837
  }, icon && React__namespace.default.createElement(StyledItemTypeIcon, {
1852
1838
  isCompact: isCompact,
1853
1839
  type: "header"
1854
- }, icon), content || legend), React__namespace.default.createElement(StyledItemGroup, _extends$5({
1840
+ }, icon), content || legend), React__namespace.default.createElement(StyledItemGroup, Object.assign({
1855
1841
  isCompact: isCompact
1856
1842
  }, groupProps), React__namespace.default.createElement(StyledSeparator, {
1857
1843
  role: "none"
@@ -1878,7 +1864,7 @@ const ItemMetaComponent = React.forwardRef((props, ref) => {
1878
1864
  const {
1879
1865
  isDisabled
1880
1866
  } = useItemContext();
1881
- return React__namespace.default.createElement(StyledItemMeta, _extends$5({
1867
+ return React__namespace.default.createElement(StyledItemMeta, Object.assign({
1882
1868
  isDisabled: isDisabled
1883
1869
  }, props, {
1884
1870
  ref: ref
@@ -1950,7 +1936,7 @@ const ItemComponent = React.forwardRef((_ref, ref) => {
1950
1936
  }), [isDisabled]);
1951
1937
  return React__namespace.default.createElement(ItemContext.Provider, {
1952
1938
  value: contextValue
1953
- }, React__namespace.default.createElement(StyledItem, _extends$5({
1939
+ }, React__namespace.default.createElement(StyledItem, Object.assign({
1954
1940
  $type: type,
1955
1941
  isCompact: isCompact,
1956
1942
  isActive: isActive
@@ -1984,7 +1970,7 @@ const Separator = React.forwardRef(
1984
1970
  getSeparatorProps
1985
1971
  } = useMenuContext();
1986
1972
  const separatorProps = getSeparatorProps();
1987
- return React__namespace.default.createElement(StyledSeparator, _extends$5({}, props, separatorProps, {
1973
+ return React__namespace.default.createElement(StyledSeparator, Object.assign({}, props, separatorProps, {
1988
1974
  ref: ref
1989
1975
  }));
1990
1976
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zendeskgarden/react-dropdowns",
3
- "version": "9.0.0-next.7",
3
+ "version": "9.0.0-next.8",
4
4
  "description": "Components related to dropdowns in the Garden Design System",
5
5
  "license": "Apache-2.0",
6
6
  "author": "Zendesk Garden <garden@zendesk.com>",
@@ -10,7 +10,7 @@
10
10
  "url": "https://github.com/zendeskgarden/react-components/issues"
11
11
  },
12
12
  "main": "dist/index.cjs.js",
13
- "module": "dist/index.esm.js",
13
+ "module": "dist/esm/index.js",
14
14
  "files": [
15
15
  "dist"
16
16
  ],
@@ -25,22 +25,22 @@
25
25
  "@zendeskgarden/container-combobox": "^2.0.0",
26
26
  "@zendeskgarden/container-menu": "^0.3.0",
27
27
  "@zendeskgarden/container-utilities": "^2.0.0",
28
- "@zendeskgarden/react-buttons": "^9.0.0-next.7",
29
- "@zendeskgarden/react-forms": "^9.0.0-next.7",
30
- "@zendeskgarden/react-tags": "^9.0.0-next.7",
31
- "@zendeskgarden/react-tooltips": "^9.0.0-next.7",
28
+ "@zendeskgarden/react-buttons": "^9.0.0-next.8",
29
+ "@zendeskgarden/react-forms": "^9.0.0-next.8",
30
+ "@zendeskgarden/react-tags": "^9.0.0-next.8",
31
+ "@zendeskgarden/react-tooltips": "^9.0.0-next.8",
32
32
  "polished": "^4.0.0",
33
33
  "prop-types": "^15.7.2",
34
34
  "react-merge-refs": "^2.0.0"
35
35
  },
36
36
  "peerDependencies": {
37
- "@zendeskgarden/react-theming": "^9.0.0",
37
+ "@zendeskgarden/react-theming": ">=9.0.0-next",
38
38
  "react": ">=16.8.0",
39
39
  "react-dom": ">=16.8.0",
40
40
  "styled-components": "^5.3.1"
41
41
  },
42
42
  "devDependencies": {
43
- "@zendeskgarden/react-theming": "^9.0.0-next.7",
43
+ "@zendeskgarden/react-theming": "^9.0.0-next.8",
44
44
  "@zendeskgarden/svg-icons": "7.0.0"
45
45
  },
46
46
  "keywords": [
@@ -54,5 +54,5 @@
54
54
  "access": "public"
55
55
  },
56
56
  "zendeskgarden:src": "src/index.ts",
57
- "gitHead": "50a2b45b2e237a490a6d460818d33498b92479ec"
57
+ "gitHead": "a3d6534843d5a4f5cb60b52bc67264f3230f2da0"
58
58
  }