@zendeskgarden/react-modals 9.0.0-next.24 → 9.0.0-next.26

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.
@@ -6,7 +6,7 @@
6
6
  */
7
7
  import PropTypes from 'prop-types';
8
8
  import styled, { keyframes, css } from 'styled-components';
9
- import { getColor, retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
9
+ import { getColor, retrieveComponentStyles } from '@zendeskgarden/react-theming';
10
10
 
11
11
  const COMPONENT_ID = 'modals.backdrop';
12
12
  const animationName = keyframes(["0%{opacity:0;}100%{opacity:1;}"]);
@@ -18,7 +18,7 @@ const animationStyles = props => {
18
18
  };
19
19
  const StyledBackdrop = styled.div.attrs({
20
20
  'data-garden-id': COMPONENT_ID,
21
- 'data-garden-version': '9.0.0-next.24'
21
+ 'data-garden-version': '9.0.0-next.26'
22
22
  }).withConfig({
23
23
  displayName: "StyledBackdrop",
24
24
  componentId: "sc-mzdjpo-0"
@@ -38,9 +38,6 @@ const StyledBackdrop = styled.div.attrs({
38
38
  }
39
39
  });
40
40
  }, props => props.theme.fonts.system, props => props.theme.rtl && 'rtl', animationStyles, props => retrieveComponentStyles(COMPONENT_ID, props));
41
- StyledBackdrop.defaultProps = {
42
- theme: DEFAULT_THEME
43
- };
44
41
  StyledBackdrop.propTypes = {
45
42
  isCentered: PropTypes.bool,
46
43
  isAnimated: PropTypes.bool
@@ -5,12 +5,12 @@
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
7
  import styled from 'styled-components';
8
- import { getLineHeight, getColor, retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
8
+ import { getLineHeight, getColor, retrieveComponentStyles } from '@zendeskgarden/react-theming';
9
9
 
10
10
  const COMPONENT_ID = 'modals.body';
11
11
  const StyledBody = styled.div.attrs({
12
12
  'data-garden-id': COMPONENT_ID,
13
- 'data-garden-version': '9.0.0-next.24'
13
+ 'data-garden-version': '9.0.0-next.26'
14
14
  }).withConfig({
15
15
  displayName: "StyledBody",
16
16
  componentId: "sc-14rzecg-0"
@@ -23,8 +23,5 @@ const StyledBody = styled.div.attrs({
23
23
  variable: 'foreground.default'
24
24
  });
25
25
  }, props => props.theme.fontSizes.md, props => retrieveComponentStyles(COMPONENT_ID, props));
26
- StyledBody.defaultProps = {
27
- theme: DEFAULT_THEME
28
- };
29
26
 
30
27
  export { StyledBody };
@@ -5,7 +5,7 @@
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
7
  import styled from 'styled-components';
8
- import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
8
+ import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
9
9
  import { IconButton } from '@zendeskgarden/react-buttons';
10
10
 
11
11
  const COMPONENT_ID = 'modals.close';
@@ -16,13 +16,10 @@ const BASE_MULTIPLIERS = {
16
16
  };
17
17
  const StyledClose = styled(IconButton).attrs({
18
18
  'data-garden-id': COMPONENT_ID,
19
- 'data-garden-version': '9.0.0-next.24'
19
+ 'data-garden-version': '9.0.0-next.26'
20
20
  }).withConfig({
21
21
  displayName: "StyledClose",
22
22
  componentId: "sc-iseudj-0"
23
23
  })(["position:absolute;top:", "px;", ":", ";", ";"], props => props.theme.space.base * BASE_MULTIPLIERS.top, props => props.theme.rtl ? 'left' : 'right', props => `${props.theme.space.base * BASE_MULTIPLIERS.side}px`, props => retrieveComponentStyles(COMPONENT_ID, props));
24
- StyledClose.defaultProps = {
25
- theme: DEFAULT_THEME
26
- };
27
24
 
28
25
  export { BASE_MULTIPLIERS, StyledClose };
@@ -5,15 +5,11 @@
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
7
  import styled from 'styled-components';
8
- import { DEFAULT_THEME } from '@zendeskgarden/react-theming';
9
8
  import SvgAlertErrorStroke from '../node_modules/@zendeskgarden/svg-icons/src/16/alert-error-stroke.svg.js';
10
9
 
11
10
  const StyledDangerIcon = styled(SvgAlertErrorStroke).withConfig({
12
11
  displayName: "StyledDangerIcon",
13
12
  componentId: "sc-1kwbb39-0"
14
13
  })(["position:absolute;top:", "px;", ":", ";"], props => props.theme.space.base * 5.5, props => props.theme.rtl ? 'right' : 'left', props => `${props.theme.space.base * 4}px`);
15
- StyledDangerIcon.defaultProps = {
16
- theme: DEFAULT_THEME
17
- };
18
14
 
19
15
  export { StyledDangerIcon };
@@ -5,7 +5,7 @@
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
7
  import styled, { css } from 'styled-components';
8
- import { retrieveComponentStyles, DEFAULT_THEME, getColor } from '@zendeskgarden/react-theming';
8
+ import { retrieveComponentStyles, getColor } from '@zendeskgarden/react-theming';
9
9
 
10
10
  const COMPONENT_ID = 'modals.drawer_modal';
11
11
  const DRAWER_WIDTH = 380;
@@ -32,13 +32,10 @@ const colorStyles = _ref => {
32
32
  };
33
33
  const StyledDrawer = styled.div.attrs({
34
34
  'data-garden-id': COMPONENT_ID,
35
- 'data-garden-version': '9.0.0-next.24'
35
+ 'data-garden-version': '9.0.0-next.26'
36
36
  }).withConfig({
37
37
  displayName: "StyledDrawer",
38
38
  componentId: "sc-zp66t3-0"
39
39
  })(["display:flex;position:fixed;top:0;", ":0;flex-direction:column;z-index:500;", ":", ";width:", "px;height:100%;overflow:auto;-webkit-overflow-scrolling:touch;font-family:", ";direction:", ";&.garden-drawer-transition-enter{transform:translateX(", "px);}&.garden-drawer-transition-enter-active{transform:translateX(0);transition:transform 0.25s ease-in-out;}&.garden-drawer-transition-exit-active{transform:translateX(", "px);transition:transform 0.25s ease-in-out;}&:focus{outline:none;}", " ", ";"], props => props.theme.rtl ? 'left' : 'right', props => props.theme.rtl ? 'border-right' : 'border-left', props => props.theme.borders.sm, DRAWER_WIDTH, props => props.theme.fonts.system, props => props.theme.rtl && 'rtl', props => props.theme.rtl ? -DRAWER_WIDTH : DRAWER_WIDTH, props => props.theme.rtl ? -DRAWER_WIDTH : DRAWER_WIDTH, colorStyles, props => retrieveComponentStyles(COMPONENT_ID, props));
40
- StyledDrawer.defaultProps = {
41
- theme: DEFAULT_THEME
42
- };
43
40
 
44
41
  export { StyledDrawer };
@@ -5,19 +5,16 @@
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
7
  import styled from 'styled-components';
8
- import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
8
+ import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
9
9
  import { StyledBody } from './StyledBody.js';
10
10
 
11
11
  const COMPONENT_ID = 'modals.drawer_modal.body';
12
12
  const StyledDrawerBody = styled(StyledBody).attrs({
13
13
  'data-garden-id': COMPONENT_ID,
14
- 'data-garden-version': '9.0.0-next.24'
14
+ 'data-garden-version': '9.0.0-next.26'
15
15
  }).withConfig({
16
16
  displayName: "StyledDrawerBody",
17
17
  componentId: "sc-13qufyn-0"
18
18
  })(["padding:", "px;color-scheme:only ", ";", ";"], props => props.theme.space.base * 5, p => p.theme.colors.base, props => retrieveComponentStyles(COMPONENT_ID, props));
19
- StyledDrawerBody.defaultProps = {
20
- theme: DEFAULT_THEME
21
- };
22
19
 
23
20
  export { StyledDrawerBody };
@@ -5,7 +5,7 @@
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
7
  import styled from 'styled-components';
8
- import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
8
+ import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
9
9
  import { StyledClose, BASE_MULTIPLIERS as BASE_MULTIPLIERS$1 } from './StyledClose.js';
10
10
 
11
11
  const COMPONENT_ID = 'modals.drawer_modal.close';
@@ -16,13 +16,10 @@ const BASE_MULTIPLIERS = {
16
16
  };
17
17
  const StyledDrawerClose = styled(StyledClose).attrs({
18
18
  'data-garden-id': COMPONENT_ID,
19
- 'data-garden-version': '9.0.0-next.24'
19
+ 'data-garden-version': '9.0.0-next.26'
20
20
  }).withConfig({
21
21
  displayName: "StyledDrawerClose",
22
22
  componentId: "sc-1a0xt3x-0"
23
23
  })(["", ":", ";", ";"], props => props.theme.rtl ? 'left' : 'right', props => `${props.theme.space.base * BASE_MULTIPLIERS.side}px`, props => retrieveComponentStyles(COMPONENT_ID, props));
24
- StyledDrawerClose.defaultProps = {
25
- theme: DEFAULT_THEME
26
- };
27
24
 
28
25
  export { BASE_MULTIPLIERS, StyledDrawerClose };
@@ -5,12 +5,12 @@
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
7
  import styled from 'styled-components';
8
- import { getColor, retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
8
+ import { getColor, retrieveComponentStyles } from '@zendeskgarden/react-theming';
9
9
 
10
10
  const COMPONENT_ID = 'modals.drawer_modal.footer';
11
11
  const StyledDrawerFooter = styled.div.attrs({
12
12
  'data-garden-id': COMPONENT_ID,
13
- 'data-garden-version': '9.0.0-next.24'
13
+ 'data-garden-version': '9.0.0-next.26'
14
14
  }).withConfig({
15
15
  displayName: "StyledDrawerFooter",
16
16
  componentId: "sc-kc7e6p-0"
@@ -23,8 +23,5 @@ const StyledDrawerFooter = styled.div.attrs({
23
23
  variable: 'border.subtle'
24
24
  })}`;
25
25
  }, props => props.theme.space.base * 5, props => retrieveComponentStyles(COMPONENT_ID, props));
26
- StyledDrawerFooter.defaultProps = {
27
- theme: DEFAULT_THEME
28
- };
29
26
 
30
27
  export { StyledDrawerFooter };
@@ -5,19 +5,16 @@
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
7
  import styled from 'styled-components';
8
- import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
8
+ import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
9
9
  import { StyledFooterItem } from './StyledFooterItem.js';
10
10
 
11
11
  const COMPONENT_ID = 'modals.drawer_modal.footer_item';
12
12
  const StyledDrawerFooterItem = styled(StyledFooterItem).attrs({
13
13
  'data-garden-id': COMPONENT_ID,
14
- 'data-garden-version': '9.0.0-next.24'
14
+ 'data-garden-version': '9.0.0-next.26'
15
15
  }).withConfig({
16
16
  displayName: "StyledDrawerFooterItem",
17
17
  componentId: "sc-m2yul4-0"
18
18
  })(["", ";"], props => retrieveComponentStyles(COMPONENT_ID, props));
19
- StyledDrawerFooterItem.defaultProps = {
20
- theme: DEFAULT_THEME
21
- };
22
19
 
23
20
  export { StyledDrawerFooterItem };
@@ -5,20 +5,17 @@
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
7
  import styled from 'styled-components';
8
- import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
8
+ import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
9
9
  import { StyledHeader } from './StyledHeader.js';
10
10
  import { BASE_MULTIPLIERS } from './StyledDrawerClose.js';
11
11
 
12
12
  const COMPONENT_ID = 'modals.drawer_modal.header';
13
13
  const StyledDrawerHeader = styled(StyledHeader).attrs({
14
14
  'data-garden-id': COMPONENT_ID,
15
- 'data-garden-version': '9.0.0-next.24'
15
+ 'data-garden-version': '9.0.0-next.26'
16
16
  }).withConfig({
17
17
  displayName: "StyledDrawerHeader",
18
18
  componentId: "sc-y4mgkj-0"
19
19
  })(["padding:", "px;", " ", ";"], props => props.theme.space.base * 5, props => props.isCloseButtonPresent && `padding-${props.theme.rtl ? 'left' : 'right'}: ${props.theme.space.base * (BASE_MULTIPLIERS.size + BASE_MULTIPLIERS.side + 2)}px;`, props => retrieveComponentStyles(COMPONENT_ID, props));
20
- StyledDrawerHeader.defaultProps = {
21
- theme: DEFAULT_THEME
22
- };
23
20
 
24
21
  export { StyledDrawerHeader };
@@ -5,12 +5,12 @@
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
7
  import styled from 'styled-components';
8
- import { getColor, retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
8
+ import { getColor, retrieveComponentStyles } from '@zendeskgarden/react-theming';
9
9
 
10
10
  const COMPONENT_ID = 'modals.footer';
11
11
  const StyledFooter = styled.div.attrs({
12
12
  'data-garden-id': COMPONENT_ID,
13
- 'data-garden-version': '9.0.0-next.24'
13
+ 'data-garden-version': '9.0.0-next.26'
14
14
  }).withConfig({
15
15
  displayName: "StyledFooter",
16
16
  componentId: "sc-d8pfdu-0"
@@ -18,8 +18,5 @@ const StyledFooter = styled.div.attrs({
18
18
  theme: props.theme,
19
19
  variable: 'border.default'
20
20
  })}`, props => props.isLarge ? `${props.theme.space.base * 8}px ${props.theme.space.base * 10}px` : `${props.theme.space.base * 5}px ${props.theme.space.base * 10}px ${props.theme.space.base * 8}px`, props => retrieveComponentStyles(COMPONENT_ID, props));
21
- StyledFooter.defaultProps = {
22
- theme: DEFAULT_THEME
23
- };
24
21
 
25
22
  export { StyledFooter };
@@ -5,18 +5,15 @@
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
7
  import styled from 'styled-components';
8
- import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
8
+ import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
9
9
 
10
10
  const COMPONENT_ID = 'modals.footer_item';
11
11
  const StyledFooterItem = styled.span.attrs({
12
12
  'data-garden-id': COMPONENT_ID,
13
- 'data-garden-version': '9.0.0-next.24'
13
+ 'data-garden-version': '9.0.0-next.26'
14
14
  }).withConfig({
15
15
  displayName: "StyledFooterItem",
16
16
  componentId: "sc-1mb76hl-0"
17
17
  })(["display:flex;margin-", ":", "px;min-width:0;&:first-child{margin-", ":0;}", ";"], props => props.theme.rtl ? 'right' : 'left', props => props.theme.space.base * 5, props => props.theme.rtl ? 'right' : 'left', props => retrieveComponentStyles(COMPONENT_ID, props));
18
- StyledFooterItem.defaultProps = {
19
- theme: DEFAULT_THEME
20
- };
21
18
 
22
19
  export { StyledFooterItem };
@@ -5,7 +5,7 @@
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
7
  import styled, { css } from 'styled-components';
8
- import { getLineHeight, retrieveComponentStyles, DEFAULT_THEME, getColor } from '@zendeskgarden/react-theming';
8
+ import { getLineHeight, retrieveComponentStyles, getColor } from '@zendeskgarden/react-theming';
9
9
  import { BASE_MULTIPLIERS } from './StyledClose.js';
10
10
 
11
11
  const COMPONENT_ID = 'modals.header';
@@ -26,13 +26,10 @@ const colorStyles = _ref => {
26
26
  };
27
27
  const StyledHeader = styled.div.attrs({
28
28
  'data-garden-id': COMPONENT_ID,
29
- 'data-garden-version': '9.0.0-next.24'
29
+ 'data-garden-version': '9.0.0-next.26'
30
30
  }).withConfig({
31
31
  displayName: "StyledHeader",
32
32
  componentId: "sc-1787r9v-0"
33
33
  })(["display:block;position:", ";margin:0;border-bottom:", ";padding:", ";", " line-height:", ";font-size:", ";font-weight:", ";", ";", ";"], props => props.isDanger && 'relative', props => props.theme.borders.sm, props => `${props.theme.space.base * 5}px ${props.theme.space.base * 10}px`, props => props.isCloseButtonPresent && `padding-${props.theme.rtl ? 'left' : 'right'}: ${props.theme.space.base * (BASE_MULTIPLIERS.size + BASE_MULTIPLIERS.side + 2)}px;`, props => getLineHeight(props.theme.lineHeights.md, props.theme.fontSizes.md), props => props.theme.fontSizes.md, props => props.theme.fontWeights.semibold, colorStyles, props => retrieveComponentStyles(COMPONENT_ID, props));
34
- StyledHeader.defaultProps = {
35
- theme: DEFAULT_THEME
36
- };
37
34
 
38
35
  export { StyledHeader };
@@ -6,7 +6,7 @@
6
6
  */
7
7
  import PropTypes from 'prop-types';
8
8
  import styled, { keyframes, css } from 'styled-components';
9
- import { retrieveComponentStyles, DEFAULT_THEME, getColor, mediaQuery } from '@zendeskgarden/react-theming';
9
+ import { retrieveComponentStyles, getColor, mediaQuery } from '@zendeskgarden/react-theming';
10
10
 
11
11
  const COMPONENT_ID = 'modals.modal';
12
12
  const animationName = keyframes(["0%{transform:scale(0);opacity:0;}50%{transform:scale(1.05);}100%{opacity:1;}"]);
@@ -42,7 +42,7 @@ const sizeStyles = props => {
42
42
  };
43
43
  const StyledModal = styled.div.attrs({
44
44
  'data-garden-id': COMPONENT_ID,
45
- 'data-garden-version': '9.0.0-next.24'
45
+ 'data-garden-version': '9.0.0-next.26'
46
46
  }).withConfig({
47
47
  displayName: "StyledModal",
48
48
  componentId: "sc-1pe1axu-0"
@@ -51,8 +51,5 @@ StyledModal.propTypes = {
51
51
  isLarge: PropTypes.bool,
52
52
  isAnimated: PropTypes.bool
53
53
  };
54
- StyledModal.defaultProps = {
55
- theme: DEFAULT_THEME
56
- };
57
54
 
58
55
  export { StyledModal };
@@ -5,17 +5,26 @@
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
7
  import styled from 'styled-components';
8
- import { arrowStyles, getArrowPosition, retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
8
+ import { arrowStyles, getArrowPosition, retrieveComponentStyles } from '@zendeskgarden/react-theming';
9
+ import { StyledTooltipDialogClose } from './StyledTooltipDialogClose.js';
9
10
 
10
11
  const COMPONENT_ID = 'modals.tooltip_dialog';
12
+ const sizeStyles = props => `
13
+ padding: ${props.theme.space.base * 5}px;
14
+ width: 400px;
15
+
16
+ &:has(${StyledTooltipDialogClose}) > :first-child {
17
+ padding-${props.theme.rtl ? 'left' : 'right'}: ${props.theme.space.base * 8}px;
18
+ }
19
+ `;
11
20
  const StyledTooltipDialog = styled.div.attrs(props => ({
12
21
  'data-garden-id': COMPONENT_ID,
13
- 'data-garden-version': '9.0.0-next.24',
22
+ 'data-garden-version': '9.0.0-next.26',
14
23
  className: props.isAnimated && 'is-animated'
15
24
  })).withConfig({
16
25
  displayName: "StyledTooltipDialog",
17
26
  componentId: "sc-iv3db-0"
18
- })(["padding:", "px;width:400px;", ";", ";"], props => props.theme.space.base * 5, props => {
27
+ })(["", ";", " ", ";"], props => {
19
28
  const computedArrowStyles = arrowStyles(getArrowPosition(props.theme, props.placement), {
20
29
  size: `${props.theme.space.base * 2}px`,
21
30
  inset: '1px',
@@ -25,9 +34,6 @@ const StyledTooltipDialog = styled.div.attrs(props => ({
25
34
  return props.hasArrow && props.transitionState === 'entered' && computedArrowStyles;
26
35
  }
27
36
  return props.hasArrow && computedArrowStyles;
28
- }, props => retrieveComponentStyles(COMPONENT_ID, props));
29
- StyledTooltipDialog.defaultProps = {
30
- theme: DEFAULT_THEME
31
- };
37
+ }, sizeStyles, props => retrieveComponentStyles(COMPONENT_ID, props));
32
38
 
33
39
  export { StyledTooltipDialog };
@@ -5,18 +5,15 @@
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
7
  import styled from 'styled-components';
8
- import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
8
+ import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
9
9
 
10
10
  const COMPONENT_ID = 'modals.tooltip_dialog.backdrop';
11
11
  const StyledTooltipDialogBackdrop = styled.div.attrs({
12
12
  'data-garden-id': COMPONENT_ID,
13
- 'data-garden-version': '9.0.0-next.24'
13
+ 'data-garden-version': '9.0.0-next.26'
14
14
  }).withConfig({
15
15
  displayName: "StyledTooltipDialogBackdrop",
16
16
  componentId: "sc-zrk625-0"
17
17
  })(["position:fixed;inset:0;z-index:400;overflow:hidden;-webkit-overflow-scrolling:touch;font-family:", ";direction:", ";&.garden-tooltip-modal-transition-exit-active{pointer-events:none;}&.garden-tooltip-modal-transition-exit-active div{transition:opacity 200ms;opacity:0;}", ";"], props => props.theme.fonts.system, props => props.theme.rtl && 'rtl', props => retrieveComponentStyles(COMPONENT_ID, props));
18
- StyledTooltipDialogBackdrop.defaultProps = {
19
- theme: DEFAULT_THEME
20
- };
21
18
 
22
19
  export { StyledTooltipDialogBackdrop };
@@ -5,12 +5,12 @@
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
7
  import styled from 'styled-components';
8
- import { getLineHeight, getColor, retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
8
+ import { getLineHeight, getColor, retrieveComponentStyles } from '@zendeskgarden/react-theming';
9
9
 
10
10
  const COMPONENT_ID = 'modals.tooltip_dialog.body';
11
11
  const StyledTooltipDialogBody = styled.div.attrs({
12
12
  'data-garden-id': COMPONENT_ID,
13
- 'data-garden-version': '9.0.0-next.24'
13
+ 'data-garden-version': '9.0.0-next.26'
14
14
  }).withConfig({
15
15
  displayName: "StyledTooltipDialogBody",
16
16
  componentId: "sc-132lcoq-0"
@@ -23,8 +23,5 @@ const StyledTooltipDialogBody = styled.div.attrs({
23
23
  theme
24
24
  });
25
25
  }, props => props.theme.fontSizes.md, props => retrieveComponentStyles(COMPONENT_ID, props));
26
- StyledTooltipDialogBody.defaultProps = {
27
- theme: DEFAULT_THEME
28
- };
29
26
 
30
27
  export { StyledTooltipDialogBody };
@@ -5,19 +5,16 @@
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
7
  import styled from 'styled-components';
8
- import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
8
+ import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
9
9
  import { StyledClose } from './StyledClose.js';
10
10
 
11
11
  const COMPONENT_ID = 'modals.tooltip_dialog.close';
12
12
  const StyledTooltipDialogClose = styled(StyledClose).attrs({
13
13
  'data-garden-id': COMPONENT_ID,
14
- 'data-garden-version': '9.0.0-next.24'
14
+ 'data-garden-version': '9.0.0-next.26'
15
15
  }).withConfig({
16
16
  displayName: "StyledTooltipDialogClose",
17
17
  componentId: "sc-18xlgfi-0"
18
18
  })(["top:", "px;", ":", ";", ";"], props => props.theme.space.base * 3.5, props => props.theme.rtl ? 'left' : 'right', props => `${props.theme.space.base * 3}px`, props => retrieveComponentStyles(COMPONENT_ID, props));
19
- StyledTooltipDialogClose.defaultProps = {
20
- theme: DEFAULT_THEME
21
- };
22
19
 
23
20
  export { StyledTooltipDialogClose };
@@ -5,18 +5,15 @@
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
7
  import styled from 'styled-components';
8
- import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
8
+ import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
9
9
 
10
10
  const COMPONENT_ID = 'modals.tooltip_dialog.footer';
11
11
  const StyledTooltipDialogFooter = styled.div.attrs({
12
12
  'data-garden-id': COMPONENT_ID,
13
- 'data-garden-version': '9.0.0-next.24'
13
+ 'data-garden-version': '9.0.0-next.26'
14
14
  }).withConfig({
15
15
  displayName: "StyledTooltipDialogFooter",
16
16
  componentId: "sc-kjomsm-0"
17
17
  })(["display:flex;flex-shrink:0;align-items:center;justify-content:flex-end;padding-top:", "px;", ";"], p => p.theme.space.base * 5, props => retrieveComponentStyles(COMPONENT_ID, props));
18
- StyledTooltipDialogFooter.defaultProps = {
19
- theme: DEFAULT_THEME
20
- };
21
18
 
22
19
  export { StyledTooltipDialogFooter };
@@ -5,19 +5,16 @@
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
7
  import styled from 'styled-components';
8
- import { retrieveComponentStyles, DEFAULT_THEME } from '@zendeskgarden/react-theming';
8
+ import { retrieveComponentStyles } from '@zendeskgarden/react-theming';
9
9
  import { StyledFooterItem } from './StyledFooterItem.js';
10
10
 
11
11
  const COMPONENT_ID = 'modals.tooltip_dialog.footer_item';
12
12
  const StyledTooltipDialogFooterItem = styled(StyledFooterItem).attrs({
13
13
  'data-garden-id': COMPONENT_ID,
14
- 'data-garden-version': '9.0.0-next.24'
14
+ 'data-garden-version': '9.0.0-next.26'
15
15
  }).withConfig({
16
16
  displayName: "StyledTooltipDialogFooterItem",
17
17
  componentId: "sc-u2rmo8-0"
18
18
  })(["", ";"], props => retrieveComponentStyles(COMPONENT_ID, props));
19
- StyledTooltipDialogFooterItem.defaultProps = {
20
- theme: DEFAULT_THEME
21
- };
22
19
 
23
20
  export { StyledTooltipDialogFooterItem };
@@ -5,18 +5,17 @@
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
7
  import styled from 'styled-components';
8
- import { getColor, retrieveComponentStyles, DEFAULT_THEME, getLineHeight } from '@zendeskgarden/react-theming';
8
+ import { getColor, retrieveComponentStyles, getLineHeight } from '@zendeskgarden/react-theming';
9
9
 
10
10
  const COMPONENT_ID = 'modals.tooltip_dialog.title';
11
11
  const sizeStyles = props => `
12
12
  /* stylelint-disable-next-line property-no-unknown */
13
- padding-${props.theme.rtl ? 'left' : 'right'}: ${props.theme.space.base * 8}px;
14
13
  line-height: ${getLineHeight(props.theme.lineHeights.md, props.theme.fontSizes.md)};
15
14
  font-size: ${props.theme.fontSizes.md};
16
15
  `;
17
16
  const StyledTooltipDialogTitle = styled.div.attrs({
18
17
  'data-garden-id': COMPONENT_ID,
19
- 'data-garden-version': '9.0.0-next.24'
18
+ 'data-garden-version': '9.0.0-next.26'
20
19
  }).withConfig({
21
20
  displayName: "StyledTooltipDialogTitle",
22
21
  componentId: "sc-1rceixg-0"
@@ -29,8 +28,5 @@ const StyledTooltipDialogTitle = styled.div.attrs({
29
28
  theme
30
29
  });
31
30
  }, props => props.theme.fontWeights.semibold, props => sizeStyles(props), props => retrieveComponentStyles(COMPONENT_ID, props));
32
- StyledTooltipDialogTitle.defaultProps = {
33
- theme: DEFAULT_THEME
34
- };
35
31
 
36
32
  export { StyledTooltipDialogTitle };
@@ -5,7 +5,7 @@
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
7
  import styled from 'styled-components';
8
- import { menuStyles, getMenuPosition, DEFAULT_THEME } from '@zendeskgarden/react-theming';
8
+ import { menuStyles, getMenuPosition } from '@zendeskgarden/react-theming';
9
9
 
10
10
  const StyledTooltipWrapper = styled.div.attrs(props => ({
11
11
  className: props.isAnimated && 'is-animated'
@@ -18,8 +18,5 @@ const StyledTooltipWrapper = styled.div.attrs(props => ({
18
18
  zIndex: props.zIndex,
19
19
  animationModifier: '.is-animated'
20
20
  }));
21
- StyledTooltipWrapper.defaultProps = {
22
- theme: DEFAULT_THEME
23
- };
24
21
 
25
22
  export { StyledTooltipWrapper };
package/dist/index.cjs.js CHANGED
@@ -64,7 +64,7 @@ const animationStyles$1 = props => {
64
64
  };
65
65
  const StyledBackdrop = styled__default.default.div.attrs({
66
66
  'data-garden-id': COMPONENT_ID$j,
67
- 'data-garden-version': '9.0.0-next.24'
67
+ 'data-garden-version': '9.0.0-next.26'
68
68
  }).withConfig({
69
69
  displayName: "StyledBackdrop",
70
70
  componentId: "sc-mzdjpo-0"
@@ -84,9 +84,6 @@ const StyledBackdrop = styled__default.default.div.attrs({
84
84
  }
85
85
  });
86
86
  }, props => props.theme.fonts.system, props => props.theme.rtl && 'rtl', animationStyles$1, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$j, props));
87
- StyledBackdrop.defaultProps = {
88
- theme: reactTheming.DEFAULT_THEME
89
- };
90
87
  StyledBackdrop.propTypes = {
91
88
  isCentered: PropTypes__default.default.bool,
92
89
  isAnimated: PropTypes__default.default.bool
@@ -95,7 +92,7 @@ StyledBackdrop.propTypes = {
95
92
  const COMPONENT_ID$i = 'modals.body';
96
93
  const StyledBody = styled__default.default.div.attrs({
97
94
  'data-garden-id': COMPONENT_ID$i,
98
- 'data-garden-version': '9.0.0-next.24'
95
+ 'data-garden-version': '9.0.0-next.26'
99
96
  }).withConfig({
100
97
  displayName: "StyledBody",
101
98
  componentId: "sc-14rzecg-0"
@@ -108,9 +105,6 @@ const StyledBody = styled__default.default.div.attrs({
108
105
  variable: 'foreground.default'
109
106
  });
110
107
  }, props => props.theme.fontSizes.md, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$i, props));
111
- StyledBody.defaultProps = {
112
- theme: reactTheming.DEFAULT_THEME
113
- };
114
108
 
115
109
  const COMPONENT_ID$h = 'modals.close';
116
110
  const BASE_MULTIPLIERS$1 = {
@@ -120,19 +114,16 @@ const BASE_MULTIPLIERS$1 = {
120
114
  };
121
115
  const StyledClose = styled__default.default(reactButtons.IconButton).attrs({
122
116
  'data-garden-id': COMPONENT_ID$h,
123
- 'data-garden-version': '9.0.0-next.24'
117
+ 'data-garden-version': '9.0.0-next.26'
124
118
  }).withConfig({
125
119
  displayName: "StyledClose",
126
120
  componentId: "sc-iseudj-0"
127
121
  })(["position:absolute;top:", "px;", ":", ";", ";"], props => props.theme.space.base * BASE_MULTIPLIERS$1.top, props => props.theme.rtl ? 'left' : 'right', props => `${props.theme.space.base * BASE_MULTIPLIERS$1.side}px`, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$h, props));
128
- StyledClose.defaultProps = {
129
- theme: reactTheming.DEFAULT_THEME
130
- };
131
122
 
132
123
  const COMPONENT_ID$g = 'modals.footer';
133
124
  const StyledFooter = styled__default.default.div.attrs({
134
125
  'data-garden-id': COMPONENT_ID$g,
135
- 'data-garden-version': '9.0.0-next.24'
126
+ 'data-garden-version': '9.0.0-next.26'
136
127
  }).withConfig({
137
128
  displayName: "StyledFooter",
138
129
  componentId: "sc-d8pfdu-0"
@@ -140,21 +131,15 @@ const StyledFooter = styled__default.default.div.attrs({
140
131
  theme: props.theme,
141
132
  variable: 'border.default'
142
133
  })}`, props => props.isLarge ? `${props.theme.space.base * 8}px ${props.theme.space.base * 10}px` : `${props.theme.space.base * 5}px ${props.theme.space.base * 10}px ${props.theme.space.base * 8}px`, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$g, props));
143
- StyledFooter.defaultProps = {
144
- theme: reactTheming.DEFAULT_THEME
145
- };
146
134
 
147
135
  const COMPONENT_ID$f = 'modals.footer_item';
148
136
  const StyledFooterItem = styled__default.default.span.attrs({
149
137
  'data-garden-id': COMPONENT_ID$f,
150
- 'data-garden-version': '9.0.0-next.24'
138
+ 'data-garden-version': '9.0.0-next.26'
151
139
  }).withConfig({
152
140
  displayName: "StyledFooterItem",
153
141
  componentId: "sc-1mb76hl-0"
154
142
  })(["display:flex;margin-", ":", "px;min-width:0;&:first-child{margin-", ":0;}", ";"], props => props.theme.rtl ? 'right' : 'left', props => props.theme.space.base * 5, props => props.theme.rtl ? 'right' : 'left', props => reactTheming.retrieveComponentStyles(COMPONENT_ID$f, props));
155
- StyledFooterItem.defaultProps = {
156
- theme: reactTheming.DEFAULT_THEME
157
- };
158
143
 
159
144
  const COMPONENT_ID$e = 'modals.header';
160
145
  const colorStyles$2 = _ref => {
@@ -174,14 +159,11 @@ const colorStyles$2 = _ref => {
174
159
  };
175
160
  const StyledHeader = styled__default.default.div.attrs({
176
161
  'data-garden-id': COMPONENT_ID$e,
177
- 'data-garden-version': '9.0.0-next.24'
162
+ 'data-garden-version': '9.0.0-next.26'
178
163
  }).withConfig({
179
164
  displayName: "StyledHeader",
180
165
  componentId: "sc-1787r9v-0"
181
166
  })(["display:block;position:", ";margin:0;border-bottom:", ";padding:", ";", " line-height:", ";font-size:", ";font-weight:", ";", ";", ";"], props => props.isDanger && 'relative', props => props.theme.borders.sm, props => `${props.theme.space.base * 5}px ${props.theme.space.base * 10}px`, props => props.isCloseButtonPresent && `padding-${props.theme.rtl ? 'left' : 'right'}: ${props.theme.space.base * (BASE_MULTIPLIERS$1.size + BASE_MULTIPLIERS$1.side + 2)}px;`, props => reactTheming.getLineHeight(props.theme.lineHeights.md, props.theme.fontSizes.md), props => props.theme.fontSizes.md, props => props.theme.fontWeights.semibold, colorStyles$2, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$e, props));
182
- StyledHeader.defaultProps = {
183
- theme: reactTheming.DEFAULT_THEME
184
- };
185
167
 
186
168
  var _g, _circle;
187
169
  function _extends$1() { return _extends$1 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$1.apply(null, arguments); }
@@ -215,9 +197,6 @@ const StyledDangerIcon = styled__default.default(SvgAlertErrorStroke).withConfig
215
197
  displayName: "StyledDangerIcon",
216
198
  componentId: "sc-1kwbb39-0"
217
199
  })(["position:absolute;top:", "px;", ":", ";"], props => props.theme.space.base * 5.5, props => props.theme.rtl ? 'right' : 'left', props => `${props.theme.space.base * 4}px`);
218
- StyledDangerIcon.defaultProps = {
219
- theme: reactTheming.DEFAULT_THEME
220
- };
221
200
 
222
201
  const COMPONENT_ID$d = 'modals.modal';
223
202
  const animationName = styled.keyframes(["0%{transform:scale(0);opacity:0;}50%{transform:scale(1.05);}100%{opacity:1;}"]);
@@ -248,35 +227,29 @@ const colorStyles$1 = _ref => {
248
227
  });
249
228
  return styled.css(["border-color:", ";box-shadow:", ";background-color:", ";"], borderColor, shadow, backgroundColor);
250
229
  };
251
- const sizeStyles$1 = props => {
230
+ const sizeStyles$2 = props => {
252
231
  return styled.css(["", "{width:", ";}"], reactTheming.mediaQuery('up', props.isLarge ? 'md' : 'sm', props.theme), props.isLarge ? props.theme.breakpoints.md : props.theme.breakpoints.sm);
253
232
  };
254
233
  const StyledModal = styled__default.default.div.attrs({
255
234
  'data-garden-id': COMPONENT_ID$d,
256
- 'data-garden-version': '9.0.0-next.24'
235
+ 'data-garden-version': '9.0.0-next.26'
257
236
  }).withConfig({
258
237
  displayName: "StyledModal",
259
238
  componentId: "sc-1pe1axu-0"
260
- })(["display:flex;position:fixed;flex-direction:column;animation-delay:0.01s;margin:", ";border:", ";border-radius:", ";min-height:60px;max-height:calc(100vh - ", "px);overflow:auto;direction:", ";", ";", ";", ";&:focus{outline:none;}@media (max-height:399px){top:", "px;bottom:auto;margin-bottom:", "px;max-height:none;}@media screen and (-ms-high-contrast:active),screen and (-ms-high-contrast:none){right:", ";bottom:", ";transform:", ";}", ";"], props => props.isCentered ? '0' : `${props.theme.space.base * 12}px`, props => props.theme.borders.sm, props => props.theme.borderRadii.md, props => props.theme.space.base * 24, props => props.theme.rtl && 'rtl', animationStyles, sizeStyles$1, colorStyles$1, props => props.theme.space.base * 6, props => props.theme.space.base * 6, props => props.isCentered && '50%', props => props.isCentered && '50%', props => props.isCentered && 'translate(50%, 50%)', props => reactTheming.retrieveComponentStyles(COMPONENT_ID$d, props));
239
+ })(["display:flex;position:fixed;flex-direction:column;animation-delay:0.01s;margin:", ";border:", ";border-radius:", ";min-height:60px;max-height:calc(100vh - ", "px);overflow:auto;direction:", ";", ";", ";", ";&:focus{outline:none;}@media (max-height:399px){top:", "px;bottom:auto;margin-bottom:", "px;max-height:none;}@media screen and (-ms-high-contrast:active),screen and (-ms-high-contrast:none){right:", ";bottom:", ";transform:", ";}", ";"], props => props.isCentered ? '0' : `${props.theme.space.base * 12}px`, props => props.theme.borders.sm, props => props.theme.borderRadii.md, props => props.theme.space.base * 24, props => props.theme.rtl && 'rtl', animationStyles, sizeStyles$2, colorStyles$1, props => props.theme.space.base * 6, props => props.theme.space.base * 6, props => props.isCentered && '50%', props => props.isCentered && '50%', props => props.isCentered && 'translate(50%, 50%)', props => reactTheming.retrieveComponentStyles(COMPONENT_ID$d, props));
261
240
  StyledModal.propTypes = {
262
241
  isLarge: PropTypes__default.default.bool,
263
242
  isAnimated: PropTypes__default.default.bool
264
243
  };
265
- StyledModal.defaultProps = {
266
- theme: reactTheming.DEFAULT_THEME
267
- };
268
244
 
269
245
  const COMPONENT_ID$c = 'modals.tooltip_dialog.backdrop';
270
246
  const StyledTooltipDialogBackdrop = styled__default.default.div.attrs({
271
247
  'data-garden-id': COMPONENT_ID$c,
272
- 'data-garden-version': '9.0.0-next.24'
248
+ 'data-garden-version': '9.0.0-next.26'
273
249
  }).withConfig({
274
250
  displayName: "StyledTooltipDialogBackdrop",
275
251
  componentId: "sc-zrk625-0"
276
252
  })(["position:fixed;inset:0;z-index:400;overflow:hidden;-webkit-overflow-scrolling:touch;font-family:", ";direction:", ";&.garden-tooltip-modal-transition-exit-active{pointer-events:none;}&.garden-tooltip-modal-transition-exit-active div{transition:opacity 200ms;opacity:0;}", ";"], props => props.theme.fonts.system, props => props.theme.rtl && 'rtl', props => reactTheming.retrieveComponentStyles(COMPONENT_ID$c, props));
277
- StyledTooltipDialogBackdrop.defaultProps = {
278
- theme: reactTheming.DEFAULT_THEME
279
- };
280
253
 
281
254
  const StyledTooltipWrapper = styled__default.default.div.attrs(props => ({
282
255
  className: props.isAnimated && 'is-animated'
@@ -289,19 +262,33 @@ const StyledTooltipWrapper = styled__default.default.div.attrs(props => ({
289
262
  zIndex: props.zIndex,
290
263
  animationModifier: '.is-animated'
291
264
  }));
292
- StyledTooltipWrapper.defaultProps = {
293
- theme: reactTheming.DEFAULT_THEME
294
- };
295
265
 
296
- const COMPONENT_ID$b = 'modals.tooltip_dialog';
297
- const StyledTooltipDialog = styled__default.default.div.attrs(props => ({
266
+ const COMPONENT_ID$b = 'modals.tooltip_dialog.close';
267
+ const StyledTooltipDialogClose = styled__default.default(StyledClose).attrs({
298
268
  'data-garden-id': COMPONENT_ID$b,
299
- 'data-garden-version': '9.0.0-next.24',
269
+ 'data-garden-version': '9.0.0-next.26'
270
+ }).withConfig({
271
+ displayName: "StyledTooltipDialogClose",
272
+ componentId: "sc-18xlgfi-0"
273
+ })(["top:", "px;", ":", ";", ";"], props => props.theme.space.base * 3.5, props => props.theme.rtl ? 'left' : 'right', props => `${props.theme.space.base * 3}px`, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$b, props));
274
+
275
+ const COMPONENT_ID$a = 'modals.tooltip_dialog';
276
+ const sizeStyles$1 = props => `
277
+ padding: ${props.theme.space.base * 5}px;
278
+ width: 400px;
279
+
280
+ &:has(${StyledTooltipDialogClose}) > :first-child {
281
+ padding-${props.theme.rtl ? 'left' : 'right'}: ${props.theme.space.base * 8}px;
282
+ }
283
+ `;
284
+ const StyledTooltipDialog = styled__default.default.div.attrs(props => ({
285
+ 'data-garden-id': COMPONENT_ID$a,
286
+ 'data-garden-version': '9.0.0-next.26',
300
287
  className: props.isAnimated && 'is-animated'
301
288
  })).withConfig({
302
289
  displayName: "StyledTooltipDialog",
303
290
  componentId: "sc-iv3db-0"
304
- })(["padding:", "px;width:400px;", ";", ";"], props => props.theme.space.base * 5, props => {
291
+ })(["", ";", " ", ";"], props => {
305
292
  const computedArrowStyles = reactTheming.arrowStyles(reactTheming.getArrowPosition(props.theme, props.placement), {
306
293
  size: `${props.theme.space.base * 2}px`,
307
294
  inset: '1px',
@@ -311,21 +298,17 @@ const StyledTooltipDialog = styled__default.default.div.attrs(props => ({
311
298
  return props.hasArrow && props.transitionState === 'entered' && computedArrowStyles;
312
299
  }
313
300
  return props.hasArrow && computedArrowStyles;
314
- }, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$b, props));
315
- StyledTooltipDialog.defaultProps = {
316
- theme: reactTheming.DEFAULT_THEME
317
- };
301
+ }, sizeStyles$1, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$a, props));
318
302
 
319
- const COMPONENT_ID$a = 'modals.tooltip_dialog.title';
303
+ const COMPONENT_ID$9 = 'modals.tooltip_dialog.title';
320
304
  const sizeStyles = props => `
321
305
  /* stylelint-disable-next-line property-no-unknown */
322
- padding-${props.theme.rtl ? 'left' : 'right'}: ${props.theme.space.base * 8}px;
323
306
  line-height: ${reactTheming.getLineHeight(props.theme.lineHeights.md, props.theme.fontSizes.md)};
324
307
  font-size: ${props.theme.fontSizes.md};
325
308
  `;
326
309
  const StyledTooltipDialogTitle = styled__default.default.div.attrs({
327
- 'data-garden-id': COMPONENT_ID$a,
328
- 'data-garden-version': '9.0.0-next.24'
310
+ 'data-garden-id': COMPONENT_ID$9,
311
+ 'data-garden-version': '9.0.0-next.26'
329
312
  }).withConfig({
330
313
  displayName: "StyledTooltipDialogTitle",
331
314
  componentId: "sc-1rceixg-0"
@@ -337,15 +320,12 @@ const StyledTooltipDialogTitle = styled__default.default.div.attrs({
337
320
  variable: 'foreground.default',
338
321
  theme
339
322
  });
340
- }, props => props.theme.fontWeights.semibold, props => sizeStyles(props), props => reactTheming.retrieveComponentStyles(COMPONENT_ID$a, props));
341
- StyledTooltipDialogTitle.defaultProps = {
342
- theme: reactTheming.DEFAULT_THEME
343
- };
323
+ }, props => props.theme.fontWeights.semibold, props => sizeStyles(props), props => reactTheming.retrieveComponentStyles(COMPONENT_ID$9, props));
344
324
 
345
- const COMPONENT_ID$9 = 'modals.tooltip_dialog.body';
325
+ const COMPONENT_ID$8 = 'modals.tooltip_dialog.body';
346
326
  const StyledTooltipDialogBody = styled__default.default.div.attrs({
347
- 'data-garden-id': COMPONENT_ID$9,
348
- 'data-garden-version': '9.0.0-next.24'
327
+ 'data-garden-id': COMPONENT_ID$8,
328
+ 'data-garden-version': '9.0.0-next.26'
349
329
  }).withConfig({
350
330
  displayName: "StyledTooltipDialogBody",
351
331
  componentId: "sc-132lcoq-0"
@@ -357,46 +337,25 @@ const StyledTooltipDialogBody = styled__default.default.div.attrs({
357
337
  variable: 'foreground.default',
358
338
  theme
359
339
  });
360
- }, props => props.theme.fontSizes.md, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$9, props));
361
- StyledTooltipDialogBody.defaultProps = {
362
- theme: reactTheming.DEFAULT_THEME
363
- };
340
+ }, props => props.theme.fontSizes.md, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$8, props));
364
341
 
365
- const COMPONENT_ID$8 = 'modals.tooltip_dialog.footer';
342
+ const COMPONENT_ID$7 = 'modals.tooltip_dialog.footer';
366
343
  const StyledTooltipDialogFooter = styled__default.default.div.attrs({
367
- 'data-garden-id': COMPONENT_ID$8,
368
- 'data-garden-version': '9.0.0-next.24'
344
+ 'data-garden-id': COMPONENT_ID$7,
345
+ 'data-garden-version': '9.0.0-next.26'
369
346
  }).withConfig({
370
347
  displayName: "StyledTooltipDialogFooter",
371
348
  componentId: "sc-kjomsm-0"
372
- })(["display:flex;flex-shrink:0;align-items:center;justify-content:flex-end;padding-top:", "px;", ";"], p => p.theme.space.base * 5, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$8, props));
373
- StyledTooltipDialogFooter.defaultProps = {
374
- theme: reactTheming.DEFAULT_THEME
375
- };
349
+ })(["display:flex;flex-shrink:0;align-items:center;justify-content:flex-end;padding-top:", "px;", ";"], p => p.theme.space.base * 5, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$7, props));
376
350
 
377
- const COMPONENT_ID$7 = 'modals.tooltip_dialog.footer_item';
351
+ const COMPONENT_ID$6 = 'modals.tooltip_dialog.footer_item';
378
352
  const StyledTooltipDialogFooterItem = styled__default.default(StyledFooterItem).attrs({
379
- 'data-garden-id': COMPONENT_ID$7,
380
- 'data-garden-version': '9.0.0-next.24'
353
+ 'data-garden-id': COMPONENT_ID$6,
354
+ 'data-garden-version': '9.0.0-next.26'
381
355
  }).withConfig({
382
356
  displayName: "StyledTooltipDialogFooterItem",
383
357
  componentId: "sc-u2rmo8-0"
384
- })(["", ";"], props => reactTheming.retrieveComponentStyles(COMPONENT_ID$7, props));
385
- StyledTooltipDialogFooterItem.defaultProps = {
386
- theme: reactTheming.DEFAULT_THEME
387
- };
388
-
389
- const COMPONENT_ID$6 = 'modals.tooltip_dialog.close';
390
- const StyledTooltipDialogClose = styled__default.default(StyledClose).attrs({
391
- 'data-garden-id': COMPONENT_ID$6,
392
- 'data-garden-version': '9.0.0-next.24'
393
- }).withConfig({
394
- displayName: "StyledTooltipDialogClose",
395
- componentId: "sc-18xlgfi-0"
396
- })(["top:", "px;", ":", ";", ";"], props => props.theme.space.base * 3.5, props => props.theme.rtl ? 'left' : 'right', props => `${props.theme.space.base * 3}px`, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$6, props));
397
- StyledTooltipDialogClose.defaultProps = {
398
- theme: reactTheming.DEFAULT_THEME
399
- };
358
+ })(["", ";"], props => reactTheming.retrieveComponentStyles(COMPONENT_ID$6, props));
400
359
 
401
360
  const COMPONENT_ID$5 = 'modals.drawer_modal';
402
361
  const DRAWER_WIDTH = 380;
@@ -423,14 +382,11 @@ const colorStyles = _ref => {
423
382
  };
424
383
  const StyledDrawer = styled__default.default.div.attrs({
425
384
  'data-garden-id': COMPONENT_ID$5,
426
- 'data-garden-version': '9.0.0-next.24'
385
+ 'data-garden-version': '9.0.0-next.26'
427
386
  }).withConfig({
428
387
  displayName: "StyledDrawer",
429
388
  componentId: "sc-zp66t3-0"
430
389
  })(["display:flex;position:fixed;top:0;", ":0;flex-direction:column;z-index:500;", ":", ";width:", "px;height:100%;overflow:auto;-webkit-overflow-scrolling:touch;font-family:", ";direction:", ";&.garden-drawer-transition-enter{transform:translateX(", "px);}&.garden-drawer-transition-enter-active{transform:translateX(0);transition:transform 0.25s ease-in-out;}&.garden-drawer-transition-exit-active{transform:translateX(", "px);transition:transform 0.25s ease-in-out;}&:focus{outline:none;}", " ", ";"], props => props.theme.rtl ? 'left' : 'right', props => props.theme.rtl ? 'border-right' : 'border-left', props => props.theme.borders.sm, DRAWER_WIDTH, props => props.theme.fonts.system, props => props.theme.rtl && 'rtl', props => props.theme.rtl ? -DRAWER_WIDTH : DRAWER_WIDTH, props => props.theme.rtl ? -DRAWER_WIDTH : DRAWER_WIDTH, colorStyles, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$5, props));
431
- StyledDrawer.defaultProps = {
432
- theme: reactTheming.DEFAULT_THEME
433
- };
434
390
 
435
391
  const COMPONENT_ID$4 = 'modals.drawer_modal.close';
436
392
  const BASE_MULTIPLIERS = {
@@ -440,43 +396,34 @@ const BASE_MULTIPLIERS = {
440
396
  };
441
397
  const StyledDrawerClose = styled__default.default(StyledClose).attrs({
442
398
  'data-garden-id': COMPONENT_ID$4,
443
- 'data-garden-version': '9.0.0-next.24'
399
+ 'data-garden-version': '9.0.0-next.26'
444
400
  }).withConfig({
445
401
  displayName: "StyledDrawerClose",
446
402
  componentId: "sc-1a0xt3x-0"
447
403
  })(["", ":", ";", ";"], props => props.theme.rtl ? 'left' : 'right', props => `${props.theme.space.base * BASE_MULTIPLIERS.side}px`, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$4, props));
448
- StyledDrawerClose.defaultProps = {
449
- theme: reactTheming.DEFAULT_THEME
450
- };
451
404
 
452
405
  const COMPONENT_ID$3 = 'modals.drawer_modal.header';
453
406
  const StyledDrawerHeader = styled__default.default(StyledHeader).attrs({
454
407
  'data-garden-id': COMPONENT_ID$3,
455
- 'data-garden-version': '9.0.0-next.24'
408
+ 'data-garden-version': '9.0.0-next.26'
456
409
  }).withConfig({
457
410
  displayName: "StyledDrawerHeader",
458
411
  componentId: "sc-y4mgkj-0"
459
412
  })(["padding:", "px;", " ", ";"], props => props.theme.space.base * 5, props => props.isCloseButtonPresent && `padding-${props.theme.rtl ? 'left' : 'right'}: ${props.theme.space.base * (BASE_MULTIPLIERS.size + BASE_MULTIPLIERS.side + 2)}px;`, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$3, props));
460
- StyledDrawerHeader.defaultProps = {
461
- theme: reactTheming.DEFAULT_THEME
462
- };
463
413
 
464
414
  const COMPONENT_ID$2 = 'modals.drawer_modal.body';
465
415
  const StyledDrawerBody = styled__default.default(StyledBody).attrs({
466
416
  'data-garden-id': COMPONENT_ID$2,
467
- 'data-garden-version': '9.0.0-next.24'
417
+ 'data-garden-version': '9.0.0-next.26'
468
418
  }).withConfig({
469
419
  displayName: "StyledDrawerBody",
470
420
  componentId: "sc-13qufyn-0"
471
421
  })(["padding:", "px;color-scheme:only ", ";", ";"], props => props.theme.space.base * 5, p => p.theme.colors.base, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$2, props));
472
- StyledDrawerBody.defaultProps = {
473
- theme: reactTheming.DEFAULT_THEME
474
- };
475
422
 
476
423
  const COMPONENT_ID$1 = 'modals.drawer_modal.footer';
477
424
  const StyledDrawerFooter = styled__default.default.div.attrs({
478
425
  'data-garden-id': COMPONENT_ID$1,
479
- 'data-garden-version': '9.0.0-next.24'
426
+ 'data-garden-version': '9.0.0-next.26'
480
427
  }).withConfig({
481
428
  displayName: "StyledDrawerFooter",
482
429
  componentId: "sc-kc7e6p-0"
@@ -489,21 +436,15 @@ const StyledDrawerFooter = styled__default.default.div.attrs({
489
436
  variable: 'border.subtle'
490
437
  })}`;
491
438
  }, props => props.theme.space.base * 5, props => reactTheming.retrieveComponentStyles(COMPONENT_ID$1, props));
492
- StyledDrawerFooter.defaultProps = {
493
- theme: reactTheming.DEFAULT_THEME
494
- };
495
439
 
496
440
  const COMPONENT_ID = 'modals.drawer_modal.footer_item';
497
441
  const StyledDrawerFooterItem = styled__default.default(StyledFooterItem).attrs({
498
442
  'data-garden-id': COMPONENT_ID,
499
- 'data-garden-version': '9.0.0-next.24'
443
+ 'data-garden-version': '9.0.0-next.26'
500
444
  }).withConfig({
501
445
  displayName: "StyledDrawerFooterItem",
502
446
  componentId: "sc-m2yul4-0"
503
447
  })(["", ";"], props => reactTheming.retrieveComponentStyles(COMPONENT_ID, props));
504
- StyledDrawerFooterItem.defaultProps = {
505
- theme: reactTheming.DEFAULT_THEME
506
- };
507
448
 
508
449
  const ModalsContext = React.createContext(undefined);
509
450
  const useModalContext = () => {
@@ -4,6 +4,7 @@
4
4
  * Use of this source code is governed under the Apache License, Version 2.0
5
5
  * found at http://www.apache.org/licenses/LICENSE-2.0.
6
6
  */
7
+ import { DefaultTheme } from 'styled-components';
7
8
  import { Placement } from '@floating-ui/react-dom';
8
9
  import { TransitionStatus } from 'react-transition-group';
9
10
  import { ITooltipDialogProps } from '../types';
@@ -11,4 +12,4 @@ export interface IStyledTooltipDialogProps extends Pick<ITooltipDialogProps, 'ha
11
12
  placement: Placement;
12
13
  transitionState?: TransitionStatus;
13
14
  }
14
- export declare const StyledTooltipDialog: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, IStyledTooltipDialogProps, never>;
15
+ export declare const StyledTooltipDialog: import("styled-components").StyledComponent<"div", DefaultTheme, IStyledTooltipDialogProps, never>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zendeskgarden/react-modals",
3
- "version": "9.0.0-next.24",
3
+ "version": "9.0.0-next.26",
4
4
  "description": "Components relating to modals in the Garden Design System",
5
5
  "license": "Apache-2.0",
6
6
  "author": "Zendesk Garden <garden@zendesk.com>",
@@ -24,7 +24,7 @@
24
24
  "@floating-ui/react-dom": "^2.0.0",
25
25
  "@zendeskgarden/container-modal": "^1.0.15",
26
26
  "@zendeskgarden/container-utilities": "^2.0.0",
27
- "@zendeskgarden/react-buttons": "^9.0.0-next.24",
27
+ "@zendeskgarden/react-buttons": "^9.0.0-next.26",
28
28
  "dom-helpers": "^5.1.0",
29
29
  "prop-types": "^15.5.7",
30
30
  "react-merge-refs": "^2.0.0",
@@ -38,7 +38,7 @@
38
38
  },
39
39
  "devDependencies": {
40
40
  "@types/react-transition-group": "4.4.11",
41
- "@zendeskgarden/react-theming": "^9.0.0-next.24",
41
+ "@zendeskgarden/react-theming": "^9.0.0-next.26",
42
42
  "@zendeskgarden/svg-icons": "7.2.0"
43
43
  },
44
44
  "keywords": [
@@ -51,5 +51,5 @@
51
51
  "access": "public"
52
52
  },
53
53
  "zendeskgarden:src": "src/index.ts",
54
- "gitHead": "36ac3913276188edf8d187a9861be7ba765e487a"
54
+ "gitHead": "049dd7bd143029147de333f78bd879dc7d7251f2"
55
55
  }