@zendeskgarden/react-chrome 8.47.2 → 8.48.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs.js +138 -89
- package/dist/index.esm.js +136 -87
- package/dist/typings/elements/Chrome.d.ts +1 -2
- package/dist/typings/elements/SkipNav.d.ts +1 -2
- package/dist/typings/elements/body/Body.d.ts +3 -4
- package/dist/typings/elements/header/Header.d.ts +6 -3
- package/dist/typings/elements/header/HeaderItem.d.ts +15 -4
- package/dist/typings/elements/header/HeaderItemIcon.d.ts +3 -3
- package/dist/typings/elements/header/HeaderItemText.d.ts +6 -3
- package/dist/typings/elements/header/HeaderItemWrapper.d.ts +10 -3
- package/dist/typings/elements/nav/Nav.d.ts +1 -2
- package/dist/typings/elements/nav/NavItemIcon.d.ts +3 -3
- package/dist/typings/elements/nav/NavItemText.d.ts +6 -3
- package/dist/typings/elements/sheet/Sheet.d.ts +17 -19
- package/dist/typings/elements/sheet/components/Body.d.ts +4 -1
- package/dist/typings/elements/sheet/components/Close.d.ts +4 -1
- package/dist/typings/elements/sheet/components/Description.d.ts +4 -1
- package/dist/typings/elements/sheet/components/Footer.d.ts +9 -3
- package/dist/typings/elements/sheet/components/FooterItem.d.ts +4 -1
- package/dist/typings/elements/sheet/components/Header.d.ts +4 -1
- package/dist/typings/elements/sheet/components/Title.d.ts +4 -1
- package/dist/typings/elements/subnav/CollapsibleSubNavItem.d.ts +1 -1
- package/dist/typings/elements/subnav/SubNavItem.d.ts +3 -4
- package/dist/typings/elements/subnav/SubNavItemText.d.ts +9 -3
- package/dist/typings/index.d.ts +12 -1
- package/dist/typings/styled/header/StyledBaseHeaderItem.d.ts +0 -3
- package/dist/typings/styled/header/StyledHeader.d.ts +0 -1
- package/dist/typings/styled/header/StyledHeaderItemText.d.ts +0 -1
- package/dist/typings/styled/header/StyledLogoHeaderItem.d.ts +0 -5
- package/dist/typings/styled/nav/StyledNavItemText.d.ts +0 -2
- package/dist/typings/styled/sheet/StyledSheetClose.d.ts +5 -0
- package/dist/typings/styled/sheet/StyledSheetHeader.d.ts +4 -1
- package/dist/typings/styled/subnav/StyledSubNavItemText.d.ts +0 -4
- package/dist/typings/utils/useSheetContext.d.ts +2 -0
- package/package.json +3 -3
package/dist/index.cjs.js
CHANGED
|
@@ -209,7 +209,7 @@ var useChromeContext = function useChromeContext() {
|
|
|
209
209
|
var COMPONENT_ID$A = 'chrome.chrome';
|
|
210
210
|
var StyledChrome = styled__default["default"].div.attrs({
|
|
211
211
|
'data-garden-id': COMPONENT_ID$A,
|
|
212
|
-
'data-garden-version': '8.
|
|
212
|
+
'data-garden-version': '8.48.0'
|
|
213
213
|
}).withConfig({
|
|
214
214
|
displayName: "StyledChrome",
|
|
215
215
|
componentId: "sc-1uqm6u6-0"
|
|
@@ -227,7 +227,7 @@ StyledChrome.defaultProps = {
|
|
|
227
227
|
var COMPONENT_ID$z = 'chrome.header_item_icon';
|
|
228
228
|
var StyledHeaderItemIcon = styled__default["default"].div.attrs({
|
|
229
229
|
'data-garden-id': COMPONENT_ID$z,
|
|
230
|
-
'data-garden-version': '8.
|
|
230
|
+
'data-garden-version': '8.48.0'
|
|
231
231
|
}).withConfig({
|
|
232
232
|
displayName: "StyledHeaderItemIcon",
|
|
233
233
|
componentId: "sc-1jhhp6z-0"
|
|
@@ -254,7 +254,7 @@ var sizeStyles$4 = function sizeStyles(props) {
|
|
|
254
254
|
};
|
|
255
255
|
var StyledBaseHeaderItem = styled__default["default"].button.attrs({
|
|
256
256
|
'data-garden-id': COMPONENT_ID$y,
|
|
257
|
-
'data-garden-version': '8.
|
|
257
|
+
'data-garden-version': '8.48.0'
|
|
258
258
|
}).withConfig({
|
|
259
259
|
displayName: "StyledBaseHeaderItem",
|
|
260
260
|
componentId: "sc-1qua7h6-0"
|
|
@@ -283,7 +283,7 @@ var COMPONENT_ID$x = 'chrome.header_item_text';
|
|
|
283
283
|
var clippedStyling = styled.css(["position:absolute;margin:0;clip:rect(1px,1px,1px,1px);width:1px;height:1px;overflow:hidden;white-space:nowrap;"]);
|
|
284
284
|
var StyledHeaderItemText = styled__default["default"].span.attrs({
|
|
285
285
|
'data-garden-id': COMPONENT_ID$x,
|
|
286
|
-
'data-garden-version': '8.
|
|
286
|
+
'data-garden-version': '8.48.0'
|
|
287
287
|
}).withConfig({
|
|
288
288
|
displayName: "StyledHeaderItemText",
|
|
289
289
|
componentId: "sc-goz7la-0"
|
|
@@ -311,7 +311,7 @@ var getExpandedNavWidth = function getExpandedNavWidth() {
|
|
|
311
311
|
};
|
|
312
312
|
var StyledNav = styled__default["default"].nav.attrs({
|
|
313
313
|
'data-garden-id': COMPONENT_ID$w,
|
|
314
|
-
'data-garden-version': '8.
|
|
314
|
+
'data-garden-version': '8.48.0'
|
|
315
315
|
}).withConfig({
|
|
316
316
|
displayName: "StyledNav",
|
|
317
317
|
componentId: "sc-6j462r-0"
|
|
@@ -351,7 +351,7 @@ var retrieveProductColor$1 = function retrieveProductColor(props) {
|
|
|
351
351
|
};
|
|
352
352
|
var StyledLogoHeaderItem = styled__default["default"](StyledBaseHeaderItem).attrs({
|
|
353
353
|
'data-garden-id': COMPONENT_ID$v,
|
|
354
|
-
'data-garden-version': '8.
|
|
354
|
+
'data-garden-version': '8.48.0',
|
|
355
355
|
as: 'div'
|
|
356
356
|
}).withConfig({
|
|
357
357
|
displayName: "StyledLogoHeaderItem",
|
|
@@ -392,7 +392,7 @@ var sizeStyles$3 = function sizeStyles(props) {
|
|
|
392
392
|
};
|
|
393
393
|
var StyledBaseNavItem = styled__default["default"].button.attrs({
|
|
394
394
|
'data-garden-id': COMPONENT_ID$u,
|
|
395
|
-
'data-garden-version': '8.
|
|
395
|
+
'data-garden-version': '8.48.0'
|
|
396
396
|
}).withConfig({
|
|
397
397
|
displayName: "StyledBaseNavItem",
|
|
398
398
|
componentId: "sc-zvo43f-0"
|
|
@@ -409,7 +409,7 @@ var getHeaderHeight = function getHeaderHeight(props) {
|
|
|
409
409
|
};
|
|
410
410
|
var StyledHeader = styled__default["default"].header.attrs({
|
|
411
411
|
'data-garden-id': COMPONENT_ID$t,
|
|
412
|
-
'data-garden-version': '8.
|
|
412
|
+
'data-garden-version': '8.48.0'
|
|
413
413
|
}).withConfig({
|
|
414
414
|
displayName: "StyledHeader",
|
|
415
415
|
componentId: "sc-1cexpz-0"
|
|
@@ -457,7 +457,7 @@ var sizeStyles$2 = function sizeStyles(props) {
|
|
|
457
457
|
};
|
|
458
458
|
var StyledSkipNav = styled__default["default"].a.attrs({
|
|
459
459
|
'data-garden-id': COMPONENT_ID$s,
|
|
460
|
-
'data-garden-version': '8.
|
|
460
|
+
'data-garden-version': '8.48.0'
|
|
461
461
|
}).withConfig({
|
|
462
462
|
displayName: "StyledSkipNav",
|
|
463
463
|
componentId: "sc-1tsro34-0"
|
|
@@ -506,7 +506,7 @@ var sizeStyles$1 = function sizeStyles(theme) {
|
|
|
506
506
|
};
|
|
507
507
|
var StyledSkipNavIcon = styled__default["default"](SvgLinkStroke).attrs({
|
|
508
508
|
'data-garden-id': COMPONENT_ID$r,
|
|
509
|
-
'data-garden-version': '8.
|
|
509
|
+
'data-garden-version': '8.48.0'
|
|
510
510
|
}).withConfig({
|
|
511
511
|
displayName: "StyledSkipNavIcon",
|
|
512
512
|
componentId: "sc-1ika5z4-0"
|
|
@@ -526,7 +526,7 @@ StyledSkipNavIcon.defaultProps = {
|
|
|
526
526
|
var COMPONENT_ID$q = 'chrome.body';
|
|
527
527
|
var StyledBody = styled__default["default"].div.attrs({
|
|
528
528
|
'data-garden-id': COMPONENT_ID$q,
|
|
529
|
-
'data-garden-version': '8.
|
|
529
|
+
'data-garden-version': '8.48.0'
|
|
530
530
|
}).withConfig({
|
|
531
531
|
displayName: "StyledBody",
|
|
532
532
|
componentId: "sc-c7h9kv-0"
|
|
@@ -545,7 +545,7 @@ var getFooterHeight = function getFooterHeight(props) {
|
|
|
545
545
|
};
|
|
546
546
|
var StyledFooter = styled__default["default"].footer.attrs({
|
|
547
547
|
'data-garden-id': COMPONENT_ID$p,
|
|
548
|
-
'data-garden-version': '8.
|
|
548
|
+
'data-garden-version': '8.48.0'
|
|
549
549
|
}).withConfig({
|
|
550
550
|
displayName: "StyledFooter",
|
|
551
551
|
componentId: "sc-v7lib2-0"
|
|
@@ -565,7 +565,7 @@ StyledFooter.defaultProps = {
|
|
|
565
565
|
var COMPONENT_ID$o = 'chrome.content';
|
|
566
566
|
var StyledContent = styled__default["default"].div.attrs({
|
|
567
567
|
'data-garden-id': COMPONENT_ID$o,
|
|
568
|
-
'data-garden-version': '8.
|
|
568
|
+
'data-garden-version': '8.48.0'
|
|
569
569
|
}).withConfig({
|
|
570
570
|
displayName: "StyledContent",
|
|
571
571
|
componentId: "sc-qcuzxn-0"
|
|
@@ -587,7 +587,7 @@ StyledContent.defaultProps = {
|
|
|
587
587
|
var COMPONENT_ID$n = 'chrome.main';
|
|
588
588
|
var StyledMain = styled__default["default"].main.attrs({
|
|
589
589
|
'data-garden-id': COMPONENT_ID$n,
|
|
590
|
-
'data-garden-version': '8.
|
|
590
|
+
'data-garden-version': '8.48.0'
|
|
591
591
|
}).withConfig({
|
|
592
592
|
displayName: "StyledMain",
|
|
593
593
|
componentId: "sc-t61cre-0"
|
|
@@ -603,7 +603,7 @@ StyledMain.defaultProps = {
|
|
|
603
603
|
var COMPONENT_ID$m = 'chrome.sidebar';
|
|
604
604
|
var StyledSidebar = styled__default["default"].aside.attrs({
|
|
605
605
|
'data-garden-id': COMPONENT_ID$m,
|
|
606
|
-
'data-garden-version': '8.
|
|
606
|
+
'data-garden-version': '8.48.0'
|
|
607
607
|
}).withConfig({
|
|
608
608
|
displayName: "StyledSidebar",
|
|
609
609
|
componentId: "sc-1q77fuw-0"
|
|
@@ -621,7 +621,7 @@ StyledSidebar.defaultProps = {
|
|
|
621
621
|
var COMPONENT_ID$l = 'chrome.footer_item';
|
|
622
622
|
var StyledFooterItem = styled__default["default"].div.attrs({
|
|
623
623
|
'data-garden-id': COMPONENT_ID$l,
|
|
624
|
-
'data-garden-version': '8.
|
|
624
|
+
'data-garden-version': '8.48.0'
|
|
625
625
|
}).withConfig({
|
|
626
626
|
displayName: "StyledFooterItem",
|
|
627
627
|
componentId: "sc-1cktm85-0"
|
|
@@ -641,7 +641,7 @@ var imgStyles = function imgStyles(props) {
|
|
|
641
641
|
};
|
|
642
642
|
var StyledHeaderItem = styled__default["default"](StyledBaseHeaderItem).attrs({
|
|
643
643
|
'data-garden-id': COMPONENT_ID$k,
|
|
644
|
-
'data-garden-version': '8.
|
|
644
|
+
'data-garden-version': '8.48.0'
|
|
645
645
|
}).withConfig({
|
|
646
646
|
displayName: "StyledHeaderItem",
|
|
647
647
|
componentId: "sc-14sft6n-0"
|
|
@@ -667,7 +667,7 @@ StyledHeaderItem.defaultProps = {
|
|
|
667
667
|
var COMPONENT_ID$j = 'chrome.header_item_wrapper';
|
|
668
668
|
var StyledHeaderItemWrapper = styled__default["default"](StyledBaseHeaderItem).attrs({
|
|
669
669
|
'data-garden-id': COMPONENT_ID$j,
|
|
670
|
-
'data-garden-version': '8.
|
|
670
|
+
'data-garden-version': '8.48.0',
|
|
671
671
|
as: 'div'
|
|
672
672
|
}).withConfig({
|
|
673
673
|
displayName: "StyledHeaderItemWrapper",
|
|
@@ -707,7 +707,7 @@ var colorStyles$4 = function colorStyles(props) {
|
|
|
707
707
|
};
|
|
708
708
|
var StyledLogoNavItem = styled__default["default"](StyledBaseNavItem).attrs({
|
|
709
709
|
'data-garden-id': COMPONENT_ID$i,
|
|
710
|
-
'data-garden-version': '8.
|
|
710
|
+
'data-garden-version': '8.48.0',
|
|
711
711
|
as: 'div'
|
|
712
712
|
}).withConfig({
|
|
713
713
|
displayName: "StyledLogoNavItem",
|
|
@@ -722,7 +722,7 @@ StyledLogoNavItem.defaultProps = {
|
|
|
722
722
|
var COMPONENT_ID$h = 'chrome.brandmark_nav_item';
|
|
723
723
|
var StyledBrandmarkNavItem = styled__default["default"](StyledBaseNavItem).attrs({
|
|
724
724
|
'data-garden-id': COMPONENT_ID$h,
|
|
725
|
-
'data-garden-version': '8.
|
|
725
|
+
'data-garden-version': '8.48.0',
|
|
726
726
|
as: 'div'
|
|
727
727
|
}).withConfig({
|
|
728
728
|
displayName: "StyledBrandmarkNavItem",
|
|
@@ -735,7 +735,7 @@ StyledBrandmarkNavItem.defaultProps = {
|
|
|
735
735
|
var COMPONENT_ID$g = 'chrome.nav_item_icon';
|
|
736
736
|
var StyledNavItemIcon = styled__default["default"].div.attrs({
|
|
737
737
|
'data-garden-id': COMPONENT_ID$g,
|
|
738
|
-
'data-garden-version': '8.
|
|
738
|
+
'data-garden-version': '8.48.0'
|
|
739
739
|
}).withConfig({
|
|
740
740
|
displayName: "StyledNavItemIcon",
|
|
741
741
|
componentId: "sc-7w9rpt-0"
|
|
@@ -775,7 +775,7 @@ var colorStyles$3 = function colorStyles(props) {
|
|
|
775
775
|
};
|
|
776
776
|
var StyledNavItem = styled__default["default"](StyledBaseNavItem).attrs({
|
|
777
777
|
'data-garden-id': COMPONENT_ID$f,
|
|
778
|
-
'data-garden-version': '8.
|
|
778
|
+
'data-garden-version': '8.48.0',
|
|
779
779
|
as: 'button'
|
|
780
780
|
}).withConfig({
|
|
781
781
|
displayName: "StyledNavItem",
|
|
@@ -800,7 +800,7 @@ StyledNavItem.defaultProps = {
|
|
|
800
800
|
var COMPONENT_ID$e = 'chrome.nav_item_text';
|
|
801
801
|
var StyledNavItemText = styled__default["default"].span.attrs({
|
|
802
802
|
'data-garden-id': COMPONENT_ID$e,
|
|
803
|
-
'data-garden-version': '8.
|
|
803
|
+
'data-garden-version': '8.48.0'
|
|
804
804
|
}).withConfig({
|
|
805
805
|
displayName: "StyledNavItemText",
|
|
806
806
|
componentId: "sc-13m84xl-0"
|
|
@@ -843,7 +843,7 @@ var getSubNavItemHeight = function getSubNavItemHeight(props) {
|
|
|
843
843
|
};
|
|
844
844
|
var StyledSubNavItem = styled__default["default"].button.attrs({
|
|
845
845
|
'data-garden-id': COMPONENT_ID$d,
|
|
846
|
-
'data-garden-version': '8.
|
|
846
|
+
'data-garden-version': '8.48.0'
|
|
847
847
|
}).withConfig({
|
|
848
848
|
displayName: "StyledSubNavItem",
|
|
849
849
|
componentId: "sc-1yg9dpx-0"
|
|
@@ -878,7 +878,7 @@ var colorStyles$1 = function colorStyles(props) {
|
|
|
878
878
|
};
|
|
879
879
|
var StyledSubNav = styled__default["default"].nav.attrs({
|
|
880
880
|
'data-garden-id': COMPONENT_ID$c,
|
|
881
|
-
'data-garden-version': '8.
|
|
881
|
+
'data-garden-version': '8.48.0'
|
|
882
882
|
}).withConfig({
|
|
883
883
|
displayName: "StyledSubNav",
|
|
884
884
|
componentId: "sc-19hjou6-0"
|
|
@@ -904,7 +904,7 @@ var sizeStyles = function sizeStyles(props) {
|
|
|
904
904
|
};
|
|
905
905
|
var StyledSubNavItemText = styled__default["default"].span.attrs({
|
|
906
906
|
'data-garden-id': COMPONENT_ID$b,
|
|
907
|
-
'data-garden-version': '8.
|
|
907
|
+
'data-garden-version': '8.48.0'
|
|
908
908
|
}).withConfig({
|
|
909
909
|
displayName: "StyledSubNavItemText",
|
|
910
910
|
componentId: "sc-1hy0pn7-0"
|
|
@@ -922,7 +922,7 @@ StyledSubNavItemText.defaultProps = {
|
|
|
922
922
|
var COMPONENT_ID$a = 'chrome.collapsible_sub_nav_item';
|
|
923
923
|
var StyledSubNavItemHeader = styled__default["default"](StyledSubNavItem).attrs({
|
|
924
924
|
'data-garden-id': COMPONENT_ID$a,
|
|
925
|
-
'data-garden-version': '8.
|
|
925
|
+
'data-garden-version': '8.48.0',
|
|
926
926
|
'data-garden-header': 'true'
|
|
927
927
|
}).withConfig({
|
|
928
928
|
displayName: "StyledSubNavItemHeader",
|
|
@@ -980,7 +980,7 @@ StyledSubNavItemIcon.defaultProps = {
|
|
|
980
980
|
};
|
|
981
981
|
var StyledSubNavItemIconWrapper = styled__default["default"].div.attrs({
|
|
982
982
|
'data-garden-id': COMPONENT_ID$9,
|
|
983
|
-
'data-garden-version': '8.
|
|
983
|
+
'data-garden-version': '8.48.0'
|
|
984
984
|
}).withConfig({
|
|
985
985
|
displayName: "StyledSubNavItemIcon__StyledSubNavItemIconWrapper",
|
|
986
986
|
componentId: "sc-1d02hho-1"
|
|
@@ -1006,7 +1006,7 @@ var PANEL_COMPONENT_ID = 'chrome.collapsible_sub_nav_item_panel';
|
|
|
1006
1006
|
var hiddenStyling = styled.css(["visibility:hidden;max-height:0 !important;overflow:hidden;"]);
|
|
1007
1007
|
var StyledSubNavPanel = styled__default["default"].div.attrs({
|
|
1008
1008
|
'data-garden-id': PANEL_COMPONENT_ID,
|
|
1009
|
-
'data-garden-version': '8.
|
|
1009
|
+
'data-garden-version': '8.48.0'
|
|
1010
1010
|
}).withConfig({
|
|
1011
1011
|
displayName: "StyledSubNavPanel",
|
|
1012
1012
|
componentId: "sc-1jv3rpv-0"
|
|
@@ -1043,7 +1043,7 @@ var borderStyle = function borderStyle(_ref) {
|
|
|
1043
1043
|
};
|
|
1044
1044
|
var StyledSheet = styled__default["default"].aside.attrs({
|
|
1045
1045
|
'data-garden-id': COMPONENT_ID$8,
|
|
1046
|
-
'data-garden-version': '8.
|
|
1046
|
+
'data-garden-version': '8.48.0'
|
|
1047
1047
|
}).withConfig({
|
|
1048
1048
|
displayName: "StyledSheet",
|
|
1049
1049
|
componentId: "sc-dx8ijk-0"
|
|
@@ -1067,7 +1067,7 @@ StyledSheet.defaultProps = {
|
|
|
1067
1067
|
var COMPONENT_ID$7 = 'chrome.sheet_wrapper';
|
|
1068
1068
|
var StyledSheetWrapper = styled__default["default"].div.attrs({
|
|
1069
1069
|
'data-garden-id': COMPONENT_ID$7,
|
|
1070
|
-
'data-garden-version': '8.
|
|
1070
|
+
'data-garden-version': '8.48.0'
|
|
1071
1071
|
}).withConfig({
|
|
1072
1072
|
displayName: "StyledSheetWrapper",
|
|
1073
1073
|
componentId: "sc-f6x9zb-0"
|
|
@@ -1100,7 +1100,7 @@ StyledSheetWrapper.defaultProps = {
|
|
|
1100
1100
|
var COMPONENT_ID$6 = 'chrome.sheet_title';
|
|
1101
1101
|
var StyledSheetTitle = styled__default["default"].div.attrs({
|
|
1102
1102
|
'data-garden-id': COMPONENT_ID$6,
|
|
1103
|
-
'data-garden-version': '8.
|
|
1103
|
+
'data-garden-version': '8.48.0'
|
|
1104
1104
|
}).withConfig({
|
|
1105
1105
|
displayName: "StyledSheetTitle",
|
|
1106
1106
|
componentId: "sc-1gogk75-0"
|
|
@@ -1120,7 +1120,7 @@ StyledSheetTitle.defaultProps = {
|
|
|
1120
1120
|
var COMPONENT_ID$5 = 'chrome.sheet_description';
|
|
1121
1121
|
var StyledSheetDescription = styled__default["default"].div.attrs({
|
|
1122
1122
|
'data-garden-id': COMPONENT_ID$5,
|
|
1123
|
-
'data-garden-version': '8.
|
|
1123
|
+
'data-garden-version': '8.48.0'
|
|
1124
1124
|
}).withConfig({
|
|
1125
1125
|
displayName: "StyledSheetDescription",
|
|
1126
1126
|
componentId: "sc-1puglb6-0"
|
|
@@ -1138,7 +1138,7 @@ StyledSheetDescription.defaultProps = {
|
|
|
1138
1138
|
var COMPONENT_ID$4 = 'chrome.sheet_body';
|
|
1139
1139
|
var StyledSheetBody = styled__default["default"].div.attrs({
|
|
1140
1140
|
'data-garden-id': COMPONENT_ID$4,
|
|
1141
|
-
'data-garden-version': '8.
|
|
1141
|
+
'data-garden-version': '8.48.0'
|
|
1142
1142
|
}).withConfig({
|
|
1143
1143
|
displayName: "StyledSheetBody",
|
|
1144
1144
|
componentId: "sc-bt4eoj-0"
|
|
@@ -1152,6 +1152,11 @@ StyledSheetBody.defaultProps = {
|
|
|
1152
1152
|
};
|
|
1153
1153
|
|
|
1154
1154
|
var COMPONENT_ID$3 = 'chrome.sheet_close';
|
|
1155
|
+
var baseMultipliers = {
|
|
1156
|
+
top: 2.5,
|
|
1157
|
+
side: 2,
|
|
1158
|
+
size: 10
|
|
1159
|
+
};
|
|
1155
1160
|
var colorStyles = function colorStyles(props) {
|
|
1156
1161
|
var backgroundColor = 'primaryHue';
|
|
1157
1162
|
var foregroundColor = 'neutralHue';
|
|
@@ -1159,20 +1164,20 @@ var colorStyles = function colorStyles(props) {
|
|
|
1159
1164
|
};
|
|
1160
1165
|
var StyledSheetClose = styled__default["default"].button.attrs({
|
|
1161
1166
|
'data-garden-id': COMPONENT_ID$3,
|
|
1162
|
-
'data-garden-version': '8.
|
|
1167
|
+
'data-garden-version': '8.48.0'
|
|
1163
1168
|
}).withConfig({
|
|
1164
1169
|
displayName: "StyledSheetClose",
|
|
1165
1170
|
componentId: "sc-1ab02oq-0"
|
|
1166
1171
|
})(["display:flex;position:absolute;top:", "px;", ":", ";align-items:center;justify-content:center;transition:box-shadow 0.1s ease-in-out,background-color 0.25s ease-in-out,color 0.25s ease-in-out;border:none;border-radius:50%;cursor:pointer;padding:0;width:", "px;height:", "px;overflow:hidden;text-decoration:none;font-size:0;user-select:none;&::-moz-focus-inner{border:0;}&:focus{outline:none;}", ";& > svg{vertical-align:middle;}", ";"], function (props) {
|
|
1167
|
-
return props.theme.space.base *
|
|
1172
|
+
return props.theme.space.base * baseMultipliers.top;
|
|
1168
1173
|
}, function (props) {
|
|
1169
1174
|
return props.theme.rtl ? 'left' : 'right';
|
|
1170
1175
|
}, function (props) {
|
|
1171
|
-
return "".concat(props.theme.space.base *
|
|
1176
|
+
return "".concat(props.theme.space.base * baseMultipliers.side, "px");
|
|
1172
1177
|
}, function (props) {
|
|
1173
|
-
return props.theme.space.base *
|
|
1178
|
+
return props.theme.space.base * baseMultipliers.size;
|
|
1174
1179
|
}, function (props) {
|
|
1175
|
-
return props.theme.space.base *
|
|
1180
|
+
return props.theme.space.base * baseMultipliers.size;
|
|
1176
1181
|
}, function (props) {
|
|
1177
1182
|
return colorStyles(props);
|
|
1178
1183
|
}, function (props) {
|
|
@@ -1185,7 +1190,7 @@ StyledSheetClose.defaultProps = {
|
|
|
1185
1190
|
var COMPONENT_ID$2 = 'chrome.sheet_footer';
|
|
1186
1191
|
var StyledSheetFooter = styled__default["default"].footer.attrs({
|
|
1187
1192
|
'data-garden-id': COMPONENT_ID$2,
|
|
1188
|
-
'data-garden-version': '8.
|
|
1193
|
+
'data-garden-version': '8.48.0'
|
|
1189
1194
|
}).withConfig({
|
|
1190
1195
|
displayName: "StyledSheetFooter",
|
|
1191
1196
|
componentId: "sc-2cktos-0"
|
|
@@ -1205,7 +1210,7 @@ StyledSheetFooter.defaultProps = {
|
|
|
1205
1210
|
var COMPONENT_ID$1 = 'chrome.sheet_footer_item';
|
|
1206
1211
|
var StyledSheetFooterItem = styled__default["default"].div.attrs({
|
|
1207
1212
|
'data-garden-id': COMPONENT_ID$1,
|
|
1208
|
-
'data-garden-version': '8.
|
|
1213
|
+
'data-garden-version': '8.48.0'
|
|
1209
1214
|
}).withConfig({
|
|
1210
1215
|
displayName: "StyledSheetFooterItem",
|
|
1211
1216
|
componentId: "sc-r9ixh-0"
|
|
@@ -1221,14 +1226,17 @@ StyledSheetFooterItem.defaultProps = {
|
|
|
1221
1226
|
var COMPONENT_ID = 'chrome.sheet_header';
|
|
1222
1227
|
var StyledSheetHeader = styled__default["default"].header.attrs({
|
|
1223
1228
|
'data-garden-id': COMPONENT_ID,
|
|
1224
|
-
'data-garden-version': '8.
|
|
1229
|
+
'data-garden-version': '8.48.0'
|
|
1225
1230
|
}).withConfig({
|
|
1226
1231
|
displayName: "StyledSheetHeader",
|
|
1227
1232
|
componentId: "sc-o2ry8i-0"
|
|
1228
|
-
})(["border-bottom:", ";padding:", "px;", ";"], function (props) {
|
|
1233
|
+
})(["border-bottom:", ";padding:", "px;", " ", ";"], function (props) {
|
|
1229
1234
|
return "".concat(props.theme.borders.sm, " ").concat(reactTheming.getColor('neutralHue', 300, props.theme), "}");
|
|
1230
1235
|
}, function (props) {
|
|
1231
1236
|
return props.theme.space.base * 5;
|
|
1237
|
+
}, function (props) {
|
|
1238
|
+
return props.isCloseButtonPresent &&
|
|
1239
|
+
"padding-".concat(props.theme.rtl ? 'left' : 'right', ": ").concat(props.theme.space.base * (baseMultipliers.size + baseMultipliers.side + 2), "px;");
|
|
1232
1240
|
}, function (props) {
|
|
1233
1241
|
return reactTheming.retrieveComponentStyles(COMPONENT_ID, props);
|
|
1234
1242
|
});
|
|
@@ -1314,7 +1322,7 @@ var useBodyContext = function useBodyContext() {
|
|
|
1314
1322
|
};
|
|
1315
1323
|
|
|
1316
1324
|
var _excluded$8 = ["hasFooter"];
|
|
1317
|
-
var Body = React__default["default"].forwardRef(function (_ref, ref) {
|
|
1325
|
+
var Body$1 = React__default["default"].forwardRef(function (_ref, ref) {
|
|
1318
1326
|
var hasFooter = _ref.hasFooter,
|
|
1319
1327
|
props = _objectWithoutProperties(_ref, _excluded$8);
|
|
1320
1328
|
var bodyContextValue = React.useMemo(function () {
|
|
@@ -1328,8 +1336,8 @@ var Body = React__default["default"].forwardRef(function (_ref, ref) {
|
|
|
1328
1336
|
ref: ref
|
|
1329
1337
|
}, props)));
|
|
1330
1338
|
});
|
|
1331
|
-
Body.displayName = 'Body';
|
|
1332
|
-
Body.propTypes = {
|
|
1339
|
+
Body$1.displayName = 'Body';
|
|
1340
|
+
Body$1.propTypes = {
|
|
1333
1341
|
hasFooter: PropTypes__default["default"].bool
|
|
1334
1342
|
};
|
|
1335
1343
|
|
|
@@ -1357,13 +1365,13 @@ var Sidebar = React__default["default"].forwardRef(function (props, ref) {
|
|
|
1357
1365
|
});
|
|
1358
1366
|
Sidebar.displayName = 'Sidebar';
|
|
1359
1367
|
|
|
1360
|
-
var Header = React__default["default"].forwardRef(function (props, ref) {
|
|
1368
|
+
var Header$1 = React__default["default"].forwardRef(function (props, ref) {
|
|
1361
1369
|
return React__default["default"].createElement(StyledHeader, _extends$3({
|
|
1362
1370
|
ref: ref
|
|
1363
1371
|
}, props));
|
|
1364
1372
|
});
|
|
1365
|
-
Header.displayName = 'Header';
|
|
1366
|
-
Header.propTypes = {
|
|
1373
|
+
Header$1.displayName = 'Header';
|
|
1374
|
+
Header$1.propTypes = {
|
|
1367
1375
|
isStandalone: PropTypes__default["default"].bool
|
|
1368
1376
|
};
|
|
1369
1377
|
|
|
@@ -1393,16 +1401,23 @@ HeaderItem.propTypes = {
|
|
|
1393
1401
|
hasLogo: PropTypes__default["default"].bool
|
|
1394
1402
|
};
|
|
1395
1403
|
|
|
1396
|
-
var _excluded$6 = ["children"]
|
|
1404
|
+
var _excluded$6 = ["children"],
|
|
1405
|
+
_excluded2$1 = ["theme"];
|
|
1397
1406
|
var HeaderItemIcon = function HeaderItemIcon(_ref) {
|
|
1398
1407
|
var children = _ref.children,
|
|
1399
1408
|
props = _objectWithoutProperties(_ref, _excluded$6);
|
|
1400
|
-
var
|
|
1401
|
-
|
|
1402
|
-
|
|
1403
|
-
|
|
1404
|
-
|
|
1405
|
-
|
|
1409
|
+
var element = React.Children.only(children);
|
|
1410
|
+
if ( React.isValidElement(element)) {
|
|
1411
|
+
var Icon = function Icon(_ref2) {
|
|
1412
|
+
_ref2.theme;
|
|
1413
|
+
var iconProps = _objectWithoutProperties(_ref2, _excluded2$1);
|
|
1414
|
+
return React.cloneElement(element, _objectSpread2(_objectSpread2({}, props), iconProps));
|
|
1415
|
+
};
|
|
1416
|
+
return React__default["default"].createElement(StyledHeaderItemIcon, _extends$3({
|
|
1417
|
+
as: Icon
|
|
1418
|
+
}, props));
|
|
1419
|
+
}
|
|
1420
|
+
return null;
|
|
1406
1421
|
};
|
|
1407
1422
|
|
|
1408
1423
|
var HeaderItemText = React__default["default"].forwardRef(function (props, ref) {
|
|
@@ -1422,19 +1437,19 @@ var HeaderItemWrapper = React__default["default"].forwardRef(function (props, re
|
|
|
1422
1437
|
});
|
|
1423
1438
|
HeaderItemWrapper.displayName = 'HeaderItemWrapper';
|
|
1424
1439
|
|
|
1425
|
-
var Footer = React__default["default"].forwardRef(function (props, ref) {
|
|
1440
|
+
var Footer$1 = React__default["default"].forwardRef(function (props, ref) {
|
|
1426
1441
|
return React__default["default"].createElement(StyledFooter, _extends$3({
|
|
1427
1442
|
ref: ref
|
|
1428
1443
|
}, props));
|
|
1429
1444
|
});
|
|
1430
|
-
Footer.displayName = 'Footer';
|
|
1445
|
+
Footer$1.displayName = 'Footer';
|
|
1431
1446
|
|
|
1432
|
-
var FooterItem = React__default["default"].forwardRef(function (props, ref) {
|
|
1447
|
+
var FooterItem$1 = React__default["default"].forwardRef(function (props, ref) {
|
|
1433
1448
|
return React__default["default"].createElement(StyledFooterItem, _extends$3({
|
|
1434
1449
|
ref: ref
|
|
1435
1450
|
}, props));
|
|
1436
1451
|
});
|
|
1437
|
-
FooterItem.displayName = 'FooterItem';
|
|
1452
|
+
FooterItem$1.displayName = 'FooterItem';
|
|
1438
1453
|
|
|
1439
1454
|
var NavContext = React__default["default"].createContext({
|
|
1440
1455
|
isExpanded: false
|
|
@@ -1510,16 +1525,23 @@ NavItem.propTypes = {
|
|
|
1510
1525
|
isCurrent: PropTypes__default["default"].bool
|
|
1511
1526
|
};
|
|
1512
1527
|
|
|
1513
|
-
var _excluded$4 = ["children"]
|
|
1528
|
+
var _excluded$4 = ["children"],
|
|
1529
|
+
_excluded2 = ["theme"];
|
|
1514
1530
|
var NavItemIcon = function NavItemIcon(_ref) {
|
|
1515
1531
|
var children = _ref.children,
|
|
1516
1532
|
props = _objectWithoutProperties(_ref, _excluded$4);
|
|
1517
|
-
var
|
|
1518
|
-
|
|
1519
|
-
|
|
1520
|
-
|
|
1521
|
-
|
|
1522
|
-
|
|
1533
|
+
var element = React.Children.only(children);
|
|
1534
|
+
if ( React.isValidElement(element)) {
|
|
1535
|
+
var Icon = function Icon(_ref2) {
|
|
1536
|
+
_ref2.theme;
|
|
1537
|
+
var iconProps = _objectWithoutProperties(_ref2, _excluded2);
|
|
1538
|
+
return React.cloneElement(element, _objectSpread2(_objectSpread2({}, props), iconProps));
|
|
1539
|
+
};
|
|
1540
|
+
return React__default["default"].createElement(StyledNavItemIcon, _extends$3({
|
|
1541
|
+
as: Icon
|
|
1542
|
+
}, props));
|
|
1543
|
+
}
|
|
1544
|
+
return null;
|
|
1523
1545
|
};
|
|
1524
1546
|
|
|
1525
1547
|
var NavItemText = React__default["default"].forwardRef(function (props, ref) {
|
|
@@ -1632,7 +1654,9 @@ CollapsibleSubNavItem.propTypes = {
|
|
|
1632
1654
|
};
|
|
1633
1655
|
CollapsibleSubNavItem.displayName = 'CollapsibleSubNavItem';
|
|
1634
1656
|
|
|
1635
|
-
var SheetContext = React.createContext({
|
|
1657
|
+
var SheetContext = React.createContext({
|
|
1658
|
+
setCloseButtonPresent: function setCloseButtonPresent() {}
|
|
1659
|
+
});
|
|
1636
1660
|
var useSheetContext = function useSheetContext() {
|
|
1637
1661
|
return React.useContext(SheetContext);
|
|
1638
1662
|
};
|
|
@@ -1685,6 +1709,7 @@ var SheetTitle = React.forwardRef(function (_ref, ref) {
|
|
|
1685
1709
|
}, props));
|
|
1686
1710
|
});
|
|
1687
1711
|
SheetTitle.displayName = 'Sheet.Title';
|
|
1712
|
+
var Title = SheetTitle;
|
|
1688
1713
|
|
|
1689
1714
|
var _excluded$1 = ["id"];
|
|
1690
1715
|
var SheetDescription = React.forwardRef(function (_ref, ref) {
|
|
@@ -1698,13 +1723,18 @@ var SheetDescription = React.forwardRef(function (_ref, ref) {
|
|
|
1698
1723
|
}, props));
|
|
1699
1724
|
});
|
|
1700
1725
|
SheetDescription.displayName = 'Sheet.Description';
|
|
1726
|
+
var Description = SheetDescription;
|
|
1701
1727
|
|
|
1702
1728
|
var SheetHeader = React.forwardRef(function (props, ref) {
|
|
1729
|
+
var _useSheetContext = useSheetContext(),
|
|
1730
|
+
isCloseButtonPresent = _useSheetContext.isCloseButtonPresent;
|
|
1703
1731
|
return React__default["default"].createElement(StyledSheetHeader, _extends$3({
|
|
1704
|
-
ref: ref
|
|
1732
|
+
ref: ref,
|
|
1733
|
+
isCloseButtonPresent: isCloseButtonPresent
|
|
1705
1734
|
}, props));
|
|
1706
1735
|
});
|
|
1707
1736
|
SheetHeader.displayName = 'Sheet.Header';
|
|
1737
|
+
var Header = SheetHeader;
|
|
1708
1738
|
|
|
1709
1739
|
var SheetBody = React.forwardRef(function (props, ref) {
|
|
1710
1740
|
return React__default["default"].createElement(StyledSheetBody, _extends$3({
|
|
@@ -1712,6 +1742,7 @@ var SheetBody = React.forwardRef(function (props, ref) {
|
|
|
1712
1742
|
}, props));
|
|
1713
1743
|
});
|
|
1714
1744
|
SheetBody.displayName = 'Sheet.Body';
|
|
1745
|
+
var Body = SheetBody;
|
|
1715
1746
|
|
|
1716
1747
|
var SheetFooter = React.forwardRef(function (props, ref) {
|
|
1717
1748
|
return React__default["default"].createElement(StyledSheetFooter, _extends$3({
|
|
@@ -1719,6 +1750,7 @@ var SheetFooter = React.forwardRef(function (props, ref) {
|
|
|
1719
1750
|
}, props));
|
|
1720
1751
|
});
|
|
1721
1752
|
SheetFooter.displayName = 'Sheet.Footer';
|
|
1753
|
+
var Footer = SheetFooter;
|
|
1722
1754
|
|
|
1723
1755
|
var SheetFooterItem = React.forwardRef(function (props, ref) {
|
|
1724
1756
|
return React__default["default"].createElement(StyledSheetFooterItem, _extends$3({
|
|
@@ -1726,6 +1758,7 @@ var SheetFooterItem = React.forwardRef(function (props, ref) {
|
|
|
1726
1758
|
}, props));
|
|
1727
1759
|
});
|
|
1728
1760
|
SheetFooterItem.displayName = 'Sheet.FooterItem';
|
|
1761
|
+
var FooterItem = SheetFooterItem;
|
|
1729
1762
|
|
|
1730
1763
|
var _path;
|
|
1731
1764
|
|
|
@@ -1747,15 +1780,24 @@ var SvgXStroke = function SvgXStroke(props) {
|
|
|
1747
1780
|
};
|
|
1748
1781
|
|
|
1749
1782
|
var SheetClose = React.forwardRef(function (props, ref) {
|
|
1783
|
+
var _useSheetContext = useSheetContext(),
|
|
1784
|
+
setCloseButtonPresent = _useSheetContext.setCloseButtonPresent;
|
|
1785
|
+
React.useEffect(function () {
|
|
1786
|
+
setCloseButtonPresent(true);
|
|
1787
|
+
return function () {
|
|
1788
|
+
return setCloseButtonPresent(false);
|
|
1789
|
+
};
|
|
1790
|
+
}, [setCloseButtonPresent]);
|
|
1750
1791
|
return React__default["default"].createElement(StyledSheetClose, _extends$3({
|
|
1751
1792
|
"aria-label": "Close Sheet",
|
|
1752
1793
|
ref: ref
|
|
1753
1794
|
}, props), React__default["default"].createElement(SvgXStroke, null));
|
|
1754
1795
|
});
|
|
1755
1796
|
SheetClose.displayName = 'Sheet.Close';
|
|
1797
|
+
var Close = SheetClose;
|
|
1756
1798
|
|
|
1757
1799
|
var _excluded = ["id", "isOpen", "isAnimated", "focusOnMount", "restoreFocus", "placement", "size", "children"];
|
|
1758
|
-
var
|
|
1800
|
+
var SheetComponent = React__default["default"].forwardRef(function (_ref, ref) {
|
|
1759
1801
|
var id = _ref.id,
|
|
1760
1802
|
isOpen = _ref.isOpen,
|
|
1761
1803
|
isAnimated = _ref.isAnimated,
|
|
@@ -1767,17 +1809,23 @@ var Sheet = React__default["default"].forwardRef(function (_ref, ref) {
|
|
|
1767
1809
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
1768
1810
|
var sheetRef = React.useRef(null);
|
|
1769
1811
|
var seed = reactUid.useUIDSeed();
|
|
1770
|
-
var _useState = React.useState(
|
|
1771
|
-
_useState2 = _slicedToArray(_useState,
|
|
1772
|
-
|
|
1812
|
+
var _useState = React.useState(false),
|
|
1813
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
1814
|
+
isCloseButtonPresent = _useState2[0],
|
|
1815
|
+
setCloseButtonPresent = _useState2[1];
|
|
1816
|
+
var _useState3 = React.useState(id || seed("sheet_".concat('8.48.0'))),
|
|
1817
|
+
_useState4 = _slicedToArray(_useState3, 1),
|
|
1818
|
+
idPrefix = _useState4[0];
|
|
1773
1819
|
var titleId = "".concat(idPrefix, "--title");
|
|
1774
1820
|
var descriptionId = "".concat(idPrefix, "--description");
|
|
1775
1821
|
var sheetContext = React.useMemo(function () {
|
|
1776
1822
|
return {
|
|
1777
1823
|
titleId: titleId,
|
|
1778
|
-
descriptionId: descriptionId
|
|
1824
|
+
descriptionId: descriptionId,
|
|
1825
|
+
isCloseButtonPresent: isCloseButtonPresent,
|
|
1826
|
+
setCloseButtonPresent: setCloseButtonPresent
|
|
1779
1827
|
};
|
|
1780
|
-
}, [titleId, descriptionId]);
|
|
1828
|
+
}, [titleId, descriptionId, isCloseButtonPresent]);
|
|
1781
1829
|
useFocusableMount({
|
|
1782
1830
|
targetRef: sheetRef,
|
|
1783
1831
|
isMounted: isOpen,
|
|
@@ -1803,15 +1851,8 @@ var Sheet = React__default["default"].forwardRef(function (_ref, ref) {
|
|
|
1803
1851
|
size: size
|
|
1804
1852
|
}, children)));
|
|
1805
1853
|
});
|
|
1806
|
-
|
|
1807
|
-
|
|
1808
|
-
Sheet.Header = SheetHeader;
|
|
1809
|
-
Sheet.Body = SheetBody;
|
|
1810
|
-
Sheet.Footer = SheetFooter;
|
|
1811
|
-
Sheet.FooterItem = SheetFooterItem;
|
|
1812
|
-
Sheet.Close = SheetClose;
|
|
1813
|
-
Sheet.displayName = 'Sheet';
|
|
1814
|
-
Sheet.propTypes = {
|
|
1854
|
+
SheetComponent.displayName = 'Sheet';
|
|
1855
|
+
SheetComponent.propTypes = {
|
|
1815
1856
|
id: PropTypes__default["default"].string,
|
|
1816
1857
|
isOpen: PropTypes__default["default"].bool,
|
|
1817
1858
|
isAnimated: PropTypes__default["default"].bool,
|
|
@@ -1820,19 +1861,27 @@ Sheet.propTypes = {
|
|
|
1820
1861
|
placement: PropTypes__default["default"].oneOf(['start', 'end']),
|
|
1821
1862
|
size: PropTypes__default["default"].string
|
|
1822
1863
|
};
|
|
1823
|
-
|
|
1864
|
+
SheetComponent.defaultProps = {
|
|
1824
1865
|
isAnimated: true,
|
|
1825
1866
|
placement: 'end',
|
|
1826
1867
|
size: '380px'
|
|
1827
1868
|
};
|
|
1869
|
+
var Sheet = SheetComponent;
|
|
1870
|
+
Sheet.Body = Body;
|
|
1871
|
+
Sheet.Close = Close;
|
|
1872
|
+
Sheet.Description = Description;
|
|
1873
|
+
Sheet.Footer = Footer;
|
|
1874
|
+
Sheet.FooterItem = FooterItem;
|
|
1875
|
+
Sheet.Header = Header;
|
|
1876
|
+
Sheet.Title = Title;
|
|
1828
1877
|
|
|
1829
|
-
exports.Body = Body;
|
|
1878
|
+
exports.Body = Body$1;
|
|
1830
1879
|
exports.Chrome = Chrome;
|
|
1831
1880
|
exports.CollapsibleSubNavItem = CollapsibleSubNavItem;
|
|
1832
1881
|
exports.Content = Content;
|
|
1833
|
-
exports.Footer = Footer;
|
|
1834
|
-
exports.FooterItem = FooterItem;
|
|
1835
|
-
exports.Header = Header;
|
|
1882
|
+
exports.Footer = Footer$1;
|
|
1883
|
+
exports.FooterItem = FooterItem$1;
|
|
1884
|
+
exports.Header = Header$1;
|
|
1836
1885
|
exports.HeaderItem = HeaderItem;
|
|
1837
1886
|
exports.HeaderItemIcon = HeaderItemIcon;
|
|
1838
1887
|
exports.HeaderItemText = HeaderItemText;
|